@font-face {
    font-family: 'metropolisB';
    src: url('./fonts/metropolis/Metropolis-Bold.otf') format('opentype');
}

@font-face {
    font-family: 'metropolisL';
    src: url('./fonts/metropolis/Metropolis-Light.otf') format('opentype');
}

@font-face {
    font-family: 'metropolisM';
    src: url('./fonts/metropolis/Metropolis-Medium.otf') format('opentype');
}

.imgBanProTi {
    height: 40vh;
    content: url('../../medios/productosTienda/banner-productos-tiendas.webp');
}

.carousel-captionPT {
    position: absolute;
    text-align: center;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    top: 60%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.titleProdTie {
    text-align: center;
    font-size: 142px;
    font-family: 'metropolisB';
    letter-spacing: 28.4px;
    color: #E4E021;
    margin-bottom: -25px;
}

.titBlog {
    text-align: center;
    font-size: 25px;
    font-family: 'metropolisB';
    color: #38552C;
}

.contBlo {
    text-align: left;
    font-size: 25px;
    font-size: 'metropolisM';
    color: #ABA9A9;
}

.fechaBlog {
    text-align: center;
    font-size: 25px;
    font-family: 'metropolisB';
    color: #5A5A5A;
    margin: 5px 0px;
}

.backVerCla {
    background: #91B804 0% 0% no-repeat padding-box;
}

.backVerCla.heFo {
    height: 25rem;
    margin-top: 45px;
}

.cont6 h3 {
    text-align: center;
    font-size: 25px;
    font-family: 'metropolisM';
    color: #FFFFFF;
    line-height: 38px;
}

.btnBlog {
    background: transparent linear-gradient(180deg, #E27A1D 0%, #713D0F 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 14px;
    text-align: center;
    font-size: 32px;
    font-family: 'metropolisL';
    color: #FFFFFF;
    border: none;
    padding: 0px 75px;
}

.contFo,
.contImgF {
    position: relative;
}

.contImgF img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -21%);
}

.contImgF img {
    display: block;
}

/******************Energía del futuro*****************************/

.imgBlog1 {
    height: 55vh;
    content: url('../../medios/blog/bateriesRe/la-energia-del-futuro.webp');
}

.titleBlogEn {
    text-align: center;
    font-size: 126px;
    font-family: 'metropolisB';
    letter-spacing: 25.2px;
    color: #E4E021;
    margin-bottom: -10px;
}

.subBlogEn {
    text-align: center;
    font-size: 93px;
    font-family: 'metropolisL';
    letter-spacing: 18.6px;
    color: #E4E021;
}

.titleContBlog {
    text-align: center;
    font-size: 57px;
    font-family: 'metropolisB';
    color: #38552C;
}

.titleContBlog.EnMb {
    margin-bottom: -5px;
}

.cont1 {
    margin: 30px 0px 45px;
}

.cont1 h3,
.cont2 h3,
.cont3 h3,
.cont4 h3,
.cont5 h3 {
    text-align: left;
    font-size: 25px;
    font-family: 'metropolisL';
    color: #5A5A5A;
    line-height: 38px;
}

.cont2 h3 span,
.cont3 h3 span,
.cont4 h3 span,
.cont5 h3 span {
    text-align: left;
    font-size: 40px;
    font-family: 'metropolisB';
    color: #293A45;
}

.cont1 h3 .negritas,
.cont2 h3 .negritas,
.cont3 h3 .negritas,
.cont4 h3 .negritas,
.cont5 h3 .negritas {
    font-weight: 900!important;
    font-family: 'metropolisB'!important;
}

.cont3 h3 .sub {
    text-align: left;
    font-size: 30px;
    font-family: 'metropolisB';
    color: #293A45;
}

.nivBat {
    display: flex;
    justify-content: flex-end;
}

.rcBat {
    display: flex;
    justify-content: center;
    margin: 3rem 0px;
}

.cont4 .teBl,
.cont4 .teBl span {
    color: #FFFFFF !important;
}

.cont4 .teBl span {
    margin-bottom: 10px;
}

.marL {
    margin: 2.5rem 0rem;
}

.mG {
    margin: 2.5rem 0px;
}

.escondido {
    display: block;
}
@media screen and (max-width:1366px){
    .imgBlog1 {
        height: 60vh;
    }
}
@media screen and (max-width:1024px) {
    .titleProdTie {
        font-size: 100px;
        letter-spacing: 20.4px;
    }

    .imgBlog1 {
        height: 35vh;
    }

    .titleBlogEn {
        font-size: 105px;
        letter-spacing: 17.2px;
        margin-bottom: -40px;
    }

    .subBlogEn {
        font-size: 85px;
        letter-spacing: 13.6px;
    }

    .titleContBlog {
        font-size: 45px;
    }

    .cont2,
    .cont3 {
        padding: 35px 40px;
    }

    .contImgF img {
        display: none;
    }

    .imgbic img {
        display: none;
    }

}

@media screen and (max-width:768px) {
    .titleProdTie {
        font-size: 80px;
        letter-spacing: 13.4px;
    }

    .titleBlogEn {
        font-size: 80px;
        letter-spacing: 12.2px;
    }

    .subBlogEn {
        font-size: 75px;
        letter-spacing: 4.6px;
    }

}

@media screen and (max-width:468px) {
    .imgBlog1 {
        height: 35vh;
        content: url('../../medios/blog/bateriesRe/la-energia-del-futuro-movil.webp');
    }

    .titleBlogEn {
        font-size: 45px;
        letter-spacing: 8.2px;
        margin-bottom: -13px;
    }
    .titleContBlog.EnMb {
        margin-bottom: 0px;
        line-height: 30px;
    }
    .subBlogEn {
        font-size: 40px;
        letter-spacing: 1.6px;
    }

    .cont1 {
        margin: 0px 0px 20px;
    }

    .titleContBlog {
        font-size: 25px;
        line-height: 30px;
    }

    .backVerCla.heFo {
        height: 35rem;
    }

    .btnBlog {
        font-size: 18px;
        padding: 0px 40px;
    }

    .cont3 h3 .sub {
        font-size: 25px;
    }

    .cont2 h3 span,
    .cont3 h3 span,
    .cont4 h3 span,
    .cont5 h3 span {
        font-size: 25px;
    }

    .cont1 h3,
    .cont2 h3,
    .cont3 h3,
    .cont4 h3,
    .cont5 h3 {
        font-size: 20px;
        line-height: 30px;
    }

    .mG {
        margin: -0.5rem 0px;
    }
    .rcBat {
        margin: 2rem 0px 0rem;
    }
    .cont2,
    .cont3 {
        padding: 25px 40px 0px;
    }

    .escondido {
        display: none;
    }

    .backVerCla.heFo {
        height: 30rem;
        margin-top: 0px;
    }
    .fechaBlog {
        font-size: 15px;
        margin: 5px 0px;
    }
}

@media screen and (max-width:280px) {
    .titleBlogEn {
        font-size: 30px;
        letter-spacing: 3.2px;
        margin-bottom: -13px;
    }

    .subBlogEn {
        font-size: 25px;
        letter-spacing: 0.6px;
    }

    .titleContBlog {
        font-size: 25px;
    }

    .cont1 h3,
    .cont2 h3,
    .cont3 h3,
    .cont4 h3,
    .cont5 h3 {
        font-size: 15px;
    }

    .cont2 h3 span,
    .cont3 h3 span,
    .cont4 h3 span,
    .cont5 h3 span {
        font-size: 25px;
    }

    .cont6 h3 {
        font-size: 20px;
        line-height: 30px;
    }

    .btnBlog {
        padding: 0px 20px;
    }

    .backVerCla.heFo {
        height: 30rem;
    }

}