.container
	{max-width: 1366px; margin: auto; display: block; padding-top: 8vh;}
footer
{width: 100%; height: 2vh; background-color:#000; clear: both; position: fixed; bottom: 0;}
/*
@media (max-width: 599px) and (orientation: portrait)
	{
	*/

header .redes p
	{width: 50%;}
header .redes
	{
	position: absolute;
    left: 30%;
    right: 30%;
    background-color: #88192b;
    height: 6vh;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 1vh;	color: #FFF;
		
	}


#home h4
	{font-size: 0.95em; text-align: center; display: block; color: #444;}


.fr .topic .miniatura
	{width: 25%!important;}


#home .texte
	{background-color: #88192b;
    padding: 10px;
    color: #FFF;
    border-radius: 10px;
    font-family: "b";
	margin: 10px auto; display: block; width: 70%; text-align: center;
	}

#home .bandera
{width: 50px;
    height: 35px;
    display: block;
   margin: auto;
    background-position: center;
    background-size: cover;}

#home .buttum
{right: 10%;}
#home .tup
{left: 10%;}
#home .grouped a
	{width: 100%; border: 2px #888 solid; border-radius: 20px; display: block; padding: 10px 0; overflow: hidden;}
#home .grouped h3
{font-family: "a"; font-size: 1.55em; text-align: center;}
#home .grouped
	{width: 30%; position: absolute; bottom: 20%;}

#home .cercleLogo
	{width: 200px; height: 200px; position: absolute; background-position: center; background-color: #FFF; border-radius: 100%; background-repeat: no-repeat; left:50%; margin-left: -100px; bottom: 50%; background-size: contain;}

#home .logoMain
	{width: 50%; position: absolute; bottom: 12vh; left: 25%;}
#home .franjaRoja
	{position: fixed; top: 0; height: 2vh; background-color: #88192b; left: 0; right: 0;} 

#home .franjaRojaD
	{position: fixed; bottom: 0; height: 10vh; background-color: #88192b; left: 0; right: 0;  color: #FFF; display: flex; justify-content: center; align-items: center; text-align: center; } 
#home .imagi
{position: fixed; left: 0; right: 0; top: 0; bottom: 0; background-position: center; background-size: cover; opacity: 0.25;}
#home
	{width: 100%; height: 100vh; position: relative;}





#cambioModo .cambioIdioma .texte, #cambioModo .voltar .texte
	{background-color: #88192b;
    padding: 10px;
    color: #FFF;
    border-radius: 10px;
    font-family: "b";
	position: absolute; right: 2.5%; bottom: 15px;
	}

#cambioModo .voltar.desplegado
	{display: block;}
#cambioModo .voltar
	{display: none;}

#cambioModo .cambioIdioma .texteA
	{position: absolute; bottom: 2px; right: 2px; font-size: 0.75em;}
#cambioModo .cambioIdioma .bandera
	{width: 50px;
    height: 35px;
    display: block;
    position: absolute;
    left: 0;
    background-position: center;
    background-size: cover;}
.cambioIdioma.contraido
	{display: none;}
#cambioModo .cambioIdioma
	{position: absolute; right: 2.5%; top: 7px;  color: #555; height: 50px; width: 160px;}

#cambioModo .hom
	{position: absolute; left: 2.5%; top: 7px;}
#cambioModo .hom img
	{height: 45px;}
#cambioModo.desplegado
	{height: 60px;}
#cambioModo
	{position: fixed; top: 0; left: 0; right: 0; bottom: 0; height: 0; background-color: rgba(255,255,255,0.80); border-bottom: 1px solid #444; z-index: 3; overflow: hidden; transition: height 0.25s;}


header a
	{width: 4vh; height: 4vh; background-size: cover; border-radius: 100%; display: block; margin: 0 10px; background-color: #FFF; }



	#contacto .contactoMain h2
		{font-family: "d"; font-size: 2.25em; text-align: center; letter-spacing: 2px; margin-top: 5vh; }
	#contacto .contactoMain
		{width: 95%; margin: 1vh auto;}
	#contacto .botonear a::before
		{padding-top: 100%; content: ""; display: block;}
	#contacto .botonear a span
		{position: absolute; bottom: 10px; width: 100%; left: 0;}
	#contacto .botonear a .miniatura::before
		{padding-top: 100%; content: ""; display: block;}
	#contacto .botonear a .miniatura
		{width: 50%; position: absolute; background-size: cover; background-position: center;}
	#contacto .botonear a
		{margin: 0 10px; padding: 10px; width: 17%; border: 1px solid #888; border-radius: 10px; text-align: center; position: relative; display: flex; justify-content: center; color: #555;}
	#contacto .botonear
		{width: 100%; display: flex; justify-content: center;}
	#contacto h3
		{ letter-spacing: 1px; text-align: center; font-family: "b"; font-size: 1.75em;}
	#contacto .presencial h3
		{background-color: rgba(35,0,0,0.83); padding: 10px 0;}
	#contacto .presencial .map
		{background-color: #3B050E; width: 17%; padding: 2%; position: absolute; bottom: 0; right: 0; color: #FFF; font-family: "a";}
	#contacto .presencial .direccion
		{background-color: #88192b; width: 75%; position: absolute; bottom: 0; padding: 2%; color: #dadada; font-family: "b"; font-size: 0.75em;}
	#contacto .presencial h3
		{color: #FFF;}
	#contacto .generic
		{width: 80%; margin: 1vh auto 2vh auto; display: block; text-align: justify; }
	#contacto .presencial
		{height: 33%;
    background-size: cover;
    background-position: center;
    position: relative;
    width: 80%;
    margin: 2.5vh auto;
    border-radius: 10px;
    overflow: hidden;}
		
	#contacto.desplegado
		{bottom: 0; display: block;}
	#contacto
		{background-color: rgba(213,213,213);position: fixed; left: 0; right: 0; top: 0; bottom: 100%; display: none; transition: bottom 0.25s;}
		
		
	.contactLauncher
		{position: fixed; bottom: 0; height: 8vh; left: 0; right: 0; background-color: #444; display: flex; justify-content: center; align-items: center; color: #FFF; font-size: 2.5em; font-family: "a"; letter-spacing: 3px;}
	.separador hr
		{width: 60%; height: 2px; border: none; background-color: #888;}
	.separador
		{width: 100%; height: 5vh; display: flex; align-items: center; justify-content: center;}
		
	.bolita
		{width: 12px; height: 12px; position: absolute; background-color: #FFF; border: 2px solid #888; border-radius: 100%;}
		
	#intro .bloque1
		{position: absolute; top: 50%;}
	
	#intro .miniatura
		{background-position: center; background-size: cover; width: 50%; position: absolute; bottom: 51.5%; border-radius: 10px; border: solid 2px #888; background-repeat: no-repeat;}
		
	#intro .miniatura::before
		{content: ""; padding-top: 100%; display: block; }
		
	#intro .logoMain
		{position: absolute; top: 2.5vh; width: 30%;}
	#intro
		{display: flex; justify-content: center;}
	#intro h3 strong
		{display: block; clear: both; font-size: 1.25em;}
	#intro h3
		{position: absolute; top: 70%; width: 80%; text-align: center; font-size: 0.78em;}
	#intro h2
		{font-size: 1.10em; text-align: center; margin-top: 0; font-family: 'b'; }
		
	#intro h1
		{font-size: 3em; text-align: center; font-family: 'a'; }
		
	#intro .atencion strong
		{display: block; clear: both; font-size: 0.98em;}
	#intro .atencion p
		{font-family: "b";}
	#intro .atencion
		{position: absolute; bottom: 20vh; text-align: center; width: 70%; font-size: 0.90em; }
		
	menu a
		{margin: 0 5%; background-color: #88192b; padding: 10px; color:#FFF; border-radius: 10px; font-family: "b";}
	menu 
		{display: flex; justify-content: center; position: fixed; bottom: 2vh; height: 10vh; width: 100%; align-items: center; background-size: contain; background-image: url(../img/grad.png); background-position: center; background-repeat-y: no-repeat;}
	#trayectoria
		{padding-bottom: 10vh;}
	#trayectoria .idiomas .topic p
		{position: absolute; top: 2vh; right: 0; width: 50%; text-align: left; font-size: 0.85em;}
		
	#trayectoria .idiomas .topic h4
		{position: absolute; top: 0; right: 0; width: 50%; text-align: left; font-size: 0.85em;}
	#trayectoria .idiomas .topic div::before
		{padding-top: 100%; content:""; display: block;}
	#trayectoria .idiomas .topic div
		{width: 40%; position: absolute; left: 0; top: 0; border-radius: 100%; background-position: center; background-size: cover;}
	#trayectoria .idiomas .topic
		{position: relative; width: 28%; margin: 0 1%; height: 63px;}
	#trayectoria .idiomas
		{width: 100%; height: 80px; display: flex; justify-content: center; align-items: center;}
	#trayectoria .trayecto h3
		{margin-bottom: 3vh;}
	#trayectoria .trayecto .topicA .miniatura
		{width: 80px; height: 80px; float: left; margin-right: 10px; background-position: center; background-size: contain;}
	#trayectoria .trayecto hr
		{width: 80%; margin: auto; display: block; height: 2px; opacity: 0.5; margin-bottom: 3vh; background-color: #88192b;}
	#trayectoria .trayecto .topicA
		{width: 100%; min-height: 80px; margin-bottom: 3vh;}
	#trayectoria h3
		{margin-top: 3vh; font-weight: normal; text-align: center; letter-spacing: 2px; font-size: 1.55em; }
		
	
	#trayectoria h2
		{margin-top: 3vh; font-size: 1.25em; width: 100%;}
	#trayectoria .frasePrevia
			{width: 80%; margin: 10vh auto 0 auto; font-size: 0.85em; font-style: italic;}
		
		
	#presentacion
		{padding-top: 7vh; font-size: 1.15em; text-align: justify; letter-spacing: -1px;}
	#presentacion h3
		{width: 90%; color: #88192b; text-align: center; font-size: 0.95em; margin-bottom: 10vh; font-family: "b";   }
		
	#servicios .topic .miniatura::before
		{padding-top: 100%; content: ""; display: block;}
	#servicios .topic
		{position: relative; clear: both; overflow: hidden;}
	#servicios .topic .miniatura
		{width: 30%; border-radius: 100%; background-position: center; background-repeat-y: no-repeat; background-size: cover; border: solid 2px #888; float: left; margin-left: 5%;} 
	#servicios .la li
		{list-style:disc; margin-left: 25px; font-family: "b";}	
		
	#servicios .la ul li
		{list-style:circle; font-family: "c";}	
	
	#servicios .la
		{width: 59%; float: left; font-size: 1.15em; letter-spacing: -2px; text-align: justify;}
	#servicios .topic h3
		{font-size: 2em;}
	#servicios h3
		{width: 90%; color: #88192b; text-align: left; font-size: 1.35em; margin-bottom: 5vh; }	
	
	section .enfasis p
		{font-family: "a";}
	section .enfasis
		{width: 80%; padding: 5%; background-color: #aaa; margin: 5vh auto; display: block; border-radius: 10px; }
	section ul li
		{margin-bottom: 2vh;}
	section ul ul
		{margin-left: 10%;}
	section h2
		{font-size: 1.85em; text-align: center; margin-top: 10vh; }
	section
		{min-height: 100%; width: 80%; margin: auto; display: block; }
/*

	}
*/

header .logoMain
	{display: none;}


@media (min-width: 600px)
	{
	header
		{width: 100%; height: 8vh; border-bottom: #88192b 2px solid; position: fixed; top: 0; background-color: #FFF; z-index: 2;}
		
	#cambioModo .logoMain
		{display: none;}
	#cambioModo
		{height: 7vh; min-width: 190px; top: 1vh; left: auto;}
	#trayectoria .idiomas
		{height: auto; display: block;}
		
	#trayectoria .idiomas .topic div
		{width: 35%;}
		
	section
		{min-height: auto;}
	#intro
		{width: 25%; position: relative; float: left; display: block; background-color: #e0e0e0; padding: 3vh 0;}
		
	header .logoMain
		{width: auto; height: 7vh; top: 1vh; left: 2.5%; position: absolute; display: block; }
		
	#intro .miniatura
		{position: relative; bottom: auto; top: auto; margin: auto; display: block;}
		
	#intro h1
		{font-size: 2em;}
	#intro .bloque1
		{position: relative; top: auto; }
	.topics
		{clear: both;}
		
	menu,.separador,#intro .atencion,#intro .logoMain
		{display: none;}
	#trayectoria
		{width: 25%; position: relative; float: left;}
	#trayectoria .idiomas .topic
		{width: 45%; float: left; margin: 1vh 0;}
	
	.middle
		{width: 50%; float: left; padding-bottom: 5vh;}
	#contacto .presencial h3
		{top: 0; width: 100%;}
		
	#contacto .contactoMain h4
		{text-align: center;}
	#contacto .contactoMain h2
		{font-size: 1.25em; margin-top: 1vh; font-family: "a";}
		
	#contacto .presencial
		{height: 28%;}
	#contacto .presencial .direccion
		{width: 100%;}
	#contacto .presencial .map
		{bottom: 25%; width: 25%;}
		
	#contacto .botonear
		{margin-top: 2vh;}
		
	#presentacion h3
		{margin-bottom: 5vh;}
		
	#intro h3
		{position: relative;}
		
	#contacto
		{display: block; position: relative; padding: 2vh 0; background-color: transparent;}
		
	#contacto .botonear a::before
		{padding-top: 35%;}
	#contacto .botonear a
		{width: 50%; align-items: center;}
		
	#servicios h2
		{margin-bottom: 5vh;}
	#servicios h2 img
		{ margin-right: 10px; }
	#contacto .botonear a .miniatura
		{width: 20%; left: 10%;}
		
	section h2
		{margin-top: 3vh;}
		
	#contacto .botonear a span {
    position: absolute;
    bottom: auto;
    width: 50%;
    right: 10%;
	left: auto;
	
	}	
		
	}
