#hero_curso_v02
{
    /* padding: 20px 0; */
    font-size: 1.8rem;
    background-color: #000312;
    background-position: right center;
    background-repeat: no-repeat;
    background-size: auto min(100%, 500px);
    padding: 20px 0;
}
    #hero_curso_v02 .back_button
    {
        color: #fff;
        font-size: 20px;
        display: inline-block;
        font-family: "Libre Franklin";
        margin-bottom: 20px;
    }
    #hero_curso_v02.nivel-1
    {
        /* background-image: url(../img/cursos/1-piloto.jpg); */
    }
        #hero_curso_v02.modulo-1-fundamentos-trabajar-con-ia-como-copiloto
        {
            background: url(../img/cursos/Web-IA-Header-Curso1_new.png) no-repeat right top #000;
        }
        #hero_curso_v02.modulo-2-emails-y-comunicacion
        {
            background: url(../img/cursos/Web-IA-Header-Curso2-Difuminado_new.png) no-repeat right top #000;
        }
        #hero_curso_v02.modulo-3-reuniones-y-minutas
        {
            background: url(../img/cursos/Web-IA-Header-Curso3-Difuminado_new.png) no-repeat right top #000;
        }
        #hero_curso_v02.modulo-4-presentaciones-y-research
        {
            background: url(../img/cursos/Web-IA-Header-Curso4-Difuminado_new.png) no-repeat right top #000;
        }
    #hero_curso_v02 h3
    {
        font-size: 20px;
        font-family: "Anton";
        text-transform: uppercase;
    }
        #hero_curso_v02.nivel-1 h3
        {
            color: #99c016;
        }
        #hero_curso_v02.nivel-2 h3
        {
            color: blue;
        }
    #hero_curso_v02 h1
    {
        font-size: 40px;
        font-family: "Anton";
        text-transform: uppercase;
    }
        #hero_curso_v02.nivel-1 h1
        {
            color: #99c016;
        }
        #hero_curso_v02.nivel-2 h1
        {
            color: blue;
        }
    #hero_curso_v02 h2
    {
        color: #fff;
        font-size: 40px;
        font-family: "Anton";
        text-transform: uppercase;
    }

    #hero_curso_v02 .descripcion
    {
        color: #fff;
        font-size: 20px;
        display: inline-block;
        font-family: "Libre Franklin";
    }

#hero_curso_v02 .video
{
    padding: 20px;
    border: 1px solid #99c016;
    border-radius: 10px;
}

/* ---------------*/

#hero_curso {
    /* padding: 30px 0; */
    font-size: 1.8rem;
    margin: 0 0 60px;
}

#hero_curso h3 {
    color: #0d3378;
    font-family: "Anton", sans-serif;
    font-size: 1.5em;
}

#hero_curso .cabecera
{
    background:black; height:300px; position: relative;
    padding: 0 40px;
}
    #hero_curso .cabecera.curso_1
    {
        background: url(../img/cursos/1-piloto.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_2
    {
        background: url(../img/cursos/2-emial.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_3
    {
        background: url(../img/cursos/3-reuniones.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_4
    {
        background: url(../img/cursos/4-presentaciones.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_5
    {
        background: url(../img/cursos/5.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_6
    {
        background: url(../img/cursos/6.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_7
    {
        background: url(../img/cursos/7.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_8
    {
        background: url(../img/cursos/8.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_9
    {
        background: url(../img/cursos/9.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_10
    {
        background: url(../img/cursos/10.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_11
    {
        background: url(../img/cursos/11.jpg) no-repeat right center #000316;
    }
    #hero_curso .cabecera.curso_12
    {
        background: url(../img/cursos/12.jpg) no-repeat right center #000316;
    }

#hero_curso .box_01
{
    display:flex; flex-direction: column; align-items: flex-start; position: absolute; bottom:-10%;
    font-size: 1.5em;
}

#hero_curso .box_01 .titulo
{
    color: #fff;
    font-family: "Anton", sans-serif;
}

#hero_curso .recuadro
{
    padding:10px; display:inline-block; border-radius: 1rem; background: #AFC3DE;
    /* font-family: Verdana; */
    font-family: "Anton", sans-serif;
}

#introduccion
{
    font-size: 1rem;
}
    #introduccion .bajada
    {
        font-size: 1.5rem;
    }
    #introduccion .video
    {
        margin: 40px 0 0;
    }
    #introduccion .informacion_html
    {
        
    }
        #introduccion .informacion_html h3
        {
            color: #88c100;
        }

/* #hero_curso .container {
    max-width: 80rem;
} */

#hero_curso .curso-hero-stage {
    overflow: hidden;
    margin: 2rem 0 0;
    /* padding: 2rem 2rem 0; */
    /* border-radius: 1rem; */
    background-color: #000000;
    min-height: 300px;
}

#hero_curso .curso-hero-heading {
    display: flex;
    align-items: flex-end;
    /* min-height: 100%; */
    /* padding: 1rem 0 4rem 1rem; */
}

#hero_curso .curso-hero-kicker {
    display: inline-block;
    color: #ffffff;
    font-family: "Anton", sans-serif;
    font-size: 5.5rem;
    line-height: 0.92;
}

#hero_curso .curso-hero-visual {
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

#hero_curso .curso-hero-image {
    width: min(100%, 36rem);
    height: auto;
}

#hero_curso .curso-hero-card {
    width: min(76%, 42rem);
    margin-top: -4.5rem;
    margin-left: 1.5rem;
    padding: 2rem 2.5rem;
    border-radius: 1rem;
    background: linear-gradient(180deg, #c9d9ee 0%, #adc2de 100%);
}

#hero_curso .curso-hero-title {
    color: #0d3378;
    font-size: 4.5rem;
    font-weight: 700;
    line-height: 0.9;
}

#hero_curso .curso-hero-copy {
    margin-top: 1.75rem;
    margin-left: 1.5rem;
    color: #101010;
    font-size: 2rem;
    line-height: 1.15;
}

.accordion
{
    margin-bottom: 20px;
}
    .accordion .accordion-button
    {
        background: #99c016;
        font-size: 26px;
        font-family: "Anton", sans-serif;
        color: #000;
    }
    .accordion .accordion-body
    {
        font-size: 20px;
    }

@media (max-width: 61.99875rem) {
    #hero_curso_v02.modulo-1-fundamentos-trabajar-con-ia-como-copiloto
    {
        background-image:
            linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
            url("../img/cursos/1-piloto.jpg");

        /* background-size: cover;
        background-position: center; */

        /* background: url(../img/cursos/1-piloto.jpg) no-repeat right top #000; */
    }
    #hero_curso_v02.modulo-2-emails-y-comunicacion
    {
        background-image:
            linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
            url("../img/cursos/2-emial.jpg");

        /* background-size: cover;
        background-position: center; */

        /* background: url(../img/cursos/2-emial.jpg) no-repeat right top #000; */
    }
    #hero_curso_v02.modulo-3-reuniones-y-minutas
    {
        background-image:
            linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
            url("../img/cursos/3-reuniones.jpg");

        /* background-size: cover;
        background-position: center; */

        /* background: url(../img/cursos/3-reuniones.jpg) no-repeat right top #000; */
    }
    #hero_curso_v02.modulo-4-presentaciones-y-research
    {
        background-image:
            linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
            url("../img/cursos/4-presentaciones.jpg");

        /* background-size: cover;
        background-position: center; */

        /* background: url(../img/cursos/4-presentaciones.jpg) no-repeat right top #000; */
    }

    #hero_curso {
        padding: 2rem 0 3rem;
    }

    #hero_curso .curso-hero-stage {
        padding: 1.75rem 1.75rem 0;
    }

    #hero_curso .curso-hero-heading {
        padding: 0.5rem 0 0;
        min-height: 0;
        justify-content: center;
    }

    #hero_curso .curso-hero-kicker {
        font-size: 4.25rem;
        text-align: center;
    }

    #hero_curso .curso-hero-card {
        width: min(92%, 42rem);
        margin-top: -2.75rem;
        margin-left: auto;
        margin-right: auto;
        padding: 1.75rem 2rem;
    }

    #hero_curso .curso-hero-title {
        font-size: 3.6rem;
    }

    #hero_curso .curso-hero-copy {
        margin-left: 0;
        text-align: center;
        font-size: 1.7rem;
    }
}

@media (max-width: 47.99875rem) {
    #hero_curso .curso-hero-stage {
        padding: 1.5rem 1.25rem 0;
    }

    #hero_curso .curso-hero-kicker {
        font-size: 3rem;
    }

    #hero_curso .curso-hero-card {
        width: calc(100% - 2rem);
        margin-top: -1.75rem;
        padding: 1.25rem 1.5rem;
    }

    #hero_curso .curso-hero-title {
        font-size: 2.7rem;
    }

    #hero_curso .curso-hero-copy {
        margin-top: 1.5rem;
        font-size: 1.35rem;
    }
}