/*
Theme Name: twentytwentytwo-child
Theme URI: http://loquesea.es
Version: 4.0
Description: Tema hijo de A theme
Author: Tu
Author URI: http://loquesea.es
Template: twentytwentytwo
*/

/*----------------- Cambios a partir de aqu -------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Rancho&family=Barlow+Semi+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Bitter:ital,wght@0,100..900;1,100..900&display=swap');


.rancho-regular {
  font-family: "Rancho", cursive;
  font-weight: 400;
  font-style: normal;
}


/*/////////////////////// Arreglos Wordpress ///////////////////////*/

.wp-block-group.is-layout-constrained.wp-block-group-is-layout-constrained {
	display:none;
}

.wp-site-blocks {
	padding:0 !important;
}

.wp-block-spacer {
	display:none;
}

* {
	margin:0;
	box-sizing:border-box;
}


img {
	width:100%;
}



#reservation-form-1 {
	display:none;
}

.is-layout-flow > * {
	margin:0 !important;
}

.otgs-development-site-front-end {
	display:none;
}


/*//////////////////////////////////////////////////////////////////////*/
/*/////////////////////// estilos generales ////////////////////////////*/
/*//////////////////////////////////////////////////////////////////////*/
.wrapper-full {
	width:100%;
	max-width:100% !important;
	overflow:hidden;
	margin-block-start: 0;
}

.wrapper {
	padding:0 6%;
}

h1, h2 {
	font-family: "Barlow", sans-serif !important;
	font-size: var(--wp--custom--typography--font-size--colossal);
}

p,
a,
input {
	font-family:'Bitter', serif;
}

body {
	/*background-color:#f9f5ec;*/
	background-color:#fffbf2 !important;

}


.button {
	display:flex;
	justify-content: center;
	margin: 30px 0px;
		input {
			text-decoration: none;
			font-size: 14px;
			letter-spacing: 1px;
			margin: 32px auto;
			width: 124px;
			height: 40px;
			line-height: 39px;
			display: block;
			text-align: center;
			border: 2px solid #6381A1;
			font-weight: 600;
			font-style: italic;
			color: #6381A1;
			box-shadow: 0 4px 8px #6381a182;
			transition:all 0.5s ease-in-out;
		}
		a {
			text-decoration: none;
			font-size: 14px;
			letter-spacing: 1px;
			margin: 32px auto;
			width: 148px;
			height: 48px;
			line-height: 44px;
			display: block;
			text-align: center;
			border: 2px solid #6381A1;
			color: #6381A1;
			box-shadow: 0 2px 4px #6381a169;
			transition: all 0.25s ease-in-out;
			font-family: 'Barlow';
			font-weight: 700;
		}
		
}

.titulo-header {
	.text-header_special {
		color: #5382a4;
		text-shadow: 1px 1px 1px black;
        font-family: 'Rancho';
        letter-spacing: 4px;
        font-size: 1.75rem;
		margin: 0 0 0 7.5px;
    }
}

.special_promociones {
		margin: 188px auto 0px auto !important;
}



 .button a:hover {
	letter-spacing: 1.5px;
	background-color:#6381A1;
	box-shadow: 0 4px 8px #6381a1d4;
	color: #fcf4f0;
}

.button-2 {
	text-decoration: none;
	font-size: 14px;
	letter-spacing: 1px;
	margin: 32px auto;
	width: 164px;
    height: 46px;
	line-height: 41px;
	display: block;
	text-align: center;
	border: 2px solid #6381A1;
	font-weight: 600;
	box-shadow: 0 2px 4px #6381a182;
	overflow: hidden;
	background-color: #6381A1;
	transition: background-color 0s ease-in-out; 
}

.button-2 a {
	text-decoration: none;
	display: block;
	color: white;
}

.button-2:hover {
    background-color: #f5eddc00;
}

.button-2 .reservation1,
.button-2 .reservation2 {
    transition: transform 0.5s ease-in-out, color 0.5s ease-in-out;
	font-family: "Barlow", sans-serif;
	text-transform:uppercase;
}

.button-2:hover .reservation1 {
    transform: translateY(-40px);
    color: #44423d;
}

.button-2:hover .reservation2 {
    transform: translateY(-40px);
    color: #5382a4;
}

/*solucion problemas de visualización en móvil*/

@media (max-width: 480px) {
	.wrapper-full {
    & .header {
        & .titulo-header {
            h1 {
                font-size: 44px;
                animation: opacity-text 2s ease-in-out;
                /* width: 20%; */
            }
        }
    }
}
	.wrapper-full.general.promociones {
    & .wrapper-full.header {
        & .titulo-header {
            h2 {
                font-weight: 500;
                color: #f2f2f2;
                text-transform: uppercase;
                line-height: 1;
                letter-spacing: 4px;
                font-family: "Barlow", sans-serif;
                text-shadow: 0 0 5px #000000a1;
                animation: opacity-text 2s ease-in-out;
                font-size: 36px;
            }
        }
    }
}
	.wrapper-full.hotel-2 {
    & .display-hotel {
        & .text {
            & .titulo {
                h2 {
                    font-size: 39px !important;
                }
            }
        }
    }
}
	.wrapper-full.general.apartahotel {
    & .wrapper-full.header {
        & .titulo-header {
            h2 {
                font-size: 35px;
            }
        }
    }
}
	.wrapper-full.general.rodeo {
    & .wrapper-full.header {
        & .titulo-header {
            h2 {
                font-size: 32px;
            }
        }
    }
}
	.wrapper-full.general.narejos {
    & .wrapper-full.header {
        & .titulo-header {
            h2 {
                font-size: 32px;
            }
        }
    }
}
	.wrapper-full.general.fuengirola {
    & .wrapper-full.header {
        & .titulo-header {
            h2 {
                
                font-size: 42px;
            }
        }
    }
}
	.wrapper-full.general.fuengirola {
    & .wrapper-full.header {
        & .titulo-header {
            h2 {
                font-size: 32px;
            }
        }
    }
}
	.wrapper-full.general.torreblanca {
    & .wrapper-full.header {
        & .titulo-header {
            h2 {
                font-size: 32px;
            }
        }
    }
}
	.wrapper-full.general.cendrillon {
    & .wrapper-full.header {
        & .titulo-header {
            h2 {
                font-size: 32px;
            }
        }
    }
}
}

@media (max-width: 350px) {
	.text-intro.wrapper {
    & h3 {
        a {
            color: #212529;
            text-decoration: none;
            font-size: 11px !important;
        }
    }
}
	
}




/*/////////////////////// Botón Volver ////////////////////////////*/


.menu-item .flecha {
	overflow: hidden;
	opacity: 0;
	transition: opacity 0.5s, transform 0.5s;
}


.menu-item .back2 {
	top: 17px;
    position: absolute;
    width: 23px;
    left: 20px;
	transition: transform 1s;
	transform-origin: 100% 50%;
	transform: translateY(48px);
}

.menu-item .back1 {
	position: relative;
    left: 4px;
}



.menu-item.back:hover .flecha {
    opacity: 1;

}

.menu-item.back:hover .back2 {
    transform: translateY(0px);
	transition-timing-function: ease;
	transition-duration: 0.3s;
}

/*///////////////////////////////////////////////////////////////////////*/
/*/////////////////////// estilos generales ////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////*/

.titulo-header {
		padding: 0 6%;
		position:relative;
		z-index:4;
		h1 {
		font-weight: 500;
		color: #f2f2f2;
		text-transform: uppercase;
		line-height:1;
		letter-spacing: 4px;
		font-family: "Barlow", sans-serif;
			    text-shadow: 0 0 5px #000000a1;
		span {
		margin: 0 0 0 6.5px;
		font-family: "Barlow", sans-serif;
		font-size: 21px;
		line-height: 3;
		font-weight:600;
		letter-spacing: 1px;
			    text-shadow: 0 0 5px #000000a1;
			}
		}
		top: -13%;
	}

.text-intro {
		max-width:1250px;
		margin:0 auto 40px;
		h2 {
		text-align: center;
		line-height: 1;
		letter-spacing: 8px;
		margin: 0px 0 8px;
		font-size: 54px;
	}
	
	h3 {
		color: #5382a4;
		text-align: center;
		margin: 0px 0 32px;
		font-family: 'Rancho';
		font-size: 1.75rem;
	}
	
	
	p {
		text-align:center;
	}	
}
@media (max-width: 550px){
	.text-intro {
		h2 {
			font-size: 34px;
		}
	.titulo-header {
		h1 {
			font-size: 32px;
		}
	}
}
}

@media (max-width: 350px){
	.text-intro {
		h2 {
			font-size: 34px;
		}
		.text-intro_special {
			font-size: 35px;
		}
	}
	.titulo-header {
		h1 {
			font-size: 32px;
		}
	}
}
.aire-top {
	padding-top: 50px;
}

.simple-button {
	color: #000;
	text-decoration: underline;
	transition:all 0.5s ease-in-out;
}


@media (max-width: 300px){
	.titulo-header {
		h1 {
			font-size: 33px;
		}
	}
	.text-intro {
		h2 {
			font-size: 33px;
		}
	}
	.text {
		h3 {
			font-size: 26px;
		}
	}
}



a.simple-button:hover {
	letter-spacing: 1px;
    text-decoration: none;
}

.form-group-input.form-slide {
	border:none;
	padding:0;
}

.botones-header {
	display:flex;
	align-items:center;
	display: flex;
	
	.button-call {
		position: relative;
		background-color: transparent;
    	border: none;
		width: 55px;
        height: 50px;
		display: flex;
		align-items: end;
        justify-content: center;
		    margin: 0 0 8px 0;
		svg {
			width: 30px;
   			height: 30px;
			transform: scale(1.8); 
			filter: drop-shadow(rgba(255, 255, 255, 1) 0px 0px 1px);
		}
	}
	.button-lang {
		background-color: transparent;
    	border: none;
		width: 105px;
        height: 50px;
		display: flex;
		align-items: center;
		justify-content: center;
		svg {
			width: 100px;
   			height: 100px;
			transform: scale(0.45);
			filter: drop-shadow(rgba(255, 255, 255, 1) 0px 0px 2px);
			}
		}
		svg {
			fill:#fff;
			transition: all 0.5s ease-in-out;
			transition-delay: 0s;
			cursor:pointer;

			path {
			 box-shadow: 0 0px 1px 1px #00000063;	
			}   
		}
}

.botones-header-sec {
	display:flex;
	align-items:center;
	display: flex;
	
	.button-call {
		position: relative;
		background-color: transparent;
    	border: none;
		width: 55px;
        height: 50px;
		display: flex;
		align-items: end;
        justify-content: center;
		    margin: 0 0 8px 0;
		svg {
			width: 30px;
   			height: 30px;
			transform: scale(1.8); 
			filter: drop-shadow(rgba(255, 255, 255, 1) 0px 0px 1px);
		}
	}
	.button-lang {
		background-color: transparent;
    	border: none;
		width: 105px;
        height: 50px;
		display: flex;
		align-items: center;
		justify-content: center;
		svg {
			width: 100px;
   			height: 100px;
			transform: scale(0.45);
			filter: drop-shadow(rgba(255, 255, 255, 1) 0px 0px 2px);
			}
		}
		svg {
			fill:#fff;
			transition: all 0.5s ease-in-out;
			transition-delay: 0s;
			cursor:pointer;

			path {
			 box-shadow: 0 0px 1px 1px #00000063;	
			}   
		}
}
.social-movil {
	position: absolute;
    right: 5%;
	display: none;
    justify-content: left;
    gap: 14px;
    margin: 0 0 0px 47px;
	
	img,
	a {
		width: 30px !important;	
	}
}

@media(max-width:725px) {
	.social-movil {
		bottom:0;
		display:flex;
	}
	
}


.boton-header {
	padding: 0 0 4px 0;
	margin: 0 12px 0 12px;
    width: 150px;
	min-width:100px;
    height: 36px;
    font-size: 19px;
    font-weight: 600;
    align-items: center;
    justify-content: center;
    background-color: #5583a5;
    border: none;
    border-radius: 2px;
    color: #faf6ee;
    font-family: "Barlow", sans-serif;
    box-shadow: 0 4px 8px #6381a182;
    transition: all 0.4s ease-in-out;
    letter-spacing: 1px;
    cursor: pointer;
    z-index: 5;
	display: flex;
	position: fixed;
	right: -200px; 
	transition: left 0.5s ease-in-out;
	z-index: 1000;
}

.boton-header{
	display: flex;
	position: fixed;
	right: -200px; /* Fuera de la vista inicial */
	transition: right 0.5s ease-in-out;
	z-index: 1000;
}

.boton-header-sec {
	padding: 0 0 4px 0;
	margin: 0 12px 0 12px;
    width: 150px;
	min-width:100px;
    height: 36px;
    font-size: 19px;
    font-weight: 600;
    align-items: center;
    justify-content: center;
    background-color: #5583a5;
    border: none;
    border-radius: 2px;
    color: #faf6ee;
    font-family: "Barlow", sans-serif;
    box-shadow: 0 4px 8px #6381a182;
    transition: all 0.4s ease-in-out;
    letter-spacing: 1px;
    cursor: pointer;
    z-index: 5;
	display: flex;
	position: fixed;
	right: -200px; 
	transition: left 0.5s ease-in-out;
	z-index: 1000;
}

.boton-header-sec{
	display: flex;
	position: fixed;
	right: -200px; /* Fuera de la vista inicial */
	transition: right 0.5s ease-in-out;
	z-index: 1000;
}
.botones-header {
	display: flex;
	position: fixed;
	right: 0px; /* Fuera de la vista inicial */
	top: 10px;
	transition: right 0.5s ease-in-out;
	z-index: 1;
}

.show {
	right: 10px; /* Ajusta según sea necesario */
}

.show2 {
	right: 210px; /* Ajusta según sea necesario */
}

.boton-header:hover {
	letter-spacing: 1.5px;
	background-color:#5583a5b8;
	box-shadow: 0 8px 14px #6381a1d4;
	color: #fcf4f0;
}

@media(min-width:724px) {
	.boton-header {
		margin: 0 32px 0px 12px;
		
	}
}

@media(max-width:724px) {
	.boton-header {
		bottom:16px;
		
	}
	.botones-header {
		
		.button-lang{
			display:none;
		}
		
		.button-call {
			display:none;
		}
	}
	
}


@media(max-width:600px) {
	.boton-header {
		width:100px;
		
	}
}

.botones-header.mobile {
	left:-32px;
	.button-lang{
		display:flex;
		height:80px;
		transform: scale(0.35);
		svg {
			transform: scale(1);
		}
	}

	.button-call {
		display:flex;
		margin: 0 0 12px -24px;
		svg {
			transform: scale(1.3);
		}
	}
	
	svg {
		fill: #121213;
	}
}

.hidden {
	transform: translateY(40px);
	opacity: 0;
}

.show {
    transform: translateZ(0px)
	opacity: 1;
	transition: all 1.2s ease-in-out;
}
/*
.show {
    transform: translateY(0px)
	opacity: 1;
	transition: all 1.5s ease-in-out;
}
*/
.hidden-delay {
	transform: translateY(40px);
	opacity: 0;}

.show-delay {
    transform: translateY(0px)
	opacity: 1;
	transition: all 0.8s ease-in-out 0.5s;
}

.hidden-up {
	transform: translateY(40px) ;
	opacity: 0;
}

.show-up {
    transform: translateY(0px)
	opacity: 1;
	transition: all 0.5s ease-in-out;
}

.hidden-down {
	transform: translateY(-40px) ;
	opacity: 0;
}

.show-down {
    transform: translateY(0px)
	opacity: 1;
	transition: all 1.5s ease-in-out;
}

.hidden-right {
	transform: translateX(-40px);
	opacity: 0;
}

.show-right {
	transform: translateY(0px);
	opacity: 1;
	transition: all 1.2s ease-in-out;
}


.hidden-left {
	transform: translateX(40px);
	opacity: 0;
}

.show-left {
	transform: translateY(0px);
	opacity: 1;
	transition: all 1.2s ease-in-out;

}

.wrapper-full.general {
	margin-top:0;
	.wrapper-full.header {
		height: 76vh;
    	position: relative;
		margin: 0 0 64px;
		
		.wrap-img {
			
			img {
				position: absolute;
				inset: 0;
				height: 720px;
				object-fit: cover;
			}
		}
	}
}

.wrapper-full.general.torreblanca {
	
	margin-top: -29px;
	
	.wrapper-full.header{
		height: 76vh;
		position: relative;
		margin: 0 0 0;
		top:-24px;
		
		.titulo-header {
			h2 {
				font-weight: 500;
				color: #f2f2f2;
				text-transform: uppercase;
				line-height: 1;
				letter-spacing: 4px;
				font-family: "Barlow", sans-serif;
				text-shadow: 0 0 5px #000000a1;
				animation: opacity-text 2s ease-in-out;
			}
		}
	}
}

.wrapper-full.general.narejos {
	
	margin-top: -29px;
	
	.wrapper-full.header{
		height: 76vh;
		position: relative;
		margin: 0 0 0;
		top:-24px;
		
		.titulo-header {
			h2 {
				font-weight: 500;
				color: #f2f2f2;
				text-transform: uppercase;
				line-height: 1;
				letter-spacing: 4px;
				font-family: "Barlow", sans-serif;
				text-shadow: 0 0 5px #000000a1;
				animation: opacity-text 2s ease-in-out;
			}
		}
	}
}

.wrapper-full.general.sultan {
	
	margin-top: -29px;
	
	.wrapper-full.header{
		height: 76vh;
		position: relative;
		margin: 0 0 0;
		top:-24px;
		
		.titulo-header {
			h2 {
				font-weight: 500;
				color: #f2f2f2;
				text-transform: uppercase;
				line-height: 1;
				letter-spacing: 4px;
				font-family: "Barlow", sans-serif;
				text-shadow: 0 0 5px #000000a1;
				animation: opacity-text 2s ease-in-out;
			}
		}
	}
}

.wrapper-full.general.rodeo {
	
	margin-top: -29px;
	
	.wrapper-full.header{
		height: 76vh;
		position: relative;
		margin: 0 0 0;
		/*top:-24px;*/
		top: 0px;
		
		.titulo-header {
			h2 {
				font-weight: 500;
				color: #f2f2f2;
				text-transform: uppercase;
				line-height: 1;
				letter-spacing: 4px;
				font-family: "Barlow", sans-serif;
				text-shadow: 0 0 5px #000000a1;
				animation: opacity-text 2s ease-in-out;
			}
		}
	}
}

.wrapper-full.general.cendrillon {
	
	margin-top: -29px;
	
	.wrapper-full.header{
		height: 76vh;
		position: relative;
		margin: 0 0 0;
		top:-24px;
		
		.titulo-header {
			h2 {
				font-weight: 500;
				color: #f2f2f2;
				text-transform: uppercase;
				line-height: 1;
				letter-spacing: 4px;
				font-family: "Barlow", sans-serif;
				text-shadow: 0 0 5px #000000a1;
				animation: opacity-text 2s ease-in-out;
			}
		}
	}
}

.wrapper-full.general.apartahotel {
	
	margin-top: -29px;
	
	.wrapper-full.header{
		height: 76vh;
		position: relative;
		margin: 0 0 0;
		top:-24px;
		
		.titulo-header {
			h2 {
				font-weight: 500;
				color: #f2f2f2;
				text-transform: uppercase;
				line-height: 1;
				letter-spacing: 4px;
				font-family: "Barlow", sans-serif;
				text-shadow: 0 0 5px #000000a1;
				animation: opacity-text 2s ease-in-out;
			}
		}
	}
}

.wrapper-full.general.fuengirola {
	
	margin-top: -29px;
	
	.wrapper-full.header{
		height: 76vh;
		position: relative;
		margin: 0 0 0;
		top:-24px;
		
		.titulo-header {
			h2 {
				font-weight: 500;
				color: #f2f2f2;
				text-transform: uppercase;
				line-height: 1;
				letter-spacing: 4px;
				font-family: "Barlow", sans-serif;
				text-shadow: 0 0 5px #000000a1;
				animation: opacity-text 2s ease-in-out;
			}
		}
	}
}


.wrapper-full.general.ofertas {
	.wrapper-full.header{
		height: 76vh;
		position: relative;
		margin: 0 0 0;
		
		.titulo-header {
			h2 {
				font-weight: 500;
				color: #f2f2f2;
				text-transform: uppercase;
				line-height: 1;
				letter-spacing: 4px;
				font-family: "Barlow", sans-serif;
				text-shadow: 0 0 5px #000000a1;
				animation: opacity-text 2s ease-in-out;
			}
		}
	}
}

.wrapper-full.general.promociones {
	.wrapper-full.header{
		height: 76vh;
		position: relative;
		margin: 0 0 0;
		
		.titulo-header {
			h2 {
				font-weight: 500;
				color: #f2f2f2;
				text-transform: uppercase;
				line-height: 1;
				letter-spacing: 4px;
				font-family: "Barlow", sans-serif;
				text-shadow: 0 0 5px #000000a1;
				animation: opacity-text 2s ease-in-out;
			}
		}
	}
}

.wrapper-full.general.contacto {
	.wrapper-full.header{
		height: 76vh;
		position: relative;
		margin: 0 0 0;
		
		.titulo-header {
			h2 {
				font-weight: 500;
				color: #f2f2f2;
				text-transform: uppercase;
				line-height: 1;
				letter-spacing: 4px;
				font-family: "Barlow", sans-serif;
				text-shadow: 0 0 5px #000000a1;
				animation: opacity-text 2s ease-in-out;
			}
		}
	}
}
.wrapper-full.general.aviso-legal {
    	margin-top: 80px;
	.wrapper{
		padding: 0 3%;		
	}
}
.space {
	margin-bottom: 87px;
}

.tooltip {
    visibility: hidden;
    width: 100px;
    background-color: #5482a4;
    color: #fff;
    text-align: center;
    border-radius: 4px;
    padding: 8px;
    position: absolute;
    z-index: 1;
    bottom: -65%;
    left: 0%;
    margin-left: -50px;
    opacity: 0;
    transition: opacity 0.3s;
}

.button-call:hover .tooltip {
    /*visibility: visible;*/
    opacity: 1;
}

.flags {
    display: flex;
	flex-flow:column;
    position: absolute;
    top: 100%;
    left: 35%;
    transform: translateX(-50%);
    margin-top: 10px;
    z-index: 1;
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.6s ease, visibility 0.3s ease;
}

.flag-link {
    display: block;
    padding: 5px;
    margin: 0 auto;
}

.flag {
    width: 24px;
    height: 24px;
}

.button-lang:hover .flags {
    opacity: 1;
    visibility: visible;
}

#menu .flags {
	top: 111%;
    left: 53%;
	img{
		width: 64px;
		height: 64px;	
	}
	
}

.text-blue-ids {
	font-family: 'Rancho';
	color: #5382a4;
	font-size: 20px;
	padding: 10px 0 20px;
	text-decoration: none;
}

/*//////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////// IDs //////////////////////////////////*/
/*//////////////////////////////////////////////////////////////////////*/

@media (min-width: 725px) {
	#desti {
		scroll-margin-top: 140px;
	}

	#apar {
		scroll-margin-top: 150px;
	}

	#servi {
		scroll-margin-top: 150px;
	}

	#promo {
		scroll-margin-top: 150px;
	}

	#golf {
		scroll-margin-top: 150px;
	}

	#spa {
		scroll-margin-top: 150px;
	}

	#hoteles {
		scroll-margin-top: 120px;
	}
	#restau {
		scroll-margin-top: 150px;
	}
}

/*//////////////////////////////////////////////////////////////////////*/
/*////////////////////////////// Menu //////////////////////////////////*/
/*//////////////////////////////////////////////////////////////////////*/



/*////////////////////////////// Estilos despliegue //////////////////////////////////*/
/*.move-me {
	transform: translateY(-166px);
	transition: transform 0.8s ease;
	background-color: #fcf4f0;
	position: relative;
	z-index: 9;
}

.movement {
	transform: translateY(0px); 
	margin: 0;
	padding: 15px 0 0;
}

#destinos {
	display:flex;
	position: relative;
	
	#girar-span {
		transform: rotate(90deg);
		display: inline-block;
		transition: transform 0.8s ease;
		position: absolute;
		right: -18px;
		top: 8px;
		font-weight: 800;
		font-size: 31px;
	}

	#girar-span.girado {
		transform: rotate(270deg);
	}
} 
.destinos-submenu {
	
	> li {
		    margin: -14px 0 0 0;
		a {
			font-weight:400;
			font-size: 34px !important;
		}
	}
}







.elemento_grid p {
	margin-bottom: 2rem;
}


.vis {
		visibility: hidden;
	}

@media (max-width: 560px){
	.menu a {
		font-size: 37px !important;
	}
	.vis {
		visibility: visible;
		background-color: white;
		padding: 15px;
		color: black;
	}
		.submenu2 {
			position: absolute;
			display: flex;
			top: 12%;
			left: 107%;
			flex-direction: column;
	}
	.menu-colapse {
		.custom-imput-form align-content {
			background-color: white;
			z-index: 1;
		}
		
	}
	.move-me {
		transform: translateY(-171px);
	}
	.movement {
	transform: translateY(0px); 
	}
	
	#destinos {
	
		#girar-span {
			
			right: -2px;
			top: 8px;
			font-size: 29px;
		}
	}
}
*/

/*////////////////////MENU  //////////////////////*/

.menu-principal {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.menu-principal > li {
    position: relative;
    display: inline-block;
    margin-right: 40px;
}

#destinos-submenu {
    display: block;
}

.menu-item-destinos > .submenu-destinos,
.menu-item-hoteles > .submenu-hoteles {
    display: none;
}

.menu-item-destinos:hover > .submenu-destinos {
    display: block;
}

.menu-item-hoteles:hover > .submenu-hoteles {
    display: block;
}

.submenu-destinos,
.submenu-hoteles {
    position: absolute;
    right: 0;
    top: 100%;
    padding: 10px;
}

.menu-principal .submenu-destinos li,
.menu-principal .submenu-hoteles li {
    display: block;
	padding:10px 0 ;
}


.menu-item-destinos,
.menu-item-hoteles {
	position: relative;
	background-color: #fff0;
}

.menu-item-destinos a,
.menu-item-hoteles a {
	display: flex;
    justify-content: space-between;
    max-width: 250px !important;
    align-items: center;
	text-decoration:none;
	font-family: "Barlow", sans-serif !important;
}

.submenu-destinos li:hover,
.submenu-hoteles li:hover {
    
}

.menu-principal .submenu-destinos {
	margin: -60px -128px 0px 0px;
	
	li {
		padding:0;
		text-decoration:none;
		    font-family: "Barlow", sans-serif !important;
		
		a{
			padding:5px 0;
			text-decoration:none;
			font-family: "Barlow", sans-serif !important;
			display: flex;
    		flex-direction: column;
			font-size: 24px;
    		font-weight: 700;
			align-items:start;
			span {
				font-size: 14px;
				font-weight: 400;
				margin: 0 0 -4px;
			}
			
		} 
	}
}

.menu-principal .submenu-hoteles {
	margin: -134px -155px 0px 0px;
	
	li {
		padding:0;
		text-decoration:none;
		    font-family: "Barlow", sans-serif !important;
		
		a{
			padding:5px 0;
			text-decoration:none;
			font-family: "Barlow", sans-serif !important;
			display: flex;
    		flex-direction: column;
			font-size: 24px;
    		font-weight: 700;
			align-items:start;
			
			span {
				font-size: 14px;
				font-weight: 400;
				margin: 0 0 -4px;
			}
		} 
	}
	
}


#hover-image-container {
    position: relative;
	max-width: 790px;
}

#hover-image-container img {
    width: 100%;
    height: auto;
    display: none;
    object-fit: cover;
    max-width: 790px;
}

#hover-image-container img.default-image {
    display: block;
}

#hover-image-container img.hover-image {
    z-index: 1; 
}

.contenedor-menu {
    display: flex;
    justify-content: space-between;
	z-index: 999;
    position: relative;
       min-height: 500px;
}

.menu-escrito {
    width: 50%;
    min-width: 470px;
}

.menu-principal {
    max-width: 332px;
}

.menu-principal > a {
    text-decoration: none;
    font-family: "Barlow", sans-serif !important;
    font-size: 32px;
    font-weight: 700;
}

.menu-principal > li {
    font-size: 32px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.menu-principal img {
    width: 20px;
    height: 20px;
    transform: rotate(-90deg);
}

.menu-img {
    padding: 0 40px 21px 21px;
    width: 50%;
	
}


.menu-img img {
    aspect-ratio: 14 / 8;
}

.contenedor-menu .menu-principal > a,
.contenedor-menu .menu-principal > li span {
    opacity: 0.5;
    transition: opacity 0.3s ease;
}

.contenedor-menu .menu-principal > a:hover,
.contenedor-menu .menu-principal > a:active,
.contenedor-menu .menu-principal > li span:hover,
.contenedor-menu .menu-principal > li span:active {
    opacity: 1;
}

.submenu-destinos,
.submenu-hoteles {
    display: none;
}

.submenu-destinos.active,
.submenu-hoteles.active {
    display: block;
}

.sub-image {
    margin-top: 4px; 
    display: flex;
    justify-content: space-between;

	
	div {
		display:flex;
		flex-flow:row;
		gap:24px;
		align-items: center;

		.menu-redes {
			gap:10px;
		}
		
	}
	
	.menu-idiomas {
			gap:10px;
		}
}




#hover-image-container .sub-image a {
	font-size:16px;
	text-decoration:none;
	max-width:none;
	font-family:'Barlow';
	font-weight: 800;
    text-transform: uppercase;
	width:auto;
}

#hover-image-container .sub-image a img {
    width: 20px;
    height: 20px;
	display:block;
}

@media(max-width:550px) {
	#hover-image-container .sub-image a {
		font-size:14px
		font-weight: 500;
	}
	
	#hover-image-container .sub-image a img {
		width: 16px;
		height: 16px;
		}
}

.align {
	.button {
			margin: 0;
			position: absolute;
			top: 16px;
			right: 50px;
			width: 150px;
			text-transform: uppercase;
		
			a {
				margin:0;
				height: 50px;
				line-height: 46px;
				box-shadow: 0 4px 8px #6381a100;
				background-color: #6381A1;
				color: #fff;

		}
	} 
}

@media(max-width:950px) {
	.align {
	}
	.contenedor-menu {
		flex-flow: column;
		position: absolute;
    	top: 10%;
		width: 100%;

	}
	#hover-image-container {
		position: relative;
		bottom:-85px;
		display:none;
	}
	.menu-img {
		padding: 0 21px 21px 21px;
		width: 100%;
	}
}


@media(max-width:500px) {
	
	.menu-principal {
		max-width: 220px;
	}
	
	.menu-principal img {
		font-size: 21px;
		width:12px;
		height:12px;
	}
	
	.menu-principal a {
		font-size: 21px;
	}
	.menu-principal li {
		font-size: 21px;
	}
	
	.menu-principal .submenu-destinos li a {
		font-size:18px;
	}
	.menu-principal .submenu-hoteles li a {
		font-size:18px;
		 white-space: nowrap;
	}
	
	.menu-item-destinos a, .menu-item-hoteles a {
    	max-width: 130px !important;
	}
	.menu-principal .submenu-hoteles {
    	margin: -114px -130px 0px 0px;
	}
	
	.contenedor-menu {
		flex-flow: column;
		position: absolute;
		top: 10%;
	}
	#hover-image-container {
		display:block;
	}
	
	.menu-img img {
		aspect-ratio: 14 / 6;
	}
	
	.align {
	.button {
			margin: 0;
			position: absolute;
			top: 16px;
			right: 21px;
			width: 130px;

		
			a {
				margin:0;
				height: 45px;
				line-height: 40px;
				box-shadow: 0 4px 8px #6381a100;
				background-color: #6381A1;
				color: #fff;

		}
	} 
}

}



/*//////////////////////////////////////////////////////////////////////*/
/*////////////////////////////// BARRA DISPO ///////////////////////////*/
/*//////////////////////////////////////////////////////////////////////*/
.formulario-barra-reservas-versiondos {
			background: white;
			width: 72%;
			max-width: 1240px;
			z-index: 5;
			height: 65px;
			display: flex;
			position: absolute;
			left: 18%;
			top: 72%;
			justify-content: space-between;
        }

        .barra-disponibilidad-body-versiondos {
            width: 100%;
            position: absolute;
            z-index: 6;
            display: flex;
            justify-content: center;
            margin-top: 20%;
        }

        input.campo-imput-versiondos {
			width: 15%;
			margin: 0px;
			text-align: center;
			border: solid 0px #e6e6e6;
			background: white;
			color: #3f3f3f;
			cursor: pointer;
			font-family: "Barlow", sans-serif;
			font-size: 18px;
			font-weight: 600;
        }

		input.campo-imput-versiondos-slide {
			width: 50%;
			margin: 0 0 10px;
			text-align: center;
			border: solid 0px #e6e6e6;
			background: white;
			color: #3f3f3f;
			cursor: pointer;
			font-family: "Barlow", sans-serif;
			font-size: 20px;
			font-weight: 600; 
		}

        select.campo-select-version {
			width: 26%;
			margin: 0px;
			text-align: center;
			border: solid 0px #e6e6e6;
			background: white;
			color: #3f3f3f;
			cursor: pointer;
			font-family: "Barlow", sans-serif;
			font-size: 18px;
			font-weight: 600;
        }

        select.campo-select-versiondos {
			width: 19%;
			margin: 0px;
			text-align: center;
			border: solid 0px #e6e6e6;
			background: white;
			color: #3f3f3f;
			cursor: pointer;
			font-family: "Barlow", sans-serif;
			font-size: 19px;
			font-weight: 600;
        }

        select.campo-select-versiondos.nums-bar {
			width: 6%;
			margin: 0px;
			text-align: center;
			border: solid 0px #e6e6e6;
			background: white;
			color: #3f3f3f;
			cursor: pointer;
			font-family: "Barlow", sans-serif;
			font-size: 19px;
			font-weight: 600;
        }

        input.campo-promocion-versiondos {
			width: 18%;
			margin: 0px;
			text-align: center;
			border: solid 0px #e6e6e6;
			background: white;
			color: #3f3f3f;
			cursor: pointer;
			font-family: "Barlow", sans-serif;
			font-size: 18px;
			font-weight: 600;
        }

        input.boton-enviar-versiondos {
			width: 22%;
			margin: 6px;
			border: solid 0px #e6e6e6;
			font-weight: bold;
			background: #5482a4;
			color: white;
			cursor: pointer;
			font-family: "Barlow", sans-serif;
			border-radius: 2px;
			font-size: 18px;
			font-weight: 600;
        }

         @media (min-width:1370px) {
            .formulario-barra-reservas-versiondos {
				background: white;
				width: 67%;
				z-index: 5;
				height: 65px;
				display: flex;
				position: absolute;
				left: 18%;
				top: 82%;
				justify-content: space-between;
            }
			 
			 .formulario-barra-reservas-versiondos.destinos-barra {
				 background: white;
				 width: 69vw;
				 z-index: 5;
				 height: 7vh;
				 display: flex;
				 position: absolute;
				 left: 18%;
				 top: 65vh;
				 justify-content: space-between;
			 }

            .barra-disponibilidad-body-versiondos {
                width: 100%;
                position: absolute;
                z-index: 6;
                display: flex;
                justify-content: center;
                margin-top: 20%;
            }

            input.campo-imput-versiondos {
				width: 25%;
				margin: 0px;
				text-align: center;
				border: solid 0px #e6e6e6;
				background: white;
				color: #3f3f3f;
				cursor: pointer;
				font-family: "Barlow", sans-serif;
				font-size: 19px;
				font-weight: 600;
            }
			 
			 input.campo-imput-versiondos-slide {
				 width: 50%;
				 margin: 0 0 10px;
				 text-align: center;
				 border: solid 0px #e6e6e6;
				 background: white;
				 color: #3f3f3f;
				 cursor: pointer;
				 font-family: "Barlow", sans-serif;
				 font-size: 20px;
				 font-weight: 600; 
			 }

            select.campo-select-version {
				width: 26%;
				margin: 0px;
				text-align: center;
				border: solid 0px #e6e6e6;
				background: white;
				color: #3f3f3f;
				cursor: pointer;
				font-family: "Barlow", sans-serif;
				font-size: 18px;
				font-weight: 600;
            }

            select.campo-select-versiondos {
				width: 27%;
				margin: 0px;
				text-align: center;
				border: solid 0px #e6e6e6;
				background: white;
				color: #3f3f3f;
				cursor: pointer;
				font-family: "Barlow", sans-serif;
				font-size: 18px;
				font-weight: 600;
            }

            input.campo-promocion-versiondos {
				width: 15%;
				margin: 0px;
				text-align: center;
				border: solid 0px #e6e6e6;
				background: white;
				color: #3f3f3f;
				cursor: pointer;
				font-family: "Barlow", sans-serif;
				font-size: 20px;
				font-weight: 600;
            }

            input.boton-enviar-versiondos {
				width: 19%;
				margin: 6px;
				border: solid 0px #e6e6e6;
				font-weight: bold;
				background: #5482a4;
				color: white;
				cursor: pointer;
				font-family: "Barlow", sans-serif;
				border-radius: 2px;
				font-size: 20px;
				font-weight: 600;
            }
        }


        .links-buttons-res {
		position: absolute;
	    z-index: 6;
	    left: 6%;
	    top: 63%;
	    width: 90%%;
		display: none;
	}

	.enlace-llamada {
		width: 100%;
		display: flex;
		flex-flow: wrap;
		max-width: 400px;
		z-index: 5;
		position: absolute;
		height: 50px;
		border-radius: 15px;
		text-decoration: none;
	}

	.enlace-reserva {
		color: #faf6ee;
		background-color: #5583a5;
		border: none;
		padding: 14px 0;
		text-align: center;
		font-size: 19px;
		cursor: pointer;
		min-width: 200px;
		font-weight: 600;
		width: 50%;
		border-radius: 2px;
		font-family: "Barlow", sans-serif;
		line-height: 1;
	}

	.enlace-numero {
		color: #000000;
		background-color: #f2f2f2;
		border: none;
		padding: 9px 0;
		text-align: center;
		font-size: 19px;
		cursor: pointer;
		min-width: 200px;
		font-weight: 700;
		width: 50%;
		border-radius: 2px;
		letter-spacing: 2px;
		font-family: "Barlow", sans-serif;
	}
	

    @media (max-width:1000px) {
        .formulario-barra-reservas-versiondos {
            display: none;
        }

		.links-buttons-res {
			display: block;
		}
    }

	@media (min-width:400px) {
		.enlace-reserva {
			border-radius: 2px 0 0 2px;
		}
		
		.enlace-numero {
			border-radius: 0 2px 2px 0;
		}

	}

::before {
	display: none !important;
}

::after {
	display:none !important;	
}
.no-arrow{
	-webkit-appearance: none;
    pointer-events: none;
}
/*///////////////// Versión pequeña popleft /////////////////////*/
.menu-colapse .custom-input-form {
	width: 100%;
	height:54px;
    font-size: 20px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #5583a5;
    border: none;
    color: #faf6ee;
    font-family: "Barlow", sans-serif;
	box-shadow: 0 4px 8px #6381a182;
	transition:all 0.4s ease-in-out;
	letter-spacing: 1px;
	cursor:pointer;
	border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

fieldset.form-group {
	background: #faf6ee;
	border:none;
	
	input {
		font-family: "Barlow", sans-serif;
        width: 95%;
        height: 26px;
        border-radius: 3px;
		border:0;
		box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.4);
        padding: 0 0 0 6px;
	}
	
	#from-top1 {
		border-top-left-radius: 4px;
    	border-top-right-radius: 4px;
	}
}

/*///////////////////Esto es para el slider de reservar//////////////////*/
.sliding-div {
  position: fixed;
  top: 122px;
  right: -190%;
  width: 400px; 
	border-radius:4px;
     background: rgb(255 255 255 / 9%);
 -webkit-backdrop-filter: blur(5px);
 backdrop-filter: blur(5px);
 border: 1.5px solid rgba(209, 213, 219, 0.3);
  padding: 50px 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  transition: right 0.8s ease-in-out;
	z-index:99;
}

.sliding-div.show {
  right: 0;
}

#closeButton {
	display:none;
}

#from-bottom1 {
	padding-bottom: 24px;
}

#slidingDiv {
	.from-gimh.menu-colapse {
		    width: 75%;
		
		form {
			display: flex;
			flex-flow: wrap;
			position: relative;
			height: 100%;
			background: none;
			max-width: 294px;
			width: 100%;
			
			#destinos-barra {
				margin: 0 0 10px;
				width: 100%;
				height: 60px;
				max-width: 400px;
			}
			
			#datefilterB {
				margin: 0 0 10px;
				width: 100%;
				height: 60px;
				max-width: 400px;
			}
			#num_adultosB {
				margin: 0 0 10px;
				width: 48%;
				height: 60px;
				max-width: 400px;
			}
			#num_ninosB {
				margin: 0 0 10px;
				width: 48%;
				height: 60px;
				max-width: 400px;
			}
			
			#codigo_promoB {
				margin: 0 0 10px;
				width: 100%;
				height: 60px;
				max-width: 400px;
			}
			.boton-enviar-versiondos {
				margin: 0 0 10px;
				width: 100%;
				height: 60px;
				max-width: 400px;
			}
			 #hoteles_destino {
                margin: 0 0 10px;
                width: 100%;
                height: 60px;
                max-width: 400px;
            }
            
            #rango_fechas {
                margin: 0 0 10px;
                width: 100%;
                height: 60px;
                max-width: 400px;
            }
            
            #cantidad_adultos {
                margin: 0 0 10px;
                width: 48%;
                height: 60px;
                max-width: 400px;
            }
            
            #cantidad_ninos {
                margin: 0 0 10px;
                width: 100%;
                height: 60px;
                max-width: 400px;
            }
            
            #codigo_promocion {
                margin: 0 0 10px;
                width: 100%;
                height: 60px;
                max-width: 400px;
            }
		}
	}
}


/*///////////////////Esto es para el slider de reservar//////////////////*/

/*//////////////////////////////////////////////////////////////////////*/
/*////////////////////////////// home //////////////////////////////////*/
/*//////////////////////////////////////////////////////////////////////*/

html {
    scroll-behavior: smooth;
}


.wrapper-full.header {
    height: 100vh;
	display: flex;
    align-items: center;
}

.wrapper-full.home {
	display: flex;
	align-items: center;
	height: 92vh;
	
	.wrap-video-home-home {
		position: absolute;
		inset: 0;
		height: 92vh;
		
		.video-home-desktop {
			object-fit: cover;
			width: 100%;
			aspect-ratio: 9 / 16;
			object-position: center;
			height: 100vh;
			animation: opacity-video 1.8s ease-in-out;
		}
		.video-home-mobil {
			display:none;
			aspect-ratio: 6 / 9;
			object-fit: cover;
			max-width: 700px;
			width:100%;
			object-position: center;
			height: 92vh;
			animation: opacity-video 1.8s ease-in-out;
		}
	}
	
	.titulo-header {
		animation: opacity-text 2s ease-in-out;
		}
		
}

@media(max-width:700px) {
	.wrapper-full.home {
		height: 82vh;
    & .wrap-video-home-home {
        .video-home-mobil {
            display: block ;
        }
    }
}
	.wrapper-full.home {
    & .wrap-video-home-home {
        .video-home-desktop {
            display:none;
        }
    }
}
}



.efect-from {
	animation: opacity-from 1.5s ease-in-out;
}

@keyframes opacity-video {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes opacity-text {
  0% {
    opacity: 0;
    transform: translateX(-3%);
  }
  100% {
    opacity: 1;
    transform: translateX(0); 
  }
}

@keyframes opacity-from {
  0% {
    opacity: 0;
    transform: translateX(5%);
  }
  100% {
    opacity: 1;
    transform: translateX(0); 
  }
}


@media (min-width:780px) {
	.wrapper-full.home {
			height:95vh;

	}
}

@media (min-width:950px) {
	.wrapper-full.home {

		
		.titulo-header {
			
			h1 {
				font-size:65px;
			}
		}
	}
}

@media (min-width:1220px) {
	.wrapper-full.home {
		
		.titulo-header {
			
			h1 {
				font-size:84px;
			}
		}
	}
}
	
@media (max-width:800px){
		.wrapper-full.home-body {
		.wrapper {
			.text-intro {
				margin: 64px auto 0;
				}
			}
	}

}
	.wrapper-full.home-body {
		.wrapper {
			.text-intro {
				max-width: 1190px;
				/*margin: 64px auto 0;*/
				padding: 50px 0 0;

				h3 {
					color: #5382a4;
					text-align: center;
					font-size: 1.75rem;
					letter-spacing: 4px;
				}
			
				.button {
					display: flex;
					justify-content: center;
					margin: 20px 0px;
				

				}
			}
		}
	}
}



.menu-fixed {
	position: fixed;
	z-index: 7;
	top: 0px;
	width:100%;
	max-width:1000px;
	background-color: #faf6ee;
}


.wrapper-full.home-body {
	.destinos {
		text-align: left;
		margin: 70px 0 140px;
		
		.text {
			margin: 32px 0 80px;
			
			h3 {
				text-align: left;
                margin: 8px 0 21px;
                font-family: "Barlow", sans-serif;
                text-transform: uppercase;
                letter-spacing: 7px;
				font-weight:800;
			}
			p {
				text-align:left;
				font-size: 16px;
			}
		}
		.fotos {
			position: relative;
			margin: 0px 40px;	
			
			.img1 {
				width: 100%;
				aspect-ratio: 10 / 10;
				object-fit: cover;
			}
			
			p {
				 position: absolute;
                bottom: 10px;
                left: 8px;
                font-size: 12px;
                font-family: "Barlow", sans-serif;
                font-weight: 500;
			}
		}
		
		

	}
	
		.desti1 {
			
			.fotos {
				.mr {
					position: absolute;
					top: -30px;
					left: -50px;

					.img2 {
						width: 160px;
						height: 180px;
						aspect-ratio: 6 / 10;
						object-fit: cover;
						border-color: #fff !important;
						border-top: 10px solid;
						border-right: 10px solid;
						border-left: 10px solid;
						box-shadow: 1px 1px 0px 1px rgba(0, 0, 0, 0.06);
						border-bottom: 24px solid #fffefe;
					}
					
				}
				
				.ms {
					position: absolute;
					bottom: -30px;
					right: -40px;
					
					.img3 {
						aspect-ratio: 6 / 10;
						object-fit: cover;
						box-shadow: 1px 1px 0px 1px rgba(0, 0, 0, 0.06);
						border-bottom: 24px solid #fffefe;
						border-color: #fff !important;
						border-top: 10px solid;
						border-right: 10px solid;
						 border-left: 10px solid;
						width: 160px;
						height: 180px;
						}
					}
				}
			}
	.desti2 {
			
			.fotos {

				.mm {
					position: absolute;
					bottom: 20px;
					right: -40px;

					.img3 {
						aspect-ratio: 14 / 9;
						object-fit: cover;
						box-shadow: 1px 1px 0px 1px rgba(0, 0, 0, 0.06);
						border-bottom: 24px solid #fffefe;
						border-color: #fff !important;
						border-top: 10px solid;
						border-right: 10px solid;
						border-left: 10px solid;
						width: 160px;
						height: 180px;
					}
				}
			}
		
		}
	.desti3 {
			
			.fotos {
				
				.img1 {
						object-position: 10% 50%;
					}
				
				.mc {
					position: absolute;
					top: -30px;
					left: -50px;

					.img2 {
						width: 160px;
						height: 180px;
						aspect-ratio: 14 / 9;
						object-fit: cover;
						border-color: #fff !important;
						border-top: 10px solid;
						border-right: 10px solid;
						border-left: 10px solid;
						box-shadow: 1px 1px 0px 1px rgba(0, 0, 0, 0.06);
						border-bottom: 24px solid #fffefe;
					}

				}
				
				.mf {
					position: absolute;
					bottom: -60px;
					right: -40px;
					
					.img3 {
						aspect-ratio: 14 / 9;
						object-fit: cover;
						box-shadow: 1px 1px 0px 1px rgba(0, 0, 0, 0.06);
						border-bottom: 24px solid #fffefe;
						border-color: #fff !important;
						border-top: 10px solid;
						border-right: 10px solid;
						 border-left: 10px solid;
						width: 160px;
						height: 180px;
						}
	
					}
				
				.mt {
					    position: absolute;
						bottom: 180px;
						right: -40px;
					
					.img3 {
						aspect-ratio: 14 / 9;
						object-fit: cover;
						box-shadow: 1px 1px 0px 1px rgba(0, 0, 0, 0.06);
						border-bottom: 24px solid #fffefe;
						border-color: #fff !important;
						border-top: 10px solid;
						border-right: 10px solid;
						 border-left: 10px solid;
						width: 160px;
						height: 180px;
						}
	
					}
				}
		}
	
}

#h3 { /*este es un ID del H3 de "nuestros hoteles"*/
    margin: 22px 0 58px;
}

@media (max-width: 420px) {
	.wrapper-full.home-body {
    & .desti3, .desti2, .desti1 {
        & .fotos {
            & .mf, .mc, .mt, .mr, .ms, .mm  {
                .img3, .img2  {
                    aspect-ratio: 14 / 9;
                    object-fit: cover;
                    box-shadow: 1px 1px 0px 1px rgba(0, 0, 0, 0.1);
                    border-bottom: 24px solid #fffefe;
                    border-color: #fff !important;
                    border-top: 5px solid;
                    border-right: 5px solid;
                    border-left: 5px solid;
                    width: 120px;
                    height: 120px;
                }
            }
        }
    }
	}
	.wrapper-full.home-body {
    & .desti2 {
        & .fotos {
            & .mm {
                .img3 {
                    aspect-ratio: 14 / 9;
                    object-fit: cover;
                    box-shadow: 1px 1px 0px 1px rgba(0, 0, 0, 0.1);
                    border-bottom: 24px solid #fffefe;
                    border-color: #fff !important;
                    border-top: 5px solid;
                    border-right: 5px solid;
                    border-left: 5px solid;
                    width: 128px;
                    height: 120px;
                }
            }
        }
    }
}
	.wrapper-full.home-body {
    & .destinos {
        & .fotos {
            p {
                position: absolute;
                bottom: 10px;
                left: 8px;
                font-size: 11px;
                font-family: "Barlow", sans-serif;
                font-weight: 500;
            }
        }
    }
}
}

@media (min-width:900px) {
	.wrapper-full.home-body {
    & .destinos {
        & .fotos {
            .img1 {
                /*aspect-ratio: 8 / 10;*/
				aspect-ratio: 11 / 10;
            }
        }
    }
}
}

.hoteles-home {
	margin: 0 0 64px;
	    padding: 0 0 20px;
	
	.wrapper {
		grid-template-columns: repeat(8, minmax(15px, 1fr));
		display: grid;
		gap: 24px;
		
		
		.hotel {
			    background-color: #ffffff;
				border: 12px solid #ffff;
				box-shadow: 1px 1px 5px #0000003d;
			
			img {
				aspect-ratio: 16 / 9;
                object-fit: cover;
			}
			
			.text {
				    padding: 0 4px 4px;
				h3 {
					font-family: "Barlow", sans-serif;
					font-size: 24px;
					font-weight: 400;
				}

				p {
					font-size: 14px;
					font-style: italic;
				}
				.adress {
					margin: 4px 0 -4px;
					font-size: 16px;
				}
				
				a {
					color:#5583a5;
					font-size:16px;
					cursor:pointer;
				}
				
				div {
					display: flex;
    				justify-content: space-between;
    				padding: 8px 0 0;
				}
			}
		}
		
		.h1 {
			grid-column: 1 / 9;
		}
		
		.h2 {
			grid-column: 1 / 9;
		} 
		
		.h3 {
			grid-column: 1 / 9;
		} 
		
		.h4 {
			grid-column: 1 / 9;
		} 
		
		.h5 {
			grid-column: 1 / 9;
		} 
		
		.h6 {
			grid-column: 1 / 9;
		}
	}
}

@media (min-width:725px) {
	.hoteles-home {
    & .wrapper {
        .h1 {
            grid-column: 1 / 5;
        }
		.h2 {
			grid-column: 5 / 9;
		}
		.h3 {
            grid-column: 1 / 5;
        }
		.h4 {
			grid-column: 5 / 9;
		}
		.h5 {
            grid-column: 1 / 5;
        }
		.h6 {
			grid-column: 5 / 9;
		}
    }
}
}

.hotel.h2 img {
	object-position: top;
}

@media (min-width:1306px) {
	.hoteles-home {
    & .wrapper {
		grid-template-columns: repeat(9, minmax(15px, 1fr));
        .h1 {
            grid-column: 1 / 4;
        }
		.h2 {
			grid-column: 4 / 7;
		}
		.h3 {
            grid-column: 7 / 10;
        }
		.h4 {
			grid-column: 1 / 4;
		}
		.h5 {
            grid-column: 4 / 7;
        }
		.h6 {
			grid-column: 7 / 10;
		}
    }
}
}

@media (min-width:650px) {
	.wrapper-full.home-body
	.destinos
	.fotos {
		    margin: 0px auto;
		    max-width: 614px;
	}
}

@media (min-width:900px) {
	.wrapper-full.home-body{
		margin: 32px auto;
		.destinos {
			display: flex;
			flex-flow: wrap;
			justify-content: space-around;
			gap: 21px;
			max-width:1600px;
			margin:56px auto 102px;
			align-items:center;
		
		.text {
			width: 40%;
		}
		.fotos {
			margin: 0;
		}

	}
	.desti1 {
			flex-direction:row-reverse;
		}
		
	}
	
}

.text-special {
	.text-intro {
		h3 {
			margin-top: 80px;
		}
	}
}


/*/////////////////////////////////////////////////////////////////////////////
////////////////////////////// Paginas de Hoteles//////////////////////////////
/////////////////////////////////////////////////////////////////////////////*/

/*/////////////////////////// Sultan ///////////////////////////*/

.text-intro {
	.text-intro_special { /*h3 especial en sutan y sultan apartamentos*/
		margin: 84px 0 16px;
	}
}


.wrapper-full.sultan {
	.wrapper-full.header {
		position: relative;
		height: 700px;
		display: flex;
		align-items:center;
		
			
			h1 {
				text-shadow: 0 0 5px #000000eb;
				span {
					font-family: "Barlow", sans-serif;
					font-size: 21px;
					line-height: 3;
					font-weight: 600;
					letter-spacing: 1px;
				}
			}
		}
		.wrap-video {
			    position: absolute;
    			inset: 0;
				height: 700px;
			
			video {
				height: 669px;
                object-fit: cover;
                object-position: bottom;
			}
			
			.desktop {
				display:none;
			}
			
			.mobile {
				height: 700px;
				object-fit: cover;
				object-position: bottom;
				width: 100%;
			}
		}
	}
	






.wrapper-full.hotel-2 {
	
	.display-hotel {
		max-width:1140px;
		margin:40px auto 82px;
		padding: 0 6%;
		.text {
			display: flex;
			flex-flow: wrap;
			margin:0 0 0;
			gap: 16px;
			/*align-items:center;*/
			justify-content: space-between;
			
			.titulo {
				    width: 100%;
				a {
					text-decoration:none;
				}
				
				h2 {
					font-size: 46px;
				}
				h3 {
					font-size: 24px;
					color: #5382a4;
    				font-family: 'Rancho';
				}
			}
			
			.parra {
				width: 100%;
				padding: 0 0 40px;
				line-height: 1.4;
				font-size:18px;
			}
		}
	}
	
	.imgs {
		position:relative;
		display:flex;
		flex-direction:column;
		gap:16px;
		margin:0 0 40px;
		
		div {
			display: flex;
			flex-flow: wrap;
			gap: 16px;
			
			img:nth-child(1) {
				width:100%;
				aspect-ratio: 8 / 3;
				object-fit: cover;
				object-position: 50% 80%;				
			}
			img:nth-child(2) {
				width:100%;
				aspect-ratio: 8 / 3;
				object-fit: cover;
				object-position: 50% 65%;			
			}
		}
		img {
			aspect-ratio: 8 / 5;
			object-fit: cover;
			object-position: 50% 54%;
		}
		
		.button {
				position: absolute;
				right: 20px;
				bottom: 20px;
				width: 154px !important;
				height: 40px;
				margin: 0;
				
				a {
					background: rgb(85 85 85 / 50%);
					-webkit-backdrop-filter: blur(5px);
					backdrop-filter: blur(5px);
					border: 2px solid rgb(255 255 255 / 60%);
					box-shadow: 2px 2px 10px rgb(255 255 255 / 41%);
					width: 154px;
					margin:0;
					color: white;
				}
			}
	}
}



.wrapper-full.hotel-2 {
	.display-hotel.spa {
		
		.imgs {
			img {
				object-position: 50% 90%;
				}
			    
			div {
				
				img:nth-child(2) {
					object-position: 50% 84%;
				}
			}
		}
	}
}

.wrapper-full.hotel-2 {
	.display-hotel.servicios {
		
		.text {
			   
			
			.titulo {
				
			}
		}
		.imgs {
			    
			
			img {
				object-position: 50% 70%;
				}
			    
			div {
				
				img:nth-child(2) {
					object-position: 50% 84%;
				}
			}
		}
	}
}
@media (min-width:770px) {
	.wrapper-full.hotel-2 {
		.display-hotel {
			padding: 0 6%;
			.imgs {
			flex-direction:row;
			
			div {
				width:50%;
			}
			
			> img {
				width:50%;
			}
		}
			
		

				.text {

				.titulo {
					width:40%;
				}
				.parra {
					width:55%;
					padding:0 0 24px;
				}
			}

	
		
		.apartamento {
		
		.text {
			    flex-direction: row-reverse;
			
			.titulo {
				text-align:right;
			}
		}
		.imgs {
			    flex-direction: row-reverse;
		}
	} 
		
		.spa {
		
		.text {
			    flex-direction: row-reverse;
			
			.titulo {
				text-align:right;
			}
		}
		.imgs {
			    flex-direction: row-reverse;
		}
	} 
		
		.spa {
		
		.text {
			    flex-direction: row-reverse;
			
			.titulo {
				text-align:right;
			}
		}
		.imgs {
			    flex-direction: row-reverse;
		}
	} 
}		
}
	
	.wrapper-full.sultan {
    & .wrap-video {
        .desktop {
            display: block;
			width:100%;
			height:720px;
        }
		.mobile {
			display:none;
			}
    	}
	}
}


@media (min-width:1225px) {
	.wrapper-full.hotel-2 {
		.display-hotel {
			padding: 0 ;
		}
	}
}



/*/////////////////////////// FIN Sultan ///////////////////////////*/

/*/////////////////////////// Fuengirola ///////////////////////////*/

.wrapper-full.fuengirola {
	.wrapper-full.header {
		position: relative;
		height: 700px;
		display: flex;
		align-items:center;
		
			
			h1 {
				text-shadow: 0 0 5px #000000eb;
				span {
					font-family: "Barlow", sans-serif;
					font-size: 21px;
					line-height: 3;
					font-weight: 600;
					letter-spacing: 1px;
				}
			}
		}
		.wrap-video {
			    position: absolute;
    			inset: 0;
				height: 700px;
			
			video {
				height: 669px;
                object-fit: cover;
                object-position: bottom;
			}
			
			.desktop {
				display:none;
			}
			
			.mobile {
				height: 700px;
				object-fit: cover;
				object-position: bottom;
				width: 100%;
			}
		}
	}

/*////////////////////////////////////////////////////////////////////////////////
////////////////////////////////// Apartamento //////////////////////////////////
///////////////////////////////////////////////////////////////////////////////*/

/*/////////////////////////// Sultan ///////////////////////////*/

.flex-apar {
	    display: flex;
    	flex-flow: wrap;
		margin:68px 0 0;
		max-width:1100px;
		gap:16px;
		margin:0 auto;
	
	.apartamentos {
		grid-template-columns: repeat(8, minmax(15px, 1fr));
		display: grid;
		gap: 12px;
		max-width:800px;
		margin:0 auto;

	div {
		border: 8px solid #ffff;
    	box-shadow: 1px 1px 5px #0000003d;
		
		img {
			aspect-ratio: 16 / 6;
			object-fit: cover;
			margin: 0 0 -8px;
		}
	}
	
		.apa1 {
			grid-column:1/9;
		}
		.apa2 {
			grid-column:1/9;
		}
		.apa3 {
			grid-column:1/9;
		}
		.apa4 {
			grid-column:1/9;
		}
		.apa5 {
			grid-column:1/9;
		}
	}
	
	.text-apartamento {
		margin:0 0 16px;
		
		h2 {
			font-family: "Barlow", sans-serif;
			text-transform: uppercase;
			letter-spacing: 7px;
			font-size: 32px;
			margin: 0 0 24px;
		}
	}
	
	.button {
		margin:0 auto;
		width:100%;
	}
	
	.button.desktop {
		display:none;
	}

}

.flex-apar.habs-air {
    margin: 100px auto 0;
}

@media (min-width:725px) {
	.flex-apar  {
		.apartamentos {
			.apa1 {
				grid-column: 1 / 9;
			}
			.apa2 {
				grid-column: 1 / 5;
			}
			.apa3 {
				grid-column: 5 / 9;
			}
			.apa4 {
				grid-column: 1 / 3;

				img {
					height:100%;
				}
			}
			.apa5 {
				grid-column: 3 / 9;
			}
		}
	}	
}

/*IMAGENES DEL REVES*/
@media (min-width:1176px) {
	.flex-apar {
		.text-apartamento {
			max-width:500px;
		}
		
		.apartamentos {
			max-width:500px;
		}
		
		.button {
			a {
				margin: -58px auto 180px 0;
			}
		}
	}
	
	.flex-apar:nth-child(2) {
		flex-direction: row-reverse; 
			.text-apartamento {
				   
			}
		
		.button {
			a {
				margin: -58px 0 180px auto;
			}
		}
	}
	
	.flex-apar:nth-child(4) {
		flex-direction: row-reverse; 
		.text-apartamento {
			
		}

		.button {
			a {
				margin: -58px 0 0 auto;
			}
		}
	}
}



.gallery {

}

.gallery img {
  cursor: pointer;
  border: 6px solid #fffefe;
  box-shadow: 0 1px 5px #0000006e;
}

.popup {
  display: none;
  justify-content: center;
  align-content: center;
  position: fixed;
  z-index: 99;
  padding-top: 50px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.9);
  animation: fadeIn 0.5s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.popup-content {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  animation: zoomIn 0.5s ease;
}

@keyframes zoomIn {
  from {
    transform: scale(0.5);
  }
  to {
    transform: scale(1);
  }
}

.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
  cursor: pointer;
}



/*/////////////////////////// FIN Sultan ///////////////////////////*/








/*////////////////////////////////////////////////////////////////////////////////
////////////////////////////////// OFERTAS //////////////////////////////////
///////////////////////////////////////////////////////////////////////////////*/


.wrapper-full.ofertas {
	.wrapper-full.header {
		     height: 700px;
			display: flex;
			align-items: center;
			position: relative;
		    margin: 0 0 40px;
		
		img {
			position: absolute;
			inset: 0;
			height: 700px;
			object-fit: cover;
		}
	}
}











/*///////////////////////////  Sultan ///////////////////////////*/

.wrapper.servicios {
	
	.servicio {
		display: flex;
		flex-flow:wrap;
    	justify-content: space-around;
		align-items: center;
		padding: 34px 0;
		
		.fotos {
			position: relative;
    		max-width: 500px;
			margin: 0px 24px 24px;
			
			
			img {
				max-width: 600px;
				aspect-ratio: 14 / 10;
				object-fit: cover;
			}
			
			.small-pic {
				aspect-ratio: 14 / 9;
				object-fit: cover;
				box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, 0.4);
				border-bottom: 24px solid #fffefe;
				border-color: #fff !important;
				border-top: 10px solid;
				border-right: 10px solid;
				border-left: 10px solid;
				width: 124px;
				height: 124px;
				position: absolute;
				bottom: -24px;
				right: -24px;
			}
		}
		.text {
    		padding: 16px;
			max-width:500px;
			
			h3 {
				font-family: "Barlow", sans-serif;
				font-size: 32px;
				font-weight: 400;
				line-height: 1;
			}
			h4 {
				font-family: 'Rancho';
				color: #5382a4;
				font-size: 20px;
    			padding: 10px 0 20px;
			}
		}
		
	}
	
	.servi1 {
		/*padding: 124px 0 64px;*/
	}
}

.servi-padding {
	padding: 32px 0 42px !important;
}





@media(min-width:1208px) {
	.wrapper.servicios {
		.servicio.servi2 {
			flex-direction: row-reverse;
		}
		.servicio.servi4 {
			flex-direction: row-reverse;
		}

		.servicio.servi6 {
			flex-direction: row-reverse;
		}
		.servicio.servi8 {
			flex-direction: row-reverse;
		}
		.servicio.servi10 {
			flex-direction: row-reverse;
		}
		.servicio {
			flex-flow: row;
			.fotos {
				min-width: 500px;
				.small-pic {
					width: 150px;
					height: 150px
				}
			}
			.text {
				max-width: 700px;
				width: 100%;
			}
		}
		
	}
}




/*////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////// Marbella //////////////////////////////////
///////////////////////////////////////////////////////////////////////////////*/

.wrapper-full {
	.header {
		height: 76vh;
    	display: flex;
    	align-items: center;
		background-color: #fffbf2;		
		
		.titulo-header {
			
			h1 {
				animation: opacity-text 2s ease-in-out;
				
				span {
					-webkit-text-stroke:0;
					
				}
			}

		}
		

		.wrap-video {
				position: absolute;
        		inset: 0;
				height:720px;
				video {
					position: absolute;
					object-fit: cover;
					width: 100%;
					aspect-ratio: 9 / 16;
					object-position: center;
					height: 82vh;
					animation: opacity-video 1.8s ease-in-out;
				}
			}
	}
}


/*////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////// RESERÑAS //////////////////////////////////
///////////////////////////////////////////////////////////////////////////////*/

.wrapper.reviews {
	/*margin:108px 0;*/
	
	h3 {
		text-align: center;
    	font-family: "Barlow", sans-serif;
    	padding: 0 0 16px;
	}
}

.wrapper.select-marbella {
	grid-template-columns: repeat(6, minmax(15px, 1fr));
	
	.h3 {
		grid-column: 1 / 7;
	}
	.h4 {
		grid-column: 1 / 7;
	}
}

@media (min-width:725px) {
	.wrapper.select-marbella {
		grid-template-columns: repeat(6, minmax(15px, 1fr));
		max-width: 1140px;
    	margin: 0 auto 48px;

		.h3 {
			grid-column: 1 / 4;
		}
		.h4 {
			grid-column: 4 / 7;
		}
	}
}

.wrapper.select-mar-menor {
	grid-template-columns: repeat(6, minmax(15px, 1fr));
	
	.h3 {
		grid-column: 1 / 7;
	}
}

@media (min-width:725px) {
	.wrapper.select-mar-menor {
		grid-template-columns: repeat(5, minmax(15px, 1fr));
		max-width: 1140px;
		margin: 0 auto 40px;

		.h3 {
			grid-column: 2 / 5;
		}
	}
}

.wrapper.select-fuengirola {
	grid-template-columns: repeat(6, minmax(15px, 1fr));
	
	.h3 {
		grid-column: 1 / 9;
	}
	.h4 {
		grid-column: 1 / 9;
	}
	.h5 {
		grid-column: 1 / 9;
	}
}

@media (min-width:725px) {
	.wrapper.select-fuengirola {
		grid-template-columns: repeat(9, minmax(15px, 1fr));
		margin: 0 auto 40px;


		.h3 {
			grid-column: 1 / 4;
		}
		.h4 {
			grid-column: 4 / 7;
		}
		.h5 {
			grid-column: 7 / 10;
		}
	}
}

@media (max-width: 350px) {
	.hoteles-home {
		.h1, .h2, .h3, .h4, .h5, .h6 {
		 width: 100%;
		}
		.wrapper {
			grid-template-columns: repeat(8, minmax(12px, 1fr));
		}
	}
}

@media (max-width: 350px) {
	.wrapper-full.home-body {
		.desti1, .desti2, .desti3 {
			.fotos {
				.mr, .ms, .mm, .mt, .mf, .mc {
					.img2, .img3 {
						width: 110px;
						height: 110px;
					}
				}
				.mt {
					bottom: 119px;
				}
			}
		}
	}
	.wrapper-full.home-body {
    	& .destinos {
        	& .fotos {
				p {
					font-size: 9px;
				}
			}
		}
	}
}

/*////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////// FOOTER //////////////////////////////////
///////////////////////////////////////////////////////////////////////////////*/

footer.wrapper{
	    margin: 40px 0 0;
	padding:25px 0% 47px;
	display: flex;
	flex-flow:wrap;
	justify-content:space-around;
    background-color: #5583a5;
	gap:16px;
	
	> div {
		min-width:275px;
		width:29%;
		
		div {
			
			
			img {
				width:21px;
				margin: 0px 0 -6px 0;
			}
			
		}
		a {
			color:#fff; 
			text-decoration: none;
			}
		h3 {
			color:#fff;
			font-family: 'Rancho';
            margin: 0 0 23px 0;
		}

	}
	.contacto {
		display: flex;
		flex-direction: column;
		justify-content: space-around;
		gap:4px;
		text-align:center;
		
		div {
			
			a {
				font-size:14px;
				text-decoration: none;
			}
		}
		
		> img {
			width: 100%;
            max-width: 110px;
            margin: -10px auto 0px;
		}
	}
	.legal {
		margin:21px 0 0;
		width:100%;
		text-align:center;
		
		p,
		a {
			font-size:12px;
		}
	}
	.rrss {
		display: flex;
		justify-content: center;
		gap: 16px;
		flex-flow: wrap;
		
		img {
				width:32px;
			}
		h3 {
			    width:100%;
				flex-flow: wrap;
				text-align: center;
			}
		.newsletter {
				width: 100%;
				display: flex;
				flex-flow: wrap;
			h4 {
				width: 100%;
    			color: #fff;
			}
			input {
				height: 33px;
				width: 80%;
				border-top-left-radius: 2px;
				border-top-right-radius: 0px;
				border-bottom-right-radius: 0px;
				border-bottom-left-radius: 2px;
				background-color: #f2f2f2;
				padding: 0 0 0 8px;
				margin: 0 0 10px;
				border:1px solid #f2f2f2;
			}
			button {
				margin:0;
				width: 20%;
				height: 33px;
				font-size: 14px;
				font-weight: 600;
				display: flex;
				align-items: center;
				justify-content: center;
				background-color: #5583a5;
				border:1px solid #f2f2f2 !important;
				color: #faf6ee;
				border: none;
				border-radius: 2px;
				font-family: "Barlow", sans-serif;
				transition: all 0.4s ease-in-out;
				letter-spacing: 1px;
				cursor: pointer;
				border-top-left-radius: 0px;
				border-top-right-radius: 2px;
				border-bottom-right-radius: 2px;
				border-bottom-left-radius: 0px;
			}
			}
		}
	}
	.hoteles {
		    display: flex;
			flex-direction: column;
			text-align: center;
			gap:4px;
		
		h3 {
			font-family: 'Rancho';
    		margin: 0 0 23px 0;
		}
		
		a {
			font-size:14px;
		}
	}
	
}

footer.wrapper .rrss .newsletter button {
	
}

	
/*////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////// CONTACTO //////////////////////////////////
///////////////////////////////////////////////////////////////////////////////*/


.wrapper-full.contacto {
	.header {
		height: 700px;
		display: flex;
		align-items: center;
		position: relative;
		margin:0 0 40px;
		
		video {
			 position: absolute;
			inset: 0;
			height: 700px;
			width: 100%;
			object-fit: cover;
		}
	}
}






.text-intro.wrapper {
	> p {
		a {
			color: #212529;
			text-decoration: none;
			font-size: 19px;
		}
	}
}
@media (min-width:1000px){
	.text-intro.wrapper{
		> p {
			a {
				font-size: 25px;
				text-decoration: none;
				color: #212529;
			}
		}
	}
}

.text-intro.wrapper {
	> p {
		.title-stl {
			text-decoration: underline;
			font-size: 19px;
		}
	}
}


.wrapper-full.general.contacto {
	
	margin-top: -29px;
	
	.wrapper.text-intro.aire-top {
		display: flex;
    	flex-flow: wrap;
		align-items:center;
		margin-top:30px;
		
		
		h2 {
			width:100%;
			font-family: "Barlow", sans-serif;
		}
		
		.para-conta {
			margin:24px 0 64px;
		}
		
		.text {
			width:45%;
			
			p {
				text-align: left;
    			font-size: 1.5rem;
			}
			
		}
		.data {
			width:45%;
			h3 {
				font-family: "Barlow", sans-serif;
				color: #000000; 
				text-align:left;
				font-size: 3rem;
			}
			
			.hotel {
				display: flex;
				flex-flow: column;
				gap: 0;
				margin: 0 0 32px;
				
				h4 {
				font-family: 'Rancho';
				color: #5382a4;
				font-size: 2rem;
				margin:0 0 8px;
				}
				
				a {
					text-decoration:none;
					padding:0 0 0 8px;
				}
			}
			
		}
	}
	img {
			aspect-ratio: 16 / 5;
			object-fit: cover;
		}
	
}




.from1 {
	display: flex;
	align-items: center;
    flex-flow: wrap;

	label {
		width: 100%;
		color: #2e2529;
		font-weight: 400;
		margin: 0 0 7px;
		font-family: 'Barlow';
	}
	
	.imgform {
		width: 100%;
    	position: relative;
    	margin: 20px 0;
	}
}	
@media (min-width:1000px){
	.from1 {
		display: flex;
		flex-direction: row;
		align-items: center;
		gap: 25px;
		flex-wrap: nowrap;
    margin: 40px 0 0;

		.imgform {
			width: 45%;
			position: relative;
			margin: 0 65px;	

			img {
				inset: 0;
                max-width: 573px;
                min-width: 415px;
				object-fit: cover;
				aspect-ratio: 18/18;
			}
		}
	}
}

@media (max-width:725px){
	.wrapper-full.general.contacto {
		& .wrapper.text-intro.aire-top {
			.data {
				width: 72%;
			}
		}
	}
	.wrapper-full.general.contacto {
		& .wrapper.text-intro.aire-top {
			.text {
				width: 73%;
			}
		}
	}
	.formconta {
		margin: 0 auto;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin-top: 13px;
		width: 100%;
	}
}

.formconta {
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 13px;
    width: 85%;

    h3 {
        text-align: left;
        margin: 0 0 16px;
		width:100%;
    }

    form {
        align-items: center;
		display: flex;
        flex-flow: column;
        width: 100%;


        select {
            width: 100%;
            border-radius: 3px;
            border: 1px #2125293b solid;
            background-color: #ffffff66;
            margin: 16px 0 16px;
			padding: 5px;
			color: black;
			height: 37px;
            font-family: 'Barlow';
            font-size: 18px;
            font-weight: 400;
        }

        label {
            font-size: 17px;
			
			input {
                width: 100%;
                border-radius: 3px;
                border: 1px #2125293b solid;
                background-color: #ffffff66;
                height: 32px;
            }

            textarea {
                width: 100%;
				height: 120px;
                border-radius: 3px;
                border: 1px #2125293b solid;
                background-color: #ffffff94;
            }
        }

        .buttonconta {
			margin-bottom: 17px;
			text-decoration: none;
			font-size: 14px;
			letter-spacing: 1px;
			margin: 32px auto;
			width: 124px;
			height: 40px;
			line-height: 39px;
			display: block;
			text-align: center;
			border: 2px solid #6381A1;
			font-weight: 600;
			font-style: italic;
			color: #6381A1;
			box-shadow: 0 4px 8px #6381a182;
			transition: all 0.5s ease-in-out;
			background-color: white;
			cursor: pointer;
        }
		.buttonconta:hover {
			letter-spacing: 1.5px;
			background-color: #6381A1;
			box-shadow: 0 8px 14px #6381a1d4;
			color: #fcf4f0;
		}
    }
}




/*/////////////////////////////////////////////////////////////////////////////
///////////////////////////////// Promociones ////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////*/

.wrapper-full.general.promociones{
	
	margin-top: -29px;
	
	.wapper-promo {
		margin: 172px 32px; 
		display: flex;
    	flex-flow: wrap;
		justify-content: space-around;
        gap: 21px;
		
		
		.promo {
			padding: 0 0 156px;
			position:relative;
			max-width:300px;
			
			.img {
				border: 8px solid #ffff;
            	box-shadow: 1px 1px 5px #0000003d;
				
				img {
					aspect-ratio: 8 / 6;
					object-fit: cover;
					margin: 0 0 -8px;
				}
			}
			
			.text {
				margin:0 8px;
				
				h2 {
					position:absolute;
					font-family: 'Rancho' !important;
					color: #5382a4;
					line-height:1;
					top: -37px;
                    font-size: 28px;
                    font-weight: 400;
				}
				
				h3 {
					color: #5382a4;
					letter-spacing: 2px;
					font-size: 14px;
					padding: 8px 0 0;
				}
				p {
					line-height: 1.4;
    				padding: 16px 0 0;
				}
			}
		}
	}
}



/*/////////////////////////////////////////////////////////////////////////////
////////////////////////// ESTILOS Form GIMH Menu Sticky///////////////////////
/////////////////////////////////////////////////////////////////////////////*/

.from-gimh.header2{
	margin: 0 auto 0;
    top: -156px;
	color:#000;
	position:relative;
	z-index:1;
	width: 70%;
	display: block;
}
@media only screen and (max-width: 1200px) {
	.from-gimh.header2 {
		width: 44%;
    	margin: 0 auto 0;
    	top: -118px;
	}
}

.from-gimh.header2 .custom-input-form {
	background-color: #e2ba30!important;
    color: #f5f5f5;
    height: 55px;
    margin: 21px 0 0px 18px;
    border-radius: 4px;
    font-weight: 500;
    font-family: 'Poppins';
    letter-spacing: 3px;
    width: 80%;
}
@media only screen and (max-width: 1200px) {
	.from-gimh.header2 .custom-input-form {
		font-weight: 400;
		width:100%;
		max-width:175px;
		margin: 21px 0 0px 24px;
	}
	.from-gimh.header2 .col-lg-2 {
		width:100%;
		max-width:175px;	
	}
}

@media only screen and (max-width: 430px) {
	.from-gimh.header2 .custom-input-form {
		margin: 21px 0 0px 16px;
	}
}

/*fieldset.form-group {
	background: #f7f7f7;
}*/

.from-gimh.header2 fieldset.form-group {
	padding: 31px 0px;
    border-radius: 0;
	border-right: 0;
	height: 95px;
}

.from-gimh.header2 .form-group.col-sm-12.col-md-6.col-lg-3.form-slide {
	border-left: 0px;
	width: 170px;
}

.from-gimh.header2 .form-group.col-sm-12.col-md-6.col-lg-2.form-slide {
	width: 150px;
}

.from-gimh.header2 label.label-form.custom-label-form {
	font-weight: 600;
    font-family: 'Poppins';
	font-size: 14px;
}

.from-gimh.header2 .col-md-3{
	width:90px;
	min-width:80px;
}


@media only screen and (max-width: 1200px) {
	.from-gimh.header2 fieldset {
		display:none;
	}
	.from-gimh.header2 .form-group-input.col-sm-12.col-md-12.col-lg-2.form-slide {
		display:block;
	}
}

/*/////////////////////////////////////////////////////////////////////////////
////////////////////////// ESTILOS Form GIMH Menu Sticky///////////////////////
/////////////////////////////////////////////////////////////////////////////*/


.menu.open {
	flex-direction: row;
	display:flex;
}

.menu.open .align {
	width:100%;
	background-color: #fcf4f0;
}

.menu.open .from-gimh.menu-colapse {
	width:30%;
	display:flex;
	height:100%;
	background-color: #fcf4f0;
	
	label {
		font-size: 24px
	}
	
	input {
		font-size: 20px;
	}
}
@media only screen and (max-width: 560px) {
	.menu.open .from-gimh.menu-colapse{
		display:none;
	}
}

.menu.open .from-gimh.menu-colapse .align-items-center {
	justify-content: center;
    width: 80%;
    margin: 0 auto;
	top: 214px;
    position: relative;
}

.menu.open .from-gimh.menu-colapse fieldset {
	width:100%;
}

.menu.open .from-gimh.menu-colapse .justify-content-center {
	flex-direction:column;
	position: absolute;
	top: 5%;
}

.menu.open .from-gimh.menu-colapse label.label-form.custom-label-form {
	font-size: 17px;
    cursor: pointer;
    font-weight: 400;
}

.menu.open .from-gimh.menu-colapse .custom-field-form {
	font-size:16px;
}


/*////////////////////////////////////////////////////////////////////////////////
///////////////////////////// ESTILOS GENERALES //////////////////////////////////
///////////////////////////////////////////////////////////////////////////////*/

/*///////////////////////// ESTILOS Menu /////////////////////////////////*/




.multi-menu {
    color: #e2ba30 !important;
    text-shadow: none !important;
    width: 100% !important;
    font-size: 24px !important;
    font-weight: 300 !important;
    max-width: 162px;
    height: 52px;
    padding: 9px 4px 0px 0;
    border-left: 1px solid #00000030;
    border-right: 1px solid #00000030;
    margin: 0 0px 0 0;
	z-index:999;
}
@media only screen and (max-width: 1200px) {
	.multi-menu {
		border:none;
	}
}

.full-wrapper .multi-menu p {
    width: 70px !important;
	position: relative;
    left: 18px;
    color: #e2ba30 !important;
    text-shadow: none !important;
    font-size: 24px !important;
    font-weight: 300 !important;
	margin:0 !important;
	letter-spacing: 4px;
	z-index:9999999999;
	
}
@media only screen and (max-width: 1200px) {
	.full-wrapper .multi-menu p {
		display:none;
	}
}


.menu-toggle {
    display: block;
    cursor: pointer;
    position: relative;
    z-index: 6;
    background-color: #f7f7f7;
    padding: 5px 10px;
    border-radius: 3px;
    width: 58px;
}

.menu-toggle span {
    display: block;
    width: 37px;
    height: 2px;
    background-color: #5482a4;
    margin: 8px 0;
    border-radius: 150px;
}

.menu {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffffff00;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	z-index: 4;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.5s ease-in-out;
}

.menu.open {
	opacity: 1;
	pointer-events: auto;
	background-color: #fcf4f0;
	z-index: 5;
}

.align.wrapper-full > ul{
	margin: 30px 0 0 47px;
}

.menu ul {
  list-style: none;
  padding: 0;
  margin: 0 0 0 40px;
  text-align: center;
}

@media(max-width:500px) {
	.menu ul {
		margin:0 0 0 20px;
	}
}

.menu li {
  padding: 11px 0 10px;
  opacity: 0;

}

li.move-me.space-top {
	padding-top: 22px;
}

.submenu2 {
	position: absolute;
    display: flex;
    top: 17%;
    left: 107%;
    flex-direction: column;
}

li.dropdown {
	flex-direction: column;
}

.menu .align li {
	display:none;
}

.menu.open li {
  opacity: 1;
  text-align:left;
  display:flex;
}


/*para que no se vea al quitarlo*/
.menu .from-gimh.menu-colapse {
	display:none;
}

.header-sticky .tele-header {
    width: 45px;
	height:100%;
   	text-align: center;
	margin: 4px 0 0;
    padding: 5px 5px;
    border: 2px solid #49688e;
    border-radius: 100%;
	z-index:99999999999;
}


@media only screen and (max-width: 1200px) {
	.header-sticky .tele-header {
		display:none;
	}
}

.header-sticky .tele-header img {
	width:28px;
	margin: -3px 0 0px 2px;
}

.tele-header {
	position: relative;
}

.tele-header a {
	position: absolute;
	left: -160px;
	opacity: 0;
	top: 8px;
	transition: opacity 0.5s ease;
	color: #49688E;
}

.tele-header:hover a {
	top: 8px;
	left: -160px;
	opacity: 1;
	transition: opacity 0.5s ease;
}


.header-sticky .idioma-header {
    width: 48px;
    text-align: center;
    padding: 5px 5px;
    border-radius: 100%;
	z-index:99999999999;
}

@media only screen and (max-width: 1200px) {
	.header-sticky .idioma-header {
		display:none;
	}
}


.footer .wp-block-site-logo img {
	margin: 0 0 0 -14px;
}


.from-gimh.menu-header input {
	width: 82px;
	height: 35px;
	font-size: 14px;
	color: black;
	font-weight: 800;
	margin: 0 18px 0 20px;
}

@media (min-width: 725px) {
	.from-gimh.menu-header input {
		width: 119px;
		height: 41px;
		font-size: 20px;
		color: black;
		font-weight: 800;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}

.center-menu-items {
	display:flex;
}

.menu-toggle span {
    display: block;
    width: 31px;
    height: 3px;
    background-color: #527fa1;
    margin: 6px 0;
    border-radius: 150px;
}

.menu-toggle {
    cursor: pointer;
    position: relative;
    z-index: 18;
    background-color: #f7f7f700;
    padding: 0px 0px;
    border-radius: 3px;
    margin-top: -1px;
    margin-left: 18px;
	display:inline-block;
}
.bar1, .bar2, .bar3 {
    width: 34px;
    height: 2px;
    background-color: #fff;
    margin: 6px 0;
    transition: 0.4s;
	 box-shadow:0 0px 1px 1px #ffffff94;
}

.change .bar1 {
    transform: translate(0, 17px) rotate(-45deg);
    background-color: #333!important;
    box-shadow: 0 0px 1px 1px #00000000;
}

.change .bar2 {
	opacity: 0;

}

.change .bar3 {
    transform: translate(0, 1px) rotate(45deg);
    background-color: #333!important;
}

.wrapper-full.sub-menu-wrapper {
	width: 100%;
	padding: 0 0.5rem;
	.sub-menu {
		list-style: none;
		display: flex;
		padding: 20px 10px;

		li {
			padding: 0 10px;
		}
	}
}





.menu-container::-webkit-scrollbar {
	display: none; 
}

.menu-item {
	flex: 0 0 150px;
	height: 53px;
	line-height: 55px;
	text-align: center;
	margin-right: 10px;
	position:relative;
	
	a {
		text-decoration:none;
		font-family: "Barlow", sans-serif;
		font-weight: 800;
		text-transform: uppercase;
		font-size: 16px;
		cursor:pointer;
	}
}


.menu-item:before {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	height: 30px;
	width: 0;
	transform: translate(-50%, -50%);
}

.header-sticky {
    position: fixed;
    z-index: 8;
    bottom: 0px;
    width: 100%;
    height: 66px;
    display: flex;
    transition: background-color 0.5s;
    justify-content: space-between;
    align-items: center;
	background-color: rgb(250, 246, 238);

	a {
		width: 100%;
		max-width: 175px;
		z-index:5;
	}  
	a {
		.logo {
			filter: drop-shadow(0 0px 3px #FFF);
			max-width: 135px;
            margin: 0 auto;
            display: block;
			 position: absolute;
			  top: 50%;
			  left: 50%;
			  transform: translate(-50%, -50%);
		}
	}
 }

.menu-container {
	position: absolute;
	z-index:1;
	display: flex;
	overflow-x: scroll !important;
	-ms-overflow-style: none;
	scrollbar-width: none; 
	background-color: #fffbf2;
	width: 100%;
	overflow: hidden; 
}

@media(max-width:700px){
	.home.menu-container {

	}
}


.menu-fixed { /*anclar menú arriba.*/
	margin:0;
	box-shadow: 0 0px 20px #3333332e;
	position: fixed; 
	z-index:2;
	top:0;
	width:100%;
	max-width:1000px;
}

@media(min-width:780px) {
	.menu-container {
		margin:0;
		max-width: 100% !important;
    	justify-content: center !important;
	}
}

@media (min-width:725px) {
	.menu-fixed { /*anclar menu arriba*/
        top: 70px;
		left: 50%;
        transform: translate(-50%, 0%);
	}
    .header-sticky {
			top: 0px !important;
			position: fixed;
			z-index: 10;
			bottom: 0px;
			width: 100%;
			height: 71px;
			display: flex;
			transition: background-color 0.5s;
			justify-content: space-between;
			align-items: center;
			background-color: rgb(250 246 238 / 0%);
		
		.menu-toggle {
			cursor: pointer;
			position: relative;
			z-index: 6;
			background-color: #f7f7f700;
			padding: 0px 0px;
			border-radius: 3px;
			margin-top: -1px;
			margin-left: 48px;
		}
		
		input {
			width: 119px;
			height: 42px;
			font-family: "Barlow", sans-serif;
			font-size: 19px;
			color: black;
			font-weight: 800;
		}

		}
		
	}


.promociones-text {
	padding: 0px 0 20px 0px;
}

.promociones-special {
	 margin: 30px auto 64px !important;
}
@media(max-width:724px) {
	.header-sticky {
    & a {
        .logo {

            left: 50%;
			 width: 55px;

        }
    }
}
}
@media(max-width:550px) {
	.header-sticky {
    & a {
        .logo {

            

        }
    }
}
}

.imagen-larga.wrapper {
	
	.prueba {
		aspect-ratio: 7 / 3;
    object-fit: cover;
	}
}

@media(max-width:750px){
	.imagen-larga.wrapper {

		.prueba {
			aspect-ratio: 7 / 4;
		object-fit: cover;
		}
	}
}

/*//// Estilos Fancybox ////*/

.fancybox-inner .fancybox-navigation {
	.fancybox-button--arrow_left {
		left: 10% ;
	}
	.fancybox-button--arrow_right {
		right: 10%;
	}
}

@media(max-width: 1350px) {
	.fancybox-inner .fancybox-navigation {
	.fancybox-button--arrow_left {
		left: 5% ;
	}
	.fancybox-button--arrow_right {
		right: 5%;
	}
}
}
	
	@media(max-width: 1240px) {
	.fancybox-inner .fancybox-navigation {
	.fancybox-button--arrow_left {
		left: 0% ;
	}
	.fancybox-button--arrow_right {
		right: 0%;
	}
}
}


 .maps-center {
            display: flex;
            justify-content: center; 
            align-items: center;    
	 		margin: 0 0 50px;


	 iframe {
		 border: 0;  
		 width: 75%; 

	 }
}

@media(min-width: 700px) {
	.no-break {
    	white-space: nowrap;
	}
}







