/**************** LE DAMOS ESTILO AL CUERPO, ES DECIR, A TODA LA PÁGINA WEB *****************/
@font-face{
	font-family: 'ArJulian';
	src: url('../fonts/arjulian.ttf') format('truetype');
}

body{
	font-size:13px;
	font-family: 'Noto Sans', sans-serif;
    font-weight:normal;
    color: #A9A9A9;
	background-color: #fAfAfA;
	text-align: center;
	/*background-image: url("../img/fondo.png");*/
}


/***************************** LE DOY ESTILO A VARIAS COSILLAS ******************************/
*{margin:0; padding: 0; list-style: none;}
a{outline:none; text-decoration:none;}
a:link {text-decoration:none; color: #A9A9A9}
a:visited {text-decoration:none; color:#A9A9A9;} 
a:hover{text-decoration:none; color:#38A8E9;}
img{border:0; padding:0; margin:0;} 

#container{
	width:1000px;
	min-height:500px;
	margin: 0px auto 10px auto;
	padding: 10px 0 20px 0px;
	/*box-shadow:0px 0px 1px #A9A9A9;*/
	background-color: #fAfAfA;
}

/********************************************************************************************/
/************************ LE DOY ESTILO A LA SECCIÓN CABECERA Y MENÚ ************************/
/********************************************************************************************/

#cabecera{
	width:100%;
	height:105px;
	position:relative;
	border-bottom:3px solid #38A8E9;
	margin-bottom:20px;
}

#logo{
	width:300px;
	height:76px;
	position:absolute;
	top:10px;
	left:0px;
	background-color: #38A8E9;
}

#idioma{
	position:absolute;
	top:0px;
	right:0px;
}

#idioma img{
	width:22px;
	height:20px;
	opacity:0.3;
}

#idioma img:hover{
	opacity:1;
	cursor:pointer;
}


#redSocial{
	position: absolute;
	top:30px;
	right:0px;
}

#redSocial img{
	width:40px;
	height:40px;
	opacity:0.5;
	
}

#redSocial img:hover{
	opacity:1;
	transition: 0.5s ease;	
}

/*****************Código CSS del Menu*******************/

#menu {
	position:absolute;
	left:340px;
	top:29px;
	/*border:1px solid #00aef1;*/
}

#menu * {
	list-style:none;
	text-decoration:none;
	margin:0;
	padding:0;
}
		
#listaMenu > li{
	float:left;	
}

/*DAMOS ESPACIO ENTRE OPCIONES DE MENU*/
#listaMenu li{
	margin-right:12px;
}

/*Para obligar que tareas este en azul al poner el reton */
#listaMenu .subMenu:hover{
	background-color: #00aef1;
}

#listaMenu .subMenu:hover a{
	color:#fff;
}

/* ENLACE PRINCIPAL DEL MENU */		
#listaMenu li a{
	/*font-family: Arial, Helvetica, sans-serif;*/
	text-align:center;
	font-size: 17px;
	font-weight: bold;
	padding: 10px 20px;
	/*background-color: #2586d7;*/
	color: #A9A9A9;
	display:block;
}

#listaMenu li a:hover{
	color: #fff !important; 
	transition: background-color 1s ease;
	background-color: #00aef1;
}

#listaMenu li a.active{
	color: #00aef1;
	transition:0.2s linear;
}

/***** SUBMENU *****/

#listaMenu li ul {
	display:none;
	position:absolute;
	min-width:107px;
	color:#5C5C5C !important;
}

#listaMenu li:hover > ul{
	display:block;
	z-index: 1000;	
}

/* ENLACES SUBMENU */
#listaMenu li li a{
	background-color: #F5F5F5;
	border: 1px solid #38A8E9;
	border-top:none;
	font-size:12px;
	color:#6B6B6B !important;
	padding:10px 20px !important;
}

#listaMenu li li a:hover{
	color:#fff !important;
	background-color:#00aef1;
}

/********************************************************************************************/
/************************** ESTILO CABECERA DE SECCIONES  ***********************************/
/********************************************************************************************/

#titulo{
	width:445px;
	float:left;
	margin-top:40px;
	padding: 0 15px;
}

			
#titulo p{
	margin-top:10px;
	font-size:14px;
	color:#C0C0C0;
}
			
#textoSeccion{
	float:right;
	width:450px;
	margin-bottom:20px;
	padding:15px;			
}
			
#textoSeccion p{
	font-size:15px;
}

.panel{
	outline: 1px solid #E8E8E8;
	padding:5px 20px 20px 20px;
}

.panelZero{
	outline: 1px solid #E8E8E8;
}

.panelMini{
	outline: 1px solid #E8E8E8;
	padding:5px 5px 20px 5px;
}


/********************************************************************************************/
/************************ LE DOY ESTILO AL PIE DE PÁGINA  ***********************************/
/********************************************************************************************/

#pie{
	width:100%;
	height:95px;
	color: #fff;
	border-top:10px solid #38A8E9;
	background-color:#F2F2F2;
	padding:15px 0;
	font-size: 12px;
	text-align:left;
	position:relative;
}

#pie p{
	margin:0 !important;
}

#pie li{
	margin-bottom:5px;
}

#datosEmpresa{
	float:right;
	margin-right:15px;
	border:1px solid #E8E8E8;
	padding: 10px 15px;
	background-color: #fff;
	color:#A9A9A9;
	border-radius: 9px 9px 9px 9px;
	position:relative;
}

#pie img{
	bottom:13.5px;
	right:24px;
	width:15px;
	height:11px;
	position:absolute;
}

#datosEmpresa a{
	color:#fff !important;
}
#datosEmpresa a:hover{
	color: #111;
}

.listaServicios{
	padding: 0px 10px;
	width:210px;
	float:left;
	margin-left:15px;
}

#redSocialPie{
	position: absolute;
	top:90px;
	right:210px;
}

#redSocialPie img{
	width:40px;
	height:40px;
	opacity:0.5;
	
}

#redSocialPie img:hover{
	opacity:1;
	transition: 0.5s ease;	
}

/*** SUBPIE ***/
#subPie{
	width:100%;
	margin-top:10px;
	color: #A9A9A9;
}

#autor{
	float:right;
}

#derechos{
	float:left;
}

#subPie p{
	font-size:11px !important;
	color:  #A9A9A9;;
}

/********* TITULOS Y PARRAFOS *************/

h1{
	font-weight:bold;
	font-size:32px;
	color:#38A8E9;
	margin-bottom:10px;
	text-align:center;
}

h2{
	font-weight:bold;
	font-size:16px;
	text-align:left;
	margin-bottom:15px;
	padding: 15px 0 5px 0;
	border-bottom: 1px solid #38A8E9; 
	color: #4F4F4F;
}

h3{
	font-weight:bold;
	font-size:14px;
	color: #707070;
	text-align:center;
	padding-bottom:10px;
	margin-bottom:10px;
}

h3.privado{
	/*font-weight:normal !important;*/
	font-size:13px !important;
	color: #AAA !important;
	text-align:center !important;
	padding-bottom:10px;
	margin:10px auto 10px auto !important;
	width:80% !important;
	border-bottom: 1px dotted #E8E8E8;
}

p{
	text-align:justify;
	color: #8C8C8C;
	font-size: 13px;
	margin-bottom:10px;
}

.azul{
	color: #38A8E9;
}

#etiqueta{
	text-align:center;
	color:#8C8C8C;
	background-color:#E8E8E8;
	padding:6px 0;
	font-weight:bold;
	margin-bottom:15px;
	font-size:14px;
}

.flecha{
	font-size:30px;
	color:#38A8E9;
	float:left;
	margin-top:-15px;
	margin-right:10px;
	margin-bottom:5px;
}

/*********************** LABELS **********************/

label{
	color:#38A8E9;
	font-size:13px;
	font-weight:bold;
	display:inline;
	float: left;
	text-align:left;
	margin-top:10px;
}

.labelH{
	margin-right:15px;
}

.labelVS{
	width:80px;
}

.labelVM{
	width:100px;
}

.labelVL{
	width:125px;
}
/*********************** INPUTS **********************/

.botones{
	height:35px;
	padding: 4px 25px;
	background: #fff;
	color: #38A8E9;
	border: 1px solid #DEDEDE;
	margin:10px 5px 0 5px;
	cursor:pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	float: none !important;
}

.botonesSinM{
	height:35px;
	padding: 4px 25px;
	background: #fff;
	color: #38A8E9;
	border: 1px solid #DEDEDE;
	cursor:pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	float: none !important;
}
		
.botones:hover{
	background:#38A8E9;
	border: 1px solid #38A8E9;
	color: #FFF;
}

input{
	height:25px;
	border:1px solid #DEDEDE;
	padding: 4px 7px;
	font-size:13px;
	font-family: Arial, Helvetica, sans-serif;
	float: left;
	color: #8C8C8C;
	margin-bottom:15px;
	background-color:#fff;
}

.inputSinM{
	margin-bottom:0 !important;
}


input:hover{
	border:1px solid #38A8E9;
}

.inputImg{
	width:33px;
	height:33px;
	margin-left:15px;
	display:inline;
	float:left;
	opacity:0.5;
}

.inputImg:hover{
	opacity:1;
}

.inputXS{
	width:50px;	
}

.inputS{
	width:75px;	
}

.inputM{
	width:100px;	
}

.inputL{
	width:125px;	
}

.inputXL{
	width:160px;	
}

.inputXXL{
	width:200px;	
}

.inputBig{
	width:250px;	
}

/********************* SELECT **********************/

select{
	height:35px;
	border:1px solid #DEDEDE;
	padding: 7px 7px;
	float: left;
	color: #8C8C8C;
	margin-bottom:15px;
	background-color:#fff;
	font-size:13px;
	font-family: Arial, Helvetica, sans-serif;
}

select:hover{
	border:1px solid #38A8E9;
}

.selectXL{
	width:250px;
}

/********************* TEXTAREA **********************/

textarea{
	resize:none;
	border:1px solid #DEDEDE;
	margin:0;
	padding: 4px 7px;
	font-family: Arial, Helvetica, sans-serif;
	font-size:13px;
	color: #8C8C8C;
	float:left;
}

textarea:hover{
	border:1px solid #38A8E9;
}

/********* SEPARADORES Y ELEMENTOS AUXILIARES ********/

.left{
	float: left;
}
			
.right{
	float: right;
}

.separadorH{
	width:100%;
	border-bottom: 1px solid #E8E8E8;
}

.clear{
	clear: both;
}

.marginRight{
	margin-right:20px;
}

#invalid{
	margin-top:20px;
	color:red;
}

#recuperarKey{
	margin-top:20px;
	color:#38A8E9;
	text-align:center;
}

.centerText{
	text-align:center;
}

.redText{
	color:#CD2626 !important;
}

.margenInfM{
	margin-bottom:20px;
}

.bold{
	font-weight:bold;
}

.boldTotal{
	border-top:1px solid #38A8E9;
	font-weight:bold;
	color: #666 !important;
}

/********************************************************************************************/
/************************ LE DOY ESTILO A LAS TABLAS  ***********************************/
/********************************************************************************************/

.tabla th{
	border-bottom: 1px solid #38A8E9;
	color:#333;
	text-align:center;
	padding: 0 10px;	
}
		
.tabla td{
	font-size:13px;
	text-align:center;
	color:#222;
}
		
.tabla tbody tr:hover{
	background:#CAE1FF;
	cursor:pointer;
}

.tabla tbody td{
	padding: 8px 15px;	
}
			
table{
	margin: 0 auto;
	padding: 0;
	cursor:	default;
}

.trImpar{
	background:#F2F2F2;
}

.tdVerde{
	color:green !important;
}

#tdLocalidad{
	width:180px;
}

#tdFecha{
	width:75px;
}

#tdCliente{
	width:270px;
}

/******************************************************/
.BotonFormularioAdjuntar{
	position: relative;
	width: 100px;
	height: 25px;
	overflow:hidden;
	text-align: center;
	float: right;
	cursor: pointer;
	margin-right: 5px;
	font-size:15px !important;
}

.BotonFormularioAdjuntar input{
	position: absolute;
	height: 45px;
	right: 0px;
	top: -9px;
	margin:0;
	padding:0;
	cursor: pointer;
	filter: Alpha(Opacity=0);
	opacity: 0;
}