/* Elimina márgenes y rellenos del body */
 
 @media (max-width: 700px) {
     body {
         margin: 0;
         padding: 0;
         background: #d08a8a;
     }
     #header img {
         width: 30%;
         position: absolute;
         padding: 10;
     }
     /* Estilo para los divs principales */
     .main-div {
         height: 100vh;
         /* Ocupa el 100% de la altura de la pantalla */
         display: flex;
         flex-direction: column;
         /* Alinea elementos en columna */
         justify-content: space-between;
         /* Distribuye espacio entre el contenido principal y el secundario */
         position: relative;
         /* Permite la posición absoluta del div secundario */
         padding: 20px;
         box-sizing: border-box;
         /* Incluye el padding dentro del tamaño total del div */
     }
     /* Estilo para los títulos en los divs principales */
     .main-title {
         margin: 0;
         font-size: 2em;
         text-align: left;
         font-family: "Amatic SC", sans-serif;
         font-weight: 500;
         margin-top: 26%;
         width: 75%;
         letter-spacing: 1px;
         word-spacing: 1.2pt;
         line-height: 0.9;
     }
     .main-title_pilares {
         margin: 0;
         font-size: 2em;
         text-align: left;
         font-family: "Amatic SC", sans-serif;
         margin-top: 20%;
         width: 100%;
         letter-spacing: 1px;
         word-spacing: 1.2pt;
         line-height: 0.9;
     }
     /* Estilo para los títulos en los divs principales */
     .main-title-campamentoHabitos {
         margin: 0;
         font-size: 2em;
         text-align: left;
         font-family: "Amatic SC", sans-serif;
         margin-top: -05%;
         width: 90%;
         letter-spacing: 1px;
         word-spacing: 1.2pt;
         line-height: 0.9;
     }
     .main-subtitles {
         margin: 0;
         font-size: 150%;
         text-align: left;
         font-family: "Amatic SC", sans-serif;
         margin-top: 0%;
         margin-left: 25%;
         width: 80%;
         letter-spacing: 1px;
         word-spacing: 1.2pt;
         line-height: 0.9;
         position: relative;
     }
     .main-subtitles_pilares {
         margin: 0;
         font-size: 150%;
         text-align: left;
         font-family: "Amatic SC", sans-serif;
         margin-top: 0%;
         margin-left: 54%;
         width: 30%;
         letter-spacing: 1px;
         word-spacing: 1.2pt;
         line-height: 0.9;
         position: relative;
     }
     /* Estilo para las imágenes y el texto en los divs principales */
     .main-content {
         flex-grow: 1;
         /* Permite que este div crezca y ocupe el espacio disponible */
         display: flex;
         flex-direction: column;
         justify-content: center;
         align-items: center;
     }
     .main-image {
         max-width: 30%;
         height: auto;
         margin-top: -50%;
         margin-left: -40%;
     }
     .main-image1 {
         display: none;
     }
     .main-image_campamento {
         max-width: 60%;
         height: auto;
         margin-top: 25%;
         margin-left: 75%;
         position: absolute;
     }
     .main-image_logoGrande {
         width: 40%;
         height: auto;
         margin-top: -4%;
         margin-left: 55%;
         position: absolute;
     }
     .main-text {
         font-size: 130%;
         text-align: left;
         width: 56%;
         margin-left: 50%;
         font-family: "Abel", sans-serif;
         margin-top: -68%;
     }
     .main-text_campamento {
         font-size: 130%;
         text-align: left;
         width: 70%;
         margin-left: 2%;
         font-family: "Abel", sans-serif;
         margin-top: -70%;
         font-weight: 100;
     }
     .main-text_campamento2 {
         font-size: 130%;
         text-align: left;
         width: 50%;
         margin-left: 2%;
         font-family: "Abel", sans-serif;
         margin-top: -100%;
         font-weight: 100;
     }
     /* Estilo para los divs secundarios */
     .secondary-div {
         left: 0%;
         height: 30%;
         /* Ocupa el 30% de la altura del div principal */
         /*background-color: rgba(0, 0, 0, 0.5); /* Color de fondo semi-transparente */
         background: #d3c8be;
         color: black;
         text-align: center;
         display: flex;
         flex-direction: column;
         justify-content: center;
         align-items: center;
         position: absolute;
         /* Posiciona el div en la parte inferior del div principal */
         bottom: 0;
         /* Ubica el div en la parte inferior */
         width: 100%;
         padding: 10px;
         box-sizing: border-box;
         /* Incluye el padding dentro del tamaño total del div */
     }
     .secondary-div_Comprar {
         left: 0%;
         height: 30%;
         /* Ocupa el 30% de la altura del div principal */
         /*background-color: rgba(0, 0, 0, 0.5); /* Color de fondo semi-transparente */
         background: #d08a8a;
         color: black;
         text-align: center;
         display: flex;
         flex-direction: column;
         justify-content: center;
         align-items: center;
         position: absolute;
         /* Posiciona el div en la parte inferior del div principal */
         bottom: -35%;
         /* Ubica el div en la parte inferior */
         width: 100%;
         padding: 10px;
         box-sizing: border-box;
         /* Incluye el padding dentro del tamaño total del div */
     }
     /* Estilo para los divs secundarios */
     .secondary-div1 {
         left: 0%;
         height: 30%;
         /* Ocupa el 30% de la altura del div principal */
         /*background-color: rgba(0, 0, 0, 0.5); /* Color de fondo semi-transparente */
         background: #d08a8a;
         color: black;
         text-align: center;
         display: flex;
         flex-direction: column;
         justify-content: center;
         align-items: center;
         position: absolute;
         /* Posiciona el div en la parte inferior del div principal */
         bottom: 0;
         /* Ubica el div en la parte inferior */
         width: 100%;
         padding: 10px;
         box-sizing: border-box;
         /* Incluye el padding dentro del tamaño total del div */
     }
     /* Estilo para las imágenes y el texto en los divs secundarios */
     .secondary-image {
         max-height: 60;
         max-width: 100%;
         height: auto;
         /* margin-bottom: 10px; */
         width: 44%;
         /* height: 100%; */
         margin-left: -55%;
         margin-top: -15%;
         /* overflow: hidden; */
         position: absolute;
         z-index: 20;
         -ms-transform: rotate(-8deg);
         /* IE 9 */
         -webkit-transform: rotate(-8deg);
         /* Chrome, Safari, Opera */
     }
     .secondary-image img {
         max-width: 100%;
         border: 1px solid #895454;
         border-radius: 10px;
     }
     .secondary-image_comprar {
         max-height: 60;
         max-width: 100%;
         height: auto;
         /* margin-bottom: 10px; */
         width: 44%;
         /* height: 100%; */
         margin-left: -55%;
         margin-top: 0%;
         /* overflow: hidden; */
         position: absolute;
         z-index: 20;
         -ms-transform: rotate(-8deg);
         /* IE 9 */
         -webkit-transform: rotate(-8deg);
         /* Chrome, Safari, Opera */
     }
     .secondary-image1 {
         max-height: 60;
         max-width: 100%;
         height: auto;
         /* margin-bottom: 10px; */
         width: 50%;
         /* height: 100%; */
         margin-left: -60%;
         margin-top: -15%;
         border: solid 1px #9a5555;
         border-radius: 20px;
         /* overflow: hidden; */
         position: absolute;
         z-index: 20;
         -ms-transform: rotate(11deg);
         /* IE 9 */
         -webkit-transform: rotate(11deg);
         /* Chrome, Safari, Opera */
     }
     .secondary-text {
         font-size: 150%;
         font-weight: bold;
         width: 50%;
         text-align: left;
         margin-left: 50%;
         bottom: 10%;
         font-family: "Amatic SC", sans-serif;
         z-index: 1;
     }
     .firma {
         width: 40%;
         margin-top: 0%;
         position: absolute;
     }
     /*Carrusel*/
     .bloque {
         font-family: Arial, sans-serif;
         background-color: #9b6f6f;
         display: flex;
         justify-content: center;
         align-items: center;
         height: auto;
         margin: 0;
         margin-top: 5%;
         width: 100%;
         overflow: hidden;
         border-radius: 20px;
     }
     .testimonial-container {
         width: 110%;
         max-width: 800px;
         height: 418px;
         overflow: hidden;
         position: relative;
         border-radius: 10px;
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
         background-color: #d08a8a;
         z-index: 500;
     }
     .testimonial-carousel {
         display: flex;
         transition: transform 0.4s ease;
     }
     .testimonial {
         min-width: 100%;
         box-sizing: border-box;
         padding: 10px;
         text-align: center;
     }
     .testimonial img {
         width: 50%;
         height: auto;
         border-radius: 5%;
         margin-bottom: 20px;
         margin-top: -6%;
         border: solid 1px #774c4c;
     }
     .img_test3 {
         width: 100%;
         height: auto;
         border-radius: 5%;
         margin-bottom: 20px;
         margin-top: 73%;
     }
     .carruselTextStyle1 {
         font-size: 140%;
         margin-bottom: 10px;
         color: black;
         font-family: "Amatic SC", sans-serif;
         letter-spacing: 1px;
         ;
     }
     .carruselTextStyle2 {
         font-size: 130%;
         margin-bottom: 10px;
         color: #333;
         font-family: "Abel", sans-serif;
         width: 100%;
         text-align: center;
         font-weight: 100;
     }
     .carruselTextStyle3 {
         font-size: 130%;
         margin-bottom: 10px;
         color: #333;
         font-family: "Abel", sans-serif;
         width: 100%;
         text-align: center;
         font-weight: 100;
         margin-top: -60%;
         text-align: left;
     }
     .textStyle2 {
         font-size: 80%;
         margin-bottom: 10px;
         color: #333;
         font-family: "Abel", sans-serif;
         width: 100%;
         text-align: center;
         font-weight: 100;
     }
     .testimonial h3 {
         font-size: 1.2em;
         margin-bottom: 10px;
         color: #333;
     }
     .titulos {
         font-size: 130%;
         margin-bottom: 10px;
         color: red;
         text-align: center;
     }
     .testimonial p {
         font-size: 1em;
         color: #666;
     }
     .testimonial-indicators {
         text-align: center;
         margin: 10px 0;
         position: absolute;
         bottom: 10px;
         width: 100%;
     }
     .dot {
         display: inline-block;
         width: 10px;
         height: 10px;
         margin: 0 5px;
         background-color: #8c4444;
         border-radius: 50%;
         cursor: pointer;
         transition: background-color 0.3s ease;
     }
     .dot.active {
         background-color: rgb(231, 225, 225);
     }
     /*Cierra Carrusel*/
     /*Carrusel 2*/
     .carousel-container_2 {
         max-width: 800px;
         margin: auto;
         padding: 20px;
         text-align: center;
         background: #d08a8a;
         ;
         height: 600px;
         margin-top: 100%;
     }
     .carousel_2 h2 {
         font-family: 'Amatic SC', sans-serif;
         font-size: 36px;
         margin-bottom: 20px;
         color: white;
     }
     .carousel_2 {
         position: relative;
         overflow: hidden;
         border-radius: 10px;
         max-width: 100%;
         font-family: 'Amatic SC', sans-serif;
     }
     .carousel-inner_2 {
         display: flex;
         transition: transform 0.5s ease-in-out;
         width: 300%;
     }
     .carousel-slide_2 {
         min-width: 100%;
         box-sizing: border-box;
         padding: 20px;
         background-color: #d3c8be;
         border-radius: 10px;
         margin-top: 5%;
         height: 500px;
     }
     .testimonial_2 {
         text-align: center;
         width: 30%;
         height: 400px;
         font-family: 'Amatic SC', sans-serif;
     }
     .image-container_2 {
         width: 120px;
         height: 120px;
         margin: auto;
         border-radius: 50%;
         overflow: hidden;
         margin-bottom: 15px;
     }
     .image-container_2 img {
         width: 100%;
         height: auto;
     }
     .testimonial_2 h3_2 {
         font-family: 'Amatic SC', sans-serif;
         font-size: 24px;
         margin: 10px 0;
         font-family: "Abel", sans-serif;
     }
     .testimonial_2 h4 {
         font-family: "Abel", sans-serif;
         font-weight: bold;
         font-size: 18px;
         margin-bottom: 15px;
         color: #444;
     }
     .testimonial_2 p {
         font-family: "Abel", sans-serif;
         font-size: 130%;
         color: #666;
         padding: 0 20px;
         font-weight: 100;
     }
     .carousel-nav_2 {
         text-align: center;
         margin-top: 15px;
     }
     .dot_2 {
         height: 12px;
         width: 12px;
         margin: 0 5px;
         background-color: #bbb;
         border-radius: 50%;
         display: inline-block;
         cursor: pointer;
     }
     .active_2,
     .dot_2:hover {
         background-color: #717171;
     }
     @media (max-width: 600px) {
         .carousel-slide_2 {
             padding: 10px;
         }
         .testimonial_2 h3_2 {
             font-size: 20px;
         }
         .testimonial_2 h4_2 {
             font-size: 16px;
         }
         .testimonial_2 p_2 {
             font-size: 14px;
         }
     }
     /*Cierra Carrusel 2*/
     /*Tabla de precios*/
     .pricing-table {
         display: flex;
         flex-wrap: wrap;
         /* Permite que los elementos se ajusten en filas para pantallas más pequeñas */
         justify-content: center;
         /* Centra los planes en la página */
         gap: 20px;
         /* Espacio entre los planes */
         z-index: 10;
     }
     .pricing-card {
         background-color: #d3c8be;
         border: 1px solid #878383;
         border-radius: 8px;
         box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
         width: 300px;
         /* Ancho fijo para la tarjeta */
         padding: 20px;
         text-align: center;
         transition: transform 0.3s ease;
     }
     .pricing-card:hover {
         transform: scale(1.05);
         /* Efecto de hover para agrandar ligeramente la tarjeta */
     }
     .pricing-title {
         font-size: 24px;
         margin-bottom: 10px;
         color: #333;
     }
     .pricing-price {
         font-size: 28px;
         font-weight: bold;
         margin-bottom: 20px;
         color: #e67e22;
     }
     .pricing-feature {
         font-size: 16px;
         margin-bottom: 10px;
         color: #555;
     }
     .pricing-button {
         display: inline-block;
         margin-top: 20px;
         padding: 10px 20px;
         font-size: 16px;
         color: #fff;
         background-color: #9a5555;
         border-radius: 5px;
         text-decoration: none;
         transition: background-color 0.3s ease;
     }
     .pricing-button:hover {
         background-color: #d35400;
         /* Color más oscuro al hacer hover */
     }
     @media (max-width: 768px) {
         .pricing-card {
             width: 100%;
             /* Ocupa todo el ancho disponible en pantallas pequeñas */
         }
     }
     /*Cierra Tabla de precios*/
     /*footer*/
     .footer {
         background-color: #3a2c39;
         color: white;
         padding: 20px 0;
         text-align: center;
         margin-top: 10%;
         border-radius: 10px;
     }
     .footer .container {
         display: flex;
         flex-direction: column;
         align-items: center;
         justify-content: space-around;
     }
     .footer-section {
         margin-bottom: 20px;
     }
     .footer-section {
         margin-bottom: 10px;
         font-size: 18px;
         font-family: "Abel", sans-serif;
         font-weight: 100;
         color: #d08a8a;
     }
     .footer-section ul {
         list-style: none;
         padding: 0;
     }
     .footer-section ul li {
         margin-bottom: 8px;
     }
     .footer-section ul li a {
         color: white;
         text-decoration: none;
         transition: color 0.3s;
     }
     .footer-section ul li a:hover {
         color: #b8a9c9;
     }
     .footer_text {
         margin-bottom: -16px;
         font-size: 18px;
         font-family: "Abel", sans-serif;
         font-weight: bold;
         color: #d08a8a;
     }
     /* Responsivo */
     @media(min-width: 768px) {
         .footer .container {
             flex-direction: row;
         }
         .footer-section {
             margin-bottom: 0;
         }
     }
 }
 /*Cierra footer*/