/* Menú principal de escritorio (tmpl/menu.php y tmpl/menuinterno.php).
   El CSS de cada página (campo css_adicional) se imprime después y usa !important, por eso se fuerza aquí.
   Objetivo: que logo + menú quepan completos desde 1200px (antes "CONTACTO" quedaba cortado). */

@media (min-width: 1200px) {
	.x-masthead .x-bar-container {
		padding-left: 24px !important;
		padding-right: 24px !important;
	}

	.x-masthead .x-bar-container > a.x-image {
		flex: 0 0 170px !important;
		width: 170px !important;
		max-width: 170px !important;
	}

	.x-masthead .x-menu-first-level {
		flex: 0 1 auto !important;
		width: auto !important;
		min-width: 0;
	}

	.x-masthead .x-menu-first-level > li > .x-anchor > .x-anchor-content {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
}

@media (min-width: 1200px) and (max-width: 1439.98px) {
	.x-masthead .x-menu-first-level > li > .x-anchor > .x-anchor-content {
		padding-left: 7px !important;
		padding-right: 7px !important;
	}

	.x-masthead .x-menu-first-level > li > .x-anchor .x-anchor-text-primary {
		font-size: 13px !important;
	}
}

/* Portada (barra superior sobre la foto): el desplegable era negro al 40% y la foto no dejaba leer */
.x-masthead .x-bar.e368-1 .x-dropdown {
	background-color: rgba(18, 20, 24, 0.94) !important;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}