 <link rel="stylesheet" href="css/main.css"> html {
color: #222;
font-size: 1em;
line-height: 1.4;
}

::-moz-selection {
 background: #b3d4fc;
 text-shadow: none;
}
::selection { background: #b3d4fc; text-shadow: none; }
/*
 * A better looking default horizontal rule
 */

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio, canvas, iframe, img, svg, video { vertical-align: middle; }
/*
 * Remove default fieldset styles.
 */

fieldset { border: 0; margin: 0; padding: 0; }
/*
 * Allow only vertical resizing of textareas.
 */

textarea { resize: vertical; }
/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; }
/* ==========================================================================
   Author's custom styles
   ========================================================================== */
   
   
#wrapper { width: 100%; height: auto; float: left; min-height: 100%; height: 100%; }
.main-warp { width: 100%; height: auto; float: left; min-height: 100%; overflow: hidden; }
.page { width: 100%; height: auto; float: left; padding-bottom: 60px; }
.container { width: 100%; height: auto; float: left; position: relative; padding: 0 0; }
header { width: 100%; height: 100px; float: none; position: relative; z-index: 999; position: absolute; background: #FFF; }
.head-cont { width: 100%; height: auto; float: left; padding: 0 0; }
.logo-sec { width: 30%; max-width: 340px; height: 90px; padding: 0 10px; float: left; text-align: center; background-image: url(../images/fiest-bateel.png); background-repeat: no-repeat; background-size: contain; background-position: center center; }
.logo-sec a { width: 100%; height: 90px; float: left; }
header .container { padding: 0 80px; }
.midd-wrap { width: 100%; height: auto; float: left; }
.inner-wrap { width: 100%; height: auto; float: left; background: url(../images/back.png); background-attachment: fixed; }
.midd-wrap h1 { width: 100%; height: auto; float: left; font-size: 30px; color: #FFF; text-transform: uppercase; font-weight: 600; }
.midd-wrap h1 span { font-weight: 200; }
.head-midd { width: 100%; height: auto; float: left; }
.head-midd nav { width: auto; float: right; height: auto; }
.head-midd nav ul { width: auto; float: right; height: auto; margin: 5px 0 0 0; }
.head-midd nav ul li { width: auto; float: left; height: auto; font-size: 17px; color: #FFF; text-transform: uppercase; display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; font-weight: 600; padding: 10px 0; }
.head-midd nav ul li a { width: 100%; height: auto; float: left; position: relative; padding: 15px 20px; color: #FFF; height: auto; }
.head-midd nav ul li:hover a { color: #FFF; background: #d50124; }
.drop-menu { width: 230px !important; background: #d50124; height: auto; float: none; position: absolute; left: 0px; z-index: 9999; opacity: 0; visibility: hidden; padding: 0 0 15px 0; -webkit-transform: translateY(24px); -moz-transform: translateY(24px); -ms-transform: translateY(24px); -o-transform: translateY(24px); transform: translateY(24px); -webkit-transition: all .25s ease-out; -moz-transition: all .25s ease-out; -ms-transition: all .25s ease-out; -o-transition: all .25s ease-out; transition: all .25s ease-out; padding: 0; }
nav ul > li:hover .drop-menu { visibility: visible; opacity: 1; top: 50px; -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px); transform: translateY(10px); -webkit-transition: all .25s ease-out; -moz-transition: all .25s ease-out; -ms-transition: all .25s ease-out; -o-transition: all .25s ease-out; transition: all .25s ease-out; text-align: left; }
nav ul .drop-menu li { width: 100%; height: auto; float: left; background: none; }
nav ul .drop-menu li a { width: 100%; height: auto; float: left; font-size: 13px; background: none; float: left; padding: 15px 10px 15px 0px; font-weight: 400; text-align: left; }
nav ul li .drop-menu li:hover a { color: #FFF; border: none; background: none; }
nav ul .drop-menu li:hover { color: #FFF; background: #e46000; }
.head-midd nav .drop-menu li { text-transform: uppercase; display: inline-block; border-bottom: #ca5568 solid 1px; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; padding: 0px 18px; }
.drop-menu li a:before { content: ""; background: none !important; }
.sub-menu { width: 230px !important; background: #333; height: auto; float: none; position: absolute; left: 200px; top: 0px; z-index: 9999; opacity: 0; visibility: hidden; padding: 0 0 15px 0; -webkit-transition: all .25s ease-out; -moz-transition: all .25s ease-out; -ms-transition: all .25s ease-out; -o-transition: all .25s ease-out; transition: all .25s ease-out; padding: 0; margin: 0px !important; }
nav ul > li .drop-menu li:hover .sub-menu { visibility: visible; left: 230px; opacity: 1; -webkit-transition: all .25s ease-out; -moz-transition: all .25s ease-out; -ms-transition: all .25s ease-out; -o-transition: all .25s ease-out; transition: all .25s ease-out; text-align: left; }
nav ul .sub-menu li { width: 100%; height: auto; float: left; background: none; }
nav ul .sub-menu li a { width: 100%; height: auto; float: left; font-size: 13px; background: none; float: left; padding: 15px 10px 15px 0px; font-weight: 400; text-align: left; }
nav ul li .sub-menu li:hover a { color: #FFF; border: none; background: none; }
nav ul .sub-menu li:hover { color: #FFF; background: #d50124; }
.head-midd nav .sub-menu li { text-transform: uppercase; display: inline-block; border-bottom: #ca5568 solid 1px; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; padding: 0px 18px; }
.banner-left { width: 50%; height: 100%; display: flex; background: rgb(228,97,0); background: linear-gradient(114deg, rgba(228,97,0,1) 0%, rgba(213,1,36,1) 100%, rgba(0,0,0,1) 100%); clip-path: polygon(0 0, 100% 0%, 47% 100%, 0% 100%); position: absolute; z-index: 1; align-items: center; left: 0px; top: 0; z-index: 9; }
.banner-text { width: 100%; height: auto; display: flex; flex-direction: column; align-items: center; padding: 0 32% 0 70px; margin-top: -20%; }
.banner-left h1 { width: 100%; height: auto; display: flex; color: #FFF; text-transform: uppercase; font-size: 40px; }
.banner-left p { width: 100%; height: auto; display: flex; color: #FFF; font-size: 13px; padding: 10px 0 0 0; text-align: justify; line-height: 21px; }
.banner-right { width: 75%; height: auto; display: flex; float: right; position: relative; }
.dummy-banner { width: 50%; height: 100%; float: none; position: absolute; left: 0px; background: #FFF; z-index: 1; clip-path: polygon(0 0, 100% 0%, 47% 100%, 0% 100%); padding-left: 50px; opacity: 0.5; }
.banner-more { width: 100%; height: auto; display: flex; margin: 25px 0 0 0; }
.banner-more a { padding: 10px 25px; border-radius: 30px; background: #FFF; font-size: 15px; color: #d50124; font-weight: 600; }
.banner-more a:hover { background: #d50124; color: #FFF; }
.banner-cont { width: 100%; height: auto; display: flex; position: relative; flex-direction: row-reverse; }
.banner-cont:after { width: 100%; height: 100%; float: none; background: url(../images/logo-shape.png) no-repeat right bottom; background-attachment: fixed; background-size: 30%; position: fixed; top: 0px; right: 0px; content: ''; }
.banner-cont:before { width: 100%; height: 100%; float: none; background: rgba(0,0,0,0.2); position: absolute; top: 0px; right: 0px; content: ''; z-index: 1; }
.dots-container { width: 120px; height: auto; position: absolute; bottom: 10px; left: 50%; margin: 0 0 0 -60px; }
.banner-cont { width: 100%; height: auto; float: left; position: relative; overflow: hidden; height: 100vh; padding: 100px 0 0 0; padding-bottom: 0; }
.banner-right-text{
    width: 100%;
    height: auto;
    float: none;
    position: absolute;
    right: 30px;
    z-index: 9999;
    text-align: right;
    bottom:40%;
    font-size:30px;
    font-weight: 600;
    color: #FFF;
    text-transform: uppercase;
    text-shadow: rgba(0,0,0,0.5) 0 1px 3px;
    
}

.inner h2 { width: 100%; height: auto; float: left; font-size: 35px; color: #FFF; font-family: 'Montserrat', sans-serif; font-weight: 400; text-transform: uppercase; text-shadow: rgba(0,0,0,0.5) 0 2px 1px; padding: 0 50px 0 0; text-align: right; line-height: 45px; }
.banner-cont .slick-prev, .banner-cont .slick-next { z-index: 99; width: 22px; height: 22px; top: -47px; margin: 0px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.banner-cont .slick-prev { left: 0; background: url(../images/banner-arrow1.png) no-repeat right center; }
.banner-cont .slick-prev:hover { background: url(../images/banner-arrow1.png) no-repeat left center; }
.banner-cont .slick-next { right: 0px; margin: 0 0 0 0; background: url(../images/banner-arrow.png) no-repeat left center; }
.banner-cont .slick-next:hover { background: url(../images/banner-arrow.png) no-repeat right center; }
.banner-cont img { width: 100%; height: 100%; float: left; }
.banner-cont .slick-prev, .banner-cont .slick-next { z-index: 9999; width: 60px; height: 70px; top: -55px; margin: 0px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.banner-cont .slick-prev { background: rgba(0,0,0,0.5) url(../images/arrow1.png) no-repeat right 10px center; top: 50%; right: 30px; left: inherit; }
.banner-cont .slick-prev:hover { background: #e36101 url(../images/arrow1.png) no-repeat left center; }
.banner-cont .slick-next { background: rgba(0,0,0,0.5) url(../images/arrow2.png) no-repeat left 10px center; top: 50%; left: 30px; right: inherit; }
.banner-cont .slick-next:hover { background: #e36101 url(../images/arrow2.png) no-repeat right center; }
.title-head { width: 80%; float: left; height: auto; position: absolute; left: 30px; bottom: 30px; z-index: 99999; }
.title-head h2 { width: 100%; float: left; height: auto; color: #FFF; line-height: 20px; font-size: 16px; text-align: justify; }
.head-midd nav ul li a { color: #333; }
#mixedSlider { position: relative; }
#mixedSlider .MS-content { white-space: nowrap; overflow: hidden; margin: 0 5%; }
#mixedSlider .MS-content .item { display: inline-block; width: 33.3333%; position: relative; vertical-align: top; overflow: hidden; height: 100%; white-space: normal; padding: 0 10px; }
@media (max-width: 991px) {
#mixedSlider .MS-content .item { width: 50%; }
}
@media (max-width: 767px) {
#mixedSlider .MS-content .item { width: 100%; }
}
#mixedSlider .MS-content .item .imgTitle { position: relative; }
#mixedSlider .MS-content .item .imgTitle .blogTitle { margin: 0; text-align: left; letter-spacing: 2px; color: #252525; font-style: italic; position: absolute; background-color: rgba(255, 255, 255, 0.5); width: 100%; bottom: 0; font-weight: bold; padding: 0 0 2px 10px; }
#mixedSlider .MS-content .item .imgTitle img { height: auto; width: 100%; }
#mixedSlider .MS-content .item p { font-size: 16px; margin: 2px 10px 0 5px; text-indent: 15px; }
#mixedSlider .MS-content .item a { float: right; margin: 0 20px 0 0; font-size: 16px; font-style: italic; color: rgba(173, 0, 0, 0.82); font-weight: bold; letter-spacing: 1px; transition: linear 0.1s; }
#mixedSlider .MS-content .item a:hover { text-shadow: 0 0 1px grey; }
#mixedSlider .MS-controls button { position: absolute; border: none; background-color: transparent; outline: 0; font-size: 50px; top: 95px; color: rgba(0, 0, 0, 0.4); transition: 0.15s linear; }
#mixedSlider .MS-controls button:hover { color: rgba(0, 0, 0, 0.8); }
@media (max-width: 992px) {
#mixedSlider .MS-controls button { font-size: 30px; }
}
@media (max-width: 767px) {
#mixedSlider .MS-controls button { font-size: 20px; }
}
#mixedSlider .MS-controls .MS-left { left: 0px; }
@media (max-width: 767px) {
#mixedSlider .MS-controls .MS-left { left: -10px; }
}
#mixedSlider .MS-controls .MS-right { right: 0px; }
@media (max-width: 767px) {
#mixedSlider .MS-controls .MS-right { right: -10px; }
}
#basicSlider { position: relative; width: 100%; height: auto; float: left; }
#basicSlider .MS-content { white-space: nowrap; overflow: hidden; margin: 0px 0 0 0; height: 130px; }
#basicSlider .MS-content .item { display: inline-block; width: 15%; position: relative; vertical-align: top; overflow: hidden; height: 100%; white-space: normal; line-height: 120px; vertical-align: middle; background: #FFF; margin: 0 .5%; text-align: center; }
#basicSlider .MS-content .item img { width: 80%; }
@media (max-width: 991px) {
#basicSlider .MS-content .item { width: 25%; }
}
@media (max-width: 767px) {
#basicSlider .MS-content .item { width: 35%; }
}
@media (max-width: 500px) {
#basicSlider .MS-content .item { width: 50%; }
}
#basicSlider .MS-content .item a { line-height: 50px; vertical-align: middle; }
#basicSlider .MS-controls button { position: absolute; }
#basicSlider .MS-controls .MS-left { top: 35px; left: 10px; }
#basicSlider .MS-controls .MS-right { top: 35px; right: 10px; }
.about-part { width: 100%; height: auto; float: left; display: flex; }
.about-left { width: 40%; height: auto; float: left; padding: 80px 80px; background: #d50124; }
.about-right { width: 60%; height: auto; float: left; padding: 0 0px 0 0; background: #d2bdbf; display: flex; }
.abt-content { width: 100%; height: auto; float: left; }
.abt-content p { width: 100%; height: auto; float: left; font-size: 20px; color: #FFF; padding: 20px 0 0 0; font-weight: 300; line-height: 35px; }
.abt-content p span { font-weight: 500; }
.more-btn { width: auto; height: auto; float: left; margin: 40px 0 0 0; }
.more-btn a { width: auto; height: auto; float: left; color: #FFF; padding: 15px 60px; border: #FFF solid 1px; text-transform: uppercase; font-size: 20px; }
.more-btn a:hover { background: #FFF; color: #d50124; }
.service-list { width: 100%; height: auto; float: left; display: flex !important; }
.service-list .slick-prev, .service-list .slick-next { right: 20px; left: inherit; z-index: 9999; width: 50px; height: 50px; top: 55px; margin: 0px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.service-list .slick-prev { background: url(../images/arrow1.png) no-repeat right center; }
.service-list .slick-prev:hover { background: url(../images/arrow1.png) no-repeat left center; }
.service-list .slick-next { margin: 0 50px 0 0; background: url(../images/arrow2.png) no-repeat left center; }
.service-list .slick-next:hover { background: url(../images/arrow2.png) no-repeat right center; }
.service-list .slick-slide { position: relative; }
.service-list li { width: 33.333%; height: auto; float: left; border-left: #5e5e5e solid 1px; position: relative; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; overflow: hidden; }
.service-list li:first-child { border: none; }
.service-list li a { width: 100%; height: 100%; float: left; }
.services-image { width: 100%; height: auto; float: left; }
.service-list li .srv-icon { width: 25%; height: 100px; display: flex; align-items: center; text-align: center; position: relative; -webkit-transition: -webkit-transform 0.35s, color 0.35s; transition: transform 0.35s, color 0.35s; }
.srv-content { width: 100%; height: 100%; display: flex; position: absolute; align-items: center; justify-content: center; flex-direction: column; padding: 0 20px; }
.service-list li .srv-icon svg { fill: #d4070c; }
.service-image { width: 100%; height: auto; float: left; top: 0px; left: 0px; }
.service-image img { -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; width: 100%; opacity: 0; }
.service-list li h3 { width: 100%; height: auto; font-size: 26px; text-transform: uppercase; color: #333; font-weight: 300; text-align: center; margin: 15px 0 0 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; }
.service-list li p { width: 100%; display: inline-block; display: flex; align-items: center; opacity: 0; text-align: center; color: #FFF; font-family: 'Lato', sans-serif; -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; }
.service-list li:hover p { opacity: 1; -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); }
.service-list li:hover .srv-icon { opacity: 0; -webkit-transform: translate3d(0, 0px, 0) translate3d(0, -40px, 0); transform: translate3d(0, 0px, 0) translate3d(0, -40px, 0); }
.service-list li .srv-icon img { -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; }
.service-list li:hover h3 { color: #FFF; -webkit-transform: translate3d(0, 0px, 0) translate3d(0, -50px, 0); transform: translate3d(0, 0px, 0) translate3d(0, -50px, 0); }
.service-list li:hover .service-image { background: #000; }
.service-list li:hover .service-image img { opacity: 0.5; -webkit-transform: translate3d(0, 0px, 0) translate3d(0, -50px, 0); transform: translate3d(0, 0px, 0) translate3d(0, -50px, 0); }
.top-midd { width: 100%; height: 100vh; background: #FFF; position: relative; }
#demo { width: 100%; height: 100%; float: left; position: relative; }
.home-projects { width: 100%; height: auto; float: left; }
.home-projects { width: 100%; height: auto; float: left; display: flex; flex-direction: row; }
.home-projects .slick-prev, .home-projects .slick-next { right: 20px; left: inherit; z-index: 9999; width: 50px; height: 50px; top: 55px; margin: 0px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.home-projects .slick-prev { background: url(../images/arrow1.png) no-repeat right center; }
.home-projects .slick-prev:hover { background: url(../images/arrow1.png) no-repeat left center; }
.home-projects .slick-next { margin: 0 50px 0 0; background: url(../images/arrow2.png) no-repeat left center; }
.home-projects .slick-next:hover { background: url(../images/arrow2.png) no-repeat right center; }
.home-projects .slick-slide { position: relative; }
.home-projects h1 { color: #FFF; }
.project-left { width: 68%; height: auto; float: left; }
.project-right { width: 32%; height: auto; float: left; padding: 0 50px; display: flex; flex-direction: column; justify-content: center; /* vertically aligns items */  /* horizontally aligns itemsposition: relative; background-image: url(../images/back.png); */ background-position: right top; background-repeat: no-repeat; background-color: #e46100; }
.project-slide li img { width: 100%; }
.project-right p { width: 100%; height: auto; float: left; font-size: 18px; color: #FFF; padding: 20px 0 10px 0; line-height: 30px; }
.view-more { width: 100%; height: auto; float: left; text-transform: uppercase; position: relative; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; margin: 20px 0 0 0; }
.view-more a { width: auto; height: auto; float: right; color: #FFF; font-size: 18px; text-transform: uppercase; padding: 10px 55px 10px 20px; background: #d50124 url(../images/read-more.png) no-repeat right 15px top 15px; border: #FFF solid 1px; margin: 50px 0 0 0; }
.view-more a:hover { background: #000 url(../images/more-arrow.png) no-repeat right 20px top 14px; }
.project-image { width: 100%; height: auto; float: left; background: #000; position: relative; }
.project-image::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #F00; content: ''; background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 75%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 75%); content: ''; opacity: 0; -webkit-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; z-index: 99; }
.project-image img { width: 100%; opacity: 0.5; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; }
.home-projects .slick-slide:hover .project-image::before { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.home-projects .slick-slide:hover img { opacity: 1; }
.project-content { width: 100%; height: auto; float: none; position: absolute; bottom: 25px; left: 0px; z-index: 999; padding: 0 0 0 30px; }
.project-content h2 { width: 100%; height: 70px; float: left; color: #FFF; font-weight: 700; font-size: 25px; text-transform: uppercase; }
.project-content .project-number { width: auto; height: auto; float: left; color: #FFF; font-size: 20px; text-transform: uppercase; position: relative; }
.project-content .project-number:after { content: ''; width: 35px; height: 1px; background: #a89256; position: absolute; right: -45px; top: 15px; }
.home-division { width: 100%; height: auto; float: left; position: relative; margin: 0px 0 0 0;/* background-attachment: fixed; background-clip: border-box, border-box; background-image: linear-gradient(rgba(39, 39, 39, 0.9), rgba(39, 39, 39, 0.9)), url(../images/bg1.jpg); background-origin: padding-box, padding-box; background-position: center top; background-repeat: no-repeat; background-size: cover;*/ padding: 0px 0; }
.division-cont { width: 100%; height: auto; float: left; display: flex; }
.division-left { width: 35%; height: auto; float: left; display: flex; flex-direction: column; justify-content: center; /* vertically aligns items */ align-items: center; /* horizontally aligns items */ position: relative; }
.divi-list { width: 125%; height: auto; position: absolute; background: #1f1f1f; z-index: 999; left: 0px; }
.divi-content { width: 30%; min-width: 450px; height: auto; float: none; position: absolute; bottom: 50px; right: 150px; padding: 30px 50px 50px 50px; background: #262626; }
.divi-content h2 { width: 100%; height: auto; float: left; font-size: 28px; color: #FFF; text-transform: uppercase; font-weight: 600; }
.divi-content h3 { width: 100%; height: auto; float: left; font-size: 28px; color: #FFF; text-transform: uppercase; font-size: 22px; font-weight: 400; }
.project-head { width: 100%; height: auto; float: left; padding: 20px 0 10px 0; }
.project-dot { width: 100%; }
.divi-content p { width: 100%; height: auto; float: left; font-size: 18px; color: #FFF; padding: 15px 0 0 0; font-weight: 300; }
.divi-content .read-more { width: auto; height: auto; float: right; color: #FFF; font-size: 18px; text-transform: uppercase; padding: 10px 30px 10px 30px; border: #FFF solid 1px; margin: 50px 0 0 0; }
.divi-content .read-more:hover { background: #d50124; }
.home-partners { width: 100%; height: auto; float: none; padding: 20px 80px 20px 80px; background: #FFF; position: relative; bottom: 0px; position: absolute; bottom: 0px; z-index: 999; left: 0px; }
.home-partners h1 { width: 100%; height: auto; float: left; color: #333; }
.partners-list { width: 101%; height: auto; float: left; margin: 15px 0 0 -1%; }
.partners-list .slick-prev, .partners-list .slick-next { right: 0px; left: inherit; z-index: 9999; width: 50px; height: 50px; top: -45px; margin: 0px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.partners-list .slick-prev { background: url(../images/arrow1.png) no-repeat right center; }
.partners-list .slick-prev:hover { background: url(../images/arrow1.png) no-repeat left center; }
.partners-list .slick-next { margin: 0 50px 0 0; background: url(../images/arrow2.png) no-repeat left center; }
.partners-list .slick-next:hover { background: url(../images/arrow2.png) no-repeat right center; }
.partners-list .slick-slide { position: relative; }
.part-align { width: 95%; height: auto; float: left; transition: transform .2s; /* Animation */ margin: 0 0 0 5%; }
.partner-top { width: 100%; height: auto; float: left; background: #FFF; position: relative; }
.partner-image { width: 100%; height: auto; padding: 30px; text-align: center; }
.partner-image img { width: 90%; display: inline-block !important; }
.partnet-logo { width: 100%; max-width: 180px; height: auto; float: none; position: absolute; bottom: 0%; left: 50%; transform: translate(-50%, 0%); background: #FFF; text-align: center; border-radius: 10px 10px 0 0; padding: 10px 10px 0 10px; }
.partnet-logo img { width: 100%; }
.partners-list li { width: auto; height: auto; float: left; margin: 0 0 0 0; border-radius: 3px; }
.partners-list li .part-align:hover { box-shadow: rgba(0,0,0,0.3) 0px 0px 6px; transform: scale(1.02); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */ }
.partners-list li:hover .partner-image img { opacity: 1; }
.partner-btm { width: 100%; height: auto; float: left; padding: 13px 20px 13px 20px; background: #ababab; display: none; }
.partners-list li h2 { width: 100%; height: auto; float: left; color: #FFF; font-weight: 600; font-size: 22px; text-transform: uppercase; padding: 10px 0 0 0; position: relative; }
.partners-list li h2:after { content: ''; width: 26px; height: 18px; position: absolute; right: 0px; top: 15px; background: url(../images/read-more.png) no-repeat; }
.partners-list li:hover .partner-btm { background: #e46100; }
.partners-list li p { width: 100%; height: auto; float: left; color: #666; display: none; font-size: 15px; padding: 10px 0 0 0; line-height: 25px; }
.home-clients-list { width: 100%; height: auto; float: left; padding: 40px 80px; border-top: #e2e2e2 solid 6px; }
.home-clients-list h1 { width: 100%; height: auto; float: left; color: #333; }
.home-clients-list ul { width: 100%; height: auto; float: left; margin: 15px 0 0 0; }
.home-clients-list li { width: 16.6%; height: auto; float: left; border-left: 0px; text-align: center; }
.home-clients-list li:first-child { }
.client-logo { width: 100%; height: auto; float: left; }
.client-logo img { max-width: 100%; -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */ filter: grayscale(100%); }
.home-clients-list li:hover .client-logo img { -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */ filter: grayscale(0%); }
footer { width: 100%; height: 60px; float: left; clear: both; margin: -60px 0 0 0; background: #191919; }
footer .container { padding: 0 80px; }
.ft-top { width: 100%; height: auto; float: left; padding: 0px 0 0px 0; position: relative; }
.ft-contact h2 { width: 100%; height: auto; float: left; font-size: 18px; font-weight: 500; color: #FFF; text-transform: uppercase; padding-bottom: 15px; display: flex; }
.ft-logo { width: 11%; height: auto; float: left; padding: 40px 0 0 0; }
.ft-logo img { width: 70%; }
.ft-menu { width: 30%; height: auto; float: left; padding-bottom: 50px; }
.ft-menu ul { width: 100%; height: auto; float: left; text-align: center; }
.ft-menu ul li { width: 50%; height: auto; float: none; font-size: 16px; font-weight: 400; display: inline-block; padding: 0 0; text-transform: uppercase; }
.ft-menu ul li:after { content: '|'; color: #FFF; padding: 8px 15px 0 15px; float: left; }
.ft-menu ul li:last-child:after { content: ''; }
.ft-menu ul li a { width: auto; height: auto; float: left; padding: 8px 0 0 0; color: #FFF; }
.ft-menu ul li a:hover { color: #d50124; text-decoration: underline; }
.full-menu { border-left: #767676 solid 1px; padding-left: 60px; }
.full-menu ul li { width: 100%; }
.ft-contact { width: 400px; max-width: 400px; height: 100%; padding-left: 0; font-weight: 400; position: absolute; background: #d4070c; right: 20px; top: 0; padding: 30px 30px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; z-index: 999; }
.ft-contact p { width: 100%; height: auto; font-size: 18px; color: #FFF; line-height: 30px; font-weight: 300; text-align: center; }
.ft-contact p a { color: #FFF; }
.ft-map { width: 100%; height: 450px; float: right; position: relative; background: #000; }
.ft-map iframe { opacity: 0.8; }
.ft-contact p a:hover { color: #e46100; text-decoration: underline; }
.ft-social { width: 100%; height: auto; float: left; padding: 10px 0 0 0; }
.ft-social li { width: auto; height: auto; float: none; display: inline-block; padding: 0 5px; }
.icon-button { background-color: #FFF; border-radius: 35px; cursor: pointer; display: inline-block; font-size: 1.2rem; height: 35px; line-height: 35px; margin: 0 0px; position: relative; text-align: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width: 35px; }
.icon-button:hover { background: #d50124; }
/* Icons */
.icon-button i { background: none; color: #191919; height: 35px; left: 0; line-height: 35px; position: absolute; top: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; width: 35px; z-index: 10; }
.icon-button:hover i { color: white; }
.top-social { width: auto; height: auto; float: right; }
.top-social ul { width: 100%; height: auto; float: left; margin: 10px 0 0 0; }
.top-social li { width: 30px; height: 30px; float: left; margin: 0 0 0 10px; }
.top-social li .icon-button { width: 30px; font-size: 20px; height: 30px; background: #969595; line-height: 30px; }
.top-social li .icon-button i { width: 30px; height: 30px; line-height: 30px; }
.top-social li:hover .icon-button { background: #ae9a63; }
.copy-part { width: 100%; height: 60px; float: left; border-top: #757575 solid 1px; text-align: left; }
.copy-part p { width: 100%; height: auto; float: left; font-size: 13px; color: #FFF; line-height: 60px; }
/**********Inner pages css start here **********/
.sub-head h2 { font-size: 36px; float: left; width: 100%; font-weight: 400; text-transform: uppercase; padding: 20px 0 50px 0 }
.sub-head { width: 100%; float: left; margin: 30px 0 0 0; }
.contact-us { width: 100%; height: auto; margin: 0 auto; padding: 0; float: left; }
.contact-part { width: 100%; height: auto; margin: 0 auto; float: left }
.address-cont { width: 35%; float: left; }
.contact-cont { width: 65%; float: left; height: auto; display: flex; }
.address { width: 100%; float: left; margin: 0 auto; padding: 0; line-height: 30px; margin-bottom: 30px; }
.address h3 { float: left; width: 100%; font-weight: 700; font-size: 20px; }
.tel-num { width: 100%; float: left; padding: 0; margin: 0 auto; line-height: 40px; }
.tel { background: url(../images/phone-icon.png) no-repeat left; background-size: 22px 22px }
.fax { background: url(../images/fax-icon.png) no-repeat left; background-size: 22px 22px }
.address-icon { background: url(../images/address.png) no-repeat left; background-size: 22px 22px }
.tel-num li { padding-left: 30px; width: 100%; float: left; height: auto; padding-top: 6px; }
.map-cont { width: 100%; float: left; height: auto; display: flex; padding: 0 0px; }
.map { width: 100%; float: left; }
.enquery-form h2 { font-size: 26px !important; }
.form-list { width: 100%; height: auto; float: left; margin: 30px 0 0 0; }
.form-list li { width: 48%; height: auto; float: left; margin: 10px 13px 12px 0; }
.form-list li.floatR { float: right; }
.full-Width { width: 48% !important; }
.field { width: 100%; height: auto; float: left; border-radius: 0; border-bottom: #8c8c8c solid 1px; background: #FFF; color: #626262; padding: 20px 0 20px 10px; font-size: 15px; position: relative; }
::-moz-input-placeholder:after {
 content: "*";
 color: red;
}
.text-area { height: 130px; resize: none; }
.field-text { width: 100%; height: auto; float: left; font-size: 16px; color: #393939; padding: 0 0 8px 0; font-weight: 700; }
.field-text span { color: #F00; }
.field:focus { color: #232323; }
.form-list li.fullWidth { width: 100%; }
.form-list .txt-area { height: 60px; resize: none; border-bottom: #8c8c8c solid 1px; border-left: none; border-top: none; border-right: none; }
.submit { background: #a29061; padding: 15px 60px; font-size: 13px; color: #FFF; text-transform: uppercase; border-radius: 0px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.submit:hover { background: #000 }
/**********About us **********/

.about-us { width: 100%; float: left; padding: 0 60px; }
.company-profile { width: 100%; float: left; margin: 0 auto; padding: 0; }
.first-line { width: 100%; float: left; padding: 0; line-height: 35px; font-size: 18px; }
.about-container { width: 100%; float: left; }
.second-line { width: 60%; float: left; line-height: 30px; margin: 80px 0 0 0; padding-left: 50px; }
.second-line h3 { font-size: 25px; width: 100%; float: left; padding: 0; margin: 0px; line-height: 40px; text-align: justify; }
.second-line ul { width: 100%; float: left; margin: 0 0 20px 0; padding: 0; }
.consists { width: 100%; float: left; padding: 0; margin: 0 auto; }
.consists li { line-height: 30px; width: 100%; float: left; color: #ae9a63; }
.second-line ul li { width: 100%; float: left; margin: 0; padding: 0; }
.second-line h4 { font-size: 18px; font-weight: 600; width: 100%; float: left; padding: 20px 0 10px 0; margin: 30px 0 0 0; }
.third-sec { width: 100%; float: left; margin: 50px 0 0 0; padding: 0; line-height: 30px; -webkit-column-count: 2; /* Chrome, Safari, Opera */ -moz-column-count: 2; /* Firefox */ column-count: 2; -webkit-column-gap: 100px; /* Chrome, Safari, Opera */ -moz-column-gap: 100px; /* Firefox */ column-gap: 100px; }
.third-sec p { font-size: 17px; line-height: 35px; text-align: justify; }
.abt-img { width: 30%; float: left; margin: 0px 0 0 0; }
.abt-img img { width: 100%; }
.ceo { width: 100%; float: left; margin: 20px 0 0 0; }
.ceo h3 { font-size: 22px; font-weight: 700; }
.ceo p { width: 100%; float: left; font-size: 14px; font-weight: 600; }
/**********Project details **********/
.project-details { width: 100%; float: left; margin: 0 0 150px 0; padding: 0 60px; }
.proj-cont { width: 100%; float: left; margin: 0 auto; padding: 0; }
.proj-description { width: 70%; float: left; margin: 10px 0 0 0; }
.proj-description P { width: 100%; float: left; font-size: 18px; line-height: 35px; }
.proj-description-list { width: 100%; float: left; height: auto; margin: 30px 0 30px 0; }
.proj-description ul { width: 100%; float: left; height: auto; }
.proj-description ul li { width: 100%; float: left; height: auto; padding: 20px 0 0 30px; position: relative; }
.proj-description ul li:after { content: ''; position: absolute; width: 20px; height: 1px; background: #333; left: 0px; bottom: 10px; }
.proj-detail-row { width: 100%; float: left; margin: 0 auto; }
.proj-detail-row li { float: left; width: 100%; padding: 20px 0 40px 50px; }
.proj-detail-row li h3 { font-size: 22px; font-weight: 600; text-transform: uppercase; }
.proj-details { width: 100%; float: left; margin: 40px 0 0 0; }
.project-slide { width: 100%; float: left; }
.project-slide .slick-prev, .project-slide .slick-next { z-index: 9999; width: 60px; height: 70px; top: -55px; margin: 0px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.project-slide .slick-prev { background: #d50124 url(../images/arrow1.png) no-repeat right center; top: 50%; right: 0; left: inherit; }
.project-slide .slick-prev:hover { background: #e36101 url(../images/arrow1.png) no-repeat left center; }
.project-slide .slick-next { background: #d50124 url(../images/arrow2.png) no-repeat left center; top: 50%; leftt: 0; right: inherit; }
.project-slide .slick-next:hover { background: #e36101 url(../images/arrow2.png) no-repeat right center; }
.proj-head h2 { font-size: 46px; font-weight: 700; text-transform: uppercase; }
.proj-head { float: left; width: 100%; margin: 50px 0 0 0; }
.proj-head h3 { font-size: 30px; font-weight: 300; text-transform: uppercase; }
.proj-row { width: 30%; float: left; padding: 0; margin: 0px; }
.detail-row h3 { font-size: 22px; font-weight: 700; padding: 0 0 30px 0; border-bottom: 2px solid #333; margin: 0 0 30px 0 }
.location { background: url(../images/location.png) no-repeat top 20px left; }
.client { background: url(../images/client.png) no-repeat top 20px left; }
.date { background: url(../images/calader.png) no-repeat top 20px left; }
.detail-row { width: 100%; float: left; margin: 80px 0 0 0; }
.proj-detail-row li span { font-size: 18px; }
.proj-detail-row h3 { border-bottom: none; margin: 0; padding: 0 0 10px 0; }
.breadcrumb { width: 100%; float: left; margin: 40px 0 0 0; padding: 10px 10px; text-transform: uppercase; font-size: 12px; }
.breadcrumb-nav { width: 100%; float: left; margin: 0 auto; padding: 0; }
.breadcrumb-nav li { float: left; padding: 0 30px 0 0; position: relative; }
.breadcrumb-nav li a { color: #666; }
.breadcrumb-nav li:after { content: ''; background: url(../images/crumb.png) no-repeat; width: 20px; height: 15px; position: absolute; top: 0px; right: 0px; }
.active a { color: #000 !important; }
.active:after { background: none !important; }
.more-project-slider { width: 100%; float: right; margin: 30px 0; position: relative; }
.more-project { width: 100%; float: left; }
.more-slideer-bg { width: 100%; float: left; height: 70%; position: absolute; bottom: -10px; }
.more-project-cont { width: 100%; float: left; margin: 30px 0 20px 0; }
.more-project li img { width: 100%; height: 100%; }
.proj-thumb { float: left; text-transform: uppercase; padding: 0 60px 0 60px; position: relative; }
.proj-thumb h2 { font-size: 26px; width: 100%; float: left; height: auto; }
.more-project li a { color: #333; text-transform: uppercase; }
.more-project li a span { font-size: 13px; font-weight: 700; width: 100%; float: left; padding: 10px 0 0 0px; position: relative; }
.more-project li a { padding: 0 5px; float: left; }
.more-project .slick-prev, .more-project .slick-next { left: inherit; right: 0; z-index: 9999; width: 50px; height: 50px; top: -55px; margin: 0px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.more-project .slick-prev { background: #a29061 url(../images/arrow1.png) no-repeat right center; margin-left: 51px; top: -60px; }
.more-project .slick-prev:hover { background: #FFF url(../images/arrow1.png) no-repeat left center; }
.more-project .slick-next { margin: 0 50px 0 0; background: #a29061 url(../images/arrow2.png) no-repeat left center; top: -60px; right: 0px; }
.more-project .slick-next:hover { background: #FFF url(../images/arrow2.png) no-repeat right center; }
.main-proj { width: 100%; float: left; }
.proj-img { width: 103%; float: left; display: flex; flex-wrap: wrap; margin-right: -3%; }
.image-block { width: 23.1%; float: left; margin-right: 25px; flex: 1 0 1; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); -webkit-transform: translateY(15px); transform: translateY(15px); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: transform, opacity; transition-property: transform, opacity; }
.image-block:hover { -webkit-transform: translateY(-15px); transform: translateY(-15px); }
.img-box img { width: 100%; height: auto; }
.image-block:hover img { -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */ filter: grayscale(100%); }
.img-box { width: 100%; float: left; }
.image-block a { color: #333; }
.proj-title { width: 100%; float: left; position: relative; bottom: 0px; font-size: 20px; text-transform: uppercase; font-weight: 700; margin: 0 0px 0px 0px; padding: 20px 0px 20px 0px; }
.proj-title h3 { font-size: 20px; font-weight: 700; height: auto; width: 100%; overflow: hidden; }
.img-box:hover .proj-title { -webkit-transform: translateY(-5px); transform: translateY(-5px); }
.btn-view { float: left; background: #ae9a63 url(../images/more-arrow.png) no-repeat right 15px top 14px; color: #000; padding: 12px 60px 12px 15px; text-transform: uppercase; margin: 10px 0 0 0; text-align: left; width: auto; background-size: 20px; color: #FFF; }
.btn-view:after { }
.landing-page { width: 100%; float: left; margin: 0 auto; padding: 0; }
.landing-page-cont { width: 100%; float: left; margin: 0 auto; padding: 0; }
.inner-box { width: 100%; float: left; position: relative; padding: 0 10px; }
.box-img { width: 100%; float: left; position: relative; }
.box-img img { width: 100%; height: auto; }
.box-slider img { width: 100%; }
.discrp { width: 93%; float: left; position: relative; bottom: 40px; border: 1px solid #e6e6e6; background: rgba(255, 255, 255, 0.9); padding: 20px 10px; }
.discrp h2 { font-size: 16px !important; text-transform: uppercase; font-weight: 700; padding: 0 0 10px 0; }
.discrp:after { content: ''; position: absolute; background: url(../images/icon-right.png) no-repeat right center; width: 20px; height: 30px; background-size: contain; right: 8px; top: 20px; }
.btn-detail { font-size: #FFF; background: #ae9a63; padding: 10px 30px; text-transform: uppercase; }
.discrp a { color: #FFF; }
.discrp:hover { color: #333 }
.box-cont { width: 100%; float: left; margin: 0 auto; padding: 0; display: flex; flex-wrap: wrap; }
.box-cont li { flex: 1 0 1; width: 24%; float: left; margin-right: 1%; }
.box-cont li h2 { color: #333; width: 100%; float: left; }
.box-cont li span { color: rgb(255, 255, 255); }
.box-slider .slick-prev, .box-slider .slick-next { right: 0px; left: inherit; z-index: 9999; width: 50px; height: 50px; top: 0px; margin: 0px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.box-slider .slick-prev { background: #333 url(../images/arrow1.png) no-repeat right center; }
.box-slider .slick-prev:hover { background: #ae9a63 url(../images/arrow1.png) no-repeat left center; }
.box-slider .slick-next { margin: 0 50px 0 0; background: #333 url(../images/arrow2.png) no-repeat left center; }
.box-slider .slick-next:hover { background: #ae9a63 url(../images/arrow2.png) no-repeat right center; }
.inner-banner { width: 100%; float: left; margin: 0 auto; padding: 0; height: auto; }
.inner-banner img { width: 100%; height: auto; }
.jordan-list { width: 100%; float: left; height: auto; margin: 0; padding: 0; }
.jordan-list li { width: 100%; float: left; height: auto; margin: 0px; padding: 20px 0 0 0px !important; }
.jordan-list li:after { width: 0px !important; }
.jordan-list li h3 { width: 100%; float: left; height: auto; padding: 10px 0 10px 0; font-size: 18px; border: none; margin: 0; }
.back-to { float: right; width: auto; position: relative; top: -40px; padding-left: 24px; font-size: 16px; }
.back-to:after { content: ""; background: url(../images/icon-back.png) no-repeat; width: 30px; height: 20px; position: absolute; left: 0; top: 0; }
.back-to a { color: #333; }
/**********service page **********/
.services-page { width: 100%; float: left; margin: 0 auto; height: auto; padding: 0; display: flex; flex-direction: column; }
.services-cont { width: 100%; float: left; margin: 0 auto; height: auto; padding: 0; }
.left-box { width: 100%; float: left; margin: 0 0 80px 0; }
.right-box { width: 100%; float: left; margin: 0 0 20px 0; }
.serv-box { width: 45%; float: left; height: auto; margin: 0 auto; padding: 0; }
.serv-discrp { width: 55%; float: left; height: auto; margin: 0; padding: 0 3% 0 0; }
.serv-discrp h2 { font-size: 40px !important; text-transform: uppercase; font-weight: 700; }
.serv-discrp h3 { font-size: 26px !important; text-transform: uppercase; font-weight: 400; padding: 10px 0 20px 0; margin: 0 0 30px 0; position: relative; }
.serv-discrp h3:after { content: ''; position: absolute; width: 80px; height: 1px; background: #000; left: 0; bottom: 0; }
.serv-discrp p { font-size: 18px; padding: 10px 0; line-height: 30px; }
.serv-discrp a { color: #FFF; }
.btn-details { font-size: #FFF; background: #333; padding: 13px 35px; text-transform: uppercase; margin: 20px 0 0 0; }
.left-box .serv-discrp { padding: 0 0 0 3%; }
.inner-page { width: 100%; float: left; margin: 0 0 150px 0; height: auto; padding: 0 60px; }
/********** news page **********/
.news-sec { width: 100%; float: left; margin: 0 auto; padding: 0; height: auto; }
.news-cont { width: 100%; float: left; margin: 0 auto; padding: 0; height: auto; }
.btn-view-more { color: #000; float: left; }
.view { position: relative; float: left; padding: 0px 30px 0px 0; margin: 20px 0; }
.view:after { content: ''; position: absolute; width: 40px; height: 1px; background: #000; right: -20px; bottom: 10px; }
.news-col { width: 103%; margin-right: -3%; float: left; height: auto; padding: 0; display: flex; flex-wrap: wrap; }
.news-col li { width: 30.3%; margin-right: 3%; float: left; flex: 1 0 1; position: relative; }
.date-on { padding: 10px 20px; float: left; margin: 0 auto; background: #272727; color: #FFF; position: absolute; top: 0; font-size: 14px; }
.news-thumb { width: 100%; float: left; position: relative; }
.news-thumb img { width: 100%; height: auto; }
.news-disc { width: 100%; float: left; }
.news-disc p { width: 100%; float: left; color: #666; font-size: 16px; height: 43px; overflow: hidden; }
.news-disc h2 { width: 100%; float: left; height: 85px; overflow: hidden; font-size: 24px; padding: 15px 0; }
.news-detail { width: 68%; float: left; height: auto; padding-left: 2%; }
.news-detail-col { width: 100%; float: left; height: auto; }
.news-detail h2 { width: 100%; float: left; font-size: 35px !important; line-height: 43px; border-bottom: 1px solid #000; border-top: 1px solid #000; padding: 15px 0; margin: 10px 0; font-weight: 700; }
.news-banner { width: 30%; float: left; height: auto; margin: 20px 0 }
.news-banner img { width: 100%; height: 100%; }
.news-col-lg { width: 45%; float: left; margin-right: 5%; margin-top: 30px; text-align: justify; }
.news-col-lg p { width: 100%; float: left; line-height: 35px; font-size: 18px; }
.news-row { width: 100%; float: left; height: auto; }
.calendar { width: 100%; float: left; margin: 20px 0 0 0; display: inline-flex; }
.icon-calendar { float: left; font-size: 22px !important; }
.calendar h3 { font-size: 18px; font-weight: 700; padding-left: 10px; width: 100%; float: left; }
.news-detail p { width: 100%; float: left; line-height: 35px; font-size: 18px; text-align: justify; }
.news-slider-row { width: 100%; float: left; height: auto; margin: 100px 0 0 0; border-top: 1px solid #000; padding: 50px 0 0 0; }
.news-slider-row h2 { width: 100%; float: left; font-size: 26px !important; font-weight: 500; text-transform: capitalize; }
.btn-news { width: 100%; float: left; background: none; }
.news-slider-row span a { color: #222; }
.btn-all-news { color: #222; font-size: 16px; text-transform: uppercase; float: left; }
.news-slider { width: 100%; float: left; margin: 20px 0 0 0; padding: 0 0px; }
.news-slider li a h2 { color: #222; }
.news-slider h2 { font-size: 16px !important; width: 100%; float: left; font-weight: 700; padding: 6px 0; }
.news-slider p { font-size: 14px; width: 100%; float: left; }
.news-slider li a { padding: 0 10px; float: left; }
.news-slider .slick-prev, .news-slider .slick-next { right: 0; left: inherit; z-index: 9999; width: 55px; height: 50px; top: -55px; margin: 0px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.news-slider .slick-prev { background: #FFF url(../images/left-arrow.png) no-repeat right center; }
.news-slider .slick-next { margin: -20px 55px 0 0; background: #FFF url(../images/right-arrow.png) no-repeat left center; }
news-slider { width: 101%; margin-right: -1%; }
/********** subsidiaries **********/
.subsidi-sec { width: 100%; float: left; margin: 0 auto; padding: 0; height: auto; }
.subsidi-seccont { width: 100%; float: left; margin: 0 auto; padding: 0px; height: auto; }
.left-part { width: 45%; float: left; margin: 0 auto; padding: 0; }
.right-part { width: 45%; float: right; margin: 0 0 0 0; padding: 0; }
.subsidi-img { width: 50%; float: left; height: auto; }
.subsidi-img img { width: 100%; }
.subsidi-disc { width: 50%; float: left; margin: 0; padding: 0px 0 0 40px; height: auto; line-height: 30px; }
.subsidi-disc p { width: 100%; float: left; font-size: 18px; line-height: 35px; text-align: justify; }
.btn-subsidi { float: left; padding: 3px 30px; border: 1px solid #222; margin: 15px 0 0 0; cursor: pointer; }
.btn-subsidi a { color: #222; font-size: 14px; width: 100%; float: left; }
/********** vision mission **********/    
.vision-mission { width: 100%; float: left; margin: 0 auto; height: 100%; padding: 0; }
.vision-mission-sec { width: 100%; float: left; margin: 0 auto; height: 100%; padding: 0; }
.mission { width: 66%; float: left; margin: 0 auto; padding: 50px 100px 0 0; }
.col-left { width: 100%; float: left; }
.sub-title-head h2 { font-size: 30px; width: 100%; float: left; text-transform: uppercase; font-weight: 700; padding-bottom: 15px; }
.col-right { width: 100%; float: left; padding: 10px 0; }
.col-right p { font-size: 18px; line-height: 35px; width: 100%; float: left; }
.image-col { width: 30%; float: left; position: relative; z-index: -1; background: #a89256; }
.mission-img { width: 100%; float: left; margin-left: -40px; margin-top: -25px; padding-bottom: 40px; }
.mission-img img { width: 100%; float: left; }
.col-cont { width: 100%; float: left; margin: 0 auto; height: auto; }
.col-value { width: 100%; float: left; margin: 60px 0 0 0; height: auto; }
.vison { width: 45%; float: left; height: auto; margin-right: 5%; }
.value { width: 45%; float: left; height: auto; margin-right: 5%; }
.vison-head { width: 100%; float: left; }
.vision-cont { width: 100%; float: left; padding: 10px 0; }
.vision-cont p { line-height: 35px; width: 100%; float: left; font-size: 18px; }
.value-head { width: 100%; float: left; }
.value-head { width: 100%; float: left; }
.value-cont { width: 100%; float: left; padding: 10px 0; }
.value-cont p { line-height: 35px; width: 100%; float: left; font-size: 18px; }
.value-head { width: 100%; float: left; }
/********** chairman message **********/  
.message { width: 100%; float: left; height: auto; }
.chairman-img { width: 20%; padding-right: 2%; float: left; display: inline-block; vertical-align: top; }
.chairman-img img { width: 100%; height: auto; }
.co-msg { width: 75%; padding-left: 2%; display: inline-block; vertical-align: top; float: left; }
.co-msg p { font-size: 18px; line-height: 35px; width: 100%; float: left; text-align: justify; }
.chairman-img span { width: 100%; float: left; margin: 10px 0; text-align: center; }
.chairman-img span h2 { font-size: 20px !important; font-weight: 700; text-transform: uppercase; width: 100%; float: left; }
.chairman-img span p { font-size: 18px; width: 100%; float: left; }
/********** board-directors **********/    
.board-directors-sec { width: 100%; float: left; margin: 0 auto; height: 100%; padding: 0; }
.directors { width: 100%; float: left; margin: 0 auto; height: 100%; padding: 0; }
.direct-list { width: 103%; float: left; margin-right: -3%; height: 100%; padding: 0; display: flex; flex-wrap: wrap; }
.direct-list li { width: 22.6%; float: left; display: 101; margin-right: 2%; margin-top: 50px; position: relative; }
.direct-list li:after { content: ''; position: absolute; width: 150px; height: 1px; background: #000; bottom: 0; left: 0; }
.direct-img { width: 100%; float: left; }
.direct-img img { width: 100%; height: auto; }
.direct-cont { width: 100%; float: left; padding: 20px 0; }
.direct-cont h3 { font-size: 22px; font-weight: 700; width: 100%; float: left; color: #000; text-transform: uppercase; }
.direct-cont span { width: 100%; float: left; color: #333; padding: 10px 0 0 0; font-size: 18px; }
/********** career page **********/    

.career-form-list { width: 100%; float: left; height: auto; }
.career-part { width: 100%; float: left; height: auto; }
.career-form { width: 100%; float: left; height: auto; }
.career-form-list .field { border: #8c8c8c solid 1px; padding: 20px 0 20px 10px; }
.career-form-list li { padding: 10px 0; margin: 0px; width: 30%; margin-right: 3%; float: left; }
.career-form-list li label { color: #222; margin: 0 0 10px 0; }
.btn-sub { padding: 15px 50px; background: #ae9a63; }
.submit-btn { margin: 39px 0 0 0 !important; }
.submit-btn a { color: #333; font-size: 18px; text-transform: uppercase; }
/********** Gallery Page **********/    

.gallery-sec { width: 100%; float: left; margin: 0 auto; }
.gallery { width: 100%; float: left; margin: 0 auto; padding: 0; height: auto; }
.gallery h2 { width: 100%; float: left; padding: 15px 0; font-size: 30px; text-transform: uppercase; font-weight: 700; color: #ae9a63; margin: 0 0 20px 0; }
.gallery > ul { margin-bottom: 0; }
.gallery-thumb { width: 100%; float: left; padding: 0; height: auto; }
.gallery-thumb li { float: left; width: 33%; background: #000; }
.gallery-thumb li a { display: block; overflow: hidden; position: relative; float: left; }
.gallery-thumb li a > img { -webkit-transition: -webkit-transform 0.15s ease 0s; -moz-transition: -moz-transform 0.15s ease 0s; -o-transition: -o-transform 0.15s ease 0s; transition: transform 0.15s ease 0s; height: 100%; width: 100%; opacity: 0.6; }
.gallery-thumb li a:hover > img { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); opacity: 1; }
.gallery-row { width: 100%; float: left; height: auto; padding: 0; }
.gallery-row ul { padding: 0; }
.gallery-list { width: 100%; float: left; height: auto; display: flex; flex-wrap: wrap; display: -webkit-flex; -webkit-flex-wrap: wrap; }
.gallery-list li { width: 48%; float: left; height: auto; margin: 0 2% 10px 0; }
.gallery-list li a { color: #222; }
.effect-sadie img { width: 100%; height: auto; }
/**********service civil **********/    

.civil-page { width: 100%; float: left; height: auto; margin: 0 auto; padding: 0; }
.civil-cont { width: 70%; float: left; height: auto; margin: 40px 0 0 0; text-align: justify; }
.serv-cont { width: 32%; float: left; height: auto; margin: 0 0 0 3%; padding: 0; }
.service-pages p { font-size: 17px; height: auto; width: 100%; float: left; line-height: 35px; }
.serv-img { width: 65%; float: left; height: auto; margin: 0 auto; }
.servl-img img { width: 100%; }
/**********awards **********/   
.awards-sec { width: 100%; float: left; height: auto; margin: 0 auto; padding: 0; }
.awards { width: 100%; float: left; height: auto; margin: 0 auto; padding: 0; }
.awards ul { width: 103%; float: left; padding: 0; margin-right: -3%; }
.awards-list { width: 100%; float: left; height: auto; padding: 0; }
.awards-list li { width: 22%; float: left; margin-bottom: 3%; margin-right: 3%; border: 1px dotted #333; background: #ae9a63; }
.awards-list li:hover .award-img img { opacity: 0.5; }
.award-img { width: 100%; float: left; padding: 0; }
.award-img img { width: 100%; height: auto; }
.award-discp { width: 65%; float: left; height: auto; padding: 0 0 0 5%; }
.award-discp p { width: 100%; float: left; padding: 0; font-size: 18px; line-height: 35px; }
.award-thunp { width: 35%; float: left; height: auto; }
.award-thunp img { width: 100%; height: 100%; }
.award-discp h2 { width: 100%; float: left; height: auto; font-size: 24px; font-weight: 600; padding: 0 0 20px 0; }
.sky-list { width: 100%; height: auto; display: flex; flex-wrap: wrap; text-align: center; }
.sky-list li { width: 20%; float: left; margin: 30px 0 50px 0; }
.sky-list li h3 { font-weight: 600; }
.sky-list li .sky-image { width: 100%; }
.sky-nrml li h4 { font-size: 20px; padding-bottom: 0px !important; line-height: 26px; }
/* inner page */
.page-menu li a { color: #d50124 !important; }
.page-menu li:hover a { color: #FFF !important; }
.inner-banner { width: 100%; float: left; height: auto; }
.inner-banner img { width: 100%; height: auto; }
.inner-pages { width: 100%; float: left; height: auto; padding: 100px 0; }
.raised-flooring { width: 100%; float: left; height: auto; }
.row { width: 100%; float: left; height: auto; padding: 50px 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
.left-col { width: 50%; float: left; height: auto; }
.right-col { width: 50%; float: left; height: auto; }
.right-col .content { padding-left: 80px; }
.left-col .content { padding-right: 80px; }
.content { width: 100%; float: left; height: auto; }
.inner-pages h1 { width: 100%; float: left; height: auto; font-size: 46px; line-height: 56px; color: #272727; padding-bottom: 60px; }
.inner-pages p { width: 100%; float: left; height: auto; font-size: 16px; line-height: 24px; color: #272727; }
.inner-pages p a { color: #e46100; }
.inner-pages .container { width: 100%; float: left; height: auto; padding: 0 100px; }
.img-box { width: 100%; float: left; height: auto; }
.img-box img { width: 100%; height: auto; }
.listing { width: 100%; float: left; height: auto; padding-top: 50px; }
.listing li { width: 100%; float: left; height: auto; background: url(../images/tick.png) no-repeat left 0 top 8px; background-size: 30px; padding-left: 40px; padding-bottom: 30px; }
.row h2 { width: 100%; float: left; height: auto; font-size: 26px; text-transform: uppercase; font-weight: 600; padding-bottom: 10px; color: #d50124; }
.row h4 { width: 100%; float: left; height: auto; font-size: 25px; line-height: 40px; padding-bottom: 50px; position: relative; text-align: left; }
.list-box { width: 100%; float: left; height: auto; }
.listing-line { width: 100%; float: left; height: auto; }
.listing-line li { width: 100%; float: left; height: auto; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 30px 0; border-bottom: 1px solid rgb(219, 219, 219); }
.list-img { width: 30%; float: left; height: auto; }
.list-img img { width: 70%; height: auto; }
.list-cont { width: 70%; float: left; height: auto; }
.list-box h4::after { display: none; }
.sub-listing { width: 100%; float: left; height: auto; margin-top: 20px; }
.sub-listing li { background: none; width: 100%; float: left; height: auto; list-style: decimal; padding-bottom: 10px; color: #626262; padding-left: 10px; }
.b-listing li { background-position-y: 5px; background-size: 24px; }
hr { width: 100%; float: left; height: auto; }
.content h3 { width: 100%; float: left; height: auto; font-size: 26px; color: #d4070c; line-height: 33px; padding-bottom: 20px; padding-top: 20px; text-transform: uppercase; font-weight: 600; }
.sub-head { color: #272727 !important; }
.abt-head { color: #393939 !important; padding-bottom: 40px !important; float: left; }
.row h5 { width: 100%; float: left; height: auto; font-size: 18px; line-height: 26px; padding-bottom: 20px; color: #5e5e5e; }
.abt-btm { width: 100%; float: left; height: auto; background: #222 url(../images/abt-bg.png) no-repeat top 0 left 0; background-attachment: fixed; background-size: cover; padding: 50px 0; margin: 50px 0; }
.abt-box { flex: 1; margin-right: 50px; border: 2px solid #e46100; padding: 30px; }
.abt-box:last-child { margin-right: 0px; }
.abt-box p { color: #FFF; }
.abt-box h2 { color: #e46100; padding-bottom: 10px; font-weight: 600; }
.row-box { width: 100%; float: left; height: auto; display: flex; flex-wrap: wrap; justify-content: center; padding: 50px 50px; }
.left-side-box { width: 100%; float: left; height: auto; }
.message-box { width: 100%; float: left; height: auto; display: flex; flex-wrap: wrap; justify-content: center; -webkit-border-top-left-radius: 50px; border-top-left-radius: 80px; -moz-border-radius-topleft: 80px; }
.profile-box h3 { font-size: 20px; text-transform: uppercase; padding-top: 20px; width: 100%; float: left; height: auto; }
.profile-pick { width: 70%; float: none; height: auto; display: inline-block; margin: 0 auto; text-align: center; border-radius: 100%; border: 4px solid #ff7610; }
.profile-box { width: 20%; float: left; display: flex; height: auto; justify-content: center; align-items: flex-start; flex-wrap: wrap; padding-top: 50px; }
.profile-pick img { width: 100%; height: 100%; border-radius: 100%; }
.message-cont { width: 70%; float: left; height: auto; padding: 50px 0 150px 60px; }
.message-cont p { width: 100%; float: left; height: auto; font-size: 16px; line-height: 35px; position: relative; padding: 50px 0; color: #333333; }
.message-cont p:after { content: ''; position: absolute; left: -35px; top: 20px; background: url(../images/icon-top1.png) no-repeat; width: 26px; height: 26px; }
.message-cont p:before { content: ''; position: absolute; right: 0; bottom: 0; background: url(../images/icon-bottom.png) no-repeat; width: 26px; height: 26px; }
.message-cont h2 { width: 100%; float: left; height: auto; font-size: 30px; line-height: 35px; text-transform: uppercase; padding-bottom: 10px; color: #d50124; font-weight: 400; }
.chairman-msg { width: 100%; float: left; height: auto; position: relative; }
.chairman-msg:after { content: ''; position: absolute; width: 17%; height: 100%; left: 0; top: 0; background: #d4070c; z-index: -1; }
.chairman-msg h1 { width: 100%; float: left; height: auto; font-size: 46px; line-height: 26px; color: #272727; padding-bottom: 60px; padding-top: 80px; }
.chairman-msg .container { padding: 0 100px; }
.message-box h5 { width: 100%; float: left; height: auto; font-size: 16px; padding-bottom: 6px; color: #666; }
.message-box h3 { width: 100%; float: left; height: auto; font-size: 20px; padding-bottom: 6px; color: #d50124; }
/*projects list */
.proj-img { width: 100%; float: left; display: flex; flex-wrap: wrap; }
.proj-img li { width: calc(93%/3); float: left; margin-right: 25px; margin-bottom: 50px; position: relative; background: #000; }
.effect-ming img { opacity: 0.5; }
.img-box img { width: 100%; height: auto; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); -webkit-transform: translateY(15px); transform: translateY(15px); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: transform, opacity; transition-property: transform, opacity; }
.img-box { width: 100%; float: left; height: auto; position: relative; }
figure.effect-ming span { padding: 1em; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: scale(1.5); transform: scale(1.5); bottom: 20px; font-size: 20px; position: absolute; text-align: center; float: none; display: inline-block; color: #FFF; width: 100%; left: 0; }
figure.effect-ming:hover figcaption::before, figure.effect-ming:hover span { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
.proj-value h2 { font-weight: 700 !important; color: #FFF !important; -webkit-transform: perspective(0px) translateZ(0); transform: perspective(0px) translateZ(0); -webkit-transform: translateY(0px); transform: translateY(0px); transition: 1s;font-size: 22px; }
.grid figure { width: 100%; height: auto; float: left; }
.grid figure img { width: 100%; height: auto; }
.proj-img li:hover h2 { -webkit-transform: perspective(-40px) translateZ(0); transform: perspective(-40px) translateZ(0); -webkit-transform: translateY(-40px); transform: translateY(-40px); border-left: 4px solid #fff; padding-left: 20px; }
.sub-hd { color: #333333 !important; padding-bottom: 20px !important; font-size: 18px; float: left; }
.s-listing li { background-position-y: 22px; }
.contact-us { width: 100%; height: auto; margin: 0 auto; padding: 0; float: left; }
.contact-part { width: 100%; height: auto; margin: 0 auto; float: left; }
.address-cont { width: 35%; float: left; display: flex; }
.contect-row { width: 100%; float: left; display: flex; flex-wrap: wrap; background: #FFF; }
.contact-cont { width: 65%; float: left; height: auto; display: flex; background: #FFF; }
.address { width: 100%; float: left; margin: 0 auto; padding: 40px 30px; background: #d4070c; line-height: 30px; color: #FFF; }
.address h2 { float: left; width: 100%; font-weight: 700; font-size: 22px; line-height: 30px; }
.tel-num { width: 100%; float: left; padding: 0; margin: 40px 0 0 0; line-height: 40px; }
.tel { background: url(../images/phone-icon.png) no-repeat left top 0px; background-size: 50px; }
.fax { background: url(../images/fax-icon.png) no-repeat left top 0px; background-size: 50px; }
.address-icon { background: url(../images/address.png) no-repeat left top 5px; background-size: 50px; }
.mail { background: url(../images/icon-mail.png) no-repeat left top 0px; background-size: 50px; }
.mail a { color: #fefefe; }
.mail a:hover { color: #121212; }
.tel-num li { padding-left: 70px; width: 100%; float: left; height: auto; font-size: 18px; padding-bottom: 30px; }
.location_map { width: 65%; float: left; height: auto; }
.board-members-list { width: 100%; height: auto; display: flex; flex-direction: row; flex-wrap: wrap; margin: -50px 0 50px 0; }
.board-members-list li { height: auto; display: flex; margin: 0px 0 50px 0; width: calc(100% / 4); position: relative; }
.board-members-list li h2 { font-size: 22px; }
.board-members-list li p { width: 100%; height: auto; float: left; font-size: 15px; color: #272727; font-weight: 600; }
.director-box { width: 85%; height: auto; float: left; max-width: 450px; background: #FFF; -webkit-box-shadow: 11px 11px 18px -16px rgba(0,0,0,1); -moz-box-shadow: 11px 11px 18px -16px rgba(0,0,0,1); box-shadow: 11px 11px 18px -16px rgba(0,0,0,1); padding: 20px 30px 20px 20px; border-bottom: #d50124 solid 3px; }
.members-photo { width: 100%; height: auto; float: left; }
.main-members { margin-bottom: 130px; }
.main-members li { flex-direction: column; }
.main-members li img { width: 80%; }
.main-members li .director-box { position: absolute; bottom: -50px; left: 0px; }