body {font-family: 'Roboto', sans-serif;background-color:#fff;font-size:14px;}
a {text-decoration:none;}
.extrapad {padding-left:45px !important;padding-right:45px !important;}
.whitebg {background-color:#fff;}
.whitebg90 {background-color:rgba(255,255,255,0.85);}
.silverbg {background-color:#f8f9fa;}
.lightbg {background-color:#dedede;}
.redbg {background-color:#051153;}
.darkbg {background-color:#02041b;}
.bxshedow {box-shadow: 0 4px 5px rgba(0,0,0, .2);}
.botbor {border-bottom:solid 1px #dedede;}
.ltrtborder {border-left:solid 1px #b9c0b5;border-right:solid 1px #b9c0b5;}
.primcolor {color:#397f0e;}
.gradbg{background: rgb(5,17,83);
    background: linear-gradient(15deg, rgba(5,17,83,1) 40%, rgba(2,163,102,1) 100%);}

/** Header*/
.logo {display:inline-block;padding:18px 0px 22px 0px;}
.logo img{width:80%;}

.infocontent {display:inline-block;position:relative;text-align:left;padding:5px 30px 0px 75px;margin-top:18px;border-left: solid 1px #ddd;transition:all 0.3s linear;}
.infocontent::before {font-family: Flaticon;font-size:28px;position: absolute;top:2px;left:22px;color: #666;transition:all 0.3s linear;}
.infocontent span{display:block;line-height:16px;}
.infocontent span:first-child{font-size:16px;font-weight:700;color:#0b0a4e;margin-bottom:5px;}
.infocontent span:last-child{font-size:14px;font-weight:400;color:#444}
.infocontent:hover span:first-child{color:#000;}
.infocontent:hover span:last-child{color:#029764;}
.location::before {content: "\f105";} 
.mailus::before {content: "\f109";} 
.callus::before {content: "\f108";} 
.location{border-left-width:0px;} 
.callus{padding-right:6px;}

.mainnav {display:block;text-align:left;}
.mainnav a {display:inline-block;position:relative;padding:12px 8px 12px 8px;margin:7px;font-size:14px;font-weight: 400;color: #fff;transition:all 0.3s linear;}
.mainnav a::before {display:block;position:absolute;bottom:-7px;left:0px;width:100%;height:0px;background-color:#029764;content:'';transition:all 0.3s linear;border-top-left-radius: 50px;border-top-right-radius: 50px;}
.mainnav a:hover::before {height:10px;}
.mainnav .logo-toggle {display:none;}
.mainnav a.logo-toggle:hover::before {height:0px;}

.smpad a {opacity:0.5;padding:12px 2px 12px 2px;margin-left:0px;}
.smpad a.smpad-act{opacity:1.0;}
.smpad a:hover::before {height:0px;}

.mainnavtoggle {display:none; position:relative;width:36px;height:30px;}
.mainnavtoggle span{display:block;position:absolute;left:0px;width:36px;height:5px;background-color:#000;border-radius:3px;transition:all 0.3s linear;cursor:pointer;}
.mainnavtoggle span:nth-child(1){top:0px;}
.mainnavtoggle span:nth-child(2){top:10px;}
.mainnavtoggle span:nth-child(3){top:20px;}
.mainnavtoggle:hover span:nth-child(2){display:none;}
.mainnavtoggle:hover span:nth-child(1){transform:rotate(-45deg);top:50%;right:0px;}
.mainnavtoggle:hover span:nth-child(3){transform:rotate(45deg);top:50%;left:0px;}

/**Hero*/
.hero {margin-top:-30px;box-sizing:border-box;overflow:hidden;border-bottom:solid 1px #e1e1e1;}
.hero .heroslide {display:block;height: 680px;padding-top:200px; padding-left:150px;}
.hero .heroslide h1 {font-size: 56px;font-weight:700;color: #fff;line-height: 70px;}
.hero .heroslide p {font-size: 24px;font-weight: 300;color: #eee;line-height:30px;margin-top:18px;padding-right: 120px;}
.hero .heroslide hr {width:180px;background-color:#7e0505;height:5px;opacity:1.0;border-radius:30px;}
.hero .heroslide a {display:inline-block;padding:16px 26px;margin-top:24px;font-size: 12px;font-weight: 600;color:#0b0a4e;background-color: #fff;border-radius:2px;-webkit-transition: all 0.2s linear;-o-transition: all 0.2s linear;transition: all 0.2s linear;user-select:none;}
.hero .heroslide a:hover {background: rgb(5,17,83);background: linear-gradient(15deg, rgba(5,17,83,1) 40%, rgba(2,163,102,1) 100%);color:#fff;}
.hero .one {background: url(../images/hero/a.jpg) no-repeat top center;background-size: cover;}
.hero .two {background: url(../images/hero/b.jpg) no-repeat top center;background-size: cover;}

/**Product Section **/
.prodsection {display:block;box-sizing:border-box;padding-top:60px;text-align:center;}
.prodsection .boxbtn {display:inline-block;padding:3px 6px;border:solid 1px #a90b0b;color:#a90b0b;font-size:11px;font-weight:500;margin-bottom:8px;}
.prodsection h3 {font-size:24px;font-weight:700;color:#000;line-height:36px;opacity:0.9;}
.prodsection hr{display:block;margin:0px auto 60px auto;width:140px;height:3px;background-color:#a90b0b;opacity:1.0;}
.prodsection .hr2{display:block;margin:0px auto 60px auto;width:75px;height:3px;background-color:#a90b0b;opacity:1.0;}

.proditems {display:block;text-align:center;margin-bottom:60px;padding:0px;user-select:none;position: relative;overflow: hidden;background-color: #000;border-radius: 3px;}
.proditems img{position: relative;transition: all 0.3s linear;width:100%;border-radius: 3px;}
.proditems label{position:absolute;bottom:-30px;left: 0px;width: 100%;height: 1px;overflow: hidden;padding: 15px 12px;background-color: rgba(255,255,255,0.40);border-top: solid 3px #051153;transition: all 0.3s linear;font-weight:700;}
.proditems:hover label{height:120px;background-color: rgba(255,255,255,0.70);}



/**Titles  */
.Section-title {display:block;box-sizing:border-box;text-align:center;padding:0px 0px 60px 0px;}
.Section-title .boxbtn {display:inline-block;padding:3px 6px;border:solid 1px #a90b0b;color:#a90b0b;font-size:11px;font-weight:500;margin-bottom:12px;}
.Section-title h1  {font-size:24px;font-weight:700;color:#000;line-height:36px;opacity:0.9;}
.Section-title hr{display:block;margin:0px auto;width:160px;height:3px;background-color:#a90b0b;opacity:1.0;}

.sec-title-two{ position:relative;margin-bottom:60px;}
.sec-title-two .title{position:relative;font-size:16px;font-weight:600;padding-bottom:5px;margin-bottom:25px;color:rgba(0,0,0,0.40);}
.sec-title-two .title:after {position: absolute;content: '';left: 0px;bottom: 0px;width: 70px;height: 2px;background-color:#397f0e;}
.sec-title-two h2{position:relative;color:#00000a;font-size:32px;font-weight:500;line-height:1.4em;padding-right:30px;}
.sec-title-two h2 span{font-weight:900;}
.sec-title-two p {font-size:16px;font-weight:400;color:#777;}
.sec-title-two .big-letter{position:absolute;left:-20px;top:90px;color:#e0f8d4;font-size:340px;font-weight:700;line-height:1em;opacity:0.3;white-space:nowrap}

/***Why Section */

.sec-title{position:relative;margin-bottom:65px;margin-top:65px;}
.sec-title h2{position:relative;font-size:38px;font-weight:600;color:#00000a;line-height:1.2em;text-transform:capitalize;}
.sec-title .text{position:relative;font-size:16px;margin-top:25px !important;color:rgba(0,0,0,0.60);}
.sec-title.centered{text-align:center;}
.sec-title.centered .text{max-width:790px;margin:0 auto;}

.whycard img {display: block;}
.whycard h3 {font-size:20px;font-weight:700;}
.whycard p {font-size:17px;font-weight:400;color:#000;}

.whycardcta {display: block;padding: 65px 45px;background: rgb(5,17,83);background: linear-gradient(15deg, rgba(5,17,83,1) 40%, rgba(2,163,102,1) 100%);}
.whycardcta h2{color:#fff;text-align: center;}

/*** About */
.aboutsec{user-select:none; background:url('../images/about.jpg') top center no-repeat #30352c; background-size:cover;}
.aboutsec h1 {font-size:48px;font-weight:400;color:#fff;}
.aboutsec h1 span {font-weight:900;position:relative} 
.aboutsec p {font-size:20px;font-weight:300;color:#fff;}

/***Footer Section */

.ftrsection-top {display: block; padding:60px 0px 90px 0px;}
.ftrsection-top h1 {font-size:38px;font-weight:400;color:#000;}
.ftrsection-top h1 span {font-weight:900;} 
.ftrsection-top h3 {font-size:18px;font-weight:500;color:#000;}
.ftrsection-top p {font-size:20;font-weight:300;color:#000;text-decoration: underline;}
.ftrsection-top .infotx {font-size:20;font-weight:400;color:#000;}
.ftrsection-top .infotx a {font-size:22;font-weight:500;color:#000;position: relative;}
.ftrsection-top .infotx a::before {position: absolute;left: 0px;bottom: -3px;width: 0px;height: 1px;transition: all 0.3s linear;content: ''; background-color: #029764;}
.ftrsection-top .infotx a:hover::before{width: 100%;}
.copytx {font-size:13px;font-weight:400;color:#aaa;opacity:0.7}

.mobilehide {display:unset}
@media only screen and (max-width: 600px) {
    .extrapad {padding-left: 10px !important;padding-right: 30px !important;}
    .mobilehide {display:none;}

    .logo {padding:18px 0px 45px 0px;}
    .mainnavtoggle {display: inline-block;position:absolute;top: 26px;right:100px;}

    .hero .heroslide {height:380px;padding-top:50px; padding-left:15px;}
}