@charset "utf-8";
/* Google Fonts
font-family: 'Quicksand', sans-serif;
font-family: 'Poiret One', cursive;
font-family: 'Julius Sans One', sans-serif;
 */
@font-face{
	font-family:"Kumbh Sans Bold";
	src:url(../tipografias/KumbhSans-Bold.ttf) format('opentype');	
}
@font-face{
	font-family:"Kumbh Sans Medium";
	src:url(../tipografias/KumbhSans-Medium.ttf) format('opentype');	
}
@font-face{
	font-family:"Kumbh Sans";
	src:url(../tipografias/KumbhSans-Regular.ttf) format('opentype');	
}
@font-face{
	font-family:"Kumbh Sans Light";
	src:url(../tipografias/KumbhSans-Light.ttf) format('opentype');	
}

/***********************************************************************************/
header, nav, section, article, footer, aside, figure, form{
	display:block;
	margin:0;
	padding:0;
}
body{
	margin:0;
}
h1{

}
h3{
	
}
p{
	font-family:'verdana', sans-serif;
	font-size:17px;
	text-align:justify;
	margin:0;	
}
ul{
	margin:0;
	padding:0;
	list-style:none;
}
a{
	font-family:'verdana', sans-serif;
	font-size:15px;	
	color:#000;
	text-decoration:none;
}
*{
	box-sizing:border-box;
}
/* Estilo para el boton "Ir Arriba" */
.scroll-top {
    width: 40px;
    height: 40px;
    opacity: 0.5;
    position: fixed;
    bottom: 100px;
    right: 30px;
    display: none; /* Estara oculto por defecto */
    text-indent: -9999px; /* Oculta el texto del enlace */
    z-index: 1000; /* Evita que otros elementos esten por encima */
    background: url('../img/arriba.png') no-repeat;
}
/* Estilo para generar un efecto al posicionar el puntero encima del botón */
.scroll-top:hover {
    opacity: 0.8;
    -webkit-transition: 0.3s all;
    -moz-transition: 0.3s all;
    -o-transition: 0.3s all;
    -ms-transition: 0.3s all;
    transition: 0.3s all;
}

/************************************************************************************/
/*************************** ESTILOS PARA LA CABECERA *******************************/
/************************************************************************************/
.caja-cabecera{
	width: 100%;
	margin: auto;
	padding: 30px 10%;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	background: #20336A;
}
.logo{
	width: 200px;
}
.logo img{
	display: block;
	width: 100%;
	height: auto;
}
.regresar-cabecera{
	display:block;
	width:220px;
	height:54px;	
	line-height:50px;
	border:2px solid #fff;
	border-radius:8px;
	font-family:'Kumbh Sans Bold', sans-serif;
	font-size: 20px;
	text-align:center;
	color:#20336A;	
	background:#FFF;
	cursor:pointer;
	transition:all 0.3s;
}
.regresar-cabecera:hover{
	color:#fff;
	background: #20336A;
}

/************************************************************************************/
/******************************** BANNER CABECERA **********************************/
/************************************************************************************/
#portada-interna{
	/*position: relative;*/
	width: 100%;
	height: 350px;
	background: url(../imagenes/libro-reclamaciones.jpg) no-repeat;
	background-size: cover;
}
.caja-titulo-portada{
	width: 100%;
	padding: 100px 0 0 0;
	/*position: absolute;
	top: 35%;
	left: 0;*/	
}
.titulo-portada{
	display: flex;
	align-content: center;
	width: 405px;
	margin: auto;
}
.titulo-portada h1{	
	font-family:'Kumbh Sans Bold', sans-serif;
	font-size: 35px;
	text-align: center;
	color: #fff;
}
/*
.imagen-portada{
	width: 100%
}
.imagen-portada img{
	display: block;
	width: 100%;
	height: auto;
}
*/
/************************************************************************************/
/******************************** ESTILOS CONTACTO **********************************/
/************************************************************************************/
#cuerpo{
	padding: 5% 0;
}
/*
.columna-mapa{
	width:45%;
}
.columna-mapa .titulo-bienvenida{
	width:54%;	
}
.caja-mapa{
	width:100%;
	height:555px;	
	border:2px solid #103D2A;
}
.mapa{
	width:100%;
	height:550px;		
}
*/
.columna-formulario{
	width:50%;	
}
#caja-contacto h3{
	font-family:'Kumbh Sans Bold', sans-serif;
	font-size: 18px;
	color: #fff;
}
.telefonos-contacto{
	width:70%;
	display:flex;
	flex-direction:row;
	justify-content:space-between;	
	margin:auto;
}
.correo-contacto, .subtitulo-contacto{
	text-align:center;
	margin:15px 0;	
}
.horarios-contac{
	text-align:center;
}
.horarios-contac-mobil{
	display:none;	
}
.horarios-contac-mobil2{
	display:none;	
}
#fcontacto{
	padding:30px;
	background: #20336A;	
}
#doscolums{
	display:flex;
	flex-direction:row;
	justify-content:space-between;
}
#doscolums p{
	width:49%;
	color: #fff;
	margin-bottom:30px;
}
#unacolum p{
	color: #fff;
	margin-bottom:30px;
}
.campos{
	width:100%;
	height:45px;
	line-height:43px;
	padding:0 10px;
	border:1px solid #434343;
	background:#fff;
	font-family:'Kumbh Sans', sans-serif;
	color:#96999E;
}
.comentarios{
	width:100%;
	height:200px;
	padding:10px;
	border:1px solid #434343;
	background:#fff;
	color:#96999E;
}
/*
.boton{
	display:block;
	width:240px;
	height:70px;
	border-radius:25px;
	background:#103D2A;
	margin:auto;
	margin-top:45px;	
	cursor:pointer;
	padding:8px;
	transition:all 0.3s;
}
*/
.boton-enviar{
	display:block;
	width:220px;
	height:54px;
	margin:auto;
	line-height:50px;
	border:2px solid #fff;
	border-radius:8px;
	font-family:'Kumbh Sans Bold', sans-serif;
	font-size: 18px;
	text-align:center;
	color:#20336A;	
	background:#fff;
	cursor:pointer;
	transition:all 0.3s;
}
/*
.boton-enviar:hover{
	color: #fff;
	background: #20336A;
}
*/
#advertencia{
	color:#fff !important;
	margin:20px 0;
	font-family: 'Built Titling Sb', sans-serif;
	font-size:25px;
	font-weight:normal;
}

/************************************************************************************/
/************************* ESTILOS LIBRO DE RECLAMACIONES ***************************/
/************************************************************************************/
.caja-reclamaciones{
	width:70%;
	margin:auto;	
}
/************************************************************************************/
/*******************************ESTILOS PARA 1680 ***********************************/
/************************************************************************************/
@media only screen and (max-width:1680px){
	
	/************************************************************************************/
	/******************************** ESTILOS CONTACTO **********************************/
	/************************************************************************************/
	.telefonos-contacto{
		width:100%;			
	}
	.telefonos-contacto p{
		font-size:16px;	
	}
	.telefonos-contacto p a{
		font-size:15px;	
	}
	.correo-contacto, .subtitulo-contacto{		
		font-size:16px;	
	}
}
/************************************************************************************/
/*******************************ESTILOS PARA 1366 ***********************************/
/************************************************************************************/
@media only screen and (max-width:1366px){
	
	/************************************************************************************/
	/******************************** ESTILOS CONTACTO **********************************/
	/************************************************************************************/
	/*
	.columna-mapa{
		width:45%	
	}
	.columna-mapa .titulo-bienvenida{
		width:60%;	
	}
	*/	
	.columna-formulario{
		width:90%;	
	}
	#caja-contacto h2{
		font-size:21px;	
	}
	.telefonos-contacto{
		width:100%;			
	}
	.telefonos-contacto p{
		font-size:15px;	
	}
	.telefonos-contacto p a{
		font-size:14px;	
	}
	.correo-contacto, .subtitulo-contacto{		
		font-size:15px;	
	}
	#doscolums{
		flex-direction:row;		
	}
	#doscolums p{
		width:49%;		
		margin-bottom:30px;
	}
	#unacolum p{		
		margin-bottom:30px;
	}
	.campos{
		height:45px;
		line-height:43px;
		padding:0 10px;		
	}
	.comentarios{		
		height:200px;
		padding:10px;		
	}
	.boton{		
		width:240px;
		height:70px;
		border-radius:25px;		
		margin-top:45px;		
		padding:8px;
	}
	.boton .letras-boton{
		width:220px;
		height:54px;		
		line-height:54px;		
		border-radius:20px;
	}
	#advertencia{
		margin:20px 0;
		font-size:30px;
	}
	
}
/************************************************************************************/
/*******************************ESTILOS PARA 1280 ***********************************/
/************************************************************************************/
@media only screen and (max-width:1280px){
	
}
/************************************************************************************/
/*******************************ESTILOS PARA 1024 ***********************************/
/************************************************************************************/
@media only screen and (max-width:1024px){
	
	/************************************************************************************/
	/******************************** ESTILOS CONTACTO **********************************/
	/************************************************************************************/
	#caja-contacto h2{
		font-size:16px;	
	}	
	.telefonos-contacto p{
		font-size:14px;	
	}
	.telefonos-contacto p a{
		font-size:13px;	
	}
	.correo-contacto, .subtitulo-contacto{		
		font-size:14px;	
	}	
	#advertencia{
		margin:20px 0;
		font-size:17px;
	}
	
}
/************************************************************************************/
/*******************************ESTILOS PARA 800 ************************************/
/************************************************************************************/
@media only screen and (max-width:800px){

	/************************************************************************************/
	/******************************** BANNER CABECERA **********************************/
	/************************************************************************************/
	#portada-interna{		
		height: 220px;
		/*background: url(../imagenes/breadcrumb.jpg) no-repeat;*/
		
	}
	.caja-titulo-portada{
		width: 100%;
		padding: 70px 0;
		/*position: absolute;
		top: 35%;
		left: 0;*/	
	}
	.titulo-portada{
		width: 290px;
	}
	.titulo-portada h1{			
		font-size: 25px;
	}
	/************************************************************************************/
	/******************************** ESTILOS CONTACTO **********************************/
	/************************************************************************************/
	/*
	.columna-mapa{
		width:100%	
	}
	*/	
	.columna-formulario{
		width:90%;
		margin-top:50px;	
	}
	
}
/************************************************************************************/
/*******************************ESTILOS PARA 768 ***********************************/
/************************************************************************************/
@media only screen and (max-width:768px){

}
/************************************************************************************/
/*******************************ESTILOS PARA 720  ***********************************/
/************************************************************************************/
@media only screen and (max-width:720px){
	#doscolums{
		display:flex;
		flex-direction:column;
		justify-content:space-between;
	}
	#doscolums p{
		width:100%;
		color:#96999E;
		margin-bottom:30px;
	}	
	.no-resultados{
		width:100%;
		padding:20px 0 40px 0;		
	}
	.no-resultados h1{
		font-size:20px;
	}		
	.horarios-contac{
		display:none;	
	}
	.horarios-contac-mobil{
		display:block;	
		font-size:14px;
		text-align:center;
	}
}
/************************************************************************************/
/******************************* ESTILOS PARA 640 ***********************************/
/************************************************************************************/
@media only screen and (max-width:640px){	
	
}
/************************************************************************************/
/******************************* ESTILOS PARA 600 ***********************************/
/************************************************************************************/
@media only screen and (max-width:600px){	

	/************************************************************************************/
	/*************************** ESTILOS PARA LA CABECERA *******************************/
	/************************************************************************************/
	.caja-cabecera{
		padding: 20px 10%;
		display: flex;
		flex-direction: column;		
	}
	.logo{
		width: 70px;
	}
	.regresar-cabecera{
		width:180px;
		height:40px;	
		line-height:36px;
		border-radius:5px;
		font-size: 15px;
		margin: 30px 0 0 0;		
	}
	/************************************************************************************/
	/******************************** BANNER CABECERA **********************************/
	/************************************************************************************/
	#portada-interna{		
		height: 155px;
		/*background: url(../imagenes/breadcrumb.jpg) no-repeat;*/
	}
	.caja-titulo-portada{
		width: 100%;
		padding: 43px 0;
		/*position: absolute;
		top: 35%;
		left: 0;*/	
	}
	
	.titulo-portada{
		max-width: 290px;
	}	
	.titulo-portada h1{	
		font-size: 22px;
	}
	/************************************************************************************/
	/******************************** ESTILOS CONTACTO **********************************/
	/************************************************************************************/
	.columna-mapa{
		width:100%	
	}
	.columna-mapa .titulo-bienvenida{
		width:60%;	
	}
	.caja-mapa{		
		height:450px;	
	}
	.mapa{		
		height:450px;	
	}
	.telefonos-contacto{	
		flex-direction:column;			
	}
	.telefonos-contacto p{
		text-align:center;
		margin:8px 0;
	}
	.telefonos-contacto p a{
		text-align:center;	
	}
	.telefonos-contacto span{
		display:none;	
	}	
	.boton{		
		width:240px;
		height:70px;
		border-radius:25px;		
		margin-top:45px;		
		padding:8px;
	}
	.boton .letras-boton{
		width:220px;
		height:54px;		
		line-height:54px;		
		border-radius:20px;
	}
	#advertencia{
		margin:20px 0;
		font-size:15px;
	}			
		
}
/************************************************************************************/
/******************************* ESTILOS PARA 480 ***********************************/
/************************************************************************************/
@media only screen and (max-width:480px){
	

}
/************************************************************************************/
/******************************** ESTILOS PARA 375 **********************************/
/************************************************************************************/
@media only screen and (max-width:414px){	
	/************************************************************************************/
	/*************************** ESTILOS PARA LA CABECERA *******************************/
	/************************************************************************************/
	.caja-cabecera{
		padding: 25px 0;
	}
		
	.regresar-cabecera{
		width:120px;
		height:40px;	
		line-height:38px;		
		font-size: 12px;
	}
	/************************************************************************************/
	/******************************** ESTILOS CONTACTO **********************************/
	/************************************************************************************/
	#fcontacto{
		padding:20px;	
	}
	
}
/************************************************************************************/
/******************************** ESTILOS PARA 375 **********************************/
/************************************************************************************/
@media only screen and (max-width:375px){
	
	/************************************************************************************/
	/******************************** ESTILOS CONTACTO **********************************/
	/************************************************************************************/
	.columna-mapa .titulo-bienvenida{
		width:70%;	
	}
	.caja-mapa{		
		height:400px;	
	}
	.mapa{		
		height:400px;	
	}
	.telefonos-contacto p{
		margin:8px 0;
	}
	#fcontacto{
		padding:15px;	
	}
	.boton{
		width:210px;
		height:60px;
		border-radius:20px;		
		margin-top:30px;		
		padding:8px;
	}
	.boton .letras-boton{
		width:190px;
		height:44px;		
		line-height:44px;		
		border-radius:15px;
	}
	#advertencia{
		margin:20px 0;
		font-size:15px;
	}
	
}
/************************************************************************************/
/******************************** ESTILOS PARA 360 **********************************/
/************************************************************************************/
@media only screen and (max-width:360px){	
	
	
}