*{box-sizing: border-box}
* [onclick] {cursor: pointer; }
body {font-family:Arial, Helvetica, sans-serif; margin:120px 0 0 0; width:100%; font-size:62.5%; overflow-x: hidden;}
a:link{color:#808080; text-decoration: none}
a:visited{color: #808080;}
a:hover{ color:#183176;}
a:active{color: #808080;}
h1{font-size:2.6em;}
h2{font-size:1.6em;}
h3{font-size:1.4em;}
h4{font-size:1.2em;}
h5{font-size:1.2em;}
h6{font-size:1.2em}
.mobi-only,.quick-enquiry-block,.menu-top>label,#mobi-toggle,#navOverlay,.item-hide{display:none}
.ecat-value{box-sizing: content-box; visibility:hidden;position:absolute; max-width:100px; top:0; left:0; z-index:-1}

.btn1{display: inline-block; padding:8px 16px; min-width: 150px; text-align:center; font-size:14px; font-weight:bold; background:#183176;  border-radius:14px;  color: rgba(255,255,255,.8); border: 2px solid #183176; transition: .3s all}

/*================== MAIN SECTION ============================*/
.back_page{ width:100%; font-size:16px; color:#000; top:0px; padding:15px; line-height: 1.8em;}
.back_page p{text-align:justify;}

.section{position:absolute; visibility:hidden; z-index:999999;}
.section-1{width: 100%;z-index: 999; height: 120px; position: fixed; background: #fff; top:0; box-shadow: 0 0 10px 2px #ccc;}
.section-header{max-width:1280px; width:100%; margin:auto auto;}

.menu-top-container > div,.menu-home-container > div{max-width:1280px; width:100%; margin:auto auto; display: flex
; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.menu-home-container > div > ul{ display:flex; flex-wrap: wrap; justify-content: end; width:100%; margin:0; padding:0}
.menu-home-container > div > ul li{ list-style:none; position:relative}
.menu-home-container > div > ul > li > span,.menu-home-container > div > ul > li > a{font-size: 12px; padding: 10px 20px; text-transform: uppercase; letter-spacing: 1px; display:block; color: #fff; cursor: pointer}

.section-2{ position:relative; width:100%;}
.section-section{ max-width:1280px; margin:auto auto;}
.menu-top-container{display: flex; justify-content: space-between; flex-wrap:wrap; max-width: 1280px; width: 100%; margin: auto}

.menu-home-container{width: 100%; background-color:#183176;z-index: 10;position: relative;}
.menu-home-container a{color: white}
.menu-home-container a:hover{opacity:.9}
.quote-top a{background-color:#bb9c52; }

/*================= MENUS ======================*/
.menu-top{ position:relative;}

.menu-top label{display: none}
.nav{margin:0; padding:0}
.nav > li{position:relative; color: #54565a; float: left; list-style: none; font-size:16px;}
.nav > li > span,.nav > li > a{display: inline-block; color:rgb(0 0 0 / 60%); padding:0 25px; text-decoration:none; transition:all .5s; background-color:transparent !important;  cursor: pointer; line-height: 86px; text-transform:uppercase; }

.nav > li a:hover, .nav > li:hover > a, .nav > li:hover > span{background-color:transparent !important; color:rgb(15 16 128) !important;}

.dropdown-menu li{position:relative; list-style: none; border-bottom:1px solid #f1f1f1; width: 100%;}
.dropdown-menu li:last-of-type{border:none }
.dropdown-menu{padding:0; margin:0; display: none; background-color:#fff; min-width:250px; left:20px; position:absolute; box-shadow: 0 0 1px 1px rgba(0,0,0,.175); font-size: 14px; border-left: 3px solid #183176; border-bottom: 3px solid #183176;}
.top-dropdown a{transition: none;background-color: #183176;color: #fff !important; padding: 10px; width: 100% !important; display: block !important}
.top-dropdown > li {padding: 0 !important}
.dropdown-menu > li:hover a{ transition: all .3s;}
.dropdown-menu > li > a::before{content:"\203A"; padding-right: 10px }

.dropdown-menu a{color:#404040 ; transition:background-color .3s; }
.dropdown-menu > li{ display: block;  }
.dropdown-menu li:hover > a{ color: #fff !important}
.dropdown-menu > li:hover { background: #183176;}
.dropdown-menu > li > a{ display: inline-block; width: 100%;padding: 10px 15px; transition: all .3s; }

.dropdown-menu.top-dropdown{font-size: 13px; min-width: 200px}
.top-dropdown a::before{display: none}
.dropdown-menu.double-menu > div{width: 100%}
.dropdown-menu.double-menu > div > span{background: #fff}
.dropdown-menu.double-menu{width: 100%; justify-content: space-between; padding: 0; background: #fff; min-width: 410px;border-left: 3px solid #183176; border-bottom: 3px solid #183176;}
.dropdown-menu.double-menu > li > ul{margin: 0; padding: 0}
.dropdown-menu.double-menu > li > ul > strong{padding: 10px; display: block; border-bottom: 1px solid #ccc; text-transform: uppercase;}
.dropdown-menu.double-menu > li > ul > strong > a{ color: #183176;}
.dropdown-menu.double-menu > li > ul > li{ border-bottom: 1px solid #fcfcfc; border-top: 1px solid #e5e5e5; transition: all .3s; }
.dropdown-menu.double-menu > li > ul > li:hover a{color: #fff !important}
.dropdown-menu.double-menu > li > ul > li:hover{ background: #183176; color: #fff}
.dropdown-menu.double-menu > li > ul > li a{display: inline-block; padding: 10px 15px; width: 100%; color: #202020; transition: all .3s; }
.dropdown-menu.double-menu > li > ul > li > a::before{content:"\203A"; transition: all .3s; padding-right: 10px}
.dropdown-menu.double-menu > li:hover{background: transparent}
.dropdown-menu.double-menu > li{width: 48%; transition: all .3s; padding: 0}

/*================ Dropdown ===================*/
@media screen and (min-device-width: 768px){	
	.active{border:solid 1px #fff}
	.dropdown:hover:not(.CLOSEDROPDOWN) .dropdown-menu{display:flex; flex-wrap: wrap}
}

/*==================== LOGO =======================*/
.logo{position:relative; width:15%; clear:left;}
.logo img{width: 100%; height: auto; display:block }

.home-banner{ display:flex; margin:auto; position:relative; max-width:1663px; width:100%; text-align:center;}
.home-banner h1{font-weight: normal; font-size:40px; margin: 0 0; line-height:50px;}
.home-banner h1 strong{font-weight: normal; color:#376cff}
.home-banner p{font-size:18px; margin: 15px 0; display: block; line-height: 24px}
.home-banner p b{color: #00afff; font-weight: normal}

.banner-text{position: absolute; transform: translate(-50%, -50%); background-color: rgb(0 0 0 / 72%); padding: 3rem; max-width: 46%;  border-radius: 16px; width: 100%; left: 35%; top:50%; height:220px; z-index: 2; color: #fff; text-align: left}
.banner-text .banner-btn1{ display: inline-block; border-bottom: 2px solid #fff; margin-top: 25px; padding-bottom: 3px;}
.banner-text .banner-btn1 a{ font-size: 14px; letter-spacing: 1px;  color: #fff; font-weight: bold;}

.home-intro-text{ display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 1280px; margin:50px auto; padding: 0 15px; margin-top: 100px; padding-top: 50px}
.home-intro-text > span{background-color:#0d3880; display: block; height: 1px; width: 200px; position: relative; top: 15px;}
.home-intro-text > div p{ margin: 0; font-size:40px!important; line-height: 46px!important; }
.home-intro-text > div{width: 80%; text-align: left}
.home-intro-text > div strong{font-weight: bold; color: #0d3880}

/*======social page =======*/
.social-bg{max-width: 1280px;margin:40px auto;display: flex;flex-wrap: wrap;justify-content: center;}
.social-media-block{display: flex; flex-wrap: wrap;justify-content:space-between}
.social-media-block > strong{ width:100%; font-weight: normal; margin-left:26%; position:relative;font-size: 32px; margin-bottom:30px; text-align:left; display: flex; align-items: center; flex-wrap: wrap;}
.social-media-block > div{ width:100%; margin-bottom:40px}
.social-media-block > strong a{ color:#001446; display: flex; flex-wrap: wrap; font-size:22px}
.social-media-block > strong a .fa-instagram{font-size: 30px; margin-right: 8px; margin-left: -4px; color:#006BB6}
.social-media-block > strong a .fa-facebook-f{border: solid 2px; font-size: 18px; width: 30px; height: 30px; border-radius: 7px; display: flex; align-items: center; justify-content: space-around; margin-right: 10px; color:#006BB6}
.social-media-block > iframe{margin: auto}

.call-to-action-btn1{display: flex; flex-wrap: wrap; justify-content: flex-start; width: 100%;    margin-top: 25px;}
.call-to-action-btn1 > span{margin-right: 12px}
.call-to-action-btn1 > span:first-of-type a{font-size: 14px; letter-spacing: 1px; border-bottom: 1px solid; padding-bottom: 3px;}
/*.call-to-action-btn1 > span:last-of-type a{border: 1px solid;font-size: 16px;padding: 11px 20px;border-radius: 5px;}
.call-to-action-btn1 > span:first-of-type a span{font-size: 10px;position: relative;top: -2px;}
.call-to-action-btn1 > span:last-of-type a span{font-size: 10px;position: relative;top: -2px;}*/
.aboutus-intro{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.aboutus-intro > h2{width: 100%; text-align: center; color: #183176; margin: 40px 0}
.aboutus-intro > div:first-of-type{background: #f4f4f4; padding: 40px 20px; width: 24%; text-align: center; display: flex; align-items: center; justify-content: space-around;}
.aboutus-intro > div:first-of-type strong{font-size: 36px; font-weight: normal}
.aboutus-intro > div{width: 72%}
.aboutus-intro > div p{margin: 0; line-height: 32px; font-size: 20px}

.video-block{margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2); display: flex; position: relative;}
.video-block video{width: 100%}

.drivetrain-hydraulics-block{max-width: 1140px; margin:50px auto; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between}
.drivetrain-hydraulics-block > strong{font-size:42px;color:#3a3c43;display: flex;flex-wrap: wrap;justify-content: center;margin: 20px auto; position: relative; width: 100%}
.drivetrain-hydraulics-block > strong:after,.drivetrain-hydraulics-block > strong:before{content: ""; border-width: 0; width: 50px; border-bottom: 2px solid #183176; position: absolute; top: 50%; right: 64%;}
.drivetrain-hydraulics-block > strong:after{left: 64%; right: 0}

.drivetrain-hydraulics-block > div{width: 50%; background-color: #183176; color: #fff}
.drivetrain-hydraulics-block > div:last-of-type{ background-color: #202020; color: #fff}
.drivetrain-hydraulics-block > div:last-of-type .btn1{border: 2px solid #202020; color: #202020}
.drivetrain-hydraulics-block > div img{width: 100%; height: auto; display: block}
.drivetrain-hydraulics-block > div h2{font-size: 40px; margin-top: 0; font-weight: normal;}
.drivetrain-hydraulics-txt{padding: 48px}
.drivetrain-hydraulics-txt p{font-size: 18px; line-height: 27px}
.drivetrain-hydraulics-txt .btn1{padding:15px 28px; font-size: 18px; background-color: #ffff; border-radius: 0;; color: #183176; margin-top:15px}
.drivetrain-hydraulics-txt .btn1 .fa-fw{ rotate: -45deg;}
.drivetrain-hydraulics-txt .btn1:hover{opacity: 0.8}

.what-we-offer-bg{background: #f1f1f1; margin-left: calc((100vw - 1280px) / -2);  width: 100vw; margin-right: calc((100vw - 1280px) / -2); padding: 80px 0 60px}
.what-we-offer-bg > div{max-width: 1280px; margin: auto}
.what-we-offer-block{display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; margin: 50px auto 35px; padding-top: 30px}
.what-we-offer-block > div{width: 40%; position: relative}
.what-we-offer-block > div > span{position: absolute; background-color: rgb(0, 61, 138); z-index: 30; top: -30px; left: 0px; opacity: 0.9; width: 100px; height: 100px;display: flex; align-items: center; justify-content: space-around;}
.what-we-offer-block > div > span img{display: block}
.what-we-offer-block > div > img{width: 100%; height: auto; display: block; border-radius:0 60px 0 60px;}
.what-we-offer-block .what-we-offer-text{width: 54%}
.what-we-offer-block > div > p:first-of-type{margin-bottom: 0}
.what-we-offer-bg > div > ul,.what-we-offer-block > div > ul{padding: 0; margin-top: 0}
.what-we-offer-bg > div > ul{width: 50%}
.what-we-offer-bg > div .double-ul,.what-we-offer-block > div .double-ul{display: flex; flex-wrap: wrap}
.what-we-offer-bg > div .double-ul strong,.what-we-offer-block > div .double-ul strong{width: 100%}
.what-we-offer-bg > div .double-ul li,.what-we-offer-block > div .double-ul li{width: 50%}
.what-we-offer-bg > div .double-ul li a{color: #000}
.what-we-offer-bg > div .double-ul li span,.what-we-offer-block > div .double-ul li span{width: 95%}
.what-we-offer-bg > div ul li,.what-we-offer-block > div ul li{padding: 5px 0; list-style: none; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between}
.what-we-offer-block > div ul li span{width: 97%}
.what-we-offer-bg > div ul li .fa-fw,.what-we-offer-block > div ul li .fa-fw{font-size: 5px; color: #183176}
.what-we-offer-block .what-we-offer-title{display: flex; flex-wrap: wrap; justify-content: space-between;}
.what-we-offer-block .what-we-offer-title h2{width: 100%; margin: 0; font-weight: normal; font-size: 34px; line-height: 40px; color: rgb(24 49 118 / 80%)}
.what-we-offer-block .what-we-offer-title span{width: 19%}

.what-we-offer-img{display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; margin-top:30px }
.what-we-offer-img > div{width: 32%}
.what-we-offer-img > div img{width: 100%; height: auto; display: block; border-radius: 4px;}
.other-products-block{margin: 30px 0}

.other-products-and-services{margin:40px auto; display: flex; flex-wrap: wrap; justify-content: space-between}
.other-products-and-services .products-and-services-text h2{font-weight: normal; margin-top: 0; height: 58px;}
.other-products-and-services .products-and-services-text .btn-prod{ color: #183176; padding: 8px 25px; border-radius: 50px; margin-top: 20px; display: inline-block; border: solid 2px #bb9c52;}
.other-products-and-services > div{width: 32%; display: flex; flex-wrap: wrap; justify-content: space-between; margin:20px 0; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); border-bottom: 4px solid #bb9c52; align-content: flex-start;}
.other-products-and-services > div > div{width:100% }
.other-products-and-services > div > div img{width:100%; height: auto; display: block }
.other-products-and-services .products-and-services-text{width: 100%; background: #fff; padding: 25px; color: #000}
.other-products-and-services .products-and-services-text p{text-align: left; min-height: 144px; margin-bottom: 0;}

.call2action-service{margin-left: calc((100vw - 1280px) / -2);  width: 100vw; margin-right: calc((100vw - 1280px) / -2); background: url("images/contact-us-background.webp") no-repeat; display: flex; margin-bottom: -70px;; position: relative}
.call2action-service > div{max-width: 1280px; margin:50px auto; color: #fff; width: 100%; display: flex; gap: 0 100px; align-items: center; flex-wrap: wrap}
.call2action-service > div .btn1{color: #fff; padding:12px 30px; border-radius: 50px; text-transform: uppercase; font-size: 16px; background:#bb9c52; border: solid #fff}
.call2action-service > div strong{font-size:30px; position: relative; display: inline-block; padding-bottom: 10px; line-height: 34px;font-weight: normal}
.call2action-service > div strong:before{content: ""; position: absolute; top:100%; left: 0; width: 100px; height: 2px; background:#d1d6e4; display: block; }
.call2action-service > div strong b{}

.partner-bg{background-color: #f4f4f4; display: flex; flex-wrap: wrap; padding: 0; margin: 40px 0}
.partner-bg .partner-txt{padding: 50px; width: 60%}
.partner-bg .partner-txt h2{font-size: 40px; font-weight: normal}
.partner-bg .partner-txt p{font-size: 18px; line-height: 32px}
.partner-bg .partner-txt .btn1{border: solid 2px #183176; color: #183176; background-color: transparent}
.partner-bg > div{width: 40%}
.partner-bg > div img{width: 100%; display: block; height: auto}

.export-contact{ display: flex; flex-wrap: wrap; justify-content: space-between; color: #241f20; width: 70%; padding-left: 40px; align-items: center}
.export-contact ul{ width: 31%; padding: 0; margin: 0; min-height: 161px;}
.export-contact ul strong{ font-size: 18px; margin-bottom: 15px; display: block; min-height: 88px;}
.export-contact ul strong b{width: 80%; display: block; font-size: 26px; border-bottom: 1px solid #241f20; padding-bottom: 15px; margin-bottom: 15px;}
.export-contact ul li{ list-style: none; font-size: 18px}
.export-contact ul li a{color: #241f20}
.export-contact ul li a .fa-fw{color: rgb(0, 139, 205)}

.export-division-main{width: 100vw; display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0 0 -6px; margin-left: calc((100vw - 1280px) / -2); padding: 0}
.export-division-team{width: 30%; position: relative; padding-top: 40px;}
.export-division-team:after{content: ""; background-image: linear-gradient(to left, #fff, transparent); position: absolute; right: 0; top: 0; height: 100%; width:100px;}
.export-division-team img{width: 100%; height: auto; display: block; position: relative; z-index: -1}
.export-text p{font-size: 18px}

.footprint-block{margin-right: calc((100vw - 1280px) / -2); margin-left: calc((100vw - 1280px) / -2); display: flex; flex-wrap:wrap; justify-content: space-between; padding-inline: max(0px, calc((100vw - 100%) / 2)); width: 100vw; position: relative}
.footprint-block:before{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:url("images/hers-footprint.webp"); background-size: contain;}
.footprint-block > div{width: 50%; position: relative; color: #fff; padding:15px 30px 10px;}
.footprint-block > div:last-of-type{padding-right: 0}
.footprint-block > div img{width: 100%; height: auto; display: block}
.footprint-block > div h2{text-transform: uppercase; font-size: 34px; position: relative; min-height: 50px; margin-top: 10px}
.footprint-block > div h2:before{content: ""; position: absolute; bottom: 0; left: 0; height: 3px; width: 50px; background: #efefef; border-top-right-radius: 40px; border-bottom-right-radius: 40px;}
.footprint-block > div ul{padding: 0; margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between}
.footprint-block > div ul li{list-style: none; width: 48%; padding: 4px 0}
.footprint-block > div ul .fa-fw{font-size: 12px; color:#bb9c52; margin-right: 5px}

.call2action{background-color: #183176; padding: 0px 0; width: 100%; display: flex}
.call2action > div{max-width: 1140px; margin:50px auto; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; font-size: 16px; color: #fff; align-items: center;}
.call2action > div > div strong{font-size: 36px; font-weight: normal}
.call2action > div > div p{font-size: 16px; }
.call2action > div > div .btn1{ border: solid 2.4px #fff; font-size: 20px; color: #fff; border-radius: 0; padding: 20px 40px}
.call2action > div > div .btn1:hover{  color: #183176; background-color: #fff}
.call2action > div .fa-fw{font-size: 45px}
.call2action > div > div{display: flex; flex-wrap: wrap; justify-content: space-between}
.call2action > div > div > div{width: 90%}

.call2action-products{margin-left: calc((100vw - 1280px) / -2);  width: 100vw; margin-right: calc((100vw - 1280px) / -2);background-color: #183176; background-image: url("images/call2action.png"); display: flex; position: relative; background-repeat: no-repeat; background-position: right;}
.call2action-products > div{max-width: 1280px; margin:50px auto; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; font-size: 16px; color: #fff; align-items: center; padding: 0 15px}
.call2action-products > div strong{ font-size: 28px; font-weight: normal; line-height: 34px;}
.call2action-products > div strong b{color: #bb9c52;}
.call2action-products > div .btn1{ border: solid 2px #fff; color: #fff; font-size: 16px; padding: 10px 48px;}

.intro-service-block{}
.intro-service-img > div{max-width: 1140px; margin:100px auto; padding: 40px 0; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-around; color: #fff; position: relative; text-align: center}
.intro-service-img > div > strong{font-size: 54px; font-weight: normal; width: 100%}
.intro-service-img > div > p{font-size: 18px; line-height: 29px}
.intro-service-img{background: url("images/service-repairs-banner.webp") no-repeat; display: flex; position: relative;background-size: cover;}
.intro-service-img:before{background: linear-gradient(to bottom, rgba(0, 20, 137, 0) 0, rgba(0, 20, 137, 0.75) 85%, rgba(0, 20, 137,0.75) 100%); background: rgb(0 20 137 / 70%); content: '';  position: absolute; width: 100%; height: 100%}

.service-section{max-width: 1140px; margin: auto; display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: -70px; z-index: 1; position: relative; margin-bottom: 40px;}
.service-section > div{width: 31%; border: 1px solid #ccd0d3; background-color: #fff; transition: .5s all}
.service-section > div a{transition: .5s all}
.service-section > div:hover > a{opacity: .7}
.service-section > div img{width: 100%; height: auto; display: block}
.service-section > div > strong{font-size: 18px; display: block; padding:30px 30px 10px; color: #333f48}
.service-section > div > strong a{color: #333f48}
.service-section > div p{ padding: 0 30px; font-size: 18px; font-weight: bold; color: #183176;}

.key-figures{max-width: 1280px; width: 100%; margin:60px auto; display: flex;flex-wrap: wrap;justify-content: space-between; padding: 30px 0px}
.success-figure{display: flex; flex-wrap: wrap; justify-content: center; position: relative; width: 22%; padding: 6px; border-bottom: 3px solid #bb9c52}
.success-figure > span{width: 100%}
.success-figure > span:nth-of-type(2){margin-top: 16px; font-size: 16px}
.success-figure > strong{display: flex;flex-wrap: wrap;align-items: center}
.success-figure > strong > b{font-weight: 600;display: flex;flex-wrap: wrap;align-items: center}
.success-figure > strong > b > img{width: 14%;height: auto;margin-right: 5px}
.success-figure > strong{width: 100%;font-size: 48px;font-weight: 100}
.success-figure .figure-text{color: #bb9c52;font-size: 13px;text-transform: uppercase;margin-bottom: 10px; font-weight: 600}

.logo-block{max-width: 1140px; margin:70px auto ; display: flex; flex-wrap: wrap; box-shadow: 0px 0px 15px 0px #ccc; border-radius: 6px;}
.logo-block > span{font-size: 36px; color:#3a3c43; font-weight: bold; display: flex;flex-wrap: wrap;justify-content: center;margin: 20px auto; position: relative; width: 100%}
.logo-block > span:before,.logo-block > span:after{content: ""; border-width: 0; width: 50px; border-bottom: 2px solid #183176; position: absolute; top: 50%; right: 100%;}
.logo-block > span:before{left:100%; right: 0}

.logo-block > div{width:50%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin:20px auto; padding:10px 0 }
.logo-block > div:last-of-type{border-left: solid 1px #183176;}
.logo-block > div:first-of-type > div{width: 20%}
.logo-block > div > div{width: 47%; margin: auto}
.logo-block > div strong{width: 100%; text-align: center; font-size: 22px; margin-top:10px; color: #3a3c43}
.logo-block > div img{width: 100%; height: auto; display: block}
.page-title{background:url("images/hers-bg.webp") no-repeat; position: relative; min-height: 300px; background-size: cover;}
.certificate{ background: url("images/drivetrain-division.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.warehouse{ background: url("images/warehouse.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.hydraulics-mobile-machinery-banner{ background: url("images/hydraulics-mobile-machinery-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.drivetrain-division-banner{ background: url("images/drivetrain-components-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.social-media-banner{ background: url("images/social-media-platform.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.certification-banner{ background: url("images/certification-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.kessler-drivetrain-banner{ background: url("images/kessler-drivetrain-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover; background-position: bottom}
.dana-drivetrain-banner{ background: url("images/dana-drivetrain-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover; }
.field-services-banner{ background: url("images/field-services-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover; }
.harbour-ports-banner{ background: url("images/harbour-ports-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover; background-position: center;}
.airport-banner{ background: url("images/airport-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover; background-position: bottom;}
.construction-surface-mining-banner{ background: url("images/construction-surface-mining-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover; background-position: center;}
.mining-banner{ background: url("images/mining-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover; background-position: bottom;}
.military-banner{ background: url("images/military-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover; background-position: bottom;}
.material-handling-banner{ background: url("images/material-handling-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover; background-position: bottom;}
.refurbishment-banner{ background: url("images/refurbishment-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover; background-position: bottom;}
.parts-spares-banner{ background: url("images/oem-parts-spares.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.transmission-dropbox-drivetrain-banner{ background: url("images/transmission-dropbox-drivetrain-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.hydraulic-cylinder-industrial-manufacturing-banner{ background: url("images/hydraulic-cylinder-industrial-manufacturing-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.value-added-services-banner{ background: url("images/value-added-services.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.export-division-banner{ background: url("images/export-division-banner.webp") no-repeat;position: relative;min-height: 300px;background-size: cover;}
.page-title > div{background: rgb(0, 0, 0, .6); width: 100%; padding: 0 30px; position: absolute; bottom: 0;  display: flex
; justify-content: space-around; flex-wrap: wrap;}
.page-title > div h1{font-size: 26px; height: 60px; padding: 15px 25px; color: #fff; background: #183176; margin: 0; position: relative; text-transform: uppercase;}
.page-title > div h1:after,.page-title > div h1:before{ content: ''; position: absolute; top: -1px; width: 0; height: 0; border: 0 solid transparent; border-top-width: 60px; border-bottom-width: 0; border-right: 15px solid #183176; left: -14px;}
.page-title > div h1:after{left: 100%; border-bottom-width: 59px; border-top-width: 0; border-right: 0; border-left: 15px solid #183176;}

.partner-intro{background-color: #7f9abc; margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2);}
.partner-intro > div{}
.partner-intro p{color: #fff; font-size: 22px; width: 100%; text-align: center}
.sub-intro-text{font-size: 20px}

.intro-sub-block-bg{background:#f1f1f1; margin-left: calc((100vw - 1280px )/ -2 ); width: 100vw; margin-right: calc((100vw - 1280px )/ -2 ); display: flex; flex-wrap: wrap; justify-content: space-between;padding: 25px 0 0 }
.back_page.industries-text-block{ max-width: 880px; margin: 0}
.intro-sub-block-bg > div{margin: 40px 0}
.industries-block-img{ width: 27%; position: relative; height: 100%;}
.industries-block-img  > div{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 240px; height: 240px; background:rgb(51 51 51 / 90%); display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; padding: 45px 0}
.industries-block-img  > div strong{ width: 100%; text-align: center; font-size: 20px; color: #fff; font-weight: normal; line-height: 28px}
.industries-block-img > img{ width: 100%; height: auto; display: block}
.industries-block{ display: flex; flex-wrap: wrap; justify-content: space-between;width:70%}
.industries-text-block > p{ font-size:18px; color: #282828; padding: 16px 0 16px 40px;  border-left: 2px solid #183176;} 

.industries-text-list{display: flex; justify-content: space-between; flex-wrap: wrap; margin: 20px auto}
.industries-text-list > div{ border-left: 5px solid #183176; padding:0 15px; background-color: #f1f1f1; width: 31%; margin: 15px auto; box-shadow: 10px 0 10px 2px #ccc;}
.industries-text-list > div h2{font-size: 20px;}

.sub-page-bg{margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2); background-color: #183176; display: flex; position: relative;}
.sub-intro-block{display: flex; flex-wrap: wrap; justify-content: space-between; padding: 30px 15px; color: #fff; margin: auto; max-width: 1280px}
.sub-intro-block p a{ color:#008bcd }
.sub-intro-img-block{width: 41%; margin-top: -7rem;}
.sub-intro-img-block video
{width: 100%; height: auto; display: block; border-radius: 4px}
.sub-intro-text-block{width: 55%}
.sub-intro-text-block .btn1{ color: #fff; border: solid 2px #fff; background: transparent; text-transform: uppercase; font-weight: normal;}
.company-statistics{background-color: #183176; margin: 40px 0 -15px -15px; position: relative}
.company-statistics:after,.company-statistics:before{ content: ''; position: absolute; top: 3px; width: 0; height: 0; border: 0 solid transparent; border-top-width: 120px; border-bottom-width: 0; border-right: 15px solid #183176; left: -14px;}
.company-statistics:after{ left: 100%; border-bottom-width: 120px; border-top-width: 0; border-right: 0; border-left: 15px solid #183176; top: 0}
.company-statistics ul{padding: 35px 0 20px; margin: 0; display: flex; flex-wrap: wrap; }
.company-statistics ul li{list-style: none; width: 26%; text-align: center; color: #fff}
.company-statistics ul li strong{ display: block; font-size: 42px; font-weight: normal; margin-bottom: 10px;}

.cylinder-division-bg{margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2); background-color: rgb(84 86 90 / 20%); display: flex; position: relative;}
.cylinder-division-bg > div{max-width: 1280px; margin: auto; width: 100%}

.division-main-block{width: 100%; display: flex;flex-wrap: wrap;justify-content: space-between;padding: 40px 0px;}
.division-main-block > div{width: 49%;}
.division-main-block .division-text-block{height: 30%;display: block;position: sticky;top: 120px;padding: 15px 15px 15px 0px;}
.division-main-block .division-text-block > span{display: block; width: 100%; font-size: 16px; text-transform: uppercase;color: #9e9e9e; margin-bottom: 10px;}
.division-main-block .division-text-block img{width: 100%; height: auto; display: block; border-radius: 4px}
.division-main-block .division-text-block > h2{font-size: 42px; line-height: 46px; font-weight: normal; color:#54565a; margin-top: 0}
.division-main-block .division-block {padding: 15px 0px 15px 15px; position: relative;}
.division-main-block .division-block > div {display: flex;flex-wrap: wrap;justify-content: space-between; margin-bottom: 25px; position: relative;}
.division-main-block .division-block > div:last-of-type{margin-bottom: 0px;}
.division-main-block .division-block > div > span{width: 10%;height: 60px;display: flex;flex-wrap: wrap;align-items: center;justify-content: center; position: relative;background-color: #edf1f4;border: solid 1px #183176;border-radius: 50%; z-index: 1;}
.division-main-block .division-block > div:after{content: ''; width: 1px;height: 100%; background-color: #183176;position: absolute; top: 0; left: 29px;transform: translateX(-50%);}
.division-main-block .division-block > div:last-of-type > span:after{display: none;}
.division-main-block .division-block > div > span:hover{border: solid 2px #183176;background-color: #183176;transition: .5s;}
.division-main-block .division-block > div > span:hover > img{filter: invert(100%);}
.division-main-block .division-block > div > span > img{display: block;width: 65%;height: auto;margin: auto;}
.division-main-block .division-block > div >  div strong{font-size: 24px;display: flex;flex-wrap: wrap;justify-content: start;align-items: center;}
.division-main-block .division-block > div > div p{margin-top: 0px;}
.division-main-block .division-block > div >  div strong{color: #54565a; margin-bottom: 20px}
.division-main-block .division-block > div > div {width:80%; color: #000;}
.division-block > div > div ul{padding-left: 18px}
.warehouse-block{max-width: 1280px;margin: auto;}

.cylinder-division-bg .division-main-block .division-block > div:after{ right: 29px; left: unset}
.cylinder-division-bg .division-main-block .division-text-block{padding:15px 0 15px 15px}
.cylinder-division-bg .division-main-block .division-block{padding:15px 15px 15px 0}

/*====================== home intro =============================*/
.intro-video-block iframe{width: 100%; display: block; height: auto;position: relative}
.intro-video-block{ width: 100%;height: 480px; display: flex; flex-wrap:wrap; position: relative; overflow: hidden}
.intro-video-block:before{ content: ""; position: absolute; top:0; left: 0; width: 100%; height: 100%; background-color: rgb(0 0 0 / 60%); z-index: 1}
.intro-video-block > video{ /*position: absolute; left: 0; top: -320px;*/ position: absolute; top: 12%; left: 50%; width: auto; height: auto; max-height: none; min-height: 100%; min-width: 100%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);  }
.intro-video-block > div{ max-width: 1140px;margin:100px auto; width: 100%; position: absolute; color: #fff; z-index: 1;padding: 50px;}
.intro-video-block > div p{ font-size: 18px; line-height: 28px}
.intro-video-block > div span{ font-weight: bold; font-size: 38px; text-transform: uppercase; margin-bottom: 32px; display: block}
.intro-video-block > div .btn1{ font-size: 16px; letter-spacing: 0.5px; line-height: 28px; text-transform: uppercase; padding: 13px 28px; margin-top: 15px; background: #00a6ff}
.intro-video-block > div span strong{ color:#00a6ff}

.vehicle-products-block{ display:flex; width:100%; justify-content:space-between; flex-wrap: wrap}
.vehicle-products-block > div{width: 26%}
.vehicle-products-block > div h2{width: 60%; padding: 15px; color: #fff; text-align: center; background: #1398d0; margin: auto;    margin-top: -24px; position: relative; font-size: 20px; margin-bottom: 50px;}
.vehicle-products-block > div img{display: block; height: auto; width: 100%}
.vehicle-products-block > strong{width: 100%; color: #444; border-bottom: 1px solid #444; display: block; font-size: 30px; margin-bottom: 30px; padding-bottom: 15px; }

.call2action-industries{padding: 70px 10px;  margin-left: calc((100vw - 1265px) / -2); width: 100vw; margin-right: calc((100vw - 1265px) / -2); padding-inline: calc((100vw - 1265px) / -2); background: url("images/mobile-machinery.webp") no-repeat; background-size: cover; position: relative;  border-top: 15px solid #7f9abc;}
.call2action-industries:before{ content: ""; width: 100%; height: 100%; background: rgb(28 72 157 / 90%) /*rgb(0 139 205 / 90%)/*rgb(36 31 32 / 90%)*/; position: absolute; top: 0; left: 0}
.call2action-industries > div{margin:0 auto; max-width: 900px; width: 100%; color: #fff; display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; position: relative} 
.call2action-industries > div > div > span{font-size: 28px; font-weight: bold}
.call2action-industries > div > div > p{font-size: 16px; line-height: 26px}
.call2action-industries > div > a{font-size: 16px; font-weight: bold; text-transform: uppercase; color: #fff; border: solid 1px #FFF; padding: 16px 24px}
.call2action-industries > div > a:hover{background:#008bcd}

.related-brand{display: flex; flex-wrap: wrap; margin: 20px 0;}
.related-brand ul{display: flex; flex-wrap:wrap; padding: 0; width: 100% }
.related-brand ul strong{width: 100%; font-size: 28px; margin-bottom: 15px}
.related-brand ul li{display: flex; flex-wrap:wrap; justify-content: space-around; margin-right: 15px; min-width: 150px; border: 2px solid #183176; border-radius: 25px; list-style: none; background: #183176; transition: .3s all}
.related-brand ul li a{padding: 5px 12px; display: block; text-align: center; width: 100%; color: #fff; transition: .3s all}
.related-brand ul li:hover{background: transparent;}
.related-brand ul li:hover a{color:  #183176;}

/*====================== Certificates =============================*/
/*.certifications-title{ display: flex; width: 100%; background:url("images/certifications-banner.webp") no-repeat; height: 290px; background-size: contain; background-attachment: fixed;}*/
.certificates-block{ display:flex; flex-wrap:wrap; justify-content:space-between; margin:30px auto;max-width: 1280px; width: 100%}
.certificates-block > div{display:flex; flex-direction:column; align-items: center; width:23%; margin-bottom:3%}
.certificates-block > div > a{ width: 100%}
.certificates-block > div > a{ font-size: 16px; display: block; margin-top: 20px; text-align: center; line-height: 20px; color: #5C4033}
.certificates-block > div img{width:100%; height:auto; display:block; box-shadow: 6px 6px 18px 0px rgba(0,0,0,0.3);}
.download-block h2{ width: 100%; margin: 0; padding-bottom: 10px; border-bottom: 1px solid #06338d;}

.product-intro-block{ padding: 0 35px 30px; border: 1px solid #c1c1c1; width: 100%; margin:80px 0 40px; display: flex; flex-wrap: wrap; background-color: #f9f9f9}
.product-intro-block > h2{position: relative; margin-top: -30px; margin-left: -20px; -webkit-clip-path: polygon(0 0, 100% 0, 96.7% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 96.7% 100%, 0 100%); padding:15px 40px 15px 15px; display: flex; align-items: center; color: #000; background:#d7d7d7; width: 60%}
.product-intro-block > p{width: 100%; font-size: 20px; margin-bottom: 0}
.product-intro-block > h2:before{content: ""; background: #7f9abc; width: 10px; height: 100%; position: absolute; top: 0; right: 12px; transform: skew(-21deg, 0deg); transition-delay: .3s;}

.product-block-main{width: 100%; display: flex;flex-wrap: wrap;justify-content: space-between;padding: 40px 0px; font-size: 18px; max-width: 1280px; margin: auto}
.product-block-main > div{width: 49%;}
.product-block-main .product-text-block{height: 30%;display: block;position: sticky;top: 120px; padding: 15px 15px 15px 0px;}
.product-block-main .product-text-block > span{display: block; width: 100%; font-size: 16px; text-transform: uppercase;color: #9e9e9e; margin-bottom: 10px;}
.product-block-main .product-text-block img{width: 100%; height: auto; display: block; border-radius: 4px}
.product-block-main .product-text-block > h2{font-size: 42px; line-height: 46px; font-weight: normal; color:#54565a; margin-top: 0}
.product-block-main .product-img-block {padding: 15px 0px 15px 15px; position: relative;}
.product-block-main .product-img-block > div {display: flex;flex-wrap: wrap;justify-content: flex-end; margin-bottom: 25px; position: relative;}
.product-block-main .product-img-block > div:last-of-type{margin-bottom: 0px;}
.product-block-main .product-img-block > div > span{width: 10%;height: 60px;display: flex;flex-wrap: wrap;align-items: center;justify-content: center; position: relative;background-color: #edf1f4;border: solid 1px #183176;border-radius: 50%; z-index: 1;}
.product-block-main .product-img-block > div:after{content: ''; width: 1px;height: 100%; background-color: rgb(24 49 118 / 60%);position: absolute; top: 0; left: 29px;transform: translateX(-50%);}
.product-block-main .product-img-block > div:last-of-type > span:after{display: none;}
.product-block-main .product-img-block > div > span:hover{border: solid 2px #183176;background-color: #183176;transition: .5s;}
.product-block-main .product-img-block > div > span:hover > img{filter: invert(100%);}
.product-block-main .product-img-block > div > span > img{display: block;width: 65%;height: auto;margin: auto;}
.product-block-main .product-img-block > div >  div strong{}
.product-block-main .product-img-block > div > div p{margin-top: 0px;}
.product-block-main .product-img-block > div > div {width:80%; color: #000;box-shadow: 0 0 0 1px rgba(205, 216, 228, .25), 0 2px 12px rgba(205, 216, 228, .5); border-radius: 5px; background-color: #edf0f2; padding-bottom: 25px}
.product-block-main .product-img-block > div > div > a{padding-left: 15px; color: #000}
.product-block-main .product-img-block > div > div img{width:100%; height: auto; display: block;    border-radius: 4px;}
.product-img-block > div > div ul{padding-left: 18px}
.product-img-block ul strong{ text-transform: uppercase; color: #000; font-weight: normal; margin: 40px 0 0 ; font-size: 24px;display: flex;flex-wrap: wrap; justify-content: start;align-items: center;}
.product-img-block ul {padding: 0}
.product-img-block ul li{ padding: 0 15px; list-style: none; border-left: 1px solid #183176; margin: 20px 0; line-height: 18px;}
.product-img-block ul li a{display: block; background-color: #fff; padding: 10px; color: #183176;}
.product-block-main .product-ul{padding: 0; display: flex; flex-wrap: wrap}
.product-block-main .product-ul strong{font-size: 18px; display: block; margin-bottom: 10px;}
.product-block-main .product-ul li{list-style: none; width: 50%; padding: 3px 0}
.product-block-main .product-ul .fa-fw {font-size: 14px; color: #183176}

.product-block-bg{background-color: #e9f1f7; margin-left: calc((100vw - 1265px) / -2); width: 100vw; margin-right: calc((100vw - 1265px) / -2); padding-inline: calc((100vw - 1265px) / -2);}

/*===================== Contact us ======================*/
.contactus-block{ display:flex; width:100%; justify-content:space-between; margin-top: 20px; flex-wrap: wrap}
.contactus-block > h2{ width: 100%; font-weight: normal; text-align: center; font-size: 35px; }
.contactus-block > div{ width:48%}
.contactus-block > div > h2{ color:#54565a; text-transform:uppercase; font-size:20px; position:relative; height:40px; margin-bottom: 40px;}
.contactus-block > div > h2:before{ content:""; height:2px; background:#183176; width:65px; left:0; bottom:0; position:absolute}

.contact-details > div{display:flex; justify-content:space-between; flex-wrap:wrap;}
.contact-details > div > div{ width:48%; border:solid 1px #e0e0e0; margin-bottom:4%; text-align:center; padding:20px 15px; transition:all .3s; background-color: #f1f1f1}
.contact-details > div > div:hover{ background-color:#183176; color:#fff; transition:all .3s}
.contact-details > div > div:hover a,.contact-details > div > div:hover .fas,.contact-details > div > div:hover h2{ color:#fff}
.contact-details > div > div h2{ text-transform:uppercase; font-size:14px;}
.contact-details > div > div .fas{ color:#183176; font-size:28px; margin-top:5px}
.contact-details > div > div p{ text-align:center; margin-bottom:0}
.contact-details > div > div a{ color:#000; text-decoration:none}

.enquiry{ display:table;width:100%; margin:auto; }
.enquiry tr{}
.enquiry tr td{ width: 50%; display:inline-block;}
.enquiry tr:nth-of-type(5) td,.enquiry tr:nth-of-type(3) td,.enquiry tr:nth-of-type(4) td{ width: 100%; display:inline-block;}
.captcha {color:#666;}
.enquiry h2{}
.enquiry table{width: 100%}
.enquiry .btn1 {color: #fff; font-weight: normal}
.enquiry input, .enquiry select, .enquiry textarea{background-color: white; color: #666; font-family:Arial, Helvetica, sans-serif; padding: 12px ; width: 100%; font-size: 16px !important; border:1px solid #c0c0c0;}

.disclaimer-text ul,.disclaimer-text ol{ padding:0 0 0 20px; margin:0}
.disclaimer-text ul li,.disclaimer-text ol li{ padding:5px 0}
.text-block.disclaimer-text h2{ font-weight:normal}
.text-block.disclaimer-text h3{ font-size: 16px}
.text-block.disclaimer-text > div{ display: flex; justify-content: space-between; flex-wrap: wrap; width:50%; margin-top:20px}
.text-block.disclaimer-text > div > a{min-width:150px; color: #214580 !important; background-color: transparent;}
.tcs-block > td > div {display: flex;flex-wrap: nowrap;align-items: center;justify-content: unset !important;}
.tcs-block div input {width: 4%;height: 25px;margin-right: 10px; margin-left:0}
.tcs-block > td > div > label > span > a{color: #1f427f !important; font-weight:normal}

.map-block{margin-left: calc((100vw - 1280px) / -2); margin-right: calc((100vw - 1280px) / -2);}
.map-block iframe{display: block;}
/*======================== THANK YOU & ERROR 4040 ==========================*/
.custom-404,.thank-you-custom{min-height:300px;}

/*===========================FORM===========================*/
.email_show{display: none !important;}
.email_remove{}
.form-field-input.noCap{
	width: 100% !important;
}
.form-field *, .form-field, *[id*='_form_parent']{
    color:#808080;
    width: 100%;
}

*[id*='_form_parent'] > *.form-field{ float:left; width: 48%;}
*[id*='_form_parent'] > *:nth-child(even){margin-left: 0.5%;}
*[id*='_form_parent'] > *:nth-child(odd){margin-right: 1%;}
*[id*='_form_parent'] > *:nth-child(odd):last-child{width: 100%;}

*[id*='_form_parent']:after{float: none; clear: both; width: 100%; display: block; content: ' '}

.form-field textarea{font-family:Arial,Helvetica,sans-serif;}
.form-field:not(:last-child){ margin-bottom: 15px;}
.form-field-note{color:#f00; margin-top:5px;}
.form-field-title{
    margin-bottom: 10px;
    font-weight: bold;
}
.form-field > input, .form-field > select, .form-field > textarea{
    padding: 6px;
    border-color: #d4d4d4;
    border-width: 1px;
}
.form-field-break{padding: 10px 0px; width: 100% !important; }
.form-submit{
    width: 100%;
    max-width: 200px;
    display: inline-block;
    position: relative;
    left: 50%;
    transform: translate(-50%, 0);
	-ms-transform: translate(-50%,0%); 
    
    text-align: center;
    padding: 10px;
}

@media screen and (max-width: 600px){
    *[id*='_form_parent'] > *{width: 100% !important; display: block !important; margin-left: 0 !important; margin-right: 0 !important;}
}


/*------------------ FOOTER --------------*/
.footer-top{ color:#fff; padding-left:0px; width:100%; background-color:#202020;  height: 60px; border-top: #183176 solid 7px; float: left; font-size: 14px; position: relative; z-index:100}
.footer-top > div{vertical-align:top; max-width:1140px; margin:auto; text-align:left; display: flex; justify-content: space-between;}
.footer-top > div > div:first-of-type{float: left; width:75%;}
.footer-top > div > div:last-of-type{width:20%; text-align: right; margin-top: 32px}
.footer-top > div > div:last-of-type img{width:100%; height: auto; display: block}
.footer-top ul{padding: 0; margin: 0; float: left;}
.footer-top ul li{list-style: none; float: left; padding: 20px 15px; font-size: 26px}
.footer-top ul li::first-of-type{padding-left: 0}
.footer-top ul li a{color: white}

.footer{ color:#fff; padding-left:0px; width:100%;  background-color:#202020; font-size: 14px}
.footer > div{vertical-align:top; max-width:1280px;  width:100%;  margin:auto; text-align:left; display: flex; flex-wrap: wrap; justify-content: space-between}
.footer > div > div:first-of-type{display: flex; flex-wrap: wrap; width:75%; position: relative; z-index: 100;padding-bottom: 15px}
.footer > div > div:first-of-type ul:first-of-type{margin-bottom: 30px}
.footer > div > div:first-of-type ul:nth-of-type(2){width: 70%; font-size: 18px;}
.footer > div > div:first-of-type ul:nth-of-type(3){width: auto}
.footer > div > div:last-of-type{float: left; width:25%;}
.footer ul{padding: 0; margin: 0; width: 100%; float: left; font-size: 16px}
.footer ul li{list-style: none; float: left; padding: 0px 10px;}
.footer ul li::first-of-type{padding-left: 0}
.footer ul li a{color: white}

.footer-bottom-block{ background-color: #202020; padding: 0 15px; width: 100%;margin: auto;}
.footer-bottom-block > div{ width: 100%; max-width: 1280px; margin: auto; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
.footer-bottom-block > div ul{ padding:15px 0; margin: 0; display: flex; flex-wrap: wrap; font-size: 12px}
.footer-bottom-block > div p{padding: 15px 0;margin: 0;font-size: 12px;}
.footer-bottom-block > div li{list-style: none; color:#fff; padding-right: 15px}
.footer-bottom-block > div ul li a{color: #fff}

.row{clear: left;}
.row0{clear: left; line-height:1px;}

@media not all and (min-resolution:.001dpcm) {
}
@media (min-width: 1664px) and (max-width: 2560px){
	
}

@media only screen  and (min-width : 2280px){
}

@media screen and (max-width: 1280px){
}
@media (min-width: 1025px) and (max-width: 1330px){
	.footer{ padding:0 10px }
	
}

@media only screen and (max-width: 1024px){
	body{ display: table}
	
	
}
@media (min-width: 800px) and (max-width: 1023px){
	
	.menu-top:after{left: -15.6%;}
	}

@media (min-width: 600px) and (max-width: 799px){
	.logo img{ width:100%; height:auto}
	.menu-top{ width:auto}
	.nav > li > a{ padding:0 8px !important} 
	.menu-top:after{left: -15.6%;}
	
}


@media (min-width: 600px) and (max-width: 1023px){
	body{display: block; margin: 100px 0 0 0}
	.menu-top{ background-color:#183176; position:fixed; top:0; height:100px; width:50px; overflow:hidden; padding:0px ;transition:all 0.3s; z-index:100; left: 0}
	#mainNav{padding:10px;overflow-y:auto;height:calc(100vh - 100px)}
	.menu-top>label{color:#fff;display:block;height:100px;padding:0;position:relative;margin-bottom:0}
	.menu-top>label>i{font-size: 1.5rem;color:#fff;line-height:100px;text-align:center;width:50px;transition:all 0.1s ease 0.3s}
	#navOverlay{display:block;width:100%;height:100%;background-color:rgba(0,0,0,0.8);position:fixed;top:0;left:0;transform:translate(-100%);transition:all 0.25s ease-out 0.1s;z-index:100}
	#mobi-toggle:checked ~ .section-1 .menu-top>label i::before{content:"\f00d";font-size:2.5rem}
	#mobi-toggle:checked ~ .section-1 .menu-top{height:100vh;width:250px}
	#mobi-toggle:checked ~ * #navOverlay{transform:translate(0)}
	.mobi-only{ display: block !important}
	
	
	.section-1{ width: calc(100% - 50px); float: right; right: 0; height: 100px; padding: 0 15px; display: flex;  align-items: center; flex-wrap: wrap; justify-content: space-between;}
	.menu-home-container > div > ul li:not(.quote-top){display: none}
	.menu-home-container{background-color: transparent}
	.menu-home-container,.menu-top-container{ width: auto; margin: 0}
	.menu-top-container{order: -1;}
	.menu-top-container > div, .menu-home-container > div{}
	.logo{width:45%}
	
	/*=============== MENU ==============*/
	.dropdown:focus .dropdown-menu,.dropdown:hover .dropdown-menu{display:block !important; margin:0;left:0;position:relative;border-radius:0 !important;min-width: 100%;}
	.navbar-toggle{position:relative; width:20%; margin:0; text-align:center}	
	.dropdown-menu{margin-left: 20px}
	.nav > li > span, .nav > li > a{color: #fff; line-height: 32px; width: 100%; padding: 0 15px;}
	.nav > li a:hover, .nav > li:hover > a, .nav > li:hover > span{color: #fff !important}
	.top-dropdown a{color:#404040 !important; background: #fff }
	.dropdown-menu.top-dropdown{font-size: 14px}
	.nav > li{padding: 5px 0; width:100%}
	.dropdown-menu.double-menu > li{width: 100%}
	
	.banner-text{top: 60%; height: auto; padding: 2rem; max-width: 80%;    left: 50%;}
	.home-intro-text > div,.drivetrain-hydraulics-block > div{width: 100%; }
	.drivetrain-hydraulics-txt{padding: 30px 15px;}
	.drivetrain-hydraulics-img{order: 1;}
	.service-section{padding: 0 15px}
	.service-section > div{ margin: 10px 0;}
	.drivetrain-hydraulics-block > strong:after{left: 0}
	.drivetrain-hydraulics-block > strong:before{right: 0}
	.service-section > div p{ padding: 0 15px; font-size: 16px; line-height: 24px;}
	
	.success-figure > strong{font-size: 32px}
	.success-figure{width: 24%}
	.key-figures{padding: 0 10px}
	.intro-video-block > div{margin: 0 auto}
	.home-intro-text > div p{ font-size: 32px !important; line-height: 38px !important;}
	.call2action > div{padding: 0 15px}
	.call2action > div > div > div{width: 85%}
	.call2action > div > div .btn1{padding: 15px 40px}
	.call2action > div{margin: 30px auto;}
	
	.export-division-main,.footprint-block,.sub-intro-text-block,.sub-page-bg,.call2action-industries,.partner-intro,.intro-sub-block-bg,.what-we-offer-bg,.call2action-service,.call2action-products,.product-block-bg{margin: auto; padding: 0}
	.product-intro-block > h2{width: 100%; margin-left: auto}
	.product-intro-block{padding: 0 15px 15px}
	.product-block-main .product-text-block{padding: 15px}
	.product-block-main .product-img-block > div > div,.division-main-block > div,.product-block-main > div{width: 100%}
	.product-block-main .product-text-block,.division-main-block .division-text-block{position: unset;height: auto}
	.product-block-main .product-img-block > div:after,.call2action-service > div strong:before{display: none}
	
	.related-brand ul{    gap: 8px;}
	.page-title{min-height: 160px}
	.contactus-block > div,.product-intro-block > h2{width: 100%}
	.map-block{margin: 0}
	
	/*.industries-text-list > div,.industries-block{width: 100%}
	.industries-block-img{width: 100%}
	.industries-block-img > div{width: 200px; height: 200px;}
	.industries-block-img{margin-bottom: 0 !important}
	.industries-block{margin: 0 !important}*/
	.intro-sub-block-bg > div{ margin: 40px auto;}
	.industries-block-img{width: 60%;}
	.industries-block{width: 100%}
	.industries-text-list > div{width: 47%}
	
	.partner-bg .partner-txt{width: 100%; padding: 15px; order: -1;}
	.partner-bg > div{width: 100%}
	
	.footer-top > div{padding: 0 15px}
	.footer > div > div:first-of-type ul:first-of-type{width: 70%}
	.footer > div > div:first-of-type{width: 100%;}
	.footer-top > div > div:first-of-type{ width: 33%;}
	.footer-top > div > div:last-of-type{ }
	.call2action-products > div strong{margin-bottom: 20px}
	.footer ul li{padding: 3px 10px}
	.footer-top{}
	
}

@media screen and (max-width:599px){
	body{display: block; margin: 100px 0 0 0}
	.ecat-value{max-width:9px !important;} /*---- important do not remove  ----*/
	.mobi-only{ display: block !important}
	img{max-width: 100%; height: auto}
	.logo{width: 43%;margin:7px auto 0 auto;}
	.section-1{ height: 100px; display: flex; flex-wrap: wrap; justify-content: flex-end; align-content: space-between;}
	.section-2, .section-section, .section-header{width:100%;}	
	.menu-home-container,.menu-top-container{ width: calc(100% - 50px); float: right}
	.menu-home-container > div > ul li:not(.quote-top){display: none}
	.menu-top-container{margin: 0}
	.widget-container{width: 50%;}
	.menu-home-container{background-color: transparent; order: 1;}
	.menu-top-container > div{margin: 0 auto}
	.quote-top{width: 100%; text-align: center;}
	
	.home-intro-text > div,.service-section > div,.logo-block > div,.drivetrain-hydraulics-block > div{width: 100%; }
	.drivetrain-hydraulics-txt{padding: 30px 15px;}
	.drivetrain-hydraulics-img{order: 1;}
	.service-section{padding: 0 15px}
	.service-section > div{ margin: 10px 0;}

	.logo-block > div:last-of-type{border: none}
	.intro-service-img > div{ padding: 40px 15px;}
	.drivetrain-hydraulics-block > strong{font-size: 34px}
	.drivetrain-hydraulics-block > strong:after{left: 0}
	.drivetrain-hydraulics-block > strong:before{right: 0}
	.logo-block{margin: 40px auto; width: 90%;}
	.intro-service-img > div > strong{ font-size: 42px;}
	
	.success-figure{width: 48%; margin: 10px 0}
	.success-figure > strong{font-size: 32px}
	.key-figures{ padding: 30px 15px; margin: 0 auto;}
	.home-intro-text > div p{font-size: 22px !important; line-height: 28px !important;}
	.intro-video-block > div{margin: 0 auto;padding: 0 15px;}
	.intro-video-block > video{ -webkit-transform:unset;  transform: unset; top: 0; left: 0; position: unset}
	.intro-video-block{height: auto}
	.call2action > div{padding: 0 15px}
	.call2action > div > div > div{width: 100%}
	.call2action > div > div p{ line-height: 28px;}
	.call2action > div > div .btn1{padding: 15px 40px; font-size: 20px}
	
	.page-title{min-height: 150px}
	.page-title > div h1{padding: 10px; font-size: 22px; height: 70px; align-items: center; display: flex; flex-wrap: wrap;}
	.page-title > div h1:before{border-top-width: 70px; top: 0}
	
	.export-division-main,.footprint-block,.sub-intro-text-block,.sub-page-bg,.call2action-industries,.partner-intro,.intro-sub-block-bg,.what-we-offer-bg,.call2action-service,.call2action-products,.product-block-bg{margin: auto; padding: 0}
	.product-intro-block > h2{width: 100%; margin-left: auto}
	.product-intro-block{padding: 0 15px 15px}
	.product-block-main .product-text-block{padding: 15px}
	.product-block-main .product-img-block > div > div,.division-main-block > div,.product-block-main > div{width: 100%}
	.product-block-main .product-text-block,.division-main-block .division-text-block{position: unset;height: auto}
	
	.product-block-main{padding: 0}
	.call2action-products > div strong br,.product-block-main .product-img-block > div:after{display: none}
	
	.related-brand ul{gap:10px 0; justify-content: space-between}
	.related-brand ul li{margin: 0; width: 48%}
	.call2action-products > div strong{margin-bottom: 24px; font-size: 22px;}
	.call2action-products > div{margin: 30px 0}
	.division-main-block .division-block > div > span{height:60px ; width: 60px}
	.division-main-block .division-block{padding: 0; margin-top: 40px}
	.division-main-block .division-text-block{padding: 0}
	.division-main-block{padding: 15px 0}
	
	.sub-intro-text-block,.aboutus-intro > div:first-of-type,.aboutus-intro > div,.vehicle-products-block > div,.partner-bg > div,.what-we-offer-block .what-we-offer-text,.what-we-offer-block > div{width: 100%}
	.what-we-offer-block .what-we-offer-title h2{margin-top: 20px}
	.what-we-offer-img > div{width: 100%; margin: 10px 0}
	.call2action-service > div{padding: 0 15px; margin: 30px auto;}
	.call2action-service > div strong:before{display: none}
	.call2action-service{background-size: cover}
	
	.industries-text-list > div,.industries-block{width: 100%}
	.industries-block-img{width: 100%}
	.industries-block-img > div{width: 200px; height: 200px;}
	.industries-block-img{margin-bottom: 0 !important}
	.industries-block{margin: 0 !important}
	.call2action-industries > div{padding: 30px 0}
	
	.partner-bg .partner-txt{padding: 15px; width: 100%; order: -1; margin-bottom: 15px;}
	.partner-bg .partner-txt .btn1,.sub-intro-text-block .btn1{width: 100%}
	.aboutus-intro > div:first-of-type{margin-bottom: 20px}
	
	.sub-intro-img-block{margin: 0; width: 100%; order: -1;}
	.sub-intro-block{padding: 0}
	.call2action-industries{}
	.company-statistics{margin: 0; margin-top: 20px;}
	.company-statistics ul{padding: 30px 10px}
	.company-statistics ul li{width: 33%; line-height: 24px;}
	.company-statistics ul li strong{font-size: 32px}
	.company-statistics:after, .company-statistics:before{display: none}
	
	.division-main-block .division-text-block > h2{font-size:32px; line-height:38px;}
	.export-contact{width: 100%; padding: 0 15px; margin: 25px 0;}
	.export-contact ul{width: 100%; min-height:unset}
	.footprint-block > div,.export-division-team,.export-contact ul strong b{width: 100%}
	.export-contact ul strong{min-height: unset}
	.footprint-block > div h2{font-size: 28px}
	.footprint-block > div:last-of-type{padding: 0 15px}
	.social-media-block > strong{margin: 0}
	.social-media-block > strong a{font-size: 16px}
	
	.certificates-block > div{width: 48%}
	
	.contact-details > div > div,.contactus-block > div{width: 100%}
	.contact-details{margin-top: 30px}
	.map-block{margin: 0}
	
	/*=============== Thank you ==============*/
	.thank-you div,.thank-you{ width:100%}
	.thank-you-title{ left:auto; white-space:normal; font-size:4.5em}
	.thank-you div{ top:auto}
	.thank-you-contact{ margin-top:0}
	.thank-you div{ left:auto}
	
	.text-block.disclaimer-text > div{ width:100%}
	.text-block.disclaimer-text > div > a{ width:100%; margin:5px 0}
	.tcs-block div{ line-height:20px}
	.tcs-block div input{ width:10%}
	
	/*=============== Mobile banner ==============*/	
	.home-banner{  }
	.home-banner h2{font-size: 26px;   line-height: 28px;}
	.cs_title .cs_wrapper{ bottom:0}
	/*.home-banner:before{content: "";transform: unset; background-color:rgb(0 0 0 / 50%); padding: 0; max-width: 100%; border-radius: 0; width: 100%; left: 0; top: 0; height: 100%; z-index: 2;}*/
	.banner-text{padding: 0; max-width: 100%; border-radius: 0; width: 100%; left: 0; top: 0; height: 100%;transform:unset;        background-color: rgb(0 0 0 / 50%);}
	.banner-text p{padding: 0 15px}
	.banner-text .banner-btn1{display: none;margin-top: 15px; margin-left: 15px;}
	.csslider1 > .cs_description > label{ max-width:100% !important; width:100%; padding: 0 !important; top: 50% !important; left: 50% !important;}
	.csslider1 > .cs_description > label .cs_title{margin-bottom: 0 !important}
	.home-banner h1{ font-size:26px; line-height: 34px;margin: auto; width: 91% !important; margin-top: 40px;}
	.home-banner .cs_title .cs_wrapper{ padding:0 15px; font-size:26px}
	.mobile-banner > span{ position:unset; font-size:32px; line-height:32px}
	.home-banner .cs_descr .cs_wrapper{ margin:30px 0 0 0; padding:0 15px; font-size:20px; line-height:26px}
	.home-banner .cs_descr .cs_wrapper br{ display:none}
	.home-banner .btn-learn-more{ margin-left:15px; margin-top:15px}
	.home-banner .cs-title-align{ margin:0}
	.mobile-banner > span h1{ font-size:32px; line-height:32px}
	.home-banner .btn-banner{ margin-top:15px; padding:10px 15px}
	
	.call2action-service > div strong br,.call-to-action-btn1,.mobile-banner > span br{ display:none !important}
	.other-products-and-services > div,.what-we-offer-bg > div .double-ul li, .what-we-offer-block > div .double-ul li,.what-we-offer-bg > div > ul{width: 100%}
	.other-products-and-services .products-and-services-text h2{height: unset}
	.related-brand ul li a{line-height: 22px}
	.cylinder-division-bg{margin: auto}
	
	.contactus-block > h2{ font-size: 32px; line-height: 38px;}

	/*=============== MENU ==============*/
	.dropdown:focus .dropdown-menu,.dropdown:hover .dropdown-menu{display:block !important; margin:0;left:0;position:relative;border-radius:0 !important;min-width: 100%;}
	.navbar-toggle{position:relative; width:20%; margin:0; text-align:center}	
	.menu-top{position: absolute; top: 70px; width: 100%}	
	.dropdown-menu{margin-left: 20px}
	.nav > li > span, .nav > li > a{color: #fff; line-height: 32px; width: 100%; padding: 0 15px;}
	.nav > li a:hover, .nav > li:hover > a, .nav > li:hover > span{color: #fff !important}
	.top-dropdown a{color:#404040 !important; background: #fff }
	.dropdown-menu.top-dropdown{font-size: 14px}
	.nav > li{padding: 5px 0; width:100%}
	.dropdown-menu.double-menu > li{width: 100%}
	
	.footer ul li{padding: 3px 7px;}
	.footer > div{padding: 0 15px}
	.footer > div > div:first-of-type{width: 100%}
	.footer-top{height: auto}
	.footer > div > div:first-of-type ul:nth-of-type(2){font-size: 16px}
	.footer-bottom-block > div li{ padding: 0 5px 10px;}
	.footer-bottom-block > div{ padding-bottom: 10px;}
	.footer-top > div > div:first-of-type{display: none}
	.footer-top > div > div:last-of-type{width: 37%; margin: 15px auto;}
}

@media screen and (max-width: 599px){
	.menu-top{ background-color:#183176; position:fixed; top:0; height:100px; width:50px; overflow:hidden; padding:0px ;transition:all 0.3s; z-index:100; left: 0}
	#mainNav{padding:10px;overflow-y:auto;height:calc(100vh - 100px)}
	.menu-top>label{color:#fff;display:block;height:100px;padding:0;position:relative;margin-bottom:0}
	.menu-top>label>i{font-size: 1.5rem;color:#fff;line-height:100px;text-align:center;width:50px;transition:all 0.1s ease 0.3s}
	#navOverlay{display:block;width:100%;height:100%;background-color:rgba(0,0,0,0.8);position:fixed;top:0;left:0;transform:translate(-100%);transition:all 0.25s ease-out 0.1s;z-index:100}
	#mobi-toggle:checked ~ .section-1 .menu-top>label i::before{content:"\f00d";font-size:2.5rem}
	#mobi-toggle:checked ~ .section-1 .menu-top{height:100vh;width:250px}
	#mobi-toggle:checked ~ * #navOverlay{transform:translate(0)}
}