/********************************************
Componente: Inicio > banner categorias
*********************************************/

.bs-categories{
    margin-top:1rem;
    margin-bottom:1rem;
}

.bs-categories__item{
    overflow:
    hidden;
    display:
    flex;
    align-items:
    center;
    justify-content:
    center;
    flex-direction:
    column;
    border-radius:
    var(--default-border-radius,0);
    height:100%;
    background: var(--footer-bg-color);
    padding:1rem;
}
.bs-categories__item:hover{
    opacity:0.6;
    transition:.3s
}
.bs-categories .btn{
    font-size:1em;
    margin-top:1rem;
}
.bs-categories__title{
    font-weight: var(--font-regular);
    text-align:
    center;
    color: white;
    font-size: 0.9rem;
    padding-top:1rem;
    margin:0;
    display:
    flex;
    height:100%;
}


@media screen and (min-width:576px){
   .bs-categories{font-size: var(--title-size-sm,var(--title-size,.75rem));}
}
@media screen and (min-width:768px){
   .bs-categories{font-size: var(--title-size-md,var(--title-size-sm,var(--title-size,.75rem))); }
}
@media screen and (min-width:992px){
   .bs-categories{font-size: var(--title-size-lg,var(--title-size-md,var(--title-size-sm,var(--title-size,.8rem)))); }
}
@media screen and (min-width:1200px){
   .bs-categories{font-size: var(--title-size-xl,var(--title-size-lg,var(--title-size-md,var(--title-size-sm,var(--title-size,.85rem)))));}
}


/* banner de coleccion */

.bs-banners{
    margin:  calc(var(--gap,1rem)/2 * -1) ;
    padding-bottom: var(--gap,1rem);
}
.bs-banners__item{
    padding:calc(var(--gap,1rem)/2);
}

.bs-banners__picture{
    border-radius: var(--default-border-radius);
    overflow:hidden;
    display:block;
}
.bs-banners__picture:hover{
   transform: scale(1.02);
   transition: 0.8s ease;
}