/* Criterios de estilo Policlínicas AC



*/

:root{
--colorFondo: #FFFFFF;
--colorAC: #003C96;
--colorACfondo: #003C96;
--colorAzulFondo: #ECF2FF;
--colorAzulFondo2: #9cb7f0;
--colorCita: #FFFF00;
--colorCelda: #a9d0fd;
--tipoLetra1: tahoma;

}


BODY.meskeh
{	background-color: #FFFFFF;
	background-image: url(../imagenes/juramentoAC.png);
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
  	display: flex;					/*Estas son las tres cosas nuevas para mandar el footer abajo*/
    min-height: 100vh;				/*Estas son las tres cosas nuevas para mandar el footer abajo*/
    flex-direction: column;			/*Estas son las tres cosas nuevas para mandar el footer abajo*/
}

.contenido
{
	flex: 1;						/*Estas son las tres cosas nuevas para mandar el footer abajo*/
}

.pie
{
	flex: 1;						/*Estas son las tres cosas nuevas para mandar el footer abajo*/
}

BODY.meskehCero
{	background-color: #FFFFFF;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}


.ac
{	background-color: var(--colorAC);
	background-image: url(../imagenes/fondoAC22.png);
	background-repeat: repeat;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

.centrado
{  display: block;
	margin-left: auto;
	margin-right: auto;
}

.centrada {
	display: block;
	margin: 0 auto;
}

div.cajas{ border: 0px solid; color:var(--colorAC); height: auto; width: auto; margin:10px; background-color:var(--colorAzulFondo);
font-size: 20px; font-family: var(--tipoLetra1); text-align:center; padding-top: 10px; padding-bottom:10px; padding-left:5px; padding-right:5px; word-wrap:break-word; box-shadow: 4px 4px 4px #003c69; }
/*border es la anchura de la linea de fuera*/
/*margin es la distancia entre los cuadritos*/

div.marcos{ border: 2px solid; color:var(--colorAC); height: auto; width: auto; margin:10px; background-color:#FFFFFF;
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:5px; padding-right:5px; word-wrap:break-word; }

div.marcos2{ border: 1px solid; color:var(--colorAC); height: 80px; width: 180px; margin:10px; background-color:#FFFFFF; border-radius: 15px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:5px; padding-right:5px; word-wrap:break-word; box-shadow: 4px 4px 7px #003c69;
text-decoration:none; }

div.marcos2:hover{ border: 1px solid; color:var(--colorAC); height: 80px; width: 180px; margin:10px; background-color:#FFFFFF; border-radius: 15px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:5px; padding-right:5px; word-wrap:break-word; box-shadow: 7px 7px 7px #003c69;
text-decoration:none; transition: all .2s}

div.marcos3{ border: 1px solid; color:var(--colorAC); height: auto; width: auto; margin:10px; margin-bottom:15px; background-color:#FFFFFF; border-radius: 15px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 0px; padding-bottom:0px; padding-left:5px; padding-right:5px; word-wrap:break-word; box-shadow: 4px 4px 7px #003c69; }

div.marcos4{ border: 1px solid; color:var(--colorAC); height: 35px; width: 200px; margin:10px;
background: linear-gradient(to top, rgba(255,255,255,0), rgba(80,130,210,1)); 
background-color:#FFFFFF; border-radius: 15px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:0px; padding-right:5px; word-wrap:break-word; box-shadow: 4px 4px 7px #003c69;
text-decoration:none;}

div.marcos6{ border: 1px solid; color:var(--colorAC); height: 80px; width: 180px; margin:10px; background-color:#F5F8FF; border-radius: 15px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 0px; padding-bottom:0px; padding-left:0px; padding-right:0px; word-wrap:break-word; box-shadow: 4px 4px 7px #003c69;
text-decoration:none; }

div.marcos6:hover{ border: 1px solid; color:var(--colorAC); height: 80px; width: 180px; margin:10px; background-color:#99BBFF; border-radius: 15px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 0px; padding-bottom:0px; padding-left:0px; padding-right:0px; word-wrap:break-word; box-shadow: 4px 4px 7px #003c69;
text-decoration:none; transition: all .3s}

div.marcos7{ border: 1px solid; color:var(--colorAC); height: 35px; width: 135px; margin:10px; background-color:#FFFFFF; border-radius: 15px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:0px; padding-right:5px; word-wrap:break-word; box-shadow: 4px 4px 7px #003c69;
text-decoration:none;}

div.marcos7:hover{ border: 1px solid; color:var(--colorAC); height: 35px; width: 135px; margin:10px; background-color:#FFFFFF; border-radius: 15px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:0px; padding-right:5px; word-wrap:break-word; box-shadow: 7px 7px 7px #003c69;
text-decoration:none;}

div.marcos8{ border: 1px solid; color:var(--colorAC); height: 40px; width: 160px; margin:10px; background-color:#F5F8FF; border-radius: 5px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 0px; padding-bottom:0px; padding-left:0px; padding-right:0px; word-wrap:break-word; box-shadow: 2px 4px 8px #003c69;
text-decoration:none; }

div.marcos8:hover{ border: 1px solid; color:var(--colorAC); height: 40px; width: 160px; margin:10px; background-color:#99BBFF; border-radius: 5px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 0px; padding-bottom:0px; padding-left:0px; padding-right:0px; word-wrap:break-word; box-shadow: 2px 4px 8px #003c69;
text-decoration:none; transition: all .3s}

div.marcosVero{ border: 0px solid; color:var(--colorAC); height: auto; width: auto; margin:10px; margin-bottom:15px; background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 0px; padding-bottom:0px; padding-left: 0px; padding-right:0px; word-wrap:break-word; overflow:hidden; box-shadow: 4px 4px 4px #003c69; }

div.marcosVeroVivos{ border: 0px solid; color:var(--colorAC); height: auto; width: auto; margin:10px; margin-bottom:15px; background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 0px; padding-bottom:0px; padding-left: 0px; padding-right:0px; word-wrap:break-word; overflow:hidden; box-shadow: 4px 4px 7px #003c69; }

div.marcosVeroVivos:hover{ border: 0px solid; color:var(--colorAC); height: auto; width: auto; margin:10px; margin-bottom:15px; background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 0px; padding-bottom:0px; padding-left: 0px; padding-right:0px; word-wrap:break-word; overflow:hidden; box-shadow: 7px 7px 7px #003c69; 
transition: all .2s}

div.marcosVeroVivosGuillem{ border: 0px solid; color:var(--colorAC); height: 290px; width: auto; margin:10px; margin-bottom:15px; background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
font-size: 13px; text-align: justify; padding-top: 0px; padding-bottom:0px; padding-left: 0px; padding-right:0px; word-wrap:break-word; overflow:hidden; box-shadow: 4px 4px 7px #003c69; }

div.marcosVeroVivosGuillem:hover{ border: 0px solid; color:var(--colorAC); height: 290px; width: auto; margin:10px; margin-bottom:15px; background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
font-size: 13px; text-align: justify; padding-top: 0px; padding-bottom:0px; padding-left: 0px; padding-right:0px; word-wrap:break-word; overflow:hidden; box-shadow: 7px 7px 7px #003c69; 
transition: all .2s}

div.marcos5{ border: 1px solid; color:var(--colorAC); height: auto; width: auto; margin:0px; background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
font-size: 14px; text-align:center; padding-top: 0px; padding-bottom:0px; padding-left:0px; padding-right:0px; word-wrap:break-word; box-shadow: 4px 4px 7px #003c69; }

div.marcosAzul{ border: 0px solid; color:var(--colorAC); height: auto; width: auto; margin:15px; background-color:var(--colorAzulFondo);
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:5px; padding-right:5px; word-wrap:break-word; box-shadow: 4px 4px 7px #003c69; }

div.marcosAzulEspec{ border: 0px solid; color:var(--colorAC); height: auto; width: auto; margin:15px; background-color:var(--colorAzulFondo); border-radius:15px; width:950px; 
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:5px; padding-right:5px; word-wrap:break-word; box-shadow: 4px 4px 7px #003c69; }

div.marcosAzulMenu{ border: 0px solid; color:var(--colorAC); height: auto; width: auto; margin:12px; background-color:var(--colorAzulFondo);
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:5px; padding-right:5px; word-wrap:break-word; box-shadow: 4px 4px 7px #003c69; }

div.marcosAzulMenu:hover{ border: 0px solid; color:var(--colorAC); height: auto; width: auto; margin:12px; background-color:var(--colorAzulFondo);
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:5px; padding-right:5px; word-wrap:break-word; box-shadow: 7px 7px 7px #003c69; transition: all .2s}

div.marcosAzulMenuVero{ border: 0px solid; color:var(--colorAC); height: auto; width: auto; margin:12px; background-color:var(--colorAzulFondo); border-radius: 8px;
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:5px; padding-right:5px; word-wrap:break-word; box-shadow: 4px 4px 4px #003c69; }

div.marcosAzulMenuVero:hover{ border: 0px solid; color:var(--colorAC); height: auto; width: auto; margin:12px; background-color:var(--colorAzulFondo); border-radius: 8px;
font-size: 14px; text-align:center; padding-top: 5px; padding-bottom:5px; padding-left:5px; padding-right:5px; word-wrap:break-word; box-shadow: 7px 7px 7px #003c69; transition: all .2s}

div.marcosCal{ border: 0px solid; color:var(--colorAC); height: 202px; width: 135px; margin:5px; background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
font-size: 14px; text-align:center; padding: 0px; word-wrap:break-word; overflow:hidden; box-shadow: 4px 4px 7px #003c69; }

div.marcosCalDias{ border: 0px solid; color:var(--colorAC); height: 40px; width: 135px; margin:5px; background-image: url(../imagenes/dias.png); border-radius: 0px; vertical-align:middle;
font-size: 14px; text-align:center; padding: 0px; word-wrap:break-word; overflow:hidden; box-shadow: 4px 4px 7px #003c69; }

div.marcosCalOrla{ border: 0px solid; color:var(--colorAC); height: 165px; width: 135px; margin:5px; background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
font-size: 14px; text-align:center; padding: 0px; word-wrap:break-word; overflow:hidden; box-shadow: 4px 4px 7px #003c69; }

div.marcosEquipo{ border: 0px solid; color:var(--colorAC); height: 210px; width: 185px; margin:5px; background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
	font-size: 14px; text-align:center; padding: 0px; word-wrap:break-word; overflow:hidden; box-shadow: 4px 4px 7px #003c69; }

div.marcosFoto{ border: 0px solid; color:var(--colorAC); background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
word-wrap:break-word; overflow:hidden; box-shadow: 4px 4px 4px #003c69; transition: transform .4s; }

div.marcosFoto:hover{ border: 0px solid; color:var(--colorAC); background-color:#FFFFFF; border-radius: 0px; vertical-align:middle;
word-wrap:break-word; overflow:hidden; box-shadow: 4px 4px 4px #003c69; transform: scale(2.4); }

div.pie{
	background-color: var(--colorACfondo);

}


/*Aquí están los estilos para las cajas con bordes redondeados*/

div.rounded-box {
position: relative;
width: 19em;
background-color: #CCCCCC; /*Color del fondo y bordes del cuadro*/
margin: 10px auto;
}

/*********************
Caja Exterior
*********************/
div.top-left-corner, div.bottom-left-corner, div.top-right-corner, div.bottom-right-corner {
position: absolute;
width: 20px;
height: 20px;
background-color: #FFFFFF; /*color de las esquinitas fuera de la curva*/
overflow: hidden;
z-index: 0;
}

div.top-left-inside, div.bottom-left-inside, div.top-right-inside, div.bottom-right-inside {
position: relative;
font-size: 150px;
font-family: arial;
color: #CCCCCC;
line-height: 40px;
z-index: 0;
}

/*********************
Bordes
*********************/

div.top-left-corner { top: 0px; left: 0px; }
div.bottom-left-corner {bottom: 0px; left: 0px;}
div.top-right-corner {top: 0px; right: 0px;}
div.bottom-right-corner {bottom: 0px; right: 0px;}
div.top-left-inside {left: -8px;}
div.bottom-left-inside {left: -8px; top: -17px;}
div.top-right-inside {left: -25px;}
div.bottom-right-inside {left: -25px; top: -17px;}

/*********************
Contenido (txt)
*********************/

div.box-contents {
position: relative;
padding: 10px;
color:#000;
font-weight: bolder;
z-index: 1;
} 

.gradiente{
    width: 250px;
    height: 250px;
    background: #eee;
    border: 30px solid transparent;
    -moz-border-image: -moz-linear-gradient(top, #3acfd5 0%, #3a4ed5 100%);
    -webkit-border-image: -webkit-linear-gradient(top, #3acfd5 0%, #3a4ed5 100%);
    border-image: linear-gradient(to bottom, #ffffff 0%, #000000 100%);
    border-image-slice: 1;
}

/*Aquí acaban los estilos para las cajas de bordes redondeados*/


table.esquema {
  border-collapse:collapse;
  border:1px solid #CCC;
}
/* Espacio de relleno en celdas y cabeceras */
td.esquema, th.esquema {
  padding:10px;
}
/* Modificación de estilos en cabeceras */
th.esquema {
  background:var(--colorAC);
  color:#CCDDFF;
  text-transform:none;
}
/* Modificación de estilos en celdas */
td.esquema {
  text-align:center;
  border-bottom:1px solid var(--colorAC);
  border-top:1px solid var(--colorAC);
  border-left:1px solid var(--colorAC);
  border-right:1px solid var(--colorAC);
  color:var(--colorAC);
  font-size:14px;
}

td.formulario_texto {
  text-align:right;
  color:var(--colorAC);
  font-size:14px;
}

td.formulario_texto2 {
  text-align:right;
  color:var(--colorAC);
  font-size:25px;
}

td.formulario_respuesta {
  text-align:left;
  color:var(--colorAC);
  font-size:14px;
}

.formulario_respuesta2 {
  text-align:left;
  color:var(--colorAC);
  font-size:20px;
}

table.base {
  border-collapse:collapse;
  border:0px solid #CCC;
  text-align:center;
  font-family: var(--tipoLetra1);
}
/* Espacio de relleno en celdas y cabeceras */
td.base {
  padding:5px;
  text-align: center;
  font-family: var(--tipoLetra1);
  text-decoration: none;
}

table.bonita {
  border-collapse:collapse;
  border:2px solid var(--colorAC);
  text-align:center;
  font-family: var(--tipoLetra1);
  background-color: var(--colorAzulFondo);
}

th.bonita {
  padding:1px;
  border:1px solid var(--colorAC);
  text-align: center;
  font-family: var(--tipoLetra1);
  text-decoration: none;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
}

td.bonita {
  padding:1px;
  border:1px solid var(--colorAC);
  text-align: center;
  font-family: var(--tipoLetra1);
  text-decoration: none;
  padding: 5px;
}

/* Modificación de estilos en cabeceras */
th.base {
  background:var(--colorAC);
  color:#CCDDFF;
  text-transform:none;
  text-align:center;
  font-family: var(--tipoLetra1);
}
/* Modificación de estilos en celdas */
td.base2, table.base2 {
  text-align:left;
  border-bottom:0px solid var(--colorAC);
  border-top:0px solid var(--colorAC);
  border-left:0px solid var(--colorAC);
  border-right:0px solid var(--colorAC);
  color:var(--colorAC);
  font-size:14px;
  font-family: var(--tipoLetra1);
}

tr.cuadros {
height:110px;}

/* Tablas para descargas de documentos */
table.docs {
	width: 900px;
	text-align: center;
	vertical-align: middle;
	border-collapse: collapse; 
	background-color: rgba(211, 211, 211, 0.7);
	display: block;
	margin: 0 auto;
}

tr.docs {
	height: 50px;
}

td.docs {
	text-align: center;
	vertical-align: middle;
}

.navegacion{
	width: auto; 			/* ancho del area de menu */
	height: auto;
	margin: 5px auto; 	/* desde arriba y desde abajo */
	margin-left: 0px;   /* desde la izquierda hasta que empieza la franja de menú */
	background: none;
	margin-top: 0px;
	font-family: var(--tipoLetra1);
	z-index: 100;

}

.navegacion ul{
	list-style: none;
	padding-left: 0px;
	font-family: var(--tipoLetra1);
	z-index: 100;
	
}

.menu > li{
	display: inline-block;
	padding-left: 0px; /*adicional entre cuadrito y cuadrito*/
	padding-right: 0px;
	margin-left: 0px;
	margin-right: -3px; /* antes -6px y esto es un truco porque HTML no deja en los inline-block quitar esos 5px */
	box-shadow: 5px 5px 5px #888888;
	font-family: var(--tipoLetra1);
	z-index: 100;
	
}

.menu > li > a{
	display: block;
	padding: 6px 10px;	/* Altura y espacio entre textos dentro del recuadro */
	color: #FFFFFF;
	background: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 16px;			/*Tamaño de letra de los menús*/
	text-decoration: none;
	margin-left: 0px;
	margin-right: 0px;
	z-index: 100;
}

.menu li a:hover{
	color: var(--colorAC);
	background: #BBBBBB;
	transition: all .2s;
	z-index: 100;
}

.submenu{
	position: absolute;
	background: none;
	width: auto;			/* Ancho del submenu */
	height: auto;
	visibility: hidden;
	opacity: 0;
	transition: opacity .75s;
	font-family: var(--tipoLetra1);
	z-index: 100;
}


.submenu li a{
	display: block;
	padding: 6px;				/*altura de los items*/
    margin-top: 3px;
	color: var(--colorAC);
	background: var(--colorAzulFondo);
	font-family: var(--tipoLetra1);
	font-size: 15px;			/*Tamaño de letra de los menús*/
	text-decoration: none;
	box-shadow: 5px 5px 5px #888888;
	z-index: 100;
}

.menu li:hover .submenu{
	visibility: visible;
	opacity: 1;
	z-index: 100;

}


.navegacionV{
	width: auto; 			/* ancho del area de menu */
	height: auto;
	margin: 5px auto; 	/* desde arriba y desde abajo */
	margin-left: 0px;
	background: #FFFFFF;
	font-family: var(--tipoLetra1);

}

.navegacionV ul{
	list-style: none;
	padding-left: 0;
	font-family: var(--tipoLetra1);
}

.menuV > li{
	/*display: inline-block;*/ /*Esto es lo que hace que esté horizontal o vertical. Sin esta línea es vertical*/
	margin-top: 2px;
	margin-right: 5px;
	text-align: right;
	font-family: var(--tipoLetra1);
}

.menuV > li > a{
	display: block;
	padding: 5px 10px;	/* Altura y espacio entre cuadritos de menu */
	color: var(--colorAC);
	background: #a9d0fd; /*#88AAFF;*/
	font-family: var(--tipoLetra1);
    font-size: 14px;			/*Tamaño de letra de los menús*/
	text-decoration: none;

}

.menuV li a:hover{
	color: #0044BB;
	background: #BBBBBB;
	transition: all .1s;
}

.menuAD > li{
	/*display: inline-block;*/ /*Esto es lo que hace que esté horizontal o vertical. Sin esta línea es vertical*/
	margin-top: 12px;
	margin-right: 10px;
	text-align: center;
	box-shadow: 4px 4px 4px #003c69;
	
}

.menuAD > li > a{
	display: block;
	padding: 6px 10px;	/* Altura y espacio entre cuadritos de menu */
	color: var(--colorAC);
	background: #a9d0fd;; /*#88AAFF;*/
	font-family: var(--tipoLetra1);
    font-size: 14px;			/*Tamaño de letra de los menús*/
	text-decoration: none;

}

.menuAD li a:hover{
	color: #0044BB;
	background: #BBBBBB;
	transition: all .1s;
}

hr{color:#02A}

h1.meskeh
{	color: #6699FF;
	font-family: var(--tipoLetra1);
	font-size: 26pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	
	text-align: center;
}

h1.logo
{	color: #FFFFFF; /*var(--colorAC);*/
    display: block;
    margin-top: 2px;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
	font-family: sans-serif;
	font-size: 40pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: center;	
	text-shadow: 2px 2px 2px #003c69;
}

h2.logo
{	color: #FFFF00;
    display: block;
    margin-top: 0px;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
	font-family: arial;
	font-size: 17pt;
	font-weight: bold;
	font-style: none;
	font-variant: normal;
	text-align: center;
	text-shadow: 2px 2px 2px #003c69;
}

.info
{	color: #FFFFFF;
    display: block;
    margin-top: 1px;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
	font-family: arial;
	font-size: 12pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: right;
}

.info2
{	color: #FFFFFF;
    display: block;
    margin-top: 4px;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
	font-family: arial;
	font-size: 14pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: right;
}

h2.meskeh
{	color: #6699FF;
	font-family: var(--tipoLetra1);
	font-size: 20pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: center;	
}

h3.meskeh, h3.meskeh:link, h3.meskeh:visited, h3.meskeh:active
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 16pt;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	text-align: center;
	text-decoration:none;
}

h3.meskehSombra
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 18pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: center;
	text-shadow: 2px 2px 2px #003c69;
}

h3.noticia
{	color: #BB0000;
	font-family: var(--tipoLetra1);
	font-size: 20pt;
	font-weight: bold;
	font-style: none;
	font-variant: normal;
	text-align: center;
	padding-top: 0px;
	padding-bottom: 0px;
	border-top: 0px;
	border-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 10px;

}

h3.noticiaLibre
{	font-family: var(--tipoLetra1);
	font-size: 18pt;
	font-weight: bold;
	font-style: none;
	font-variant: normal;
	text-align: center;
	padding-top: 0px;
	padding-bottom: 0px;
	border-top: 0px;
	border-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 10px;

}

h3.noticiaVerde
{	color: #009900;
	font-family: var(--tipoLetra1);
	font-size: 20pt;
	font-weight: bold;
	font-style: none;
	font-variant: normal;
	text-align: center;
	padding-top: 0px;
	padding-bottom: 0px;
	border-top: 0px;
	border-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 10px;

}

h3.oferta
{	color: #BB0000;
	font-family: var(--tipoLetra1);
	font-size: 18pt;
	font-weight: bold;
	font-style: none;
	font-variant: normal;
	text-align: center;
	padding-top: 0px;
	padding-bottom: 0px;
	border-top: 0px;
	border-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 0px;

}

h3.especialista
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 18pt;
	font-weight: bold;
	font-style: none;
	font-variant: normal;
	text-align: left;
	padding-top: 0px;
	padding-bottom: 0px;
	border-top: 0px;
	border-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

h2.amano
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 24pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: center;
	text-shadow: 3px 3px 5px #407cA9;
	padding-top: 0px;
	padding-bottom: 0px;
	border-top: 0px;
	border-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

h2.amano2
{	color: var(--colorAC);
	font-family: "Lucida Handwriting", var(--tipoLetra1);
	font-size: 20pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: center;
	text-shadow: 3px 3px 5px #FFFFFF;
	padding-top: 0px;
	padding-bottom: 0px;
	border-top: 0px;
	border-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 40px;
	margin-right: 40px;
}

h3.amano
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 18pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: left;
	text-shadow: 5px 5px 5px #003c69;
	padding-top: 0px;
	padding-bottom: 0px;
	border-top: 0px;
	border-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 15px;
	margin-left: 15px;
}

h4.meskeh
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 15pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: right;
	
	margin-top: 5pt;
	margin-left: 15pt;
	margin-bottom: 0pt;
	margin-right: 15pt;
}

h4.guillem
{	color: #663c96;
	font-family: var(--tipoLetra1);
	font-size: 14pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: center;
	
	margin-top: 5pt;
	margin-left: 15pt;
	margin-bottom: 0pt;
	margin-right: 15pt;
}

h5.meskeh
{	color: #6699FF;
	font-family: var(--tipoLetra1);
	font-size: 15pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	
	text-align: center;
}

h6.meskeh
{	color: #6699FF;
	font-family: var(--tipoLetra1);
	font-size: 6pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: center;
}

h6.noticia
{	color: #993C96;
	font-family: var(--tipoLetra1);
	font-size: 15pt;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-align: left;
	margin: 0px;
	padding: 0px;
}

li.meskeh
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 12pt;
	font-style: none;
	font-variant: normal;
	text-align: left;
	margin-top: 5pt;
	margin-left: 5pt;
	margin-bottom: 0pt;
	margin-right: 5pt;
}


p.meskeh
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 12pt;
	font-style: none;
	font-variant: normal;
	text-align: justify;
	margin-top: 5pt;
	margin-left: 5pt;
	margin-bottom: 5pt;
	margin-right: 5pt;
	padding: 10px;
}

p.meskehEquipo
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 12pt;
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
	text-align: center;
	margin-top: 0pt;
	margin-left: 1pt;
	margin-bottom: 1pt;
	margin-right: 1pt;
	padding: 0px;
	width: 185px;
}

p.meskehPie
{	color: #FFFFFF;
	font-family: var(--tipoLetra1);
	font-size: 10pt;
	font-style: none;
	font-variant: normal;
	text-align: justify;
	margin-top: 5pt;
	margin-left: 5pt;
	margin-bottom: 5pt;
	margin-right: 5pt;
}

p.meskeh3
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 13pt;
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
	text-align: center;
	margin-top: 4pt;
	margin-left: 5pt;
	margin-bottom: 5pt;
	margin-right: 5pt;
	vertical-align: middle;
}

p.meskehC, p.meskeh:link
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 11pt;
	font-style: none;
	font-variant: normal;
	text-align: center;
	margin-top: 5pt;
	margin-left: 5pt;
	margin-bottom: 5pt;
	margin-right: 5pt;
}

p.meskehCEquipo
{	color: var(--colorAC);
	font-family: var(--tipoLetra1);
	font-size: 11pt;
	font-style: none;
	font-variant: normal;
	text-align: center;
	margin-top: 5pt;
	margin-left: 5pt;
	margin-bottom: 5pt;
	margin-right: 5pt;
	width: 185px;
}

p.texto
{	color: #C0C0C0;
	font-family: var(--tipoLetra1);
	font-size: 10pt;
	font-style: none;
	font-variant: normal;
	text-align: justify;
	margin-top: 10pt;
	margin-left: 25pt;
	margin-bottom: 10pt;
	margin-right: 25pt;
}

p.marco
{	color: #C0C0C0;
	font-family: var(--tipoLetra1);
	font-size: 12pt;
	font-style: none;
	font-variant: normal;
	text-align: justify;
	
	border-color: #909090;
	border-style: dashed;
	border-width: thin;
	
	margin-top: 10pt;
	margin-left: 45pt;
	margin-bottom: 10pt;
	margin-right: 45pt;
	
	padding-top: 10pt;
	padding-left: 10pt;
	padding-bottom: 10pt;
	padding-right: 10pt;
}




a.meskeh:link, A.meskeh:visited
{	color: #66FFFF;
	background-color: #3300FF;
	font-family: var(--tipoLetra1);
	font-size: 7pt;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	text-align: center;
	text-decoration: none;
}


a.meskeh:active
{	color: #FFFF00;
	background-color: #3300FF;
	font-family: var(--tipoLetra1);
	font-size: 7pt;
	font-weight: bold;
	font-style: none;
	font-variant: normal;
	text-align: center;
}

a.silencioso:link, A.silencioso:visited
{	color: var(--colorAC);
	background-color: none;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	text-decoration: none;
}


a.silencioso:active
{	color: var(--colorAC);
	background-color: none;
	font-weight: normal;
	font-style: none;
	font-variant: normal;
	text-decoration: none;
}

a.sublink:link, A.sublink:visited
{	color: #66FFFF;
	background-color: #000080;
	font-family: var(--tipoLetra1);
	font-size: 8pt;
	font-weight: normal;
	font-style: italic;
	font-variant: normal;
	text-align: right;
	text-decoration: none;
}


a.sublink:active
{	color: #FFFF00;
	background-color: #000080;
	font-family: var(--tipoLetra1);
	font-size: 8pt;
	font-weight: normal;
	font-style: italic;
	font-variant: normal;
	text-align: right;
}

div.cabecera_menu
{	color: #88FF88;
	background-color: #007744;
	font-family: var(--tipoLetra1);
	font-size: 10pt;
	font-weight: bold;
	font-style: none;
	font-variant: normal;
	text-align: center;
}

a, a:link, a:visited, a:active{
	text-decoration: none;
	font-family: var(--tipoLetra1);
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	
}

a.meskeh, a.meskeh:link, a.meskeh:visited, a.meskeh:active{
	text-decoration: none;
	font-family: var(--tipoLetra1);
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	
}

.zoom13 {
	 transition: transform .4s; 
}
 
.zoom13:hover {
    transform: scale(1.3); 
}

.zoom30 {
	 transition: transform .4s; 
}
 
.zoom30:hover {
    transform: scale(3.0); 
}




.blink {
      animation: blinker 1.0s linear infinite;
      color: #FF7777;
      font-size: 28px;
      font-weight: bold;
      font-family: var(--tipoLetra1);
      }
      @keyframes blinker { 0% { opacity: 0; }
      }

.parpadeo {
      animation: parpadeo 1s linear infinite;
      }
      @keyframes parpadeo { 0% { opacity: 0; }
      }

img.imagen1{vertical-align:middle; width: 150px; border:0px}

#animacion{	}

#animacion img{ position:absolute;
	top: 0px;
	left: 0px;
	-moz-transition: all 1s ease-in-out;
	-webkit-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;}

#animacion img.novisible{
	opacity:0;
	filter:alpha(opacity=0);}

#animacion:hover img.novisible{
	opacity:1;
	filter:alpha(opacity=100);}

#animacion:hover img.visible {
	opacity:0;
	filter:alpha(opacity=0);}

#animacion img.visible:hover {
	opacity:0;
	filter:alpha(opacity=0);}
 	
.imagenAumenta:hover {-webkit-transform:scale(1.1);transform:scale(1.1);}
.imagenTransparenta:hover {filter: opacity(.9);}

        .carousel {
            max-width: 900px;
            margin: 0 auto;
            display: flex;

        }
        #imagenCar {
            width: 100%;
            height: 500px;
            background-size: cover;

        }




#draw-canvas {
  border: 2px dotted var(--colorAC);
  border-radius: 15px;
  cursor: crosshair;
  background-color: #F8FAFF;
}

#draw-dataUrl {
  width: 100%;
}

section{
    flex:1;
}

header {
    color: white;
    font-weight: 500;
    padding-left: 15px;
}


.button {
    background: var(--colorAC);
    border: 1px var(--colorAC);
    font-size: 28px;
    padding: 5px 10px;
    border-radius: 5px;
    box-shadow: 3px 3px 5px #407cA9;
    margin: 10px;
    text-decoration: none;
    color: #FFFFFF; 
    
}

.button:active {
    transform: scale(0.9);
}

.contenedor {
    width: 100%;
    margin: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.instrucciones {
    width: 90%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items:center;
    margin-bottom: 10px;
}

input[type=range] {
  -webkit-appearance: none;
  margin: 18px 0;

}
input[type=range]:focus {
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: #3071a9;
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -14px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  background: #367ebd;
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: #3071a9;
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  border-width: 16px 0;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #2a6495;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-fill-upper {
  background: #3071a9;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
  background: #3071a9;
}
input[type=range]:focus::-ms-fill-upper {
  background: #367ebd;
}

input.masgrande {
	  width: 32px;
	  height: 32px;
}


/* AQUÍ EMPIEZAN LOS ESTILOS DEL CALENDARIO */
/*body {
    font-family: Arial, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background-color: #f0f0f0;
    margin: 0;
}
*/
.calendar-container {
    width: 900px;
    background-color: transparent;
    /*border: 0px solid #ddd;*/
    border-radius: 0px; /* Redondeado de las esquinas superiores */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
	font-family: var(--tipoLetra1);
    padding: 10px 10px;
    background-color: var(--colorAC);
    color: #fff;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

.calendar-header button {
    background-color: var(--colorAzulFondo2); /* Fondo azul más oscuro */
    color: #fff; /* Texto en blanco */
    border: none; /* Sin borde */
    padding: 10px 20px; /* Aumenta el tamaño del botón en un 25% */
	font-family: var(--tipoLetra1);
    font-size: 14px; /* Aumenta el tamaño del texto en un 25% */
    font-weight: bold; /* Texto en negrita */
    border-radius: 4px; /* Bordes redondeados */
    cursor: pointer; /* Cambia el cursor al pasar sobre el botón */
    transition: background-color 0.3s ease; /* Transición suave para el color de fondo */
}

.calendar-header button:hover {
    background-color: var(--colorAzulFondo1); /* Fondo azul más oscuro al pasar el ratón */
}

.calendar-header h2 {
    margin: 0;
    /*text-transform: capitalize;*/
}

.calendar {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
    background-color: transparent;
}

.calendar div {
    background-color: transparent;
    padding: 1px;
    margin: 7px;
    text-align: center;
    border: 0px solid #ddd;
    display: flex;
    flex-direction: column; /* Apilar hacia arriba */
    justify-content: flex-start;
    position: relative; /* Para permitir posicionamiento relativo de las especialidades */
    overflow: hidden;
}

.calendar div .separator {
    border: none;
    border-top: 1px solid #060150;
    margin: 1px 0;
}


.calendar div.day {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.7); /* Sombra gris más oscura */
}

.calendar div.specialty {
    /*background-color: rgba(0, 0, 0, 0.1);*/ /*Quito los rectángulos del sombreado*/
    padding: 2px 4px;
    margin: 1px 0;
    border-radius: 0px;
	font-family: var(--tipoLetra1);
	font-size: 15px;
    text-align: center;
    display: block; /* Asegura que cada especialidad se muestre en una nueva línea */
}

.calendar div .day-number {
	padding: 1px;
    margin: 1px;
	font-family: var(--tipoLetra1);
    font-size: 20px; /* Aumenta el tamaño del número en un 25% */
    text-align: right; /* Alinea el número a la derecha */
    font-weight: bold; /* Hace que el número sea negrita */
}

.weekday {
    background: linear-gradient(to bottom, #c3d2fa, #6398f8); /* Azul aclarado en un 20% */
}

.saturday {
    background: linear-gradient(to bottom, #e9e9c9, #ffcd6b); /* Amarillo aclarado en un 20% */
}

.sunday {
    background: linear-gradient(to bottom, #f1b7b7, #ff6464); /* Rojo aclarado en un 20% */
	color: #fff;
}

.holiday {
    background: linear-gradient(to bottom, #f1b7b7, #ff6464);  /* Rojo aclarado en un 20% */
    color: #fff;
    font-weight: bold;
}

.empty {
    background-color: #e0e0e0;
}

/* AQUÍ ACABAN LOS ESTILOS DEL CALENDARIO */

/* Estilos de las fotos como adjuntos */

/* estilosAC1.css */

form {
    margin: 20px;
}

#previewFotos-container {
    display: flex;
    flex-wrap: wrap;
}

.previewFotos {
    margin: 10px;
    position: relative;
    flex: 0 0 30%;
    max-width: 300px;
    box-sizing: border-box;
}

.previewFotos img {
    max-width: 100%;
    height: auto;
    display: block;
}

.previewFotos span {
    position: absolute;
    top: 0;
    right: 0;
    background-color: var(--colorAC);
    color: white;
    cursor: pointer;
    padding: 2px 5px;
    font-size: 12px;
}

.custom-file-upload {
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer;
    background-color: var(--colorAC);
    color: white;
    border-radius: 4px;
    margin-bottom: 10px;
}

#photo-input {
    display: none;
}

/* Fin de estilos de importar fotos como adjuntos */

/* Estilos para mostrar PDFs */

.ver-pdf {
	width: 1100px;
	margin: 0 auto; /* Centrado horizontal */
	border-radius: 5px;
	overflow: hidden; /* Para mantener los bordes redondeados */
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	background: #fff !important;
}
object.meskehpdf {
	width: 100%;
	/* height: 100vh; /* Ocupar toda la altura disponible */
	min-height: 1200px;
	border-radius: 5px;
	background: #fff !important;
}

/* Fin estilos PDF */


.especialidad {
	padding: 10px;
	margin: 5px;
	border-radius: 5px;
	cursor: pointer;
	width: 250px;
	color: white;
	background: var(--colorAC);
	font-family: var(--tipoLetra1);
    font-size: 16px;	
	text-decoration: none;
	text-align: left;
}

.subespecialidades {
	display: none;
	padding-left: 0px;  
	margin-left: 100px;	
}


/* Alineaciones */

.alinea_centro {
	position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: fit-content; /* Para que el contenido no ocupe todo el ancho */
}

.alinea_centroESP {
	position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: fit-content; /* Para que el contenido no ocupe todo el ancho */
	left: -280px;
}

.alinea_derecha {
    display: block;
    margin-left: auto;
    margin-right: 0;
    width: fit-content;
}

.alinea_izquierda {
    display: block;
    margin-left: 0;
    margin-right: auto;
    width: fit-content;
}