@import url(http://fonts.googleapis.com/css?family=Oswald:400,300,700);
@import url(http://fonts.googleapis.com/css?family=Roboto:100,300);

body {
    margin: 0px; 
    background: #000;
    background-image: url(img/fondo.png)
}

header {
    width: 100%;
    height: 120px; 
    margin: 15px 5px; 
    background: #CD284B;
    margin: 0px;
    background-image: url(img/stripe.png)
}

.marquesina { 
        width: 100%;
        background: #000;
        height: 30px;
        display: inline-block;
    font-family: 'arial', sans-serif;
    color: #7bedb8;
    font-size: 14px; 
    font-weight: 300;
    

}

.marquesina1 {background: #000;
                width: 100%; 
                height: 50px; 

}

.logoilus { width: 8%;
    float: left;
    margin: 20px auto 10px 20px; 
    
}

nav  {
    width: 40%;
    height: 80px;
    background: #71E8B8;
  float: right;
  margin-top: 20px;
  padding-right: 200px;
    margin: 20px auto 10px 20px;
}     
         
            
           
            
            .menunav {
                width:142%; 
                margin:20px auto; 
                list-style:none;
            }
 
            .menunav > li {
                float:left;
                

            }
            
            .menunav li a {
                font-family: oswald, arial, sans-serif;
                color:#CD284B;
                text-decoration:none;
                padding:10px 14px 10px ;
                display:block;
                font-size: 14px;
                
                
            }
            
            .menunav li a:hover {
                background-color:#000;
                color: #CD284B;
                display: block;
                
            }
            
            .menunav li ul {
                display:none;
                position:absolute;
                list-style: none;
                
                
            }
            
            .menunav li:hover > ul {
                display:block;
            }
            
            .menunav li ul li {
                position:relative;
            
            }
                
            
            


.submenu  {
    background-color: #000;
padding: 1px;}



            .menunav li ul li ul {
                right: 2px;
                top:50px;}


main {
    width: 100%;
    background: #CD284B; 
    margin: 0px; 
    
}

section {
    width: 100%;
    background: #CD284B;  
    margin: 0px; 
    float: left; 

} 



.pagina {
    max-width: 960px; 
    margin: 0 auto; 
}

footer {
    background: #000;
    width: 99%;
    text-align: center; 
    padding: 0 5px; 
    height: 250px; 
    float: left;
}



.footertext {
    font-family: verdana, arial, sans-serif;
    color: #000;
    font-size: 8px; 
    text-align: left;
    
}

.bienvenido {width: 100%;
            height: 280px; 
            background-color: #000;
            background-image: url(img/fondobienve2.png);
            margin: 0;

}

.bienvenidotxt {font-family: oswald, arial, sans-serif;
                color: #71E8B8;
                font-size: 80px; 
                position: relative;
                font-weight: 400;
                font-weight: 700; 
                width: 90%;
                margin-left: 30px;
                border-bottom: 2px #CD284B solid;
}

.bienb {font-size: 40px; 
        font-weight: 100;
        color: #fff;
        position: absolute;
        padding: 10px 20px;
        background-color: #CD284B;
        font-family: oswald, arial, sans-serif;  
        margin-top: 40px;
        margin-left: 0px;
    
}



.articleuno {
        width: 33.3%;
        height: 320px;
        float: left;
        background: #CD284B;
        
}

.articlereferencias{
        width: 33.3%;
        height: 320px;
        float: left;
        background: #000;
        background-image: url(img/diagon.png)
        
}

.referenciastxt { font-size: 30px;
              margin: 15px 20px;  
            color: #CD284B;
   font-family: 'Oswald', sans-serif;
    float: left; 
    line-height: 40px;
    }

.archivohistorico {
    font-family: arial, sans-serif;
    color: #CD284B;
    font-size: 16px; 
    font-weight: 400;
    margin: 160px 20px 0 20px;
    width: 60%;
    float:right;
    border-top: 3px #CD284B solid ;
    padding: 10px 0 0 0;
    text-align: right;
 
}

.cursada {
        width: 33.3%;
        height: 320px;
        float: left;
        background: #CD284B;
        background-image:url(img/cursada.png)
}

.cursadatxt {font-size: 80px;
              margin: 60px 50px;  
            color: #71E8B8;
   font-family: 'Oswald', sans-serif;
    line-height: 100px;
    
    transform: rotate(-90deg);
	float: left
    
}

.invitado {
        width: 33.3%;
        height: 320px;
        float: left;
        background: #CD284B;
        background-image:url(img/invitado.png)
}

.invitadotxt { font-size: 30px;
              margin: 225px 20px;  
            color: #71E8B8;
   font-family: 'Oswald', sans-serif;
    float: left; 
    line-height: 40px;
    }

.articledos { width: 640px;
            height: 320px;
            background: #CD284B;
    float: left
    
    
}

.galeriatxt {font-size: 80px;
              margin: 60px 50px;  
            color: #71E8B8;
   font-family: 'Oswald', sans-serif;
    line-height: 100px;

}
    
.noticiastxt {
    font-size: 80px;
              margin: 60px 50px;  
            color: #71E8B8;
   font-family: 'Oswald', sans-serif;
    line-height: 100px;
    
    transform: rotate(-90deg);
	float: left
    
}





.logosfooter { 
        width: 30%;
    height: 50px;
    float: right; 
    margin: 25px 15px 0 0; 
    border-bottom: 1px #71E8B8 solid ;}

.infootertxt {
    
    width: 100%;
        height: 30px;
        display:inline-block;
    font-family: 'arial', sans-serif;
    color: #7bedb8;
    font-size: 11px; 
    font-weight: 300;
    text-align: left;

}


.logodgpc {width: 20%;
            float: left;
            margin: 10px auto 10px 0; 
    
}

.fadulogo {width: 25%;
            float: right;
            margin: 12px auto 10px 0; 
    
}

.redes { 
    width: 15%;
    height: 50px;
    float: left; 
    margin: 180px 15px 0 10px; 
    border-top: 1px #71E8B8 solid ;}

.redesiconos {
    width: 100%;
    position: relative;
    float: right;
    margin: 5px auto auto 1px;
    padding: 1px; 
} 




/* SLIDER */ 



#slider-wrapper{
			width: 640px;
			height: 320px;
			position: relative;
			margin-bottom: 0px;
			background: rgba(0,0,0,0.5);
			overflow: hidden;
		}
		
				#s1{
					padding: 6px;
					background: #CD284B;
					position: absolute;
					left: 50%;
					bottom: 25px;
					margin-left: -300px;
                    margin-bottom: -10px;
					border-radius: 20px;
					opacity: 0.3;
					cursor: pointer;
					z-index: 999;
                    border: solid #71E8B8 2px; 
				}
				
				#s2{
					padding: 6px;
					background: #CD284B;
					position: absolute;
					left: 50%;
					bottom: 25px;
					margin-left: -280px;
                    margin-bottom: -10px;
					border-radius: 20px;
					opacity: 0.3;
					cursor: pointer;
					z-index: 999;
                    border: solid #71E8B8 2px; 
				}
				
				#s3{
					padding: 6px;
					background: #CD284B;
					position: absolute;
					left: 50%;
					bottom: 25px;
					margin-left: -260px;
                    margin-bottom: -10px;
					border-radius: 20px;
					opacity: 0.3;
					cursor: pointer;
					z-index: 999;
                    border: solid #71E8B8 2px; 
				}
				
				#s4{
					padding: 6px;
					background: #CD284B;
					position: absolute;
					left: 50%;
					bottom: 25px;
					margin-left: -240px;
                    margin-bottom: -10px;
					border-radius: 20px;
					opacity: 0.3;
					cursor: pointer;
					z-index: 999;
                    border: solid #71E8B8 2px; 
				}
				
				#s1:hover, #s2:hover, #s3:hover, #s4:hover{ opacity: 1;}
				
			.inner-wrapper{
				width: 640px;
				height: 320px;
				position: absolute;
				top: 0;
				left: 0;
				margin-bottom: 0px;
				overflow: hidden;
			}
				.control{ display: none;}
				
				#Slide1:checked ~ .overflow-wrapper{ margin-left: 0%; }
				#Slide2:checked ~ .overflow-wrapper{ margin-left: -100%; }
				#Slide3:checked ~ .overflow-wrapper{ margin-left: -200%; }
				#Slide4:checked ~ .overflow-wrapper{ margin-left: -300%; }
				
				#Slide1:checked + #s1 { opacity: 1; }
				#Slide2:checked + #s2 { opacity: 1; }
				#Slide3:checked + #s3 { opacity: 1; }
				#Slide4:checked + #s4 { opacity: 1; }
				
			.overflow-wrapper{
				width: 400%;
				height: 100%;
				position: absolute;
				top: 0;
				left: 0;
				overflow-y: hidden;
				z-index: 1;
				-webkit-transition: all 0.3s ease-in-out;
				-moz-transition: all 0.3s ease-in-out;
				-o-transition: all 0.3s ease-in-out;
				transition: all 0.3s ease-in-out;
			}
			
				.slide img{
					width: 25%;
					float: left;
				}




/* PAGINA LA CATEDRA */

.logoroldanfull {background-color: #000;
                width: 320px;
                height: 320px;
                float: left;}

.logoroldanfull img {width: 60%;
                    margin-top: 20px;
                    margin-left: 60px;
                    }

.txt1 {width: 320px;
       height: 640px;
        float: left;
        background-color: #CD284B;}

.txt1 p {
    font-family: 'roboto',arial, sans-serif;
    color: #fff;
    font-size: 12px; 
    text-align: left;
    margin: 10px;
    padding: 10px;
    }

.primera {border-top: 1px solid #fff;}


.txt2 {width: 320px;
       height: 640px;
        float: left;
        background-color: #CD284B;}

.txt2 p {
    font-family: 'roboto',arial, sans-serif;
    color: #fff;
    font-size: 12px; 
    text-align: left;
    margin: 10px;
    padding: 10px;
    
    }


.catedra {width: 320px;
         height: 320px;
         float:none;
         background: #CD284B;
        margin-top: 320px;}

.catedra h1 {font-size: 80px;
            margin-top: 70px;
            margin-left: 10px;
            color: #71E8B8;
   font-family: 'Oswald', sans-serif;
    line-height: 100px;
    position: absolute;
    border-bottom: 2px solid #fff;
    padding-bottom: 2px;}

.menuvolver {width: 320px;
         height: 320px;
         background: #CD284B;
        float: left;}



.menuvolver  li {
        text-align: left;
        padding-left: 5px;
        list-style: none;
        position: relative;
        top: 230px;
        padding: 3px;}

.menuvolver  li a {
        font-family: 'roboto',arial, sans-serif;
        color: #fff;
        font-size: 16px;
        text-decoration: none;
        margin-left: 10px;
        padding: 3px;
        font-weight: 900;
        }

.menuvolver li a:hover {
        background: #000;
        padding-top: 3px;
        padding-bottom: 3px;
        padding-left: 3px;
        padding-right: 3px;
        color: #71E8B8;

    }
    
.cosito {width: 25px;
        height: 5px;
        background: #71E8B8;
        margin-left: 15px;
        margin-top: 220px;
        position: absolute;}

.frase {width: 640px;
        height: 320px;
        float: lef;
        background: #CD284B;
        position: absolute;
        margin-left: 320px;
        }

.frasesita {font-family: 'oswald', arial,sans-serif;
            font-size: 50px;
            position: relative;
            color: #71E8B8;
            margin-top: 0;
            margin-left: 20px;

}


/* PÁGINA DOCENTES */ 

.docentesinicio {width: 320px;
                 height: 320px;
                float: left;

}

.docentesinicio h1 {font-family: 'oswald', arial, sans-serif;
                    color: #71E8B8;
                    font-size: 50px;
                    line-height: 60px;
                    margin-left: 20px;
                    margin-top: 20px;}


.docentes {width: 320px;
           height: 320px;
           position: relative;
           float: left;}

.docentes img {
  position: absolute;
  left: 0;
  transition: opacity 0.2s ease-in-out;
    

}

.docentes img.top:hover {
  opacity: 0;
}

.datosdocente {height: 320px;
               width: 320px; 
               background: #000; 
                float: left;
                background-image: url(img/diagon.png);}

.cosito3 {width: 25px;
        height: 5px;
        background: #71E8B8;
        margin-left: 20px;
        margin-top: 100px;
        position: absolute;}

.cosito4 {width: 25px;
        height: 5px;
        background: #71E8B8;
        margin-left: 15px;
        margin-top: 220px;
        position: absolute;}