html {
    scroll-behavior: smooth;
  }
*{
    margin: 0;
    padding: 0;
    font-family: Roboto Slab;
    
    
}
button:focus {
    outline: 0px;
}
.buttons button:focus{
    outline: 0px;
    }
    nav {
        display: flex;
        background-color: #64524B;
        /* border: 2px solid black; */
    
    }
    
    .navbar-nav {
        /* border: 2px solid black; */
        
        width: 100%;
        left: 0;
        display: flex;
        justify-content: center;
        
        
    }
    .form-group label {
        font-family: Roboto Slab;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 116.88%;
        /* or 16px */
        
        
        color: #444444;
        
     }
     .form-group input {
        border: 1px solid rgba(0, 0, 0, 0.13);
        box-sizing: border-box;
        border-radius: 7px;
        padding: 25px 10px 25px 10px;
     }
     .form-group input::placeholder {
        font-family: Roboto Slab;
        font-style: normal;
        font-weight: 500;
        font-size: 12px;
        line-height: 116.88%;
        /* identical to box height, or 14px */
        
        
        color: #BCBCBC;
     }
     .form-group textarea::placeholder {
        font-family: Roboto Slab;
        font-style: normal;
        font-weight: 500;
        font-size: 12px;
        line-height: 116.88%;
        padding: 0 10px 25px 0;
        /* identical to box height, or 14px */
        
        
        color: #BCBCBC;
     }
    .nav-item a{
        font-family: Roboto Slab;
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 21px;
        color: #E1E1E1;

    }
    .nav-link:hover {
        color: white;
    }
    .navbar button:focus {
        outline: none;
    }
    .dropdown-menu li{
        padding: 5px 20px 5px 20px;
    }
    .dropdown-menu li a {
        color: #525252;
    }
.icon {
    position: absolute;
    right: 1%;
}
.active-product {
    color: #FAF3E0;
    padding-bottom: 3px;
    border-bottom: 1px solid #FAF3E0;
}
.test{
    padding: 70px 0 70px 0;
    
    background-color: #7D675F;
}
.heading {
    font-family: Roboto Slab;
    font-style: normal;
    font-weight: bold;
    font-size: 42px;
    line-height: 116.88%;
    /* identical to box height, or 49px */


    color: #FAF3E0;
}
.pagination {
    display: flex;
    justify-content: center;
    padding: 30px 0 30px 0;
}
.pagination>.col-4>.row {
    display: flex;
    align-items: center;
}
.pagination>.col-4>.row>.col-4 span {
    font-family: Roboto Slab;
font-style: normal;
font-weight: bold;
font-size: 18px;
line-height: 116.88%;
/* identical to box height, or 21px */


color: #8B8B8B;

}
#checkClass {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    padding: 0 20px 0 20px;
    
    
}
#checkClass div {
    
    height: 45px;
    display: flex;
    align-items: center;
    
}
.cta {
    background: #FFFFFF;
    border-radius: 49px;
   border: none;
   padding: 8px 40px 8px 40px;
    font-family: Roboto Slab;
    font-style: normal;
    font-weight: 750;
    font-size: 16px;
    line-height: 21px;
    color: #64524B;
    

 }
 .products-page {
     padding: 30px 40px 0 40px;
     
 }
 .side-bar {
    background: #FFFFFF;
    box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.07), 0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0503198), 0px 22.3363px 17.869px rgba(0, 0, 0, 0.0417275), 0px 12.5216px 10.0172px rgba(0, 0, 0, 0.035), 0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0282725), 0px 2.76726px 2.21381px rgba(0, 0, 0, 0.0196802);
    border-radius: 20px;
    padding: 20px 0 50px 10px;
    position: sticky;
    top: 250px;
    /* position: relative;
    left: 40px; */
 }
 .navigation-buttons {
    position: sticky;
    top: 100px;
    background-color: #e8e8e8;
    z-index: 1;
    
 }
 .sidebar-heading {
    font-family: Roboto Slab;
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 116.88%;
    /* or 23px */
    
    
    /* Heading Colour */
    
    color: #202020;
    
 }
 .categoryImage {
    display: flex;
    align-items: center;
}
.categoryText {
   display: flex;
   align-items: center;
}
.categoryText span {
    color: #646464;

}
.individual-product {
    padding-left: 0px;
}
.product-name {
    font-family: Roboto Slab;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 21px;

color: #646464;
}
.product-description {
    font-family: Roboto Slab;
font-style: normal;
font-weight: 300;
font-size: 16px;
line-height: 21px;

color: #646464;

}
.enquiry {
    position: relative;
}
.enquiry-text {
    font-family: Roboto Slab;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 21px;
    position: absolute;
    right: 0;
    padding-right: 15px;

    color: #00917C;

}
#iron {
    display: none;
}
#aluminium {
    display: none;
}
#ceramic {
    display: none;
}
#castiron {
    display: none;
}
.cta3 {
    
    border-radius: 40px;
    padding: 10px 40px 10px 40px;
    color: white;
    border: none;
    font-family: Roboto Slab;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 21px;

    color: #FFFFFF;

 }
 @media (min-width: 1200px) {
    .navigation-buttons {
        
        top: 160px;
        
        
     }
     .side-bar {
        
        top: 280px;
        
     }
 }
 @media (max-width: 1200px) and (min-width: 992px) {
    .logo {
        width: 250px;
    }
    .navigation-buttons {
        
        top: 120px;
        
        
     }
}

 @media (max-width: 991.98px) {
    .logo {
        width: 220px;
    }
    
}
@media (max-width: 380px) {
    .logo {
        width: 160px;
     }
     .social {
        width: 20px;
    }
    .navigation-buttons {
        
        top: 80px;
        
        
     }

}