body{
    font-family: 'HONOR Sans World','HONOR Sans Brand','Honor Sans Custom','PingFang SC',Arial;
  }
.hero-image-participacion {
    background-image: url(../img/fondo-participacion.jpg) !important;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
    position: relative;
}
.card{
    border: none !important;
    border-color: 0 !important;
    background-color: #ffffffbc !important;
    margin-bottom: 50% !important;
    border-radius: 2rem !important;
}
.custom-text{
        font-size: 20px;
    }
.custom-title{
    font-size: 2rem !important;
    line-height: 1.1;
}
a{
    text-decoration: none !important;
    color: #000000 !important;
}
.vertical{
    display: flex;
    align-items: center;
  }
  .hero-image-participacion .container-fluid:first-child {
    flex: 1 0 auto;
}
.img-referencial {
    margin-top: auto;
    width: 100%;
    opacity: 0.7;
}
.img-referencial img {
    display: block;
    height: auto;
}
.custom-icon{
    max-height: 20px;
}
.gracias{
    margin-top: 6%;
}
/*- banner participacion -*/
.container-banner{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 138px;
    width: 98vw;
    margin-left: auto;
    margin-right: auto;
}
.box-banner{
    z-index: 2;
    width: 100% !important;
    height: 100%;
}
.banner-element{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.banner-img{
    width: 100%;
    height: 100%;
    max-height: 95%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.banner-img img {
    max-width: 90%;
    max-height: 90%;
    width: auto;
    height: auto;
    object-fit: contain;
}
  /*---------- INICIO CAMBIO DE FONDO DISEÑO MOBILE ----------*/
@media (min-width: 576px) {
     .custom-title {
        font-size: 3rem !important;
    }
    .container-banner {
        margin-top: 175px;
        width: 90vw;
    }
    .custom-icon{
        max-height: 30px;
    }
    .custom-text{
        font-size: 20px;
    }
}
@media (min-width: 768px) {
     .custom-title {
        font-size: 4rem !important;
    }
    .container-banner {
        margin-top: 175px;
        width: 85vw;
    }
    .custom-icon{
        max-height: 35px;
    }
    .custom-text{
        font-size: 22px;
    }
}
@media (min-width: 992px) {
     .custom-title {
        font-size: 4rem !important;
    }
    .container-banner {
        margin-top: 175px;
        width: 65vw;
    }
    .custom-icon{
        max-height: 35px;
    }
    .custom-text{
        font-size: 25px;
    }
}