/*==========================
        PRODUCT CARD
===========================*/

.product-card{

border:none;
overflow:hidden;
border-radius:15px;
transition:.4s;
background:#fff;

}


.product-card:hover{

transform:translateY(-8px);
box-shadow:0px 15px 35px rgba(0,0,0,.15)!important;

}



/*==========================
      PRODUCT IMAGE
===========================*/


.product-image-box{

width:100%;
height:330px;
overflow:hidden;
position:relative;
background:#fff;
padding:15px;
border-bottom:1px solid #eee;

}


.product-image{

width:100%;
height:100%;
object-fit:contain;
transition:.5s;

}


.product-card:hover .product-image{

transform:scale(1.08);

}



/*==========================
      PRODUCT TITLE
===========================*/


.product-title{

font-size:20px;
font-weight:700;
margin-bottom:15px;
line-height:28px;
min-height:60px;

}



/*==========================
       DESCRIPTION
===========================*/


.product-desc{

font-size:14px;
line-height:25px;
color:#666;
min-height:60px;

}



/*==========================
        PRICE
===========================*/


.text-danger{

font-weight:700;

}


.text-success{

font-weight:600;

}


del{

color:#777;
margin-right:10px;

}



/*==========================
         BADGES
===========================*/


.badge-top{

position:absolute;
top:15px;
left:15px;
padding:8px 15px;
font-size:12px;
z-index:10;

}


.badge-new{

position:absolute;
top:15px;
right:15px;
padding:8px 15px;
font-size:12px;
z-index:10;

}



/*==========================
        STOCK
===========================*/


.badge{

padding:8px 15px;
font-size:13px;
border-radius:30px;

}



/*==========================
        BUTTON
===========================*/


.btn-dark{

padding:12px;
font-size:16px;
font-weight:600;
border-radius:50px;
transition:.4s;

}


.btn-dark:hover{

background:black;
letter-spacing:1px;

}



/*==========================
        CARD BODY
===========================*/


.card-body{

padding:20px;

}


.card-body p{

margin-bottom:8px;
font-size:15px;
color:#555;

}


.card-body strong{

color:#111;

}



/*==========================
        PRODUCT HEADING
===========================*/


h2{

font-weight:800;
margin-bottom:15px;

}


h5{

font-weight:700;

}



/*==========================
      MOBILE RESPONSIVE
===========================*/


@media(max-width:992px){


.product-image-box{

height:300px;

}


.product-title{

font-size:18px;

}


}



@media(max-width:768px){


.product-image-box{

height:280px;

}


.product-title{

font-size:17px;
line-height:25px;

}


.card-body{

padding:15px;

}


.btn-dark{

font-size:15px;

}


}




@media(max-width:576px){


.product-image-box{

height:260px;

}


.product-title{

font-size:16px;
min-height:auto;

}


.product-desc{

font-size:13px;
line-height:22px;

}


.card-body p{

font-size:14px;

}


.btn-dark{

padding:10px;
font-size:14px;

}


.badge{

font-size:11px;

}


}



/*==========================
        IMAGE SUPPORT
===========================*/


img{

max-width:100%;

}



/*==========================
      PRODUCT EFFECT
===========================*/


.product-card:hover .btn-dark{

background:#dc3545;
border-color:#dc3545;

}



/*==========================
      SHADOW EFFECT
===========================*/


.shadow{

box-shadow:0 10px 25px rgba(0,0,0,.08)!important;

}



/*==========================
        SEARCH TITLE
===========================*/


.text-center{

font-weight:700;

}



/*==========================
        EXTRA EFFECT
===========================*/


.product-card::before{

content:"";
position:absolute;
width:100%;
height:4px;
background:#dc3545;
top:0;
left:0;
transform:scaleX(0);
transition:.5s;

}


.product-card:hover::before{

transform:scaleX(1);

}