/*GENERALES -------------------------*/
html	{ border: none; }
body	{ font-family: Arial, Helvetica, sans-serif; font-size:16px; width: 960px; margin:5px auto; border:1px solid black;  }
div		{ padding: .5em;}
p		{ padding:5px; margin:5px; }
h3,h5,h4{ margin:0.4em;}
ul		{ margin:0px;}
li		{ list-style:inside; list-style-image:none; list-style-type: decimal;}
a		{ text-decoration: none; color: white;}
img     { border: none;}

.diacompleto    { background: url(imagenes/fondodiacompleto.jpg) top left no-repeat; height: 200px;}
.diacompleto h3 { padding-left: 70px;}
.resaltado-rojo	{ font-weight:bold; color: #a90230} 
.negro			{ font-weight:bold;}
.requerido		{ color: #F00; }
.label          { width:200px; text-align:center;}
.error	        { color: #856404;
background-color: #fff3cd;
border-color: #ffeeba;}
.color-negro    { color: black;}
.info           { border: 1px dashed blue; width: 90%; margin:1em auto; padding: .2em;}
.info2          { border: 1px dashed blue; width: 90%; margin:3px auto; padding: 30px;}
.info .infoimage{ width: 10%; }
.info-turno     { float: right;}
.infoa-turno a  { padding-top:  20px;}
.alert          { background: #FFEFEF none repeat scroll 0 0;  border: 1px dashed red;  width: 90%; margin:1em auto; padding: .2em;}
.info a         { color: black; font-weight:bold; }
.mensaje        { vertical-align:middle; text-align:justify;}
.centrado       { text-align:center; }
.usuonline      { background-color: white; color: black; padding-left: 10px; padding-right: 5px;}


p#vtip {
    background-color: white;
    border: 1px solid #a6c9e2;
    display: none;
    font-family: tahoma;
    font-size: 12px;
    left: 5px;
    padding: 10px;
    position: absolute;
    text-align: justify;
    z-index: 9999;
}
p#vtip #vtipArrow {
    left: 5px;
    position: absolute;
    top: -10px;
}


span.diadisponible  { background: #95EF68 none repeat scroll 0 0; color: blue;}


span.citaslibres{ background: white; color: green; font-weight: bold;}

.link-plazos    { color: #6FA7D1; }
.link-plazos:hover{ color: red;}


.nohaycitas{text-align: center; margin-top: 20px;}

/*ESTRUCTURA -------------------------*/
#cabecera{ margin: auto; height:200px; background:#FFFFFF url(imagenes/banner.jpg) left bottom no-repeat; text-align:right;}
#fecha-actual	{ color: white; font-style:oblique; font-family:Geneva, Arial, Helvetica, sans-serif; font-variant:small-caps; font-weight:bold; float:right; }
#cabecera #tiempo-rest	{ color: #88B2DE; font-weight:bold;}

#menu-principal{  background-color:   #A90230; color: black; height:38px; text-align:left; padding:0px; margin:0px; }
#menu-principal a	{color:#FFFFFF; display:block; float:left; padding:4px 10px; text-align:center; text-decoration:none; font-variant:small-caps; }
#menu-principal ul li {float: left; height:38px; list-style: none; border-left: 1px dotted white; border-right: 1px dotted white;  }
#menu-principal ul li:hover{background: url("imagenes/menuprincipal/mainnav-on-small-bg.jpg") bottom center no-repeat; }
#menu-principal ul li:hover a{ color: white;}

.menuplazos     { height:35px; padding:5px 0 0 0px; list-style:none;  background: url(imagenes/menus/pro_seventeen_0c.gif) repeat-x left bottom; font-size: 11px; border-bottom: 2px double #FFC83C;}
.menuplazos li  { float:left; height:35px; list-style-type: none; border-bottom: 2px double #FFC83C;}
.menuplazos li a{ float:left; height:35px; display:block; line-height:33px; color:#333; font-family:arial, verdana, sans-serif; font-weight:bold;
                  text-align:center; padding-left: 2px; cursor:pointer; background:url(imagenes/menus/pro_seventeen_0a.gif) no-repeat; margin-left: 4px;}
.menuplazos li a span       {float:left; display:block; padding:0 8px 5px 8px; background:url(imagenes/menus/pro_seventeen_0b.gif) no-repeat right top;}
.menuplazos li a:hover      {background: url(imagenes/menus/pro_seventeen_1a.gif) no-repeat;}
.menuplazos li a:hover span {color: red; background: url(imagenes/menus/pro_seventeen_1b2.gif) no-repeat right top;}

.menuplazos li.current a            {background:url(imagenes/menus/pro_seventeen_2a.gif) no-repeat;}
.menuplazos li.current a span       {background:url(imagenes/menus/pro_seventeen_2b2.gif) no-repeat right top;}
.menuplazos li.current a:hover      {background:url(imagenes/menus/pro_seventeen_2a.gif) no-repeat; }
.menuplazos li.current a:hover span {background:url(imagenes/menus/pro_seventeen_2b.gif) no-repeat right top;}

#plazos-secretaria  {text-align: left;}

#barra-navegacion{ background:#ccc; color:black; text-align:left; padding: 0px 10px 4px 10px; }
#barra-navegacion a{ color: black;}
#contenido { _background: #E8F1FA; height: auto; _width:1184px; _width: 1018px; width: 944px; padding-top:0px; min-height: 596px;}
#resultado .firma{border: none; text-align: center}
.firma	{text-align: center; height:100px; margin: auto;}

#pie{ color: white; height: 70px; text-align:center; border-top: 1px solid black; background:#A90230; padding: 1px;}
#pie table{ width:50%; margin: auto;}
#pie .logo{ width:55%;}

#portada {_border: 1px solid red; text-align:center }
#portada table{ _border: 1px solid black; margin: auto;}
#portada img.acceso{ width:400px;}
#portada img.acceso2{ width:800px;}

#acceso-ventanilla1 {background: #000000 url('imagenes/Ventanilla1.jpg') repeat left; vertical-align: top;  height: 100px; text-align: center;  }
#acceso-ventanilla2 {background: #000000 url('imagenes/Ventanilla1.jpg') repeat left; vertical-align: top; width:50%;}

#acceso-ventanilla1 h3,
#acceso-ventanilla2 h3,
#acceso-ventanilla1 p ,
#acceso-ventanilla2 p {background: none repeat scroll 0 0 #A90230;  color: white; padding: 7px; font-size: 16px; opacity:0.8; height: 100%; }
#acceso-ventanilla1 h3:hover,
#acceso-ventanilla2 h3:hover {background: none repeat scroll 0 0 #EDEDED;  color: #326698; padding: 7px; font-size: 16px;}

/*CONTENIDO IZQUIERDA ----------------*/
.caja-izq   { width: 78%; min-height:560px;  }
.caja-central { width: 100%;}
.telefono  { }

#listado{ height: 345px; overflow:scroll; overflow-y: auto; overflow-x: hidden; padding: 0px; _width:892px; border: 1px solid #ccc;}
#deslizador-citas {height: 200px; overflow-y: scroll; _width: 892px; width: 728px; padding: 0px; border: 1px solid #ccc;}
#info-estado{border: 1px solid #ccc; border-left: 2px solid #ccc; border-right: 2px solid #ccc; padding: 5px 0px; text-align: center; font-size: 12px; _width:  786px; width: 726px;}

.caption{ text-align: center; background: black; color: white; font-weight:bold; font-size:18px;
    margin-top: 8px; background: url(imagenes/fondoTituloTabla.jpg) repeat-x ;  padding:5px 0px; _width: 788px; width: 728px; border: 1px solid #ccc;}

.datos-form				{ width: 99%; margin:auto; font-size:14px; border: 1px solid #ccc; }
.datos-form caption,
.datos-form td.caption	{ background: black; color: white; font-weight:bold; font-size:18px; margin-top: 8px; background: url(imagenes/fondoTituloTabla.jpg) repeat-x ;  padding:5px 0px; }
.datos-form th			{ border-style:ridge;}
.datos-form th#num		{ _width:4%;}
.datos-form .impar td,
.datos-form .par td,
.datos-form .atendida td{  border-right: 1px solid black; }
.datos-form .atendida td{font-style: italic;}
.datos-form .impar 		{ background: url(imagenes/fondoImparTabla.jpg) repeat-x; height:30px; }
.datos-form .par		{ background: url(imagenes/fondoParTabla.jpg) repeat-x; height:30px;  }
.datos-form .atendida   { background: url(imagenes/fondoAtendidaTabla.jpg) repeat-x; height:30px;}
.datos-form th.disponibilidad		{ text-align: center; width: 15%;}
.datos-form td				{ text-align:center; padding: 0px 4px; }
.datos-form tr td + td		{ }
.datos-form tr td + td.input{ border-left:  none;}
.datos-form tr td + td.numero{ border-right: none;}
.datos-form tr td.botones	{ text-align: center;}
.datos-form td.izquierda	{ text-align:left;}
.datos-form td.derecha		{ text-align:right; width:180px}
.datos-form .nombre,
.datos-form .email			{ text-align: left;}
.datos-form .email a		{ color: blue;}
.datos-form img#fcita-estudiante	{ width:150px;}

.datos-form #dia {background: aqua; border: none; width: 60px;}


#listado-plazos{width: 823px;}
#listado-citas{width: 720px;}
#ocupacion{width: 710px;}
#ocupacion th{border: none;}

#listado-plazos td { height: 60px; border-left:  1px solid black; }
#listado-plazos td.infoplazo {text-align: left; padding-left: 10px;}


#datos-cita			{ text-align: center;}


#db-estado tr td { text-align: left; border: 1px solid #ccc;}
#db-estado tr td.desc{ width: 400px;}


#listado-citas{ font-size: 12px;}

/*CONTENIDO DERECHA ----------------*/
.caja-der					{ width:20%; height:auto; text-align:center;  float: right; _border: 1px dotted black;}
.calendario					{ height:40%; border:1px solid #A6C9E2; margin: 0px 10px 10px 10px; margin:auto; }
.calendario a				{ text-decoration:none;}
.calendario caption 		{ background:#DFEFFC url(imagenes/calendar/calCaptionBg.png) repeat-x scroll 50% 50%; height:25px; color:white; font-weight:bold; font-size:16px;}
.calendario tr td 			{ text-align:center; vertical-align:middle;}

.calendario .hdiasemana		{ background:#FCFDFD; border:none; height:5%; width:5%; font-size:16px; color: #444444;}
.calendario .diaNormal		{ background: #ccc; border:1px solid #C5DBEC; font-weight:bold; outline-color:-moz-use-text-color; outline-style:none; outline-width:medium;}
.calendario .diaActual		{ background:#FBEC88; border: 1px solid #FAD42E;}
.calendario .diaFestivo		{ background:#a90230; color: white;}
.calendario .diaActivo		{ background:#95EF68; color: #1D5987; border:1px solid #C5DBEC; font-weight:bold;}
.calendario .diaSeleccionado{ background:#FFF; border:1px dotted  #C5DBEC;}
.calendario .diaMesAnterior { background: #EFEFEF; border:none; }
.calendario .diaMesPosterior { background: #EFEFEF; border:none; }
.calendario .linkdiaFestivo	{ color: white;}
.calendario .linkdiaNormal	{ color:#2E6E9E; text-decoration:none; }
.calendario .linkdiaActual	{ color: black;}
.calendario .linkdiaActivo 	{ color: #1D5987;}
.calendario .linkdiaSeleccionado 	{ color: red;}

.calendario .primerosmes,
.calendario .ultimosmes		{ background:#FCFDFD; border:none;}

#leyendas{ width:189px;}
#leyendas td +td{ text-align:left;}

#formulario-login{ width:50%; margin: 100px auto; text-align: center;}
#formulario-login fieldset	{ border-color: #ccc; text-align: center; font-size: 24px; width: 80%; margin: auto;}
#formulario-login legend    { color: black;}
#formulario-login input		{ height:25px; }
#formulario-login #usuario	{ background:#EFEFEF url(imagenes/loginusuario.png)  left no-repeat; padding-left:30px; width: 200px; color: #A0A1A2; font-size: 18px;}
#formulario-login #password	{ background: #EFEFEF url(imagenes/loginpassword.png) left no-repeat; padding-left:30px; width: 200px; color: #A0A1A2; font-size: 18px;}
#formulario-login #usuario:focus,
#formulario-login #password:focus{ background-color:white;}
#tabla-login    {margin: auto}
#tabla-login			{ text-align: left;}
#tabla-login .botones	{ text-align: center;}

.mensaje-login-dentro{ text-align: right;}
.mensaje-login-fuera{ text-align: center; font-size: 20px;}


#enlace-volver{ color: black; background: transparent url(imagenes/volver.png) left no-repeat; padding-left: 30px; font-size: 24px; float: right}


.lista-aviso{ width: 100%;}
.lista-aviso li{ width: 800px;  }


    #deslizador-citas {

  overflow: scroll;
  position: relative;
}

#ocupacion {
  position: relative;
  border-collapse: collapse;
}

#ocupacion td, #ocupacion th {
  padding: 0.25em;
}

#ocupacion th {
  position: -webkit-sticky; /* for Safari */
  position: sticky;
  top: 0;
  background: #000;
  color: #000;
}

#ocupacion th:first-child {
  left: 0;
  z-index: 1;
}

#ocupacion th {
  position: -webkit-sticky; /* for Safari */
  position: sticky;
  left: 0;
  background: #FFF;
  border-right: 1px solid #CCC;
}