/*
Theme Name: Under Sea Diving
Theme URI: undertheseadivingcr.com
Description: Customized Theme for Under The Sea Diving CR
Author: Jota Works Web Development
Author URI: https://jota.works
Version: 4.1.3 - 17.9.25
*/

/*Utilities*/

:target {
    scroll-padding-top: 100px; /* Adjust this value to match your header height */
    scroll-margin-top: 100px;
}


body {
    margin: 0;
    background-color: #fff;
    overflow-x: hidden !important;
}

body.loading {
    overflow: hidden;
    /* Optional: Prevents a slight page shift when the scrollbar disappears */
    /* Adjust this width if you know the exact scrollbar width for your design */
    width: calc(100vw - 17px);
}

/* Ajuste del contenedor principal del dropdown para que sea relativo */
.dropdown {
  position: relative;
  display: inline-block;
	margin: 0 5%;
}

html {
  scroll-behavior: smooth;
  margin: 0 !important;
}

/*Main Stylings*/

    /*Button*/
.btn {
  transition: 
    border-radius 0.3s ease-in-out, 
    font-size 0.3s ease-in-out,
    transform 0.3s ease-in-out;
}

.btn:hover {
  border-radius: 4px;
  transform: scale(1.15); 
}

/*Navbar*/

/* ======================= */
/* Utilities Navbar */
/* ======================= */

/*
 * Final CSS for the header with a black overlay.
 */
.header {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
}

/* ======================= */
/* Desktop Navbar */
/* ======================= */

.dropdown-content {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: rgba(0, 0, 0, 0.8);
  width: 440px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
  z-index: 10;
  border-radius: 4px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.width-override {
  width: 300px !important;
}

/* Two-column layout inside dropdown */
.dropdown-content .columna {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-top: 10px;
}

.dropdown-content .columna a {
  display: block;
  color: #fff;
  padding: 10px 16px;
  text-decoration: none;
  font-weight: 400;
  height: 60px;
  transition: background-color 0.3s ease;
}

.a_tamani {
  height: 30px !important;
}

.nav_item_all_s2 .a_tamani {
    text-align: left;
}

.dropdown-content .columna a:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

/* Show dropdown on hover (desktop only) */
.dropdown:hover .dropdown-content {
  display: flex;
}

/* Announcement bar */
.header-announcement-bar__content,
.text_notes {
  color: #fff;
  padding: 10px;
  margin: 0 !important;
}

.header-announcement-bar,
.div_notes {
  background-color: #0000004d;
}

.header-desktop-wrapper{
    display:flex;
    flex-direction: column;
    position: fixed;
    width: 100%;
    z-index: 1000;
    background: rgba(0, 0, 0, .7);
}

/* ======================= */
/* Responsive Navbar */
/* ======================= */

.header-navbar-responsive__links {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
}

.header-navbar-responsive__links.show_nav {
    max-height: 1000px; /* enough for all items */
}

/* Submenu container */
.header-navbar-responsive .responsive-dropdown-container > .responsive-dropdown-content {
    background-color: #212121;
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    /* Fade-in/out transition properties */
    visibility: hidden;
    opacity: 0;
    /* Delay the visibility change until after the opacity transition is complete */
    transition: opacity 0.3s ease-in-out, visibility 0s 0.3s;
}

/* Show submenu when parent is active */
.header-navbar-responsive .responsive-dropdown-container.active > .responsive-dropdown-content {
    visibility: visible;
    opacity: 1;
    /* This transition is instant, so the fade-in starts immediately */
    transition: opacity 0.3s ease-in-out, visibility 0s;
    padding-top: 18px;
}

/* Links inside submenus */
.header-navbar-responsive .responsive-dropdown-container .responsive-dropdown-content li,
.header-navbar-responsive .responsive-dropdown-container .responsive-dropdown-content a {
    display: block;
    margin: 0;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

/* Hover effect for the links */
.header-navbar-responsive .responsive-dropdown-container .responsive-dropdown-content a:hover {
    background-color: #3d3d3d;
}

/* Optional nested link indentation */
.header-navbar-responsive .responsive-dropdown-content li a {
    padding-left: 30px;
}

/* End Navbar */

h1 {
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    letter-spacing: 2px;
    font-size: 48px;
}

h2 {
    font-family: 'Lato', sans-serif;
}

p {
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    color: #333333;
}

a {
    font-family: 'Lato', sans-serif;
}

.negrita{
	font-weight: bold;
}


.slider-container {
    overflow: hidden;
    position: relative;
    width: 100%;
    max-width: 800px; /* Ajusta este valor según sea necesario */
    margin: 0 auto;
}

.slider-wrapper {
    display: flex;
    transition: transform 0.5s ease;
    width: 100%;
}

.Testiminio_S6_HOME {
    min-width: 100%;
    box-sizing: border-box;
}

.fnd_blanco_Testiminio_S6_HOME {
    background: white;
    padding: 20px;
    margin: 10px;
    border-radius: 5px;
}

.p_section_6_home_under,
.p_name_section_6_home_under {
    margin: 0;
}

.header {
    position: relative;
    text-align: center;
    color: white;
    height: 100vh;
    overflow: hidden;
}

.header-navbar-responsive__box-logos,
.logo /*TO DELETE AFTER REFACTOR*/{
    width: 50px;
    fill: white;
    padding-right: 15px;
    display: inline-block;
    vertical-align: middle;
}

.slider-container {
    overflow: hidden;
    position: relative;
    width: 100%;
}

.slider-wrapper {
    display: flex;
    transition: transform 0.5s ease;
}

.inner-header {
    height: 65vh;
    width: 100%;
    margin: 0;
    padding: 0;
}

.flex {
    /*Flexbox for containers*/
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.waves {
    position: relative;
    width: 100%;
    height: 30vh;
}

.content {
    position: relative;
    height: 20vh;
    text-align: center;
    background-color: white;
}


/* Animation */

.parallax>use {
    animation: move-forever 25s cubic-bezier(.55, .5, .45, .5) infinite;
}

.parallax>use:nth-child(1) {
    animation-delay: -2s;
    animation-duration: 7s;
}

.nav_links {
    text-decoration: none;
    font-family: 'Monserat_Normal';
    color: #fff;
}

.parallax>use:nth-child(2) {
    animation-delay: -3s;
    animation-duration: 10s;
}

.parallax>use:nth-child(3) {
    animation-delay: -4s;
    animation-duration: 13s;
}

.parallax>use:nth-child(4) {
    animation-delay: -5s;
    animation-duration: 20s;
}

@keyframes move-forever {
    0% {
        transform: translate3d(-90px, 0, 0);
    }
    100% {
        transform: translate3d(85px, 0, 0);
    }
}


/*Shrinking for mobile*/

@media (max-width: 768px) {
    .waves {
        height: 30vh;
        min-height: 40px;
    }
    .content {
        height: 30vh;
    }
    h1 {
        font-size: 24px;
    }
}

.section_2_home_under {
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 2%;
}

.box {
    opacity: 0;
    transform: translateY(200px);
    transition: opacity 1.5s ease-out, transform 1.5s ease-out;
}

.box.visible {
    opacity: 1;
    transform: translateY(0);
}

.box_izq {
    opacity: 0;
    transform: translateX(-200px);
    /* Mueve desde la izquierda */
    transition: opacity 1.5s ease-out, transform 1.5s ease-out;
    /* Transición lenta */
}

.box_izq.visible {
    opacity: 1;
    transform: translateX(0);
    /* Posición original */
}

.box_derecha {
    opacity: 0;
    transform: translateX(200px);
    transition: opacity 1.5s ease-out, transform 1.5s ease-out;
}

.box_derecha.visible {
    opacity: 1;
    transform: translateX(0);
    /* Posición original */
}

/*NEEDS TO BE CLEANED UP AFTER REFACTOR FINISH*/

.title_styles-h2 /* OLD CODE */,
.cressi-lead-section__heading{
    color: #fc6c04;
    font-size: 45px;
    padding: 4%;
    margin: 0;
}

.cressi-lead-section__heading{
    text-align:center;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.about_title_container{
    padding: 50px 0 50px 0;
}

/*NEEDS TO BE CLEANED UP AFTER REFACTOR FINISH*/

.p_section_2_home_under {
    color: #000;
    font-size: 25px;
    width: 75%;
    padding: 1%;
    text-align: center;
    margin: 0%;
}

.a_section_2_home_under {
    color: #fff;
    background-color: #05233a;
    padding: 1% 4%;
    font-size: 25px;
    text-align: center;
    text-decoration: none;
    font-weight: bolder;
    margin: 1%;
    text-align: center;
    text-decoration: none;
    font-weight: bolder;
    margin: 1%;
}

.section_3_home_under {
    position: relative;
    height: 70vh;
    overflow: hidden;
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

.int_section_3_home_under {
    width: 60%;
    display: flex;
    flex-direction: column;
    align-items:flex-end;
    padding-left: 5%;
}


.h2_int_section_3_home_under {
    font-size: 45px;
    padding: 1%;
    margin: 0;
    font-weight: bold;
    color: #fff;
    width: 50%;
}

.cress-lead-section__DAN-content__p,
.p_int_section_3_home_under {
    color: #fff;
    font-size: 25px;
    width: 50%;
    padding: 1%;
    text-align: center;
    margin: 0%;
}

.a_int_section_3_home_under {
    color: #fff;
    background-color: #05233a85;
    padding: 1% 4%;
    width: 15%;
    font-size: 25px;
    text-align: center;
    text-decoration: none;
    font-weight: bolder;
    margin: 1%;
    text-align: center;
    text-decoration: none;
    font-weight: bolder;
    margin: 1%;
}

.section_4_home_under {
    background-color: #fff;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.p_section_4_home_under {
    width: 70%;
    color: #000;
    font-size: 40px;
    font-weight: bold;
    text-align: center;
}

.section_5_home_under {
    width: 100%;
    background-color: #05233a;
}

.p_section_5_home_under {
    width: 70%;
    font-size: 25px;
    color: #fff;
    text-align: center;
}

.int_section_5_home_under {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
    padding: 4%;
}

.a_section_5_home_under {
    background-color: #fff;
    color: #05233a;
    padding: 1% 4%;
    text-decoration: none;
    font-size: 25px;
    font-weight: bold;
    margin-top: 2%;
}

.h2_section_6_home_under {
    font-size: 45px;
    padding: 1%;
    margin: 0;
    font-weight: bold;
    color: #fff;
    width: 100%;
    text-align: center;
	cursor: pointer;
}

.section_6_home_under {
    position: relative;
    height: 70vh;
    overflow: hidden;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 2% 0%;
}

.fnd_blanco_Testiminio_S6_HOME {
    background-color: #fff;
    display: flex;
    flex-direction: column;
    width: 80% !important;
    margin: 0 auto;
    padding: 2%;
}

.Testiminio_S6_HOME {
    width: 100%;
}

.p_section_6_home_under {
    font-size: 25px;
    color: #05233a;
    text-align: center;
}

.p_name_section_6_home_under {
    font-size: 28px;
    color: #05233a;
    text-align: center;
    font-weight: bold;
	margin-top: 4%;
}

.about-container,
.section_7_home_under /*DELETE AFTER REFACTOR*/  {
    background-color: #fff;
    width: 100%;
    position: relative;
}

.about-container__interior,
.int_section_7_home_under /*DELETE AFTER REFACTOR*/ {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 4%;
}

.h2_int_section_7_home_under {
    font-size: 45px;
    margin: 0;
    font-weight: bold;
    color: #05233a;
}

.about-container__interior-p,
.p_int_section_7_home_under /*DELETE AFTER REFACTOR*/ {
    font-size: 25px;
    color: #05233a;
    text-align: left;
    width: 80%;
    margin: 1% 3%;
}

.about-container-a,
.a_int_section_7_home_under /*DELETE AFTER REFACTOR*/ {
    width: 15% !important;
    font-size: 21px;
}

.img_section_7_home_under {
    position: absolute;
    top: 20%;
    /* Centra verticalmente dentro del contenedor */
    right: 4%;
    transform: translateY(-50%);
    /* Ajusta el centrado vertical */
    width: 500px;
    height: 500px;
    object-fit: cover;
	border-radius: 100%;
}

.about-container__interior-img,
.img_section_2_about_under /*DELETE AFTER REFACTOR*/ {
    width: 400px;
    height: 450px;
    border-radius: 10%;
    object-fit: cover;
}

.footer {
    background-color: #05233a;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.footer_int {
    width: 100%;
    display: flex;
    flex-direction: row;
}

.int_footer_1 {
    width: 40%;
}

.int_footer_2 {
    width: 60%;
    display: flex;
    flex-direction: row;
}

.int_1_int_footer_2 {
    padding: 4% 2%;
    display: flex;
    flex-direction: column;
    width: 33.3%;
}

.int_2_int_footer_2 {
    padding: 4% 2%;
    display: flex;
    flex-direction: column;
    width: 33.3%;
}

.int_3_int_footer_2 {
    padding: 4% 2%;
    display: flex;
    flex-direction: column;
    width: 33.3%;
}

.h2_int_1_int_footer_2 {
    color: #fff;
}

.p_int_1_int_footer_2 {
    color: #fff;
    margin: 10px 0% !important;
    font-size: 16px;
}

.h2_int_2_int_footer_2 {
    color: #fff;
}

.p_int_3_int_footer_2_a {
    color: #fff;
    text-decoration: none;
    margin: 5px 0% !important;
    font-size: 16px;
}

.p_int_3_int_footer_2_a a {
    color: #fff;
    text-decoration: none;
}

.h2_int_3_int_footer_2 {
    color: #fff;
}

.p_int_3_int_footer_2 {
    color: #fff;
    margin: 10px 0% !important;
    font-size: 16px;
}

.img_int_footer_1 {
    width: 250px;
}

.div_img_logo_footer {
    width: 300px;
    padding-left: 8%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 6%;
}

.icons_footer {
    width: 300px;
    display: flex;
    flex-direction: row;
    padding-left: 8%;
}

.div_icons_footer {
    width: 25%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.header-branding__icons__socials__image,
.img_icons_footer /*DELETE AFTER REFACTOR*/{
    width: 45px;
}

.credits_footer {
    width: 100%;
    display: flex;
    flex-direction: row;
}

.div_credits_footer_1 {
    width: 50%;
}

.div_credits_footer_1_p {
    color: #fff;
    font-size: 16px;
    text-align: left;
    padding-left: 8%;
    padding-top: 2%;
    padding-bottom: 2%;
}

.div_credits_footer_2_p {
    color: #fff;
    font-size: 16px;
    text-align: right;
    padding-right: 8%;
    padding-top: 2%;
    padding-bottom: 2%;
}

.div_credits_footer_2 {
    width: 50%;
}

.a_foter_kmsoft {
    color: #fff;
    font-size: 16px;
    text-decoration: none;
    font-weight: bold;
}

.nav_item_all {
    width: 100%;
    display: flex;
    flex-direction: row;
    height: 10vh;
    background-color: #0000004d;
}

.nav_item_all_s1 {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: left;
}

.nav_item_all_s2 {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: right;
}

.a_nav_item_all_s1 {
    text-decoration: none;
    color: #fff;
    margin: 0% 5%;
}

.a_nav_item_all_s2 {
    text-decoration: none;
    color: #fff;
    margin: 0% 5%;
}

.padding_nav_item_all_s1 {
    padding-left: 5%;
    width: 100%;
    text-align: left;
}

.padding_nav_item_all_s2 {
    padding-right: 5%;
    width: 100%;
    text-align: right;
}

.header__content,
.content_s1_home /*TO DELETE AFTER REFACTOR*/{
    width: 100%;
    height: 55vh;
    display: flex;
    flex-direction: row;
    padding-top: 15vh;
}

.header__content__box,
.div1_content_s1_home /*TO DELETE AFTER REFACTOR*/{
    width: 60%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    line-height: 0.9;
    padding-left: 6px;
}

.header__content__box a{
    width: fit-content;
}

.header-branding,
.div2_content_s1_home /*TO DELETE AFTER REFACTOR*/,
.div2_content_s1_contact /*TO DELETE AFTER REFACTOR*/{
    width: 40%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}


.header__content__box__title1,
.p1_content_s1_home /*DO DELETE AFTER REFACTOR*/{
    color: transparent;
    -webkit-text-stroke: 1px #fff;
    font-size: 80px;
    font-weight: 900;
    margin: 0%;
    padding-left: 8%;
    text-transform: uppercase;
}

.header__content__box__title2,
.header__content__box__title3,
.p2_content_s1_home /*TO DELETE AFTER REFACTOR*/{
    color: #fff;
    font-size: 70px;
    font-weight: 900;
    margin: 0%;
    padding-left: 8%;
    text-transform: uppercase;
}

.header-home__content__contentbox__btn /*BTN STYLINGS, FIGURE OUT HOW TO BETTER REFACTOR WHEN DOING SASS UPDATE*/,
.a_content_s1_home /*TO DELETE AFTER REFACTOR*/{
    color: #fff;
    background-color: #05233a85;
    padding: 1% 4%;
    width: 20%;
    font-size: 20px;
    font-weight: bold;
    margin-left: 8%;
    text-align: center;
    margin-top: 2%;
    cursor: pointer;
	text-decoration: none;
}

.header-branding__logo,
.img_div2_content_s1_home /*TO DELETE AFTER REFACTOR*/ {
    width: 65%;
}

.header-branding__icons,
.icons_header /*TO DELETE AFTER REFACTOR*/ {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 29vh;
    right: 3%;
}

.header-conservation__content,
.content_header_s1_tours /*TO DELETE AFTER REFACTOR*/{
    width: 100%;
    display: flex;
    flex-direction: row;
    height: 55vh;
}

.content_header_s1_courses {
    width: 100%;
    display: flex;
    flex-direction: row;
    height: 55vh;
}

.header-conservation__content__imagebox,
.content_img_s1_tours /*TO DELETE AFTER REFACTOR*/{
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.content_text_s1_tours /*TO DELETE AFTER REFACTOR */{
    width: 50%;
    line-height: 0.9;
    display: flex;
    align-items: start;
    justify-content: center;
    flex-direction: column;
}

.header__content__box__logo-wrapper{
    padding-left: 6%;
}    
.header__content__box__padilogo,
.img_padi_courses /*TO DELETE AFTER REFACTOR*/ {
    width: 300px;
    object-fit: cover;
}

.header-conservation__content__imagebox__image,
.img_content_img_s1_tours /*TO DELETE AFTER REFACTOR*/{
    width: 55%;
}

.img_content_img_s1_courses {
    width: 55%;
}

.p1_content_s1_tours /*DELETE THIS WHOLE SECTION AFTER REFACOR*/ {
    color: transparent;
    -webkit-text-stroke: 1px #fff;
    font-size: 110px;
    font-weight: 900;
    margin: 0%;
    padding-left: 8%;
}

.header-conservation__texbox__title,
.p1_content_s1_special /*TO DELETE AFTER REFACTOR*/{
    color: transparent;
    -webkit-text-stroke: 1px #fff;
    font-size: 90px;
    font-weight: 900;
    margin: 0%;
    padding-left: 8%;
}

.header-conservation__texbox__title{
    font-size: 75px !important;
}

.content_s2_tours /*TO DELETE AFTER REFACTOR*/{
    width: 100%;
    background-color: #fff;
    display: flex;
    flex-direction: row;
    padding-bottom: 2%;
}

.text_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
    width: 50%;
    display: flex;
    flex-direction: column;
}

.h2_text_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
    color: #05233a;
    font-size: 45px;
    padding: 1%;
    margin: 0;
    padding-left: 6%;
    padding-top: 4%;
    font-family: 'Monserat_Normal';
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5)
}

.p_text_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
    color: #05233a;
    font-size: 20px;
    padding: 1%;
    text-align: left;
    margin: 0%;
    padding-left: 6%;
    font-family: 'Monserat_Normal';
}

.img_text_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.img_img_text_content_s2_tours {
    width: 400px;
	height: 400px;
	border-radius: 100%;
    object-fit: cover;
}

.descrip_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
    width: 100%;
    display: flex;
    flex-direction: column;
}

.descrip_content_s2_courses {
    width: 80%;
    display: flex;
    flex-direction: column;
}

.price_descrip_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
    font-size: 40px;
    color: #05233a;
    text-align: center;
    font-weight: bold;
    font-family: 'Monserat_Normal';
    padding-top: 2%;
    margin: 0px;
}

.tax_descrip_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
    font-size: 40px;
    color: #05233a;
    text-align: center;
    font-family: 'Monserat_Normal';
    margin: 0px;
}

.p_peq_descrip_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
    font-size: 14px;
    margin: 0px;
    text-align: center;
    color: #05233a;
}

.img_wapes {
    height: 60vh;
    width: 100%;
}

.content_section_3_tours /*TO DELETE AFTER REFACTOR*/ {
    width: 100%;
    display: flex;
    flex-direction: column;
    background-color: #05233a;
}


.wapes_1_s3_tours/*TO DELETE AFTER REFACTOR*/ {
    width: 100%;
    height: 310px;
    background-color: #fff
}

.img_wapes_1_s3_tours/*TO DELETE AFTER REFACTOR*/ {
    width: 100%;
}

.body_content_section_3_tours/*TO DELETE AFTER REFACTOR*/ {
    width: 100%;
    display: flex;
    flex-direction: row;
    background-color: #05233a;
}

.image-container__content/*DOUBLE UP WITH section-contnet-secondary*/,
.img_text_content_s3_tours /* TO DELETE AFTER REFACTOR*/ {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.img_img_text_content_s3_tours /* TO DELETE AFTER REFACTOR*/ {
    width: 450px;
    height: 450px;
    border-radius: 100%;
    object-fit: cover;
}

.descrip_content_s3_tours/*TO DELETE AFTER REFACTOR*/ {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.price_descrip_content_s3_tours/*TO DELETE AFTER REFACTOR*/ {
    font-size: 40px;
    color: #fff;
    text-align: center;
    font-weight: bold;
    font-family: 'Monserat_Normal';
    padding-top: 2%;
    margin: 0px;
}

.tax_descrip_content_s3_tours/*TO DELETE AFTER REFACTOR*/ {
    font-size: 40px;
    color: #fff;
    text-align: center;
    font-family: 'Monserat_Normal';
    margin: 0px;
}

.p_peq_descrip_content_s3_tours/*TO DELETE AFTER REFACTOR*/ {
    font-size: 14px;
    margin: 0px;
    text-align: center;
    color: #fff;
}

.text_content_s3_tours /*TO DELETE AFTER REFACTOR*/{
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.h2_text_content_s3_tours/*TO DELETE AFTER REFACTOR*/ {
    color: #fc6c04;
    font-size: 45px;
    padding: 1%;
    margin: 0;
    padding-right: 6%;
    padding-top: 4%;
    text-align: end;
    font-family: 'Monserat_Normal';
}

.p_text_content_s3_tours /*TO DELETE AFTER REFACTOR*/{
    color: #FFF;
    font-size: 20px;
    padding: 1%;
    text-align: right;
    margin: 0%;
    padding-right: 6%;
    font-family: 'Monserat_Normal';
}


.p_contente_descrip_special {
    color: #05233a;
    font-size: 25px;
	width: 60%;
    font-family: 'Monserat_Normal';
    margin: 3%;
	text-align: center;
	font-weight: 500;
}

.p2_content_s1_contact {
    color: #fff;
    font-size: 100px;
    font-weight: bold;
    margin: 0%;
    padding-left: 12%;
    font-family: 'Monserat_Normal';
}

.div1_content_s1_contact {
    width: 60%;
    display: flex;
    flex-direction: column;
    justify-content: end;
    text-align: left;
    line-height: 0.9;
}

.content_section_2_contact {
    width: 100%;
    background-color: #fff;
}

.h2_content_section_2_contact {
    color: #fc6c04;
    font-size: 30px;
    padding: 2%;
    margin: 0;
    font-family: 'Monserat_Normal', sans-serif;
    text-align: center;
    padding-bottom: 6%;
}

.p1_content_s3_contact {
    color: transparent;
    -webkit-text-stroke: 1px #fff;
    font-size: 50px;
    font-weight: 900;
    margin: 0%;
    padding-left: 8%;
}

.content_section_3_contact {
    width: 100%;
    display: flex;
    flex-direction: row;
    background-color: #05233a;
    padding: 4% 0%;
}

.text_content_s3 {
    width: 50%;
    display: flex;
    flex-direction: column;
    margin: 2%;
}

.form_content_s3 {
    width: 50%;
    display: flex;
    flex-direction: column;
    padding: 2%;
}

.content_icons_contact {
    display: flex;
    flex-direction: row;
    width: 100%;
    padding-left: 8%;
}

.text_icon_s3 {
    color: #fff;
    font-size: 22px;
    margin-left: 2%;
    margin-bottom: 3%;
    font-family: 'Monserat_Normal', sans-serif;
}

.icon_s3_contact {
    object-fit: contain !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.form_Sent_contact {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.form_name_lastname {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 3%;
}

#fname {
    width: 48%;
    background-color: #a19d9d59;
    border: none;
    height: 40px;
    /* Altura del input */
    padding: 10px 20px;
    /* Padding para centrar verticalmente */
    box-sizing: border-box;
    /* Incluye padding en la altura total */
    color: #fff;
	font-size: 18px;
}

#fname::placeholder {
    color: #fff;
    font-family: 'Monserat_Normal', sans-serif;
    font-size: 22px;
    justify-content: center;
    font-weight: normal;
}

#lname {
    width: 48%;
    height: 40px;
    /* Altura del input */
    padding: 10px 20px;
    /* Padding para centrar verticalmente */
    box-sizing: border-box;
    /* Incluye padding en la altura total */
    background-color: #a19d9d59;
    border: none;
    color: #fff;
	font-size: 18px;
}

#lname::placeholder {
    color: #fff;
    font-family: 'Monserat_Normal', sans-serif;
    font-size: 22px;
    font-weight: normal;
}

#email {
    width: 100%;
    background-color: #a19d9d59;
    border: none;
    height: 40px;
    /* Altura del input */
    padding: 10px 20px;
    /* Padding para centrar verticalmente */
    box-sizing: border-box;
    /* Incluye padding en la altura total */
    color: #fff;
	font-size: 18px;
}

#email::placeholder {
    color: #fff;
    font-family: 'Monserat_Normal', sans-serif;
    font-size: 22px;
    justify-content: center;
    font-weight: normal;
}

#message {
    width: 100%;
    background-color: #a19d9d59;
    border: none;
    height: 120px;
    /* Altura del input */
    padding: 10px 20px;
    /* Padding para centrar verticalmente */
    box-sizing: border-box;
    /* Incluye padding en la altura total */
    color: #fff;
	font-size: 18px;
}

#message::placeholder {
    color: #fff;
    font-family: 'Monserat_Normal', sans-serif;
    font-size: 22px;
    font-weight: normal;
}

.submt_form {
    background-color: #fc6c04;
    color: #fff;
    text-decoration: none;
    padding: 1% 8%;
    font-weight: 600;
    font-size: 20px;
    font-family: 'Monserat_Normal';
    width: 50%;
    margin: 0 auto;
    border: none;
}


.accordion {
    background-color: #fff;
    color: #000;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border-bottom: 1px solid #000 !important;
    border: none;
    text-align: left;
    outline: none;
    font-size: 22px;
    font-weight: 600;
    transition: 0.4s;
    font-family: 'Monserat_Normal';
}

/*.accordion.active,*/
/*.accordion:hover {*/
/*    background-color: #fff;*/
/*}*/

.accordion:after {
    content: '\002B';
    color: #000;
    font-weight: bold;
    float: right;
    margin-left: 5px;
}

/*.active:after {*/
/*    content: "\2212";*/
/*}*/

.panel {
    padding: 0 18px;
    background-color: white;
    max-height: 0;
    overflow: hidden;
    font-family: 'Monserat_Normal';
    transition: max-height 0.2s ease-out;
}

.acordion_img_s4_contact {
    width: 100%;
    background-color: #fff;
    display: flex;
    flex-direction: row;
}

.acordeopn_s4_contact {
    width: 50%;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 4%
}

.img_acor_s4_contact {
    width: 50%;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 4%
}

.img_s4_contact {
    width: 400px;
    height: 400px;
    border-radius: 100%;
    object-fit: cover;
}

.header-navbar-responsive,
.navbar /*TO DELETE AFTER REFACTOR*/{
    display: none;
}

@media only screen and (max-width: 1200px) {
.img_section_2_about_under {
       display: none !important;
    }
}

@media only screen and (max-width: 1000px) {
    .nav_item_all {
        display: none !important;
    }

    .header-navbar-responsive,
    .navbar /*TO DELETE AFTER REFACTOR*/{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 100%;
        padding-top: 2%;
        padding-bottom: 2%;
        background-color: #000000;
        font-size: 20px;
    }
    .header-navbar-responsive__links,
    .main_nav /*TO DELETE AFTER REFACTOR*/{
        display: none;
    }
    .show_nav {
        padding: 2% 0%;
        display: flex;
        width: 100%;
        height: 100vh;
        flex-direction: column;
        justify-content: flex-start;
    }
    .header-navbar-responsive__links li,
    .main_nav li /*TO DELETE AFTER REFACTOR*/{
        width: 100%;
        height: 50px;
        font-size: 25px;
        justify-content: center;
        text-align: center;
        padding: 0%;
    }
    .header-navbar-responsive__box-toggle,
    .navbar_toggle /*TO DELETE AFTER REFACTOR*/{
        margin-left: 5%;
        margin-right: 5%;
        font-size: 30px;
        color: #ffffff;
        background: transparent;
        border-color: transparent;
        transition: all 0.3s linear;
        cursor: pointer;
        display: block;
    }
    
    .header-navbar-responsive__box-logos img {
        width: 80px !important;
    }

    .header-navbar-responsive__box-logos__padi {
        padding-left: 4%;
    }
    
    .logo_multiscreen /*TO DELETE AFTER REFACTOR*/{
        width: 80px !important;
    }
    .header-navbar-responsive__box-logos,
    .logo /*TO DELETE AFTER REFACTOR*/{
        margin-left: 5%;
        color: #ffffff;
        font-size: 25px;
        font-weight: bold;
		width: auto !important;
		display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .header-navbar-responsive__box,
    .logo_header /*TO DELETE AFTER REFACTOR*/ {
        width: 100%;
        justify-content: space-between;
        margin-right: 2%;
        display: flex;
        margin-left: 2%;
    }
    .content_section_3_contact {
        flex-direction: column !important;
    }
    .text_content_s3 {
        width: 100% !important;
    }
    .form_content_s3 {
        width: 100% !important;
    }
    .acordion_img_s4_contact {
        flex-direction: column !important;
    }
    .img_acor_s4_contact {
        width: 100% !important;
    }
    .img_s4_contact {
        width: 300px !important;
        height: 300px !important;
    }
    .footer_int {
        flex-direction: column !important;
    }
    .int_footer_1 {
        width: 100% !important;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .int_footer_2 {
        width: 100% !important;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
    .credits_footer {
        flex-direction: column !important;
    }
    .div_credits_footer_1 {
        width: 100% !important;
    }
    .div_credits_footer_1_p {
        width: 100% !important;
        text-align: center !important;
        padding: 0 !important;
    }
    .div_credits_footer_2 {
        width: 100% !important;
    }
    .div_credits_footer_2_p {
        width: 100% !important;
        text-align: center !important;
        padding: 0 !important;
    }
    .p2_content_s1_contact {
        font-size: 60px !important;
    }
    .header-branding,
    .div2_content_s1_home /*TO DELETE AFTER REFACTOR*/ {
        align-items: end !important;
    }
    .h2_content_section_2_contact {
        font-size: 20px !important;
        padding: 2% 10% 10% 10% !important;
    }
    .content_icons_contact {
        padding-left: 0% !important;
    }
    .text_content_s3 {
        padding: 0 !important;
        margin: 0 !important;
        align-items: center;
        justify-content: center;
    }
    .content_section_3_contact {
        padding: 0 !important;
    }
    .content_icons_contact {
        width: 80%;
    }
    .icons_contact_s3 {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .p1_content_s3_contact {
        width: 80% !important;
		padding-top: 8% !important;
		padding-left: 0% !important;
		color: #fff !important;
    }
    .form_content_s3 {
        padding: 4% 0% 0% 0% !important;
        align-items: center;
        justify-content: center;
        width: 85% !important;
        align-self: center;
    }
    .form_Sent_contact {
        width: 90% !important;
        padding-bottom: 10% !important;
    }
    .acordeopn_s4_contact {
        margin: 0 !important;
        width: 90% !important;
        padding-top: 4%;
    }
    .acordion_img_s4_contact {
        align-items: center;
        justify-content: center;
    }
    
    .cress-lead-section__DAN-content__btn,
    .cta-book-now-container__button,
    .cressi-lead-section__btn,
    .a_content_s5_contact /* TO DELETE AFTER REFACTOR*/{
        width: 40% !important;
    }
    .div_img_logo_footer {
        padding-left: 0 !important;
    }
    .icons_footer {
        padding-left: 0 !important;
    }
    .header__content,
    .content_s1_home /*TO DELETE AFTER REFACTOR*/{
        height: 70vh !important;
        padding-top: 0px;
        flex-direction: column-reverse;
    }
    .header__content__box,
    .div1_content_s1_home /*TO DELETE AFTER REFACTOR*/ {
        justify-content: end !important;
    }
    .header__content__box__title1,
    .p1_content_s1_home /*TO DELETE AFTER REFACTOR*/ {
        font-size: 28px !important;
        color:#fff;
        -webkit-text-stroke: 0px #fff;
        
    }
    .header__content__box__title2,
    .header__content__box__title3,
    .p2_content_s1_home /*TO DELETE AFTER REFACTOR*/{
        font-size: 28px !important;
    }
    
    .header-home__content__contentbox__btn,
    .a_content_s1_home /*TO DELETE AFTER REFACTOR*/{
        padding: 2% 6% !important;
        width: 45% !important;
    }
    .header-branding__logo,
    .img_div2_content_s1_home /*TO DELETE AFTER REFACTOR*/ {
        width: 100% !important;
        padding-bottom:40px;
    }
    .header-branding__icons__socials{
        padding-bottom: 9px;
    }
    
    .header-branding__icons__socials__image,
    .img_icons_footer /*TO DELETE AFTER REFACTOR*/{
        width: 30px !important;
    }
    .header-branding__icons,
    .icons_header /*TO DELETE AFTER REFACTOR*/{
        top: 38vh !important;
    }

	.announcement-desktop{
	    display:none;
	}
	.announcement-responsive{
	    display:block !important;
	}
	.header-responsive-wrapper{
	    z-index:1000;
	    position: fixed;
	    width:100%;
	}
    .int_footer_2 {
        flex-direction: column;
    }
    .int_1_int_footer_2 {
        width: 80% !important;
    }
    .int_2_int_footer_2 {
        width: 80% !important;
    }
    .int_3_int_footer_2 {
        width: 80% !important;
    }
    .primary-container__h1,
    .primary-container__h2,
    .h1_section_2_home_unde /* TO DELETE AFTER REFACTOR*/r,
    .h2_section_2_home_under /* TO DELETE AFTER REFACTOR*/,
    .title_styles-h2 /* TO DELETE AFTER REFACTOR*/,
    .cressi-lead-section__heading {
        font-size: 30px !important;
    }
    .primary-container__p,
    .p_section_2_home_under /* TO DELETE AFTER REFACTOR*/ {
        width: 90% !important;
        font-size: 20px !important;
    }
    .primary-container__btn,
    .a_section_2_home_under /* TO DELETE AFTER REFACTOR*/ {
        width: 45% !important;
        font-size: 20px !important;
        padding: 2% 4% !important;
    }
    .paralax-container__sub,
    .int_section_3_home_under /* TO DELETE AFTER REFACTOR*/ {
        width: 95% !important;
    }
    .paralax-container__h2,
    .h2_int_section_3_home_under /* TO DELETE AFTER REFACTOR*/ {
        width: 95% !important;
        font-size: 30px !important;
    }
    
    .cress-lead-section__DAN-content__p,
    .paralax-container__p,
    .p_int_section_3_home_under /* TO DELETE AFTER REFACTOR*/ {
        font-size: 20px !important;
    }
    .paralax-container__btn,
    .a_int_section_3_home_under /* TO DELETE AFTER REFACTOR*/ {
        font-size: 20px !important;
        padding: 2% 4% !important;
        width: 50% !important;
    }
    .p_section_4_home_under {
        width: 95% !important;
        font-size: 20px !important;
    }
    .p_section_5_home_under {
        width: 95% !important;
        font-size: 20px !important;
    }
    .image-container__sub,
    .int_section_5_home_under /* TO DELETE AFTER REFACTOR*/ {
        padding: 0 !important;
    }
    .image-container__btn,
    .a_section_5_home_under /* TO DELETE AFTER REFACTOR*/ {
        font-size: 20px !important;
        margin-bottom: 8% !important;
    }
    .h2_section_6_home_under {
        width: 95% !important;
        font-size: 30px !important;
    }
    .fnd_blanco_Testiminio_S6_HOME {
        width: 80% !important;
    }
    .p_section_6_home_under {
        font-size: 20px !important;
    }
    .p_name_section_6_home_under {
        font-size: 22px !important;
    }
    
    .about-container,
    .section_7_home_under /*DELETE AFTER REFACTOR*/ {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding-bottom: 10%;
		height: auto !important;
    }
    
    .img_section_7_home_under {
        position: static !important;
        transform: none !important;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        width: 300px !important;
        height: 300px !important;
    }
	
	.img_section_2_about_under {
       display: none !important;
    }
    .box_izq {
        opacity: 0;
        transform: translateY(200px) !important;
        transition: opacity 1.5s ease-out, transform 1.5s ease-out;
        -webkit-transform: translateY(200px) !important;
        -moz-transform: translateY(200px) !important;
        -ms-transform: translateY(200px) !important;
        -o-transform: translateY(200px) !important;
    }
    .box_izq.visible {
        opacity: 1;
        transform: translateY(0) !important;
    }
    .box_derecha {
        opacity: 0;
        transform: translateY(200px) !important;
        transition: opacity 1.5s ease-out, transform 1.5s ease-out;
        -webkit-transform: translateY(200px) !important;
        -moz-transform: translateY(200px) !important;
        -ms-transform: translateY(200px) !important;
        -o-transform: translateY(200px) !important;
    }
    .box_derecha.visible {
        opacity: 1;
        transform: translateY(0) !important;
    }
	
    .h2_int_section_7_home_under {
        width: 90% !important;
        font-size: 30px !important;
    }
    
    
    .about-container__interior{
        flex-direction: column;
    }
    
    .about-container__interior-img{
        padding: 40px 0px;
        width: 300px;
    }
    
    .about-container__interior-p,
    .p_int_section_7_home_under /*DELETE AFTER REFACTOR*/ {
        width: 90% !important;
        font-size: 20px !important;
        text-align: center;
    }
    
    .about-container-a,
    .a_int_section_7_home_under /*DELETE AFTER REFACTOR*/ {
        width: 180px !important;
        font-size: 20px !important;
        padding: 2% 4% !important;
    }
    
    .header-conservation__content,
    .content_header_s1_tours /*TO DELETE AFTER REFACTOR*/{
        flex-direction: row-reverse;
		height: 70vh !important;
    }
    .p1_content_s1_tours {
        font-size: 50px !important;
    }
	
	.header-conservation__texbox__title{
	    font-size: 26px !important;
	}
	
	.p1_content_s1_special /*TO DELETE AFTER REFACTOR*/ {
        font-size: 50px !important;
    }
    
    .header-conservation__content__imagebox,
    .content_img_s1_tours /*TO DELETE AFTER REFACTOR*/{
        align-items: end !important;
        width: 40% !important;
        justify-content: end;
    }
    .header-conservation__textbox,
    .content_text_s1_tours /*TO DELETE AFTER REFACTOR */{
        align-items: center !important;
        justify-content: end;
        width: 60% !important;
    }
    .header-conservation__content__imagebox__image,
    .img_content_img_s1_tours /*TO DELETE AFTER REFACTOR*/{
        width: 100% !important;
    }
    .img_content_img_s1_courses {
        width: 80% !important;
    }
    .header__content__box__padilogo,
    .img_padi_courses /*TO DELETE AFTER REFACTOR*/ {
        width: 220px !important;
        padding-left: 0 !important;
    }

    .tours_head  { /* TO DELETE AFTER REFACTOR*/
        background-position: center left !important;
    }
    .content_s2_tours /*TO DELETE AFTER REFACTOR*/ {
        flex-direction: column !important;
    }

    .text_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
        width: 100% !important;
    }

    .img_text_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
        width: 100% !important;
        margin-top: 8% !important;
    }
    .img_img_text_content_s2_tours {
        width: 300px !important;
    }
    
    .descrip_content_s2_tours /*TO DELETE AFTER REFACTOR*/{
        width: 95% !important;
    }
    .wapes_1_s3_tours/*TO DELETE AFTER REFACTOR*/ {
        height: 100px !important;
    }
    .body_content_section_3_tours /*TO DELETE AFTER REFACTOR*/ {
        flex-direction: column-reverse;
    }
    .text_content_s3_tours/*TO DELETE AFTER REFACTOR*/ {
        width: 100% !important;
    }
    .h2_text_content_s3_tours/*TO DELETE AFTER REFACTOR*/ {
        font-size: 30px !important;
    }
    .image-container__content/*DOUBLE UP WITH section-contnet-secondary*/,
    .img_text_content_s3_tours/*TO DELETE AFTER REFACTOR*/ {
        width: 100% !important;
    }
    
    .img_img_text_content_s3_tours /*TO DELETE AFTER REFACTOR*/ {
        width: 300px !important;
        height: 300px !important;
    }
    .descrip_content_s3_tours/*TO DELETE AFTER REFACTOR*/ {
        width: 95% !important;
    }
    .h2_content_section_6,
    .cta-book-now-container__title{
        text-align: center !important;
    }
	.p_contente_descrip_special{
		text-align: center !important;
	}
    .img_int_footer_1 {
        width: 200px !important;
    }
    .icons_footer {
        padding-top: 4% !important;
    }
    .descrip_content_s2_courses {
        width: 95% !important;
        margin: 0 auto !important;
    }
	
	.header {
            background-size: cover !important;
            background-attachment: scroll !important;
        }
        
	.tours_head /* TO DELETE AFTER REFACTOR*/{
		 background-size: cover !important;
            background-attachment: scroll !important;
	}
	
	.section_3_home_under{
		background-size: cover !important;
            background-attachment: scroll !important;
	}
	
	.section_6_home_under{
		background-size: cover !important;
            background-attachment: scroll !important;
	}
	
	.content_header_s1_courses{
		height: 70vh !important;
	}
	
	.submt_form{
		width: 70% !important;
	}
	
	.text_icon_s3 {
		font-size: 20px !important;
	}
	
	#fname::placeholder {
		font-size: 20px;
	}
	
	#lname::placeholder {
		font-size: 20px;
	}
	
	#email::placeholder {
		font-size: 20px;
	}
	
	#message::placeholder {
		font-size: 18px !important;
	}
	
    .cressi-lead-section__text,
    .p_content_s5_contact /* TO DELETE AFTER REFACTOR*/{
        width: 80% !important;
    }
}

@media only screen and (max-width: 600px) {
    .header-home__content__contentbox__btn,
    .a_content_s1_home /*TO DELETE AFTER REFACTOR*/{
        width: 65% !important;
    }
}

.div_title_gallery /* TO DELETE AFTER REFACTOR*/,
.title_styles /* TO DELETE AFTER REFACTOR*/,
.cressi-lead-section__title-container{
	width: 100%	
}

/* Loader container */
#loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff; /* Fondo blanco */
    display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

/* Logo dentro del loader */
#loader img {
    width: 150px; /* Cambia el tamaño según necesites */
    animation: fadeIn 1s ease-in-out infinite alternate; /* Animación opcional */
}

@keyframes fadeIn {
    from {
        opacity: 0.6;
    }
    to {
        opacity: 1;
    }
}

/* Esconde el loader una vez finalizado */
body.loaded #loader {
    display: none;
}

/*JAY ENTRIES*/

/*******************************************************************************RENAMING ALL FUCKING CLASSES BECAUSE THESE ASSHOLES BAND-AID FIXED EVERYTHING AND I HAVE TO FUCKING REDO IT ALL NOW FUCKING DICKBAGS*/

    /*GLOBAL RENAMING CLASSES*/
    
.primary-container {
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 2%;
}


.primary-container__h1,
.primary-container__h2{
    color: #05233a;
    font-size: 45px;
    padding: 1%;
    margin: 0;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    text-align:center;
}

.primary-container__p{
    color: #000;
    font-size: 25px;
    width: 75%;
    padding: 1%;
    text-align: center;
    margin: 0%;
}

.primary-container__btn{
    color: #fff;
    background-color: #05233a;
    padding: 1% 4%;
    font-size: 25px;
    text-align: center;
    text-decoration: none;
    font-weight: bolder;
    margin: 1%;
    text-align: center;
    text-decoration: none;
    font-weight: bolder;
    margin: 1%;
}

.tours .primary-container__btn,
.courses .primary-container__btn,
.technical .primary-container__btn,
.conservation .primary-container__btn {
    font-size: 18px;
    width: 25%;
    padding: 1% 4%;
    margin-top: 1%;
}

.courses .primary-container__btn{
    width: 17% !important;
}

.paralax-container {
    position: relative;
    height: 70vh;
    overflow: hidden;
    width: 100%;
    display: flex;
    align-items: center;
}

.home__technical.paralax-container,
.home__conservation.paralax-container{
    height: 100vh;
}

.paralax-container__sub {
    width: 60%;
    display: flex;
    flex-direction: column;
    padding-left: 5%;
}

.paralax-container__h2 {
    font-size: 45px;
    padding: 1%;
    margin: 0;
    font-weight: bold;
    color: #fff;
    width: 50%;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.paralax-container__p {
    color: #fff;
    font-size: 25px;
    width: 80%;
    padding: 1%;
    text-align: left;
    margin: 0%;
}


/* Container for the entire section, enables Flexbox */
.image-container {
    width: 100%;
    max-height: 90vh; /* Use max-height to ensure it's no more 90% of the viewport height */
    background-color: #05233a;
    display: flex;
    align-items: center;
    gap: 1.5rem; /* Space between the image and the text */
}

.home__tours.image-container,
.discoverpotrero__brand-primary.image-container{
    max-height: 175vh;
}

/* Parent container for the image - takes up 50% of the space */
.image-container__content {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* The image itself - make it fill its parent container */
.image-container__content__image {
    width: 100%;
    max-height: 90vh; /* Use max-height to ensure it's no more 90% of the viewport height */
    border-radius: 0;
    object-fit: cover;
}

/* Parent container for the text - also takes up 50% of the space */
.image-container__sub {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
    padding: 4%;
    flex: 1;
}

/* H2 styling */
.image-container__h2 {
    font-size: 45px;
    padding: 1%;
    margin: 0;
    font-weight: bold;
    color: #fff;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    width: auto;
}

/* Paragraph styling */
.image-container__p {
    font-size: 25px;
    color: #fff;
    text-align: left;
    width: auto;
}

/*Cressi CTA and map stylings*/

.cressi-lead-section__map-container {
    position: relative;
    width: 100%;
    height: 70vh;
}

.cressi-lead-section__map-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 10;
}

.cressi-lead-section {
    display: flex;
    flex-direction: column;
}

.cress-lead-section__DAN-content__btn,
.cressi-lead-section__btn,
.a_content_s5_contact /* TO DELETE AFTER REFACTOR*/{
    margin-top: 3%;
}


.cressi-lead-section__text,
.p_content_s5_contact /* TO DELETE AFTER REFACTOR*/{
    margin: 0;
    color: #fff;
    font-size: 22px;
    font-family: 'Monserat_Normal', sans-serif;
    width: 60%
}

.cressi-lead-section__title,
.h2_content_s5_contact /* TO DELETE AFTER REFACTOR*/{
    color: #fff;
    font-size: 40px;
    padding: 2%;
    margin: 0;
    font-family: 'Monserat_Normal', sans-serif;
    text-align: center;
}

.cressi-lead-section__DAN-content,
.cressi-lead-section__content,
.adobe-rental-section,
.content_s5_contact /* TO DELETE AFTER REFACTOR*/{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 500px;
}

.cta-book-now-container,
.cressi-lead-section__title-container{
    background-color: #fff;
}

.adobe-rental-section{
    background-color: #fff;
    height: 750px;
}

.adobe-rental-section__logo{
    padding-bottom: 20px;
}


@media (max-width: 600px){
    .adobe-rental-section__form {
       max-width: 400px !important;
    }
}

/*END CRESSI*/
/*CTA BOOK NOW*/

.content_section_6,
.cta-book-now-container{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-bottom: 4%;
}

.h2_content _section_6 /* TO DELETE AFTER REFACTOR*/,
.cta-book-now-container__title{
    color: #05233a;
    font-size: 45px;
    font-family: 'Monserat_Normal';
    margin: 3%;
}


/*END CTA BOOK NOW*/

/* BTN CONFLICTS*/

a.cta-book-now-container__button.btn.box {
  opacity: 0;
  transform: none;
  transition: 
    opacity 2.5s ease-out,
    border-radius 0.3s ease-in-out,
    transform 0.3s ease-in-out;
}

a.cta-book-now-container__button.btn.box.visible {
  opacity: 1;
  transform: none; /* This still correctly cancels the translateY from .box */
}

/* This is the new, more specific hover rule */
a.cta-book-now-container__button.btn.box.visible:hover {
  border-radius: 4px;
  transform: scale(1.15); /* This rule will now be applied on hover */
}

/*SPECIALTIES PAGE BOX BTN CONFLICT*/

a.a_content_section_6.box.btn {
  opacity: 0;
  transition: 
    opacity 1.5s ease-out, 
    transform 1.5s ease-out; /* Slower transition for the scroll animation */
}

a.a_content_section_6.box.btn.visible {
  opacity: 1;
  transform: translateY(0);
}

a.a_content_section_6.box.btn.visible:hover {
  border-radius: 4px;
  transform: translateY(0) scale(1.15);
  transition: 
    border-radius 0.3s ease-in-out,
    transform 0.3s ease-in-out; /* Faster transition for the hover effect */
}

/*HOMEPAGE BOX BTN CONFLICT*/

a.image-container__btn.box_izq.btn,
a.image-container__btn.box_derecha.btn, 
a.a_section_5_home_under.box_derecha.btn /* TO DELETE AFTER REFACTOR*/ {
  opacity: 0;
  transition:
    opacity 1.5s ease-out,
    transform 1.5s ease-out;
}

a.image-container__btn.box_izq.btn.visible,
a.image-container__btn.box_derecha.btn.visible, 
a.a_section_5_home_under.box_derecha.btn.visible /* TO DELETE AFTER REFACTOR*/ {
  opacity: 1;
  transform: translateX(0);
}

a.image-container__btn.box_izq.btn.visible:hover,
a.image-container__btn.box_derecha.btn.visible:hover, 
a.a_section_5_home_under.box_derecha.btn.visible:hover /* TO DELETE AFTER REFACTOR*/ {
  border-radius: 4px;
  transition:
    border-radius 0.3s ease-in-out,
    transform 0.3s ease-in-out;
  transform: translateX(0) scale(1.15);
}

/*GLOBAL*/
/*BTN*/

.btn__primary {
    display: inline-block;
    color: #fff !important;
    background-color: #05233a;
    padding: 1rem 2rem;
    font-size: 20px;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    font-weight: bolder;
    margin: 1rem auto;
    width: auto;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.35s ease-in-out;
}

.btn__primary:hover {
    background-color: #004D73;
    transform: scale(1.05);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
    border-radius: 12px;
}
/*
 * End of standardized .btn__primary styles
 */
 
 .btn__secondary {
    display: inline-block;
    color: #fff !important;
    background-color: #fc6c04; /* Retained secondary color: Orange */
    padding: 1rem 2rem;
    font-size: 20px;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    font-weight: bolder;
    margin: 1rem auto;
    width: auto;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.35s ease-in-out;
}

.btn__secondary:hover {
    background-color: #dd5b04; /* Darker orange for hover */
    transform: scale(1.05);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
    border-radius: 12px;
}
/*
 * End of standardized .btn__secondary styles
 */

.image-container__btn {
	display: inline-block; /* Standardized property */
	color: #05233a !important; /* Retained color: Primary Brand Blue */
	background-color: #fff; /* Retained color: White */
	padding: 1rem 2rem; /* Standardized property (converted from % to rem for consistency) */
	font-size: 20px; /* Standardized font size */
	line-height: 1; /* Standardized property */
	text-align: center; /* Standardized property */
	text-decoration: none;
	font-weight: bolder; /* Standardized property */
	margin: 1rem auto; /* Standardized property (converted from % to rem) */
	width: auto; /* Standardized property */
	border-radius: 8px; /* Standardized property */
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Standardized property */
	transition: all 0.35s ease-in-out; /* Standardized property */
}

.image-container__btn:hover {
	background-color: #f0f0f0; /* Slight gray/off-white for hover effect */
	transform: scale(1.05); /* Standardized property */
	box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2); /* Standardized property */
	border-radius: 12px; /* Standardized property */
}
/*
 * End of standardized .image-container__btn styles
 */

.btn__paralax {
	display: inline-block; /* Standardized property */
	color: #fff !important; /* Retained color: White */
	background-color: #05233a85; /* Retained color: Semi-Transparent Blue */
	padding: 1rem 2rem; /* Standardized property (converted from % to rem) */
	font-size: 20px; /* Standardized font size */
	line-height: 1; /* Standardized property */
	text-align: center; /* Standardized property */
	text-decoration: none;
	font-weight: bolder; /* Standardized property */
	margin: 1rem auto; /* Standardized property (converted from % to rem) */
	width: auto; /* Overrides original width: 25% for standardization */
	border-radius: 8px; /* Standardized property */
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Standardized property */
	transition: all 0.35s ease-in-out; /* Standardized property */
}

.btn__paralax:hover {
	/* Use a less-transparent blue for a visual "pop" on hover */
	background-color: #05233a; 
	transform: scale(1.05); /* Standardized property */
	box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2); /* Standardized property */
	border-radius: 12px; /* Standardized property */
}
/*
 * End of standardized .btn__paralax styles
 */

/* Update the media query to include the new class */
@media (max-width: 640px) {
	.btn__primary,
	.btn__secondary,
	.btn__paralax { 
		width: 90%;
		display: block;
		font-size: 18px;
		padding: 0.75rem 1.5rem;
	}
	.image-container__btn{
	    display: block;
	    padding: 0.75rem 1.5rem;
	}
	.btn__discover{
	    width: 50%;
	}
}

.btn-flex{
    display:flex;
    justify-content: center;
    padding: 40px 0;
}

/*Info Sections*/
/*Primary Sections*/

.tour-section-content-primary{
    width: 100%;
    background-color: #fff;
    display: flex;
    flex-direction: row;
    padding-bottom: 2%;
}

.tour-section-content-primary__left{
    width: 50%;
    display: flex;
    flex-direction: column;
}

.tour-section-content-primary__left-title{
    color: #05233a;
    font-size: 45px;
    padding: 1%;
    margin: 0;
    padding-left: 6%;
    padding-top: 4%;
    font-family: 'Monserat_Normal';
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5)
}

.tour-section-content-primary__left-p{
    color: #05233a;
    font-size: 20px;
    padding: 1%;
    text-align: left;
    margin: 0%;
    padding-left: 6%;
    font-family: 'Monserat_Normal';
}

.tour-section-content-primary__right{
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.image-container__content__image,
.tour-section-content-primary__right__img {
    width: 450px;
    height: 450px;
    border-radius: 100%;
    object-fit: cover;
}

.tour-section-content-primary__right-description{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items:center;
}

.tour-section-content-primary__right-description__price{
    font-size: 40px;
    color: #05233a;
    text-align: center;
    font-weight: bold;
    font-family: 'Monserat_Normal';
    padding-top: 2%;
    margin: 0px;
}

.tour-section-content-primary__right-description__tax{
    font-size: 40px;
    color: #05233a;
    text-align: center;
    font-family: 'Monserat_Normal';
    margin: 0px;
}

.tour-section-content-primary__right-description__policy-title,
.tour-section-content-primary__right-description__policy-description{
    font-size: 14px;
    margin: 0px;
    text-align: center;
    color: #05233a;
}

/*Secondary Sections*/

.tour-section-content-secondary{
    width: 100%;
    display: flex;
    flex-direction: column;
    background-color: #05233a;
}

.tour-section-content-secondary__container {
    width: 100%;
    display: flex;
    flex-direction: row;
    background-color: #05233a;
}

.tour-section-content-secondary__container__left {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.tour-section-content-secondary__container__left-img {
    width: 450px;
    height: 450px;
    border-radius: 100%;
    object-fit: cover;
}

.tour-section-content-secondary__container__left-description {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.tour-section-content-secondary__container__left-description__price {
    font-size: 40px;
    color: #fff;
    text-align: center;
    font-weight: bold;
    font-family: 'Monserat_Normal';
    padding-top: 2%;
    margin: 0px;
}

.tour-section-content-secondary__container__left-description__tax {
    font-size: 40px;
    color: #fff;
    text-align: center;
    font-family: 'Monserat_Normal';
    margin: 0px;
}

.tour-section-content-secondary__container__left-description__policy-title,
.tour-section-content-secondary__container__left-description__policy-description{
    font-size: 14px;
    margin: 0px;
    text-align: center;
    color: #fff;
}

.tour-section-content-secondary__container__right{
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.secondary-container__h2,
.tour-section-content-secondary__container__right-title {
    color: #fc6c04;
    font-size: 45px;
    padding: 1%;
    margin: 0;
    padding-right: 6%;
    padding-top: 4%;
    text-align: center;
    font-family: 'Monserat_Normal';
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4)
}

.secondary-container__h2{
    padding-right: 0 !important;
    padding-bottom: 48px;
}

.tour-section-content-secondary__container__right-p{
    color: #FFF;
    font-size: 20px;
    padding: 1%;
    text-align: center;
    margin: 0%;
    padding-right: 6%;
    font-family: 'Monserat_Normal';
}

.home__conservation{
    max-height: 150vh;
}



/*Media Queries*/
@media only screen and (max-width: 1000px){
    /*Primary Sections*/
    .tour-section-content-primary {
        flex-direction: column !important;
    }
    
     .tour-section-content-primary__left{
        width: 100% !important;
    }
    
    .tour-section-content-primary__right{
        width: 100% !important;
        margin-top: 8% !important;
    }
    
    .image-container__content__image,
    .tour-section-content-primary__right__img{
        width: 300px !important;
        height: 300px !important;
    }
    
    .tour-section-content-primary__right-description{
        width: 95% !important;
    }
    
    /*Secondary Sections*/
    
    .tour-section-content-secondary__container{
        flex-direction: column-reverse;
    }
    
     .tour-section-content-secondary__container__left {
        width: 100% !important;
    }
    .tour-section-content-secondary__container__left-img {
        width: 300px !important;
        height: 300px !important;
    }
    .tour-section-content-primary__left-descriptions {
        width: 95% !important;
    }
    .tour-section-content-secondary__container__right {
        width: 100% !important;
    }
    .secondary-container__h2,
    .tour-section-content-secondary__container__right-title {
        font-size: 30px !important;
    }
}


/*FOR NEXT TIME*/
/*.btn__tirdone(remember to fix this)*/
/*FOR NEXT TIME*/

/*RANDOM*/
.fix-bold{
    font-weight: bold;
}

.title-margin__bottom{
    margin-bottom: -26px;
}

.includes-title{
    font-size:25px;
    font-weight:bold;
    padding-top:4%;
}

.includes-description{
    line-height:1.9;
}

.section-waves {
    width: 100%;
    height: 54vh;
    background-color: #fff;
    margin-top: -3px;
}

.img_section-waves {
    width: 100%;
}

#TA_certificateOfExcellence808{
    justify-self: center;
}

@media (max-width: 768px) {
	#TA_certificateOfExcellence808 {
		padding-bottom: 48px;
	}
}

@media only screen and (max-width: 1000px){
   .section-waves {
        height: 10vh !important;
    }
}

/*HOMEPAGE*/
.home__courses,
.discoverpotrero__brand-secondary{
    padding-bottom: 4rem;
}

.home__courses.image-container,
.discoverpotrero__brand-secondary.image-container{
    flex-direction: row-reverse;
    /*max-height: 100vh!important;*/
}

.home-container,
.discoverpotrero-container{
    display: flex;
    flex-direction: column; /* Stacks the two divs vertically */
}

.home__technical.paralax-container {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(https://utsd.jotaworks.site/wp-content/uploads/2025/06/TR59999-1.jpeg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
}

.reviews-section-container {
	/* Adds vertical padding to create space above and below the entire section */
	padding-top: 90px;
	padding-bottom: 90px;
}

.reviews-section-container__title {
	margin-bottom:40px;
}

.reviews-section-container__wrapper {
	/* This wrapper holds the actual review widget content */
	/* Add any specific container styles here if needed, like max-width */
}

/*CONSERVATION*/


/*ABOUT */

.slider {
	width: 100%;
	height: 700px; /* Altura del slider */
	overflow: hidden;
	position: relative;
	margin: 0 auto; /* Centra el slider horizontalmente */
}

.slides {
	display: flex;
	width: 800%;
	height: 100%;
	animation: slide 20s infinite;
}

.slides img {
	width: 12.5%;
	height: 100%;
	object-fit: cover; /* Asegura que las imágenes se ajusten bien dentro del contenedor */
	object-position: center;
}

.indicators {
	position: absolute;
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	justify-content: center;
}

.indicator {
	width: 10px;
	height: 10px;
	margin: 0 5px;
	background-color: rgba(255, 255, 255, 0.5);
	border-radius: 50%;
	transition: background-color 0.3s;
}

.indicator.active {
	background-color: rgba(255, 255, 255, 1);
}

@keyframes slide {
	0% { transform: translateX(0); }
	12.5% { transform: translateX(-12.5%); }
	25% { transform: translateX(-25%); }
	37.5% { transform: translateX(-37.5%); }
	50% { transform: translateX(-50%); }
	62.5% { transform: translateX(-62.5%); }
	75% { transform: translateX(-75%); }
	87.5% { transform: translateX(-87.5%); }
	100% { transform: translateX(-100%); }
}

.ti-widget-body{
    padding: 0 25px!important;
}

@media only screen and (min-width: 1001px) {
    .ti-header{
        padding: 0 500px !important;
    }
    
    #sbi_images{
        height: 1250px;
        padding: 18px !important;
    }
    
    .sbi_header_text{
        justify-self: center;
    }
}



/*CONTACT PAGE*/
/* ------------------------------------ */
/* --- Contact Form Stylings --- */
/* ------------------------------------ */

/* General consistency for all inputs */
.wpcf7-form-control {
	width: 100%;
	padding: 10px;
	margin-bottom: 15px;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
}

/* Force the Certified Diver dropdown to stay small */
#cert-diver {
	width: 150px !important;
	display: block; /* Forces it to be its own block */
	margin-bottom: 20px;
}

/* Force the dive details container to a new line */
#dive-details-container {
	display: flex !important;
	flex-wrap: wrap; 
	width: 100%;
	clear: both; 
	gap: 20px;
	margin-top: 10px;
}

/* Desktop layout for the inner fields */
@media (min-width: 768px) {
	#dive-details-container > p {
		flex: 1; /* Makes them side-by-side */
		min-width: 200px;
		margin: 0;
	}
	
	.form-row-desktop {
		display: flex;
		gap: 20px;
	}
	
	.form-row-desktop > p {
		flex: 1;
	}
}

/* Mobile adjustments */
@media (max-width: 600px) {
	#cert-diver {
		width: 100% !important;
	}
	#dive-details-container {
		flex-direction: column;
	}
}

/*DISCOVER POTRERO SPECIFIC*/
/* ------------------------------------ */
/* --- Discover Potrero Landing Page Styling --- */
/* ------------------------------------ */

.contain-fix{
   object-fit: contain !important;
   background-color: #fff !important;
}

/*BLOG PAGE*/
/* ------------------------------------ */
/* --- Blog Landing Page Styling --- */
/* ------------------------------------ */

.blog-post-list {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	justify-content: center;
	max-width: 1200px;
	margin: 0 auto;
	padding: 20px 0;
}

.blog-post-list::after {
	content: "";
	display: none;
}

.blog-post-list article {
	flex: 1 1 calc(25% - 2rem);
	min-width: 250px;
	display: flex;
	flex-direction: column;
	text-align: left;
	border: 1px solid #e0e0e0;
	border-radius: 10px;
	padding: 1.5rem;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	overflow: hidden;
	min-height: 400px; /* FIX: Set a minimum height for consistent card alignment */
}

.blog-post-list article:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
}

.post-thumbnail {
	width: 100%;
	height: 200px;
	overflow: hidden;
	border-radius: 8px;
	margin-bottom: 1rem;
}

.post-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.blog-post-list article:hover .post-thumbnail img {
	transform: scale(1.05);
}

.blog-post-list h2 {
	font-size: 1.5rem;
	font-weight: 600;
	margin-bottom: 0.5rem;
}

.blog-post-list h2 a {
	text-decoration: none;
	color: #004D73;
	transition: color 0.3s ease;
}

.blog-post-list h2 a:hover {
	color: rgb(252, 108, 4);
}

.blog-post-list p {
	font-size: 0.9rem;
	color: #777;
	margin-bottom: 1rem;
}

.blog-post-list .entry-summary {
	font-size: 1rem;
	color: #333;
	line-height: 1.6;
	flex-grow: 1; /* FIX: Pushes this element to take up all remaining space */
	overflow: hidden; /* Ensures content is contained */
	/* Optional: Force text to clip cleanly after a few lines */
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

@media (max-width: 768px) {
	.blog-post-list article {
		flex: 1 1 100%;
	}
}

.blog-archive-button {
    display: inline-block;
    color: #fff !important;
    background-color: #05233a;
    padding: 1rem 2rem;
    font-size: 20px;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    font-weight: bolder;
    margin: 1rem auto;
    width: auto;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.35s ease-in-out;
}

.blog-archive-button:hover {
    background-color: #004D73;
    transform: scale(1.05);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
    border-radius: 12px;
}

.blog-archive-button-container {
    text-align: center;
    padding: 20px 0;
}

@media (max-width: 640px) {
    .blog-archive-button {
        width: 90%;
        display: block;
        font-size: 18px;
        padding: 0.75rem 1.5rem;
    }
}



/*BLOG POSTS*/
/* ------------------------------------ */
/* --- Blog Post Template Styling --- */
/* ------------------------------------ */

/* Base styling for the main container */
.post {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    font-family: 'Inter', sans-serif;
    line-height: 1.4;
    color: #333;
    overflow: hidden; /* Necessary for clearing floats */
}

.post-container{
    padding: 40px 20px;
}

/* Base styling for all post sections */
.post__section {
    margin-bottom: 4rem;
}

/* Styles for the section containers */
.post__section__image-container,
.post__section__content-container {
    width: 100%; /* Default to full width on mobile */
    margin-bottom: 1rem;
}

/* Styles for the text wrapper */
.post__section__content-wrapper {
    max-width: 100%; /* Default to full width on mobile */
    padding: 0 15px; /* Adds padding on mobile */
    margin: 0 auto;
    text-align: left;
}

/* Styles for images within the post sections */
.post__section__image-container img {
    width: 100%;
    height: auto;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

/* ------------------------------------ */
/* --- Desktop Layout (using floats) --- */
/* ------------------------------------ */

@media (min-width: 768px) {
    /* For sections with the image on the left */
    .post__section--one .post__section__image-container,
    .post__section--three .post__section__image-container {
        float: left;
        width: 50%;
        margin-right: 2rem;
    }

    /* For sections with the image on the right */
    .post__section--two .post__section__image-container {
        float: right;
        width: 50%;
        margin-left: 2rem;
    }
    
    .post__section__content-container {
        padding: 0;
        max-width: none; /* Allows the content to fill the remaining space */
    }

    /* Clear the floats after each section to prevent layout issues */
    .post__section:after {
        content: "";
        display: table;
        clear: both;
    }
}

/* ------------------------------------ */
/* --- Typography and Content Styling --- */
/* ------------------------------------ */

.post__section__content-container__title {
    font-size: 2.5rem;
    font-weight: 700;
    color: #004D73;
    margin-bottom: 1rem;
    letter-spacing: 0px;
    line-height: 36px;
}

.post__section__content-container__subtitle {
    font-size: 2rem;
    font-weight: 600;
    color: #004D73;
    margin-bottom: 1rem;
    letter-spacing: 0px;
    line-height: 36px;
}

.post__section__content-container__paragraph {
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 1rem;
}

.post__section__content-container__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.post__section__content-container__list-item {
    font-size: 1rem;
    padding: 10px 0;
    position: relative;
    border-bottom: none;
    /* FIX: The key to fixing the border issue is to make the list item itself
       a flexible container, ensuring its content and the pseudo-element
       stay within its boundaries. */
    display: flex;
    align-items: center;
}

/* Creates a more refined border that is contained within the content */
.post__section__content-container__list-item::after {
    content: "";
    display: block;
    width: 100%;
    border-bottom: 1px solid #eee;
    margin-top: 10px;
    /* FIX: Position the border absolutely within the list item */
    position: absolute;
    bottom: 0;
    left: 0;
}

/* Adds a checkmark icon to each list item */
.post__section__content-container__list-item:before {
    content: "✓";
    margin-right: 10px;
    color: #004D73;
}

/* ------------------------------------ */
/* --- Call to Action (CTA) Styling --- */
/* ------------------------------------ */

.post__cta__container {
    display: flex;
    flex-direction: column;
    background-color: #004D73;
    color: white;
    text-align: center;
    padding: 3rem 2rem;
    border-radius: 10px;
    margin-top: 4rem;
}

.post__cta__container__title {
    color: white;
    margin-bottom: 1rem;
}

.post__cta__container__paragraph {
    color: white;
    margin-bottom: 2rem;
    width: 75%;
    align-self: center;
}

.post__cta__container__button {
    background-color: rgb(252, 108, 4);
    color: white;
    padding: 15px 30px;
    border-radius: 5px;
    font-weight: 600;
    text-decoration: none;
    text-transform: uppercase;
    width: 25%;
    align-self: center;
}

@media (max-width: 768px){
    .post__cta__container__paragraph,
    .post__cta__container__button{
        width: auto;
    }
}

/* ------------------------------------ */
/* --- Post Newsletter Styling --- */
/* ------------------------------------ */

.newsletter-post-container.newsletter {
	font-family: 'Inter', sans-serif;
	line-height: 1.6;
	color: #333;
	
	padding: 40px 20px;
	
	display: block; 
    /* NEW: Centering and Width Restriction */
    max-width: 80%;
    margin: 0 auto;
    text-align: center;
}


.newsletter-post-container section {
	margin-bottom: 4rem;
	padding-bottom: 2rem;
	border-bottom: 3px solid #000;
}

.newsletter-post-container section:last-child {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 30px;
}


.newsletter__section-heading {
	font-size: 2.5rem;
	font-weight: 700;
	color: #004D73;
	margin-bottom: 1rem;
	letter-spacing: 0;
	line-height: 46px;
	
	padding-bottom: 0.5rem;
	/* Removed border-bottom: 2px solid #004D73; */
	display: inline-block;
}


.newsletter-post-container section p {
	font-size: 1rem;
	line-height: 1.6;
	margin-bottom: 1.5rem;
}


.newsletter__img-spot {
	margin-top: 2rem;
	margin-bottom: 1rem;
}

.newsletter__img-spot img {
	width: 55%;
	max-width: 800px;
	height: auto;
	
	border-radius: 10px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	
	display: block; 
	margin-left: auto;
	margin-right: auto;
}


.newsletter__promotion-box {
	background-color: #f7f9fc;
	padding: 2rem;
	border-radius: 10px;
	margin-top: 3rem;
	box-shadow: 0 6px 15px rgba(0, 0, 0, 0.08);
}

.newsletter__promotion-box .newsletter__section-heading {
	color: rgb(252, 108, 4);
}
 
/* ------------------------------------ */
/* --- Post Navigation Styling --- */
/* ------------------------------------ */

.post__nav-flex-row {
	/* 1. Make the container a flex container */
	display: flex;
	/* 2. Distribute space: push previous to left, next to right, and center the archive link */
	justify-content: space-around;
	/* 3. Ensure vertical alignment in the center, in case the buttons have different heights */
	align-items: center;
	/* Add some padding/margin for spacing above and below the navigation */
	padding: 2.5rem 0;
	margin: 0 10%;
	max-width: 100%; /* Ensures it fills the container */
	border-top: 1px solid #eee; /* Optional: A separator line above the nav */
}

/* Specific item alignment for text */
.post__nav-flex-row__prev {
	text-align: left;
}

.post__nav-flex-row__archive {
	text-align: center;
}

.post__nav-flex-row__next {
	text-align: right;
}

/* Ensure all items can grow/shrink on smaller screens if necessary, though
space-between usually handles distribution well. */
.post__nav-flex-row__prev,
.post__nav-flex-row__archive,
.post__nav-flex-row__next {
	/* Allows text/content to wrap without making the box inflexible */
	flex-basis: auto;
	min-width: 0; /* Prevents overflow issues with long link text */
}

/* Responsive adjustment for mobile: stack the links */
@media (max-width: 768px) {
	.post__nav-flex-row {
		/* Stack the items vertically */
		flex-direction: column;
		/* Align items to the center of the container */
		align-items: center;
		padding: 1.5rem 0;
	}
	
	.post__nav-flex-row__prev,
	.post__nav-flex-row__archive,
	.post__nav-flex-row__next {
		/* Ensure they take up the full width for a clean stack */
		width: 100%;
		margin-bottom: 1rem; /* Space between stacked items */
		text-align: center; /* Center the text when stacked */
	}
	
	/* Remove the margin from the last stacked item */
	.post__nav-flex-row__next {
		margin-bottom: 0;
	}
}

/* Apply the styles from .btn__secondary (with critical fix) */
.post__nav-link-item a {
	background-color: #004D73;
	color: #fff;
	text-decoration: none;
	padding: 3% 17%;
	font-weight: 600;
	font-size: 20px;
	font-family: 'Monserat_Normal';
	border-radius:3px;
	width: auto;
	margin: 0;
	display: inline-block; /* Crucial for buttons/links */
	/* ---------------------- */
	
	border: none;
	text-align: center;
	
	/* Apply styles from .btn (transition) */
	transition:
		border-radius 0.3s ease-in-out,
		font-size 0.3s ease-in-out,
		transform 0.3s ease-in-out;
}

/* Apply the hover styles from .btn:hover */
.post__nav-link-item a:hover {
	border-radius: 4px;
	transform: scale(1.15);
}

/*NEW QUERIES*/
@media (max-width: 768px){
    .primary-container{
        padding: 10% 2%;
    }
    .tour-section-content-primary__left-title{
        padding-left: 0%;
        text-align: center;
        font-size: 30px;
    }
}

/*HOMEPAGE*/
@media (max-width: 768px) {
    /* Styles for the main container on mobile */
    .home-container,
    .discoverpotrero-container{
        flex-direction: column;
        min-height: 100vh;
        align-content: flex-start;
    }

    /* Styles for the individual tour and courses divs on mobile */
    .home__tours.image-container,
    .home__courses.image-container,
    .discoverpotrero__brand-primary.image-container,
    .discoverpotrero__brand-secondary.image-container{
        flex-direction: column;
        align-items: center;
        text-align: center;
        width: 100%;
        flex-shrink: 0;
        
        /* Remove the height and max-height properties here */
        height: auto;
        max-height: none;
    }

    /* Adjust padding or margins for mobile */
    .image-container__content {
        padding-right: 0;
    }
    
    .home__courses,
    .home__tours,
    .discoverpotrero__brand-primary,
    .discoverpotrero__brand-secondary{
        padding-top: 40px;
        margin-top: -2px;
    }
    
    .image-container__p{
        padding: 10px;
        text-align:  center;
    }
    
    .primary-container__h1,
    .title-margin__bottom{
        text-align:  center;
        letter-spacing: 0;
        margin-bottom: -3px;
    }
    .home__conservation,
    .home__technical.paralax-container{
        max-height: 100vh !important;
    }
    
    .primary-container__p,
    .paralax-container__p{
        padding: 4% 0%;
    }
}