/*Queries*/
@media only screen and (max-width: 320px) {
    /*body {background-color: skyblue;}
    body::before {content: 'skyblu';}*/

    #secondpane{
        display: none;
    }
    .alerta div {
        width: 100%;
    }
    .alerta .personaje-mensaje {
        width: 10%;
    }
    .alerta .texto-mensaje {
        width: 85%;
        display: inline-block;
    }
    .secciones-landing img{
        text-align: center;
    }
    
    .box-imagen-horarios{
        text-align: center;
        padding: 0 25%!important;
    }
}

@media only screen and (min-width: 360px) {
    /*body {background-color: green;}
    body::before {content: 'green';}*/
    .alerta div {
        width: 80%;
    }
    .alerta .personaje-mensaje {
        width: 10%;
    }
    .alerta .texto-mensaje {
        width: 85%;
        display: inline-block;
    }


    #secondpane{
        display: none;
    }
       .box-imagen-horarios{
        text-align: center;
        padding: 0 20%!important;
    }
 .side1{
        text-align: center;
        width: 100%;
    }
       .side1 img{}

    .side2{
        width: 90%;
        border-left: none;
        border-top: 1px solid black;
    }
       .side2 span{
        display: inline-block;
        margin: 0.5em;
       }
    .side2 span img{}
    .side2 span img figcaption{
        display: block;
         width: 100%;
    }
}

@media only screen and (min-width: 420px) {
    /*body {background-color: yellow;}
    body::before {content: 'yellow';}*/

    .alerta div {
        width: 80%;
    }
    .alerta .personaje-mensaje {
        width: 10%;
    }
    .alerta .texto-mensaje {
        width: 85%;
        display: inline-block;
    }

    #secondpane{
        display: none;
    }
    
    .box-imagen-horarios{
        text-align: center;
        padding: 0 25%!important;
    }
}

@media only screen and (min-width: 480px) {
    /*body {background-color: red;}
    body::before {content: 'red';}*/

    #secondpane{
        display: none;
    }
    .alerta div {
        width: 80%;
    }
    .alerta .personaje-mensaje {
        width: 10%;
    }
    .alerta .texto-mensaje {
        width: 85%;
        display: inline-block;
    }
    
    .box-imagen-horarios{
        text-align: center;
        padding: 0 5%!important;
    }
}
@media only screen and (max-width: 600px) {
        .pd-lista{
        padding: 0 20px 20px 40px;
        }
        #start-home .fecha-matricula h3{
        color: #2b81bb;
        }
        #start-home ul {
        margin-top: 0%;
        }
        img.responsive-img, video.responsive-video {
        max-width: 80%;
        }
        .side2{
            padding: 1em 0;
        }
        h1.done {
            font-size: 3.2em;
        }
        .side2 img{
            max-width: 30px;
        }
}

@media only screen and (min-width: 600px) {
    /*body {background-color: orange;}
    body::before {content: 'orange';}*/

    #secondpane{
        display: none;
    }
    .side1{
        text-align: center;
        width: 100%;
    }
       .side1 img{}

    .side2{
        width: 100%;
        border-left: none;
        border-top: 1px solid black;
    }
       .side2 span{
        display: inline-block;
        margin: 0.5em;
       }
           .side2 span img{}
              .side2 span img figcaption{
                display: block;
                width: 100%;
              }
}

@media only screen and (min-width: 690px) and (max-width: 779px){
    /*body {background-color: purple;}
    body::before {content: 'purple';}*/

    #secondpane{
        display: none;
    }
    .box-imagen-horarios{
        text-align: center;
        padding: 0 5%!important;
    }
    .side1{
        text-align: center;
        width: 100%;
    }
       .side1 img{}

    .side2{
        width: 100%;
        border-left: none;
        border-top: 1px solid black;
    }
       .side2 span{
        display: inline-block;
        margin: 0.5em;
    }
    .side2 span img{}
    .side2 span img figcaption{
        display: block;
        width: 100%;
    }
}

@media only screen and (min-width: 780px) {
    /*body {background-color: blue;}
    body::before {content: 'blue';}*/

    #secondpane{
        display: none;
    }

    .box-imagen-horarios{
        text-align: center;
        padding: 0 10%!important;
    }
    .side1{
        width: 65%;
    }
       .side1 img{}

    .side2{
        width: 40%;
        border-top: none;
        border-left: 1px solid black;
    }
       .side2 span{
        display: block;
        margin: 0.5em;
       }
           .side2 span img{}
              .side2 span img figcaption{
                display: block;
                width: 100%;
              }
}

@media only screen and (min-width: 810px) {
    /*body {background-color: maroon;}
    body::before {content: 'maroon'};*/
    #secondpane{
        display: block;
    }
    .alerta div {
        width: 60%;
    }
    .box-imagen-horarios{
        text-align: center;
        padding: 0 5%!important;
    }
    .side1{
        width: 65%;
    }
       .side1 img{}

    .side2{
        width: 30%;
        border-top: none;
        border-left: 1px solid black;
    }
       .side2 span{
        display: block;
        margin: 0.5em;
       }
           .side2 span img{}
              .side2 span img figcaption{
                display: block;
                width: 100%;
              }
}

@media only screen and (min-width: 900px) {
    /*body {background-color: skyblue;}
    body::before{content:'#990099';}*/

    #secondpane{
        display: block;
    }
    .box-imagen-horarios{
        text-align: center;
        padding: 0 5%!important;
    }
    .side1{
        width: 65%;
    }
       .side1 img{}

    .side2{
        width: 30%;
        border-top: none;
        border-left: 1px solid black;
    }
       .side2 span{
        display: block;
        margin: 0.5em;
       }
           .side2 span img{}
              .side2 span img figcaption{
                display: block;
                width: 100%;
              }
}

@media only screen and (min-width: 1200px) {
    /*body {background-color: peru;}
    body::before{content:'#330033';}*/

    #secondpane{
        display: block;
    }

    .box-imagen-horarios{
        text-align: center;
        padding: 0 5%!important;
    }
    .side1{
        width: 65%;
    }
       .side1 img{}

    .side2{
        width: 30%;
        border-top: none;
        border-left: 1px solid black;
    }
       .side2 span{
        display: block;
        margin: 0.5em;
       }
           .side2 span img{}
              .side2 span img figcaption{
                display: block;
                width: 100%;
              }
}