@charset "utf-8";
/* CSS Document */

body{
	font-family: 'Dosis', 'Lato', 'Montserrat', sans-serif, 'Yrsa', 'Bitter', 'Droid Serif', serif;
	font-size:12px;
    background-color:#e8e8e8;

	
	}
	
#contenedor{
width:100%;
height:auto;
margin:auto;
}

#contenido{
	width:100%;
	height:auto;
	margin-top:8%;
	}
	
#lateral_izq{
	width:50%;
	height:430px;
	background-color:#FFffff;
    float:left;
  
	}
	
#lateral_der_responsive{
  display:none;  
}


#lateral_der{
    width:50%;
    height:430px;
    float:right;

	}
	
img{
    width:100%;
    height:100%;
	float:right;
	}
	
#texto{
	width:60%;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	margin-top:15%;

}
	
h4{
	font-family:'Droid Serif', serif;
	text-transform:uppercase;
	font-size: 1.3rem;
	color:#525252;
	letter-spacing: .15em;
	margin:0;
	font-weight:100;
    margin-top:30%;

	}
	

	
p.texto1b{
	font-family:'Droid Serif', serif;
	font-size: 0.8rem;
	color:#525252;
	letter-spacing: .05em;
	font-weight:50;
    margin-top:7%;
    margin-bottom:7%;
	}
	
a.texto1c{
    font-family:'Yrsa', serif;
	font-size: 0.7rem;
	color:#525252;
	letter-spacing: .25em;
	text-transform:uppercase;
	font-weight:50;
    text-decoration: none;
    border-right:1px solid #000000;
    padding-right:8px;
}

a.texto1c:hover{
    color:#101010;
    font-weight: bold;	
}


a.texto1d{
    font-family:'Yrsa', serif;
	font-size: 0.7rem;
	color:#525252;
	letter-spacing: .25em;
	text-transform:uppercase;
	font-weight:50;
    text-decoration: none;
    padding-left:8px;

}

a.texto1d:hover{
    color:#101010;
    font-weight: bold;	
}

#materias{
    width:100%;
    height:500px;
}

h2.textoh2{
    color:#525252;
	font-size: 1.3em;
    font-family: 'Droid Serif', serif;
	letter-spacing: .1em;
		text-align: center;
        font-weight: 300;
    margin-bottom:5%;  
}


#textoizq{
	float:left;
    width:45%;
    height:35%;
        border-right:0.5px solid #d1d1d1;
	}
	
#textoizq h2{
	margin: 0 0 1em 0;
	padding: 0;
	font-size: 1.5em;
	font-family: 'Droid Serif', serif;
    color:#525252;
    letter-spacing: .1em;
	}
	
	#textoizq p{
	margin: 0 auto;
	padding: 10px 0;
	max-width: 700px;
	text-align: justify;
	font-weight: 300;
	font-size: 1.3em;
	font-family: 'Yrsa', serif;
	text-align: center;
    	color:#525252;

	}
	
	#textoder{
	float:right;
    width:50%;
	}
	
#textoder h2{
	margin: 0 0 1em 0;
	padding: 0;
	font-size: 1.2em;
	font-family: 'Droid Serif', serif;

		color:#525252;

	letter-spacing: .1em;
	

	}
	
	#textoder p{
	margin: 0 auto;
	padding: 10px 0;
	max-width: 700px;
	text-align: justify;
	font-weight: 300;
	font-size: 1.4em;
	font-family: 'Yrsa', serif;
	text-align: center;
        	color:#525252;

	}


@media handheld, screen and (min-width:600px) and (max-width:960px) {
    
   
    
    #contenido{
	width:100%;
	height:auto;
	margin-top:15%;
	}
    
    #lateral_izq{
	width:50%;
	height:300px;
	background-color:#FFffff;
    float:left;
  
	}
	
    #lateral_der{
    width:50%;
    height:300px;
    float:right;
	}
    
    h4{
	font-size: 1.1rem;
	}
    
    #materias{
    margin-top:20%;
}
    
    h2.textoh2{
	font-size: 1.4em;	
    }
    
    #textoizq h2{
	font-size: 1.3em;
	}
	
	#textoizq p{
    font-size: 1.5em;
	}

	
    #textoder h2{
	font-size: 1.3em;
	}
	
	#textoder p{
	font-size: 1.5em;
	}

}


@media handheld, screen and (max-width:599px) {
    
   #contenedor{
width:100%;
height:auto;
margin:auto;
}

#contenido{
	width:100%;
    height:270px;
    background-color:azure;
    margin:0;
	} 
    
    
    #lateral_izq{
    width:90%;
    height:100%;
    background-color:white;
    margin:0;
    padding:5%;
     display:flex;
        
	}
	
    #lateral_der{
    display:none;
	}
    
    
    img{
         margin:0;
        padding:0;
    }
    

    
    #texto{
	width:100%;
	height:auto;
    margin-top:0;
        margin-bottom:0;
         margin-left:0;
        margin-right:0;
}
    
    
    h4{
    margin-top:10%;
	}
    
    
    #boton{
        width:25%;
	   height:50px;
          margin-top:15%;
         margin-bottom:0;
        margin-left:0;
        margin-right:0;
    }
    
   #lateral_der_responsive{
       display:block;
       width:100%;
    height:auto;
    margin:0;
        padding:0;
    }
    
    #materias{
        width:100%;
    height:auto;
         margin-top: 60px;
        margin-bottom:70px;
    }
        
    h2.textoh2{
	font-size: 2em;
        margin-bottom: 30px;
 }


#textoizq{
	float:none;
    width:100%;
    border-right:none;
   border-bottom:0.5px solid #d1d1d1;
    margin-bottom:6%;
    margin-top:6%;
	}
	
#textoizq h2{
	font-size: 1.5em;
	}
	
	#textoizq p{
	font-size: 1.7em;
	}
	
	#textoder{
	float:none;
    width:100%;
	}
	
#textoder h2{
	font-size: 1.5em;
    margin-top: 40px;
	}
	
	#textoder p{
	font-size: 1.7em;
	}  
   
}