*{box-sizing: border-box; margin: 0; padding: 0; outline: none;}
body{font-size: 62.5%; font-family: "Roboto", sans-serif;}
.bluebase{background-color: #11263b;}
.yellowbase{background-color: #fbc025;}
.topbg{background-color: #f0f2f3; width: 100%; padding: 10px;}
.container-fluid{width: 100%; max-width: 1900px; margin: 0 auto;}
.container{max-width: 1400px; margin: 0 auto;}
.topbginner{width: 100%; display: flex; flex-wrap: wrap;}
.topbginner > strong{font-size: 1.6em; color: #6d6f7f; font-weight: 400;}
.topbginner .smedia{margin-left: auto;}
.topbginner .smedia ul{list-style: none; display: flex;}
.topbginner .smedia ul li{flex: auto; border-left: 1px solid #bcc2c8; padding: 0 20px;}
.topbginner .smedia ul li:first-child{border: none;}
.topbginner .smedia ul li a{text-decoration: none; display: flex; align-items: center; font-size: 1.4em; color: #888888; font-weight: 500; transition: all .5s;}
.topbginner .smedia ul li a img{margin-right: 4px;}
.topbginner .smedia ul li a:hover{color: #000000;}

.header{width: 100%; display: flex; flex-wrap: wrap; align-items: center; padding: 10px 0; position: relative;}
.header .logo{width: 150px;}
.header .logo img{width: 100%;}
.header .headgrp{margin-left: auto;}
.header .headgrp .hrow{width: 100%; display: flex; align-items: center; flex-wrap: wrap;}
.header .headgrp .hrow .col{flex: auto; border-left: 1px solid #d3d3d3; padding: 10px 35px;}
.header .headgrp .hrow .col:first-child, .header .headgrp .hrow .col:last-child{border: none;}
.header .headgrp .hrow .col .numberbox{width: auto; position: relative; padding-left: 50px;}
.header .headgrp .hrow .col .numberbox > img { position: absolute; left: 0px; top: 5px;}
.header .headgrp .hrow .col .numberbox > span{font-size: 1.4em; margin-bottom: 4px; display: block;}
.header .headgrp .hrow .col .numberbox > a{text-decoration: none; font-weight: 500; color: #000000; font-size: 1.6em; text-decoration: none;}
.header .headgrp .hrow .col .requestbtn{width: auto;}
.header .headgrp .hrow .col .requestbtn > a{background-color: #ffba01; padding: 14px 30px; color: #000000; font-size: 1.4em; text-decoration: none; border-radius: 4px; text-transform: uppercase; font-weight: 500; transition: all .5s;}
.header .headgrp .hrow .col .requestbtn > a:hover{background-color: #ffc935;}
.header .headgrp .hrow .col:nth-child(2) .numberbox{padding-left: 42px;}


.navigation{width: 100%; display: flex; flex-wrap: wrap;}
.navigation ul{list-style: none; display: flex; width: 100%; position: relative;}
.navigation ul li{flex:0 0 auto; position: relative;}
.navigation ul li::before, .navigation ul li::after{position: absolute; right: 0; top: 12px; height: 26px;}
.navigation ul li::before{width: 1px; content: ''; background-color: #04121d;}
.navigation ul li::after{width: 1px; content: ''; background-color: #2e4053; right: 1px;}
.navigation ul li a{text-decoration: none; color: #ffffff; font-size: 1.4em; text-transform: uppercase; padding:16px 20px; display: block; position: relative; transition: all .5s;}
.navigation ul li a:hover{background-color: #06111c;}
.navigation ul li a::after{content: ''; position: absolute; bottom: 0px; left: 0; right: 0; margin: auto; background-color: #ffba01; transition: all .5s; height: 1px; width: 0;}
.navigation ul li a:hover::after{width: 100%;}
.navigation ul li:last-child:before, .navigation ul li:last-child:after{content: none;}
.navigation ul li:last-child{margin-left: auto;}
.navigation ul li .inputsrc{position: relative; height: 48px;} 
.navigation ul li .inputsrc input[type="text"]{height: 100%; width: 100%; background-color: #061928; border: none; color: #ffffff; padding:0 15px; height: 48px; padding-right: 50px; line-height: 48px; font-size: 1.4em; transition: all .5s;}
.navigation ul li .inputsrc input[type="text"]:focus{background-color: #8d8d8d;}
.navigation ul li .inputsrc input[type="text"]::placeholder{color: #ffffff;}
.navigation ul li .inputsrc img{position: absolute; right: 15px; top: 14px; z-index: 99; cursor: pointer;}


.bannerbase{position: relative; max-width: 1900px; margin: 0 auto;}
.bannerbase img{width: 100%;}
.bannerbase .bannersection{position: absolute; top: 0; left: 0; right: 0; margin: auto; max-width: 1400px; height: 100%; display: flex; align-items: center;}
.bannerbase .bannersection .bannercont{max-width: 600px; padding-left: 100px;}
.bannerbase .bannersection .bannercont strong{font-size:4.6em; font-weight: 600; color: #ffffff; line-height: 48px;}
.bannerbase .bannersection .bannercont p{font-size: 1.6em; color: #ffffff; line-height: 22px; margin: 20px 0;}
.bannerbase .bannersection .bannercont .bannerbtngrp{display: flex; width: 100%;}
.bannerbase .bannersection .bannercont .bannerbtngrp ul{display: flex; flex-wrap: wrap; width: 100%; list-style: none;}
.bannerbase .bannersection .bannercont .bannerbtngrp ul li{margin-right: 10px; background-color: #ffba01; width: 160px; height: 48px; border-radius: 4px;  transition: all .5s;}
.bannerbase .bannersection .bannercont .bannerbtngrp ul li:hover{background-color: #ffc935;}
.bannerbase .bannersection .bannercont .bannerbtngrp ul li:hover:last-child{background-color: #2f9ec1;}
.bannerbase .bannersection .bannercont .bannerbtngrp ul li a{text-decoration: none; font-size: 1.4em; text-transform: uppercase; color: #000000; font-weight: 500; display: block; height: 100%; width: 100%; text-align: center; line-height: 48px;}
.bannerbase .bannersection .bannercont .bannerbtngrp ul li:last-child{background-color: #51c5e9;}
.bannerbase .bannersection .bannercont .bannerbtngrp ul li:last-child a{color: #ffffff;}

.brandbottom{position: relative;}
.brandbottom > img{margin-bottom: -4px; width: 100%; background-color: #ffffff;}
.brandlogo{display: flex; justify-content: space-around; align-items: center; padding: 5px 0 0; }
.brandlogo img{flex:0 0 auto;}



.introsection{width: 100%; padding: 70px 0;}
.heading{width: 100%; text-align: center;}
.heading span{font-size: 1.6em; color: #51c5e9; font-weight: 600; text-transform: uppercase; margin-bottom: 10px; display: block;}
.heading span::before, .heading span::after{height: 1px; background-color: #51c5e9; content: ''; display: inline-block; width: 40px; margin-left: 5px;}
.heading span::before{margin-left: 0; margin-right: 5px;}
.heading h1, .heading h2{font-size: 3.2em; color: #000000;}

.introw{width: 100%; display: flex; justify-content: space-between; margin-top: 50px; flex-wrap: wrap;}
.introw .col{flex: 0 0 50%;}
.introw .col .introimg{width: 100%; max-width: 415px; position: relative;}
.introw .col .introimg img{border-radius: 6px;}
.introw .col .introimg img:last-child{background-color: #ffffff; padding: 8px; position: absolute; bottom: 25px; right:-180px;}
.introw .col .introtext{width: 100%;}
.introw .col .introtext p{font-size: 1.6em; line-height: 26px; margin-top:30px;     color: #676767;}
.introw .col .introtext a.learnmore{background-color: #ffba01; font-size: 1.4em; text-transform: uppercase; color: #000000; width: 160px; height: 48px;  border-radius: 5px; display: flex; align-items: center; justify-content: center; font-weight: 500; text-decoration: none; margin-top: 30px; transition: all .5s;}
.introw .col .introtext a.learnmore:hover{background-color: #ffc935;}


.wedosection{width: 100%; position: relative;}
.wedosection > img{width: 100%;}
.wedosection::after{background-color: rgba(0 0 0 / 90%); position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: '';}
.wedoinset{max-width: 1400px; position: absolute; left: 0; right: 0; margin: auto; top: 0; z-index: 9; display: flex; align-items: center; height: 100%; flex-wrap: wrap; padding: 50px 0;}
.wedoinset .heading h2{color: #ffffff;}
.wedoinset .eventrow{width: 100%; display: flex;}
.wedoinset .eventrow .col{background-color: #051420; margin-right: 2%; flex:0 0 13%; transition: all .5s;}
.wedoinset .eventrow .col:hover{transform:scale(1.1); background-color: #ffba01; cursor: pointer;}
.wedoinset .eventrow .col:first-child{background-color: #ffba01; flex: 0 0 24%; display: flex; align-items: center; padding: 80px;}
.wedoinset .eventrow .col:first-child strong{color: #000000; font-size: 5.4em; font-weight: 800; text-align: left; line-height: 50px; padding: 0; text-transform: capitalize;}
.wedoinset .eventrow .col .iconbox{height: 180px; width: 100%; display: flex; align-items: center; justify-content: center;}
.wedoinset .eventrow .col .iconbox > img{width: auto; height: auto;}
.wedoinset .eventrow .col strong{font-size: 1.6em; color: #ffffff; font-weight: 700; text-transform: uppercase; text-align: center; width: 100%; display: block; padding-bottom: 30px;}
.wedoinset .eventrow .col strong span{display: block;}
.wedoinset .eventrow .col:last-child{margin: 0;}


.testimonialsection{width: 100%; display: block; padding: 60px 0;}
.monialcontent{width: 100%; display: block;}
.monialcontent .monialbox{display: flex; flex-wrap: wrap; width: 100%; margin: 80px auto 0; max-width: 880px; justify-content: space-between;}
.monialcontent .monialbox .monialimg{width:220px; height: 220px; position: relative;}
.monialcontent .monialbox .monialimg img{width: 100%; border-radius: 100%; height: 100%;}
.monialcontent .monialbox .monialimg::before {border-radius: 50%; background-color: #ffba01; width: 230px; height: 230px; content: ''; display: block; position: absolute;
top: -13px; left: -12px; z-index: -1;}
.monialcontent .monialbox .monialimg::after {border-radius: 50%;  background-color: #ffba01; width: 190px; height: 190px; content: ''; display: block; position: absolute;
top: -50px; left: -50px; z-index: -1;}
.monialcontent .monialbox .monialcnt{flex: 0 0 calc(100% - 340px); display: flex; justify-content: space-between; flex-wrap: wrap;}
.monialcontent .monialbox .monialcnt p{font-size: 1.8em;  color: #676767; line-height: 24px;}
.monialcontent .monialbox .monialcnt .monialheading{width: 100%;}
.monialcontent .monialbox .monialcnt .monialheading strong{color: #ffba01; font-size: 2.4em; display: block;}
.monialcontent .monialbox .monialcnt .monialheading span{font-size: 1.6em; color: #676767;}


.workrow{display: flex; flex-wrap: wrap; width: 100%; margin-bottom: 50px;}
.workrow .col{flex: 0 0 24%; margin-right: 1%;}
.workrow .col > img{border-radius: 5px;}


.wehelp{width: 100%; padding: 80px 0 50px;}
.wehelp .wrow{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 40px;}
.wehelp .wrow .col{flex: 0 0 48%;}
.wehelp .wrow .col .helpintro p{color: #676767; font-size: 1.6em; line-height: 26px; margin: 20px 0;}
.wehelp .wrow .col .helpintro > img{width: auto;}

.helpform{width: 100%;}
.helpform .formwrap{margin-top: 22px;}
.helpform .formwrap input[type="text"], .helpform .formwrap textarea{background-color: #edf9fd; height: 48px; line-height: 48px; padding: 0 10px; width: 100%; border: 1px solid #dceff5; font-size: 1.6em; font-family: inherit; transition: all 0.5s;}
.helpform .formwrap input[type="text"]:focus, .helpform .formwrap textarea:focus{border-color: #11263b;}
.helpform .formwrap textarea{height: 100px;}
.helpform .formwrap input[type="button"]{height: 54px; width: 240px; background-color: #ffba01; border: none; font-size: 1.6em; line-height: 48px; color: #000000; font-weight: 500; margin-top: 20px; cursor: pointer; transition: all .5s;}
.helpform .formwrap input[type="button"]:hover{background-color: #ffc935;}
.helpform .formwrap p{color: #676767; font-size: 1.6em;}
.helpform .formwrap p a{color: #11263b;}


.footerbase{max-width: 1400px; position: absolute;  left: 0; right: 0; margin: auto; top: 0;  z-index: 9; height: 100%; padding: 80px 0;}
.footerbase .frow{width: 100%; display: flex; flex-wrap: wrap; position: relative;}
.footerbase .frow .col{flex:0 0 22%;}
.footerbase .frow .col:first-child{flex:0 0 32%;}
.footerbase .frow .col .footerinfo{width: 100%;}
.footerbase .frow .col .footerinfo > strong{font-size: 2.2em; font-weight: 400; color: #ffffff; margin-bottom: 30px; display: block; position: relative;}
.footerbase .frow .col .footerinfo .contactinfo{width: 100%;}
.footerbase .frow .col .footerinfo .contactinfo p, .footerbase .frow .col .footerinfo .contactinfo a{font-size: 1.6em; color: #ffffff; position: relative; padding-left: 30px; line-height: 24px;}
.footerbase .frow .col .footerinfo .contactinfo a{text-decoration: none; color: #ffffff; width: 100%; display: block; margin: 25px 0;}
.footerbase .frow .col .footerinfo .contactinfo p img, .footerbase .frow .col .footerinfo .contactinfo a img{position: absolute; left: -5px;}
.footerbase .frow .col .footerinfo .infolink{width: 100%;}
.footerbase .frow .col .footerinfo .infolink ul{list-style: none; padding-left: 18px;}
.footerbase .frow .col .footerinfo .infolink ul li{width: auto; margin: 8px 0; list-style: disc; color: #ffffff; font-size: 1.6em;}
.footerbase .frow .col .footerinfo .infolink ul li a{text-decoration: none; color: #ffffff;}
.footerbase .frow .col .footerinfo .infolink ul li a:hover{text-decoration: underline;}
.footerbase .frow .col .footerinfo .newsletterinfo{width: 100%;}
.footerbase .frow .col .footerinfo .newsletterinfo input[type="text"]{width: 100%; height: 48px; line-height: 48px; padding:0 10px; font-family: inherit; background-color: #405161; font-size: 1.6em; border: none; color: #ffffff; transition: all .5s;}
.footerbase .frow .col .footerinfo .newsletterinfo input[type="text"]:focus{background-color: #a3a6a9;}
.footerbase .frow .col .footerinfo .newsletterinfo input[type="text"]::placeholder{color: #ffffff;}
.footerbase .frow .col .footerinfo .newsletterinfo input[type="submit"]{height: 48px; width: 100%; background-color: #ffba01; border: none; font-size: 1.8em; line-height: 48px; color: #000000; font-weight: 500; margin-top:15px; cursor: pointer; text-transform: uppercase;}
.footerbase .frow:last-child{width: 100%; padding-top: 30px; margin-top: 40px;}
.footerbase .frow:last-child .col{flex: 0 0 50%;}
.footerbase .frow:last-child .col .copyright{text-align: left;}
.footerbase .frow:last-child .col .copyright p{color: #ffffff; font-size: 1.4em;}
.footerbase .frow:last-child .col ul{list-style: none; display: flex; justify-content: flex-end;}
.footerbase .frow:last-child .col ul li{flex:0 0 auto; border-right: 1px solid #ffffff; padding:0 10px;}
.footerbase .frow:last-child .col ul li a{text-decoration: none; color: #ffffff; font-size: 1.4em;}
.footerbase .frow:last-child .col ul li a:hover{text-decoration: underline;}
.footerbase .frow:last-child .col ul li:last-child{border: none;}
.footerbase .frow:last-child::before, .footerbase .frow:last-child::after{content: ''; width: 100%; height: 1px; position: absolute; top: 0; background-color: #2e4053;}
.footerbase .frow:last-child::after{background-color: #04121d; top:2px;}
.mobilenav{width: 48px; height: 28px;  position: absolute;  top: 118px;  right: 15px; display: none; cursor: pointer;}
.mobilenav span{ width: 100%; height: 2px; background-color: #000000; top: 12px; display: block; position: absolute; transition: all .5s;}
.mobilenav span:first-child{top: 0;}
.mobilenav span:last-child{top: 24px;}

.mobilenav.navshow span{background-color: #ffffff; opacity:0;}
.mobilenav.navshow span:first-child{top: 12px; opacity:9; transform: rotate(45deg);}
.mobilenav.navshow span:last-child{top: 12px; opacity:9; transform: rotate(-45deg);}

.mobilenav.navshow + .navigation{left:0%;}




@media only screen and (max-width:1400px){
.navigation ul li a{padding: 16px 10px;}
.brandlogo{overflow: auto; padding:  0 30px;}
.brandlogo img{margin: 0 30px;}
.introw .col .introimg img:last-child{right: 0;}
.container{width: 96%;}
.wedoinset .eventrow{overflow: auto;}
.wedoinset .eventrow .col{flex: 0 0 180px;}
.wedoinset .eventrow .col:first-child{padding: 40px; flex: 0 0 250px;}
.monialcontent .monialbox{max-width: 700px;}
.wedosection > img{object-fit: cover;}
.footerbase{width: 96%;}
}

@media only screen and (max-width:900px){
    .header .logo{width: 125px;}
    .header .headgrp .hrow .col{padding: 10px;}
    .header .headgrp .hrow .col .requestbtn > a{padding: 14px; font-size: 1.4em;}        
    .navigation ul li:last-child{position: absolute; right: 0; top: -48px;}
    .introw .col{flex: 0 0 100%;}
    .introw .col .introimg img:last-child{right: -150px;}
    .monialcontent .monialbox .monialimg{margin-left: 70px;}
div#testimonial .owl-carousel .owl-nav {width: 130px; top: auto;bottom: 100px; left: 0; right: 0;  margin: auto;}
.wehelp .wrow .col{flex: 0 0 100%;}
.wehelp .wrow .col .helpintro > img{width: 100%; max-width: 450px; height: auto;}
}

@media only screen and (max-width:767px){
.mobilenav{display: block; z-index: 9;}
.header{margin: 0; padding: 0;}
.header .logo{width: 100%; background-color: #d9d9d9; padding: 7px 0 5px 7px;}
.header .logo  img{width: 100px;}
.header .headgrp .hrow .col .numberbox, .header .headgrp .hrow .col:nth-child(2) .numberbox{padding: 0;}
.header .headgrp .hrow .col .numberbox img{display: none;}
.header .headgrp .hrow .col .requestbtn > a{display: block; width: 100%; text-align: center;}
.topbginner{justify-content: center;}
.topbginner .smedia{margin-top: 10px;}
.navigation ul{flex-direction: column;}
.navigation ul li{flex: 0 0 auto; border-bottom: 1px solid #7a7a7a;}
.navigation ul li:last-child{position: inherit; width: 100%;}
.navigation{width: 300px; position: fixed; top: 0; left: -100%; height: 100vh;  background: #626262; overflow: auto; z-index: 9; transition: all .5s;}
.overlay{position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0 0 0 / 0%); z-index:0; content: ''; visibility: hidden;}
.mobilenav.navshow + .navigation + .overlay{background-color: rgba(0 0 0 / 40%); visibility: visible;}
.topbginner > strong{width: 100%; text-align: center;}
.topbginner .smedia{margin: 10px 0 0;}
.bannerbase .bannersection .bannercont{padding: 20px;}
.bannerbase .bannersection .bannercont strong{font-size: 3em; line-height: 32px;}
.bannerbase img{height: 460px; object-fit: cover;}
.bannerbase .bannersection .bannercont .bannerbtngrp ul li{width: 120px;}
.heading h1, .heading h2{font-size: 2.8em;}
.monialcontent .monialbox .monialcnt{flex: 0 0 100%; text-align: center;}
.monialcontent .monialbox .monialcnt .monialheading{margin-top: 20px;}
.monialcontent .monialbox .monialcnt .monialheading strong{font-size: 1.8em;}
.monialcontent .monialbox .monialcnt p{font-size: 1.6em; margin-top: 30px;}
.wedoinset .eventrow .col:first-child strong{font-size: 4.4em;}
.monialcontent .monialbox .monialimg{margin-left: auto; margin: auto;}
div#testimonial .owl-carousel .owl-nav, div#latestproject div.owl-theme .owl-nav{width: 105px;}
div#testimonial div.owl-theme .owl-nav [class*=owl-], div#latestproject div.owl-theme .owl-nav [class*=owl-]{width: 50px; height: 50px;}
.wedosection{margin: 60px 0 0; overflow: hidden;}
.workrow .col > img{width: 100%; height: auto;}
.wedoinset{padding: 0;}
img[src$="assets/images/workbanner.jpg"], img[src$="assets/images/wedobanner.jpg"]{height: 460px;}
img[src$="assets/images/footerbanner.jpg"]{height: 350px;}

div#latestproject .owl-carousel .owl-nav{bottom: -50px;}
.wehelp{padding:70px 0 0;}
.footerbase{padding: 40px 0; overflow: auto;}
.footerbase .frow{z-index: 9;}
.footerbase .frow .col .footerinfo .contactinfo, .footerbase .frow .col .footerinfo .infolink, .footerbase .frow .col .footerinfo .newsletterinfo{margin-top: 15px;}
.footerbase .frow .col .footerinfo .contactinfo a{margin: 5px 0;}
.footerbase .frow .col .footerinfo > strong{margin-bottom:5px; font-size: 1.8em; font-weight: 600;}
.footerbase .frow .col:first-child, .footerbase .frow .col {flex: 0 0 100%; margin-bottom: 10px; border-bottom: 1px solid #979797; padding-bottom: 10px;}
.footerbase .frow .col .footerinfo .newsletterinfo input[type="submit"]{width: 140px; margin: 0;}
.footerbase .frow .col .footerinfo .newsletterinfo input[type="text"]{width: calc(100% - 145px);}
.footerbase .frow .col:last-child{border: none;}
.footerbase .frow:last-child{padding-top: 20px; margin-top: 0;}
.footerbase .frow .col .footerinfo .contactinfo p img, .footerbase .frow .col .footerinfo .contactinfo a img{left: 0;}
.footerbase .frow .col .footerinfo .infolink ul li{font-size: 1.4em;}
.footerbase .frow:last-child .col{border: none; margin: 0; flex:0 0 100%; display: flex; justify-content: center;}
.footerbase .frow:last-child .col .copyright p, .footerbase .frow:last-child .col ul li a{text-align: center; font-size: 1.2em;}
.wehelp .wrow{margin-top: 0;}
.footerbase .frow .col .footerinfo > strong span{position: absolute; right:10px; top: 6px;}
.footerbase .frow .col .footerinfo > strong span::before, .footerbase .frow .col .footerinfo > strong span::after{content: ''; height: 15px; width: 1px; background-color: #ffffff; display: block; transition: all .5s;}
.footerbase .frow .col .footerinfo > strong span::before{transform: rotate(40deg);}
.footerbase .frow .col .footerinfo > strong span::after{transform: rotate(-40deg); margin-top: -15px;  margin-left: -9px;}
.footerbase .frow .col .footerinfo > strong span.arwdwn::before{transform: rotate(140deg);}
.footerbase .frow .col .footerinfo > strong span.arwdwn::after{transform: rotate(-140deg);}
.contactinfo, .infolink, .newsletterinfo{display: none;}
.navigation ul li::before, .navigation ul li::after{display: none;}
.header .headgrp{margin-right: auto;}
}

@media only screen and (max-width:480px){
    .introw .col .introimg > img{width: 100%;}
    .introw .col .introimg img:last-child{right: 10px; width: auto;}
}


/* bof: Logo Scroller */
.marquee0{ display: flex; align-items: center; justify-content: center; width: 100%;}
.marquee0 img{width:auto; height: auto; margin: 5px 30px 0;}
.marquee0 > div {width: 100% !important;}
.marquee0 > div > div{display: flex; justify-content: space-around; align-items: center;}
.marquee0 > div > div > img{height:fit-content;}
/* Eof: Logo Scroller */
