html{
    overflow-x: hidden;
}
body{
	font-family: 'TeXGyreTermes';
}

.bg-beige{
	background-image: url("../img/fondos/fondo_beige.png");
	background-size: cover;
    background-repeat: no-repeat;
}

.bg-tenis{
	background-image: url("../img/fondos/tenis.jpeg");
	height: 30rem;
    background-attachment: fixed;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-green{
	background-image: url("../img/fondos/fondo_verde.png");
	background-size: cover;
    background-repeat: no-repeat;
}

.bg-green-claro{
	background-image: url("../img/fondos/fondo_verde_claro.png");
	background-size: cover;
    background-repeat: no-repeat;
}

.bg-manos{
	background-image: url("../img/fondos/fondo_manos.jpeg");
	height: 25rem;
    background-attachment: fixed;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-iglesia{
	background-image: url("../img/fondos/fondo_iglesia.jpeg");
	height: 35rem;
    background-attachment: fixed;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

.img-iniciales{
	width:6rem;
	height:auto;
}

.content-title-home{
	top:1rem;
	justify-items:center;
}

.content-footer-home{
	bottom:8rem;
	justify-items:center;
}

.title-home{
	font-size:3rem;
	font-weight: 300;
	color:#fff;
	font-family: 'The Seasons';
}

.subtitle-home{
	font-size:1.25rem;
	font-weight: 400;
	color:#fff;
	font-family: 'The Seasons';
	letter-spacing: 4px;
}

.subtitle-footer{
	font-family: 'The Seasons';
	font-size:1.5rem;
	font-weight: 600;
	color:#fff;
	letter-spacing: 9px;
}

.time-home{
	padding:0 2rem;
	font-size:1.25rem;
	font-weight: bold;
	color:#fff;
	text-align:center;
	font-family: 'The Seasons';
}

.time-home span{
	font-size:4rem;
	font-family: 'The Seasons';
	text-align:center;
}

.text-green{
	color:#232801 ;
}

.text-section{
	font-size:1.4rem;
	font-weight:400;
	word-spacing: 0.2rem;
}

.subtitle-section{
	font-size:2rem;
	font-family: 'Higuen';
	letter-spacing: 4px;
}

.subtitle-section2{
	font-size:1.5rem;
	font-family: 'Higuen';
	letter-spacing: 8px;
	font-family: 'FONTSPRING DEMO - The Seasons';
}

.title-recepcion{
	font-size:2rem;
	font-weight: bold;
	font-family: 'The Seasons';
	letter-spacing: 8px;
}

.icon-recepcion{
	width:6rem;
	height:auto;
}

.text-recepcion{
	font-size:1.5rem;
	font-family: 'The Seasons';
	font-weight: 300;
	word-spacing: 0.1rem;
}

.hora-recepcion{
	font-size:2rem;
	font-family: 'The Seasons';
	font-weight: 300;
	word-spacing: 0.1rem;
}

.btn-white{
	background-color:transparent;
	border: 2px solid #fff;
    color: #fff;
    border-radius: 30px;
    width: 18rem;
    font-family: 'The Seasons';
    font-weight: 300;
	padding:0.375rem 0.75rem;
}

.btn-white:hover{
	border: 2px solid #fff;
    color: #232801;
	background-color:#fff;
}

.globo-izquierdo {
	position: relative;
	background-color: #fff;
	border-radius: 10px;
	padding: 15px 20px;
	width: auto;
	box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.3);
	margin-left: 30px; /* para dejar espacio al pico */
}

.globo-izquierdo::before {
	content: "";
	position: absolute;
	left: -15px;
	top: 50%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-right: 16px solid #fff;
}

.globo-derecho {
	position: relative;
	background-color: #fff;
	border-radius: 10px;
	padding: 15px 20px;
	width: auto;
	box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.3);
	margin-right: 30px; /* espacio para el pico */
}

.globo-derecho::after {
	content: "";
	position: absolute;
	right: -15px;
	top: 50%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 16px solid #fff;
}

.globo-derecho-double {
	position: relative;
	background-color: #fff;
	border-radius: 10px;
	padding: 5px 20px;
	width: auto;
	box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.3);
	margin-right: 30px; /* espacio para el pico */
}

.globo-derecho-double::after {
	content: "";
	position: absolute;
	right: -15px;
	top: 50%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 16px solid #fff;
}

.line-intinerario {
	position: absolute;
	left: 50%;
	top: 5%;
	transform: translateX(-50%);
	width: 2px;
	height: 90%;
	background-color: #232801;
	opacity:1;
}

.icon-intinerario{
	width: 2.5rem;
	background-color: #f8f6f1;
	z-index:2;
}

.icon-fotos{
	width:9rem;
	height:auto;
}

.icon-codigo-vestimenta{
	width:6rem;
	height:auto;
}

.btn-white-vestimenta{
	background-color:transparent;
	border: 2px solid #fff;
    color: #fff;
    border-radius: 30px;
    width: 18rem;
    font-family: 'The Seasons';
    font-weight: 300;
	padding:0.375rem 0.75rem;
}

.btn-white-vestimenta:hover{
	border: 2px solid #fff;
    color: #867468;
	background-color:#fff;
}

.icon-regalos{
	width:4rem;
	height:auto;
}

.icono-regalo{
	width:9rem;
	height:auto;
}

.text-regalos{
	font-size:1.5rem;
	font-weight: 300;
	word-spacing: 0.1rem;
}

.title-regalos{
	font-size:2rem;
	font-family: 'Higuen';
	letter-spacing: 4px;
}

.flor-deposito {
    top: -4rem;
    left: 1rem;
    width: 14rem;
}	

.flor-lluvia {
    bottom: 0rem;
    right: 0rem;
    width: 14rem;
}	

.arrow-galeria{
	width: 2rem;
	height:auto;
}

.carousel-indicators {
    bottom:-4rem;
}

.carousel-indicators [data-bs-target] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.iniciales-reservacion{
	width:8rem;
	height:auto;
}

.icono-pases{
	width:4rem;
	height:auto;
}

.grupo-reservacion{
	font-size:3rem;
	font-family: 'TeXGyreTermes';
	letter-spacing: 4px;
}

.subtitle-reservacion{
	font-size:1.5rem;
	font-family: 'TeXGyreTermes';
	letter-spacing: 4px;
}

.text-pases{
	font-size:1rem;
	font-family: 'TeXGyreTermes';
	letter-spacing: 4px;
}

.btn-asistencia {
    border: 2px solid #86895e;
    background-color: #86895e;
    color: #fff;
    font-family: 'The Seasons';
    font-weight: bold;
    padding: 0.5rem 3rem;
}

.btn-asistencia:hover,.btn-asistencia:active,.btn-asistencia:focus{
	border: 2px solid #86895e;
    color: #color;
	background-color:#86895e;
}

.player {
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 80%;
  margin: 20px auto;
}

.btn-play {
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
}

.progress-container {
  flex: 1;
  background: #ccc;
  border-radius: 5px;
  height: 10px;
  position: relative;
  cursor: pointer;
}

.progress {
  background: #86895e;
  height: 100%;
  width: 0%;
  border-radius: 5px;
  transition: width 0.2s;
}

.time {
  font-family: monospace;
  font-size: 14px;
  min-width: 70px;
  text-align: center;
  color:#fff;
}

#volume {
  width: 80px;
  accent-color: #86895e;
}

.barra-reproduccion{
	background-color:rgba(83,88,47,0.6);
}

.elemento{
	opacity:0;
}


@media (max-width: 1399.98px) {	
	.text-regalos {
		font-size: 1.25rem;
	}
}

@media (max-width: 1300px) {	
	.flor-deposito {
		width: 12rem;
	}	

	.flor-lluvia {
		width: 12rem;
	}	
}

@media (max-width: 1199.98px) {
	.title-home {
		font-size: 2.5rem;
	}
	
	.subtitle-footer {
		font-size: 1.25rem;
	}
	
	.time-home span {
		font-size: 3rem;
	}
	
	.content-footer-home {
		bottom: 5rem;
	}
	
	.img-flor{
		width: 12rem;
		height:auto;
	}
	
	.img-hoja{
		width:6rem;
		height:auto;
	}
	
	.bg-tenis {
		height: 25rem;
	}
	
	.title-regalos{
		font-size:1.5rem;
	}
	.text-regalos {
		font-size: 1rem;
	}
}

@media (max-width: 991.98px) {
	.fondo-inicio{
		height: 40rem;
		object-fit: cover;
	}
	
	.img-flor {
        width: 8rem;
        height: auto;
    }
	
	.img-hoja{
		width:4rem;
		height:auto;
	}
	
	.bg-tenis {
		height: 20rem;
	}
	
	.text-section {
		font-size: 1.25rem;
	}
	
	.subtitle-section {
		font-size: 1.75rem;
	}
	
	.title-recepcion {
		font-size: 1.5rem;
	}
	
	.icon-recepcion {
		width: 4rem;
		height: auto;
	}
	.subtitle-section {
        font-size: 1.25rem;
    }
	.text-recepcion {
		font-size: 1rem;
	}
	
	.hora-recepcion {
		font-size: 1rem;
	}
	
	.btn-white {
		width: 14rem;
		font-size: 0.8rem;
	}
	
	.btn-white-vestimenta {
		width: 14rem;
		font-size: 0.8rem;
	}
	
	.bg-iglesia {
		height: 30rem;
	}
	
	.player {
		margin: 5px auto;
	}
	
	.flor-deposito {
		top: -3rem;
	}
}

@media (max-width: 767.98px) {
	.time-home {
		padding: 0 1rem;
		font-size:1rem;
	}
	.time-home span {
        font-size: 2.5em;
    }
	
	.text-section {
        font-size: 1rem;
    }
	
	#cont-mensaje{
		padding-top:4rem;
		padding-bottom:4rem;
	}
	
	.bg-manos {
		height: 20rem;
	}
	
	#img-vestimenta{
		height: 28rem;
		object-fit: cover;
	}
	
	.btn-white-vestimenta {
        width: 10rem;
    }
	
	#img-recepcion{
		height: 25rem;
		object-fit: cover;
	}
	
	.title-regalos {
        font-size: 1.25rem;
    }
	
	.bg-iglesia {
        height: 25rem;
		background-position: 25%;
    }
	
	.subtitle-section2 {
        font-size: 1.25rem;
    }
	
	.flor-deposito {
        width: 10rem;
		top:-1rem;
    }
	
	.flor-lluvia {
        width: 10rem;
    }
}

@media (max-width: 575.98px) {
	.time-home {
		padding: 0 1rem;
		font-size:0.8rem;
	}
	.time-home span {
        font-size: 2em;
    }
	
	.img-flor{
		width:8rem;
		height:auto;
	}
	
	.img-hoja{
		width:4rem;
		height:auto;
	}
	
	.bg-tenis{
		height: 20rem;
		background-attachment: initial;
	}
	
	#img-recepcion{
		height: 22.5rem;
	}
	
	.globo-izquierdo , .globo-derecho{
		padding: 10px 5px;
	}
	
	.globo-derecho-double {
		padding: 5px 5px;
	}
	
	#img-vestimenta{
		height: 20rem;
		object-fit: cover;
	}
	
	.subtitle-section2 {
        font-size: 1rem;
    }
	.icon-codigo-vestimenta {
		width: 4rem;
		height: auto;
	}
	
	#vestimenta .subtitle-section{
        font-size: 1rem;
    }
	
	#vestimenta .text-section {
        font-size: 0.8rem;
    }
	
	.btn-white-vestimenta {
        width: 8rem;
    }
	
	.title-regalos {
        font-size: 1rem;
    }
	
	.text-regalos {
        font-size: 0.8rem;
    }
	
	.grupo-reservacion {
		font-size: 2rem;
	}
	
	.subtitle-reservacion {
		font-size: 1.25rem;
	}
	
	.bg-manos{
		background-image: url("../img/fondos/fondo_manos_movil.png");
		height: 15rem;
		background-attachment: initial;
		background-position: center;
	}
	
	.bg-iglesia{
		background-image: url("../img/fondos/fondo_iglesia.jpeg");
		height: 25rem;
		background-attachment: initial;
		background-position: center;
	}
	
	.icon-regalos{
		width:3rem;
		height:auto;
	}
	
	.icono-regalo{
		width:5rem;
	}
	
	.flor-deposito {
        width: 8rem;
		top:-2rem;
    }
	
	.flor-lluvia {
        width: 8rem;
    }
	
	.player {
        margin: 5px 0.5rem;
		max-width:92.5%;
    }
}

@media (max-width: 400px) {

}

@media (max-width: 360px) {
	
}
