/* Encabezado */
header{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: 200px;
    background: rgb(1, 91, 209);
    background-repeat: no-repeat;
    background-size: cover;
}
#encab1{
    background-image: url(../img/especialidades/cursos/informatica.jpg);
    background-position: bottom;
}
#encab2{
    background-image: url(../img/especialidades/cursos/diseno.jpg);
    background-position: bottom;
}
#encab3{
    background-image: url(../img/especialidades/cursos/mantto.jpg);
    background-position: bottom;
}
#encab4{
    background-image: url(../img/especialidades/cursos/ingles.jpg);
    background-position: bottom;
}
#encab5{
    background-image: url(../img/especialidades/cursos/bachdise.jpg);
    background-position: bottom;
}
#encab6{
    background-image: url(../img/especialidades/cursos/bachprogra.jpg);
    background-position: bottom;
}
#encab7{
    background-image: url(../img/especialidades/cursos/bachconta.jpg);
    background-position: bottom;
}
#encab8{
    background-image: url(../img/especialidades/cursos/bachmeca.jpg);
    background-position: bottom;
}
#encab9{
    background-image: url(../img/especialidades/cursos/bachgral.jpg);
    background-position: bottom;
}
#encab10{
    background-image: url(../img/especialidades/cursos/mecatronica.jpg);
    background-position: bottom;
}
#encab21{
    background-image: url(../img/especialidades/cursos/autocad.jpg);
    background-position: bottom;
}
#encab15{
    background-image: url(../img/especialidades/cursos/adultosavanzado.jpg);
    background-position: bottom;
}
#encab14{
    background-image: url(../img/especialidades/cursos/adultosbasico.jpg);
    background-position: bottom;
}
#encab13{
    background-image: url(../img/especialidades/cursos/desarrolloweb.jpg);
    background-position: bottom;
}
#encab17{
    background-image: url(../img/especialidades/cursos/infantil.jpg);
    background-position: bottom;
}
#encab22{
    background-image: url(../img/especialidades/cursos/excelbasico.jpg);
    background-position: bottom;
}
#encab23{
    background-image: url(../img/especialidades/cursos/excelintermedio.jpg);
    background-position: bottom;
}
#encab19{
    background-image: url(../img/especialidades/cursos/mecatronicadinamica.jpg);
    background-position: bottom;
}
#encab12{
    background-image: url(../img/especialidades/cursos/programacion.jpg);
    background-position: bottom;
}
#encab11{
    background-image: url(../img/especialidades/cursos/arduino.jpg);
    background-position: bottom;
}
#encab20{
    background-image: url(../img/especialidades/cursos/solidworks.jpg);
    background-position: bottom;
}
#encab18{
    background-image: url(../img/especialidades/cursos/mecatronicasimple.jpg);
    background-position: bottom;
}
#encab16{
    background-image: url(../img/especialidades/cursos/utilizaciontelefonos.jpg);
    background-position: bottom;
}
#headIzq{
    width: 50%;
    padding: 5%;
}
#headIzq h1{
    font-size: 4em;
    color: #FFF;
    margin-bottom: 10px;
}
#headIzq h2{
    font-size: 1.8em;
    color: #72c5f5;
    margin-bottom: 10px;
}
#headIzq h3{
    font-size: 1.4em;
    color: #FFF;
}
#headCent{
    width: 24%;
    padding: 3%;
    margin: 1% 0;
    background-color: rgba(1, 15, 59, 0.7);
    border-radius: 10px;
    color: #FFF;
    text-align: center;
}
#headCent input, #headCent select, #headCent textarea{
    width: 96%;
    padding: 2%;
    margin: 5px 0;
    border: none;
    box-shadow: 0 0 2px #0b2636;
    border-radius: 5px;
    font-size: 0.8em;
}
#headCent textarea{
    height: 100px;
    font-size: 1em;
}
#headCent h2{
    font-size: 2em;
}
#headCent input[type=button]{
    background-color: red;
    color: #FFF;
}
#headCent a{
    text-decoration: none;
    color: #72c5f5;
}
#headDer{
    width: 10%;
    height: 50px;    
}
@media screen and (max-width: 1230px) {
    #headDer{ width: 5%; }
    #headCent{ width: 29%;}    
}
@media screen and (max-width: 1230px) {
    #headDer{ width: 0%; }
    #headCent{ width: 34%;}    
}
@media screen and (max-width: 730px) {
    #headDer{ display: none; }
    #headIzq{ width: 90%; padding: 2%;}
    #headCent{ width: 94%;}
    #headIzq h1{ text-align: center; }
    #headIzq h2{ text-align: center; }
    #headIzq h3{ text-align: center; }
}

/* Objetivo */
#objetivo{
    width: 94%;
    padding: 3%;
}
#objetivo h2{
    font-size: 2.6em;
    color: red;
    text-align: center;
    margin: 10px;
}
#objetivo p{
    font-size: 2.2em;
    text-align: center;
}
/* Temario */
#temario{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;    
    background-color: #002E6C;
}
#temario article{
    width: 50%;
    padding: 2%;
}
#temario article h2{
    font-size: 2.2em;
    color: #72c5f5;
    text-align: center;
    margin: 10px;
}
#temario article p{ text-align: center;}
#temario article img{
    width: 80%;
    border-radius: 10px;
    box-shadow: 0 3px 5px #011e44;
}
#temario article ul, #temario article ol{
    list-style: none;
}

#temario article ul li{
    font-size: 1.4em;
    margin: 15px 0;
    padding: 7px;
    border-left: 5px solid #001735;
    border-bottom: 5px solid #001735;
    color: #FFF;
    cursor: pointer;
}
#temario article ul li:hover{
    background-color: #001735;
    border-color: #72c5f5;
}
@media screen and (max-width:800px) {
    #temario article{
        width: 100%;
        padding: 2%;    
    }
    #temario article ul li{
        border-left: 0;
        text-align: center;
    }
}
/* Público */
#publico{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
#publico article{
    width: 50%;
    padding: 2%;    
}
#publico article h2{
    font-size: 2.6em;
    color: #72c5f5;
    text-align: center;
    margin: 10px;
}
#pubText p{
    color: #FFF;
    font-size: 2em;
    margin: 10px;
    text-align: center;
}
#publico article p{ text-align: center;}
#publico article img{
    width: 80%;
    border-radius: 10px;
    box-shadow: 0 3px 5px #011e44;
}

@media screen and (max-width:800px) {
    #publico article{
        width: 100%;
        padding: 2%;    
    }
}
/* Utilidad */
#utilidad{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;    
    background-color: #FFF; /*#002E6C;*/
}
#utilidad article{
    width: 50%;
    padding: 2%;    
}
#utilidad article h2{
    font-size: 2.6em;
    color: #72c5f5;
    text-align: center;
    margin: 10px;
}
#utilidad article p{ text-align: center;}
#utilidad article img{
    width: 80%;
    border-radius: 10px;
    box-shadow: 0 3px 5px #011e44;
}
#utilidad article ol{
    list-style: none;
}
#utilidad article ol li{
    font-size: 1.4em;
    margin: 15px 0;
    padding: 7px;
    border-left: 5px solid red;
    border-bottom: 5px solid red;
    color: #002E6C;
    cursor: pointer;
}
#utilidad article ol li:hover{
    background-color: white;
    border-color: #002E6C;
    color: #002E6C;
}
@media screen and (max-width:800px) {
    #utilidad article{
        width: 100%;
        padding: 2%;    
    }
    #utilidad article ol li{
        border-left: 0;
        text-align: center;
    }
}
/* Requisitos */
#requisitos{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;    
    background-color: #e22525; /*#002E6C;*/
    border-bottom: 15px solid #001735;    
}
#requisitos h2{
    width: 98%;
    padding: 1%;
    font-size: 3em;
    color: #FFF;
    text-align: center;
}
#requisitos article{
    width: 29.33%;
    padding: 1%;
    margin: 1%;
    text-align: center;
    box-shadow: 0 0 3px #a10d0d;
    border-radius: 10px;
    cursor: pointer;
}
#requisitos article:hover{
    background-color: #000000;
}
#requisitos article h3{
    font-size: 5em;
    color: yellow;
}
#requisitos article p{
    font-size: 1.2em;
    color: #FFF;
}
@media screen and (max-width: 450px) {
    #requisitos article{
        width: 98%;
        margin: 3%;
    }    
}
/**/
#capTitulo, #especiales{
    width: 100%;
    padding: 2%;
    background-color: white;
}
#capTitulo h2{
    color: crimson;
    font-size: 2em;
    text-align: center;margin-bottom: 20px;
}
#capTitulo p{
    font-size: 1.4em;
}
#especiales{
    display: flex;
    flex-wrap: wrap;
}
.espItem{    
    width: 30.33%;
    margin: 1.5%;
}
@media screen and (max-width: 800px) {
    .espItem{    
        width: 46%;
        margin: 2%;
    }    
}
@media screen and (max-width: 560px) {
    .espItem{    
        width: 96%;
        margin: 2%;
    }    
}
.espItem img{ width: 100%; box-shadow: 0 0 5px #000;}