*{
margin: 0;
padding: 0;
}

html { font-size: 25px; }

body{
background: url(img/bg.png);
}

header
{ 
background: url(img/bgfrase.png) repeat-x scroll center 0px;
height: 335px;
margin: auto;
text-align: center;
}

.fotodocentesgrupal{
    display: none;
}

nav{
position: relative;
        z-index: 1;
}

.slider {
    width: 100%;
    height: 100px;
    margin-top: -35px;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0; 
}

.headerinternas{
    background: url(img/bgheadint.png) repeat-x scroll center 0px;
    height: 282px;
    width: auto;
    margin: auto;
    text-align: center;
}

.contenedor{
    width: 100%;    
    margin: auto;
    max-width: 965px;
}

.logo
{
 width: 170px; 
 padding-top: 45px;
 position: absolute;
 margin-left: auto;
 margin-right: auto;
 left: 0;
 right: 0;
 
        
    
}

.contenedorinfodoc{
    margin: 60px 0 0;
    width: 100%;    
    max-width: 965px;
    height: 200px;
}



.infodocente h3{
    font-family: "Trebuchet MS", helvetica, sans-serif;
    color: #a1a1a1;
}

.infodocente p{
    font-family: arial, helvetica, sans-serif;
    color: #333;
    font-size: 0.6rem;
}

.infodocente{
    margin: 0 0 0 210px;
}

.logoheadint
{
 width: 130px;
    padding-top: 70px;
}

.fotodocente{

    height: 200px;
    width: auto;
    float:left;
}


.frase{
    width: 100%;
    min-height: 100px;
    overflow: hidden;
    margin:  0px auto;
    text-align: center;
    color: #fff;
    background: url(img/bgfrase.png) repeat-x scroll center 0px;
    -webkit-box-shadow:inset 0 -1px 10px 0 #000;
    box-shadow:inset 0 -1px 10px 0 #000;
    padding: -10px 0 0 0;
}

.frase h1{
    font-family: arial, helvetica, sans-serif;
    font-size: 1rem;
    padding: 22px 8px 0px 8px;
}

.frase h2{
    font-family: arial, helvetica, sans-serif;
    font-size: 0.8rem;
    margin-top: 5px;
    color: #28c2ff;
    padding: 0px 8px 0px 8px;
}

.docentes {
    background: url(img/bgdocentes.png) repeat-x scroll center 0px;
    margin: auto;
    overflow-y: auto;
    
}

.contenedoruno{
    width: 100%;
    height: 300px;
    max-width: 965px;
    margin: auto
}

.contenedoruno article{
    float:left;
    width: 121px;
    margin: 15px 19px;
}

article h3{
    font-family: arial, helvetica, sans-serif;
    font-size: 0.45rem;
    text-align: center;
}

.fotodoc{
    width: 120px;
    height: auto;
}


.contenedor h2{
    font-size: 1rem;
    font-family: "trebuchet MS", helvetica, sans-serif;
    padding-top: 20px;
    margin-left: 0.5%;
    margin-bottom: 20px;
    color: #229fdb;
    text-align: left;
    font-weight: 200

}
.fotodoc0:hover{background-image:url(img/docentes/hover1.png);}
.fotodoc0{width: 120px;height: 120px; background-image:url(img/docentes/0.png);}

.fotodoc1:hover{background-image:url(img/docentes/hover1.png);}
.fotodoc1{width: 120px;height: 120px; background-image:url(img/docentes/1.png);}

.fotodoc2:hover{background-image:url(img/docentes/hover2.png);}
.fotodoc2{width: 120px;height: 120px; background-image:url(img/docentes/2.png);}

.fotodoc3:hover{background-image:url(img/docentes/hover3.png);}
.fotodoc3{width: 120px;height: 120px; background-image:url(img/docentes/3.png);}

.fotodoc4:hover{background-image:url(img/docentes/hover4.png);}
.fotodoc4{width: 120px;height: 120px; background-image:url(img/docentes/4.png);}

.fotodoc5:hover{background-image:url(img/docentes/hover5.png);}
.fotodoc5{width: 120px;height: 120px; background-image:url(img/docentes/5.png);}

.fotodoc6:hover{background-image:url(img/docentes/hover6.png);}
.fotodoc6{width: 120px;height: 120px; background-image:url(img/docentes/6.png);}

.fotodoc7:hover{background-image:url(img/docentes/hover7.png);}
.fotodoc7{width: 120px;height: 120px; background-image:url(img/docentes/7.png);}

.fotodoc8:hover{background-image:url(img/docentes/hover8.png);}
.fotodoc8{width: 120px;height: 120px; background-image:url(img/docentes/8.png);}

.fotodoc9:hover{background-image:url(img/docentes/hover9.png);}
.fotodoc9{width: 120px;height: 120px; background-image:url(img/docentes/9.png);}

.fotodoc10:hover{background-image:url(img/docentes/hover10.png);}
.fotodoc10{width: 120px;height: 120px; background-image:url(img/docentes/10.png);}

.fotodoc11:hover{background-image:url(img/docentes/hover11.png);}
.fotodoc11{width: 120px;height: 120px; background-image:url(img/docentes/11.png);}

.fotodoc12:hover{background-image:url(img/docentes/hover12.png);}
.fotodoc12{width: 120px;height: 120px; background-image:url(img/docentes/12.png);}

.fotodoc13:hover{background-image:url(img/docentes/hover13.png);}
.fotodoc13{width: 120px;height: 120px; background-image:url(img/docentes/13.png);}




/* TRABAJOS HOME */

.trabajos{
    width: 100%;
    max-width: 965px;
    margin: auto;
    overflow: hidden;
}

.works{
    width: 90%;
    margin:auto;
}

.trabajos h2{
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    text-align: left;
    margin-left: 0.5%;
    margin-top: 3%;
    color:#229fdb;
    font-size: 1rem;
    font-weight: 100;
}

.worka h3{
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    text-align: left;
    color:#4ac3f5;
    font-size: 0.6rem;
    font-weight:bold;
    font-style: bold;
    margin-top: 2.5%;
    margin-bottom: 2.5%;
    padding-left: 4.6%;
}

.workb h3{
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    text-align: left;
    color:#4ac3f5;
    font-size: 0.6rem;
    font-weight:bold;
    font-style: bold;
    margin-top: 2.5%;
    margin-bottom: 2.5%;
    padding-left: 4.6%;
}

.worka{
    width:32%;
    height: auto;
    text-align: center;
    background-color: #fff;
    float:left;
    margin-left: 0.5%;
    margin-top: 2%;
    border-style: solid;
    border-color: #d4d4d4;
    border-width: 1px;
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    font-size: 0.5rem;
           -webkit-border-radius: 8px;
       -moz-border-radius: 8px;
        border-radius: 8px;
}

.workb{
    width:32%;
    height: auto;
    text-align: center;
    background-color: #fff;
    float:left;
    margin-left: 0.5%;
    margin-top: 2%;
    border-style: solid;
    border-color: #d4d4d4;
    border-width: 1px;
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    font-size: 0.5rem;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

.imgallery{
    width: 100%;
    height: auto;
}

.worka a{
    text-decoration:none;
}

.workb a{
    text-decoration:none;
}


footer{
    
    width: 100%;
    color: #fff;
    background-color:#229fdb;
    font-size: 0.5rem;
    font-family: arial, helvetica, sans-serif;
    text-align: center;
    margin-top: 50px;
    
    }

.contenedortextofooter {;
                max-width: 965px;
                margin:auto;
                height: 70px;
                padding: 15px 10px;
}





/* Responsive fix*/



/* Responsive para tablets */

@media screen and (max-width: 768px)
    
{
        .fotodocentesgrupal{ 
        display:inline;
        width: 100%; 
        height: auto;
        margin-bottom: 20px;
    }
    .contenedoruno{display:none;}

}

/* Responsive para celulares */

@media screen and (max-width: 480px)
    
{
       .frase{height: 160px;}
    html { font-size: 20px; }
    .worka{
    width: 99%;
    height: auto;
    text-align: center;
    background-color: #fff;
    float:left;
    margin-left: 0.5%;
    margin-top: 4%;
    border-width: 1px;
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    font-size: 0.6rem;
}
    .worka h3{font-size: 0.8rem;}
    .workb{display:none;}
    
    .trabajos{
    width: 96%;
    max-width: 965px;
    margin: auto;
    overflow: hidden;
}

    
}

    
    





/*----------- AJUSTE PARA DOCENTES HOME ----------------*/

@media screen and (max-width: 970px)
    
{
        .contenedoruno{
        width: 100%;
        height: 300px;
        max-width: 740px;
        margin: auto;
        }
        .contenedor{
        width: 96%;
        margin: 0 2%;
        }
       .contenedoruno article{
        float:left;
        width: 121px;
        margin: 15px -1px;
       } 
}

@media screen and (max-width: 768px)
    
{
 .frase { height: 130px;}  
 .frase h1{ font-size: 0.8em;}
 .frase h2{ font-size: 0.65em;}
    
}