/*Textos*/

:root{
    /*Fuentes*/
    --fw-700-bold: 700;
    --fw-600-semiBold: 600;
    --fw-500-medium: 500;
    --fw-400-regular: 400;
    --chip-fourth-font: Montserrat;
    --mapButton-fourth-select-h1-font: Montserrat;
    --mapButton-fourth-hover-label-font: Montserrat;
    --font-montserrat: Montserrat;
    --button-fourth-text: Montserrat;
    --button-first-primary-text: Montserrat;
    --button-fourth-text: Montserrat;
/*--------------------------------------------------------------------*/
    /*Colores*/
    --first-primary-color:#6c9c42;
    --first-secondary-color:#3B6150;
    --third-primary-color:#3E8500;
    --third-secondary-color:#1E543C;
    --third-tertiary-color:#FFF2BE;
    --fourth-primary-color:#ffeca1;
    --fourth-secondary-color:#fff;
    --fifth-primary-color:#1D543D;
    --fifth-secondary-color:#D9EBC5;
/*--------------------------------------------------------------------*/
    /*Botones*/
    /*Libreria 1*/
    --button-first-primary-default-background: #6c9c42;
    --button-first-primary-default-fontColor: #fff;
    --button-first-small-width: 90px;
    --button-first-small-height: 33px;
    --button-first-medium-width: 114px;
    --button-first-medium-height: 40px;
    --button-first-large-width: 145px;
    --button-first-large-height: 48px;
    --button-first-padding-x:12px;
    --button-first-padding-y:11.5px;
    --button-first-primary-fontSize: 14px;
    --button-first-primary-default-fontColor: #fff;
    --button-first-borderRadius:24px;
    --button-first-primary-text: Montserrat;
    --button-first-primary-select-background: #fff;
    --button-first-primary-select-borderColor: #598136;
    --button-first-primary-select-fontColor: #598136;
    --button-first-primary-hover-background: #5d843a;
    --button-first-secondary-default-background: #3B6150;
    --button-first-secondary-select-fontColor: #153829;
    --button-first-secondary-hover-background: #153829;
    --button-first-plain-default-background: #fff;
    --button-first-plain-default-fontColor: #3B6150;
    --button-first-plain-hover-background: #DBE6CF;
    --button-first-plain-select-background: #DBE6CF;
     /*Libreria 3*/
    --button-third-medium-width: 114px;
    --button-third-medium-height: 40px;
    --button-third-small-width: 90px;
    --button-third-small-height: 33px;
    --button-third-large-width: 145px;
    --button-third-large-height: 48px;
    --button-third-padding-x:12px;
    --button-third-padding-y:10.5px;
    --button-third-primary-default-fontSize: 14px;
    --button-third-primary-default-fontColor: #fff;
    --button-third-primary-hover-fontSize: 14px;
    --button-third-primary-hover-fontColor: #fff;
    --button-third-primary-default-background:#3E8500;
    --button-third-primary-hover-background:#446627;
    --button-third-primary-select-background: #fff;
    --button-third-primary-select-borderColor: #446627;
    --button-third-primary-select-fontColor:#446627;
    --button-third-primary-select-fontSize: 14px;
    --button-third-secondary-default-background: #1E543C;
    --button-third-secondary-default-fontSize:14px;
    --button-third-secondary-hover-background:#153829;
    --button-third-secondary-default-fontColor: #fff;
    --button-third-secondary-hover-fontSize: 14px;
    --button-third-secondary-hover-fontColor: #fff;
    --button-third-secondary-select-fontColor:#fff;
    --button-third-secondary-select-fontSize: 14px;
    --button-third-tertiary-default-fontColor:#1E543C;
    --button-third-tertiary-default-fontSize: 14px;
    --button-third-tertiary-hover-fontSize: 14px;
    --button-third-tertiary-hover-fontColor: #1E543C;
    --button-third-tertiary-select-fontColor:#1E543C;
    --button-third-tertiary-select-fontSize: 14px;
    --button-third-tertiary-select-borderColor:#1E543C;
    --button-third-tertiary-default-background:#FFF2BE;
    --button-third-tertiary-default-fontColor:#1E543C;
    --button-third-tertiary-hover-background:#FFE681;
    --button-third-tertiary-select-background:#FFF2BE;
    /*Libreria 4*/
    --layers-btn-height: 50px;
    --layers-btn-width: 108px;
    --button-fourth-small-width: 90px;
    --button-fourth-small-height: 33px;
    --button-fourth-medium-width: 114px;
    --button-fourth-medium-height: 40px;
    --button-fourth-large-width: 145px;
    --button-fourth-large-height: 48px;
    --button-fourth-text-size: 14px;
    --button-fourth-borderRadius:24px;
    --button-fourth-padding-x:16px;
    --button-fourth-padding-y:11.5px;
    --button-fourth-primary-default-background: #ffeca1;
    --button-fourth-primary-default-fontColor: #0b3924;
    --button-fourth-primary-hover-background: #ffe580;
    --button-fourth-primary-hover-fontColor: #0b3924;
    --button-fourth-primary-select-background: #3b6150;
    --button-fourth-primary-select-fontColor: #FFF;
    --button-fourth-secondary-default-background: #fff;
    --button-fourth-secondary-default-borderColor: #84998f;
    --button-fourth-secondary-default-fontColor: #285741;
    --button-fourth-secondary-hover-background: #b8ccc3;    
    --button-fourth-secondary-hover-borderColor: #0b3924;
    --button-fourth-secondary-select-background: #c5dbd1;
    --button-fourth-secondary-select-borderColor: #0b3924;
    --button-fourth-secondary-default-fontColor: #285741;
    --button-fourth-plain-hover--background: #FFF;
    --button-fourth-secondary-default-layers-width: 108px;
    --button-fourth-secondary-default-layers-height: 50px;
    --button-fourth-secondary-hover-background: #b8ccc3;    
    --button-fourth-secondary-hover-borderColor: #0b3924;
    --button-fourth-text-size: 14px;
    --button-fourth-secondary-select-background: #c5dbd1;
    --button-fourth-secondary-select-borderColor: #0b3924;
    /*Librería 5*/
    --button-fifth-primary-default-background:#1D543D;
    --button-fifth-extraSmall-width:57px;
    --button-fifth-small-height:40px;
    --button-fifth-small-width: 90px;
    --button-fifth-extraSmall-height: 33px;
    --button-fifth-medium-width: 114px;
    --button-fifth-medium-height: 40px;
    --button-fifth-large-width: 145px;
    --button-fifth-large-height: 48px;
    --button-fifth-borderRadius: 20px;
    --button-fourth-padding-x:17.5px;
    --button-fourth-padding-y:11.5px;
    --button-fifth-primary-default-fontColor:#fff;
    --button-fifth-fontSize:14px;
    --button-fifth-primary-hoverSelect-background:#153829;
    --button-fifth-secondary-default-fontColor:#153829;
    --button-fifth-secondary-default-background:#D9EBC5;
    --button-fifth-secondary-default-borderColor:#587728;
    --button-fifth-secondary-hover-background: #B1D18C;
    /*Otros componentes*/  
    --checkBox-first-default-background: #fff;
    --checkBox-first-default-borderColor: #2f473c;
    --checkBox-first-select-borderColor: #6C9C42;
    --checkBox-first-select-background: #6C9C42;
    --checkBox-first-select-check:#fff;
/*--------------------------------------------------------------------*/
    --checkBox-third-default-background:#fff;
    --checkBox-third-default-borderColor: #1E543C;
    --checkBox-third-select-borderColor:#6C9C42;
    --checkBox-third-select-background:#6C9C42;
    --checkBox-third-select-check:#fff;
    --checkBox-third-default-width:22px;
    --checkBox-third-default-height:22px;
    --checkBox-third-default-borderWidth:2px;
/*--------------------------------------------------------------------*/
    --checkBox-fourth-primary-default-background: #fff;
    --checkBox-fourth-primary-default-borderColor: #2f473c;
    --checkBox-fourth-primary-select-background: #2f473c;
    --checkBox-fourth-primary-select-check: #FFF;
    --checkBox-fourth-width:22px;
    --checkBox-fourth-height:22px;
    --checkBox-fourth-borderRadius:6px;
/*--------------------------------------------------------------------*/
    --checkBox-fifth-width:24px;
    --checkBox-fifth-height:24px;
    --checkBox-borderRadius: 6px;
    --checkBox-fifth-default-borderColor: #1E543D;
    --checkBox-fifth-default-background:#fff;
    --checkBox-fifth-select-check:#fff;
    --checkBox-fifth-select-background:#153829;
    --checkBox-fifth-select-borderColor:#153829;
/*--------------------------------------------------------------------*/
    --radioButton-first-default-background: #fff;
    --radioButton-first-default-borderColor:   #2f473c;
    --radioButton-first-select-borderColor: #6C9C42;
    --radioButton-first-select-background: #FFF;
    --radioButton-first-select-check: #6C9C42;
/*--------------------------------------------------------------------*/
    --radioButton-second-default-background: #fff;
    --radioButton-second-default-borderColor:   #6C9C42;
    --radioButton-second-select-borderColor: #6C9C42;
    --radioButton-second-select-background: #FFF;
    --radioButton-second-select-check: #6C9C42;
/*--------------------------------------------------------------------*/
    --radioButton-third-default-background: #fff;
    --radioButton-third-default-borderColor:   #1E543C;
    --radioButton-third-select-borderColor: #6C9C42;
    --radioButton-third-select-background: #FFF;
    --radioButton-third-select-check: #6C9C42;
    --radioButton-borderRadius:50%;
    --radioButton-third-default-width:22px;
    --radioButton-third-default-height:22px;
    --radioButton-third-default-borderWidth:2px;
    --radioButton-third-select-check-width:10px;
    --radioButton-third-select-check-height:10px;
/*--------------------------------------------------------------------*/
    --radioButton-fifth-width:24px;
    --radioButton-fifth-height:24px;
    --radioButton-fifth-default-background:#fff;
    --radioButton-fifth-default-borderColor:#1E543D;
    --radioButton-fifth-select-background:#fff;
    --radioButton-fifth-select-borderColor:#153829;
    --radioButton-fifth-select-check:#153829;
    --radioButton-fifth-select-check-width:12px;
    --radioButton-fifth-select-check-height:12px;
/*--------------------------------------------------------------------*/
    --switch-first-default-borderColor:#6C9C42;
    --switch-first-default-backgroundColor:#FFF;
    --switch-first-select-handleColor: #6C9C42;
    --switch-first-select-backgroundColor: #6C9C42;
/*--------------------------------------------------------------------*/
    --icon-button-first-default-backgroundColor: #fff;
    --icon-button-first-default-borderColor: #2F473C;
    --icon-button-first-active-backgroundColor:#fff;
    --icon-button-first-active-borderColor: #2F473C;
    --icon-button-first-icon-fill: #2F473C;
/*--------------------------------------------------------------------*/
    --icon-button-second-icon-fill:#476658;
    --icon-button-second-default-backgroundColor: #fff;
    --icon-button-second-default-borderColor: #476658;
/*--------------------------------------------------------------------*/
    --icon-button-third-default-borderColor: #2F473C;
    --icon-button-third-default-backgroundColor:#fff;
    --icon-button-third-width:20px;
    --icon-button-third-height:20px;
    --icon-button-third-borderRadius:50%;
    --icon-button-third-icon-height:11px;
    --icon-button-third-default-icon-fill: #2F473C;
    --icon-button-third-active-icon-fill:#fff;
    --icon-button-third-active-backgroundColor:#2F473C;
    --icon-button-third-active-borderColor:#2F473C;
 /*--------------------------------------------------------------------*/  
    --icon-button-fourth-default-backgroundColor: #fff;
    --icon-button-fourth-default-borderColor: #476658;
    --icon-button-fourth-hover-backgroundColor: #b8ccc3;
    --icon-button-fourth-hover-borderColor: #476658;
    --icon-button-fourth-active-backgroundColor: #b8ccc3;
    --icon-button-fourth-active-borderColor: #476658;
    --icon-button-fourth-width:20px;
    --icon-button-fourth-height:20px;
    --icon-button-fourth-borderRadius:30px;
    --icon-button-fourth-padding:0px;
    --icon-button-fourth-icon-fill: #476658;
    --icon-button-fourth-icon-height:12px;
    --card-fourth-icon-button-icon-fill: #2B4A3C;
 /*--------------------------------------------------------------------*/   
    --icon-button-fifth-width:18px;
    --icon-button-fifth-height:18px;
    --icon-button-fifth-default-background:transparent;
    --icon-button-fifth-default-borderColor:#405C50;
    --icon-button-fifth-borderRadius:50%;
    --icon-button-fifth-select-background:transparent;
    --icon-button-fifth-select-borderColor:#1E543D;
    --icon-button-fifth-icon-default-fill:#405C50;
    --icon-button-fifth-icon-select-fill:#1E543D;
/*--------------------------------------------------------------------*/    
    --add-button-third-default-backgroundColor:#3E8500;
    --add-button-third-default-icon-fill:#fff;
    --add-button-third-active-backgroundColor:#fff;
    --add-button-third-active-borderColor:#446627;
    --add-button-third-active-icon-fill:#446627;
    --add-button-third-width:35px;
    --add-button-third-height:35px;
    --add-button-third-borderRadius:50%;
    --inputItem-fourth-default-iconColor: #2F473C;
    --input-fourth-default-fontColor: #537063;
/*--------------------------------------------------------------------*/
    --saveButton-fourth-default-icon-backgroundColor: #fff;
    --saveButton-fourth-default-borderColor: #476658;
    --saveButton-fourth-hover-backgroundColor: #b8ccc3;
    --saveButton-fourth-hover-borderColor: #476658;
    --saveButton-fourth-active-backgroundColor: #fff;
    --saveButton-fourth-active-borderColor: #476658;
    --saveButton-fourth-default-icon-backgroundColor: #fff;
    --saveButton-fourth-default-borderColor: #476658;
    --saveButton-fourth-default-icon-borderColor: #476658;
    --saveButton-fourth-default-icon-fill: #fff;
    --saveButton-fourth-hover-icon-borderColor: #476658;
    --saveButton-fourth-hover-icon-fill: #476658;
    --saveButton-fourth-hover-icon-borderColor: #476658;
    --saveButton-fourth-hover-icon-fill: #476658;
    --saveButton-fourth-width:27px;
    --saveButton-fourth-height:27px;
    --saveButton-fourth-borderRadius:30px;
    --saveButton-fourth-padding:0px;
/*--------------------------------------------------------------------*/
    --saveButton-fifth-default-background:#fff;
    --saveButton-fifth-default-borderColor:#405C50;
    --saveButton-fifth-width:27px;
    --saveButton-fifth-height:27px;
    --saveButton-fifth-borderRadius:50%;
    --saveButton-fifth-select-borderColor:#405C50;
    --saveButton-fifth-default-icon-borderColor:#405C50;
    --saveButton-fifth-default-icon-fill:#fff;
    --saveButton-fifth-select-icon-borderColor:#1E543D;
    --saveButton-fifth-select-icon-fill:#1E543D;
/*--------------------------------------------------------------------*/
    --chip-fourth-select-background: #ebf7f1;
    --chip-fourth-default-background: #fff;
    --chip-fourth-default-borderColor: #c8d9d1;
    --chip-fourth-fontColor: #3f5f51;
    --chip-fourth-font-size: 13px;
    --chip-fourth-borderRadius:24px;
    --chip-fourth-height:32px;
    --chip-fourth-padding:8px 10px;
/*--------------------------------------------------------------------*/
    --scrollBar-third-backgroundColor:rgba(108, 156, 66, 0.38);
    --scrollBar-third-handle:#fff;
/*--------------------------------------------------------------------*/
    --scrollBar-fourth-backgroundColor: rgba(30, 84, 60, 0.2);
    --scrollBar-fourth-handle-background: #1e543c;
    --scrollBar-fourth-handle-height:30px;
    --scrollBar-fourth-handle-borderRadius:20px;
    --scrollBar-fourth-large-width:240px;
    --scrollBar-fourth-extraLarge-width:480px;
    --scrollBar-fourth-handle: #1e543c;
    --scroll-bar-fourth-width:9px;
    --scroll-bar-fourth-background-width:9px;
    --scroll-bar-fourth-background-borderRadius:6px;
/*--------------------------------------------------------------------*/
    --scrollBar-fifth-background:#E5EDDF;
    --scrollBar-fifth-handle:#153829;
    --scrollBar-fifth-background-width:9px;
    --scrollBar-fifth-handle-width:9px;
    --scrollBar-fifth-handle-borderRadius:20px;
    --scrollBar-fifth-background-borderRadius:6px;
/*--------------------------------------------------------------------*/
    --slider-first-default-handle-background: #fff;
    --slider-first-default-handle-borderColor: #6c9c42;
    --slider-first-default-range-background: #6c9c42;
/*--------------------------------------------------------------------*/
    --slider-fifth-default-background-height:6px;
    --slider-fifth-borderRadius:6px;
    --slider-fifth-default-handle-borderColor:#477B64;
    --slider-fifth-default-handle-background:#fff;
    --slider-fifth-default-handle-width:14px;
    --slider-fifth-default-handle-height:14px;
    --progress: 50%;
/*--------------------------------------------------------------------*/
    --spinner-fourth-background: #1e543c33;
    --spinner-fourth-front: #3b6150;
    --spinner-fourth-lg-widthHeight:100px;
    --spinner-fourth-md-widthHeight: 50px;
    --spinner-fourth-sm-widthHeight: 25px;
 /*--------------------------------------------------------------------*/   
    /*Botones de mapa*/
    /*Libreria 1*/
    --mapButton-first-hoverSelect-icon-color: #fff;
    --mapButton-first-default-icon-color:#1E543C;
    --mapButton-first-icon-width: 22px;
    --mapButton-first-icon-height: 21px;
    --mapButton-first-width: 59px;
    --mapButton-first-height: 55px;
    --mapButton-first-hover-background:#1e543c99;
    --mapButton-first-borderRadius: 24px;
    --mapButton-first-hover-label-background: #fff;
    --mapButton-first-hover-label-width: max-content;
    --mapButton-first-hover-label-height: 20px;
    --mapButton-first-hover-label-fontSize:16px;
    --mapButton-first-hover-label-fontColor: #1e543c;
    --mapButton-first-select-h1-fontSize: 20px;
    --mapButton-first-select-h1-fontColor: #213d31;
    --mapButton-first-select-label-subContainer-background: #ffffff8c;
    --mapButton-first-select-label-container-background: linear-gradient(170.18deg, rgba(255, 255, 255, 0.55) 19.5%, rgba(255, 255, 255, 0.2));
    --mapButton-first-select-label-container-borderColor: #fff;
    --mapButton-first-select-h1-font: Montserrat;
    --mapButton-first-select-label-body-fontSize: 15px;
    --mapButton-first-select-label-body-fontColor:#3A4D44;
    --mapButton-first-select-icon-fill: #213d31;
    --mapButton-first-default-background: #fff;
    --mapButton-first-select-background:rgba(30, 84, 60, 0.88);
    --zoomMapBtn-first-borderColor:rgba(255, 255, 255, 0.6);

    /*Libreria 2*/
    --mapButton-second-defaultHoverSelect-icon-color: #FFF;
    --mapButton-second-default-background:  rgba(30, 84, 60, 0.8);
    --mapButton-second-hover-background:rgba(30, 84, 60, 0.8);
    --mapButton-second-select-background:#1E543C;
    --mapButton-second-select-label-background: rgba(255, 236, 161, 0.65);
    --mapButton-second-label-select-h1-fontColor:#005831;
    --mapButton-second-label-select-body-fontColor:#005831;
    --zoomPlus-map-btn-second-borderColor:#fff;
    /*Librería 3*/
    --mapButton-third-width:59px;
    --mapButton-third-height: 55px;
    --mapButton-third-borderRadius:30px;
    --mapButton-third-defaultHover-background:#274638;
    --mapButton-third-default-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25), 4px 4px 6px rgba(99, 96, 96, 0.25);
    --mapButton-third-hover-label-background:#FFF;
    --mapButton-third-hover-label-fontSize:16px;
    --mapButton-third-hover-label-fontColor:#274638;
    --mapButton-third-select-background:#fff;
    --mapButton-third-select-icon-fill:#274638;
    --mapButton-third-defaultHover-icon-color:#fff;
    --mapButton-third-select-label-background:linear-gradient(233.85deg, #274638 48.5%, #466054);
    --mapButton-third-select-h1-fontSize:20px;
    --mapButton-third-select-h1-fontColor:#fff;
    --mapButton-third-select-label-body-fontColor:#2F473C;
    --mapButton-third-select-label-body-fontSize:15px;
    --mapButton-third-hover-label-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25), 4px 4px 6px rgba(99, 96, 96, 0.25);
    --mapButton-third-select-label-borderRadius:24px 0px 0px 24px;
    --mapButton-third-select-label-padding:16px 20px;
    --mapButton-third-bLayers-label-select-borderRadius:0px 24px 24px 0px;
    --mapButton-third-bLayers-label-select-padding:17.5px 20px;
    --mapButton-third-select-label-logoContainer-shadow:-4px -4px 10px rgba(255, 255, 255, 0.2), 4px 4px 10px rgba(255, 255, 255, 0.2);
    --mapButton-third-select-label-logoContainer-padding:14px 16px;
    --mapButton-third-select-label-logoContainer-borderRadius:24px;
    --mapButton-third-select-label-logoContainer-width:222px;
    --mapButton-third-select-label-logoContainer-background:#fff;
    --mapButton-third-hover-label-triangle-borderColor:transparent white transparent transparent;
    --mapButton-third-hover-label-triangle-left-borderWidth:10.5px 0 10.5px 35px;
    --mapButton-third-hover-label-triangle-left-borderColor:transparent transparent transparent white;
    --mapButton-third-hover-label-padding:17px 20px;
    --mapButton-third-hover-label-borderRadius:24px;
    --mapButton-third-hover-label-triangle-borderWidth:10.5px 35px 10.5px 0;
    --mapButton-third-hover-label-triangle-borderWidth:10.5px 35px 10.5px 0;
    --mapButton-third-hover-label-triangle-borderColor:transparent white transparent transparent;
    /*Libreria 4*/
    --button-shadow-2: -4px -4px 10px rgba(255, 255, 255, 0.2), 4px 4px 10px rgba(255, 255, 255, 0.2);
    --mapButton-fourth-width: 55px;
    --mapButton-fourth-height: 51px;
    --mapButton-fourth-borderRadius: 24px;
    --mapButton-fourth-default-background: #fff;
    --mapButton-fourth-hoverSelect-background: #ffeca1;
    --mapButton-fourth-icon-width: 20.5px;
    --mapButton-fourth-icon-height: 20.5px;
    --mapButton-fourth-icon-fill: #1E543C;
    --mapButton-fourth-hover-label-padding: 15.5px 20px;
    --mapButton-fourth-hover-label-fontColor: #0b3924;
    --mapButton-fourth-hover-label-fontSize: 16px;
    --mapButton-fourth-hover-label-background: #fff;
    --mapButton-fourth-select-body-fontSize: 15px;
    --mapButton-fourth-select-body-fontColor: #0b3924;
    --mapButton-fourth-select-h1-fontSize: 20px;
    --mapButton-fourth-select-h1-fontColor: #0b3924;
    --mapButton-fourth-select-h1-font: Montserrat;
    --mapButton-fourth-select-label-layersBtn-background:#fff;
    --mapButton-fourth-select-label-layersBtn-margin:-16px  0px 0px 30px;
    --mapButton-fourth-select-label-layersBtn-padding:16px;
    --mapBtn-fourth-select-label-layersBtn-title-fontColor:#2B4A3C;
    --mapBtn-fourth-select-label-layersBtn-title-fontSize:20px;
    --card-fourth-background:#fff;
    --card-fourth-padding:16px;
    --card-fourth-borderRadius:24px;
    --card-fourth-h2-fontSize: 16px;
    --card-fourth-h2-fontColor:#355C4B;
    --card-fourth-body-fontColor: #2F473C;
    --card-fourth-body-fontSize: 14px;
    --card-fourth-body-fontColor: #2F473C;
    --card-fourth-body-fontSize: 14px;
    --card-fourth-maxWidth-img:367px;
    --card-fourth-img-borderRadius:24px;
    --card-fourth-img-margin:10px 0px 14px 0px;
    --card-fourth-secondary-maxWidth-img:507px;
    --card-fourth-secondary-img-borderRadius:20px;
    --card-fourth-h2-margin:0px 0px 8px 0px;
    --card-fourth-body-margin:0px 0px 5px 0px;
    --card-fourth-arrowBtn-tittle-gap:14px;
    --card-fourth-iconText-container-background: rgba(219, 237, 229, 0.32);
    --card-fourth-iconText-container-padding:10px 16px;
    --card-fourth-iconText-container-gap:40px;
    --card-fourth-iconText-container-borderRadius: 20px;
    --card-fourth-iconText-container-maxWidth:475px;
    --card-fourth-input-button-container-margin:10px 14px 4px 0px;
    --card-fourth-input-button-container-gap:12px;
    --card-fourth-input-button-container-height:60px;
    --card-fourth-input-button-container-maxWidth:331px;
    --inputList-item-container-fourth-borderRadius:24px;
    --inputList-item-container-fourth-maxWidth:356px;
    --inputList-item-container-fourth-heigh:54px;
    --inputList-item-container-fourth-margin:0px;
    --inputList-item-container-fourth-padding:10px 16px;
    --div-inputList-fifth-margin:14px 0px 0px 0px;
    --div-inputList-fifth-borderRadius:18px;
    --div-inputList-fifth-gap:8px;
    --inputList-fifth-item-background:#fff;
    --inputList-fifth-item-minWidth:326px;
    --inputList-fifth-item-padding:6px 12px;
    --inputList-fifth-item-borderRadius:24px;
    --i-layers-fifth-inputItem-icon-color:#405C50;
    
    --button-fourth-secondary-plain-small-width:70px;
    --button-fourth-secondary-plain-small-height:29px;
    --card-fourth-body-iconColor: #2F473C;
    --mapButton-fourth-width: 55px;
    --mapButton-fourth-height: 51px;
    --mapButton-fourth-borderRadius: 24px;
    --button-shadow-2: -4px -4px 10px rgba(255, 255, 255, 0.2), 4px 4px 10px rgba(255, 255, 255, 0.2);
    --mapButton-fourth-default-background: #fff;
    --mapButton-fourth-hover-info-background: #fff;
    --input-fourth-default-fontColor: #537063;
    --input-fourth-label-fontColor:#0B3924;
    --input-default-background: #fff;
    --input-fourth-default-borderColor: #a5b7af;
    --input-fourth-default-fontSize: 14px;
    --zoomPlus-button-default-borderRadius:24px 24px 0px 0px;
    --zoomPlus-button-fourth-borderColor: #2b4a3c;
    --zoomMinus-button-fourth-borderColor:  #2b4a3c;
    --zoomMinus-button-default-borderRadius: 0px 0px 24px 24px;
    --mapButton-fourth-hover-info-background: #fff;
    --mapButton-fourth-hover-info-font-color: #0b3924 !important;
    --mapButton-fourth-hover-info-font-size: 16px;
    --mapButton-fourth-hover-info-background: #fff;
    --button-fourth-secondary-hover-background: #b8ccc3;
    --button-fourth-secondary-hover-fontColor: #0b3924;
    --button-fourth-secondary-hover-borderColor: #0b3924;
    --button-fourth-secondary-select-background: #c5dbd1;
    --button-fourth-secondary-select-borderColor: #0b3924;
    --button-fourth-secondary-select-fontColor: #0b3924;
    /*Librería 5*/
    --mapButton-fifth-width:59px;
    --mapButton-fifth-height:55px;
    --mapButton-fifth-borderRadius:20px;
    --mapButton-fifth-default-background:#1E543D;
    --mapButton-fifth-icon-fill:#fff;
    --mapButton-fifth-hover-background:#1E543D;
    --mapButton-fifth-select-background:#153829;
    --mapButton-fifth-hover-label-background:#fff;
    --mapButton-fifth-hover-label-fontColor:#153829;
    --mapButton-fifth-hover-label-fontSize:14px;
    --mapButton-fifth-hover-label-padding:12px;
    --mapButton-fifth-hover-label-borderRadius:16px;
    --mapButton-fifth-select-label-background:#f9f8f891;
    --mapButton-fifth-select-label-subContainer-background:#FFF5CD;
    --mapButton-fifth-select-label-h1-fontSize: 20px;
    --mapButton-fifth-select-label-h1-fontColor: #153829;
    --mapButton-fifth-select-body-fontColor:#466154;
    --mapButton-fifth-select-body-fontSize:15px;
    --mapButton-fifth-container-background:rgba(249, 248, 248, 0.57);
    --zoomPlus-map-btn-fifth-borderRadius:20px 20px 0px 0px;
    --zoomMinus-map-btn-fifth-borderRadius:0px 0px 20px 20px;
    --mapButton-container-fifth-width:83px;
    --mapButton-container-fifth-height:79px;
    /*Acordeones*/
    --accordion-fourth-h1-fontSize: 17px;
    --accordion-fourth-h1-fontColor: #2b4a3c;
    --accordion-fourth-icon-fill: #2b4a3c ;
    --accordion-fourth-background: #adc7bba6;
    --accordion-fourth-borderColor: rgba(255, 255, 255, 0.6);
    --accordion-fourth-title-size: 14px;
    --accordion-fourth-background: rgba(173, 199, 187, 0.65);
    --accordion-fourth-borderColor: rgba(255, 255, 255, 0.6);
    --accordion-fourth-label-large-maxWidth:412px;
    --accordion-fourth-label-medium-maxWidth:312px;
    --accordion-fourth-label-small-maxWidth:270px;
    --accordion-fourth-padding:14.5px 20px;
    --accordion-fourth-borderRadius:24px;
    --accordion-fourth-large-maxWidth:452px;
    --accordion-fourth-medium-maxWidth:352px;
    --accordion-fourth-small-maxWidth:300px;
    --accordion-fourth-content-borderRadius:0px 0px 24px 24px;
    --accordion-fourth-content-padding:0px;
    --accordion-fourth-content-borderRadius:0px;
    --accordion-fourth-content-gap:12px;
    --accordion-fourth-content-chipsBtn-container-width:372px;
    --accordion-fourth-content-chipsBtn-container-padding:10px 16px 12px 16px;
/*--------------------------------------------------------------------*/   
    --accordion-first-background: rgba(255, 255, 255, 0.55);
    --accordion-first-borderColor: #fff;
    --accordion-first-h1-fontSize: 17px;
    --accordion-first-h1-fontColor:#223d31;
    --accordion-first-medium-width:356px;
    --accordion-first-medium-height:21px;
    --accordion-first-padding:12px 16px;
    --accordion-first-borderRadius:24px;
    --accordion-first-medium-content-width:386px;
    --accordion-first-medium-content-padding:0;
    --accordion-first-medium-content-borderRadius:0px 0px 24px 24px;
/*--------------------------------------------------------------------*/   
    --accordion-second-large-width: 426px;
    --accordion-second-small-width: 226px;
    --accordion-second-background:rgba(255, 236, 161, 0.65);
    --accordion-second-h1-fontColor: #005831;
    --accordion-second-iconColor:#005831;
    --accordion-second-padding:14.5px 20px;
    --accordion-second-content-large-width:466px;
    --accordion-second-content-medium-width:366px;
    --accordion-second-content-small-width:266px;
    --accordion-second-borderRadius:24px;
    --accordion-second-gap:12px;
    --inputItem-second-default-gap:10px;
    --button-shadow-2: -4px -4px 10px rgba(255, 255, 255, 0.2), 4px 4px 10px rgba(255, 255, 255, 0.2);
    --b-layers-button-fourth-background: #fff;
/*--------------------------------------------------------------------*/   
    --accordion-third-large-width:388px;
    --accordion-third-small-width:330px;
    --accordion-third-medium-width:360px;
    --accordion-third-medium-height:35px;
    --accordion-third-background: #fff;
    --accordion-third-h1-fontSize:14px;
    --accordion-third-borderRadius:24px;
    --accordion-third-content-borderRadius:0px 0px 24px 24px;
    --accordion-third-h1-fontColor:#2F473C;
    --accordion-third-padding:6px 14px;
    --accordion-third-body-fontColor:#405C4F;
    --accordion-third-body-fontSize:13px;
/*--------------------------------------------------------------------*/   
    /*Input Capas*/
    --inputItem-third-default-h1-fontColor:#2F473C;
    --inputItem-third-h1-fontSize:14px;
    --inputItem-third-default-icon-fill: #2F473C;
/*--------------------------------------------------------------------*/   
    --inputItem-fourth-default-background: #fff;
    --inputItem-fourth-default-fontColor: #2f473c;
    --inputItem-fourth-default-fontSize: 14px;
    --inputItem-fourth-select-legend-background: #fff;
    --inputItem-fourth-select-legend-title-fontColor: #2f473c;
    --inputItem-fourth-select-legend-title-fontSize: 14px;
    --inputItem-fourth-select-legend-body-fontColor: #405c4f;
    --inputItem-fourth-select-legend-body-fontSize: 13px;
    --inputItem-fourth-default-title:14px;
    --inputItem-fourth-large-maxWidth:378px;
    --inputItem-fourth-medium-maxWidth:300px;
    --inputItem-fourth-small-maxWidth:220px;
    --inputItem-fourth-padding:12px 16px;
    --inputItem-fourth-borderRadius:24px;
    --inputList-fourth-item-background: rgba(173, 199, 187, 0.65);
/*--------------------------------------------------------------------*/   
    --inputItem-first-background:#fff;
    --inputItem-first-borderColor:#fff;
    --inputItem-first-h1-fontSize: 16px;
    --inputItem-first-default-background:#fff;
    --inputItem-first-default-borderColor:#fff;
    --inputItem-first-default-icon-fill: #2f473c;
    --inputItem-first-default-h1-fontColor: #2f473c;
    --inputItem-first-hover-h1-fontColor: #fff;
    --inputItem-first-hover-background: rgba(30, 84, 60, 0.66);
    --inputItem-first-hover-icon-fill: #fff;
    --inputItem-first-select-legend-h1-fontColor:#2F473C;
    --inputItem-first-select-legend-h1-fontSize:14px;
    --inputItem-first-select-legend-body-fontSize:13px;
    --inputItem-first-select-legend-body-fontColor:#2F473C;
    --inputItem-first-shadow: -4px -4px 10px rgba(255, 255, 255, 0.2), 4px 4px 10px rgba(255, 255, 255, 0.2);
/*--------------------------------------------------------------------*/  
    --inputItem-second-default-background:#FFF;
    --inputItem-second-default-h1-fontColor: #2F473C;
    --inputItem-second-hover-background:#f2fae8;
    --inputItem-second-b-layers-padding: 13px 16px;
    --inputItem-second-infoLayers-padding: 16px;
    --inputItem-second-large-width: 394px;
    --inputItem-second-medium-width: 334px;
    --inputItem-second-small-width:294px;
    --inputItem-second-height: 21.5px;
    --inputItem-second-borderRadius: 24px;
    --inputItem-second-h1-fontSize: 16px;
    --inputItem-second-select-legend-h1-fontSize:14px;
    --inputItem-second-select-legend-h1-fontColor:#2F473C;
    --inputItem-second-select-legend-body-fontColor:#405C4F;
    --inputItem-second-select-legend-body-fontSize:13px;
 /*--------------------------------------------------------------------*/
    --inputItem-third-default-background:#fff;  
    --inputItem-third-default-icon-fill:#2F473C;
    --inputItem-third-hover-background:#FFF6D1;
    --inputItem-third-select-legend-h1-fontColor:#2F473C;
    --inputItem-third-select-legend-h1-fontSize:14px;
    --inputItem-third-select-legend-body-fontColor:#405C4F;
    --inputItem-third-select-legend-body-fontSize:13px;
    --inputItem-third-minHeight:21px;
    --inputItem-third-large-width:429px;
    --inputItem-third-medium-width:329px;
    --inputItem-third-small-width:290px;
    --inputItem-third-padding: 6px 14px;
    --inputItem-third-borderRadius:24px;
  /*--------------------------------------------------------------------*/     
    --inputItem-fifth-padding:8px 12px;
    --inputItem-fifth-default-background:#fff;
    --inputItem-fifth-maxHeight:21px;
    --inputItem-fifth-maxWidth:402px;
    --inputItem-fifth-borderRadius:24px;
    --inputItem-fifth-default-h1-fontColor:#405C50;
    --inputItem-fifth-h1-fontSize:16px;
    --i-layers-fifth-inputItem-chevron-icon-fill: #153829;
    --i-layers-fifth-inputItem-icon-fill:#405C50;
    --i-layers-fifth-inputItem-hidden-content-width:382px;
    --i-layers-fifth-inputItem-hidden-content-borderRadius:0px 0px 24px 24px;
    --i-layers-fifth-inputItem-hidden-content-padding:0px ;
    --i-layers-fifth-inputItem-hidden-content-margin:0px ;
    --i-layers-fifth-inputItem-hidden-content-gap:10px ;
    --i-layers-fifth-inputItem-legend-h1-fontSize:14px;
    --i-layers-fifth-inputItem-legend-h1-fontColor:#405C50;
    --i-layers-fifth-inputItem-legend-body-fontSize:13px;
    --i-layers-fifth-inputItem-legend-body-fontColor:#466154;
    --i-layers-first-inputItem-maxWidth:354px;
    --i-layers-first-inputItem-default-background:#fff;
    --i-layers-first-inputItem-hover-background:rgba(30, 84, 60, 0.66);
    --i-layers-first-inputItem-hover-h1-fontColor:#fff;
    --i-layers-first-inputItem-borderRadius:24px;
    --i-layers-first-inputItem-padding-y:12px;
    --i-layers-first-inputItem-padding-x:16px;
    --i-layers-first-inputItem-gap:10px;
    --b-layers-first-inputItem-padding-y:12px;
    --b-layers-first-inputItem-padding-x:16px;
    --b-layers-first-inputItem-default-background:#fff;
    --b-layers-first-inputItem-hover-background:#rgba(30, 84, 60, 0.66);
    --b-layers-first-inputItem-hover-h1-fontColor:#fff;
    --b-layers-first-inputItem-maxWidth:354px;
    --b-layers-first-inputItem-borderRadius:24px;
    --b-layers-button-third-large-maxWidth:196px;
    --b-layers-button-third-large-maxHeight:204px;
    --b-layers-button-third-medium-maxWidth:176px;
    --b-layers-button-third-medium-maxHeight:194px;
    --b-layers-button-third-small-maxWidth:156px;
    --b-layers-button-third-small-maxHeight:186px;
    --b-layers-button-third-padding:12px;
    --legendSquare-height:18px;
    --legendSquare-width:18px;
    --legendSquare-borderRadius:6px;
/*--------------------------------------------------------------------*/     
    /*dataContainer/DataPanel*/
    --dataPanel-first-background:#ffffff8c;
    --dataPanel-first-borderColor:#fff;
    --dataPanel-first-h1-fontColor:#223D31;
    --dataPanel-first-h1-fontSize:16px;
    --dataPanel-first-list-item-fontSize:14px;
    --dataPanel-first-list-item-background:#FFF;
    --dataPanel-first-list-item-fontColor:#2F473C;
    --dataPanel-first-padding: 16px 20px;
    --dataPanel-first-gap:16px;
    --dataPanel-first-borderRadius:24px;
    --dataPanel-first-maxWidth:444px;
    --dataPanel-first-list-item-maxWidth:395px;
    --dataPanel-first-list-item-borderRadius:24px;
    --dataPanel-first-list-item-padding:12px 16px;
/*--------------------------------------------------------------------*/   
    --dataContainer-fourth-container-background: #fff9e0;
    --dataContainer-fourth-h3-fontSize: 14px;
    --dataContainer-fourth-textContainer-mainH3: #2f473c;
    --dataContainer-fourth-textContainer-orangeH3: #da7829;
    --dataContainer-fourth-textContainer-greenH3: #577869;
    --dataContainer-fourth-maxWidth:475px;
    --dataContainer-fourth-borderRadius:24px;
    --dataContainer-fourth-padding:12px 18px;
    --dataContainer-fourth-gap:16px;
    --dataContainer-fourth-margin:16px 0px;
/*--------------------------------------------------------------------*/   
    --dataPanel-third-background:linear-gradient(233.85deg, #274638 48.5%, #466054);
    --dataPanel-third-shadow:0px 4px 4px rgba(0, 0, 0, 0.25), 4px 4px 6px rgba(99, 96, 96, 0.25);
    --dataPanel-third-large-maxWidth:427px;
    --dataPanel-third-medium-maxWidth:350px;
    --dataPanel-third-small-maxWidth:270px;
    --dataPanel-third-padding:16px 20px;
    --dataPanel-third-gap:16px;
    --dataPanel-third-borderRadius:24px;
    --dataPanel-third-h1-fontColor:#fff;
    --dataPanel-third-h1-fontSize:16px;
    --dataPanel-third-h1Icon-container-icon-fill:#fff;
    --dataPanel-third-list-item-fontSize:14px;
    --dataPanel-third-list-item-background:#FFF;
    --dataPanel-third-list-item-fontColor:#2F473C;
    --dataPanel-third-list-item-padding:12px 16px;
    --dataPanel-third-list-item-borderRadius:24px;
    --dataPanel-third-list-item-large-maxWidth:395px;
    --dataPanel-third-list-item-medium-maxWidth:318px;
    --dataPanel-third-list-item-small-maxWidth:238px;
/*--------------------------------------------------------------------*/   
    --dataPanel-second-background:#fff;
    --dataPanel-second-borderRadius:24px 0px 0px 24px;
    --dataPanel-second-padding: 16px 20px;
    --dataPanel-second-gap:16px;
    --dataPanel-second-maxWidth:358px;
    --dataPanel-second-minWidth:258px;
    --dataPanel-second-h1-fontColor:#005831;
    --dataPanel-second-h1-fontSize:16px;
    --dataPanel-second-subContainer-background:rgba(255, 236, 161, 0.77);
    --dataPanel-second-subContainer-item-fontColor:#2F473C;
    --dataPanel-second-subContainer-item-fontSize:14px;
    --dataPanel-second-subContainer-maxWidth:305px;
    --dataPanel-second-subContainer-borderRadius:24px;
    --dataPanel-second-subContainer-gap:12px;
    --dataPanel-second-subContainer-padding:12px 20px;
/*--------------------------------------------------------------------*/   
    --dataPanel-fifth-tabs-tableHead-color:#E5F5D5;
    --dataPanel-fifth-tabs-tableHead-borderColor:#C9D6BC;
    --dataPanel-fifth-tabs-tableHead-fontSize:14px;
    --dataPanel-fifth-tabs-tableHead-fontColor:#355C4B;
    --dataPanel-fifth-tabs-tableHead-width:162px;
    --dataPanel-fifth-tabs-tableHead-height:58px;
    --dataPanel-fifth-tabs-tableData-color:#fff;
    --dataPanel-fifth-tabs-tableData-borderColor:#DFE5D8;
    --dataPanel-fifth-tabs-tableData-fontSize:13px;
    --dataPanel-fifth-tabs-tableData-fontColor:#2F473C;
    --dataPanel-fifth-tabs-tableData-maxHeight:76px;
    --dataPanel-fifth-tabs-tableData-minHeight:60px;
    --dataPanel-fifth-container-background:#FFF5CD;
    --dataPanel-fifth-container-width:507px;
    --dataPanel-fifth-container-maxHeight:1030px;
    --dataPanel-fifth-container-padding:16px;
    --dataPanel-fifth-container-borderRadius:24px;
    --dataPanel-fifth-container-gap:12px;
    --dataPanel-fifth-container-borderColor:rgba(255, 255, 255, 0.6);
    --dataPanel-fifth-subContainer-background:#fff;
    --dataPanel-fifth-subContainer-borderRadius:20px;
    --dataPanel-fifth-subContainer-padding:14px;
    --dataPanel-fifth-subContainer-gap:8px;
    --dataPanel-fifth-subContainer-width:479px;
    --dataPanel-fifth-subContainer-content-width:468px;
    --dataPanel-fifth-title-fontColor: #2B4A3C;
    --dataPanel-fifth-title-fontSize: 20px;
    --dataPanel-fifth-image-width:461px;
    --dataPanel-fifth-image-borderRadius:20px;
    --dataPanel-fifth-iconText-container-background:#F8EFD6;
    --dataPanel-fifth-iconText-container-width:429px;
    --dataPanel-fifth-iconText-container-borderRadius:20px;
    --dataPanel-fifth-iconText-container-padding:10px 16px;
    --dataPanel-fifth-iconText-container-gap:40px;
    --dataPanel-fifth-iconText-container-fontSize: 14px;
    --dataPanel-fifth-iconText-container-fontColor:#2F473C;
    --dataPanel-fifth-iconText-container-icon-fill:#2B4A3C;
    --dataPanel-fifth-h2-fontSize:16px;
    --dataPanel-fifth-h2-fontColor:#1D543D;
    --dataPanel-fifth-buttons-container-maxWidth:461px;
    --dataPanel-fifth-buttons-container-margin:12px 0px 18px 0px;
    --dataPanel-fifth-dataContainer-background:#FFECA1;
    --dataPanel-fifth-dataContainer-padding:12px;
    --dataPanel-fifth-dataContainer-borderRadius:24px;
    --dataPanel-fifth-dataContainer-maxWidth:437px;
    --dataPanel-fifth-dataContainer-gap:10px;
    --dataPanel-fifth-dataContainer-margin:10px 0px;
    --dataPanel-fifth-dataContainer-subContainer-background: rgba(255, 255, 255, 0.8);
    --dataPanel-fifth-dataContainer-subContainer-maxWidth:123px;
    --dataPanel-fifth-dataContainer-subContainer-height:119px;
    --dataPanel-fifth-dataContainer-subContainer-padding:10px;
    --dataPanel-fifth-dataContainer-subContainer-gap:10px;
    --dataPanel-fifth-dataContainer-subContainer-borderRadius:20px;
    --dataPanel-fifth-dataContainer-subContainer-illustrationContainer-height:60px;
    --dataPanel-fifth-dataContainer-subContainer-illustrationContainer-width:60px;
    --dataPanel-fifth-dataContainer-mainH3-fontSize:14px;
    --dataPanel-fifth-dataContainer-mainH3-fontColor:#2F473C;
    --dataPanel-fifth-dataContainer-greenH3-fontSize:14px;
    --dataPanel-fifth-dataContainer-greenH3-fontColor:#268639;
    --dataPanel-fifth-dataContainer-greyH3-fontSize:14px;
    --dataPanel-fifth-dataContainer-greyH3-fontColor:#466154;
    --image-card-width:461px;
    --image-card-margin:10px 0px 14px 0px;
/*--------------------------------------------------------------------*/   
    --listCard-fifth-table-tableHead-maxWidth:232px;
    --listCard-fifth-tabs-table-width:461px;
    --listCard-fifth-background:rgba(249, 248, 248, 0.57);
    --listCard-fifth-table-tableHead-maxHeight:17px;
    --listCard-fifth-table-tableHead-fontSize:14px;
    --listCard-fifth-table-tableHead-background:#E5F5D5;
    --listCard-fifth-table-tableHead-borderColor:#C9D6BC;
    --listCard-fifth-table-tableHead-fontColor:#355C4B;
    --listCard-fifth-table-tableData-maxWidth:124px;
    --listCard-fifth-table-tableData-maxHeight:17px;
    --listCard-fifth-table-tableData-color:#fff;
    --listCard-fifth-table-tableData-fontColor:#2F473C;
    --listCard-fifth-table-tableData-borderColor:#DFE5D8;
    --listCard-fifth-table-tableData-fontSize:13px;
    --listCard-fifth-title-fontColor: #153829;
    --listCard-fifth-title-fontSize: 20px;
    --listCard-fifth-subContainer-background:#FFF5CD;
    --listCard-fifth-subContainer-padding:16px;
    --listCard-fifth-subContainer-borderRadius:24px;
    --listCard-fifth-image-width:404px;
    --listCard-fifth-image-borderRadius:20px;
    --listCard-fifth-secondary-iconText-container-borderRadius:20px;
    --listCard-fifth-secondary-iconText-container-width:376px;
    --listCard-fifth-secondary-iconText-container-padding:10px 16px;
    --listCard-fifth-secondary-iconText-container-background:#F8EFD6;
    --listCard-fifth-secondary-titleIcon-icon-fill:#2B4A3C;
    --listCard-fifth-secondary-titleIcon-icon-stroke:#2B4A3C;
    --listCard-fifth-h2-fontSize:16px;
    --listCard-fifth-h2-fontColor:#355C4B;
    --listCard-fifth-body-fontColor:#2F473C;
    --listCard-fifth-body-fontSize:14px;
    --listCard-fifth-body-width:367px;

    --icon-button-fourth-noBorder-width:15px;
    --arrowBtn-tittle-width:539px;
    --mapBtn-fifth-select-container-visible-background:rgba(249, 248, 248, 0.57);
    --mapBtn-fifth-select-container-visible-padding:16px 19px;
    --mapBtn-fifth-select-container-visible-boderRadius:24px;
    /*Tabs*/
    --tabs-fourth-maxWidth:475px;
    --tabs-fourth-background:#fff;
    --tabView-fourth-fontSize: 15px;
    --tabView-fourth-select-fontColor: #0b3924;
    --tabView-fourth-select-background: #ffeca1;
    --tabView-fourth-h1-fontSize: 15px;
    --tabView-fourth-h1-fontColor: #2f473c;
    --tabView-fourth-h3-fontSize: 14px;
    --tabView-fourth-h3-fontColor: #2F473C;
    --tabView-fourth-tab-padding:12.5px 17.5px;
    --tabView-fourth-tab-background:#fff;
    --tabView-fourth-select-borderRadius:24px 24px 0px 0px;
    --tabView-fourth-tabs-content-illustration-chips-container-maxWidth:507px;
    --tabView-fourth-tabs-content-illustration-chips-container-padding:10px 0px 0px 0px;
/*--------------------------------------------------------------------*/   
    --tabs-fifth-width:468px;
    --tabs-fifth-tab-select-background:#fff;
    --tabs-fifth-tab-select-fontColor: #1D543D;
    --tabs-fifth-tab-select-fontSize:15px;
    --tabs-fifth-tab-select-padding:12px 17.5px;
    --tabs-fifth-tabContent-width:463px;
    --tabs-fifth-tab-select-borderColor:#1D543D;
    /*Inputs*/
    --input-default-background:#fff;
    --input-default-borderRadius: 24px;
/*--------------------------------------------------------------------*/  
    --input-first-default-height-smallSize:33px;
    --input-first-default-width-smallSize:280px;
/*--------------------------------------------------------------------*/   
    --input-fourth-default-fontColor: #537063;
    --input-fourth-default-fontSize: 14px;
    --input-fourth-default-borderColor: #a5b7af;
    --input-fourth-hover-background: rgba(241, 255, 249, 0.65);
    --input-fourth-hover-borderColor: #9cb7ab;
    --input-fourth-group-icon-width:15px;
    --input-fourth-group-height:40px;
    --input-fourth-group-padding: 0px 12px;
    --input-fourth-group-margin:0px;
    --input-fourth-group-gap:10.5px;
    --input-fourth-group-borderRadius:24px;
    --input-fourth-group-hover-background: rgba(241, 255, 249, 0.65);
    --input-fourth-group-hover-borderColor: #9cb7ab;
    --input-fourth-group-focus-focusBorder:0px 0px 0px 2.8px rgba(98, 158, 131, 0.51);
    --input-fourth-group-invalid-borderColor: #DD3131;
    --input-fourth-group-invalid-focusBorder: 0px 0px 0px 2.8px rgba(243, 57, 57, 0.51);
    --input-fourth-group-icon-fill: #2F473C;
    --input-fourth-default-width-mediumSize-group: 227px;
    --input-fourth-default-width-largeSize-group: 346px;
    --input-fourth-filled-borderColor: #30443B;
    --input-fourth-label-fontSize: 14px;
/*--------------------------------------------------------------------*/   
    --input-fifth-label-fontColor: #0B3924;
    --input-fifth-label-fontSize: 16px;
    --input-fifth-small-width:100px;
    --input-fifth-medium-width:160px;
    --input-fifth-large-width:260px;
    --input-fifth-extraLarge-width:360px;
    --input-fifth-largeSize-width:259px;
    --input-fifth-medium-height:40px;
    --input-fifth-default-fontSize:14px;
    --input-fifth-mediumSize-width:227px;
    --input-fifth-default-fontColor:#466154;
    --input-fifth-default-borderColor:#5D7569;
    --input-fifth-hover-background:#F6FAF9;
    --input-fifth-hover-borderColor:#5D7569;
    --input-fifth-hover-fontColor:#466154;
    --input-fifth-focus-shadow:0px 0px 0px 2.8px rgba(98, 158, 131, 0.51);
    --input-fifth-focus-fontColor: #30443B;
    --input-fifth-invalid-borderColor:#DD3131;
    --input-fifth-invalid-shadow:0px 0px 0px 2.8px rgba(221, 49, 49, 0.37);
    --input-fifth-default-padding:12px;
    --input-fifth-default-borderRadius:18px;
    --input-fifth-group-padding: 10.5px 12px;
    --input-fifth-group-height: 17px;
    --input-fifth-group-gap: 10.5px;
    --input-fifth-group-borderRadius: 20px;
    --input-fifth-default-icon-fill:#466154;
    --input-fifth-default-icon-width:15px;
    --input-fifth-filled-borderColor:#325043;
    --input-fifth-filled-fontColor:#30443B;
    --input-fifth-default-opacity: 0.5;
/*--------------------------------------------------------------------*/   
    /*Buscador*/
    --navBar-fourth-container-height:52px;
    --navBar-fourth-container-padding:17px 24px;
    --navBar-fourth-container-borderRadius:24px;
    --navBar-fourth-searcherTabs-background:#fff;
    --navBar-fourth-searcherContainer-maxWidth:499px;
    --navBar-fourth-searcherContainer-gap:16px;
    --navBar-fourth-subContainer-gap:12px;
    --navBar-fourth-h1-fontColor: #fff;
    --navBar-fourth-h1-fontSize: 20px;
    --navBar-fourth-icon-fill: #FFECA1;
    --navBar-fourth-container-background: rgba(46, 77, 63, 0.9);
    --navBar-fourth-searcherTabs-maxWidth:477px;
    --navBar-fourth-searcherTabs-maxheight:208px;
    --navBar-fourth-searcherTabs-margin:0px 10px 0px 170px;
    --navBar-fourth-searcherTabs-padding:16px;
    --navBar-fourth-searcherTabs-borderRadius:24px;
    --navBar-fourth-tabs-width:445px;
    --navBar-fourth-tabs-maxWidth:475px;
    --navBar-fourth-tabs-tab-padding:0px 12px 10px;
    --navBar-fourth-tabs-tab-maxWidth:211px;
    --navBar-fourth-tabs-tab-height:20px;
    --navBar-fourth-tabs-tab-fontColor:#07291a;
    --navBar-fourth-tabs-tab-fontSize:15px;
    --navBar-fourth-tabs-tab-margin:0px;
    --navBar-fourth-tabs-tab-background:#fff;
    --navBar-fourth-tabs-tab-gap:10px;
    --navBar-fourth-tabs-secondaryTab-padding:0px 12px 10px;
    --navBar-fourth-tabs-secondaryTab-maxWidth:211px;
    --navBar-fourth-tabs-secondaryTab-margin:30px;
    --navBar-fourth-tabs-secondaryTab-margin:12px 8px 0px 8px;
    --navBar-fourth-tabs-secondaryTab-fontColor:#07291a;
    --navBar-fourth-tabs-secondaryTab-fontSize:15px;
    --navBar-fourth-tabs-secondaryTab-gap:10px;
    --navBar-fourth-tabs-secondaryTab-background:#fff;
    --navBar-fourth-tabs-content-inputChips-container-margin:0px;
    --navBar-fourth-tabs-content-inputChips-container-maxWidth:445px;
    --navBar-fourth-tabs-content-inputChips-container-padding:10px 0px 0px 0px;
    --navBar-fourth-tabs-content-inputChips-container-gap:12px;
    --navBar-fourth-tabs-content-h3-fontSize:14px;
    --navBar-fourth-tabs-content-h3-fontColor:#2F473C;
    --navBar-fourth-tabs-content-h3-margin:0px;
    --navBar-primary-default-shadow: -4px -4px 10px rgba(255, 255, 255, 0.2), 4px 4px 10px rgba(255, 255, 255, 0.2);
    --navBar-fourth-tabs-select-borderColor: #ffeca1;
    --navBar-fourth-tabs-iconColor: #2f473c;
    --dropDown-fourth-default-label-fontSize: 14px;
    --dropDown-fourth-default-label-fontColor: #2F473C;
    /*Log-in/Sign-up*/
    --logIn-fourth-container-background:#fff;
    --logIn-fourth-container-maxWidth:346px;
    --logIn-fourth-container-minHeight:452px;
    --logIn-fourth-container-borderRadius:24px;
    --logIn-fourth-container-padding:20px 32px 32px 32px;
    --logIn-fourth-container-margin:0px;
    --logIn-fourth-container-gap:24px;
    --logIn-fourth-input-container-maxWidth:346px;
    --logIn-fourth-input-container-gap:10px;
    --logIn-fourth-input-container-margin:0px;
    --logIn-fourth-h1-fontSize: 20px;
    --logIn-fourth-h1-fontColor: #0B3924;
    --logIn-fourth-inputLabel-fontSize: 16px;
    --logIn-fourth-inputLabel-fontColor: #0B3924;
    --logIn-fourth-input-link-helperText-fontSize: 13px;
    --logIn-fourth-input-link-helperText-fontColor: #355C4B;
    --button-fourth-medium-height: 40px;
    --logIn-fourth-divider-container-divider-color: #355C4B;
    --logIn-fourth-divider-container-letter-size: 15px;
    --logIn-fourth-divider-container-letter-color: #355C4B;
    --exitIcon-height-small-size: 12px;
    --exitIcon-width-small-size:12px;
    --logIn-fourth-inputContainer-exitIcon-color:#0B3924;
    --logIn-fourth-input-default-helperText-fontSize: 12px;
    --logIn-fourth-input-default-helperText-fontColor: #52695F;
 /*--------------------------------------------------------------------*/      
    --logIn-fifth-container-backgroundColor:rgba(249, 248, 248, 0.57);
    --logIn-fifth-container-width:378px;
    --logIn-fifth-container-gap:24px;
    --logIn-fifth-container-padding:16px;
    --logIn-fifth-container-maxHeight:378px;
    --logIn-fifth-container-borderRadius:20px;
    --logIn-fifth-h1-fontSize:20px;
    --logIn-fifth-h1-fontColor:#153829;
    --logIn-fifth-input-subContainer-background:#FFF5CD;
    --logIn-fifth-input-subContainer-borderRadius:20px;
    --logIn-fifth-input-subContainer-width: 346px;
    --logIn-fifth-input-subContainer-gap: 20px;
    --logIn-fifth-input-subContainer-padding: 16px;
    --logIn-fifth-inputLabel-fontColor:#154631;
    --logIn-fifth-inputLabel-fontSize: 16px;
    --logIn-fifth-input-link-helperText-fontSize:13px;
    --logIn-fifth-input-link-helperText-fontColor:#405C50;
    --logIn-fifth-divider-container-width:346px;
    --logIn-fifth-divider-container-divider-color:#1D543D;
    --logIn-fifth-divider-container-letter-fontSize:13px; 
    --logIn-fifth-divider-container-letter-fontColor:#405C50;
    --logIn-fifth-divider-container-letter-margin: 0px 13px;
    --logIn-fifth-h1ExitIcon-container-icon-fill:#153829;
    --logIn-fifth-h1ExitIcon-container-icon-stroke:#153829;
    --logIn-fifth-h1ExitIcon-container-icon-width:12px;
    --logIn-fifth-input-helperText-fontSize:12px;
    --logIn-fifth-input-helperText-fontColor:#4B5563;
    --logIn-fifth-input-helperText-height:16px;
/*--------------------------------------------------------------------*/       
    /*Top Bar y SideBar*/
    --navBar-fourth-container-background: rgba(46, 77, 63, 0.9);
    --navBar-fourth-h1-fontColor: #fff;
    --navBar-fourth-h1-fontSize: 20px;
    --navBar-primary-default-shadow: -4px -4px 10px rgba(255, 255, 255, 0.2), 4px 4px 10px rgba(255, 255, 255, 0.2);

    --mapButton-fourth-container-background: rgba(46, 77, 63, 0.9);
    --mapButton-fourth-container-padding:16px;
    --mapButton-fourth-container-borderRadius:24px;
    --mapButton-fourth-container-gap:12px;
    --font-montserrat: Montserrat;
    
    --sideBar-first-background: linear-gradient(173.78deg, rgba(255, 255, 255, 0.6) 7.44%, rgba(255, 255, 255, 0));
    --sideBar-first-borderColor: : #fff;
    --sideBar-first-glassEffect-shadow: 0px 20px 40px rgba(0, 0, 0, 0.1);
    --doc-sideBar-fourth-link-h2-color:#0B3924;
    --doc-sideBar-fourth-link-h2-size:16px;
    --doc-sideBar-fourth-link-h3-color:#2B4A3C;
    --doc-sideBar-fourth-link-h3-size:14px;
    --doc-sideBar-fourth-background:rgba(254, 254, 254, 0.8);
    --doc-sideBar-fourth-links-select-background: rgba(173, 199, 187, 0.65);
    --doc-sideBar-fourth-links-hover-background: rgba(173, 199, 187, 0.65);
    /*Descargar capas lista*/
    --button-fourth-medium-width: 114px;
    --button-fourth-medium-height: 40px;
    --button-fourth-primary-default-small-width: 92px;
    --button-fourth-primary-default-small-height: 33px;
    --accordionList-fourth-background:#fff;
    --accordionList-fourth-padding:16px;
    --accordionList-fourth-borderRadius:24px;
    /*Card cesefor*/
    --logIn-fourth-container-background:#fff;
    --button-fourth-secondary-plain-small-width: 70px;
    --button-fourth-secondary-plain-small-height: 29px;
    --card-cesefor-container-width:505px;
    --card-cesefor-container-height:387px;
    --card-cesefor-container-borderRadius:24px;
    --card-cesefor-container-padding:16px;
    --card-cesefor-container-margin:0px;
    --card-cesefor-container-gap:14px;
    --card-cesefor-fourth-img-width:505px;
    --card-cesefor-fourth-img-borderRadius:24px;
    --card-cesefor-fourth-logo-height:55px;
    --card-fourth-title-fontColor: #2B4A3C;
    --card-fourth-title-fontSize: 20px;
}

header{
    margin: 0;
    position: sticky;
    top: 0;
}
.navBar-class{
    border: 1px solid  #FFF;
    display: flex;
    margin:16px;
    height: 52px;
    padding: 17px 24px;
    border-radius: 24px;
    justify-content: space-between;
    align-items: center;
    background: var(--navBar-fourth-container-background);
    flex-wrap: wrap;
    box-shadow: -4px -4px 10px 0px rgba(255, 255, 255, 0.20), 4px 4px 10px 0px rgba(255, 255, 255, 0.20);
    width: auto;
}
.navBar-links-link.active a {
    position: relative;
}
.navBar-links{
    
    display: flex;
    align-items: center;
    flex-direction: row;
    gap:30px;
    justify-content: flex-end;

}

.navBar-links-link,
.navBar-links-link-active{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    color: var( --navBar-fourth-h1-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--navBar-fourth-h1-fontSize);
    font-weight: var(--fw-600-semiBold)
}
.navBar-links-link-icon{
    height: 20px;
    margin-right:8px;
    fill:var(--navBar-fourth-icon-fill);
    
   
}

.navBar-links a{
    display: flex;
    align-items: center;
}

.navBar-links-link a:link,
.navBar-links-link a:visited{
    
    color: var( --navBar-fourth-h1-fontColor);
    text-decoration: none;

}
.navBar-links-link.active a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;  
    width: 100%;
    height: 2px; 
    background-color: var(--navBar-fourth-line-color); 
    border-radius: 2px; 
    --navBar-fourth-line-color:#FFECA1;
} 
.body-section{
    display: flex;
    min-height: 100vh;
    width:75%;
    gap: calc(5%);
    margin:0;
    justify-self: center !important;
    justify-content: center;

}


.doc-sideBar-aside{
    position: sticky;

    top:0;
   right:0 !important;
    height: 100vh;
    width:212px;
    border: 1px solid  #FFF;
    box-shadow: -4px -4px 10px 0px rgba(255, 255, 255, 0.20), 4px 4px 10px 0px rgba(255, 255, 255, 0.20);
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);    left:0;
    border-radius: 24px;
    
    
}

main{
    flex-grow: 1; 

    max-width: fit-content; 
    width: auto;

}

.doc-sideBar-class{
    width: 212px;
    display: flex;
    overflow-y: auto;
    min-height: 100vh;
    max-height:300px;
    border-radius: 24px;
    align-items:flex-start;

   
   
}
.doc-sideBar-class::-webkit-scrollbar {
    width: 9px; 
    
    margin:2px 2px 2px 0px;
}
  
.doc-sideBar-class::-webkit-scrollbar-track {
    background: rgba(30, 84, 60, 0.20);
    border-radius: 20px;
    margin: 18px 0px 18px 6px;

   

}

.doc-sideBar-class::-webkit-scrollbar-thumb {
    background: #1E543C;
    min-height: 10px;
    max-height:30px; 
    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5); 
    border-radius: 20px;
    background-clip: padding-box;
}
.doc-sideBar-links{
    gap:0px;
    display: flex;
    width: 100%;
    min-height: 100vh;
    flex-direction: column;
    padding: 10px;
    justify-content: flex-start;
   
}

.doc-sideBar-links-link-h2 a{
    display: flex;
    align-items: flex-start;
    margin:0;
    margin-bottom: 4px;

    padding:7px 10px;
    border-radius: 24px;
    color: var(--doc-sideBar-fourth-link-h2-color);
    font-family: var(--font-montserrat);
    font-size: var(--doc-sideBar-fourth-link-h2-size);
    
    font-weight: var(--fw-600-semiBold);
    background-color: var(--doc-sideBar-fourth-links-background);


}

.doc-sideBar-links-link-h3 a{
    display: flex;

    align-items: flex-start;
    margin-left: 14px;
    padding:7px 10px;
    border-radius: 24px;
    color: var(--doc-sideBar-fourth-link-h3-color);
    font-family: var(--font-montserrat);
    font-size: var(--doc-sideBar-fourth-link-h3-size);
    font-weight: var(--fw-500-medium);


}
.doc-sideBar-links-link-h2 a:link,
.doc-sideBar-links-link-h2 a:visited{
    
    color: var(--doc-sideBar-fourth-link-h2-color);
    text-decoration: none;

}
.doc-sideBar-links-link-h3 a:link,
.doc-sideBar-links-link-h3 a:visited{
    
    color: var(--doc-sideBar-fourth-link-h3-color);
    text-decoration: none;

}
.doc-sideBar-links-link-h3 a:focus,
.doc-sideBar-links-link-h2 a:focus{
    background-color: var(--doc-sideBar-fourth-links-select-background);
}

.doc-sideBar-links-link-h3 a:hover,
.doc-sideBar-links-link-h2 a:hover{
    background-color: var(--doc-sideBar-fourth-links-select-background);
}


.code-container::-webkit-scrollbar {
    width: 9px;
    height: 12px; 
}


.code-container::-webkit-scrollbar-track {
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);

    border-radius: 20px;
    margin: 18px 4px 18px 6px;
}


.code-container::-webkit-scrollbar-thumb {
    background: #1E543C;
    height: var(--scrollBar-fourth-handle-height);
    
    border-radius: 20px;
    border: none;
}

h1{
    color: #24362e;
    font-size: 38px;
    margin: 10px 0px 6px 0px;

}

.h1-icon{
    height: 20px;
    fill:#293f35;
    

}
h2{
    color:#405C4F; 
}
h3{
    color:#10452c; 
    
    font-size: 26px;
    margin: 10px 0px 8px 0px;
}
h4{
    color:#275741;
    /*color:#f6f6f6; */
    font-size: 16px;
    margin: 10px 0px -3px 6px;

}
html{
    height:100%;
}
body{
    font-family: "Montserrat";
    margin: 12px;
    background-color: #CAD3CB;

    height:100%;
 
}

span{
    font-weight: var(--fw-600-semiBold);
    font-size: 15px;
    color: #405C4F;
    --fw-600-semiBold: 600;
}
hr{
    border:none;
    height:1px;
    margin:0px 0;

    background-color:#69867850;
}

/*-----------------------------------------------------------------------------*/

/*Contenedores*/

.container{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 12px;
    height: max-content;
    width: max-content;
    position: relative;

}
.containerCentered{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 12px;
    height: max-content;
    width: max-content;
    position: relative;
    align-items: center;

}
.containerNoGap{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height: max-content;
    width: max-content;
    position: relative;

}
.container1{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    margin-top: 16px;
    margin-left: 20px;
    margin-bottom: 16px;
    padding:12px;
    height: max-content;
    width: max-content;
}

.containerRightMargin{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 12px;
    height: max-content;
    width: max-content;
    position: relative;
    margin-right:420px;
}

.containerRightMargin2{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 12px;
    height: max-content;
    width: max-content;
    position: relative;
    margin-right:80px;
}
.container1b{
    display: flex;
    flex-direction: column;
   
    margin-top: 16px;
    margin-left: 20px;
    margin-bottom: 16px;
    padding:12px;
    height: max-content;
    width: max-content;
}
.container1c{
    display: flex;
    flex-direction: column;
   gap:0px;
margin-top: 16px;
 
}
.container2{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    flex-direction: column;
    
    width: max-content;
    height: max-content;
    align-items: center;
    margin-top: 16px;
    gap:30px;
}
.container4{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    flex-direction: column;
    
    width: max-content;
    height: max-content;
    align-items: center;
    margin-top: 16px;
   
}

.mapButton-container{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    flex-direction: column;
    width: max-content;
    height: max-content;
    align-content: center;
    justify-content: center;

    margin-left:20px;
}
.mapButton-container-sideBar{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    flex-direction: column;
    width: max-content;
    height: max-content;
    align-content: center;
    justify-content: center;

}
.mapButton-container-fifth{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    flex-direction: column;
    width: max-content;
    height: max-content;
    align-content: center;
    justify-content: center;
    margin-top: 16px;
    margin-left:20px;
    width:var(--mapButton-container-fifth-width);
    height:var(--mapButton-container-fifth-height);
    border-radius: var(--mapButton-fifth-borderRadius);
    background-color:var(--mapButton-fifth-container-background);
 
}
.container3{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    gap:0px;
    flex-direction: column;
   
    padding:12px;
    margin-top: 16px;
    height: max-content;
    align-items: center;
    margin: 0;

}
.container4{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    gap:0px;
    flex-direction: column;
   
    padding:0px;
    
    height: max-content;
    align-items: center;
    margin: 0;

}
.zoomContainer{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    gap:0px;
    flex-direction: column;
    padding: px;
    height: max-content;
    align-items: center;
    margin: 0;

}

.container5{
    display: inline-block;
    position: relative;
    margin-top: 16px;
    margin-left: 20px;
    margin-bottom: 16px;
    gap: 12px;
    padding:12px;
    height: max-content;
    width: max-content;
}
.container6{
    
    display: inline-block;
    position: relative;
    height: max-content;
    width: max-content;
}


.content-container{
    display: flex;
    gap: 12px;

}

.content-container2{
    display: flex;
    align-items: center;
    

}
.div1{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    background-color: #f0f5f7;
    border-radius: 18px;
    margin-bottom: 20px;
    margin-left: 10px;

}
.getStartedParagraph{
    margin:10px;
    color: #24362e;
    font-weight: var(--fw-500-medium);
    font-size: 18px;

}
.link-class{
    margin:0px;
    color: #24362e;
    text-decoration: underline;
    font-weight: var(--fw-600-semiBold);
    font-size: 18px;
    display: flex;
    flex-wrap: wrap;

}
a:-webkit-any-link{
    color: #24362e;
}
#getStarted,
#customize,
#viewer1,
#viewer2,
#viewer3,
#viewer4,
#viewer5{
    display: flex;
    gap: 8px;
    max-width: 720px;

    flex-direction: column;
    
    width:auto;
    margin-bottom: 20px;
    margin-left: 0px;
    
}

.buttons{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    height:auto;
    width:100%;
    box-sizing: border-box;
    margin:0px 0px 0px 8px;
    gap: 12px;
    padding:20px 24px;
    border-radius: 20px;
    border: 1px solid #FFF;
    max-width: 720px;

    justify-content: flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    
}
.code-container{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    margin:0px 0px 8px 8px;
    gap: 12px;
    padding:20px 24px;
    overflow-y:auto;
    max-height:150px;
    width:100%;
    box-sizing: border-box;

    border-radius: 20px;
    max-width: 720px;
    /*color:#293f35;*/
    color:#E2E8F1;
    border: 1px solid #FFF;
    /*background: linear-gradient(170deg, rgba(255, 255, 255, 0.75) 20.73%, rgba(255, 255, 255, 0.78) 100.94%);*/
    background-color: rgba(46, 77, 63, 0.9);
    align-items: flex-start;
}
#figmaFile,
#addingLinks,
#themeColors,
#buttons1,
#otherComponents1,
#mapButtons1,
#mapButtonsContainers1,
#accordions1,
#layersInputs1,
#dataPanel1,
#buttons2,
#otherComponents2,
#mapButtons2,
#accordions2,
#layersInputs2,
#dataPanel2,
#buttons3,
#otherComponents3,
#mapButtons3,
#accordions3,
#layersInputs3,
#dataPanel3,
#buttons4,
#otherComponents4,
#mapButtons4,
#mapButtonsContainers4,
#accordions4,
#layersInputs4,
#cards4,
#downloadLayers4,
#inputs4,
#searcherBar4,
#logIn4,
#specialCard4,
#buttons5,
#otherComponents5,
#mapButtons5,
#mapButtonsContainers5,
#layersInputs5,
#cards5,
#dataPanel5,
#inputs5,
#logIn5{
    display: flex;
    flex-direction: column;
    height:auto;
    width:100%;
    max-width: 720px ;
    gap: 12px;
    margin-bottom:24px;
    border-radius: 20px;
    margin-left:8px;
    justify-content: flex-start;
   

}
.accordionsContainer{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    height:auto;
    width:100%;
    max-width: 720px;
    margin:0px 0px 0px 8px;
    gap: 24px;
    padding:20px 24px;
    border-radius: 20px;
    border: 1px solid #FFF;
    justify-content: flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    box-sizing: border-box;
}

.components-container{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height:auto;
    width:100%;
    max-width: 720px!important;
    margin:0px 0px 0px 8px;
    gap: 14px;
    padding:20px 24px;
    border-radius: 20px;
    box-sizing: border-box;
    border: 1px solid #FFF;
    justify-content: flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    
}

.components-containerD{
    display: flex;
    box-sizing: border-box;
    flex-direction: column;
    height:auto;
    width:100%;
    max-width: 720px;
    margin:0px 0px 0px 8px;
    gap: 14px;
    flex-wrap: wrap;
    white-space: nowrap;
    padding:20px 24px;
    border-radius: 20px;
    border: 1px solid #FFF;
    justify-content: flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    
}
.components-containerC{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height:auto;
    width:100%;
    max-width: 720px;
    margin:0px 0px 0px 8px;
    gap: 14px;
    padding:20px 24px;
    box-sizing: border-box;
    border-radius: 20px;
    border: 1px solid #FFF;
    justify-content: flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    
}
.components-containerB{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height:auto;
    width:100%;
    max-width: 720px;
    margin:0px 0px 0px 8px;
    gap: 14px;
    padding:20px 24px;
    border-radius: 20px;
    border: 1px solid #FFF;
    justify-content: flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    box-sizing: border-box;
}
.components-containerE{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height:auto;
    width:100%;
    max-width: 720px;
    margin:0px 0px 0px 8px;

    padding:20px 24px;
    border-radius: 20px;
    border: 1px solid #FFF;
    justify-content: flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    box-sizing: border-box;
}
.components-container2{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: flex-end;
    height:auto;
    width:100%;
    max-width: 720px;
    margin:0px 0px 0px 8px;
    gap: 8px;
    padding:20px 24px;
    box-sizing: border-box;
    border-radius: 20px;
    border: 1px solid #FFF;
    justify-content: flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    
}

.components-container3{
    display: flex;
    
    flex-direction: column;
    align-items: flex-end;
    flex-wrap: wrap;
    height:auto;
    width:100%;
    max-width: 720px;
    margin:0px 0px 0px 8px;
    gap: 8px;
    padding:20px 24px;
    box-sizing: border-box;
    border-radius: 20px;
    border: 1px solid #FFF;
    justify-content: flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    
}

.components-container4{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    height:auto;
    width:100%;
    box-sizing: border-box;
    margin:0px 0px 0px 8px;
    gap: 8px;
    padding:20px 24px;
    max-width: 720px;
    border-radius: 20px;
    border: 1px solid #FFF;
    justify-content: flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    
}
.components-container5,
.components-container5B{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    height:auto;
    width:100%;
    box-sizing: border-box;
    margin:0px 0px 0px 8px;
    gap: 8px;
    padding:20px 24px;
    max-width: 720px;
    border-radius: 20px;
    border: 1px solid #FFF;
    align-items: flex-end;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    
}

.components-container6{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height:auto;
    width:100%;
    max-width: 720px;
    margin:0px 0px 0px 8px;
    gap: 14px;
    padding:20px 24px;
    border-radius: 20px;
    border: 1px solid #FFF;
    align-content:flex-start;
    background: linear-gradient(170deg, rgba(243, 242, 242, 0.75) 20.73%, rgba(237, 237, 237, 0.357) 100.94%);
    box-sizing: border-box;
}
.components-container:focus-within {
    height: 500px; 
}
.components-container .scroll-bar-fourth-background{
    height:130px;
}
.components-containerB .scroll-bar-third-background{
    height:130px;
}
.dataPanel-first-container .scroll-bar-fourth-background{
    height:100%;
}
.components-container .scroll-bar-fifth-background{
    height:130px;
}

.components-container4:focus-within,
.components-container2:focus-within,
.components-container5:focus-within {
    height: 400px; 
}

.components-container5B:focus-within,
.components-containerC:focus-within {
    height: 800px; 
}
.div-other-components{
    display: flex;
    gap:20px;
    padding: 12px;
    align-items:initial;
    flex-wrap: wrap;
    flex-direction: row;
    margin-bottom: 20px; 
    margin-left: 10px;    
    border-radius: 18px;
    background-color: #f0f5f7;

}

.div-map-button{
    display: flex;
    justify-content: space-between;
    padding-right: 230px;
    align-items:initial;
    border-radius: 18px;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
    height: 100px;
    margin-bottom: 12px;  
    margin-left: 10px;
    transition: height 0.3s ease;
    overflow: hidden; 
}

.div-map-button:focus-within {
    height: 200px; 
}

.div-map-button3{
    display: flex;
    justify-content: space-between;
    padding-right: 230px;
    align-items:initial;
    border-radius: 18px;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
    height: 500px;
    margin-bottom: 12px;  
    margin-left: 10px;
   
}
.div-mushroomMapButton{
    display: flex;
    justify-content: space-between;
    padding-right: 230px;
    align-items:initial;
    border-radius: 18px;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
   max-height: 670px;
    margin-bottom: 12px;  
    margin-left: 10px; 
    transition: height 0.3s ease;
    overflow: hidden; 
}

  
.div-mushroomMapButton:focus-within {
    height: 9000px; 
}

.div-map-button2{
    display: flex;
    flex-direction: row;
    align-items:initial;
    gap: 150px;
    padding: 12px;
    border-radius: 18px;
    background-color: #EDF2F5;
    border-radius: 18px;
    height: 160px;
    margin-bottom: 20px;    
    margin-left: 10px; 
}

.div-accordion{
    display: flex;
    gap:300px;
    padding: 12px;
    align-items:flex-start;
    border-radius: 18px;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
    height: 50px; 
    margin-bottom: 12px;  
    margin-left: 10px;
    transition: height 0.3s ease;
    overflow: hidden; 
}

  
.div-accordion:focus-within {
    height: 300px; 
}
.div-input{
    display: flex;
    gap: 100px;
    padding: 12px;
    align-items:flex-start;
    border-radius: 18px;
    flex-wrap: wrap;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
    height: max-content; 
    margin-bottom: 12px;  
    margin-left: 10px;   
}

.div-cards{
    display: flex;
    gap:200px;
    padding: 12px;
    flex-direction: row;
    border-radius: 18px;
    flex-wrap: wrap;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
    height: max-content; 
    margin-bottom: 12px;  
    margin-left: 10px;   
}

.mapButtons-container-fourth{
    width: max-content;
    display: flex;
    flex-direction: column;
    position: relative;
    gap: var(--mapButton-fourth-container-gap);
    padding: var(--mapButton-fourth-container-padding);
    border-radius: var(--mapButton-fourth-container-borderRadius);
    background-color: var(--mapButton-fourth-container-background);
    height: max-content;
    align-items: center;
    justify-content: center;
    
}
.sideBar-fifth{
    width: max-content;
    display: flex;
    flex-direction: column;
    position: relative;
    gap: 10px;
    padding:12px;
    height: max-content;
    align-items: center;
    justify-content: center;
    border-radius: var(--mapButton-fifth-borderRadius);
    background-color: var(--mapButton-fifth-container-background);
}
.buttonContainer{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    margin: 0;
    gap: 30px;
    height: max-content;
    width: max-content;
}
.div-inputList{
    display: flex;
    gap:var(--div-inputList-fifth-gap);
    align-items:flex-start;
    border-radius: var(--div-inputList-fifth-borderRadius);

    border-radius: 18px;
    flex-direction: row;
    height: max-content;
    width: max-content; 
    margin: var(--div-inputList-fifth-margin);
    
}
.inputList{
    display: flex;
    gap: 8px;   
    border-radius: 18px; 
    flex-direction: column;
   min-height: 200px;
    margin: 0;
    
}

.inputs-container{ /*Contenedor del input*/
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
    align-items: flex-start;
    margin:12px 16px 14px 16px;
    height: max-content;
    
}

.input-container{ /*Contenedor del input*/
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin: 10px 0px 10px 10px;
    
}
.div-searcher{
    display: flex;
    justify-content: space-between;
    padding: 12px;
    align-items:flex-start;
    border-radius: 18px;
    flex-wrap: wrap;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
    height: max-content; 
    margin-bottom: 12px;  
    margin-left: 10px; 
      
}

#searcher4{
    display: flex;
    justify-content: space-between;
    padding: 12px;
    align-items:flex-start;
    border-radius: 18px;
    flex-wrap: wrap;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: column;
    height: max-content; 
    margin-bottom: 12px;  
    margin-left: 10px; 
      
}
.div-searcher1,
.div-searcher2,
.div-searcher3{
    display: flex;
    gap:12px;
    width:100%;
    align-items:flex-start;
    border-radius: 18px;
    flex-wrap: wrap;
    flex-direction: column;
    height: max-content; 
    margin: 12px 10px;
}
/*-----------------------------------------------------------------------------*/
.rectangle{
    display: flex;
    width:100px;
    height:70px;
    border-radius: 8px;
    align-items: center;
    justify-content: center;
    
}
.rectangle-p{

    color:#fff;
    font-weight: var(--fw-600-semiBold);
    font-size: 14px;
    align-self: center;
}
.first-primary-color{
    background-color: var(--first-primary-color);
}
.first-secondary-color{
    background-color: var(--first-secondary-color);
    
}
.third-primary-color{
    background-color: var(--third-primary-color);
   
}
.third-secondary-color{
    background-color: var(--third-secondary-color);
 
}
.third-tertiary-color{
    background-color: var(--third-tertiary-color);
  
}

.fourth-primary-color{
    background-color: var(--fourth-primary-color);

}
.fourth-secondary-color{
    background-color: var(--fourth-secondary-color);
    
}

.fifth-primary-color{
    background-color: var(--fifth-primary-color);
    
}
.fifth-secondary-color{
    background-color: var(--fifth-secondary-color);
    
}
/*Botones*/

.bt-first-primary {
    width: var(--button-first-medium-width);
    height: var(--button-first-medium-height);
    border-radius: var(--button-first-borderRadius);
    border: none;
    background-color: var(--button-first-primary-default-background);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: var(--button-first-primary-fontSize);
    color: var(--button-first-primary-default-fontColor);
    font-family: var(--button-first-primary-text);
    font-weight: var(--fw-600-semiBold);
    padding:var(--button-first-padding-x) var(--button-first-padding-y);
    box-sizing: border-box;
    
    }

.bt-first-primary:hover{
   background-color: var(--button-first-primary-hover-background);
}

.bt-first-primary:active{
    
    color: var(--button-first-primary-select-fontColor);
    background-color: var(--button-first-primary-select-background);
    border: 1px solid var(--button-first-primary-select-borderColor);
  
}
.bt-first-primary-select{
    width: var(--button-first-medium-width);
    height: var(--button-first-medium-height);
    border-radius: var(--button-first-borderRadius);
    border: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    color: var(--button-first-primary-select-fontColor);
    font-family: var(--button-first-primary-text);
    font-weight: var(--fw-600-semiBold);
    font-size: var(--button-first-primary-fontSize);
    background-color: var(--button-first-primary-select-background);
    border: 1px solid var(--button-first-primary-select-borderColor);
    box-sizing: border-box;
}
.bt-first-primary:disabled{
    opacity:50%;
}
.bt-first-secondary {
    width: var(--button-first-medium-width);
    height: var(--button-first-medium-height);
    border-radius: var(--button-first-borderRadius);
    border: none;
    background-color: var(--button-first-secondary-default-background);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    text-align: left;
    font-size: var(--button-first-primary-fontSize);
    color: var(--button-first-primary-default-fontColor);
    font-family: var(--button-first-primary-text);
    font-weight: var(--fw-600-semiBold);
    box-sizing: border-box;
    
    
    }
.bt-first-secondary:hover{
    
   background-color: var(--button-first-secondary-hover-background);
}

.bt-first-primary:active{
    
    color: var(--button-first-primary-select-fontColor);
    background-color: var(--button-first-secondary-select-background);
   
  
}

.bt-first-secondary:disabled{
    opacity: 50%;
    
}
.bt-first-plain {
    width: var(--button-first-medium-width);
    height: var(--button-first-medium-height);
    border-radius: var(--button-first-borderRadius);
    border: none;
    background-color: var(--button-first-plain-default-background);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: var(--button-first-primary-fontSize);
    color: var(--button-first-plain-default-fontColor);
    font-family: var(--button-first-primary-text);
    font-weight: var(--fw-600-semiBold);
    box-sizing: border-box;
    }
.bt-first-plain:hover{
   
   background-color: var(--button-first-plain-hover-background);
}

.bt-first-plain:active{
    
   background-color: var(--button-first-plain-select-background);
  
}

.bt-first-plain:disabled{
    opacity:50%;
}
.btn-first-lg{
    width:var(--button-first-large-width);
    height:var(--button-first-large-height);
}

.btn-first-md{
    width:var(--button-first-medium-width);
    height:var(--button-first-medium-height);
}
.btn-first-sm{
    width:var(--button-first-small-width);
    height:var(--button-first-small-height);
}
    
.bt-fourth-primary{
    border-radius: var(--button-fourth-borderRadius);
    border: none;
    background-color: var(--button-fourth-primary-default-background);
    width: var(--button-fourth-medium-width);
    height: var(--button-fourth-medium-height);
    display: flex;
    position: relative;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    color: var(--button-fourth-primary-default-fontColor);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    font-size: var(--button-fourth-text-size);
    box-sizing: border-box;
    padding: var(--button-fourth-padding-y) var(--button-fourth-padding-x);

}

    
.bt-fourth-primary:hover{
        background-color: var(--button-fourth-primary-hover-background);
        box-sizing: border-box;
        display: flex;
        position: relative;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: var(--button-fourth-padding-y) var(--button-fourth-padding-x);
}

.bt-fourth-primary:active{
    
    background-color: var(--button-fourth-primary-select-background);
    box-sizing: border-box;
    color: var(--button-fourth-primary-select-fontColor);
    width: var(--button-fourth-medium-width);
    height: var(--button-fourth-medium-height);
    display: flex;
    position: relative;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-family: var(--font-montserrat);
    font-size: var(--button-fourth-text-size);
    padding: var(--button-fourth-padding-y) var(--button-fourth-padding-x);
}
.bt-fourth-primary-active{
    background-color: var(--button-fourth-primary-select-background);
    color: var(--button-fourth-primary-select-fontColor);
    display: flex;
    position: relative;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-family: var(--font-montserrat);
    font-size: var(--button-fourth-text-size);
    border-radius: var(--button-fourth-borderRadius);
    font-weight: var(--fw-600-semiBold);
    box-sizing: border-box;
    padding: var(--button-fourth-padding-y) var(--button-fourth-padding-x);
   
}
.bt-fourth-primary:disabled{
    opacity: 50%;
}

.bt-fourth-secondary{ 
        border-radius: var(--button-fourth-borderRadius);
        background-color: var(--button-fourth-secondary-default-background);
        border: 1px solid var(--button-fourth-secondary-default-borderColor);
        box-sizing: border-box;
        width: var(--button-fourth-medium-width);
        height: var(--button-fourth-medium-height);
        display: flex;
        position: relative;
        flex-direction: row;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        color: var(--button-fourth-secondary-default-fontColor);
        font-weight: var(--fw-600-semiBold);
        padding: var(--button-fourth-padding-y) var(--button-fourth-padding-x);
        font-family: var(--font-montserrat);
        font-size: var(--button-fourth-text-size);
        
}

.bt-fourth-secondary:hover{
        color: var(--button-fourth-secondary-hover-borderColor);
        font-family: var(--button-fourth-primary);
        background-color: var(--button-fourth-secondary-hover-background);
        padding: var(--button-fourth-padding-y) var(--button-fourth-padding-x);
        
 }
 .bt-fourth-secondary:active{
    display: flex;
    position: relative;
    flex-direction: row;
    background-color: var(--button-fourth-secondary-select-background);
    border: 1px solid var(--button-fourth-secondary-select-borderColor);
    color: var(--button-fourth-secondary-select-borderColor);
    font-size: var(--button-fourth-text-size);
    font-family: var(--button-fourth-text);
    box-sizing: border-box;
    padding: var(--button-fourth-padding-y) var(--button-fourth-padding-x);
}

.bt-fourth-secondary:disabled{
   opacity: 50%;

}

.bt-fourth-plain{
    position: relative;
    font-weight: var(--fw-600-semiBold);
    border: none;
    border-radius: var(--button-fourth-borderRadius);
    width: var(--button-fourth-medium-width);
    height: var(--button-fourth-medium-height);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    color: var(--button-fourth-secondary-default-fontColor);
    text-decoration: underline;  
    font-size: var(--button-fourth-text-size);
    font-family: var(--button-fourth-text);
    box-sizing: border-box;
    padding: var(--button-fourth-padding-y) var(--button-fourth-padding-x);
}

.bt-fourth-plain:hover{
    
    background-color: var(--button-fourth-plain-hover--background);

}

.bt-fourth-plain:disabled{
    opacity:50%;
}
.btn-fourth-lg{
    width:var(--button-fourth-large-width);
    height:var(--button-fourth-large-height);
}

.btn-fourth-md{
    width:var(--button-fourth-medium-width);
    height:var(--button-fourth-medium-height);
}
.btn-fourth-sm{
    width:var(--button-fourth-small-width);
    height:var(--button-fourth-small-height);
}
.bt-fourth-secondary-layers{ 
    border-radius: 24px;
    background-color: var(--button-fourth-secondary-default-background);
    border: 1px solid var(--button-fourth-secondary-default-borderColor);
    box-sizing: border-box;
    width: var(--button-fourth-secondary-default-layers-width);
    height: var(--button-fourth-secondary-default-layers-height);
    display: flex;
    position: relative;
    flex-direction: row;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    color: var(--button-fourth-secondary-default-fontColor);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--button-fourth-text);
    font-size: var(--button-fourth-text-size);
    padding: var(--button-fourth-padding-y) var(--button-fourth-padding-x);
}

.bt-fourth-secondary-layers:hover{
    color: var(--button-fourth-secondary-hover-borderColor);
    font-family: var(--button-fourth-primary);
    background-color: var(--button-fourth-secondary-hover-background);
    
}
.bt-fourth-secondary-layers:active{
    display: flex;
    position: relative;
    flex-direction: row;
    background-color: var(--button-fourth-secondary-select-background);
    border: 1px solid var(--button-fourth-secondary-select-borderColor);
    color: var(--button-fourth-secondary-select-borderColor);
    font-size: var(--button-fourth-text-size);
    font-family: var(--button-fourth-text);
    box-sizing: border-box;
    padding: var(--button-fourth-padding-y) var(--button-fourth-padding-x);
}

/*-----------------------------------------------------------------------------*/

/*Otros componentes*/

/* checkBox Librería 1 */
.checkBox-fourth,
.checkBox-first,
.checkBox-third{
    display: none;
   
}
.checkBox-first + label{
    width: 22px;
    display: inline-block;
    position: relative;
    border-radius: 6px;
    background-color: var(--checkBox-first-default-background);
    border: 2px solid var(--checkBox-first-default-borderColor);
    box-sizing: border-box;
    height: 22px;
    cursor: pointer;
    border-style: solid;
    border-width: 2px;
    
}

.checkBox-fourth + label{
    width: var(--checkBox-fourth-width);
    display: inline-block;
    position: relative;
    border-radius: var(--checkBox-fourth-borderRadius);
    background-color: var(--checkBox-fourth-primary-default-background);
    border: 2px solid var(--checkBox-fourth-primary-default-borderColor);
    box-sizing: border-box;
    height: var(--checkBox-fourth-height);
    cursor: pointer;
    border-style: solid;
    border-width: 2px;
    
} 
.checkBox-fourth:checked + label {
    background-color: var(--checkBox-fourth-primary-select-background);
    cursor: pointer;
   
} 

.checkBox-first:checked + label{
    background-color: var(--checkBox-first-select-background);
    cursor: pointer;
    border: 1px solid var(--checkBox-first-select-borderColor);
    
} 

.checkBox-fourth:checked + label::after {
    position: absolute;
    content:'\2713';
    top: 50%;
    left: 50%;
    font-size: 14px;
    transform: translate(-50%, -50%);
    color: var(--checkBox-fourth-primary-select-check); 
    
}

.checkBox-first:checked + label::after {
    position: absolute;
    content:'\2713';
    top: 50%;
    left: 50%;
    font-size: 14px;
    transform: translate(-50%, -50%);
    color: var(--checkBox-first-select-check); 
    
}
/* ---------------------------- */
/* RadionButton Librería 1 */

.radioButton-first{
    display: none;

}

.radioButton-first + label{
    width: 22px;
    display: inline-block;
    position: relative;
    border-radius: 50%;
    background-color: var(--radioButton-first-default-background);
    border: 2px solid var(--radioButton-first-default-borderColor);
    box-sizing: border-box;
    height: 22px;
    cursor: pointer;
    border-style: solid;
    border-width: 2px;
    
}

.radioButton-first:checked + label{
    background-color: var(--radioButton-first-select-background);
    cursor: pointer;
    border: 2px solid var(--radioButton-first-select-borderColor);
    
} 

.radioButton-first:checked + label::after {
    position: absolute;
    width: 10px;
    height: 10px;
    content: "";
    top: 50%;
    left: 50%;
    font-size: 14px;
    border-radius: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    background-color: var(--radioButton-first-select-check);
    
}

/* ------------------ */
/* Switch Librería 1 */

.switch {
    position: relative;
    display: inline-block;
    width: 42px;
    height: 24.5px;
    
    
}

.switch input{
    opacity: 0;
    width: 0;
    height: 0;
   
}

.switch-first {
    --webkit-appearance: none;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right:0;
    border: 2px solid var(--switch-first-default-borderColor);
    border-radius: 24px;
    transition: 0.3s;
    background-color: var(--switch-first-default-backgroundColor);
    
}
.switch-first::before{
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3.5px;
    right: 3.5px;
    transform: translateY(-50%);
    top:50%;
    background-color: var(--switch-first-select-handleColor);
    border-radius: 50%;
    transition: 0.4s;
   
    
}
input:checked + .switch-first{
    background-color: var(--switch-first-select-backgroundColor);
    
}

input:checked + .switch-first::before{
    transform: translateX(10px) translateY(-50%);
    background-color: white;
    border: none;
}

/* -------------------------------- */
/* Botones Icono Librería 1 */

.icon-button-first{    
    width: 20px;
    height: 20px;
    border-radius: 30px;
    background-color: var(--icon-button-first-default-backgroundColor);
    border: 2px solid var(--icon-button-first-default-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
    
}

.icon-button-first:active{
    width: 20px;
    height: 20px;
    border-radius: 30px;
    background-color: var(--icon-button-first-active-backgroundColor);
    border: 2px solid var(--icon-button-first-active-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
}

.icon-btn-icon-first{
    fill: var(--icon-button-first-icon-fill);
    width: 11px;
    height: 12px;
    display: block;
    --icon-button-first-icon-fill: #2F473C;
}
/* ----------------- */

/* Chips Librería 4*/
.chip-fourth{
    display: flex;
    cursor: pointer;
    border-radius: var(--chip-fourth-borderRadius);
    background-color: var(--chip-fourth-default-background);
    border: 1px solid var(--chip-fourth-default-borderColor);
    box-sizing: border-box;
    width: fit-content;
    height: var(--chip-fourth-height);
    display: inline-block;
    padding:var(--chip-fourth-padding);
    text-align: left;
    font-size: var(--chip-fourth-font-size);
    color: var(--chip-fourth-fontColor);
    font-family: var(--font-montserrat);
    font-weight: var(--fw-600-semiBold);
    

}
.chip-fourth:focus{
    position: relative;
    border-radius: var(--chip-fourth-borderRadius);
    background-color: var(--chip-fourth-default-background);
    width: fit-content;
    height: var(--chip-fourth-height);
    border: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding:var(--chip-fourth-padding);
    box-sizing: border-box;
    text-align: left;
    font-size: var(--chip-fourth-font-size);
    color: var(--chip-fourth-fontColor);
    font-family: var(--chip-fourth-font);
   
    font-weight: var(--fw-600-semiBold);
    
}
.chip-fourth1:focus{
    position: relative;
    border-radius: 24px;
    background-color: #ebf7f1;
    width: fit-content;
    height: 32px;
    border: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 8px 10px;
    box-sizing: border-box;
    text-align: left;
    font-size: var(--chip-fourth-font-size);
    color: var(--chip-fourth-fontColor);
    font-family: var(--chip-fourth-font);

    font-weight: var(--fw-600-semiBold);
    
}
.chip-fourth-focus{
    position: relative;
    border-radius: var(--chip-fourth-borderRadius);
    border:none;
    background-color: var(--chip-fourth-select-background);
    width: fit-content;
    height: var(--chip-fourth-height);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding:var(--chip-fourth-padding);
    box-sizing: border-box;
    text-align: left;
    font-size: var(--chip-fourth-font-size);
    color: var(--chip-fourth-fontColor);
    font-family: var(--chip-fourth-font);
    font-weight: var(--fw-600-semiBold);
    
}
.chip-checkBox {
    display:none;
    position: relative !important; 
    opacity: 1 !important; 
    z-index: 100;
    gap: 8px;

  }


.chip-checkBox:checked + .chip-fourth{
    display: inline-block;
    border-radius: var(--chip-fourth-borderRadius);
    background-color: #ebf7f1;
    width: fit-content;
    height: var(--chip-fourth-height);
    border: none;
    padding:var(--chip-fourth-padding);
    box-sizing: border-box;
    text-align: left;
    font-size: var(--chip-fourth-font-size);
    color: var(--chip-fourth-fontColor);
    font-family: var(--chip-fourth-font);
    font-weight: var(--fw-600-semiBold);
   
}

.icon-button-fourth-default{    
    width: var(--icon-button-fourth-width);
    height: var(--icon-button-fourth-height);
    border-radius: var(--icon-button-fourth-borderRadius);
    background-color: var(--icon-button-fourth-default-backgroundColor);
    border: 2px solid var(--icon-button-fourth-default-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--icon-button-fourth-padding);
    
}

.icon-button-fourth-default:hover{
    width: var(--icon-button-fourth-width);
    height: var(--icon-button-fourth-height);
    border-radius: var(--icon-button-fourth-borderRadius);
    background-color: var(--icon-button-fourth-hover-backgroundColor);
    border: 2px solid var(--icon-button-fourth-hover-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--icon-button-fourth-padding);
   
}

.icon-button-fourth-default:active{
    width: var(--icon-button-fourth-width);
    height: var(--icon-button-fourth-height);
    border-radius: var(--icon-button-fourth-borderRadius);
    background-color: var(--icon-button-fourth-active-backgroundColor);
    border: 2px solid var(--icon-button-fourth-active-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--icon-button-fourth-padding);
    
}

.icon-button-fourth-noBorder{    
    width: var(--icon-button-fourth-noBorder-width);

    background-color: transparent;
    border: none;
    align-items: center;
    justify-content: center;
    padding: 0px;
    
}
.icon-btn-icon-fourth{
    fill: var(--icon-button-fourth-icon-fill);
    height: var(--icon-button-fourth-icon-height);
    display: block;
    
    
}
.icon-btn-icon-nobBorder{
    fill: var(--card-fourth-icon-button-icon-fill);
    width: 15px;
    height: 17px;
    display: block;
    
}

.inputIcon {
    left: 10px;
    width: var(--input-fourth-group-icon-width);
    
    align-self: center;
    fill: var(--input-fourth-group-icon-fill);
    


  
}
.iconframei {
    width: 15px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
.placeholder {
    flex: 1;
    position: relative;
}
.input-content {
    width: 100%;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    text-align: left;
    font-size: 14px;
    color: var(--input-fourth-default-fontColor);
    font-family: var(--font-montserrat);
    
}
.content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
.mail-icon {
    width: 14px;
    position: relative;
    height: 14px;
}

.save-button-fourth-default{
    width: var(--saveButton-fourth-width);
    height: var(--saveButton-fourth-height);
    border-radius: var(--saveButton-fourth-borderRadius);
    background-color: var(--saveButton-fourth-default-icon-backgroundColor);
    border: 2px solid var(--saveButton-fourth-default-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--saveButton-fourth-padding);
   
}

.save-button-fourth-default:hover,
.save-button-fourth-default-card:hover{
    width: var(--saveButton-fourth-width);
    height: var(--saveButton-fourth-height);
    border-radius: var(--saveButton-fourth-borderRadius);
    background-color: var(--saveButton-fourth-hover-backgroundColor);
    border: 2px solid var(--saveButton-fourth-hover-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--saveButton-fourth-padding);
    
}

.save-button-fourth-default:active,
.save-button-fourth-default-card:active{
    width: var(--saveButton-fourth-width);
    height: var(--saveButton-fourth-height);
    border-radius: var(--saveButton-fourth-borderRadius);
    background-color: var(--saveButton-fourth-active-backgroundColor);
    border: 2px solid var(--saveButton-fourth-active-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--saveButton-fourth-padding);
    
}

.save-button-fourth-default-card{
    width: 27px;
    position: absolute;
    height: 27px;
    border-radius: 30px;
    background-color: var(--saveButton-fourth-default-icon-backgroundColor);
    border: 2px solid var(--saveButton-fourth-default-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
    right: 10px;
    top: 10px;
    
}

.save-icon{
    stroke: var(--saveButton-fourth-default-icon-borderColor);
    fill: var(--saveButton-fourth-default-icon-fill);
    width: 11px;
    height: 12px;
    display: block;
}

.save-icon-hover{
    stroke: var(--saveButton-fourth-hover-icon-borderColor);
    fill: var(--saveButton-fourth-hover-icon-fill);
    width: 11px;
    height: 12px;
    display: block;
   
}

.save-button-fourth-default:hover .save-icon,
.save-button-fourth-default-card:hover .save-icon {
    stroke: var(--saveButton-fourth-hover-icon-borderColor);
    fill: var(--saveButton-fourth-hover-icon-fill);
    
}

.scroll-bar-fourth{
    display:absolute;
    position: relative;
    width: var(--scroll-bar-fourth-width);
    
}
.scroll-bar-fourth-background{
    width: var(--scroll-bar-fourth-background-width);
    margin: 0;
    padding: 0;
    position: relative;
    border-radius: var(--scroll-bar-fourth-background-borderRadius);
    background:var(--scrollBar-fourth-backgroundColor);
    min-height:50px;
    height: 100%;
    overflow-y: scroll;
    
}

.scroll-bar-fourth-handle{
    width: 9px;
    margin: 0;
    padding: 0;
    position: absolute;
    display:inline;
    border-radius: var(--scrollBar-fourth-handle-borderRadius);
    background-color: var(--scrollBar-fourth-handle-background);
    height: var(--scrollBar-fourth-handle-height);
    animation: scroll-down 12s infinite alternate ease-in-out;
    
}
@keyframes scroll-down {
    0%{
        top:0;
        
    }
    100%{
        top: calc(100% - 100px); 
    }
}

.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 6px;
    border-radius: 6px;
    background: linear-gradient(to right, #6c9c42 var(--progress), #e6eddf var(--progress));
    cursor: pointer;
    outline: none;
    
    --progress: 50%;
}

.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 16px;
    height: 16px;
    background-color: var(--slider-first-default-handle-background);
    border: 2px solid var(--slider-first-default-handle-borderColor);
    border-radius: 50%;
    cursor: pointer;
   
}

.slider::-moz-range-thumb {
    width: 16px;
    height: 16px;
    background: var(--slider-first-default-range-background);
   
    border: 2px solid #6c9c42;
    border-radius: 50%;
    cursor: pointer;
}

.spinner-fourth-primary{
    width: var( --spinner-fourth-lg-widthHeight);
    height: var( --spinner-fourth-lg-widthHeight);
    border: 6px solid var(--spinner-fourth-background);
    border-top: 6px solid var(--spinner-fourth-front);
    border-radius: 50%;
    animation: spin 2s linear infinite;
    
 

}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
/*-----------------------------------------------------------------------------*/

/*Botones Mapa*/

/*Contenedor botón*/

.map-bt-container{
    justify-content: center;
    display: inline-block;
    position: relative;
    padding-right: 10px;
    padding-left: 10px;
    padding-top: 0px;
    padding-bottom: 0px;   
}

/*Icono botón*/

.map-btn-icon{
    fill: var(--mapButton-fourth-icon-fill);
    width: var(--mapButton-fourth-icon-width);
    height: var(--mapButton-fourth-icon-height);
    
}

/*Botón mapa Info*/

.info-map-btn-fourth{
    width: var(--mapButton-fourth-width);
    height: var(--mapButton-fourth-height);
    border-radius: var(--mapButton-fourth-borderRadius);
    border: none;
    background-color: var(--mapButton-fourth-default-background);  
    display: inline-block;
    box-shadow: var(--button-shadow-2);
   
}
.info-map-btn-fourth:hover,
.generic-map-btn-fourth:hover,
.generic-map-btn-left-fourth:hover,
.polygons-map-btn-left-fourth:hover,
.zoomMinus-map-btn-left-fourth:hover,
.zoomPlus-map-btn-left-fourth:hover,
.search-map-btn-left-fourth:hover{
    background-color: var(--mapButton-fourth-hoverSelect-background);
    --mapButton-fourth-hoverSelect-background: #ffeca1;
 

}

.info-map-btn-fourth:hover + .mapBtn-fourth-hover-label,
.generic-map-btn-fourth:hover + .mapBtn-fourth-hover-label,
.generic-map-btn-left-fourth:hover + .mapBtn-label-hover-left-fourth,
.polygons-map-btn-left-fourth:hover + .mapBtn-label-hover-left-fourth,
.zoomMinus-map-btn-left-fourth:hover + .mapBtn-label-hover-left-bottom-fourth,
.zoomPlus-map-btn-left-fourth:hover + .mapBtn-label-hover-left-fourth,
.search-map-btn-left-fourth:hover + .mapBtn-label-hover-left-fourth{ 
    display: inline-block;

}   

.generic-map-btn-fourth:focus,
.info-map-btn-fourth:focus,
.generic-map-btn-left-fourth:focus,
.polygons-map-btn-left-fourth:focus
.zoomMinus-map-btn-left-fourth:focus,
.zoomPlus-map-btn-left-fourth:focus,
.search-map-btn-left-fourth:focus{
    background-color: var(--mapButton-fourth-hoverSelect-background);
    
}

.generic-map-btn-fourth:focus ~ .mapBtn-fourth-select-label-layersBtn,
.generic-map-btn-fourth:focus ~ .card-fourth,
.generic-map-btn-fourth:focus ~ .accordionList-fourth,
.info-map-btn-fourth:focus ~ .mapBtn-label-select-fourth{

    display: inline-block;
    box-shadow: var(--button-shadow-2);
    border-radius: 24px;
    border: none;
}  

.mapBtn-fourth-hover-label{
    display: none;
    position:absolute;
    width: max-content;
    padding: var(--mapButton-fourth-hover-label-padding);
    border-radius: var(--mapButton-fourth-borderRadius);
    background-color: var(--mapButton-fourth-hover-label-background);
    margin-left: 85px;
    
       
}
.mapBtn-label-hover-title-fourth{
    margin: 0;
    text-align: center;
    padding: 0;
    font-weight: var(--fw-600-semiBold);
    font-size: var(--mapButton-fourth-hover-label-fontSize);
    color: var(--mapButton-fourth-hover-label-fontColor)!important;
    font-family: var(--mapButton-fourth-label-info-font);
    
}

.mapBtn-label-select-fourth{
    display: none;
    position: absolute;
    border-radius: var(--mapButton-fourth-borderRadius);
    padding: 16px;
    margin-left: 85px;
    text-align:left;
    width: max-content;
    background-color: var(--mapButton-fourth-hover-label-background);
    
} 

.mapBtn-label-select-h1{
    padding-bottom: 12px;
    margin: 0;
    font-weight: var(--fw-600-semiBold);
    font-size: var(--mapButton-fourth-select-h1-fontSize);
    color: var(--mapButton-fourth-select-h1-fontColor)!;
    font-family: var(--mapButton-fourth-select-h1-font);
    

}

.p-info-map-btn-body{
    padding-bottom: 12px;
    margin: 0;
    font-weight: var(--fw-400-regular);
    font-size: var(--mapButton-fourth-select-body-fontSize);
    color: var(--mapButton-fourth-select-body-fontColor);
    font-family: var(--mapButton-fourth-select-h1-font);
    
}

.mapBtn-fourth-select-label-layersBtn{
    display: none;
    position: absolute;
    cursor:pointer;
    border-radius: var(--mapButton-fourth-borderRadius);
    gap: 6px;
    margin: var(--mapButton-fourth-select-label-layersBtn-margin);
    padding: var(--mapButton-fourth-select-label-layersBtn-padding);
    font-weight: var(--fw-700-bold);
    height: fit-content;
    margin-left: 85px;
    text-align:left;
    font-weight: var(--fw-700-bold);
    background-color: var(--mapButton-fourth-select-label-layersBtn-background);
    font-size: var(--mapButton-fourth-select-h1-fontSize);
    color: var(--mapButton-fourth-select-h1-fontColor)!important;
    font-family: var(--mapButton-fourth-select-h1-font);
    
}
.mapBtn-fourth-select-label-layersBtn-title{
    font-weight:var(--fw-700-bold);
    font-size:var(--mapBtn-fourth-select-label-layersBtn-title-fontSize);
    color: var(--mapBtn-fourth-select-label-layersBtn-title-fontColor);
    margin:0px 0px 10px 0px;
    
}
.layersAccordions-container {
   
    display: flex;
    width: max-content;
    flex-direction: column;
    gap: 12px;
}

.layersAccordions-scrollBar-container{
    display: flex;
    flex-direction: row;
    gap: 8px;
    margin-top: 10px;

}

.card-fourth{
    display: none;
    position: absolute;
    cursor:pointer;
    margin-left: 85px;   
    width: max-content;
    height: max-content;
    padding: 16px;
    border-radius: 24px;
    background-color: var(--card-fourth-background) !important;
    
}

.card-fourth-title{
    font-weight: var(--fw-700-bold);
    color: var(--card-fourth-title-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--card-fourth-title-fontSize);
 
    margin: 0;


}
.card-fourth-visible{
    display: flex;
    flex-direction: column;
    width: max-content;
    height: max-content; 
    padding: var(--card-fourth-padding);
    border-radius: var(--card-fourth-borderRadius);
    background-color: var(--card-fourth-background) !important;
    
}

.card-image{
    width: var(--card-fourth-maxWidth-img);
   object-fit: cover;
    border-radius: var(--card-fourth-img-borderRadius);
    margin: var(--card-fourth-img-margin);
    
}

.card2-image{
    width: var(--card-fourth-secondary-maxWidth-img);
    object-fit: cover;
    border-radius: var(--card-fourth-secondary-img-borderRadius);
    
}


.card-fourth-h2{
    font-weight: var(--fw-600-semiBold);
    color: var(--card-fourth-h2-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--card-fourth-h2-fontSize);
    margin: var(--card-fourth-h2-margin);
    
}

.card-fourth-body{
    font-weight: var(--fw-400-regular);
    width: 367px;
    color: var(--card-fourth-body-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--card-fourth-body-fontSize);
    margin: var(--card-fourth-body-margin);
    
    
}

.card-fourth-body-medium{
    font-weight: var(--fw-500-medium);
    color: var(--card-fourth-body-fontColor);
    font-family: var(f--ont-montserrat);
    font-size: var(--card-fourth-body-fontSize);
    margin: var(--card-fourth-body-margin);
    
}
 .card-fourth .bt-fourth-plain,
 .card-fourth-visible .bt-fourth-plain{
    width: var(--button-fourth-secondary-plain-small-width);
    height: var(--button-fourth-secondary-plain-small-height);
    padding: 11px 2px 11px 2px;

}

.arrowBtn-tittle{
    display: flex;
    width: 461px;
    height: fit-content;
    flex-direction: row;
    align-items: center;
    gap: var(--card-fourth-arrowBtn-tittle-gap);
    
}

.icon-text{
    display: flex;
    flex-direction: row;
    gap: 8px;
    width: max-content;
}

.iconText-iconColor{
    height: 17px;
    fill: var(--card-fourth-body-iconColor);
    

}

.iconText-left{
    display: flex;
    flex-direction: column;
    width: max-content;

}
.iconText-container{
    width: var(--card-fourth-iconText-container-maxWidth);
    position: relative;
    border-radius: var(--card-fourth-iconText-container-borderRadius);
    background-color: var(--card-fourth-iconText-container-background);
    display: flex;
    flex-direction: row;
    align-items: flex-start;
   
    padding: var(--card-fourth-iconText-container-padding);
    gap: var(--card-fourth-iconText-container-gap);
    text-align: left;

}
/*Botón mapa genérico derecha*/

.generic-map-btn-fourth{
    width: var(--mapButton-fourth-width);
    height: var(--mapButton-fourth-height);
    border-radius: var(--mapButton-fourth-borderRadius);
    border: none;
    background-color: var(--mapButton-fourth-default-background);

    display: inline-block;
    align-items: center;
    box-shadow: var(--button-shadow-2);
    
}   

/*Botón mapa búsqueda izquierda*/

.search-map-btn-left-fourth{ 
    width: var(--mapButton-fourth-width);
    height: var(--mapButton-fourth-height);
    border-radius: var(--mapButton-fourth-borderRadius);
    border: none;
    background-color: var(--mapButton-fourth-default-background);  
    display: inline-block;
    align-items: center;
    box-shadow: var(--button-shadow-2);
    
}   

.mapBtn-label-hover-left-fourth{
    display: none;
    position:absolute;
    padding: 15.5px 20px;
    border-radius: 24px;
    right: 100px;
    width: max-content;
    background-color: var(--mapButton-fourth-hover-info-background);
    
}

.mapBtn-label-select-left{
    display: none;
    width: 216px;
    right: 100px;
    position:absolute;
    padding: 15.5px 20px;
    border-radius: 24px;
    width: max-content;
    background-color: var(--mapButton-fourth-hover-info-background);
   
}

.search-map-btn-left-fourth:focus ~ .input-fourth-default-nonVisible{ 
    display: flex;
    justify-content: center;
    position: absolute;
    width: max-content;
    height: max-content;
    align-items: center;
    animation: keepVisible 3s forwards;

}
@keyframes keepVisible {
    0% { opacity: 1; }
    100% { opacity: 1; }
}
    

.input-fourth-default-nonVisible{
    width: 283px;
    display:none;
   align-self: center;
    right: 100px;
    height: 45px;
    padding: 10px;
    margin: 0px;
    background-color: var(--input-default-background);
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-default-fontColor);
    
}

/*Botón mapa genérico izquierda*/

.generic-map-btn-left-fourth{
   width: 55px;
    border-radius: 24px;
    border: none;
    background-color: var(--mapButton-fourth-default-background);
    height: 51px;
    display: inline-block;
    align-items: center;
    box-shadow: var(--button-shadow-2);
    
}   

/*Botón mapa polígonos izquierda*/

.polygons-map-btn-left-fourth{ 
    width: var(--mapButton-fourth-width);
    height: var(--mapButton-fourth-height);
    border-radius: var(--mapButton-fourth-borderRadius);
    border: none;
    background-color: var(--mapButton-fourth-default-background);  
    display: inline-block;
    align-items: center;
    box-shadow: var(--button-shadow-2);
    
}   

.polygons-map-btn-left-fourth:focus ~ .buttons-container{ 
    display: inline-block;
    align-items: center;
}  
.buttons-container{
    display:none;
    position: absolute;
    right: 100px;
    width: max-content;
    flex-direction: row;
    height: 51px;
    margin: 0px;
    padding: 0px;

}
.buttons-container .bt-fourth-secondary{
    width: fit-content;
    display: inline-block;

}
/*Botón mapa zoom izquierda*/

.zoomPlus-map-btn-left-fourth{ 
    width: var(--mapButton-fourth-width);
    height: var(--mapButton-fourth-height);
    border: none;
    background-color: var(--mapButton-fourth-default-background);  
    border-radius: var(--zoomPlus-button-default-borderRadius);
    border-bottom: solid 1px var(--zoomPlus-button-fourth-borderColor);
    display: inline-block;
    align-items: center;
    box-shadow: var(--button-shadow-2);
    
}

.zoomMinus-map-btn-left-fourth{ 
    width: var(--mapButton-fourth-width);
    height: var(--mapButton-fourth-height);
    border-radius: 0px 0px 24px 24px ;
    border: none;
    background-color: var(--mapButton-fourth-default-background);
    border-radius: var(--zoomMinus-button-default-borderRadius);
    display: inline-block;
    border-top: solid 1px var(--zoomPlus-button-fourth-borderColor);
    box-shadow: var(--button-shadow-2);
  
   
} 

.mapBtn-label-hover-left-bottom-fourth{
    display: none;
    position:absolute;
    padding: 15.5px 20px;
    border-radius: 24px;
    right: 100px;
    top: 61px;
    width: max-content;
    background-color: var(--mapButton-fourth-hover-info-background);
   
}

.map-btn-select-secondary{
    padding: 15.5px 20px;
    height: 51px;
    width: fit-content;
    margin-left: 10px;
    border-radius: 24px;
    border: none;
    font-weight: var(--fw-600-semiBold);
    background-color: var(--mapButton-fourth-hover-info-background);
    font-size: var(--mapButton-fourth-select-secondary-fontSize);
    color: var(--mapButton-fourth-select-secondary-fontColor);
    font-family: var(--font-montserrat);
    --mapButton-fourth-select-secondary-padding: 15.5px 20px;
    --mapButton-fourth-select-secondary-height:51px;
    --mapButton-fourth-select-secondary-borderRadius:24px;
    --mapButton-fourth-select-secondary-background:#fff;
    --mapButton-fourth-select-secondary-fontSize:16px;
    --mapButton-fourth-select-secondary-fontColor:#0b3924;
}

.map-btn-select-secondary:hover{
    padding: 15.5px 20px;
    height: 51px;
    width: fit-content;
    margin-left: 10px;
    border-radius: 24px;
    background-color: var(--button-fourth-secondary-hover-background);
    border: 1px solid var(--button-fourth-secondary-hover-borderColor);
    font-size: var(--button-fourth-primary-size);
    color: var(--button-fourth-secondary-hover-fontColor);
    font-family: var(--button-fourth-primary);
    font-weight: var(--fw-600-semiBold);
    
}
.map-btn-select-secondary:focus{
    padding: 15.5px 20px;
    height: 51px;
    width: fit-content;
    margin-left: 10px;
    border-radius: 24px;
    background-color: var(--button-fourth-secondary-select-background);
    border: 1px solid var(--button-fourth-secondary-select-borderColor);
    font-size: var(--button-fourth-primary-size);
    color: var(--button-fourth-secondary-select-fontColor);
    font-family: var(--button-fourth-primary);
    font-weight: var(--fw-600-semiBold);
    
}

/*Acordeones*/
.accordion-fourth input {
    position: absolute;
    width:var(--accordion-fourth-large-maxWidth);
    height: 40px;
    opacity: 0;
    z-index: 0;
}

  .accordion-fourth{
    margin: 0px;
    border-radius: var(--accordion-fourth-borderRadius);
    overflow: hidden;
    width:var(--accordion-fourth-large-maxWidth);
    height: fit-content;
    
  }
  .accordion-fourth-label1,
  .accordion-fourth-label1b {
    display: flex;
    cursor: pointer;
    justify-content: space-between;
    max-width:var(--accordion-fourth-label-large-maxWidth);
    border-radius: var(--accordion-fourth-borderRadius);
    padding: var(--accordion-fourth-padding);
    align-items: center;
    font-weight: var(--fw-600-semiBold);
    box-shadow: var(--button-shadow-2);
    border: solid 1px var(--accordion-fourth-borderColor);
    background-color: var(--accordion-fourth-background);
    font-size: var(--accordion-fourth-h1-fontSize);
    color: var(--accordion-fourth-h1-fontColor);
    font-family: var(--accordion-fourth-h1);

}

.accordion-fourth-label2 {

    display: flex;
    cursor: pointer;
    justify-content: space-between;
    max-width:var(--accordion-fourth-label-large-maxWidth);
    border-radius: var(--accordion-fourth-borderRadius);
    padding: var(--accordion-fourth-padding);
    align-items: center;
    font-weight: var(--fw-600-semiBold);
    box-shadow: var(--button-shadow-2);
    border: solid 1px var(--accordion-fourth-borderColor);
    background-color: var(--accordion-fourth-background);
    font-size: var(--accordion-fourth-h1-fontSize);
    color: var(--accordion-fourth-h1-fontColor);
    font-family: var(--accordion-fourth-h1);
    
}

.accordion-fourth-iconTitle-container{
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
}
.chevron-svg{
    color: var(--accordion-fourth-icon-fill)!important;
   
    padding: 0px;
    margin: 0px;
    stroke-width:1px;
    stroke: var(--accordion-fourth-icon-fill);

}

.accordion-fourth-icon{
    width: 20px;
    height: 20px;
    fill: var(--accordion-fourth-icon-fill)!important;
    
    padding: 0px;
    margin: 0px;

}
  .accordion-content {
    max-height:0;
    display: flex;
    overflow: hidden;
    padding: var(--accordion-fourth-content-padding);
    margin: var(--accordion-fourth-content-margin);
    gap: 12px;
    width: 100%;
    border-radius: var(--accordion-fourth-content-borderRadius);
    background-color: var(--accordion-fourth-background);
    
    transition: all 0.35s;
  }
  
  input#tab1:checked ~ .accordion-content {
    max-height: 300px;
  }
  input#tab2:checked ~ .accordion-content {
    max-height: 300px;
  }
  input:checked ~ .accordion-fourth-label1 .chevron-svg,
  input:checked ~ .accordion-fourth-label1b .chevron-svg,
  input:checked ~ .accordion-fourth-label2 .chevron-svg{
    transform: rotate(180deg);
    transition: transform 0.35s ease;

   
  }
  input:checked ~ .accordion-fourth-label1,
  input:checked ~ .accordion-fourth-label1b,
  input:checked ~ .accordion-fourth-label2{
    border-radius: 0px;
  }
  
  .ign-img{
    height: 90px;
    width: 100%;
    object-fit: cover;
    border-radius: 18px;

  }

  .b-layers-btn{
    height: 172px;
    width: 132px;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    background-color: var(--b-layers-button-fourth-background);
    padding: 12px;
    align-items: center;
    box-sizing: border-box;
    gap: 8px;
    font-size: 14px;
    color: var(--button-fourth-secondary-select-borderColor);
   

}
.accordion .bt-fourth-secondary{
    width: var(--layers-btn-width);
    height: var(--layers-btn-height);
    --layers-btn-height: 50px;
    --layers-btn-width: 108px;
    
}
.b-layers-btns-container{
    display: flex;
    gap: 12px;
    align-items: center;
    margin: 12px 16px 14px 16px;
}

.layer-type{
    display: inline-flex;
    font-family: var(--font-montserrat);
    font-size: 14px;
    font-weight: var(--fw-400-regular);
    

}

/*Input Capas*/

/*Default*/

.infoLayers-input-container-fourth{ /*Contenedor del input*/
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    width: max-content;
    gap: 8px;
    padding:16px;
    align-items: flex-start;
    margin:0px;
    height: max-content;
    
}

.infoLayers-input-fourth-default{ /*Input*/
    width: max-content;
    width: var(--inputItem-fourth-large-maxWidth);
    padding:var(--inputItem-fourth-padding);
    height: max-content;
    border-radius: var( --inputItem-fourth-borderRadius);
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    background-color: var(--inputItem-fourth-default-background);
    border: 1px solid rgba(255, 255, 255, 0.6);
    align-items: center;
    justify-content: space-between;
    margin:0;
    text-align: left;
    
}

.txt-icon-btn-div-fourth-default{ /*Div con Icono, Texto y botón*/
    display: flex;
    flex-direction: row;
    padding: 0px;
    align-items: center;
    width: 100%;
    justify-content: space-between;

}

.txt-icon-div-fourth-default{ /*Div con Icono y Texto*/
    gap: 8px;
    display: flex;
    align-items: center;
    color: var(--inputItem-fourth-default-fontColor);
    font-weight: var(--fw-400-regular);
    font-size: var(--inputItem-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    

}

.infoLayers-icon-fourth-default{ /*Icono*/
    color:var(--inputItem-fourth-default-fontColor);

}



.infoLayers-input-fourth-select{ /*Input*/
    height: 60px;
    width: 378px;
    gap:8px;
    padding: 12px 16px;
    margin: 0px;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    background-color: var(--inputItem-fourth-default-background);
    border: 1px solid rgba(255, 255, 255, 0.6);
    align-items: flex-start;
    font-size: 14px;
    text-align: left;
    font-size: var(--button-fourth-primary-size);
    font-family: var(--button-fourth-primary);
   

}

.txt-icon-btn-div-fourth-select{ /*Div con Icono, Texto y botón*/
    display: flex;
    flex-direction: row;
    padding:0px;
    align-items: center;
    width: 100%;
    gap: 26px;
  
}

.txt-icon-div-fourth-select{ /*Div con Icono y Texto*/
    justify-content: space-between;
    width: 144px;
    display: flex;
    align-items: center;
    color: var(--inputItem-fourth-default-fontColor);
    font-weight: var(--fw-400-regular);
    font-size: var(--inputItem-fourth-default-fontSize);
    

}

.iconsButtons-container-fourth{ /*Div Botones Icono (flechas e info)*/
    gap: 8px;
    display: flex;
    align-items: center;
}

.textIconDiv-iconsButtonsContainer{ /*Div Icono-Texto + Div Botones Icono */
   width: 100%;
   justify-content: space-between;
    display: flex;
    align-items: center;

}

.slider-container{ /*Div con Icono, Texto y botón*/
    display: flex;
    height: 18px;
    flex-direction: row;
    padding: 0px;
    align-items: center;
    width: max-content;
    gap: 26px;
  
}
/*Leyenda*/

.LegendContainer-infoLayers-Input{ /*Contenedor leyenda*/
    display: flex;
    flex-direction: column;
    height: max-content;
    width: max-content;
    gap: 12px;
    border-radius: 24px;
    padding: 12px 16px;
    background-color: var(--inputItem-fourth-select-legend-background);
    color: var(--inputItem-fourth-select-legend-title-fontColor);
    font-family: var(--font-montserrat);
    font-weight: var(--fw-400-regular);
    font-size: var(--inputItem-fourth-select-legend-title-fontSize);
    

}

ul{
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 10px;
    display: flex;
    flex-direction: column;
    

}

.legend-fourth{
    align-items:center;
    display: flex;
    flex-direction: row;
    gap: 8px;
    height: 18px;
    font-weight: var(--fw-400-regular);
    font-size: var(--inputItem-fourth-select-legend-body-fontSize);
    color: var(--inputItem-fourth-select-legend-body-fontColor);
    font-family: var(--font-montserrat);
    
   

}
.legendSquare{ 
    height: var(--legendSquare-height);
    width: var(--legendSquare-width);
    border-radius: var(--legendSquare-borderRadius);
    min-width: 18px;
   
}

.legendCircle{ 
    height: 12px;
    width: 12px ;
    border-radius: 12px;
    

}
.legendLayersInput-Container{
    display: flex;
    flex-direction: row;
    gap: 50px;
}

.inputList-item-container-fourth{
    max-width: var(--inputList-item-container-fourth-maxWidth);
    height: var(--inputList-item-container-fourth-heigh);
    display: flex;
    flex-direction: row;
    box-shadow: var(--button-shadow);
    border-radius: var(--inputList-item-container-fourth-borderRadius);
    background-color: var(--inputList-fourth-item-background);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-sizing: border-box;
    margin: var(--inputList-item-container-fourth-margin);
    align-items: center; 
    padding: var(--inputList-item-container-fourth-padding);
    justify-content: space-between;
    
}

.inputList-item-container-maximize-fourth{
    max-width: 571px;
    max-height: 930px;
    display: flex;
    padding: 16px;
    flex-direction: column;
    gap: 12px;
    border-radius: 24px;
    background-color: var(--inputList-fourth-item-background);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-sizing: border-box;
    margin: 0px;
    align-items: center; 

   
    
}
.icon-item-container{
    width: fit-content;
    height: fit-content;
    display: flex;
    flex-direction: row;
    padding: 0;
    margin: 0;  
    margin-right: 20px;
    gap: 8px;
    align-items: center; 
}
.input-icon{
    fill: var(--inputItem-fourth-default-iconColor);
    
}
.inputList-item-iconContainer{
    width: fit-content;
    height: 17px;
    margin: 0;
}

.itemName-container {
    display: flex;
    height: fit-content;
    flex-direction:column;
    gap: 0px;   
    width: 100%;     
    text-align: left;
    --font-montserrat: Montserrat;
    --inputItem-fourth-default-title:14px;
}

.itenName{
    padding: 0;
    margin: 0px;
    line-height: normal;
    font-size: var(--inputItem-fourth-default-title);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    color: var(--inputItem-fourth-default-fontColor);
    
}

.scroll-bar-fourth-itemList{
    position: relative;
    width: 9px;
    margin: 0;
   
}
.scroll-bar-fourth-itemList-background{
    width: 9px;
    margin: 0;
    padding: 0;
    position: relative;
    border-radius: 6px;
    background-color:var(--scrollBar-fourth-backgroundColor);
    max-height: var(--scrollBar-fourth-extraLarge-width);
    min-height: var(--scrollBar-fourth-large-width);
    overflow-y: scroll;
    
}
.scroll-bar-fourth-itemList-handle{
    width: 9px;
    margin: 0;
    padding: 0;
    position: absolute;
    display: inline;
    border-radius: 20px;
    background-color: var(--scrollBar-fourth-handle);
    height: 30px;
    animation: scroll-down 5s infinite alternate ease-in-out;
    
}
@keyframes scroll-down {
    0%{
        top:0;
        
    }
    100%{
        top: calc(100% - 50px); 
    }
}

.input-fourth-label{
    display: flex;
    flex-direction: column;
    font-weight: var(--fw-600-semiBold);
    background-color: transparent;
    font-size: var(--input-fourth-label-fontSize);
    font-family: var(--font-montserrat);
    color: var(--input-fourth-label-fontColor);
    text-align: left;
    


}

.input-button-container{
    display: flex;
    background-color: transparent;
    flex-direction: row;
    align-items: end;
    width: var(--card-fourth-input-button-container-maxWidth);
    height: var(--card-fourth-input-button-container-height);
    gap:var(--card-fourth-input-button-container-gap);
    margin: var(--card-fourth-input-button-container-margin);
    
}
.inputLabel-container{
    display: flex;
    flex-direction: column;
    width: 227px;
    gap: 8px;

}
.input-button-container .bt-fourth-secondary{
    width:var(--button-fourth-medium-width);
    height: var(--button-fourth-medium-height);
}
.card-fourth .bt-fourth-secondary{
    width:var(--button-fourth-small-width);
    height: var(--button-fourth-small-height);
}

 /*dataContainer*/

 .dataContainer-fourth{
    width: var(--dataContainer-fourth-maxWidth);
    display: flex;
    flex-direction: column;
    border-radius: var(--dataContainer-fourth-borderRadius);
    height: max-content;
    background-color: var(--dataContainer-fourth-container-background);
    padding: var(--dataContainer-fourth-padding);
    gap: var(--dataContainer-fourth-gap);
    justify-content: center;
    align-items: center;
    margin: var(--dataContainer-fourth-margin);
 
 }

 .dataContainer-fourth-illustrationText-Container{
    display: flex;
    width: 100%;
    flex-direction: row;
    gap:40px;
    align-items: center;
   
 }

 .dataContainer-fourth-illustrationTextContainer-subContainer{
    display: flex;
    flex-direction: row;
    gap: 12px;
    width: 207px;
    align-items: center;
   

 }
 .dataContainer-fourth-illustrationContainer{
    min-width: 45px;
    width: fit-content;
    height: fit-content;
 }

 .dataContainer-fourth-textContainer-mainH3{
    font-size: var(--dataContainer-fourth-h3-fontSize);
    font-weight: var(--fw-600-semiBold);
    margin:0;
    color: var(--dataContainer-fourth-textContainer-mainH3);
    font-family: var(--font-montserrat);
    
 }

 .dataContainer-fourth-textContainer-orangeH3{
    color: var(--dataContainer-fourth-textContainer-orangeH3);
    font-size: var(--dataContainer-fourth-h3-fontSize);
    
    font-weight: var(--fw-600-semiBold);
    margin:0;
   
 }
 .dataContainer-fourth-textContainer-greenH3{
    color: var(--dataContainer-fourth-textContainer-greenH3);
    font-size: var(--dataContainer-fourth-h3-fontSize);
    margin: 0;
    font-weight: var(--fw-600-semiBold);
  

 }
 .dataContainer-fourth-textContainer{
    display: flex;
    flex-direction: column;
    gap: 0px;
    height: min-content;
    width: 100%;
 }
 /*------------------------------------------------------------------------*/
 /*Tabs*/

 .tabs-fourth{
    width: 100%;
    max-width: var(--tabs-fourth-maxWidth);
    display: inline;
    
    background: var(--tabs-fourth-background);
    --tabs-fourth-maxWidth:475px;
    --tabs-fourth-background:#fff;
 }

 .tabs-fourth input[type="radio"] {
    display: none;
}

 .tabs-fourth-tab{
    padding:var(--tabView-fourth-tab-padding);
    background-color: var(--tabView-fourth-tab-background);
    cursor: pointer;
    text-align: center;
    font-size: var(--tabView-fourth-fontSize);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    color: var(--tabView-fourth-select-fontColor);
    display: inline-block;
    --tabView-fourth-tab-padding:12.5px 17.5px;
    --tabView-fourth-tab-background:#fff;
 }

 .tabs-fourth-content{
    border-top:1px solid #C8D9D1;
    
 }

 .tabs-fourth-especiesContent,
 .tabs-fourth-habitatsContent {
     display: none;
     width: 100%;
 }

 input[type="radio"]:checked + label{
    border-radius: var(--tabView-fourth-select-borderRadius);
    background-color: var(--tabView-fourth-select-background);
    color: var(--tabView-fourth-select-fontColor);
    
 }

 

 #especies-tab:checked ~ .tabs-fourth-content .tabs-fourth-especiesContent{
    display: block;
 } 

 #habitats-tab:checked ~ .tabs-fourth-content .tabs-fourth-habitatsContent{
    display: block;
 }

 .tabs-fourth-h1{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--tabView-fourth-h1-fontSize);
    color: var(--tabView-fourth-h1-fontColor);
    
 }
 .tab-fourth-illustration{
    width: 60px;

}
.tab-fourth-pie{
    max-width: 170px;
    max-height: 170px;
    

}
 .tab-fourth-content-illustrationH1Container{
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 0px;
    align-items: center;
 
 }

 .illustration-chips-container{
    display: flex;
    flex-direction: row;
    align-items: center;
    padding:var(--tabView-fourth-tabs-content-illustration-chips-container-padding);
    width: var(--tabView-fourth-tabs-content-illustration-chips-container-maxWidth);

 }
 .illustrationH1-container{
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 0px;
    align-items: center;
    width: 122px;
   

 }
 .pie-container{
    display: flex;
    flex-direction: row;
    gap: 12px;
    padding: 16px 0px;
    align-items:end;
    width: 100%;
    height: 170px;
    margin-left: 30px;
   

 }
 .chips-container{
    display: flex;
    flex-direction: row;
    max-width: 370px;
    flex-wrap: wrap;
    gap: 4px 6px;
    padding: 0px 12px;
 }

/*Inputs*/

 .input-fourth-default{
    width: var(--input-fourth-default-width-mediumSize-group);
    padding-left: 12px;
    display: flex;
    position: relative;
    align-self: center;
    height: var(--input-fourth-group-height)!important;
    margin: 0px;
    background-color: var(--input-default-background) !important;
    border-radius: var(--input-default-borderRadius);
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-default-fontColor);
    
}

.input-fourth-default:hover{
    width: 227px;
    padding-left: 12px;
    display: flex;
    position: relative;
    align-self: center;
    outline: none;
    height: 40px !important;
    margin: 0px;
    background-color: var(--input-fourth-hover-background) !important;
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-hover-borderColor);
    color: var(--input-fourth-default-fontColor);
    
}
.input-fourth-default:focus{
    width: 227px;
    padding-left: 12px;
    display: flex;
    position: relative;
    align-self: center;
    outline: none;
    height: 40px !important;
    margin: 0px;
    background-color: var(--input-default-background) !important;
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-default-fontColor);
    
    box-shadow: 0px 0px 0px 2.8px rgba(98, 158, 131, 0.51);
    --fw-400-regular: 400;
}

.input-fourth-default-icons {
    flex: 1;
    height: 100%;
    
    border: none;
    outline: none;
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    background: transparent;
    color: var(--input-fourth-default-fontColor);
    padding-left: 2px;

}
.input-fourth-sm{
    width:var(--input-fourth-small-width);
   
}
.input-fourth-md{
    width:var(--input-fourth-medium-width);
    
}
.input-fourth-lg{
    width:var(--input-fourth-large-width);
    
}
.input-fourth-xl{
    width:var(--input-fourth-extraLarge-width);
    
}
.input-fourth-default-group{
    padding: var(--input-fourth-group-padding);
    position: relative;
    display: flex;
    align-self: center;
    align-items: center;
    height: var(--input-fourth-group-height);
    margin: var(--input-fourth-group-margin);
    gap:var(--input-fourth-group-gap);
    background-color: var(--input-default-background) !important;
    border-radius: var( --input-fourth-group-borderRadius);
  
    border: 1px solid var(--input-fourth-default-borderColor);
 
}
.input-fourth-default-group:hover{
    background-color: var(--input-fourth-group-hover-background) !important;
    border: 1px solid var(--input-fourth-group-hover-borderColor);
    
}

.input-fourth-default-group:focus-within{
    background-color: var(--input-default-background);
    border: 1px solid var(--input-fourth-default-borderColor);
    box-shadow: var(--input-fourth-group-focus-focusBorder);
}

.input-fourth-invalid-group{
    padding: var(--input-fourth-group-padding);
    height: var(--input-fourth-group-height);
    margin: var(--input-fourth-group-margin);
    gap:var(--input-fourth-group-gap);
    background-color: var(--input-default-background) !important;
    border-radius: var( --input-fourth-group-borderRadius);
    display: flex;
    align-self: center;
    border: 1px solid var(--input-fourth-group-invalid-borderColor);    
}

.input-fourth-invalid-group:hover{
    background-color: var(--input-fourth-group-hover-background);  
    border: 1px solid var(--input-fourth-group-invalid-borderColor);

    
}
.input-fourth-invalid-group:focus-within{
    background-color: var(--input-default-background);
    border-radius: var( --input-fourth-group-borderRadius);
    border: 1px solid var(--input-fourth-group-invalid-borderColor);    
    box-shadow: var(--input-fourth-group-invalid-focusBorder);

}

.input-icon{
    width: var(--input-fourth-group-icon-width);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    

}

.input-fourth-filled-group{
    width: 211px;
    padding: 0px 12px;
    display: flex;
    align-self: center;
    margin: 0px;
    gap:10.5px;
    height: 40px;
    background-color: var(--input-default-background);
    border-radius: 24px;
    border: 1px solid var(--input-fourth-filled-borderColor);
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    color: var(--input-fourth-filled-fontColor);
    

}

.input-fourth-filled-icons {
    flex: 1;
    height: 100%;
    border: none;
    outline: none;
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    background: transparent;
    color: var(--input-fourth-filled-fontColor);
    font-weight: var(--fw-400-regular);
    

}

.input-fourth-filled-group:focus-within{

    background-color: var(--input-default-background);
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-filled-fontColor);

    box-shadow: 0px 0px 0px 2.8px rgba(98, 158, 131, 0.51);
   
}
.input-fourth-filled-group:hover{
    background-color: var(--input-fourth-hover-background) !important;
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-hover-borderColor);
    color: var(--input-fourth-default-fontColor);
    
}

.input-fourth-disabled-group{
    opacity: 0.5;
    width: 211px;
    padding: 0px 12px;
    display: flex;
    align-self: center;
    height: 40px;
    margin: 0px;
    gap:10.5px;
    background-color: var(--input-default-background) !important;
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-default-fontColor);
    
}

.input-fourth-disabled-icons {
    flex: 1;
    height: 100%;
    border: none;
    outline: none;
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    background: transparent;
    color: var(--input-fourth-default-fontColor);
    padding-left: 2px;
}

.input-fourth-disabledFilled-group{
    opacity: 0.5;
    width: 211px;
    padding: 0px 12px;
    display: flex;
    align-self: center;
    height: 40px;
    margin: 0px;
    gap:10.5px;
    background-color: var(--input-default-background) !important;
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-default-fontColor);
   
}
/*------------------------------------------------------------*/

/*Buscador*/

.navBar-fourth-subContainer{
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--navBar-fourth-subContainer-gap);
    
    border-radius: var(--navBar-fourth-container-borderRadius);
    align-items: center;
    

}

.navBar-fourth-container{
    width: 100%;
    height: var(--navBar-fourth-container-height);
    padding:var(--navBar-fourth-container-padding);
    justify-content: space-between;
    display: flex;
    flex-direction: row;
    border-radius: var(--navBar-fourth-container-borderRadius);
    box-shadow: var(--navBar-primary-default-shadow);
    background-color: var(--navBar-fourth-container-background);

}
.navBar-fourth-searcherContainer{
    display: flex;
    flex-direction: row;
    gap: var(--navBar-fourth-searcherContainer-gap);
    max-width: var(--navBar-fourth-searcherContainer-maxWidth);


}

.navBar-fourth-searcherContainer > .input-fourth-default-group{
    max-width: 360px;
    min-width: 250px;
}
.navBar-fourth-searcherContainer > .input-fourth-default-icons{
    max-width: 310px;
    min-width: 220px;
    padding: 0;
}
.navBar-fourth-searcherContainer-textIconContainer{
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    width: max-content;
    margin: 0;
}
.navBar-fourth-icon{
    fill: var(--navBar-fourth-icon-fill) ;
   

}

.navBar-fourth-searcherContainer-h1{
    font-size: var(--navBar-fourth-h1-fontSize);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    color: var( --navBar-fourth-h1-fontColor);
    
    margin: 0;
}

.navBar-fourth-default-searcherTabs{
    display: flex;
    padding: var(--navBar-fourth-searcherTabs-padding);
    max-width: var(--navBar-fourth-searcherTabs-maxWidth);
    border-radius: var(--navBar-fourth-searcherTabs-borderRadius);
    background-color: var(--navBar-fourth-searcherTabs-background) ;
    
    max-height: var(--navBar-fourth-searcherTabs-maxheight);
    margin: var(--navBar-fourth-searcherTabs-margin);

}
.navBar-fourth-open-searcherTabs{
    display: flex;
    padding: 16px;
    max-width: 477px;
    border-radius: 24px;
    background-color: var(--navBar-fourth-searcherTabs-background) ;
   
   height: fit-content;
    margin: 0px 10px 0px 170px;

}

.navBar-fourth-tabs{
    width: var(--navBar-fourth-tabs-width);
    max-width: var(--navBar-fourth-tabs-maxWidth);
    display: inline;
    align-self: center;
    background: #fff;
    --navBar-fourth-tabs-width:445px;
    --navBar-fourth-tabs-maxWidth:475px;
 }

 .navBar-fourth-tabs input[type="radio"] {
    display: none;
}

.navBar-fourth-tabs-tab{
    padding: var(--navBar-fourth-tabs-tab-padding);
    max-width: var(--navBar-fourth-tabs-tab-maxWidth);
    height: var(--navBar-fourth-tabs-tab-height);
    margin: var(--navBar-fourth-tabs-tab-margin);
    background-color: var(--navBar-fourth-tabs-tab-background);
    color: var(--navBar-fourth-tabs-tab-fontColor);
    cursor: pointer;
    text-align: center;
    align-items: center;
    gap: var(--navBar-fourth-tabs-tab-gap);
    font-size: var(--navBar-fourth-tabs-tab-fontSize);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    color: var(--navBar-fourth-tabs-tab-fontColor);
    display: inline-flex;
   
 }
 .navBar-fourth-tabs-secondaryTab{
    padding: var(--navBar-fourth-tabs-secondaryTab-padding);
    max-width: var(--navBar-fourth-tabs-secondaryTab-maxWidth);
    max-height: var(--navBar-fourth-tabs-secondaryTab-maxHeight);
    margin: var(--navBar-fourth-tabs-secondaryTab-margin);
    background-color: var(--navBar-fourth-tabs-secondaryTab-background);
    color: var(--navBar-fourth-tabs-secondaryTab-fontColor);
    cursor: pointer;
    text-align: center;
    align-items: center;
    gap: var(--navBar-fourth-tabs-secondaryTab-gap);
    font-size: var(--navBar-fourth-tabs-secondaryTab-fontSize);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    color: var(--navBar-fourth-tabs-secondaryTab-fontColor);
    
    display: inline-flex;


 }
 .navBar-fourth-tabs-content{
    display: flex;
    flex-direction: column;
    gap:24px;
 }
 .navBar-fourth-tabs-tab-open{
    padding: 0px 12px 10px;
    max-width: 211px;
    max-height: 20px;
    margin: 0px;
    background-color: #fff;
    color: #07291a;
    cursor: pointer;
    text-align: center;
    align-items: center;
    gap: 10px;
    font-size: var(--tabView-fourth-fontSize);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    color: var(--tabView-fourth-select-fontColor);
    
    --fw-600-semiBold: 600;
    display: inline-flex;

 }

 .navBar-fourth-acotadosContent{
     display: flex;
     flex-direction: column;
     width: 100%;
     margin-top: 0px;

 }

 .navBar-fourth-default-searcherTabs input[type="radio"]:checked + label{
    border-bottom: 2px solid var(--navBar-fourth-tabs-select-borderColor);
    color: var(--tabView-fourth-select-fontColor);
    background-color: #fff;
    
 }

 .navBar-fourth-open-searcherTabs input[type="radio"]:checked + label{
    border-bottom: 2px solid var(--navBar-fourth-tabs-select-borderColor);
    color: var(--tabView-fourth-select-fontColor);
    background-color: #fff;
   
    
 }

 .navBar-fourth-tabs-content-h3{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--navBar-fourth-tabs-content-h3-fontSize);
    color: var(--navBar-fourth-tabs-content-h3-fontColor);
    margin:var(--navBar-fourth-tabs-content-h3-margin);
    --navBar-fourth-tabs-content-h3-fontSize:14px;
    --navBar-fourth-tabs-content-h3-fontColor:#2F473C;
    --navBar-fourth-tabs-content-h3-margin:0px;
 }

 .tabs-fourth-h1{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--tabView-fourth-h1-fontSize);
    color: var(--tabView-fourth-h1-fontColor);
    
 }

.navBar-fourth-tabs-content-inputChips-container{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding:var(--navBar-fourth-tabs-content-inputChips-container-padding);
    max-width: var(--navBar-fourth-tabs-content-inputChips-container-maxWidth);
    gap: var(--navBar-fourth-tabs-content-inputChips-container-gap);
    margin: var(--navBar-fourth-tabs-content-inputChips-container-margin);
}

 .navBar-fourth-tabs-content-inputChips-container .chips-container{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0;
    flex-wrap: nowrap;
    max-width: 445px;

 }

 .navBar-fourth-tabs-content-inputChips-container .tabs-fourth-h3{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--tabView-fourth-h3-fontSize);
    color: var(--tabView-fourth-h3-fontColor);
   
    margin: 0;
 }

 .navBar-fourth-tabs-icon{
    max-width: 23px;
    max-height: 20px;
    fill: var(--navBar-fourth-tabs-iconColor);
    
 }

 .dropDown-container{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding:10px 0px 0px 0px;
    max-width: 445px;
    gap: 45px;
    margin: 0px 0px 16px 0px;

 }

 .dropDown-container .tabs-fourth-h3{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--tabView-fourth-h3-fontSize);
    color: var(--tabView-fourth-h3-fontColor);
    margin: 0;
 }

 .dropDown-container .chips-container{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0;
    flex-wrap: nowrap;
    max-width: 507px;

 }

 .dropDown-fourth-default{
    display: flex;
    gap: 10px;
    flex-direction: column;
 }

 .dropDown-fourth-default-input{
    width: 200px;
    padding: 0px 12px;
    display: flex;
    align-self: center;
    height: 40px !important;
    margin: 0px;
    background-color: var(--input-default-background) !important;
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-default-fontColor);
    
 }

 .dropDown-fourth-default-input:hover{
    width: 200px;
    padding: 0px 12px;
    display: flex;
    align-self: center;
    outline: none;
    height: 40px !important;
    margin: 0px;
    background-color: var(--input-fourth-hover-background) !important;
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-hover-borderColor);
    color: var(--input-fourth-default-fontColor);
    
 }

 .dropDown-fourth-default-input:focus{
    width: 200px;
    padding: 0px 12px;
    display: flex;
    align-self: center;
    outline: none;
    height: 40px !important;
    margin: 0px;
    background-color: var(--input-default-background) !important;
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-default-fontColor);
    
    box-shadow: 0px 0px 0px 2.8px rgba(98, 158, 131, 0.51);
    --fw-400-regular: 400;
}

.dropDown-fourth-default-label{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--dropDown-fourth-default-label-fontSize);
    color: var(--dropDown-fourth-default-label-fontColor);
   
    --fw-600-semiBold: 600;

}

.navBar-fourth-buttonsContainer{
    display: flex;
    flex-direction: row;
    width: 200px;
    gap: 16px;
 }
 
/*Buscador*/
.navBar-fourth-subContainer{
    display: flex;
    flex-direction: row;
    gap: 12px;

    
    border-radius: 24px;


    align-items: center;
    
   
}

.navBar-fourth-container{
    width: fit-content;
    height: 42px;
    padding:17px 24px ;
    justify-content: space-between;
    display: flex;
    flex-direction: column;
    gap:min(5vw, 20px);
    flex-direction: row;
    border-radius: 24px;
    margin-left: 10px;    
   
    align-items:flex-start;
    box-shadow: var(--topbar-primary-default-shadow);
    background-color: var(--navBar-fourth-container-background);
    --navBar-fourth-container-background: rgba(46, 77, 63, 0.9);
    --topbar-primary-default-shadow: -4px -4px 10px rgba(255, 255, 255, 0.2), 4px 4px 10px rgba(255, 255, 255, 0.2);
}
.navBar-fourth-searcherContainer{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap:16px;
    margin: 0;
}
.navBar-fourth-searcherContainer-textIconContainer{
    display: flex;
    flex-direction: row;
    gap:8px;
    align-items: center;
}

.navBar-fourth-searcherContainer-h1{
    font-size: var(--navBar-fourth-searcherContainer-h1-fontSize);
    font-weight:var(--fw-600-semiBold);
    color:var(--navBar-fourth-searcherContainer-h1-fontColor);
    --navBar-fourth-searcherContainer-h1-fontSize:20px;
    --navBar-fourth-searcherContainer-h1-fontColor:#fff;
}
.navBar-fourth-icon{
    fill: var(--navBar-fourth-icon-fill);
    fill: var(--navBar-fourth-icon-fill) ;
    --navBar-fourth-icon-fill: #FFECA1;

    background-color: var(--navBar-fourth-searcherTabs-background) ;
    --navBar-fourth-searcherTabs-background:#fff;
    max-height: 208px;
    margin: 12px 10px 0px 170px;
    margin: 0px 10px 0px 170px;
}

.navBar-fourth-default-searcherTabs{
    display: flex;
    padding: 16px;
    max-width: 477px;
    border-radius: 24px;
    background-color: var(--navBar-fourth-searcherTabs-background) ;
    --navBar-fourth-searcherTabs-background:#fff;
    max-height: 208px;
    margin: 12px 10px 0px 170px;
}
.navBar-fourth-open-searcherTabs{
    display: flex;
    padding: 16px;
    max-width: 477px;
    border-radius: 24px;
    background-color: var(--navBar-fourth-searcherTabs-background) ;
    --navBar-fourth-searcherTabs-background:#fff;
   min-height: 469px;
    margin: 12px 10px 0px 170px;
}

.navBar-fourth-default-searcherTabs input[type="radio"]:checked + label{
    border-bottom: 2px solid var(--navBar-fourth-tabs-select-borderColor);
    color: var(--tabView-fourth-select-fontColor);
    background-color: #fff;
} 
.navBar-fourth-open-searcherTabs{
    background-color: var(--navBar-fourth-searcherTabs-background) ;
    --navBar-fourth-searcherTabs-background:#fff;
   min-height: 469px;
    margin: 12px 10px 0px 170px;
    margin: 0px 10px 0px 170px;
    width: 445px;
    max-width: 475px;
    display: inline;
    align-items: center;
    align-self: center;
    background: #fff;
    display: inline-flex;
 }
 .tabs-fourth-h1{
    font-weight: var(--fw-600-semibold);
    font-size: var(--tabView-fourth-h1-fontSize);
    color: var(--tabView-fourth-h1-fontColor);
}
.navBar-fourth-tabs{
    width: 445px;
    max-width: 475px;
    display: inline;
    align-items: center;
    background: #fff;
 }
 .navBar-fourth-tabs input[type="radio"] {
    display: none;
}
.navBar-fourth-tabs-tab{
    padding: 0px 12px 10px;
    max-width: 211px;
    max-height: 30px;
    margin: 12px 0px;
    background-color: #fff;
    color: #07291a;
    cursor: pointer;
    text-align: center;
    align-items: center;
    gap: 10px;
    font-size: var(--tabView-fourth-fontSize);
    font-weight: var(--fw-600-semibold);
    font-family: var(--font-montserrat);
    color: var(--tabview-fourth-select-fontcolor);
    --tabView-fourth-fontSize: 15px;
    --tabview-fourth-select-fontcolor: #0b3924;
    --fw-600-semibold: 600;
    display: inline-flex;
 }
 .navBar-fourth-tabs-centerTab{
    padding: 0px 12px 10px;
    max-width: 211px;
    max-height: 30px;
    margin: 12px 8px 0px 8px;
    background-color: #fff;
    color: #07291a;
    cursor: pointer;
    text-align: center;
    align-items: center;
    gap: 10px;
    font-size: var(--tabView-fourth-fontSize);
    font-weight: var(--fw-600-semibold);
    font-family: var(--font-montserrat);
    color: var(--tabview-fourth-select-fontcolor);
    --tabView-fourth-fontSize: 15px;
    --tabview-fourth-select-fontcolor: #0b3924;
    --fw-600-semibold: 600;
    display: inline-flex;
 }
 .navBar-fourth-acotadosContent{
     display: flex;
     flex-direction: column;
     width: 100%;
     margin-top: 0px;
 }

.top-fourth-menu-item{
        margin: 0;
        align-items: center;
    }
 .navBar-fourth-tabs-tab-open{
    padding: 0px 12px 10px;
    max-width: 211px;
    max-height: 30px;
    margin: 12px 0px;
    background-color: #fff;
    color: #07291a;
    cursor: pointer;
    text-align: center;
    align-items: center;
    gap: 10px;
    font-size: var(--tabView-fourth-fontSize);
    font-weight: var(--fw-600-semibold);
    font-family: var(--font-montserrat);
    color: var(--tabview-fourth-select-fontcolor);
    --tabView-fourth-fontSize: 15px;
    --tabview-fourth-select-fontcolor: #0b3924;
    --fw-600-semibold: 600;
    display: inline-flex;
}

 .navBar-fourth-tabs-secondaryTab{
    padding: 0px 12px 10px;
    max-width: 211px;
    max-height: 30px;
    
 }



.navBar-fourth-buttonsContainer{
    display: flex;
    flex-direction: row;
   
    width: 200px;
    gap: 16px;
 }

.navBar-fourth-searcherContainer > .input-fourth-default-group{
        max-width: 360px;

        min-width: 250px;
}

.navBar-fourth-searcherContainer > .input-fourth-default-icons{
        max-width: 310px;

        min-width: 220px;
        padding: 0;
}


 .inputChips-container .tabs-fourth-h3{
    font-weight: var(--fw-600-semibold);
    font-size: var(--tabView-fourth-h3-fontSize);
    color: var(--tabView-fourth-h3-fontColor);
    --tabView-fourth-h3-fontSize: 14px;
    --tabView-fourth-h3-fontColor: #2F473C;
    --fw-600-semibold: 600;
    margin: 0;
 }
 .navBar-fourth-tabs-icon{
    max-width: 23px;
    max-height: 20px;
    fill: var(--navBar-fourth-tabs-iconColor);
    --navBar-fourth-tabs-iconColor: #2f473c;
 }
 .dropDown-container{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding:10px 0px 0px 0px;
    max-width: 445px;
    gap: 45px;
    margin: 0px 0px 16px 0px;
 }
 .dropDown-container .tabs-fourth-h3{
    font-weight: var(--fw-600-semibold);
    font-size: var(--tabView-fourth-h3-fontSize);
    color: var(--tabView-fourth-h3-fontColor);
    --tabView-fourth-h3-fontSize: 14px;
    --tabView-fourth-h3-fontColor: #2F473C;
    --fw-600-semibold: 600;
    margin: 0;
 }
 .dropDown-container .chips-container{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0;
    flex-wrap: nowrap;
    max-width: 507px;
 }
 .dropDown-fourth-default{
    display: flex;
    gap: 10px;
    flex-direction: column;
 }
 .dropDown-fourth-default-input{
    width: 200px;
    padding: 0px 12px;
    display: flex;
    align-self: center;
    height: 40px !important;
    margin: 0px;
    background-color: var(--input-default-background) !important;
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-bordercolor);
    color: var(--input-fourth-default-fontcolor);
    --input-fourth-default-fontcolor: #537063;
    --input-default-background: #fff;
    --input-fourth-default-bordercolor: #a5b7af;
    --font-montserrat: Montserrat;
    --input-fourth-default-fontSize: 14px;
    --fw-400-regular: 400;
 }
 .dropDown-fourth-default-input:hover{
    width: 200px;
    padding: 0px 12px;
    display: flex;
    position: relative;
    align-self: center;
    outline: none;
    height: 40px !important;
    --input-fourth-hover-background: rgba(241, 255, 249, 0.65);
    --input-fourth-hover-bordercolor: #9cb7ab;
    --fw-400-regular: 400;
}
/*------------------------------------------------------------*/
/*Log-in/Sign-up*/

.logIn-fourth-container{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: var(--logIn-fourth-container-maxWidth);
    min-height:var(--logIn-fourth-container-minHeight);
    border-radius: var(--logIn-fourth-container-borderRadius);
    padding: var(--logIn-fourth-container-padding);
    margin: var(--logIn-fourth-container-margin);
    gap: var(--logIn-fourth-container-gap);
    background-color: var(--logIn-fourth-container-background);
   
}

.logIn-fourth-input-container > .input-fourth-default-group{
    width: var( --input-fourth-default-width-largeSize-group);
    
    margin:0;
    padding: 0 12px;
    

}
.logIn-fourth-container > .input-fourth-default-icons{
    width: var( --input-fourth-default-width-largeSize-group);
   
    margin:0;
 
    

}
.logIn-fourth-h1{
    font-weight: var(--fw-700-bold);
    font-size: var(--logIn-fourth-h1-fontSize);
    color: var(--logIn-fourth-h1-fontColor);
    
    margin: 0;
}

.logIn-fourth-inputLabel{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--logIn-fourth-inputLabel-fontSize);
    color: var(--logIn-fourth-inputLabel-fontColor);
   
    margin: 0;
}

.logIn-fourth-input-link-helperText{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--logIn-fourth-input-link-helperText-fontSize);
    color: var(--logIn-fourth-input-link-helperText-fontColor);
    
    margin-top: -2px;
    height: 16px;
}

.logIn-fourth-input-container{ 
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--logIn-fourth-input-container-gap);
    width: var(--logIn-fourth-input-container-maxWidth);
    margin: var(--logIn-fourth-input-container-margin);

}

.logIn-fourth-container > .bt-fourth-primary{
    width: 346px;
    height: var(--button-fourth-medium-height);
   
}

.logIn-fourth-divider-container{
    display: flex;
    align-items: center;
    width: 346px;
    margin:0; 

}

.logIn-fourth-divider-container-dividerLine{
    flex: 1;           
    height: 1px;       
    border-radius: 1px;
    background-color: var(--logIn-fourth-divider-container-divider-color);
    
  }

  .logIn-fourth-divider-container-letter{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--logIn-fourth-divider-container-letter-size);
    color: var(--logIn-fourth-divider-container-letter-color);
    
    margin: 0px 13px;  
  }

  .logIn-fourth-container .bt-fourth-secondary{
    width: 346px;
}

.logIn-fourth-googleBtn-helperText-container{
    gap: 14px;
    display: flex;
    flex-direction: column;
}

.exit-icon{
    width: var(--exitIcon-width-small-size);
    height: var(--exitIcon-height-small-size);
    
    fill: var(--logIn-fourth-inputContainer-exitIcon-color);
    
    align-self: flex-end;
    
}

.logIn-fourth-h1ExitIcon-container{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap:4px
}

.logIn-fourth-input-default-helperText{
    font-weight: var(--fw-400-regular);
    font-size: var(--logIn-fourth-input-default-helperText-fontSize);
    color: var(--logIn-fourth-input-default-helperText-fontColor);
    margin-top: -2px;
    height: 16px;
}

/*------------------------------------------------------------*/
/*Top Bar*/

.navBar-fourth-container{
    width: max-content;
    height: 52px;
    padding:17px 24px ;
    display: flex;
    gap:min(5vw, 20px);
    flex-direction: row;
    border-radius: 24px;
    align-items: center;
    box-shadow: var(--navBar-primary-default-shadow);
    background-color: var(--navBar-fourth-container-background);
    

}
.navBar-fourth-menu{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap:min(5vw, 10px);

}
.top-fourth-menu-item{
    display: flex;
    flex-direction: row;
    font-size: var(--navBar-fourth-h1-fontSize);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    color: var( --navBar-fourth-h1-fontColor);
    
    gap:8px;
    margin: 0;
    align-items: center;
}

/*------------------------------------------------------------*/
/*Descargar capas lista*/
.accordion-content-chipsBtn-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: fit-content;
   width: var(--accordion-fourth-content-chipsBtn-container-width);
    padding: var(--accordion-fourth-content-chipsBtn-container-padding);
    --accordion-fourth-content-chipsBtn-container-width:372px;
    --accordion-fourth-content-chipsBtn-container-padding:10px 16px 12px 16px;
}
.accordion-content-chips-container{
    height: fit-content;
    max-width: fit-content;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
   
}

.accordion-content-chipsBtn-container  .bt-fourth-primary{
    height:var(--button-fourth-primary-default-small-height) ;
   

}

.accordionList-fourth{
    display: none;
    position: absolute;
    cursor:pointer;
    margin-left: 85px;   
    width: max-content;
    height: max-content;
    padding: 16px;
    border-radius: 24px;
    background-color: var(--accordionList-fourth-background) !important;
   
  
}
.accordionList-fourth-title{
    font-weight: var(--fw-700-bold);
    color: var(--card-fourth-title-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--card-fourth-title-fontSize);
  
    margin: 0;
    

}

.accordions-container{
    display: flex;
    flex-direction: column;
    gap:6px ;
}

.accordions-scroll-container{
    display: flex;
    flex-direction: row;
    gap:8px ;
    margin-top: 10px;
}

.accordions-scroll-container .scroll-bar-fourth-itemList-background{
    width: 9px;
    margin: 0;
    padding: 0;
    position: relative;
    border-radius: 6px;
    background-color:var(--scrollBar-fourth-backgroundColor);
    height: var(--scrollBar-fourth-extraLarge-width);
    overflow-y: scroll;
    
}

.accordionList-fourth-visible{
    display: flex;
    flex-direction: column;
    margin-left: 12px;   
    width: max-content;
    height: max-content;
    padding: var(--accordionList-fourth-padding);
    border-radius: var(--accordionList-fourth-borderRadius);
    background-color: var(--accordionList-fourth-background) !important;
    --accordionList-fourth-padding:16px;
    --accordionList-fourth-borderRadius:24px;
  
}

.accordionList-fourth-visible  .scroll-bar-fourth-itemList-background{
    width: 9px;
    margin: 0;
    padding: 0;
    position: relative;
    border-radius: 6px;
    background-color:var(--scrollBar-fourth-backgroundColor);
    height: var(--scrollBar-fourth-extraLarge-width);
    overflow-y: scroll;
   
}

/*------------------------------------------------------------*/
/*Card cesefor*/
.card-cesefor-container{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width:var(--card-cesefor-container-width);
    height:var(--card-cesefor-container-height);
    border-radius: var(--card-cesefor-container-borderRadius);
    padding: var(--card-cesefor-container-padding);
    margin: var(--card-cesefor-container-margin);
    gap: var(--card-cesefor-container-gap);
    background-color: var(--logIn-fourth-container-background);

}

.card-cesefor-container .card-fourth-body{
    width: 100%;
    margin:0;
}

.card-cesefor-container .bt-fourth-plain{
    width: var(--button-fourth-secondary-plain-small-width);
    height: var(--button-fourth-secondary-plain-small-height);
    padding: 11px 2px 11px 2px;
}

.card-cesefor-fourth-h1ExitIcon-container{
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    height: 100%;
    justify-content: space-between;
}
.card-cesefor-fourth-h1ExitIcon-container .exit-icon{
    align-self: center;
}
.card-cesefor-fourth-bodyBtPlain-container{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap:4px
}
.card-cesefor-fourth-img-logo-container{
    display: flex;
    position: relative;
    align-content: center;
    justify-content: center;
}
.card-cesefor-fourth-img{
    border-radius: var( --card-cesefor-fourth-img-borderRadius);
    width: var(--card-cesefor-fourth-img-width);

}

.card-cesefor-fourth-logo{
    height: var(--card-cesefor-fourth-logo-height);
    position: absolute;
    align-self: center;


}
/* Botones mapa Librería 1 */
.div-map-button-l1{
    display: flex;
    justify-content: space-between;
    padding-right: 230px;
    
    border-radius: 18px;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
    height: 200px;
    margin-bottom: 12px;  
    margin-left: 10px;
    transition: height 0.3s ease;
    overflow: hidden; 

}

.div-map-button-l2{
    display: flex;
    flex-wrap: wrap;
    gap:300px;
    justify-content: end;
    align-items: initial;
    padding-right: 290px;
    border-radius: 18px;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
    height: 400px;
    margin-bottom: 12px;  
    margin-left: 10px;
    transition: height 0.3s ease;
    overflow: hidden; 
}

  
.div-map-button-l2:focus-within {
    height: 830px; 
}
   


.div-map-button-l3{
    display: flex;
    flex-wrap: nowrap;
    gap:330px;
    
    align-items: initial;
    padding-right: 230px;
    border-radius: 18px;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
    height: 350px;
    margin-bottom: 20px;  
    margin-left: 10px;
    transition: height 0.3s ease;
    
}
.div-map-button-l1:focus-within {
    height: 300px; 
}

.div-map-button-l4{
    display: flex;
    flex-wrap:nowrap;
    gap:650px;

    align-items: initial;
    padding-right: 430px;
    border-radius: 18px;
    background-color: #EDF2F5;
    border-radius: 18px;
    flex-direction: row;
    height: 350px;
    margin-bottom: 12px;  
    margin-left: 10px;
    transition: height 0.3s ease;
    
}
.info-map-btn-first,
.generic-map-btn-left-first,
.search-map-btn-left-first,
.sideBar-first-generic-map-btn-left{
    width: var(--mapButton-first-width);
    height: var(--mapButton-first-height);
    border-radius: var(--mapButton-first-borderRadius);
    border: none;
    background-color: var(--mapButton-first-default-background);
    display: inline-block;
    box-shadow: var(--button-shadow-2);
}
.zoomPlus-map-btn-left-first{ 
    width: var(--mapButton-first-width);
    height: var(--mapButton-first-height);
    border: none;
    background-color: var(--mapButton-first-default-background);
    border-radius: var(--zoomPlus-button-default-borderRadius);
   border-bottom: 1px solid var(--zoomPlus-map-btn-left-first-borderColor);
    display: inline-block;
    align-items: center;
    box-shadow: var(--button-shadow-2);
    
    
}

.zoomMinus-map-btn-left-first{ 
    width: var(--mapButton-first-width);
    height: var(--mapButton-first-height);
    border: none;
    background-color: var(--mapButton-first-default-background);
    border-radius: var(--zoomMinus-button-default-borderRadius);
    display: inline-block;
    align-items: center;
    box-shadow: var(--button-shadow-2);
    border-top: 1px solid var(--zoomPlus-map-btn-left-first-borderColor);
  
   
} 
.map-btn-icon-first{
    fill: var(--mapButton-first-default-icon-color);
   
}

.info-map-btn-first:hover,
.generic-map-btn-left-first:hover,
.search-map-btn-left-first:hover,
.zoomPlus-map-btn-left-first:hover,
.zoomMinus-map-btn-left-first:hover,
.sideBar-first-generic-map-btn-left:hover{
    background: var(--mapButton-first-hover-background);
}

.info-map-btn-first:hover .map-btn-icon-first,
.generic-map-btn-left-first:hover .map-btn-icon-first,
.search-map-btn-left-first:hover .map-btn-icon-first,
.zoomPlus-map-btn-left-first:hover .map-btn-icon-first,
.zoomMinus-map-btn-left-first:hover .map-btn-icon-first,
.sideBar-first-generic-map-btn-left:hover .map-btn-icon-first{
    fill:var(--mapButton-first-hoverSelect-icon-color);
}

.info-map-btn-first:hover + .mapBtn-first-label-hover,
.generic-map-btn-left-first:hover + .mapBtn-first-label-hover-left,
.sideBar-first-generic-map-btn-left:hover + .sideBar-first-mapBtn-label-hover-left,
.search-map-btn-left-first:hover + .mapBtn-first-label-hover-left,
.zoomPlus-map-btn-left-first:hover + .mapBtn-first-label-hover-left,
.zoomMinus-map-btn-left-first:hover + .mapBtn-first-label-hover-left-bottom{
    display: inline-block;

}
.info-map-btn-first:focus,
.generic-map-btn-left-first:focus,
.search-map-btn-left-first:focus,
.zoomPlus-map-btn-left-first:focus,
.zoomMinus-map-btn-left-first:focus,
.sideBar-first-generic-map-btn-left:focus{
    background-color: var(--mapButton-first-select-background);

}

.info-map-btn-first:focus .map-btn-icon-first,
.generic-map-btn-left-first:focus .map-btn-icon-first,
.search-map-btn-left-first:focus .map-btn-icon-first,
.zoomPlus-map-btn-left-first:focus .map-btn-icon-first,
.zoomMinus-map-btn-left-first:focus .map-btn-icon-first,
.sideBar-first-generic-map-btn-left:focus .map-btn-icon-first{
    fill:var(--mapButton-first-hoverSelect-icon-color);
  
}
.sideBar-first-generic-map-btn-left:focus ~ .sideBar-first-mapBtn-label-select{
    display: inline-block;
    box-shadow: var(--button-shadow-2);
    border-radius: 24px;
    border: none;
}
.info-map-btn-first:focus ~ .mapBtn-first-label-select{

    display: inline-block;
    box-shadow: var(--button-shadow-2);
    border-radius: 24px;
    border: none;
    fill: var(--mapButton-first-hoverSelect-icon-color);
}  


.mapBtn-first-label-hover{
    display: none;
    position:absolute;
    width: var(--mapButton-first-hover-label-width);
    height: var(--mapButton-first-hover-label-height);
    padding: var(--mapButton-fourth-hover-label-padding);
    border-radius: var(--mapButton-fourth-borderRadius);
    background-color: var(--mapButton-first-hover-label-background);
    margin-left:89px;
    
}

.mapBtn-first-label-hover-left{
    display: none;
    position:absolute;
    right: 89px;
    width: var(--mapButton-first-hover-label-width);
    height: var(--mapButton-first-hover-label-height);
    padding: var(--mapButton-fourth-hover-label-padding);
    border-radius: var(--mapButton-fourth-borderRadius);
    background-color: var(--mapButton-first-hover-label-background);
    

}
.sideBar-first-mapBtn-label-hover-left{
    display: none;
    position:absolute;
    right: 130px;
    width: var(--mapButton-first-hover-label-width);
    height: var(--mapButton-first-hover-label-height);
    padding: var(--mapButton-fourth-hover-label-padding);
    border-radius: var(--mapButton-fourth-borderRadius);
    background-color: var(--mapButton-first-hover-label-background);
    

}
.mapBtn-first-label-hover-title{
    margin: 0;
    text-align: center;
    justify-items: center;
    padding: 0;
    height: 20px;
    font-weight: var(--fw-600-semiBold);
    font-size: var(--mapButton-first-hover-label-fontSize);
    color: var(--mapButton-first-hover-label-fontColor)!important;
    font-family: var(--font-montserrat);
}

.mapBtn-first-label-select{
    display: none;
    background:  var(--mapButton-first-select-label-container-background);
    border: 1px solid var(--mapButton-first-select-label-container-borderColor);
    position: absolute;
    border-radius: var(--mapButton-fourth-borderRadius);
    padding: 16px;
    gap: 16px;
    margin-left:89px;
    text-align:left;
    width: max-content;
    
   
} 

.mapBtn-first-label-select-h1{
    margin: 0;
    height: fit-content;
    font-weight: var(--fw-700-bold);
    font-size: var(--mapButton-first-select-h1-fontSize);
    color: var(--mapButton-first-select-h1-fontColor)!important;
    font-family: var(--mapButton-first-select-h1-font);
    
}

.mapBtn-first-label-select-p{
    padding-bottom: 12px;
    margin: 0;
    font-weight: var(--fw-400-regular);
    font-size: var(--mapButton-first-select-label-body-fontSize);
    color: var(--mapButton-first-select-label-body-fontColor);
    font-family: var(--font-montserrat);
   
}

.mapBtn-first-label-select-iconTitle-container{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    margin-left:0px;
    padding-bottom: 16px;
}

.mapBtn-first-label-select-iconTitle-icon{
   width: 17px!important;
   height: 17px!important;
   fill: var(--mapButton-first-select-icon-fill);
  
}

.mapBtn-first-label-select-pLogo-subContainer{
    display: flex;
    align-content:flex-start;
    background:  var(--mapButton-first-select-label-subContainer-background);
    flex-direction: column;
    border-radius: var(--mapButton-fourth-borderRadius);
    padding: 14px 16px;
    text-align:left;
    width: max-content;
    height: max-content;
} 

.mapBtn-first-label-select-logoContainer{
    display: flex;
    align-items: center;
    padding: 6px;
    background-color: #fff;
    border-radius: 24px;
}


.search-map-btn-left-first:focus ~ .mapBtn-first-label-select-left{ 
    display: flex;
    position: absolute;
    width: max-content;
    height: max-content;

}

.input-first-default-nonVisible{
    display:flex;
   align-self: center;
    right: 100px;
    height: var(--input-first-default-height-smallSize);
    width: var(--input-first-default-width-smallSize);
    padding: 10px;
    margin: 0px;
    background-color: var(--input-default-background);
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-default-fontColor);
  
    
}
.mapBtn-first-label-select-left{
    display: none;
    background:  var(--mapButton-first-select-label-container-background);
    border: 1px solid var(--mapButton-first-select-label-container-borderColor);
    position: absolute;
    border-radius: var(--mapButton-fourth-borderRadius);
    padding: 11px 16px;
    
    gap: 16px;
    right: 100px;
    margin-left: 85px;
    text-align:left;
  
    
}

.mapBtn-first-label-hover-left-bottom{
    display: none;
    position:absolute;
    padding: 15.5px 20px;
    border-radius: 24px;
    right: 100px;
    top: 61px;
    width: max-content;
    background-color: var(--mapButton-fourth-hover-info-background);
   
}
.mapBtn-second-label-hover-bottom{
    display: none;
   position: absolute;
    padding: 15.5px 20px;
    border-radius: 24px;
    margin-left: 85px;
    margin-top:58px;
    width: max-content;
    background-color: var(--mapButton-fourth-hover-info-background);
   
}
.sideBar-first{
    width: max-content;
    display: flex;
    flex-direction: column;
    position: relative;
    gap: 12px;
    padding: 22px 24px;
    border-radius: 24px;
  
    border: 1px solid var(--sideBar-first-borderColor);
    background-color: var(--sideBar-first-background);
    height: max-content;
    align-items: center;
    justify-content: center;
    box-shadow: var(--sideBar-first-glassEffect-shadow);
   

   
}

.buttonContainer{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    margin: 0;
    gap: 30px;
    height: max-content;
    width: max-content;
}

.sideBar-first-mapBtn-label-select{
    display: none;
    background:  var(--mapButton-first-select-label-container-background);
    border: 1px solid var(--mapButton-first-select-label-container-borderColor);
    position: absolute;
    border-radius: var(--mapButton-fourth-borderRadius);
    padding: 16px 20px;
    top:0px;
    gap: 16px;
    right: 100px;
    height: fit-content;
    margin-right: 30px;
    text-align:left;
    width:388px;
    
}


.sideBar-first-mapBtn-label-hover-right{
    display: none;
    position:absolute;
    right: 130px;
    width: var(--mapButton-first-hover-label-width);
    height: var(--mapButton-first-hover-label-height);
    padding: var(--mapButton-fourth-hover-label-padding);
    border-radius: var(--mapButton-fourth-borderRadius);
    background-color: var(--mapButton-first-hover-label-background);
    

}
.layersAccordions-container {
   flex-wrap: wrap;
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 12px;
}

.layersAccordions-scrollBar-container{
    display: flex;
    flex-direction: row;
    width: 100%;
    margin: 0px;

}


.accordion-first input {
    position: absolute;
    width:354px;
    padding: 12px 16px;
    height: 45px;
    opacity: 0;
    z-index: 0;
}

  .accordion-first{
    margin: 0px;
    border-radius: 24px;
    overflow: hidden;

    height: max-content;
    
   
  }
  .accordion-first-label1,
  .accordion-label2{
    display: flex;
    width:var(--accordion-first-medium-width);
    height: var(--accordion-first-medium-height);
    cursor: pointer;
    justify-content: space-between;
    background-color: var(--accordion-first-background);
    border-color: 1px solid var(--accordion-first-borderColor);
    border-radius: var(--accordion-first-borderRadius);
    padding: var(--accordion-first-padding);
    align-items: center;
    font-weight: var(--fw-600-semiBold);
    box-shadow: var(--button-shadow-2);
    font-size: var( --accordion-first-h1-fontSize);
    color: var(--accordion-first-h1-fontColor);
    font-family: var(--font-montserrat);
    
}
.accordion-first-content{
    max-height: 0;
    display: flex;
    overflow: hidden;
    padding: 0;
    margin: 0;
    width:var(--accordion-first-medium-content-width);
    border-color: 1px solid var(--accordion-first-borderColor);
    border-radius: var(--accordion-first-medium-content-borderRadius);
    background-color: var(--accordion-first-background);
    transition: all 0.35s;
    
  }
  .b-layers-first-layers-container{
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    margin: 12px 16px 14px 16px;
}

.layer-type{
    display: inline-flex;
    font-family: var(--font-montserrat);
    font-size: 14px;
    font-weight: var(--fw-400-regular);
    

}
  input#tab3:checked ~ .accordion-first-content{
    max-height: 300px;
  }
  input#tab4:checked ~ .accordion-first-content{
    max-height: 300px;
  }
  input:checked ~ .accordion-first-label1 .chevron-svg,
  input:checked ~ .accordion-first-label2 .chevron-svg{
    transform: rotate(180deg);
    transition: transform 0.35s ease;

   
  }
  input:checked ~ .accordion-first-label1,
  input:checked ~ .accordion-first-label2{
    border-radius: 0px;
  }
  
.accordion-first-h1Icon-container{
    display: flex;
    flex-direction: row;
    gap: 8px;

}

.layersAccordions-scrollBar-container .scroll-bar-fourth-background{
    height:100%;
}

.sideBar-first .mapBtn-first-label-select{
    top:0;
    margin-left:113px;

}

.sideBar-first .mapBtn-first-label-hover{
    margin-left:113px;

}

.sideBar-first .mapBtn-first-label-hover-left,
.sideBar-first .mapBtn-first-label-select-left{
    margin-right:30px;

}

/*Input capas*/
.b-layers-first-inputItem{
    width: var(--b-layers-first-inputItem-maxWidth);
    border-radius: var(--b-layers-first-inputItem-borderRadius);
    display: flex;
    flex-direction: row;
    background-color: var(--b-layers-first-inputItem-default-background);
    padding: var(--b-layers-first-inputItem-padding-y) var(--b-layers-first-inputItem-padding-x);
    align-items: center;
    box-sizing: border-box;
    box-shadow: var(--inputItem-first-shadow);
    justify-content: space-between;
    border: 1px solid var(--inputItem-first-borderColor);
    --b-layers-first-inputItem-padding-y:12px;
    --b-layers-first-inputItem-padding-x:16px;
    --b-layers-first-inputItem-default-background:#fff;
    --b-layers-first-inputItem-maxWidth:354px;
    --b-layers-first-inputItem-borderRadius:24px;
}



.i-layers-first-inputItem{
    
    width: var(--i-layers-first-inputItem-maxWidth);
    border-radius: var(--i-layers-first-inputItem-borderRadius);
    display: flex;
    flex-direction: column;
    background-color: var(--inputItem-first-background);
    padding: var(--i-layers-first-inputItem-padding-y) var(--i-layers-first-inputItem-padding-x);
    gap:var( --i-layers-first-inputItem-gap);
    box-shadow: var(--inputItem-first-shadow);
    border: 1px solid var(--inputItem-first-borderColor);
    box-sizing: border-box;
    

}
.i-layers-first-inputItem-iconH1-container{
    display: flex;
    width: 100%;
    flex-direction: row;
    gap: 8px;
    align-items: center;

}
.i-layers-first-inputItem-iconH1checkBox-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-height: 22px;
    
}
.i-layers-first-inputItem-legend-container{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: start;
    width: 100%;
    gap: 10px;
    
    
}


.i-layers-first-inputItem-legend-h1{
    color:var(--inputItem-first-select-legend-h1-fontColor);
    font-size: var(--inputItem-first-select-legend-h1-fontSize);
    font-family: var(--font-montserrat);
    font-weight:var(--fw-500-medium);
    
}

.i-layers-first-inputItem-legend-body{
    color:var(--inputItem-first-select-legend-body-fontColor);
    font-size: var(--inputItem-first-select-legend-body-fontSize);
    font-family: var(--font-montserrat);
    font-weight:var(--fw-500-medium);
    
}


.i-layers-first-inputItem-legend-list{
    align-items:center;
    display: flex;
    flex-direction: row;
    gap: 8px;
    height: 18px;

    
   

}
.i-layers-first-inputItem-sliderInfoBtn-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    
    max-height: 22px;
    
}

.i-layers-first-inputItem-sliderInfoBtn-container .slider{
    max-width: 200px;
    
}
.inputItem-first-h1{
    color:var(--inputItem-first-default-h1-fontColor);
    font-size: var(--inputItem-first-h1-fontSize);
    font-family: var(--font-montserrat);
    font-weight: var(--fw-500-medium);
    margin: 0;
   
}
.i-layers-first-inputItem-icon{
    fill: var( --inputItem-first-default-icon-fill);
   

}



.txt-icon-div-first-default{ /*Div con Icono y Texto*/
    gap: 8px;
    display: flex;
    align-items: center;
    color: var(--inputItem-first-default-h1-fontColor);
    font-weight: var(--fw-500-medium);
    font-size: var(--inputItem-first-h1-fontSize);
    font-family: var(--font-montserrat);

}

.infoLayers-icon-first-default{ /*Icono*/
    color:var( --inputItem-first-default-icon-fill);

}
.b-layers-first-inputItem:hover{
    background-color: var(--b-layers-first-inputItem-hover-background);
    border: 1px solid var(--inputItem-first-borderColor);
    color:var(---b-layers-first-inputItem-hover-h1-fontColor)!important;
}
.i-layers-first-inputItem:hover,
.infoLayers-input-first-default:hover{
    background-color: var(---b-layers-first-inputItem-hover-background);
    border: 1px solid var(--inputItem-first-borderColor);
    color:var(--i-layers-first-inputItem-hover-h1-fontColor)!important;
    --inputItem-first-hover-h1-fontColor:#fff;
   
}
.b-layers-first-inputItem:hover .inputItem-first-h1,
.i-layers-first-inputItem:hover .inputItem-first-h1,
.i-layers-first-inputItem:hover .i-layers-first-inputItem-legend-h1,
.i-layers-first-inputItem:hover .i-layers-first-inputItem-legend-body{
   
    color:var(--inputItem-first-hover-h1-fontColor)!important;
    --inputItem-first-hover-h1-fontColor:#fff;
   
}
.i-layers-first-inputItem:hover .i-layers-first-inputItem-icon{
    fill: var(--inputItem-first-hover-icon-fill);
   
}
/*DataPanel*/
.dataPanel-first-container{
    display: flex;
    flex-direction: column;
    padding: var(--dataPanel-first-padding);
    gap:var(--dataPanel-first-gap);
    flex-wrap: wrap;
    max-width:var(--dataPanel-first-maxWidth);
    border-radius:var(--dataPanel-first-borderRadius);
    background-color: var(--dataPanel-first-background);
    box-shadow: var(--dataPanel-first-shadow);
    border: 1px var(--dataPanel-first-borderColor);
    
}
.dataPanel-first-h1IconExit-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.dataPanel-first-h1Icon-container{
    display: flex;
    flex-direction: row;
    gap:10px;
    align-items: center;
}
.dataPanel-first-h1{
    font-weight:var(--fw-700-bold);
    font-family: var(--font-montserrat);
    color: var(--dataPanel-first-h1-fontColor);
    font-size: var(--dataPanel-first-h1-fontSize);
   
}
.dataPanel-first-list{
    display: flex;
    flex-direction: column;
    gap: 8px;

}
.dataPanel-first-listScroll-container{
    display: flex;
    flex-direction: row;
    height: auto;
    gap: 8px;
}
.dataPanel-first-list-item{
    display: flex;
    padding: var(--dataPanel-first-list-item-padding);
    border-radius: var(--dataPanel-first-list-item-borderRadius);
    color: var(--dataPanel-first-list-item-fontColor);
    font-size: var( --dataPanel-first-list-item-fontSize);
    font-weight: var(--fw-600-semiBold);
    background-color: var(--dataPanel-first-list-item-background);
    max-width:var(--dataPanel-first-list-item-maxWidth);
    
}

.dataPanel-first-container .bt-first-primary,
.bt-first-primary-select {
    width: 100%;
  
}

/*Libreria 2*/
/* Otros componentes*/

.radioButton-second{
    display: none;

}

.radioButton-second + label{
    width: 22px;
    display: inline-block;
    position: relative;
    border-radius: 50%;
    background-color: var(--radioButton-second-default-background);
    border: 2px solid var(--radioButton-second-default-borderColor);
    box-sizing: border-box;
    height: 22px;
    cursor: pointer;
    border-style: solid;
    border-width: 2px;
    
}

.radioButton-second:checked + label{
    background-color: var(--radioButton-second-select-background);
    cursor: pointer;
    border: 2px solid var(--radioButton-second-select-borderColor);
    
} 

.radioButton-second:checked + label::after {
    position: absolute;
    width: 10px;
    height: 10px;
    content: "";
    top: 50%;
    left: 50%;
    font-size: 14px;
    border-radius: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    background-color: var(--radioButton-second-select-check);
    
}
.icon-button-second{    
    width: 20px;
    height: 20px;
    border-radius: 30px;
    background-color: var(--icon-button-second-default-backgroundColor);
    border: 2px solid var(--icon-button-second-default-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
    
}
.icon-btn-icon-second{
    fill: var(--icon-button-second-icon-fill);
    display: block;
    
}
/*Botones Mapa*/

.info-map-btn-second,
.generic-map-btn-left-second,
.generic-map-btn-second,
.search-map-btn-second,
.sideBar-second-generic-map-btn-left{
    width: var(--mapButton-first-width);
    height: var(--mapButton-first-height);
    border-radius: var(--mapButton-first-borderRadius);
    border: none;
    background-color: var(--mapButton-second-default-background);
    display: inline-block;
    
}
.zoomPlus-map-btn-second{ 
    width: var(--mapButton-first-width);
    height: var(--mapButton-first-height);
    border: none;
    background-color: var(--mapButton-second-default-background);
    border-radius: var(--zoomPlus-button-default-borderRadius);
   border-bottom: 1px solid var(--zoomPlus-map-btn-second-borderColor);
    display: inline-block;
    align-items: center;
    box-shadow: var(--button-shadow-2);
    
    
}

.zoomMinus-map-btn-second{ 
    width: var(--mapButton-first-width);
    height: var(--mapButton-first-height);
    border: none;
    background-color: var(--mapButton-second-default-background);
    border-radius: var(--zoomMinus-button-default-borderRadius);
    display: inline-block;
    align-items: center;
    box-shadow: var(--button-shadow-2);
  
   
} 
.map-btn-icon-second{
    fill: var(--mapButton-second-defaultHoverSelect-icon-color);
   
}

.info-map-btn-second:hover,
.generic-map-btn-left-second:hover,
.generic-map-btn-second:hover,
.search-map-btn-second:hover,
.zoomPlus-map-btn-second:hover,
.zoomMinus-map-btn-second:hover,
.sideBar-second-generic-map-btn-left:hover{
    background: var(--mapButton-second-hover-background);
}


.info-map-btn-second:hover + .mapBtn-first-label-hover-left,
.generic-map-btn-second:hover + .mapBtn-first-label-hover,
.generic-map-btn-left-second:hover + .mapBtn-first-label-hover-left,
.sideBar-second-generic-map-btn-left:hover + .sideBar-first-mapBtn-label-hover-left,
.search-map-btn-second:hover + .mapBtn-first-label-hover,
.zoomPlus-map-btn-second:hover + .mapBtn-first-label-hover,
.zoomMinus-map-btn-second:hover + .mapBtn-second-label-hover-bottom{
    display: inline-block;

}
.info-map-btn-second:focus,
.generic-map-btn-left-second:focus,
.generic-map-btn-second:focus,
.search-map-btn-second:focus,
.zoomPlus-map-btn-second:focus,
.zoomMinus-map-btn-second:focus,
.sideBar-second-generic-map-btn-left:focus{
    background-color: var(--mapButton-second-select-background);

}


.sideBar-first-generic-map-btn-left:focus ~ .sideBar-first-mapBtn-label-select{
    display: inline-block;
    box-shadow: var(--button-shadow-2);
    border-radius: 24px;
    border: none;
}
.info-map-btn-second:focus ~ .mapBtn-second-label-select-left{

    display: inline-block;
    box-shadow: var(--button-shadow-2);
    border-radius: 24px;
    border: none;
    fill: var(--mapButton-first-hoverSelect-icon-color);
}  
.search-map-btn-second:focus ~ .mapBtn-second-label-select{ 
    display: flex;
    position: absolute;
    width: max-content;
    height: max-content;

}

.generic-map-btn-left-second:focus ~ .mapBtn-second-layers-label-select{
    display: flex;
    position: absolute;
    width: max-content;
    height: max-content;


}

.mapBtn-first-label-hover-title{
    margin: 0;
    text-align: center;
    justify-items: center;
    padding: 0;
    height: 20px;
    font-weight: var(--fw-600-semiBold);
    font-size: var(--mapButton-first-hover-label-fontSize);
    color: var(--mapButton-first-hover-label-fontColor)!important;
    font-family: var(--font-montserrat);
}

.mapBtn-second-label-select{ /*Labels select*/
    display: none;
    flex-direction: column;
    background:  var(--mapButton-second-select-label-background);
    border: 1px solid var(--mapButton-first-select-label-container-borderColor);
    position: absolute;
    border-radius: var(--mapButton-fourth-borderRadius);
    padding: 16px;
    margin-left:89px;
    text-align:left;
    width: max-content;
   
    
   
} 
.mapBtn-second-label-select-left{ /*Labels select Izquierda*/
    display: none;
    background:  var(--mapButton-second-select-label-background);
    border: 1px solid var(--mapButton-first-select-label-container-borderColor);
    position: absolute;
    border-radius: var(--mapButton-fourth-borderRadius);
    padding: 17.5px 20px;
    background:  var(--mapButton-second-select-label-background);

    right: 100px;
    margin-left: 85px;
    text-align:left;

}

.mapBtn-second-layers-label-select{ /*Labels select Capas*/
    display: none;
    background:  var(--mapButton-second-layers-select-label-background);
    border: 1px solid var(--mapButton-first-select-label-container-borderColor);
    position: absolute;
    border-radius: var(--mapButton-second-layers-label-select-borderRadius);
    padding: 17.5px 20px;

    flex-direction: column;
   
    margin-left: 69px;
    text-align:left;
    --mapButton-second-layers-label-select-borderRadius:24px 0px 0px 24px;
    --mapButton-second-layers-select-label-background:linear-gradient(193.38deg, rgba(255, 255, 255, 0.8) 33%, rgba(255, 255, 255, 0.5));
  
}
.mapBtn-second-label-select-h1{
    margin: 0;
    width: 100%;
    height: fit-content;
    font-weight: var(--fw-700-bold);
    font-size: var(--mapButton-first-select-h1-fontSize);
    color: var(--mapButton-second-label-select-h1-fontColor)!important;
    font-family: var(--mapButton-first-select-h1-font);
    
    
}

.mapBtn-second-label-select-p{
    padding-bottom: 12px;
    margin: 0;
    font-weight: var(--fw-400-regular);
    font-size: var(--mapButton-first-select-label-body-fontSize);
    color: var(--mapButton-second-label-select-body-fontColor);
    font-family: var(--font-montserrat);
    width: max-content;
   
}


.mapBtn-second-label-select-logoContainer{
    display: flex;
    justify-content: center;
    width: 258px;
    padding: 12px;
  
    background-color: #fff;
    border-radius: 24px;
}

.mapBtn-second-label-select-logo{
    display: flex;
    align-self: center;
    
}


.input-first-default-nonVisible{
    display:flex;
   align-self: center;
    right: 100px;
    height: var(--input-first-default-height-smallSize);
    width: var(--input-first-default-width-smallSize);
    padding: 10px;
    margin: 0px;
    background-color: var(--input-default-background);
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-default-fontColor);
  
    
}


.mapBtn-first-label-hover-left-bottom{
    display: none;
    position:absolute;
    padding: 15.5px 20px;
    border-radius: 24px;
    right: 100px;
    top: 61px;
    width: max-content;
    background-color: var(--mapButton-fourth-hover-info-background);
   
}

/*Acordeones*/


.accordion-second input {
    position: absolute;
    width:auto;
    height: 45px;
    opacity: 0;
    z-index: 0;
}

  .accordion-second{
    margin: 0px;
    border-radius: var(--accordion-second-borderRadius);
    overflow: hidden;
    
    width:max-content;
    height: max-content;
    
   
  }
  .accordion-second-label1,
  .accordion-second-label2{
    display: flex;
    gap:var(--accordion-second-gap);

    min-width:var(--accordion-second-small-width);
    max-width:var(--accordion-second-large-width);
    height: var(--accordion-second-mediumSize-height);
    width:auto;
    cursor: pointer;
    justify-content: space-between;
    background-color: var(--accordion-second-background);
    border-color: 1px solid var(--accordion-first-borderColor);
    border-radius: var(--accordion-second-borderRadius);
    padding: var(--accordion-second-padding);
    align-items: center;
    justify-content: start;
    font-weight: var(--fw-600-semiBold);
    box-shadow: var(--button-shadow-2);
    font-size: var( --accordion-first-h1-fontSize);
    color: var(--accordion-second-h1-fontColor);
    font-family: var(--font-montserrat);   
    
}

.chevron-svg-second{
    color: var(--accordion-second-iconColor)!important;
    padding: 0px;
    margin: 0px;
    stroke-width:2px;
    stroke: var(--accordion-second-iconColor);

}
.accordion-second-content{
    max-height: 0;
    display: flex;
    overflow: hidden;
    padding: 0px;
    margin: 0;
    gap: 12px;
    border-color: 1px solid var(--accordion-first-borderColor);
    border-radius: 0px 0px 24px 24px;
    background-color: var(--accordion-second-background);
    max-width: var(--accordion-second-content-large-width);
    min-width:var(--accordion-second-content-small-width);
    width: auto;
    transition: all 0.35s;
    
}


input#tab5:checked ~ .accordion-second-content{
    max-height: 300px;
  }
  input#tab6:checked ~ .accordion-second-content{
    max-height: 300px;
  }
  input:checked ~ .accordion-second-label1 .chevron-svg-second,
  input:checked ~ .accordion-second-label2 .chevron-svg-second{
    transform: rotate(-90deg);
    transition: transform 0.35s ease;

   
  }
  input:checked ~ .accordion-second-label1,
  input:checked ~ .accordion-second-label2{
    border-radius: 0px;
  }
  
.accordion-first-h1Icon-container{
    display: flex;
    flex-direction: row;
    gap: 8px;

}

.b-layers-second-inputItem{ /* Input capas base*/
    height: var(--inputItem-second-height);
    min-width:var(--inputItem-second-small-width);
    max-width: var(--inputItem-second-large-width);
    border-radius: var(--inputItem-second-borderRadius);
    display: flex;
    width: auto;
   
    flex-direction: row;
    background-color: var(--inputItem-second-default-background);
    padding: var(--inputItem-second-b-layers-padding);
    align-items: center;
    box-shadow: var(--inputItem-first-shadow);
    justify-content: space-between;
    border: 1px solid var(--inputItem-first-borderColor);
    
}
.b-layers-second-layers-container{/* Contenedor inputs*/
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
    margin: var(--accordion-second-padding);
}
.inputItem-second-h1{ /* Estilo texto del input*/
    color:var(--inputItem-second-default-h1-fontColor);
    font-size: var(--inputItem-second-h1-fontSize);
    font-family: var(--font-montserrat);
    font-weight: var(--fw-500-medium);
   
}

.i-layers-second-layers-container{/* Contenedor inputs*/
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    align-items: flex-start;
    margin: var(--accordion-second-padding);
}
.i-layers-second-inputItem{ /* Input capas de información*/
    min-height: var(--inputItem-second-height);
    min-width:var(--inputItem-second-small-width);
    max-width:var(--inputItem-second-small-width) ;
    border-radius: var(--inputItem-second-borderRadius);
    display: flex;
    width:auto;
    gap:var(--inputItem-second-default-gap);
    flex-direction: column;
    background-color: var(--inputItem-second-default-background);
    padding: var(--inputItem-second-infoLayers-padding);
    align-items: flex-start;
    box-shadow: var(--inputItem-first-shadow);
    justify-content: space-between;
    border: 1px solid var(--inputItem-first-borderColor);
    

}
.i-layers-second-inputItem-iconH1-container{
    display: flex;
   width:100%;
    flex-direction: row;
    gap: 8px;
    align-items: center;

}
.i-layers-second-inputItem-iconH1checkBox-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-height: 22px;
    
}
.i-layers-second-inputItem-sliderInfoBtn-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    
    max-height: 22px;
    
}
.i-layers-second-inputItem-legend-container{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: start;
    width: 100%;
    gap: 10px;
    
    
}

.i-layers-second-inputItem-legend-h1{
    color:var(--inputItem-second-select-legend-h1-fontColor);
    font-size: var(--inputItem-second-select-legend-h1-fontSize);
    font-family: var(--font-montserrat);
    font-weight:var(--fw-500-medium);

}

.i-layers-second-inputItem-legend-body{
    color:var(--inputItem-second-select-legend-body-fontColor);
    font-size: var(--inputItem-first-select-legend-body-fontSize);
    font-family: var(--font-montserrat);
    font-weight:var(--fw-500-medium);
    
}


.i-layers-second-inputItem-legend-list{
    align-items:center;
    display: flex;
    flex-direction: row;
    gap: 8px;
    height: 18px;

      
}  
.b-layers-second-inputItem:hover,
.i-layers-second-inputItem:hover,
.infoLayers-input-first-default:hover{
    background-color: var(--inputItem-second-hover-background);
    border: 1px solid var(--inputItem-first-borderColor);
    color:var(--inputItem-first-hover-h1-fontColor)!important;

}

/*DataPanel*/
.dataPanel-second-container{
    display: flex;
    flex-direction: column;
    padding: var(--dataPanel-second-padding);
    gap:var(--dataPanel-second-gap);
    flex-wrap: wrap;
    max-width:var(--dataPanel-second-maxWidth);
    min-width: var(--dataPanel-second-minWidth);
    border-radius:var(--dataPanel-second-borderRadius);
    background-color: var(--dataPanel-second-background);

    
}
.dataPanel-second-h1Exit-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.dataPanel-second-h1{
    font-weight:var(--fw-700-bold);
    font-family: var(--font-montserrat);
    color: var(--dataPanel-second-h1-fontColor);
    font-size: var(--dataPanel-second-h1-fontSize);

}
.dataPanel-second-subContainer{/*SubContainer*/
    display: flex;
    flex-direction: column;
    gap: var(--dataPanel-second-subContainer-gap);
    max-width: var(--dataPanel-second-subContainer-maxWidth);
    border-radius: var(--dataPanel-second-subContainer-borderRadius);
    padding:var(--dataPanel-second-subContainer-padding);
    
    background-color: var(--dataPanel-second-subContainer-background);
  
    height: fit-content;

}
.dataPanel-second-container .scroll-bar-fourth-background{
    height: 100%;
}
.dataPanel-first-listScroll-container{
    display: flex;
    flex-direction: row;
    gap: 8px;
}
.dataPanel-second-subContainer-item{ /*SubContaine Item*/
    display: block;
    gap:2px;
    color: var(--dataPanel-second-subContainer-item-fontColor);
    font-size: var(--dataPanel-second-subContainer-item-fontSize);
    font-weight: var(--fw-500-medium);
    margin:0px;
    width:100%;
    padding: 0px;
    
}

strong{
    
    margin: 0px;
    padding: 0px;
}
.dataPanel-second-container .bt-first-primary{
    width: 100%;
  
}
button{
    background-color: transparent;
    border: none;
}

/*Librería 3*/
/*Botones*/

.bt-third-primary {
    width: var(--button-third-medium-width);
    height: var(--button-third-medium-height);
    border-radius: 24px;
    border: none;
    background-color: var(--button-third-primary-default-background);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: var(--button-third-primary-default-fontSize);
    color: var(--button-third-primary-default-fontColor);
    font-family: var(--button-first-primary-text);
    font-weight: var(--fw-600-semiBold);
    padding: var(--button-third-padding-y) var(--button-third-padding-x);
    box-sizing: border-box;
  
}
.bt-third-primary:hover{
    font-size: var(--button-third-primary-hover-fontSize);
    color: var(--button-third-primary-hover-fontColor);
   background-color: var(--button-third-primary-hover-background);
   
}

.bt-third-primary:active{
    font-size: var(--button-third-primary-select-fontSize);
    color: var(--button-third-primary-select-fontColor);
    background-color: var(--button-third-primary-select-background);
    border: 1px solid var(--button-third-primary-select-borderColor);
    padding: var(--button-third-padding-y) var(--button-third-padding-x);
    box-sizing: border-box;
  
}
.bt-third-primary-select{
    width: var(--button-third-medium-width);
    height: var(--button-third-medium-height);
    color: var(--button-third-primary-select-fontColor);
    background-color: var(--button-third-primary-select-background);
    border: 1px solid var(--button-third-primary-select-borderColor);
    border-radius: 24px;
    border: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-family: var(--button-first-primary-text);
    font-weight: var(--fw-600-semiBold);
    font-size: var(--button-third-primary-select-fontSize);
    padding: var(--button-third-padding-y) var(--button-third-padding-x);
    box-sizing: border-box;
  
}
.bt-third-primary:disabled{
    opacity:50%;
}
.bt-third-secondary {
    width: var(--button-third-medium-width);
    height: var(--button-third-medium-height);
    border-radius: 24px;
    border: none;
    background-color: var(--button-third-secondary-default-background);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: var(--button-third-padding-y) var(--button-third-padding-x);
    box-sizing: border-box;
    font-size: var(--button-third-secondary-default-fontSize);
    color: var(--button-third-secondary-default-fontColor);
    font-family: var(--button-first-primary-text);
    font-weight: var(--fw-600-semiBold);
    
 }

.bt-third-secondary:hover{
    font-size: var(--button-third-secondary-hover-fontSize);
    color: var(--button-third-secondary-hover-fontColor);
   background-color: var(--button-third-secondary-hover-background);
   padding: var(--button-third-padding-y) var(--button-third-padding-x);
    box-sizing: border-box;

}

.bt-third-secondary:active{
    background-color: var(--button-third-secondary-hover-background);
    font-size: var(--button-third-secondary-hover-fontSize);
    color: var(--button-third-secondary-hover-fontColor);
    padding: var(--button-third-padding-y) var(--button-third-padding-x);
    box-sizing: border-box;
}

.bt-third-secondary:disabled{
    opacity: 50%;
    
}
.bt-third-tertiary {
    width: var(--button-third-medium-width);
    height: var(--button-third-medium-height);
    border-radius: 24px;
    border: none;
    background-color: var(--button-third-tertiary-default-background);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: var(--button-third-tertiary-default-fontSize);
    color: var(--button-third-tertiary-default-fontColor);
    font-family: var(--button-first-primary-text);
    font-weight: var(--fw-600-semiBold);
    padding: var(--button-third-padding-y) var(--button-third-padding-x);
    box-sizing: border-box;
    
}
.bt-third-tertiary:hover{
    padding: var(--button-third-padding-y) var(--button-third-padding-x);
    box-sizing: border-box;
   background-color: var(--button-third-tertiary-hover-background);
   font-size: var(--button-third-tertiary-hover-fontSize);
   color: var(--button-third-tertiary-default-fontColor);
}

.bt-third-tertiary:active{
    padding: var(--button-third-padding-y) var(--button-third-padding-x);
    box-sizing: border-box;
   background-color: var(--button-third-tertiary-select-background);
   border:1px solid var(--button-third-tertiary-select-borderColor);
   color: var(--button-third-tertiary-select-fontColor);
   font-size: var(--button-third-tertiary-select-fontSize);

  
}
.bt-third-tertiary-active {
    width: var(--button-third-medium-width);
    height: var(--button-third-medium-height);
    border-radius: 24px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    color: var(--button-third-tertiary-select-fontColor);
   font-size: var(--button-third-tertiary-select-fontSize);
    font-family: var(--button-first-primary-text);
    font-weight: var(--fw-600-semiBold);
    background-color: var(--button-third-tertiary-select-background);
    border:1px solid var(--button-third-tertiary-select-borderColor);
    padding: var(--button-third-padding-y) var(--button-third-padding-x);
    box-sizing: border-box;
 }
.bt-third-tertiary:disabled{
    opacity:50%;
}
.btn-third-lg{
    width:var(--button-third-large-width);
    height:var(--button-third-large-height);
}

.btn-third-md{
    width:var(--button-third-medium-width);
    height:var(--button-third-medium-height);
}
.btn-third-sm{
    width:var(--button-third-small-width);
    height:var(--button-third-small-height);
}
/*Otros componentes*/

.checkBox-third + label{
    width: var(--checkBox-third-default-width);
    display: inline-block;
    position: relative;
    border-radius: 6px;
    background-color: var(--checkBox-third-default-background);
    border: 2px solid var(--checkBox-third-default-borderColor);
    height: var(--checkBox-third-default-height);
    cursor: pointer;
    border-style: solid;
    border-width: var(--checkBox-third-default-borderWidth);
   
}

.checkBox-third:checked + label{
    background-color: var(--checkBox-third-select-background);
    cursor: pointer;
    border: 1px solid var(--checkBox-third-select-borderColor);
   
    
} 

.checkBox-third:checked + label::after {
    position: absolute;
    content:'\2713';
    top: 50%;
    left: 50%;
    font-size: 14px;
    transform: translate(-50%, -50%);
    color: var(--checkBox-third-select-check); 
    
}
.mapBtn-label-select-fourth-h1{
    margin:0px;
    height: fit-content;
    font-weight: var(--fw-700-bold);
    font-size: var(--mapButton-fourth-select-h1-fontSize);
    color: var(--mapButton-fourth-select-h1-fontColor) !important;
    font-family: var(--font-montserrat);

}
/* ---------------------------- */
/* RadionButton Librería 1 */

.radioButton-third{
    display: none;

}

.radioButton-third + label{
    width: var(--radioButton-third-default-width);
    display: inline-block;
    position: relative;
    border-radius: 50%;
    background-color: var(--radioButton-third-default-background);
    border: 2px solid var(--radioButton-third-default-borderColor);
    box-sizing: border-box;
    height: var(--radioButton-third-default-height);
    cursor: pointer;
    border-style: solid;
    border-width: var(--radioButton-third-default-borderWidth);
    
}

.radioButton-third:checked + label{
    background-color: var(--radioButton-third-select-background);
    cursor: pointer;
    border: 2px solid var(--radioButton-third-select-borderColor);
    
} 

.radioButton-third:checked + label::after {
    position: absolute;
    width: var(--radioButton-third-select-check-width);
    height: var(--radioButton-third-select-check-height);
    content: "";
    top: 50%;
    left: 50%;
    font-size: 14px;
    border-radius: var(--radioButton-borderRadius);
    position: absolute;
    transform: translate(-50%, -50%);
    background-color: var(--radioButton-third-select-check);
    
}

/* ------------------ */
.icon-button-third{    
    width: var(--icon-button-third-width);
    height: var(--icon-button-third-height);
    border-radius: var(--icon-button-third-borderRadius);
    background-color: var(--icon-button-third-default-backgroundColor);
    border: 1px solid var(--icon-button-third-default-borderColor);
    align-items: center;
    display: flex;
    justify-content: center;
    padding: 0px;
   
}
.icon-btn-icon-third{
    fill: var(--icon-button-third-default-icon-fill);
    height: var(--icon-button-third-icon-height);
    display: block;
    
}
.icon-button-third:active{
    width: var(--icon-button-third-width);
    height: var(--icon-button-third-height);
    border-radius: var(--icon-button-third-borderRadius);
    background-color: var(--icon-button-third-active-backgroundColor);
    border: 1px solid var(--icon-button-third-active-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
    
}
.icon-button-third:active  .icon-btn-icon-third{
    fill: var(--icon-button-third-active-icon-fill);
   
}

.add-button-third{    
    width: var(--add-button-third-width);
    height: var(--add-button-third-height);
    border-radius: var(--add-button-third-borderRadius);
    background-color: var(--add-button-third-default-backgroundColor);
    align-items: center;
    display: flex;
    justify-content: center;
    padding: 0px; 
    
}

.add-btn-icon-third{
    fill: var(--add-button-third-default-icon-fill);  
    display: block; 
}

.add-button-third-active{    
    width: var(--add-button-third-width);
    height: var(--add-button-third-height);
    border-radius: var(--add-button-third-borderRadius);
    background-color: var(--add-button-third-active-backgroundColor);
    border: 1px solid var( --add-button-third-active-borderColor);
    align-items: center;
    display: flex;
    justify-content: center;
    padding: 0px;
}

.add-button-third-active .add-btn-icon-third{
    fill: var(--add-button-third-active-icon-fill);
    display: block;
}

.scroll-bar-third{
    display:absolute;
    position: relative;
    width: 7px;
   
}
.scroll-bar-third-background{
    width: 7px;
    margin: 0;
    padding: 0;
    position: relative;
    border-radius: 6px;
    background-color:var(--scrollBar-third-backgroundColor);
    min-height:60px;
    height: 100%;
    overflow-y: scroll;
   
}
.scroll-bar-third-handle{
    width: 7px;
    margin: 0;
    padding: 0;
    position: absolute;
    display:inline;
    justify-items: center;
    border-radius: 20px;
    background-color: var(--scrollBar-third-handle);
    height: 30px;
    animation: scroll-down 8s infinite alternate ease-in-out;
   
}
@keyframes scroll-down {
    0%{
        top:0;
        
    }
    100%{
        top: calc(100% - 100px); 
    }
}
/*Botones mapa*/




/*Botones Mapa*/


.generic-map-btn-third,
.search-map-btn-third{
    width: var(--mapButton-third-width);
    height: var(--mapButton-third-height);
    border-radius: var(--mapButton-third-borderRadius);
    border: none;
    background-color: var(--mapButton-third-defaultHover-background);
    display: inline-block;
    box-shadow: var(--mapButton-third-default-shadow);
    margin-right:16px;
    
}
    
.info-map-btn-third-left,
.generic-map-btn-left-third{
    width: var(--mapButton-third-width);
    height: var(--mapButton-third-height);
    border-radius: var(--mapButton-third-borderRadius);
    border: none;
    background-color: var(--mapButton-third-defaultHover-background);
    display: inline-block;
    box-shadow: var(--mapButton-third-default-shadow);
    margin-left:16px;
    
}

.zoomPlus-map-btn-third{ 
    width: var(--mapButton-third-width);
    height: var(--mapButton-third-height);
    border: none;
    margin-right:16px;
    background-color: var(--mapButton-third-defaultHover-background);
    border-radius: var(--zoomPlus-button-default-borderRadius);
   
    display: inline-block;
    align-items: center;
    box-shadow: var(--mapButton-third-default-shadow);
    
    
}

.zoomMinus-map-btn-third{ 
    width: var(--mapButton-third-width);
    height: var(--mapButton-third-height);
    border: none;
    margin-right:16px;
    background-color: var(--mapButton-third-defaultHover-background);
    border-radius: var(--zoomMinus-button-default-borderRadius);
    display: inline-block;
    align-items: center;
    box-shadow: var(--mapButton-third-default-shadow);
    
  
   
} 
.map-btn-icon-second{
    fill: var(--mapButton-second-defaultHoverSelect-icon-color);
   
}

.info-map-btn-third-left:hover,
.generic-map-btn-left-third:hover,
.generic-map-btn-third:hover,
.search-map-btn-third:hover,
.zoomPlus-map-btn-third:hover,
.zoomMinus-map-btn-third:hover{
    background-color: var(--mapButton-third-defaultHover-background);
}


.info-map-btn-third-left:hover + .mapBtn-third-hover-label-left,
.generic-map-btn-third:hover + .mapBtn-third-hover-label,

.generic-map-btn-left-third:hover + .mapBtn-third-hover-label-left,
.search-map-btn-third:hover + .mapBtn-third-hover-label,
.zoomPlus-map-btn-third:hover + .mapBtn-third-hover-label2,
.zoomMinus-map-btn-third:hover + .mapBtn-third-hover-label-bottom{
    display: inline-block;

}
.info-map-btn-third-left:focus,
.generic-map-btn-left-third:focus,
.generic-map-btn-third:focus,
.search-map-btn-third:focus,
.zoomPlus-map-btn-third:focus,
.zoomMinus-map-btn-third:focus{
    background-color: var(--mapButton-third-select-background);
   
}
.info-map-btn-third-left:focus .map-btn-icon-third,
.generic-map-btn-left-third:focus .map-btn-icon-third,
.generic-map-btn-third:focus .map-btn-icon-third,
.search-map-btn-third:focus .map-btn-icon-third,
.zoomPlus-map-btn-third:focus .map-btn-icon-third,
.zoomMinus-map-btn-third:focus.map-btn-icon-third{
    fill: var(--mapButton-third-select-icon-fill);
    
}
.map-btn-icon-third{
    fill: var(--mapButton-third-defaultHover-icon-color);
   
}

.info-map-btn-third-left:focus ~ .mapBtn-third-select-label{
    display: flex;
    position: absolute;
    width: max-content;
    height: max-content;
    left:89px;
   
    
}  
.search-map-btn-third:focus ~ .mapBtn-third-select-label{ 
    display: flex;
    position: absolute;
    width: max-content;
    height: max-content;
    left:89px;


}

.generic-map-btn-left-third:focus ~ .mapBtn-third-layers-label-select{
    display: flex;
    position: absolute;
    width: max-content;
    height: max-content;
    left:89px;


}

.generic-map-btn-third:focus ~ .mapBtn-third-bLayers-label-select{
    display: flex;
    position: absolute;
    width: max-content;
    right:89px;
    


}

.mapBtn-third-hover-label{
    display: none;
    position: absolute;
    top: 50%; 
    box-shadow: var(--mapButton-third-hover-label-shadow);
    left: calc(100% + 16px);
    transform: translateY(-50%);
    background-color: var(--mapButton-third-hover-label-background);
    padding: var(--mapButton-third-hover-label-padding);
    border-radius: var(--mapButton-third-hover-label-borderRadius);
    white-space: nowrap;
    
}
.mapBtn-third-hover-label2{
    display: none;
    position: absolute;
    top: 20%; 
    box-shadow: var(--mapButton-third-hover-label-shadow);
    left: calc(100% + 16px);
    transform: translateY(-50%);
    background-color: var(--mapButton-third-hover-label-background);
    padding: var(--mapButton-third-hover-label-padding);
    border-radius: var(--mapButton-third-hover-label-borderRadius);
    white-space: nowrap;
   
    
}
.mapBtn-third-hover-label::before {/* Triángulo */
    content: "";
    position: absolute;
    top: 50%; 
    left: -21px;
    width: 0;
    height: 0;
    transform: translateY(-50%);
    border-style: solid;
    border-width: var(--mapButton-third-hover-label-triangle-borderWidth);
    border-color: var(--mapButton-third-hover-label-triangle-borderColor);
   
}
.mapBtn-third-hover-label2::before {/* Triángulo */
    content: "";
    position: absolute;
    top: 50%; 
    left: -21px;
    width: 0;
    height: 0;
    transform: translateY(-50%);
    border-style: solid;
    border-width: var(--mapButton-third-hover-label-triangle-borderWidth);
    border-color: var(--mapButton-third-hover-label-triangle-borderColor);
   
}


.mapBtn-third-hover-label-bottom{
    display: none;
    position:absolute;
    padding: var(--mapButton-third-hover-label-padding);
    border-radius: var(--mapButton-third-hover-label-borderRadius);
    box-shadow: var(--mapButton-third-hover-label-shadow);
    top:70%;
    left: calc(100% + 16px);
    transform: translateY(-50%);
    white-space: nowrap;
    width: max-content;
    background-color: var(--mapButton-third-hover-label-background);
}
.mapBtn-third-hover-label-bottom::before {/* Triángulo */
    content: "";
    position: absolute;
    top: 50%; 
    left: -21px;
    width: 0;
    height: 0;
    transform: translateY(-50%);
    border-style: solid;
    border-width: var(--mapButton-third-hover-label-triangle-borderWidth);
    border-color: var(--mapButton-third-hover-label-triangle-borderColor);
}

.mapBtn-third-hover-label-left{
    display: none;
    position: absolute;
    top: 50%; 
    box-shadow: var(--mapButton-third-hover-label-shadow);
    right: calc(100% + 16px);
    transform: translateY(-50%);
    background-color: var(--mapButton-third-hover-label-background);
    padding: var(--mapButton-third-hover-label-padding);
    border-radius: var(--mapButton-third-hover-label-borderRadius);
    white-space: nowrap;
   
    
}
.mapBtn-third-hover-label-left::before {/* Triángulo */
    content: "";
    position: absolute;
    top: 50%; 
    right: -21px;
    width: 0;
    height: 0;
    transform: translateY(-50%);
    border-style: solid;
    border-width: var(--mapButton-third-hover-label-triangle-left-borderWidth);
    border-color: var(--mapButton-third-hover-label-triangle-left-borderColor);
    
}


.mapBtn-third-hover-label-title{
    margin: 0;
    text-align: center;
    justify-items: center;
    padding: 0;
    height: 20px;
    font-weight: var(--fw-600-semiBold);
    font-size: var(--mapButton-third-hover-label-fontSize);
    color: var(--mapButton-third-hover-label-fontColor)!important;
    font-family: var(--font-montserrat);
   
}

.mapBtn-third-select-label{ /*Labels select*/
    display: none;
    flex-direction: column;
    background:  var(--mapButton-third-select-label-background);
    border-radius: var(--mapButton-third-select-label-borderRadius);
    position: absolute;
    padding: var(--mapButton-third-select-label-padding);
    top:0;
    text-align:left;
    
   
} 

.mapBtn-third-layers-label-select{ /*Labels select Capas*/
    display: none;
    background:  var(--mapButton-third-select-label-background);
    border-radius: var(--mapButton-third-select-label-borderRadius);
    position: absolute;
    flex-direction: column;
    padding: var(--mapButton-third-select-label-padding);
    top:0;
    
    text-align:left;
    
}

.mapBtn-third-bLayers-label-select{ /*Labels select Capas Base*/
    display: none;
    background:  var(--mapButton-third-select-label-background);
    border-radius: var(--mapButton-third-bLayers-label-select-borderRadius);
    position: absolute;
    padding: var(--mapButton-third-bLayers-label-select-padding);
    flex-direction: column;
    top:14px;
    text-align:left;
    
}

.mapBtn-third-select-label-h1{
    margin: 0;
    width: 100%;
    margin-bottom:16px;
    height: fit-content;
    font-weight: var(--fw-700-bold);
    font-size: var(--mapButton-third-select-h1-fontSize);
    color: var(--mapButton-third-select-h1-fontColor)!important;
    font-family: var(--font-montserrat);

}

.mapBtn-third-select-label-p{
    margin:0px;
    font-weight: var(--fw-500-medium);
    font-size: var(--mapButton-third-select-label-body-fontSize);
    color: var(--mapButton-third-select-label-body-fontColor);
    font-family: var(--font-montserrat);
    width: max-content;
    
   
}


.mapBtn-third-select-label-logoContainer{
    display: flex;
    flex-direction: column;
    width: var(--mapButton-third-select-label-logoContainer-width);
    padding: var(--mapButton-third-select-label-logoContainer-padding);
    gap:10px;
    background-color: var(--mapButton-third-select-label-logoContainer-background);
    border-radius: var(--mapButton-third-select-label-logoContainer-borderRadius);
    box-shadow: var(--mapButton-third-select-label-logoContainer-shadow);
    --mapButton-third-select-label-logoContainer-shadow:-4px -4px 10px rgba(255, 255, 255, 0.2), 4px 4px 10px rgba(255, 255, 255, 0.2);
    --mapButton-third-select-label-logoContainer-padding:14px 16px;
    --mapButton-third-select-label-logoContainer-borderRadius:24px;
    --mapButton-third-select-label-logoContainer-width:222px;
    --mapButton-third-select-label-logoContainer-background:#fff;
}


.input-first-default-nonVisible{
    display:flex;
   align-self: center;
    right: 100px;
    height: var(--input-first-default-height-smallSize);
    width: var(--input-first-default-width-smallSize);
    padding: 10px;
    margin: 0px;
    background-color: var(--input-default-background);
    border-radius: 24px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fourth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fourth-default-borderColor);
    color: var(--input-fourth-default-fontColor);
  
    
}










/*Input capas*/



.i-layers-third-inputItem{
    width: var(--inputItem-third-large-width);
    min-height:var(--inputItem-third-minHeight);
    border-radius: var(--inputItem-third-borderRadius);
    display: flex;
    flex-direction: column;
    background-color: var(--inputItem-third-default-background);
    padding: var(--inputItem-third-padding);
    gap:10px;
    
}
.i-layers-third-inputItem-lg{
    width: var(--inputItem-third-large-width);
    min-height:var(--inputItem-third-minHeight);
}
.i-layers-third-inputItem-md{
    width: var(--inputItem-third-medium-width);
    min-height:var(--inputItem-third-minHeight);
}
.i-layers-third-inputItem-sm{
    width: var(--inputItem-third-small-width);
    min-height:var(--inputItem-third-minHeight);
}
.i-layers-third-inputItem:hover{
    background-color: var(--inputItem-third-hover-background);

}
.i-layers-third-inputItem-iconH1-container{
    display: flex;
    width: max-content;
    flex-direction: row;
    gap: 10px;
    align-items: center;

}

.i-layers-third-inputItem-legend-lists-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;

}
.i-layers-third-inputItem-iconH1Button-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-height: 35px;
    
}
.i-layers-third-inputItem-legend-container{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: start;
    width: 100%;
    gap: 12px;

    
}

.i-layers-third-inputItem .icon-button-third{
    margin-right:8px;
}
.i-layers-third-inputItem-legend-h1{
    color:var(--inputItem-third-select-legend-h1-fontColor);
    font-size: var(--inputItem-third-select-legend-h1-fontSize);
    font-family: var(--font-montserrat);
    font-weight:var(--fw-500-medium);
   
}

.i-layers-third-inputItem-legend-body{
    color:var(--inputItem-first-select-legend-body-fontColor);
    font-size: var(--inputItem-third-select-legend-body-fontSize);
    font-family: var(--font-montserrat);
    font-weight:var(--fw-500-medium);
   
}


.i-layers-first-inputItem-legend-list{
    align-items:center;
    display: flex;
    flex-direction: row;
    gap: 8px;
    height: 18px;

    
   

}
.i-layers-first-inputItem-sliderInfoBtn-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    
    max-height: 22px;
    
}

.i-layers-first-inputItem-sliderInfoBtn-container .slider{
    max-width: 200px;
    
}
.inputItem-third-h1{
    color:var(--inputItem-first-default-h1-fontColor);
    font-size: var(--inputItem-first-h1-fontSize);
    font-family: var(--font-montserrat);
    font-weight: var(--fw-500-medium);
   

}
.i-layers-third-inputItem-icon{
    fill: var(--inputItem-third-default-icon-fill);
    

}

.layers-container-third {
   
    display: flex;
    width: max-content;
    flex-direction: column;
    gap: 14px;
}

.layers-scrollBar-container-third{
    display: flex;
    flex-direction: row;
    gap: 14px;


}

.bLayers-container-third{
    display: flex;
    flex-direction: row;
    gap: 14px;


}
.b-layers-btn-third{
    height: var(--b-layers-button-small-maxheight);
    max-width: var(--b-layers-button-third-small-maxWidth);
    border-radius: 24px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    background-color: var(--b-layers-button-fourth-background);
    padding: var(--b-layers-button-third-padding);
    align-items: center;
    gap: 8px;
    font-size: 14px;
    box-sizing: border-box;
    color: var(--button-fourth-secondary-select-borderColor);
    
}
.b-layers-btn-third-lg{
    height: var(--b-layers-button-third-large-maxHeight);
    max-width: var(--b-layers-button-third-large-maxWidth);
}

.b-layers-btn-third-md{
    height: var(--b-layers-button-third-medium-maxHeight);
    max-width: var(--b-layers-button-third-medium-maxWidth);
}
.b-layers-btn-third-sm{
    height: var(--b-layers-button-third-small-maxHeight);
    max-width: var(--b-layers-button-third-small-maxWidth);
}
.b-layers-btn-third-img{
    height: var(--b-layers-button-third-img-small-maxHeight);
    width: 100%;

    object-fit: cover;
    border-radius: 18px;
    --b-layers-button-third-img-large-maxHeight:105px;
    --b-layers-button-third-img-medium-maxHeight:100px;
    --b-layers-button-third-img-small-maxHeight:95px;
}
.b-layers-btn-third .bt-third-tertiary,
.b-layers-btn-third .bt-third-tertiary-active{
    width: 100%;
    height: fit-content;
    
}
.txt-icon-div-first-default{ /*Div con Icono y Texto*/
    gap: 8px;
    display: flex;
    align-items: center;
    color: var(--inputItem-first-default-h1-fontColor);
    font-weight: var(--fw-500-medium);
    font-size: var(--inputItem-first-h1-fontSize);
    font-family: var(--font-montserrat);

}

.infoLayers-icon-first-default{ /*Icono*/
    color:var( --inputItem-first-default-icon-fill);

}
.b-layers-first-inputItem:hover,
.i-layers-first-inputItem:hover,
.infoLayers-input-first-default:hover{
    background-color: var(--inputItem-first-hover-background);
    border: 1px solid var(--inputItem-first-borderColor);
    color:var(--inputItem-first-hover-h1-fontColor)!important;
    --inputItem-first-hover-h1-fontColor:#fff;
   
}
.b-layers-first-inputItem:hover .inputItem-first-h1,
.i-layers-first-inputItem:hover .inputItem-first-h1,
.i-layers-first-inputItem:hover .i-layers-first-inputItem-legend-h1,
.i-layers-first-inputItem:hover .i-layers-first-inputItem-legend-body{
   
    color:var(--inputItem-first-hover-h1-fontColor)!important;
    --inputItem-first-hover-h1-fontColor:#fff;
   
}
.i-layers-first-inputItem:hover .i-layers-first-inputItem-icon{
    fill: var(--inputItem-first-hover-icon-fill);
   
}


/*Acordeones*/


.accordion-third input {
    position: absolute;
    width: 360px;
    height: 45px;
    opacity: 0;
    z-index: 0;
}

  .accordion-third{
    margin: 0px;
    border-radius: 24px;
    overflow: hidden;
    
    width:max-content;
    height: max-content;

  }
  .accordion-third-label1,
  .accordion-third-label2{
    display: flex;
    width:var(--accordion-third-medium-width);
    height: var(--accordion-third-medium-height);
    cursor: pointer;
    align-items: center;
    background-color: var(--accordion-third-background);
    border-radius: var(--accordion-third-borderRadius);
    padding: var(--accordion-third-padding);
    align-items: center;
    justify-content: space-between;
    font-weight: var(--fw-500-medium);
    font-size: var(--accordion-third-h1-fontSize);
    color: var(--accordion-third-h1-fontColor);
    font-family: var(--font-montserrat);  
   
}
.accordion-third-iconH1-container{
    font-weight: var(--fw-500-medium);
    font-size: var(--accordion-third-h1-fontSize);
    color: var(--accordion-third-h1-fontColor);
    display: flex;
    gap: 10px;
    align-items: center;

}

.accordion-third-content{
    max-height: 0;
    display: flex;
    overflow: hidden;
    padding: 0px;
    margin: 0;
    gap: 12px;
    border-radius: var(--accordion-third-content-borderRadius);
    background-color: var(--accordion-third-background);
    width: var(--accordion-third-large-width);
    transition: all 0.35s;
}


input#tab7:checked ~ .accordion-third-content{
    max-height: 300px;
}
  input#tab8:checked ~ .accordion-third-content{
    max-height: 300px;
  }
  input:checked ~ .accordion-third-label1 .chevron-svg-third,
  input:checked ~ .accordion-third-label2 .chevron-svg-third{
    transform: rotate(180deg);
    transition: transform 0.35s ease;

   
  }
  input:checked ~ .accordion-third-label1,
  input:checked ~ .accordion-third-label2{
    border-radius: 0px;
  }
  
.accordion-first-h1Icon-container{
    display: flex;
    flex-direction: row;
    gap: 8px;

}
.chevron-svg-third{
    color: var(--inputItem-third-default-icon-fill);
    padding: 0px;
    margin: 0px;
    stroke-width:1px;
    stroke: var(--inputItem-third-default-icon-fill);

}
.accordion-third-content-legend-container{
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
    margin: var(--accordion-second-padding);
}

.accordion-third-content-legend-container-list{
    display: flex;
    flex-direction: column;
    gap: 8px;
    
   

}

.accordion-third-content-legend-container-list-item{
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
    color:var(--accordion-third-body-fontColor);
    font-size: var(--accordion-third-body-fontSize);
    font-weight: var(--fw-500-medium);
   
    
}

.inputItem-third-iconButtons-container{
    display: flex;
    flex-direction: row;
    gap: 0px;
}

.i-layers-third-inputItem-sliderInfoBtn-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;

    max-height: 22px;
    
}

.i-layers-third-inputItem-sliderInfoBtn-container .slider{
    max-width: 330px
    
}


/*DataPanel*/

.dataPanel-third-container{
    display: flex;
    max-width: var(--dataPanel-third-medium-maxWidth);
    flex-direction: column;
    padding: var(--dataPanel-third-padding);
    gap:var(--dataPanel-third-gap);
    border-radius:var(--dataPanel-third-borderRadius);
    flex-wrap: wrap;
    background: var(--dataPanel-third-background);
    box-shadow: var(--dataPanel-third-shadow);
   
}
.dataPanel-third-h1IconExit-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.dataPanel-third-h1Icon-container{
    display: flex;
    flex-direction: row;
    gap:10px;
    align-items: center;
}
.dataPanel-third-h1{
    font-weight:var(--fw-700-bold);
    font-family: var(--font-montserrat);
    color: var(--dataPanel-third-h1-fontColor);
    font-size: var(--dataPanel-first-h1-fontSize);
}
.dataPanel-third-h1Icon-container-icon{
    fill:var(--dataPanel-third-h1Icon-container-icon-fill);
    
}

.dataPanel-third-listScroll-container{
    display: flex;
    flex-direction: row;
    gap: 8px;

}

.dataPanel-third-listScroll-container .scroll-bar-third-background{
    height:100%;
}

.dataPanel-third-container .bt-third-tertiary{
    width: 100%;

}


.dataPanel-third-list{
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;

}

.dataPanel-third-list-item{
    display: flex;
    padding: var(--dataPanel-third-list-item-padding);
    border-radius: var(--dataPanel-third-list-item-borderRadius);
    color: var(--dataPanel-third-list-item-fontColor);
    font-size: var( --dataPanel-third-list-item-fontSize);
    font-weight: var(--fw-500-medium);
    background-color: var(--dataPanel-third-list-item-background);
    width: 90%;
    
}
/*/Librería 5*/
/*Botones*/

.bt-fifth-primary{
    border-radius: var(--button-fifth-borderRadius);
    border: none;
    background-color: var(--button-fifth-primary-default-background);
    width: var(--button-fifth-medium-width);
    height: var(--button-fifth-small-height);
    display: flex;
    position: relative;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: var(--button-fifth-padding);
    color: var(--button-fifth-primary-default-fontColor);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    font-size: var(--button-fifth-fontSize);
    box-sizing: border-box;
    padding: var(--button-fifth-padding-y) var(--button-fifth-padding-x);
    
}

.bt-fifth-primary:hover{
        background-color: var(--button-fifth-primary-hoverSelect-background);
        display: flex;
        position: relative;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        padding: var(--button-fifth-padding-y) var(--button-fifth-padding-x);
        
}

.bt-fifth-primary:active{
    border-radius: var(--button-fifth-borderRadius);
    border: none;
    background-color: var(--button-fifth-primary-default-background);
    width: var(--button-fifth-medium-width);
    height: var(--button-fifth-small-height);
    display: flex;
    position: relative;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    background-color: var(--button-fifth-primary-hoverSelect-background);
    padding: var(--button-fifth-padding);
    color: var(--button-fifth-primary-default-fontColor);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    font-size: var(--button-fifth-fontSize);
    box-sizing: border-box;
    padding: var(--button-fifth-padding-y) var(--button-fifth-padding-x);
    
    
}

.bt-fifth-primary:disabled{
    opacity: 50%;
}

.bt-fifth-secondary{ 
        border-radius: 24px;
        background-color: var(--button-fifth-secondary-default-background);
        border: 1px solid var(--button-fifth-secondary-default-borderColor);
        width: var(--button-fifth-medium-width);
        height: var(--button-fifth-small-height);
        border-radius: var(--button-fifth-borderRadius);
        position: relative;
        flex-direction: row;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        color: var(--button-fifth-secondary-default-fontColor);
        font-weight: var(--fw-600-semiBold);
        font-size: var(--button-fifth-fontSize);
        font-family: var(--font-montserrat);
        box-sizing: border-box;
        padding: var(--button-fifth-padding-y) var(--button-fifth-padding-x);
        
}

.bt-fifth-secondary:hover{
      
        background-color: var(--button-fifth-secondary-hover-background);
        
        
 }
 .bt-fourth-secondary:active{
    display: flex;
    position: relative;
    flex-direction: row;
    background-color: var(--button-fourth-secondary-select-background);
    border: 1px solid var(--button-fourth-secondary-select-borderColor);
    color: var(--button-fourth-secondary-select-borderColor);
    font-size: var(--button-fourth-text-size);
    font-family: var(--button-fourth-text);
    box-sizing: border-box;
    padding: var(--button-fifth-padding-y) var(--button-fifth-padding-x);
    
}

.bt-fifth-secondary:disabled{
   opacity: 50%;

}
.btn-fifth-lg{
    width:var(--button-fourth-large-width);
    height:var(--button-fourth-large-height);
}

.btn-fifth-md{
    width:var(--button-fourth-medium-width);
    height:var(--button-fourth-medium-height);
}
.btn-fifth-sm{
    width:var(--button-fourth-small-width);
    height:var(--button-fourth-small-height);
}
/* Otros componentes */

.checkBox-fifth{
    display:none;
}
.checkBox-fifth + label{
    width: var(--checkBox-fifth-width);
    height: var(--checkBox-fifth-height);
    display: inline-block;
    position: relative;
    border-radius: var(--checkBox-borderRadius);
    background-color: var(--checkBox-fifth-default-background);
    border: 2px solid var(--checkBox-fifth-default-borderColor);
    box-sizing: border-box;
    cursor: pointer;
    
   
} 

.checkBox-fifth:checked + label {
    background-color: var(--checkBox-fifth-select-background);
    border: 2px solid var(--checkBox-fifth-select-borderColor);
    cursor: pointer;
   
} 



.checkBox-fifth:checked + label::after {
    position: absolute;
    content:'\2713';
    top: 50%;
    left: 50%;
    font-size: 14px;
    transform: translate(-50%, -50%);
    color: var(--checkBox-fifth-select-check); 
    
}

.radioButton-fifth{
    display: none;

}

.radioButton-fifth + label{
    width: var(--radioButton-fifth-width);
    height: var(--radioButton-fifth-height);
    display: inline-block;
    position: relative;
    border-radius: var(--radioButton-borderRadius);
    background-color: var(--radioButton-fifth-default-background);
    border: 2px solid var(--radioButton-fifth-default-borderColor);
    box-sizing: border-box;
    height: var(--radioButton-fifth-height);
    cursor: pointer;
   
    
}

.radioButton-fifth:checked + label{
    background-color: var(--radioButton-first-select-background);
    cursor: pointer;
    border: 2px solid var(--radioButton-fifth-select-borderColor);
   
    
} 

.radioButton-fifth:checked + label::after {
    position: absolute;
    width: var(--radioButton-fifth-select-check-width);
    height: var(--radioButton-fifth-select-check-height);
    content: "";
    top: 50%;
    left: 50%;
    border-radius: var(--radioButton-borderRadius);
    position: absolute;
    transform: translate(-50%, -50%);
    background-color: var(--radioButton-fifth-select-check);

    
}


/* ----------------- */

.icon-button-fifth-default{    
    width:var(--icon-button-fifth-width);
    height: var(--icon-button-fifth-height);
    border-radius: var(--icon-button-fifth-borderRadius);
    background-color: var(--icon-button-fifth-default-background);
    border: 2px solid var( --icon-button-fifth-default-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
    
}


.icon-button-fifth-default:active{
    width:var(--icon-button-fifth-width);
    height: var(--icon-button-fifth-height);
    border-radius: var(--icon-button-fifth-borderRadius);
    background-color: var(--icon-button-fifth-select-background);
    border: 2px solid var( --icon-button-fifth-select-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
    
}

.icon-btn-icon-fifth{
    fill: var(--icon-button-fifth-icon-default-fill);
    display: block;
   
    
}
.icon-button-fifth-default:active .icon-btn-icon-fifth{
    fill: var(--icon-button-fifth-icon-select-fill);
    
}

.save-button-fifth{
    width:  var(--saveButton-fifth-width);
    height: var(--saveButton-fifth-height);
    border-radius: var(--saveButton-fifth-borderRadius);
    background-color: var(--saveButton-fifth-default-background);
    border: 2px solid var(--saveButton-fifth-default-borderColor);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
   
}
.save-button-fifth:active{
    border: 2px solid var(--saveButton-fifth-select-borderColor);
   

}

.save-icon-fifth,
.save-icon-fifth-stroke{
    width:11px;
    height:12px;
    stroke: var(--saveButton-fifth-default-icon-borderColor);
    display: block;
    
}

.save-button-fifth:active .save-icon-fifth,
.save-button-fifth:active .save-icon-fifth-stroke{

    fill: var(--saveButton-fifth-select-icon-fill);
    stroke: var(--saveButton-fifth-select-icon-borderColor);
    
    
}


.scroll-bar-fifth{
    display:absolute;
    position: relative;
    width: 9px;
   
}
.scroll-bar-fifth-background{
    width: var( --scrollBar-fifth-background-width);
    margin: 0;
    padding: 0;
    position: relative;
    border-radius: var(--scrollBar-fifth-background-borderRadius);
    background-color:var(--scrollBar-fifth-background);
    min-height:60px;
    height: 100%;
    overflow-y: scroll;

    
    
}
.scroll-bar-fifth-handle{
    width: var(--scrollBar-fifth-handle-width);
    margin: 0;
    padding: 0;
    position: absolute;
    display:inline;
    border-radius: var(--scrollBar-fifth-handle-borderRadius);
    background-color: var(--scrollBar-fifth-handle);
    height: 30px;
    animation: scroll-down 12s infinite alternate ease-in-out;
    
}
@keyframes scroll-down {
    0%{
        top:0;
        
    }
    100%{
        top: calc(100% - 50px); 
    }
}

.slider-fifth {
    -webkit-appearance: none;
    width: 100%;
    height: var(--slider-fifth-default-background-height);
    border-radius: var(--slider-fifth-borderRadius);
    background: linear-gradient(to right, #477B64 var(--progress), #e6eddf var(--progress));
    cursor: pointer;
    outline: none;

}

.slider-fifth::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: var(--slider-fifth-default-handle-width);
    height: var(--slider-fifth-default-handle-height);
    background-color: var(--slider-fifth-default-handle-background);
    border: 2px solid var(--slider-fifth-default-handle-borderColor);
    border-radius: 50%;
    cursor: pointer;
   
}

/*Botón mapa Info*/

.info-map-btn-fifth-left,
.generic-map-btn-fifth,
.generic-map-btn-fifth-left,
.layers-map-btn-fifth-left,
.polygons-map-btn-fifth,
.search-map-btn-fifth{
    width: var(--mapButton-fifth-width);
    height: var(--mapButton-fifth-height);
    border-radius: var(--mapButton-fifth-borderRadius);
    border: none;
    background-color: var(--mapButton-fifth-default-background);  
    display: inline-block;
    box-shadow: var(--button-shadow-2);
    
}


.zoomPlus-map-btn-fifth{ 
    width: var(--mapButton-fifth-width);
    height: var(--mapButton-fifth-height);
    border: none;
    border-radius: var(--zoomPlus-map-btn-fifth-borderRadius);
    background-color: var(--mapButton-fifth-default-background);  
    display: inline-block;
    align-items: center;
    --zoomPlus-map-btn-fifth-borderRadius:20px 20px 0px 0px;
}

.zoomMinus-map-btn-fifth{ 
    width: var(--mapButton-fifth-width);
    height: var(--mapButton-fifth-height);
    border-radius: var(--zoomMinus-map-btn-fifth-borderRadius);
    border: none;
    background-color: var(--mapButton-fifth-default-background);  
    display: inline-block;
    --zoomMinus-map-btn-fifth-borderRadius:0px 0px 20px 20px;
} 

.map-btn-icon-fifth{
    fill:var(--mapButton-fifth-icon-fill);
    
}
.info-map-btn-fifth-left:hover,
.generic-map-btn-fifth:hover,
.generic-map-btn-left-fifth:hover,
.polygons-map-btn-fifth:hover,
.zoomMinus-map-btn-fifth:hover,
.zoomPlus-map-btn-fifth:hover,
.layers-map-btn-fifth-left:hover,
.search-map-btn-fifth:hover{
    background-color: var(--mapButton-fifth-hover-background);  
    
}

.info-map-btn-fifth-left:hover + .mapBtn-fifth-hover-label-left,
.generic-map-btn-fifth-left:hover + .mapBtn-fifth-hover-label-left,
.generic-map-btn-fifth:hover + .mapBtn-fifth-hover-label,
.polygons-map-btn-fifth:hover + .mapBtn-fifth-hover-label,
.zoomMinus-map-btn-fifth:hover + .mapBtn-fifth-hover-label-bottom,
.zoomPlus-map-btn-fifth:hover + .mapBtn-fifth-hover-label-top,
.search-map-btn-fifth:hover + .mapBtn-fifth-hover-label,
.layers-map-btn-fifth-left:hover + .mapBtn-fifth-hover-label-left{ 
    display: inline-block;
    align-items: center;
}   


.info-map-btn-fifth-left:focus,
.generic-map-btn-fifth:focus,
.generic-map-btn-fifth-left:focus,
.polygons-map-btn-fifth:focus,
.zoomPlus-map-btn-fifth:focus,
.layers-map-btn-fifth-left:focus,
.zoomMinus-map-btn-fifth:focus,
.search-map-btn-fifth:focus{
    background-color: var(--mapButton-fifth-select-background);
    
}

.generic-map-btn-fifth-left:focus ~ .mapBtn-fifth-select-container,
.generic-map-btn-fourth:focus ~ .card-fourth,
.layers-map-btn-fifth-left:focus ~ .mapBtn-fifth-select-container,
.info-map-btn-fifth-left:focus ~ .mapBtn-fifth-select-label-left
 {

    display: inline-block;
    box-shadow: var(--button-shadow-2);
    border-radius: 24px;
    border: none;
}  


.polygons-map-btn-fifth:focus ~ .buttons-container2{ 
    display: inline-block;
    align-items: center;
}  
.buttons-container2{
    display:none;
    position: absolute;
    left: calc(100% + 16px);
    width: max-content;
    margin: 0px;
    padding: 0px;

}

.mapBtn-fifth-hover-label{
    display: none;
    position:absolute;
    width: max-content;
    padding: var(--mapButton-fourth-hover-label-padding);
    padding: 12px;
    border-radius: 16px;
    background-color: var(--mapButton-fifth-hover-label-background);
    left: calc(100% + 20px);
    white-space: nowrap;

}

.mapBtn-fifth-hover-label-left{
    display: none;
    position: absolute;
    right: calc(100% + 20px);
    background-color: var(--mapButton-fifth-hover-label-background);
    padding: var(--mapButton-fifth-hover-label-padding);
    border-radius: var(--mapButton-fifth-hover-label-borderRadius);
    white-space: nowrap;
   
}

.mapBtn-fifth-hover-label-bottom{
    display: none;
   position: absolute;
   padding: var(--mapButton-fifth-hover-label-padding);
    border-radius: var(--mapButton-fifth-hover-label-borderRadius);
   left: calc(100% + 20px);
    bottom:6.5px;
    width: max-content;
    background-color: var(--mapButton-fifth-hover-label-background);
   
}
.mapBtn-fifth-hover-label-top{
    display: none;
   position: absolute;
   padding: var(--mapButton-fifth-hover-label-padding);
   border-radius: var(--mapButton-fifth-hover-label-borderRadius);
   left: calc(100% + 20px);
   top:6.5px;
    width: max-content;
    background-color: var(--mapButton-fifth-hover-label-background);
   
}

.mapBtn-label-hover-title-fifth{
    margin: 0;
    text-align: center;
    padding: 0;
    font-weight: var(--fw-600-semiBold);
    font-size: var(--mapButton-fifth-hover-label-fontSize);
    color: var(--mapButton-fifth-hover-label-fontColor)!important;
    font-family: var(--font-montserrat);
    
    
}
.mapBtn-fifth-select-label-left{
    display: none;
    position: absolute;
    padding: var(--mapButton-fifth-hover-label-padding);
    border-radius: var(--mapButton-fifth-hover-label-borderRadius);
    right: calc(100% + 20px);
    transform: translateY(-50%);
    top:90px;
    text-align:left;
    width: max-content;
    background-color: var(--mapButton-fifth-select-label-background);
    
} 
.mapBtn-fifth-select-label{
    display: none;
    position: absolute;
    padding: var(--mapButton-fifth-hover-label-padding);
    border-radius: var(--mapButton-fifth-hover-label-borderRadius);
    gap:10px;
    top:0;
    left: calc(100% + 20px);
    height: max-content;
    text-align:left;
    width: max-content;
    background-color: var(--mapButton-fifth-select-label-background);
    
} 
.search-map-btn-fifth:focus ~ .mapBtn-fifth-select-label{ 
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    animation: keepVisible 3s forwards;

}
@keyframes keepVisible {
    0% { opacity: 1; }
    100% { opacity: 1; }
}
    

.input-fifth-default-nonVisible{
    width: var(--input-fifth-large-width);
    display:flex;
   align-self: center;
   left: calc(100% + 20px);
    height: var(--input-fifth-medium-height);
    padding: var(--input-fifth-default-padding);
    margin: 0px;
    background-color: var(--input-default-background);
    border-radius: var(--input-fifth-default-borderRadius);
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fifth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fifth-default-borderColor);
    color: var(--input-fifth-default-fontColor);

    
}

.mapBtn-fifth-select-secondary-label{
    border-radius: var(--mapButton-fifth-hover-label-borderRadius);
    padding: var(--mapButton-fifth-hover-label-padding);
    margin: 4px;
    background-color: var(--mapButton-fifth-hover-label-background);
    font-weight: var(--fw-600-semiBold);
    font-size: var(--mapButton-fifth-hover-label-fontSize);
    color: var(--mapButton-fifth-hover-label-fontColor)!important;
    font-family: var(--font-montserrat);

}

.map-btn-select-secondary:focus{
    padding: 15.5px 20px;
    height: 51px;
    width: fit-content;
    margin-left: 10px;
    border-radius: 24px;
    background-color: var(--button-fourth-secondary-select-background);
    border: 1px solid var(--button-fourth-secondary-select-borderColor);
    font-size: var(--button-fourth-primary-size);
    color: var(--button-fourth-secondary-select-fontColor);
    font-family: var(--button-fourth-primary);
    font-weight: var(--fw-600-semiBold);
    
}

.mapBtn-fifth-select-label-left-subContainer{
    background:var(--mapButton-fifth-select-label-subContainer-background);
    
    border-radius:24px;
    padding:12px;
    margin-top:10px;
}
.mapBtn-label-select-fifth-h1{
    margin: 0;
    font-weight: var(--fw-700-bold);
    font-size: var(--mapButton-fifth-select-label-h1-fontSize);
    color: var(--mapButton-fifth-select-label-h1-fontColor)!important;
    font-family: var(--font-montserrat);
    

}

.p-info-fifth-map-btn-body{
    padding-bottom: 12px;
    margin: 0;
    font-weight: var(--fw-500-medium);
    font-size: var(--mapButton-fifth-select-body-fontSize);
    color: var(--mapButton-fifth-select-body-fontColor);
    font-family: var(--font-montserrat);
    
    
}
.logo-container-fifth{
    display: flex;
    width:234px;
   height:78px;
    border-radius: 24px;
    background-color: #fff;
    align-items: center;
    justify-content: center;
}
.mapBtn-fourth-select-label-layersBtn{
    display: none;
    position: absolute;
    cursor:pointer;
    border-radius: var(--mapButton-fourth-borderRadius);
    gap: 10px;
    margin: -16px  0px 0px 30px;
    padding: 16px 16px 16px 16px;
    font-weight: var(--fw-700-bold);
    height: fit-content;
    margin-left: 85px;
    text-align:left;
    font-weight: var(--fw-700-bold);
    background-color: var(--mapButton-fourth-select-label-layersBtn-background);
    font-size: var(--mapButton-fourth-select-h1-fontSize);
    color: var(--mapButton-fourth-select-h1-fontColor)!important;
    font-family: var(--mapButton-fourth-select-h1-font);
    
}

.layersAccordions-container {
   
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 12px;
}

.layersAccordions-scrollBar-container{
    display: flex;
    flex-direction: row;
    gap: 8px;
    margin-top: 0px;

}

.mapBtn-fifth-select-container{
    display: none;
    position: absolute;
    cursor:pointer;
    right: calc(100% + 20px);
    top:0;
    white-space: nowrap;
    width: max-content;
    height: max-content;
    padding: 16px 19px;
    border-radius: 24px;
    background-color: var(--listCard-fifth-background) !important;
}
.mapBtn-fifth-select-container-visible{
    display: flex;
    flex-direction: column;
    white-space: nowrap;
    width: max-content;
    height: max-content;
    padding: var(--mapBtn-fifth-select-container-visible-padding);
    border-radius: var(--mapBtn-fifth-select-container-visible-boderRadius);
    background-color: var(--mapBtn-fifth-select-container-visible-background) !important;
    
}
.list-fifth-title{
    color: var(--listCard-fifth-title-fontColor);
    font-size: var(--listCard-fifth-title-fontSize);
    font-family: var(--font-montserrat);
    font-weight: var(--fw-700-bold);
    margin:0px;
}
.listCard-fifth-title{
    font-weight: var(--fw-700-bold);
    color: var(--listCard-fifth-title-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--listCard-fifth-title-fontSize);
    margin:0px;
    
}


.listCard-fifth-secondary-h2{
    margin: 10px 0px 0px 0px;
    font-family: var(--font-montserrat);
    font-weight: var(--fw-700-bold);
    font-size: var(--dataPanel-fifth-h2-fontSize);
    color: var(--dataPanel-fifth-h2-fontColor);

}
.listCard-fifth-subContainer{
    display:flex;
    margin-top:12px;
    flex-direction: column;
    padding: var(--listCard-fifth-subContainer-padding);
    border-radius: var(--listCard-fifth-subContainer-borderRadius);
    background-color: var(--listCard-fifth-subContainer-background) !important;
    
}

.listCard-fifth-secondary-container{
    display:flex;
    width: 404px;
    gap: 8px;
    flex-direction: column;
    padding: 18px 16px;
    border-radius: 24px;
    background-color: var(--listCard-fifth-secondary-container) !important;
    --listCard-fifth-secondary-container:#FFF;
}

.listCard-fifth-secondary-titleIcon-container{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}
.listCard-image-fifth-secondary{
    width: var(--listCard-fifth-image-width);
    
    border-radius: var(--listCard-fifth-image-borderRadius);
    object-fit: cover;
    
}
.listCard-fifth-secondary-iconText-container{
    width:var(--listCard-fifth-secondary-iconText-container-width)!important;
    gap:0px;
    border-radius: var(--listCard-fifth-secondary-iconText-container-borderRadius);
    padding: var(--listCard-fifth-secondary-iconText-container-padding);
    background-color: var(--listCard-fifth-secondary-iconText-container-background);

}

.listCard-fifth-secondary-titleIcon-icon{
    fill:var(--listCard-fifth-secondary-titleIcon-icon-fill);
    stroke:var(--listCard-fifth-secondary-titleIcon-icon-stroke);
    

}
.listCard-fifth-secondary-title{
    font-weight: var(--fw-700-bold);
    color: var(--listCard-fifth-secondary-title-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--listCard-fifth-secondary-title-fontSize);

    margin:0px;
    --listCard-fifth-secondary-title-fontColor: #2B4A3C;
    --listCard-fifth-secondary-title-fontSize: 19px;
}

.list-fifth-subContainer-scroll-container{
    display:flex;
   gap:9px;
    flex-direction: row;
    margin:0px;
    

}
.list-fifth-subContainer-scroll-container .scroll-bar-fifth-background{
    height: 425px;
    margin-top:12px;
}
.list-fifth-subContainer{
    display:flex;
    margin-top:12px;
    flex-direction: column;
    padding: 16px;
    gap:24px;
    border-radius: 24px;
    background-color: var(--listCard-fifth-subContainer-background) !important;
    --listCard-fifth-subContainer-background:#FFF5CD;
}
.listCard-image-fifth{
    width: 367px;
    height: 216px;
    border-radius: 20px;


}
.list-fifth-subContainer-h1Layers-container{
    display: flex;
    flex-direction: column;
    gap:12px;

}
.listCard-fifth-h2{
    font-weight: var(--fw-600-semiBold);
    color: var(--listCard-fifth-h2-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--listCard-fifth-h2-fontSize);
    margin: 14px 0px 8px 0px;
    
}

.listCard-fifth-body{
    font-weight: var(--fw-400-regular);
    width:var(--listCard-fifth-body-width)!important;
    margin:0px;
    color: var(--card-fourth-body-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--card-fourth-body-fontSize);
    
}
.listCard-fifth-subContainer .bt-fourth-plain{
    padding:0px;
    width:63px
}

.card2-image{
    width: 507px;
    height: 216px;
    border-radius: 20px;

   
}


.input-fifth-default{
    width: var(--input-fifth-mediumSize-width);
    display:flex;
   align-self: center;
   left: calc(100% + 20px);
    height: var(--input-fifth-medium-height);
    padding: 12px;
    margin: 0px;
    background-color: var(--input-default-background);
    border-radius: 18px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fifth-default-fontSize);
    font-family: var(--font-montserrat);
    border: 1px solid var(--input-fifth-default-borderColor)!important;
    color: var(--input-fifth-default-fontColor);

    
}
.input-fifth-label{
    display: flex;
    flex-direction: column;
    font-weight: var(--fw-600-semiBold);
    background-color: transparent;
    font-size: var(--input-fifth-label-fontSize);
    font-family: var(--font-montserrat);
    color: var(--input-fifth-label-fontColor);
    text-align: left;



}
.inputList-fifth{
    display: flex;
    gap: 6px;   
    flex-direction: column;
    margin: 0;
    
}
.inputList-item-container-fifth{
    min-width: var(--inputList-fifth-item-minWidth);
    display: flex;
    flex-direction: row;
    border-radius: var(--inputList-fifth-item-borderRadius);
    background-color: var(--inputList-fifth-item-background);
    box-sizing: border-box;
    margin: 0px;
    align-items: center; 
    padding: var(--inputList-fifth-item-padding);
    justify-content: space-between;

}


.icon-item-container{
    width: fit-content;
    height: fit-content;
    display: flex;
    flex-direction: row;
    padding: 0;
    margin: 0;  
    margin-right: 20px;
    gap: 8px;
    align-items: center; 
}

.input-icon-fifth-secondary{

    fill: var(--inputItem-fifth-secondary-iconColor);
    --inputItem-fifth-secondary-iconColor:#153829 ;
}
.inputList-item-iconContainer{
    width: fit-content;
    height: 17px;
    margin: 0;
}

.itemName-container {
    display: flex;
    height: fit-content;
    flex-direction:column;
    gap: 0px;   
    width: 100%;     
    text-align: left;
    --font-montserrat: Montserrat;
    --inputItem-fourth-default-title:14px;
}
.itenName-fifth{
    padding: 0;
    margin: 0px;
    line-height: normal;
    font-size: var(--inputItem-fifth-default-fontSize);
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    color: var(--inputItem-fifth-default-fontColor);
    --inputItem-fifth-default-fontColor:#405C50;
    --inputItem-fifth-default-fontSize:15px;
}

.list-fifth-subContainer-h1{
    font-weight: var(--fw-700-bold);
    color: var(--list-fifth-subContainer-h1-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--list-fifth-subContainer-h1-fontSize);
    --list-fifth-subContainer-h1-fontColor:#154631;
    --list-fifth-subContainer-h1-fontSize:18px;
    margin: 0px;


}
.list-fifth-subContainer-layersList-container{
    display: flex;
    flex-direction: column;
    gap:6px;
}
.b-layers-fifth-inputItem{/*Input capas base*/
    width: var(--inputItem-fifth-maxWidth);
    height: var(--inputItem-fifth-maxHeight);
    border-radius: var(--inputItem-fifth-borderRadius);
    display: flex;
    flex-direction: row;
    background-color: var(--inputItem-fifth-default-background);
    padding: var(--inputItem-fifth-padding);
    justify-content: space-between;
    align-items: center;

}

.b-layers-fifth-inputItem-iconH1Button-container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-height: 35px;
    
}
.i-layers-fifth-inputItem{/*Input capas base*/
    width: var(--inputItem-fifth-maxWidth);
    height: max-content;
    border-radius: var(--inputItem-fifth-borderRadius);
    display: flex;
    flex-direction: column;
    background-color: var(--inputItem-fifth-default-background);
    padding: var(--inputItem-fifth-padding);
    gap:12px;

}
.i-layers-fifth-inputItem-subContainer{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
}
.i-layers-fifth-inputItem .slider-fifth{
    width:270px;
}
.i-layers-fifth-inputItem-iconH1-container{
    display: flex;
    flex-direction: row;
    padding: 0px;
    margin:0px;
    width:auto;
    gap: 8px;
    max-width:100%;
    align-items: center;

}
.iconButtons-container{
    display: flex;
    gap: 8px;
    flex-direction: row;

}
.i-layers-fifth-inputItem-icon{
    height:21px;
    fill:var(--i-layers-fifth-inputItem-icon-color);
  
}

.chevron-icon-fifth{
    fill: var(--i-layers-fifth-inputItem-chevron-icon-fill);
    --i-layers-fifth-inputItem-chevron-icon-fill: #153829;
    
  

}
.inputItem-fifth-h1{
    margin:0px;
    display: flex;
    flex-direction: row;
    color:var(--inputItem-fifth-default-h1-fontColor);
    font-size: var(--inputItem-fifth-h1-fontSize);
    font-family: var(--font-montserrat);
    font-weight: var(--fw-600-semiBold);
    

}



.arrowBtn-tittle{
    display: flex;
    width: 539px;
    height: fit-content;
    flex-direction: row;
    align-items: center;
    gap: 14px;
}

.icon-text{
    display: flex;
    flex-direction: row;
    gap: 8px;
    width: max-content;
}

.chevron-icon-fifth{
    fill: var(--i-layers-fifth-inputItem-chevron-icon-fill);
    --i-layers-fifth-inputItem-chevron-icon-fill: #153829;


}
.chevron-container{
    display: flex;
    width: 402px;
    height: 20px;
    position: relative;
    align-self: center;
   
}

.i-layers-fifth-inputItem-content input {
    position: absolute;
    width:20px;
    height: 21px;
    align-self: center;
    align-items: center;
    cursor: pointer;
    opacity: 0;
    z-index:0;

}

  .i-layers-fifth-inputItem-content{
    margin: 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 24px;
    overflow: hidden;
    width:max-content;
    height: max-content;

  }
  .chevron-button-fifth{
    padding:4px;
    width:20px;
    height: 21px;
    cursor: pointer;

  
    
   
}
.accordion-third-iconH1-container{
    font-weight: var(--fw-500-medium);
    font-size: var(--accordion-third-h1-fontSize);
    color: var(--accordion-third-h1-fontColor);
    display: flex;
    gap: 10px;
    align-items: center;

}

.i-layers-fifth-inputItem-hidden-content{
    max-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: var(--i-layers-fifth-inputItem-hidden-content-padding);
    margin: 0;
    gap: var(--i-layers-fifth-inputItem-hidden-content-gap);
    border-radius: var(--i-layers-fifth-inputItem-hidden-content-borderRadius);
    background-color: var(--accordion-third-background);
   width:var(--i-layers-fifth-inputItem-hidden-content-width);
    transition: all 0.35s;
    

}

  input#tab9:checked ~ .i-layers-fifth-inputItem-hidden-content{
    max-height: 400px;
  }
  input:checked ~ .chevron-button-fifth .chevron-icon-fifth{
    transform: rotate(180deg);
    transition: transform 0.35s ease;

   
  }
  input:checked ~ .chevron-button-fifth{
    border-radius: 0px;
  }
  
.accordion-first-h1Icon-container{
    display: flex;
    flex-direction: row;
    gap: 8px;

}



.i-layers-fifth-inputItem-hidden-content-legend-container{
    display: flex;
    flex-direction: row;
    width:auto;
    padding:0px 10px 10px 10px;
    justify-content: space-between;
 
}

.i-layers-fifth-inputItem-legend-list{
    display: flex;
    flex-direction: column;
    gap: 8px;
    
   

}
.i-layers-fifth-inputItem-hidden-content-legend-container-h1{
    padding-left: 10px;
    font-weight: var(--fw-600-semiBold);
    font-family: var(--font-montserrat);
    font-size: var(--i-layers-fifth-inputItem-legend-h1-fontSize);
    color: var(--i-layers-fifth-inputItem-legend-h1-fontColor);

}
.i-layers-fifth-inputItem-legend-list-item{
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
    color:var(--i-layers-fifth-inputItem-legend-body-fontColor);
    font-size: var(--i-layers-fifth-inputItem-legend-body-fontSize);
    font-weight: var(--fw-500-medium);
    --i-layers-fifth-inputItem-legend-body-fontSize:13px;
    --i-layers-fifth-inputItem-legend-body-fontColor:#466154
} 

/*Data Panel*/

.dataPanel-fifth-container{
    width: var(--dataPanel-fifth-container-width);
    max-height: var(--dataPanel-fifth-container-maxHeight);
    display: flex;
    padding: var(--dataPanel-fifth-container-padding);
    flex-direction: column;
    gap: var(--dataPanel-fifth-container-gap);
    border-radius: var(--dataPanel-fifth-container-borderRadius);
    background-color: var(--dataPanel-fifth-container-background);
    border: 1px solid var(--dataPanel-fifth-container-borderColor);
    margin: 0px;
    align-items: center; 
    
}
.dataPanel-fifth-subContainer{
    display: flex;
    width: var(--dataPanel-fifth-subContainer-width);
    flex-direction: row;
    gap:var(--dataPanel-fifth-subContainer-gap);
    padding:var(--dataPanel-fifth-subContainer-padding);
    align-items: center; 
    border-radius: var(--dataPanel-fifth-subContainer-borderRadius);
    background-color: var(--dataPanel-fifth-subContainer-background);
   
}

.dataPanel-fifth-subContainer-content{
    display: flex;
    width: var(--dataPanel-fifth-subContainer-content-width);
    flex-direction: column;
    
   
   

}
.arrowBtn-tittle{
    display: flex;
    width: var(--arrowBtn-tittle-width);
    height: fit-content;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    
}

.data-panel-fifth-title{
    font-weight: var(--fw-700-bold);
    color: var(--dataPanel-fifth-title-fontColor);
    font-family: var(--font-montserrat);
    font-size: var(--card-fourth-title-fontSize);
    
    margin: 0;

}

.data-panel-fifth-image{
    width: var(--dataPanel-fifth-image-width);
    border-radius:var(--dataPanel-fifth-image-borderRadius);
    
}
.image-card{
    display:inline-flex;
    position: relative;
    width: var(--image-card-width);
    margin: var(--image-card-margin);
    
}

.image-card .save-button-fifth{
    display:inline-flex;
    position: absolute;
    left:92%;
    top:8px;
    

}

.data-panel-fifth-iconText-container{
    width: var(--dataPanel-fifth-iconText-container-width);
    position: relative;
    border-radius: var(--dataPanel-fifth-iconText-container-borderRadius);
    background-color: var(--dataPanel-fifth-iconText-container-background);
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    padding: var(--dataPanel-fifth-iconText-container-padding);
    gap: var(--dataPanel-fifth-iconText-container-gap);
    text-align: left;
    --dataPanel-fifth-iconText-container-background:#F8EFD6;
    --dataPanel-fifth-iconText-container-width:429px;
    --dataPanel-fifth-iconText-container-borderRadius:20px;
    --dataPanel-fifth-iconText-container-padding:10px 16px;
    --dataPanel-fifth-iconText-container-gap:40px;
}

.iconText-column-fifth{
    display: flex;
    flex-direction: column;
    width: max-content;
    gap:6px;

}

.icon-text{
    display: flex;
    flex-direction: row;
    gap: 8px;
    width: max-content;
}

.dataPanel-fifth-iconText-container-icon{
    fill:var(--dataPanel-fifth-iconText-container-icon-fill);
    
}

.data-panel-fifth-iconText-container-text{
    font-family: var(--font-montserrat);
    margin: 0;
    font-weight: var(--fw-500-medium);
    font-size: var(--dataPanel-fifth-iconText-container-fontSize);
    color: var(--dataPanel-fifth-iconText-container-fontColor);
    --dataPanel-fifth-iconText-container-fontSize: 14px;
    --dataPanel-fifth-iconText-container-fontColor:#2F473C;
    
}
.button-fifth-primary-icon{
    fill:var(--button-fifth-primary-iconColor);
    --button-fifth-primary-iconColor: #fff;

}

.button-fifth-secondary-icon{
    fill: var(--button-fifth-secondary-iconStroke);
    --button-fifth-secondary-iconStroke: #153829;
}
.data-panel-fifth-buttons-container{
    display: flex;
    max-width: var(--dataPanel-fifth-buttons-container-maxWidth);
    flex-direction: row;
    margin:var(--dataPanel-fifth-buttons-container-margin);
    justify-content: space-between;
    
}

.data-panel-fifth-buttons-container .bt-fifth-primary,
.data-panel-fifth-buttons-container .bt-fifth-secondary{
    width: 222px;
    gap:7px;

}

.dataPanel-fifth-h2{
    margin: 0;
    font-family: var(--font-montserrat);
    font-weight: var(--fw-700-bold);
    font-size: var(--dataPanel-fifth-h2-fontSize);
    color: var(--dataPanel-fifth-h2-fontColor);

}





.dataPanel-fifth-dataContainer{
    max-width: var(--dataPanel-fifth-dataContainer-maxWidth);
    display: flex;
    flex-direction: row;
    border-radius: var(--dataPanel-fifth-dataContainer-borderRadius);
    height: max-content;
    background-color: var(--dataPanel-fifth-dataContainer-background);
    padding: var(--dataPanel-fifth-dataContainer-padding);
    gap: var(--dataPanel-fifth-dataContainer-gap);

    align-items: center;
    margin: var(--dataPanel-fifth-dataContainer-margin);
 
 }

 .dataPanel-fifth-dataContainer-subContainer{
    display: flex;
    max-width: var(--dataPanel-fifth-dataContainer-subContainer-maxWidth);
    height:var(--dataPanel-fifth-dataContainer-subContainer-height);
    flex-direction: column;
    background-color: var(--dataPanel-fifth-dataContainer-subContainer-background);
    align-items: center;
    justify-content:center;
    padding: var(--dataPanel-fifth-dataContainer-subContainer-padding);
    gap:var(--dataPanel-fifth-dataContainer-subContainer-gap);
    border-radius: var(--dataPanel-fifth-dataContainer-subContainer-borderRadius);

 }

 .dataPanel-fifth-dataContainer-subContainer-textContainer{
    display: flex;
    flex-direction: column;
    align-items: center;
    
 }
 .dataPanel-fifth-dataContainer-subContainer-illustrationContainer{
    width: var(--dataPanel-fifth-dataContainer-subContainer-illustrationContainer-width);
    height: var(--dataPanel-fifth-dataContainer-subContainer-illustrationContainer-height);
    
 }
 .dataPanel-fifth-dataContainer-subContainer-textContainer-mainH3{
    font-weight: var(--fw-600-semiBold);
    white-space: nowrap;
    margin: 0;
    align-items: center;
    font-size:var(--dataPanel-fifth-dataContainer-mainH3-fontSize);
    color:var(--dataPanel-fifth-dataContainer-mainH3-fontColor);
    
 }

 .dataPanel-fifth-dataContainer-subContainer-textContainer-greenH3{
    font-weight: var(--fw-600-semiBold);
    margin: 0;
    white-space: nowrap;
    align-items: center;
    font-size:var(--dataPanel-fifth-dataContainer-greenH3-fontSize);
    color:var(--dataPanel-fifth-dataContainer-greenH3-fontColor);
   
 }

 .dataPanel-fifth-dataContainer-subContainer-textContainer-greyH3{
    font-weight: var(--fw-600-semiBold);
    margin: 0;
    white-space: nowrap;
    align-items: center;
    font-size:var(--dataPanel-fifth-dataContainer-greyH3-fontSize);
    color:var(--dataPanel-fifth-dataContainer-greyH3-fontColor);
    
 }






 /*------------------------------------------------------------------------*/
 /*Tabs*/

 .tabs-fifth{
    max-width: var(--tabs-fifth-width);

    display: inline;
    
    background: #fff;
    
 }

 .tabs-fifth input{
    display: none;
}

 .tabs-fifth-tab{
    padding:var(--tabs-fifth-tab-select-padding);
    background-color: var(--tabs-fifth-tab-select-background);
    cursor: pointer;
    text-align: center;
    font-size: var(--tabs-fifth-tab-select-fontSize);
    font-weight: var(--fw-700-bold);
    font-family: var(--font-montserrat);
    color: var(--tabs-fifth-tab-select-fontColor);
    display: inline-block;
    
   
 }

 .tabs-fifth-content{
    border-top:1px solid #C8D9D1;
    
 }

 .tabs-fifth-especiesContent,
 .tabs-fifth-modosMediosContent {
     display: none;
     width: var(--tabs-fifth-tabContent-width);


 }

 .tabs-fifth-tab:checked + label{
    background-color: var(--tabs-fifth-tab-select-background)!important;
    border-bottom: 3px solid var(--tabs-fifth-tab-select-borderColor);

    
 }

 

 #especies-fifth-tab:checked ~ .tabs-fifth-content .tabs-fifth-especiesContent{
    display: block;
 } 

 #modos-fifth-tab:checked ~ .tabs-fifth-content .tabs-fifth-modosContent{
    display: block;
 }
 #calendar-fifth-tab:checked ~ .tabs-fifth-content .tabs-fifth-calendarContent{
    display: block;
 }

 
 .dataPanel-fifth-tabs-table {
    border-collapse:separate;
    margin-top: 12px;
    width:461px;
    border-spacing: 0;

 }
 .dataPanel-fifth-tabs-tableHead{
    align-content: center;
    text-align: center;
    width: var(--dataPanel-fifth-tabs-tableHead-width);
    height: var(--dataPanel-fifth-tabs-tableHead-height);
    background-color:var(--dataPanel-fifth-tabs-tableHead-color) ;
    border: 1px solid var(--dataPanel-fifth-tabs-tableHead-borderColor) ;
    font-size: var(--dataPanel-fifth-tabs-tableHead-fontSize);
    color: var(--dataPanel-fifth-tabs-tableHead-fontColor);
    font-weight: var(--fw-600-semiBold);

 }
 .dataPanel-fifth-tabs-tableHead:first-child{
    border-top-left-radius: 20px;
 }
 .dataPanel-fifth-tabs-tableHead:last-child{
    border-top-right-radius: 20px;
 }

 tr:last-child .dataPanel-fifth-tabs-tableData:last-child{
    border-bottom-right-radius: 20px;
 }

 tr:last-child .dataPanel-fifth-tabs-tableData:first-child{
    border-bottom-left-radius: 20px;
 }
 .dataPanel-fifth-tabs-tableData{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: var(--dataPanel-fifth-tabs-tableHead-width)!important;
    max-height: var(--dataPanel-fifth-tabs-tableData-maxHeight);
    min-height: var(--dataPanel-fifth-tabs-tableData-minHeight);
    background-color: var(--dataPanel-fifth-tabs-tableData-color) ;
    border: 1px solid var(--dataPanel-fifth-tabs-tableData-borderColor) ;
    font-size: var(--dataPanel-fifth-tabs-tableData-fontSize);
    color: var(--dataPanel-fifth-tabs-tableData-fontColor);
    font-weight: var(--fw-400-regular);
    border-radius: 0px;

  

 }
 .dataPanel-fifth-tabs-tableHead:nth-child(2),
 .dataPanel-fifth-tabs-tableData:nth-child(2){
    width:127px!important;
 }

 .dataPanel-fifth-tabs-tableData-img{
    width: 60px;

 }
 .dataPanel-fifth-tabs-tableHead:nth-child(2),
 .dataPanel-fifth-tabs-tableData:nth-child(2){
    width:127px!important;
 }

 .dataPanel-fifth-tabs-tableData-img{
    width: 60px;

 }
 tr{
    display: flex;
    flex-direction: row;
    align-items: center;
 }



 .listCard-fifth-tabs-table {
    border-collapse:separate;
    margin-top:10px;
    width:var(--listCard-fifth-tabs-table-width);
    border-spacing: 0;
    
 }
 .listCard-fifth-tabs-tableHead{
    align-content: center;
    padding: 12px;
    text-align: left;
    width: var(--listCard-fifth-table-tableHead-maxWidth);
    height: var(--listCard-fifth-table-tableHead-maxHeight);
    background-color:var(--listCard-fifth-table-tableHead-background) ;
    border: 1px solid var(--listCard-fifth-table-tableHead-borderColor) ;
    font-size: var(--listCard-fifth-table-tableHead-fontSize);
    color: var(--listCard-fifth-table-tableHead-fontColor);
    font-weight: var(--fw-600-semiBold);
  
 }
 tr:first-child .listCard-fifth-tabs-tableHead:first-child{
    border-top-left-radius: 20px;
 }

 tr:first-child .listCard-fifth-tabs-tableData:last-child{
    border-top-right-radius: 20px;

 }

 tr:last-child .listCard-fifth-tabs-tableHead:first-child{
    border-bottom-left-radius: 20px;

 }
 tr:last-child .listCard-fifth-tabs-tableData:last-child{
    border-bottom-right-radius: 20px;

 }
 .dataPanel-fifth-tabs-tableHead:last-child{
    border-top-right-radius: 20px;
 }

 tr:last-child .dataPanel-fifth-tabs-tableData:last-child{
    border-bottom-right-radius: 20px;
 }

 tr:last-child .dataPanel-fifth-tabs-tableData:first-child{
    border-bottom-left-radius: 20px;
 }
 .listCard-fifth-tabs-tableData{
    display: flex;
    flex-direction: column;

    text-align: left;
    padding: 12px;
    width: var(--listCard-fifth-table-tableData-maxWidth)!important;
    height: var(--listCard-fifth-table-tableData-maxHeight);
    background-color: var(--listCard-fifth-table-tableData-color) ;
    border: 1px solid var(--listCard-fifth-table-tableData-borderColor) ;
    font-size: var(--listCard-fifth-table-tableData-fontSize);
    color: var(--listCard-fifth-table-tableData-fontColor);
    font-weight: var(--fw-400-regular);
    border-radius: 0px;
    
  

 }


 tr{
    display: flex;
    flex-direction: row;
    align-items: center;
 }



/*Inputs*/

.input-fifth-default-icons {
    flex: 1;
    height: 100%;
    border: none;
    outline: none;
    background: transparent;
    padding-left: 2px;
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fifth-default-fontSize);
    font-family: var(--font-montserrat);
    color: var(--input-fifth-default-fontColor);
    
}
.input-fifth-sm{
    width:var(--input-fifth-small-width);
   
}
.input-fifth-md{
    width:var(--input-fifth-medium-width);
    
}
.input-fifth-lg{
    width:var(--input-fifth-large-width);
    
}
.input-fifth-xl{
    width:var(--input-fifth-extraLarge-width);
    
}
.input-fifth-default-group{
    padding: var(--input-fifth-group-padding);
    position: relative;
    display: flex;
    align-self: center;
    align-items: center;
    height: var(--input-fifth-group-height);
    margin: 0px;
    gap:var(--input-fifth-group-gap);
    background-color: var(--input-default-background) !important;
    border-radius: var( --input-fifth-group-borderRadius);
    border: 1px solid var(--input-fifth-default-borderColor);
   

    
}
.input-fifth-default-group:hover,
.input-fifth-filled-group:hover,
.input-fifth-invalid-group:hover{
    background-color: var(--input-fifth-hover-background) !important;
    border-radius: var( --input-fifth-group-borderRadius);
    font-weight: var(--fw-400-regular);
    border: 1px solid var(--input-fifth-hover-borderColor);
    color: var(--input-fifth-hover-fontColor);
    
}

.input-fifth-default-group:focus-within,
.input-fifth-filled-group:focus-within{
    background-color: var(--input-default-background);
    border-radius: var( --input-fifth-group-borderRadius);
    border: 1px solid var(--input-fifth-default-borderColor);
    color: var(--input-fifth-focus-fontColor);
    box-shadow: var(--input-fifth-focus-shadow);
    
}

.input-fifth-invalid-group{
    padding: var(--input-fifth-group-padding);
    display: flex;
    align-self: center;
    height: var(--input-fifth-group-height);
    margin: 0px;
    gap:var(--input-fifth-group-gap);
    background-color: var(--input-default-background) !important;
    border-radius: var( --input-fifth-group-borderRadius);
    border: 1px solid var(--input-fifth-invalid-borderColor);
    
}

.input-fifth-invalid-group:focus-within{
    background-color: var(--input-default-background);
    border-radius: var( --input-fifth-group-borderRadius);
    border: 1px solid var(--input-fifth-invalid-borderColor);
    box-shadow: var( --input-fifth-invalid-shadow);
}

.input-icon-fifth{
    width: 15px;
    left: 10px;
    align-self: center;
    fill: var(--input-fifth-default-iconColor);
    --input-fifth-default-iconColor: #405C50;
    
}

.input-fifth-filled-group{
    padding: var(--input-fifth-group-padding);
    position: relative;
    display: flex;
    align-self: center;
    align-items: center;
    height: var(--input-fifth-group-height);
    margin: 0px;
    gap:var(--input-fifth-group-gap);
    background-color: var(--input-default-background) !important;
    border-radius: var( --input-fifth-group-borderRadius);
    border: 1px solid var(--input-fifth-filled-borderColor);
    

}

.input-fifth-filled-icons {
    flex: 1;
    height: 100%;
    border: none;
    outline: none;
    background: transparent;
    color: var(--input-fifth-filled-fontColor);
    font-weight: var(--fw-400-regular);
    font-size: var(--input-fifth-default-fontSize);
    font-family: var(--font-montserrat);

}



.input-fifth-disabled-group{
    padding: var(--input-fifth-group-padding);
    opacity: var(--input-fifth-default-opacity);
    position: relative;
    display: flex;
    align-self: center;
    align-items: center;
    height: var(--input-fifth-group-height);
    margin: 0px;
    gap:var(--input-fifth-group-gap);
    background-color: var(--input-default-background) !important;
    border-radius: var( --input-fifth-group-borderRadius);
    border: 1px solid var(--input-fifth-default-borderColor);
    --input-fifth-default-opacity: 0.5;
    
}
/*------------------------------------------------------------*/
/*Log-in/Sign-up*/

.logIn-fifth-container{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: var(--logIn-fifth-container-width);
    max-height:var(--logIn-fifth-container-maxHeigh);
    border-radius: var(--logIn-fifth-container-borderRadius);
    padding: var(--logIn-fifth-container-padding);
    margin: 0px;
    gap: var(--logIn-fifth-container-gap);
    background-color: var(--logIn-fifth-container-backgroundColor);
   
}

.logIn-fifth-h1ExitIcon-container{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    width: 100%;
    justify-content: space-between;
}

.logIn-fifth-h1{
    font-weight: var(--fw-700-bold);
    font-size: var(--logIn-fifth-h1-fontSize);
    color: var(--logIn-fifth-h1-fontColor);
    
    margin: 0;
    
}

.logIn-fifth-subContainer{ 
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--logIn-fifth-input-subContainer-gap);
    padding: var(--logIn-fifth-input-subContainer-padding);
    width: var(--logIn-fifth-input-subContainer-width);
    margin: 0;
    border-radius: var(--logIn-fifth-input-subContainer-borderRadius);
    background-color: var(--logIn-fifth-input-subContainer-background)!important;
  
}
.logIn-fifth-input-container{ 
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
 
    width: 100%;
    margin: 0;

    
}

.logIn-fifth-input-container > .input-fifth-default-group{
    width:320px;
    margin:0;

}


.logIn-fifth-inputLabel{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--logIn-fifth-inputLabel-fontSize);
    color: var(--logIn-fifth-inputLabel-fontColor);
    
    margin: 0;
}

.logIn-fifth-input-link-helperText{
    font-family: var(--font-montserrat);
    font-size: var(--logIn-fifth-input-link-helperText-fontSize);
    color: var(--logIn-fifth-input-link-helperText-fontColor);
    margin-top: 2px;
    height: 16px;
    
}


.logIn-fifth-subContainer .bt-fifth-primary,
.logIn-fifth-subContainer .bt-fifth-secondary{
    width: 100%;
}

.logIn-fifth-divider-container{
    display: flex;
    align-items: center;
    width: var(--logIn-fifth-divider-container-width);
    margin:0; 

}

.logIn-fifth-divider-container-dividerLine{
    flex: 1;           
    height: 1px;       
    border-radius: 1px;
    background-color: var(--logIn-fifth-divider-container-divider-color);
    
  }

  .logIn-fifth-divider-container-letter{
    font-weight: var(--fw-600-semiBold);
    font-size: var(--logIn-fifth-divider-container-letter-fontSize);
    color: var(--logIn-fifth-divider-container-letter-fontColor);
    
    margin: var(--logIn-fifth-divider-container-letter-margin);

  }



.logIn-fifth-googleBtn-helperText-container{
    gap: 14px;
    display: flex;
    width:100%;
    flex-direction: column;
}

.logIn-fifth-h1ExitIcon-container-icon{
    width: var(--logIn-fifth-h1ExitIcon-container-icon-width);
    stroke: 1px solid var(--logIn-fifth-h1ExitIcon-container-icon-stroke);
    fill: var(--logIn-fifth-h1ExitIcon-container-icon-fill);

    
}


.logIn-fifth-input-default-helperText{
    font-family: var(--font-montserrat);
    font-size: var(--logIn-fifth-input-helperText-fontSize);
    color: var(--logIn-fifth-input-helperText-fontColor);
    margin-top: 2px;
    height: var(--logIn-fifth-input-helperText-height);
    font-weight: var(--fw-400-regular);

}

.floating-arrow {
    position: fixed; 
    bottom: 20px; 
    right: 30px; 
    background: #fff;
    width: 50px; 
    height: 50px; 
    border-radius: 50%; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    text-decoration: none; 
    order: 1px solid #FFF;
    box-shadow: -4px -4px 10px 0px rgba(255, 255, 255, 0.20), 4px 4px 10px 0px rgba(255, 255, 255, 0.20);

}
.floating-arrow:hover,
.floating-arrow:active{

    background-color: #FFECA1 ;
}


.favicon-class{
    fill:#fff;
}