@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Lato:400,300italic,300,900);

body {
  background-image: url(img/1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
background-attachment:fixed;
  
     font-family: 'Lato', sans-serif;
    color: white;    
        }

.titulo {
    font-size: 70%;
    display: flex;
    justify-content: center;
    
}
.subtitulo {
     font-family: 'Lato', sans-serif;
    font-size: 80%;  
    letter-spacing: 0.1em;
}

h1{
    font-size: 100%;
}
.quienesomos {
color: white;
    font-size: 9pt;
    text-decoration: none;
margin-top: 1em;
padding-bottom: -2em;
    word-spacing: 0.2em;
    
}
.quienesomos:hover {
       color: #f7671b;
    
}

header nav ul {
    background-color: black;

    display: flex;
    justify-content: center;
    margin-top: 5%;
} 
img {padding-top: 2%; 
    
}

center img {
        padding-top: 5%;
    width: 60%;
}
.loggin {
    display: flex;
    justify-content: flex-end;
    font-size: 70%;
    margin-bottom: -5%;
    
}
.loggin  a:hover {
   color: #f7671b;  
}

.loggin a {
    text-decoration: none;
    color: white;
    padding: 0.8em;
    font-size: 9pt;
    border-right: solid;
    border-right-width: thin;
    
}



nav ul li {
    display: inline-block;
    list-style: none;
    padding: 0.5em;
    margin-left: -1.5em;
    width: 100%;
    display: flex;
    justify-content: center;
  
}


 
.buscador {
    margin-top: 6%;
    padding-bottom: -2em;
 height: -4em;
    display: flex;
    justify-content: flex-end;
    
   }
 
/*empieza buscador*/
.buscar {
    border-radius: 12px 12px 12px 12px;
    box-shadow: 0 2px 1px rgba(0, 0, 0, 0.4) inset, 0 1px 0 rgba(255, 255, 255, 0.5);
    height: 22px; 
        width: 10.5em;
}
.buscar input{
    border-radius: 50px;
    border: none;
    height: 22px;
    outline: none;
    padding: 0 0 0 30px;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAOCAQAAABedl5ZAAAAzklEQVQYlWNgAIP%2F9v%2FrwVCfARn85%2F%2B%2F%2Fz8CzEeS%2BnMQJPL0%2Ba37796DJfsZ4EYBwar9DBkMCQwFR86DJeXBUo%2F6QToYHCAKtaO%2Bf%2F%2F%2F%2F3kmmHNm%2Fv%2F%2FD27CTee4c%2Ff%2F%2F2vT4VKfXiM5CQg2t4M5lckQd%2F3nB0n8vQji5HhCFEpArP73AeGF35dACkEgYPtxmODXnxueg2igbqikh3l%2F1%2FpV%2B7vWyzUwxHatB%2BvcBLNfgMEA6AEDBg4g26Br%2FffvqeUMWIEBULcEdikGkG4AzGOfgUQC7TUAAAAASUVORK5CYII%3D') no-repeat 7px center;
    text-shadow: 0px 1px 0px #0f0f0f ;
      transition: 0.5s;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      -moz-transition: 0.5s;
      -ms-transition: 0.5s;
    width: 12.5em;
    }
.buscar input:focus {
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6%2BR8AAAAlElEQVR42oWQQRHEIAxF10ElVAISVgo3bCABCUhYCZWAhEpAQpoD6bzJhNnDO0DyyA8fEXkppXyVCpLViDUfyqVIQN9JFMY637hrlCySFauL21E7KVWbAIGx56rnSLqc5KPXSLo3kySalPhTygFhRDtFC09EIsMeZJSGBj7Qveh3OJW89syImiH%2BIO2BOJX0XwA2%2BQEL4pAhSX4aBQAAAABJRU5ErkJggg%3D%3D') no-repeat 7px center #FFF;
    color: #222;
    text-shadow: 0 1px 0 #FFFFFF;
  
}
/*fin de buscador*/





nav ul li a {
    text-decoration: none;
font-size: 120%;
color: white;
    padding: 0.5em;

}
nav ul li a:hover {
  color: #f7671b;  
}

.links {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    
}

.news {
    background-color: rgba(0, 0, 0, 0.37);
    display: flex;
    flex-direction: row-reverse;
    margin-left: 80%;
 }
.news p {
    font-size: 80%;
}

header{
    width: 60%;
    margin-left: 21%;
    margin-top: 2%;
    margin-bottom: -2%;
}



.lalala {
    background-color: rgba(255, 255, 255, 0.89);
    width: 60%;
    margin-left: 21%;
    margin-top: 2%;
    padding-top: 2%;
}

.usuarioforo {
    margin-top: 2em;
      border-bottom: dotted black thin;
    
}
.usuarionombre {
    color: black;
 font-family: 'Lato', sans-serif;
    font-size: 10pt;

    
}

.contestacionusuario {
    display: flex;
    justify-content: flex-start;
   
    margin-left: 2em;
       margin-right: 2em;
    border-top: dotted black thin;
    
}

.contestacionusuario img {
     width: 50px; height: 67px;
    
}
.usuarioimagen {
    margin-top: 1em;
    margin-left: 0.2em;
    text-align: left;
}

.titulorespuesta {
    color: #f7671b;
     font-family: 'Lato', sans-serif;
    font-size: 120%;
   
}
.respuestausuario {
    color: black;
    text-align: left;
    margin-left: 2em;
 
}

.textoforo {
     text-align: left;
    padding-top: 0.5em;
    margin-left: 2em;
   margin-right: 2em;
    color: black;
}

.leyenda {
    color: black;
    font-size: 14pt;
    word-spacing: 0.1em;
    padding-left: 0.5em;
    padding-right: 0.5em;
}

.subir {
   
    color: black;
    text-decoration: none;
     font-family: 'Lato', sans-serif;
}
.subir:hover {
    color: #f7671b; 
    
}

.bgfondo{
    background-color: rgba(255, 255, 255, 0.77);
    width: 60%;
    margin-left: 21%;
    margin-top: 2%;
    padding-top: 2%;
}
.tabla {
    table-layout: fixed;
    text-align: center;
    color: black;
    width: 80%;
    
}

table tr td img {
    width: 55px; 
    height: 60px;
}
table tr td a {
 
    color: black;
    
    text-decoration: none;

}
table tr td {
    padding: 1em;
    border-bottom: dotted black thin;
}
table tr td a:hover{
    color: #f7671b; 
    
}
.tablatitulo {
  
    text-align: left;
    height: 8px;
}

.tablaforo{
    text-align: left;
width: 80%;
}
.columnas {
    display: flex;
    flex-wrap: wrap;
   justify-content: center;
}

.columnasinicio{
     display: flex;
    flex-wrap: wrap;
   justify-content: center;
    
}

.apuntes {
    width: 35%;
    background-color: rgba(0, 0, 0, 0.63);
    margin: 2em;
    padding: 1em;
}
.apuntes h3 {
    font-size: 12pt;
    color:#f7671b;  
;
}

.textoapuntes{
    text-align: left;
    padding-top: 0.5em;
    padding-left: 8em;
    padding-right: 8em;
    color: black;
}

.novedades {
    color: black;
    font-size: 16pt;
    text-align: center;
    width: 70%;
}

.registrarte {
    color: #f7671b; 
    background-color:white;
    text-decoration: none;
    padding: 0.5em;
    margin-top: 2em;
    line-height: 2em;
}
.registrarte:hover {
   
    color: black;
}


.inicio{
    width: 30%;
    background-color:  #f7671b; 
    margin: 2em;
    padding: 1em;
    color: white;
    
}
.inicio a{
    font-size: 10pt;
    color: white;
    text-decoration: none;
    
}
.inicio a:hover  h3{
    color: black;
}


.materia{
    font-size: 10pt;
    color: white;
}
.barthes{
      font-size: 10pt;
    color: black;
}
.datos{
    font-size: 8pt;
    margin-top: -1em;
}
.descargar {
     font-family: 'Lato', sans-serif;
    background-color: white;
    color: black;
    text-decoration: none;
    font-size: 8pt;
    padding: 0.3em;
    
}
.descargar:hover {
     color:#f7671b;  
    
}

.responder {
     font-family: 'Lato', sans-serif;
    background-color: white;
    color: black;
    text-decoration: none;
    font-size: 12pt;
    padding: 0.3em;
    
}
.responder:hover {
     color:#f7671b;  
    
}
.vermas {
    color:#f7671b;  
    font-size: 9pt;
    text-decoration: none;
   padding-top: 0.5em;
}
.vermas:hover {
    color: white;
    
}

.h3apuntes {
    text-decoration: none;
    
}
.h3apuntes h3:hover {
    color: white;
}
.ec-stars-wrapper {
	/* Espacio entre los inline-block (los hijos, los `a`) 
	   http://ksesocss.blogspot.com/2012/03/display-inline-block-y-sus-empeno-en.html */
	font-size: 0;
	/* Podríamos quitarlo, 
		pero de esta manera (siempre que no le demos padding), 
		sólo aplicará la regla .ec-stars-wrapper:hover a cuando
		también se esté haciendo hover a alguna estrella */
	display: inline-block;
}
.ec-stars-wrapper a {
	text-decoration: none;
	display: inline-block;
	/* Volver a dar tamaño al texto */
	font-size: 16px;

	color: #000000;
}

.ec-stars-wrapper:hover a {
	color: #f7671b;  
}
/*
 * El selector de hijo, es necesario para aumentar la especifidad
 */
.ec-stars-wrapper > a:hover ~ a {
	color: #000000;
}


* {
    box-sizing: border-box;
}

body {
    text-align: center;
}

input[name="slider-select-element"] {
    display: none;
}

#slider-arrows {
    margin: -10% auto 0 auto;
    width: 80%;
}

#slider-box {
    height: 100%;
    width: 300%;
}

#slider-container {
    height: 40%;
    margin: 0 auto;
    overflow: hidden;
    text-align: left;
    width: 80%;
}

.element-blue,
.element-green,
.element-red {
    min-height: 400px;
    max-height: 100%;
    width: 100%;
}

.element-blue {
    background-image: url(img/slider%204.jpg)  ;
}

.element-green {
    background-image: url(img/slider%205.jpg)  ;
}

.element-red {
    background-image: url(img/slider%206.jpg);
}

.slider-element {
    float: left;
    width: 33.333%;
}

#element1:checked ~ #slider-arrows label:nth-child(2),
#element2:checked ~ #slider-arrows label:nth-child(3),
#element3:checked ~ #slider-arrows label:nth-child(1) {
    display: block;
    float: right;
}

#element1:checked ~ #slider-arrows label:nth-child(3),
#element2:checked ~ #slider-arrows label:nth-child(1),
#element3:checked ~ #slider-arrows label:nth-child(2) {
    display: block;
    float: left;
}

#element1:checked ~ #slider-arrows label:nth-child(2):before,
#element2:checked ~ #slider-arrows label:nth-child(3):before,
#element3:checked ~ #slider-arrows label:nth-child(1):before {
    color: black  ;
    content: "\f054";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: antialiased;
}

#element1:checked ~ #slider-arrows label:nth-child(3):before,
#element2:checked ~ #slider-arrows label:nth-child(1):before,
#element3:checked ~ #slider-arrows label:nth-child(2):before {
    color: black  ;
    content: "\f053";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: antialiased;
}

#element1:checked ~ #slider-container #slider-box {
    margin-left: 0;
}

#element2:checked ~ #slider-container #slider-box {
    margin-left: -100%;
}

#element3:checked ~ #slider-container #slider-box {
    margin-left: -200%;
}

#slider-arrows label {
color: transparent;
    cursor: pointer;
    display: none;
    font-size: 2rem;
    height: 0px;
    width: 20px;
    margin-top: -2em;
}

#slider-box {
    -webkit-transition: all 0.75s ease;
    -moz-transition: all 0.75s ease;
    -ms-transition: all 0.75s ease;
    -o-transition: all 0.75s ease;
    transition: all 0.75s ease;
}
.trabajos{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 5em;
    justify-content: space-around;
    margin left: 9em;
    padding: 6em;
    }

.formulario {
    margin-left: 22%;
    margin-right: 22%;
    background-color: rgba(0, 0, 0, 0.44);
    padding-left: 12%;
    padding-right: 12%;
   padding-bottom: 2%;
    padding-top: 2%;
    
}

.linea {
    border-bottom: solid;
    border-bottom-color: white;
    border-bottom-width: thin;
    border-top: solid;
    border-top-color: white;
    border-top-width: thin;
    
    padding-bottom: 5%;
    
}
.registrar {
    font-size: 22pt;
    border-bottom: solid; color: rgba(0, 0, 0, 0.56);
    border-bottom-width: thin;
     width: 55%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-top: 0.1em
   
}
.formulario label {
    display: flex;
    flex-direction: row;
    padding-bottom: 2%;
    padding-top: 2%;
}

.formulario h4 {
    color: white;
   margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-top: 0.1em;
    
    
}

.formulario input {
    display: flex;
    flex-direction: row;
    background-color: rgba(173, 173, 173, 0.45);
     font-family: sans-serif; color: white;
   border: none;
 
    
}
.sexo {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    
}

.campo {
      border-radius: 1em;
 height: 3%;
     margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-top: 0.1em
}
.campo1 {
     border-radius: 2em;
    font-size: 70%;
    width: 100%;
    height: 3%;
}

.campo2 {
     border-radius: 2em;
    font-size: 70%;
   width: 100%;
    height: 3%;
}


.campo3 {
     border-radius: 2em;
    font-size: 70%;
    width: 100%;
    height: 3%;
}

.campo4 {
     border-radius: 2em;
    font-size: 70%;
    width: 100%;
    height: 3%;
}
  
.campo5 {
     border-radius: 2em;
    font-size: 70%;
    width: 100%;
    height: 3%;
}

.campo6 {
      border-radius: 1em;
 height: 3%;
     margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-top: 2em;
    
}
.nacimiento {
      display: flex;
    flex-direction: row;
    justify-content: space-between;
}

select {
     border-radius: 2em;
    font-size: 70%;
    width: 20%;
    height: 3%;
    margin-top: 3%;
    background-color: rgba(173, 173, 173, 0.45);
     font-family: sans-serif; color: white;
   border: none;
    }
option {
    background-color: rgba(0, 0, 0, 0.44);
}




footer {
    margin-top: 20%;
    background-color: rgba(0, 0, 0, 0.37);
}

footer p {
    text-align: center;
    font-size: 80%;
    padding-top: 5;
    
}

footer h6 {
    text-align: center;
    margin-top: -5;
     padding-bottom: 5;
}

@media all and (max-width: 1100px){
    * {
        
    }

    .columnas {
        
         display: flex;
   flex-direction: column;
        justify-content: space-between;
      
       
       
 
        
    }   
    .apuntes {
    width: 60%;
    background-color: rgba(0, 0, 0, 0.63);
border-bottom: dotted thin black;
      
    padding: 1em;
        padding-top: 2em;
        padding-bottom: 3em;
      margin-left: -5em;
        margin: auto;
    
}
    .formulario {
    margin-left: 17%;
    margin-right: 17%;
    background-color: rgba(0, 0, 0, 0.44);
    padding-left: 12%;
    padding-right: 12%;
   padding-bottom: 2%;
    padding-top: 2%;
    
}
  
    
 
    
    
.inicio{
    width: 50%;
    background-color:  #f7671b; 
    margin-left: -2em;
    margin: 2em;
    padding: 1em;
    color: white;
    
}
    
    .textoapuntes{
    text-align: left;
    padding-top: 0.5em;
    padding-left: 4em;
    padding-right: 4em;
    color: black;
}
    .tabla {
        font-size: 80%;
    }
    
}
@media all and (max-width: 900px){

    .columnas {
        
         display: flex;
justify-content: center;
   flex-direction: column;
 
        
    }   
    .apuntes {
    width: 60%;
    background-color: rgba(0, 0, 0, 0.63);
  
    padding: 1em;
        justify-content: center;
}
    
    nav ul {
        
          display: flex;
  
   flex-direction: column;
    justify-content: center;
        padding-left: -1em;
        margin-top: 2em;
        
    }
    nav ul li {

      
    list-style: none;
    padding: 0.5em; 
    width: 100%;
     display: block;
    display: inline;
        margin-bottom: 1em;
       
   

      
}
    
}
@media all and (max-width: 750px){

   .tabla {
        font-size: 70%;
       width: 90%;
       
    }
    .tabla img {
        width: 50%;
        height: 50%;
    }
      .formulario {
    margin-left: 11%;
    margin-right: 11%;
    background-color: rgba(0, 0, 0, 0.44);
    padding-left: 12%;
    padding-right: 12%;
   padding-bottom: 2%;
          padding-top: 2%;}
    footer {
        font-size: 70%;
    }
    
}
  
    @media all and (max-width: 550px){
      
        body {
       
        }
    .lalala {
    background-color: rgba(255, 255, 255, 0.89);
 width: 100%;
 margin: 0;
    margin-top: 2%;
    padding-top: 2%;
}
  
        .bgfondo{
    background-color: rgba(255, 255, 255, 0.77);
    width: 100%;
 margin: 0;
    margin-top: 2%;
    padding-top: 2%;
}
      header nav ul {
    background-color: black;
          width: 100%;
          margin: 0;
    margin-top: 5%;
}   
        header nav ul li {
            width: 100%;
            margin-left: -1em;
        }
        footer {
            font-size: 70%;
        }
       
    }
        @media all and (max-width: 400px){
            .tabla img {
        width: 50%;
        height: 50%;
    }
            .subtitulo {
                font-size: 50%;
            }
            
    }