html,body{
margin:0;
background-image:url(../../../images/fluffy-grey.jpg);
font-family:"DejaVu Sans",sans-serif;
font-size:medium;
font-weight:400;
color:#000;
}
h1,h2,h3{
color:teal;
margin:0;
text-align:center;
font-weight:400;
padding:0;
}
h1{
font-size:1.7rem;
}
h2{
font-size:1.4rem;
}
h3{
font-size:1.2rem;
}
h4{
text-align:center;
font-weight:400;
font-size:105%;
background:#ccf;
margin-bottom:-10px;
}
th{
text-align:center;
}
a{
color:#3963ff;
text-decoration:none;
}
:root {--applied-columns:6;--progress-columns:6;}
a:hover{text-decoration:underline;}
/*ul.language{display:none;} lo comento porque parece que no es necesario. Revisar, creo que no hace nada porque esta inline*/
.bold{font-weight:bold;}
.new{color:red;font-weight:700;}
.left{text-align:left;}
.right{text-align:right;}
.just{text-align:justify;}
li.none{list-style-type:none;}
a.none{text-decoration:none;}
a.prices{text-decoration:none;color:#000;}
.photo{
	text-align:center;
}
.photo #home{
	width:75%;
}
.photo #world, .photo #truck{
	width:50%;
}
p.enlaces{
	text-align:center;
	word-spacing:1em;
	letter-spacing:0.2em;
	font-weight:bold;	
}
p.pc{display:block;}
.mobile{
	display:none;
}
form.paypal{margin:1% 0 2% 10%;}
form.paypal img{border:0;}
input.don_down{
	margin:8px 0;
	color:teal;
	font-size:1.4rem;
	background-color:#e0dfde;
}
header{
	display: flex;
	align-items:center;
	margin-bottom: 1%;
}
header img{
	max-width: 100%;
}
#hd_left{
	width: 14%;
	text-align:center;
	font-size:1.5vw;
}
#hd_left img{
	width: 65%;
}
#hd_center{
	width: 70%;
	position:relative;
}
#hd_center img{
	max-width: 100%;
}
#hd_center p{
	background-color:#fff;
	padding: 5px;
	border: 3px solid black;
	border-radius: 10px;
	position: absolute;
	left: 8px;
	top: -5px;
}
#hd_center .rtl{
	background-color:#fff;
	padding: 5px;
	border: 3px solid black;
	border-radius: 10px;
	position: absolute;
	left: auto;
	right: 8px;
	top: -5px;
}
#hd_right{
	width: 16%;
	padding-left: 1%;
}
#hd_right img{
	width: 90%;
}
div.menu_btn{
	display:none;
}
#left-nav{
padding:0 .75%;
width:15%;
float:left;
font-size:95%;
}
/*24/08/25: id='lang' solo estaba en install_mapsource y EX-208. Lo sustituyo por el langcombo y comento las secciones siguiente. Borrarlas pasado un tiempo.*/
/*#left-nav #lang{
background-color:teal;
padding:.4em;
text-align:center;
margin: 0 auto 10px;
width:145px;
}
#left-nav #lang a{
background-image:url(../../images/fondo_gris.gif);
font-size:12pt;
font-weight:700;
padding:1px;
}*/
#langcombo{
background-color:teal;
padding:.4em;
text-align:center;
margin: 0 auto 10px;
width:100%;
}
#langcombo img{
margin:0 0 5px;
max-width:100%;
}
#langcombo label{
background-image:url(../../images/fondo_gris.gif);
font-size:12pt;
font-weight:700;
color:navy;
padding:2px;
}
#menu {width: 100%;
}
#menu .titulomenu, #links .titulolinks{
border-width:1px;
border-style:solid;
border-color:#000;
font-size:14pt;
font-weight:700;
background-color:#999;
color:#fff;
padding:4px;
width:100%;
}
#menu .entradasmenu{
margin-bottom:-25px;
}
#left-nav #menu ul li a:hover{
color:#ff0505;
text-decoration:underline;
}
#menu ul {
list-style-type: none;
padding:0 0 50px;
margin:0;
}
/*#menu ul li.nivel1{
width:106%;
}*/
#menu ul li a{
display:block;
font-size:12pt;
font-weight:700;
text-decoration:none;
color:teal;
background-image:url(../../images/fondo_gris.gif);
border:solid 1px #d7d7d7;
padding:1px 0 2px 2px;
margin:2px 0;
position:relative; /* Las coordenadas de los ul inferiores serán relativas al <li> que los contiene */
}
#menu ul li:hover{
/*Hace que se despliegue el nivel 2*/
position:relative;
/*color:#000; 24/08/25: no parece tener efecto*/
}
/*#menu ul li a:hover{
24/08/25: no parece tener efecto, porque la regla #left-nav #menu ul li a:hover anterior es más específica
color:#525252;
position:relative;
}*/
#menu ul li:hover a.nivel1{
/* Afecta al aspecto del nivel 1 cuando se pasa el ratón sobre el nivel 2*/
color:#525252;
position:relative;
}
#menu ul li ul{
display:none;
}
#menu ul li a:hover ul, #menu ul li:hover ul{
display:block;position:absolute;left:100%;top:-1px!important;top:-31px;
}
#menu ul li ul li a{
width:160px;
color:teal;
}
#menu ul li ul li a:hover{
position:relative;
color:#fff;
}
.toggle-nivel2 {
display: none;
}
#links p{
background:transparent;
font-weight:400;
color:#000;
border-style:solid;
border-width:medium;
border-color:#ccf;
}
main{
padding:0 1%;
float:left;
width:81%;
font-size:100%;
text-align:justify;
}
#main{
padding:0 1%;
float:left;
width:81%;
font-size:100%;
text-align:justify;
}
#regbox #regbox_rtl{
padding:0;
}
#regbox label{
width:250px;
float:left;
text-align:right;
padding-right:5px;
}
#regbox_rtl label{
width:250px;
float:right;
text-align:left;
padding-left:5px;
}
#dw_mobile{
	display: none;
}
table.downloads, table.moremaps{
	table-layout:fixed;
	max-width:100%;
	margin-top:20px;
	border:1px;
	border-style:outset;
	border-collapse:separate;
	border-spacing:3px;
}
table.downloads tr.thead_down th:nth-child(1) {width: 12%;}
table.downloads tr.thead_down th:nth-child(2) {width: 21%;}
table.downloads tr.thead_down th:nth-child(3) {width: 15%;}
table.downloads tr.thead_down th:nth-child(4) {width: 21%;}
table.downloads tr.thead_down th:nth-child(5) {width: 21%;}
table.downloads tr.thead_down th:nth-child(6) {width: 10%;}
table.downloads tr.thead_truck th:nth-child(1) {width: 15%;}
table.downloads tr.thead_truck th:nth-child(2) {width: 18%;}
table.downloads tr.thead_truck th:nth-child(3) {width: 32%;}
table.downloads tr.thead_truck th:nth-child(4) {width: 24%;}
table.downloads tr.thead_truck th:nth-child(5) {width: 11%;}
table.downloads tr.thead-mf th:nth-child(1) {width: 20%;}
table.downloads tr.thead-mf th:nth-child(2) {width: 30%;}
table.downloads tr.thead-mf th:nth-child(3) {width: 23%;}
table.downloads tr.thead-mf th:nth-child(4) {width: 27%;}
table.moremaps thead.applied th:nth-child(1) {width: 20%;}
table.moremaps thead.applied th:nth-child(2) {width: 13%;}
table.moremaps thead.applied th:nth-child(3) {width: 20%;}
table.moremaps thead.applied th:nth-child(4) {width: 13%;}
table.moremaps thead.applied th:nth-child(5) {width: 20%;}
table.moremaps thead.applied th:nth-child(6) {width: 13%;}
table.moremaps thead.progress th:nth-child(1) {width: 27%;}
table.moremaps thead.progress th:nth-child(2) {width: 10%;}
table.moremaps thead.progress th:nth-child(3) {width: 13%;}
table.moremaps thead.progress th:nth-child(4) {width: 27%;}
table.moremaps thead.progress th:nth-child(5) {width: 10%;}
table.moremaps thead.progress th:nth-child(6) {width: 13%;}
table.downloads th.continent{
background-image:url(../../images/fondo_gris.gif);
background-color:#fff;
font-size:medium;
letter-spacing:.3em;
text-align:center;
border:1px;
border-style:inset;
padding:4px;
}
table.downloads th.header, table.moremaps th.header{
text-align:center;
vertical-align:middle;
border:1px;
border-style:inset;
padding:4px;
}
table.downloads td, table.moremaps td{
border:1px;
border-style:inset;
text-align:center;
vertical-align:middle;
padding:4px;
}
table.downloads td.continent{
background-color:teal;
}
table.downloads td.left{
text-align:left;
}
table.downloads td.right{
text-align:right;
}
table.downloads td.left img{
vertical-align: bottom;
text-align:left;
}
table.downloads p.extra{
font-weight:700;
text-align:center;
}
#notes{
font-size:small;
}
#foot{
width:100%;
text-align:center;
clear:left;
color:teal;
}
#foot p{
padding:0;
}
.boton-oculto {
    display: none !important;
}

.boton-contourlines {
    background-color: #4CAF50 !important;
    color: white !important;
    font-weight: bold !important;
}
@media screen and (max-width:800px){
	:root {--applied-columns:2;--progress-columns:3;}
	#hd_left{display:none;}
	#hd_center{width:100%;}
	#hd_center p{font-size: 0.8rem;}
	#hd_right{display: none;}
	div.menu_btn {
		padding:2% 4%;
		display: block;
		width:15%;
		background: none;
		position: absolute;
		bottom: 5px;
	}
	div.menu_btn img{
		width: 30px;
	}
	#left-nav{
		width:100%;
	}
	#langcombo{
		display: none;
	}
	#menu {
		width: 55%;
		height: 100%;
		left: -100%;
		position: absolute;
		background:teal;
	}
	#menu .titulomenu{
		display: none;
	}
	#menu .entradasmenu{
		margin-bottom:-40px;
	}
	#menu ul li {
	border-bottom: 1px solid rgba(255,255,255, .3);
	display: flex; /*Permite que la flecha se vea en la misma línea, con block queda debajo*/
	position: relative;
	overflow: visible;
    /*align-items: center;  Centrado vertical (No parece necesario) */
    /*justify-content: space-between;  Espacio entre texto y toggle (No parece necesario) */
/*     min-height: 40px; */
	}
	#menu ul li a{
	padding: 15px;
	margin: 0;
	}
	#menu ul li a.nivel1 {
    order: 1; /* Enlace primero */
    flex-grow: 1; /* Ocupa todo el espacio disponible */
    padding-right: 10px; /* Reducir padding ya que el toggle no está superpuesto */
  }
	#menu ul li a:hover ul, #menu ul li:hover ul{
		display:none;
	}
	#menu ul.nivel2 {
    display: none;
	position:absolute;
	left:100%;
	top:0;
	z-index:1000;
/*     padding-left: 20px; */
	padding:10px 0;
	margin:0;
	border-left: 1px solid rgba(255,255,255,0.3);
/* 	box-shadow: 0 2px 5px rgba(0,0,0,0.2); */
  }
  
  #menu ul.nivel2.visible {
    display: block;
  }
	.toggle-nivel2 {
	cursor: pointer;
    display: flex;
    position: static;
    margin-left: auto; /* Empuja el toggle a la derecha */
    order: 2; /* Lo coloca después del enlace */
    flex-shrink: 0; /* Evita que se reduzca */
	color:teal;
	background-image:url(../../images/fondo_gris.gif);
	padding:15px;
	-webkit-tap-highlight-color: transparent; /* Elimina el highlight azul en iOS */
	touch-action: manipulation; /* Mejora la respuesta táctil */
    }
	#left-nav aside{
		display: none;
	}
	main{width:96%;padding-left:2%;}
	.photo #home, .photo #truck{
		width:90%;
	}
	.photo #world{
		width:80%;
	}
	p.enlaces,p.pc{
		display:none;	
	}
	.mobile{
		display:block;
	}
	#dw_mobile{
		display: block;
		text-align:center;
	}
	#dw_mobile select {
		width: 80%;
		max-width:280px;
		font-size: 1rem;
		padding: 5px 0;
	}
	table.downloads{
	display: none;
	}
	#regbox label{
	width:150px;
	}
    a.prices{text-decoration:none;color:#000;}
}