:root{
    --padding-container: 100px 0;
    --color-title: #244072;
    /* --color-title: #E48716; */
}

body {
    font-family: 'Poppins', sans-serif;
    background-color: #F2F2F0;
}

::selection {
    background-color: #E48716;
    color: #ffffff;
  }

.container{
    width: 90%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    padding: var(--padding-container);
}

.padding_bottom{
    display: block;
    padding-bottom: 50px;
}



/* HOME */
/* versión enero 2024 */
.header_home{
    width: 100%;
    height: 130px;
    /* min-height: 130px; */
    max-height: 140px;
    /* min-height: 190px; */
    /* max-height: 150px; */
    position: relative;
    display: grid;
    grid-template-rows: 110px 1fr;
    color: aliceblue;
    z-index: 10;
}

.header_home:before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background-image: linear-gradient(180deg, #0000008c 0%, #0000008c 100%), url('../images/banner_product.jpg'); */
    background-color: #2c303fe3;
    background-size: cover;
    z-index: -1;
}

.header_title_home{
    padding-top: 15px;
    padding-left: 30px;
    font-size: 3em;
}

.header_title_home_link{
    text-decoration: none;
    color: #FAAB01;
}

.header_title_home_link:hover{
    color: #E48716;
}

.nav_home{
    display: flex;
    flex-direction: column;
    margin-left: auto;
    margin-right: 50px;
}

.nav_home_bottom{
    margin-left: auto;
    margin-right: 50px;
    margin-bottom: 5px;
    padding: 0;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    gap: 2em;
}

.nav_home_bottom_items{
    list-style: none;
}

.nav_home_bottom_item{
    color: aliceblue;
    text-decoration: none;
}

.nav_home_bottom_item:hover{
    text-decoration: underline;
}

.idiomas_home{
    margin-left: auto;
    margin-right: 50px;
    margin-bottom: 25px;
    padding: 0;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    gap: 2em;
}

.idiomas_home_items{
    list-style: none;
}

.idiomas_home_item{
    color: aliceblue;
    text-decoration: none;
    font-size: 0.9rem;
}

.idiomas_home_item:hover{
    text-decoration: underline;
}

.menu_home {
    display: none;
    max-height: 0;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background-color: #F2F2F0;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    z-index: 100; 
    transition: opacity 0.3s, transform 0.3s;
    opacity: 0;
    min-height: 23vh;
    padding-bottom: 30px;
    padding-top: 30px;
}

.menu_home.active{
    display: block;
    opacity: 1;
    transform: translateY(0);
}

.menu_home_links{
    display: flex;
    list-style: none;
    justify-content: space-around;
    flex-wrap: wrap;
}

.menu_home_link{
    text-decoration: none;
    color: #272525;
}

.menu_home_link:hover{
    text-decoration: underline;
    color: #E48716;
}

.menu_home_link_title{
    text-transform: uppercase;
    text-decoration: none;
    padding-bottom: 15px;
    display: flex;
    color: #001A49;
}

.menu_home_inside{
    list-style: none;
    padding-bottom: 15px;
}


.slider-container_banner_products {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: 500px;
  }


  .slider-wrapper_banner_products {
    display: flex;
    transition: transform 0.5s ease-in-out;
  }

  .slide_banner_products {
    min-width: 100%;
    box-sizing: border-box;
    position: relative;
    height: 500px;
  }

  .slide_banner_products {
    min-width: 100%;
    box-sizing: border-box;
    position: relative;
    height: 500px;
    background-size: cover;
    background-position: center;
 }

 .slide_banner_products::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(39, 37, 37, 0.6);
    z-index: 1;
   }


  .slide-content_banner_products {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #f2f2f0;
    width: 70%;
    height: 80%;
    overflow: hidden;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
 }


 .slide_prod_text{
    line-height: 1.7;
    text-align: justify;
    color: #F2F2F0;
    font-size: 1.2rem;
 }

  .slide-text_banner_products {
    font-size: 36px;
    font-weight: bold;
    margin-right: auto;
    padding-bottom: 10px;
  }

  .arrow_banner_products {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 30px;
    padding: 10px;
    border: none;
    outline: none;
    user-select: none;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0);
  }

  .arrow_inside_banner_products{
    width: 35px;
  }

  .arrow-left_banner_products {
    left: 5%;
  }

  .arrow-right_banner_products {
    right: 5%;
  }



  .valensat-products {
    display: grid;
    gap: 20px;
    padding: 50px 40px 100px;
  }
  
  .products_section-title {
    color: var(--color-title);
    font-size: 2rem;
    padding-top: 25px;
    padding-bottom: 5px;
    font-weight: 600;
    text-decoration: underline;
  }
  
  .products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    align-items: flex-start;
  }
  
  .products-column {
    display: grid;
    gap: 20px;
  }
  
  .column-title {
    text-align: center;
    margin-bottom: 10px;
    color: var(--color-title);
    font-size: 2rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 5px;
    padding-bottom: 5px;
    font-weight: 600;
  }
  
  .button_products {
    width: 100%;
    padding: 10px;
    cursor: pointer;
    height: 170px;
    background-size: cover;
    background-position: center;
    border: none; 
    overflow: hidden;
    display: block;
    text-align: center;
    color: white;
    box-shadow: 0 0 8px 1px #686461;
    position: relative;
  }

  .button_products::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(39, 37, 37, 0.4);
    z-index: 1;
  }

  .button_products {
    display: block;
    position: relative;
    z-index: 3; 
    color: white;
    /* font-size: 1.5rem; */
  }

  .button_content--text {
    font-size: 1.5rem;
  }

  .button_content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
  }

.icon_product {
    width: 50px;
    height: auto;
    margin-bottom: 5px;
}


.tiemporeal_container{
    min-width: 100%;
    box-sizing: border-box;
    position: relative;
    height: 500px;
    background-size: cover;
    background-position: center;
}

.tiemporeal_container::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(39, 37, 37, 0.85);
    z-index: 1;
}

.tiemporeal_inside{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #f2f2f0;
    width: 80%;
    height: 80%;
    overflow: hidden;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.tiemporeal_title{
    font-size: 36px;
    font-weight: bold;
    margin-right: auto;
    padding-bottom: 15px;
    text-transform: uppercase;
}

.tiemporeal_text{
    line-height: 1.7;
    text-align: justify;
    color: #F2F2F0;
    font-size: 1.2rem;
}

.tiemporeal_button{
    margin-top: 20px;
    padding: 20px;
    margin-right: auto;
    font-size: 1.2rem;
    text-transform: uppercase;
    color: #F2F2F0;
    background-color: rgba(242, 242, 240, 0.2);
    border-radius: 5px;
    border: solid #F2F2F0;
}

.tiemporeal_button:hover{
    cursor: pointer;
}


.home_app{
    padding-top: 100px;
    padding-bottom: 100px;
    width: 100%;
    align-items: center;
    text-align: center;
}

.home_app_title{
    box-shadow: 0 -5px 7px rgba(39, 37, 37, 0.1);
    width: 100%;
    color: #2c303f;
    text-transform: uppercase;
    font-size: 2rem;
    font-weight: 600;
    padding-top: 20px;
    padding-bottom: 5px;
    background-color: rgba(250, 250, 250, 1);
}

.container_home_app{
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    height: 100vh;
    width: 100%;
}

.container_home_app_map{
    width: 100%;
    height: 100%;
}

.home_app_footer{
    box-shadow: 0 5px 7px rgba(39, 37, 37, 0.1);
    width: 100%;
    color: #2c303f;
    font-size: 1.2rem;
    font-weight: 600;
    padding-top: 15px;
    padding-bottom: 20px;
    background-color: rgba(250, 250, 250, 1);
    cursor: pointer;
}

.home_app_footer:hover{
    color: #E48716;
    text-decoration: underline;
}

.home_app_ventana_info {
    display: none; 
    position: fixed; 
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 10; 
    padding: 40px 60px;
    background: #f2f2f0;
    border-radius: 10px;
    width: 80%;
    max-height: 80%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
    transition: opacity 1s ease, visibility 1s ease;
}

.home_app_ventana_info--container{
    align-items: center;
    text-align: justify;
    margin-left: auto;
    margin-right: auto;
    overflow: auto;
    max-height: calc(80vh - 80px);
    padding: 20px;
    scrollbar-width: thin;
    scrollbar-color: #272525 #F2F2F0;
}

.home_app_ventana_info--container::-webkit-scrollbar {
    width: 10px;
}
   
.home_app_ventana_info--container::-webkit-scrollbar-track {
    background: #F2F2F0;
}
   
.home_app_ventana_info--container::-webkit-scrollbar-thumb {
    background: #272525;
    border-radius: 10px;
}
   
.home_app_ventana_info--container::-webkit-scrollbar-thumb:hover {
    background: #555;
}


.home_app_ventana_info--title{
    color: var(--color-title);
    text-transform: uppercase;
    text-align: center;
    font-size: 1.7rem;
    font-weight: 600;
    padding-bottom: 5px;
}

.home_app_ventana_info--text{
    display: block;
    line-height: 1.7;
    padding-top: 15px;
}

.home_app_ventana_info--textlist{
    line-height: 1.7;
    padding-top: 15px;
}

.home_app_ventana_info--highlight {
    display: block;
    line-height: 1.7;
    padding: 15px 0 0;
    color: #001a49c2;
    font-style: italic;
    font-weight: 600;
}

.modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(39, 37, 37, 0.6);
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease, visibility 0.5s ease;
}

.modal-overlay.visible, .home_app_ventana_info.visible {
    display: block;
    opacity: 1;
    visibility: visible;
}


.no-scroll {
    overflow: hidden;
}

.overflow-hidden {
    overflow: hidden;
}

.close-icon {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
    cursor: pointer;
}



/* PRODUCTS */
/* versión enero 2024 */

.title_product_page{
    color: #E48716;
    position: absolute;
    font-size: 2.2rem;
    padding-top: 50px;
    padding-bottom: 50px;
    padding-left: 420px;
    text-transform: uppercase;
    z-index: -1;
}

.sidebar_product_page {
    width: 400px;
    /* position: fixed; */
    left: 0;
    top: 0;
    top: 13vh;
    bottom: 0;
    background-color: rgba(242, 242, 240, 0);
    overflow-x: hidden;
    z-index: 3;
    padding: 50px;
    /* padding-top: 0; */
}
  
.menu_product_page {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
  
.menu-item_product_page {
    padding: 10px 10px 10px 20px;
    cursor: pointer;
    height: 50px;
    display: flex;
    align-items: center;
    box-shadow: 0px 1px 0px 0px rgba(39,37,37,1);
    font-size: 1.3rem;
}
  
.menu-item_product_page:hover {
    /* background-color: #e0e0e0; */
    text-decoration: underline;
    /* color: #E48716; */
}

.menu-item_product_page.active {
    /* background-color: #E48716; */
    color: #E48716;
    box-shadow: -3px 1px 0px 0px rgba(228,135,22,1);
}
  
.content-section_product_page {
    margin-left: 400px;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    /* top: 0; */
    top: calc(130px + 100px);
    left: 0;
    right: 0;
    bottom: 0;
    transition: opacity 0.5s ease, visibility 0.5s ease;
    overflow: auto;
    padding: 0px 70px 20px 20px;
    text-align: justify;
    height: 100%;
    direction: rtl;
    scrollbar-width: thin;
    scrollbar-color: #272525 #F2F2F0;
    /* min-height: max-content; */
}

.content-section_product_page * {
    direction: ltr;
}

.content-section_product_page::-webkit-scrollbar {
    width: 6px;
}
   
.content-section_product_page::-webkit-scrollbar-track {
    background: #F2F2F0;
}
   
.content-section_product_page::-webkit-scrollbar-thumb {
    background: #272525;
    border-radius: 10px;
}
   
.content-section_product_page::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.productos_title_section{
    color: var(--color-title);
    font-size: 1.7rem;
    padding-top: 55px;
    padding-bottom: 45px;
    font-weight: 600;
    text-decoration: underline;
    text-transform: uppercase;
    text-align: center;
}

.botones_productos_product_page{
    display: flex;
    flex-wrap: wrap;
    gap: 50px;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.btn {
    display: inline-block;
    width: 45%;
    height: 200px;
    /* border-radius: 16px; */
    font-weight: bold;
    font-size: 16px;
    /* background-color: #FAAB01; */
    color: white;
    box-shadow: 0 0 8px 1px #686461;
    border: 0;
    text-decoration: none;
    text-align: center;
    background-size: cover;
    background-position: center;
    position: relative;
    z-index: 0;
}

.btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(39, 37, 37, 0.7);
    z-index: -1;
}

.button-content {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    font-size: 1.5rem;
    padding: 30px;
    z-index: 2;
}

.btn:hover {
    color: #E48716;
    /* color: #f2f2f0; */
    cursor: pointer;
}


/* APP PRODUCT PAGE */
.app_page {
    display: block;
    height:100vh;
    width:100vw;
    box-sizing:border-box;
}

.app_page_title{
    height: 7%;
    background-color: rgba(250, 250, 250, 1);
    display: flex;
    justify-content: center;
    align-items: center;
}

.app_page_title--title{
    text-transform: uppercase;
    color: #2c303fe3;
    font-size: 2rem;
    font-weight: 600;
}

.app_page_map{
    height: 86%;
}

.app_page_footer{
    height: 7%;
    background-color: rgba(250, 250, 250, 1);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.app_page_footer--footer{
    color: #2c303f;
    font-size: 1.2rem;
    font-weight: 600;
    padding-top: 15px;
    padding-bottom: 20px;
    background-color: rgba(250, 250, 250, 1);
    cursor: pointer;
}

.app_page_title_est{
    height: 7%;
    background-color: rgba(242, 242, 240, 1);
    display: flex;
    justify-content: center;
    align-items: center;
}

.app_page_footer_est{
    height: 7%;
    background-color: rgba(242, 242, 240, 1);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.app_page_footer--footer_est{
    color: #2c303f;
    font-size: 1.2rem;
    font-weight: 600;
    padding-top: 15px;
    padding-bottom: 20px;
    background-color: rgba(242, 242, 240, 1);
    /* cursor: pointer; */
}

.app_page_footer--footer:hover{
    color: #E48716;
    text-decoration: underline;
}

.home_app_ventana_info--title--app_page{
    color: var(--color-title);
    text-transform: uppercase;
    text-align: center;
    font-size: 1.7rem;
    font-weight: 600;
    padding-bottom: 5px;
}

.home_app_ventana_info--subtitle--app_page{
    color: var(--color-title);
    font-size: 1.4rem;
    font-weight: 600;
    padding: 15px 0 0;
}

.home_app_ventana_info--img_container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 10px 0;
}

.home_app_ventana_info--ec{
    width: 40%;
    padding: 10px 0 5px;
}

.home_app_ventana_info--tabla{
    width: 37%;
    padding: 10px 0 5px;
}
.home_app_ventana_info--tablalarga{
    width: 50%;
    padding: 10px 0 5px;
}

.home_app_ventana_info--tablalarga2{
    width: 70%;
    padding: 10px 0 5px;
}

.home_app_ventana_info--img{
    width: 30%;
    padding: 10px 0 5px;
}

.ref_sup{
    color: #E48716;
    font-size: 0.8rem;
    font-weight: 600;
}

.imagen_ciencia_product_page--container{
    display: flex;
    justify-content: center;
}

.imagen_ciencia_product_page{
    width: 30%;
}

.imagen_ciencia_product_page2{
    width: 35%;
}

.imagen_ciencia_product_page3{
    width: 70%;
}





/* ABOUT */
/* versión enero 2024 */
.slider-container_banner_info {
    width: 100%;
    overflow: hidden;
    position: relative;
  }

.slider-wrapper_banner_info {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.slide_banner_info {
    min-width: 100%;
    box-sizing: border-box;
    padding: 20px;
    background-color: #f2f2f2;
    text-align: center;
}

.slide1 {
    position: relative;
    padding-bottom: 10px;
}

.slide1::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 7px;
    background-color: #272525; 
    clip-path: polygon(3% 75%, 33.5% 75%, 33.5% 100%, 3% 100%);
}

.slide2 {
    position: relative;
    padding-bottom: 10px;
}

.slide2::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 7px;
    background-color: #272525; 
    clip-path: polygon(33.75% 75%, 66.89% 75%, 66.89% 100%, 33.75% 100%);
}

.slide3 {
    position: relative;
    padding-bottom: 10px;
}

.slide3::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 7px;
    background-color: #272525; 
    clip-path: polygon(66.89% 75.5%, 97% 75.5%, 97% 100%, 66.89% 100%);
}

.arrow_banner_info {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 30px;
    padding: 10px;
    border: none;
    outline: none;
    user-select: none;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0);
  }

  .arrow_inside_banner_info{
    width: 35px;
  }

  .arrow-left_banner_info {
    left: 5%;
  }

  .arrow-right_banner_info {
    right: 5%;
  }






/* Header */
.header{
    width: 100%;
    height: 80vh;
    min-height: 400px;
    /* max-height: 800px; */
    position: relative;
    display: grid;
    grid-template-rows: 100px 1fr 1fr;
    color: aliceblue;
}

.header:before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(180deg, #0000008c 0%, #0000008c 100%), url('../images/banner.jpg');
    background-size: cover;
    clip-path: polygon(0 0%, 100% 0, 100% 80%, 50% 95%, 0 80%);
    z-index: -1;
}

.nav{
    --padding-container: 0;
    height: 100%;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.nav_logo{
    margin-top: 10px;
}

.nav_logo_img1{
    width: 175px;
}

.nav_logo_img2{
    width: 100px;
}

.container_nav{
    width: 90%;
    /* max-width: 1200px; */
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    padding: var(--padding-container);
    height: 200px;
}

.idiomas{
    margin-left: auto;
    margin-right: 50px;
    padding: 0;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    gap: 2em;
}

.idiomas_items{
    list-style: none;
}

.idiomas_item{
    color: aliceblue;
    text-decoration: none;
}

.idiomas_item:hover{
    text-decoration: underline;
}

.nav_img{
    display: block;
    width: 30px;
}


/* Header container */

.header_container{
    max-width: 800px;
    display: grid;
    grid-auto-rows: max-content;
    align-content: center;
    gap: 1em;
    padding-bottom: 100px;
    text-align: center;
}

.header_title{
    font-size: 5em;
    color: #FAAB01;
}

.header_paragraph{
    margin-bottom: 20px;
}

/* Menu container */

/* Menu desplegable INDEX*/
.menu--index{
    height: 70px;
    background-color: rgba(59, 55, 45, 0.4);
}

.menu__container--index{
    display: flex;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    /* max-width: 1200px; */
    height: 100%;
    justify-content: space-evenly;
    align-items: center;
}

.menu__links--index{
    height: 100%;
    transition: transform 0.5s;
    display: flex;
    flex-wrap: wrap;
    gap: 6em;
}

.menu__item--index{
    list-style: none;
    position: relative;
    height: 100%;
    /* width: 250px; */
    --clip: polygon( 0 0, 100% 0, 100% 0, 0 0);
    --transform: rotate(-90deg);
}

.menu__link--index{
    color: aliceblue;
    text-decoration: none;
    padding: 0 30px;
    display: flex;
    height: 100%;
    align-items: center;
    font-size: 1.1em;
}

.menu__link--index:hover{
    background-color: rgba(228, 135, 22, 0.7);

}

.menu__item--index:hover{
    --clip: polygon( 0 0, 100% 0, 100% 100%, 0% 100%);
    --transform: rotate(0);
}

.menu__nesting--index{
    clip-path: var(--clip);
    list-style: none;
    transition: clip-path 0.5s;
    position: absolute;
    right: 0;
    bottom: 0;
    padding-left: 0;
    width: max-content;
    transform: translateY(100%);
    background-color: rgba(59, 55, 45, 0.8);
}

.menu__arrow--index{
    transform: var(--transform);
    transition: transform 0.5s;
    display: block;
    margin-left: 3px;
}

.menu__link--inside--index{
    padding: 30px 100px 30px 20px;
}

.menu__link--inside--index:hover{
    background-color: rgba(228, 135, 22, 0.7);
}

.menu__hamburguer--index{
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 15px;
    cursor: pointer;
    display: none;
}

.menu__img--index{
    display: block;
    width: 36px;
}

.nav_close{
    display: var(--show, none);
    margin-left: auto;
    margin-right: auto;
    width: 35px;
    padding-bottom: 50px;
}



/* Menu desplegable */

.menu{
    height: 70px;
    background-color: rgba(93, 112, 138, 0.4);
    align-self: self-end;
}

.menu__container{
    display: flex;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    /* max-width: 1200px; */
    height: 100%;
    justify-content: space-evenly;
    align-items: center;
}

.menu__links{
    height: 100%;
    transition: transform 0.5s;
    display: flex;
    flex-wrap: wrap;
    gap: 2.1em;
}

.menu__item{
    list-style: none;
    position: relative;
    height: 100%;
    /* width: 215px; */
    --clip: polygon( 0 0, 100% 0, 100% 0, 0 0);
    --transform: rotate(-90deg);
}

.menu__link{
    color: aliceblue;
    text-decoration: none;
    padding: 0 30px;
    display: flex;
    height: 100%;
    align-items: center;
    font-size: 1.1em;
}

.menu__link:hover{
    background-color: rgba(228, 135, 22, 0.7);

}

.menu__item:hover{
    --clip: polygon( 0 0, 100% 0, 100% 100%, 0% 100%);
    --transform: rotate(0);
}

.menu__nesting{
    clip-path: var(--clip);
    list-style: none;
    transition: clip-path 0.5s;
    position: absolute;
    right: 0;
    bottom: 0;
    padding-left: 0;
    width: max-content;
    transform: translateY(100%);
    background-color: rgba(93, 112, 138, 1);
    z-index: 1;
}

.menu__arrow{
    transform: var(--transform);
    transition: transform 0.5s;
    display: block;
    margin-left: 3px;
}

.menu__link--inside{
    padding: 30px 100px 30px 20px;
}

.menu__link--inside:hover{
    background-color: rgba(228, 135, 22, 0.7);
}

.menu__hamburguer{
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 15px;
    cursor: pointer;
    display: none;
}

.menu__img{
    display: block;
    width: 36px;
}



/* ####################################### */
/* ############# TIEMPO REAL ############# */
/* ####################################### */

/* styles.css */
#contenedor-principal {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    padding: 20px;
    width: 85%;
    margin-right: auto;
    margin-left: auto;
}

.seccion {
    margin: 10px;
    /* padding: 20px; */
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 300px; 
    background-color: #fff;
    height: 400px;
    border-color: #B9848C;
}

.columna-1 {
    width: 31%;
}

.columna-2 {
    width: 64.7%;
}

.columna-3 {
    width: 100%;
}

.columna-1-5 {
    width: 48%;
}

.fila-2 {
    height: 800px;
}

.title_seccion{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
    background-color: #B9848C;
    height: 7vh;
}

.seccion_icon{
    width: 45px;
    aspect-ratio: 1/1;
    background-color: #F2F2F0;
    padding: 7px;
    border-radius: 50%;
}

.title_seccion--title{
    font-weight: 600;
    align-items: center;
    display: flex;
    gap: 0.5em;
    color: #272525;
}

.info_icon{
    width: 37px;
    aspect-ratio: 1/1;
}

.info_icon:hover{
    cursor: pointer;
}

.icono-info {
    cursor: pointer;
    margin-left: auto;
    display: inline-block;
}

.popup-oculto {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: rgba(0,0,0,0.4);
}

.contenido-popup {
    background-color: #fefefe;
    margin: 15% auto;
    padding: 50px;
    border: 1px solid #888;
    width: 80%;
    max-height: 50%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    animation-name: animacionPopup;
    animation-duration: 0.5s;
    position: relative;
    overflow: auto;
}

@keyframes animacionPopup {
    from {opacity: 0}
    to {opacity: 1}
}


/* POP-UP */

.close_icon{
    width: 37px;
    aspect-ratio: 1/1;
    position: absolute;
    top: 15px;
    right: 15px;
    cursor: pointer;
}

.contenido-popup--inside{
    display: flex;
    flex-direction: column;
}


.contenido-popup--inside_tit{
    color: #2c303f;
    font-size: 1.4em;
    padding-bottom: 10px;
}

.contenido-popup--inside_text{
    color: #272525;
    padding: 7px 0;
    text-align: justify;
}

.contenido-popup--inside_text_span{
    color: #B9848C;
    font-weight: 600;
    text-decoration: underline;
}

.popup--prediccion_aemet_img{
    padding: 20px;
    width: 90%;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.enlace_popup{
    text-decoration: none;
    color: #E48716;
    font-weight: 600;
}

.enlace_popup:hover{
    text-decoration: underline;
    color: #B9848C;
}

.contenido-popup--inside_table{
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    width: 37%;
    padding: 10px 0;
}

.contenido-popup--inside_ecuation{
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    width: 30%;
    padding: 10px 0;
}


/* AEMET */

.seccion_aemet{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 12px;
    height: calc(100% - 7vh);
}

.seccion_aemet--temp{
    /* width: max-content; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    margin-right: auto;
    margin-left: auto;
    max-width: 350px;
}

.seccion_aemet--temp2{
    /* width: calc(50% - 600px); */
    display: flex;
    /* flex-direction: column; */
    justify-content: center;
    align-items: center;
    height: 100%;
    margin-right: auto;
    margin-left: auto;
}

.seccion_aemet--graf{
    width: 600px;
    margin-right: auto;
    margin-left: auto;
    align-items: center;
}

.seccion_aemet--desplegable{
    text-align: center;
    border-radius: 10px;
    border-color: #B9848C;
    background-color: #F2F2F0;
    padding: 5px;
}

.seccion_aemet--desplegable:hover{
    cursor: pointer;
}

.seccion_aemet--registro_aemet{
    padding: 10px 10px 0;
}

.seccion_aemet--registro_aemet_text{
    margin-right: auto;
    margin-left: auto;
}

.seccion_aemet--temp2_valores{
    display: flex;
    flex-wrap: wrap;
    max-width: 330px;
    gap: 10px;
    align-items: center;
}

.aemet_box{
    border: 1px solid #B9848C;
    padding: 5px;
    text-align: center;
    width: 160px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}

.seccion_aemet--temp2_valores--tm_text{
    font-size: 1.7em;
    color: #272525;
}

.seccion_aemet--temp2_valores--tmaxmin, .seccion_aemet--temp2_valores--hr, .seccion_aemet--temp2_valores--precip, .seccion_aemet--temp2_valores--tr, .seccion_aemet--temp2_valores--tm{
    display: flex;
    flex-direction: column;
    gap: 0.6em;
}

.seccion_aemet--temp2_valores--vv{
    display: flex;
    flex-direction: column;
    gap: 0.2em;
}

.seccion_aemet--temp2_valores--tmaxmin_text, .seccion_aemet--temp2_valores--text{
    font-size: 0.9em;
}

.seccion_aemet--temp2_valores--tmaxmin_text,
.seccion_aemet--temp2_valores--tmaxmin_val{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.seccion_aemet--temp2_valores--tmaxmin_min,
.seccion_aemet--temp2_valores--tmaxmin_max {
    width: 50%;
    text-align: center;
    color: #272525;
}

.seccion_aemet--temp2_valores--tmaxmin_min{
    color: #2F70AF;
}

.seccion_aemet--temp2_valores--tmaxmin_max{
    color: #ED413E;
}

.seccion_aemet--icon_inside{
    width: 15%;
    aspect-ratio: 1/1;
}

.seccion_aemet--icon_inside_wind{
    width: 20%;
    aspect-ratio: 1/1;
}

.seccion_aemet--icon_inside_brujula{
    width: 40%;
    aspect-ratio: 1/1;
}

.seccion_aemet--temp2_valores--hr_val, .seccion_aemet--temp2_valores--precip_val, .seccion_aemet--temp2_valores--tr_val, .seccion_aemet--temp2_valores--vv_val{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5em;
}

.seccion_aemet--registro_aemet_text_hr, .seccion_aemet--registro_aemet_text_precip, .seccion_aemet--registro_aemet_text_tr, .seccion_aemet--registro_aemet_text_vv{
    font-size: 1.1em;
    color: #272525;
}

.seccion_aemet--temp2_valores--dv_val{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.1em;
}

.seccion_aemet--registro_aemet_text_dv{
    font-size: 1.1em;
    color: #272525;
}

.seccion_aemet--registro_aemet_text_tit{
    font-weight: 500;
    text-decoration: underline;
}

.seccion_aemet--registro_aemet--infoest{
    padding: 20px 20px 0;
    display: flex;
    flex-direction: column;
    gap: 0.5em;
}


/* PREDICCION AEMET */

.seccion_aemet--prediccion{
    padding: 15px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1em;
}

.seccion_aemet--desplegable_municipio{
    text-align: center;
    border-radius: 10px;
    border-color: #B9848C;
    background-color: #F2F2F0;
    padding: 5px;
    width: max-content;
}

.iconos_prediccion{
    width: 35px;
    aspect-ratio: 1/1;
}

.tablaPrediccion_aemet{
    border: 1px solid #B9848C;
    border-radius: 10px;
    padding: 15px;
}


.tablaPrediccion_aemet--header{
    width: 300px;
    padding: 10px;
    color: #F2F2F0;
    background-color: #378BA4;
}

.tablaPrediccion_aemet--celdatit{
    padding: 1px 1px 1px 10px;
    color: #272525;
    /* background-color: #81BECE; */
}

.tablaPrediccion_aemet--header:first-child{
    background-color: #fff;
}

.tablaPrediccion_aemet--fila1{
    background-color: #95B6E9;
}

.tablaPrediccion_aemet--fila1, .tablaPrediccion_aemet--fila2, .tablaPrediccion_aemet--fila3, .tablaPrediccion_aemet--fila4{
    text-align: center;
    padding: 10px 5px 5px;
}

.tablaPrediccion_aemet--fila3{
    color: #2F70AF;
}

.tablaPrediccion_aemet--fila4{
    color: #ED413E;
}


/* AVAMET */

.seccion_AVAMET{
    /* width: 100%; */
    height: calc(100% - 7vh);
}



/* APPS */

.app_page_map_tiemporreal{
    height: calc(100% - 7vh);
}

.container_home_app_map_tiemporreal{
    width: 100%;
    height: 100%;
}

.mapapp_tiemporreal{
    width: 100%;
    height: 100%;
}

/* ####################################### */
/* ####################################### */
/* ####################################### */


/* ####################################### */
/* ########## EVOLUCIÓN URBANA ########### */
/* ####################################### */

/* SLIDER */
.slider-container_evurb--valencia {
    position: relative;
    width: 98%;
    overflow: hidden;
    height: 800px;
    margin-right: auto;
    margin-left: auto;
    box-shadow: 0px 0px 8px 5px #242529;
    margin-top: 50px;
    margin-bottom: 50px;
    border-radius: 1%;
}


.slider-wrapper_evurb--valencia {
    display: flex;
    transition: transform 0.5s ease-in-out;
    height: 100%;
}

.slide_evurb--valencia {
    min-width: 100%;
    box-sizing: border-box;
    position: relative;
    height: 100%;
}

.slide_evurb--valencia {
    /* min-width: 100%; */
    width: 100%;
    box-sizing: border-box;
    position: relative;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-color: #244072;
    border-radius: 0%;
}

.slide_evurb--valencia::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* border-radius: 5%; */
    background-color: rgba(39, 37, 37, 0.7);
    z-index: 1;
}


.slide-content_evurb--valencia {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #f2f2f0;
    width: 90%;
    height: 90%;
    overflow: hidden;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1em;
}


.slide_prod_text{
    line-height: 1.7;
    text-align: justify;
    color: #F2F2F0;
    font-size: 1.2rem;
}

.slide-text_evurb--valencia {
    font-size: 36px;
    font-weight: bold;
    margin-right: auto;
    padding-bottom: 10px;
}

.arrow_evurb--valencia {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 30px;
    padding: 10px;
    border: none;
    outline: none;
    user-select: none;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0);
}

.arrow_inside_evurb--valencia{
    width: 35px;
}

.arrow-left_evurb--valencia {
    left: 2.5%;
}

.arrow-right_evurb--valencia {
    right: 2.5%;
}

.slide-content_evurb--images{
    display: flex;
    gap: 2em;
    align-items: center;
    justify-content: center;
    position: relative;
}

.slide-content_evurb--img{
    width: 45%;
    object-fit: cover;
    box-shadow: 0px 0px 0px 2px #272525;
}

.slide-content_evurb--year1{
    position: absolute;
    left: 5%;
    top: 3%;
    font-size: 2em;
    color: #F2F2F0;
    font-weight: 600;
    box-shadow: 0px 0px 4px 1px #001A49;
    background-color: #24417275;
    padding: 5px 5px 2px;
}

.slide-content_evurb--year2{
    position: absolute;
    right: 5%;
    top: 3%;
    font-size: 2em;
    color: #F2F2F0;
    font-weight: 600;
    box-shadow: 0px 0px 4px 1px #001A49;
    background-color: #24417275;
    padding: 5px 5px 2px;
}

.content_3img{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px 0;
    width: 100%;
    gap: 2em;
}

.content_3img--inside{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1.5em;
    padding: 0 20px;
}

.content_3img--img{
    box-shadow: 0px 0px 20px 3px #001A49;
    width: 400px;
}

.content_3img--text{
    color: #001A49;
    font-size: 1.7em;
    font-weight: 600;
}

.content_6img{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px 0;
    width: 100%;
    gap: 0.5em;
}

.content_6img--inside{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1.5em;
    padding: 0 20px;
}

.content_6img--img{
    box-shadow: 0px 0px 20px 3px #001A49;
    width: 190px;
    height: 60vh;
}

.content_6img--text{
    color: #001A49;
    font-size: 1.7em;
    font-weight: 600;
}

/* ####################################### */
/* ####################################### */
/* ####################################### */


/* ####################################### */
/* ########### CONTAMINACIÓN ############# */
/* ####################################### */

.img_contaminacion--container{
    width: 90%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    padding: 20px 0;
}


.graph_contaminacion--container{
    width: 90%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    padding: 50px 0;
}

/* ####################################### */
/* ####################################### */
/* ####################################### */

/* ####################################### */
/* ########### ÁREAS QUEMADAS ############ */
/* ####################################### */

.img--gif_incendio{
    width: 25%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    box-shadow: 0px 0px 20px 3px #001A49;
    /* width: 400px; */
}

/* ####################################### */
/* ####################################### */
/* ####################################### */

/* ####################################### */
/* ###### INCENDIOS EN LA COMUNIDAD ###### */
/* ####################################### */

.img_evolincendios--container{
    width: 90%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    padding: 20px 0;
}

.img_evolincendios--leyenda{
    width: 7%;
}

/* ####################################### */
/* ####################################### */
/* ####################################### */

/* ####################################### */
/* ########## EVAPOTRANSPIRACIÓN ######### */
/* ####################################### */

.img_evapo--container{
    width: 100%;
    /* display: flex; */
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    padding: 20px 0 5px;
}

.img_evapo_leyenda{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

/* ####################################### */
/* ####################################### */
/* ####################################### */


/* ####################################### */
/* ############### SEQUÍAS ############### */
/* ####################################### */

.img_sequias--container{
    display: flex;
    padding: 40px 0;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.img_sequias{
    width: 43%;
}

/* ####################################### */
/* ####################################### */
/* ####################################### */


/* ####################################### */
/* ############### SEQUÍAS ############### */
/* ####################################### */

.img_sequias--ind{
    padding: 40px 0;
}

/* ####################################### */
/* ####################################### */
/* ####################################### */


/* ####################################### */
/* ########## CALIDAD DEL AGUA ########### */
/* ####################################### */

.img_calidad--container{
    width: 90%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    padding: 40px 0;
}

.img_calidad--container_inside{
    width: 40%;
    box-shadow: 0px 0px 20px 3px #001A49;
}

/* ####################################### */
/* ####################################### */
/* ####################################### */


/* ####################################### */
/* ######## DATOS CLIMATOLOGICOS ######### */
/* ####################################### */

.img_clima--container{
    width: 90%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    padding: 20px 0;
}

.img_clima--container_img{
    width: 60%;
    /* box-shadow: 0px 0px 20px 3px #001A49; */
}

.img_clima2--container{
    width: 60%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    padding: 40px 0;
}

/* ####################################### */
/* ####################################### */
/* ####################################### */


/* ####################################### */
/* ########### SOBRE NOSOTROS ############ */
/* ####################################### */

.about_team{
    text-align: center;
    align-items: center;
    height: 90vh;
    min-width: 100%;
    background-size: cover;
    background-position: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #f2f2f0;
}

.team_titletext{
    width: 80%;
    justify-content: center;
    align-items: center;
    padding-bottom: 40px;

}

.team_title{
    font-size: 36px;
    font-weight: bold;
    margin-right: auto;
    padding-bottom: 15px;
    text-transform: uppercase;
    color: #F2F2F0;
}

.team_text{
    line-height: 1.7;
    /* text-align: justify; */
    color: #F2F2F0;
    font-size: 1.2rem;
}

.team_foto_texto1{
    padding: 0px 0px 40px;
}

.team_name{
    font-size: 1.4rem;
    font-weight: bold;
}

.team_info{
    font-size: 1.2rem;
}

.team_img{
    border-radius: 50%;
    width: 40%;
    aspect-ratio: 1/1;
    border: 1px solid #f2f2f0;
}

.team_img2{
    border-radius: 50%;
    width: 175px;
    aspect-ratio: 1/1;
    border: 1px solid #f2f2f0;
}

.team_foto_texto2{
    display: flex;
    flex-direction: row;
    gap: 6em;
}


/* ####################################### */
/* ####################################### */
/* ####################################### */



/* ####################################### */
/* ############### FOOTER ################ */
/* ####################################### */

.priv-text, .cookie-text, .leg-text{
    color: #F2F2F0;
    font-size: 0.8em;
    text-decoration: none;
}

.priv-text:hover, .cookie-text:hover, .leg-text:hover{
    text-decoration: underline;
    cursor: pointer;
}

.cookie-text--link{
    text-decoration: none;
    color: #E48716;
    font-weight: 600;
}

.cookie-text--link:hover{
    text-decoration: underline;
}

.home_app_ventana_info--text--cook{
    display: block;
    line-height: 1.7;
    padding-top: 15px;
    font-weight: 300;
}

.underline{
    text-decoration: underline;
    font-weight: 600;
}

.home_app_ventana_info--cook, .home_app_ventana_info--priv, .home_app_ventana_info--leg {
    display: none; 
    position: fixed; 
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 10; 
    padding: 40px 60px;
    background: #4e5468;
    border-radius: 10px;
    width: 80%;
    max-height: 80%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
    transition: opacity 1s ease, visibility 1s ease;
}

.home_app_ventana_info--container--cook, .home_app_ventana_info--container--priv, .home_app_ventana_info--container--leg{
    align-items: center;
    text-align: justify;
    margin-left: auto;
    margin-right: auto;
    overflow: auto;
    max-height: calc(80vh - 80px);
    padding: 20px;
    scrollbar-width: thin;
    color: #f2f2f0;
}


.modal-overlay--cook, 
.modal-overlay--priv, 
.modal-overlay--leg {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(39, 37, 37, 0.6);
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease, visibility 0.5s ease;
}

.modal-overlay--cook.visible, .home_app_ventana_info--cook.visible, .modal-overlay--priv.visible, .home_app_ventana_info--priv.visible, .modal-overlay--leg.visible, .home_app_ventana_info--leg.visible {
    display: block;
    opacity: 1;
    visibility: visible;
}



/* ####################################### */
/* ####################################### */
/* ####################################### */


/* ####################################### */
/* ########## IDIOMAS MIENTRAS ########### */
/* ####################################### */


.idiomas_home_item{
    display: none;
}

/* ####################################### */
/* ####################################### */
/* ####################################### */












/* ####################################### */
/* ####################################### */
/* ####################################### */

/* About */

.about{
    text-align: center;
    align-items: center;
}

.title{
    color: #E48716;
    font-size: 3.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 50px;
    padding-bottom: 25px;
}


.subtitle{
    color: var(--color-title);
    font-size: 2rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 50px;
    padding-bottom: 25px;
    font-weight: 600;
}


.about_paragraph{
    display: block;
    line-height: 1.7;
    padding-top: 15px;
}

.about_paragraph--list{
    display: block;
    line-height: 1.7;
    padding-top: 15px;
    padding-left: 20px;
}

.about_paragraph--link{
    text-decoration: none;
    color: #E48716;
    font-weight: 600;
}

.about_paragraph--link:hover{
    text-decoration: underline;
    color: #E48716;
}

.container_text{
    width: 80%;
    /* max-width: 1200px; */
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    text-align: justify;
    padding-bottom: 50px;
}

.container_text_gif{
    width: 80%;
    display: flex;
    margin-left: auto;
    margin-right: auto;
    gap: 20px; /* This adds some space between the image and the text */
}

.text_container {
    padding-top: 5px;
    font-size: 15px;
}

.red_text{
    color: #ED413E !important;
}

.valensat:hover{
    color: #FAAB01;
}

.formulas{
    padding: 25px 0 10px 0;
    font-size: 20px;
    color: #272525;
}

.highlight-box {
    display: block;
    line-height: 1.7;
    padding: 15px 0 0;
    color: #001a49c2;
    font-style: italic;
    font-weight: 600;
}

/* Testimony */

.testimony_title{
    text-align: center;
}

/* .testimony{
    background-color: rgba(2, 39, 73, 0.685);
} */


.testimony {
    background-image: url('../images/banner_cortado_black.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    transition: background 0.5s ease-in-out;
}


.testimony_container{
    display: grid;
    padding: 40px 0;
    grid-template-columns: 50px 1fr 50px;
    gap: 1em;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    min-height: 500px;
}

.testimony_body{
    display: grid;
    grid-template-columns: 1fr max-content;
    justify-content: space-between;
    align-items: center;
    gap: 2em;
    /* que empiece en la 2a linea de columnas y termine en la 3a */
    grid-column: 2/3;
    grid-row: 1/2;
    opacity: 0;
    pointer-events: none;
    padding: 0 25px;
}

.testimony_body--show{
    pointer-events: unset;
    opacity: 1;
    transition: opacity 1.5s ease-in-out;
}

.testimony_img{
    width: 450px;
    height: 350px;
    border-radius: 0%;
    box-shadow: 0 0 8px 1px #686461;
    object-fit: cover;
    object-position: 50% 30%;
}

.testimony_img2{
    width: 550px;
    height: 350px;
    border-radius: 0%;
    box-shadow: 0 0 8px 1px #686461;
    object-fit: cover;
    object-position: 50% 30%;
}

.testimony_subtitle{
    color: #E48716;
    font-size: 2em;
    margin-bottom: 25px;
}

.testimony_texts{
    max-width: 90%;
}

.testimony_review{
    line-height: 1.7;
    text-align: justify;
    color: #F2F2F0;
}

.testimony_arrow{
    width: 100%;
    cursor: pointer;
    background-color: #F2F2F0;
    padding: 10px;
    border-radius: 50%;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    width: 50px;
}

.bold{
    font-weight: 600;
    color: #001A49;
}



/* FOOTER */

.footer{
    /* background-color: rgba(250, 171, 1, 0.9); */
    /* background-color: rgba(250, 171, 1, 0.1); */
    /* background-color: #272525e5; */
    /* background-color: #3b383d; */
    background-color: #2c303f;
    display: grid;
}


.footer_title {
    padding: 0 10px;
    font-size: 24px;
    font-size: 2rem;
    color: #F2F2F0;
    position: relative;
    text-align: center;
    line-height: 1.5;
}


.footer_container--bottom {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 95%;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 30px;
}
  
.border {
    flex: 1;
    height: 1px;
    background-color: #F2F2F0;
}


  

.footer_container{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding-top: 30px;
}

.nav--footer{
    padding-bottom: 20px;
    display: grid;
    gap: 1em;
    grid-auto-flow: row;
    height: 100%;
}

.menu_footer{
    /* display: grid; */
    display: flex;
    flex-wrap: wrap;
    gap: 4.5em;
}

.link_footer{
    text-decoration: none;
    font-size: 0.9em;
    color: #F2F2F0;
    font-weight: 300;
}

.link_footer:hover{
    text-decoration: underline;
}

.links_footer{
    list-style: none;
    margin: 15px 0 15px 0;
}

.logo_footer{
    width: 175px;
    padding-left: 15px;
}

.logo_footer2{
    width: 110px;
    padding-right: 15px;
    padding-left: 15px;
}

.border-top::after {
    content: "Derechos reservados ©VALENSAT";
    display: block;
    text-align: center;
    margin-top: 10px;
    color: #F2F2F0;
    font-weight: 100;
    font-size: 0.9em;
}
  
.footer_container--bottom2 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 95%;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 30px;
    gap: 3em;
}

ul{
    padding-left: 0;
}

.links_footer--header{
    font-size: 1.2rem;
    color: #F2F2F0;
    font-weight: 600;
    text-decoration: none;
}

.links_footer--header:hover{
    text-decoration: underline;
}

.links_footer--header2{
    pointer-events: none;
    font-size: 1.2rem;
    text-decoration: none;
    color: #F2F2F0;
    font-weight: 600;
}


/* BOTÓN VOLVER ARRIBA */
.back-to-top {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    font-size: 16px;
    border: none;
    outline: none;
    background-color: rgba(39, 37, 37, 0.85);
    cursor: pointer;
    padding: 10px;
    border-radius: 50%;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    width: 60px;
  }
  
  .back-to-top:hover {
    background-color: #ffffff;
    transition: all 0.3s ease-in-out;
  }
  
  .back-to-top.show {
    display: block;
  }



/* DESPLEGABLES */

.desp_container{
    display: grid;
    gap: 2em;
    padding-bottom: 50px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.desp_padding{
    padding: 0;
    transition: padding .9s;
    border: 1px solid #001A49;
    border-radius: 6px;
    background-color: rgba(221, 221, 220, 0.3);
}

.desp_padding--add{
    padding-bottom: 30px;
}

.desp_answer{
    padding: 0 30px;
    overflow: hidden;
}

.desp_title{
    display: flex;
    font-size: 20px;
    font-weight: 550;
    padding: 30px 0;
    cursor: pointer;
    color: #001A49;
    justify-content: space-between;
}

.desp_arrow{
    border-radius: 50%;
    width: 25px;
    height: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-self: flex-end;
    margin-left: 10px;
    transition: transform 0.9s;
}

.desp_arrow--rotate{
    transform: rotate(180deg);
}

.desp_show{
    text-align: justify;
    height: 0;
    transition: height 0.9s;
}

.desp_img{
    display: block;
}

.desp_copy{
    margin-bottom: 30px;
    width: 60%;
    margin-left: auto;
    margin-right: auto;
}

.container_text--desp{
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    text-align: justify;
}



/* REFERENCIAS */

.subtitle_ref{
    color: var(--color-title);
    font-size: 1.5rem;
    padding-top: 15px;
    font-weight: 400;
}

.link_ref{
    width: 1.2em;
}

.ref_text{
    text-decoration: none;
    color: #E48716;
    font-size: 0.8rem;
    font-weight: 600;
}

.ref_text:hover{
    text-decoration: underline;
}

.about_paragraph--ref{
    display: block;
    line-height: 1.7;
    padding-top: 10px;
    font-size: 0.95rem;
}




/* PRODUCT WINDOWS */
/* Header */

.header_product{
    width: 100%;
    height: 20vh;
    min-height: 190px;
    /* max-height: 150px; */
    position: relative;
    display: grid;
    grid-template-rows: 110px 1fr;
    color: aliceblue;
}

.header_product:before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(180deg, #0000008c 0%, #0000008c 100%), url('../images/banner_product.jpg');
    background-size: cover;
    z-index: -1;
}

.nav_logo_img_product1{
    width: 150px;
}

.nav_logo_img_product2{
    width: 90px;
}

.container_nav_product{
    width: 90%;
    /* max-width: 1200px; */
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    padding: var(--padding-container);
    /* height: 90%p; */
    padding-top: 5px;
}

.header_title_product{
    padding-top: 15px;
    padding-left: 50px;
    font-size: 3em;
    color: #FAAB01;
}


/* Mapa */

.container_appmap_home{
    padding: 10px 50px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    height: 100vh;
    width: 90%;
}

.container_appmap{
    padding: 10px 50px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    height: 950px;
    width: 90%;
}

.mapapp{
    width: 100%;
    height: 100%;
    border-radius: 10px;
}

.mapa_container{
    height: 100vh;
    padding: 50px;
}

.mapa_container_marco{
    width: 100%;
    height: 100%;
    box-shadow: 0 0 8px 1px #686461;
    border-radius: 10px;

}

.footer_map{
    padding-bottom: 50px;
    text-align: center;
}

.footer_map--link{
    text-decoration: none;
    color: #E48716;
    font-weight: 500;
    /* font-size: 1.1em; */
}

.footer_map--link:hover{
    text-decoration: underline;
    color: #E48716;
    /* font-weight: 500; */
    /* font-size: 1.1em; */
}

.map{
    width: 100%;
    height: 100%;
}

.table{
    margin: auto;
    width: 50%;
    border-collapse: collapse;
}

.td{
    text-align: center;
}

.tr:hover {background-color: #FAAB01;}

/* TABLAS */

.table{
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    text-align: left;
    border-collapse: collapse;
    text-align: center;
}

.table_title{
    text-align: center;
}

/* OPCIONES TABLA ANTIGUO */

/* th{
    padding: 8px;
    border-top: 2px solid #001A49;
    border-bottom: 2px solid #001A49;
    color: #E48716;
}

td{
    padding: 8px;
    border-bottom: 2px solid #fff;
    border-top: 2px solid transparent;
}

tr:hover td{
    background: #FAAB01;
    color: #000;
}

tr td:first-child{
    text-align: left;
} */


.title_table{
    padding-top: 25px;
    color: #244072;
    font-weight: 600;
    font-size: 1em;
}

.title_img{
    padding-bottom: 25px;
    color: #244072;
    font-size: 1em;
}

.image_fig{
    padding: 25px 10px 5px;
    height: 25vh;
}

.green-cell {
    color: green;
}

.red-cell {
    color: red;
}


/* TABLAS AVAMET */

.container_avamet{
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 100px;
}

.th_avamet{
    padding: 8px;
    background-color: #778D45;
    border: 2px solid #1A2902;
    color: aliceblue;
}

.table_avamet--header{
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -ms-sticky;
    position: -o-sticky;
    position: sticky;
    top: 0;
}

.td_avamet{
    padding: 8px;
    border: 2px solid #1A2902;
}

.td_avamet:first-child{
    background-color: #AEC670;
}

.tr_avamet{
    background-color: aliceblue;
}

.tr_avamet:first-child, .tr_avamet:nth-child(39){
    background-color: #AEC670;
}

.tr_avamet:nth-child(40), .tr_avamet:nth-child(50), .tr_avamet:nth-child(74), .tr_avamet:nth-child(95), .tr_avamet:nth-child(104), .tr_avamet:nth-child(137), .tr_avamet:nth-child(167), .tr_avamet:nth-child(180), .tr_avamet:nth-child(187), .tr_avamet:nth-child(190), .tr_avamet:nth-child(200), .tr_avamet:nth-child(221), .tr_avamet:nth-child(225), .tr_avamet:nth-child(235), .tr_avamet:nth-child(244), .tr_avamet:nth-child(253), .tr_avamet:nth-child(264), .tr_avamet:nth-child(271), .tr_avamet:nth-child(275), .tr_avamet:nth-child(304), .tr_avamet:nth-child(314), .tr_avamet:nth-child(325), .tr_avamet:nth-child(334), .tr_avamet:nth-child(370), .tr_avamet:nth-child(393), .tr_avamet:nth-child(417), .tr_avamet:nth-child(435), .tr_avamet:nth-child(458), .tr_avamet:nth-child(464), .tr_avamet:nth-child(519), .tr_avamet:nth-child(539), .tr_avamet:nth-child(558), .tr_avamet:nth-child(567){
    background-color: #AEC09A;
}

.tr_avamet:hover .td_avamet{
    background: #778D45;
    color: aliceblue;
}





/* BANNERS */

/* evolucion incendios */
.container_banner--inc{
    display: flex;
    flex-wrap: wrap;
    padding: 40px 10px 0;
    /* flex-direction: column; */
}


.container_banner--inc_left{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height: 100%;
    width: 40%;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    align-items: center;
}

.graph_donut{
    height: 70%;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
}

.graph_donut--inside{
    height: 70%;
    width: 70%;
}

.container_banner--inc_right{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height: 100%;
    width: 60%;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    align-items: center;
}

.graph_bar{
    height: 100%;
    width: 100%;
}

.graph_bar--inside{
    height: 100%;
    width: 100%;
}

.banner_inc--legend{
    margin-right: auto;
    margin-left: auto;
    height: 50%;
    width: max-content;
    position: relative;
    top: calc(0px - 5vh)
}


/* land cover */
.container_banner--lc{
    display: flex;
    flex-wrap: wrap;
    padding: 40px 10px 0;
    /* flex-direction: column; */
}


.container_banner--lc_left{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height: 100%;
    width: 40%;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    align-items: center;
}

.graph_donut_lc{
    height: 70%;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
}

.graph_donut_lc--inside{
    height: 70%;
    width: 70%;
}

.container_banner--lc_right{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height: 100%;
    width: 60%;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    align-items: center;
}

.graph_bar_lc{
    height: 100%;
    width: 100%;
}

.graph_bar_lc--inside{
    height: 100%;
    width: 100%;
}

.banner_lc--legend{
    margin-right: auto;
    margin-left: auto;
    height: 50%;
    width: max-content;
    position: relative;
    top: calc(0px - 5vh)
}


/* .graph_donut,
.graph_bar {
  padding: 10px;
  box-sizing: border-box;
}


.graph_bar{
    padding-left: 30px;
} */



/* areas quemadas */
.banner_quem{
    width: 100%;
    padding: 65px 0 50px;
    margin-right: auto;
    margin-left: auto;
}

  .banner_quem--group{
    display: flex;
    gap: 40px;
    width: 100%;
}


.banner_quem--inside{
    display: flex;
    gap: 20px;
    width: 100%;
}


.banner_quem--column-legend {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }


.banner_quem--img{
    width: 100%;
    max-height: 450px;
}
  
.banner_quem--title_legend{
    text-align: center;
    font-weight: 600;
    color: #4C3957;
    line-height: 1.3;
    text-decoration: underline;
}

.banner_quem--text_legend{
    text-align: center;
    color: #ED413E;
    line-height: 1.3;
    padding-bottom: 10px;
}

.banner_quem--img_legend{
    width: 12vw;
}


/* Imagenes */

.img_graph{
    width: 100%;
    max-width: 1200px;
    height: 100%;
    padding: 10px;
}

.image_all{
    width: 100%;
}

.ref_banner{
    text-align: right;
    font-size: 0.8em;
}

.ref_banner--link{
    text-decoration: none;
    color: #036280;
}

.ref_banner--link:hover{
    text-decoration: underline;
}

.div_table{
    justify-content: center;
    align-items: center;
    text-align: center;
}

.image_table{
    height: 20vh;
}

.imgbanner_CV{
    /* height: 1200px; */
    max-width: 100%;
}

.image_gif_inc{
    height: 40vh;
}

.image_container {
    border: 2px solid black; /* This adds a border around the image */
}



/* Other web */

.container_web{
    width: 90%;
    /* max-width: 1200px; */
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    padding: var(--padding-container);
}

.container_otherweb{
    padding: 0px 100px 100px 100px;
    margin-left: auto;
    margin-right: auto;
    /* overflow-y: scroll; */
    height: 100vh;
    width: 90%;
}

.otherweb{
    width: 100%;
    height: 100%;
    /* overflow-y: scroll; */
}


.otherweb_container_marco{
    width: 100%;
    height: 100%;
    box-shadow: 0 0 10px 1px var(--color-title);
    /* overflow-y: scroll; */

}


/* DESPLEGABLE */

.desplegable{
    text-align: center;
}

#avamet-widget-container {
    border: none;
    width: 100%;
    height: max-content;
    opacity: 1;
    transition: opacity 1s;
}
#avamet-widget-container.fade-out {
    opacity: 0;
}

.container_pastilla_avamet{
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 10px;
    background-color: #fff;
    min-height: 600px;
}

.avamet_widget_container{
    width: 90%;
    height: max-content;
    min-height: 300px;
    border: 0;
}

.iframe_estaciones{
    width: 99%;
    /* height: 600px; */
    height: 99%;
}

.desplegable_height{
    padding: 10px;
    text-align: center;
    width: 80%;
    border-radius: 10px;
    border-color: #B9848C;
    background-color: #F2F2F0;
}

.center{
    align-items: center;
    justify-content: center;
    text-align: center;
}

.registro_aemet{
    padding: 10px;
}

.registro_aemet_text{
    margin-right: auto;
    margin-left: auto;
}

.footer_ref{
    text-align: right;
    margin-right: 0;
    padding-bottom: 5px;
    font-size: 0.90em;
    cursor: default;
}

.enlace_ref{
    text-decoration: none;
    color: #2F70AF;
}

.enlace_ref:hover{
    text-decoration: underline;
}

/* Para la tabla calidad del agua */
.image_table_calidad {
    max-width: 40%;
    background-color: transparent;
}
.image_title_calidad {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

/* MAPA AVAMET Y AEMET */

.mapa_estaciones{
    margin-left: auto;
    margin-right: auto;
    /* border-radius: 0.8em; */
}

#mapid {
    height: 1000px;
    width: 100%;
  }

#map {
    height: 100%;
    width: 100%;
    }

.url_popup_map{
    text-decoration: none;
    color: #2F70AF;
}

.url_popup_map:hover{
    text-decoration: underline;
    color: #E48716;
}

.url_popup_map2{
    text-decoration: none;
    color: #2F70AF;
}

.url_popup_map2:hover{
    text-decoration: underline;
    color: #ED413E;
}

#map-legend {
    position: absolute;
    bottom: 20px;
    left: 20px;
    padding: 10px;
  }

  .leyenda_mapa{
    list-style-type: none;
    background-color: aliceblue;
    padding: 5px;
    border-radius: 1em;
    margin-left: 40px;
    opacity: 0.9;
  }

  .leyenda_mapa:hover{
    cursor: grab;
  }

  .leyenda_mapa--item{
    display: flex;
    align-items: center;
  }

  .leyenda_mapa--items{
    padding-left: 5px;
  }

  .leyenda_mapa--items_item_1{
    color: #E48716;
    font-size: 1.2em;
    font-weight: 600;
  }

  .leyenda_mapa--items_item_2{
    color: #ED413E;
    font-size: 1.2em;
    font-weight: 600;
  }

  .footer_ref_mapa{
    width: max-content;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 5px;
    font-size: 0.90em;
    cursor: default;
}








.nav_home_bottom_icon--img, .nav_home_mobiles, .menu_home_mobiles, .about_paragraph--mobile, .about_paragraph--mobile_title, .about_paragraph--mobile_text{
    display: none;
}

@media (max-width:1280px){
    .menu_footer{
        display: none;
    }

    .nav_logo_img_product1, .nav_logo_img_product2{
        display: none;
    }
}

@media (max-width:1600px){
    .menu_home {
        min-height: 26vh;
    }
}



/* ############################################# MÓVILES ############################################# */
@media (max-width:1024px){

    /* cosas que no se van a ver */
    .nav_logo_img_product1, .nav_logo_img_product2, .home_app, .nav_home_bottom_items, .nav_logo, .graph_contaminacion--container, .container_banner--inc, .ref_banner_inc, .container_banner--lc, .img_clima2--container, .seccion_aemet--api_graph, .no_mobile{
        display: none;
    }

    
    .header_home, .nav, .container_nav, .container_nav_product, .nav_logo{
        height: 70px;
        /* position: absolute; */
    }

    .header_home:before{
        height: 100%;
    }

    .header_title_home_link{
        font-size: 1.3rem;
    }

    .header_title_home{
        padding-bottom: 35px;
        padding-left: 10px;
    }


    /***********************************/
    /********** TAMAÑO TEXTOS **********/
    /***********************************/

    .products_section-title, .column-title, .footer_title, .productos_title_section, .subtitle_ref, .slide_prod_title, .content_3img--text, .content_6img--text, .subtitle, .team_title,.title_seccion--title{
        font-size: 16px;
    }
    
    .button-content{
        font-size: 15px;
    }

    .slide-text_banner_products, .button_content--text, .button_products, .tiemporeal_title, .contenido-popup--inside_tit{
        font-size: 14px;
    }


    .slide_prod_text, .tiemporeal_text, .tiemporeal_button, .about_paragraph, .about_paragraph--list_inside, .team_text, .team_name, .seccion_aemet--registro_aemet_text_tit{
        font-size: 12px;
    }

    .about_paragraph--ref, .banner_quem--title_legend{
        font-size: 11px;
    }

    .home_app_ventana_info--text--cook, .slide_prod_text, .contenido-popup--inside_text, .seccion_aemet--registro_aemet_text--infoest, .banner_quem--text_legend{
        font-size: 10px;
    }

    .border-top::after, .cookie-text, .priv-text, .leg-text, .ref_banner, .ref_sup, .team_info, .footer_ref{
        font-size: 8px;
    }

    /***********************************/
    /***********************************/
    /***********************************/

    .arrow_inside_banner_products{
        width: 10px;
    }

    .slide_banner_products{
        height: 400px;
    }

    .slider-container_banner_products {
        /* top: 70px; */
        height: 400px;
    }

    .valensat-products{
        /* display: none; */
        padding-top: 30px;
        padding-bottom: 70px;
    }

    .products-grid {
        grid-template-columns: repeat(1, 4fr);
    }

    .button_products{
        height: 80px;
    }

    .products-column {
        gap: 10px;
    }

    .icon_product {
        width: 15px;
    }
    
    .tiemporeal_container{
        height: 600px;
    }

    .tiemporeal_inside{
        justify-content: center;
        align-items: center;
    }

    .menu_footer{
        display: none;
    }

    .footer_container--bottom2{
        flex-direction: column;
        gap: 0.2em;
        padding-bottom: 15px;
    }

    .logo_footer2{
        width: 70px;
    }

    .logo_footer{
        width: 100px;
    }

    .back-to-top{
        width: 40px;
    }

    .home_app_ventana_info--cook, .home_app_ventana_info--priv, .home_app_ventana_info--leg{
        padding: 20px 10px;
    }

    .close-icon{
        width: 15px;
    }

    .nav_home_bottom_icon--img, .nav_home_mobiles{
        display: block;
    }

    .container_nav_product{
        position: absolute;
        left: 5%;
    }

    .nav_home{
        display: none;
    }

    .nav_home_mobiles{
        position: absolute;
        right: 5%;
    }

    .nav_home_bottom_icon--img{
        width: 130%;
        cursor: pointer;
    }

    .menu_home_mobiles {
        max-height: 0;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        background-color: rgba(242, 242, 240, 0.95);
        transition: opacity 0.3s, transform 0.3s;
        opacity: 0;
        min-height: 100%;
        padding-bottom: 30px;
        padding-top: 30px;
    }

    .menu_home_mobiles.active_mobiles{
        display: block;
        opacity: 1;
        z-index: 200; 
        transform: translateY(0);
        position: fixed;
    }

    .menu_home_mobiles--panel{
        width: 80%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-left: auto;
        margin-right: auto;
        gap: 2rem;
        list-style: none;
    }

    .menu_home_mobiles--products{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 15px;
    }

    .menu_home_mobiles--products--li {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

    .menu_home_mobiles--products--title{
        padding-bottom: 2rem;
        text-align: center;
        color: #001A49;
        font-weight: 600;
    }

    .menu_home_mobiles--products--a1{
        font-size: 15px;
        display: flex;
        align-items: center;
        text-decoration: none;
        width: 30vw;
        justify-content: end;
        text-align: end;
        color: #001A49;
        font-weight: 600;
    }

    .menu_home_mobiles--products--a2{
        font-size: 14px;
        width: 40vw;
        padding-left: 13px;
        display: flex;
        color: #2c303f;
        text-decoration-color: #378BA4;
    }

    .menu_home_mobiles--products--ul{
        list-style: none;
        border-left: 2px solid #2c303f;
        display: flex;
        flex-direction: column;
        gap: 0.7rem;
        width: 40vw;
    }

    .menu_home_mobiles--products--title2{
        text-decoration-color: #378BA4;
        color: #2c303f;
        font-weight: 600;
    }


    /***********************************/
    /************ PRODUCTOS ************/
    /***********************************/

    .sidebar_product_page {
        width: 100%;
        padding: 25px 10px;
    }

    .menu_product_page {
        flex-direction: row;
        gap: 10px;
    }

    .menu-item_product_page{
        font-size: 16px;
    }

    .title_product_page{
        padding: 115px 30px 0px;
        font-size: 1.5rem;
    }

    .content-section_product_page {
        margin-left: 20px;
        padding-right: 40px;
    }

    .footer{
        margin-top: 150px;
    }

    .imagen_ciencia_product_page2{
        width: 90%;
    }

    .imagen_ciencia_product_page{
        width: 60%;
    }

    .imagen_ciencia_product_page3{
        width: 90%;
    }

    .btn{
        width: 80%;
        height: 130px;
    }

    .slider-container_evurb--valencia {
        height: 400px;
    }

    .arrow_inside_evurb--valencia{
        width: 15px;
    }

    .slide-content_evurb--img{
        width: 40%;
    }

    .slide-content_evurb--year1, .slide-content_evurb--year2{
        font-size: 1rem;
    }

    .slide-content_evurb--valencia {
        width: 75%;
    }
    
    .content_3img{
        flex-direction: column;
        width: 80%;
        margin-right: auto;
        margin-left: auto;
    }

    .content_3img--img{
        width: 250px;
    }

    .img_contaminacion--container--img{
        width: 60%;
    }

    .img_contaminacion--container--img2{
        width: 40%;
    }

    .img--gif_incendio{
        width: 55%;
    }

    .banner_quem--column{
        display: flex;
        align-items: center;
    }

    .banner_quem--img_legend{
        width: 100%;
    }

    .banner_quem--inside{
       gap: 5px;
       /* flex-direction: row; */
    }

    .banner_quem--group{
        gap: 20px;
        flex-direction: column;
     }

    .img_evolincendios--img{
        width: 70%;
    }

    .img_evolincendios--leyenda{
        width: 13%;
    }

    .img_evolincendios--leyenda2{
        width: 25%;
    }

    .img_sequias{
        width: 60%;
    }

    .img_heladas{
        width: 70%;
    }

    .content_6img{
        flex-wrap: wrap;
    }

    .content_6img--img{
        width: 95px;
        height: 30vh;
    }

    .content_6img--inside{
        padding: 10px 10px;
    }

    .img_clima--container_img{
        width: 90%;
    }

    .img_calidad--container_inside{
        width: 60%;
    }

    .img_calidad--container_inside--leyenda{
        width: 30%;
    }

    .subtitle{
        padding: 20px 0px 10px;
    }

    .arrow_inside_banner_info{
        width: 120%;
    }

    .team_img{
        width: 35%;
    }

    .team_img2{
        width: 15%;
    }

    .team_foto_texto2{
        gap: 1em;
        flex-direction: column;
    }

    .team_titletext, .team_foto_texto1{
        padding-bottom: 20px;
    }

    .about_team{
        height: 100vh;
    }

    .footer_map{
        padding-bottom: 0;
        font-size: 12px;
    }

    .container_text{
        padding-bottom: 0;
    }

    .seccion_icon{
        width: 15%;
    }

    .info_icon{
        width: 12%;
    }
    
    .contenido-popup {
        margin: 25vh auto;
        padding: 25px;
    }

    .close_icon{
        width: 5%;
    }

    .contenido-popup--inside_table, .contenido-popup--inside_ecuation{
        width: 80%;
    }

    .columna-1, .columna-1-5 {
        width: 100%;
    }

    #contenedor-principal {
        padding: 10px;
        width: 95%;
    }

    .about_paragraph--mobile, .about_paragraph--mobile_title, .about_paragraph--mobile_text{
        display: block;
    }

    .about_paragraph--mobile_title{
        padding-top: 50px;
        text-align: center;
        padding-bottom: 15px;
        text-transform: uppercase;
        color: #ED413E;
        font-weight: 600;
        font-size: 18px;
    }

    .about_paragraph--mobile_text{
        line-height: 1.3;
        font-size: 13px;
        border-radius: 3%;
        background-color: #ED413E70;
        padding: 20px;
        font-weight: 600;
        box-shadow: 0px 0px 15px 3px #001A49;
        color: #272525;
    }

    .espacio_mobile{
        padding-top: 30px;
    }

    /***********************************/
    /***********************************/
    /***********************************/


    


    
   
}