@charset "utf-8";
/* Estilos Leuro Corporation por: Abraham Quesñay */

header, nav, section, article, aside, figure, footer{
	display:block;
	margin:0;	
}
a img{
	border:none;
}
.limpiar{
	clear:both;
}

p, h1, h2,h3,ul,li{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:13px;
	margin:0;
	padding:0;
	color:#6B6C66;
	font-weight:normal;
}

body{
	margin:0;
	background:url(../imagenes/fondo-leuro.png) repeat-x #EAEDE6;
}

/*---Maquetacion---*/

#cuerpo{
	margin:0 auto;
	width:1000px;
	background:#FFF;
}

#superior{
	width:950px;
	padding:25px; 
}

/*---Cabecera---*/

#cabecera{
	width:950px;
	height:190px;
}

.tercio-cabecera{
	width:316px;
	height:190px;
	display:block;
	float:left;

}

.tercio-cabecera ul{
	 list-style:none;
	 float:right;
}

.tercio-cabecera li{
	 float:left;
}

.tercio-cabecera li a{
	 width:25px;
	 height:25px;
	 display:block;
	 margin-left:10px;
	 text-indent:-8000px;
	 background:url(../imagenes/ico-face.png) no-repeat;
	 transition:all 0.3s;
	-moz-transition:-moz-all 0.3s;
	-o-transition:-o-all 0.3s;
	-ms-transition:-ms-all 0.3s;
	-webkit-transition:-webkit-all 0.3s;
}

.tercio-cabecera li a:hover{
	transform:scale(1.2,1.2) ;
	-moz-transform:scale(1.2,1.2) ;
	-o-transform:scale(1.2,1.2) ;
	-ms-transform:scale(1.2,1.2) ;
	-webkit-transform:scale(1.2,1.2) ;
}

.tercio-cabecera li a.twitter{
	background:url(../imagenes/ico-twitter.png) no-repeat;
}

.tercio-cabecera li a.gplus{
	background:url(../imagenes/ico-googleplus.png) no-repeat;
}

.tercio-cabecera li a.youtube{
	background:url(../imagenes/ico-youtube.png) no-repeat;
}

.tercio-cabecera li a.blog{
	background:url(../imagenes/ico-blogspot.png) no-repeat;
}

.medio-cabecera{
	width:318px;
	height:190px;
	display:block;
	float:left;
}

.iso-leuro{
	margin:0 auto;
	display:block;
	margin-bottom:25px;
	}
	
.logo-leuro{
	margin:0 auto;
	width:200px;
	display:block;
	font-size:24px;
	color:#2B2D77;	
}

.imagen-logo-leuro{
	width:68px;
	height:31px;
	display:block;
	text-indent:-8000px;
	background:url(../imagenes/logo-leuro.png) no-repeat;
	float:left;
}

.texto-logo-leuro{
	width:132px;
	height:31px;
	display:block;
	float:left;
	text-align:right;
}

/*---Menú---*/

#menu{
	width:948px;
	height:68px;
	margin:20px 0;
	border:1px solid #CCC;
}

#menu ul{
	list-style:none;
}

#menu li{
	float:left;
	position:relative;
	display:inline-block;
}

#menu li a{
	width:189px;
	line-height:68px;
	display:block;
	border-right:1px solid #CCC; 
	text-align:center;
	text-decoration:none;
	color:#000;
	transition:all 0.3s;
	-moz-transition:-moz-all 0.3s;
	-o-transition:-o-all 0.3s;
	-ms-transition:-ms-all 0.3s;
	-webkit-transition:-webkit-all 0.3s;
}

#menu li a:hover{
	background:#090A60;
	color:#FFF;
}

#menu li a.con{
	width:188px;
	border:none;
}

#menu li ul{
	position:absolute;
	max-height:0px;
	overflow:hidden;
	-webkit-transition:max-height 0.4s linear;
	-moz-transition:max-height 0.4s linear;
	transition:max-height 0.4s linear;
	z-index:11;
}

#menu li:hover ul{
	 max-height:500px;
}

#menu li ul li a{
	line-height:40px;
	background:#6f706c;
	color:#FFF;
	border-bottom:1px solid #FFF;
}

#menu a#mmovil{
	/*--- Ocultar Menu Movil---*/
	display:none;
}

.over{
	width:189px;
	line-height:68px;
	display:block;
	border-right:1px solid #CCC; 
	text-align:center;
	background:#090A60;
	color:#FFF;
}

.over-con{
	line-height:68px;
	display:block;
	text-align:center;
	background:#090A60;
	color:#FFF;
	width:188px;
	border:none;
}

/*---Slide---*/

#slide{
	width:950px;
	height:300px;
}

/*---Contenido---*/

#contenido{
	width:100%;
}

#top-service{
	width:950px;
	padding:25px;
	background:#DFE0D8; 
}

.cuadro-top{
	width:31%;
	display:block;
	margin:0 3.5% 30px 0;
	float:left;
}

.superior-top{
	width:100%;
	display:block;
}

.foto-top{
	width:81px;
	height:86px;
	display:block;
	float:left;
	padding:10px 0;
	border-top:2px solid #0099CC;
}

.tit-top{
	width:183px;
	height:45px;
	display:block;
	float:left;
	padding:30px 0 30px 30px;
	border-top:2px solid #000066;
	color:#333333;
	font-weight:bold;
	font-size:16px;
}

.texto-top{
	display:block;
	margin-bottom:20px;
}

.boton-top{
	width:73px;
	line-height:34px;
	display:block;
	text-align:center;
	background:#6F6F6B;
	text-decoration:none;
	color:#FFF;
	transition:all 0.3s;
	-moz-transition:-moz-all 0.3s;
	-o-transition:-o-all 0.3s;
	-ms-transition:-ms-all 0.3s;
	-webkit-transition:-webkit-all 0.3s;
}

.boton-top:hover{
	background:#00CCCC;
	transform:scale(1.1,1.1) ;
	-moz-transform:scale(1.1,1.1) ;
	-o-transform:scale(1.1,1.1) ;
	-ms-transform:scale(1.1,1.1) ;
	-webkit-transform:scale(1.1,1.1) ;
}

#inferior{
	width:950px;
	padding:25px;
}

#servicios-inf{
	width:31%;
	display:block;
	margin-right:3.5%;
	float:left;
}

.tit-servicios-inf{
	width:90%;
	display:block;
	line-height:45px;
	margin-bottom:20px;
	background:#6F706C;
	font-size:16px;
	font-weight:bold;
	color:#FFF;
	padding-left:10%;
}

#servicios-inf ul{
	list-style:none;
}

#servicios-inf li a{
	width:90%;
	line-height:49px;
	display:block;
	border-bottom:1px solid #CCC;
	color:#00CCCC;
	font-size:14px;
	padding-left:10%;
	background:url(../imagenes/vineta-servicios.png) left no-repeat;
	text-decoration:none;
}

#servicios-inf li a:hover{
	width:70%;
	padding-left:30%;
	color:#6F706C;
	transition:all 0.3s;
	-moz-transition:-moz-all 0.3s;
	-o-transition:-o-all 0.3s;
	-ms-transition:-ms-all 0.3s;
	-webkit-transition:-webkit-all 0.3s;
}

#quienes-inf{
	width:65.5%;
	display:block;
	float:left;
	margin-bottom:10px;
}

.tit-quienes-inf{
	width:100%;
	display:block;
	line-height:45px;
	margin-bottom:20px;
	font-size:16px;
	font-weight:bold;
	color:#000;
	float:left;
}

.foto-quienes-inf{
	display:block;
	margin-left:20px;
	float:left;
}

.texto-quienes-inf{
	width:240px;
	display:block;
	float:left;
	text-align:justify;
}

.link-quienes-inf{
	width:73px;
	line-height:30px;
	display:block;
	color:#00CCCC;
	font-size:14px;
	padding-left:20px;
	background:url(../imagenes/vineta-servicios.png) left no-repeat;
	text-decoration:none;
	float:right;
	transition:all 0.3s;
	-moz-transition:-moz-all 0.3s;
	-o-transition:-o-all 0.3s;
	-ms-transition:-ms-all 0.3s;
	-webkit-transition:-webkit-all 0.3s;
}

.link-quienes-inf:hover{
	padding-left:25px;
	color:#6F706C;
}


#contacto-inf{
	width:65.5%;
	display:block;
	float:left;
}

.tit-contacto-inf{
	width:100%;
	display:block;
	line-height:45px;
	margin-bottom:20px;
	font-size:16px;
	font-weight:bold;
	color:#000;
}

.foto-contactenos{
	display:block;
	margin-right:20px;
	float:left;
}

#form-contacto-inf{
	width:362px;
	display:block;
	float:left;
}

.caja-texto{
	width:100%;
}

.boton{
	width:73px;
	line-height:34px;
	background:#484846;
	color:#FFF;
	cursor:pointer;
	margin:0;
	padding:0;
	border:none;
	transition:all 0.3s;
	-moz-transition:-moz-all 0.3s;
	-o-transition:-o-all 0.3s;
	-ms-transition:-ms-all 0.3s;
	-webkit-transition:-webkit-all 0.3s;
}

.boton:hover{
	background:#090A60;
}

/*---Contenido Quienes-somos---*/

.parafo-quienes{
	width:100%;
	display:block;
	margin:20px 0;
	float:left;
	text-align:justify;
}

.foto-quienes{
	display:block;
	margin-right:20px;
	float:left;
}

.parafo-quienes-2{
	width:58%;
	display:block;
	float:left;
	text-align:justify;
}

#contactos-contenido{
	width:100%;
	float:left;
}

#form-contacto-contenido{
	width:72%;
	float:left;
}

/*---Contenido Casos Éxito---*/

.cuadro-video{
	width:48%;
	float:left;
	text-align:center;
	margin-right:2%;
	margin-bottom:10px;
}

.cuadro-video-2{
	width:48%;
	float:left;
	text-align:center;
	margin-left:2%;
	margin-bottom:10px;
}

.video{
	width:100%;
	height:auto;
}

/*---Contenido Contacteno---*/

#form-contacto-contenido-2{
	width:58%;
	float:left;
}

#mapa{
	width:100%;
	display:block;
	margin-top:20px;
	float:left;
}

/*---Contenido Servicios---*/

.parrafo-service{
	display:block;
	float:left;
	margin-bottom:20px;
}

.foto-service-iz{
	display:block;
	float:left;
	margin:0 20px 20px 0;
}

.foto-service-iz{
	display:block;
	float:left;
	margin:0 0 20px 20px;
}

/*---Contenido Servicios---*/

.parrafo{
	width:100%;
	display:block;
	margin-bottom:20px;
	float:left;
}

.parrafo-interno{
	width:100%;
	display:block;
	float:left;
}

.parrafo h2{
	font-size:15px;
	color:#000066;
}

.parrafo-service{
	width:72%;
	display:block;
	margin-bottom:20px;
	float:left;
}

.parrafo-service-variante{
	width:72%;
	display:block;
	margin-bottom:20px;
	float:left;
}

.parrafo-service-2{
	width:56%;
	display:block;
	margin-bottom:20px;
	float:left;
}

.parrafo-service-2-variante{
	width:72%;
	display:block;
	margin-bottom:20px;
	float:left;
}

.foto-service-iz{
	display:block;
	float:left;
	margin:0 20px 0 0;
}

.foto-service-der{
	display:block;
	float:right;
	margin:0 0 0 20px;
}

.foto-superior{
	width:100%;
	height:auto;
	margin-bottom:20px;
}

.parrafo-service-3{
	width:55%;
	display:block;
	margin-bottom:20px;
	float:left;
}


/*---Pie---*/

#pie{
	width:100%;
	text-align:center;
	margin:25px 0;
}

.texto-chico{
	font-size:10px;
	color:#999;
}

/******************************************/
/***    DISEÑO PARA TABLETAS           ****/
/******************************************/
@media only screen and (max-width:768px){
	
	/*---Maquetacion---*/

	#cuerpo{
		width:750px;
	}
	
	#superior{
		width:96%;
		padding:2%; 
	}
	
	/*---Cabecera---*/
	
	#cabecera{
		width:98%;
	}
	
	.tercio-cabecera{
		width:30%;
	}
	
	.medio-cabecera{
		width:40%;
	}
	
	
	
	/*---Menú---*/

	#menu{
		width:718px;
		height:48px;
		border:1px solid #CCC;
	}
	
	#menu li a{
		width:142px;
		line-height:48px;
		border-right:1px solid #CCC; 
	}
	
	#menu li ul li a{
		width:170px;
	}
	
	.over{
		width:142px;
		line-height:48px;
	}
	
	#menu li a.con{
		width:146px;
		border:none;
	}
	
	.over-con{
		width:146px;
		line-height:48px;
		border:none;
	}
	
	/*---Slide---*/

	#slide{
		width:100%;
		height:auto;
	}
	
	#slide img{
		width:100%;
		height:auto;
	}
	
	/*---Contenido---*/
	
	#top-service{
		width:94%;
		padding:3%;
	}
	
	.cuadro-top{
		width:31%;
		display:block;
		margin:0 3.5% 30px 0;
		float:left;
	}
	
	.foto-top{
		width:30%;
		height:auto;
		padding:10px 0;
	}
	
	.tit-top{
		width:65%;
		height:40px;
		padding:30px 0 30px 5%;
		font-size:14px;
	}
	
	.texto-top{
		height:120px;
		font-size:12px;
	}
	
	#inferior{
		width:94%;
		padding:3%;
	}
	
	#servicios-inf{
		width:31%;
		display:block;
		margin-right:3.5%;
		float:left;
	}
	
	.tit-servicios-inf{
		line-height:45px;
		margin-bottom:10px;;
		font-size:14px;
	}
	
	#servicios-inf li a{
		line-height:40px;
		font-size:13px;
	}
	
	#servicios-inf li a:hover{
		width:90%;
		padding-left:10%;
	}
	
	.tit-quienes-inf{
		line-height:45px;
		margin-bottom:10px;
		font-size:14px;
	}
	
	.foto-quienes-inf{
		width:100%;
		height:auto;
		margin-left:0%;
	}
	
	.texto-quienes-inf{
		width:100%;
	}
	
	
	#contacto-inf{
		width:100%;
	}
	
	.tit-contacto-inf{
		margin-bottom:10px;
		font-size:14px;
	}
	
	.foto-contactenos{
		width:31%;
		height:auto;
		margin-right:3.5%;
	}
	
	#form-contacto-inf{
		width:65.5%;
	}
	

	/*---Contenido Quienes-somos---*/
	
	.foto-quienes{
		width:42%;
		height:auto;
		margin-right:3%;
	}
	
	.parafo-quienes-2{
		width:55%;
	}
	
	#form-contacto-contenido{
		width:65.5%;
		float:left;
	}
	
	/*---Contenido Contacteno---*/

	#form-contacto-contenido-2{
		width:65.5%;
		float:left;
	}
	
	/*---Contenido Servicios---*/
	
	.parrafo-service-variante{
		width:100%;
	}
	
	.parrafo-service-2-variante{
		width:100%;
	}
	
	.parrafo-service-3{
		width:72%;
	}
	
	.foto-service-iz{
		width:41%;
		height:auto;
		margin:0 3% 0 0;
	}
	
	.foto-service-der{
		width:25%;
		height:auto;
		margin:0 0 0 3%;
	}
		

	/*---Pie---*/
	
	#pie{
		margin:15px 0;
	}
	
	.texto-chico{
		font-size:10px;
	}

}
/******************************************/
/***    DISEÑO PARA MOVILES 480        ****/
/******************************************/
@media only screen and (max-width:480px){
	body{
		background:none;
	}
	
	/*---Maquetacion---*/

	#cuerpo{
		width:470px;
	}
	
	/*---Cabecera---*/

	
	.tercio-cabecera{
		width:20%;
	
	}
	
	.tercio-cabecera li{
		 float:none;
	}
	
	.tercio-cabecera li a{
		 margin-left:0;
		 margin-bottom:10px;
	}
	
	
	.medio-cabecera{
		width:60%;

	}
	
	/*---Menú---*/

	#menu{
		width:449px;
		height:auto;
		margin:10px 0;
		border:1px solid #CCC;
		
	}
	
	#menu ul{
		height:auto;
	}
	
	#menu li{
		width:100%;
		float:none;
	}
	
	#menu li a{
		width:100%;
		line-height:39px;
		border-bottom:1px solid #CCC; 
	}
	
	#menu li a.con{
		width:100%;
		line-height:40px;
		border:none;
	}
	
	#menu li.serlis{
		display:none;
	}
		
	.over{
		width:100%;
		line-height:39px;
	}
	
	.over-con{
		width:100%;
		line-height:39px;
	}
	
	#menu a#mmovil{
		/*--- Ocultar Menu Movil---*/
		display:block;
		background:#A4ABB0;
		width:98%;
		padding-left:2%;
		font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
		color:#FFF;
		font-size:13px;
		line-height:40px;
		text-decoration:none;
		text-align:left;
		position:relative;
	}
	#menu a#mmovil:after{
		content:"";
		background:url(../imagenes/menu-movil.png) no-repeat;
		width:30px;
		height:30px;
		display:inline-block;
		position:absolute;
		right:8px;
		top:7px;
	}
	
	
	
	/*---Slide---*/
	
	.theme-default .nivo-controlNav {
		display:none;
	}
	
	/*---Contenido---*/
	
	.cuadro-top{
		width:100%;
		margin:0 0 30px 0;
		float:none;
	}
	
	.foto-top{
		width:20%;
		height:auto;
		padding:10px 0;
	}
	
	.tit-top{
		width:75%;
		height:auto;
		font-size:18px;
	}
	
	.texto-top{
		height:auto
	}
	
	.boton-top{
		margin-bottom:20px;
	}
	
	#servicios-inf{
		width:100%;
		margin-right:0%;
		margin-bottom:10px;
	}
	
	#quienes-inf{
		width:100%;
		margin-right:0%;
		margin-bottom:10px;
	}
	
	.foto-contactenos{
		width:100%;
		height:auto;
		margin-right:0;
		margin-bottom:10px;
	}
	
	#form-contacto-inf{
		width:100%;
	}
	
	
	/*---Contenido---*/
	
	#form-contacto-contenido{
		width:100%;
	}
	
	/*---Contenido Casos Éxito---*/

	.cuadro-video{
		width:100%;
		float:none;
		margin-right:0;
		margin-bottom:10px;
	}
	
	.cuadro-video-2{
		width:100%;
		float:none;
		margin-left:0;
		margin-bottom:10px;
	}
	
	.video{
		width:100%;
		height:auto;
	}
	
	/*---Contenido Contacteno---*/

	#form-contacto-contenido-2{
		width:100%;
		float:left;
	}


}
/******************************************/
/***    DISEÑO PARA MOVILES 320        ****/
/******************************************/
@media only screen and (max-width:320px){
	/*---Maquetacion---*/

	#cuerpo{
		width:310px;
	}
	
	/*---Cabecera---*/
	
	#cabecera{
		height:170px;
	}
	
	.tercio-cabecera{
		height:150px;
	}
	
	.medio-cabecera{
		height:150px;
	}
	
	.iso-leuro{
		width:60%;
		height:auto;
		margin-bottom:20px;
		}
		
	.logo-leuro{
		width:100%;
		height:26px;
		font-size:21px;	
	}
	
	.imagen-logo-leuro{
		width:35%;
		height:26px;
		background:url(../imagenes/logo-leuro-320.png) no-repeat ;
	}
	
	.texto-logo-leuro{
		width:65%;
		height:26px;
	}
	
	/*---Menú---*/

	#menu{
		width:100%;		
	}
	
	#menu li a{
		font-size:12px;	
	}
	
	/*---Contenido quienes---*/
	
	.foto-quienes{
		width:100%;
		height:auto;
		margin-right:none;
		float:none;
	}
	
	.parafo-quienes-2{
		width:100%;
		float:none;
	}
	
	/*---Contenido Servicios---*/
	
	.parrafo-service{
		width:100%;
	}
	
	.parrafo-service-2{
		width:100%;
	}
	
	.parrafo-service-3{
		width:100%;
	}
	
	.foto-service-iz{
		display:none;
	}
	
	.foto-service-der{
		display:none;
	}
	
	.foto-superior{
		display:none;
	}

}
/******************************************/
/***    DISEÑO PARA MOVILES 240        ****/
/******************************************/
@media only screen and (max-width:240px){
	/*---Maquetacion---*/

	#cuerpo{
		width:230px;
	}
	
	/*---Cabecera---*/
	
	.tercio-cabecera{
		height:120px;
	}
	
	.medio-cabecera{
		height:120px;
	}
	
	.iso-leuro{
		margin-bottom:15px;
		}
		
	.logo-leuro{
		font-size:16px;	
	}
	
	.imagen-logo-leuro{
		background:url(../imagenes/logo-leuro-240.png) no-repeat;
	}
}