*{
   font-family: 'Nunito', sans-serif;
   margin:0; padding:0;
   box-sizing: border-box;
   outline: none; border:none;
   text-decoration: none;
   transition: all .2s linear;
   text-transform: capitalize;
   
}





.container{
    font-size: 42.5%;
    overflow-x: hidden;
   max-width: 11200px;
   margin:0 auto;
   padding:3rem 2rem;
   border-radius: 9px;
}

.container .title{
   font-size: 3.5rem;
   color:#444;
   margin-top: 3rem;
   text-transform: uppercase;
   text-align: center;
}

.container .products-container{
    border-radius: 9px;
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
   gap:2rem;
}

.container .products-container .product{
    border-radius: 9px;
   text-align: center;
   padding:1.4rem 3rem;
   background: #fff;
   box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);
   outline: .1rem solid #ccc;
   outline-offset: -1.5rem;
   cursor: pointer;
}

.container .products-container .product:hover{
   outline: .1rem solid #222;
   border-radius: 9px;
   outline-offset: 0;
}

.container .products-container .product img{
   height: 10rem;
}

.container .products-container .product:hover img{
   transform: scale(1.1);
}

.container .products-container .product h3{
   padding:1.5rem 0;
   font-size: 1.1rem;
   color:#444;
   border-radius: 9px;
}

.container .products-container .product:hover h3{
   color:#D2171E;
}