html, body {
    min-height: 100%;
}

body{
  background-image: url("logo.png") ;
  background-repeat: no-repeat;
  background-size: contain; /*ajusta la imagen de fondo*/
}

h1{
  font-size: 10hw;
  text-align: center;
  margin-bottom: -2%; 
}
h3{
  text-align:center;
}
form{
  margin:0 auto;
  width: 100%;
  text-align: center;
}
span.normal{
  font-size: 5hmin;
}
table.calendario{
	display:inline;
	font-size: 1em;
	margin:10px;
}
td.tabla_servicios{
	border: 1px solid black;
}
td.Resaltado{
	background:#FE2EC8;
}
td.Normal{
	background:#FFFFFF;
}
th.calendario{
}

p{
  font-size: 5hmin;
}
p.normal{
  display:inline;
}
.chico{
  font-size: 3hmin;
}
.centrado{
	text-align: center;
}
.titulo{
	text-align: center;
	font-size: 10hmin;
	text-decoration:underline;
}
.amarillo{
	background-color:Khaki;
}
.azul{
	background-color:LightBlue;
}
.verde{
	background-color:Springgreen;
}
textarea {
    width: 100%;
}
#cagando{
  float:right;
  width: 10%;
}

input{
    font-size: 3hw;
}

input.observaciones{
		width: 100%;
		height: 5em;
	}
input.observaciones_brigadas{
		width: 100%;
		height: 5em;
	}
input.chico{
		width: 2em;
	}
/*Esto es para que lo que ponga este al 30% del lado izquiero de la pantalla,
vamos, lo que es en el ladillo */

div.centrado_vertical{
    position: relative;
    top:10%;
}
div.mapa{
	width: 100%;
	height: 100vh;
	position:absolute;
}
div.mapa2{
	width: 100%;
	height: 80vh;
}

select.seleccionaco{
	width:15em;
    font-size: 5hmin;
    display:block;
    margin-left: auto;
    margin-right: auto;
}

select.seleccionaco_largo{
    font-size: 1em;
    display:block;
    margin-left: auto;
    margin-right: auto;
}
select[disabled] {
    color: red;
}
select.seleccionaco_confoto{
	width:60vmin;
    font-size: 5vmin;
    margin-left: auto;
    margin-right: auto;
}
.finalizado td{
	background-color:rgb(101, 237, 101) !important;
}
.validado td{
	background-color:rgb(106, 238, 231) !important;
}
.perdonado td{
	background-color:rgb(14, 206, 24) !important;
}
.footable{
   border-collapse: collapse !important;
  border-radius: 30px!important;
  /* -moz-border-radius:30px!important;
  -webkit-border-radius:30px!important;
  */
}
.footable th{
   color:#1c94c4!important;
}
.footable td{
   border:1px solid!important;
}
.ui-dialog { z-index: 1000 !important ;}
.ui-autocomplete { 
	z-index: 3001 !important ;
	position:relative !important;
	}
/*he hecho trampas, de alguna manera el media scren 
actualiza la pagina y entonces se me vuelven a poner los font-size que 
habia definido antes en los estilos,es como darle al  cada vez que cambiamos de tama
ño de ventana*/
.divicon{

/*se deja vacio a posta*/
text-align: center;
line-height:50px;
}



.boton_lateral{
     height:9vh;
     width:9vh;
	 background-size: 100%;
	 background-repeat: no-repeat;
	 background-color:rgb(255, 255, 255);
	 margin-right:1%;
	 margin-top:1%;
	 position:absolute;
	 z-index: 900;
    }
.boton_arriba{
     height:7vh;
     width:7vh;
	 background-size: 100%;
	 background-repeat: no-repeat;
	 background-color:rgb(255, 255, 255);
	 margin-right:1%;
	 margin-top:1%;
	 position:fixed;
	 z-index: 900;
    }
.botonsubir{
	display:none;
}

.botonaco{
    width:90vmin;
    font-size: 9vmin;
    display:block;
    margin-left: auto;
    margin-right: auto;
}
.cambiar{
	background-image:url(mover.png);
	background-size:contain;
	background-repeat:no-repeat;
	background-position: center; 
}
#botoneditar{
 background-image:url(edit.jpg);
 bottom:20vh;
}
#botonposicionar{
 background-image:url(brujula.jpg);
 bottom:0;
}
#botonbuscar{
 background-image:url(search.png);
 right:0;
 bottom:0;
}
#botonexportar{
 background-image:url(abajo.jpg);
 right:0vh;
 bottom:10vh;
}
#botonleyenda{
 background-image:url(pincel.jpg);
 right:0vh;
 bottom:20vh;
}
#botonlabel{
 background-image:url(label.jpg);
 right:0vh;
 bottom:30vh;
}
#botoncargar_capa{
 right:0vh;
 bottom:40vh;
}
#botoncargar{
 background-image:url(ojo.png);
 bottom:10vh;
}
#botonarriba{
 background-image:url(arriba.jpg);
 right:0;
 top:0vh;
}
#botonabajo{
 background-image:url(abajo.jpg);
 right:0;
 top:10vh;
}
#buscarreparaciones{
 background-image:url(search_repa.png);
 right:0;
 bottom:20vh;
}
#botonalmacen{
 background-image:url(almacen.png);
 bottom:10vh;
}

#botonparte{
 background-image:url(almacen.png);
 right:0;
 bottom:10vh;
}

#siguiente{
 background-image:url(SIGUIENTE.png);
 bottom:10vh;
}

#botonrecuperar{
 background-image:url(arreglar.png);
 display: none;
}
#botonmover{
 background-image:url(mover.png);
 display: none;
}
#botonmover_vidrio{
 background-image:url(mover.png);
}
#botonañadir{
 background-image:url(add.png);
 display: none;
}
#botonborrar{
 background-image:url(delete.png);
 display:none;
}
#botoncargarpapeleras{
 background-image:url(ojo.png);
 display: none;
}
#botonstop{
 background-image:url(stop.png);
 display: none;
}

@media only screen and (max-width: 700px) {
   h1{
     font-size: 12vw;
   }
   h3{
     font-size: 8vw;
   }
   input{
       font-size: 6vw;
   }
   input.muylargo{
		width: 100%;
	}
	
   p.normal{
     display:block;
     margin:4px;
   }
   #fototio{
     width: 23%;
   }
   
   
   #cagando{
    width: 20%;
   }
   .botoncillo{
     height:8vw;
     width:6vw;
    }
   .botoncillotexto{
     height:8vw;
     width:6vw;
    }
    button.botoncillofecha{
     height:8vw;
     width:6vw;
    }
	
}

@media print{
.footable{
   border-collapse: collapse !important;
  border-radius: 30px!important;
  page-break-before:always!important;
}
}