/* CSS Document */
@charset "utf-8";
@import url('font-awesome.min.css');
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,400i,500,700');

/*Common CSS*/
body{font-family: 'Roboto', sans-serif; overflow-x: hidden;}
h1, h2, h3, h4, h5, h6{margin: 0; padding: 0;}
ul, li{list-style: none; padding: 0; margin: 0;}
a{text-decoration: none !important;}
.padding_0{padding: 0;}
section{padding: 80px 0;}
h1 {font-weight: 300; font-size: 36px; color: #333;}
h1 span {font-weight: 500;}
h1::after {content: ''; display: block; width: 57px; height: 2px; background-color: #336; margin-top: 30px; margin-bottom: 30px;}
p, ul li{font-size: 16px; color: #666; margin: 0; line-height: 26px;}
ul li{line-height: 32px;}
.common-btn a {font-size: 16px; color: #fff; background-color: #336; border: 1px solid #336; padding: 12px 25px; transition: 0.3s;}
.common-btn a:hover{background-color: #fff; color: #336; transition: 0.3s;}
.ul-styling li::before{content: '\f105'; font-family: FontAwesome; font-size: 14px; color: #666; margin-right: 8px;}
.ul-styling li{display: flex;}
.ul-styling{margin-bottom: 25px;}

/*Navigation*/
.navigation .dropdown-menu > li > a {text-transform: capitalize; font-size: 16px; color: #333; line-height: 38px; border-bottom: 1px solid #ccc;}
.navigation .navbar-default {background-color: #fff; border-color: transparent; box-shadow: 0px 2px 10px -5px rgba(0,0,0,0.2); height: 95px; margin: 0; z-index: 99;}
.navigation .navbar-right {margin-top: 22px;}
.navigation .navbar-default .navbar-nav > li > a {color: #333; font-size: 16px; padding: 15px 0; border-bottom: 5px solid #fff; margin: 0 30px; transition: 0.3s;font-weight: 500; letter-spacing: 1px;}
.navigation .navbar-default .navbar-nav > li > a:hover{border-bottom: 5px solid #336; transition: 0.3s; color: #336;}
.navbar-default .navbar-nav > li.active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {color: #336; background-color: transparent; border-bottom: 5px solid #336;}
.navigation .navbar-default .navbar-nav > .open > a, .navigation .navbar-default .navbar-nav > .open > a:focus, .navigation .navbar-default .navbar-nav > .open > a:hover {background-color: transparent;}
.navigation .navbar-right .dropdown-menu {right: auto; left: 0; border-radius: 0; padding: 0;}
.navigation .navbar-right .dropdown-menu > li > a:hover {background-color: #336; color: #fff;}
.navigation .dropdown-menu > .active > a, .navigation .dropdown-menu > .active > a:focus, .navigation .dropdown-menu > .active > a:hover {background-color: #336; color: #fff !important;}

/*Home Banner*/
.home-banner{box-shadow: 0px 2px 10px -5px rgba(0,0,0,0.2);}
.banner1{background: url(../images/banner1.png) top center no-repeat; height: 550px;}
.banner2{background: url(../images/banner2.png) top center no-repeat; height: 550px;}
.banner3{background: url(../images/banner3.png) top center no-repeat; height: 550px;}
.home-banner h1 {font-size: 52px; font-weight: 900; text-transform: capitalize; line-height: 68px; color: #fff;  text-shadow: 1px 3px 2px #000;}
.home-banner h1:after{display: none;}
.home-banner .mob-text{ margin-top: 120px;}
.home-banner .carousel-control.left, .home-banner .carousel-control.right{background-image: none;}

/*Mission*/
.mission {background: url(../images/mission-bg.png) top center no-repeat; height: 500px; background-attachment: fixed; background-size:cover; text-align: center;}
.mission h1::after{margin: 30px auto;}
.mission .white-box{background-color: #336; opacity: 0.9; padding: 40px; margin-top: 35px;}
.mission .white-box p{font-size: 20px; font-weight: 300; font-style: italic; line-height: 32px;}
.mission .white-box p, .mission .white-box h1{color: #fff;}
.mission .white-box h1::after{background-color: #fff;}

/*Footer*/
.footer{background-color: #336; padding:60px 0;}
.about-footer img{margin-bottom: 10px;}
.footer h4{font-size: 24px; font-weight: 700; color: #fff; margin:25px 0 20px;}
.footer .about-footer p{color: #fff; font-size: 15px;}
.footer .quick-links li > a::before{content:'\f105'; font-family: FontAwesome; font-size: 14px; color: #fff; margin-right: 8px; transition: 0.3s;}
.footer .quick-links li > a{color: #fff; font-size: 14px; line-height: 40px; text-transform: capitalize;}
.footer .quick-links li:hover a{color: #fff; font-weight: 600;}
.footer .quick-links li:hover a::before{color: #fff;}
.footer .touch p{display: flex; color: #fff; font-size: 15px; line-height: 28px;}
.footer .touch i{color: #fff; font-size: 14px; margin-top: 5px; margin-right: 12px;}
.footer .touch a{color: #fff;}
.footer .quick-links li.active a::before{color: #fff;}
.footer .quick-links li.active a{color: #fff; font-weight: 600;}
.footer .social i{color: #fff; font-size: 22px; transition: 0.3s;}
.footer .social p{display:inline-block;}
.copyright p{font-size:14px; line-height:22px; padding:20px 0; color:#fff;}
#btmcopyright {background: #333159; color: #fff;}
#btmcopyright a{color: #fff;}

/*Product Home*/
.product-home{background-color: #f5f5f5;}
.product-home .box{background-color: #fff; padding: 20px; text-align: center; transition: 0.5s; margin-bottom: 30px; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1); border: 5px solid #fff; height: 305px;}
.product-home .box:hover{box-shadow: none; transition: 0.5s; border: 5px solid #336;}
.product-home .box img{margin-bottom: 30px; margin-top: 5px; width: 54px; height: 54px;}
.product-home .box h4{color: #336; font-size: 18px; font-weight: 500; text-transform: capitalize; margin-bottom: 25px;}
.product-home .box p{margin-bottom: 25px;}
.product-home .box label{font-size: 16px; color: #333; font-weight: 500; cursor: pointer;}
.product-home h1{text-align: center; margin-bottom: 50px;}
.product-home h1::after{margin: 30px auto;}

/*Clients*/
.clients .owl-carousel .owl-wrapper-outer {padding: 30px 0px;}
.clients .owl-theme .owl-controls .owl-buttons div {color: #1b273d; padding: 0; font-size: 30px; background: none;}
.clients .owl-theme .owl-controls {position: relative;}
.clients .owl-prev {position: absolute; top: -110px; left: -65px;}
.clients .owl-next {position: absolute; top: -110px; right: -65px;}

/*Inner Banner*/
.inner-banner {background: url(../images/inner-banner.png) top center no-repeat; height: 400px; box-shadow: 0px 2px 10px -5px rgba(0,0,0,0.2);}
.inner-banner h1{color:#fff; padding-bottom: 22px;  text-shadow: 1px 3px 2px #000; font-weight: 500; font-size: 36px;}
.inner-banner h1:after{display: none;}
.inner-banner p{color: #fff; font-weight: 500; font-size: 15px; text-transform: uppercase;}
.inner-banner a{color:#fff;}
.mob-inner {margin-top: 250px;}

/*About us Page*/
.about-us p{line-height: 28px; margin-bottom: 26px;}
.why-us-about{background-color: #f5f5f5;}
.why-us-about strong{font-size: 20px;}
.why-us-about ul li::before{content: '\f105'; font-family: FontAwesome; font-size: 14px; color: #666; margin-right: 8px;}

/*Products Page*/
.side-bar .nav > li > a {background-color: #f9f9f9; font-weight: 400; font-size: 16px; color: #666; border-bottom: 1px solid #f4f4f4; margin-bottom: 12px; padding: 12px 25px; transition: 0.2s; box-shadow: 0px 2px 10px -5px rgba(0,0,0,0.2);}
.side-bar .nav > li > a:hover, .side-bar .nav > li > a:focus, .side-bar .nav > li.active a{background-color: #336;color: #fff; transition: 0.2s; box-shadow: none;}
.side-bar img{margin-bottom: 25px;}
.side-bar p{margin-bottom: 20px;}
.side-bar h3{color: #336; font-size: 22px; margin-bottom: 10px; text-transform: capitalize; line-height: 32px;}

.carousel-inner .common-btn a{font-size: 18px; color: #336; background-color: #fff; border: 1px solid #fff; padding: 20px 40px; transition: 0.3s;}
.carousel-inner .common-btn a:hover{background-color: #336; color: #fff; transition: 0.3s;}

/*Contact Us*/
.contact .contact-info h3{font-size:28px; color:#083d5f; font-weight:700; padding-bottom:42px;}
.contact .contact-info p a, .contact .contact-info p {font-size:17px; color:#666;}
.contact .contact-info p i{margin-right:18px;font-size:20px; margin-top: 2px;}
.contact .contact-info p {display:flex;padding:10px 0;}
.contact .form-group{margin-bottom:18px;}
.contact .form-control{border-radius:unset;height: 45px;font-size:14px;font-weight:400; border:1px solid #ccc; box-shadow: none;}
.form-control:focus{box-shadow: none;}
.contact textarea.form-control{height:auto;}
.contact .form-control::placeholder{color:#999;}
.btn-default{background-color: #336;color:#fff;padding: 15px 30px;transition:0.3s;border-radius: 0; font-size: 16px;}
.btn-default:hover{background-color:#fff;color:#083d5f;transition:0.3s;}

/*Thank You*/
.thank h1::after{margin: 30px auto;}

/*Media Queries*/
@media screen and (max-width: 400px) {

}

@media screen and (min-width: 401px) and (max-width: 767px) {
    
}

@media screen and (max-width: 767px) {
    /*Common*/
    h1 {font-size: 28px;}
    /*Navigation*/
    .banner1, .banner2, .banner3{background-position-x: 56%; background-position-y: -120px; height: 430px;}
    .banner2{background-position-y: -90px; background-position-x: 70%;}
    .banner3{background-position-x: 65%;}
    .home-banner .mob-text{background-color: #fff; opacity: 0.9; padding: 20px; margin-top: 140px; border-radius: 10px;}
    .home-banner h1 {font-size: 30px; line-height: 36px; color: #336; text-shadow: none; font-weight: 600; padding-left: 20px;}
    .mob-text .common-btn{padding-left: 20px;}
    .carousel-inner .common-btn a {color: #fff; background-color: #336; padding: 12px 24px; font-size: 16px;}
    .mob-navigation {box-shadow: 0px 2px 10px -5px rgba(0,0,0,0.2); position: relative; z-index: 9999;}
    .sidenav {height: 100%;width: 0; position: fixed; z-index: 1;top: 0;left: 0;background-color: #fff;overflow-x: hidden; transition: 0.5s; padding-top: 80px;box-shadow: 2px 0px 5px 0px rgba(0,0,0,0.15);}
    .sidenav a {padding: 8px 0px 8px 20px; font-size: 16px; color: #333; display: block; transition: 0.3s; font-weight: 500; border-bottom: 1px solid #ccc;}
    .sidenav a:hover {color: #000;}
    .sidenav .closebtn {position: absolute; top: 0; right: 20px; font-size: 36px; margin-left: 50px;}
    .mob-ul {margin-left: 10px;}
    .mob-ul li a{font-weight: 400; border-bottom: none;}
    a.closebtn {border-bottom: none;}
    .sidenav .dropdown-menu {position: relative; box-shadow: none; border: none; border-bottom: 1px solid #ccc; margin-bottom: 8px;}
    .sidenav .dropdown-menu > li > a {padding: 8px 10px; text-transform: capitalize;}
    .mission .white-box p {font-size: 18px;}
    /*Footer*/
    .copyright p{text-align: center;border-bottom: 1px solid #666;}
    .footer{padding-top: 20px;padding-bottom: 40px;}
    /*Home*/
    .home-about img{margin-top: 40px;}
    .mission .white-box {padding: 20px;}
    .mission{height: 520px;}
    .why-us img{margin-bottom: 40px;}
    .clients .owl-theme .owl-controls .owl-buttons div{display: none;}
    .product-home .box{transition: unset;}
    .product-home .box:hover{transition: unset;}
    /*Inner Banner*/
    .inner-banner{background-position-x: 62%; height: 358px;}
    .mob-inner{background-color: #fff; opacity: 0.9; padding: 20px; margin-top: 165px; border-radius: 10px;}
    .mob-inner h1{font-size: 26px; line-height: 28px; color: #336; text-shadow: none; font-weight: 600;}
    .mob-inner a, .mob-inner p{color: #336;}
    .about-inner .mob-inner{margin-top: 205px;}
    /*Product*/
    .side-bar .nav{margin-bottom: 40px;}
}

@media (min-width: 768px) and (max-width: 991px) {
    /*Navigation*/
    .navigation .navbar-default .navbar-nav > li > a{margin: 0 20px;}
    .banner1{background-position-x: 70%;}
    .banner2{background-position-x: 70%;}
    .banner3{background-position-x: 70%;}
    .home-banner .mob-text{background-color: #fff; opacity: 0.9; padding: 20px; margin-top: 225px; border-radius: 10px; width: 50%;margin-left: 55px;}
    .home-banner h1 {font-size: 36px; line-height: 42px; color: #336; text-shadow: none; font-weight: 600;}
    .carousel-inner .common-btn a {color: #fff; background-color: #336; padding: 12px 24px; font-size: 16px;}
    p, ul li {font-size: 14px;}
    .mission .white-box{margin-top: 0;}
    /*Footer*/
    .footer .about-footer p, .footer .touch p{font-size: 14px;}
    .footer .quick-links li > a{display: flex; line-height: 32px;}
    .footer .touch a{font-size: 13px;}
    /*Inner Banner*/
    .inner-banner{background-position-x: 55%; height: 358px;}
    .mob-inner{background-color: #fff; opacity: 0.9; padding: 20px; margin-top: 165px; border-radius: 10px; width: 55%;}
    .mob-inner h1{font-size: 26px; line-height: 28px; color: #336; text-shadow: none; font-weight: 600;}
    .mob-inner a, .mob-inner p{color: #336;}
    .about-inner .mob-inner{margin-top: 205px;}
    .clients .owl-theme .owl-controls .owl-buttons div{display: none;}
}

@media (min-width: 992px) and (max-width: 1199px) {
    p, ul li {font-size: 15px;}
    .footer .about-footer p, .footer .touch p{font-size: 14px;}
    .footer .quick-links li > a{display: flex; line-height: 32px;}
    .footer .touch a{font-size: 13px;}
    .home-banner h1{font-size: 42px; line-height: 54px;}
    .inner-banner{background-position-x: 38%;}
    .mob-inner {margin-top: 230px;}
    .clients .owl-theme .owl-controls .owl-buttons div{display: none;}
    .product-home .box{height: 345px;}
}