/* Global properties ======================================================== */
html, body {width:100%; padding:0; margin:0;}

body { 	 
	font: 14px/18px "Times New Roman", Times, serif;
	color:#6f6f6f;
    
	/* min-width:1024px; */
/*	background: #262626;      */
    background: #ffffff;
}
.ic {border:0;float:right;background:#fff;color:#fff;width:50%;line-height:10px;font-size:10px;margin:-220% 0 0 0;overflow:hidden;padding:0}
.main {width:1024px; margin:0 auto;}
/***********************************************************************/
a {text-decoration:none; cursor:pointer;text-decoration:none; }
a:hover {text-decoration:none;}

.link {color:#f25c5c; text-decoration:underline;}
.link:hover {color:#fff;text-decoration:underline;}

.link-1 {font-size:16px; line-height:20px; color:#010101; font-style:normal; text-decoration:underline;display:inline-block;}
.link-1:hover {color:#060606;text-decoration:underline;}

.link-2 {color:#fff; text-decoration:underline;}
.link-2:hover {color:#f25c5c;text-decoration:underline;}     
  
.link-3 {color:#fff;}
.link-3:hover {color:#6f6f6f;}

.clr-1 { color:#010101;}
a.clr-1:hover {text-decoration:underline;}

.text-1 {font-size:20px; line-height:25px; color:#fff; font-style:normal;}

/*h2 { font-size:26px; line-height:36px; color:#ffffff; font-style:normal;}     */
h2 { font-size:26px; line-height:36px; color:#9e8a42; font-style:normal;} 
.h2 {border-bottom:#353535 1px solid; padding-bottom:7px;}
h3 { font-size:24px; line-height:30px; color:#9e8a42; font-weight:normal; font-style:normal; }
/*h3 { font-size:24px; line-height:30px; color:#ffffff; font-weight:normal; font-style:normal; }  */
.h3 {border-bottom:#353535 1px solid;padding-top:5px;padding-bottom:8px;}
.h3-2 {padding-top:5px;padding-bottom:17px;}

ul {margin:0; padding:0;list-style-image:none;}
ul.list-1 li {padding:0px 0 8px 14px; line-height:18px; background:url(../images/marker-1.gif) 0 8px no-repeat;}
/*ul.list-1 li a { font-size:14px; color:#fff; line-height:18px;  } */
ul.list-1 li a { font-size:14px; color:#010101; line-height:18px; } 
ul.list-1 li a:hover {color:#6f6f6f; text-decoration:none;} 


ul.list-2 li {padding:0px 0 13px 14px; line-height:18px; background:url(../images/marker-1.gif) 0 8px no-repeat;}
ul.list-2 li span { font-size:14px; color:#010101; line-height:18px; }
/*ul.list-2 li  span a { font-size:16px; color:#6f6f6f; line-height:18px; text-decoration:underline;}
ul.list-2 li  span a:hover {color:#f25c5c; text-decoration:underline;}    */   
ul.list-2 li  span a { font-size:16px; color:#010101; line-height:18px; text-decoration:underline;}
ul.list-2 li  span a:hover {color:#6f6f6f; text-decoration:underline;}

ul.list-3 li {padding:0px 0 26px 0px; line-height:18px;  overflow:hidden;}
ul.list-3 li span.date {display:block; float:left; background:url(../images/date-bg.png) 15px 0px no-repeat; width:97px; font-size:48px; line-height:60px; font-style:italic;}
ul.list-3 li span.date span {font-size:24px; line-height:30px; display:inline-block; float:left; color:#fff;}
ul.list-3 li span.extra-wrap { font-size:14px; color:#6f6f6f; line-height:18px; display:block; }
ul.list-3 li  span.extra-wrap a { font-size:14px; color:#bf96c7; line-height:18px; text-decoration:underline;}
ul.list-3 li  span.extra-wrap a:hover {color:#fff; text-decoration:underline;}


ul.list-4 li {padding:0px 0 13px 14px; line-height:18px; background:url(../images/marker-1.gif) 0 8px no-repeat;}
ul.list-4 li span { font-size:14px; color:#fff; line-height:18px; }



/******************************************************************/
.clear {clear:both; line-height:0; font-size:0; width:100%;}
.wrapper {width:100%; overflow:hidden; position:relative}
.wrap {overflow:hidden; position:relative}
.extra-wrap {overflow:hidden;}
.fleft {float:left;}
.fright {float:right;}
.img-indent {float:left; margin:3px 33px 0px 0;}
.img-indent-2 { margin:3px 0px 23px 0;}
.last {margin-right:0px !important;}
.center {text-align:center;}
.upper {text-transform:uppercase;}

.top-1 {margin-top:9px;}

.left-1 { margin-left:13px;}

.bot-0 {padding-bottom:0 !important; margin-bottom:0 !important;}
.bot-1 {margin-bottom:21px;}
.bot-2 {margin-bottom:17px;}

.pad-1 {padding-left:40px; padding-right:40px;}
.pad-2 {padding-left:40px; }

.p1 {padding-bottom:18px;}
.p2 {margin-bottom:25px;}
.p3 {padding-bottom:20px;}
.p4 {padding-bottom:13px;}
.p5 {padding-bottom:6px;}

/*********************************header*************************************/

.header {background:url(../images/bg2.jpg) 0 0 repeat; position:relative; width:100%;}    
/*header {background:#ffffff 0 0 repeat; position:relative; width:100%;} */
/*.header>div { position:relative; width:100%; background:url(../images/header-line.jpg) 0 bottom repeat-x; }  */
header {width:1024px; margin:0 auto; z-index:1000; position:relative; background:url(../images/banner-SF.jpg) 0 0 no-repeat;}
.header .nav {position:absolute; width:100%; z-index:999;  background:url(../images/nav-line.png) 0 bottom repeat-x; padding-bottom:1px; }

/*nav {background:url(../images/nav.png) 0 0 repeat;  width:1024px; margin:3px auto 0 auto; position:relative; }   */
nav {background:url(../images/nav3.png) 0 0 repeat;  width:1024px; margin:3px auto 0 auto; position:relative; }

.subpages-nav {position:relative; width:100%; z-index:999; height:174px;  background:url(../images/banner-SF.jpg) center 0 no-repeat;}   
/*.subpages-nav {background:url(../images/nav.png) 0 0 repeat;  width:1024px; margin:3px auto 0 auto; position:relative; } */ 
/*.subpages-nav {background:url(../images/nav3.png) 0 0 repeat;  width:1024px; margin:3px auto 0 auto; position:relative; }  */

/*.subpages-nav nav {background:transparent !important; padding-top:59px; margin-top:0 !important; }   */
.subpages-nav nav {background:transparent !important; padding-top:3px; margin-top:0 !important; }

h1 {display:inline-block; z-index:100; position:absolute; top:0; left:425px; z-index:1000;}

ul.menu {display:inline-block;display:block; padding:46px 0 70px 21px;  }
ul.menu li {float:left; display:inline-block; line-height:24px; background:url(../images/li.png) 0 0 no-repeat; padding:0 34px 0 43px; }
ul.menu li.li-none {background:transparent;}
ul.menu li.li-left {margin-left:400px;} 

/*ul.menu li a {font-size:18px; line-height:24px; color:#fff; font-style:normal; display:inline-block;}
ul.menu li a:hover , ul.menu li.current a { color:#d0d0d0;} */
        
ul.menu li a {font-size:18px; line-height:24px; color:#000000; font-style:normal; display:inline-block;}
ul.menu li a:hover , ul.menu li.current a { color:#89711c;}

/*********************************content*************************************/
/*#content {width:1024px; margin:0 auto; background:url(../images/bg.jpg) 0 0 repeat; padding-bottom:49px; border-bottom:#303030 1px solid;}  */

#content {width:1024px; margin:0 auto; background:#ffffff 0 0 repeat; padding-bottom:49px; border-bottom:#303030 1px solid;} 
.img-border {border:#474747 4px solid; display:inline-block;}

.gallery-block h2 {padding:26px 0px 16px 0px; text-align:center;}
.gallery-photo {border-top:#303030 1px solid; border-bottom:#303030 1px solid;}

.page1-row1 {overflow:hidden; padding-top:36px; }
.col-1 {float:left; width:190px; margin-right:50px;}
.col-2 {float:left; width:400px; margin-right:60px;}
.col-3 {float:left;}

.link-1-pad {float:right; margin-top:9px;}

.soc-icons {overflow:hidden; margin:17px 0 0 0;}
.soc-icons a {display:block; width:45px; height:45px; float:left; margin-right:2px;}
.soc-icons a:hover img {opacity:0.7;}

.adr {line-height:20px;}

.page2-row1 {overflow:hidden; padding-top:26px; padding-bottom:41px; }
.col-4 {float:left; width:570px; margin-right:70px;}
.col-5 {float:left; width:300px; }

.page2-row2 {overflow:hidden; }
.col-6 {float:left; width:570px; padding-right:30px; margin-right:20px; border-right:#303030 1px solid;}
.col-7 {float:left; width:320px; }

.comment {background:url(../images/comment-top.png) 0 0 no-repeat; padding-left:20px; margin-bottom:9px; width:270px;}
.comment p {background:url(../images/comment-bottom.png) right bottom no-repeat;} 

.page3-row1 {overflow:hidden; padding-top:26px; }
.col-8 {float:left; width:190px; padding-right:50px;}
.col-9 {float:left; width:744px; }

.page4-row1 {overflow:hidden; padding-top:26px; }
.col-10 {float:left; width:300px;  margin-right:60px; }
.col-11 {float:left; width:580px;}

.page5-row1 {overflow:hidden; padding-top:26px; }
.col-12 {float:left; width:600px;  margin-right:79px; }
.col-13 {float:left; width:265px;}

.page6-row1 {overflow:hidden; padding-top:26px; }
.col-14 {float:left; width:270px;  margin-right:50px; }
.col-15 {float:left; width:273px; margin-right:89px; }
.col-16 {float:left; width:260px; }

.vestuario {color:#fff; }

/* Lightbox image */
.lightbox-image{display:inline-block;position:relative;}
.lightbox-image img.magnify{position:absolute;width:0px;height:0px;left:50%;top:50%;}

.whatsapp-float {
  position: fixed;
  width: 55px;
  height: 55px;
  bottom: 20px;
  right: 20px;
  background-color: #25D366;
  color: white;
  border-radius: 50%;
  text-align: center;
  font-size: 28px;
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
  transition: transform 0.3s ease;
}

.whatsapp-float:hover {
  transform: scale(1.1);
}

/*Template responsive probando código*/
/* Diseño para celulares */
/*#content{
	float:none;
	width:100%;
}*/

/* Diseño para tabletas */ 
/*@media screen and (min-width: 800px) {
	#content{
		float:left;
		width:50%;
	}
}*/

/* Diseño para PC */ 
/*@media screen and (min-width: 1025px) {
	#content{
	float:left;
	width:33%;
}*/
/****************************footer************************/
footer { width:100%; position:relative; overflow:hidden; text-align:center; padding:7px 0 20px 0; }
footer span {display:inline-block; margin:0 auto; border-top:#3c3c3c 1px solid; padding-top:13px;line-height:22px;}
/**********************form**********************/
.map {width:265px; height:202px;margin-top:3px; }
.map iframe {width:265px; height:202px; }
dl {margin:20px 0px 0 0px;}
dl dt {line-height:24px; margin-bottom:3px;}
dl dd span { width:62px; text-align:right; display:block; float:left; margin-right:12px;}
dl dd {}
dl dd a {}
dl dd a:hover {}
#form { padding:3px 0 0px 0px; width:260px; }
#form input {border:#3f3f3f 1px solid; background:#2c2c2c; font-size:14px; font-family: "Times New Roman", Times, serif; color:#ffffff;padding:4px 10px 5px 10px;outline: medium none;width: 238px; height:17px; float:left; }
#form textarea {border:#3f3f3f 1px solid; background:#2c2c2c;font-size:14px; font-family:"Times New Roman", Times, serif;color:#ffffff; height: 130px;outline: medium none;overflow: auto; padding: 4px 0px 0px 10px;width: 248px;resize:none;margin:0px 0 0 0;float:left; }
#form label {position:relative;display: block;min-height:37px; overflow:hidden;}
.btns {text-align:right; margin-left:0px; overflow:hidden;}
.btns a.link-1 {display:inline-block; margin:14px 0px 0 25px; }

/* Estilos para el selector .element */
.element {
    -webkit-border-radius: 5px; /* Para Chrome */
    -moz-border-radius: 5px; /* Para Firefox */
    border-radius: 5px; /* Estándar */
}
/* === Responsive para pantallas de hasta 768px (móviles y tablets pequeños) === */
@media screen and (max-width: 768px) {
  body {
    font-size: 1.1em;
    min-width: unset; /* elimina el límite mínimo de 1024px */
  }

  .main, #content, header, nav {
    width: 100% !important;
    padding: 0 10px;
    box-sizing: border-box;
  }

  /* Colapsar todas las columnas en una sola */
  .col-1, .col-2, .col-3,
  .col-4, .col-5, .col-6,
  .col-7, .col-8, .col-9,
  .col-10, .col-11, .col-12,
  .col-13, .col-14, .col-15, .col-16 {
    float: none;
    width: 100% !important;
    margin: 0 0 20px 0;
  }

  /* Imágenes fluidas */
  img {
    max-width: 100%;
    height: auto;
  }

  /* Ajustes generales para secciones */
  .page1-row1,
  .page2-row1,
  .page2-row2,
  .page3-row1,
  .page4-row1,
  .page5-row1,
  .page6-row1 {
    padding: 20px 10px;
  }

  /* Navegación */
  ul.menu {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px 0;
  }

  ul.menu li {
    float: none;
    margin: 10px 0;
    padding: 0;
    background: none;
  }
}

@media screen and (max-width: 768px) {
  /* Asegura que la navegación no se desborde */
  .NavV,
  nav,
  header {
    width: 100%;
    overflow-x: auto;
    box-sizing: border-box;
    padding: 10px;
  }

  /* Ajusta los enlaces del menú para que se vean bien */
  .NavV ul.menu {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    margin: 0;
  }

  .NavV ul.menu li {
    float: none;
    margin: 10px 0;
    padding: 0;
    background: none;
  }

  .NavV ul.menu li a {
    font-size: 16px;
    display: block;
    padding: 10px;
    color: #000000;
    text-align: center;
  }

  /* Visor de imágenes (slider) */
  .slider, .gallery-photo, .gallery-block, .slider img {
    width: 100% !important;
    height: auto !important;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Asegura que el contenedor principal del slider no corte contenido */
  .main, #content {
    overflow-x: hidden;
  }
}

/* === Swiper slider básico integrado en style.css === */
.swiper-container {
  width: 100%;
  max-width: 1024px;
  margin: 0 auto;
}

.swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
}

.swiper-pagination {
  text-align: center;
  bottom: 10px !important;
}

/* Ajustes para que Swiper funcione correctamente */
.swiper-container {
  width: 100% !important;
  max-width: 1024px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

.swiper-wrapper {
  display: flex;
}

.swiper-slide {
  flex-shrink: 0;
  width: 100% !important;
  height: auto;
  display: block;
}

.swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

@media screen and (max-width: 1024px) {
  ul.menu li.li-left {
    margin-left: 0 !important;
  }
}

/* Tamaño del logo en dispositivos móviles y tablets */
@media screen and (max-width: 768px) {
  #logo {
    width: 150px !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
  }
}

@media screen and (max-width: 768px) {
  #logo {
    width: 150px !important;
    height: auto !important;
    display: block;
    margin: 0;
    text-align: left;
    float: left;
  }
}

@media screen and (max-width: 768px) {
  #logo {
    max-width: 150px !important;
    width: 100% !important;
    height: auto !important;
    display: block;
    margin: 10px 0 0 10px !important;
    float: none !important;
    position: relative;
  }
}

@media screen and (max-width: 768px) {
  header {
    width: 100% !important;
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
  }

  .subpages-nav {
    height: auto !important;
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
  }
}

/* === Reforzamos imágenes responsivas dentro del slider Swiper === */
.swiper-container {
  width: 100% !important;
  max-width: 1024px;
  margin: 0 auto;
  overflow: hidden;
}

.swiper-slide img {
  width: 100% !important;
  height: auto !important;
  display: block;
  object-fit: contain; /* Evita recortes si hay proporciones distintas */
}

/* === Reforzamos el Swiper slider para que redimensione en servidor === */
.swiper-container {
  width: 100% !important;
  max-width: 1024px !important;
  margin: 0 auto !important;
  overflow: hidden !important;
}

.swiper-wrapper {
  display: flex !important;
}

.swiper-slide {
  flex-shrink: 0 !important;
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.swiper-slide img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
}

/* Ajustes definitivos para Swiper Slider con compatibilidad Safari */

.swiper-container {
  width: 100% !important;
  max-width: 1024px !important;
  margin: 0 auto !important;
  overflow: hidden !important;
}

.swiper-wrapper {
  display: flex !important;
}

.swiper-slide {
  flex-shrink: 0 !important;
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.swiper-slide img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
}


/* == Carrusel reseñas */
.reseñas-section {
  max-width: 1024px; /*he cambiado de 600px a 1024 para que el contenedor de la reseña tenga el mismo ancho que el slide de imagenes y la image del Bono-Regalo*/
  margin: 3em auto;
  padding: 2em;
  text-align: center;
  font-family: 'Times New Roman", Times, serif;
  background: #faf5e1;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.05);
  border: 1px solid #d4af37; /* borde dorado */
}

.reseñas-section h2 {
  font-size: 1.6em;
  margin-bottom: 1.2em;
  color: #9e8a42;
}

.reseñas-carousel {
  position: relative;
  min-height: 180px;
}

.reseña {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  transition: opacity 0.6s ease-in-out;
  padding: 0 1em;
  box-sizing: border-box;
  /* border: 1px solid #d4af37; tono dorado */
  border-radius: 8px;
  padding: 1.2em;
  background-color: #fff;
}

.reseña.active {
  opacity: 1;
  position: relative;
}

.reseña p {
  font-size: 1.1em;
  font-style: italic;
  color: #444;
}

.reseña .estrellas {
  margin: 0.5em 0;
  color: #f8d147; /* Amarillo estrella */
}

.reseña span {
  display: block;
  margin-top: 0.5em;
  font-weight: bold;
  color: #777;
}

.flechas {
  margin-top: 1.5em;
  display: flex;
  justify-content: center;
  gap: 1.5em;
}

.flechas button {
  background-color: transparent;
  border: none;
  font-size: 2rem;
  cursor: pointer;
  color: #333;
  transition: color 0.3s ease;
}

.flechas button:hover {
  color: #666;
}

/* Responsive */
@media (max-width: 768px) {
  .reseñas-section {
    padding: 1.5em 1em;
  }
  .reseña p {
    font-size: 1em;
  }
}

@media (max-width: 480px) {
  .reseñas-section {
    margin: 2em 1em;
  }
  .reseña p {
    font-size: 0.95em;
  }
}

.regalo-parallax {
  position: relative;
  overflow: hidden;
  padding: 3em 1em;
  background: none;
  text-align: center;
  min-height: 450px;
}

.regalo-wrapper {
  position: relative;
  width: 100%;
  max-width: 1024px;
  margin: 0 auto;
}

.img-regalo {
  width: 100%;
  max-width: 1024px;
  height: auto;
  display: block;
  margin: 0 auto 1em;
  transition: transform 0.3s ease-out;
  will-change: transform;
}

.frase-regalo {
  font-size: 1.3em;
  color: #333;
  font-style: italic;
  margin-top: 0.5em;
}

/* Tablets */
@media (max-width: 768px) {
  .img-regalo {
    max-width: 90%;
  }
  .frase-regalo {
    font-size: 1.1em;
  }
}

/* Móviles */
@media (max-width: 480px) {
  .img-regalo {
    max-width: 100%;
  }
  .frase-regalo {
    font-size: 1em;
  }
}