body {background-color:#ffffff; margin: 0px; text-align:center;}

@font-face {font-family: "lato-regular"; src: url("https://www.alejandrofernandez.es/fuentes/Lato-Regular.ttf") format("truetype");}
@font-face {font-family: "lato-bold"; src: url("https://www.alejandrofernandez.es/fuentes/Lato-Bold.ttf") format("truetype");}
@font-face {font-family: "lato-thin"; src: url("https://www.alejandrofernandez.es/fuentes/Lato-Thin.ttf") format("truetype");}
@font-face {font-family: "lato-black"; src: url("https://www.alejandrofernandez.es/fuentes/Lato-Black.ttf") format("truetype");}

H1 {font-family:"lato-black"; font-size:30px; color:#000000}
H2 {font-family:"lato-black"; font-size:30px; padding-bottom:0px;}
H3 {font-family:LouisGeorgeCafeLightItalic, helvetica, tahoma, arial; font-size:15px; padding-top:0px;}
P {text-align:justify; font-family: "lato-regular"; font-size:16px; color:#000000; text-decoration:none;}
A {text-align:justify; font-family: "lato-regular"; font-size:18px; color:#B3C4CC; text-decoration:none;}
A:hover {text-decoration:underline; color:#D8D096;}
A.menu {margin:30px; padding-left:10px; padding-top:15px; padding-bottom:15px; padding-right:10px; font-size:18px; color:#ffffff; padding-top:0px; padding-bottom:0px}
A.menu:hover {text-decoration:none; color:#ffffff; background-color:#ff7800; transition: color 2s; transition: background-color 2s;}
A.menumovil {font-family:LouisGeorgeCafeLight, helvetica, tahoma, arial; color:#ffffff; padding-right:10px;}
A.linkpie {font-family: "lato-regular", arial; font-size:11; color:#FFFFFF; font-weight:none;}
A.linkpie:hover {text-decoration:underline;}



#logo {text-align:center; margin-top:20px; margin-bottom:20px; position:relative;}
#pie {margin:auto; font-family: "lato-regular", arial; font-size:11; width:100%; text-align:center; color:#FFFFFF; margin-top:0px; margin-bottom:0px; background-color: #B3C4CC; padding-top:10px; padding-bottom:20px}
#cuerpo{margin:auto; text-align:center; width:100%; overflow:auto; position:relative; clear:left; padding-bottom:50px;}
#foto1 {width:100%; margin:auto; background-color: #000000; text-align:right; z-index:1;}
#textofoto1 {width:100%; margin:auto; font-family: "lato-bold"; font-size:60; color:#FFFFFF; text-align:left; position:absolute; z-index:2; top:50px; left:100px;}
#foto1imagen {width:35%;}
#foto2 {width:100%; margin:auto; background-color: #FFFFFF; text-align:enter; z-index:1; position:relative; margin-top:50px;}
#textofoto2 {width:500px; margin:auto; font-family: "lato-bold"; font-size:60; color:#000000; text-align:right; position:absolute; z-index:2; top:50px; left:50%;}
#foto2imagen {width:80%;}
#foto3 {width:100%; margin:auto; background-color: #FFFFFF; text-align:enter; z-index:1; position:relative; margin-top:50px;}
#textofoto3 {width:100%; margin:auto; font-family: "lato-bold"; font-size:60; color:#FFFFFF; text-align:left; position:absolute; z-index:2; top:50px; left:100px;}
#foto4 {width:100%; margin:auto; background-color: #FFFFFF; text-align:enter; z-index:1; position:relative; margin-top:50px;}
#textofoto4 {width:100%; margin:auto; font-family: "lato-bold"; font-size:60; color:#000000; text-align:left; position:absolute; z-index:2; top:50px; left:100px;}
#textofoto4bis {width:100%; margin:auto; font-family: "lato-bold"; font-size:60; color:#000000; text-align:right; position:absolute; z-index:2; top:50px; left:-100px;}
#foto4imagen {width:35%;}
#imagenlogo {height:50px;}
#zonadeiconos {display: flex; place-items: center; justify-content: center; align-items: center; height:40px;}

.texto {width:80%; margin:auto; text-align:justify; overflow:auto; position:relative; clear:left; font-family: "lato-regular"; font-size:20; margin-top:50px; color:#B7B8B9;}
.icono {width:40px; margin-left:10px; margin-right:10px}


.contenido {width:80%; margin:auto; text-align:justify; font-family:LouisGeorgeCafeLight, helvetica, tahoma, arial; font-size:30px; color:#000000; padding-top:20px; padding-bottom:50px;}


#cabecera {width:100%; overflow:auto; position:relative; background-color: #ffffff;}
#logotipocabecera {font-family:LouisGeorgeCafeBold, helvetica, tahoma, arial; font-size:25px; color:#4d4d4d; display:flex; padding-top:10px; padding-bottom:10px; justify-content:center;}
#cabeceramenu {text-align:left; font-family:LouisGeorgeCafeBold, helvetica, tahoma, arial; font-size:13px; margin:auto; position:sticky; position:-webkit-sticky; top:0px; vertical-align:middle; width:100%; color:#ffffff;  padding-top:5px; padding-bottom:5px; max-height:100%; z-index:1; background-color: #4d4d4d;}
#menu {font-family:LouisGeorgeCafeBold, helvetica, tahoma, arial; margin:auto; overflow:auto; position:relative; display: flex; flex-wrap: wrap; flex-direction: row;}
#menu2 {font-family:LouisGeorgeCafeLight, helvetica, tahoma, arial; display:none; width:100%; text-align:right; padding-right:10px}
#menu3 {display:none; width:100%; text-align:right; padding-right:10px}
#cuerpo{margin:auto; text-align:center; width:100%; overflow:auto; position:relative; clear:left;}
#pieno {margin:auto; text-align:center; font-family:LouisGeorgeCafeLight, helvetica, tahoma, arial; font-size:13px; background-color:#000000; margin:auto; position:relative; vertical-align:bottom; width:100%; color:#ffffff; max-height:100%; overflow:auto}
#piefinal {font-family:LouisGeorgeCafeLight, helvetica, tahoma, arial; font-size:9px; color:#ffffff; width:100%; text-align:center; margin:auto; position:relative; padding-top:20px; padding-bottom:20px; clear:left;}


.titular {background-color:#ff7800; color:#ffffff; font-family:LouisGeorgeCafeBold, helvetica, tahoma, arial; font-size:25px; font-weight:bold; text-align:center; padding-top:15px; padding-bottom:20px}
.clasepie {width:200px; text-align:justify; font-family:LouisGeorgeCafeLight, helvetica, tahoma, arial; font-size:13px; margin:auto; position:relative; padding-top:20px; padding-left:0px; padding-right:0px; }
.contenido {width:80%; margin:auto; text-align:justify; font-family:LouisGeorgeCafeLight, helvetica, tahoma, arial; font-size:30px; color:#000000; padding-top:20px; padding-bottom:50px;}
.form {width:500px; padding-bottom:100px; padding-left:100px; padding-top:30px; float:right}
.nombreformcontacto {color:#000000; font-family:LouisGeorgeCafeBold, helvetica, tahoma, arial; font-size:16px;}
.inputformcontacto {border-style:none; border-bottom: 1px solid #ff7800; background-color:#ffffff; color:#ff7700; font-family:LouisGeorgeCafeLight, helvetica, tahoma, arial; font-size:14px;}
.inputformcontactocontrol {visibility:hidden; border-style:none; border-bottom: 1px solid #ff7800; background-color:#ffffff; color:#ff7700; font-family:LouisGeorgeCafeLight, helvetica, tahoma, arial; font-size:14px;}
.botonformcontacto {background-color:#ff7800; font-family:LouisGeorgeCafeBold, helvetica, tahoma, arial; font-size:18; color:#ffffff; position:relative; border-style:none; border-width:3px 3px 3px 3px; padding-top:5px; padding-bottom:5px; padding-left:10px; padding-right:10px; position:absolute; border-color:#4d4d4d; text-align:center;}
.botonformcontacto:hover {background-color:#4d4d4d; color:#ff7800; text-decoration:none; border-color:#ff7800; cursor:pointer; ; transition: color 1s; transition: background-color 1s;}
.textoformcontacto {border-style:none; border-left: 1px solid #ff7800; background-color:#ffffff; color:#ff7800; font-family:LouisGeorgeCafeLight, helvetica, tahoma, arial; font-size:14px; padding-top:25px; padding-left:30px; padding-right:30px;}
.infoverde {background-color:#009e04; font-family:LouisGeorgeCafeBold, helvetica, tahoma, arial; font-size:18; color:#ffffff; position:relative; border-style:none; padding-top:5px; padding-bottom:5px; padding-left:10px; padding-right:10px; border-color:#ffffff; text-align:center;}
.espaciofoto {width:100%; display:flex; align-items:flex-end; overflow:auto; position:relative;}
.descripcionfoto {text-align:right; flex:1 1 0; padding-right:20px;}
.foto {padding-top:30px; flex:1 1 0;}


@media (max-device-width: 850px) {

	#piecontenido {flex-direction: column;}
	.clasepie {width:90%; padding-left:0px; padding-right:0px;}
}

@media (max-device-width: 600px) {

H1 {font-size:19px}
H2 {font-size:14px}
H3 {font-size:8px;}
P {font-size:12px}
A {font-size:12px}

#textofoto1 {font-size:23px; top:10px; left:20px;}
#foto1imagen {width:55%;}
#textofoto2 {font-size:18px; top:10px; left:-30%;}
#foto2imagen {width:100%;}
#textofoto3 {font-size:19px; top:10px; left:20px;}
#textofoto4 {font-size:22px; top:0px; left:0px; position:relative; text-align:center; margin-bottom:10px;}
#textofoto4bis {font-size:22px; top:0px; left:0px; position:relative; text-align:center; margin-top:10px;} 
#foto4imagen {width:80%;}
#imagenlogo {height:35px;}

#cabecera {background-color:#ffffff; z-index:1; position:sticky; position:-webkit-sticky; top:0}
#logotipocabecera {font-family:LouisGeorgeCafeBold; font-size:16px; padding-top:30px}
#piefinal{width:90%}
#menu{display:none; flex-direction: column; position:relative; background-color:#4d4d4d; padding-bottom:5px; background-color:#ff7800; margin-top:5px;}
#menu2{display:block}

.icono {width:30px; margin-left:10px; margin-right:10px}

.logo {padding-leftt:10px; padding-right:10px}
.titular {font-size:12px; padding-top:5px; padding-bottom:10px}
.contenido {font-size:15px;}
.form {width:250px}
.nombreformcontacto {font-size:9px;}
.inputformcontacto {font-size:9px;  border-bottom: 1px solid #ff7800;}
.textoformcontacto {font-size:9px;}
.descripcionfoto {text-align:right; flex:1 1 0; padding-right:10px;}
.foto {padding-top:20px; flex:2 1 0;}
}