/*-- ESTILOS GENERALES --*/

	:root {

		--amarillo: #e3ba12;

		--grisText: #3e3e3e;

		--turquesa: #0094ac;

		  --blanco: #ffffff;

		  --grisH3: #636363;

		   --negro: #000000;

		   --verde: #bad405;

		   --rojoH: #db234cc4;

		    --azul: #007db1;

		    --rojo: #db234c;



		   --font2: 'Enriqueta', serif;

	}

	html, body {

		width: 100%;

	}

	* {

		margin: 0;

		padding: 0;

		box-sizing: border-box;

		font-family: 'Roboto', sans-serif;

		scroll-behavior: smooth;

		cursor: default;

	}

	a {

		text-decoration: none;

	}

	h1 {

		text-align: center;

    	padding: 2rem;

    	color: var(--azul);

    	font-weight: 400;

    	font-size: 4rem;

    	font-family: var(--font2);

    	line-height: 1;

	}

	h3 {

		text-align: center;

		color: var(--azul);

		font-size: 1.3rem;

		font-weight: 400;

		margin-bottom: 1.2rem;

	}

	h4	{

		font-family: var(--font2);

		color: var(--verde);

	}

	.wait svg {

		margin-right:1rem;

	}

	.wait p {

		font-size: 1.2rem;

		font-weight: 300;

	}

	.nmnp 	{

		padding: 0 !important;

		margin: 0 !important;

	}

	.font2 {

		font-family: 'Enriqueta', serif;

	}

	.flex,

	.flex-column {

		display: flex;

		justify-content: center;

		align-items: center;

	}

	.flex-column {

		flex-direction: column !important;

	}

	main {

		position: relative;

	}

	.main-block {

		padding: 4rem 12rem;

	}

	.main-block-big {

		padding: 8rem 6rem;

	}

	.main-block-sm {

		padding: 4rem 6rem;

	}

	.img-full {

		width: 100%;

		height: 100%;

		object-fit: cover;

	}

	.center {

		text-align: center;

	}

	/*Botones*/

	button {

		border: none;

		outline: none;

		cursor: pointer;

	}

	.btn-red {

		background: var(--rojo);

    	padding: 1rem 3rem;

    	font-size: 1.3rem;

    	font-weight: 300;

    	width: 40%;

    	margin: 1rem auto;

	}

	.btn-red:hover {

		background: var(--rojoH);

	}

	.btn-mp {

		padding: 0.3rem 3rem;

    	margin: 0.5rem auto 0;

    	border-radius: 5px;

    	font-size: .9rem;

    	transition: all .3s ease;

	}

	.btn-step {

		background: #d9d9d9;

    	padding: 0.3rem 3rem;

    	border-radius: 3px;

    	margin: 1rem 0 0;

    	font-size: 1rem;

    	color: black;

    	border-left: 10px solid var(--turquesa);

	}

	.red {

		color: red;

		font-style: italic;

	}

	.btn-box {

		border-radius: 7px;

    	padding: 1rem;

    	background: var(--verde);

    	color: #000;

    	font-size: 1rem;

    	width: 70%;

    	color: #404040;

	}

	.fff {

		color: var(--blanco);

	}

	input[type=number]::-webkit-inner-spin-button, 

	input[type=number]::-webkit-outer-spin-button { 

		-webkit-appearance: none; 

  		margin: 0; 

	}

	input[type=number] {

		-moz-appearance:textfield !important;

	}

	.none {

		display: none !important;

	}

/*-----------------------*/



/*-- HEADER --*/

	#header {

		position: sticky;

    	top: 0;

    	z-index: 2;

	}

	.heightNav {

		height: 15vh;

	}

	/*- Menú alternativo -*/

	#navAlt {

		background: var(--turquesa);

		transition: all .5s ease;

	}

	#navAlt img {

		width: 15%;

		padding: .5rem 1rem;

		z-index: 1;

		margin-top: 12vh;

	}

	/*- Redes Sociales -*/

	#redes {

	    position: absolute;

	    top: 0;

    	right: 0;

    	padding: 0 2rem 0 0;

    	transition: all .7s ease-in;

    }

    #map-icons {

    	text-align: center;

	}

	#map-icons a {

    	color: #fff;

	}

	#map-icons svg {

		font-size: 1.7rem;

    	transition: all .3s ease;

    	margin: .5rem;

	}

	#map-icons svg:hover,

	#map-icons a:hover {

		cursor: pointer;

		transform: scale(1.3);

	}

	/*-----*/

	#header2 {

		z-index: 10;

		position: fixed;

		top: 0;

		width: 100%;

		padding: 1rem 2rem;

		transition: all .3s ease;

	}

	#menu {

		background: url(../img/utilities/baner-small.png) no-repeat;

		background-size: contain;

		height: 0;

		padding-top: 13.70%;

		transition: all .5s ease;

		z-index: 20;

	}

	#menu-nav {

    	justify-content: space-evenly;

    	margin-top: -7.85%;

	}

	.menu-item {

		overflow: hidden;

		transition: all .3s ease;

		padding: 0 1.3rem .3rem;

	}

	.menu-item:hover {

		cursor: pointer;

		transform: scale(1.4);

	}

	.sub-nav {

		overflow: visible;

	}

	.newNav {

		height: 10vh !important;

		background: var(--turquesa) !important;

		padding: 0 24% !important;

	}

	.newNav img {

		display: block !important;

    	width: 16%;

    	padding-top: 1.5rem !important;

    	margin: 0 !important;

    	filter: drop-shadow(0 0 .5rem rgb(255, 255, 255));

	}

	.newNav #menu-nav {

		height: 100%;

		justify-content: space-between;

	}

/*------------*/



/*-- SLIDE --*/

	#slide	{

		position: relative;

	}

	.container{

	    overflow: hidden;

	}

	.wrapper{

	    width: 100%;

	    height: 100%;

	    display: flex;

	    animation: slide 16s infinite;

	    background: #0094ac5d;

	}

	.wrapper img {

	    width: 100%;

	    object-fit: cover;

	    min-width: 100%;

	}

	@keyframes slide{

	    0%{

	        transform: translateX(0);

	    }

	    33%{

	        transform: translateX(0);

	    }

	    43%{

	        transform: translateX(-100%);

	    }

	    66%{

	        transform: translateX(-100%);

	    }

	    77%{

	        transform: translateX(-200%);

	    }

	    100%{

	        transform: translateX(-200%);

	    }

	}

/*-----------*/



/*-- RESERVE --*/

	#reserve {

    	background: var(--rojo);

   		color: #fff;

    	text-align: center;

    	padding: 2rem;

    	width: 80%;

    	margin: 2rem auto;

	    box-shadow: 0 10px 20px rgb(0 0 0 / 19%), 0 6px 6px rgb(0 0 0 / 23%);

	    border-radius: 6px;

	    position: relative;

	}

	#reserve h2 {

		font-weight: 300;

		font-size: 	2rem;

	}

	#observ h4	{

		font-size: 1.2rem;

    	font-weight: 600;

    	color: #fff;

	}

	#observ p {

		margin: 0.1rem 0 0.5rem 1.5rem;

    	line-height: 1.1;

    	font-weight: 300;

	}

	#reserve img {

		width: 2.5rem;

		margin: 0 .15rem 0 0;

	}

	#reserve img:hover {

		/*cursor: pointer;*/

	}

	#reserve button:hover {

		background: #bfbfbf;

	}

	#reserve input.cantidad {

		height: 2rem;

		width: 2rem;

		margin-right: .5rem;

		text-align: center;

		border-radius: 5px;

		font-size: 1rem;

	}

	#reserve svg {

		font-size: 3rem;

	}

	#reserve-step1 {

		position: relative;

		z-index: 1;

	}

	#reserve-step1 #observ {

		text-align: left;

    	font-size: 1rem;

    	flex-basis: 50%;

	}

	#reserve-cantidad {

		justify-content: space-around;

	}

	#reserve .step-title {

		background: #ffffff47;

    	padding: 1rem 0 1.5rem 0;

    	margin: 0 0 1.5rem 0;

    	font-size: 1.5rem;

    	font-weight: 300;

    	line-height: 1;

    	border-radius: 5px;

	}

	#reserve .step-title p {

		font-size: 1rem;

    	margin: 0.2rem;

    }

    .reserve-ticket {

        text-align: left;

    	border-left: 10px solid var(--verde);

    	padding: 0 0 0 0.5rem;

    	margin: 0 0 0 3rem;

    }

    .reserve-ticket p {

    	font-size: 2rem;

    }

    #reserve-step2 input {

    	height: 3rem;

    	width: 17rem;

    	font-size: 1.5rem;

    	color: var(--grisH3);

    	padding: 0 0 0 1rem;

    }

    #reserve-step3 input{

    	height: 2.5rem;

    	width: 80%;

    	font-size: 1.3rem;

    	color: var(--grisH3);

    	padding: 0 0 0 1rem;

    	font-weight: 300

    }

    #mailMsj {

    	width: 80%;

    	text-align: center;

    	margin: 0.5rem auto;

    	background: #000;

    	padding: 0.5rem 0;

    	color: var(--amarillo);

    	display: none;

    }

/*-------------*/



/*-- ABOUT --*/

	#about {

		position: relative;

		padding-bottom: 0 !important;

	}

	#about h3 {

		font-size: 1.5rem;

		display: inline-block;

	}

	#about h3.new {

		padding-left: 3rem;

    	color: var(--azul);

    	font-weight: 400;

    	font-size: 1.2rem;

    	text-align: center;

	}

	#about img {

		width: 100%;

	}

	.about-list {

		text-align: center;

	}

	.about-list h3 {

		margin-bottom: 0;

	}

	.about-box {

		border: 3px solid var(--turquesa);

		border-radius: 12px;

		padding: 3rem 2rem;

		margin: 2rem 0;

		font-weight: 700;

	}

	h3.about-box {

		font-family: var(--font2) !important;

	}

/*-----------*/



/*-- ATTRACTION --*/

	#attraction {

		background: url(../img/bg/bg1.jpg);

    	color: #fff !important;

    	background-position: top;

    	background-attachment: fixed;

    	position: relative;

    	overflow-x: hidden;

	}

	#attraction #icons {

		display: grid;

    	grid-template-columns: repeat(2, 1fr);

    	grid-template-rows: repeat(2, 1fr);

    	grid-gap: 2rem;



    	padding: 2rem 0;

	}

	#attraction p {

		color: var(--grisText);

    	font-size: 1.2rem;

    	margin: .15rem 0;

	}

	#attraction-videoBg {

    	object-fit: cover;

  		width: 100%;

  		height: 100%;

  		position: absolute;

  		z-index: -1;

	}

	#sub-attraction {

	    background: rgba(0,0,0,.5);

	    padding: 8rem 6rem;

	}

	.icon-item {

		text-align: center;

    	background: var(--blanco);

    	padding: 1rem 2rem 3rem;

    	border-radius: 10px;

    	display: grid;

    	grid-template-rows: repeat(2, 1fr);

	}

	.icon-item img {

		width: 100%;

		padding: 1rem;

	}

	.attraction-img {

		display: grid;

		grid-template-columns: 75% 25%;

		align-items: center;

	}

/*----------------*/



/*-- GALLERY --*/

	.gallery3 #gallery-container {

		display: block;

	}

	.gallery3 #gallery-img {

		display: grid;

		grid-template-columns: repeat(4, 1fr);

		grid-template-rows: 220px 220px 220px;

	}

	.gallery3 .gallery-item {

		margin: 0;

		padding: 0;

		border-radius: 0;

		background: transparent;

		overflow: hidden;

	}

	.gallery3 .gallery-item:hover {

		cursor: pointer;

		transform: none !important;

	}

	.gallery3 .gallery-wraper {

		height: 100%;

	}

	.gallery3 .gallery-wraper img {

		display: block;

		border-radius: 0;

		height: 100%;

		object-fit: cover;



		transition: .6s transform ease;

	}

	.gallery3 .gallery-wraper img:hover {

		transform: scale(1.3);

	}

	/*New Gallery*/
	#galleryImgNew {
		background-color: #fff;
	}
	#galleryImgNew-container {
		columns: 250px 4;
		column-gap: 0;
	}
	.galleryImgNew-item {
		margin: 1rem .5rem;
		overflow: hidden;
	}
	.galleryImgNew-item:nth-child(1) {
		margin-top: 0;
	}
	.galleryImgNew-item img {
		width: 100%;
		display: block;
		transition: all .8s ease;
	}
	.galleryImgNew-item img:hover {
		cursor: pointer;
		transform: scale(1.15);
	}
/*-------------*/



/*-- INFO --*/

	#boxes h1 {

		font-size: 2rem;

	}

	#boxes-contaier {

		display: grid;

		grid-template-columns: repeat(5, 1fr);

		grid-gap: 2rem;

	}

	.box-item {

		background: var(--verde);

		text-align: center;

		position: relative;

	}

	.box-more {

		height: 100%;

		width: 100%;

		background: rgba(0,0,0,.7);

		position: absolute;

		top: 0;

		bottom: 0;

		left: 0;

		right: 0;

		opacity: 0;



		transition: opacity .5s ease;

	}

	.box-more:hover {

		opacity: 1;

	}

	.box-item h3 {

		background: #0094ac;

		color: #fff !important;

		margin: 1.5rem 0 0;

		padding: 2rem 0 .5rem 0;

		height: 100px;

	}

	.box-item img {

		width: 90%;

		margin: 4rem 5% -2.5rem;

	}

	.box-item-in {

		background: #fff;

    	height: 100%;

    	width: 100%;

	    margin: 1rem 0 0 0;

	}

	.eco {

		width: 22%;

	}

	.modal-pet {

		text-align: left;

	}

/*-----------*/



/*-- PREGUNTAS FRECUENTES --*/

	/*--faqs desktop--*/

		#faqs h1 {

			font-size: 2.5rem;

		}

		#faqs-questions-content {

	    	flex-wrap: wrap;

		}

		.faqs-questions	{

			padding: 1rem 1.5rem;

	    	margin: .5rem 1rem;

	    	display: inline-block;

	    	text-align: center;

	    	background: #e4e4e4;

	    	transition: all .3s ease;

	    	border-radius: 8px;

		}

		.faqs-questions:hover {

			cursor: pointer;

			transform: scale(1.2);

		}

		.faqs-questions p:hover {

			cursor: pointer;

		}

		#faqs-answers {

	    	margin: 2rem auto;

		    text-align: center;

		    font-size: 1.5rem;

	    	width: 75%;

	    	border-radius: 10px;

	    	background: var(--verde);

		}

		.faqs-bg {

			background: var(--verde);

		}

		.faq-pad {

			padding: 1rem;

		}



	/*--faqs Mobile--*/

		#faqs {

			margin-bottom: 3rem;

		}

		#faqsMobile-main {

			display: none;

		}

		.accordion {

			padding: 0 .5rem;

		}

		.accordion-item {

			background: var(--verde);

    		margin: 0 0 0.5rem 0;

    		border-radius: 3px 3px;

		}

		span.accordion-title  {

			color: #000;

			text-align: center;

			padding: 0 !important;

		}

		.accordion-content {

			background: #fff;

		}



		/*Adaptación de: 

			- https://codepen.io/kathykato/pen/MoZJom ======*/

		.accordion .accordion-item button[aria-expanded=true] {

			

		}

		.accordion button {

		  position: relative;

		  display: block;

		  width: 100%;

		  padding: 1em 0;

		  color: #7288a2;

		  font-size: 1.15rem;

		  font-weight: 400;

		  border: none;

		  background: none;

		  outline: none;

		}

		.accordion button:hover, .accordion button:focus {

		  cursor: pointer;

		  color: #03b5d2;

		}

		.accordion button:hover::after, .accordion button:focus::after {

		  cursor: pointer;

		  color: #03b5d2;

		  border: 1px solid #03b5d2;

		}

		.accordion button .accordion-title {

		  padding: 1em 1.5em 1em 0;

		}

		.accordion button .icon {

		  display: inline-block;

		  position: absolute;

		  top: 18px;

		  right: 0;

		  width: 22px;

		  height: 22px;

		  border: 1px solid;

		  border-radius: 22px;

		}

		.accordion button .icon::before {

		  display: block;

		  position: absolute;

		  content: "";

		  top: 9px;

		  left: 5px;

		  width: 10px;

		  height: 2px;

		  background: currentColor;

		}

		.accordion button .icon::after {

		  display: block;

		  position: absolute;

		  content: "";

		  top: 5px;

		  left: 9px;

		  width: 2px;

		  height: 10px;

		  background: currentColor;

		}

		.accordion button[aria-expanded=true] {

		  color: #03b5d2;

		}

		.accordion button[aria-expanded=true] .icon::after {

		  width: 0;

		}

		.accordion button[aria-expanded=true] + .accordion-content {

		  opacity: 1;

		  max-height: 200em;

		  transition: all 200ms linear;

		  will-change: opacity, max-height;

		  border-bottom: 2.5px solid var(--verde);

		}

		.accordion .accordion-content {

		  opacity: 0;

		  max-height: 0;

		  overflow: hidden;

		  transition: opacity 200ms linear, max-height 200ms linear;

		  will-change: opacity, max-height;

		}

		.accordion .accordion-content p {

		  font-size: 1rem;

		  font-weight: 300;

		  margin: 1rem 1rem 2rem;

		  text-align: center;

		}

/*--------------------------*/



/*-- GALLERY IMAGE --*/

	#galleryImg {

		background: var(--verde);

	}

	#galleryImg:hover {

		cursor: pointer;

	}

	#gallery-container {

    	display: grid;

    	grid-gap: 1rem;

    	grid-template-columns: repeat(4, 1fr);

    	z-index: 1;

    	position: relative;

	}

	.gallery-item {

		margin: 0 0 1.5rem;

		padding: .4rem;

		background: var(--blanco);

		border-radius: 20px;	



		transition: .3s all ease;

	}

	.gallery-item:hover {

		transform: scale(1.3) !important;

		z-index: 1;

		cursor: pointer;

	}

	.gallery-item img {

		width: 100%;	

		border-radius: 16px;	

	}

	.gallery-item img:hover {

		cursor: zoom-in;

	}

	.gallery-item p {

		text-align: center;

		padding: .5rem 0 0;

	}

	#glightbox-slider > iframe > img {

		width: 100%;

	}

/*-------------------*/



/*-- SERVICES --*/

	#free-services,

	#aditional-services {

		display: grid;

		grid-template-columns: 50% 50%;

		align-items: start;

		margin: 1rem 0 6rem;

		border: 5px solid var(--turquesa);

		padding-top: 2rem;

	}

	#services img {

		width: 80%;

	}

	.free-img-text {

		margin-top: 6rem;

	}

	.service-img-top {

		position: absolute;

		top: -6rem;

	}

	#services p {

    	font-size: 1.7rem;

    	font-weight: 500;

    	line-height: 1.7rem;

    	margin: 1.3rem 0;

    	color: var(--azul);

	}

	#services p span {

		font-size: 1.4rem;

		font-weight: 300;

	}

	.service-img {

		text-align: left;

		position: relative;

	}

	.service-img p {

		text-align: left;

	}

	.service-title {

		position: absolute;

	    top: 20%;

	    padding: .5rem;

	    width: 75%;

	    margin: 0 auto;

	    font-size: 1.5rem;

	    color: #fff;

	    display: inline-block;

	}

	.service-title h2 {

		font-weight: 300;

		font-size: 2.5rem;

		line-height: 1;

	}

	#free-services div,

	#aditional-services div {

		padding-left: 1.5rem;

	}

	/*#aditional-services-text p {

		font-size: 2.5rem;

		line-height: 2rem;

	}*/

	.pulpo1 {

		width: 10% !important;

	    display: block;

    	margin: -4rem auto 2rem;

    	grid-column: 1/3;

	}

/*--------------*/



/*-- MAPA --*/

	#map iframe {

		width: 100%;

		height: 100% !important;

		display: block;

	}

	#map {

		background: var(--azul);

		display: grid;

		grid-template-columns: 35% 65%;

		grid-template-rows: repeat(1, 1fr);

	}

	#map-text {

		padding: 4rem 2rem;

	}

	#map img {

		width: 30%;

    	margin: 0 auto;

    	display: block;

    	padding: 3rem 0 0 0;

	}

	#map h3 {

		text-align: left !important;

	}

	#map h4 {

		font-weight: 100;

    	color: #fff;

    	text-align: center;

	}

/*----------*/



/*-- CONTACTO --*/

	#contact {

		background: var(--grisText);

		color: #fff;

		justify-content: space-evenly;

		padding: 1rem 0;

	}

	#contact-info {

		width: 75%;

	}

	#contact-info p {

		padding: 0 1rem;

		font-size: 1.5rem;

		font-weight: 500;

		width: 33%;

	}

	#contact-info p img { 

		margin-right: .5rem;

		width: 15%;

	}

	#contact-redes {

		justify-content: space-evenly;

		width: 15%;

	}

	#contact-redes a {

		text-align: center;

	}

	#contact-redes img {

		width: 60%;

		border: 3px solid #fff;

    	border-radius: 50%;

    	transition: all .1s ease-out;

	}

	#contact-redes img:hover {

		cursor: pointer; 

		box-shadow: 0px 0px 10px 3px #fff;

	}

/*--------------*/



/*-- FOOTER --*/

	footer {

		background: #fff;

		color: #e4e4e4;

		margin: 0 0 3rem;

	}

	footer h1 {

		font-size: 2rem;

		margin: 1rem 0;

		padding-bottom: 0 !important;

	}

	footer h4 {

		color: var(--grisH3);

    	text-align: center;

    	font-weight: 400;

    	margin: 2rem 0 0;

	}

	#auspiciantes {

		justify-content: space-around;

		padding-top: 0 !important;

	}

	#auspiciantes img {

		width: 25%;

		padding: 2rem;

		transition: all .5s ease;

	}

	#auspiciantes img:hover {

		transform: scale(1.5);

	}

/*------------*/