@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&display=swap');

body{font-family: 'Open Sans', sans-serif; margin:0; padding:0; font-size:16px; color:#333; line-height:26px; overflow-x: hidden;}




a{text-decoration:none; color:#375fab;}
a:hover{color:#333;}
a, .header, .logo img, .slick-slide, .btn, .verticalbox img{-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-ms-transition: all .2s linear;
-o-transition: all .2s linear;
transition: all .2s linear;}


h1, h2, h3, h4{font-family: 'Playfair Display', serif;}
h1{font-size:60px;}
h2{font-size:48px;}
h3{font-size:40px;}
h4{font-size:36px;}
h5{font-size:24px;}
.lead{font-weight:400;}
.text-warning{color:#ffc586!important;}



.header{width:100%; position:fixed; z-index:999; padding:0;}
.header.shrink{background:#000;}
.logo img{max-width:167px;}
.shrink .logo img{max-width:100px;}





.btn{display: inline-flex; padding:14px 25px; font-size:16px; border-radius:0; overflow:hidden; position:relative; text-transform:initial; text-transform: uppercase;}
.btn:hover{background-color:#000;}
.btn-sm{padding:10px 20px;}
.btn-lg{padding:20px 25px;}
.btn:focus{box-shadow:none;}
.btn span{z-index:9;}
.btn i{font-size:30px; vertical-align: middle;}


.btn-outline-info{border:1px solid #fff!important; color:#fff!important;}
.btn-secondary{background:#bd866e!important;  border:1px solid #bd866e;}
.btn-1:hover{color:#000!important; background-color:transparent;}
.btn-1:before{position:absolute; left:0px; top:0px; height:0px; width:100%; content:'';background: #fff; transition: all 0.5s cubic-bezier(0.255, 0.255, 0.255, 1) 0s;}
.btn-1:hover:before{bottom: 0%;top: auto;height: 100%;}

.btn-2:hover{color:#fff!important; background-color:transparent;}
.btn-2:before{position:absolute; left:0px; top:0px; height:0px; width:100%; content:'';background: #000; transition: all 0.5s cubic-bezier(0.78, 0.159, 0.116, 1) 0s;}
.btn-2:hover:before{bottom: 0%;top: auto;height: 100%;}


.access ul{margin:0; padding:0; list-style:none;}
.access li{display:inline-block;}
.access li a{font-size:18px; color:#fff; display:block; font-weight:400; padding:0 20px; border-right:2px solid #fff; height:14px; line-height:14px;}
.access li:last-child a{border-right:none;}
.access li a:hover, .access li a.active{color:#ffc586;}

.banner{position:relative; background:url(../images/5.jpg); width:100%; background-size: cover; min-height:700px;}
.banner .container{z-index:9;}
.banner:after{position: absolute; content:''; top:0; width:100%; height:100%; background:#000; opacity:.4;}
.banner h1 span{font-size:36px; display: block;}
.innerbanner{position:relative; height: 96px; background: #000;}
.innerbanner .container{z-index:9;}
/*.innerbanner img{filter: grayscale(100%);}*/
.innerbanner:after{position: absolute; content:''; top:0; width:100%; height:100%; background:#000; opacity:.4; display: block;}

.homeslider .slick-list{margin-left: -20vw}
.homeslider .slick-slide{margin-left: 30px}
.projectslider .slick-slide{background: #8c694e; margin:14px}
.projectslider .slick-slide img{opacity: .6; width: 100%;}
.projectslider .slick-slide.slick-current img{opacity: 1}
.projectslider .slick-arrow{position: absolute; bottom:35px; font-size:30px;border:0;background:none; cursor: pointer; padding:30px; border-radius:0; z-index:9; width:50px; height:50px;}
.projectslider .las.la-arrow-left{align-items: center; display: flex; justify-content:center; border: 1px solid #fff; color: #fff; left:30px;}
.projectslider .las.la-arrow-right, .homeslider .las.la-arrow-right{right:30px; align-items: center; display: flex; justify-content:center; border: 1px solid #fff; color: #fff;}

.homeslider .las.la-arrow-right{right:-110px; border: 1px solid #000; color:#000;}
/*.homeslider .las.la-arrow-right{right:-110px;}*/
.bannerslider .slick-slide img{width: 100%; height:80vh; object-fit: cover;}
.bannerslider:before{position: absolute; content:''; top:0; width:100%; height:100%; background:#000; opacity:.4; z-index:9;}
.bannerslider .slick-arrow{position: absolute; bottom:110px; font-size:30px;border:0;background:none; cursor: pointer; padding:30px; border-radius:0; z-index:9; width:50px; height:50px;}
.bannerslider .las.la-arrow-left, .bannerslider .las.la-arrow-right{align-items: center; display: flex; justify-content:center; border: 1px solid #fff; color: #fff;}
.bannerslider .las.la-arrow-left{left: inherit; right: 73px;}
.bannerslider .las.la-arrow-right{right:12px;}

.slider-nav {
  margin: auto;
}
.slider-nav .slick-track{width: 100%!important; background: #fff; padding: 5px; padding-left: 0;transform: translate3d(0px, 0px, 0px)!important;}
.slider-nav .slick-slide{width: 50%!important; border: 5px solid #fff;}

.slider-nav .slick-slide img {
    width: 100%;
    height: 150px;
    object-fit: cover;
}
.slider-nav .slick-slide a{height: 150px} 


.thumbbox{background:#000; color:#fff; position:relative; line-height:normal;}
.thumbbox a{color: #fff;}
.callout__temp-title {
    color: #ffffff;
	font-family: 'Open Sans', sans-serif;
    font-size:30px;
    font-weight: 700;
    font-style: normal;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%) scale(1);
    -ms-transform: translateX(-50%) translateY(-50%) scale(1);
    transform: translateX(-50%) translateY(-50%) scale(1);
    opacity: 1;
    -webkit-transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
    -o-transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
    transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
    max-width: 70%;
    width: 100%;
    line-height: 1.25;
}
.callout__temp-title span{display:block; font-weight:400; font-size:18px; margin-top: 10px;}
.thumbbox:hover .callout__temp-title {
    -webkit-transform: translateX(-50%) translateY(-50%) scale(0);
    -ms-transform: translateX(-50%) translateY(-50%) scale(0);
    transform: translateX(-50%) translateY(-50%) scale(0);
    opacity: 0;
    -webkit-transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
    -o-transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
    transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
}


.thumbcaption{
   position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(140,105,78,0.6);
    padding: 2rem;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0;
    -webkit-transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
    -o-transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
    transition: all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);
	z-index:9;
}
.thumbbox:hover .thumbcaption{
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    -webkit-transition: all 0.4s 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
    -o-transition: all 0.4s 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
    transition: all 0.4s 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
}
.callout__title {
    color: #ffffff;
	font-family: 'Open Sans', sans-serif;
    font-size:30px;
    font-weight: 700;
    font-style: normal;
    margin-bottom: 1.5rem;
}
.callout__title span{font-size:18px; display: block; font-weight: 400; margin-top:10px;}
.callout__link {
    color: #ffffff;
    font-weight: 600;
    position: relative;
    font-size: 0.9375rem;
}
.callout__link::after {
    content: '>';
    margin-left: 0.33rem;
    -webkit-transform: translateY(1px);
    -ms-transform: translateY(1px);
    transform: translateY(1px);
}

.squaregrid {padding-bottom: 100%; position: relative;}
.squaregrid img{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity:.6;}



.list{margin: 0;padding: 0;list-style: none;font-size: 14px;}
.list li{margin-bottom: 10px;display: flex;column-gap: 20px;}
.list li:before{font-family: 'Line Awesome Free';display: flex;content: '\f00c';color: #fff;font-size: 20px;font-weight: 700; right:0;}

.verticalbox{position:relative;}
.verticalbox:after{position:absolute; content:''; bottom:-3px; height:110px; right:-1px; width:1px; background:#000;}
.verticalbox img{opacity:0; margin-bottom:-3px;}
.verticalbox span{font-size:24px; transform: rotate(270deg); position:absolute; color:#000; bottom:200px; left:0; right:0;}
.verticalbox:hover img{opacity:1;}
.verticalbox:hover span{color:#fff; bottom:0; top:50%; transform: translate(0); text-align:center;}
.bg-warning{background-color:#8c694e!important;}
.bg-info{background-color:#182525!important;}
.pattern{background-image: url("images/pattern.png");}

.list-group{line-height:50px; list-style:none;}

.socialbox a{color: #212529; font-size: 20px; margin: 0 3px; border-radius: 50px; border:2px solid #212529; padding: 9px; display: inline-flex;}
.socialbox a:hover{background:#fff; color:#000; border:2px solid #fff;}

.contact-bg{position:relative; background-image:url("../images/building.png"); width:100%; background-position:bottom center; background-repeat: no-repeat;}
.popup .form-floating{color: #000;}


.beforeslider{position: relative;}
.beforeslider .slick-slide img{width:100%;}
/*.beforeslider .slick-slide{padding:60px 120px;}*/
.beforeslider .slick-slide i{display:block; color:#f1f1f1;}
.beforeslider .la-arrow-left, .beforeslider .la-arrow-right{position: absolute; top:50%; transform: translate(0, -50%); font-size:35px; color:#9d9d9c; cursor: pointer; z-index:9; background:none;}
.la-arrow-left:hover,.la-arrow-right:hover{color:#000;}
.la-arrow-left{left:-40px;}
.la-arrow-right{right:-40px;}


#comparison {
    width: 100%;
    padding-bottom: 500px;
    overflow: hidden;
    position: relative;
    z-index:9999;
}
figure {
    position: absolute;
    background-image: url(../images/banner.jpg);
    background-size: cover;
    font-size: 0;
    width: 100%;
    height: 100%;
    margin: 0;
}
#handle {
    position: absolute;
    height: 50px;
    width: 50px;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    z-index: 1;
}
#divisor {
    background-image: url(../images/banner.jpg);
    background-size: cover;
    position: absolute;
    width: 50%;
    box-shadow: 0 5px 10px -2px rgb(0 0 0 / 30%);
    bottom: 0;
    height: 100%;
}

input[type=range] {
    -webkit-appearance: none;
    -moz-appearance: none;
    position: absolute;
    top: 50%;
    left: -25px;
    transform: translateY(-50%);
    background-color: transparent;
    width: calc(100% + 50px);
    z-index: 2;
}
input[type=range]:focus, input[type=range]:active {
  border: none;
  outline: none;
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  border: none;
  height:32px;
  width:32px;
  background-image: url(../images/slider.png);
}

input[type=range]::-moz-range-track {
  -moz-appearance: none;
  height: 15px;
  width: 100%;
  background-color: transparent;
  position: relative;
  outline: none;
}

.embed {
    overflow: hidden;
    padding-block-start: 100%;
    position: relative;
    margin-bottom: 30px;
}

.embed:before {
    content: "Click to Zoom";
    position: absolute;
    bottom: 10px;
    right: 0px;
    color: #000000;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    z-index: 1;
    opacity: 0;

}


.embed > * {
    height: 100%;
    left: 0;
    object-fit: cover;
    position: absolute;
    top: 0;
    width: 100%;
    }
.embed a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}












.footer{font-size:14px; font-weight:400; color:#626262; line-height:30px; background:#000;}
.footer a{display:inline-block; margin:0 10px; color:#626262; font-size:18px;}
.footer a:hover{color:#fff;}
.social a{font-size:25px; color:#626262; margin:0 5px;}




.form-control{background:0!important; font-size:16px; padding:0; text-transform:uppercase; height:54px; margin-bottom:5px; border-radius:0;}
.form-control:focus{border-color: #2d9874; box-shadow: none; background-color:#eaf5f1; text-transform:none;}
.error{font-size: 13px; display: block; color: #f70000; margin-top: 5px;}
textarea.form-control{height:120px; padding-top:10px; resize:none;}
.form-floating>label{font-size:14px; padding-left:0;}

.form-control::place-holder{text-transform:none;}
.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
  text-transform:none;
}

.form-control::-ms-input-placeholder { /* Microsoft Edge */
  text-transform:none;
}
#newsletterform .form-control{border:0; background:#fff!important; font-size:14px; padding:0 10px; height:60px; font-style: italic; text-transform: none;}
#newsletterform button{padding:17px 40px;}

.leftthumb{position: absolute; max-width:64vw; top:100px; left: 0;}
.rightshadow{box-shadow: inset -20em 0 0 #8c694e;}
.pt-150{padding-top:60px;}
.mb-130{margin-bottom:100px;}
.homerightbox{padding:80px;}

.rightline{border-right:30px solid #fff;}

.formbox{position:relative; background:rgba(255, 255, 255, .8); border-radius:10px 10px 0 0;}
.formbtmbox{border-radius:0 0 10px 10px; font-size:18px;}
.container{position:relative; z-index:9;}
/*.breakPoint{position: relative;top: -60px;visibility: hidden;}*/

.container.why{max-width:100%!important;}
.why-text{padding-left: calc(((100% - 1140px) / 2) + -89px);}

.container.homeabout{max-width:100%!important;}
.homeabout-text{padding-right: calc(((100% - 1140px) / 2) + -89px);}
.boxlogo img{max-width:80px; position:absolute; top:20px; right:20px;}
.leftlogo{position:relative; display:flex; align-items:center; column-gap:20px;}
.leftlogo:before{content:''; background:url(images/logo.png); width:80px; height:70px; background-size:cover;}
.shadowtext{text-shadow: 0px 0px 3px rgba(0,0,0,0.5);}
.homerightbox{padding:5vw;}

.nav-link{color:#ffffff;}
.nav-link:focus, .nav-link:hover{color:#ffffff;}



.nav-tabs{border: 0;
	font-family: 'Playfair Display', serif;
    font-size: calc(16px + (30 - 16) * ((100vw - 300px) / (1440 - 300)));
    align-items: center;
    justify-content: center;
    padding: 20px 0;
}
.nav-tabs .nav-item{margin:0 1.5vw;}
.nav-tabs .nav-link{padding: 15px 0; border: 0; color: #333333; border: 0; border-bottom: 2px solid transparent;}
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    color: #8c694e;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #8c694e;
    background-color: transparent;
	border-color:#8c694e;
}
.fmenu{
    list-style:none;
    margin:0;
}
.fmenu li{
    display:inline-block;
}
.fmenu li a {
    display: block;
    border-right: 2px solid #626262;
    line-height: 18px;
    margin: 0;
    padding: 0 10px;
}
.fmenu li:last-child a {
    border-right: none;
}

@media (min-width:1600px){
	.container-fluid{width:80%!important;}
	.pt-150{padding-top:150px;}
	.mb-130{margin-bottom:130px;}
	.leftthumb{max-width:54vw; top:150px;}
	.full-width{margin-left: calc(50% - 50vw + 40px); margin-right: calc(50% - 50vw + 40px);}
	.homeslider .las.la-arrow-left{left: calc(50% - 128px);}
	.mapbox{width:100vw; height:100%;}
	
}

@media (max-width:1199.98px){
	.rightline{border-right:0;}
	.pt-150{padding-top:0;}
	.mb-130{margin-bottom:0;}
	.projectslider .las.la-arrow-right{right:30px; border:1px solid #fff; color:#fff;}
	.snav{ border: none; padding: 10px; width: 40px; cursor: pointer; z-index: 998!important; background: none;}	
	.snav i{display:block; background:#fff; height:2px;}
	.snav i+i{margin-top:5px;}
	.snav:focus{outline: none;}
	.snav.openbtn i:nth-child(1){
	-moz-transform: rotate(45deg) translateX(5px) translateY(5px);
	-webkit-transform: rotate(45deg) translateX(5px) translateY(5px);
	-o-transform: rotate(45deg) translateX(5px) translateY(5px);
	-ms-transform: rotate(45deg) translateX(5px) translateY(5px);
	transform: rotate(45deg) translateX(5px) translateY(5px);}
	.snav.openbtn i:nth-child(2){opacity:0;}
	.snav.openbtn i:nth-child(3){
	-moz-transform: rotate(-45deg) translateX(5px) translateY(-5px);
	-webkit-transform: rotate(-45deg) translateX(5px) translateY(-5px);
	-o-transform: rotate(-45deg) translateX(5px) translateY(-5px);
	-ms-transform: rotate(-45deg) translateX(5px) translateY(-5px);
	transform: rotate(-45deg) translateX(5px) translateY(-5px);}
	.btn-lg {padding: 14px 20px; font-size:16px;}
	h1, h2{font-size:40px;}
	#nav {display:none; position:absolute; background:#8c694e; top:0; right:0; left:0;}
	.access ul {display: flex;align-items: center;justify-content: center;flex-flow: column;height: 100vh;gap: 8vh;}
	.access ul li {margin: 0;}
	.access ul li a {font-size: 24px; color:#fff; border-right:0;}
	.access ul li a img {display: inherit;margin:0 0 0 5px;}
	.access li a:hover, .access li a.active {color: #333;}
	.leftthumb{position:relative; top:0; max-width:100%;}
}

@media (max-width:991.98px){
	.homerightbox {padding: 40px;}
	.mb-130{margin-bottom:0;}
	.pt-150{padding-top:0;}
	.btn-lg{padding:16px 20px;}
	h3{font-size:30px;}
	.verticalbox span{transform: inherit; text-align: center; color:#fff;}
	.verticalbox:after{display:none;}
	.verticalbox img {height: 450px; object-fit: cover; opacity:1;}
	
}

@media (max-width:767.98px){
	h2{font-size:24px;}
	h4{font-size:20px;}
	.banner {min-height:350px;}
	.banner h1 span{font-size:20px;}
	.access ul{gap:4vh;}
	.access ul li a {font-size:20px;}
	.footer a{font-size:14px;}
	#newsletterform .form-control{height:40px;}
	#newsletterform button {padding: 10px 20px; font-size:14px;}
	.logo img {max-width: 100px;}
	.innerbanner img{height: 70px; object-fit: cover; width: 100%;}
	.innerbanner {height: 64px;}
}

@media (max-width: 575.98px) {
	.innerbanner img{height:50px;}
	body{font-size:13px; line-height:20px;}
	.logo img {max-width: 60px;}
	.shrink .logo img {max-width: 60px;}
	h3{font-size:24px;}
	h5{font-size:16px;}
	.btn-lg {padding: 12px 12px; font-size: 12px;}
	.banner {min-height:250px; padding:0;}
	.banner h1{font-size:24px;}
	.banner .btn{font-size:10px; padding:10px;}
	.btn i{font-size:15px;}
	.form-control {height:40px;}
	.header .btn{padding:8px 10px; font-size:10px;}
	.footer{line-height:24px; font-size:12px;}
	.footer a{margin:0 4px;}
	.innerbanner span{font-size:16px; padding:10px;}
	.lead{font-size:14px;}
	.list-group{line-height:30px;}
	.callout__temp-title{font-size:16px;}
	.callout__temp-title span{font-size:14px;}
	.form-floating>.form-control, .form-floating{height:40px;}
	.mapbox{height:230px;}
	.socialbox a{padding:7px; font-size:16px;}
	.bannerslider .slick-arrow{padding: 0;}
	.bannerslider .las.la-arrow-left { right: 61px;}
.innerbanner {height: 44px;}
}

.col-count-2{column-count: 2; column-gap: 25px;}
.col-count-2 p:nth-child(1)::first-letter {
	font-size: 6vw;
	float: left;
	margin-right: 10px;
	line-height: 6vw;
}

