/*
*  html5 doctor css reset | http://html5doctor.com/html-5-reset-stylesheet
*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1; background-color: #fff}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}

@font-face {
    font-family: 'open_sansregular';
    src: url('../fonts/opensans-regular-webfont.woff2') format('woff2'),
         url('../fonts/opensans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Medium.eot');
    src: url('../fonts/Roboto-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Roboto-Medium.woff2') format('woff2'),
        url('../fonts/Roboto-Medium.woff') format('woff'),
        url('../fonts/Roboto-Medium.ttf') format('truetype'),
        url('../fonts/Roboto-Medium.svg#Roboto-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Archivo';
    src: url('../fonts/ArchivoBlack-Regular.eot');
    src: url('../fonts/ArchivoBlack-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/ArchivoBlack-Regular.woff2') format('woff2'),
        url('../fonts/ArchivoBlack-Regular.woff') format('woff'),
        url('../fonts/ArchivoBlack-Regular.ttf') format('truetype'),
        url('../fonts/ArchivoBlack-Regular.svg#ArchivoBlack-Regular') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}


h1 {
    font-family: 'Roboto';
    font-size: 40px;
    color: #565555;
    letter-spacing: 1px;
    padding-top: 40px;
}

h2 {
    font-family: 'Archivo';
    font-size: 26px;
    color: #fff;
    letter-spacing: 1px;
    padding-top: 10px;
}

h3 {
    font-family: 'Archivo';
    font-size: 36px;
    color: #555555;
    text-align: center;
    padding-top: 35px;
}

h4 {
    font-family: 'Roboto';
    font-size: 18px;
    color: white;
    font-weight: normal;
    letter-spacing: 1px;
}

h5 {
    font-family: 'Roboto';
    font-size: 45px;
    color: white;
    font-weight: bold;
    letter-spacing:5px;
}


.spacer {
    width: 100%;
    height: 1px;
    line-height: 1px;
    clear: both;
}

img {
    max-width: 100%;
}

#top-pos {
    
}

#top-bg {
    width: 100%;
    height: 35px;
    margin: 0 auto;
    background-color: black;
}

.wrapper {
    width: 100%;
    max-width: 1205px;
    height: auto;
    margin: 0 auto;
}

#info {
    float: left;
}

#info p {
    font-family: 'open_sansregular';
    font-size: 12px;
    color: white;
    padding-top: 11px;
}

#youtube-icon {
    float: right;
    margin-top: 12px;
}

#top-email {
    float: right;
    margin-right: 10px;
}

#top-email p {
    font-family: 'open_sansregular';
    font-size: 12px;
    color: white;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-top: 11px;
}

.logo-bg {
    width: 100%;
    height: 123px;
    margin: 0 auto;
    background-color: #979797;
}

.logo {
    float: left;
}

#banner {
    text-align: center;
}

#view {
    width: 100%;
    max-width: 195px;
    height: 34px;
    background-color: #484540;
    float: right;
    border-radius: 25px;
    margin-top: 45px;
}

#view p {
    font-family: 'open_sansregular';
    font-size: 13px;
    color: white;
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-top: 11px;
}

#view p a {
    color: white;
    text-decoration: none;
}

#menu {
    float: right;
    margin-right: 50px;
}

    nav {
      float: right;
      color: white;
    }

    nav .menu {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 42px 20px;
    }

    nav .logo {
      font-size: 24px;
      font-weight: bold;
    }

    nav input[type="checkbox"] {
      display: none;
    }

    nav .hamburger {
      display: none;
      font-size: 24px;
      cursor: pointer;
    }

    nav ul {
      list-style: none;
      display: flex;
      gap: 20px;
    }

    nav li {
      position: relative;
    }

    nav a {
      display: block;
      padding: 10px;
      color: white;
      text-decoration: none;
      border-radius: 20px;
      color: white !important;

    }

    nav a:hover {
      background-color: #f69206;
      color: white !important;      
    }

    /* Dropdown */
    .dropdown {
      display: none;
      position: absolute;
      background-color: #444;
      top: 100%;
      left: 0;
      min-width: 272px;
      flex-direction: column;
      z-index: 999;
      padding: 10px;
    }

    li:hover .dropdown {
      display: flex;
    }

#welcome-box {
    width: 100%;
    max-width: 390px;
    height: 52px;
    background-color: #f69206;
    margin-top: 20px;
}

#welcome-box p {
    font-family: 'Roboto';
    font-size: 22px;
    color: white;
    text-align: center;
    padding-top: 16px;    
}


#welcome-box:hover{
    background-color: #c57505 ;
    
}

#welcome-txt {
    width: 100%;
    max-width: 1200px;
    height: auto;
}

#welcome-txt p {
    font-family: 'open_sansregular';
    font-size: 17px;
    color: #777777;
    line-height: 24px;
    padding-top: 20px;
}

.btn {
  border: 2px solid #f69206;
  background-color: white;
  color: black;
  padding: 10px 35px;
  font-size: 16px;
  cursor: pointer;
  font-family: 'Roboto';
  margin-top: 25px;
  max-width: 200px !important;
}

/* Green */
.success {
  border-color: #f69206;
  color: #f69206;
}

.success:hover {
  background-color: #f69206;
  color: white;
}

#scroll-img {
    width: 100%;
    height: auto;
    margin: 0 auto;
    text-align: center;
}

.product-box {
    width: 100%;
    max-width: 377px;
    height: 262px;
    border: #d0c9c9 1px solid;
    float: left;
    margin: 25px 0 0 20px;
}

.product-img {
    text-align: center;
    transition: transform 0.3s ease-in-out;
}

.product-img:hover {
   opacity: 1;
   transform: scale(1.1);
}

.product-box p {
    font-family: 'Roboto';
    font-size: 17px;
    color: #334862;
    text-align: center;
    padding-top: 15px;
}

.btn1 {
  border: 2px solid #f69206;
  background-color: white;
  color: black;
  padding: 10px 35px;
  font-size: 16px;
  cursor: pointer;
  font-family: 'Roboto';
  display: block;
  margin: 35px auto;
  text-align: center;
  max-width: 200px !important;
  
}

/* Green */
.success1 {
  border-color: #f69206;
  color: #f69206;
}

.success1:hover {
  background-color: #f69206;
  color: white;
}


 
 .line {
    width: 100%;
    height: 68px;
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
 }

 #equipment-bg {
    width: 100%;
    height: 512px;
    margin: 0 auto;
    background-color: #f69206;
    margin-top: -1px;
 }

 #equipment {
    float: left;
    margin-top: 135px;
    margin-left: 35px;
 }

 #equipment-line {
    width: 100%;
    max-width: 1px;
    height: 512px;
    background-color: white;
    float: left;
    margin-left: 80px;
 }

 #equipment-rt {
    width: 100%;
    max-width: 800px;
    height: auto;
    float: left;
    margin-left: 30px;
 }

 #equipment-rt p {
    font-family: 'Roboto';
    font-size: 17px;
    color: white;
    line-height: 26px;
    padding-top: 35px;
 }

 #quality {
    width: 100%;
    max-width: 750px;
    height: auto;
    float: left;
    margin-top: 40px;
 }

 #quality p {
    font-family: 'Roboto';
    font-size: 18px;
    color: #665b5b;
    line-height: 28px;
    font-weight: bold;
    letter-spacing: 0.5px;
    padding-top: 20px;
 }

 #quality-line {
    width: 100%;
    max-width: 1px;
    height: 270px;
    background-color: #ececec;
    float: left;
    margin-left: 80px;
 }

 #quality-img {
    float: right;   
    margin-right: 30px;
 }

 #info-bg {
    width: 100%;
    height: 540px;
    margin: 0 auto;
    background-image: url(../images/info-bg.jpg);
    background-size: cover;
    overflow: hidden;
 }

 #info1 {
    width: 100%;
    max-width: 615px;
    height: auto;
    float: left;
    margin-top: 45px;
 }

 #info1 p {
    font-family: 'Roboto';
    font-size: 17px;
    color: black;
    line-height: 30px;
    letter-spacing: 1px;
    padding-top: 20px;
 }

 #info-line {
    width: 100%;
    max-width: 113px;
    height: 3px;
    background-color: black;
 }

 #call {
    margin-top: 15px;
 }

 #info-line2 {
    width: 100%;
    max-width: 1px;
    height: 428px;
    background-color: white;
    float: left;
    margin-top: 55px;
 }

 #contact-form {
    width: 100%;
    max-width: 520px;
    height: auto;
    float: left;
    margin-top: 75px;
    margin-left: 55px;
 }

.row {
    display: flex;
    justify-content: space-between;
}
.row input {
    width: 48%;
}
input, textarea {
    width: 100%;
    padding: 13px;
    margin: 15px 0;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-family: 'Roboto';
    font-size: 16px;
}
button {
    background: #066aab;
    color: white;
    padding: 10px;
    border: none;
    cursor: pointer;
    width: 100%;
    font-size: 17px;
    font-family: 'Roboto';
    border: 1px solid #066aab;
}
button:hover {
    background: #055589;
    border: 1px solid #055589;
}

#testimonials-bg {
    width: 100%;
    height: 465px;
    margin: 0 auto;
    background-color: #fdedd5;
}

#bottom-info-bg {
    width: 100%;
    height: 342px;
    margin: 0 auto;
    background-color: #424242;
}

#bottom-info {
    width: 100%;
    max-width: 380px;
    height: auto;
    float: left;
    margin-top: 30px;
}

#bottom-info p {
    font-family: 'Roboto';
    font-size: 16px;
    color: white;
    line-height: 24px;
    padding-top: 20px;
}

#bottom-line {
    margin-top: 10px;
}

#bottom-products {
    width: 100%;
    max-width: 378px;
    height: auto;
    float: left;
    margin-top: 30px;
    margin-left: 40px;
}

#bottom-products ul {
    list-style-type: none;
}

#bottom-products ul li {
    font-family: 'Roboto';
    font-size: 16px;
    color: white;
    line-height: 28px;
    padding-top: 11px;
    border-bottom: 1px #515151 solid
}

#bottom-products ul li a {
    color: white;
}

#bottom-products ul li a:hover {
    color: #d2d2d2;
}

#bottom-contact {
    width: 100%;
    max-width: 330px;
    height: auto;
    float: left;
    margin-top: 30px;
    margin-left: 40px;
}

#bottom-contact p {
    font-family: 'Roboto';
    font-size: 16px;
    color: white;
    line-height: 24px;
    padding-top: 20px;
}

#footer-bg {
    width: 100%;
    height: 62px;
    margin: 0 auto;
    background-color: #5b5b5b;
}

#footer-lft {
    float: left;
}

#footer-lft p {
    font-family: 'Roboto';
    font-size: 15px;
    color: #a9a9a9;
    padding-top: 25px;
}

#footer-rt {
    float: right;
}

#footer-rt p {
    font-family: 'Roboto';
    font-size: 15px;
    color: #a9a9a9;
    padding-top: 25px;
}



.about-box {
    z-index: 9999;
    position: absolute;
    margin-top: -140px;
}

.about-line {
    margin-top: 20px;
}

.about-bg {
    width: 100%;
    height: auto;
    margin: 0 auto;
    background-color: #666666;
    overflow: hidden;
    margin-top: -3px;
}

.about-txt {
    width: 100%;
    max-width: 782px;
    height: auto;
    float: left;
}

.about-txt p {
    font-family: 'Roboto';
    font-size: 16px;
    color: white;
    line-height: 26px;
    text-align: justify;
    padding-top:55px;
    padding-bottom: 50px;
}

.about-img {
    float: right;
    margin-top: 55px;
    width: 100%;
    max-width: 370px;
}

.about-img p {
    font-family: 'Roboto';
    font-size: 16px;
    color: white;
    line-height: 26px;
    text-align: justify;
    
}

.news {
    width: 100%;
    max-width: 550px;
    height: auto;
    float: left;
}

.news p {
    font-family: 'Roboto';
    font-size: 16px;
    color: white;
    line-height: 45px;
    text-align: justify;
    padding-top: 55px;
    padding-bottom: 100px;
}



#equipment-nxtpage {
    width: 100%;
    max-width: 1200px;
    height: 500px;
    margin: 0 auto;
    background-color: #fff;
    margin-top: 50px;
    margin-bottom: 70px;
    border-radius: 30px;
}

@keyframes slide {
  0%, 25% {
    transform: translateX(0%);
  }
  33%, 58% {
    transform: translateX(-33.3333%);
  }
  66%, 91% {
    transform: translateX(-66.6666%);
  }
  100% {
    transform: translateX(0%);
  }
}