/* SKELETON */
/* Table of Contents
==================================================
	#Desktop (1600)
	#Desktop (1366)
	#Desktop (1024)
	#Tablet (Portrait)
	#Mobile (Portrait)
	#Mobile (Landscape)



/* #Additional - Large Screens beyond 1920px
================================================== */
@charset "utf-8";

@media only screen and (min-width: 1701px) and (max-width: 2100px) {

:root										{ --container-width: 1640px; }
.container                                  { max-width: 1640px; }


/*----------------- Inner Pages -----------------*/


}/* #Additional - Large Screens beyond 1600px
================================================== */
@media only screen and (min-width: 1451px) and (max-width: 1700px) {

:root										{ --container-width: 1340px; }
.container                                  { max-width: 1340px; }

#Caption span.subtitle						{ font-size: var(--font-size-title); line-height: var(--mobile-line-height-title); }/* ESTILOS DE LAYOUT SHIFT */


/* FIN ESTILOS DE LAYOUT SHIFT */


/*----------------- Inner Pages -----------------*/


}/* #Additional - Large Screens beyond 1366px
================================================== */
@media only screen and (min-width: 1181px) and (max-width: 1450px) {

:root										{ --container-width: 1240px; }
.container                                  { max-width: 1240px; }

#header .logo								{ margin: 20px 0; }
#header .languageMenu						{ padding: 0 10px; }
#header .reservarBtn						{ padding-left: 10px; }
#Caption span.subtitle						{ font-size: var(--font-size-title); line-height: var(--mobile-line-height-title); }
#Caption span.title							{ font-size: 67px; line-height: var(--desktop-line-height-title) }/* ESTILOS DE LAYOUT SHIFT */


/* FIN ESTILOS DE LAYOUT SHIFT */




/*----------------- Inner Pages -----------------*/


}/* #iPad Pro - Large Screens beyond 1024px
================================================== */
@media only screen and (min-width: 960px) and (max-width: 1180px) {

:root										{ --container-width: 960px; }
.container									{ max-width: 960px; }

#header .logo								{ margin: 20px 0; flex: unset; margin-left: 29px; }
#header .logo a								{ width: 90px; }
#header .languageMenu						{ padding: 0 10px; }
#header .reservarBtn						{ padding-left: 10px; }
#slider, #slider .home-slider, #slider .owl-stage-outer, #slider .owl-stage, #slider .owl-item { width: 100%; height: auto; }
#Caption span.subtitle						{ font-size: 35px; line-height: 45px; }
#Caption span.title							{ font-size: 54px; line-height: 64px; }/* ESTILOS DE LAYOUT SHIFT */

/* FIN ESTILOS DE LAYOUT SHIFT */
#header .hamburger nav {width: 400px;}

#header .hamburger #nav-btn:checked,
#header .hamburger #nav-btn:checked+label {
	top: 37px;
	left: 31%;
}

#header {
	background-color: rgb(var(--primary-color-rgb) / 80%);
}

#header ul.mainMenu {
	display: none;
}

}

/* Punto de corte de la máscara de reservas. Su pareja son #searchFormBtn
   (postload-skeleton.css) y .searchFormOpen.sticky (neobookings.css): los tres
   comparten umbral a propósito, para que nunca haya un ancho sin máscara Y sin botón.
   La máscara está diseñada a --booking-mask-width (1150px) y solo entra en una fila a
   partir de 1181px; por debajo se oculta y toma el relevo el botón del pop-up.
   Antes esto vivía dentro del tramo 960-1180, así que por debajo de 960 la máscara
   reaparecía apilada en el hero. */
@media only screen and (max-width: 1180px) {
	#searchForm								{ display: none; }
}

@media (max-width: 1024px) {
	#header .reservarBtn {
		display: none;
	}}/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */
@media only screen and (min-width: 768px) and (max-width: 959px) {

:root										{ --container-width: 100%; }
.container									{ max-width: 100%; padding: 0 15px; }

#header										{ background-color: rgb(var(--primary-color-rgb) / 80%); }
#header .logo								{ margin: 10px 0; z-index: 100; flex: none; }
#header .logo a								{ width: 98px; }
#header.stiky .logo							{ margin: 15px 0; }
#header .leftNav							{ width: 100%; order: 1; justify-content: space-between; flex-direction: row-reverse}
#header .hamburger							{ display: block; }
#header .hamburger nav						{ width: 100%; padding-top: 66px; }
#header .hamburger nav .menu_items			{ padding: 30px 15px; }
#header ul.mainMenu							{ display: none; }
#header .rightNav							{ display: none; }
#slider, #slider .home-slider, #slider .owl-stage-outer, #slider .owl-stage, #slider .owl-item { width: 100%; height: auto; }
#slider .desktop							{ display: none; }
#slider .tablet								{ display: block; }
#slider .home-slider.owl-theme .owl-nav		{ bottom: 81px; left: 10px; width: 150px; display: none; }
#slider .home-slider.owl-theme .owl-dots    { bottom: 94px; right: 15px;}
#Caption									{ width: calc(100% - 30px); }
#Caption span.title							{ font-size: var(--font-size-title); line-height: var(--mobile-line-height-title); }
#Caption span.title br						{ display: none; }
#Caption span.subtitle						{ font-size: var(--font-size-title); line-height: var(--mobile-line-height-title); }/* ESTILOS DE LAYOUT SHIFT */

/* FIN ESTILOS DE LAYOUT SHIFT */


/*----------------- Inner Pages -----------------*/


}/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {

:root										{ --container-width: 100%; }

#header										{ background-color: rgb(var(--primary-color-rgb) / 80%); }
#header .logo								{ margin: 13px 0; flex: none; }
#header .logo a								{ width: 70px; }
#header .logo-nav {top: 23px;}
#header.stiky .logo							{ margin: 13px 0; }
#header.stiky .logo a						{ width: 70px; }
#header .leftNav							{ width: 100%; margin-top: 0px; justify-content: space-between; flex-direction: row-reverse;  padding: 10px;}
#header .hamburger							{ display: block; }
body.no-scroll #header .hamburger 			{ margin-top: 22px; }
#header .hamburger nav						{ width: 100%; padding-top: 120px; }
#header .hamburger nav .menu_items			{ padding-left: 15px; }
#header .hamburger li.hotel-menu-mobile>ul { padding-left: 18px; }
#header ul.mainMenu							{ display: none; }
#header .rightNav							{ display: none; }
#slider .desktop							{ display: none; }
#slider .mobile								{ display: block; }
#slider .home-slider.owl-theme .owl-nav		{ display: none; }

#Caption									{ width: calc(100% - 30px); }
#Caption span.title							{ font-size: 30px; line-height: var(--mobile-line-height-title); }
#Caption span.title br						{ display: none; }
#Caption span.subtitle						{ font-size: 21px; line-height: 30px; }/* ESTILOS DE LAYOUT SHIFT */


/* FIN ESTILOS DE LAYOUT SHIFT */


/*----------------- Inner Pages -----------------*/


}/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {

:root										{ --container-width: 100%; }
.container									{ /*width: 540px;*/ max-width: 100%; padding: 0 15px; }

/*----------------- Inner Pages -----------------*/


}
/* FIN SKELETON */