*{margin:0;padding:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
a,abbr,acronym,address,applet,b,big,blockquote,body,caption,center,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,font,form,h1,h2,h3,h4,h5,h6,html,i,iframe,img,ins,kbd,label,legend,li,object,ol,p,pre,q,s,samp,small,span,strike,strong,sub,sup,table,tbody,td,tfoot,th,thead,tr,tt,u,ul,var{margin:0;padding:0}
body {font-family: 'Rubik', sans-serif !important; overflow-x: hidden; margin-top: 60px;}
img{max-width: 100%; max-height: 100%;}
.cf:after,.cf:before{content:"";display:table}.cf:after{clear:both}
.paddingLR0{padding-left: 0 !important; padding-right: 0 !important;}
select{ display: none;}
:focus{outline: 0 !important;}
:root {
  --color-main: #ffffff;
}
@media(min-width:768px){.home-section{margin-top:5rem;}}
@media(max-width:768px){.home-section .project-image{height:auto!important; margin-top:1rem;}}

.title-h2{position: relative; display: table; margin: 0 auto 20px; text-align: center; font-size: 18px; font-weight: 500; border-bottom: 1px solid #000;}

.title-h2-white{position: relative; color: #fff; display: table; margin: 0 auto 80px; font-size: 27px; font-weight: 400;}
.title-h2-white:before{content: ''; background: #fff; position: absolute; width: 85px; height: 2px; left: 0; right: 0; margin: auto; bottom: -11px;}
.title-h2-white:after{content: ''; background: #fff; position: absolute; width: 50px; height: 2px; left: 0; right: 0; margin: auto; bottom: -24px;}

header{background: #fff; z-index: 99; transition: 0.25s; position: fixed; top: 0; left: 0; right: 0; height: 60px; box-shadow: 5px 0 5px rgba(0,0,0,0.15); padding: 0 25px;}
header.current{background: rgba(255,255,255,0.8);}
.logo-class{float: left; height: 60px;}
.logo-class img{position: absolute; top: 50%; transform: translateY(-50%);}
nav{float: left;}
nav ul{margin: 0; padding: 0; list-style: none;}
nav ul li{float: left;}
nav ul li a{display: block; text-decoration: none !important; position: relative; font-size: 13px; color: #000 !important; font-weight: 400; padding: 21px 15px;}
nav ul li a i{margin-right: 2px; -webkit-animation: download 2s infinite normal; animation: download 2s infinite normal; color: #8d5130!important;}
nav ul li:last-child a i{-webkit-animation: sitevisit 2s infinite normal; animation: sitevisit 2s infinite normal;}
nav ul li a:before{content: ""; background: var(--color-main); width: 25px; height: 2px; position: absolute; left: 0; right: 0; margin: auto; bottom: 15px; opacity: 0;}
nav ul li a:hover, nav ul li a.active{background: #8d5130!important; color: #fff !important;}
nav ul li a:hover i{color: #fff !important;}
nav ul li a.active:before{opacity: 1;}
.nav-phn-number{border-left: 1px solid #ddd; margin: 14px 0; color: #000; float: left; margin-left: 13px; padding: 4px 0 4px 20px;}
.nav-phn-number a{color: #8d5130; font-size: 15px; font-weight: 500; display: block; text-decoration: none;}
.nav-phn-number a img{width: 24px; margin-right: 5px; vertical-align: middle;}

.nav-icon{background: none; border: none; float: left; margin: 22px 22px 22px 0; cursor: pointer; display: none;}
.nav-icon span{display: block; width: 25px; height: 2px; background: #000;}
.nav-icon span:nth-of-type(2){margin: 5px 0;}

.home-section{width: 100%; position: relative;}
.home-section .project-image{width: 100%; height: 100%;}

.overview-section{padding: 40px 0 25px 0; position: relative;}
.overview-para p{font-size: 14px; margin-bottom: 15px; font-weight: 300; text-align: justify; line-height: 30px; color: #000;}
.overview-para ul{margin: 0 0 0 15px; padding: 0; text-align: justify; line-height: 30px; color: #000; margin-bottom: 10px; }
.overview-para ul li{font-size: 14px; font-weight: 300;}
.more-link{color: var(--color-main) !important; text-decoration: none !important;}
.read-less a{font-size: 14px; font-weight: 300; margin-bottom: 15px; color: var(--color-main) !important; text-decoration: none !important; display: table; margin-top: 10px;}

.project-highlights-section{padding: 15px 0 25px 0;}
.project-highlights-ul{margin: auto; max-width: 100%; padding: 0; list-style: none; font-size: 0;}
.project-highlights-ul li{display: inline-block; vertical-align: top; width: 47%; position: relative; font-size: 15px; font-weight: 300; color: #000; background: url(../images/pro-high-arrow.png) no-repeat; background-position: 0px 10px; line-height: 30px; padding: 0 0px 0 27px; margin: 0 1.5% 15px 1.5%; text-align: justify;}

.project-box-section{padding-top: 20px;}
.project-highlights-pad{padding: 0 15px;}
.project-box-div{box-shadow: 0 0 5px rgba(0,0,0,0.15); overflow: hidden; margin: 0 0px 30px 0px;}
.project-box-div-logo{padding: 9px 10px; position: relative; box-shadow: 0px 5px 4px 0px rgba(0, 0, 0, 0.35);}
.project-box-div-logo>h3{font-size: 18px; padding-right: 33px; font-weight: 400; margin-bottom: 2px;}
.project-box-div-logo>span{font-size: 12px;}
.project-box-div-logo>span>img{width: 14px; vertical-align: middle; margin-top: -1px; margin-right: 1px;}
.project-box-div-logo a{width: 22px; height: 22px; display: block; position: absolute; right: 10px; top: 50%; transform: translateY(-50%);}
.project-box-div-project-img{width: 100%; height: 200px;}
.project-box-div-detail{padding: 10px 13px; height: 335px; position: relative;}
.project-box-div-detail p{font-size: 12px; color: #fff; font-weight: 400; text-transform: uppercase; margin-bottom: 4px; position: absolute; left: 0px; top: -23px; z-index: 0; background: rgb(39, 39, 39); padding: 3px 7px;}
.project-box-div-detail h2{font-size: 21px; font-weight: 400; color: #000; margin-bottom: 3px;}
.project-box-div-detail span {font-size: 12px; font-weight: 400; color: #555;}
.project-box-div-detail span img{width: 13px; vertical-align: middle; margin-top: -3px;}
.project-scroll{overflow-y: auto; position: relative; height: 160px; box-shadow: 0 0 5px rgba(0,0,0,0.05); margin: 3px 0 7px 0;  padding: 5px 10px 5px 10px; background: #fff;}
.project-box-div-detail ul{margin: 0;  padding: 5px 10px 5px 10px; list-style: none;}
.project-box-div-detail ul li{position: relative; background: url(../images/aoc-mic-arrow.png) no-repeat; background-position: 0px 3px; font-size: 12px; color: #858585; font-weight: 400; padding: 0 0 0 13px; margin: 0 0 3px 0;}
.project-box-div-detail .project-price{font-size: 12px; position: absolute; bottom: 10px; left: 13px; border-radius: 3px; background: #8d5130; font-weight: 300; color: #fff; display: table; padding: 3px 10px}
.project-box-div-detail .project-price font {color: #fff; font-size: 20px; font-weight: 300; vertical-align: middle; margin-left: 2px;}
.project-box-div-detail .project-price font img {width: 19px; vertical-align: middle; margin-top: -3px; margin-right: 2px;}
.project-box-div-detail button{font-size: 15px; font-weight: 500; background: no-repeat; border: none; position: absolute; right: 13px; bottom: 13px; border-bottom: 1px solid #000;}

.offer-div{background: #efefef; margin: 9px -13px 20px -13px; padding: 5px 13px 8px 13px;}
.offer-div span{font-size: 12px; line-height: 20px; color: #000; text-align: justify; display: block;}
.offer-div font{overflow: hidden;position: relative;background: #8d5130; color: #fff; padding: 3px 10px; text-transform: uppercase; border-radius: 15px; font-size: 13px; display: table; margin: -17px 0 2px 0; font-weight: 400;}
.scrollbar-inner>.scroll-element.scroll-y{height: 96% !important; right: 2px !important; top: 2% !important; width: 4px !important; bottom: 2% !important;}
.scroll-wrapper>.scroll-content{box-shadow: none !important;}
.input-group-addon{color: #8d5130!important}
.btn-primary{background-color: #8d5130!important; border:none!important}
.disclaimer {background: #222; padding: 10px; color: #d8d8d8; font-size: 11px; font-weight: 300; line-height: 20px;}

.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;}
/*.modal-popup{background: linear-gradient(#8769cd, #718acc);}*/
.modal-body-popup{padding: 30px 40px;}
.modal-body-content{box-shadow: none !important; border-radius: 0 !important; border: none !important;}
.pop-img{width: 105px; height: 105px; background: #fff; border-radius: 50%; display: block;  margin: -85px auto 0; padding: 12px;}
.modal-body-popup h4{font-size: 18px; font-weight: 500; text-align: center; margin: 25px 0;}
.pop-enquire-form-div{position: relative; margin-bottom: 25px;}
.pop-enquire-form-div img{width: 16px; position: absolute; left: 0; top: 0; bottom: 0; margin: auto;}
.pop-enquire-form-div input{width: 100%; border-bottom: 1px solid #bdbdbd !important; height: 45px; border:none; font-weight: 300; padding-left: 25px; font-size: 13px; color: #000;}
.pop-enquire-form-div input::placeholder{color: #666;}
.pop-enquire-form-div .nice-select{margin-bottom: 0; border-bottom: 1px solid #bdbdbd !important; font-size: 13px; color: #000 !important; font-weight: 300; height: 45px; line-height: 45px;}
.pop-enquire-form-div .nice-select:after{width: 7px; right: 10px; height: 7px; border-bottom: 1px solid #777; border-right: 1px solid #777;}
.pop-enquire-btn{background: #7288cc; transition: 0.25s; margin-top: 9px; font-size: 15px; font-weight: 400; color: #fff; height: 45px; width: 100%; text-transform: uppercase; border:none;}
.pop-enquire-btn:hover{background: var(--color-main);}
.modal-body-content button.close{position: absolute; top: 10px; right: 15px; font-size: 24px; font-weight: 400; opacity: 1; z-index: 1;}

.modal-popup-callbck .pop-enquire-btn{margin-top: 0;}
.modal-popup-callbck .modal-body-popup h4{margin: 25px 0 15px 0;}

.overlay{background: rgba(0,0,0,0); display: none; position: fixed; left: 0; right: 0; top: 0; bottom: 0;}

.bottom-fixed{width: 100%; z-index: 1; position: fixed; left: 0; display: none; right: 0; bottom: 0; background: rgba(255,255,255,.8); padding: 10px 0; box-shadow: 0 0 5px rgba(0,0,0,.15);}
.bottom-fixed ul{margin: 0; padding: 0; list-style: none;}
.bottom-fixed ul li{float: left; width: 33.33%; border-right: 1px solid #eee; text-align: center;}
.bottom-fixed ul li a{display: block; text-decoration: none !important; color: #777 !important;}
.bottom-fixed ul li a img{width: 22px; margin-right: 8px; vertical-align: middle;}
.bottom-fixed ul li:last-child{border-right: none;}

.details-error{position: absolute; bottom: -15px; font-size: 10px; color: red; font-weight: 400;}
.middle-form-enquire-div .details-error{color: #fff;}

.success_msg{text-align: center; font-size: 15px; font-weight: 300; color: #000; line-height: 25px;}
.success_msg i{font-size: 54px; color: green; display: block; margin-bottom: 10px;}

.middle-form-enquire .success_msg{color: #fff; font-size: 14px;}
.middle-form-enquire .success_msg i{color: #fff; font-size: 42px; margin-bottom: 5px;}

.mylivechat_inline {bottom: 0 !important;}
.mylivechat_buttonround{top: -10px !important;}
.mylivechat_prechat_text, .mylivechat_offline_text{color: #000 !important;}
.mylivechat_prechat_oauth_lbl, .mylivechat_offline_oauth_lbl {display: none !important;}
.mylivechat_prechat_oauth_box, .mylivechat_offline_oauth_box{width: 100% !important; left: 10px !important; text-align: left !important;}

.modal-dialog-popup{max-width: 400px !important; margin: 80px auto 30px 0;}

@media (min-width: 1200px){
.container-main{width:1200px !important; margin: auto !important;}
}


@media (max-width: 991px){
.home-section{height: 250px;}
.nav-icon{display: initial;}
nav{float: none; transition: 0.25s; position: fixed; left: -300px; top: 0; bottom: 0; overflow-y: auto; width: 250px; background: #fff; box-shadow: 5px 0px 9px rgba(0, 0, 0, 0.1);}
nav ul li{float: none;}
nav ul li a{width: 100%; color: #000 !important; padding: 15px 20px;}
nav ul li a:before{display: none;}
nav ul li a.active{background: #f5f5f5;}
nav.open{left: 0;}
.nav-phn-number{border-left: none;}
.bottom-fixed{display: initial;}
.project-box-div{margin: 0 0 20px 0;}
.disclaimer{padding: 10px 10px 52px 10px;}
.mylivechat_inline {display: none !important;}
}

@media (max-width: 767px) {
header{padding: 0 15px;}
.nav-icon{margin: 22px 15px 22px 0;}
.project-highlights-ul li{font-size: 14px; width: 100%; margin: 0 0 7px 0; line-height: 24px; background-position: 0px 6px;}
.nav-phn-number{margin-left: 0;}
.nav-phn-number a font{display: none;}
.modal-dialog-popup {margin: 80px auto 30px 0;}
.home-section{height: 200px; margin:50px 0 0 0}
.title-h2{font-size: 16px; margin: 0 auto 15px;}
.project-box-div-detail, .project-scroll{height: auto;}
.project-box-div-detail .project-price{position: static;}
.details-error{font-size: 10px;}
.modal-dialog-popup{width: 100% !important;}
.modal-body-popup{padding: 30px 25px;}
.project-box-div-detail .project-price font{font-size: 18px;}
.project-box-div-detail .project-price font img{width: 17px;}
.project-box-div-detail button{font-size: 15px;}
}

@media (max-width: 420px){
.home-section{height: 170px;}
}

.loading {position: fixed; z-index: 99999; height: 2em; width: 2em; overflow: show; margin: auto; top: 0; left: 0; bottom: 0; right: 0;}
/* Transparent Overlay */
.loading:before {content: ''; display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.3);}
/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {/* hide "loading..." text */font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0;}
.loading:not(:required):after {content: ''; display: block; font-size: 10px; width: 1em; height: 1em; margin-top: -0.5em; -webkit-animation: spinner 1500ms infinite linear; -moz-animation: spinner 1500ms infinite linear; -ms-animation: spinner 1500ms infinite linear; -o-animation: spinner 1500ms infinite linear; animation: spinner 1500ms infinite linear; border-radius: 0.5em; -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0; box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;}
/* Animation */


.offer-div font:after{content:''; top:0; transform:translateX(100%); width:100%; height:27px; position: absolute; z-index:1; animation: slide 1s infinite 3s; background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(128,186,232,0) 99%, rgba(125,185,232,0) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,0.8)), color-stop(99%,rgba(128,186,232,0)), color-stop(100%,rgba(125,185,232,0))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%); /* IE10+ */
  background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
}
@keyframes slide {
  0% {transform:translateX(-100%);}
  100% {transform:translateX(100%);}
}


@-webkit-keyframes download {
  0% {opacity: 0;}
  60% {opacity: 1;}
  100% {opacity: 1;}
}
@keyframes download {
  0% {opacity: 0;}
  60% {opacity: 1;}
  100% {opacity: 1;}
}


@-webkit-keyframes sitevisit {
  0% {opacity: 0;}
  60% {opacity: 1;}
  100% {opacity: 1;}
}
@keyframes sitevisit {
  0% {opacity: 0;}
  60% {opacity: 1;}
  100% {opacity: 1;}
}

