.padding-2{
    padding: 20px 90px;
}
.font-small{
    font-size:1.8rem;
}
.text__small,
.text__medium{
    font-size:3.8rem;
}

/* background*/
.bg-diagonal:before{
    background: linear-gradient(167deg, rgba(188, 19, 57, 0) 70%,var(--orange) 40%);
}

/* buttom border*/
.button-border{
    font-size: 2.3rem;
}

/*espacios*/
.text-spacing{
    letter-spacing: -3px;
}
.grid1-3{   
    grid-template-areas: auto auto auto;
    grid-template-columns: repeat(3,calc(33.3%));
}
.flex-columns{
    flex-wrap: wrap;
    flex-direction: row;
}

/* navbar */
.navbar__container{
    min-width: 768px;   
}

/* logo */
.logo{
    width: 500px;
    padding:0 30px;
} 
    .logo__name{
        width:390px;
    } 

/* nav toggle  */
.nav__toggle{
    right: 30px;       
}

/*=====================
     Slider Header
========================*/

.slideshow,
.slideshow .owl-carousel,
.slideshow__item{
        height: 450px;     
        
}
.slideshow__content__text{
    font-size: 1.8rem;  
}
.slideshow__arrow{
    font-size: 5rem;
}
/* slideshow image */
.slideshow__image{
    height: 450px; 
}
.slideshow__image::before{
    height: 450px;
}
/* main-content */
.main-content{
    position: relative;
    top: -1px;
}
.area-container{  
    display: flex;  
    flex-wrap: wrap;
    justify-content: space-around;
}

/* service card */
.service__card{
    width:calc(32%);
    height: 330px;
}
    .service__card__header{
        height: 90px;
    }
    .service__card__content{
        height: 160px;
    }

    /* area images */
.area__images{
    width:calc(50% - 10px);
    padding: 10px;
}
.area__image__about{
    width:calc(50% - 10px);
    padding: 10px;
    margin-bottom: 10px;
}
/* banner */
.area__banner{
    height: 200px;
}
    .area__banner__image{ 
        width:100%;       
        min-width: 768px;
    }   
        .area__banner__img{
            width:100%;
            object-fit: cover;
            object-position: center center;
        }

/* ===  Banner Mascarilla   === */
.area__banner2{
    height: 200px;
    z-index: -2;
    background-color:#e7e7e7;
}   
    .area__banner2:before{
        background: linear-gradient(120deg, rgba(188, 19, 57, 0) 45%,var(--green) 10%);
    }
    .area__banner__img2{
        object-fit: contain;
        object-position: -80px;
    }
    .area__banner__text{
        font-size:1.5rem;
        transform: translateY(-15px);
    }
    .area__banner2 .area__tittle{
        position: absolute;
        width:50%;
        top:10%;
        right: 5%;
    }
    .area__banner2 .area__text{
        position: absolute;
        width: 50%;
        top:75%;
        right: 5%;
        font-size:2rem;
    }
/* area category */
    .category-grid__left{
        grid-template-areas: 	'header container'
                                'buttom container';
        grid-template-columns: 25% 75%;    
        align-items: center;
    }
    .category-grid__right{
        grid-template-areas: 	'container header'
                                'container buttom';
        grid-template-columns: 75% 25%;    
        align-items: center;
    }
.area__category__content{
    flex-direction: row;
    flex-wrap: wrap; 
}
    .area__cateogry__content__icon{
        width:160px;
    }

/* area container */
.area__container__box{
    width:90%;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    justify-content: space-around;
}
.area__container__content{
    width: calc(50% - 20px);

}
.area__container__image{
    height: 100%;
    margin: 0;
}
.area__container__image{
    width: 80%;
    padding: 10px;
    margin: auto;
}
.area__container__image__img{
    width: 100%;
    margin: 0;
    padding: 0;
    object-fit: contain;
}

/*=====================
    area section
========================*/
.area__section__image{
    height: 330px;
}
.area__icon{
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-around;
}
.area__section__mini-banner{   
    width: calc(50% - 20px);
    height: 170px;
    margin: 10px;
}
/* card maquina */
.area__section__card{
    width:550px;
    height:510px;
    grid-template-areas:    'cd-content cd-image'
                            'cd-buttom       cd-image' ;
    grid-template-columns: 260px 280px;
    grid-template-rows: 430px 70px;
    gap:10px;
    margin: 10px;
    
}
.card__content{
    grid-area: cd-content; 
    padding: 10px;
}
.card__image{
    grid-area: cd-image;
}
   .card__image__img{
       margin: 10%;
   }
.area__buttom{
    grid-area: cd-buttom;
}

/*=====================
    sliders productos
========================*/
.area__scroll__horizontal{
    width: 80%;
    margin: auto;
 }
    .card-game{
        position: relative;
        width: 260px;
        height: 260px;
    }
    .card-product{
        width: 265px;
    }
/*=====================
        pop Up
========================*/
.area__popup__container{
    display: flex;
    width: 600px;  
    height: 400px;	
}
.popup__img{
    width: 250px;
    height: 100%;
    object-fit: cover;
    border-radius: 20px 0 0 20px ;
}
.popup__close{
    top: 10px;
    right: 20px;    
}
/*=====================
        TAB
========================*/
.area__tab__item{
    flex-direction: row;
}

/*=====================
    formulario contacto 
========================*/
.contact__columns{
    display: flex;
    width:90%;
    margin: auto;
}
.contact-sticky{
    width:calc(50% - 20px);
}
   
.area__contacto{
    width:calc(50% - 20px);
}


/* formulario contacto */
.area__contact__info{
    width:100%;
}