:root{
    --main-yellow:#F5CE00;
    --main-blue:#113C71;
    --yellow:rgba(245,206,0,0.7);
}

body{
    box-sizing: border-box;
    margin:0;
    padding:0;
}
body,html,.my-main-wrapper{
    font-size:18px;
    font-family: 'Poppins', sans-serif;
}
.my-main-wrapper h1{
    font-size:2.5rem;
    margin:0;
    padding:0;
}
.my-main-wrapper h2{
    font-size:1.8rem;
    margin:0;
    padding:0;
}
.my-main-wrapper h3{
    font-size:1.5rem;
    margin:0;
    padding:0;
}
.highlight{
    font-weight:700;
    color:var(--main-blue);
}
.maincontent{
    max-width:100%;
    padding:0;
    margin:0;
}
.maincontent_wrapper{
    padding-top:0;
}
.my-main-wrapper img{
    width:100%
}
.mt{
    margin-top:10px;
}
.my-container{
    max-width:90%;
    padding:0 2%;
    margin:0 auto;
}

img{
    width:100%;
}
.main-heading{
    /* font-weight:200;  */
    text-transform:uppercase;
}

hr{
  max-width:70%;
  margin:50px auto;
  border: 0; 
  height: 1px; 
  background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
}

#product-hero{
    background-image: 
    linear-gradient(rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.4) 100%),
     url('/imageserver/Reusable/duradek23/duradek-hero.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding:2%;
    min-height:50vh;
    text-align: center;
    color:#fff;
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
#product-sec1{
    margin:0 auto;
    padding:2%;
    background-image: url('/imageserver/Reusable/duradek23/worker.png');
    background-repeat: no-repeat;
    background-position: 90% 30%;
}
#product-sec1 ul{
    max-width:60%;
}
.sample-image{
    max-width:600px;
}
#siding-group{
    display:flex;
    flex-direction: row;
    justify-content: space-evenly;
    flex-wrap:wrap;
}
#product-sec2{
    text-align: center;
    padding:2%;
}

.highlight{
    font-weight:700;
}
.swatches{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    margin:0 auto;
}
.swatches a{
    color:var(--main-blue);
    text-decoration: none;
}
.color-swatch-box {
    max-width:150px;
    margin:5px;
    cursor:pointer;
    transition:.3s;
    text-align: center;
}
.color-swatch-box:hover{
    transform:scale(1.5);
    transition:.3s;
}
.product-specs{
    text-align:left;
    margin-left:30px;
}

@media screen and (max-width:1200px) {
    .color-picker{
        display:block;
    }
    @media screen and (max-width:992px) {
        .my-container{
            text-align: center;
        }
        #product-sec1 ul {
            max-width: 100%;
            list-style-type: none;
        }
        #product-sec1{
            margin:0 auto;
            padding:2%;
            background-image:  
            url('/imageserver/Reusable/duradek23/durarail-main.png');
            background-repeat: no-repeat;
            background-position: 90% 50%;
            background-size:0%;
        }
    }
}