
/***************************
* GENERAL
****************************/

html, 
body {
  height: 100%;
  min-height: 100%;
  background: #000;
}
p{}
body {
  font-family: 'Raleway', sans-serif;
  position: relative;
  margin: 0;
  padding: 50px 0 0 0;
}
.body-wrapper{position:relative;margin-left: 50px; margin-right: 50px;}
.body-wrapper.white{background: #fff;}
img.corner-logo{position: absolute;max-width: 125px; right: 20px; top: 20px;}
a:hover{text-decoration: none;}
.flex-control-nav{bottom: 0 !important;z-index: 4!important;}
.flex-control-nav li a{width: 20px; height: 5px;background: rgba(255, 255, 255, 0.4);border-radius: 0;}
.flex-control-paging li a.flex-active{background: rgba(255, 255, 255, 0.9);}

a.button{line-height: 58px; display: inline-block;font-weight: 400;color: #fff;font-size: 16px; text-align: center;
border: 1px solid #fff;padding-left: 25px;padding-right: 25px;}

h1.title{font-size: 72px;line-height: 85px;font-weight: 100;color: #212121;padding: 80px 0 80px 0;text-transform: uppercase;}

span.arrow{border: solid #A7A7A7;border-width: 0 1px 1px 0;display: inline-block;padding: 13px;position: relative;bottom: 2px;
  transition: all 0.3s linear;}
span.arrow.left{transform: rotate(135deg);-webkit-transform: rotate(135deg);left: 8px;}
span.arrow.right{transform: rotate(-45deg);-webkit-transform: rotate(-45deg);right: 8px;}
span.arrow.back{transform: rotate(135deg);-webkit-transform: rotate(135deg);left: -5px;padding: 5px;bottom: 1px;}
span.arrow.view{transform: rotate(-45deg);-webkit-transform: rotate(-45deg);right: 0px;padding: 5px;bottom: 1px;}

.go-back{padding: 10px;}
.go-back a{font-size: 18px;font-weight: 300;text-transform: uppercase;color: #A7A7A7;line-height: 21px;transition: all 0.3s linear;}
.go-back a:hover{color: #212121;}
.go-back a:hover span.arrow.back{left: -10px;transition: all 0.3s linear;border-color: #212121;}

.view-projects{}
.view-projects a{font-size: 18px;font-weight: 300;text-transform: uppercase;color: #A7A7A7;line-height: 21px;transition: all 0.3s linear;}
.view-projects a:hover{color: #212121;}
.view-projects a:hover span.arrow.view{right: -8px;transition: all 0.3s linear;border-color: #212121;}

.learn-more{background: #F9F9F9;padding: 60px 100px 60px 100px;margin-top: 40px;margin-bottom: 150px;}
.learn-more a:hover{color: #212121;}
.learn-more a:hover span.arrow.view{right: -8px;transition: all 0.3s linear;border-color: #212121;}

/***************************
* HEADER
****************************/

.header{
  height: 50px;
    line-height: 50px;
    position: fixed;
    top: 0;
    background: #000;
    z-index: 9;
    width: 100%;}
.header ul.main-menu{padding-left: 50px;}
.header ul.main-menu li{display: inline-block;}
.header ul.main-menu li a{color: #A7A7A7;font-family: 'Raleway', sans-serif;font-size: 16px;font-weight: 300;margin-right: 50px;}
.header ul.main-menu li a:hover{color: #fff;text-decoration: none;}
.header ul.main-menu li a.active{color: #fff;}

/***************************
* HOME SLIDER
****************************/

.home-slider{position: relative;height: 100%;display: inline-block;width: 100%;}
.home-slider .logo-slider{position: absolute;max-width: 125px;z-index: 4;right: 20px;top: 20px;}
.home-slider::after{}
.home-slider ul li{height: 1025px;background-position: center;width: 100%;-webkit-backface-visibility: hidden;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;}
.home-slider ul li::after{
  content: ""; position: absolute; width: 100%; height: 100%;background:rgba(0,0,0,0.3);z-index: 2;
}
.home-slider ul li .wrap-text{text-align: center;position: absolute; top: 50%; transform: translateY(-50%);left: 0; right: 0;z-index: 3;}
.home-slider ul li .wrap-text h2{font-size: 72px;color: #fff;font-weight: 200;margin-bottom: 40px;}


/***************************
* PROJECTS
****************************/

ul.filters{padding: 0;margin-bottom: 100px;}
ul.filters li{display: inline-block;margin-right: 60px;}
ul.filters li a{color: #A7A7A7;position: relative;transition: all 0.2s linear;}
ul.filters li a::after{position: absolute; content: "";transition: all 0.2s linear;background: #A7A7A7; width: 50px; height: 1px;bottom: -20px;left:0px;}
ul.filters li a.active{color: #212121;}
ul.filters li a.active::after{background: #212121;}
ul.filters li a:hover{color: #212121;transition: all 0.2s linear;}
ul.filters li a:hover::after{background: #212121;transition: all 0.2s linear;}

.project-item{position: relative; margin-bottom: 80px;}

.project-item a{color: #A7A7A7;}
.project-item .info{margin-top: 20px;position: relative;}
.project-item .info::after{position: absolute;content: "";background:#212121;width: 0; max-width: 380px; height: 1px; bottom: -10px;}
.project-item:hover .info::after{width: 100%;transition: all 0.3s linear;}
.project-item .info h3{color: #212121;}
.project-item .info h3,
.project-item .info h4{text-transform: uppercase;font-size: 16px;font-weight: 400;line-height: 15px;}
.project-item img{max-width: 380px;width: 100%;}

.learn-more h3{font-size: 48px;line-height: 48px;color: #777777;font-weight: 200;max-width: 925px;margin-bottom: 30px;}
.learn-more a{color: #A7A7A7;text-transform: uppercase;font-size: 18px;line-height: 21px;font-weight: 300;}


/***************************
* PROJECTS DETAIL
****************************/

.project-info{margin-top: 50px;margin-bottom: 50px;}
.project-cat{position: relative;}
.project-cat::before, .project-desc::before{position: absolute; content: "";width: 50px; height: 1px;background: #A7A7A7;top: -40px;}
.project-cat h3{font-size: 24px;color: #2B2B2B;text-transform: uppercase;font-weight: 200;}
.project-desc{position: relative;}
.project-desc p{color: #777777;font-weight: 200;font-size: 16px;line-height: 26px;}

.project-detail{padding-left: 15px;padding-right: 15px;}
.project-detail .single-image{margin-bottom: 20px;}
.project-detail .single-image img{width: 100%;}

.project-detail .double-image{display: table;margin-bottom: 20px;}
.project-detail .double-image .col1{display: table-cell;width: 50%;padding-right: 10px;}
.project-detail .double-image .col2{display: table-cell;width: 50%;padding-left: 10px;}
.project-detail .double-image .col1 img{width: 100%;}
.project-detail .double-image .col2 img{width: 100%;}

.testimonial{padding-left: 15px;padding-right: 15px;}
.testimonial .wrap-text{position:relative;top:-20px;background: #F9F9F9;width: 100%;padding: 60px 100px 60px 100px;}
.testimonial .wrap-text h3{font-size: 48px;line-height: 48px; color: #777777;font-weight: 200; max-width: 925px;margin-bottom: 30px;font-style: italic;}
.testimonial .wrap-text h4{color: #A7A7A7;text-transform: uppercase;font-size: 18px;line-height: 21px;font-weight: 300;}

.related-projects{display: inline-block;width: 100%;margin: 150px 0 100px 0;}
.related-projects h3.prev,
.related-projects h3.next{font-size: 48px;line-height: 56px;font-weight: 100;margin-bottom: 60px;}
.related-projects a{color: #A7A7A7;transition: all 0.2s linear;}
.related-projects a:hover{color: #212121;transition: all 0.2s linear;}
.related-projects .img-wrap{max-width: 515px;}
.related-projects .img-wrap img{width: 100%;}
.related-projects .info{margin-top: 20px;position: relative;}
.related-projects .info::after{position: absolute;content: "";background: #212121;width: 0;max-width: 515px;height: 1px;bottom: -10px;}
.related-projects .project-right:hover .info::after{width: 100%;transition: all 0.3s linear;}
.related-projects .project-left:hover .info::after{width: 100%;transition: all 0.3s linear;}

.related-projects .info h3,
.related-projects .info h4{text-transform: uppercase;font-size: 16px;font-weight: 400;line-height: 15px;color: #A7A7A7;}
.related-projects a:hover .info h4{color: #A7A7A7;}
.related-projects .info h3{color: #212121;}
.related-projects .project-left{float: left; position: relative;}
.related-projects .project-right{float: right;position: relative;}


.related-projects .project-left:hover span.arrow.left{left: 0px;transition: all 0.3s linear;border-color: #212121;}
.related-projects .project-right:hover span.arrow.right{right: 0px;transition: all 0.3s linear;border-color: #212121;}
.related-projects .project-right h3.next{text-align: right;}
.related-projects .project-right .img-wrap img{text-align: right;}

.view-all{text-align: right;margin-bottom: 150px;}
.view-all a{color: #A7A7A7;font-size: 18px;line-height: 21px;font-weight: 300;text-transform: uppercase;}
.view-all a:hover{color: #212121;}


/***************************
* ABOUT
****************************/

.about-info{margin-bottom: 200px;}
.about-info h3{font-size: 30px;font-weight: 300;margin-bottom: 40px;color: #2B2B2B;}
.about-info .wrap-text{max-width: 540px;}
.about-info .wrap-text p{font-weight: 300; font-size: 16px;color: #777777;}

.cta{position: relative;}
.cta .wrap-image{top: 50px;width: 650px; height: 520px;background-position: center;background-size: cover;position: relative;z-index: 1;}
.cta .wrap-text-cta{max-width: 770px;position: absolute;right: 0;background: #F9F9F9;padding: 145px;top: -100px;}
.cta .wrap-text-cta h3{font-size: 48px;font-weight: 200;line-height: 55px;color: #777777;padding-left: 50px;}

.cols{position: relative; margin-top: 200px;margin-bottom: 200px;}
.cols h3{font-size: 30px;font-weight: 300;margin-bottom: 40px;color: #2B2B2B;}
.cols .wrap-text{max-width: 540px;margin-bottom: 80px;}
.cols .wrap-text p, 
.cols .wrap-text ul li{font-weight: 300; font-size: 16px;color: #777777;}
.cols .wrap-text ul{padding: 0;}
.cols .wrap-text ul li{list-style: none;line-height: 40px;}


/***************************
* CONTACT
****************************/

.contact-info{margin-bottom: 250px;}

.wrap-contact{position: relative;margin-bottom: 60px;color: #707070; font-size: 16px;font-weight: 400;}
.wrap-contact:before{position: absolute; content: "";width: 50px; height: 1px;background: #A7A7A7;top: -30px;}
a.map{color: #2B2B2B;background: #F9F9F9;font-size: 14px;text-transform: uppercase;padding: 17px 25px 17px 25px;}

.cta-left{position: relative;margin-bottom: 200px;}
.cta-left .wrap-image{top: 100px;width: 770px; height: 520px;background-position: center;background-size: cover;position: absolute;z-index: 1;right: 0;}
.cta-left .wrap-text-cta{max-width: 650px;position: relative;left: 0;background: #F9F9F9;padding: 145px;top: -50px;}
.cta-left .wrap-text-cta h3{font-size: 48px;font-weight: 200;line-height: 55px;color: #777777;padding-right: 50px;}

.contact-form{top: -40px;}
.contactForm{padding-left: 100px;}
.mdc-text-field{background: transparent !important;margin-bottom: 20px;}
.mdc-text-field:not(.mdc-text-field--disabled){background: transparent;width: 100%;max-width: 430px;}
.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-floating-label{color:#2B2B2B; }
.mdc-text-field .mdc-line-ripple{background-color: #2B2B2B;}
.mdc-text-field--textarea{width: 100%;margin-top: 30px;overflow: visible !important;}
.mdc-text-field--textarea:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__leading, .mdc-text-field--textarea:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__notch, .mdc-text-field--textarea:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__trailing{border-color: #2B2B2B;}

/***************************
* FOOTER
****************************/

.footer{position: relative;padding-top: 150px;padding-bottom: 50px;background: #000;}
.footer .block{position: relative;}
.footer .block::before{position: absolute;content: ""; background: #A7A7A7; width: 50px; height: 1px;top:-40px;}
.footer h3{font-size: 18px;color: #fff;line-height: 30px;font-weight: 300;margin-bottom: 40px;}
.footer a.phone{font-size: 14px;color: #A7A7A7;display: block;font-weight: 300;}
.footer a.phone:hover{color: #fff;}
.footer a.button{line-height: 48px;font-size: 14px;margin-top: 30px;}
.footer p{font-size: 14px;color: #A7A7A7;line-height: 20px; padding: 0;margin: 0;font-weight: 300;}
.footer img.mba{max-width: 220px;margin-bottom: 40px;}
.footer .credits{position: relative;padding-top: 150px;}
.footer .credits .airth-logo{position: absolute;left: 0;bottom: 0px}
.footer .credits .airth-logo img{max-width: 195px;}

.footer .credits .milk-logo{position: absolute;bottom: 0; right: 0;}
.footer .credits .milk-logo a{color: #727272;font-size: 14px;}

.footer .credits .copy{position: absolute;left: 0; right: 0;text-align: center;color: #727272;bottom: 0;font-size: 14px;}

.footer-sticky{background: #000; position: fixed; height: 50px;width: 100%;bottom: 0;left: 0;z-index: 9;}