@import './config.css';
@import './style.css';

/**/

.product_container{
    display: flex;
    flex-wrap: wrap;
    gap:1.5rem;
}

.product__container__box{
    display: flex;
    flex: 1 1 30rem;
    padding: 1rem;
    max-width: 100%;
    flex-direction: row;
    box-shadow: 0 0 10px 5px rgb(221 221 221);
    border-radius: 15px;
}

.product__container__box img{
    object-fit: scale-down;
    z-index: -5;
    height: 38rem;
}

.product__container__box-info{
    display: grid;
    padding: 1em;
    /*box-shadow: 0 0 10px 5px rgb(221 221 221);*/
    /*border-radius: 15px;*/
}

.product__container__box-info h3{
    margin-top: 4rem;
    
}


.product__container__box-info a{
    top: 50%;
    border-radius: 10px;
    margin: 1rem;
    height: 4rem;
    font-size:2rem;
}

.product__container__box-btn{
    display: flex;
    margin: 1rem 0rem 4rem 0rem;
    max-height: 6rem;
    flex-direction: column;
    flex-wrap: wrap;
}

.product__container__btn {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

.product__container__box h3{
  color:var(--black);
  font-size: 2rem;
}

.product__container__box-btn a:nth-child(1){
  color:var(--black);
  font-size: 2rem;
}

.product__container__box-btn a:nth-child(1):hover{
  color:var(--orange);
  font-size: 2rem;
}


.product__container__box .price{
    padding: 0.8rem 0;
}

.product__container__box .price h2{
     font-size: 2.8rem;
    color: #000;
}

.product__container__box .price span{
    font-size: 2rem;
  color:#ff0000;
  text-decoration: line-through;
}


.product__container__box p{
  font-size: 2rem;
  white-space: pre-wrap;
}

/**/










/* media queries  */

@media(max-width:1380px){

.product__container__box-btn {
    display: grid;
}

}


@media(max-width:1320px){

.product .box-container .box-info h3{
    margin-top: 8rem;
}

.product .box-container .box-info p{
  margin-top: 0rem;
}

  .product__container__box{
    display: flex;
    flex-direction: column;
    flex: 1 1 30rem;
    padding: 1rem;
    max-width: 100%;
    box-shadow: none;
}
  
.product__container__box-info {
    display: grid;
    padding: 1em;
    box-shadow: 0 0 10px 5px rgb(221 221 221);
    border-radius: 15px;
}

}

@media(max-width:1200px){

  html{
    font-size: 55%;
  }

}

@media(max-width:450px){

  html{
    font-size: 50%;
  }