body {
	   font-family:Verdana;
      }
	header{
		background:#2E4053;
	}
	#cuerpo{
		width:90% !important;
		margin:0 auto !important;
	 }
	article{
		font-size:1.5em;
	}
   .hamburguer {
      display: none;
   }
   .icono{
	   width:1%;
	   height:auto;
   }
   .menu {
      font-size: 0.70em;
      text-align: center;
		border-bottom: solid 0.25rem grey;
      }
   .menu * {
      font: normal 1.5rem/1 Verdana; color: white;
      }
   .menu > li{
      display: inline-block;
      position: relative;
      }
   .menu > li + li {
      border-left: solid 1px white;
      }
   .menu li a {
      display: inline-block;
      padding: 0.625rem 1.25rem;
      text-decoration: none;
      }
   .menu ul {
      display: block;
      position:absolute;
      left: 0;
      top:100%;
      border-top: solid 0.25rem #F96;
      background: #fed;
      }
   .menu li:hover {
      background: grey;
	  color:white !important;
	  
      }
   .menu ul:before {
      content: "▲";
      position: absolute;
      top: -0.875rem;
      left: 1.25rem;
	  font-size: 1rem;
      color: #F96;
      }
   .menu ul li {
      display: block;
      max-height: 3.125rem;
	  opacity: 1;
	  -webkit-transition: max-height 0.5s, opacity 0.5s; /* Safari */
      transition: max-height 0.5s, opacity 0.5s;
      white-space: nowrap;
      }
   .menu .closed li {
      overflow: hidden;
      max-height: 0;
	  opacity: 0;
	  -webkit-transition: max-height 0.5s, opacity 0.5s; /* Safari */
      transition: max-height 0.5s, opacity 0.5s;
      }
	#logo_empresa{
		width:40%;
		float:left;
	}
	
	#km_muestra{
		font-size:1.5em;
		width:40%;
		float:left;
	}
	#acceso_profesional{
		width:20%;
		float:left;
	}
	#informacion_general{
		width:100%;
		margin:2% 0;
	}
	#introduccion{
		width:30%;
		float:left;

	}
	p{
		text-align:justify;
		text-indent: 1.5em;

	}
	#tabla_habituales{
		width:40%;
		float:left;
	}
	#cotizador{
		width:20%;
		float:left;
		text-align:center;
	}
	#searchInput,#searchInput2{
		width:100%;
	}
	#info_viaje,#obs_viaje,#contacto{
		width:80%;
		margin:0 auto;
	}
	#info_origen{
		width:80%;
		margin:2% auto;
	}
	#obs_viaje{
		margin-top:2%;
	}
	fieldset{
		border:0.1em solid #2E4053 !important;
		border-radius:2%;
	}
	legend{
		text-align:center;
		color:#2E4053;
		font-weight:bolder;
		padding:0 5%;
		border:0 !important;
		width:20%;
	}
	#formulario_contacto input,textarea,.formato_bloqueado,#obs_viaje input,textarea{
		outline:none;
		background:#E8F8F5;
		border:0;
		border-bottom:0.1% solid #2E4053 !important;
		padding:5%;
	}
	.entrada_datos{
		outline:none;
		background:#fff;
		border:0;
		border-bottom:0.1% solid #2E4053 !important;
		padding:5%;
		width:90% !important;
	}
	.entrada_viaje{
		outline:none;
		background:#E8F8F5;
		border:0;
		border-bottom:0.1% solid #2E4053 !important;
		padding:1%;
		width:90% !important;
	}
	.letra_pequena{
		font-size:0.6em;
	}
	#formulario_contacto input:disabled,textarea:disabled,.formato_bloqueado:disabled,#obs_viaje input:disabled,textarea:disabled{
		background:#B0CACD;
	}
	#formulario_contacto input[type="text"],textarea,.formato_bloqueado,#obs_viaje input[type="text"],textarea{
			width:250%;
	}
	input[type="text"]:focus,textarea:focus{
		background:#D1F3F6;
	}
	#formulario_contacto textarea,#obs_viaje textarea{
		overflow: scroll;
		resize: none;
	}
	#formulario_contacto table,#obs_viaje table,#datos_origen table{
		margin-left:5%;
	}
	#tiempo_viaje,#kilometros_viaje,#precio_viaje{
		width:30%;
		text-align:center;
		float:left;
		font-size:1.20em;
	}
	#obs_viaje_origen,#obs_viaje_destino{
		width:50%;
		float:left;
		margin:o auto;
	}
	#introduccion,#tabla_habituales,#cotizador,#excursiones,#datos_contacto,#login{
		background-color:#E8F8F5;
		padding:1%;
		border-radius: 1em;
		border:0.1em solid grey;
		margin-left:1%;
	}
	#login{
		background-image:url("../img/gvtransfer.png");
		background-repeat: no-repeat;
		background-position: center;
		background-size: 18%;
	}
	#tabla_tarificador table{
		width:50%;
	}
	#tabla_tarificador th{
		width:10% !important;
	}
	#tabla_tarificador input{
		width:90% !important;
	}
	#contacto{
		margin-top:2%;
	}
	#datos_contacto,.mapa_origen{
		width:30%;
		margin:0 auto;
		float:left;
		margin-right:6%;
	}
	#formulario_contacto,#datos_origen{
		width:60%;
		margin:0 auto;
		float:left;
	}
	#tiempo_viaje,#kilometros_viaje,#precio_viaje{
		background:#E8F8F5;
		padding:0.5%;
		border-radius: 1em;
		border:0.1em solid grey;
		margin-left:1.5%;
	}
	
	h3{
		text-align:center;
		color:#2E4053;
	}
	footer{
		background:#2E4053;
		width:100%;
		color:white;
		margin-top:2%;
	}
	.mapa_cotizador{
		text-align:center;
		margin:2% 0;
	}
	.centrado{
		text-align:center;
	}
	table th {
		background:lightgrey;
	}
	/* AGENDA */
	.negativo{
		color:red;
	}
	.servicio{
		background:#7B7BF7;
	}
	.traslado{
		background:#FF5454;
	}
	.libre{
		background:#9BFF7F;
	}
	.barra_ocupacion{
		width:100%;
	}
	.tramo_ocupacion{
		float:left;
		width:0.69%;
	}
	.tramo_horas{
		width:4.14%;
		text-align:left;
		float:left;

	}
	.datos_viaje{
		display: none;
		position: fixed;
		top:10%;
		width:30%;
		height:auto;
		background:white;
		border:1px solid black;
		padding:1%;
		border-radius:2%;
	}
	#tabla_agenda{
		width:100%;
	}
	#tabla_agenda table{
		width:100%;
	}
	/* FACTURACION */
	#tabla_facturacion{
		width:80%;
		margin:0 auto;
		float:left;
	}
	#tabla_facturacion table{
		width:100%;
	}
	#tabla_facturacion	td{
		padding-left:10px;
		padding-top:10px;
		vertical-align: top;
	}
	#anadir_facturacion{
		width:35%;
		float:left;
		text-align:right;
		margin-left:2%;
		
	}
	#anadir_facturacion fieldset{
		border:1px solid black !important;
	}
	#anadir_facturacion legend{
		width:50%;
		font-weight:bolder;
	}
	/* CLIENTES */
	#tabla_clientes{
		width:100%;
	}
	#tabla_clientes table{
		width:80%;
	}

@media only screen and (max-device-height: 1280px){
   body:after {
      display: block;
      position: absolute;
      top: calc(100vh/2 - 0.313rem);
      left: calc(100vw/2 - 3.125rem);
      z-index: -1;
      width: 6.25rem;
      background: #fff;
      padding: 0.313rem;
      font: normal 1rem/1 "Myriad", Arial, Helvetica, sans-serif; color: white;
      text-align: center;
   }
   
}
@media only screen and (max-width: 1280px) and (min-aspect-ratio: 16/10), only screen and (max-width: 1024px) and (aspect-ratio: 4/3), only screen and (orientation: portrait), only screen and (max-width: 768px)and (orientation: landscape){
   html, body {
      height: 100%;
   }
   header {
      width: 10rem;
      height: 100%;
      }
   .menu {
      height: 100%;
      text-align: left;
      border: 0;
      }
  	.menu * {
	  font: normal 1.25rem/1 Verdana; color: white;
	  }
   .menu ul, .menu li, .menu li a {
      width: 100%;
      }
   .menu > li:not(.closed) {
      border-left: 0;
      border-bottom: solid 1px white; 
   }
   .menu > li + li {
      border-left: 0;
      }
   .menu ul {
      position: relative;
      }
   .hidden {
      display: none;
      }
	#obs_viaje{
		width:100%;
	}
	#obs_viaje_origen,#obs_viaje_destino{
		padding:0;
	 }
	#obs_viaje input[type="text"] ,#obs_viaje textarea{
		width:100%;
	 }
}

@media only screen and (max-width: 768px){
	body{
		font-size:0.7em;
	}
	header {
	   width: initial;
	   height:initial;
	   }
	.hamburguer {
	   display: inline-block;
	   width: 3.125rem;
	   height: 3.125rem;
	   background: url(../hamburguer.png) no-repeat center center;
	   border: 0;
	   outline: 0;
		cursor: pointer;
	   }
	.menu * {
	  font: normal 1.5rem/1 Verdana; color: white;
	  }
	#obs_viaje_origen,#obs_viaje_destino{
		width:100%;
		padding:0;
	 }
	 #obs_viaje input[type="text"] ,#obs_viaje textarea{
		width:150%;
	 }
	#info_viaje,#obs_viaje{
		width:100%;
	}
}