body{ margin:auto; font-family: "Roboto", arial !important;  background:#ffffff; }
ul, h1, h2, h3, h4, h5, h6, p, form, table{ margin:0; padding:0; font-weight:normal;}
li{ list-style:none}
a{ text-decoration:none;}
a img{ border:none}
.clr{ clear:both}
.fnt-gry{color:#868484 !important}
.fnt-size16{ font-size:16px; line-height:30px; color:#5d5c5c} 
.fnt-size18{ font-size:18px; line-height:30px; color:#5d5c5c} 
.fnt-wht{color:#ffffff !important}
.roboto-light{font-family: "Roboto Light";}
.hdr{position:fixed; top:0px; height:100px; width:100%; z-index:999; background:#ffffff; box-shadow:0px 0px 15px #666666;}
.tpbrdr{ height:4px; background:#168aac; border-radius:0 0 10px 10px; position:absolute; left:0; right:0; z-index:99999}
.topcall-email{position: absolute;  top: 20px; right: 15px;  font-size: 14px; color: #228fab;}
.topcall-email a{color: #228fab;}
.topcall-email span{ display:inline-block; margin-left:10px}
.okbs-logo{ display:inline-block; float:left; margin-top:25px}
.navigation{float:right; z-index:9999999999}
.navigation li{ float:left;}
.navigation li a{color:#393838; font-size:15px;display:block; text-transform:uppercase;  margin:60px 0 0 15px; padding:3px 6px; border-radius:4px }
.navigation li a:hover{ background:#168aac; color:#ffffff}
.navigation li a.vsble{ background:#168aac; color:#ffffff}
.nav-for-mobile{border-left: 1px solid #ebe8e6; position:relative;  height:45px; width:30px;    margin: 0 0 0 10px;    padding: 35px 0 0 15px; float:right; display:none;  cursor:pointer;}
.nav-for-mobile span{ width:100%; float:left; height:4px; background:#1e1e1e; margin-bottom:4px; border-radius:20px}
.nav-for-mobile-vsbl{ position:absolute; z-index:9999; top:0;  bottom:0; right:0px; opacity:0; display:none;  cursor:pointer; height:80px; width:50px;}

.heading{ font-size:35px; color:#292929; text-transform:uppercase; border-left:3px solid #228fab; padding-left:15px; clear:both}
.wrapper{width:100%; float:left; position:relative;}
.main-in{max-width:1100px; padding:0 15px; margin:auto; position:relative}

#home{margin-top:100px; box-shadow: 0px 5px 15px #ccc;}

#about-us{background:#fafafa;  padding:70px 0; }
#about-us p{ margin-top:25px}
.about-intro{ margin:0 370px 0 0}
.testimonial{ width:300px; position:absolute; top:80px;  right:15px; background:#ffffff; padding:15px; border:1px solid #edefef; border-radius:6px}
.testimonial h2{ font-size:18px; display:block; padding-bottom:6px; border-bottom:1px solid #edefef}
.testimoniallist{ width:100%; float:left; margin-bottom:10px; border-bottom:1px dotted #edefef; font-size:13px; color:#6b6c6c; font-style:italic; padding:12px 0}
.testimoniallist span{ color:#1e85a0; font-weight:bold;}
.testimoniallist:last-child{ border:none}

.testimonial-formobile{ display:none;     margin-bottom: 30px;}
.testimonial-forweb{}

#services{padding:70px 0;}
#services ul{ width:100%; float:left; clear:both; }
#services li{float:left; width:33.33%;  position:relative; margin-top:30px; text-align:center; padding:30px 0}
#services li h2{font-size: 15px;    color: #515151;    font-weight: bold;    text-transform: uppercase;    margin: 15px 0;}
.icon-imgbox{ height:100px}
.icon-imgbox img{max-width:100px}
#services li:hover{ background:#e8e8e7}

#clients{padding:70px 0; background-color: #119ee7;}
#clients h2{color:#fff; border-left: 3px solid #fff;}
#clients ul{ width:100%; float:left; clear:both; }
#clients li{width:33.33%; float:left; text-align:center; margin-top:50px}
#clients li img{width:95%}
    

#why-we{padding:70px 0; }
#why-we h3{ font-weight:bold; margin:20px 0 30px 0px}
#why-we li{ font-size:16px; position:relative; color:#5d5c5c; padding-left:40px; margin-bottom:25px}
#why-we li span{ width:30px; height:30px; color:#ffffff; background:#228fab; text-align:center; line-height:30px; font-size:16px; position:absolute; left:0px; top:0px; border-radius:100%}

#team{padding:70px 0; background:#fafafa;}
#team ul{ width:100%; float:left; clear:both; margin-top:30px}
#team li{float:left; width:22%; padding-right:3%; position:relative; margin-top:30px; min-height:260px}
#team li:nth-child(4){ padding-right:0;}
#team li img{width: 93%; border: 6px solid #fff; box-shadow: 0px 0px 1px #ccc;}
#team li h2{font-size: 15px;    color: #515151;    font-weight: bold;    text-transform: uppercase;    margin: 15px 0;}
#team li span{font-size: 14px;  color: #414141;  margin-bottom: 5px; float:left; clear:both}

.team-details-box{position: fixed; z-index:999999; top:100px; bottom:0px; left:0px; right:0px; background-color:rgba(0,0,0,0.6); display:none}
.team-details-box-in{ margin:auto; position: relative; top:50px;  border:1px solid #ccc; padding:15px; width:500px; background:#fff;s}
.team-details-box h3{ font-size: 16px;    color: #515151;    font-weight: bold;    text-transform: uppercase;    margin: 15px 0;}
.team-details-box p{font-size: 14px;  color: #6f6e6e; line-height:24px}

.closeforall{ width:30px; height:30px; line-height:30px; background:#444444; text-align:center; font-size:15px; font-weight:bold; color:#ffffff; position:absolute; top:0px; right:0px;; z-index:999999}

#contact-us{background:#fafafa;  padding:70px 0;}
#contact-us li{ float:left; width:40%; padding:0px 5%; margin-top:25px; font-size:14px; color:#5d5c5c}
#contact-us li h3{ font-weight:bold}
#contact-us li:first-child{box-shadow: 1px 0px 0px #ccc; padding-left:0px}
#contact-us li div{ margin-top:20px; }
.location{background:url(../images/location.png) no-repeat 0px 4px; padding-left:30px;}
.call{ background:url(../images/call.png) no-repeat 0px 4px;padding:5px 0px 5px 30px;}
.email{background:url(../images/email.png) no-repeat 0px 7px;padding:5px 0px 5px 30px;}
.facebook{background:url(../images/FB.png) no-repeat 0px 7px; width: 20px; background-size: 20px; height: 26px; display: inline-block; position:relative; top:3px}
.linkedin{background:url(../images/lk.png) no-repeat 0px 7px;width: 20px; background-size: 20px; height: 26px; display: inline-block;position:relative; top:3px}
.gplus{background:url(../images/gplus.png) no-repeat 0px 7px;width: 20px; background-size: 20px; height: 26px; display: inline-block;position:relative; top:3px}
.whatsapp{background:url(../images/whatsapp.png) no-repeat 0px 7px;width: 20px; background-size: 20px; height: 26px; display: inline-block;position:relative; top:3px}
.footer{background:#228fab; text-align:center; padding:30px 0; float:left; width:100%; clear:both; font-size:15px; color:#ffffff}


@media screen and (max-width:800px){
.hdr{ height:80px}
.nav-for-mobile{ display:block}
.navigation{position: fixed; left:0; top:80px; background:#ffffff; bottom:0px; overflow-y:scroll; width:300px; display:none}
.navigation li{ float:none}
.navigation li a{ border-radius:0px; padding:15px; margin:0}
.okbs-logo{margin-top: 35px;}
.okbs-logo img{ width:110px}
#home{ margin-top:80px}
#services li{width:50%;}
#team li{width:48%;}
#team li:nth-child(2){ padding-right:0;}
.topcall-email {top: 12px; right: auto; left: 15px; font-size:12px}
.about-intro {margin: 0 0px 0 0;}
.testimonial {width: 95%;   position: relative;    top: 0;    right: auto;   padding: 2.5%;    float: left;}
.team-details-box {top: 80px; overflow-y:scroll; width:90%; max-width:800px; padding:5%}
.team-details-box-in {top: 0px;    width: auto;  }
}
@media screen and (max-width:650px){
#services{padding:30px 0; }
#services li {width: 100%; clear: both; margin-top: 20px;}
#team{padding:30px 0; }
#team li { width: 100%;  padding-right: 0; clear: both; margin-top: 0px; min-height:auto; margin-bottom:20px}
#about-us{padding:30px 0; }
.heading{font-size:24px; }
.fnt-size16{ font-size:14px; line-height:24px;}
#why-we{padding:30px 0; } 
#contact-us{padding:30px 0; }
#contact-us li{ width:100%; padding:0px;}
#contact-us li:first-child{box-shadow: 0px 1px 0px #ccc; padding-bottom:30px}
.testimonial-formobile{ display:block}
.testimonial-forweb{ display:none}
#clients{padding:30px 0; }
#clients li{margin-top:20px}
}

@font-face {
font-family: "Roboto";
font-style: normal;
font-weight: 300;
src: local('Roboto Light'), local('Roboto-Light'), url("Roboto-Light.ttf") format('truetype');
}
@font-face {
font-family: "Roboto";
font-style: normal;
font-weight: 400;
src: local('Roboto Regular'), local('Roboto-Regular'), url("Roboto-Regular.ttf") format('truetype');
}