﻿.clear {
    clear: both;
}


/* INICIO CONTENEDOR 1 */
#contenedorUno {
    width: 100%;
    margin: 0 auto;
    /*background-color: #ffffff;*/
    font-family: Roboto, Arial, Helvetica, sans-serif;
}

    #contenedorUno .left-side {
        width: 58%;
        float: left;
        padding: 2% 2% 2% 5%;
    }

    #contenedorUno .right-side {
        width: 28%;
        float: right;
        text-align: center;
        padding: 2% 5% 2% 2%;
    }

.image-right-side {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
    border-radius: 15px;
}

.paragraph-title-left-side {
    float: left;
    text-align: left;
    font-size: 1.6em;
    font-weight: bold;
    text-transform: uppercase;
    /*color: #2B3584;*/
    position: relative;
    top: 0.1em;
}
/* FIN CONTENEDOR 1 */





/* INICIO CONTENEDOR 2 */
#contenedorDos {
    width: 100%;
    margin: 0 auto;
    /*background-color: #ffffff;*/
    font-family: Roboto, Arial, Helvetica, sans-serif;
}

    #contenedorDos .left-side {
        width: 28%;
        float: left;
        text-align: center;
        padding: 2% 2% 2% 5%;
    }

    #contenedorDos .right-side {
        width: 58%;
        float: right;
        padding: 2% 5% 2% 2%;
    }

.image-left-side {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
    border-radius: 15px;
}

.paragraph-title-right-side {
    float: right;
    text-align: right;
    font-size: 1.6em;
    font-weight: bold;
    text-transform: uppercase;
    /*color: #2B3584;*/
    position: relative;
    top: 0.1em;
}
/* FIN CONTENEDOR 2 */



/* INICIO IMAGENES */
#contenedorImagenes {
    background-color: #ffffff;
}
/* FIN IMAGENES*/



/* INICIO VIDEOS */
#contenedorVideos {
    width: 100%;
    margin: 0 auto;
    /*background-color: #ffffff;*/
    font-family: Roboto, Arial, Helvetica, sans-serif;
}

.video-left-side {
    width: 48%;
    float: left;
    padding: 2%;
}

.video-right-side {
    width: 44%;
    float: right;
    padding: 2%;
    text-align: center;
}

.title-video-right-side {
    float: left;
    text-align: left;
    font-size: 1.6em;
    font-weight: bold;
    text-transform: uppercase;
    /*color: #2B3584;*/
    position: relative;
    top: 0.1em;
}

/* FIN VIDEOS */



.paragraph-content-left-side, .parrafo-video-left-side {
    text-align: justify;
    padding-top: 2%;
    font-size: 1em;
    font-weight: 300;
    /*color: #58585B;*/
    padding-left: 3em;
}

.paragraph-content-right-side {
    text-align: justify;
    padding-top: 2%;
    font-size: 1em;
    font-weight: 300;
    /*color: #58585B;*/
    padding-right: 3em;
}


/* INICIO LINEAS HORIZONTALES */
.HorizontalLine {
    width: 100%;
}

    .HorizontalLine .SectionLine {
        width: 33.33%;
        height: 0.4em;
        float: left;
    }

    .HorizontalLine .amarillo {
        background-color: #FBAF3F;
        opacity: 0.7;
    }

    .HorizontalLine .azul {
        background-color: #2B3584;
    }

    .HorizontalLine .celeste {
        background-color: #1B75BB;
    }


/*.iconTriangulo1, .iconTriangulo2 {
    width: 6%;
}*/

.iconTriangulo1 {
    float: left;
}

.iconTriangulo2 {
    float: right;
}
/* FIN LINEAS HORIZONTALES */


@media screen and (min-width: 1151px) {
}

@media screen and (min-width: 900px) and (max-width:1150px) {
}

@media screen and (min-width: 551px) and (max-width:899px) {
    /*INICIO CONTENEDOR 1*/
    .paragraph-content-left-side, .parrafo-video-left-side {
        padding-left: 1.8em;
        font-size: 1.7em;
    }

    /*FIN CONTENEDOR 1*/


    /*INICIO CONTENEDOR 2*/

    .paragraph-content-right-side {
        padding-right: 1.8em;
        font-size: 1.7em;
    }

    /*FIN CONTENEDOR 2*/

    /*INICIO IMAGENES*/
    #contenedorImagenes {
        width: 90%;
        margin: 0 auto;
    }
    /*FIN IMAGENES*/
}

@media screen and (min-width: 361px) and (max-width:550px) {
    /*INICIO CONTENEDOR 1*/
    #contenedorUno .left-side {
        width: 80%;
        float: none;
        padding: 2% 0;
        text-align: center;
        margin: 0 auto;
    }

    #contenedorUno .right-side {
        width: 80%;
        float: none;
        text-align: center;
        padding: 2% 0;
        margin: 0 auto;
    }

    .paragraph-content-left-side, .parrafo-video-left-side {
        padding: 1em 0;
        font-size: 1.7em;
    }

    .paragraph-title-left-side {
        font-size: 1.7em;
    }
    /*FIN CONTENEDOR 1*/


    /*INICIO CONTENEDOR 2*/
    #contenedorDos .left-side {
        width: 80%;
        float: none;
        padding: 2% 0;
        text-align: center;
        margin: 0 auto;
    }

    #contenedorDos .right-side {
        width: 80%;
        float: none;
        text-align: center;
        padding: 2% 0;
        margin: 0 auto;
    }

    .paragraph-content-right-side {
        padding: 1em 0;
        font-size: 1.7em;
    }

    .paragraph-title-right-side {
        font-size: 1.7em;
    }
    /*FIN CONTENEDOR 2*/

    /*INICIO IMAGENES*/
    #contenedorImagenes {
        width: 80%;
        margin: 0 auto;
    }
    /*FIN IMAGENES*/


    /* INICIO VIDEOS */

    .video-left-side {
        width: 80%;
        float: none;
        padding: 2% 0;
        text-align: center;
        margin: 0 auto;
    }

    .video-right-side {
        width: 80%;
        float: none;
        text-align: center;
        padding: 2% 0;
        margin: 0 auto;
    }

    .title-video-right-side {
        font-size: 1.7em;
    }

    /* FIN VIDEOS */
}

@media screen and (min-width: 0px) and (max-width:360px) {
    /*INICIO CONTENEDOR 1*/
    #contenedorUno .left-side {
        width: 80%;
        float: none;
        padding: 2% 0;
        text-align: center;
        margin: 0 auto;
    }

    #contenedorUno .right-side {
        width: 80%;
        float: none;
        text-align: center;
        padding: 2% 0;
        margin: 0 auto;
    }

    .paragraph-content-left-side, .parrafo-video-left-side {
        padding: 1em 0;
        font-size: 1.7em;
    }

    .paragraph-title-left-side {
        font-size: 1.7em;
    }
    /*FIN CONTENEDOR 1*/


    /*INICIO CONTENEDOR 2*/
    #contenedorDos .left-side {
        width: 80%;
        float: none;
        padding: 2% 0;
        text-align: center;
        margin: 0 auto;
    }

    #contenedorDos .right-side {
        width: 80%;
        float: none;
        text-align: center;
        padding: 2% 0;
        margin: 0 auto;
    }

    .paragraph-content-right-side {
        padding: 1em 0;
        font-size: 1.7em;
    }

    .paragraph-title-right-side {
        font-size: 1.7em;
    }
    /*FIN CONTENEDOR 2*/

    /*INICIO IMAGENES*/
    #contenedorImagenes {
        width: 80%;
        margin: 0 auto;
    }
    /*FIN IMAGENES*/


    /* INICIO VIDEOS */

    .video-left-side {
        width: 80%;
        float: none;
        padding: 2% 0;
        text-align: center;
        margin: 0 auto;
    }

    .video-right-side {
        width: 80%;
        float: none;
        text-align: center;
        padding: 2% 0;
        margin: 0 auto;
    }

    .title-video-right-side {
        font-size: 1.7em;
    }

    /* FIN VIDEOS */


}

@media screen and (min-width: 1291px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 6%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 94%;
    }
}

@media screen and (min-width: 1151px) and (max-width:1290px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 7%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 93%;
    }
}


@media screen and (min-width: 1025px) and (max-width:1150px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 8%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 92%;
    }
}

@media screen and (min-width: 900px) and (max-width:1024px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 6%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 94%;
    }
}

@media screen and (min-width: 756px) and (max-width:899px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 5%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 95%;
    }
}

@media screen and (min-width: 551px) and (max-width:755px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 6%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 94%;
    }
}


@media screen and (min-width: 500px) and (max-width:550px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 6%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 94%;
    }
}

@media screen and (min-width: 432px) and (max-width:499px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 7%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 93%;
    }
}

@media screen and (min-width: 390px) and (max-width:431px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 8%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 92%;
    }
}

@media screen and (min-width: 361px) and (max-width:389px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 9%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 91%;
    }
}

@media screen and (min-width: 0px) and (max-width:360px) {
    .iconTriangulo1, .iconTriangulo2 {
        width: 10%;
    }

    .paragraph-title-left-side, .paragraph-title-right-side, title-video-right-side {
        width: 90%;
    }
}
