@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
body,html,p{margin:0px; padding:0px; font-family: 'Poppins', sans-serif; font-weight:500; color: #1d1d1d; font-size: 15px;}
*{margin:0;padding:0;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
aside, details, figcaption, figure, ins, summary, small, mark, title, video, footer, header, hgroup, nav, section, article {display:block;}
.clear{padding:0; margin:0; line-height:0; height:0; font-size:0; clear:both; width:100%; display:block;}
h1, h2, h3, h4, h5, h6 { padding:0; margin:0; font-weight:normal; color: #001536;}
html, body {height:100%; width:100%; padding:0; margin:0;}
body *{box-sizing:border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
ul li{list-style:none;}
input,button{outline:none; border:none;}
a, a:hover, a:focus{text-decoration:none; outline:none;}
a:active,a:hover {outline: 0;}
button{transition:all .5s;}
:focus{outline:none;}
img{border:none;}



header{}
.topMenu{background: #17aaff;}
.call{ margin: 0px;font-family: 'Roboto', sans-serif;float: right;}
.call li{ font-size: 13px; color: #012b44; display: inline-block;font-weight: 400;}
.call li + li a{color: #012b44;}
.call li + li a:hover{text-decoration: underline;}
.call li span{display: block; font-size: 15px; color: #282828; font-weight: 500;}
.call li + li{padding-left: 30px;}
.slider{position:relative;}
.slider .slidCont{position:absolute; z-index:9; text-align:left; width:100%; color:#FFF; padding:0 0%; top:0%; height: 100%;  align-items: center;display: flex;}
.cnBox{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1dd5e7+0,46aef7+100 */
background: #1dd5e7; /* Old browsers */
background: -moz-linear-gradient(top,  #1dd5e7 0%, #46aef7 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #1dd5e7 0%,#46aef7 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #1dd5e7 0%,#46aef7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1dd5e7', endColorstr='#46aef7',GradientType=0 ); /* IE6-9 */
width:375px; height: 375px; border-radius: 50%; text-align: center; padding: 94px 37px; float: right;}
.slider .slidCont h1{font-size: 25px; font-weight: bold; color: #fff; line-height: 35px;}
.slider .slidCont a{background:none;display:inline-block;margin-top:20px;color:#fff;font-size:16px;font-weight:400;padding:8px 30px;border:1px solid #fff;}
.slider:after{content:""; position:absolute; top:10%; left:0px; height:80%; width:100%; background:#fdd8d0;}
.slider .owl-nav,
.slider .owl-dots{ text-align:center;position: absolute;bottom: 0;width: 100%; z-index:2;}
.slider .owl-nav .owl-prev, .slider .owl-nav .owl-next{ background:none;font-size: 42px;padding: 0 16px;line-height: 0; color:#afafaf;}
.slider .owl-nav .owl-prev:hover, .slider .owl-nav .owl-next:hover{ color:#2e3191;}
/*.slider .item{background:#0c35a7; border-radius:6px; position:relative;}*/
.slider .item img{border-radius:0px;}


/*------ Weclome Section -----*/
.welcome{ padding: 70px 0;}
.intro{position:relative; padding-left:30px; margin-top: 30px;}
.intro::before{width: 1px; height: 70px; background: #3cb7f3; content: ""; position: absolute; left: 0; top:7px;}
.intro::after{width: 1px; height: 70px; background: #3cb7f3; content: ""; position: absolute; left:7px; top:7px;}
.welcome h2{font-size: 35px; color: #001536; font-weight: bold;}
.intro h3{font-size:20px; color: #001536; font-weight: bold; padding-bottom: 15px;}
.welcome .intro p{padding-bottom: 20px; padding-top: 0px;}
.welcome h2 span{ color: #3cb7f3;}
.welcome p{line-height:29px; padding: 25px 0;}
.welcome a {background:none;display:inline-block;margin-top:20px;color:#3cb7f3;font-size:16px;font-weight:400;padding:8px 30px;border:1px solid #3cb7f3;transition: all 0.5s;}
.welcome a:hover{background: #3cb7f3; color: #fff;}
.mainFrame a{border:none;padding:0px;font-weight: 500;}
.mainFrame a:hover{background:none; color:#3cb7f3;}
/*------ Client Section -----*/
.client{ padding: 70px 0;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#66a6ff+0,89f7fe+100 */
background: #66a6ff; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #66a6ff 0%, #89f7fe 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #66a6ff 0%,#89f7fe 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #66a6ff 0%,#89f7fe 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66a6ff', endColorstr='#89f7fe',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
.clientInfo{position:relative; padding-left:30px; margin-top: 30px;}
.clientInfo::before{width: 1px; height:40px; background: #fff; content: ""; position: absolute; left: 0; top:7px;}
.clientInfo::after{width: 1px; height:40px; background: #fff; content: ""; position: absolute; left:7px; top:7px;}
.clientInfo h2{font-size: 35px; color: #001536; font-weight: bold; margin-bottom:30px;}
.clientInfo h2 span{ color: #fff;}
.clientInfo ul{}
.clientInfo ul li{ display: block; margin-bottom: 15px; position: relative; padding-left: 20px; color: #fff;font-size: 16px;}
.clientInfo ul li:before{background: #000; width: 8px;height: 8px; border-radius: 50%; left: 0; top: 8px;content: ""; position: absolute;}

/*------ Services Section -----*/
.services{padding:70px 0;}
.services h2::before{width: 1px; height:35px; background: #3cb7f3; content: ""; position: absolute; left: 0; top:3px;}
.services h2::after{width: 1px; height:35px; background: #3cb7f3; content: ""; position: absolute; left:7px; top:3px;}
.services h2{font-size: 35px; color: #001536; font-weight: bold; margin-bottom:50px; position: relative; padding-left:35px;}
.services h2 span{ color:#3cb7f3;}

.sBox{box-shadow: 0 0 7px #BDE6F4; height: 100%;}
.sBox figure{margin: 0px;}
.sBox figcaption{padding:20px 15px;}
.sBox a{ color: #3cb7f3; padding-top:20px; display: inline-block;}

footer{ background: #103045; padding: 30px 0; color: #fff;}
.ftMenu{ margin: 0px;}
.ftMenu li{ padding-bottom: 10px;}
.ftMenu li a{color: #fff; font-size: 13px;}
.ftMenu li:last-child{padding-bottom: 0px;}
.ftMenu li a img{padding-right: 5px; transition: all 0.5s;}
.ftMenu li a:hover img{padding-right: 15px;}


/* ===================== Mainframe Support Page ==================*/
/* --------- Breadcrumbs ---------*/
.pageCaption{position: absolute;width: 100%;top: 0;display: flex;align-items: center;height: 100%;text-align: left;}
.pageBanner{background:#011c44;}
.pageBanner img{opacity: 0.20;}
.pageBanner h1{font-size:36px;color:#fff;margin-bottom:10px;font-weight: 500;}
.breadcrumb{background:none;border-radius:0;padding:0;margin:0;display: inline-block;}
.breadcrumb li{display: inline-block;}
.breadcrumb-item a{color:#fff;font-weight:400;}
.breadcrumb-item.active{color:#6ac8ff;font-weight:400;}
.breadcrumb-item+.breadcrumb-item::before{content:"-";color:#fff;}

.conlist{}
.conlist li{ display: block; margin-bottom: 15px; position: relative; padding-left: 20px; color: #1d1d1d;font-size:15px;}
.conlist li:before{background: #17aaff; width: 8px;height: 8px; border-radius: 50%; left: 0; top: 8px;content: ""; position: absolute;}
.intro h4{color: #103045; font-size: 21px; font-weight: 500; padding-top: 20px; padding-bottom: 20px;}
.welcome .intro .add{ padding:0; color: #103045; font-size: 17px; font-weight: 500;}
.welcome .intro .add span{color: #17aaff;}


/* ===================== About Us Page ==================*/
.naics{}
.naics h3{font-size: 22px;color:#17aaff;font-weight: bold;padding-bottom: 15px;}
.naics h4{font-size:18px;color: #001536;font-weight: bold;padding-bottom: 15px;}
.naics ul{}
.naics ul li{ display: block; margin-bottom: 15px; position: relative; padding-left: 20px; color: #1d1d1d;font-size: 16px;}
.naics ul li:before{background: #17aaff; width: 8px;height: 8px; border-radius: 50%; left: 0; top:7px;content: ""; position: absolute;}

/* ======================== Contact Us ========================*/
.addSection{padding: 70px 0;}
.addSection h2{color:#2c2c2c; font-size: 38px; font-weight: 600; text-align: center;margin-bottom:10px;}
.addSection h2 span{display: block;}
.addSection p{text-align:center; margin-bottom:50px;}
.address{text-align: center;}
.address img{padding-bottom:20px;}
.address h3{font-size: 17px; padding-bottom: 10px; color: #2c2c2c; font-weight: 500; text-transform:uppercase;}
.address p{font-size: 15px; color: #6f6f6f; }
.address p a{color: #6f6f6f; }
.address p a:hover{color:#0081ff; }

.mapSection{padding: 70px 0; background:#E8F0FF;}
.mapSection iframe{width: 100%; height: 600px;}

.conInfo{/*padding:40px; margin-bottom: 30px;*/}
.conInfo h1{font-size: 24px; font-weight:400; color: #474747; margin-bottom:30px;}
.conInfo h2{font-size: 20px; font-weight:400; color: #474747; margin-bottom: 15px;}
.conInfo label{font-size: 14px; color: #858585; display: block;}
.conInfo input{background: #fff; height:50px; border-radius:0px; border: none; padding: 5px 10px; font-size: 14px; color: #999da4;}
.conInfo select{background: #fff; height:50px; border-radius:0px; border: none; padding: 5px 10px; font-size: 14px; color: #999da4;}
.conInfo textarea{background: #fff; height:100px; border-radius:0px; border: none; padding: 5px 10px; font-size: 14px; color: #999da4;}
.conInfo input:focus, .conInfo textarea:focus, .conInfo select:focus{box-shadow:none;background: #f0f5f7;}
.conInfo button{}
.conInfo button{background: #0081ff; padding:7px 36px; color: #fff; border-radius: 0px;display: inline-block;font-size: 20px;font-weight:500;transition: all 0.5s;text-transform: uppercase;}
.conInfo button:hover{background:#000;}
.conInfo h3{font-size:32px; font-weight: 500; text-transform: uppercase; color: #fff; text-align: center; margin-bottom: 30px;}
.conInfo h3 span{display: block;}

/* ================ MEDIA QUERY ================ */


@media screen and (max-width:1199px){

}

@media screen and (max-width:991px){

header .topMenu{display:flex; align-items:center; justify-content:flex-end;}
.topMenu .stellarnav a.menu-toggle{font-size:0px;}
.topMenu .stellarnav.mobile{order:3; width:auto;}
.slider .slidCont{padding:0 10%;}
.slider .slidCont h2{font-size:40px;}
	
}


@media screen and (max-width:991px){
.slider .item img{ height:350px; object-fit: cover;}
.cnBox{text-align: center;padding: 26px 0;float: right;background: none; width: 100%; height: auto;}
.welcome h2, .clientInfo h2, .services h2{font-size:25px;}
}


@media screen and (max-width:767px){
.slider .item img{ height:300px; object-fit: cover;}
.cnBox{text-align: center;padding: 26px 0;float: right;background: none; width: 100%; height: auto;}
.ftMain .col-sm-6{margin-top:20px;}
.copyRight{text-align:center;}
.welcome, .client, .services{padding: 35px 0;}
.intro{ margin-top: 0px;}
.welcome a{margin-bottom: 20px; margin-top: 0;}
.pageBanner img{height:150px;object-fit:cover;}
.pageBanner h1{font-size:24px;}	
.intro h3{margin-top:20px;}	

}


@media screen and (max-width:575px){
header{padding-top:5px;}
header .topHead{display:none;}
.slider .slidCont{top:20%;}
.slider .slidCont h2{font-size:30px;}
header .topMenu{margin-top:6px;}
.intro h3{font-size: 18px;}
	.intro h4{font-size:16px;}
	.welcome .intro .add{font-size: 15px;}
}

@media screen and (max-width:479px){
.call li + li {padding-left:10px;}	
header a.topLogo img{width:80px;}
.stellarnav .menu-toggle span.bars{margin-right:0px;}
.topMenu .stellarnav a.menu-toggle{padding:10px 0 10px 0px;}
.slider .slidCont{padding:0 20px; top:15%;}
.slider .slidCont h2{font-size:20px;}
.slider .slidCont p{font-size:14px; line-height:18px;}
}