@import url('bootstrap.min.css');
@import url('font-awesome.min.css');


/*-------------------------------------------------------------------------------
  1. Global
-------------------------------------------------------------------------------*/

/* 1.1 General */
html{ font-size:75%; -webkit-font-smoothing:antialiased; }
body{ font-family:'Proxima Nova Rg', sans-serif; font-weight:normal; font-size:1em; line-height:1.65; color:#747474; background:#fff;}

::selection{ background-color:#c5a47e; color:#fff; }
-webkit-::selection{background-color:#c5a47e; color:#fff; }
::-moz-selection{ background-color:#c5a47e; color:#fff; }

/* common classes */
.padLR40{padding:16px 80px!important;}
.alpha{padding:0!important;}
.bita{margin:0!important;}
.padT60{padding-top:60px;}
.marT100{margin-top:-162px;}
.autoMR{margin:0 auto;}
.pad50{padding: 120px 15px 0;}
.padLR{padding:0 15px!important;}
.relative{position:relative; display:block;}
.abslute{position:absolute;  right:0;padding-left: 50px; top:10%;}
.padTB80{padding:80px 0;}
.rel{position: relative;}
.marB20{margin-bottom:20px!important;}

/* 1.2 Typography */
h1,
.h1{font-weight:400; font-size:8vmin; line-height:1.2; letter-spacing:0.32em; text-transform:uppercase; color:#3d3d3d; }
h2,
.h2{ 
  font-weight: 400;
  font-size: 48px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: #3d3d3d;
}

h3,
.h3{
  font-size: 24px;
  line-height: 1.1;
  color:#4D4D4D;
}

h4,
.h4{
  font-size: 1.125em;
  line-height: 1.35;
  font-weight: normal;
  color:#3d3d3d;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

h1 a,
.h1 a,
h2 a,
.h2 a,
h3 a,
.h3 a,
h4 a,
.h4 a{
  color:inherit;
}

h1 a:hover,
.h1 a:hover,
h2 a:hover,
.h2 a:hover,
h3 a:hover,
.h3 a:hover,
h4 a:hover,
.h4 a:hover{
  text-decoration: none;
}

p{
  margin-bottom: 1.6em; font-size:14px; color:#4D4D4D;
}

b, strong{
}

ul{
  list-style: none;
  padding-left: 0;
}

a {
  color:#c5a47e;
  -webkit-transition: all .3s ease-out;
       -o-transition: all .3s ease-out;
          transition: all .3s ease-out;
}

a:hover,
a:focus {
  color:#000;
  outline: none;
  text-decoration:none;
}

a:focus{
  text-decoration: none;
}
.mb0{margin-bottom:0 !important;}
.btn{-webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
     transition: all .3s ease-out;}

.bg-gray{background:#f1f2f2;}
img{max-width:100%}
/*===home=============*/
/* header */

header{display:block; min-height:120px;}
.brand-panel{
  margin-top: 20px;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

.brand{
  display: inline-block;
  font-weight: 700;
  font-size:4vmin;
  line-height: 10px;
  color: #3d3d3d; width:45%;
}
.brand-menu{
  display: inline-block;
  font-weight: 700;
  font-size:4vmin;
  line-height: 10px;
  color: #3d3d3d; width:15%;
}

.brand:hover,
.brand:focus{
  color: #3d3d3d;
  text-decoration: none;
}

.brand-name{
  position: absolute;
  z-index: -1;
  bottom: -0.4em;
  right:-0.37em;
  font-weight: 700;
  font-size: 8.75em;
  line-height: 10px;
  opacity: 0.05;
}


#menu-toggle{position:fixed;top:30px;right:30px; z-index:1050;}
.lines-button{background:none;border:none;width:32px;padding:0;transition:.3s;cursor:pointer;user-select:none;outline:none !important;}
.lines-button:hover{opacity:1;}
.lines-button:active{transition:0;}
.lines{display:inline-block;width:100%;height:1px; background:#1d1e21; transition:0.3s;position:relative;border-radius:4px !important;}
.lines:before,.lines:after{display:inline-block;width:100%; height:1px; background:#1d1e21;transition:0.3s;position:absolute;left:0;content:'';border-radius:4px !important;-webkit-transform-origin:0.28571rem center;transform-origin:0.28571rem center}
.lines:before{top:.57rem}
.lines:after{top:-.57rem}
body.menu-open #menu-toggle{right:50px;}
body.menu-open .lines-button{-webkit-transform:scale3d(0.8, 0.8, 0.8);transform:scale3d(0.8, 0.8, 0.8)}
body.menu-open .lines-button .lines{background:transparent}
body.menu-open .lines-button .lines:before,
body.menu-open .lines-button .lines:after{-webkit-transform-origin:50% 50%; transform-origin:50% 50%; top:0; width:4rem; background-color:#f1f2f2;}
body.menu-open .lines-button .lines:before{-webkit-transform:rotate3d(0, 0, 1, 45deg);transform:rotate3d(0, 0, 1, 45deg)}
body.menu-open .lines-button .lines:after{-webkit-transform:rotate3d(0, 0, 1, -45deg);transform:rotate3d(0, 0, 1, -45deg)}
.menu-primary-menu-container{position: relative; overflow: hidden;}
body.menu-open { overflow: hidden;}
#site-navigation{position:fixed; top:0px; bottom:0; left:0; width:0px; overflow:auto;  background-color:#000; z-index:1030;
  -moz-transition:all 0.4s ease-in-out;
  -o-transition:all 0.4s ease-in-out;
  -webkit-transition:all 0.4s ease-in-out;
  transition:all 0.4s ease-in-out}

#site-navigation ul{margin:0; padding:0; list-style:none; width:100%;}
#site-navigation .site-menu{padding-top:110px;}
#site-navigation .site-menu>li{}
#site-navigation .site-menu li{padding: 0;}
#site-navigation .site-menu li a{font-weight:bold;text-decoration:none; color:#808285; font-size:64px; line-height:1.2em;text-transform:lowercase;}
#site-navigation .site-menu li a:hover{color:#fff;text-decoration:none;}
#site-navigation .site-menu li a:hover:after{display: inline-block;margin: 0 0 15px 20px;height: 1px;content: " ";background-color: #999;width: 140px;}
#site-navigation .copyright{position:absolute;bottom:30px;left:70px;font-size:11px;}
body.menu-open #site-navigation{width:100%;}

.social-list{
  margin-bottom: 3.5vmin; padding-bottom:30px!important;
}

.social-list li{
  font-size: 20px;color: #fff; padding:5px; display:inline-block;
}

.social-list a{
   display: inline-block;font-size: 20px;color: #fff; padding:0;
}

.social-list a:hover{ color:#808285;}
.social-list-about {
    margin-bottom: -72px;
}

.social-list-about li{
  margin-top: 1.8vmin; 
}
.social-list-about li a{
  cursor:pointer;display:inline-block;
}

.social-list-about .fa{
  font-size: 3.4vmin;
  color: #c5c4c2;
}

.social-list-about .fa:hover{
  color:#c5a47e;
  text-decoration: none;
}


.social-list {
    margin-bottom: 3.5vmin;
}
.social-icon{ display: inline-block;font-size: 20px;color: #fff; padding:5px;}
.social-icon a{color: #fff; text-decoration:none; cursor:pointer;}
.social-icon a:hover{color: #fff; text-decoration:none;}
.vertical-panel,
.vertical-panel-content{ position: absolute; left:-20px; bottom: 50%; text-align:center;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s; }
.vertical-panel,
.vertical-panel-content p{
 font-size:12px; color:#808285; font-weight:bold;  margin: 0px -8px; letter-spacing:2px;

}
.vertical-panel-content-project{
  position: absolute;
  right:-120px;
  top:120px;
  text-align: center;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s; z-index: 4; transform: rotate(-90deg);
}
.vertical-panel,
.vertical-panel-content-project h1{
 font-size:90px; color:#000; font-weight:bold;margin: 0px -8px; letter-spacing:2px; font-weight:bold; text-transform:capitalize;

}

.vertical-panel{
  z-index: 3;
  height: 10000px;
  background-color: #f6f5f3
}

.vertical-panel-content{
  z-index: 4; transform: rotate(-90deg);border-bottom: 1px solid #808285;
}

.vertical-panel-info{
  margin-bottom: 1.5vmin;
}

.vertical-panel-info .line{
  height: 20vmin;
  width: 1px;
  margin:15px auto 0;
  background-color:#d9d5ce;
}

.vertical-panel-title{
  font-weight: 600;
  font-size: 10px;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: 1em;
  color: #3d3d3d;
  position: relative;
  left: -6px;
  margin:0 auto;
  width: 1px;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
   -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
}

/*=======main content============*/
.layout{ position: relative; overflow: hidden; }

.home-title{
  margin-top: 0;
    margin-bottom:30px;
    font-size: 72px;
    font-weight: bold; color:#000; letter-spacing:-1px; text-transform:capitalize;    line-height: 30px;
}
.home-title span{color:#808285; font-size:14px; letter-spacing:1px;line-height:70px;}
.home-info{padding-left:120px; }
.home-info p{color:#808285; font-size:14px; line-height:22px;}
.home-info a{ margin-top:20px; }
.border{ display:inline-block; vertical-align:middle; }
.line-more{ position: relative; font-size:1.2em; color:#1d1e21; font-weight:bold; text-transform:uppercase; letter-spacing:3px; display:inline-block;}
.line-more:hover{color:#603813}
.line-more::after{content:''; position:absolute; border-bottom:1px solid #808285; width:160px; left:100%; top:11px; margin-left:20px;}


.section-content{
  margin-top: 20px;
}
/*======footer=================*/
footer{padding: 40px 0;}
.author-link{
  color: #808285; font-size:12px; font-weight:bold; text-transform:uppercase; letter-spacing:1px;
}

.author-link:hover{
  text-decoration: none;color: #900;
}
.text-right-md{
    text-align: right;color: #808285; font-size:12px; font-weight:bold; text-transform:uppercase; letter-spacing:1px;
  }
.disclaimer-text{ color: #808285; font-size:12px; font-weight:bold; text-transform:uppercase; letter-spacing:1px; }
.disclaimer-text a{color: #808285;}
.disclaimer-text a:hover{color:#603813;}

/*===================about us===================*/
/*------lines------------*/
.page-lines{ position:absolute; z-index: -1; left: 0; top:0; width: 100%; height: 100%; }
.page-lines .col-line{ padding: 0;}
.page-lines .line{ position: absolute; left: 0; width: 1px; background-color:#e3e4e5; height:5000px;}
.page-lines .line-menu{ position:absolute; left: 0; width: 1px; background-color:#1d1d1e;  height:5000px;}
.page-lines .col-line:last-child .line:last-child{ left: auto; right: 0; }

.about-title h1{
  margin-top: 0;
    margin-bottom:0px;
    font-size: 85px;
    font-weight: bolder; color:#000; letter-spacing:-1px;text-transform: inherit;
}
.about-title h1 span{color:#fff;}
.about-title p{font-size: 20px!important;color:#58595b; letter-spacing:-1px;line-height:32px; font-weight:lighter;    margin-bottom: 50px;letter-spacing: 0px;}
.about-title-border{ border-bottom: 1px solid #808285; width:90%; display:inline-block;  vertical-align:middle; margin-right:20px;}
.padL8{padding-left:8px;}
.line-height50{line-height:110px;}
.padL0{padding-left:0;}
.padT50{padding-top:50px;}
.padTB30{padding:30px 0 50px 0;}
.overflow-x{margin: 0;padding: 0;overflow-x:scroll!important;}
.width-scroll{width:140%;}
.text-white{color:#fff; font-size:90px; font-weight:bolder; text-transform:none;letter-spacing:0px; margin:0;}
.width-scroll .home-title{line-height:90px; font-size:90px;text-transform:none;}
.width-scroll p{line-height:32px; font-size:20px;}
.width-scroll .home-title-72{line-height:80px; font-size:72px; font-weight:bolder; text-transform:capitalize;letter-spacing:0px; color:#000;}
.width-scroll .home-title-72 span{ margin-top: 0;margin-bottom:30px;font-size: 72px;font-weight: bold; color:#000; letter-spacing:-1px; text-transform:capitalize;line-height: 55px; position:relative;}
.width-scroll .home-title-72 span::after{content:""; border-bottom:1px solid #000; width:200px; height:2px;position:absolute; padding-top:40px; margin-left:100px;}
.text-white-right{text-align: right;position: absolute;right:300px;}

/*=============projects=========================*/
.residential{display:block; padding:0; margin:40px 0;}
.residential h3{margin:0; color:#000; font-size:24px; text-transform:uppercase; font-weight:bold; letter-spacing:1px;    line-height: 32px;}
.residential p{margin:0;}
.marTB30{margin:50px 0!important;}
.col-sm-6.abslute{text-align: center;}
.col-sm-6.abslute img{ max-width:450px;}

/*======================career=======================*/
.career-title{margin-top: 0;margin-bottom:30px;font-size: 90px;font-weight: bold; color:#000; letter-spacing:-1px; text-transform:capitalize;    line-height: 55px;}
.career-title span{color:#808285; font-size:14px; text-transform:uppercase; letter-spacing:1px; }

/*==================project list================*/
.project{ width:100%; overflow: auto; margin:50px 0 25px;}
.project-list{  margin:25px 0 0;}
.project-list .image-panel{width:1140px;}
.project-list h3{margin: 0;color: #000;font-size: 24px;text-transform: uppercase;font-weight: bold;letter-spacing: 1px;line-height: 32px;}
.project-list p{font-size: 14px!important;color:#231f20; letter-spacing:-1px;line-height:30px; font-weight:lighter; font-weight:bold;margin-bottom: 0px;letter-spacing: 0px;}
.project-list p::before{content:url(../img/image-6.png);margin-right: 10px;vertical-align: -webkit-baseline-middle; }
.project-list .map{max-width:100%;}
/*=====================career==================*/
.about-title a {font-size: 20px!important;color: #a1202c;letter-spacing: 0;line-height: 32px;font-weight: bold;  cursor:pointer;}
.about-title a:hover {color: #231f20;}

/*===========enquiry=================*/

textarea {overflow: auto;}
form {padding: 0;margin: 0;}
.email {width: 100%;}
input[type='text'], [type='email'], select, textarea {background: #fff;border: none;color: #58595b;font-size:20px;font-weight:light;letter-spacing: 1px;margin: 0 0 20px 0;	padding: 15px;width: 100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;-o-box-sizing: border-box;box-sizing: border-box;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}

input[type='text']:focus, [type='email']:focus, textarea:focus {outline: none;padding: 15px;}
.message {float: none;}
#contact-form > label.radio-btn.email .checkmark{left:4px;}
.name {width: 100%;}
select {background: url('../img/arrow-down-32.png') no-repeat right; background-color:#fff;
  outline:none; -moz-appearance: none; -webkit-appearance: none;}
select::-ms-expand {display: none;}

.subject {width: 100%;}

.telephone {width: 100%;}

textarea {line-height: 150%;height: 150px;resize: none;width: 100%;}

::-webkit-input-placeholder {color: #474544;}
:-moz-placeholder {color: #474544;opacity: 1;}
::-moz-placeholder {color: #474544;opacity: 1;}
:-ms-input-placeholder {color: #474544;}

#form_button {background: none;border: solid 2px #474544;color: #474544;cursor: pointer;display: inline-block;font-size: 0.875em;font-weight: bold;outline: none;padding: 20px 35px;text-transform: uppercase;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}

#form_button:hover {background: #474544;color: #F2F3EB;}

/* Gallery Page */
#work-container .item-col{margin-top:10px; text-align:center;}
#work-container .item-col img{max-height:240px;}

@media screen and (max-width: 768px) {
  #container {margin: 20px auto;width: 95%;}
}

@media screen and (max-width: 480px) {
  h1 {font-size: 26px;}
  .underline {width: 68px;}
  #form_button {padding: 15px 25px;}
}

@media screen and (max-width: 420px) {
  h1 {font-size: 18px; }
  
  .icon {height: 35px;width: 35px; }
  
  .underline {width: 53px; }
  
  input[type='text'], [type='email'], select, textarea {font-size:14px;}
  .radio-btn{ font-size:14px;}
}

/* Customize the label (the container) */
.radio-btn {display:inline-block;position: relative;padding-left: 45px;margin-bottom:0px;cursor: pointer;font-size: 20px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;width:49%;line-height: 20px; color:#000; text-transform:uppercase; letter-spacing:2px;}
/* .radio-btn:hover {background-color:#fff;} */

/* Hide the browser's default radio button */
input[type="radio"], input[type="checkbox"] {display: none;}
/* Create a custom radio button */
.checkmark {position: absolute;top: 1px;left: 0;height: 16px;width: 16px;border:1px solid #b7b7b7;border-radius: 0%;}
.checkmark:hover {position: absolute;top: 0;left: 0;height: 16px;width: 16px;border:1px solid #b7b7b7;border-radius: 0%;background-color:#fff;}

/* On mouse-over, add a grey background color */
.radio-btn:hover input ~ .checkmark {background-color: #999;}

/* When the radio button is checked, add a blue background */
.radio-btn input:checked ~ .checkmark {background-color: transparent;}
/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {content: "";position: absolute;display: none;}
/* Show the indicator (dot/circle) when checked */
.radio-btn input:checked ~ .checkmark:after {display: block;}

/* Style the indicator (dot/circle) */
.radio-btn .checkmark:after {top: 1px;left: 1px;width: 12px;height:12px;border-radius: 0%;background: #b7b7b7;}
.mode{font-size: 20px;font-weight: lighter;    margin-bottom: 30px;}
.submit-btn{border:1px solid #a4a4a4; border-radius:0; color:#000; font-size:20px; padding:15px 30px; width:49%; font-weight:bold; margin-top:50px; background-color:#fff; text-transform:uppercase; text-align:center;}
.submit-btn:hover,
.submit-btn:focus{ text-decoration:none; background:#a31e28; border-color:#980e19; color:#fff;}


.mysonary-slide .row{ margin:0 -10px;}
.col3 img {max-width: 363px;}
/* .item {width: 383px; text-align: center; padding:0 10px;float: left;margin: 10px 0; cursor:pointer; position:relative;} */
.item-detail{position: absolute;top: 0;left: 10px;right: 10px;height: 100%; background:rgba(256, 256, 256, 0.7); transition: all 0.5s ease-in-out; opacity:0; transform:scale(1);}
/* .detail{display:block; position:absolute; top: 50%; left:10%; right:10%; margin-top: -50px;transition: all 0.5s ease-in-out; } */
.item-detail h1{font-size: 24px; color:#414042; letter-spacing:1px; text-transform:uppercase; display:block; font-weight:bold; text-align:center;}
.item-detail p{font-size: 16px; line-height: normal; color:#414042; letter-spacing:1px;text-transform:uppercase;display:block;font-weight:bold; text-align:center;}
.border-detail{ display:block; border:1px solid #414042; width:200px; margin:0 auto; margin-bottom:10px; }
/* .item:hover .item-detail {opacity:1; transform:scale(1);} */


.page-image{margin-right:30px; margin-top:10px;}
#contact-form .text-danger{ position: absolute; bottom:2px;}
#contact-form > div{ position: relative;}

.image-panel{ position: relative;}

.image-panel h2{ position: absolute; top:10px; left:0; right:0;  text-align: center; font-size:20px; font-weight: bold; letter-spacing:2px;}
.image-panel h3{ position: absolute; top:50px; left:50px;  text-align: center; font-size:20px; font-weight: bold; letter-spacing:2px; color:#FFF;}
.image-panel .property-list .list{position: absolute; top:10%;}
.image-panel .property-list .list.left{left:50%; }
.image-panel .property-list .list.right{right:50%;}
.image-panel .property-list .list li{ position:absolute; padding-left:20px; font-size:14px; font-weight:bold; text-transform: uppercase}
.image-panel .property-list .list li::after{ content:''; position:absolute; height:10px; width:10px; border-radius:50%; background-color:#FFF; border:2px #000 solid; left:0; top:3px;}
.image-panel .property-list .list li a{display: inline-block; white-space:nowrap; color:#000;}
.image-panel .property-list .list.left li{padding-left:0; padding-right:20px;}
.image-panel .property-list .list.left li::after{left:inherit; right:0; }
.image-panel .property-list .list li.item1{top:40px; left:96px;}
.image-panel .property-list .list li.item1 a{ position: relative; top:-7px;}
.image-panel .property-list .list li.item2{top:68px; left:87px;}
.image-panel .property-list .list li.item3{top:101px; left:256px;}
.image-panel .property-list .list li.item4{top:106px; left:75px;}
.image-panel .property-list .list li.item4 a{ margin-top:16px; margin-left:-12px;}
.image-panel .property-list .list li.item5{top:205px; left: 33px;}
.image-panel .property-list .list li.item5 a{ position: relative; top:-4px;}
.image-panel .property-list .list li.item6{top:224px; left:18px;}
.image-panel .property-list .list li.item6 a{margin-top:6px;}
.image-panel .property-list .list li.item7{top:110px; right:37px;}
.image-panel .property-list .list li.item8{top:228px; right:23px;}
.image-panel .property-list .list li.item9{top:210px; right:66px;}
.image-panel .property-list .list li.item10{top:283px; right:54px;}
.image-panel .property-list .list li.item11{top:341px; right:74px;}
.image-panel .property-list .list li.item11 a{ position: relative; top:-8px;}
.image-panel .property-list .list li.item12{top:355px; right:71px;}
.image-panel .property-list .list li.item12 a{ margin-top:8px;}
.image-panel .property-list .list li.item13{top:390px; right:109px;}
.image-panel .property-list .list li.item14{top:428px; right:131px;}
.image-panel .property-list .list li.item15{top:85px; left:87px;}

.image-panel .property-list .list.left li .object-info{ left:inherit; right:20px; margin-right:-6.2em;  margin-left:0;}
.object-info{position:absolute; display:none; z-index:100; left:20px; bottom:40px; width: 150px; margin-left:-6.2em; padding:12px; border:0; background-color: rgba(0,0,0,0.9); border-radius: 4px;}
.property-list .list li:hover .object-info{ display: block; }
.object-info:before{
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -16px;
  width: 0;
  height: 0;
  border: 16px solid transparent;
  border-top: 14px solid rgba(0,0,0,0.9);
}
.object-content{ padding: 0;}
.object-content img{ width:100%;}

.contact-address{ font-size:20px; margin-top:20px;}
.contact-address h3{font-size:24px; color:#000; text-transform:uppercase; font-weight:bold; letter-spacing:2px; margin:0;}
.contact-address p{ font-size:20px;}
.contact-address p a{ color:#000;}
.contact-address p a:hover{ color:#c5a47e;}
.contact-address .info{padding-left:0; margin-left:-8px;}

#home-container{ margin-top:50px; margin-left:-120px; margin-right:-160px; width:auto;}
#home-container .item{ text-align:center; margin: auto; max-width:360px; height:540px; padding-bottom:120px;}
#home-container .item .detail{position:absolute; bottom:0px; left:0; width:100%;}
#home-container .item .item-detail{ opacity:0; background: none;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
     transition: all .3s ease-out;}
#home-container .item .col-about-img{opacity:.6; height:430px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
     transition: all .3s ease-out;}
#home-container .item .col-about-img img{ width:100%; display: block; height:300px;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
     transition: all .3s ease-out;}
#home-container .center .item .item-detail{ opacity:1;}
#home-container .center .item .col-about-img{ opacity:1;}
#home-container .center .item .col-about-img img{height:410px; opacity:1;}

/* OWL Style */
//.owl-controls {}
.owl-controls .owl-dots{bottom:60px; position:absolute; right:0px; text-align:center; width: 100%;}
.owl-controls .owl-dots .owl-dot {border:solid 1px #fff; border-radius:50%!important; display:inline-block; height:12px; margin:0 3px; width:12px; }
.owl-controls .owl-dots .owl-dot.active { opacity: 1; background:#FFF;}
//.owl-carousel .owl-controls .owl-nav { }
.owl-carousel .owl-controls .owl-nav .owl-prev,
.owl-carousel .owl-controls .owl-nav .owl-next { background: url("../img/arrow-left.png") no-repeat;  color:#fff; font-size:0; height:43px; margin-top:-21px; opacity:0.75; position:absolute; text-indent:-999999px; top:50%; margin-top:-80px; width:32px; height:32px; }
.owl-carousel .owl-controls .owl-nav .owl-prev { left:200px; }
.owl-carousel .owl-controls .owl-nav .owl-next { background-image:url("../img/arrow-right.png"); right:200px; }
.owl-carousel .owl-controls .owl-nav .owl-prev:hover,
.owl-carousel .owl-controls .owl-nav .owl-next:hover { opacity: 1; }








/*=====================navigation============*/
.navbar-default {
    background-color: transparent;
    border-color:none;
}
.navbar {border: none;}
.navbar-nav {
    float: right;
    margin: 0;
}
.navbar-default .navbar-nav>li>a {
    color: #777;
    font-size: 20px;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color:transparent;
}
.navbar-default .navbar-toggle {border-color:transparent;}
.navbar-toggle {
    position: relative;
    float: right;
    margin-right: 0;
    padding: 9px 10px;
    margin-top: 8px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
.navbar-toggle .icon-bar {
    display: block;
    width: 32px;
    height: 1px;
    border-radius: 0px;
}
.navbar-toggle .icon-bar+.icon-bar {
    margin-top: 7px;
}
.disclaimer h1 {font-size:40px;padding-bottom: 10px;letter-spacing: 3px;font-weight:bold;}
  .disclaimer p {font-size: 20px; line-height:26px; margin-bottom: 10px;}
  
  /*========================new css===================*/
  #home-container{ margin-top:50px; margin-left:-120px; margin-right:-160px; width:auto;}
#home-container .item{ text-align:center; margin: auto; max-width:360px; height:540px; padding-bottom:120px;}
#home-container .item .detail{position:absolute; bottom:0px; left:0; width:100%;}
#home-container .item .item-detail{ opacity:0; background: none;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
     transition: all .3s ease-out;}
#home-container .item .col-about-img{opacity:.6; height:430px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
     transition: all .3s ease-out;}
#home-container .item .col-about-img img{ width:100%; display: block;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
     transition: all .3s ease-out;}
#home-container .center .item .item-detail{ opacity:1;}
#home-container .center .item .col-about-img{ opacity:1;}
#home-container .center .item .col-about-img img{height:410px; opacity:1;}

.gmap{-webkit-filter: grayscale(100%);
  filter: grayscale(100%);}

/* OWL Style */
//.owl-controls {}
.owl-controls .owl-dots{bottom:0px; position:absolute; right:0px; text-align:center; width: 100%;}
.owl-controls .owl-dots .owl-dot {border:solid 1px #CCC; border-radius:50%!important; display:inline-block; height:12px; margin:0 3px; width:12px; }
.owl-controls .owl-dots .owl-dot.active { opacity: 1; background:#CCC;}
//.owl-carousel .owl-controls .owl-nav { }
.owl-carousel .owl-controls .owl-nav .owl-prev,
.owl-carousel .owl-controls .owl-nav .owl-next { background: url("../img/arrow-left.png") no-repeat;  color:#fff; font-size:0; height:43px; margin-top:-21px; opacity:0.75; position:absolute; text-indent:-999999px; top:50%; margin-top:-80px; width:32px; height:32px; }
.owl-carousel .owl-controls .owl-nav .owl-prev { left:200px; }
.owl-carousel .owl-controls .owl-nav .owl-next { background-image:url("../img/arrow-right.png"); right:200px; }
.owl-carousel .owl-controls .owl-nav .owl-prev:hover,
.owl-carousel .owl-controls .owl-nav .owl-next:hover { opacity: 1; }

/*=====================media query====================*/

@media screen and (max-width: 1024px) and (min-width: 768px) {
  .padL0 {padding-left: 15px;}
  .padT50 {padding-top: 0px;}
  .padL8 {padding-left:15px;}
  .line-height50 {line-height:0px;}
  .about-title-border{display:none;}
  .about-title h1 {font-size:50px; padding-bottom: 10px;}
  .mode {width: 100%;margin-bottom: 10px;}
  /* #container {width:770px; margin:auto;} */
  #menu-toggle {top: 40px;}
  header {min-height: 80px;}
  .page-image {margin-right: 0px; margin-bottom:20px; text-align:center}
  .page-image img{ max-width:400px; display:inline-block;}
  .radio-btn {padding-left: 25px;margin-bottom: 0px;font-size: 16px;}
  .submit-btn{margin-top: 30px;}
  #site-navigation .site-menu li a{ font-size:50px;}
  .col-sm-6.abslute img {max-width: 100%;}
  .col-sm-12.alpha{ padding-right:15px!important; padding-left:15px!important;}
  #contact-form{max-width:400px; margin: auto;}
  div.text-right-md.col-md-6 {margin-top:-18px;}
  .contact-address .info{ margin-left:0;}
  .font40{font-size:40px!important;}
  #home-container{ margin-left:0; margin-right:0;}
  .owl-carousel .owl-controls .owl-nav .owl-next{ right:20px;}
  .owl-carousel .owl-controls .owl-nav .owl-prev{ left:20px;}
  #work-container .item-col img{max-height:200px;}
  
}

@media screen and (max-width: 767px) {
   header {min-height: 50px;}
  .line-height50 {line-height:0px;}
  .about-title-border{display:none;}
  .about-title h1 {font-size:40px;padding-bottom: 10px;}
  .about-title p {font-size: 16px!important; line-height:21px; margin-bottom: 10px;}
  .padL0 {padding-left: 15px;}
  .padT50 {padding-top: 0px;}
  .padTB30 {padding: 0px;}
  footer {padding: 20px 0;}
  #container {width: 100%;}
  .page-image {margin-right: 0px; margin-bottom:20px;}
  .mode {width: 100%;margin-bottom: 10px;}
  .radio-btn {padding-left: 25px;margin-bottom: 0px;font-size: 16px;}
  .submit-btn{margin-top: 30px;}
  .alpha {padding: 15px!important;}
  .padL8 {padding-left:15px;}
  .residential {margin: 15px 0;}
  .abslute {    top:45%;}
  .col-sm-6.abslute img {max-width: 100%;}
  .padTB80 {padding: 20px 0;}
  .home-title {line-height: 0px;}
  .home-title span {line-height: 20px;}

  #container {width:auto; max-width:380px; margin:auto;}
  .item{width:100%;}
  .item .col3 img {max-width: 100%;}

  #site-navigation .site-menu{padding-top:50px;}
  #site-navigation .site-menu li a{ font-size:40px;}
  
  #contact-form{max-width:400px; margin: auto;}
  .contact-address h3{ font-size:20px;}
  .contact-address p{ font-size:18px;}
  .contact-address .info{ margin-left:15px;}
  #site-navigation > div:nth-child(2) > div > div.text-right-md.col-md-6 {margin-top:-18px;}
  .residential h3{ font-size:20px;}
  body.menu-open #menu-toggle{ right:20px;}
  .text-white-right{display:none;}
  .brand {width:100px;}
  .navbar-nav {margin: 0; }
}

@media (max-width: 991px) {
  .text-white-right{ display: none;}
  .brand {width:120px;}

  .navbar-collapse{ position:absolute; top:70px; left:0; width:100%; background-color:rgba(0,0,0,0.5); border: solid 1px #000!important; color:#FFF; z-index: 10; margin:0!important;} 
  .navbar-default .navbar-nav>li>a{ color:#FFF; text-align: right;}

}

@media (max-width: 767px) {
  .item-detail h1{font-size:18px; margin-bottom:5px;}
  .item-detail p{ font-size:14px;}
  .border-detail{ margin-bottom:5px;}
  .owl-carousel .owl-controls .owl-nav .owl-prev,
  .owl-carousel .owl-controls .owl-nav .owl-next{ width:26px; height:26px; background-size:100% 100%; margin-top:-50px;}
  .owl-carousel .owl-controls .owl-nav .owl-next{ right:120px;}
  .owl-carousel .owl-controls .owl-nav .owl-prev{ left:120px;}
  #home-container { margin-top:10px;  margin-left:-100px; margin-right:-100px; }
  #home-container .center .item .col-about-img img{ height:350px;}
  #home-container .item{ height:520px;}
  #home-container .item .detail{bottom:10px;}
  .abslute{ position: relative; }
  .submit-btn{ padding: 8px 15px; font-size:14px;}
  input[type='text'], [type='email'], select, textarea {font-size:16px;}
  .radio-btn{ font-size:16px;}

}

.modal {
  text-align: center;
  padding: 0!important;
}

.modal:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -4px;
}

.modal-dialog {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}