/*============================================
    
    CSS INDEX
    ===================
	
    1. Theme default CSS
	2. About Us
	3. Project Count Area
	4. Section Titel Css
	5. Trailer Area
	6. Service Area
	7. Our Gallery
	8. Testimonial Area
	9. Our Gallery
	10. Footer Area
	11. Home Two Css
	12. Home Three Css
	13. Home Four Css
	14. Breadcamp Area
	15. Contact Us Page
	16. About Us Page
	17. Service Page
	18. 404 Error
	19. ScrollUp
	
===========================================================*/

/* ============= 1. Theme default CSS ============= */
@import url('https://fonts.googleapis.com/css?family=Orbitron:400,500,700,900|Roboto:100,300,300i,400,500,700,900');

@font-face{
    font-family: Brandon b;
    src: url(fonts/brandon-grotesque-black.otf);
}

@font-face{
    font-family: Brandon b i;
    src: url(fonts/brandon-grotesque-bold-italic.otf);
}

@font-face{
    font-family: Brandon l i;
    src: url(fonts/brandon-grotesque-light-italic.otf);
}

@font-face{
    font-family: Brandon l;
    src: url(fonts/brandon-grotesque-light.otf);
}

@font-face{
    font-family: Brandon m i;
    src: url(fonts/brandon-grotesque-medium-italic.otf);
}

@font-face{
    font-family: Brandon t i;
    src: url(fonts/brandon-grotesque-thin-italic.otf);
}

@font-face{
    font-family: Brandon r i;
    src: url(fonts/brandon-grotesque-regular-italic.otf);
}

@font-face{
    font-family: Brandon m;
    src: url(fonts/brandon-grotesque-medium.otf);
}


/* ============= 2. About Us ============= */
.aboutus-video  {
  box-sizing: border-box;
  display: inline-block;
  height: 300px;
  overflow: hidden;
  width: 970px;
}
.popup-youtube {
  color: #fff;
  font-size: 60px;
  height: 70px;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  text-align: center;
  top: 38%;
  transition: all 0.3s ease 0s;
  width: 70px;
}
.aboutus-titel {margin-bottom: 45px;}
.aboutus-bottom-txt {margin-top: 30px;}
.person-area {
  display: inline-block;
  margin: 8px auto 0;
  text-align: center;
  width: 17%;
}
.person-img {float: left;}
.person-txt {
  display: block;
  margin-top: 12px;
  overflow: hidden;
}
.aboutus-bottom-txt > p {
  font-size: 16px;
  line-height: 30px;
  margin: auto auto 20px;
  width: 65%;
}
.person-txt h6 {
  font-weight: 500;
  margin: 0 0 5px;
}
.person-txt > span {
  color: #666666;
  font-size: 12px;
}

/* ============= 3. Project Count Area ============= */
.project-count span {
  color: #555555;
  display: inline-block;
  font-size: 30px;
  font-weight: 400;
  margin-bottom: 22px;
  padding-bottom: 20px;
  position: relative;
}
.project-count span::after {
  background: #555555 none repeat scroll 0 0;
  bottom: 0;
  content: "";
  height: 1px;
  left: -10px;
  position: absolute;
  width: 50px;
}

.project-count span.cien::after {
  background: #555555 none repeat scroll 0 0;
  bottom: 0;
  content: "";
  height: 1px;
  left: -10px;
  position: absolute;
  width: 75px;
}

.project-count span.tres-cinco::after {
  background: #555555 none repeat scroll 0 0;
  bottom: 0;
  content: "";
  height: 1px;
  left: -10px;
  position: absolute;
  width: 112px;
}

.project-count span.doce-cero::after {
  background: #555555 none repeat scroll 0 0;
  bottom: 0;
  content: "";
  height: 1px;
  left: -10px;
  position: absolute;
  width: 72px;
}




.project-count h3 {
  font-size: 22px;
  font-weight: 500;
  margin: 0;
}

/* ============= 4. Section Titel Css ============= */
.section-titel h2 {display: block;position: relative;}
.section-titel {margin-bottom: 45px;margin-right: 100px;}
.section-titel h2::after {
  border-bottom: 2px dashed #e2a750;
  bottom: 10px;
  content: "";
  height: 70px;
  position: absolute;
  right: -100px;
  width: 70px;
}
.section-titel p {font-size: 16px;}
.section-titel.two {margin-left: 100px;}
.section-titel.two h2::after {left: -102px;}
.section-titel.two h2,.section-titel.two p {color: #fff;}
.ourteam-area .section-titel.two h2,.ourteam-area .section-titel.two p {color: #555555;}

/* ============= 5. Trailer Area ============= */
.trailer-single {box-shadow: 0 1px 1px #ddd;margin-bottom: 2px;}
.trailer-titel h5 {
  background: #f6f6f6 none repeat scroll 0 0;
  font-weight: 500;
  margin: 0;
  padding: 20px;
  text-transform:uppercase;
}
.trailer-titel span {
  float: right;
  font-family: roboto;
  font-size: 14px;
  font-weight: normal;
}
.trailer-video  {
  box-sizing: border-box;
  display: inline-block;
  height: 100%;
  overflow: hidden;
  width: 100%;
}
.trailer-img .popup-youtube {
  color: #fff;
  font-size: 45px;
  height: 70px;
  left: 0;
  line-height: 70px;
  margin: 0 auto;
  position: absolute;
  right: 0;
  text-align: center;
  top: 41%;
  transition: all 0.3s ease 0s;
  width: 70px;
  z-index: 99;
  opacity:0;
  visibility:hidden;
}
.trailer-single:hover .trailer-img .popup-youtube{opacity:1;visibility:visible;}
.trailer-img {
  display: block;
  position: relative;
}
.trailer-img::after {
  background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  opacity:0;
  visibility:hidden;
  transition:.4s;
}
.trailer-single:hover .trailer-img::after{opacity:1;visibility:visible;}
/* Owl Indicator Active */
.indicator-style .owl-theme .owl-nav {
  margin-top: 0;
  position: absolute;
  top: 42%;
  width: 100%;
  opacity:0;
  transition:.4s;
}
.main-section:hover .owl-theme .owl-nav{opacity:1;}
.indicator-style .owl-theme .owl-nav [class*="owl-"] {
  background: transparent none repeat scroll 0 0;
  border-radius: 0;
  color: #555555;
  cursor: pointer;
  display: inline-block;
  font-size: 44px;
  margin: 0;
  padding: 0;
}
.indicator-style .owl-carousel .owl-nav .owl-prev {left: -50px;position: absolute;}
.indicator-style .owl-carousel .owl-nav .owl-next {right: -50px;position: absolute;}
.indicator-style .owl-theme .owl-nav [class*="owl-"]:hover,.service-area.indicator-style .owl-theme .owl-nav [class*="owl-"]:hover {
  background: transparent;
  color: #e2a750;
  text-decoration: none;
}

/* ============= 6. Service Area ============= */
.service-single {padding: 38px 25px 35px;transition:.4s;}
/*.service-single:hover {background: rgba(255, 255, 255, 0.1) none repeat scroll 0 0;}*/
.servce-icon i {color: #cccccc;font-size: 48px;}
.service-details h4 {
  /*color: #fff;
  font-weight: 700;*/
  margin: 20px 0 18px;
  text-transform:uppercase;
}
.service-details > p {color: #cccccc;margin: 0;}
.service-area.indicator-style .owl-theme .owl-nav [class*="owl-"] {color: #fff;}

/* ============= 7. Our Gallery ============= */
.grid-item {float: left;}
/* .grid-item { width: 50%; }
.grid-item--width2 { width: 25%; } */
.grid-item  {margin-bottom: 30px;}
.gallery-menu {margin-bottom: 30px;margin-right: 100px;}
ul.gallery-menu li {
  color: #555555;
  cursor: pointer;
  font-size: 16px;
  padding-left: 40px;
  text-transform: uppercase;
  transition:.3s;
}
ul.gallery-menu li.active,ul.gallery-menu li:hover{color:#0777bd;}
.gallery-image {
  display: block;
  position: relative;
  overflow:hidden;
}
.gallery-image::before {
  background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  bottom: -50%;
  width: 100%;
  opacity:0;
  transition:.4s;
  visibility:hidden;
}
.gallery-single:hover .gallery-image::before{opacity:1;bottom:0;visibility:visible;}
.popup-gallery,.gallery-image .popup-youtube {
  color: #fff;
  font-size: 36px;
  height: 70px;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  text-align: center;
  top: 25%;
  transition: all 0.3s ease 0s;
  width: 70px;
  line-height: 70px;
  opacity:0;
  visibility:hidden;
}
.popup-youtube:hover{color:#e2a750;}
.gallery-single:hover .popup-gallery,.gallery-single:hover .gallery-image .popup-youtube{opacity:1;top: 38%;visibility:visible;}
.gallery-image > img {width: 100%;}
.hvr-btn {
  background: #0777bd none repeat scroll 0 0;
  box-shadow: 0 0 1px transparent;
  color: #fff;
  display: inline-block;
  height: 33px;
  line-height: 30px;
  text-align: center;
  text-transform: uppercase;
  transform: perspective(1px) translateZ(0px);
  transform-origin: 0 100% 0;
  transition-duration: 0.3s;
  transition-property: transform;
  vertical-align: middle;
  width: 180px;
    font-size: 21px;
    padding: 3px 0;
    font-weight: 300;
}
.hvr-btn:hover {
  -webkit-transform: skew(-10deg);
  transform: skew(-10deg);
  background:#000;
  color:#fff;
}

/* ============= 8. Testimonial Area ============= */
.testi-img {margin-bottom: 22px;}
.testimonial-content > h6 {
  color: #666666;
  font-size: 14px;
  font-weight: 500;
  margin: 0 0 4px;
}
.testimonial-content > span {color: #666666;font-size: 12px;}
.testi-img {margin-bottom: 18px;}
.testi-img > img {display: inline-block !important;width: auto !important;}
.testimonial-content > p {padding: 0 200px;}

/* ============= 9. Our Team ============= */
.large-img {float: left;margin-right: 80px;}
.slick-slider {-moz-user-select: elements;}
.thumb-content {display: block;overflow: hidden;}
.teamper-titel > h5 {
  font-size: 20px;
  font-weight: 500;
  padding-bottom: 15px;
  position: relative;
}
.teamper-titel > h5::after {
  border-bottom: 1px dashed #e2a750;
  bottom: 0;
  content: "";
  height: 70px;
  position: absolute;
  right: 0;
  width: 70px;
}
.teamper-titel > span {color: #555555;}
.team-social {margin-bottom: 35px;margin-top: 22px;}
.team-social ul li a {
  border: 1px solid #555555;
  border-radius: 100px;
  display: block;
  font-size: 18px;
  height: 30px;
  line-height: 28px;
  margin-left: 8px;
  text-align: center;
  width: 30px;
  color:#555555;
  transition:.3s;
}
.team-social ul li a:hover{color:#fff;background:#555555;}
.slider.slider-nav.slick-initialized.slick-slider {width: 690px;}
.slick-arrow {
  bottom: 0;
  font-size: 30px;
  position: absolute;
  cursor:pointer;
  transition:.4s;
}
.slick-next.slick-arrow {
  bottom: -10px;
  left: 50%;
}
.slick-prev.slick-arrow {
  bottom: -10px;
  left: 50%;
  margin-left: -50px;
}
.slick-arrow::after {
  color: #555555;
  content: "/";
  font-size: 25px;
  left: -15px;
  position: absolute;
  top: 4px;
}
.slick-arrow:first-child::after {display: none;} 
.slick-arrow i{transition:.4s;}
.slick-arrow i:hover {color:#e2a750;}
.slider-nav {
  bottom: 38px;
  display: block;
  float: left;
  overflow: hidden;
  padding-bottom: 4%;
  position: absolute;
  right: -12px;
  z-index: 9;
}
.ourteam-area {display: block;position: relative;}
.thumb-content {margin-top: 30px;}

/* ============= 10. Footer Area ============= */
.footer-single > h5 {
  color: #ffffff;
  font-weight: 500;
  margin: 0 0 25px;
}
.stay-with-content > p {color: #fff;margin: 0 0 20px;}
.subcribe input {
  background: transparent none repeat scroll 0 0;
  border-color: currentcolor currentcolor #fff;
  border-style: none none solid;
  border-width: 0 0 1px;
  color: #fff;
  font-size: 14px;
  height: 45px;
  padding-left: 10px;
  width: 100%;
}
.subcribe button {
  background: #fff none repeat scroll 0 0;
  border: medium none;
  color: #555555;
  height: 30px;
  margin-top: 15px;
  text-transform: uppercase;
  width: 120px;
  transition:.3s;
}
.subcribe button:hover{background:#e2a750;color:#fff;}

/* Mail Chimp */
.mailchimp-submitting{color:#31708f}
.mailchimp-success{color:#3c763d;}
.mailchimp-error{color:#a94442;}

/* Footer Menu */
.footer-menu ul li {display: block;}
.footer-menu ul li a {
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 14px;
  font-weight: 400;
  overflow: hidden;
  padding-bottom: 15px;
  transition:.3s;
}
.footer-menu ul li a:hover {color: #e2a750;}
.footer-menu ul li:last-child a {padding-bottom: 0;}
.contact-info ul li p {color: #fff;margin: 0 0 13px;}
.contact-info ul li:last-child p{margin:0;}

/* Footer Bootom */ 
.footer-bottom {
  /*border-top: 1px solid #aaa;*/
  display: block;
  overflow: hidden;
  padding: 15px 0;
}
.footer-left {float: left;}
.footer-left > p,.footer-left > p a {
  color: #fff;
  margin: 0;
  transition:.4s;
}
.footer-left > p a:hover{color: #e2a750;}
.footer-right-social ul li a {
  border: 1px solid #fff;
  border-radius: 100px;
  color: #fff;
  display: block;
  font-size: 18px;
  height: 30px;
  line-height: 28px;
  margin-left: 8px;
  text-align: center;
  transition: all 0.3s ease 0s;
  width: 30px;
}
.footer-right-social ul li a:hover{color:#555555;background:#fff;}


/* ============= 11. Home Two Css ============= */
/* Header Area */
.home-two .main-menu nav ul li.active a,.home-two .main-menu nav ul li:hover a {color: #fe2d20;}
.home-two .main-menu ul li ul > li > a:hover {color: #fe2d20 !important;}
.home-two .trailer-titel h5 a:hover {color: #fe2d20;}
.home-two .slide-btn a {background: #fe2d20 none repeat scroll 0 0;}
.home-two .slide-content h2 span,.home-two .slide-content h1 span {color: #fe2d20;}
.home-two .slider-area .owl-theme .owl-dots .owl-dot.active span{background: rgba(0, 0, 0, 0) url("img/home-two/icon/dot-active.png") no-repeat scroll 0 0;}
.home-two .slider-area .owl-theme .owl-dots .owl-dot span {background: rgba(0, 0, 0, 0) url("img/home-two/icon/dot.png") no-repeat scroll 0 0;}
/* About Us */
.home-two .popup-youtube:hover {
  color: #aaa;
}
.home-two .hvr-btn {background: #fe2d20 none repeat scroll 0 0;}
.home-two .hvr-btn:hover {
  -webkit-transform: skew(-10deg);
  transform: skew(-10deg);
  background:#000;
  color:#fff;
}
/* Titel */
.home-two .section-titel h2::after {border-bottom: 2px dashed #fe2d20;}
.home-two .section-titel.three h2,.home-two .section-titel.three p {color: #fff;}
.home-two .section-titel.dark h2,.home-two .section-titel.dark p {color: #555555;}
/* Service Area */
.home-two .service-single:hover {background: rgba(254, 45, 32, 0.5) none repeat scroll 0 0;}
.home-two .indicator-style .owl-theme .owl-nav [class*="owl-"]:hover,.home-two .service-area.indicator-style .owl-theme .owl-nav [class*="owl-"]:hover {
  background: transparent none repeat scroll 0 0;
  color: #fe2d20;
  text-decoration: none;
}
/* Gallery */
.home-two .gallery-menu {margin-left: 115px;margin-right: 0;}
.home-two ul.gallery-menu li {padding-left: 0;padding-right: 40px;}
.home-two ul.gallery-menu li.active,.home-two ul.gallery-menu li:hover {color: #fe2d20;}
.home-two .gallery-image::before {background: rgba(254, 45, 32, 0.7) none repeat scroll 0 0;}
.home-two .popup-gallery:hover {color: #fff;}
.home-two .testimonial-content > p,.home-two .testimonial-content > h6,.home-two .testimonial-content span,.home-two .indicator-style .owl-theme .owl-nav [class*="owl-"]{
  color: #fff;
}
/* Team Area */
.home-two .large-img {
  float: right;
  margin-left: 80px;
  margin-right: 0;
}
.home-two .teamper-titel > h5::after {
  border-bottom: 1px dashed #fe2d20;
  left: 0;
  right: 0;
}
.home-two .slider.slider-nav.slick-initialized.slick-slider {
  width: 690px;
}
.home-two .slider-nav {
  bottom: 36px;
  display: block;
  float: left;
  left: 15px;
  overflow: hidden;
  position: absolute;
  right: 0;
  z-index: 9;
}
.home-two .slick-slider .slick-list,.home-two .slick-slider .slick-track {transform: translate3d(0px, 0px, 0px);}
.home-two .team-social ul li a {
  border: 1px solid #fe2d20;
  color: #fe2d20;
  margin-left: 0;
  margin-right: 8px;
}
.home-two .team-social ul li a:hover {background: #fe2d20 none repeat scroll 0 0;color: #fff;}
.home-two .slick-arrow i:hover,.home-two .footer-menu ul li a:hover {color:#fe2d20;}
.home-two .trailer-titel h5{font-size:14px;}
/* Footer Area */
.home-two .subcribe button {background: #fe2d20 none repeat scroll 0 0;color: #fff;}
.home-two .subcribe button:hover{background:#fff;color:#555;}
.home-two .footer-right-social ul li a {border: 1px solid #fe2d20;color: #fe2d20;}
.home-two .footer-right-social ul li a:hover {background:#fe2d20;color: #fff;}
.home-two .testi-img i {color: #696969;font-size: 80px;}
.home-two .trailer-img::after {
  background: rgba(254, 45, 32, 0.6) none repeat scroll 0 0;
}
/* ============= 12. Home Three Css ============= */
.home-three .project-count span,.home-three .project-count h3 {color: #fff;}
.home-three .project-count span::after {background: #0777bd none repeat scroll 0 0;}
.section-titel-img h2 {
  margin-bottom: 20px;
  padding-bottom: 20px;
  position: relative;
}
.section-titel-img h2::after {
  border-bottom: 1px solid #0777bd;
  content: "";
  height: 100%;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 135px;
}
/*.section-titel-img h2::before {
  background: #fff none repeat scroll 0 0;
  color: #e2a750;
  content: "";
  font-family: icofont;
  font-size: 20px;
  height: 22px;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  top: 42px;
  width: 25px;
  z-index: 99;
}*/
/*.section-titel-img.two h2,.section-titel-img.two p{color:#fff}*/
.section-titel-img.two h2::before {background: #262317 none repeat scroll 0 0;}
/*.home-three .service-single:hover{background: rgba(226, 167, 80, 0.4) none repeat scroll 0 0;}*/
.home-three .service-single {margin-bottom: 20px; margin-top: 15px;}
.home-three .gallery-menu {margin-bottom: 30px;margin-right: 0;}
.home-three .gallery-image::before {background: rgba(7, 119, 189, 0.8) none repeat scroll 0 0;}
.home-three .popup-gallery:hover {color: #fff;}
.home-three .testimonial-content > p,.home-three .testimonial-content > h6,.home-three .testimonial-content span{color: #fff;}
.home-three .testimonial-area.indicator-style .owl-theme .owl-nav [class*="owl-"] {color: #fff;}
.home-three .testimonial-area.indicator-style .owl-theme .owl-nav [class*="owl-"]:hover {color: #e2a750;}

/* ============= 13. Home Four Css ============= */
.home-four p {color: #fff;}
.home-four .aboutus-titel h2,.home-four .person-txt h6,.home-four .person-txt span,.home-four .project-count h3,.home-four .project-count span,.home-four .section-titel h2,.home-four ul.gallery-menu li,.home-four .testimonial-content h6,.home-four .testimonial-content span,.home-four .teamper-titel > h5,.home-four .teamper-titel > span,.home-four .slick-arrow::after,.home-four .slick-arrow i {color:#fff;}
.home-four .project-count span::after {background: #fff none repeat scroll 0 0;}
.home-four .trailer-titel h5 {background: #030c16 none repeat scroll 0 0;color: #fff;}
.home-four .trailer-single {box-shadow: none;}
.home-four .indicator-style .owl-theme .owl-nav [class*="owl-"] {color: #fff;}
.home-four .indicator-style .owl-theme .owl-nav [class*="owl-"]:hover {color: #e2a750;}
.home-four .trailer-img .popup-youtube:hover{color: #e2a750;}
.home-four ul.gallery-menu li.active,.home-four ul.gallery-menu li:hover {color: #e2a750;}
.home-four .section-titel.two h2, .home-four .section-titel.two p {color: #fff;}
.home-four .team-social ul li a {border: 1px solid #fff;color: #fff;}
.home-four .team-social ul li a:hover {background:#fff;color:#555;}
.home-four .slick-arrow i:hover {color:#e2a750;}

/* ============= 14. Breadcamp Area ============= */
.breadcamb-area {
  padding-bottom: 130px;
  padding-top: 215px;
}
.bradcamb-content h1 {
  color: #fff;
  font-size: 36px;
}
.bradcamb-content ul li {
  color: #0777bd;
  font-size: 14px;
  font-weight: 400;
  text-transform: uppercase;
}
.bradcamb-content ul li a {
  color: #0777bd;
  font-size: 14px;
}
.bradcamb-content ul li i, .top-titel ul li span {
  display: inline-block;
  padding: 0 6px 0 8px;
}
.bradcamb-content a span {padding: 0 8px 0 10px;}

/* ============= 15. Contact Us Page ============= */
.contact-us-area{position:relative;display:block;}
.section-titel-contact h3 {
  display: block;
  position: relative;
  /*font-weight: 700;*/
}
.section-titel-contact p{color:#555555;}
.section-titel-contact {
  margin-bottom: 45px;
  margin-left: 100px;
}
.section-titel-contact h3::after {
  border-bottom: 2px solid #0777bd;
  bottom: 10px;
  content: "";
  height: 70px;
  left: -90px;
  position: absolute;
  width: 70px;
}
.contact-us-map {
  padding-left: 100px;
  position: relative;
}
#googleMap {
  width: 100%;
  height: 390px;
}
/* Contact Address */
.contact-address {
  background: #0777bd none repeat scroll 0 0;
  padding: 50px 15px 15px 0;
  position: absolute;
  right: 0;
  top: -80px;
  width: 370px;
}
.contact-adres-single {
  padding-bottom: 15px;
  padding-left: 140px;
}
.contact-adres-single h4 {
  color: #fff;
  position: relative;
}
.contact-adres-single h4::after {
  border-bottom: 1px solid #fff;
  bottom: 10px;
  content: "";
  height: 70px;
  left: -100px;
  position: absolute;
  width: 70px;
}
.contact-adres-single > p {/*color: #fff;*/}

/* ============= 16. About Us Page ============= */
.about-area {
  display: block;
  position: relative;
}
.about-area .section-titel-contact {margin-bottom: 62px;}
.abt-sm-img {
  position: absolute;
  right: 70px;
  z-index: 99;
}
/*.abt-lrg-img {margin-left: 95px;}*/

/* ============= 17. Service Page ============= */
.service-box {
  display: block;
  margin-bottom: 40px;
  overflow: hidden;
  position: relative;
}
.service-content {
  background: #fafafa none repeat scroll 0 0;
  display: block;
  margin: 28px 0;
  overflow: hidden;
  padding: 50px 0 30px 50px;
  position: relative;
}
.service-text h3 {
  font-weight: 700;
  margin-bottom: 15px;
}
.service-text {
  float: left;
  width: 75%;
}
.service-text > p {
  color: #555555;
  font-size: 16px;
}
.service-icon i {
  color: #dddddd;
  float: right;
  font-size: 72px;
  position: absolute;
  right: 40px;
  top: 35px;
  transform: rotate(-29deg);
}

/* ============= 18. 404 Error ============= */
.outerwrap-404 {
  background-image: url("img/home-one/slider/1.png");
  background-size: cover;
  bottom: 0;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.error_main {
  left: 0;
  margin-top: -288px;
  position: absolute;
  right: 0;
  text-align: center;
  top: 50%;
}
.error_main h6 {
  color: #fff;
  font-size: 80px;
  line-height: 54px;
  margin-bottom: 30px;
  text-transform: capitalize;
}
.error_main > img {
  margin-bottom: 30px;
}
.error_main h2 {
  color: #fff;
  line-height: 25px;
  margin-bottom: 50px;
  padding-bottom: 8px;
  text-transform: capitalize;
}
.error_main .icon-studio {
  display: block;
  margin-bottom: 40px;
}
.error_main a {
  background: #e2a750 none repeat scroll 0 0;
  color: #fff;
  display: inline-block;
  font-size: 14px;
  text-transform: uppercase;
  width:130px;
  height:35px;
  line-height:35px
}
.error_main a:hover{background:#555555;}

/* ============= 19. ScrollUp ============= */
#scrollUp {
  background: #0777bd none repeat scroll 0 0;
  border-radius: 0px;
  bottom: 15px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  color: #fff;
  font-size: 28px;
  height: 40px;
  line-height: 35px;
  position: fixed;
  right: 15px;
  text-align: center;
  transition: all 0.3s ease 0s;
  width: 40px;
  z-index: 200;
}
#scrollUp:hover{background:#000;}




/**********************CSS add**************************/
.dis-inline-flex {
    padding-top: 2px;
    padding-right: 5px;
}

.padd-r-icons-top{
   padding-right: 2%;
}

.text-info-top{
    text-align: right;
}

.after-icons-top{
    display: inline-flex;
    font-size: 18px;
    padding: 13px 20px;
    /* text-transform: capitalize; */
    transition: .3s;
    position: relative;
}

.bor-b:after{
    position: fixed;
    content: "";
    border-bottom: 1px solid #0777bd;
    width: 100%;
    left: 0;
    top: 4%;
}

.white-letter{
    color: #fff;
}

a.white-letter{
    color: #fff;
}

.font-14{
    font-size: 14px;
}

.font-16{
    font-size: 16px;
}

.font-18{
    font-size: 18px;
}

.font-24{
    font-size: 24px;
}

.font-30{
    font-size: 30px;
}

.font-36{
    font-size: 36px;
}

.blue-letter{
    color: #0777bd;
}

.gray-letter{
    color: #333333;
}

.brandon-b{
    font-family: Brandon b;
}

.brandon-b-i{
    font-family: Brandon b i;
}

.brandon-l-i{
    font-family: Brandon l i;
}

.brandon-l{
    font-family: Brandon l;
}

.brandon-m-i{
    font-family: Brandon m i;
}

.brandon-t-i{
    font-family: Brandon t i;
}

.brandon-r-i{
    font-family: Brandon r i;
}

.brandon-m{
    font-family: Brandon m;
}

.roboto{
    font-family: roboto;
}

a i.blue-letter{
    color: #0777bd;
}

.w-300{
    font-weight: 300;
}

.w-700{
    font-weight: 700;
}

.p-b-title-slide{
    padding-bottom: 1%;
}

.p-b-subtitle-slide{
    padding-bottom: 2%;
    font-size: 40px;
}
.bold{
    font-weight: bold;
}

.font-face{
    color: #3b5998;
    font-size: 50px;
}

.border-services{
    border: 1px solid #0777bd;
}

.padd-b-services-home{
    padding-bottom: 110px;
}

.home-three .project-count h3.blue-letter{
    color: #0777bd;
}

.iconos-banner-home{
    position: absolute; 
    top: -50%;
    left: 0;
    z-index: -2;
}

.mar-top-menu{
    margin-top: 1%;
}

.hover-contact:hover{
    color: #fff;
}

.logo-strave{
    max-width: 70px;
}

.text-footer-left{
    text-align: left;
}

.text-footer-center{
    text-align: center;
}

.img-footer-right{
    text-align: right;
}

.text-footer-left, .text-footer-center{
    margin-top: 2%;
}

/*.owl-item, .item {
    height: 100vh;
}*/

.sections-text{
    text-align: justify;
}

.section-titel-contact h6 {
    display: block;
    position: relative;
    /* font-weight: 700; */
}

.text-after-image{
    padding-top: 5%;
}

.mar-l-0-sections{
    margin-left: 0px;
}

.lh-40{
    line-height: 40px;
}

.full-slide{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

/**************************PDF style*************************************/

.embed-responsive-aviso {
    position: relative;
    display: block;
    height: 0;
    padding: 0;
    overflow: hidden;
}

.embed-responsive object{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100%;
    height: 94%;
    border: 0;
    transform: translate(-50%, 6%);
    -webkit-transform: translate(-50%, 6%);
}

/**********************POP UP******************************/


.white-popup {
  position: relative;
  background: rgba(0,0,0,0.75);
  padding: 20px;
  width: auto;
  max-width: 800px;
  margin: 20px auto;
}

.boton-pop{
    text-align: center;
    padding: 10px 15px;
    width: 120px;
    background: transparent;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    border: 1px solid #fff;
}

.boton-pop:hover{
    text-align: center;
    padding: 10px 15px;
    width: 120px;
    background: transparent;
    font-size: 16px;
    cursor: pointer;
     border: 1px solid #0777bd;
}

.title-popup{
    color: #fff;
}

.form-control:hover{
    border: 1px solid #0777bd;
}

.form-control{background-color: transparent; color: #fff;}

.mfp-close-btn-in .mfp-close{color: #fff;}


/************Bandera Whats***************************/

.cont-bandera-whats{
    position: fixed;
    bottom: 220px;
    right: 0;
    z-index: 99999;
    text-align: center !important;
    color: #0777bd;
}

.cont-bandera-whats:hover{
    color: #4d2917;
}

.bandera-whats{
    background: #0777bd;
    color: #fff;
    font-size: 15px;
    padding: 5px;
}

.cont-bandera-whats i {
    font-size: 70px;
    text-shadow: 1px 1px 2px #000;
    
}

.cont-bandera-whats:hover{
    color: #0777bd !important;
}

.cont-bandera-whats:active{
    color: #0777bd !important;
}

.cont-bandera-whats:focus{
    color: #0777bd !important;
}




/**************************Responsive 11/06/2018*************************************/

@media screen and (max-width: 1600px){
    .bor-b:after{top: 5%;}
    .slide-content{margin-top: 360px;}
}

@media screen and (max-width: 1024px){
    .bor-b:after{top: 3%;}
    .main-menu nav ul li a{padding: 28px 15px;}
    .sticky .main-menu nav ul li a{padding: 25px 18px;}
}

@media screen and (max-width: 1024px) and (max-height: 768px){
   .bor-b:after{top: 6%;}
}



@media screen and (max-width: 768px){
    .bor-b:after{top: 4%;}
    .text-info-top{text-align: center;}
    .after-icons-top{padding: 13px 18px;}
    .owl-prev, .owl-next{top:32%;}
    .contact-us-map{padding-bottom: 180px;}
    .text-footer-left, .text-footer-center{margin-top: 3%;}
}

@media screen and (max-width: 736px){
    .mar-top-menu{display: none;}
    .text-footer-left{text-align: center;}
    .img-footer-right{text-align: center;}
    .bandera-whats{display: none;}
    .cont-bandera-whats{right: 10px; bottom: 100px;}
    .container-phone-640-header{width: 100% !important;}
    .after-icons-top{padding: 13px 6px; font-size: 12px;}
    .bor-b:after{top: 13%; display: none;}
    .logo-img{margin-bottom: 5px !important;}
    .padd-r-icons-top{padding-right: 5px;}
    .cont-bandera-whats i{font-size: 45px;}
    .mobile-logo-menu{max-width: 160px; }
    .contact-us-map{padding-bottom: 0px;}
}

@media screen and (max-width: 480px){
    .after-icons-top{padding: 9px 6px;}
    .logo-img{margin-top: 5px;}
    .mobile-menu-area{margin-top: 6%;}
    .texto-info-footer{font-size: 12px;}
    
}