@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap');
*{
  margin:0;
  padding:0;
}
.container-cprod{
    background-color:#A89495;
    min-height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
}
.card-cprod{
    height: 361px;
    width: 230px;
    box-shadow: 5px 7px 10px 6px rgb(0 0 0 / 27%);
    background-color:#fff;
    border-radius:10px;
    font-family: 'Poppins', sans-serif;
    overflow:hidden;
    position:relative;
    padding:0 !important;
}




/*ICONS - CART*/

.tocart-cprod{
    background-color: #c55a11;
    z-index: 1;
    position: absolute;
    top: 185px;
    right: -201px;
    padding: 4px 0px;
    width: 63px;
    margin: 0;
    border-radius: 6px;
    text-align: center;
    transition: all 0.5s;
    cursor: pointer;

    

}

.tocart-cprod i{
    font-size:16px;
    color:white;
}

.card-cprod:hover .tocart-cprod{
    right: 22px;
}
@keyframes added-tocart {
    0%   {background-color:#c55a11;}
    50% {background-color:#6d320a;}
   100% {background-color:#c55a11;}
  }
.tocart-cprod-added{
    animation-name: added-tocart;
    animation-duration: 0.5s;
    
}

/*ICONS - HEART*/
.heart-cprod{
    z-index:1;
    position:absolute;
    top:-60px;
    right:10px;
    transition:all 0.5s;
    cursor: pointer;
}
.heart-cprod i{
    font-size:22px;
    color:rgb(206, 206, 207);
}

.heart-red{
   color:red !important;
}

.card-cprod:hover .heart-cprod{
    top:10px;
}


/*------------------*/
.top-div{
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
}
.top-div .border{
    margin: 2px 2px;
    padding: 1vh;
    width: 200px;
    border-radius: 4px;
    height: 200px;
    box-shadow: 6px 7px 3px 1px rgb(0 0 0 / 27%);

}
.top-div img{
   width:100%;
   height:100%;
   object-fit:cover
}
.top-div span{
    height:28px;
    width:60px;
    background-color:#124FEB;
    color:#fff;
    position:absolute;
    top:185px;
    left:20px;
    border-radius:4px;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:15px;
}
.bottom-div{
    display:flex;
    flex-direction:column;
    padding:20px;
}
.bottom-div p{
    font-size:13px;
    color:#A89495;
}
.last-section{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0px 20px;
}
.fa-shopping-bag{
    font-size:25px;
    color:blue;
}
.fa-comment-o{
     font-size:25px;
    color:blue;
    margin-left:10px;
}

.buttons-cprod button{
    height:30px;
    width:80px;
    color:blue;
    border:2px solid blue;
    background-color:#fff;
    font-size:13px;
    border-radius:3px;
    transition:all 0.5s;
}
.buttons-cprod:hover button{
    color:white;
    background-color:blue;

}

.buttons-vermas{
    padding: 10px;
    position: absolute;
    bottom: 0;

}

.vermas-link{
    color: #c55a11 !important;

}

.prod-title{
    color: black !important;
    margin: 0 0 0 0;
}
.prod-marca{
    color: #c55a11 !important;
    margin: 0;
    font-size: 12px;
}
.prod-desc{
    font-size: 10px !important;
}

.sticky{

    position: fixed;
    top: 0px;
    width: 100%;
    z-index: 100;
}
main{
    margin-top: 23vh;
}
@media (max-width: 459px) {
   

    .card-cprod{
        height: 200px;
        width: 95%;
        margin-bottom: 0px !important;
        display: inline-flex;
        
    }


    .card-cprod:hover .tocart-cprod {
        right: 33px;
        top: 160px;
    }

    .top-div span {

        top: 167px;
        right: 6px;
        left: unset;
    }
  }