*{padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: sans-serif;}

#products_header{display: grid; 
               justify-content: center;
               border: 1px solid rgba(0, 0, 0, 0.1);
               padding: 10px;
             background: linear-gradient(to bottom,#123, #023, teal);
              color: white;
             text-shadow:  3px 2px black;}

#products_header h4{line-height: 25px;
                    padding: 10px;
                   word-spacing: 1.6px;}

#products_header button{ 
                           border: 1px solid teal;
                           box-shadow: 0 2px 4px 0 rgba(0,0,0,0.5);
                           outline: none;
                           padding: 15px 7px;
                           color: white;
                           background: #058;
                           border-radius: 4px;
                           display: grid;
                           cursor: pointer;
                           font-size: 16px;
                           margin-top: 5px;
                          margin: 0 auto;}

#products_btn_wrapper{padding: 5px;
                  display: grid;
                  grid-template-columns: repeat(auto-fill,minmax(8rem,1fr));
                  grid-gap: 5px;}


#products_btn_wrapper button{ float: right;
                           border: 1px solid teal;
                           outline: none;
                           padding: 5px 7px;
                           color: white;
                           background: #058;
                           border-radius: 4px;
                           display: grid;
                           cursor: pointer;
                           margin-top: 5px;}

 #products_wrapper{display: grid;
                  grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
                  padding: 2px;
               grid-gap: 8px;}

#products_wrapper section{padding: 10px;
                          border: 1px solid rgba(0, 0, 0,0.1);
                          box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
                          background: white;
                          color: black;
                          height: 100%;
                           }


#products_wrapper section .img_wrapper{
                          border: 1px solid rgba(0, 0, 0,0.1);
                          padding: 1px;
                          text-align: center;

                           }


#products_wrapper section .img_wrapper img{
                          width: 100%;
                          object-fit: cover;
                          transition: transform 1.5s, opacity 3s;
                          height:200px;
                           }


#products_wrapper section .img_wrapper img:hover{
transform:scale(1.02);
}

#products_wrapper section .product_name{
                           margin-top: 4px;
                           word-spacing: 1.6px;
                           line-height: 24px;

                           }



#products_wrapper section button{
                           text-align: right;
                           border: 1px solid teal;
                           outline: none;
                           padding: 5px 7px;
                           color: white;
                           background: #058;
                           border-radius: 4px;
                           cursor: pointer;
                           margin-top: 10px;
                           }


#products_wrapper section .product_description{
                           font-size: 15px;
                           word-wrap: break-word;
                           word-spacing: 1.6px;
                           line-height: 24px;
                           padding:5px;}

 #products_wrapper section .product_description p{margin-top: 10px;}