@charset "utf-8";
/* CSS Document */

/*
SITIO WEB CREADO POR RAM ALF | MARCO ANTONIO RAMÍREZ ALFARO
PÁGINA WEB DEL AUTOR: www.ramalf.com
CLIENTE: XALI MEXICO
*/


/* RESET DE ESTILOS */
*{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	text-decoration: none;
}

a{ text-decoration: none; }

html{ scroll-behavior: smooth; }

/* FONTS ----------------------------------------------------------------------------------------*/

.ralewayLight, h3, footer{
	font-family: 'Raleway', sans-serif; font-weight: 300;
}

.ralewayRegular, h4, p, input, textarea{
	font-family: 'Raleway', sans-serif; font-weight: 400;
}

.ralewayExtraBold{
	font-family: 'Raleway', sans-serif; font-weight: 800;
}

.ralewayBlack, h1{
	font-family: 'Raleway', sans-serif; font-weight: 900;
}

/* NAV ----------------------------------------------------------------------------------------*/

nav{
	width: 100%;
	height: 85px;
	background-color: white;
	position: fixed;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	z-index: 100;
	font-family: 'Raleway', sans-serif; font-weight: 300;
	padding: 0 75px;
	transition: all 1s ease;
}

nav .logoXali{
	width: 90px;
	display: block;
}

nav > .ralewayLight{
	font-size: 13px;
	color: #010101;
	padding: 30px 13px;
	letter-spacing: 1px;
	transition: all .3s ease;
}

nav > .ralewayLight:hover{
	background-color: #D14B4A;
	color: white;
}

nav ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
}

nav ul li{
	display: inline-block;
	width: 120px;
	/*height: 85px;*/
	text-align: center;
	line-height: 85px;
	position: relative;
}

nav ul li a{
	font-size: 13px;
	color: #010101;
	letter-spacing: 1px;
	transition: all .3s ease;
	text-transform: uppercase;
}

nav ul li a:hover{
	color: #D14B4A;
	font-family: 'Raleway', sans-serif; font-weight: 800;
}

nav ul ul{
	opacity: 0;
	visibility: hidden;
	position: absolute;
	top: 80px;
	background-color: white;
	transition: all .3s ease;
}

nav ul li:hover > ul {
	opacity: 1;
	visibility: visible;
}

nav ul li ul li{
	display: block;
	text-align: center;
	width: 195px;
/*height: 40px;*/
	line-height: 40px;
}


nav ul ul li ul{
	left: 195px;
	top: 0;
}

 /*http://seorave.com/style-wordpress-menus-dropdowns/*/

.redSocial img{
	width: 18px;
	opacity: .5;
	transition: all .3s ease;
}

.redSocial img:hover{
	opacity: 1;
}

.redSocial{
	margin: 0 10px;
}

.cerrarMenuMobile{
	width: 100%;
	height: 60px;
	background: transparent;
	border: none;
	color: #010101;
	display: none;
}

.abrirMenuMobile{
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 99;
	width: 60px;
	height: 60px;
	font-size: 20px;
	border: none;
	color: white;
	background: transparent;
	display: none;
}

.aparecerMenu{
	opacity: 1;
	visibility: visible;
}

/* HERO SECCION ----------------------------------------------------------------------------------------*/

.heroSeccion{
	width: 100%;
	height: 720px;
	background-color: #3DA3BF;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.carruselHero{
	width: 100%;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.carruselItem{
	width: 100%;
	height: 800px;
	display: flex !important;
	justify-content: center;
	align-items: center;
	position: relative;
	overflow: hidden;
}

.imgHero{
	display: block;
	width: 100%;
}

.carruselTexto{
	width: 90%;
	margin: auto;
  position: absolute;
	color: white;
}

.carruselTexto h2{
	font-size: 80px;
	letter-spacing: 5px;
	text-align: center;
}

.carruselTexto h3{
	font-size: 30px;
	line-height: 30px;
	letter-spacing: 3.5px;
	text-align: center;
}

.heroSeccion .slick-dots li button:before{ top: 0px; }

.heroSeccion .slick-dots{ bottom: 12%; }

/* PAQUETES SECCION ----------------------------------------------------------------------------------------*/

.paquetesSeccion{
	background-color: #3DA3BF;
	width: 100%;
	color: white;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.paquetesSeccion h2{
	font-size: 40px;
	letter-spacing: 5px;
	margin-top: 70px;
	text-align: center;
}

.paquetesSeccion h3{
	font-size: 20px;
	letter-spacing: 3px;
	margin-bottom: 50px;
}

.carruselPaquetes{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

.carruselPaquetesItem{
	text-align: center;
	margin: 0 0;
	width: 33%;
	position: relative;
}

.carruselPaquetesItem img{
	width: 100%;
	display: block;
}

.ciudadPaquete{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}

.ciudadPaqueteTxt{
	width: 100%;
	background-color: rgba(0, 0, 0, .4);
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	bottom: 0;
}

.ciudadDestino{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 100%;
	opacity: 0;
	visibility: hidden;
	transition: all .5s ease;
	z-index: 999;
	background-color: #2D899E;
}

.carruselPaquetesItem:hover .ciudadDestino{
	opacity: 1;
	visibility: visible;
}

.ciudadDestino ul{
	list-style-type: none;
  margin: 0;
  padding: 0;
	color: white;
	font-size: 14px;
	letter-spacing: 1px;
	width: 100%;
	text-transform: uppercase;
}

.ciudadDestino li{
	line-height: 40px;
	width: 100%;
	transition: all .3s ease;
}

.ciudadDestino a{
	color: white;
}

.carruselPaquetesItem h4{
	font-size: 15px;
	letter-spacing: 1px;
	color: white;
}

.amenidades{
	margin: 100px 0 118px;
	font-size: 13px;
	letter-spacing: 1.3px;
	display: flex;
}

.amenidad{
	margin: 0 60px;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.amenidad img{
	width: 50px;
	margin-bottom: 25px;
}

/* EXPERIENCIA VIDEO ----------------------------------------------------------------------------------------*/

.experienciaVideoSeccion{
	background-color: #70108E;
	display: flex;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.experienciaVideoSeccion article{
	width: 50%;
}

.experienciaIzq{
	height: 674px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.experienciaIzqImg{
	width: 100%;
	display: block;
}

.experienciaDer{
	display: flex;
	flex-direction: column;
	align-items: center;
	color: white;
	height: 674px;
}

.experienciaDer h3{
	margin-top: 137px;
	letter-spacing: 3px;
	font-size: 20px;
}

.experienciaDer h2{
	font-size: 40px;
	letter-spacing: 5px;
}

.videoExperiencia{
	max-width: 500px;
	width: 90%;
	margin: 47px 0 138px;
}

/* DESTINOS ----------------------------------------------------------------------------------------*/

.destinosSeccion{
	background-color: #FFC56D;
	height: 674px;
	display: flex;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.destinosIzq{
	width: 50%;
	color: white;
	display: flex;
	justify-content: center;
	align-items: center;
}

.destinosIzq div{
	width: 380px;
}

.destinosIzq h3{
	letter-spacing: 3px;
	font-size: 20px;
	text-align: center;
}

.destinosIzq h2{
	font-size: 40px;
	letter-spacing: 5px;
	margin-bottom: 30px;
	text-align: center;
}

.destinosIzq p{
	font-size: 15px;
	letter-spacing: 1.3px;
	line-height: 30px;
}

.destinosDer{
	width: 50%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	cursor: grab;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.destinosDer:active{ cursor: grabbing; }

.carruselDestinos{
	display: flex;
	width: 100%;
}

.destinosItem{
	height: 385px;
	margin: 0 8px;
	color: white;
	display: flex !important;
	justify-content: center;
	align-items: center;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.destinosItem img{
	height: 100%;
	display: block;
	transition: all .3s ease;
}

.destinosItem p{
	position: absolute;
	bottom: 30px;
	-webkit-transform: translateY(50px);
	transform: translateY(50px);
	transition: all .3s ease;
}

.destinosItem:hover img{
	-webkit-filter: brightness(40%);
	filter: brightness(40%);
}

.destinosItem:hover p{
	-webkit-transform: translateY(0);
	transform: translateY(0);
}

.destinosSeccion .slick-dots{
	width: auto;
}

/* ACTIVIDADES ----------------------------------------------------------------------------------------*/

.actividadesSeccion{
	background-color: #D14B4A;
	height: 853px;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	color: white;
	position: relative;
}

.actividadesSeccion h2{
	font-size: 40px;
	letter-spacing: 5px;
	margin-top: 83px;
}

.actividadesSeccion h3{
	letter-spacing: 3px;
	font-size: 20px;
}

.actividades{
	width: 100%;
	display: flex;
	justify-content: space-between;
}

.actividadItem{
	width: 33%;
	height: 633px;
	margin-top: 66px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.actividadImg{
	display: block;
	transition: all .3s ease;
	width: 100%;
}

.actividadImgAlto{
	height: 100%;
	width: auto;
}

.actividadImgAncho{
	width: 100%;
	height: auto;
}

.textoActividad{
	position: absolute;
	bottom: 70px;
	text-align: center;
	font-size: 15px;
	letter-spacing: 1.3px;
	transition: all .6s ease;
	opacity: 0;
	-webkit-transform: translateY(120px);
	transform: translateY(120px);
}

.actividadItem:hover .textoActividad{
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}

.actividadItem:hover img{
	-webkit-filter: brightness(40%);
	filter: brightness(40%);
}

.nombreActividad{
	font-size: 20px;
}

/* HOSPEDAJE ----------------------------------------------------------------------------------------*/

.hospedajeSeccion{
	width: 100%;
	height: 674px;
	background-color: white;
	background: url('../img/bg-hospedaje.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	display: flex;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.hospedajeDer{
	width: 43%;
	color: #010101;
	display: flex;
	justify-content: center;
	align-items: center;
}

.hospedajeDer div{
	width: 380px;
}

.hospedajeDer h3{
	letter-spacing: 3px;
	font-size: 20px;
	text-align: center;
}

.hospedajeDer h2{
	font-size: 40px;
	letter-spacing: 5px;
	margin-bottom: 30px;
	text-align: center;
}

.hospedajeDer p{
	font-size: 15px;
	letter-spacing: 1.3px;
	line-height: 30px;
}

.hospedajeIzq{
	width: 57%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
	cursor: grab;
}

.hospedajeIzq:active{ cursor: grabbing; }

.carruselHospedaje{
	display: flex;
	width: 100%;
}

.carruselHospedajeItem{
	width: 260px;
	height: 385px;
	margin: 0 8px;
	color: white;
	display: flex !important;
	justify-content: center;
	align-items: center;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.carruselHospedajeItem img{
	height: 100%;
	display: block;
	transition: all .3s ease;
}

.carruselHospedajeItem p{
	position: absolute;
	bottom: 30px;
	-webkit-transform: translateY(80px);
	transform: translateY(80px);
	text-align: center;
	transition: all .3s ease;
}

.carruselHospedajeItem:hover img{
	-webkit-filter: brightness(40%);
	filter: brightness(40%);
}

.carruselHospedajeItem:hover p{
	-webkit-transform: translateY(0);
	transform: translateY(0);
}

.hospedajeSeccion .slick-dots {
  width: auto;
	right: 0;
}

.hospedajeSeccion .slick-dots li button:before{
		opacity: .5;
		color: #010101; /* DOTS NO ACTIVOS ------------------------------------------------*/
}
.hospedajeSeccion .slick-dots li.slick-active button:before{
    opacity: 1;
    color: #010101; /* DOTS ACTIVOS ------------------------------------------------*/
}

/* OPINIONES ----------------------------------------------------------------------------------------*/

.opinionesSeccion{
	width: 100%;
	background-color: black;
	background: url('../img/bg-opinion.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	color: white;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.opinionesSeccion h3{
	letter-spacing: 3px;
	font-size: 20px;
	text-align: center;
}

.opinionesSeccion h2{
	font-size: 40px;
	letter-spacing: 5px;
	margin-top: 63px;
	text-align: center;
}

.opiniones{
	width: 90%;
	display: flex;
	justify-content: space-between;
	margin-top: 120px;
}

.estrellas{
	display: flex;
	margin-bottom: 14px;
}

.estrellas img{
	width: 20px;
	height: 19px;
	margin: 0 5px;
}

.opinionHijo{
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 30%;
	margin-bottom: 63px;
}

.personaOpinion{
	font-size: 15px;
	margin-bottom: 20px;
}

.textoOpinion{
	font-size: 13px;
	line-height: 30px;
	text-align: center;
	font-style: italic;
}

/* CONTACTO ----------------------------------------------------------------------------------------*/

.contactoSeccion{
	width: 100%;
	height: 705px;
	background-color: #3DA3BF;
	color: white;
	display: flex;
}

.contactoIzq{
	width: 40%;
	padding: 0 5%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.contactoIzq h3{
	letter-spacing: 3px;
	font-size: 20px;
	margin-bottom: 20px;
}

.contactoIzq h2{
	font-size: 40px;
	letter-spacing: 5px;
}

.contactoDer{
	width: 40%;
}

.formularioContacto{
	width: 100%;
}

.formularioContacto input[type="text"], .formularioContacto input[type="email"], .formularioContacto textarea{
	width: 100%;
	height: 40px;
	margin: 20px 0;
	background-color: transparent;
	border: none;
	border-bottom: 1px solid white;
	color: white;
	letter-spacing: 1px;
}

.formularioContacto input:focus, .formularioContacto textarea:focus{
	border: none;
	border-bottom: 3px solid white;
}

.formularioContacto textarea{
	padding: 6px 0 0;
	height: 70px;
	min-width: 100%;
	max-width: 100%;
	max-height: 200px;
	min-height: 70px;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: white;
	font-size: 13px;
	letter-spacing: 1px;
}
::-moz-placeholder { /* Firefox 19+ */
	color: white;
	font-size: 13px;
	letter-spacing: 1px;
}
:-ms-input-placeholder { /* IE 10+ */
	color: white;
	font-size: 13px;
	letter-spacing: 1px;
}
:-moz-placeholder { /* Firefox 18- */
	color: white;
	font-size: 13px;
	letter-spacing: 1px;
}

#enviar, .enviarXali{
	width: 50%;
	height: 40px;
	background-color: transparent;
	color: white;
	border: solid 1px white;
	cursor: pointer;
	letter-spacing: 1.3px;
	font-size: 15px;
	margin-bottom: 50px;
	transition: all .3s ease;
}

#enviar:hover, .enviarXali:hover{
	background-color: white;
	color: #3DA3BF;
}

.contactoSeccion a{
	color: white;
}

.contactoSeccion p{
	margin-top: 10px;
	font-size: 14px;
	letter-spacing: 1.3px;
}

.contactoDer, .contactoCentro{
	width: 30%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.imgContactoCentro{
	display: block;
	width: 100%;
}

/* FOOTER ----------------------------------------------------------------------------------------*/

footer{
	background-color: white;
	width: 100%;
	height: 120px;
	padding: 0 5%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

footer img{
	width: 90px;
}

.footerCentro{
	display: flex;
	flex-direction: column;
	align-items: center;
}

.footerCentro a, .footerDer a{
	color: #010101;
	font-size: 10px;
	margin: 10px 0;
	letter-spacing: 1.3px;
}

.footerCentro p{
	color: #010101;
	font-size: 12px;
	letter-spacing: 1.3px;
}

.footerDer{
	text-align: right;
}

/* PATTERN ----------------------------------------------------------------------------------------*/

.patternXali{
	position: absolute;
	opacity: .5;
}

.patternPaquetes{
	height: 400px;
	width: auto;
	right: 0;
	top: 0;
}

.patternExperiencia{
	height: 100%;
	width: auto;
	right: 4.53%;
}

.patternDestinos{
	height: 100%;
	width: auto;
	left: 30%;
}

.patternActividades{
	height: 100%;
	width: auto;
	left: 6.5%;
}

/* VIDEO ----------------------------------------------------------------------------------------*/

.xaliVideo{
	width: 100%;
	box-shadow: 6px 6px 10px 0px rgba(0, 0, 0, 0.4);
}

.xaliVideo .vjs-control-bar{
	background: rgba(112, 16, 142, .5);
}

.xaliVideo .vjs-big-play-button{
	background: rgba(112, 16, 142, .3);
	width: 80px;
	height: 80px;
	line-height: 80px;
	border-radius: 100%;
	border: none;
}

.xaliVideo:hover .vjs-big-play-button{
	background: rgba(112, 16, 142, .6);
}

.xaliVideo .vjs-big-play-button:hover{
	background: rgba(112, 16, 142, .8);
}

/* EXPLICACION AMENIDADES ----------------------------------------------------------------------------------------*/
.explicacionAmenidad{
	background-color: white;
	width: 100%;
	height: 90px;
	position: absolute;
	bottom: 0;
	padding: 0 10%;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #3DA3BF;
	text-align: center;
	visibility: hidden;
	opacity: 0;
	transition: all .3s ease;
}

.explicacionAmenidadMostrar{
	visibility: visible;
	opacity: 1;
}

/* HERO PAG ----------------------------------------------------------------------------------------*/
/*header{
	width: 100%;
	height: 750px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
	background-color: #3DA3BF;
}

header img{
	width: 100%;
	height: auto;
}

.tituloPag{
	position: absolute;
	color: white;
	font-size: 40px;
	letter-spacing: 3px;
	bottom: 0;
	width: 100%;
	height: 300px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 70px 0 0;
background: rgba(0,0,0,0);
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 73%, rgba(0,0,0,0.7) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(73%, rgba(0,0,0,0.7)), color-stop(100%, rgba(0,0,0,0.7)));
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 73%, rgba(0,0,0,0.7) 100%);
background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 73%, rgba(0,0,0,0.7) 100%);
background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 73%, rgba(0,0,0,0.7) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 73%, rgba(0,0,0,0.7) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );

}

/* CUERPO PAG Y SHOP ----------------------------------------------------------------------------------------*/

/*.cuerpoPrincipal{
	width: 100%;
	background-color: #3DA3BF;
	display: flex;
	flex-wrap: wrap;
}

aside{
	width: 20%;
	margin: 70px 0;
	color: white;
	padding: 50px 2% 0;
}

aside p{
	font-size: 19px;
	height: 30px;
	letter-spacing: 1px;
	border-style: solid;
	border-width: 2px;
	border-top: 0;
	border-right: 0;
	border-left: 0;
	border-color: white;
}

.categoriasBarra{
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	margin: 20px 0;
	margin-bottom: 70px;
}

.categoriasBarra a{
	color: white;
	font-size: 15px;
	letter-spacing: 1px;
	padding: 15px 0 15px 15px;
	border-style: solid;
	border-width: .5px;
	border-top: 0;
	border-right: 0;
	border-left: 0;
	border-color: white;
	transition: all .8s ease;
}

.categoriasBarra a:hover{
	color: #3DA3BF;
	background-color: white;
}

.tiendaObjetos{
	width: 80%;
	margin: 70px 0 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.tiendaObjetos100{
	width: 100%
}

.tiendaObjeto{
	width: 30%;
	margin: 0 1.5% 70px;
}

.tiendaObjeto a img{
	width: 100%;
}

.tiendaObjeto a h4{
	text-align: center;
	font-size: 15px;
  letter-spacing: 1px;
  margin-top: 35px;
  color: white;
}

/* PRODUCTO ----------------------------------------------------------------------------------------*/
.cuerpoPagDestino{
	margin-bottom: 50px;
	width: 100%;
	padding: 0 10%;
}

.carruselHeroDestino{
	width: 100%;
	position: relative;
	-webkit-overflow: hidden;
	overflow: hidden;
}

.tituloPagDestino{
	position: absolute;
	width: 100%;
	top: 50%;
	text-align: center;
	font-size: 50px;
  letter-spacing: 5px;
	color: white;
	padding: 0 5%;
	text-transform: uppercase;
}

/* PRODUCTO INFO ADICIONAL ----------------------------------------------------------------------------------------*/

.infoAdicional{
	width: 100%;
	background-color: #70108E;
	color: white;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.infoAdicionalCuerpo{
	width: 95%;
	max-width: 1000px;
	margin: 50px 0;
}

.infoAdicionalCuerpo h2{
	font-size: 30px;
	letter-spacing: 1.3px;
	margin-bottom: 20px;
}

.informacionXali{
	width: 100%;
	border-style: solid;
	border-color: white;
	border-width: .5px;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	display: flex;
	flex-wrap: wrap;
}

.informacionXali span{
	height: 50px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: 15px 0 15px 15px;
}

.informacionIzq{
	width: 15%;
	min-width: 180px;
}

.informacionDer{
	width: auto;
	min-width: 275px;
}

#actividadesProducto{
	height: auto;
	flex-wrap: wrap;
}

#actividadesProducto .destinosIzq div{
	width: 90%;
	margin: 100px 0;
}

#actividadesProducto .destinosDer{
	display: flex;
	flex-wrap: wrap;
	cursor: auto;
	justify-content: space-between;
  align-items: center;
}

#actividadesProducto .destinosDer img{
	width: 49.5%;
}

#itinerario{
	height: auto;
	padding: 50px 0;
}

#itinerario h2{
	margin: 0 !important;
}

#itinerario .formularioContacto{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

#itinerario form{
	width: 95%;
	max-width: 500px;
}

#itinerario .formularioContacto input[type="text"], #itinerario .formularioContacto input[type="email"], #itinerario #enviar{
	width: 95%;
	max-width: 500px;
}

#itinerario #enviar{
	margin: 0;
}

/* ENTRADA LOGO ----------------------------------------------------------------------------------------*/

.entradaLogo{
	position: fixed;
	z-index: 1000;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: white;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	opacity: 0;
	visibility: hidden;
	animation: salidaLogo 3s ease;
}

@keyframes salidaLogo{
	0%{
		opacity: 1;
		visibility: visible;
	}

	75%{
		opacity: 1;
	}

	100%{
		opacity: 0;
		visibility: hidden;
	}
}

.entradaLogo img{
	width: 80%;
	max-width: 500px;
	opacity: 0;
	animation: entradaLogo 3s ease;
}

@keyframes entradaLogo{
	0%{
		opacity: 0;
		-webkit-ransform: scale(.8);
		transform: scale(.8);
	}

	25%{
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}

	50%{
		opacity: .7;
	}

	75%{
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}

	100%{
		opacity: 0;
		-webkit-ransform: scale(.8);
		transform: scale(.8);
	}
}

/* PC GRANDE ----------------------------------------------------------------------------------------*/
@media all and (max-width: 3039px){
	.actividadImg{
		width: auto;
		height: 100%;
	}
}

@media all and (max-width: 2158px){
	.experienciaIzqImg{
		width: auto;
		height: 100%;
	}
}

@media all and (max-width: 1590px){
	.imgContactoCentro{
		width: auto;
		height: 100%;
	}
}

@media all and (max-width: 1230px){
	/* NAV ----------------------------------------------------------------------------------------*/

	nav{ padding: 0 3%; }

	/* HERO ----------------------------------------------------------------------------------------*/

	.imgHero{
		width: auto;
		height: 100%;
	}

	/* CUERPO PAG Y SHOP ----------------------------------------------------------------------------------------*/

	/*aside{ width: 30%; }

	.tiendaObjetos{ width: 70%; }

	.tiendaObjeto{ width: 45%; }

	/* HERO PAG ----------------------------------------------------------------------------------------*/
	/*header{	height: 680px; }

	/* PRODUCTO ----------------------------------------------------------------------------------------*/
	.productoIzq div{
		width: 90%;
	}

	#actividadesProducto .destinosIzq div{
		width: 90%;
		margin: 70px 0;
	}

}
/* PC CHICA ----------------------------------------------------------------------------------------*/

@media all and (max-width: 1060px){

	/* NAV ----------------------------------------------------------------------------------------*/

	nav{ padding: 0 3%; }

	nav ul li{ width: 90px; }

	nav ul li a{ font-size: 12px; }

	nav ul li ul li{ width: 180px; }

	nav ul ul li ul{ left: 180px; }

	/* HERO ----------------------------------------------------------------------------------------*/

	.carruselTexto h2 {
    font-size: 55px;
		line-height: 55px;
	}

	.carruselTexto h3 {
    font-size: 20px;
    line-height: 20px;
	}

	/* HERO PAG ----------------------------------------------------------------------------------------*/
	/*header img{ width: auto; height: 100%; }

	.tituloPag{ font-size: 28px; padding: 70px 5% 0;}

	/* PRODUCTO ----------------------------------------------------------------------------------------*/
	#actividadesProducto .destinosIzq div{
		margin: 50px 0;
	}

	.tituloPagDestino{
		font-size: 40px;
	  letter-spacing: 5px;
	}
}

/* MOBILE ----------------------------------------------------------------------------------------*/

@media all and (max-width: 850px){
	/* NAVEGACION ----------------------------------------------------------------------------------------*/

	nav{
		width: 100%;
		height: 100vh;
		flex-direction: column;
		align-items: center;
		opacity: 0;
		visibility: hidden;
		justify-content: flex-start;
		overflow: auto;
	}

	nav .logoXali{
		margin: 0;
	}

	nav > .ralewayLight{
		width: 100%;
		text-align: center;
	}

	nav ul, nav ul li, nav ul li ul li{ width: 100% }

	nav ul li{
		display: block;
		/*height: 50px;*/
		line-height: 50px;
	}

	nav ul ul{
		position: relative;
		top: 0;
		display: none;
	}

	nav ul li:hover > ul {
		display: block;
	}

	nav ul ul li ul{
		left: 0;
	}

	nav div{ margin: 10px 0; }

	nav ul ul li.menu-item-has-children::after{
		content: url(../img/derecha.png);
		position: absolute;
		right: 0px;
		top: 0;
	}

	nav li.menu-item-has-children::after {
		content: url(../img/abajo.png);
		position: absolute;
		right: 0px;
		top: 0;
	}

	.facebookX{
		margin: 0;
	}
	.redSocial{
		margin: 15px 10px;
	}

	.cerrarMenuMobile{
		display: block;
	}

	.abrirMenuMobile{
		display: block;
	}

	/* PATTERN ----------------------------------------------------------------------------------------*/

	.patternXali{ opacity: .2;}

	/* HERO ----------------------------------------------------------------------------------------*/

	.carruselTexto h2 {
    font-size: 40px;
		line-height: 40px;
		letter-spacing: 2px;
	}

	.carruselTexto h3 {
    font-size: 15px;
    line-height: 15px;
	}

	.heroSeccion, .carruselItem {
    height: 560px;
	}

	/* PAQUETES ----------------------------------------------------------------------------------------*/
	.paquetesSeccion h2{ margin-top: 50px; }

	.paquetesSeccion h3{ margin-bottom: 50px; }

	.ciudadDestino ul{ font-size: 13px;}

	.amenidades{
		width: 100%;
		margin: 50px 0;
		flex-wrap: wrap;
		justify-content: center;
		align-content: center;
	}

	.amenidad{
		margin: 30px 20px;
	}

	.carruselPaquetesItem{
		width: 100%;
	}

	/* EXPERIENCIA ----------------------------------------------------------------------------------------*/

	.experienciaVideoSeccion article{ width: 100%; }

	.experienciaVideoSeccion{ flex-direction: column; }

	.experienciaIzq{ height: 250px; align-items: flex-end;}

	.experienciaIzqImg{ width: 100%; height: auto; }

	.experienciaDer{ height: auto; }

	.experienciaDer h3{ margin-top: 50px; }

	.videoExperiencia{ margin: 50px 0; }

	/* DESTINOS ----------------------------------------------------------------------------------------*/

	.destinosSeccion{
		height: auto;
		width: 100%;
		flex-direction: column;
	}

	.destinosIzq, .destinosDer{ width: 100%; }

	.destinosIzq{
		padding: 0 5%;
		margin: 50px 0;
	}

	.destinosDer{
		margin: 0;
		margin-bottom: 50px;
	}

	.destinosSeccion .slick-dots{
		width: 100%;
		height: 60px;
		bottom: -40px;
	}

	.destinosItem img{ width: 100%; height: auto !important;}

	/* ACTIVIDADES ----------------------------------------------------------------------------------------*/
	.actividadesSeccion{ height: auto; }

	.actividadesSeccion h2{ margin: 50px 0 0; }

	.actividades{
		margin-top: 50px;
		flex-direction: column;
	}

	.actividadItem{
		margin: 0;
		width: 100%;
		height: 250px;
	}

	.actividadImg{
		width: 100%;
		height: auto;
	}

	/* HOSPEDAJE ----------------------------------------------------------------------------------------*/
	.hospedajeSeccion{
		height: auto;
		flex-direction: column;
	}

	.hospedajeIzq, .hospedajeDer{
		width: 100%;
	}

	.hospedajeDer{
		padding: 0 5%;
		margin: 50px 0;
		order: 1;
	}

	.hospedajeIzq{
		margin-bottom: 50px;
		order: 2;
	}

	.hospedajeSeccion .slick-dots{
		bottom: 0;
		width: 100%;
	}

	/* HOSPEDAJE ----------------------------------------------------------------------------------------*/
	.opinionesSeccion h2{
		margin-top: 50px;
	}

	.opiniones{
		margin: 50px 0;
		flex-direction: column;
		align-items: center;
	}

	.opinionHijo{
		width: 90%;
	}

	/* CONTACTO ----------------------------------------------------------------------------------------*/
	.contactoSeccion{
		height: auto;
		flex-direction: column;
	}

	.contactoIzq, .contactoCentro, .contactoDer{
		width: 100%;
	}

	.contactoCentro{
		order: 1;
		height: 250px;
	}

	.contactoIzq{
		order: 2;
		margin: 50px 0;
	}

	.contactoDer{
		order: 3;
		height: 250px;
	}

	.imgContactoCentro{
		width: 100%;
		height: auto;
	}

	/* FOOTER ----------------------------------------------------------------------------------------*/
	footer{
		height: auto;
		flex-direction: column;
	}

	footer img{
		margin: 20px 0;
	}

	.footerDer{
		margin: 20px 0;
		text-align: center;
	}

	/* EXPLICACION AMENIDADES ----------------------------------------------------------------------------------------*/
	.explicacionAmenidad{
		height: auto;
		font-size: 13px;
		padding: 9px 5%;
	}

	/* CUERPO PAG Y SHOP ----------------------------------------------------------------------------------------*/

	/*aside{ width: 100%; order: 2; margin:0; }

	.tiendaObjetos{ width: 100%; order: 1; }

	.tiendaObjeto{ width: 47%; }

	/* HERO PAG ----------------------------------------------------------------------------------------*/
	/*header{	height: 500px;}
	header img{ width: 100%; height: auto; }

	/* PRODUCTO ----------------------------------------------------------------------------------------*/

	.cuerpoPagDestino{ padding: 0 5%;}

	#actividadesProducto .destinosDer{ margin: 0; }

	.destPro01{ order: 1; }
	.destPro02{ order: 2; }
	.destPro03{ order: 3; }
	.destPro04{ order: 4; }
	.destPro05{ order: 5; }
	.destPro06{ order: 6; }
	.destPro07{ order: 7; }
	.destPro08{ order: 8; }

	.productoIzq{ width: 100%; }

	.productoDer{
		width: 100%;
		padding: 50px 5%;
	}
	.productoIzq div { width: 60%; }

	.cuerpoProducto { padding: 50px 0; }

}

@media all and (max-width: 770px){
	/*header img{ width: auto; height: 100%; }*/
	.tituloPagDestino{
		top: 40%;
		font-size: 30px;
	  letter-spacing: 3px;
	}
}

@media all and (max-width: 500px){
	/*.tiendaObjeto{ width: 95%; }

	.tiendaObjetos{ justify-content: center; }

	/* HERO PAG ----------------------------------------------------------------------------------------*/
	/*.tituloPag{ font-size: 23px; }*/

	.productoIzq div {
		width: 90%;
	}
}

@media all and (max-width: 395px){
	.actividadImg, .experienciaIzqImg{
		width: auto;
		height: 100%;
	}
}


#mc_embed_signup{ clear:left; }
#mc_embed_signup label{ display: none; }