/* CSS Entirely Developed by staycreative.es */

/* Generals */
body{font-family: "proxima-nova",sans-serif;text-rendering: optimizeLegibility;-webkit-font-smoothing: antialiased;-moz-font-smoothing: antialiased;}
h1,h2,h3,h4,h5,h6{font-family: "proxima-nova",sans-serif;}
small{font-size: 0.7rem;}

.button{border: 2px solid #b6a89a; border-radius: 5px;font-family: "proxima-nova",sans-serif;text-transform: uppercase;background: none;color: #b6a89a;font-weight: 700;}
.button:hover{background: #b6a89a;}

.button.secondary{border: 2px solid white; border-radius: 5px;font-family: "proxima-nova",sans-serif;text-transform: uppercase;background: none;color: white;font-weight: 700;}
.button.secondary:hover{background: white;color: #b6a89a;}

/* Hacks */
::selection {background: #b6a89a;color: white;}
::-moz-selection {background: #b6a89a;color: white;}
.clear{clear:both;}
.overlay{position: absolute; width:100%;height:100%;z-index: 10;background: rgba(31, 31, 31, 0.4);top: 0;left: 0;}
.section{padding: 5%;}
.dark-grey{background-color: #1f1f1f;}

/* Icons */
.icon{display: inline-block; background-size: 144px 141px !important;}
.icon.arrow-down{width: 72px;height: 38px;background: url('../img/dangelo-sprite.svg') 0 0 no-repeat;position: absolute;z-index: 5;bottom: 10px;left: calc(50% - 36px);cursor: pointer;background-size: 400%;}
.icon.fb{width: 36px;height: 36px;background: url('../img/dangelo-sprite.svg') 0 -19px no-repeat;font-size: 0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.icon.fb:hover{width: 36px;height: 36px;background: url('../img/dangelo-sprite.svg') 0 -55px no-repeat;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.icon.gp{width: 36px;height: 36px;background: url('../img/dangelo-sprite.svg') -36px -19px no-repeat;font-size: 0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.icon.gp:hover{width: 36px;height: 36px;background: url('../img/dangelo-sprite.svg') -36px -55px no-repeat;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.icon.ig{width: 36px;height: 36px;background: url('../img/dangelo-sprite.svg') -72px -19px no-repeat;font-size: 0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.icon.ig:hover{width: 36px;height: 36px;background: url('../img/dangelo-sprite.svg') -72px -55px no-repeat;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.icon.li{width: 36px;height: 36px;background: url('../img/dangelo-sprite.svg') -108px -19px no-repeat;font-size: 0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.icon.li:hover{width: 36px;height: 36px;background: url('../img/dangelo-sprite.svg') -108px -55px no-repeat;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.icon.view{width: 50px;height: 50px;background: url('../img/dangelo-sprite.svg') 0 -91px no-repeat;font-size: 0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;vertical-align: middle;margin-right: 10px;}
a:hover .icon.view{width: 50px;height: 50px;background: url('../img/dangelo-sprite.svg') -50px -91px no-repeat;font-size: 0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.icon.tel{width: 17px;height: 17px;background: url('../img/dangelo-sprite.svg') -36px 0 no-repeat;vertical-align: middle;margin-right: 10px;}
.icon.email{width: 18px;height: 13px;background: url('../img/dangelo-sprite.svg') -53px 0 no-repeat;vertical-align: middle;margin-right: 10px;}
.icon.dir{width: 15px;height: 18px;background: url('../img/dangelo-sprite.svg') -71px 0 no-repeat;vertical-align: middle;margin-right: 10px;}

/* Header */
header{padding: 20px 0;z-index: 1000;background: white;}
.sticky-wrapper{height: auto !important;}
#loader{background: white;position: fixed;top: 0;width: 100%;height: 100%;z-index: 20;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
#loader img{top: 50%;left:50%;transform: translateX(-50%) translateY(-50%);transform: translateX(-50%) translateY(-50%);position: absolute;-webkit-animation: breathing 1s ease-out infinite normal;
    animation: breathing 1s ease-out infinite normal;}
@-webkit-keyframes breathing {
  0% { opacity:0.3; }
  50% { opacity:1; }
  100% { opacity:0.3; }
}
@keyframes breathing {
  0% { opacity:0.3; }
  50% { opacity:1; }
  100% { opacity:0.3; }
}

    /* Menu */
    .top-bar{height: 75px;background: none;}
    .top-bar .name{height: auto;}
    .top-bar .name h1 a{font-size: 0;line-height: 0;}
    .top-bar-section ul li{background: none;}
    .top-bar-section li.active:not(.has-form) a:not(.button){padding: 0.90rem 1rem;color: #a29486;background: none;font-weight: bold;}
    .top-bar-section li.active:not(.has-form) a:not(.button):hover{background: none;color: #a29486;}
    .top-bar-section ul li > a{font-family: "proxima-nova",sans-serif;}
    .top-bar-section li:not(.has-form) a:not(.button){background: none;color: #1f1f1f;text-transform: uppercase;font-size: 1rem;padding: 0.90rem 1rem;}
    .top-bar-section ul li:hover:not(.has-form) > a{background: none;color: #a29486;}
    .top-bar-section li:not(.has-form) a:not(.button):hover{background: none;}
    .top-bar-section .has-dropdown > a:after{border-color: rgba(31, 31, 31, 0.4) transparent transparent transparent;top:2.2rem;}
    .top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button){background: white;color: #1f1f1f;}
    .top-bar-section .dropdown li:not(.has-form):not(.active):hover > a:not(.button){background: white;color: #a29486;}

    .top-bar .toggle-topbar.menu-icon a{color: #1f1f1f;}
    .top-bar .toggle-topbar.menu-icon a:hover, .top-bar.expanded .toggle-topbar.menu-icon a{color: #a29486;}
    .top-bar .toggle-topbar.menu-icon a span::after {box-shadow: 0 0 0 1px #1f1f1f, 0 7px 0 1px #1f1f1f, 0 14px 0 1px #1f1f1f;}
    .top-bar .toggle-topbar.menu-icon a:hover span::after, .top-bar.expanded .toggle-topbar.menu-icon a span::after  {box-shadow: 0 0 0 1px #a29486, 0 7px 0 1px #a29486, 0 14px 0 1px #a29486;}
    .top-bar.expanded .title-area{background: none;}
    .top-bar-section .dropdown li.title h5 a{color: #1f1f1f;}
    .top-bar-section .dropdown li.title h5 a:hover{color: #a29486;}
    .top-bar.expanded .top-bar-section .has-dropdown > a:after{border-color: transparent transparent transparent rgba(31, 31, 31, 0.4);top:2.2rem;}

    /* Slider */
    .slider-container{position: relative;height: calc(100% - 115px);}
    .rslides {position: relative;list-style: none;overflow: hidden;width: 100%;padding: 0;margin: 0;height: 100%;}
    .rslides li {-webkit-backface-visibility: hidden;position: absolute;display: none;width: 100%;height: 100%;left: 0;top: 0;background-position: center center;background-repeat: no-repeat;background-size: cover;}
    .rslides li:first-child {position: relative;display: block;float: left;}
    .rslides img {display: block;height: 100%;width: 100%;border: 0;}

    .rslides_tabs{width: 20px;position: absolute;right: 10px;margin: 0;top: calc(50% - 50px);z-index: 5;}
    .rslides_tabs li{width: 20px;display: block;margin-bottom: 10px;height: 20px;}
    .rslides_tabs li a{font-size: 0;color: white;background-color: transparent;border: 1px solid white;width: 20px;height: 20px;border-radius: 20px;display: block;}
    .rslides_tabs li.rslides_here a{background: white;}

    /* main img */
    .main-img{position: relative;height: 400px;}

/* Footer */
  footer{padding: 5% 5% 3%;}
  .footer{position: relative;width: 100%;}
  #copyright{position: relative;margin: 8px 0 0;float: left;color: #b6a89a;font-size: 1rem;}
  .social-footer{position: relative;margin: 0 auto;list-style-type: none;width: 174px;}
  .social-footer li{display: inline-block; margin-right: 10px;float: left;}
  .social-footer li a{display: block;font-size: 0.9rem;}
  .social-footer li a i{display: block;}
  .social-footer li:last-child{margin: 0;}
  .menu-footer{float: right;margin: 0;list-style-type: none;}
  .menu-footer li{display: inline-block;}
  .menu-footer li:first-child:after{display: inline-block;content: " · ";margin-left: 5px;color: #b6a89a;}
  .menu-footer li a{color: #b6a89a;font-size: 0.9rem;}
  .menu-footer li a:hover{color: #1f1f1f;}
  #autor{float: right;font-size: 0.8rem;color: #b6a89a;margin-top: 20px;margin-bottom: 0;}
  #autor a{color: #b6a89a;font-weight: 700;}
  #autor a:hover{color: #1f1f1f;}

/* Index */
  
  #intro-home{margin-bottom: 105px;}
  .intro-home{position: relative;padding: 10% 10% 5%;text-align: center;}
  .intro-home h1{text-align: center;font-weight: 700;font-size: 2rem;text-transform: uppercase;}
  .intro-home p{text-align: center;margin-bottom: 0;}

  .center-text{top: 50%;transform: translateY(-50%); transform: translateY(-50%);position: absolute;width: 90%;z-index: 11;}
  .center-text-small{top: 50%;transform: translateY(-50%); transform: translateY(-50%);position: absolute;width: 80%;z-index: 11;}

  .servicebig-home{position: relative;padding: 5%;min-height: 60%;width: 100%;}
  .servicebig-home h2{text-align: right;color: white;z-index: 11;position: relative; text-transform: uppercase;font-weight: 700;font-size: 5rem;}
  .servicebig-home p{text-align: right; color: white;z-index: 11;position: relative;font-size:1.21875rem;}
  #realestate-home{background: url('../img/realestate-home.jpg') center center no-repeat;background-size: cover;background-attachment: fixed;}
  #architectural-home{background: url('../img/architectural-home.jpg') center center no-repeat;background-size: cover;background-attachment: fixed;}
  #architectural-home h2, #architectural-home p{text-align: left;}

  .secondary-services{position: relative;padding: 10%;}
  .secondary-services h3{text-align: center;font-weight: 700;}
  .secondary-services p{text-align: center;margin-bottom: 0;}

  .servicesmall-home-left{position: relative;padding: 5%;min-height: 40%;}
  .servicesmall-home-left h4{text-align: right;color: white;z-index: 11;position: relative; text-transform: uppercase;font-weight: 700;font-size: 4rem;}
  .servicesmall-home-left p{text-align: right; color: white;z-index: 11;position: relative;}
  .servicesmall-home-right{position: relative;padding: 5%;min-height: 40%;}
  .servicesmall-home-right h4{text-align: left;color: white;z-index: 11;position: relative; text-transform: uppercase;font-weight: 700;font-size: 4rem;}
  .servicesmall-home-right p{text-align: left; color: white;z-index: 11;position: relative;}
  .servicesmall-home-left .overlay, .servicesmall-home-right .overlay{background: rgba(31, 31, 31, 0.8);-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
  .servicesmall-home-left:hover .overlay, .servicesmall-home-right:hover .overlay{background: rgba(31, 31, 31, 0.4);-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
  #homestaging-home{background: url('../img/service-small-1.jpg') center center no-repeat;background-size: cover;}
  #video-home{background: url('../img/service-small-2.jpg') center center no-repeat;background-size: cover;}
  #aerial-home{background: url('../img/service-small-3.jpg') center center no-repeat;background-size: cover;}
  #timelapse-home{background: url('../img/service-small-4.jpg') center center no-repeat;background-size: cover;}


/* About me */
#about-me-img{background: url('../img/about-me-img.jpg') center center no-repeat; background-size: cover;}
.profile-img{position: relative;padding: 10% 0 0 5%;}
.profile-img img{/*border-radius: 9999px;*/margin-top: 7px;}
.profile-text-container{/*border-top: 2px solid #1f1f1f;*/padding:10% 10% 10% 5%;}
.profile-text{}
.profile-container .firma{float: right;max-width: 240px;margin-top: 30px;}
.clients-h3{text-align: center;color: white;margin-bottom: 20px;font-family: 'Arapey', serif;}
.clients-h3 span{font-size: 1.2rem;font-family: "proxima-nova",sans-serif;text-align: right;display: block;max-width: 630px;margin: 20px auto 0;}
.clients li{padding: 20px;}

.comments-container{position: relative;padding: 10% 5%;background: url('../img/comments-img.jpg') center center no-repeat;background-size: cover;}
.comments-container .overlay{background: rgba(31, 31, 31, 0.8);}
.comments-clients{position: relative;z-index:10;}
.comments-clients p{color: white;text-align: right;}
.comments-clients .client-name{display: block;text-align: right;font-weight: 700;}
.comments-clients .house-name{display: block;text-align: right;font-style: italic;}

.comment{padding: 10% 5%;position: relative;z-index: 11;}
.comment p{color: white;}
.comment .comment-name{color: white;font-weight: 700;display: block;}
.comment .comment-web{color: white;font-style: italic;display: block;}

/* Services */
#services-img{background: url('../img/services-img.jpg') center center no-repeat; background-size: cover;}
.service-large-text{padding: 20%;margin-bottom: 190px;}
.service-large-text h3{text-transform: uppercase;}
.service-large-text p{margin-bottom: 0;}
.service-large-link{padding: 10% 0;text-align: center;position: absolute;width: 100%;bottom: 0;}
.service-large-link a{color: white;position: relative;z-index: 10;text-transform: uppercase;}
.service-large-image img{max-width: none; width: 100%;height: 100%;}
.service-large-link .overlay{background: #555555;}

.service-small-text{padding: 10%;margin-bottom: 190px;text-align: right;}
.service-small-text h3{text-transform: uppercase;text-align: left;}
.service-small-text p{margin-bottom: 0;text-align: left;}
.service-small-link{padding: 10% 0;text-align: center;position: absolute;width: 100%;bottom: 0;}
.service-small-link a{color: white;position: relative;z-index: 10;text-transform: uppercase;}
.dark-grey .service-small-text h3, .dark-grey .service-small-text p{color: white;}

#real-estate-service.service-large{position: relative;}
#real-estate-service .service-large-image{background: url('../img/real-estate-service.jpg') center center; background-size: cover;}
#real-estate-service .service-large-link{background: url('../img/real-estate-link.jpg') center center; background-size: cover;}

#architecture-service.service-large{position: relative;}
#architecture-service .service-large-image{background: url('../img/architecture-service.jpg') center center; background-size: cover;}
#architecture-service .service-large-link{background: url('../img/architecture-link.jpg') center center; background-size: cover;}

#homestaging-service.service-small{position: relative;}
#homestaging-service .service-small-link{background: url('../img/homestaging-link.jpg') center center; background-size: cover;}
#video-service.service-small{position: relative;}
#video-service .service-small-link{background: url('../img/video-link.jpg') center center; background-size: cover;}
#timelapse-service.service-small{position: relative;}
#timelapse-service .service-small-link{background: url('../img/timelapse-link.jpg') center 10%; background-size: cover;}
#aerial-service.service-small{position: relative;}
#aerial-service .service-small-link{background: url('../img/aerial-link.jpg') center 0; background-size: cover;}

/* Portfolio */
#galleries-img{background: url('../img/galleries-img.jpg') center center no-repeat; background-size: cover;}
#portfolio{position: relative;}
.portfolio-filter{position: relative;padding: 2%;margin: 0;}
.portfolio-filter span{cursor: pointer;text-transform: uppercase;}
.portfolio-filter span:hover{color: #a29486;}

.portfolio-list{margin: 0 1%;}
.portfolio-item{list-style-type: none;position: relative;overflow: hidden;background-position: center center;background-repeat: no-repeat;background-size: cover;width: 23%;margin:1%;float: left;}
.portfolio-item:last-child{float: left !important;}
.portfolio-item img{width: 100%;max-width: none;}
.portfolio-item .overlay{background: rgba(31, 31, 31, 0);-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;width: 90%;height: 90%;margin: 5%;}
.portfolio-item:hover .overlay{background: rgba(31, 31, 31, 0.4);-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.portfolio-item .portfolio-overlay{position: absolute;width: calc(100% - 20%);margin: 10%;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;bottom: -50%;z-index: 10;}
.portfolio-item:hover .portfolio-overlay{bottom:0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.portfolio-item .portfolio-text{color: white;text-transform: uppercase;line-height: 1.4rem;display: block;}

    /* Single Gallery */
    .single-gallery-container{position: relative;}
    .single-gallery-list{position: relative;margin: 0;}
    .single-image{position: relative;margin: 0 !important;background-position: center center;background-repeat: no-repeat;background-size: cover;}
    .single-image:last-child{float: left !important;}
    .return{margin: 50px 0 0;text-align: center;}
    .single-gallery-container .visible-img img{max-width: 1200px;}

/* Contact */
.contact-container{background: url('../img/contact-bg.jpg') center center no-repeat; background-size: cover;position: relative;padding: 5%;}
.contact-container h3{position: relative; z-index: 10;text-align: left;color: white;font-weight: 700;margin-bottom: 50px;}
.contact-container .overlay{background: rgba(31, 31, 31, 0.8);}
#form_contacta{position: relative; z-index: 10;}
#form_contacta input[type=text], #form_contacta input[type=email]{background: none;border: 0;border-bottom: 1px solid white;color: white;font-size: 1.2rem;padding: 10px;height: auto;  }
#form_contacta input[type=text]:focus, #form_contacta input[type=email]:focus{background: rgba(255, 255, 255, 0.2);}
#form_contacta textarea{background: none;border: 0;border-bottom: 1px solid white;color: white;font-size: 1.2rem;padding: 5px;min-height: 120px;margin-bottom: 50px;height: auto;}
#form_contacta textarea:focus{background: rgba(255, 255, 255, 0.2);}
#form_contacta small{color: white;}
.contact-info{position: relative; z-index: 10;margin-top: 50px;}
.contact-list{position: relative; margin: 0;}
.contact-list li{list-style-type: none;color: white;font-size: 1.2rem;}
.contact-list li.tel-info{font-weight: 700;font-size: 1.8rem;}

/* Cookies */
#cookieMessageWrapper{
  width: 100%;
  border-top: 1px solid #aaaaaa;
  background: #f6f6f6;
  position: fixed;
  left: 0;
  bottom: 0;
  text-align: center;
  padding: 0;
  z-index: 19;
}
#cookieMessage{
  width: 90%; /* this needs to be set to the width of the centre container */
  padding: 3px 0 3px 0;
  margin: 0 auto;
  position: relative;
}
#cookieMessage:after{
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
#cookieMessage p{font-size: 0.8rem;margin-top: 10px;}
#cookieClose{
  display: inline-block;
  padding: 0px 5px;
  text-decoration: none;
  background: none;
  color: #b6a89a;
  border: 1px solid #b6a89a;
  font-size: 100%;
  margin-top: 6px;
  font-weight: bold;
  cursor: pointer;
}


/* Media Queries */
@media only screen and (min-width:75em){
  .main-img{height: 600px;}
  #about-me-img{background: url('../img/about-me-img-large.jpg') center center no-repeat;background-size: cover;}
  #services-img{background: url('../img/services-img-large.jpg') center center no-repeat;background-size: cover;}
  #galleries-img{background: url('../img/galleries-img-large.jpg') center center no-repeat;background-size: cover;}
  .contact-container{background: url('../img/contact-bg-large.jpg') center center no-repeat;background-size: cover;}
}

@media only screen and (max-width:75em){
  .servicesmall-home-left h4, .servicesmall-home-right h4 {font-size: 2rem;}
  .servicesmall-home-left p.lead, .servicesmall-home-right p.lead{font-size: 1rem;}
}

@media only screen and (max-width:64em){
  .top-bar{height: 45px;}
  .top-bar .name h1 a img{height: 45px;}
  .slider-container {height: calc(100% - 85px);}
  .center-text-small{position: relative;transform:none;top: auto;width: 100%;margin-top: 25%;}
  .center-text-small br, .secondary-services br{display: none;}
  p.lead{font-size: 1rem;}
  .servicebig-home h2{font-size: 4rem;}
  .servicebig-home .center-text{position: relative;transform:none;top: auto;width: 100%;margin-top: 20%;}
  .portfolio-item{width: 31.33333%;}
}

@media only screen and (max-width:40em){

  .profile-img{position: relative;padding: 10% 10% 0;}
  .profile-text-container{padding:10%;}
  .single-gallery-container{margin: 0 5%;}
  #copyright{text-align: center;width: 100%;margin-bottom: 20px;}
  .menu-footer{margin-top: 20px;}
  .servicebig-home h2{font-size: 2rem;}
  .portfolio-item{width: 48%;}
  .single-image{margin-bottom: 20px !important;}


}