@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

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,font,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 {
   background: transparent; border: 0; margin: 0; padding: 0; 
  }

table { 
  border-collapse: collapse; width: 100%; 
}
td { 
  vertical-align: top; 
}
header,nav,article,footer,address { 
  display: block; 
}

/***** END RESET *****/
::-moz-selection { 
  background: #000; color: #fff; text-shadow: none; 
}
::selection { 
  background: #000; color: #fff; text-shadow: none; 
}

/* Clearfix */
.cf:before,.cf:after { 
  content: " "; display: table; 
}
.cf:after { clear: both; }
.cf { zoom: 1; }

/*---Variables converted to native CSS custom properties----*/
:root { 
  --primary: #FF5500; 
  --secondary: #CC2200; 
  --heading-font: 'Kanit', sans-serif; 
  --body-font: 'Inter', sans-serif; 
}

.btn { 
  display: inline-block; font-family:var(--body-font); margin: 3px; padding: 16px 32px; align-items: center;border-radius: 30px; transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; 
}
.orange { 
  background: var(--primary); color: #000;
 }
.orange:hover {background: #000; color: #fff; transition: .8s;}
 .red { 
  background: var(--secondary); color: #fff;
 }
.red:hover {background: #000; transition: .8s;}
.white-trans {
   color: #fff; background: rgba(255, 255, 255, 0.1); border: solid 1px #fff; 
  }
.white-trans:hover {background: #000; transition: .8s; border: 1px #000 solid;}

.eyebrow{font-family:var(--body-font); font-size:14px; font-weight:600; text-transform:uppercase; letter-spacing:2.4px;}
.heading1{font-size:clamp(30px,  5vw, 55px); font-family:var(--heading-font); font-weight:800; line-height:1;}
.heading2{font-size:clamp(25px, 4vw, 45px); font-family:var(--heading-font); font-weight:800; line-height:1;}
.heading3{font-size:clamp(18px, 3vw, 22px); font-family:var(--heading-font); font-weight:700; line-height:1;}
.paragraph{color:#444a57; font-family: 'poppins', sans-serif; font-size:16px; line-height:24px; font-weight:400;}


/*-------- BODY STYLES --------*/
* { box-sizing: border-box; }
body { font-family: var(--body-font); }
h1,h2,h3,h4,h5 { font-family: var(--heading-font); }
a { text-decoration: none !important; }

.width {
   max-width: 1400px; margin: 0 auto; width: 96%; box-sizing: border-box;
   }
.pad {
   padding: clamp(30px, 5vw, 70px) 10px; 
  }

  .black-back{background:#111; color:#fff;
    .paragraph{color:#aeb5c2;}
  }
.grad-back{background: linear-gradient(to bottom, rgba(0, 0, 0, 0.15), rgba(255, 255, 255, 0.1)); color:#000;}
button:hover {cursor: pointer !important;}
/*--- HEADER STYLES ---------------------*/
.top-header{width:100%; display:flex; flex-direction:row; justify-content: space-between;}
.top-left{display:flex; flex-direction:row; gap:10px;
  a{color:#fff; display:flex; flex-direction:row; gap:8px; align-items:center;
    i{font-size:18px; color:transparent; display:flex; flex-direction:row; align-content:center; align-items:center; justify-content:center; -webkit-text-stroke:1px #fff; padding:8px; height:40px; width:40px; background:#333;}
    span{display:flex; flex-direction:column; font-size:14px; font-weight:800; 
      span{font-size:12px; font-weight:400;}
    }
  }
}
.top-left a:hover i {background: #CC1F00; transition: .8s;}
.top-right{display:flex; gap:10px; flex-direction:row;
  a.icon{display:block;
     i{font-size:18px; color:#fff; padding:14px;}
  }
}

.header-link{display: inline-block; color:#fff; font-family:var(--body-font); background:var(--secondary); padding: 12px 22px; align-items: center;transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; 
  i{padding-right:5px;}
}

header{width:100%; position:sticky; top:0; background:#fff; z-index:100; box-shadow:1px 5px 8px rgba(0,0,0,.08);}
.header{display:flex; flex-direction:row; justify-content: space-between; align-items:center;}
.logo{max-width:200px; width:100%;
  img{width:100%;}
}

.search-row{display:flex; flex-direction:row;
  input{padding:12px; border:solid 1px #888; background:#f2f2f2; color:#666; width:220px;}
  button{padding:10px; font-size:16px; color:#000 !important; background:var(--primary) !important; border:none!important;}
}

/*--------Hero---------*/
.swiper {background:#000; width: 100%;height: 750px; position: relative; overflow: hidden; }
.swiper-wrapper {height: 100%;}
.swiper-slide {background: #000; height: 100%;}
.swiper-slide img {background-color:#000; display: block; width: 100%; height: 100%; object-fit: cover;}
.grad{top:0; left:0; width:100%; height:100%; z-index:10; background: linear-gradient(79deg, rgba(204, 34, 0, 0.50) 11.61%, rgba(111, 26, 9, 0.55) 23.21%, rgba(17, 17, 17, 0.55) 46.96%, rgba(136, 51, 9, 0.55) 73.68%, rgba(255, 85, 0, 0.50) 88.07%);
}
.hero-text{margin:0 auto; max-width:1000px; z-index:20; color:#fff; padding: 150px 0;
  h1{color:#fff;text-align: center;text-shadow: 1px 3px 4px rgba(0, 0, 0, 0.80);font-family:var(--heading-font);font-size:clamp(40px, 11vh, 110px);font-style: normal;font-weight: 900;line-height: 90%;}
  p{width:80%; padding:30px 0;color:#eee; text-align:center; max-width:500px; margin:0 auto;}
}
.btn-row{display:flex; flex-direction:row; justify-content: center; flex-wrap: wrap;}


/*----Black Bar----*/
.black-bar{display:flex; flex-direction:row; justify-content: center; padding:15px;
  div{width:33.33%; border-right:solid 1px #333;  padding:0 35px;
    h2{font-size:16px; color:#aeb5c2; font-weight:400; font-family:var(--body-font); line-height:1;
      span{font-size:50px; color:var(--primary); font-weight:800; font-family:var(--heading-font);}
    }
  }
  div:last-of-type{border-right:none;}
}

.heading-text{text-align:center;
  .eyebrow{color:var(--secondary);}
}


/*-------QLS---------*/
.qls{display:flex; flex-direction:row; margin:35px 0; justify-content:flex-start; gap:20px; flex-wrap:wrap;}
.ql{width:calc(33.33% - 15px); border-radius:8px; position:relative; overflow:hidden;
  img{width:100%; height:100%; object-fit:cover;}
  .ql-text{ height:100%; left:0; z-index:50; right:0; padding:30px; 
    h3{color:#fff; font-family:var(--heading-font); font-size:clamp(18px, 2vw, 24px); font-weight:800;}
    p{color:#fff; font-family:var(--body-font); font-size:15px; padding:20px 0; line-height:1.4;}
    ul{margin-left:20px;
      li{color:#fff; font-family:var(--body-font); font-size:15px; padding:5px 0; line-height:1.1;}
    }
    a{margin-top:25px; font-size:18px; font-weight:800; font-family:var(--body-font); color:#fff; display:inline-block;
      i{padding-left:10px;}
    }
     }
  .grad-left{opacity:.8; background: linear-gradient(90deg, #E35200 0%, #B03F00 46.15%, #5C2100 100%); position:absolute; top:0; left:0; width:100%; height:100%; z-index:10;}
  .grad-middle{opacity:.8; background: linear-gradient(90deg, rgba(125, 45, 0, 0.80) 0%, rgba(44, 16, 0, 0.80) 30.77%, rgba(31, 7, 0, 0.75) 63.94%, rgba(137, 23, 0, 0.80) 100%); position:absolute; top:0; left:0; width:100%; height:100%; z-index:10;}
  .grad-right{opacity:.8; background: linear-gradient(90deg, #662703 0%, #671000 50%, #C20 100%); position:absolute; top:0; left:0; width:100%; height:100%; z-index:10;}
}
.ql-text a:hover i {padding-left: 20px; transition: .8s;}

.heading-row{display:flex; flex-direction:row; justify-content:space-between; align-items:flex-end; margin-bottom:50px;
  h2{max-width:600px; width:100%;}
  .eyebrow{color:var(--primary);}
  p{ width:100%; max-width:450px; text-align:right;}
}

/*----Services----*/
.black-boxes{display:flex; flex-wrap:wrap; flex-direction:row; justify-content:flex-start; gap:2px; background:#111;}
.black-box{width:calc(33.33% - 4px); border:solid 1px #444; padding:30px; color:#fff;
  i{font-size:18px; padding:10px; height:45px; width:45px;display:flex; flex-direction:row; align-content:center; align-items:center; justify-content:center; border:solid 1px #fff;}
  h3{margin-top:20px;}
  p{color:#aeb5c2; padding:20px 0; }
  a{margin-top:20px; font-size:18px; font-weight:800; font-family:var(--body-font);display:inline-block;
    i{padding:0 0 0 10px; display:inline-block; width:auto; height:auto; border:None;}
  }
}
.red-accents > i {color: #CC1F00; border: 1px #CC1F00 solid; background: rgba(204,31,0,0.13);}
.red-accents a {color: #CC1F00;}
.red-accents a:hover i, .orange-accents a:hover i  {padding-left: 20px; transition: .8s;}
.orange-accents > i {color: #F5620F; border: 1px #F5620F solid; background: rgba(245,98,15,0.13);}
.orange-accents a {color: #F5620F;}

/*-----About-----*/
.white-boxes{display:flex; flex-wrap:wrap; flex-direction:row; justify-content:flex-start;}
.white-box{width:calc(25% - 2px); border:solid 1px #eee; padding:30px;
  h2{color:var(--secondary);}
  .paragraph{line-height:20px!important;}
}
.about{display:flex; flex-direction:row; gap:30px; padding-top:60px;}
.about-left{width:calc(50% - 20px);
  h2{margin-bottom:20px;
    .eyebrow{color:var(--secondary);}
  }
  a{margin-top:40px;}
}
.about-right{width:calc(50% - 20px); display:flex; flex-direction:row; gap:15px; flex-wrap:wrap;
  .group{width:calc(50% - 8px);}
}
.group-flex {display: flex; align-items: center; gap: 10px; margin-bottom: 10px;}
.group-flex i {color: #CC1F00; background: rgba(204,31,0,0.10); padding: 10px;}

/*---------Pages----------*/

/*--------GENERIC FORM TEMPLATE--------------------*/
.flex-form { 
  width: 100%; margin: 0 auto 2rem auto; padding: 25px; background: #fff; border-radius: 8px; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06); font-size: 15px;
  label { 
    display: block; margin-bottom: 0.5rem; font-weight: 600; color: #222; letter-spacing: 0.02em; }
  input,select,textarea {
     width: 100%; padding: 12px 14px; margin-bottom: 1.2rem; border: 1px solid #ccc; border-radius: 5px; font-family: var(--body-font); background: #ffffff; font-size: 15px; color: #333; transition: border-color 0.2s; box-sizing: border-box;
    &:focus {
       border-color: var(--primary); outline: none; 
      }
  }
  textarea { 
    min-height: 100px; resize: vertical; }
  .form-row {
     display: flex; flex-direction: row; justify-content: flex-start; flex-wrap: wrap; gap: 1rem;

  }
  .form-note { 
    font-size: 13px; color: #888; margin-bottom: 1rem;
   }

.flex-row { 
  display: flex; flex-direction: row; justify-content: flex-start; flex-wrap: wrap; gap: 1rem;
}

.form-whole { 
  width: 100%; 
}
.form-half { 
  width: calc(50% - 0.5rem);
 }
.form-third {
   width: calc(33.333% - 0.67rem);
   }
  }

@media (max-width: 900px) {
  .form-half,.form-third {
     width: 100%; 
    }
}

.submit-button { 
  display: inline-block; padding: 14px 28px; background: var(--primary); color: #fff; border: none; border-radius: 5px; font-size: 16px; font-family: var(--heading-font); text-transform: uppercase; cursor: pointer; transition: background 0.2s ease, transform 0.25s ease, box-shadow 0.25s ease;
 }
 .submit-button:hover{background:var(--secondary);}

/*-----DEFAULT-----*/
.ag-bkgrd {background: url("/siteart/ag-equipment.jpg") no-repeat; background-position: center; background-size: cover;}
.ag-bkgrd .cat-overlay {background: #E35200; background: linear-gradient(90deg, rgba(227, 82, 0, 0.8) 0%, rgba(176, 63, 0, 0.75) 46%, rgba(92, 33, 0, 0.8) 100%); height: 100%}
.construction-bkgrd {background: url("/siteart/construction-equipment.jpg") no-repeat; background-position: center; background-size: cover;}
.construction-bkgrd .cat-overlay {background: #7D2D00; background: linear-gradient(90deg, rgba(125, 45, 0, 0.8) 0%, rgba(44, 16, 0, 0.8) 31%, rgba(31, 7, 0, 0.75) 64%, rgba(137, 23, 0, 0.8) 100%); height: 100%}
.aerial-bkgrd {background: url("/siteart/aerial-equipment.jpg") no-repeat; background-position: center; background-size: cover;}
.aerial-bkgrd .cat-overlay {background: #662703; background: linear-gradient(90deg, rgba(102, 39, 3, 0.8) 0%, rgba(103, 16, 0, 0.75) 50%, rgba(204, 34, 0, 0.8) 100%); height: 100%}

.repair-bkgrd {background: #C41E00; background: linear-gradient(125deg, rgba(196, 30, 0, 1) 27%, rgba(248, 89, 0, 1) 100%);}
.repair-wrap {width: 95%; margin: 0 auto;}
.repair-watermark {background: url("/siteart/wrenchwork.png") no-repeat; background-position: center; background-size: contain;}
.repair-flex {width: 1400px; margin: 0 auto; display: flex; justify-content: space-between; gap: 100px; align-items: center; padding: 80px 0;}
.repair-left {width: 45%;}
.repair-left p span {font-family: 'inter', sans-serif; font-weight: 600; font-size: 14px; line-height: 16.5px; letter-spacing: 2.42px; color: rgba(255,255,255,0.75); text-transform: uppercase;}
.repair-left h2 {font-family: 'kanit', sans-serif; font-weight: 800; font-size: 56px; line-height: 1.1; color: #fff; margin-bottom: 20px;}
.repair-left p {font-family: 'poppins', sans-serif; font-weight: 400; font-size: 15px; line-height: 27px; color: rgba(255,255,255,0.90);}
.repair-link {border: 1px rgba(255,255,255,0.20) solid; background: rgba(255,255,255,0.10); width: 100%;}
.repair-right {width: 55%;}
.repair-link-wrap {padding: 20px; width: 100%;}
.repair-link-flex {display: flex; align-items: center; gap: 16px;}
.repair-link-flex i {background: rgba(255,255,255,0.20); height: 48px; width: 48px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; line-height: 20px;}
.repair-link-flex p span {font-family: 'inter', sans-serif; font-weight: 600; font-size: 12px; line-height: 16.5px; letter-spacing: 1.1px; color: rgba(255,255,255,0.70); text-transform: uppercase;}
.repair-link-flex p {font-family: 'inter', sans-serif; font-weight: 600; font-size: 16px; line-height: 21px; color: #fff;}
.repair-contact-flex, .repair-contact-btns {display: flex; gap: 20px; margin-top: 20px;}
.repair-contact-flex a, .repair-contact-btns a {width: 100%;}
.repair-contact-flex i, .repair-contact-btns i {background: none; width: auto; height: auto;}
.repair-contact-btns button {width: 100%; padding: 12px 0 10px 0; font-family: 'poppins', sans-serif; font-weight: 800; font-size: 14px; line-height: 21px; display: flex; justify-content: center; gap: 8px; align-items: center; border: 1px transparent solid;}
.repair-contact-btns > a:first-child button {background: #fff; color: #CC1F00;}
.repair-contact-btns > a:last-child button {background: rgba(0,0,0,0.20); color: #fff;}
.repair-contact-btns i {margin-top: -3px;}
.repair-contact-btns > a:first-child button:hover, .repair-contact-btns > a:last-child button:hover {background: #000; color: #fff; transition: .8s;}

/*-----SERVICES-----*/
.sub-hero-bkgrd {background: url("/siteart/service-tech.webp") no-repeat; background-position: center; background-size: cover;}
.sub-hero-overlay {background: #CC2200;
background: linear-gradient(70deg, rgba(204, 34, 0, 0.58) 10%, rgba(17, 17, 17, 0.6) 48%, rgba(136, 51, 9, 0.52) 75%, rgba(245, 98, 15, 0.45) 100%);}
.sub-hero-wrap {width: 90%; margin: 0 auto; padding: 100px 0;}
.sub-hero-wrap p span {font-family: 'inter', sans-serif; font-weight: 600; font-size: 12px; line-height: 18px; letter-spacing: 2.5px; color: rgba(255,255,255,0.75); text-transform: uppercase;}
.sub-hero-wrap h1 {font-family: 'kanit', sans-serif; font-weight: 800; font-size: 72px; line-height: 68.4px; color: #fff; margin-bottom: 15px;}
.sub-hero-wrap p {font-family: 'poppins', sans-serif; font-weight: 400; font-size: 16px; line-height: 26px; color: rgba(255,255,255,0.90); width: 580px;}
.sub-breadcrumbs {background: #111111;}
.sub-breadcrumbs-flex {width: 90%; margin: 0 auto; padding: 15px 0; display: flex; justify-content: flex-start; gap: 12px; align-items: center; flex-wrap: wrap;}
.sub-breadcrumbs-flex a {font-family: 'inter', sans-serif; font-weight: 400; font-size: 14px; line-height: 18px; color: #9499A4;}
.sub-breadcrumbs-flex a:hover {color: #fff; transition: .8s;}
.sub-breadcrumbs-flex i {color: #515865; font-size: 14px; line-height: 18px;}
.sub-breadcrumbs-flex p {font-family: 'inter', sans-serif; font-weight: 600; font-size: 14px; line-height: 18px; color: #CC1F00;}

.sub-body {background: #F9F9F9;}
.sub-body-wrap {width: 90%; margin: 0 auto; padding: 100px 0;}
.sub-body-flex {
  display: flex;
  gap: 25px;
  align-items: flex-start;
}

.sub-body-left {
  width: 70%;
}

.sub-body-right {
  width: 30%;
  position: sticky;
  top: 107px;
  height: fit-content;
}
.sub-body-left p span, .about-wrap p span {font-family: 'inter', sans-serif; font-weight: 600; font-size: 13px; line-height: 19.5px; letter-spacing: 2.2px; color: #CC1F00; text-transform: uppercase;}
.sub-body-left h2, .about-wrap h2 {font-size: 'kanit', sans-serif; font-weight: 800; font-size: 44px; line-height: 55px; color: #111111; margin-bottom: 15px;}
.sub-body-left p {font-family: 'poppins', sans-serif; font-weight: 400; font-size: 15px; line-height: 24.4px; color: #6A7282; width: 630px;}
.sub-body-left form {margin-top: 20px;}
form .form-section {background: #fff; border: 1px #E0E0E0 solid; padding: 20px; margin-bottom: 3px;}
.form-section h3 {display: flex; gap: 10px; align-items: center; font-family: 'kanit', sans-serif; font-weight: 800; font-size: 18px; line-height: 22.5px; color: #111111;}
.form-section h3 span {background: #CC1F00; width: 24px; height: 24px; display: flex; justify-content: center; align-items: center; font-family: 'kanit', sans-serif; font-weight: 800; font-size: 14px; line-height: 16.5px; color: #fff;}
.third-form-section h3 span {background: #F5620F;}
.form-section .form-flex {display: flex; gap: 20px; margin-top: 20px;}
.form-flex div {width: 100%;}
.form-flex label {font-family: 'inter', sans-serif; font-weight: 600; font-size: 14px; line-height: 18px; letter-spacing: .3px; color: #333; text-transform: uppercase;}
.form-flex label span {color: #CC1F00;}
.form-flex input {width: 100%; background: #F9F9F9; border: 1px #D0D0D0 solid; padding: 12px 0 12px 15px; font-family: 'inter', sans-serif; font-weight: 400; font-size: 14px; line-height: 24px; color: #AAA; margin-top: 5px;}
.form-flex textarea {width: 100%; background: #F9F9F9; border: 1px #D0D0D0 solid; padding: 12px 0 0 15px; font-family: 'inter', sans-serif; font-weight: 400; font-size: 14px; line-height: 24px; color: #AAA; margin-top: 5px; height: 110px;}
.form-section-flex {display: flex; justify-content: space-between; gap: 50px; align-items: center;}
.form-section-flex p {font-family: 'poppins', sans-serif; font-weight: 400; font-size: 14px; line-height: 22px; color: #9499A4; width: 400px;}
.form-section-flex button {background: #CC1F00; border: none; width: 270px; padding: 14px 0 12px 0; display: flex; justify-content: center; gap: 10px; align-items: center; font-family: 'poppins', sans-serif; font-weight: 600; font-size: 15px; line-height: 22.5px; color: #fff;}
.form-section-flex button i {margin-top: -3px;}
.form-section-flex button:hover {background: #000; transition: .8s;}

.black-section {background: #161616; border: 1px #515865; padding: 20px; width: 100%;}
.black-section p span, .white-section p span {font-family: 'inter', sans-serif; font-weight: 600; font-size: 13px; line-height: 16.5px; letter-spacing: 2px; color: #F5620F; text-transform: uppercase;}
.black-section h4 {font-family: 'kanit', sans-serif; font-weight: 800; font-size: 26px; line-height: 32.5px; color: #fff; margin-top: 8px; margin-bottom: 3px;}
.black-section p {font-family: 'poppins', sans-serif; font-weight: 400; font-size: 14px; line-height: 18px; color: #9499A4;}
.black-section button {background: #F5620F; border: 1px #F5620F solid; width: 100%; padding: 14px 0 12px 0; display: flex; justify-content: center; font-family: 'poppins', sans-serif; font-weight: 600; font-size: 14px; line-height: 19.5px; color: #fff; margin-top: 15px;}
.black-section button:hover {background: none; border: 1px #fff solid; transition: .8s;}
.white-section {background: #fff; border: 1px #E0E0E0 solid; padding: 20px; width: 100%; margin-top: 15px; margin-bottom: 15px;}
.white-section p {margin-bottom: 8px;}
.white-section a {font-family: 'kanit', sans-serif; font-weight: 600; font-size: 16px; line-height: 22.5px; color: #111111;}
.white-section a span {font-family: 'poppins', sans-serif; font-weight: 400; font-size: 14px; line-height: 21px; color: #6A7282;}
.section-hours {margin-top: 15px}
.section-hours ul {display: flex; justify-content: space-between; gap: 10px; padding: 10px 0;}
.section-hours > ul:nth-child(2) {border-top: 1px #F0F0F0 solid; border-bottom: 1px #F0F0F0 solid;}
.section-hours li {list-style: none; font-family: 'inter', sans-serif; font-weight: 500; font-size: 14px; line-height: 18px; color: #333;}
.section-hours li span {color: #6A7282;}
.black-section ul { margin-top: 15px;}
.black-section li {display: flex; gap: 10px; align-items: center; font-family: 'poppins', sans-serif; font-weight: 400; font-size: 14px; line-height: 17.9px; color: #9499A4; padding: 5px 0;}
.black-section i {color: #CC1F00;}
.numbers-flex {display: flex; justify-content: space-between; gap: 10px; align-items: center;}
.numbers-flex div {text-align: center;}
.numbers-flex p {font-family: 'kanit', sans-serif; font-weight: 800; font-size: 32px; line-height: 22px; color: #CC1F00; margin-bottom: 0px;}
.numbers-flex p span {font-family: 'inter', sans-serif; font-weight: 400; font-size: 13px; line-height: 12.5px; color: #6A7282; letter-spacing: 0px; text-transform: none;}
.repair-sm-btns {justify-content: flex-end;}
.repair-sm-btns > a:first-child {width: 200px;}
.repair-sm-btns > a:last-child {width: 150px;}

.service-solutions {padding: 100px 0 0 0;}
.service-solutions > p {text-align: center;}
.service-solutions > p span {font-family: 'inter', sans-serif; font-weight: 600; font-size: 13px; line-height: 19.5px; letter-spacing: 2.2px; color: #CC1F00; text-transform: uppercase;}
.service-solutions h2 {font-family: 'kanit', sans-serif; font-weight: 800; font-size: 44px; line-height: 55px; color: #111111; margin-bottom: 15px; text-align: center;}
.service-solutions-flex > div {background: #fff; border: 1px #E0E0E0 solid; padding: 20px; width: 100%;}
.service-solutions i {color: #F5620F; border: 1px #F5620F solid; background: rgba(245,98,15,0.13); font-size: 18px; padding: 10px; height: 45px; width: 45px; display: flex; align-items: center; justify-content: center;}
.service-solutions h5 {margin-top: 20px; font-size: 22px; line-height: 1; font-weight: 700; color: #000;}
.service-solutions-flex > div p {color: #6A7282; padding: 20px 0 0 0; font-family: 'poppins', sans-serif; font-size: 15px; line-height: 25px; font-weight: 400;}
.service-solutions-flex {display: flex; gap: 20px; margin-top: 50px;}
.service-solutions-flex .red-accents > i {color: #CC1F00; border: 1px #CC1F00 solid; background: rgba(204,31,0,0.13);}

/*-----ABOUT-----*/
.about-wrap {text-align: center; width: 900px; margin: 0 auto;}
.about-wrap p {font-family: 'poppins', sans-serif; font-weight: 400; font-size: 15px; line-height: 24.4px; color: #6A7282;}
.about-wrap button {width: 160px; margin: 0 auto; display: flex; justify-content: center; margin-top: 20px; border: none; border-radius: 100px; padding: 14px 0 12px 0; font-family: 'poppins', sans-serif; font-weight: 600; font-size: 16px; line-height: 26px; color: #fff; background: #CC2200}
.about-wrap button:hover {background: #000; transition: .8s;}

.about-us-flex {display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; padding-top: 80px; width: 1450px; margin: 0 auto;}
.about-us-flex div {background: #fff; border: 1px #E0E0E0 solid; padding: 20px; width: 32%;}
.about-us-flex i {background: rgba(204,31,0,0.10); padding: 10px; font-size: 16px; line-height: 16px; color: #CC1F00;}
.about-us-flex h3 {font-family: 'kanit', sans-serif; font-weight: 800; font-size: 18px; line-height: 22.5px; color: #111111; margin: 15px 0 10px 0;}
.about-us-flex p {font-family: 'poppins', sans-serif; font-weight: 400; font-size: 14px; line-height: 22.1px; color: #6A7282;}

/*-------- FOOTER STYLES ----------------*/
footer{background:#000; color:#fff;}
.footer{display:flex; flex-direction:row; justify-content:space-between; gap:20px; }
.foot-col{width:calc(25% - 12px); border-right:solid 1px #aeb5c2;
  .bold{font-size:20px; font-weight:800; margin-bottom:10px; }
  ul{margin:0; padding:0; list-style:none;
    li{list-style:none; color:#aeb5c2; line-height:24px; font-size:15px;
      a{color:#aeb5c2; line-height:28px; font-size:15px;}
    }
  }
  &:last-child{border-right:none;}
}

.footer-bottom{padding:15px; border-top:solid 1px #aeb5c2;
  p{margin:0; font-size:14px; color:#aeb5c2;}
}
.add{display:block;}
.add:first-of-type{border-bottom:solid 1px #aeb5c2;}
.add-row{padding:25px; gap:20px; display:flex; flex-direction:row;
  i{font-size:35px; color:#000; -webkit-text-stroke:1px var(--primary);}
  a{color:#aeb5c2; line-height:22px; font-size:15px; display:block;}
}

/* ---- INVENTORY STYLES - KEEP AT BOTTOM OF CSS ---- */
.listing-top-right,.buy-now-link,.check-availability-link,.view-listing-details-link,.email-seller-link { 
  background: var(--primary) !important; color: #fff !important;
 }

.list-error-container .info button,.mobile-done-button,a.buy-btn.des-buy-now,a.buy-btn.gtm-buynow.des-buy-now,button.selected-facet.ts-button,.detail-contact-bar .contact-bar-btn,button.page-nav {
   background: var(--primary) !important; color: #fff !important;
   }
.list-top-section .list-listings-count, .listing-prices__retail-price, .listing-prices__discount-formatted-price, .listing-prices__alternate-retail-price, .listing-prices__exclusive-wholesale-price {color: #FF5500 !important;}
.linking-buttons a.active, .ts-modal-container .form-bottom .captcha-and-submit .captcha-placeholder button, .ts-modal-container .form-bottom .captcha-and-submit .captcha-placeholder input {background: #FF5500 !important;}
.faceted-search-content .faceted-section-box .faceted-search, .wrenchworksequipmentcomhdev-88jlbf, .wrenchworksequipmentcomhstg-88jlbf, .wrenchworksequipmentcomhstgsandhillsdemocom-88jlbf, .wwwwrenchworksequipmentcom-88jlbf {background: #000 !important;}
.detail-wrapper {padding: 50px 0 !important;}

/* --------------------------------
   Hover states
-------------------------------- */
.view-listing-details-link:hover,.contact-options a:hover,.fin-calc-mobile > a:hover,button.g-recaptcha.button:hover,.email-seller-link:hover,.mc-nav-controls .mc-icon-navarrow span,a.buy-btn.des-buy-now:hover,a.buy-btn.gtm-buynow.des-buy-now:hover,.detail-contact-bar .contact-bar-btn:hover { 
  background: var(--secondary) !important; color: #fff !important;
 }

/*---------- RESPONSIVE STYLES ----------*/
@media only screen and (max-width: 1800px) {

}
@media only screen and (max-width: 1600px) {
	.about-us-flex {width: 100%;}
}
@media only screen and (max-width: 1450px) {
	.footer {flex-wrap: wrap; gap: 50px;}
	.repair-flex {width: 100%;}
	.sub-body-left {width: 65%;}
	.sub-body-right {width: 35%;}
	.footer > div:nth-child(3) {border-right: none;}
	.foot-col {width: calc(31% - 12px);}
}
@media only screen and (max-width: 1300px) {
	.repair-contact-flex {flex-wrap: wrap;}
	.repair-left, .repair-right {width: 50%;}
	.repair-flex {gap: 80px;}
	.repair-contact-flex i {background: rgba(255,255,255,0.20); width: 48px; height: 48px;}
	.sub-body-left {width: 60%;}
	.sub-body-right {width: 40%;}
	.form-section-flex {flex-wrap: wrap;}
	.form-section-flex p {width: 100%;}
	.form-section-flex {gap: 12px;}
}
@media only screen and (max-width: 1200px) {
	.header > form {display: none;}
	.sub-body-left p {width: 100%;}
}
@media only screen and (max-width: 1150px) {
	.qls {flex-wrap: wrap; justify-content: center;}
	.ql {width: 600px !important;}
	.equip-repair .repair-sm-btns {flex-wrap: wrap; gap: 15px;}
	.equip-repair .repair-sm-btns a {width: 100% !important; display: flex; justify-content: flex-end;}
	.equip-repair .repair-sm-btns button {width: 200px !important;}
	.equip-repair .repair-left {width: 70%;}
	.equip-repair .repair-right {width: 30%;}
	.about-us-flex div {width: 49%;}
}
@media only screen and (max-width: 1100px) {
	.form-section .form-flex {flex-wrap: wrap;}
	.sub-body-left {width: 55%;}
	.sub-body-right {width: 45%;}
	h1 {font-size: 90px !important; line-height: 85px !important;}
	.service-solutions-flex {flex-wrap: wrap;}
}
@media only screen and (max-width: 1050px) {
	.foot-col {width: calc(48% - 12px);}
	.footer > div:nth-child(3) {border-right: solid 1px #aeb5c2;}
	.footer > div:nth-child(2) {border-right: none;}
	.about-wrap {width: 100%;}
}
@media only screen and (max-width: 1000px) {
	.top-left a span {display: none;}
	.repair-flex {gap: 50px;}
	.heading-row {flex-wrap: wrap; gap: 15px;}
	.heading-row h2 {max-width: 100%;}
	.heading-row p {text-align: left; max-width: 100%;}
}
@media only screen and (max-width: 900px) {
	.black-box {width: calc(50.33% - 4px);}
	.white-box {width: calc(50% - 2px);}
	.about {flex-wrap: wrap;}
	.about-left, .about-right {width: calc(100% - 20px);}
	.repair-flex {flex-wrap: wrap;}
	.repair-left, .repair-right, .sub-body-left, .sub-body-right {width: 100%;}
	.repair-contact-flex, .form-section .form-flex {flex-wrap: nowrap;}
	.repair-contact-flex i {background: none; width: auto; height: auto;}
	.sub-body-flex {flex-wrap: wrap;}
	.sub-hero-wrap, .sub-body-wrap {padding: 80px 0;}
	h1 {font-size: 80px !important; line-height: 75px !important;}
	.hero-text {padding: 125px 0;}
	.repair-left h2 {font-size: 50px; line-height: 60px;}
	.equip-repair .repair-left, .equip-repair .repair-right {width: 100%;}
	.equip-repair .repair-flex {gap: 0px;}
	.equip-repair .repair-sm-btns {flex-wrap: nowrap;}
	.equip-repair .repair-sm-btns button {width: 100% !important;}

}
@media only screen and (max-width: 800px) {
	.foot-col {width: calc(100% - 12px);}
	.footer > div, .footer > div:nth-child(3) {border-right: none;}
	.footer > div:nth-child(2) {border-bottom: solid 1px #aeb5c2;}
	.footer > div {border-bottom: solid 1px #aeb5c2; padding-bottom: 30px;}
	.footer {gap: 40px;}
	.footer > div:last-child {border-bottom: none; padding-bottom: 0px;}
	.about-us-flex div {width: 100%;}
}
@media only screen and (max-width: 700px) {
	.repair-contact-flex {flex-wrap: wrap;}
	.repair-contact-flex i {background: rgba(255,255,255,0.20); width: 48px; height: 48px;}
	.sub-hero-wrap p {width: 100%;}
	.black-bar {flex-wrap: wrap; gap: 15px;}
	.black-bar > div {width: 100%; text-align: center; border-bottom: solid 1px #333; border-right: none; padding-bottom: 20px;}
	.black-bar > div:last-child {border-bottom: none; padding-bottom: 0px;}
}
@media only screen and (max-width: 600px) {
	.black-box {width: calc(100% - 4px);}
	.white-box {width: calc(100% - 2px);}
	.group {width: calc(100% - 8px) !important;}
	.form-section .form-flex {flex-wrap: wrap;}
	h1 {font-size: 70px !important; line-height: 65px !important;}
	.hero-text {padding: 100px 0;}
	.repair-left h2, .sub-body-left h2, .about-wrap h2, .service-solutions h2 {font-size: 40px; line-height: 50px;}
}
@media only screen and (max-width: 500px) {
	.add-row {align-items: center;}
	.add-row i {font-size: 30px;}
}
@media only screen and (max-width: 430px) {
	.header-link {display: none;}
	.repair-contact-btns {flex-wrap: wrap; gap: 12px ;}
	.repair-contact-flex i, .repair-link-flex i {background: none; width: auto; height: auto;}
	.numbers-flex {flex-wrap: wrap; gap: 30px;}
	.numbers-flex div {width: 100%;}
	h1 {font-size: 60px !important; line-height: 55px !important;}
	.repair-left h2, .sub-body-left h2, .about-wrap h2, .service-solutions h2 {font-size: 30px; line-height: 40px;}
	.repair-left p {font-size: 14px; line-height: 25px;}
	.repair-left p span, .eyebrow {font-size: 13px;}
	.repair-link-flex p, .paragraph, .sub-hero-wrap p {font-size: 15px;}
	.black-box a, .ql-text a {font-size: 16px !important;}
	.foot-col .bold {font-size: 18px;}
	.foot-col li, .foot-col li a, .add-row a, .service-solutions-flex > div p, .about-wrap p {font-size: 14px}
	.equip-repair .repair-sm-btns {flex-wrap: wrap;}
}
@media only screen and (max-width: 380px) {
	h1 {font-size: 50px !important; line-height: 45px !important;}
	.add-row {flex-wrap: wrap; gap: 15px; padding: 25px 0;}
	.add-row > div, .add-row > a {width: 100%;}
	.repair-link-flex {flex-wrap: wrap; gap: 10px;}
	.repair-link-flex > div {width: 100%;}
}