{@import url(http://fonts.googleapis.com/css?family=Maven+Pro:400,500,700,900);
}
/* hoja de estilos de jt01 */

body{
    width: 960px;
    height:1152px;
    background-color:rgb(32, 106, 103);
    background-image: url(puntos.png);
   font-size: 10pt;
    font-family:"Fuente Web ",Arial, sans-serif;
   margin: auto 
   
}

div#pagina{
      width:960px;
     margin:auto;
     }


header{
    width:960px;
    height:200px;
   }
div#puntos h1{
    margin-left:10%;
    margin-top: 2.5%;
  position:absolute;
}

div#puntos h2{
  margin-left:18%;
    margin-top:3.5%;
  font-family:'Maven Pro' sans-serif;
    font-weight:900;
    font-size: 36pt;
    position: absolute
}
   div#puntos h3{
    margin-left:18%;
    margin-top:6.7%;
  font-family:'Maven Pro', sans-serif;
    font-weight:400;
    font-size: 15pt;
    position: absolute
    
}
div#puntos{
    background-image: url(punto.png);
    height: 200px;
    margin-top:0%;
}

nav{
   width: 960px;
    height: 30px;
    margin-left:10px;
}   
nav ul{
    list-style: none;
    position:absolute;
    font-family:'Maven Pro', sans-serif;
    font-weight:700;
    z-index:10
    
     
  
}
nav ul li#uno{
    float: left;
    padding: 5px;
    margin-bottom: 10px;
    min-width:22%;
    background-color: rgb(1,2,3);
    width: 205px
}
nav ul li#dos{
    float: left;
    padding: 5px;
   background-color: rgb(12, 134, 172);
      width: 205px;
 
       
}

nav ul li#tres{
    float: left;
    padding: 5px;
    margin-bottom: 10px;
    background-color: rgb(204, 19, 204);
      width: 205px
}
nav ul li#cuatro{
    float: left;
    padding: 5px;
    margin-bottom: 10px;
    background-color: rgb(240, 188, 24);
    width: 205px
}
nav ul li a{
    
    text-decoration: none;
    color: #FFFFFF;
    display: block;
    padding: 15px;
   font-size: 14pt;
    font-family: arial,sans-serif;
   text-align:center;
    
      
           
}
nav ul li a:hover{
color: rgb(242, 249, 250);
background-color: rgba(10, 20, 30, 0.8);
   
}
nav ul li ul{
    display:none;
    width: 118px;
    text-align: center;
    position: relative;
     font-family:'Maven Pro', sans-serif;
    font-weight:400;
    z-index: 10
    
}
  
nav li:hover >ul {
display: block;
}
.corte {clear:both;
        margin-top:50px}

article{
width: 90px;
height: 600px;
margin-top: 100px;
margin-left: 50px;


}

article h1{
margin-top: 100px;
width: 650px;
font-family: 'Maven Pro', sans-serif;
font-weight:800;
font-size: 1.6rem;
text-align: center;
color:rgb(242, 246, 250);
margin:10px;
  margin-left: 0px  
}

article h2{
width: 650px;
font-family: 'Maven Pro', sans-serif;
font-weight:600;
font-size: 16pt;
margin: 10px
}

article h3{

width: 620px;
font-family: 'Maven Pro', sans-serif;
font-weight:400;
font-size: 11pt;
margin:10px;
    text-align:justify
}

article h5{ 
    width: 630px;
    height: 400px;
    margin:10px;
    background-color:rgba(189, 195, 40, 0.9)
   
}
article h5 div#foto{
background-image: url(foto%20b.png);
background-repeat: no-repeat;
width: 93%;
height: 350px;
margin-left:20px;
 float: left;  
margin-top:22px;
}
div#bienvenidos{
    width: 650px;
    height: 600px;
  background-color: rgba(33, 163, 142, 0.7);
 position: absolute;
z-index: 0}


div#calendario{
width: 250px;
height:300px;
margin-left:660px; 
float:left;
position:absolute;
}
div#dia{
width: 120px;
height:120px;
margin-left:695px; 
margin-top:30px;
float:left;
position:absolute;
font-family: 'Maven Pro', sans-serif;
font-weight: 800;
font-size: 80pt}

div#mes{
width: 120px;
height:40px;
margin-left:710px; 
margin-top: 130px;
float:left;
position:absolute;
font-family: 'Maven Pro', sans-serif;
font-weight: 800;
font-size:25pt}


div#nivel{
width: 120px;
height:20px;
margin-left:715px; 
margin-top: 165px;
float:left;
position:relative;
font-family: 'Maven Pro', sans-serif;
font-weight: 600;
font-size:10pt;
color:rgb(248, 8, 18)}

div#niveles{
width: 120px;
height:20px;
margin-left:705px; 
margin-top: 0px;
float:left;
position:relative;
font-family: 'Maven Pro', sans-serif;
font-weight: 600;
font-size:10pt;
color:rgb(64, 145, 20)}

div#cronograma{ width: 160px;
height:325px;
margin-left:660px; 
margin-top: 235px;
float:left;
text-align: center;
position:absolute;
font-family: 'Maven Pro', sans-serif;
font-weight: 600;
font-size:12pt;
padding: 20px;
background-color:rgba(19, 152, 126, 0.8);
color:rgb(255, 255, 255)}

nav#cinco{
 width: 20px;
 height: 20px;
 float: left;
 position: relative
}

ul#cinco{
    width: 200px;
    height: 100px;
    list-style: none;
    position:absolute;
    margin-left: 610px;
   font-family:'Maven Pro', sans-serif;
    font-weight:700;   
}
li#cinco{
    margin-top: 30px;
    margin-bottom: 30px;
    
 }

nav ul li#cinco a{ font-size: 20pt}
div#a hr {
    color: rgb(0, 0, 0);
}
div#placa{ 
width: 160px;
height:25px;
margin-left:660px; 
margin-top: 30px;
float:left;
text-align: center;
position:relative;
font-family: 'Maven Pro', sans-serif;
font-weight: 600;
font-size:12pt;
padding: 20px;
background-color:rgba(216, 229, 70, 0.8);
}
section{
    background-color: rgba(193, 193, 20, 0.8);
     width: 860px;
    height: 160px;
     margin-left: 50px;
    margin-top: 5px;
         
}
section h1{
margin-left: 10px;
padding:  10px;
color: rgb(254, 254, 255);
font-family: 'Maven Pro', sans-serif;
font-weight: 900}

div#feriado{
width: 115px;
margin-left: 150px;
    margin-top: 60px;
text-align:center;
font-family: 'Maven Pro', sans-serif;
font-size: 11pt;
font-weight: 400;
position:absolute}
.destacado1{font-weight: 700}

div#impresion{
width: 140px;
margin-left: 420px;
    margin-top: 60px;
text-align:center;
font-family: 'Maven Pro', sans-serif;
font-size: 11pt;
font-weight: 400;
    position: absolute
}
.destacado1{font-weight: 700}

div#paro{
width: 140px;
margin-left: 710px;
    margin-top: 60px;
text-align:center;
font-family: 'Maven Pro', sans-serif;
font-size: 11pt;
font-weight: 400;
position: absolute}
.destacado1{font-weight: 700}

section h2{margin-left: 15px;
    margin-top: 60px;
position: absolute}

footer{
   background-image: url(punto1.png);
    background-repeat: no-repeat;
    position: absolute;
    margin-top: 10px;
     width: 960px;
    height:85px;
        }

div#abajo{
background-color: rgb(255, 254, 254);
margin-top: 10px;
padding: 20px;
text-align: center;
font-size: 12px}

/* hoja de estilos de plantel */

article#plantel{width: 860px;
height: 800px;
margin-top: 100px;
margin-left: 50px;}

article#plantel h1{
margin-left: 90px}

article#plantel h2{
margin-left: 50px;
width: 800px;
margin-top:20px;
font-weight: 500 }

nav#profes ul {
width: 90%;
height:100%;
float: left;
margin-top:10px;}
nav#profes ul li {
width:148px;
height: 148px;
float: left;
    
}

nav#profes ul li :hover{
color: rgb(247, 250, 250);
background-color: rgba(41, 60, 52, 0.7);
padding: 5px;
  
}

div#plantel{ width: 860px;
    height: 800px;
  background-color: rgba(33, 163, 142, 0.7);
 position: absolute;
z-index: 0}

/* hoja de estilos de zachin */

article#z{
width: 960px;
height:900px;
margin-left:6px; 
float:left;

}

#z{
margin-left:6px; 
float:left;
z-index: 1;
margin-left:170px;
margin-top: 20px  
}

nav#volver ul {
width: 10%;
height:5%;
float: left;
margin-top:800px;
margin-left: 315px}

nav#volver ul li {
width:80px;
height: 20px;
float: left;
font-family:'Maven Pro', sans-serif;
font-weight: 800;
font-size: 14pt;
background-color: rgba(15, 78, 68, 0.7);
color:rgb(255, 254, 254);
padding: 10px;
    }

nav#volver ul :hover{
color: rgb(0, 8, 8);
background-color: rgba(19, 167, 212, 0.7);}

div#pres{ width: 860px;
    height: 850px;
    margin-left: 50px;
  background-color:rgba(0, 8, 7, 0.7);
   z-index: 0}

footer#ab{
   background-image: url(punto1.png);
    background-repeat:no-repeat;
    margin-top: 910px;
     width: 960px;
    height:85px;
        }

div#ab{
background-color: rgb(255, 254, 254);
margin-top: 10px;
padding: 20px;
text-align: center;
font-size: 12px}

/* hoja de estilos de propuesta */
article#propuesta{}
div#propuesta{
    width: 650px;
    height: 600px;
  background-color: rgba(173, 235, 223, 0.7);
 position: absolute;
z-index: 0}



div#grupal{
width: 300px;
height:600px;
margin-left:550px; 
float:left;
position:absolute;
}
div#propuesta h2{
width: 555px;
font-family:'Maven Pro', sans-serif;
font-weight: 400;
font-size: 14pt;
text-align:justify;
margin-left: 20px;
margin-top: 30px
}
div#propuesta h1{
text-align: left;
    width: 400px;
    margin-left:20px
}
section#agenda{
width: 860px;
height: 160px;
float: left;
}

nav#cont ul {
width: 70px;
height:70px;
    margin-top: 70px;
float: left;
    

}
div#agenda h1{position: absolute;font-weight: 600}
nav#cont ul li#t{
width:148px;
height: 148px;
float: left;
position: absolute

    
}

nav#cont ul li#f :hover{
color: rgb(247, 250, 250);

padding: 5px;
  
}
nav#cont ul li#f {
width:148px;
height: 148px;
float: left;
position: absolute;
margin-left: 50px;
     

    
}
nav#cont ul li#t {
width:148px;
height: 148px;
float: left;
position: absolute;
    margin-left: 650px

    
}

nav#cont ul li#t :hover{
color: rgb(247, 250, 250);

padding: 5px;
  
}
nav#cont ul li#yb {
width:148px;
height: 148px;
float: left;
position: absolute;
margin-left: 450px
    

    
}

nav#cont ul li#yb :hover{
color: rgb(247, 250, 250);

padding: 5px;
  
}
nav#cont ul li#y {
width:148px;
height: 148px;
float: left;
margin-left: 250px;
position: absolute

    
}

nav#cont ul li#y :hover{
color: rgb(247, 250, 250);

padding: 5px;
  
}


/* hoja de estilos de galeria 2 */
article#galeria{width: 860px;
height: 800px;
margin-top: 100px;
margin-left: 50px;}

article#galeria h1{
margin-left: 90px}



nav#galeria ul {
width: 90%;
height:90%;
float: left;
margin-top:40px;}

nav#galeria ul li {
width:250px;
height: 148px;
float: left;
    
}

nav#galeria ul li :hover{
color: rgb(247, 250, 250);


padding: 3px;
  
}

div#galeria{ width: 860px;
    height: 800px;
  background-color: rgba(51, 38, 51, 0.7);
 position: absolute;
z-index: 0}

/* hoja de estilos de tramado*/
article#tramado{width: 860px;
height: 800px;
margin-top: 100px;
margin-left: 50px;}

article#tramado h1{
margin-left: 100px}



nav#tramado ul {
width: 90%;
height:90%;
float: left;
margin-top:40px;}

nav#tramado ul li {
width:250px;
height: 148px;
float: left;
    
}

nav#tramado ul li :hover{
color: rgb(247, 250, 250);



  
}

div#tramado{ width: 860px;
    height: 800px;
  background-color: rgba(51, 38, 51, 0.7);
 position: absolute;
z-index: 0}


/* hoja de estilos de descargas */

article#descargas{width: 860px;
height: 800px;
margin-top: 100px;
margin-left: 50px;}

article#descargas h1{
margin-left: 90px}

article#descargas h2{
margin-left: 150px;
width: 200px;
margin-top:20px;
font-weight: 600;
text-align: center;
font-size: 20pt;
    background-color: rgba(235, 210, 64, 0.55);
    

}

nav#descargas ul {
width: 100%;
height:100%;
float: left;
margin-top:10px;
margin-left: 100px}

nav#descargas ul li {
width:300px;
height: 120px;
float: left;
font-family:'Maven Pro', sans-serif;
font-weight: 600;
font-size: 18pt;
    color: rgb(237, 237, 177)
    }


nav#descargas ul li :hover{
color: rgb(247, 250, 250);
background-color: rgba(41, 60, 52, 0.7);
padding: 5px;
  
}

div#des{ width: 860px;
    height: 800px;
  background-color: rgba(235, 210, 64, 0.55);
 position: absolute;
z-index: 0}

article#descargas h3{
margin-left: 450px;
width: 200px;
margin-top:60px;
font-weight: 600;
text-align: center;
font-size: 20pt;
    position: absolute;
    background-color: rgba(235, 210, 64, 0.55);
}