/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain) xampp
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	font-family: Gilroy,system-ui,-apple-system,Arial,sans-serif;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

input[type='text'], textarea, select, button {
    font-family: Gilroy,system-ui,-apple-system,Arial,sans-serif;
    font-size: 16px !important;
    outline:none;
    border-radius: 0px;
}

* {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

*, *::before, *::after {
    box-sizing: inherit;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */ /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently supported by Chrome, Opera and Firefox */
}

.active{
	display:block !important;
}

a:hover{
	cursor:pointer;
}

li, p {
    max-width: 75ch;
}

p{
    line-height: 150%;
}

.paragraph{
    color: var(--grey);
}

:root {
  --white: #f1f1f1;
  --white-bg: #f5f5f7;
  --black: #000;
  --error: #e54c69;
  --maroon: #981212;
  --grey: #393c41;
}

@font-face {
    font-family: amcap_eternalregular;
	font-weight: normal;
    font-style: normal;
	font-display: auto;
    src: url(../font/amcap_eternal-webfont.woff2) format('woff2'),
         url(../font/amcap_eternal-webfont.woff) format('woff');
}

@font-face{
	font-family: Gilroy;
	font-weight: 500;
	font-style: normal;
	font-display: auto;
	src: url(../font/Gilroy-Medium-webfont.woff2) format("woff2");
}

@font-face {
    font-family: Impact;
    font-weight: normal;
    font-style: normal;
    font-display: auto;
	src: url(../font/Impact.woff2) format('woff2'),
         url(../font/Impact.woff) format('woff');
}

html{font-size:16px;}

@media (max-width: 880px) {
  html { font-size: 15px; }
}

@media (max-width: 400px) {
  html { font-size: 14px; }
}

html, body {
    height: 100%;
    -webkit-text-size-adjust: 100%;
}

body{
	padding: 0;
    margin: 0;
    background-color: var(--black);
	/*overflow-x: hidden;*/
	overflow-y: auto;
}

a:link{text-decoration: none;}
ul{list-style: none;}

.unsupported-browser{
    display: none;
}

.unsupportedCSS{
    width: 100%;
    padding: 30px 20px;
    background: #e30000;
    color: white;
    display: block;
}

.unsupportedCSS a{
    color: white;
    text-decoration: underline;
}

.resize-animation-stopper * {
	transition: none !important;
	-webkit-animation: none !important;
	        animation: none !important;
}

/* SCROLL TO TOP */
.scrolltop{
    position: fixed;
    bottom: 100px;
    width: 35px;
    right: 0px;
    height: 35px;
    display: none;
    background: url(../images/button/scroll-top-btn.svg);
    background-position: center;
    opacity: 0.8;
    cursor: pointer;
    z-index: 1000;
}

@media (hover: hover) {
    .scrolltop:hover{
        opacity: 1;
    }
}

/* HEADEAR START */
.top-wrapper {
    width: 100%;
    height: 98px;
    margin: 0 auto;
    z-index: 1001;
	position:relative;
    background-color: var(--black);
}

.top-wrapper .container{
    background-color: var(--black);
    height: 98px;
    z-index: 1001;
    width: 100%;
    position: absolute;
}

.logo-wrapper{
	width:149px;
	position: absolute;
    top: 20px;
    left: 6vw;
	transform: scale(1);
	/*animation:fadeInZoom 1s linear;*/
	z-index:1000;
}

/*@keyframes fadeInZoom {
  0% {
    opacity:0;
	transform: scale(0.8);
  }
  100% {
    opacity:1;
	transform: scale(1);
  }
}*/

.logo-wrapper .logo{
	position:absolute;
}

.logo-wrapper .logo-svg{
	width:2.375rem;
	height:3.75rem;
	cursor:pointer;
}

.logo-wrapper .name{
	position: absolute;
    left: 2.8rem;
    top: 0.48rem;
}

.logo-wrapper .name a{
	font-size: 1.625rem;
	font-family: amcap_eternalregular;
	color:var(--white);
	letter-spacing:1px;
}

.logo-wrapper .name span{
    float: left;
    font-size: 0.85rem;
    margin-top: -5px;
}

.nav {
    margin: 0;
    padding: 0;
    height: 98px;
    line-height: 5rem;
    text-align: right;
    right: 6vw;
	position:absolute;
	padding-right: 34px;
}

ul {
    list-style: none;
}

.nav > li {
    display: inline-block;
    padding: 10px;
}

.nav > li > a {
    text-decoration: none;
    color: var(--white);
	font-family: Gilroy,system-ui,-apple-system,Arial,sans-serif;
    line-height: 2;
    font-size: .85rem;
    letter-spacing: 1px;
	display: inline-block;
	position: relative;
}

.nav > li > a::after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: #ffcc00;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

.overlaymenu a::after {
    content: ' →';
    position: absolute;
    /* width: 100%; */
    transform: scaleX(0);
    /* height: 1px; */
    /* bottom: 0; */
    left: 0;
    /* background-color: var(--black); */
    transform-origin: bottom left;
    transition: transform 0.25s ease-out;
}

.nav > li > a:hover::after,.overlaymenu a:hover::after {
  transform: scaleX(1);
  transform-origin: bottom left;
}

.min-nav-btn {
	display:none;
	width: 25px;
    height: 25px;
    top: 2.3125rem;
    /* right: 2.3125rem; */
    right: 0;
    cursor: pointer;
    position: absolute;
    background-image:url("../images/button/min-nav-btn.svg");
	background-size:25px 25px;
    -webkit-background-size:25px 25px;
    -moz-background-size:25px 25px;
    -o-background-size:25px 25px;
	transition:all 0.7s;
}

.min-nav-btn.active {
    background-image:url("../images/button/min-nav-close-btn.svg") !important;
}

/*.addclass_body{
	overflow:hidden;
	-ms-overflow-style: none;
	overflow: -moz-scrollbars-none;
}*/

.overlaymenu {
    /* display: flex; */
    /* align-items: center; */
    opacity: 0;
    overflow: hidden;
    width: 100%;
    /* padding: 0vw 6vw; */
    /* padding-top: 20px;
    padding-bottom: 50px; */
    /* height: 100vh; */
    position: absolute;
    z-index: 1000;
    top: -100vh;
    /* float: right; */
    right: 0;
    background-color: #ffcc00f5;
    box-shadow: 3px 3px 3px #0000006b;
    transition: all 0.7s;
    overflow: hidden;
}

.overlaymenu-content {
	/*position: relative;*/
    top: 10%;
    width: 100%;
    text-align: center;
    /* display: none; */
    margin-top: 80px;
    margin-bottom: 50px;
}

.overlaymenu a {
    padding: 18px 0px 18px 20px;
    border-bottom: 1px solid #1b1b1b;
    width: calc(100% - 60px);
    text-align: left;
    margin: 0 auto;
    text-decoration: none;
    font-size: 1rem;
    /* letter-spacing: 1.5px; */
    color: var(--black);
    display: block;
    transition: 0.3s;
    position: relative;
}

.overlaymenu a:last-child {
    border-bottom: none;
}

.search-btn {
    top: 2.3125rem;
    right: 0;
    cursor: pointer;
    position: absolute;
}

.search-btn:hover circle, .search-btn:hover line{
    stroke: #ffcc00;
}

#content{
    display: none;
    position: fixed;
    z-index: 1002;
    left: 0;
    top: 98px;
	bottom:0;
    width: 100%;
    /*height: 100vh;*/
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.box-menu-content{
	width: calc(100% - 40px);
    /*height: calc(100vh - 40px);*/
    background: white;
    padding: 20px;
    overflow: auto;
    opacity: 0;
    visibility: hidden;
    transition: all 0.7s;
}

.box-menu-content.active {
    opacity: 1;
    visibility: visible;
}

.btn-menu-close{
	position: absolute;
    top: 30px;
    right: 20px;
	display: inline-block;
    width: 30px;
    height: 30px;
    background-color: #202121;
    border-radius: 50%;
    overflow: hidden;
    z-index: 1000;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}

.btn-menu-close::before, .btn-menu-close::after {
    content: '';
    position: absolute;
    top: 13px;
    left: 8px;
    width: 14px;
    height: 3px;
    background: #fcfcfc;
    transform: rotate(45deg);
    transition: all 0.3s ease-in-out;
}

.btn-menu-close::after {
    transform: rotate(-45deg);
}

.btn-menu-close:hover {
    opacity: 0.7;
}

.box-menu-content .inner{
	position: relative;
    max-width: 100%;
    margin: 0 auto;
    padding: 10px 20px 20px 10px;
    clear: both;
    border-bottom: 1px solid #DBE0DF;
}

.box-menu-content .inner ~ .inner{
    border-bottom: none;
}

.box-menu-content .inner .title{
    font-size: 0.85rem;
    margin-top: 8px;
    margin-bottom: 16px;
    letter-spacing: 0.5px;
}

.box-menu-content .inner .title a{
    color:#202121;
}

.box-menu-content .inner .title a::after{
    content: '\2192';
    padding-left:8px;
}

.box-menu-content .inner .title a:hover{
    border-bottom: 1px solid #202121;
}

.menu-list-tag, .suggestion-list-tag{
	display: inline-block;
}

.menu-list-tag li, .suggestion-list-tag li{
	position: relative;
    float: left;
    margin: 0 4px 4px 0;
    font-size: 0.85rem;
}

.menu-list-tag .item, .suggestion-list-tag .item{
	position: relative;
    display: block;
    height: 30px;
    padding: 0 20px;
    line-height: 30px;
    color: var(--grey);
    border: 1px solid #DBE0DF;
    border-radius: 36px;
    overflow: hidden;
    z-index: 1000;
    transition: all 0.3s ease-in-out;
}

.box-menu-content .menu-list-tag .item:not([data-count=""])::after {
    margin-left: 3px;
    content: "(" attr(data-count) ")";
    font-size: 0.6875rem;
    font-weight: normal;
}

.menu-list-tag .item:hover, .suggestion-list-tag .item:hover{
	background: #e2e2e2;
    cursor: pointer;
}

/* SEARCH BAR */
.search-wrap{
    position: absolute;
    z-index: 1001;
    min-width: 500px;
    text-align: right;
    padding: 12px 0px;
    top: 22px;
    right: 6vw;
    display: none;
}

.search-input{
    width: calc(100% - 40px);
    height: 28px;
    text-align: left;
    border: 0;
    color: #636363;
    -webkit-appearance: none;
    float: left;
    padding: 0px 30px 0px 10px;
    background-color: var(--white);
}

.search-close{
    width: 25px;
    height: 25px;
    top: 14px;
    right: 2px;
    cursor: pointer;
    position: absolute;
    background-image: url(../images/button/search-close-btn.svg);
    background-size: 18px 18px;
    background-repeat: no-repeat;
    background-position: center;
    transition: all 0.7s;
}

.search-close:hover{
    transform: rotate(360deg);
}
/* HEADEAR END */

/* FOOTER START */
.bottom-wrapper{
	width:100%;
	background: #000000;
}

.footer{
	max-width:1200px;
	margin:0 auto;
	padding:50px 20px;
}

.footer-menu{
	display: grid;
    grid-template-columns: auto auto auto auto auto;
    grid-gap: 20px;
}

.footer-menu ul > li > a{
	color:#838383;
	font-size: .85rem;
	line-height:20px;
	line-height: 1.5rem;
}

.footer-menu ul > li > a:hover{
    color: #ffcc00;
}

.footer-menu ul > li:first-child {
	padding-bottom:12px;
}

.footer-menu ul > li:first-child a {
	font-weight:800;
	color:var(--white);
	letter-spacing: 1px;
}

.footer-menu ul > li:first-child a:hover {
    color: #ffcc00;
}

.footer-social{
	width:-webkit-max-content;
	width:-moz-max-content;
	width:max-content;
	display:grid;
	grid-template-columns: auto auto auto auto;
    grid-gap: 20px;
	justify-items: center;
	margin-top:80px;
}

.footer-social div{
	width:35px;
	height:35px;
	background-size:35px 35px;
	background-repeat:no-repeat;
}

.footer-social .fb{
	background-image: url("../images/icon/facebook.svg");
}

.footer-social .fb:hover{
    background-color: var(--grey);
}

.footer-social .ig{
	background-image: url("../images/icon/instagram.svg");
}

.footer-social .ig:hover{
    background-color: var(--grey);
}

.footer-social .yt{
	background-image: url("../images/icon/youtube.svg");
}

.footer-social .yt:hover{
    background-color: var(--grey);
}

.footer-social .tt{
	background-image: url("../images/icon/tiktok.svg");
}

.footer-social .tt:hover{
    background-color: var(--grey);
}

.footer-copyright{
	color: var(--white);
    font-size: 0.8rem;
    padding: 20px 20px 30px 20px;
    background: #1b1b1b;
    clear: both;
    letter-spacing: 1px;
}

.footer-copyright div{
	max-width:1200px;
	margin:0 auto;
}

.footer-copyright span{
    font-size: 1.375rem;
    font-family: amcap_eternalregular;
    letter-spacing: 1px;
}
/* FOOTER END */

/* SEARCH PAGE START*/
.search-container i{
    padding: 0px 16px;
}

.search-bar{
    width: 800px;
    padding: 12px 16px;
    border: 1px solid #d1d1d1;
    margin-bottom: 20px;
}

.search-suggestion{
    margin-top: 12px;
}

.suggestion-list-tag .item{
    z-index: 0;
}

.search-result-container{
    margin-top: 16px;
}

.search-result-wrap{
    display: inline-block;
    padding: 20px 16px;
    background: #efefef;
    width: calc(100% - 32px);
    margin-bottom: 10px;
    border-left: 8px solid #ffcc00;
}

.search-result-wrap .title{
    font-size: 1.25rem;
    margin-bottom: 5px;
}

.search-result-wrap .desc{
    color: #7c7c7c;
    line-height: 150%;
}

.search-result-wrap a{
    color: var(--grey);
}

.search-result-wrap a:hover .title{
    text-decoration: underline;
}


/* SEARCH PAGE END*/

/* SLIDER START */
.slider{
	height: 45vw;
    background: rgb(234 234 234) linear-gradient(to bottom,rgb(234 234 234) 0,rgb(167 167 167 / 58%) 80%,rgb(245 245 247) 93%);
    overflow: hidden;
    width: 100%;
	position:relative;
}

.slider-title{
    z-index: 998;
	width: auto;
    padding-left: 6vw;
    padding-top: 6vw;
    color: var(--black);
	position:absolute;
	left:0;
	opacity:1;
	-webkit-animation:flyInFromLeft 1s linear;
	        animation:flyInFromLeft 1s linear;
}

.slider-title span:nth-child(2){
    font-size: 2.4vw;
    font-family: Impact;
    padding-left:1.5vw;
    color:#981212;
}

@-webkit-keyframes flyInFromLeft {
  0% {
	left:-60vw;
    opacity:0;
  }
  100% {
	left:0;
    opacity:1;
  }
}

@keyframes flyInFromLeft {
  0% {
	left:-60vw;
    opacity:0;
  }
  100% {
	left:0;
    opacity:1;
  }
}

.slider-title span:first-child{
	font-size: 6.5vw;
    font-family: amcap_eternalregular;
    line-height: 6vw;
}

/* PRODUCT PAGE START*/
.slider-product-spec{
    z-index: 996;
	position: absolute;
    padding-top: 6vw;
    color: var(--black);
    right: 6vw;
	-webkit-animation:fadeInOpacity 2s linear;
	        animation:fadeInOpacity 2s linear;
}

@-webkit-keyframes fadeInOpacity {
  0% {
    opacity:0;
  }
  50% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@keyframes fadeInOpacity {
  0% {
    opacity:0;
  }
  50% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

.slider-product-spec table{
	text-align: left;
    font-size: 1rem;
}

.slider-product-spec table th{
	padding-bottom:1vw;
}

.slider-product-spec table td{
	line-height:1.25rem;
}

.slider-product-spec table td:nth-child(2){
	padding-left: 1.8rem;
}

#go-to-spec:hover{
    cursor: pointer;
    color: var(--maroon);
}
/* PRODUCT PAGE END */

.slider-desc{
    z-index: 997;
	position: absolute;
    padding-left: 6vw;
    padding-top: 12.5vw;
    color: var(--black);
	-webkit-animation:flyInFromLeft 1s linear;
	        animation:flyInFromLeft 1s linear;
}

.slider-desc p{
	font-size: 1.5vw;
    font-family: Gilroy,system-ui,-apple-system,Arial,sans-serif;
    font-weight: 200;
}

.slider .product-display{
	width: 65%;
    right: 0;
    bottom: 0;
    position: absolute;
    opacity: 1;
    overflow-x: hidden;
    z-index: 995;
}

.slider .product-display img{
	width: 65%;
    -webkit-animation: flyInFromRight 1s linear;
            animation: flyInFromRight 1s linear;
    position: relative;
}

@-webkit-keyframes flyInFromRight {
  0% {
	right:-50vw;
    opacity:0;
  }
  100% {
	right:0;
    opacity:1;
  }
}

@keyframes flyInFromRight {
  0% {
	right:-50vw;
    opacity:0;
  }
  100% {
	right:0;
    opacity:1;
  }
}
/* SLIDER END */

/* BROWSE START */
.browse{
    height: 100%;
    max-width: 1200px;
    padding-bottom: 5vw;
    position: relative;
    margin: 0 auto;
}

.browse-key{
	padding:40px 20px 20px 20px;
    text-align: center;
}

.browse-key span{
	color:var(--white);
    font-size: 1.25rem;
}

.browse-key span.title{
	font-size:1.625rem;
	font-family: amcap_eternalregular;
	letter-spacing: 1px;
}

.browse-item-wrapper{
	position: relative;
    display: grid;
    grid-template-columns: 30% 30% 30%;
    grid-gap: 10px;
    justify-content: space-between;
    padding: 0px 20px;
}

.browse-item-wrapper .item{
	position:relative;
	background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 125.41%; /* (img-height / container-width x img-width) */
    border-radius: 4px;
}

.browse-item-wrapper .overlay{
    background: linear-gradient(to bottom,rgba(0,0,0,0) 4%,rgba(0,0,0,0.38) 89%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 4px;
}

/* .browse-item-wrapper .overlay:hover{
    background: linear-gradient(to bottom,rgba(0,0,0,0) 4%,rgba(0,0,0,0.2) 89%);
} */

.browse-item-wrapper .item:hover .browse-click {
    background: #303030bf;
}

/* .browse-click:hover{
    background: #303030bf;
} */

.browse-item-wrapper .item.one{
	background-image:url("../images/home/kinhock-products.jpg");
}

.browse-item-wrapper .item.two{
	background-image:url("../images/home/kinhock-parts.jpg");
}

.browse-item-wrapper .item.three{
	background-image:url("../images/home/kinhock-services.jpg");
}

.browse-click{
    width: calc(100% - 40px);
    position: absolute;
    bottom: 0;
    padding: 15px 20px;
	display: grid;
    grid-template-columns: 1.5fr 0.5fr;
    gap: 10px;
	align-items: center;
    min-height: 48px;
}

.browse-click .title{
	/*font-family: 'amcap_eternalregular';*/
	font-size:1.5rem;
	color: var(--white);
	letter-spacing: 1px;
	justify-self: start;
}

.browse-click .square{
	background-image: url(../images/button/square-btn.svg);
    width: 34px;
    height: 34px;
    background-size: 100%;
    background-repeat: no-repeat;
	justify-self: end;
}
/* BROWSE END */

.browse-used-machines-key{
    text-align: right;
    padding: 40px;
    font-size: 2.8rem;
    color: var(--white);
    max-width: calc(1200px - 80px);
    margin: 0 auto;
}

.browse-used-machines-key span{
    color: #c76911;
    font-family: amcap_eternalregular;
}

.browse-used-machines{
    margin-bottom: 100px;
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 4px;
}

.browse-used-machines .img{
    background-image: url(../images/home/used-machines-for-sale-and-rent-malaysia.jpg);
    background-repeat: no-repeat;
    background-position: 20% 100%;
    background-size: cover;
    transition: all 0.7s;
    height: 46vw;
    min-height: 240px;
    max-height: 375px;
}

.browse-used-machines:hover .img{
    transform: scale(1.05);
}

/* .browse-used-machines img{
    width: 100%;
    display: block;
    min-height: 280px;
    object-fit: cover;
    border-radius: 4px;
} */

.main-wrapper{
	/*max-width: 1200px;*/
	margin: 0 auto;
}

.kpi-key {
    color: var(--white);
    text-align: center;
    padding-top: 100px;
    font-size: 1.25rem;
}

.kpi-key span{
    font-size: 1.625rem;
}

.kpi {
	max-width: calc(1200px - 40px);
    padding: 50px 20px 13vw 20px;
    position: relative;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 30% 30% 30%;
    justify-content: space-between;
    grid-gap: 10px;
}

.kpi span {
	font-size: 50px;
	font-family: amcap_eternalregular;
    text-shadow: 0px 0px 12px var(--black);
}

.kpi label {
	font-size: 1rem;
	white-space: nowrap;
}

.each-kpi{
	text-align: center;
    color: var(--white);
    background-image: url(../images/icon/meter.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    position: relative;
    padding-top: 69%;
	z-index:-1;
}

.kpi-grid{
    display: grid;
    grid-template-columns: 1fr;
    align-items: end;
    position: absolute;
    top: 50%;
    width: 100%;
}

.needle {
    width: 1.5%;
    height: 70%;
    background: #ffcc00;
    border-bottom-left-radius: 1.5%;
    border-bottom-right-radius: 1.5%;
    border-top-left-radius: 100%;
    border-top-right-radius: 100%;
    display: inline-block;
    margin: 0 auto;
    position: absolute;
    top: 0;
	/*-webkit-animation: move 4s infinite;*/
    transform: rotate(-100deg);
    transform-origin: bottom;
    z-index: -2;
}

.light {
	width: 1.2vw;
    height: 1.2vw;
    background: #ff0000;
    border-radius: 50%;
    display: inline-block;
    margin: 0 auto;
    top: 30%;
    right: 28%;
    position: absolute;
    bottom: 0;
    z-index: -2;
	/*-webkit-animation: blink 0.5s infinite;*/
    opacity:0;
}

@-webkit-keyframes blink {
	0% {opacity:0;}
    100% {opacity:0.8;}
}

@keyframes blink {
	0% {opacity:0;}
    100% {opacity:0.8;}
}

@-webkit-keyframes move1 {
    0% {transform:rotate(-100deg);}
    100% {transform:rotate(98deg);}
}

@keyframes move1 {
    0% {transform:rotate(-100deg);}
    100% {transform:rotate(98deg);}
}

@-webkit-keyframes move2 {
    0% {transform:rotate(-100deg);}
    100% {transform:rotate(60deg);}
}

@keyframes move2 {
    0% {transform:rotate(-100deg);}
    100% {transform:rotate(60deg);}
}

@-webkit-keyframes move3 {
    0% {transform:rotate(-100deg);}
    100% {transform:rotate(45deg);}
}

@keyframes move3 {
    0% {transform:rotate(-100deg);}
    100% {transform:rotate(45deg);}
}

/* ABOUT US PAGE START */
.top-sticky-menu{
    height: 60px;
}

.top-sticky-menu > div{
    z-index: 999;
}
.top-sticky-menu .container{
    height: 20px;
    display: flex;
    max-width: 320px;
    flex-direction: row;
    margin: 0 auto;
    justify-content: space-evenly;
    padding: 20px;
    transition: all 0.7s;
}

.top-sticky-menu .container span:hover{
    cursor: pointer;
    text-decoration: underline;
}

.top-sticky-menu > div.stick{
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    background: #000000c9;
    color: #f5f5f7;
    z-index: 999;
}

.main-wrapper.about-us{
    width:calc(100% - 80px);
    max-width: 1200px;
    padding:100px 40px 100px 40px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    -moz-column-gap: 50px;
         column-gap: 50px;
    row-gap: 100px;
}

.main-wrapper.about-us.history {
    grid-template-columns:1fr;
    background:#1b1b1b;
    max-width:none;
    margin-top: 50px;
    padding-bottom: 100px;
}

.main-wrapper.about-us img{
    border-radius: 12px;
}

.main-wrapper.about-us .title{
    font-family: amcap_eternalregular;
    font-size: 3.5vw;
}

.main-wrapper.about-us .title label{
    font-family: amcap_eternalregular;
    font-size: 5vw;
}

.who .logo{
    padding-left: 7vw;
    margin-bottom: 50px;
    margin-top: 100px;
}

.who .logo img{
    width: 100%;
    max-width: 180px;
}

.what .office{
    margin-bottom: 50px;
}

.main-wrapper.about-us p{
    font-size: 1.25rem;
    max-width: 36ch;
}

.what .office img,
.where .service-point img,
.why .service-center img{
    width: calc(100% - 40px);
}

.where-info,
.why-info{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.history{
    display: grid;
    color: var(--white);
}

.history .title{
    text-align: center;
}

.history .scrollable{
    cursor: pointer;
    display: flex;
    -moz-column-gap: 40px;
         column-gap: 40px;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    -ms-scroll-snap-type: x mandatory;
        scroll-snap-type: x mandatory;
}

.history .scrollable::-webkit-scrollbar {
    height: 8px;
}

.history .scrollable::-webkit-scrollbar-track {
    background: var(--black);
    border-radius: 10px;
}

.history .scrollable::-webkit-scrollbar-track-piece {
    border-radius: 10px;
}


.history .scrollable::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: var(--maroon);
}

.history .scrollable::-webkit-scrollbar-thumb:hover {
    border: 2px solid var(--black);
}

.timeline{
    margin:0 auto;
    width:100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    text-align: center;
    flex: 0 0 auto;
    scroll-snap-align: start;
    /* cursor:-webkit-grab;
    cursor:grab; */
    position: relative;
}

.timeline > *{
    -webkit-user-drag: none;
}

.timeline .info p{
    min-height: 80px;
}

.timeline img{
    width: 320px;
    margin: 20px;
    /* border:3px solid #5a5a5a; */
}

.timeline .year{
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 2rem;
    font-weight: bold;
    letter-spacing: 3px;
}

.timeline .scroll-left{
    position: absolute;
    bottom: 10px;
    left: 30px;
    color: #868686;
    cursor:pointer;
}

.timeline .scroll-right{
    position: absolute;
    bottom: 10px;
    right: 30px;
    color: #868686;
    cursor:pointer;
}

.line{
    width: 100%;
    height:100px;
    background-image: url(../images/company/history/timeline.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    margin-bottom: 10px;
}

.main-wrapper.csr{
    padding-bottom: 200px !important;
}

.main-wrapper.mission,
.main-wrapper.csr{
    padding-bottom: 200px;
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    max-width: unset;
}

.main-wrapper.mission img{
    width: 200px;
    margin-top: 20px;
}

.main-wrapper.mission .header{
    position: relative;
}

.main-wrapper.mission .border-box{
    position: absolute;
    margin-top: 20px;
    border: 2px solid #6bb5c1;
    border-radius: 12px;
    width: 160px;
    height: 160px;
    left: 0;
    right: 0;
    bottom: 25px;
    margin: 0 auto;
    transform: rotate(58deg);
    z-index: -1;
}

.main-wrapper.mission .mission,
.main-wrapper.csr .csr{
    display: grid;
    grid-template-columns: 1fr 1fr;
    text-align: center;
    align-items: baseline;
    justify-items: center;
}

.main-wrapper.mission .mission div,
.main-wrapper.csr .csr div{
    padding: 20px;
}

.main-wrapper.mission .mission div:nth-child(odd){
    border-right: 1px solid #aed4d8;
}

.main-wrapper.csr .csr div:nth-child(odd){
    border-right: 1px solid #efefef;
}

.main-wrapper.mission .mission span{
    font-size: 1.5rem;
    background: #aed4d8;
    display: block;
    width: 38px;
    height: 38px;
    line-height: 38px;
    margin: 0 auto;
    border-radius: 50%;
    color: #f5f5f7;
    margin-bottom: 20px;
}

.csr img{
    max-width: 250px;
    width: 100%;
    height: 180px;
    -o-object-fit: cover;
       object-fit: cover;
    margin-bottom: 10px;
}

.main-wrapper.about-us.career{
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    background: #fff;
}

.main-wrapper.about-us.career img{
    width: 100%;
    max-width: 900px;
}

.main-wrapper.about-us.career p{
    max-width: 900px;
    text-align: left;
    line-height: 2rem;
    padding:20px;
}

.main-wrapper .jobstreet a{
    color: #0d3880;
    font-weight: bold;
    font-size: 1.5rem;
    letter-spacing: -0.5px;
}

.main-wrapper .jobstreet a:hover{
    text-decoration: underline;
}

/* ABOUT US PAGE END */

/* NEW EQUIPMENT PRODUCTS PAGE START */
.product-spec-grid{
	padding: 12vh 0;
	/*background: #dedede;*/
	display:grid;
	grid-template-columns: 1fr 1fr;
}

.product-spec-grid .image{
	display: flex;
}

.product-spec-grid div{
	opacity: 0;
	transform: translate(0, 10vh);
	transition: all 1.5s;
}

.product-spec-grid div.visible {
	opacity: 1;
	transform: translate(0, 0);
}

.product-spec-grid .aa::after{
    content: "01";
    font-size: 10rem;
    color: #efefef;
    bottom: -4rem;
    right: 2rem;
    position: absolute;
    /* clip-path: inset(0% 0% 35% 0%); */
    z-index: 1000;
}

.product-spec-grid .bb::after{
    content: "02";
    font-size: 10rem;
    color: #efefef;
    bottom: -4rem;
    left: 2rem;
    position: absolute;
    z-index: 1000;
}

.product-spec-grid .cc::after{
    content: "03";
    font-size: 10rem;
    color: #efefef;
    bottom: -4rem;
    right: 2rem;
    position: absolute;
    z-index: 1000;
}

.product-spec-grid .dd::after{
    content: "04";
    font-size: 10rem;
    color: #efefef;
    bottom: -4rem;
    left: 2rem;
    position: absolute;
    z-index: 1000;
}

.product-spec-grid .ee::after{
    content: "05";
    font-size: 10rem;
    color: #efefef;
    bottom: -4rem;
    right: 2rem;
    position: absolute;
    z-index: 1000;
}

.product-spec-grid .ff::after{
    content: "06";
    font-size: 10rem;
    color: #efefef;
    bottom: -4rem;
    left: 2rem;
    position: absolute;
    z-index: 1000;
}

.product-spec-grid .gg::after{
    content: "07";
    font-size: 10rem;
    color: #efefef;
    bottom: -4rem;
    right: 2rem;
    position: absolute;
    z-index: 1000;
}

.product-spec-grid .hh::after{
    content: "08";
    font-size: 10rem;
    color: #efefef;
    bottom: -4rem;
    left: 2rem;
    position: absolute;
    z-index: 1000;
}

.product-spec-grid .image img{
	width:100%;
	height:100%;
    background: var(--white-bg);
    -o-object-fit: contain;
       object-fit: contain;
}

.product-spec-grid .desc{
	/*background:#dedede;*/
	position:relative;
    min-height: 300px;
}

.product-spec-grid .desc .contain {
    max-width: 400px;
    width: 80%;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1001;
}

.desc .contain b{
    font-size: 1.5rem;
}

.product-spec-grid .desc .contain p:first-child{
	padding-bottom:0.5rem;
}

.product-spec-grid .desc .contain b::before{
	display: inline-block;
    content: "";
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 9px solid var(--maroon);
	margin-right: 6px;
    vertical-align: inherit;
}

.table-wrapper{
	margin:0 auto;
	/*padding:0px 20px;
	display:table;
	width:-webkit-fill-available;*/
    margin-bottom: 12vh;
    text-align: center;
}

.table-wrapper .table-title{
	width: 100%;
    text-align: center;
    font-size: 1.5rem;
    color: var(--maroon);
    letter-spacing: 1px;
	padding:20px 0px;
}

.table-wrapper img{
    width: 100%;
    max-width: 800px;
    display: block;
    margin: 0 auto;
}

.table-container{
    max-width: 1160px;
    padding: 20px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
}

#search-table-input{
    min-width: 280px;
    max-width: 280px;
    height: 28px;
    margin-bottom: 10px;
    text-align: left;
    border: 1px solid rgba(99, 99, 99, 0.45);
    padding: 4px 20px;
    color: #636363;
    -webkit-appearance: none;
    float: left;
}

#search-result{
    text-align: left;
    font-size: 0.85rem;
    font-style: italic;
    color: grey;
    padding-bottom: 10px;
    min-height: 20px;
}

.table-product-spec-wrap{
    overflow-x: scroll;
}

.table-product-spec{
    width:100%;
    font-size: 0.85rem;
	text-align:left;
	border-collapse: collapse;
    margin: 0 auto;
}

.table-product-spec th{
	padding: 8px;
    background: #1b1b1b;
    color: var(--white);
	letter-spacing: 1px;
}

.table-product-spec tr:nth-child(even){
	background:#e4e4e4;
}

.table-product-spec td{
    padding: 8px;
    vertical-align: middle;
}

.table-product-spec td:nth-child(1),.table-product-spec th:nth-child(1) {
    padding-left: 20px;
}
.table-product-spec td:last-child,.table-product-spec th:last-child {
    padding-right: 20px;
}

.click-to-play-product-video{
    background-image: url(../images/button/click-to-play-btn.svg);
    width: 70px;
    height: 70px;
    background-size:100%;
    background-repeat:no-repeat;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0.6;
    z-index:999;
    cursor:pointer;
}

.click-to-play-product-video:hover{
    zoom:1.25;
    opacity: 1;
}

.popup{
    position: fixed;
    top:0;
    left:0;
    display: flex !important;
    visibility: hidden;
    justify-content: center;
    align-items: center;
    width: 100%;
    height:100%;
    background-color: var(--black);
    opacity: 0;
    z-index: 99999;
    transition:1s all;
    -webkit-transition:1s all;
    -moz-transition:1s all;
    -ms-transition:1s all;
    -o-transition:1s all;
}

.popup.active{
    visibility: visible;
    opacity: 1;
}

.popup video{
    width: 100%;
    max-width: 900px;
    outline:none;
    position: relative;
}

.popup .close{
    position: absolute;
    top:30px;
    right:30px;
    max-width: 20px;
    cursor:pointer;
    filter: invert(1);
    -webkit-filter: invert(1);
}

.industry-solutions{
    background:#e7e7e7;
    padding: 100px 20px 100px 20px;
}

.product-tags{
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
}

.product-tags .header{
    font-size: 1.625rem;
    margin-bottom: 20px;
}

.product-tags .header span{
    color: #981212;
    font-family: amcap_eternalregular;
}

.product-tags-desc{
	margin-top: 40px;
}

.product-tags-desc p{
	margin:0 auto;
	font-size: 1.25rem;
}

.product-tags-desc a{
	display: block;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    height: 38px;
    padding: 0.75rem 2rem;
    margin: 0 auto;
    border: 1px solid var(--black);
    border-radius: 4px;
    line-height: 38px;
    margin-top: 2rem;
    cursor: pointer;
    color: var(--black);
}

.product-tags-desc a:hover{
	border: 1px solid #981212;
	color: #981212;
}

.product-tags-wrap{
    display: flex;
    flex-flow: row wrap;
	margin-top: 30px;
    margin-left: -0.4375rem;
    margin-right: -0.4375rem;
    /* justify-content: center; */
}

.product-tags-container{
    flex: 0 0 auto;
    width: calc(20% - 1.625rem);
    margin-left: 0.8125rem;
    margin-right: 0.8125rem;
    margin-top: 0.8125rem;
    margin-bottom: 0.8125rem;
}

.product-tags-container a{
    cursor: default;
    pointer-events: none;
}

.product-tags-container .box {
    display: inline-block;
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 110px;
    overflow: hidden;
    border-radius: 8px;
}

.box.palm-oil-mill{
    background-image: url(../images/industy-solutions/palm-oil-mill.jpg);
}

.box.agriculture{
    background-image: url(../images/industy-solutions/agriculture-farm-rice-mill.jpg);
}

.box.quarry-mining{
    background-image: url(../images/industy-solutions/quarry-mining.jpg);
}

.box.construction{
    background-image: url(../images/industy-solutions/construction.jpg);
}

.box.earthworks{
    background-image: url(../images/industy-solutions/earthworks.jpg);
}

.box.batching-plant{
    background-image: url(../images/industy-solutions/batching-plant.jpg);
}

.box.waste-solutions{
    background-image: url(../images/industy-solutions/waste-solutions.jpg);
}

.box.hardware{
    background-image: url(../images/industy-solutions/hardware.jpg);
}

.box.material-handling{
    background-image: url(../images/industy-solutions/material-handling.jpg);
}

.box.government{
    background-image: url(../images/industy-solutions/government.jpg);
}

.product-tags-container .title {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: rgba(42,50,56,0.45);
    color: var(--white);
    /* line-height: 110px; */
}

/* Tick for Best for Industry Solutions */
/* .title.suit::after{
    content: '';
    background-image: url(../images/icon/tick.svg);
    background-size: 16px 16px;
    height: 16px;
    width: 16px;
    margin-left: 3px;
    margin-top: -3px;
} */

/* .product-tags-container a:hover .title {
    text-decoration: underline;
} */

/* NEW EQUIPMENT PRODUCTS PAGE END */

/* SERVICE PAGE START */
.service{
    height: 100%;
    width: 100%;
    position: relative;
    scroll-snap-align: start;
    background-size: cover;
    background-position:center center;
}

.service.after-sales-care{
    background-image: url("../images/services/kinhock-after-sales-care.jpg");
}

.service.training{
    background-image: url("../images/services/kinhock-training.jpg");
}

.service.maintenance-support{
    background-image: url("../images/services/kinhock-maintenance-support.jpg");
}

.service .action-btn{
    height: 38px;
    padding: 0.75rem 25px 0.75rem 45px;
    border: 1px solid var(--white);
    border-radius: 4px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 215px;
    text-align: center;
    line-height: 38px;
    color: var(--white);
    background: url(../images/icon/call-white.svg) no-repeat;
    background-position: 15px center;
}

.service .action-btn::before {
    content: "";
    padding-left: 10px;
}

.service .action-btn:hover{
    cursor: pointer;
    background-color: var(--white);
    color: var(--black);
    background: url(../images/icon/call-black.svg) no-repeat #f1f1f1;
    background-position: 15px center;
}

.service.custom-made-parts{
    background-image: url("../images/services/kinhock-custom-made-parts.jpg");
}

.service.multi-purpose-depot{
    background-image: url("../images/services/kinhock-multi-purpose-depot.jpg");
}

.service .overlay{
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom,rgb(0 0 0 / 15%) 0.25%,rgb(0 0 0 / 90%) 89%);
}

.main-wrapper .nav-overlay{
    display: none;
    opacity: 0;
    position: absolute;
    width: 100%;
    height: calc(100% - 98px);
    background: linear-gradient(to left,rgba(0,0,0,0) 4%,rgb(0 0 0 / 90%) 89%);
    z-index: 999;
}

.main-wrapper .nav-overlay.active{
    display: block;
    opacity: 1;
}

.service .content{
    width: 88%;
    max-width: 1080px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: var(--white);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding:20px;
}

.service .content .title{
    font-size: 6vw;
    font-family: amcap_eternalregular;
    padding-bottom: 1rem;
}

.service .content .desc{
    letter-spacing: 1px;
    text-align: justify;
    line-height: 1.4rem;
}

.service .content a{
    margin-top: 20px;
}

.service .desc p{
    padding:1rem 0;
}

.service.multi-purpose-depot .desc p{
    padding:0;
    text-align: center;
}

.service.multi-purpose-depot a{
    display: block;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    height: 38px;
    padding: 0.75rem 2rem;
    margin: 0 auto;
    border: 1px solid var(--white);
    border-radius: 4px;
    line-height: 38px;
    margin-top: 1rem;
    cursor: pointer;
    color: var(--white);
}

.service.multi-purpose-depot a:hover{
    text-decoration: underline;
}

.service-showcase-navigation{
    height: calc(100% - 98px);
    position: absolute;
    z-index: 999;
    display: flex;
}

.service-showcase-navigation ul{
    width: 10px;
    height: 200px;
    align-self: center;
    display: grid;
    align-items: center;
}

.service-showcase-navigation ul > li{
    width: 1px;
    height: 28px;
    margin-left: 0.75rem;
    background: #969696;
    cursor: pointer;
}

.service-showcase-navigation ul > li.active{
    width: 4px;
}

.service-showcase-navigation ul > li > .indicator{
    width: 36px;
    height: 28px;
    align-self: center;
    margin:0 auto;
    position: absolute;
    left:0;
}

.service-showcase-navigation ul > li > .label{
    display: none;
    align-self: center;
    white-space: nowrap;
    margin: 0 auto;
    line-height: 28px;
    height: 28px;
    padding: 0px 12px;
    color: #ffffffc7;
    font-size: 0.75rem;
    letter-spacing: 0.5px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    margin-left: 4px;
}

/* .service-showcase-navigation ul > li > .label.active{
    display: block;
} */

/* SERVICE PAGE END */

/* NEW EQUIPMENT PAGE START */
.equip-brief-container{
    width: 100%;
    height: 337.5px;
    margin-bottom: 100px;
}

.equip-brief-container .image{
    float: left;
    width: 50%;
    height: 100%;
    /* background-image: url(../images/new-equipment/wheel-loader/new-wheel-loader-back.jpg); */
    background-size: cover;
    background-position: 50% 80%;
    /* z-index: -2; */
    position: relative;
    display: flex;
}

.equip-brief-container .image img{
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}

/* .equip-brief-container .image-2{
    height: 100%;
    background-image: url(../images/new-equipment/wheel-loader/new-wheel-loader-front.png);
    background-size: cover;
    background-position: 50% 80%;
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 1;
}

.equip-brief-container .overlay-title{
    position: absolute;
    font-size: 4.5vw;
    font-family: 'amcap_eternalregular';
    color: #ffffff5c;
    padding: 0 20px 40px 20px;
    left: 0;
    right: 0;
    overflow: hidden;
    z-index: 0;
    background: #0051e42e;
    height: calc(100% - 40px);
    display: flex;
    align-items: center;
    white-space: nowrap;
    justify-content: center;
} */

.equip-brief-container .desc{
    float: right;
    width: calc(50% - 60px);
    height: calc(100% - 40px);
    /* background: var(--white); */
    padding: 20px 20px 20px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    line-height: 1.4rem;
}

.equip-list-nav, .equip-list-container{
    max-width: 1200px;
    margin:0 auto;
}

.equip-list-nav{
    padding: 20px;
    background: #e4e4e4;
    display: flex;
    color: #747474;
    border-left: 10px solid var(--black);
}

.equip-list-nav.used{
    background: none;
    border-left: none;
    margin-top: 30px;
}

.equip-list-nav .separator{
    border: solid #747474;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
    margin: 0px 15px 0px 10px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.equip-list-nav nav{
    line-height: 150%;
}

.equip-list-nav nav ol{
    list-style: none;
}

.equip-list-nav nav ol li{
    display: block;
    float: left;
}

.equip-list-nav a{
    color: #747474;
}

.equip-list-nav a:hover{
    color: var(--black);
}

.equip-list-container .filter{
    row-gap: 0.5rem !important;
}

.equip-list-container .filter,
.equip-list-container .items {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    -moz-column-gap: 1rem;
         column-gap: 1rem;
    row-gap: 2rem;
    padding: 20px;
}

.equip-list-container .filter select {
    min-width: 150px;
    padding: 12px 18px;
    background: var(--white);
    border: 1px solid #bdbdbd;
    border-radius: 36px;
    -webkit-border-radius: 36px;
    cursor: pointer;
    background: url(../images/button/drop-down-btn.svg) no-repeat #f2f2f2;
    background-position: right center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: #000;
}

.equip-list-container .items {
    margin-bottom: 150px;
}

.equip-list-container .items .products{
    display: flex;
    flex-direction: column;
    
    border-radius: 12px;
}

.equip-list-container .items .products:hover .title{
    background: var(--black) !important;
    color:var(--white);
}

.equip-list-container .items .products:hover{
    box-shadow: 2px 4px 6px #e4e4e4;
}

.equip-list-container .grid-2col{
    border:1px solid #e4e4e4;
}

.equip-list-container .items .products .title,
.equip-list-container .items .products .image{
    padding:20px;
}

.equip-list-container .items .products .spec {
    padding: 0px 20px 10px 20px;
}

.equip-list-container .items .products .image.used{
    position: relative;
}

.equip-list-container .items .products .image.used .brand{
    width: 100px;
    height: 40px;
    position: absolute;
    right: 0;
    bottom: 0;
    text-align: right;
    border-bottom: 1px solid #e4e4e4;
}

.equip-list-container .items .products a{
    color:var(--black);
}

.equip-list-container .items .products .title{
    font-weight:bold;
    letter-spacing: 0.5px;
    background: #e4e4e4;
    border-radius: 11px 11px 0px 0px;
    display: block;
    word-break: break-all;
}

/* .equip-list-container .items .products .title.used{
    background: #4c3321;
    color: var(--white);
} */

.equip-list-container #noresults{
    display: none;
    font-size: 1.25rem;
    text-align: center;
    margin: 50px 0px;
}

.equip-list-container #noresults #clear-filters{
    font-size: 1rem;
    text-decoration: underline;
    cursor: pointer;
}

.equip-list-container .image{
    display: flex;
    justify-content: center;
}

.equip-list-container .image img{
    height: auto;
    max-width: 100%;
    align-self: flex-start;
}

.equip-list-container .spec{
    font-size: 0.85rem;
}

.equip-list-container .spec td{
    padding-top:8px;
}

.equip-list-container .spec td b{
    letter-spacing: 0.5px;
    white-space: nowrap;
}
/* NEW EQUIPMENT PAGE END */

/* GENSET PAGE START */
.genset-type-wrap{
    max-width:1200px;
    margin:0 auto;
    padding-top:60px;
    padding-bottom: 60px;
}

.genset-desc-wrap{
    padding: 20px;
}

.genset-desc-wrap h2{
    font-family: 'amcap_eternalregular';
    color: #1b5091;
    font-size: 2.5rem;
    line-height: 2.5rem;
}

.genset-wrapper{
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.genset-container{
    display: flex;
    background: #00316c;
}

.genset-container img{
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
}

.genset-container.features{
    align-items: center;
    padding:20px;
    position: relative;
    background: #002450;
}

/* .genset-container.features::after {
    content: "OPEN TYPE";
    font-family: 'amcap_eternalregular';
    color: #1b5091;
    font-size: 70px;
    position: absolute;
    right: -100px;
    z-index: 1000;
    transform: rotate(90deg);
} */

/* .genset-container.features .wrap{
    z-index: 1001;
} */

.genset-container .title{
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
    margin-left: 18px;
    color: #5ba6ff;
}

.genset-container ol{
    margin-left: 35px;
    color: #b6c0cd;
}

.genset-container ol > li{
    line-height: 1.8rem;
}

.main-wrapper.cummins{
    background: #b30000;
    background-image: url(../images/new-equipment/power-generator/Cummins-Network.jpg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.genset-desc-wrap.products{
    background: #ab0000e6;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding:40px;
}

.genset-desc-wrap.products .header-image-box{
    display: flex;
}

.genset-desc-wrap.products img{
    width: 200px;
}

.genset-desc-wrap.products h2, .genset-desc-wrap.products p{
    color: var(--white);
}

.cummins-genset-selection{
    text-align: center;
    margin-bottom: 60px;
}

.cummins-genset-selection img{
    width:100%;
    max-width:1200px;
}
/* GENSET PAGE END */

/* ATTACHMENTS PAGE START */
.attachments-wrapper{
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: 60px;
    -moz-column-gap: 20px;
         column-gap: 20px;
}

.attachments-wrapper .container{
    display: flex;
    align-items: center;
}

.attachments-wrapper .img-wrap{
    position: relative;
}

.attachments-wrapper .numbering{
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: #d700009c;
    text-align: center;
    border-radius: 50%;
    position: absolute;
    left: 20px;
    top: 20px;
    color: #f1f1f1;
}

.attachments-wrapper img{
    width: 100%;
    height: 100%;
    -o-object-fit: scale-down;
       object-fit: scale-down;
}

.attachments-wrapper .desc{
    padding: 20px;
}

.attachments-wrapper p{
    font-size: 1.25rem;
}

.attachments-wrapper .title{
    font-size: 2.5rem;
    font-family: 'amcap_eternalregular';
    line-height: 110%;
    padding-bottom: 5px;
    position: relative;
}

.attachments-wrapper .title::before{
    content: "";
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 4rem;
    height: 4px;
    background: #ae3129;
}

.product-action-wrap{
    padding: 50px 20px 100px 20px;
    text-align: center;
}

.product-action-wrap h2{
    font-size: 2rem;
}

.product-action-wrap label a{
    color: var(--black);
    font-weight: bold;
}

.product-action-wrap label a:hover{
    text-decoration: underline;
}

.product-content.new{
    padding: 0px 0px 30px 0px !important;
    margin-top: 30px;
    margin-bottom: 55px;
    border-bottom: 1px solid #c7c7c7;
}


/* ATTACHMENTS PAGE END */

/* CONTACT PAGE START */
.contact-us .overlay{
    background: linear-gradient(to bottom,rgba(0,0,0,0) 4%,rgb(0 0 0 / 53%) 89%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.contact-us .header-bg{
    height: 330px;
    width: 100%;
    background-image: url(../images/contact-us/kinhock-malaysia-heavy-equipment-distributor-contact-bg-long.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: 50%;
    position: relative;
}

.contact-us .title span{
    font-size: 3rem;
    font-family: amcap_eternalregular;
    height: 100%;
    max-height: 290px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
}

.contact-us .title label{
    /* color: var(--white); */
    height: 188px;
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    font-size: 1rem;
    padding: 0px 20px;
    align-items: flex-end;
    text-align: center;
}

.contact-container{
    max-width: 1200px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    margin:0 auto;
    padding: 100px 0px;
    row-gap: 100px;
}

.factory-contact{order:4;}
.factory-map{order:3;}


.HQ-contact, .factory-contact{
    padding:20px;
    text-align: center;
    margin-bottom: 20px;
}

.HQ-contact h4, .factory-contact h4{
    width: 150px;
    margin: 0 auto;
    border: 1px solid #b7b7b7;
    padding: 5px;
    letter-spacing: 1px;
}

.contact-container table{
    text-align: left;
    margin:0 auto;
}

.contact-container table td:nth-child(1) {
    padding-right: 8px;
}

.contact-us p{
    max-width: none;
}

.contact-container .call, .contact-container .fax{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.contact-container .call a, .contact-container .fax a{
    color:var(--black);
}

.contact-container .call a:hover{
    color: #981212;
}

/* .contact-container .call a:first-child::after{
    content: " (Hotline)";
}

.contact-container .call a:last-child::after{
    content: " (Customer Service)";
}

.contact-container .call a:hover::after{
    content: " (Call now)";
} */

.google-map {
    border: 0;
    width: 100%;
    /* width: calc(100% - 40px); */
    /* margin: 0px 20px; */
}

.form-control.has-error {
    border: 2px solid #e10808 !important;
}

.help-block{
    display: none;
    color: var(--error);
    text-align: right;
    padding-right: 8px;
}

.help-block.robot{
    text-align: center !important;
}

.contact-us .form-container{
    margin: 0 auto;
    display: flex;
    justify-content: center;
    text-align: center;
    padding: 40px 20px;
    flex-direction: column;
    align-items: center;
    border-top: 1px solid #e3e3e3;
}

.contact-us .form-container .title{
    font-size: 3rem;
    font-weight: bold;
}

.contact-us form{
    margin: 20px 0px 20px 0px;
}

.contact-us form .group-1{
    display: grid;
    grid-template-columns: 1fr 1fr;
    -moz-column-gap: 10px;
         column-gap: 10px;
}

.contact-us form .group-2{
    width: 662px;
}

.contact-us form #company, .contact-us form #address, .contact-us form #subject, .contact-us form #message{
    width: calc(100% - 46px);
}

.contact-us form #message{
    resize:vertical;
    height: 300px;
}

.contact-us .form-group{
    margin-bottom: 1.8rem;
}

.contact-us .form-control{
    /* width: calc(100% - 44px); */
    /* width: 90%; */
    min-width: 280px;
    height: 28px;
    text-align: left;
    border: 1px solid rgba(99, 99, 99, 0.45);
    padding: 10px 22px;
    letter-spacing: 1px;
    color: #636363;
    -webkit-appearance: none;
}

.contact-us form select{
    background: url(../images/button/drop-down-btn.svg), #fff;
    background-repeat: no-repeat;
    background-position-y: center;
    background-position-x: right;
}

.g-recaptcha div{
    margin-left: auto;
    margin-right: auto;
}


.btn-submit-enquiries{
    font-size: 1.25rem !important;
    padding: 1.25rem 7rem;
    cursor: pointer;
    background: #ffcc00;
    border: none;
    border-bottom: 2px solid transparent;
}

.btn-submit-enquiries:hover{
    text-decoration: underline;
}

#contact-form{
    border: 1px solid #EEEEEE;
    box-shadow: 0px 0px 20px 0px rgb(182 101 252 / 7%);
    padding: 36px 19px 40px 19px;
    border-radius: 8px;
    background: #f7f7f7;
}
/* CONTACT PAGE END */

/* NEW EQUIPMENT PAGE START */
.new-equip .wheel-loader{
    background: url(../images/new-equipment/wheel-loader/new-wheel-loader-category.png);
    justify-items: start;
}

/* .new-equip .backhoe-loader{
    background: url(../images/new-equipment/backhoe-loader/new-backhoe-loader-category.png), #d2d2d2;
    justify-items: end;
} */

.new-equip .compactor{
    background: url(../images/new-equipment/compactor/new-compactor-category.png);
    justify-items: start;
}

.new-equip .motor-grader{
    background: url(../images/new-equipment/motor-grader/new-motor-grader-category.png);
    justify-items: end;
}

.new-equip .bulldozer{
    background: url(../images/new-equipment/bulldozer/new-bulldozer-category.png);
    justify-items: start;
}

.new-equip .dump-truck{
    background: url(../images/new-equipment/dump-truck/new-dump-truck-category.png), #d2d2d2;
    justify-items: end;
}

.new-equip .wheel-excavator{
    background: url(../images/new-equipment/wheel-excavator/new-wheel-excavator-category.png);
    justify-items: start;
}

.new-equip .power-generator{
    background: url(../images/new-equipment/power-generator/new-power-generator-category.png), #d2d2d2;
    justify-items: end;
}

.new-equip .trailer-concrete-pump{
    background: url(../images/new-equipment/trailer-concrete-pump/new-trailer-concrete-pump-category.png);
    justify-items: start;
}

.new-equip .attachments{
    background: url(../images/new-equipment/attachments-and-work-tools/new-attachments-and-work-tools-category.jpg);
    justify-items: end;
}

.new-equip .container{
    position: relative;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    height: 40vw;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
}

/* .new-equip .container:hover {
    border: 4px solid #ffcc00;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
} */

.new-equip-wrap{
    padding: 20px 40px;
    transition: all 1s;
}

.new-equip-wrap > div:first-child{
    margin-bottom: 5px;
}

.new-equip-wrap span{
    background: #ed0000;
    padding: 1px 12px;
    color: var(--white);
}

.new-equip-wrap .title{
    font-family: 'amcap_eternalregular';
    font-size: 3.5vw;
    /* white-space: nowrap; */
}

.new-equip-wrap .desc{
    margin-top: 0.5vw;
    margin-bottom: 1.5vw;
    max-width: 34ch;
    font-size: 1.65vw;
}

.new-equip-wrap .new-equip-browse{
    background: var(--black);
    color: var(--white);
    padding: 10px 28px;
    float: left;
    font-size: 1.5vw;
    font-weight: bold;
    letter-spacing: 1px;
    cursor: pointer;
}

.new-equip-wrap .new-equip-browse a{
    color:var(--white)
}

.new-equip-wrap .new-equip-browse:hover{
    background: #c50000;
}

.new-equip-wrap .desc img{
    height: 25px;
    vertical-align: middle;
    padding: 3px 0px;
}
/* NEW EQUIPMENT PAGE END */

/* USED EQUIPMENT PAGE START */
.used-equip{
    background-color: #1b1b1b;
}

.cover-section{
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: center;
}

.cover-section .content{
    z-index: 999;
    color: var(--white);
    position: absolute;
    display: flex;
    padding: 20px;
    height: calc(100% - 40px);
    flex-direction: column;
    justify-content: center;
    left: 6vw;
    right: 6vw;
    top: -4vw;
}

.cover-section .title{
    font-family: 'amcap_eternalregular';
    font-size: 5vw;
    line-height: 5vw;
    margin-bottom: 1rem;
}

.cover-section .content p{
    font-size: 1.25rem;
}

.cover-section .overlay{
    z-index: 998;
    background: linear-gradient(to bottom,rgb(113 83 51 / 10%) 4%,rgb(0 0 0 / 69%) 89%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.cover-section img{
    /* transform: scale(1.1); */
    width: 100%;
    min-height: 450px;
    max-height: 600px;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: 10% 50%;
       object-position: 10% 50%;
    /* transform-origin: 50 50; */
    /* transition: transform 25s, visibility 25s ease-in; */
}

/* .cover-section img:hover{
    transform: scale(1);
} */

.cover-section .content a{
    color: var(--white);
    border-bottom: 1px dashed var(--white);
}

.cover-section .content a:hover
{
    border-bottom: 1px dotted var(--white);
}

/* .search-section{
    background-color: var(--black);
    padding: 40px;
}

.search-section .filter span{
    color: #838383;
} */

.category-section{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 10px;
    justify-content: space-between;
    margin-top: 10px;
}

.used-mac-type{
    width:100%;
    height: 100vh;
    overflow: hidden;
    transition: all 1s;
    opacity: 0.85;
    background-size: cover;
    -webkit-filter: grayscale(1);
            filter: grayscale(1);
}

.used-mac-type:hover{
    opacity: 1;
    -webkit-filter: none;
            filter: none;
}

.used-mac-type .container{
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 20px;
    justify-content: center;
    padding: 40px;
    height: calc(100% - 80px);
    margin: 0 auto;
    text-align: center;
    color:var(--white);
}

.used-mac-type.wheel-loader{
    background-position: 70% center;
    background-image: url(../images/used-equipment/used-wheel-loader-category.jpg);
}

.used-mac-type.excavator{
    background-position: 100% center;
    background-image: url(../images/used-equipment/used-excavator-category.jpg);
}

.used-mac-type.forklift{
    background-position: 70% 100%;
    background-image: url(../images/used-equipment/used-forklift-category.jpg);
}

.used-mac-type.bulldozer{
    background-position: 80% center;
    background-image: url(../images/used-equipment/used-bulldozer-category.jpg);
}

.used-mac-type.backhoe-loader{
    background-position: 100% 0%;
    background-image: url(../images/used-equipment/used-backhoe-loader-category.jpg);
}

.used-mac-type.attachments{
    background-position: 60% 0%;
    background-image: url(../images/used-equipment/used-attachments-category.jpg);
}

.used-mac-type .title span{
    /* border: 1px solid var(--white);
    padding: 1px 12px;
    color: var(--white);
    font-size: 1rem; */
    padding: 1px 12px;
    color: var(--white);
    font-size: 1rem;
    position: absolute;
    top: 8px;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.used-mac-type .title{
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.used-mac-type .used-equip-browse{
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.used-mac-type h3{
    min-height: 140px;
    padding: 10px 0px 20px 0px;
    display: flex;
    align-items: center;
    font-family: 'amcap_eternalregular';
    font-size: 2.5rem;
    line-height: 2.5rem;
    letter-spacing: 1px;
    position: relative;
}

.used-mac-type .used-equip-browse a{
    font-size: 1.25rem;
    color: var(--white);
    border: 1px solid var(--white);
    padding: 12px 88px 12px 60px;
    border-radius: 34px;
    transition: 0.3s all;
    position: relative;
}

.used-mac-type .used-equip-browse a:hover {
    background-color: var(--white);
    color: #60341a;
}

.used-mac-type .used-equip-browse a:hover span::after {
    padding-left: 23px;
}

.used-mac-type .used-equip-browse span::after{
    content: '\00BB';
    position: absolute;
    padding-left: 13px;
    font-size: 2rem;
    line-height: 1.43rem;
    height: 48px;
    top: 0;
    line-height: 48px;
}

.used-equip-header{
    padding: 50px 40px;
    color: #666666;
}

.used-equip-header p{
    font-size: 1.25rem;
    max-width: unset;
}

/* USED EQUIPMENT PAGE END */

/* USED EQUIPMENT PRODUCT BRIEFING PAGE START */
.product-briefing{
    display: grid;
    grid-template-columns: 1fr 1fr;
    -moz-column-gap: 50px;
         column-gap: 50px;
}

.product-content span{
    display: inline-block;
    text-align: center;
    border-radius: 2px;
    font-size: 1rem;
}

span#Available{
    color: #22b535;
}
span#Sold-Out{
    color: #e70c0c;
}

.product-content{
    padding-right: 20px;
}

.product-button{
    margin-bottom: 8px;
}

.product-status{
    margin-bottom: 5px;
}

.product-title, .product-traffic{
    margin-bottom: 20px;
}

.product-content .whatsapp, .product-content .quote{
    text-align: left;
    font-size: 1.25rem;
    width: 200px;
    padding:12px 24px;
    font-weight: bold;
    position: relative;
    border-left: 4px solid #1b1b1b;
    transition: .3s;
}

.product-content .whatsapp{
    background-color: #47c757;
    color:var(--white);
}

.product-content .whatsapp::after, .product-content .quote::after{
    content: "";
    height: 25px;
    width: 25px;
    background-size: 25px 25px;
    background-repeat: no-repeat;
    display: inline-block;
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%);
}

.product-content .whatsapp::after{
    background-image: url(../images/icon/whatsapp.svg);
}

.product-content .quote{
    background-color: #ffcc00;
    color: #273846;
}

.product-content .quote::after{
    background-image: url(../images/icon/email.svg);
}

.product-content .whatsapp:hover, .product-content .quote:hover {
    box-shadow: 0 0 8px rgb(33 33 33 / 30%);
}

.hire-purchase-rate{
    width: 100%;
    display: grid;
    grid-template-columns: 38px 1fr;
    -moz-column-gap: 10px;
         column-gap: 10px;
    align-items: center;
    margin-top: 30px;
}

.hire-purchase-rate .icon{
    background: url("../images/icon/hire-purchase-rate-icon.svg");
    background-size: 38px 38px;
    background-repeat: no-repeat;
    width: 38px;
    height: 38px;
}

.hire-purchase-rate label{
    font-size: 0.85rem;
    color: rgb(0 0 0 / 45%);
}

.py-5{ /* product gallery slider */
    max-width: 575px;
    padding-left: 20px;
}

.product-thumbs .swiper-slide img {
    border:2px solid transparent;
    -o-object-fit: cover;
       object-fit: cover;
    cursor: pointer;
}

.product-thumbs .swiper-slide-active img {
    border-color: #bc4f38;
}

.product-slider .swiper-button-next::after,
.product-slider .swiper-button-prev::after {
    font-size: 20px;
    color: #000;
    font-weight: bold;
}

.img-fluid{
    width: 100%;
    box-sizing: border-box;
}

.product-details{
    border-top: 1px solid #0000001c;
    margin-top: 50px;
    padding: 20px 20px 0px 20px;
}

.product-details table{
    text-align: left;
}

.product-details table h3{
    font-size: 1.25rem;
    padding-top: 1.25rem;
    padding-bottom: 0.825rem;
    position: relative;
    margin-bottom: 5px;
    text-transform: capitalize;
}

.product-details table h3::before {
    content: "";
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 3rem;
    height: 4px;
    background: #ffcc00;
}

.product-details table td{
    padding: 0.3rem 0px;
}

.product-details table td:first-child{
    padding-right: 60px;
    color: rgba(0,0,0,.4);
}

.product-details table td > ul > li{
    list-style-type: square;
    margin-left: 1em;
    padding:0.3rem 0px;
}

.separator-line {
    background: url(../images/icon/texture2.png) #fff repeat;
    width: 100%;
    height: 4px;
    margin-top: 80px;
}

.browse-product-link{
    margin-top: 5px;
    margin-left: 20px;
    color: #273846;
    text-transform: uppercase;
    border: 1px solid #273846;
    border-radius: 5px;
    font-size: 13.99px;
    display: inline-block;
    padding: 12.5px 21px;
}

.browse-product-link:hover{
    text-decoration: underline;
}

.recommendations-header{
    font-size: 1.25rem;
    padding: 0px 20px;
    margin-top: 60px;
}

.social-share-button{
    margin-top: 20px;
    display: inline-block;
}

.share-btn{
    float: left;
    padding: 8px 16px;
    border-radius: 3px;
    color: #fff;
    font-size: 14px;
    line-height: 14px;
    vertical-align: middle;
    background: #3b5998;
}

.share-btn:hover{
    box-shadow: 0 0 8px rgb(33 33 33 / 30%);
}

.share-btn i{
    margin-right: 5px;
    display: inline-block;
    font-size: 18px;
    vertical-align: middle;
}

.ion-social-facebook::before{
    content: "f";
    font-style: normal;
    font-size: 18px;
    font-weight: bold;
}
/* USED EQUIPMENT PRODUCT BRIEFING PAGE END */

/* flickity Horizontal Carousel START */
.gallery {
    background: #f5f5f7;
    margin: 30px 20px 150px 20px;
}

.gallery-cell {
    width: 380px;
    height: 220px;
    margin-right: 10px;
    counter-increment: gallery-cell;
    border: 1px solid #0000001c;
}

.gallery-cell a{
    color: var(--black);
}

/* cell number */
.gallery-cell::before {
    display: none;
}

.gallery-cell:hover .carousel-title{
    background: var(--black);
}

.gallery-cell:hover{
    box-shadow: 0 0 11px rgb(33 33 33 / 20%);
}

.recommend-carousel{
    position: absolute;
    top:0;
    width: 100%;
    height: 100%;
}

.carousel-title{
    height: 30px;
    line-height: 30px;
    background: #4c3321;
    color: var(--white);
    padding: 10px 20px;
    font-weight: bold;
}

.carousel-wrap{
    width: 100%;
    height: 170px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    -moz-column-gap: 1rem;
         column-gap: 1rem;
}

.carousel-image{
    position: relative;
}

.carousel-image img{
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}

.carousel-image span.brand{
    width: 80px;
    height: 32px;
    position: absolute;
    right: 0;
    bottom: 0;
    text-align: right;
    border-bottom: 1px solid #e4e4e4;
}

.carousel-specs{
    padding:10px;
    font-size: 0.85rem;
}

.carousel-specs td{
    padding-top: 2px;
}

@media (max-width:445px) {
    .gallery-cell{
        width: 100% !important;
    }
    .carousel-wrap{
        -moz-column-gap: 0.5rem;
             column-gap: 0.5rem;
    }
}
/* flickity Horizontal Carousel END */

/* BOTTOM ALERT BOX START */
.alertbox{
    display:none;
    padding-top: 20px;
    opacity: 0.9;
}

.alertbox img{
    top: 0.3rem;
    position: relative;
    width: 25px;
    height: 25px;
}
/* BOTTOM ALERT BOX END */

/* MULTI-PURPOSE DEPOT PAGE START */
#full-width-video-depot{
    width:100%;
    height: 100%;
    max-height: 1080px;
}

.depot-contact-wrap a{
    color: #b1b1b1;
}

.depot-contact-wrap a:hover {
    color: #a99563;
}

.depot-contact-wrap .content{
    font-size: 0.85rem;
    display: flex;
    flex-wrap: wrap;
    -moz-column-gap: 5px;
         column-gap: 5px;
    padding: 0px 40px 0px 6vw;
}

.depot-contact-wrap .location, .depot-contact-wrap .call, .depot-contact-wrap .email{
    float: left;
    line-height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.depot-contact-wrap .location, .depot-contact-wrap .call{
    margin-right: 20px;
}

.depot-contact-wrap img{
    margin-right: 8px;
}

.depot-about-wrap{
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    -moz-column-gap: 80px;
         column-gap: 80px;
    align-items: center;
    padding-bottom: 70px;
    padding-top:70px;
    border-top: 1px solid #a9956385;
}

.depot-about-wrap .about{
    padding-left: 80px;
}

.depot-about-wrap h1{
    padding-top: 5px;
    padding-bottom: 20px;
    font-family: 'amcap_eternalregular';
    font-size: 3rem;
    line-height: 3rem;
}

.depot-about-wrap h1, .depot-about-wrap h2{
    color: #a99563;
    text-transform: uppercase;
}

.depot-about-wrap p{
    max-width: 75ch;
    text-align: justify;
    line-height: 1.5rem;
}

.depot-about-wrap .about span.title{
    color: #a99563;
    font-size: 1rem;
}

.depot-about-wrap .about span{
    font-size: 1.25rem;
}

.depot-lot-wrap{
    max-width: 1200px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: 0 auto;
}

.depot-lot-wrap .wrap-1{
    display: grid;
    grid-template-columns: 1fr 1fr;
    -moz-column-gap: 40px;
         column-gap: 40px;
    padding: 40px;
    align-items: center;
}

.depot-lot-wrap .wrap-1 > div{
    display: flex;
    align-items: center;
    -moz-column-gap: 20px;
         column-gap: 20px;
    flex-direction: column-reverse;
    text-align: center;
}

.depot-lot-wrap .wrap-2{
    border-left: 1px solid #a9956385;
    padding: 40px;
    display: flex;
    align-items: center;
}

.depot-lot-wrap .icon{
    width: 120px;
    height: 40px;
}

.depot-lot-wrap ul li:first-child{
    font-size: 2.5rem;
    font-family: Impact;
}

.depot-lot-wrap ul li:nth-child(2){
    font-size: 0.85rem;
}

.depot-lot-wrap .single-lot{
    color:#a99563;
}

.depot-lot-wrap ul li span{
    font-size: 1.5rem;
}

.depot-lot-wrap .total-space{
    background: url("../images/icon/lot-bronze.svg");
    background-size: 120px;
    background-repeat: no-repeat;
}

.depot-lot-wrap .available-space{
    background: url("../images/icon/lot-available-bronze.svg");
    background-size: 120px;
    background-repeat: no-repeat;
}

.depot-map{
    background: #26262c;
}

.depot-key-wrap .title-wrap{
    width: 100%;
    border-bottom: 1px solid #a9956385;
    margin-bottom: 60px;
    background: #2c2c32;
}

.depot-key-wrap .title{
    font-size: 3rem;
    font-family: Impact;
    color: #b1b1b1;
    text-align: center;
    padding:40px 20px;
    margin: 0 auto;
    position: relative;
    max-width: 600px;
}

.depot-key-wrap .title.accessibility{
    border-left: 1px solid #a9956385;
}

.depot-key-wrap .title.facilities{
    border-right: 1px solid #a9956385;
}

.depot-key-wrap .title.suit-for{
    border-left: 1px solid #a9956385;
}

.depot-key-wrap .title::after {
    position: absolute;
    color: #a995631f;
    font-size: 3.5rem;
    top: 20%;
}

.depot-key-wrap .title.accessibility::after {
    content: "Accessibility";
    left: 35%;
}

.depot-key-wrap .title.facilities::after {
    content: "Facilities";
    left: 45%;
}

.depot-key-wrap .title.suit-for::after {
    content: "Suit For";
    left: 40%;
}

.depot-key-wrap .content{
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    justify-items: center;
    padding: 0px 20px 150px 20px;
    -moz-column-gap: 20px;
         column-gap: 20px;
    row-gap: 40px;
}

.depot-key-wrap .icon{
    width: 120px;
    height: 120px;
}

.depot-key-wrap .point{
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 20px;
}

.depot-key-wrap ul li{
    text-align: center;
}

.depot-key-wrap ul li:first-child{
    font-size: 3rem;
    font-family: Impact;
}

.facilities .content{
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.facilities .desc{
    text-align: center;
}

.depot-key-wrap{
    background-size: 120px;
    background-repeat: no-repeat;
}

/* Accessibility */
.depot-key-wrap .ktm{
    background: url("../images/icon/ktm-bronze.svg");
}

.depot-key-wrap .highway{
    background: url("../images/icon/highway-bronze.svg");
}

.depot-key-wrap .town{
    background: url("../images/icon/town-bronze.svg");
}

/* Facilities */
.depot-key-wrap .cctv{
    background: url("../images/icon/cctv-bronze.svg");
}

.depot-key-wrap .lightning{
    background: url("../images/icon/lightning-bronze.svg");
}

.depot-key-wrap .power{
    background: url("../images/icon/power-bronze.svg");
}

.depot-key-wrap .washroom{
    background: url("../images/icon/washroom-bronze.svg");
}

/* Suit For */
.depot-key-wrap .storage{
    background: url("../images/icon/storage-bronze.svg");
}

.depot-key-wrap .parking{
    background: url("../images/icon/parking-bronze.svg");
}

.depot-key-wrap .sport{
    background: url("../images/icon/sport-bronze.svg");
}

.depot-key-wrap .carnival{
    background: url("../images/icon/carnival-bronze.svg");
}

.depot-key-wrap .open-air{
    background: url("../images/icon/open-air-bronze.svg");
}

.depot-key-wrap .training{
    background: url("../images/icon/training-bronze.svg");
}

.depot-project-wrap > .title{
    font-size: 3rem;
    font-family: Impact;
    color: #a99563;
    padding: 40px 20px;
    text-align: center;
    background: #2c2c32;
}

.pass-project-wrap{
    overflow-x: scroll;
    display: inline-flex;
    width: 100%;
    color: var(--white);
}

.pass-project-wrap.scrollable::-webkit-scrollbar {
    height: 8px;
}

.pass-project-wrap.scrollable::-webkit-scrollbar-track {
    background: var(--black);
    border-radius: 10px;
}

.pass-project-wrap.scrollable::-webkit-scrollbar-track-piece {
    border-radius: 10px;
}


.pass-project-wrap.scrollable::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #a99563;
}

.pass-project-wrap.scrollable::-webkit-scrollbar-thumb:hover {
    border: 2px solid var(--black);
}

.pass-project-wrap .box{
    min-width: 390px;
    height: 600px;
    border: 1px solid #26262c;
    position: relative;
}

.pass-project-wrap .box:first-child{
    border-left: none;
}

.pass-project-wrap .box:last-child{
    border-right: none;
}

.pass-project-wrap .number{
    font-size: 1.5rem;
    position: absolute;
    padding:40px 20px;
    letter-spacing: 4px;
}

.pass-project-wrap .year{
    transform: rotate(270deg);
    position: absolute;
    padding: 20px;
    height: 15px;
    line-height: 15px;
    text-align: left;
    font-size: 0.85rem;
    letter-spacing: 1.5px;
    bottom: 43px;
    left: -43px;
    width: 100px;
}

.pass-project-wrap .content{
    margin: 0 auto;
    background: white;
    height: calc(100% - 80px);
    padding: 40px 20px;
    background-position: 50%;
    background-repeat: no-repeat;
}

.pass-project-wrap .content .title{
    font-size: 2rem;
    padding: 70px 0px 10px 0px;
    font-family: Impact;
}

.pass-project-wrap .video-link{
    width: 115px;
    height: 25px;
}

.pass-project-wrap a{
    display: flex;
}

.pass-project-wrap a span{
    color: var(--white);
    line-height: 25px;
    margin-left: 8px;
    white-space: nowrap;
}

.pass-project-wrap a:hover span{
    text-decoration: underline;
}

.pass-project-wrap .exhibition{
    background: url("../images/depot/heavy-machinery-parts-exhibition-at-Kinhock-Multipurpose-depot-land-for-rent-malaysia.jpg");
}

.pass-project-wrap .digi{
    background: url("../images/depot/Digi-Portable-Base-Telecommunication-Station-at-Kinhock-Multipurpose-depot-land-for-rent-malaysia.jpg");
}

.pass-project-wrap .ace{
    background: url("../images/depot/car-drifting-competition-at-Kinhock-Multipurpose-depot-land-for-rent-malaysia.jpg");
    background-position: 100% !important;
}

.pass-project-wrap .shell{
    background: url("../images/depot/Shell-V-Power-event-at-Kinhock-Multipurpose-depot-land-for-rent-malaysia.jpg");
}

.pass-project-wrap .pos{
    background: url("../images/depot/POS-Logistics-outdoor-storage-at-Kinhock-Multipurpose-depot-land-for-rent-malaysia.jpg");
}

.pass-project-wrap .careplus{
    background: url("../images/depot/container-parking-at-Kinhock-Multipurpose-depot-land-for-rent-malaysia.jpg");
}

/* MULTI-PURPOSE DEPOT PAGE END */

/* PARTS PAGE START */
.part-main-title{
    text-align: center;
    color: #cf0000;
    font-weight: bold;
    position: relative;
    background: var(--white-bg);
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 0px 10px;
    margin: 0 auto;
    z-index: 1000;
    font-size: 1.25rem;
}

.divider-line{
    position: absolute;
    border-top: 2px solid #1b1b1b;
    width: 90%;
    left: 0;
    right: 0;
    margin: 0 auto;
    margin-top: -12px;
}

.part-main-wrapper.gd-2{
    margin: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: 25px;
    -moz-column-gap: 30px;
         column-gap: 30px;
}

.part-main-wrapper.gd-2 .cat {
    border-radius: 8px;
    background: rgb(255,255,255);
    background: linear-gradient(-45deg, rgba(255,255,255,1) 42%, rgb(27 27 27) 42%);
    display: grid;
    grid-template-columns: 50% 50%;
}

.gd-2 .left{
    padding:20px;
    flex-direction: column;
    justify-content: space-between;
}

.gd-2 .left .title{
    font-family: Impact;
    letter-spacing: 0.5px;
    font-size: 1.6rem;
    margin-bottom: 10px;
    color:var(--white);
    text-shadow: 0px 1px 3px #1b1b1b;
    z-index: 1000;
}

.gd-2 .shop-now{
    background-color: #cf0000;
    padding: 5px 14px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    border-radius: 6px;
    color: var(--white);
    /* min-width: 64px;*/ /* Shop Now */
    min-width: 41px; /* More >*/
    max-height: 19px;
    font-size: 14px;
    white-space: nowrap;
}

.gd-2 .shop-now::after {
    content: '';
    position: absolute;
    margin-left: 5px;
    margin-top: 5px;
    line-height: 10px;
    width: 0;
    height: 0;
    border-left: 6px solid #fff;
    border-bottom: 4px solid transparent;
    border-top: 4px solid transparent;
    clear: both;
}

.gd-2 a:hover .shop-now{
    background-color: #fff;
    color: #1b1b1b;
}

.gd-2 a:hover .shop-now::after{
    border-left: 6px solid #1b1b1b;
}

.gd-2 .left, .gd-2 .right{
    display: flex;
}

.gd-2 .right{
    align-items: center;
}

.gd-2 .right img{
    /* max-height: 150px; */
    width:100%;
    -webkit-filter: drop-shadow(px 2px 2px #cfcfcf);
    filter: drop-shadow(2px 2px 2px #cfcfcf);
}

.part-main-wrapper.gd-5{
    margin: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    row-gap: 10px;
    -moz-column-gap: 15px;
         column-gap: 15px;
}

.part-main-wrapper.gd-5 .cat{
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 8px;
    min-width: 190px;
}

.gd-5 .top{
    background: #ffffff;
    padding: 20px 0px 0px 0px;
    border-radius: 8px 8px 0px 0px;
    text-align: center;
}

.gd-5 .top img{
    width: 100%;
    max-width: 320px;
    vertical-align: bottom;
}

.gd-5 .bottom{
    background: rgba(255,255,255,1);
    width: calc(100% - 20px);
    padding: 10px;
    border-radius: 0px 0px 8px 8px;
}

.gd-5 .bottom .title{
    font-family: Impact;
    font-size: 1.6rem;
    color: #979797;
    text-align: center;
    white-space: nowrap;
}

.gd-5 .shop-now{
    color: #4d4d4d;
    text-align: center;
    font-size: 14px;
    white-space: nowrap;
    padding: 8px;
}

.gd-5 .shop-now::after {
    content: '';
    position: absolute;
    margin-left: 5px;
    margin-top: 5px;
    line-height: 10px;
    width: 0;
    height: 0;
    border-left: 6px solid #4d4d4d;
    border-bottom: 4px solid transparent;
    border-top: 4px solid transparent;
    clear: both;
}

.gd-5 a:hover .shop-now{
    color: #cf0000;
}

.gd-5 a:hover .shop-now::after{
    border-left: 6px solid #cf0000;
}

.parts-brands{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 20px;
}

.parts-brands div{
    max-height: 50px;
    margin: 5px 10px;
    border-radius: 4px;
    padding: 10px;
}

.parts-brands img{
    height: 50px;
}

.selection.parts:hover{
    cursor: pointer;
    color: var(--black);
}

.popup-selection{
    display: none;
    position: fixed;
    top: 0;
    background: #000000cc;
    width: 100%;
    height: 100%;
    z-index: 1001;
    align-items: center;
    justify-content: center;
}

.popup-selection.active{
    display: flex !important;
}

.popup-selection .wrapper{
    background: var(--white-bg);
    padding: 20px 10px;
    border-radius: 4px;
}

.popup-selection .container{
    position: relative;
}

.popup-selection img.close{
    position: absolute;
    top: -50px;
    left: 0;
    right: 0;
    margin: 0 auto;
    max-width: 20px;
    cursor: pointer;
    filter: invert(1);
    -webkit-filter: invert(1);
}

.popup-selection .title{
    color: #cf0000;
    position: relative;
    z-index: 1000;
    width: calc(100% - 20px);
    text-align: center;
    border-bottom: 1px solid #cf0000;
    padding: 0px 10px 10px 10px;
    font-size: 1.25rem;
}

.selection-wrap{
    display: flex;
}

.selection-wrap .selection div{
    padding: 12px 30px;
    border-bottom: 1px solid #e3e2e2;
    min-height: 33px;
    display: flex;
    align-items: center;
}

.selection-wrap a{
    color: var(--grey);
    position: relative;
}

/* .selection-wrap a:hover{
    text-decoration: underline;
} */

.selection-wrap a:hover::before{
    content: ' →';
    position: absolute;
    line-height: 57px;
    left: 8px;
}

.parts-container{
    padding: 40px;
}

.parts-ul{
    list-style: inside;
}

.parts-ul li{
    line-height: 150%;
    color: var(--grey);
}

.parts-contact{
    color: #cf0000;
    font-size: 2rem;
}

h1.parts{
    position: relative;
}

h1.parts::before {
    content: "";
    position: absolute;
    bottom: -8px;
    left: 0px;
    width: 100%;
    height: 2px;
    background: #cf0000;
}

b.free-quote{
    color: #008500;
    font-size: 1.25rem;
}
/* PARTS PAGE END */

@media (max-width:1200px) {
    /* GENSET PAGE */
    .main-wrapper.cummins{
        background-size: cover;
    }

    .genset-desc-wrap.products{
        margin:0 auto;
    }

    .cummins-genset-selection{
        padding-left: 20px;
        padding-right: 20px;
    }

    /* PARTS PAGE */
    .part-main-wrapper.gd-5{
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }

    /* MAIN PAGE */
    .browse-used-machines{
        border-radius: 0;
    }

    .equip-list-nav{
        background: unset;
    }
}

@media (max-width:1030px) {
    .product-tags-container{
        width: calc(33.33333% - 1.375rem);
        margin-left: 0.6875rem;
        margin-right: 0.6875rem;
    }

    .cover-section .content{
        left: 5vw;
        right: 5vw;
        top: -2vw;
    }

    .cover-section .content p{
        font-size: 1.15rem;
    }
}

@media (min-width:1080px) { /* MORE THAN 1080PX */
    .service .content .title{
        font-size: 4rem;
    }
}

@media (max-width: 1025px){
    .depot-about-wrap .about{
        padding: 20px;
    }

    .depot-about-wrap{
        -moz-column-gap: 40px;
             column-gap: 40px;
    }
}

@media (max-width: 960px){
    /* PARTS PAGE */
    .part-main-wrapper.gd-5{
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media (max-width: 935px){
    .py-5 { /* product gallery slider */
        max-width: 400px;
    }

    /* MULTI-PURPOSE DEPOT PAGE */
    .depot-about-wrap{
        grid-template-columns: 1fr;
        padding-top: 0px;
    }

    .depot-about-wrap .about{
        margin-top:30px;
        margin-bottom:30px;
    }

    .depot-lot-wrap .wrap-1, .depot-lot-wrap .wrap-2{
        padding:40px 20px;
    }
}

@media (max-width:900px) {
    .equip-list-container .filter {
        grid-template-columns: 1fr 1fr;
    }

    .equip-list-container .items {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .main-wrapper.about-us{
        width:calc(100% - 40px);
        padding:100px 20px 100px 20px;
        grid-template-columns: 1fr;
        row-gap: 50px;
        justify-items: center;
        text-align: center;
    }
    
    .who .logo{
        padding-left: 0;
        margin-top: 0;
    }

    .what .office img,
    .where .service-point img,
    .why .service-center img{
        max-width: 400px;
    }

    .main-wrapper.about-us .title label {
        font-size: 2.8rem;
    }

    .main-wrapper.about-us .title{
        font-size: 1.875rem;
    }

    .where{
        order:1;
    }

    .where-info{
        order:2;
    }

    .main-wrapper.mission .mission,
    .main-wrapper.csr .csr{
        grid-template-columns: 1fr;
        row-gap: 30px;
    }

    .main-wrapper.mission .mission div:nth-child(odd),
    .main-wrapper.csr .csr div:nth-child(odd){
        border:0;
    }

    .new-equip-wrap .title{
        font-size: 1.875rem;
    }

    .new-equip-wrap .desc{
        font-size: 1rem;
    }

    .new-equip-wrap .new-equip-browse{
        font-size: 1rem;
    }

    /* Search Page */
    .search-bar{
        width: calc(100% - 32px);
    }
}

@media (max-width:880px) {
	/* MENU */
	.top-wrapper{
		max-width:1200px;
	}
	
	.logo-wrapper{
		left:20px;
	}
	
	.nav{
		right:20px;
	}
	
	.nav > li {
		display: none;
	}
	
	.min-nav-btn {
		display:block;
	}
	
	.slider-title,.slider-desc{
		padding-left:20px;
	}
	
	.slider-product-spec{
		right:20px;
	}
	
	.browse-click{
		width: calc(100% - 5vw);
        padding: 2.5vw;
	}
	
	.browse-click .title{font-size:2.8vw;}
	
	.browse-click .square{
		width:3.5vw;
		height:3.5vw;
	}

    .browse-used-machines-key{
        font-size: 2rem;
    }
	
	.kpi span {
		font-size: 5vw;
	}
	
	.footer-menu{
		grid-template-columns: auto auto auto;
		grid-template-rows: auto auto auto;
	}

    /* SEARCH BAR */
    .search-btn{
        display: none;
    }
    
    .search-wrap{
        width: 100%;
        min-width: unset;
        top: unset;
        right: unset;
        margin-bottom: 50px;
        background: #ffcc00f5;
    }

    .search-input{
        height: 32px;
        text-align: left;
        border: 0;
        color: #636363;
        -webkit-appearance: none;
        padding: 0px 30px 0px 20px;
        margin: 18px 20px;
        text-align: left;
        width: calc(100% - 90px);
    }

    .search-close{
        display: none;
        /* top: 34px;
        right: 22px; */
    }

    /* NEW EQUIPMENT PAGE */
    .equip-brief-container{
        height: auto;
        display: grid;
    }

    .equip-brief-container .image{
        width: 100%;
        height: 400px;
    }

    .equip-brief-container .overlay-title{
        font-size: 10vw;
    }

    .equip-brief-container .desc{
        width: calc(100% - 40px);
        margin-top: 20px;
        padding:20px;
        height: auto;
    }

    .new-equip .container{
        height: 60vw;
        background-size: cover;
        background-position-x: center;
    }

    /* USED EQUIPMENT PAGE */
    .cover-section img{
        max-height: 450px;
    }

    .depot-contact-wrap .content{
        padding: 0px 20px;
    }
}

@media (min-width:880px) { /* MORE THAN 880PX */
	.min-nav-btn {
		display: none !important;
	}
	
	.overlaymenu{
		display: none !important;
		height: 0px ;
	}
}

@media (max-width:800px) {
    .contact-container{
        grid-template-columns: 1fr;
        row-gap: 10px;
    }

    .factory-contact{
        order:3;
        margin-top:100px;
        border-top: 1px solid #e3e3e3;
        padding-top: 50px;
    }

    .factory-map{
        order:4;
    }

    #contact-form{
        border: none;
        box-shadow: none;
        padding: none;
        border-radius: none;
        background: none;
    }

    /* USE EQUIPMENT PAGE */
    .used-mac-type .container{
        padding:20px;
        height: calc(100% - 40px);
    }

    .used-mac-type h3{
        font-size: 2.5rem;
    }

    .used-mac-type .used-equip-browse a{
        padding: 12px 68px 12px 40px;
    }

    /* MULTI-PURPOSE DEPOT PAGE */
    .pass-project-wrap .box{
        min-width: 300px;
    }

    /* GENSET PAGE */
    .genset-desc-wrap.products{
        padding:40px 20px;
        margin: 20px;
    }
}

@media (max-width: 765px){
    .product-briefing{
        grid-template-columns: 1fr;
        -moz-column-gap: 0;
             column-gap: 0;
    }

    .py-5 { /* product gallery slider */
        padding: 20px;
        width: calc(100vw - 60px);
        max-width: 575px;
    }

    .product-content{
        padding: 20px;
    }
}

@media (max-width:725px){
    .contact-us form{
        width: 100%;
    }

    .contact-us form .group-1{
        grid-template-columns: 1fr;
        width: 100%;
    }

    .contact-us form .group-2{
        width: auto;
        width: 100%;
    }

    .contact-us .form-control{
        width: calc(100% - 46px) !important;
        min-width: unset;
    }

    .product-tags-container{
        width: calc(50% - 0.875rem);
        margin-left: 0.4375rem;
        margin-right: 0.4375rem;
        margin-top: 0.4375rem;
        margin-bottom: 0.4375rem;
    }

    /* MULTI-PURPOSE DEPOT PAGE */
    .depot-about-wrap{
        border-top: none;
    }

    .depot-contact-wrap .content{
        float:left;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        width: 100%;
    }

    .depot-contact-wrap .location, .depot-contact-wrap .call, .depot-contact-wrap .email{
        line-height: 38px;
        border-bottom: 1px solid #a9956385;
        width: calc(100% - 40px);
        padding: 20px;
        justify-content: flex-start;
        margin-right: 0px;
    }

    .depot-key-wrap .title{
        border-left: none !important;
        border-right: none !important;
    }

    .depot-key-wrap .title-wrap{
        border-bottom: none;
    }
}

@media (max-width:680px){
    .slider-desc p {
        font-size: 1rem !important;
    }

	.product-spec-grid{
		display: flex;
		flex-direction: column;
	}
	
	.product-spec-grid .a{ order:1; }
	.product-spec-grid .aa{ order:2; }
	.product-spec-grid .b{ order:3; }
	.product-spec-grid .bb{ order:4; }
	.product-spec-grid .c{ order:5; }
	.product-spec-grid .cc{ order:6; }
	.product-spec-grid .d{ order:7; }
	.product-spec-grid .dd{ order:8; }
    .product-spec-grid .e{ order:9; }
	.product-spec-grid .ee{ order:10; }
    .product-spec-grid .f{ order:11; }
	.product-spec-grid .ff{ order:12; }
    .product-spec-grid .g{ order:13; }
	.product-spec-grid .gg{ order:14; }
    .product-spec-grid .h{ order:15; }
	.product-spec-grid .hh{ order:16; }

	.product-spec-grid .desc{
		min-height: 200px;
	}

    .product-spec-grid .desc .contain
	{
        width: auto;
        padding: 20px;
        position: relative;
        top: 0;
        left: 0;
        transform: none;
        text-align: center;
        max-width: unset;
    }
	
	.product-spec-grid .desc .contain b::before{
		transform: rotate(-90deg);
	}

    .equip-list-container .items {
        grid-template-columns: 1fr 1fr;
    }

    /* USE EQUIPMENT PAGE */
    .cover-section .content{
        left:0;
        right:0;
    }

    .cover-section .content .title{
        font-size: 2.5rem;
        line-height: 2.5rem;
    }

    .used-mac-type{
        height: 50vh;
    }

    .category-section{
        grid-template-columns: 1fr;
    }

    .used-mac-type h3{
        min-height: unset;
    }

    .used-mac-type .title span{
        top: -22px;
    }

    /* GENSET PAGE */
    .genset-wrapper{
        grid-template-columns: 1fr;
    }

    .genset-container.features{
        padding:20px 20px 40px 20px;
    }

    /* PARTS PAGE */
    .part-main-wrapper.gd-5{
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width:600px) {
    /* MULTI-PURPOSE DEPOT PAGE */
    .depot-lot-wrap .wrap-1{
        grid-template-columns: 1fr;
        row-gap: 40px;
    }

    .depot-key-wrap .title{
        text-align: left;
    }

    .depot-key-wrap .content{
        grid-template-columns: 1fr;
        row-gap: 20px;
        justify-items: start;
    }

    .depot-key-wrap ul li{
        text-align: left;
    }

    .facilities .desc{
        text-align: left;
    }

    .depot-key-wrap .point {
        display: grid;
        grid-template-columns: 80px 1fr;
        -moz-column-gap: 20px;
             column-gap: 20px;
        width: 100%;
    }

    .depot-key-wrap .icon{
        background-size: 80px;
        width:80px;
        height: 80px;
    }

    .depot-key-wrap .title.accessibility::after {
        left: 8%;
    }
    
    .depot-key-wrap .title.facilities::after {
        left: 8%;
    }
    
    .depot-key-wrap .title.suit-for::after {
        left: 8%;
    }

    .depot-project-wrap > .title{
        text-align: left;
    }

    /* ATTACHMENTS PAGE */
    .attachments-wrapper{
        display: flex;
        flex-direction: column;
        -moz-column-gap: 0;
             column-gap: 0;
        row-gap: 0;
    }

    .attachments-wrapper .a { order: 1; }
    .attachments-wrapper .aa { order: 2; }
    .attachments-wrapper .b { order: 3; }
    .attachments-wrapper .bb { order: 4; }
    .attachments-wrapper .c { order: 5; }
    .attachments-wrapper .cc { order: 6; }
    .attachments-wrapper .d { order: 7; }
    .attachments-wrapper .dd { order: 8; }
    .attachments-wrapper .e { order: 9; }
    .attachments-wrapper .ee { order: 10; }
    .attachments-wrapper .f { order: 11; }
    .attachments-wrapper .ff { order: 12; }
    .attachments-wrapper .g { order: 13; }
    .attachments-wrapper .gg { order: 14; }
    .attachments-wrapper .h { order: 15; }
    .attachments-wrapper .hh { order: 16; }
    .attachments-wrapper .i { order: 17; }
    .attachments-wrapper .ii { order: 18; }
    .attachments-wrapper .j { order: 19; }
    .attachments-wrapper .jj { order: 20; }

    .container.image {
        padding: 50px 20px 0px 20px;
    }

    .attachments-wrapper img{
        max-width: -webkit-fill-available;
    }
}

@media (max-width:560px) {
    .browse-item-wrapper{
		display:block;
        padding:0px 40px;
		max-width: 350px;
		margin: 0 auto;
	}
	.browse-item-wrapper .item{
		background-size: cover;
		height: 46vw;
		padding-top: 0;
		background-position: center;
		margin-bottom: 40px;
        min-height: 220px;
	}

    .browse-click {
        width: calc(100% - 30px);
        padding: 15px;
    }

	.browse-click .title{
        font-size:1.3rem;
    }
	
	.browse-click .square{
		width:2rem;
		height:2rem;
	}
	
	.kpi{
		grid-template-columns: 0.6fr;
		grid-gap: 30px;
		justify-content: center;
	}
	
	.kpi-grid{
		top:18vw;
	}
	
	.kpi span{
		font-size:8vw;
	}
	
	.kpi label {
		font-size: 1rem;
		white-space: normal;
	}

    .contact-us .title label{
        max-width: 18.5rem;
        margin: 0 auto;
        height: 205px;
    }

    .new-equip .container{
        height: 80vw;
        background-size: cover;
        background-position-x: center;
        grid-template-columns: 1fr 1fr;
    }

    .new-equip-wrap{
        padding: 20px;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: calc(100% - 60px);
        height: calc(100% - 90px);
        align-content: center;
        justify-content: center;
        background: #ffffffe6;
    }

    /* .wheel-loader .new-equip-wrap, .compactor .new-equip-wrap{
        background: linear-gradient(to right,rgba(0,0,0,0) 4%,rgb(0 0 0 / 18%) 89%);
    }

    .backhoe-loader .new-equip-wrap, .motor-grader .new-equip-wrap{
        background: linear-gradient(to left,rgba(0,0,0,0) 4%,rgb(0 0 0 / 18%) 89%);
    } */

    .new-equip .title{
        white-space: unset;
        line-height: 1.875rem;
    }

    .new-equip .desc{
        text-align: center;
    }

    .used-equip-header h1{
        display: grid;
    }

    /* PARTS PAGE */
    .parts-container{
        padding: 20px;
    }

    .footer-menu{
		grid-template-columns: auto;
		grid-template-rows: auto;
	}
}

@media (max-width:500px) {
    /* GENSET PAGE */
    .genset-desc-wrap.products .header-image-box{
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    
    .genset-desc-wrap.products img{
        width: 100%;
    }

    /* PARTS PAGE */
    .parts-contact{
        line-height: 150%;
        white-space: nowrap;
    }
}

@media (max-width:480px) {
    .slider {
        height: 50vw !important;
    }
    
    .desc .contain b{
        font-size: 1.25rem;
    }

    .table-wrapper .table-title{
        font-size: 1.25rem;
    }

    .equip-list-container .items .products .grid-2col{
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: center;
    }
	
	/*.footer-menu ul{
		width:100%;
		padding-bottom:20px;
		border-bottom: 1px solid #3a3a3a;
	}*/
	
	.footer-social div{
		width:30px;
		height:30px;
		background-size:30px 30px;
		background-repeat:no-repeat;
	}

    .service .content{
        align-items: start;
    }

    .service .content .title{
        font-size: 1.875rem;
    }

    .service .content .desc, .service .content .title{
        text-align: left;
    }

    .service.multi-purpose-depot .desc p{
        padding:1rem 0;
        text-align: left;
    }

    .equip-brief-container .image {
        height: 280px;
    }

    .equip-list-container .filter, .equip-list-container .items{
        grid-template-columns: 1fr;
    }

    .timeline img{
        width: calc(100% - 40px);
    }

    .csr img{
        -o-object-fit: cover;
           object-fit: cover;
    }

    .new-equip .container{
        grid-template-columns: 1fr;
        height: 90vw;
    }

    .new-equip .empty{
        display: none;
    }

    .new-equip-wrap{
        width: calc(100% - 40px);
        height: calc(100% - 40px);
        background: none;
        background-image: linear-gradient(to bottom, rgb(255 255 255 / 0%), rgb(255 255 255 / 42%) 50%, rgb(255 255 255 / 0%) 100%);
        /* background: radial-gradient(circle, rgb(255 255 255) 0.75%, rgb(246 246 246 / 0%) 60%, rgb(0 0 0 / 0%) 100%); */
    }

    .new-equip .desc{
        text-shadow: 0px 0px 1px #525252;
    }

    .new-equip-wrap .desc p{
        padding: 15px 10px;
        /* background: #ffffff7d; */
        /* border-radius: 4px; */
        margin: 10px 0px;
        /* border: 1px solid #d2d2d247; */
    }

    .table-container{
        padding: 0;
    }

    #search-table-input{
        float: none;
        margin: 0px 20px 10px 20px;
        width: calc(100% - 80px);
        min-width: unset;
        max-width: unset;
    }

    #search-result{
        padding-left: 20px;
    }

    /* MULTI-PURPOSE DEPOT PAGE */
    .depot-lot-wrap{
        grid-template-columns: 1fr;
    }

    .depot-lot-wrap .wrap-1{
        width: 120px;
        order: 2;
    }

    .depot-lot-wrap .wrap-2{
        border-left:none;
        order: 1
    }

    .depot-lot-wrap .wrap-1{
        grid-template-columns: 1fr 1fr;
    }

    /* PARTS PAGE */
    .part-main-wrapper.gd-2, .part-main-wrapper.gd-5{
        grid-template-columns: 1fr;
    }

    .gd-5 .top{
        width: 100%;
    }
}

@media (max-width:390px) {
	.slider{
		height:53vw;
	}
	
	.slider-title span{
		font-size: 7.5vw;
		line-height: 7vw;
	}
	
	.browse-item-wrapper{
        padding:0px 20px;
	}

    .equip-list-container .items .products .grid-2col{
        display: block;
    }

    .g-recaptcha {
        transform: scale(0.87);
        transform-origin: 0 0;
        width: 100%;
        position: absolute;
    }

    .btn-submit-enquiries{
        margin-top: 85px;
    }
    .contact-us .form-control{
        width: calc(100% - 44px);
    }

    .new-equip .container{
        grid-template-columns: 1fr;
        height: 100vw;
    }

    /* MULTI-PURPOSE DEPOT PAGE */
    .depot-lot-wrap .wrap-1{
        -moz-column-gap: 20px;
             column-gap: 20px;
    }
}