@import '_content/Blazor.Bootstrap/Blazor.Bootstrap.bundle.scp.css';

/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-4837rj3j2u] {
    position: relative;
    display: flex;
    flex-direction: column;
   /* width: 95rem;*/
}

main[b-4837rj3j2u] {
    flex: 1;
    height:auto;
}

.sidebar[b-4837rj3j2u] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
    border-right: 1px solid var(--separation-contour, #E0E0E0);
    background: #FFF;
    min-width: calc(var(--sidebar-width)*1px);
    max-width: calc(var(--sidebar-width)*1px);
    transition: var(--transition-props);
}
    .sidebar.hidden[b-4837rj3j2u] {
        margin-left: -248px;
        transition: var(--transition-props);
    }

.header-row[b-4837rj3j2u] {
    background-color: #fff;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    /*display: flex;*/
    align-items: center;
}

    .top-row[b-4837rj3j2u]  a, .top-row[b-4837rj3j2u]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-4837rj3j2u]  a:hover, .top-row[b-4837rj3j2u]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-4837rj3j2u]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-4837rj3j2u] {
        justify-content: space-between;
    }

    .top-row[b-4837rj3j2u]  a, .top-row[b-4837rj3j2u]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-4837rj3j2u] {
        flex-direction: row;
    }

    .sidebar[b-4837rj3j2u] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-4837rj3j2u] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-4837rj3j2u]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-4837rj3j2u], article[b-4837rj3j2u] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-4837rj3j2u] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-4837rj3j2u] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
.navbar-toggler[b-4837rj3j2u] {
    appearance: none;
    cursor: pointer;
    width: 2.5rem;
    height: 2.5rem;
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
    margin-top:0.5rem;
}

.navfooter[b-4837rj3j2u] {
 
   /* position: fixed;*/
    bottom: 0px;
    margin-left: -177px;
   
  /*  z-index: 9999999;*/
}

.footerdiv[b-4837rj3j2u] {
    width: 1440px;
    height: 40px;
    flex-shrink: 0;
    background: var(--Primary-text, #0A125D);
    color: white;
    text-align: center;
    padding-left:14rem;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */




.navbar-brand[b-fx4pz2jlqu] {
    font-size: 1.1rem;
}

.bi[b-fx4pz2jlqu] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-fx4pz2jlqu] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-fx4pz2jlqu] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-fx4pz2jlqu] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-fx4pz2jlqu] {
    font-size: 0.9rem;
    padding-bottom: 0.2rem;
    width: 97%;
    margin-left: 0.2rem;
}

    .nav-item:first-of-type[b-fx4pz2jlqu] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-fx4pz2jlqu] {
        padding-bottom: 1rem;
    }

    .nav-item[b-fx4pz2jlqu]  .nav-link {
        color: var(--Primary-text, #0A125D);
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

    .nav-item[b-fx4pz2jlqu]  a.active {
        background-color: #33767C; /*rgba(255,255,255,0.37);*/
        color: white;
    }

    .nav-item[b-fx4pz2jlqu]  .nav-link:hover {
        background-color: #33767C; /*rgba(255,255,255,0.1);*/
        color: white;
    }

.nav-scrollable[b-fx4pz2jlqu] {
    display: none;
    background-color: #fff;
}



/* Start Prashant Jagdale Menu Css Start   */

.image[b-fx4pz2jlqu] {
    width: 116px;
    height: 31px;
}

    .image .img[b-fx4pz2jlqu] {
        width: 116px;
        height: 31px;
        top: 0;
        left: 0;
        object-fit: cover;
        margin-left: -0.5rem;
    }

.menu[b-fx4pz2jlqu] {
    width: 192px;
    height: 56px;
}

    .menu .overlap-group[b-fx4pz2jlqu] {
        position: relative;
        width: 176px;
        height: 48px;
        top: 4px;
        left: 8px;
        background-color: #33767c;
        border-radius: 4px;
    }

    .menu .text-wrapper[b-fx4pz2jlqu] {
        position: absolute;
        top: 13px;
        left: 44px;
        font-weight: 400;
        color: #ffffff;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .menu .icons-home[b-fx4pz2jlqu] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 12px;
        left: 12px;
    }

.tenaka-science-user .img[b-fx4pz2jlqu] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: -2px;
    left: 20px;
}

.tenaka-science-user .text-dashboard[b-fx4pz2jlqu] {
    position: absolute;
    left: 52px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.tenaka-science-user .icons-project[b-fx4pz2jlqu] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: -2px;
    left: 20px;
}

.tenaka-science-user .text-project[b-fx4pz2jlqu] {
    position: absolute;
    left: 52px;
    font-weight: 400;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

/* end   */


@media (min-width: 641px) {
    .navbar-toggler[b-fx4pz2jlqu] {
        display: none;
    }

    .nav-scrollable[b-fx4pz2jlqu] {
        /* Never collapse the sidebar for wide screens */
        display: block;
        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}

.nav-width[b-fx4pz2jlqu] {
    width: 90% !important;
}

.sidebar-item.nav-item:hover #svg-container[b-fx4pz2jlqu] {
    fill: white;
}
.sidebar-link.nav-link.active #svg-container[b-fx4pz2jlqu] {
    fill: white;
}

#svg-container[b-fx4pz2jlqu] {
    margin-left: -7px;
    margin-top: -3px;
    margin-right: 4px;
}

/* /Components/Pages/Admin/MyOrganization/CreateOrg.razor.rz.scp.css */
.tier-section[b-edp27wj1fy] {
    
}

.fish-card[b-edp27wj1fy] {
    border: 1px solid #dfe3e8;
    border-radius: 5px;
    padding: 10px;
    text-align: center;
    transition: border-color 0.3s;
}

    .fish-card img[b-edp27wj1fy] {
        width:200px;
        height: auto;
        border-radius: 5px;
           
    }

    .fish-card:hover[b-edp27wj1fy] {
        border-color: #0d6efd;
    }

.delete-icon[b-edp27wj1fy] {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: rgba(0, 0, 0, 0.6);
    color: white;
    padding: 5px;
    border-radius: 50%;
    cursor: pointer;
}


.orgtext[b-edp27wj1fy] {
    white-space: normal; /* Allows wrapping */
    width: max-content; /* Or specify a fixed width like 100px */
    display: inline-block;
    text-align:start;
}

.object-fit-cover[b-edp27wj1fy] {
    object-fit: cover;
}


.divcardfirst[b-edp27wj1fy] {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
    padding: 20px;
    height: 33rem;
    border: 1px solid #dfe3e8;
}

.divcard[b-edp27wj1fy] {
 
    border-radius: 0px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
    padding: 20px;
    height: 33rem;
    border: 1px solid #dfe3e8;
}

.divcardlast[b-edp27wj1fy] {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
    padding: 20px;
    height: 33rem;
    border: 1px solid #dfe3e8;
}

.form-check-input:checked[b-edp27wj1fy] {
    background-color: #327173 !important;
    border-color: #327173 !important;
}

.orgsubmit[b-edp27wj1fy] {
    display: flex;
    gap: 10px;
    margin-right: 176px;
    justify-content: end;
}



/**/

.dropdown-menu[b-edp27wj1fy] {
    max-height: 200px;
    overflow-y: auto;
    width: 50% !IMPORTANT;
}

.dropdown-item[b-edp27wj1fy] {
    display: flex;
    align-items: center;
}

input[type="checkbox"][b-edp27wj1fy] {
    margin-right: 8px;
}

.form-select[b-edp27wj1fy] {
    height: 46px;
    min-height: 46px; /* For better visibility */
}

.badge-container[b-edp27wj1fy] {
    display: flex;
    flex-wrap: wrap;
}

.badge[b-edp27wj1fy] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    font-size: 14px;
}

.btn-close[b-edp27wj1fy] {
    cursor: pointer;
    border: none;
    background: transparent;
    font-size: 12px;
}
.btn[b-edp27wj1fy] {
    background-color: #017F8E !important;
    height: 46px;
    width: 200px;
}
.divcard[b-edp27wj1fy] {
    height:350px !important;
    min-height: 150px; /* Adjust the height as needed */
    overflow-x: auto; /* Enables horizontal scrolling */
    white-space: nowrap; /* Prevents wrapping of content */
}

.tier-section[b-edp27wj1fy] {
    /*/display: inline-block; /* Ensures the child elements align horizontally */
}

.info-alert[b-edp27wj1fy] {
    background-color: #e7f3fe; /* Light blue background */
    border: 1px solid #b3d7ff; /* Border with blue tint */
    color: #00376b; /* Text color */
    padding: 10px 15px; /* Inner padding */
    border-radius: 5px; /* Rounded corners */
    font-family: Arial, sans-serif; /* Font style */
    display: flex;
    align-items: center; /* Vertically align content */
    gap: 10px; /* Space between icon and text */
}

    .info-alert[b-edp27wj1fy]::before {
        content: "ℹ️"; /* Information icon */
        font-size: 18px; /* Icon size */
        color: #00376b; /* Icon color */
    }

.img-h[b-edp27wj1fy] {
    max-height: 11.5rem !important;
    
}


/* /Components/Pages/Admin/MyOrganization/Organization.razor.rz.scp.css */
body[b-jop695551x] {
}


.org-dashboard-img[b-jop695551x] {
    gap: 0.8rem;
    row-gap: 1.1rem;
    width: 102%;
    margin: -12px;
}


.table-card[b-jop695551x] {
    border-collapse: separate;
    border-spacing: 0 0.5rem;
}

    .table-card tbody tr[b-jop695551x] {
        background-color: white;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        border-radius: 10px;
        overflow: hidden;
    }

        /* Card-like padding and border styling */
        .table-card tbody tr td[b-jop695551x] {
            padding: 0.7rem;
            border: none; /* Remove table cell borders */
        }

    /* Optionally adjust header row */
    .table-card thead th[b-jop695551x] {
        border: none;
        text-align: left;
        padding: 1rem;
        background-color: #f8f9fa;
        font-weight: bold;
    }
/* /Components/Pages/Admin/MyTeams/CreateTeam.razor.rz.scp.css */
.toast-center[b-a5f4f6p2uw] {
    position: fixed;
    top: 57% !important;
    left: 32.5% !important;
    transform: translate(-50%, -50%);
    z-index: 1055; /* Higher than other elements to ensure visibility */
}
/* /Components/Pages/Admin/MyTeams/Teams.razor.rz.scp.css */
.table-hover tbody tr[b-tnrd9nbidz] {
    align-items: center;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 5px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    gap: 5px;
}

    .table-hover tbody tr:hover[b-tnrd9nbidz] {
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    }

.icon-btn[b-tnrd9nbidz] {
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    font-size: 1.2rem;
}

    .icon-btn:hover[b-tnrd9nbidz] {
        color: #000;
    }

.table tbody td[b-tnrd9nbidz] {
    padding: 10px;
    border: none;
}

.table-hover[b-tnrd9nbidz] {
    border-collapse: separate;
    border-spacing: 0;
}

    .table-hover tbody tr td[b-tnrd9nbidz] {
        flex: 1;
        padding: 0px 5px;
    }

.text-end[b-tnrd9nbidz] {
    display: flex;
    justify-content: flex-end;
}


.table-card[b-tnrd9nbidz] {
    border-collapse: separate;
    border-spacing: 0 0.5rem;
}

    .table-card tbody tr[b-tnrd9nbidz] {
        background-color: white;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        border-radius: 10px;
        overflow: hidden;
    }

        /* Card-like padding and border styling */
        .table-card tbody tr td[b-tnrd9nbidz] {
            border: none;
        }

    /* Optionally adjust header row */
    .table-card thead th[b-tnrd9nbidz] {
        border: none;
        text-align: left;
        padding: 2rem;
        background-color: #f8f9fa;
        font-weight: bold;
    }

/* Custom hover effect for edit and delete buttons */
.btn-icon:hover[b-tnrd9nbidz] {
    background-color: #d4edda; /* Light green on hover */
    border-radius: 10%; /* Optional: Makes the hover effect circular */
    border: 1px solid #d4edda;
}
/* /Components/Pages/Admin/MyTeams/UpdateTeam.razor.rz.scp.css */
.toast-center[b-2uo8c2trb2] {
    position: fixed;
    top: 57% !important;
    left: 32.5% !important;
    transform: translate(-50%, -50%);
    z-index: 1055; /* Higher than other elements to ensure visibility */
}
/* /Components/Pages/Admin/Reports/CreateReportPage.razor.rz.scp.css */
.MonthDropDown[b-r4atjvfqk5]
{
    width:20%!important;
    height:40px;
}

.popup-overlay[b-r4atjvfqk5] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    border: solid 1px;
}

.popup-content[b-r4atjvfqk5] {
    background: white;
    border-radius: 1rem;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    max-width: 100%;
    width: 80%;
    height: 35rem;
    padding: 0px;
    position: relative;
    border: solid 1px;
    flex-shrink: 0;
}

.popup-header[b-r4atjvfqk5] {
    display: flex;
    justify-content: flex-end;
    height: 12px;
}

.popup-title[b-r4atjvfqk5] {
    color: var(--Primary-text, #0A125D);
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    justify-content: center;
    display: flex;
    cursor: pointer;
}

.close-button[b-r4atjvfqk5] {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
}

.popup-body[b-r4atjvfqk5] {
    padding: 15px;
}

.textarea-comment[b-r4atjvfqk5] {
    display: flex;
    width: 100%;
    height: 3rem;
    padding: 8px;
    align-items: flex-start;
    gap: 8px;
    flex-shrink: 0;
    border-radius: 4px;
    background: #F0F4F8;
}

.dvimages[b-r4atjvfqk5] {
    /* padding: 2px;*/
    border-radius: 2px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    height: auto;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.dvitem[b-r4atjvfqk5] {
    gap: 2rem;
    padding: 1px;
    flex-shrink: 0;
    float: left;
    margin-left: 2px;
}

.spnshowmore[b-r4atjvfqk5] {
    color: var(--main-color, #33767C);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.downarrowshowmore[b-r4atjvfqk5] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    cursor: pointer;
}

.dvshowmoretext[b-r4atjvfqk5] {
    text-align: center;
    padding: 0px;
}

.popup-content.expanded[b-r4atjvfqk5] {
    width: 70%;
    border: solid 1px;
    border-radius: 1rem;
}

.modal-footer[b-r4atjvfqk5] {
    display: flex;
    justify-content: flex-end;
    margin-top: 1em;
    float: right;
}

    .modal-footer button[b-r4atjvfqk5] {
        cursor: pointer;
    }

.divTitle[b-r4atjvfqk5] {
    text-align: center;
    justify-content: flex-start;
}

.imageTitle[b-r4atjvfqk5] {
    font-size: 11px;
    color: cornflowerblue;
    float: left;
    font-style: normal;
    flex-wrap: wrap;
    font-weight: normal;
}



/*New requirement image show input Grid popup*/
.layout-controls[b-r4atjvfqk5] {
    display: flex;
    gap: 5px;
    margin-top: 5px;
    flex-wrap: wrap;
    float: right;
    padding-bottom: 5px;
    width: auto;
}

.layout-button[b-r4atjvfqk5] {
    background: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 3px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .layout-button:hover[b-r4atjvfqk5] {
        background-color: #f0f0f0;
    }

    .layout-button svg[b-r4atjvfqk5] {
        display: block;
        margin: auto;
        fill: #555;
    }

    .layout-button.active svg[b-r4atjvfqk5] {
        fill: #007bff;
    }

.dvimages > div[b-r4atjvfqk5] {
    display: grid;
    gap: 5px;
}

.grid-cols-1[b-r4atjvfqk5] {
    grid-template-columns: repeat(1, 1fr);
    WIDTH: 68%;
    height: 40%;
    align-content: center;
    align-items: center;
}

.grid-cols-4[b-r4atjvfqk5] {
    grid-template-columns: repeat(2, 1fr);
    WIDTH: 68%;
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
    gap: 15px;
}

.grid-cols-6[b-r4atjvfqk5] {
    grid-template-columns: repeat(3, 1fr);
    WIDTH: 97%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}

.image-container img[b-r4atjvfqk5] {
    width: auto;
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    object-fit: cover;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.boxes[b-r4atjvfqk5] {
    width: 6px;
    height: 6px;
}

.dv-textarea[b-r4atjvfqk5] {
    /*padding:10px;*/
}
.yearvalidationmsg[b-r4atjvfqk5] {
    color: red;
    padding: 10px;
    font-size: small;
    font-style: normal;
}
.card-dashboard-img[b-r4atjvfqk5] {
    gap: 0.8rem;
    row-gap: 1.1rem;
    width: 100%!important;
}
.popup-content[b-r4atjvfqk5] {
    max-height: 85vh; /* Ensures popup doesn't exceed viewport height */
    overflow: hidden; /* Prevents scrolling outside content */
}

.scrollable-content[b-r4atjvfqk5] {
    max-height: 300px; /* Height limit for the content area */
    overflow-y: auto; /* Enables vertical scrolling */
    overflow-x: hidden; /* Prevents horizontal scrolling */
    padding: 10px; /* Optional padding */
    border: 1px solid #ccc; /* Optional border for visibility */
    background-color: #f9f9f9; /* Optional background color */
}

.scrollable-dropdown[b-r4atjvfqk5] {
        height: 40px; /* Keeps the dropdown button height */
        overflow: hidden; /* Prevents scroll on the button itself */
    }

    .scrollable-dropdown option[b-r4atjvfqk5] {
        font-size: 14px; /* Adjust text size */
    }

    /* Scroll effect on the dropdown */
    select:focus[b-r4atjvfqk5] {
        overflow-y: auto;
        max-height: 100px; /* Adjust height */
    }
/* /Components/Pages/Admin/Tables/BioIndicatorImageUpload.razor.rz.scp.css */
.drag-drop-container[b-sfaa0lhxx4] {
    border: 2px dashed #d1d5db;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    background-color: #f9fafb;
    transition: background-color 0.3s ease;
    position: relative;
    width: 286px;
    margin: auto;
    gap: 0.8rem;
    row-gap: 1.1rem;
    max-height: 230px;
    height: 215px;
}

    .drag-drop-container.dragging[b-sfaa0lhxx4] {
        background-color: #e0f7fa;
    }



.upload-label[b-sfaa0lhxx4] {
    display: block;
    cursor: pointer;
}

.upload-area[b-sfaa0lhxx4] {
    display: flex;
    flex-direction: column;
    align-items: center;
}


.icon[b-sfaa0lhxx4] {
    width: 40px;
    height: 40px;
    margin-bottom: 10px;
    object-fit: cover;
    border-radius: 8px;
}

.preview-image[b-sfaa0lhxx4] {
    width: 150px;
    height: 149PX;
    margin-bottom: 10px;
    object-fit: contain;
    border-radius: 8px;
}

.upload-text[b-sfaa0lhxx4] {
    font-size: 16px;
    color: #6b7280;
}

.browse-link[b-sfaa0lhxx4] {
    color: #3b82f6;
    cursor: pointer;
    text-decoration: underline;
}

.file-info[b-sfaa0lhxx4] {
    font-size: 12px;
    color: #9ca3af;
}

.error-message[b-sfaa0lhxx4] {
    color: #ef4444;
    font-size: 14px;
    margin-top: 10px;
}

.hidden-input[b-sfaa0lhxx4] {
    display: none;
}

.image-list[b-sfaa0lhxx4] {
    list-style-type: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    overflow-y: scroll;
    height: 159px;
}

    .image-list li[b-sfaa0lhxx4] {
        border: 1px solid #ddd;
        border-radius: 5px;
        overflow: hidden;
        padding: 5px;
        width: 13.8rem;
    }

.drag-drop-container input[type="file"][b-sfaa0lhxx4] {
    display: none;
}


. /*drag-drop-container {
    border: 2px dashed #ccc;
    padding: 20px;
    text-align: center;
    border-radius: 10px;
    background-color: #f9f9f9;
    cursor: pointer;
    margin: 20px auto;
    max-width: 500px;
}

    .drag-drop-container.dragging {
        border-color: #007bff;
        background-color: #e9f5ff;
    }*/
.upload-area[b-sfaa0lhxx4] {
    position: relative;
    padding: 20px;
}

.icon[b-sfaa0lhxx4] {
    width: 50px;
    height: 50px;
    margin-bottom: 10px;
}

.upload-text[b-sfaa0lhxx4] {
    font-size: 14px;
    color: #555;
}

.browse-link[b-sfaa0lhxx4] {
    color: #007bff;
    text-decoration: underline;
    cursor: pointer;
}

.preview-image[b-sfaa0lhxx4] {
    /* max-width:100%;
    max-height: 150px;*/
    object-fit: cover;
    margin: 5px;
    border: 1px solid #ddd;
    border-radius: 5px;
}

.delicon[b-sfaa0lhxx4] {
    /*margin: -90px;
    margin-right: -175px;*/
    margin: -162px;
    margin-right: -206px;
}

.drag-drop-container[b-sfaa0lhxx4] {
    border: 2px dashed #ccc;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    transition: border-color 0.3s;
}

    .drag-drop-container.dragging[b-sfaa0lhxx4] {
        border-color: #007bff;
        background-color: #f0f8ff;
    }

.preview-image[b-sfaa0lhxx4] {
    max-width: 100%;
    max-height: 200px;
    margin-top: 10px;
}
/* /Components/Pages/Admin/Tables/MultiSelectDropdownEdit.razor.rz.scp.css */
.text-truncate[b-0tsf3e17uh] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    
}

/* /Components/Pages/Admin/Tables/TablesPage.razor.rz.scp.css */

    .coral-item img[b-i91mwiulfb] {
        width: 100%;
        height: auto;
        border-radius: 10px;
    }
.image-container[b-i91mwiulfb] {
    position: relative;
    display: inline-block;
}

.icon-button[b-i91mwiulfb] {
    position: absolute;
    background: rgba(0, 0, 0, 0.6);
    color: white;
    border: none;
    padding: 4px;
    border-radius: 50%;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    z-index: 2;
}

    .icon-button i[b-i91mwiulfb] {
        font-size: 14px;
    }

.top-left[b-i91mwiulfb] {
    top: 5px;
    left: 5px;
}

.top-right[b-i91mwiulfb] {
    top: 5px;
    right: 5px;
}

.image-container:hover .icon-button[b-i91mwiulfb] {
    display: block;
}

.icon-button[b-i91mwiulfb] {
    display: none;
}

.parent[b-i91mwiulfb] {
    display: flex;
    width: 61.4rem;
    overflow-y: auto;
 
}
.toast-center[b-i91mwiulfb] {
    position: fixed;
    top: 60% !important;
    left: 32.5% !important;
    transform: translate(-50%, -50%);
    z-index: 1055; /* Higher than other elements to ensure visibility */
}
/* /Components/Pages/Admin/Users/CreateUsersPage.razor.rz.scp.css */

.filterdropdown[b-6s1zpk6sgo] {
    align-items: center;
    flex-shrink: 0;
    border: 1px solid var(--separation-contour, #E0E0E0);
    background: #FFF;
    height: 30px;
    padding:0px 0px 0px 10px !important;
}

.custom-dropdown-container[b-6s1zpk6sgo] {
    width: 220px;
    height:20px!important;
    position: relative;
}

.custom-dropdown[b-6s1zpk6sgo] {
    position: relative;
    width: 100%;
}

.custom-dropdown-btn[b-6s1zpk6sgo] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

    .custom-dropdown-btn:hover[b-6s1zpk6sgo] {
        border-color: #007bff;
    }

.custom-dropdown-menu[b-6s1zpk6sgo] {
    position: absolute;
    width: 100%;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
    margin-top: 5px;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
}

.dropdown-item[b-6s1zpk6sgo] {
    padding: 8px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

    .dropdown-item:hover[b-6s1zpk6sgo] {
        background-color: #f0f0f0;
    }

.selected-chips[b-6s1zpk6sgo] {
    display: flex;
    flex-wrap: wrap;
    margin-top: 10px;
    gap: 3px;
}

.chip[b-6s1zpk6sgo] {
    display: flex;
    align-items: center;
    padding: 3px 6px;
    background-color: #1e3a8a;
    color: white;
    border-radius: 15px;
    font-size: 11px;
}

.chip-remove-btn[b-6s1zpk6sgo] {
    background: none;
    border: none;
    color: white;
    font-size: 11px;
    margin-left: 5px;
    cursor: pointer;
}

    .chip-remove-btn:hover[b-6s1zpk6sgo] {
        color: red;
    }

.chip-counter[b-6s1zpk6sgo] {
    background-color: #1e3a8a;
    color: white;
    border-radius: 50%;
    padding: 2px 8px;
    margin-right: 10px;
    font-size: 12px;
    font-weight: bold;
}

.dropdown-arrow[b-6s1zpk6sgo] {
    margin-left: 8px;
}
.toast-center[b-6s1zpk6sgo] {
    position: fixed;
    top: 60% !important;
    left: 32.5% !important;
    transform: translate(-50%, -50%);
    z-index: 1055; /* Higher than other elements to ensure visibility */
}
/* /Components/Pages/Admin/Users/UpdateUsersPage.razor.rz.scp.css */

.filterdropdown[b-uit2d1vmwt] {
    align-items: center;
    flex-shrink: 0;
    border: 1px solid var(--separation-contour, #E0E0E0);
    background: #FFF;
    height: 30px;
    padding: 0px 0px 0px 10px !important;
}

.custom-dropdown-container[b-uit2d1vmwt] {
    width: 220px;
    height: 20px !important;
    position: relative;
}

.custom-dropdown[b-uit2d1vmwt] {
    position: relative;
    width: 100%;
}

.custom-dropdown-btn[b-uit2d1vmwt] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

    .custom-dropdown-btn:hover[b-uit2d1vmwt] {
        border-color: #007bff;
    }

.custom-dropdown-menu[b-uit2d1vmwt] {
    position: absolute;
    width: 100%;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
    margin-top: 5px;
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
}

.dropdown-item[b-uit2d1vmwt] {
    padding: 8px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

    .dropdown-item:hover[b-uit2d1vmwt] {
        background-color: #f0f0f0;
    }

.selected-chips[b-uit2d1vmwt] {
    display: flex;
    flex-wrap: wrap;
    margin-top: 10px;
    gap: 3px;
}

.chip[b-uit2d1vmwt] {
    display: flex;
    align-items: center;
    padding: 3px 6px;
    background-color: #1e3a8a;
    color: white;
    border-radius: 15px;
    font-size: 11px;
}

.chip-remove-btn[b-uit2d1vmwt] {
    background: none;
    border: none;
    color: white;
    font-size: 11px;
    margin-left: 5px;
    cursor: pointer;
}

    .chip-remove-btn:hover[b-uit2d1vmwt] {
        color: red;
    }

.chip-counter[b-uit2d1vmwt] {
    background-color: #1e3a8a;
    color: white;
    border-radius: 50%;
    padding: 2px 8px;
    margin-right: 10px;
    font-size: 12px;
    font-weight: bold;
}

.dropdown-arrow[b-uit2d1vmwt] {
    margin-left: 8px;
}

.toast-center[b-uit2d1vmwt] {
    position: fixed;
    top: 60% !important;
    left: 32.5% !important;
    transform: translate(-50%, -50%);
    z-index: 1055; /* Higher than other elements to ensure visibility */
}
.selectbox[b-uit2d1vmwt] {
    width: 220px !important;
    border: 1px solid #dfe3e8;
}
/* /Components/Pages/Admin/Users/UsersMainPage.razor.rz.scp.css */
.table-hover tbody tr[b-6osqfwkhf3] {
    align-items: center;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 5px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    gap:5px;
}

    .table-hover tbody tr:hover[b-6osqfwkhf3] {
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    }

.icon-btn[b-6osqfwkhf3] {
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    font-size: 1.2rem;
}

    .icon-btn:hover[b-6osqfwkhf3] {
        color: #000;
    }

.table tbody td[b-6osqfwkhf3] {
    padding: 5px;
    border: none;
}

.table-hover[b-6osqfwkhf3] {
    border-collapse: separate;
    border-spacing: 0;
}

    .table-hover tbody tr td[b-6osqfwkhf3] {
        flex: 1;
        padding: 10px 5px;
    }

.text-end[b-6osqfwkhf3] {
    display: flex;
    justify-content: flex-end;
}


.table-card[b-6osqfwkhf3] {
    border-collapse: separate;
    border-spacing: 0 0.5rem;
}

    .table-card tbody tr[b-6osqfwkhf3] {
        background-color: white;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        border-radius: 10px;
        overflow: hidden;
    }

        /* Card-like padding and border styling */
        .table-card tbody tr td[b-6osqfwkhf3] {
            border: none;
        }

    /* Optionally adjust header row */
    .table-card thead th[b-6osqfwkhf3] {
        border: none;
        text-align: left;
        padding: 2rem;
        background-color: #f8f9fa;
        font-weight: bold;
    }

/* Custom hover effect for edit and delete buttons */
.btn-icon:hover[b-6osqfwkhf3] {
    background-color: #d4edda; /* Light green on hover */
    border-radius: 10%; /* Optional: Makes the hover effect circular */
    border: 1px solid #d4edda;
}
/* /Components/Pages/BiodiversityDetail/FishImageGalleryPopup.razor.rz.scp.css */
.popup-overlay[b-8jazqbsm3l] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    border: solid 1px;
}

.popup-content[b-8jazqbsm3l] {
    background: white;
    border-radius: 1rem;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    max-width: 100%;
    width: 60%;
    height: 35rem;
    padding: 0px;
    position: relative;
    border: solid 1px;
    flex-shrink: 0;
}

.popup-header[b-8jazqbsm3l] {
    display: flex;
    justify-content: flex-end;
    height: 12px;
}

.popup-title[b-8jazqbsm3l] {
    color: var(--Primary-text, #0A125D);
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    justify-content: center;
    display: flex;
    cursor: pointer;
}

.close-button[b-8jazqbsm3l] {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
}

.popup-body[b-8jazqbsm3l] {
    padding: 15px;
}

.textarea-comment[b-8jazqbsm3l] {
    display: flex;
    width: 100%;
    height: 3rem;
    padding: 8px;
    align-items: flex-start;
    gap: 8px;
    flex-shrink: 0;
    border-radius: 4px;
    background: #F0F4F8;
}

.dvimages[b-8jazqbsm3l] {
    /* padding: 2px;*/
    border-radius: 2px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
   /* height: auto;*/
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.dvitem[b-8jazqbsm3l] {
    gap: 2rem;
    padding: 1px;
    flex-shrink: 0;
    float: left;
    margin-left: 2px;
}

.spnshowmore[b-8jazqbsm3l] {
    color: var(--main-color, #33767C);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.downarrowshowmore[b-8jazqbsm3l] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    cursor: pointer;
}

 .dvshowmoretext[b-8jazqbsm3l] {
    text-align: center;
    padding: 0px;
  /* padding-top:10px;
    height:10px;*/
}

/*.container {
    height: 75vh;*/ /* or any fixed height you want */
    /*display: flex;
    flex-direction: column;
}*/

/*.dvimages-container {
    display: flex;
    flex-direction: column;
    height: 100%;*/ /* or specific height like 500px */
/*}

.images-wrapper {
    flex: 0 1 80%;
    overflow-y: auto;*/ /* scroll if too many images */
/*}
.dvshowmoretext {
    flex: 0 1 20%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f9f9f9;
    border-top: 1px solid #ccc;
}*/

.popup-content.expanded[b-8jazqbsm3l] {
    width: 70%;
    border: solid 1px;
    border-radius: 1rem;
}

.modal-footer[b-8jazqbsm3l] {
    display: flex;
    justify-content: flex-end;
    margin-top: 1em;
    float: right;
}

    .modal-footer button[b-8jazqbsm3l] {
        cursor: pointer;
    }

.divTitle[b-8jazqbsm3l] {
    text-align: center;
    justify-content: flex-start;
}

.imageTitle[b-8jazqbsm3l] {
    font-size: 11px;
    color: cornflowerblue;
    float: left;
    font-style: normal;
    flex-wrap: wrap;
    font-weight: normal;
}



/*New requirement image show input Grid popup*/
.layout-controls[b-8jazqbsm3l] {
    display: flex;
    gap: 5px;
    margin-top: 5px;
    flex-wrap: wrap;
    float: right;
    padding-bottom: 5px;
    width: auto;
}

.layout-button[b-8jazqbsm3l] {
    background: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 3px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .layout-button:hover[b-8jazqbsm3l] {
        background-color: #f0f0f0;
    }

    .layout-button svg[b-8jazqbsm3l] {
        display: block;
        margin: auto;
        fill: #555;
    }

    .layout-button.active svg[b-8jazqbsm3l] {
        fill: #007bff;
    }

.dvimages > div[b-8jazqbsm3l] {
    display: grid;
    gap: 5px;
}

.grid-cols-1[b-8jazqbsm3l] {
    grid-template-columns: repeat(1, 1fr);
    /* WIDTH: 68%;*/
   /* height: 40%;*/
    align-content: center;
    align-items: center;
}

.grid-cols-4[b-8jazqbsm3l] {
    grid-template-columns: repeat(2, 1fr);
    /*WIDTH: 68%;*/
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
    gap: 15px;
}

.grid-cols-6[b-8jazqbsm3l] {
    grid-template-columns: repeat(3, 1fr);
   /* WIDTH: 97%;*/
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
    height:25rem;
}

.image-container img[b-8jazqbsm3l] {
    width: auto;
    max-width: 100%;
    height: 100%;
    border-radius: 4px;
    object-fit: cover;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.boxes[b-8jazqbsm3l] {
    width: 6px;
    height: 6px;
}

.dv-textarea[b-8jazqbsm3l] {
    /*padding:10px;*/
   /* padding-bottom:10px;*/
}

/*.image-container-zoom {
    overflow: hidden !important;
    position: relative !important;
    border: 1px solid #ccc !important;
}

.image-zoom {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    user-select: none !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    transform-origin: top left !important;
    cursor: grab !important;
}*/


.container[b-8jazqbsm3l] {
    position: relative;
    overflow: hidden; /* 🔒 Clipping area */
}

.image-container-zoom[b-8jazqbsm3l] {
   
    overflow: hidden !important;
    position: relative !important;
    border: 1px solid #ccc !important;
}

.image-zoom[b-8jazqbsm3l] {
  
    user-select: none !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    transform-origin: top left !important;
    cursor: grab !important;
}

/* /Components/Pages/BiodiversityDetail/UndefindSpeciesPage.razor.rz.scp.css */

.dv-undefindspecies[b-i40a2ku4k9] {
   height:auto;
}

.btn-see-detail[b-i40a2ku4k9] {
    padding: 20px 10px 10px 20px;
    
}


.reports-wrapper[b-i40a2ku4k9] {
    top: 28px;
    left: 61px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    position: absolute;
}

.reports-2[b-i40a2ku4k9] {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 24px;
    letter-spacing: 0;
    line-height: normal;
}

.dv-comment-text[b-i40a2ku4k9] {
    color: var(--Text-secondary, #676E80);
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.vector[b-i40a2ku4k9] {
    position: absolute;
    width: 26px;
    height: 24px;
    top: 31px;
    left: 23px;
}

.comment-text-solid[b-i40a2ku4k9] {
    position: absolute;
    width: 25px;
    height: 25px;
    top: 34px;
    left: 44rem;
    flex-shrink: 0;
}

/*tooltip Css*/

.tooltip1[b-i40a2ku4k9] {
    /* position: absolute;
    display: inline-block;*/
    /* border-bottom: 1px dotted black; /* If you want dots under the hoverable text */ */ visibility:visible;
    cursor: pointer;
}

    /* Tooltip text */
    .tooltip1 .tooltiptext[b-i40a2ku4k9] {
        visibility: hidden;
        width: 20rem;
        height: auto;
        max-height: 20rem;
        background-color: gray;
        border: solid 1px;
        color: #OOO;
        text-align: center;
        padding: 5px 0;
        border-radius: 6px;
        /* Position the tooltip text - see examples below! */
        position: absolute;
        z-index: 1;
        cursor: picture;
        top: -1rem;
        left: 33rem;
        /*margin-top: 0rem;*/
    }

    /* Show the tooltip text when you mouse over the tooltip container */
    .tooltip1:hover .tooltiptext[b-i40a2ku4k9] {
        visibility: visible;
    }
/* /Components/Pages/Common/AlertardComponentPage.razor.rz.scp.css */
.redbox[b-6k8ri9iyf1] {
    position: relative;
    width: 30px;
    height: 4px;
    background-color: #ed6f66;
}
.card[b-6k8ri9iyf1] {
    height:35rem!important;
}
/* /Components/Pages/Common/AlertComponent.razor.rz.scp.css */
.alert-container[b-3jg1cinvze] {
    position: fixed;
    /*  top: 20px;
    left: 50%;
    transform: translateX(-50%);*/
    z-index: 1050; /* Ensures it appears above everything */
    width: 25%;
    text-align: center;
    top: 20px;
    right: 20px
}
/* /Components/Pages/Common/CardImageComponentPage.razor.rz.scp.css */
.table-hover tbody tr[b-x8x2oh2bkx] {
    /*   display: flex; */
    align-items: center;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    margin-bottom: 10px;
    padding: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    gap: 5px;
}

    .table-hover tbody tr:hover[b-x8x2oh2bkx] {
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    }

.project-image[b-x8x2oh2bkx] {
    width: 35px;
    height: 35px;
    border-radius: 10px;
    margin-right: 15px;
}

.project-name[b-x8x2oh2bkx] {
    font-weight: 600;
    color: #2f3b78;
}

.icon-btn[b-x8x2oh2bkx] {
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    font-size: 1.2rem;
}

    .icon-btn:hover[b-x8x2oh2bkx] {
        color: #000;
    }

.table tbody td[b-x8x2oh2bkx] {
    padding: 0;
    border: none;
}

.table-hover[b-x8x2oh2bkx] {
    border-collapse: separate;
    border-spacing: 0;
}

    .table-hover tbody tr td[b-x8x2oh2bkx] {
        flex: 1;
        padding: 8px 15px;
    }

.text-end[b-x8x2oh2bkx] {
    display: flex;
    justify-content: flex-end;
}

.project-title[b-x8x2oh2bkx] {
    color: var(--Primary-text, #0A125D);
    font-family: Qanelas;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.table-card[b-x8x2oh2bkx] {
    border-collapse: separate;
    border-spacing: 0 0.5rem;
}

    .table-card tbody tr[b-x8x2oh2bkx] {
        background-color: white;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        border-radius: 10px;
        overflow: hidden;
    }

        /* Card-like padding and border styling */
        .table-card tbody tr td[b-x8x2oh2bkx] {
            padding: 0.7rem;
            border: none; /* Remove table cell borders */
        }

    /* Optionally adjust header row */
    .table-card thead th[b-x8x2oh2bkx] {
        border: none;
        text-align: left;
        padding: 1rem;
        background-color: #f8f9fa;
        font-weight: bold;
    }

/* Custom hover effect for edit and delete buttons */
.btn-icon:hover[b-x8x2oh2bkx] {
    background-color: #d4edda; /* Light green on hover */
    border-radius: 10%; /* Optional: Makes the hover effect circular */
    border: 1px solid #d4edda;
}

.btn-icon[b-x8x2oh2bkx] {
    transition: background-color 0.10s ease-in-out; /* Smooth transition */
}

.nursery-badge[b-x8x2oh2bkx] {
    border-radius: 4px;
    background: rgba(251, 219, 170, 0.20);
    color: #E08801;
    font-family: Lato;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.type-badge[b-x8x2oh2bkx] {
    padding: 4px 8px;
    /*font-size: 12px;*/
    border-radius: 5px;
}

.mangrove-badge[b-x8x2oh2bkx] {
    /* background-color: #b0e5e8; */
    color: #5B9EF5;
    border-radius: 4px;
    background: rgba(91, 158, 245, 0.10);
}

.card-img-top[b-x8x2oh2bkx]
{
    height:13rem;
}
/* /Components/Pages/Common/EditModelDialog.razor.rz.scp.css */
.modal-backdrop[b-4j5624w10m] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
}

.modal-box[b-4j5624w10m] {
    background: white;
    padding: 20px;
    margin: 10% auto;
    width: 300px;
    border-radius: 8px;
}
/* /Components/Pages/Common/FishAbundancePage.razor.rz.scp.css */
.fishabandance[b-0y0h73egmw] {
    position: absolute;
    width: 336px;
    height: 56px;
    top: 151px;
    left: 24px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.img-fish[b-0y0h73egmw] {
    position: absolute;
    width: 32px;
    height: 32px;
    top: 0.8rem;
    left: 7px;
}

.fish-p[b-0y0h73egmw] {
    position: absolute;
    top: 6px;
    left: 47px;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: normal;
}

.span[b-0y0h73egmw] {
    color: #0a125d;
}

.text-wrapper-42[b-0y0h73egmw] {
    font-weight: 600;
    color: #33757c;
}

.text-wrapper-43[b-0y0h73egmw] {
    font-weight: 600;
    color: #0a125d;
}
/* /Components/Pages/Common/FishChartCardComponentPage.razor.rz.scp.css */
.redbox[b-pgovx442no] {
    position: relative;
    width: 30px;
    height: 4px;
    background-color: #ed6f66;
}
.card[b-pgovx442no] {
    height:30rem!important;
}
/* /Components/Pages/Common/ImageGalleryComponentPage.razor.rz.scp.css */
.popup-overlay[b-caxk57bv35] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    border: solid 1px;
}

.popup-content[b-caxk57bv35] {
    background: white;
    border-radius: 1rem;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    max-width: 100%;
    width: 60%;
    height:35rem;
    padding: 0px;
    position: relative;
    border: solid 1px;
    flex-shrink: 0;
}

.popup-header[b-caxk57bv35] {
    display: flex;
    justify-content: flex-end;
    height:12px;
}

.popup-title[b-caxk57bv35] {
    color: var(--Primary-text, #0A125D);
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    justify-content: center;
    display: flex;
    cursor:pointer;
}

.close-button[b-caxk57bv35] {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
}

.popup-body[b-caxk57bv35] {
    padding: 15px;
  
}

.textarea-comment[b-caxk57bv35] {
    display: flex;
    width: 100%;
    height: 3rem;
    padding: 8px;
    align-items: flex-start;
    gap: 8px;
    flex-shrink: 0;
    border-radius: 4px;
    background: #F0F4F8;
}

.dvimages[b-caxk57bv35] {
   /* padding: 2px;*/
    border-radius: 2px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    height: auto; 
    width: 100%;
    display: flex;
    flex-wrap: wrap; 
    justify-content: center; 
    gap: 10px; 
}
/*.container {
    height: 100vh;*/ /* or any fixed height you want */
    /*display: flex;
    flex-direction: column;
}*/

.dvitem[b-caxk57bv35] {
    gap: 2rem;
    padding: 1px;
    flex-shrink: 0;
    float: left;
    margin-left: 2px;
}

.spnshowmore[b-caxk57bv35] {
    color: var(--main-color, #33767C);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.downarrowshowmore[b-caxk57bv35] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    cursor: pointer;
}

.dvshowmoretext[b-caxk57bv35] {
    text-align:center;
    padding: 0px;
}

.popup-content.expanded[b-caxk57bv35] {
    width: 70%;
    border: solid 1px;
    border-radius: 1rem;
}

.modal-footer[b-caxk57bv35] {
    display: flex;
    justify-content: flex-end;
    margin-top: 1em;
    float:right;
}
    .modal-footer button[b-caxk57bv35] {
        cursor: pointer;
    }
.divTitle[b-caxk57bv35]{
    text-align:center;
    justify-content:flex-start;
}

.imageTitle[b-caxk57bv35] {
    font-size: 11px;
    color: cornflowerblue;
    float: left;
    font-style: normal;
    flex-wrap:wrap;
    font-weight:normal;
}



/*New requirement image show input Grid popup*/
.layout-controls[b-caxk57bv35] {
    display: flex;
    gap: 5px;
    margin-top: 5px;
    flex-wrap: wrap;
    float:right;
    padding-bottom:5px;
    width:auto;

}

.layout-button[b-caxk57bv35] {
    background: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 3px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .layout-button:hover[b-caxk57bv35] {
        background-color: #f0f0f0;
    }

    .layout-button svg[b-caxk57bv35] {
        display: block;
        margin: auto;
        fill: #555;
    }

    .layout-button.active svg[b-caxk57bv35] {
        fill: #007bff;
    }

.dvimages > div[b-caxk57bv35] {
    display: grid;
    gap: 5px;
}

.grid-cols-1[b-caxk57bv35] {
    grid-template-columns: repeat(1, 1fr);
   /* WIDTH:68%;
    height:40%;*/
    align-content:center;
    align-items:center;
}

.grid-cols-4[b-caxk57bv35] {
    grid-template-columns: repeat(2, 1fr);
   /* WIDTH: 68%;*/
    display: flex;
    flex-wrap: wrap; 
    justify-content: left; 
    gap: 15px;
}

.grid-cols-6[b-caxk57bv35] {
    grid-template-columns: repeat(3, 1fr);
    /*WIDTH: 97%;*/
    display: flex;
    flex-wrap: wrap; 
    justify-content: center; 
    gap: 15px; 
    height:25rem;
}

.image-container img[b-caxk57bv35] {
    width: auto;
    max-width: 100%; 
    height: 100%;
    border-radius: 4px;
    object-fit: cover;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.boxes[b-caxk57bv35] {
    width: 6px;
    height: 6px;
}
.dv-textarea[b-caxk57bv35]
{
    /*padding:10px;*/

}

.container[b-caxk57bv35] {
    position: relative;
    overflow: hidden; /* 🔒 Clipping area */
}

/*.image-container-zoom {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;*/ /* ensures zoomed image is clipped */
/*}

.image-zoom {
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: top left;
    user-select: none;
    cursor: grab;
}*/

.image-container-zoom[b-caxk57bv35] {
    overflow: hidden !important;
    position: relative !important;
    border: 1px solid #ccc !important;
}

.image-zoom[b-caxk57bv35] {
    user-select: none !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    transform-origin: top left !important;
    cursor: grab !important;
}
/* /Components/Pages/Common/ImageUploader.razor.rz.scp.css */
.drag-drop-container[b-2xtaznil6c] {
    border: 2px dashed #d1d5db;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    background-color: #f9fafb;
    transition: background-color 0.3s ease;
    position: relative;
    width: 300px;
    margin: auto;
    gap: 0.8rem;
    row-gap: 1.1rem;
}

    .drag-drop-container.dragging[b-2xtaznil6c] {
        background-color: #e0f7fa;
    }



.upload-label[b-2xtaznil6c] {
    display: block;
    cursor: pointer;
}

.upload-area[b-2xtaznil6c] {
    display: flex;
    flex-direction: column;
    align-items: center;
}


.icon[b-2xtaznil6c] {
    width: 40px;
    height: 40px;
    margin-bottom: 10px;
    object-fit: cover;
    border-radius: 8px;
}

.preview-image[b-2xtaznil6c] {
    width: 100%;
    height: 149PX;
    margin-bottom: 10px;
    object-fit: contain;
    border-radius: 8px;
}

.upload-text[b-2xtaznil6c] {
    font-size: 16px;
    color: #6b7280;
}

.browse-link[b-2xtaznil6c] {
    color: #3b82f6;
    cursor: pointer;
    text-decoration: underline;
}

.file-info[b-2xtaznil6c] {
    font-size: 12px;
    color: #9ca3af;
}

.error-message[b-2xtaznil6c] {
    color: #ef4444;
    font-size: 14px;
    margin-top: 10px;
}

.hidden-input[b-2xtaznil6c] {
    display: none;
}

.image-list[b-2xtaznil6c] {
    list-style-type: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    overflow-y: scroll;
    height: 159px;
}

    .image-list li[b-2xtaznil6c] {
        border: 1px solid #ddd;
        border-radius: 5px;
        overflow: hidden;
        padding: 5px;
        width: 13.8rem;
    }

.drag-drop-container input[type="file"][b-2xtaznil6c] {
    display: none;
}


. /*drag-drop-container {
    border: 2px dashed #ccc;
    padding: 20px;
    text-align: center;
    border-radius: 10px;
    background-color: #f9f9f9;
    cursor: pointer;
    margin: 20px auto;
    max-width: 500px;
}

    .drag-drop-container.dragging {
        border-color: #007bff;
        background-color: #e9f5ff;
    }*/
.upload-area[b-2xtaznil6c] {
    position: relative;
    padding: 20px;
}

.icon[b-2xtaznil6c] {
    width: 50px;
    height: 50px;
    margin-bottom: 10px;
}

.upload-text[b-2xtaznil6c] {
    font-size: 14px;
    color: #555;
}

.browse-link[b-2xtaznil6c] {
    color: #007bff;
    text-decoration: underline;
    cursor: pointer;
}

.preview-image[b-2xtaznil6c] {
    max-width: 100px;
    max-height: 100px;
    object-fit: cover;
    margin: 5px;
    border: 1px solid #ddd;
    border-radius: 5px;
}
/* /Components/Pages/Common/ImageViewerComponentPage.razor.rz.scp.css */
.image-container img[b-i51euds2af] {
    width: auto;
    max-width: 100%;
    height: 100%;
    border-radius: 4px;
    object-fit: cover;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.container[b-i51euds2af] {
    position: relative;
    overflow: hidden; /* 🔒 Clipping area */
}

.image-container-zoom[b-i51euds2af] {
    overflow: hidden !important;
    position: relative !important;
    border: 1px solid #ccc !important;
}

.image-zoom[b-i51euds2af] {
    user-select: none !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    transform-origin: top left !important;
    cursor: grab !important;
}
/* /Components/Pages/Common/ImgUploader.razor.rz.scp.css */
.drag-drop-container[b-9zkw8lskhv] {
    border: 2px dashed #d1d5db;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    background-color: #f9fafb;
    transition: background-color 0.3s ease;
    position: relative;
    width: 300px;
    margin: auto;
    gap: 0.8rem;
    row-gap: 1.1rem;
    max-height: 230px;
    height: 215px;
}

    .drag-drop-container.dragging[b-9zkw8lskhv] {
        background-color: #e0f7fa;
    }



.upload-label[b-9zkw8lskhv] {
    display: block;
    cursor: pointer;
}

.upload-area[b-9zkw8lskhv] {
    display: flex;
    flex-direction: column;
    align-items: center;
}


.icon[b-9zkw8lskhv] {
    width: 40px;
    height: 40px;
    margin-bottom: 10px;
    object-fit: cover;
    border-radius: 8px;
}

.preview-image[b-9zkw8lskhv] {
    width: 150px;
    height: 149PX;
    margin-bottom: 10px;
    object-fit: contain;
    border-radius: 8px;
}

.upload-text[b-9zkw8lskhv] {
    font-size: 16px;
    color: #6b7280;
}

.browse-link[b-9zkw8lskhv] {
    color: #3b82f6;
    cursor: pointer;
    text-decoration: underline;
}

.file-info[b-9zkw8lskhv] {
    font-size: 12px;
    color: #9ca3af;
}

.error-message[b-9zkw8lskhv] {
    color: #ef4444;
    font-size: 14px;
    margin-top: 10px;
}

.hidden-input[b-9zkw8lskhv] {
    display: none;
}

.image-list[b-9zkw8lskhv] {
    list-style-type: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    overflow-y: scroll;
    height: 159px;
}

    .image-list li[b-9zkw8lskhv] {
        border: 1px solid #ddd;
        border-radius: 5px;
        overflow: hidden;
        padding: 5px;
        width: 13.8rem;
    }

.drag-drop-container input[type="file"][b-9zkw8lskhv] {
    display: none;
}


. /*drag-drop-container {
    border: 2px dashed #ccc;
    padding: 20px;
    text-align: center;
    border-radius: 10px;
    background-color: #f9f9f9;
    cursor: pointer;
    margin: 20px auto;
    max-width: 500px;
}

    .drag-drop-container.dragging {
        border-color: #007bff;
        background-color: #e9f5ff;
    }*/
.upload-area[b-9zkw8lskhv] {
    position: relative;
    padding: 20px;
}

.icon[b-9zkw8lskhv] {
    width: 50px;
    height: 50px;
    margin-bottom: 10px;
}

.upload-text[b-9zkw8lskhv] {
    font-size: 14px;
    color: #555;
}

.browse-link[b-9zkw8lskhv] {
    color: #007bff;
    text-decoration: underline;
    cursor: pointer;
}

.preview-image[b-9zkw8lskhv] {
   /* max-width:100%;
    max-height: 150px;*/
    object-fit: cover;
    margin: 5px;
    border: 1px solid #ddd;
    border-radius: 5px;
}
.delicon[b-9zkw8lskhv] {
    /*margin: -90px;
    margin-right: -175px;*/
    margin: -162px;
    
    margin-right: -206px;
}
/* /Components/Pages/Common/InvertebrateAbunsPage.razor.rz.scp.css */
.dvinverabund[b-enqhxfre20] {
    position: absolute;
    width: 336px;
    height: 56px;
    top: 223px;
    left: 24px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.fish-p[b-enqhxfre20] {
    position: absolute;
    top: 6px;
    left: 47px;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: normal;
}

.img-fish[b-enqhxfre20] {
    position: absolute;
    width: 32px;
    height: 32px;
    top: 0.8rem;
    left: 7px;
}

.span[b-enqhxfre20] {
    color: #0a125d;
}
.text-value[b-enqhxfre20] {
    font-weight: 700;
    color: #ed6f66;
}

/* /Components/Pages/Common/MessagePopupPage.razor.rz.scp.css */
.popup-overlay[b-6qafema3v6] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    border: solid 1px;
}

.popup-content[b-6qafema3v6] {
    background: white;
    border-radius: 3rem;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    max-width: 300px;
    width: 100%;
    padding: 15px;
    position: relative;
    border: solid 2px;
    left: 4rem
}

.popup-header[b-6qafema3v6] {
    display: flex;
    justify-content: flex-end;
}

.popup-title[b-6qafema3v6] {
    top: 0px;
    color: green;
    font-size: x-large;
    margin-top: 0;
}

.close-button[b-6qafema3v6] {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
}

.popup-body[b-6qafema3v6] {
    /* padding: 10px 0; */
}
/* /Components/Pages/Common/ModalDialog.razor.rz.scp.css */
.pointerdata[b-4zcw2bdh9q] {
    cursor: pointer;
    height:400px;
}

/*.image-container {
    overflow: hidden !important;
    position: relative !important;
    border: 1px solid #ccc !important;
}

.image {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    user-select: none !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    transform-origin: top left !important;
    cursor: grab !important;
}*/
/* /Components/Pages/Common/MultiImageUploader.razor.rz.scp.css */
.drag-drop-container[b-i8qclu9z31] {
    border: 2px dashed #d1d5db;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    background-color: #f9fafb;
    transition: background-color 0.3s ease;
    position: relative;
    width: 300px;
    margin: auto;
    gap: 0.8rem;
    row-gap: 1.1rem;
    max-height: 230px;
    height: 215px;
}

    .drag-drop-container.dragging[b-i8qclu9z31] {
        background-color: #e0f7fa;
    }



.upload-label[b-i8qclu9z31] {
    display: block;
    cursor: pointer;
}

.upload-area[b-i8qclu9z31] {
    display: flex;
    flex-direction: column;
    align-items: center;
}


.icon[b-i8qclu9z31] {
    width: 40px;
    height: 40px;
    margin-bottom: 10px;
    object-fit: cover;
    border-radius: 8px;
}

.preview-image[b-i8qclu9z31] {
    width: 150px;
    height: 149PX;
    margin-bottom: 10px;
    object-fit: contain;
    border-radius: 8px;
}

.upload-text[b-i8qclu9z31] {
    font-size: 16px;
    color: #6b7280;
}

.browse-link[b-i8qclu9z31] {
    color: #3b82f6;
    cursor: pointer;
    text-decoration: underline;
}

.file-info[b-i8qclu9z31] {
    font-size: 12px;
    color: #9ca3af;
}

.error-message[b-i8qclu9z31] {
    color: #ef4444;
    font-size: 14px;
    margin-top: 10px;
}

.hidden-input[b-i8qclu9z31] {
    display: none;
}

.image-list[b-i8qclu9z31] {
    list-style-type: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    overflow-y: scroll;
    height: 159px;
}

    .image-list li[b-i8qclu9z31] {
        border: 1px solid #ddd;
        border-radius: 5px;
        overflow: hidden;
        padding: 5px;
        width: 13.8rem;
    }

.drag-drop-container input[type="file"][b-i8qclu9z31] {
    display: none;
}


. /*drag-drop-container {
    border: 2px dashed #ccc;
    padding: 20px;
    text-align: center;
    border-radius: 10px;
    background-color: #f9f9f9;
    cursor: pointer;
    margin: 20px auto;
    max-width: 500px;
}

    .drag-drop-container.dragging {
        border-color: #007bff;
        background-color: #e9f5ff;
    }*/
.upload-area[b-i8qclu9z31] {
    position: relative;
    padding: 20px;
}

.icon[b-i8qclu9z31] {
    width: 50px;
    height: 50px;
    margin-bottom: 10px;
}

.upload-text[b-i8qclu9z31] {
    font-size: 14px;
    color: #555;
}

.browse-link[b-i8qclu9z31] {
    color: #007bff;
    text-decoration: underline;
    cursor: pointer;
}

.preview-image[b-i8qclu9z31] {
    /* max-width:100%;
    max-height: 150px;*/
    object-fit: cover;
    margin: 5px;
    border: 1px solid #ddd;
    border-radius: 5px;
}

.multidelicon[b-i8qclu9z31] {
    /*margin: -90px;
    margin-right: -175px;*/
    /* margin: -162px;
    margin-right: -206px;*/
    position: absolute;
}


.multiimage-dashboard-img[b-i8qclu9z31] {
    gap: 0.8rem;
    row-gap: 1.1rem;
    width: 110%;
    margin: 32px;

}

.multiimage-size[b-i8qclu9z31] {
    width: 21% !important;
    height: 190px !important;
}
.multi-img-top[b-i8qclu9z31] {
    width: 150px;
    height: 149px;
    margin: 6px;
}
.multi-img_card[b-i8qclu9z31] {
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
    padding: 20px;
 
}
/* /Components/Pages/Common/MultiSelectDropdown.razor.rz.scp.css */
.text-truncate[b-k1ns2i57xa] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    height: 2.9rem;
}
/* /Components/Pages/Common/ProgressBarPage.razor.rz.scp.css */
.dvprogressbar[b-3wxtd9n139] {
    position: absolute;
    top: 12px;
    left: 11px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.progressbar[b-3wxtd9n139] {
    width: 106px;
    height: 6px;
    background-color: #33757c;
    border-radius: 8px;
}
.progress[b-3wxtd9n139]{
    height: 0.5rem!important;
}
.mb-3[b-3wxtd9n139] {
    margin-bottom: 1rem !important;
    height: 0.7rem !important;
}
.text-wrapper-40[b-3wxtd9n139] {
    position: absolute;
    top: 12px;
    left: 11px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.overlap-13[b-3wxtd9n139] {
    position: absolute;
    width: 156px;
    height: 56px;
    top: 79px;
    left: 24px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}
/* /Components/Pages/Common/ReportPreNextComponetPage.razor.rz.scp.css */

.btn-custom-right[b-du3eifay9l] {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #3b7874;
    color: #3b7874;
    background-color: white;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 1.1rem;
    margin-left: 0.5rem;
    float: right;
    /*font-weight: 500;*/
}

    .btn-custom-right:hover[b-du3eifay9l] {
        background-color: #e9f5f5;
    }

    .btn-custom-right i[b-du3eifay9l] {
        margin-left: 8px; /* Space between text and arrow */
    }


.btn-custom-left[b-du3eifay9l] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #3b7874; /* Border color similar to your image */
    color: #3b7874; /* Text and icon color */
    background-color: white;
    /* padding: 5px 10px;*/
    border-radius: 5px;
    font-size: 1.1rem;
    text-decoration: none;
    /*  margin-left: 0.3rem;*/
    float: right;
    /*font-weight: 500;*/
}

    .btn-custom-left:hover[b-du3eifay9l] {
        background-color: #e9f5f5;
    }

    .btn-custom-left i[b-du3eifay9l] {
        margin-right: 8px; /* Space between arrow and text */
    }

.btn-outline-custom[b-du3eifay9l] {
    display: inline-flex;
    align-items: center;
    border: 2px solid #3b7874; /* Border color similar to your image */
    color: #3b7874; /* Text and icon color */
    background-color: transparent;
    padding: 8px 20px;
    border-radius: 5px;
    font-size: 1.1rem;
    font-weight: 500;
    text-decoration: none;
}

    .btn-outline-custom:hover[b-du3eifay9l] {
        background-color: #f0f7f7; /* Slight background change on hover */
    }

    .btn-outline-custom i[b-du3eifay9l] {
        margin-right: 8px; /* Space between icon and text */
    }
/* /Components/Pages/Common/TooltipN.razor.rz.scp.css */
.tooltip-container .tooltip-text[b-qiipots49g] {
    visibility: hidden;
    background-color: #33767c;
    color: #fff;
    text-align: center;
    padding: 5px 10px;
    border-radius: 4px;
    white-space: nowrap;
    z-index: 1000;
    opacity: 0;
    transition: opacity 0.3s;
}

.tooltip-container:hover .tooltip-text[b-qiipots49g] {
    visibility: visible;
    opacity: 9999;
}

.tooltip-text ul[b-qiipots49g] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.tooltip-text li[b-qiipots49g] {
    margin-bottom: 5px;
}
/* /Components/Pages/Common/UnderwaterStationModelPopup.razor.rz.scp.css */
.modal-backdrop[b-yob5ybjmfz] {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(0, 0, 0, 0.5) !important;
}

.modal-box[b-yob5ybjmfz] {
    background: white !important;
    padding: 20px !important;
    margin: 10% auto !important;
    width: 300px !important;
    border-radius: 8px !important;
}
/* /Components/Pages/Dashboard/Plantgenus.razor.rz.scp.css */
.coral-types[b-r53iyn5rz0] {
    display: flex;
    width: 158px;
    height: 187px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    flex-shrink: 0;
}

.coral-types .porites-coral[b-r53iyn5rz0] 
{
        color: var(--Primary-text, #0A125D);
        font-family: Qanelas;
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
}

.coral-types .mask-group[b-r53iyn5rz0] 
{
        width: 189.384px;
        height: 169.904px;
        flex-shrink: 0;
        border-top-left-radius: var(--bs-card-inner-border-radius);
        border-top-right-radius: var(--bs-card-inner-border-radius);
        border-bottom-left-radius: var(--bs-card-inner-border-radius);
        border-bottom-right-radius: var(--bs-card-inner-border-radius);
}
.redbox[b-r53iyn5rz0] 
{
    position: relative;
    width: 30px;
    height: 4px;
    background-color: #ed6f66;
}

.parent[b-r53iyn5rz0] {
 
    display: flex;
 
    width: 61.4rem;
    overflow-y: auto;
    height: 19rem;
}

.child[b-r53iyn5rz0] 
{
    display: inline-flex;
    margin-left:3rem;
    vertical-align: middle;
}
.plant-title[b-r53iyn5rz0] {
    color: var(--Primary-text, #0A125D);
    font-family: Qanelas;
    font-size: 21px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
/* /Components/Pages/Dashboard/ProjectInsightPage.razor.rz.scp.css */
.before-after-wrapper[b-arg0imd6ka] {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 440px;
}

.image-container[b-arg0imd6ka] {
    display: flex;
    flex-direction: column; /* Stack image pairs vertically */
    
}

.image-pair[b-arg0imd6ka] {
    display: flex;
    width: 100%;
    gap: 0.6rem;
}

.image-column[b-arg0imd6ka] {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.image-label[b-arg0imd6ka] {
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.image-column img[b-arg0imd6ka] {
    width: 100%;
    min-height: 450px;
    object-fit: cover;
    cursor: pointer;
    border: 1px solid #ccc;
    border-radius: 4px;
}



.before-image[b-arg0imd6ka],
.after-image[b-arg0imd6ka] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
}

.before-image[b-arg0imd6ka] {
    z-index: 2;
    width: 50%; /* Default starting width of the before image */
    overflow: hidden;
}

.after-image[b-arg0imd6ka] {
    z-index: 1;
}

.slider[b-arg0imd6ka] {
    position: absolute;
    top: 0;
    left: 50%; /* Default slider position */
    height: 100%;
    width: 2px;
    background-color: orange;
    cursor: ew-resize;
    z-index: 3;
}

.handle[b-arg0imd6ka] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    background-color: red;
    border: 2px solid red;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}



/*photo Gallery css*/

.dvitem[b-arg0imd6ka] {
    width: 10rem;
    height: 8.5rem;
    gap: 1rem;
    padding: 1px;
    flex-shrink: 0;
    float: left;
    margin-left: 2px;
    cursor:pointer;
    /*background: url("images/Rectangle 230.png") lightgray 50% / cover no-repeat;*/
}

.dvimages[b-arg0imd6ka] {
    padding: 0px;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    overflow: auto;
    height: 22rem;
}
/*End of photo Gallery css*/



/*Report div command table css*/
.reporttable-td[b-arg0imd6ka] {
    /*    height: 7.3rem;*/
    height: auto;
}

.reporttable-div[b-arg0imd6ka] {
    height: 25rem;
    overflow-x: hidden;
    overflow-y: auto;
    padding-top: 10px;
}

.reporttable-searcdiv[b-arg0imd6ka] {
    width: 620px;
    float: right;
}
/*End Report div command table css*/


.image-gallery[b-arg0imd6ka] {
    display: flex;
    flex-wrap: wrap; /* allows wrapping if too many images */
    gap: 1rem; /* horizontal and vertical gap */
    align-items: center;
}
/* /Components/Pages/MyProject/AlertspeciesPage.razor.rz.scp.css */
.rectangle-10[b-xb6nlhobt9] {
    position: relative;
    width: 30px;
    height: 4px;
    background-color: #ed6f66;
}

.title-2[b-xb6nlhobt9] {
    left: 23px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    position: absolute;
    top: 17px;
}

.MyFirstLine[b-xb6nlhobt9] {
    height: 20rem !important;
    width: 61rem !important;
}

.card[b-xb6nlhobt9] {
    height: 31rem !important;
    width: 60.4rem !important;
}

.row[b-xb6nlhobt9]{
    height:60rem;
}
/* /Components/Pages/MyProject/Biodiversity/BiodiversityDetailPage.razor.rz.scp.css */
/* {*/
/*background-color: #f6f8fa;*/
/*display: flex;
    flex-direction: row;
    justify-content: left;
    width: 100%;
}*/

.div[b-kt0i9cxzyt] {
    /*background-color: #f6f8fa;*/
    width: auto;
    height: 3198px;
    /*   position: absolute;*/
}

.overlap[b-kt0i9cxzyt] {
    position: absolute;
    width: 90%;
    top: 170px;
    /*left: 17rem;*/
}

.overlap-group[b-kt0i9cxzyt] {
    position: absolute;
    width: 60rem;
    height: 571px;
    top: 0;
    left: 0;
}

.rectangle[b-kt0i9cxzyt] {
    position: absolute;
    width: 282px;
    height: 64px;
    top: 8px;
    left: 918px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.rectangle-2[b-kt0i9cxzyt] {
    position: absolute;
    width: 100%;
    height: 475px;
    top: 96px;
    left: 0;
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.invertebrate[b-kt0i9cxzyt] {
    position: absolute;
    top: 20px;
    left: 966px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.text-wrapper[b-kt0i9cxzyt] {
    color: #0a125d;
}

.span[b-kt0i9cxzyt] {
    font-weight: 700;
    color: #ed6f66;
}

.icon-starfish[b-kt0i9cxzyt] {
    top: 23px;
    left: 926px;
    position: absolute;
    width: 32px;
    height: 32px;
}

.group[b-kt0i9cxzyt] {
    position: absolute;
    width: 15px;
    height: 13px;
    top: 181px;
    left: 1053px;
    background-image: url(./images/group-1087878-3.png);
    background-size: 100% 100%;
}

.rectangle-3[b-kt0i9cxzyt] {
    position: absolute;
    width: 1px;
    height: 32px;
    top: 172px;
    left: 1127px;
    background-color: var(--variable-collection-separation-contour);
}

.group-2[b-kt0i9cxzyt] {
    position: absolute;
    width: 18px;
    height: 18px;
    top: 179px;
    left: 1151px;
    background-image: url(./images/download.svg);
    background-size: 100% 100%;
}

.text-wrapper-2[b-kt0i9cxzyt] {
    position: absolute;
    top: 178px;
    left: 425px;
    font-weight: 400;
    color: #33767c;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.filter[b-kt0i9cxzyt] {
    top: 172px;
    left: 244px;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    position: absolute;
    border-radius: 4px;
    overflow: hidden;
}

.all-projects[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    margin-top: -0.5px;
    font-weight: 400;
    color: #33767c;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.group-wrapper[b-kt0i9cxzyt] {
    position: absolute;
    width: 32px;
    height: 32px;
    top: 172px;
    left: 1044px;
}

.div-wrapper[b-kt0i9cxzyt] {
    height: 32px;
}

.group-3[b-kt0i9cxzyt] {
    width: 32px;
    height: 32px;
}

.group-4[b-kt0i9cxzyt] {
    width: 32px;
    height: 32px;
    background-color: #ebf2f2;
    border-radius: 4px;
}

.all-projects-wrapper[b-kt0i9cxzyt] {
    top: 172px;
    left: 332px;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    position: absolute;
    border-radius: 4px;
    overflow: hidden;
}

.group-5[b-kt0i9cxzyt] {
    position: absolute;
    width: 15px;
    height: 13px;
    top: 180px;
    left: 1053px;
    background-image: url(./images/group-1087878-4.png);
    background-size: 100% 100%;
}

.legends[b-kt0i9cxzyt] {
    display: inline-flex;
    align-items: flex-start;
    gap: 32px;
    position: absolute;
    top: 533px;
    left: 422px;
}

.legend[b-kt0i9cxzyt] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    position: relative;
    flex: 0 0 auto;
}

.group-6[b-kt0i9cxzyt] {
    width: 81px;
    position: relative;
    height: 14px;
    margin-right: -2px;
}

.rectangle-4[b-kt0i9cxzyt] {
    position: absolute;
    width: 9px;
    height: 9px;
    top: 2px;
    left: 0;
    background-color: #ed6f66;
    border-radius: 1px;
}

.global-growth-rate[b-kt0i9cxzyt] {
    position: absolute;
    top: 0;
    left: 14px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.group-7[b-kt0i9cxzyt] {
    position: relative;
    width: 61px;
    height: 14px;
    margin-right: -2px;
}

.rectangle-5[b-kt0i9cxzyt] {
    background-color: #fbdbaa;
    position: absolute;
    width: 9px;
    height: 9px;
    top: 2px;
    left: 0;
    border-radius: 1px;
}

.group-8[b-kt0i9cxzyt] {
    width: 65px;
    position: relative;
    height: 14px;
    margin-right: -2px;
}

.rectangle-6[b-kt0i9cxzyt] {
    background-color: #5b9ef5;
    position: absolute;
    width: 9px;
    height: 9px;
    top: 2px;
    left: 0;
    border-radius: 1px;
}

.rectangle-7[b-kt0i9cxzyt] {
    background-color: #69e09d;
    position: absolute;
    width: 9px;
    height: 9px;
    top: 2px;
    left: 0;
    border-radius: 1px;
}

.filter-2[b-kt0i9cxzyt] {
    top: 172px;
    left: 129px;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    position: absolute;
    border-radius: 4px;
    overflow: hidden;
}

.group-9[b-kt0i9cxzyt] {
    position: absolute;
    width: 36px;
    height: 248px;
    top: 228px;
    left: 33px;
}

.text-wrapper-3[b-kt0i9cxzyt] {
    position: absolute;
    top: 234px;
    left: 14px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-4[b-kt0i9cxzyt] {
    top: 195px;
    left: 7px;
    position: absolute;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-5[b-kt0i9cxzyt] {
    top: 156px;
    left: 0;
    position: absolute;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-6[b-kt0i9cxzyt] {
    top: 117px;
    left: 0;
    position: absolute;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-7[b-kt0i9cxzyt] {
    top: 78px;
    left: 0;
    position: absolute;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-8[b-kt0i9cxzyt] {
    top: 39px;
    left: 0;
    position: absolute;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-9[b-kt0i9cxzyt] {
    top: 0;
    left: 0;
    position: absolute;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.filter-3[b-kt0i9cxzyt] {
    top: 172px;
    left: 24px;
    background-color: #e2e9e9;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    position: absolute;
    border-radius: 4px;
    overflow: hidden;
}

.title[b-kt0i9cxzyt] {
    top: 115px;
    left: 24px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    position: absolute;
}

.rectangle-8[b-kt0i9cxzyt] {
    position: relative;
    width: 30px;
    height: 4px;
    background-color: #ed6f66;
}

.reports[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 24px;
    letter-spacing: 0;
    line-height: normal;
}

.group-10[b-kt0i9cxzyt] {
    position: absolute;
    width: 13px;
    height: 12px;
    top: 183px;
    left: 1098px;
    background-image: url(./images/group-1087881-2.png);
    background-size: 100% 100%;
}

.group-11[b-kt0i9cxzyt] {
    position: absolute;
    width: 1114px;
    height: 240px;
    top: 235px;
    left: 62px;
}

.rectangle-9[b-kt0i9cxzyt] {
    position: absolute;
    width: 1113px;
    height: 1px;
    top: 239px;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-10[b-kt0i9cxzyt] {
    position: absolute;
    width: 240px;
    height: 1px;
    top: 120px;
    left: -119px;
    background-color: var(--variable-collection-separation-contour);
    transform: rotate(90deg);
}

.tiers[b-kt0i9cxzyt] {
    position: absolute;
    width: 26px;
    height: 70px;
    top: 291px;
    left: 1107px;
    transform: rotate(-180deg);
}

.group-12[b-kt0i9cxzyt] {
    position: relative;
    height: 70px;
}

.overlap-group-2[b-kt0i9cxzyt] {
    position: absolute;
    width: 20px;
    height: 15px;
    top: 55px;
    left: 6px;
}

.ellipse[b-kt0i9cxzyt] {
    top: 0;
    left: 0;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-2[b-kt0i9cxzyt] {
    top: 5px;
    left: 9px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-3[b-kt0i9cxzyt] {
    top: 0;
    left: 10px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-4[b-kt0i9cxzyt] {
    position: absolute;
    width: 10px;
    height: 10px;
    top: 0;
    left: 0;
    background-color: #5b9ef5;
    border-radius: 5px;
}

.tiers-2[b-kt0i9cxzyt] {
    position: absolute;
    width: 21px;
    height: 88px;
    top: 281px;
    left: 569px;
    transform: rotate(-180deg);
}

.group-13[b-kt0i9cxzyt] {
    position: relative;
    height: 88px;
}

.ellipse-5[b-kt0i9cxzyt] {
    top: 46px;
    left: 0;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-6[b-kt0i9cxzyt] {
    top: 78px;
    left: 1px;
    background-color: #5b9ef5;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-7[b-kt0i9cxzyt] {
    top: 68px;
    left: 11px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.ellipse-8[b-kt0i9cxzyt] {
    top: 0;
    left: 9px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-3[b-kt0i9cxzyt] {
    position: absolute;
    width: 22px;
    height: 59px;
    top: 324px;
    left: 955px;
    transform: rotate(-180deg);
}

.group-14[b-kt0i9cxzyt] {
    position: relative;
    height: 59px;
}

.ellipse-9[b-kt0i9cxzyt] {
    top: 31px;
    left: 0;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #5b9ef5;
    border-radius: 5px;
}

.ellipse-10[b-kt0i9cxzyt] {
    top: 49px;
    left: 12px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.ellipse-11[b-kt0i9cxzyt] {
    top: 10px;
    left: 12px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-4[b-kt0i9cxzyt] {
    position: absolute;
    width: 25px;
    height: 33px;
    top: 291px;
    left: 874px;
    transform: rotate(-180deg);
}

.group-15[b-kt0i9cxzyt] {
    position: relative;
    height: 33px;
}

.ellipse-12[b-kt0i9cxzyt] {
    top: 0;
    left: 1px;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-13[b-kt0i9cxzyt] {
    top: 13px;
    left: 0;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #5b9ef5;
    border-radius: 5px;
}

.ellipse-14[b-kt0i9cxzyt] {
    top: 23px;
    left: 11px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.ellipse-15[b-kt0i9cxzyt] {
    top: 0;
    left: 15px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-5[b-kt0i9cxzyt] {
    position: absolute;
    width: 25px;
    height: 53px;
    top: 338px;
    left: 109px;
}

.group-16[b-kt0i9cxzyt] {
    position: relative;
    height: 53px;
}

.ellipse-16[b-kt0i9cxzyt] {
    top: 43px;
    left: 15px;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-17[b-kt0i9cxzyt] {
    top: 15px;
    left: 15px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.ellipse-18[b-kt0i9cxzyt] {
    top: 27px;
    left: 2px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-6[b-kt0i9cxzyt] {
    position: absolute;
    width: 21px;
    height: 122px;
    top: 291px;
    left: 493px;
    transform: rotate(-180deg);
}

.group-17[b-kt0i9cxzyt] {
    position: relative;
    height: 122px;
}

.ellipse-19[b-kt0i9cxzyt] {
    top: 80px;
    left: 0;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-20[b-kt0i9cxzyt] {
    top: 60px;
    left: 1px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #5b9ef5;
    border-radius: 5px;
}

.ellipse-21[b-kt0i9cxzyt] {
    top: 112px;
    left: 11px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.tiers-7[b-kt0i9cxzyt] {
    position: absolute;
    width: 21px;
    height: 105px;
    top: 286px;
    left: 417px;
    transform: rotate(-180deg);
}

.group-18[b-kt0i9cxzyt] {
    position: relative;
    height: 105px;
}

.overlap-group-3[b-kt0i9cxzyt] {
    position: absolute;
    width: 19px;
    height: 20px;
    top: 85px;
    left: 2px;
}

.ellipse-22[b-kt0i9cxzyt] {
    top: 10px;
    left: 9px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-8[b-kt0i9cxzyt] {
    position: absolute;
    width: 25px;
    height: 79px;
    top: 273px;
    left: 724px;
    transform: rotate(-180deg);
}

.group-19[b-kt0i9cxzyt] {
    position: relative;
    height: 79px;
}

.ellipse-23[b-kt0i9cxzyt] {
    top: 69px;
    left: 0;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-24[b-kt0i9cxzyt] {
    top: 41px;
    left: 0;
    background-color: #5b9ef5;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-25[b-kt0i9cxzyt] {
    top: 0;
    left: 15px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-26[b-kt0i9cxzyt] {
    top: 28px;
    left: 15px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-9[b-kt0i9cxzyt] {
    position: absolute;
    width: 25px;
    height: 48px;
    top: 286px;
    left: 648px;
    transform: rotate(-180deg);
}

.group-20[b-kt0i9cxzyt] {
    position: relative;
    height: 48px;
}

.ellipse-27[b-kt0i9cxzyt] {
    top: 38px;
    left: 0;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-28[b-kt0i9cxzyt] {
    top: 23px;
    left: 0;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #5b9ef5;
    border-radius: 5px;
}

.ellipse-29[b-kt0i9cxzyt] {
    top: 33px;
    left: 11px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.tiers-10[b-kt0i9cxzyt] {
    position: absolute;
    width: 22px;
    height: 56px;
    top: 315px;
    left: 801px;
    transform: rotate(-180deg);
}

.group-21[b-kt0i9cxzyt] {
    position: relative;
    height: 56px;
}

.ellipse-30[b-kt0i9cxzyt] {
    top: 36px;
    left: 0;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #5b9ef5;
    border-radius: 5px;
}

.ellipse-31[b-kt0i9cxzyt] {
    top: 46px;
    left: 12px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.ellipse-32[b-kt0i9cxzyt] {
    top: 19px;
    left: 10px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-11[b-kt0i9cxzyt] {
    position: absolute;
    width: 22px;
    height: 122px;
    top: 291px;
    left: 338px;
    transform: rotate(-180deg);
}

.ellipse-33[b-kt0i9cxzyt] {
    top: 56px;
    left: 1px;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-34[b-kt0i9cxzyt] {
    top: 112px;
    left: 12px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.ellipse-35[b-kt0i9cxzyt] {
    top: 39px;
    left: 12px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-12[b-kt0i9cxzyt] {
    position: absolute;
    width: 35px;
    height: 139px;
    top: 296px;
    left: 189px;
}

.group-22[b-kt0i9cxzyt] {
    position: relative;
    height: 139px;
}

.ellipse-36[b-kt0i9cxzyt] {
    top: 0;
    left: 10px;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-37[b-kt0i9cxzyt] {
    top: 102px;
    left: 0;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #5b9ef5;
    border-radius: 5px;
}

.ellipse-38[b-kt0i9cxzyt] {
    top: 42px;
    left: 25px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.ellipse-39[b-kt0i9cxzyt] {
    top: 129px;
    left: 2px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.group-23[b-kt0i9cxzyt] {
    position: absolute;
    width: 1113px;
    height: 240px;
    top: 235px;
    left: 62px;
}

.overlap-group-4[b-kt0i9cxzyt] {
    position: absolute;
    width: 1113px;
    height: 238px;
    top: 2px;
    left: 0;
}

.rectangle-11[b-kt0i9cxzyt] {
    position: absolute;
    width: 1112px;
    height: 1px;
    top: 154px;
    left: 0;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-12[b-kt0i9cxzyt] {
    position: absolute;
    width: 1112px;
    height: 1px;
    top: 196px;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-13[b-kt0i9cxzyt] {
    position: absolute;
    width: 1112px;
    height: 1px;
    top: 76px;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-14[b-kt0i9cxzyt] {
    position: absolute;
    width: 1112px;
    height: 1px;
    top: 115px;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-15[b-kt0i9cxzyt] {
    position: absolute;
    width: 1112px;
    height: 1px;
    top: 36px;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.img[b-kt0i9cxzyt] {
    position: absolute;
    width: 1002px;
    height: 238px;
    top: 0;
    left: 56px;
}

.rectangle-16[b-kt0i9cxzyt] {
    position: absolute;
    width: 1112px;
    height: 1px;
    top: 0;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.tiers-13[b-kt0i9cxzyt] {
    position: absolute;
    width: 31px;
    height: 100px;
    top: 257px;
    left: 259px;
    transform: rotate(-180deg);
}

.group-24[b-kt0i9cxzyt] {
    position: relative;
    height: 100px;
}

.ellipse-40[b-kt0i9cxzyt] {
    top: 0;
    left: 5px;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-41[b-kt0i9cxzyt] {
    top: 24px;
    left: 0;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #5b9ef5;
    border-radius: 5px;
}

.ellipse-42[b-kt0i9cxzyt] {
    top: 90px;
    left: 21px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.ellipse-43[b-kt0i9cxzyt] {
    top: 56px;
    left: 5px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-14[b-kt0i9cxzyt] {
    position: absolute;
    width: 23px;
    height: 70px;
    top: 291px;
    left: 1032px;
    transform: rotate(-180deg);
}

.ellipse-44[b-kt0i9cxzyt] {
    top: 16px;
    left: 0;
    background-color: #fbdbaa;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-45[b-kt0i9cxzyt] {
    top: 0;
    left: 3px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #5b9ef5;
    border-radius: 5px;
}

.ellipse-46[b-kt0i9cxzyt] {
    top: 60px;
    left: 11px;
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #69e09d;
    border-radius: 5px;
}

.ellipse-47[b-kt0i9cxzyt] {
    top: 21px;
    left: 13px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.element-am-am-am-am[b-kt0i9cxzyt] {
    top: 486px;
    left: 91px;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    position: absolute;
    font-weight: 400;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.calendar-selected[b-kt0i9cxzyt] {
    display: flex;
    flex-direction: column;
    width: 250px;
    align-items: center;
    position: absolute;
    top: 0;
    left: 950px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
    box-shadow: 0px 4px 4px #53535340;
}

.calendar[b-kt0i9cxzyt] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 10px;
    position: relative;
    flex: 0 0 auto;
}

.month[b-kt0i9cxzyt] {
    display: flex;
    width: 230px;
    align-items: center;
    justify-content: space-around;
    padding: 5px 0px;
    position: relative;
    flex: 0 0 auto;
}

.november[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
}

.weekday[b-kt0i9cxzyt] {
    display: flex;
    width: 230px;
    align-items: flex-start;
    position: relative;
    flex: 0 0 auto;
}

.day[b-kt0i9cxzyt] {
    display: flex;
    flex-direction: column;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px;
    position: relative;
    flex: 1;
    flex-grow: 1;
    background-color: #ffffff;
}

.weekday-2[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    margin-top: -3.5px;
    margin-bottom: -1.5px;
    margin-left: -1.57px;
    margin-right: -1.57px;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
}

.weekday-3[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    margin-top: -3.5px;
    margin-bottom: -1.5px;
    margin-left: -3.57px;
    margin-right: -3.57px;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
}

.weekday-4[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    margin-top: -3.5px;
    margin-bottom: -1.5px;
    margin-left: -0.57px;
    margin-right: -0.57px;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
}

.weekday-5[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    margin-top: -3.5px;
    margin-bottom: -1.5px;
    margin-left: -1.07px;
    margin-right: -1.07px;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
}

.weekday-6[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    margin-top: -3.5px;
    margin-bottom: -1.5px;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
}

.week[b-kt0i9cxzyt] {
    display: flex;
    width: 230px;
    height: 32px;
    align-items: flex-start;
    position: relative;
}

.date-wrapper[b-kt0i9cxzyt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px;
    position: relative;
    flex: 1;
    align-self: stretch;
    flex-grow: 1;
    background-color: #ffffff;
}

.date[b-kt0i9cxzyt] {
    margin-left: -1.57px;
    margin-right: -1.57px;
    color: #aaaaaa;
    position: relative;
    width: fit-content;
    margin-top: -3px;
    margin-bottom: -1px;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
}

.date-2[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    margin-top: -3px;
    margin-bottom: -1px;
    font-weight: 600;
    color: #aaaaaa;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
}

.day-2[b-kt0i9cxzyt] {
    background-color: #33767c;
    border-radius: 4px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px;
    position: relative;
    flex: 1;
    align-self: stretch;
    flex-grow: 1;
}

.date-3[b-kt0i9cxzyt] {
    color: #ffffff;
    position: relative;
    width: fit-content;
    margin-top: -3px;
    margin-bottom: -1px;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
}

.date-4[b-kt0i9cxzyt] {
    color: var(--variable-collection-primary-text);
    position: relative;
    width: fit-content;
    margin-top: -3px;
    margin-bottom: -1px;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
}

.date-5[b-kt0i9cxzyt] {
    margin-left: -0.07px;
    margin-right: -0.07px;
    color: var(--variable-collection-primary-text);
    position: relative;
    width: fit-content;
    margin-top: -3px;
    margin-bottom: -1px;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
}

.date-6[b-kt0i9cxzyt] {
    margin-left: -1.07px;
    margin-right: -1.07px;
    color: var(--variable-collection-primary-text);
    position: relative;
    width: fit-content;
    margin-top: -3px;
    margin-bottom: -1px;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
}

.date-7[b-kt0i9cxzyt] {
    margin-left: -0.57px;
    margin-right: -0.57px;
    color: var(--variable-collection-primary-text);
    position: relative;
    width: fit-content;
    margin-top: -3px;
    margin-bottom: -1px;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
}

.date-8[b-kt0i9cxzyt] {
    margin-left: -1.07px;
    margin-right: -1.07px;
    color: #333333;
    position: relative;
    width: fit-content;
    margin-top: -3px;
    margin-bottom: -1px;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
}

.date-9[b-kt0i9cxzyt] {
    margin-left: -1.57px;
    margin-right: -1.57px;
    color: var(--variable-collection-primary-text);
    position: relative;
    width: fit-content;
    margin-top: -3px;
    margin-bottom: -1px;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
}

.overlap-2[b-kt0i9cxzyt] {
    position: absolute;
    top: 8px;
    left: 38REM;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
    z-index: 0;
}

.overlap-2-Invertabies[b-kt0i9cxzyt] {
    position: absolute;
    top: 8px;
    left: 57REM;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
    z-index: 0;
}

.fish-abundance[b-kt0i9cxzyt] {
    position: absolute;
    top: 9px;
    left: 47px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
}

.text-wrapper-10[b-kt0i9cxzyt] {
    font-weight: 600;
    color: #33757c;
}

.text-wrapper-11[b-kt0i9cxzyt] {
    font-weight: 600;
    color: #0a125d;
}

.icon-fish[b-kt0i9cxzyt] {
    top: 14px;
    left: 7px;
    position: absolute;
    width: 32px;
    height: 32px;
}

.overlap-3[b-kt0i9cxzyt] {
    position: absolute;
    top: 8px;
    left: 0;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.text-wrapper-12[b-kt0i9cxzyt] {
    top: 15px;
    left: 11px;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    position: absolute;
    font-weight: 400;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.rectangle-wrapper[b-kt0i9cxzyt] {
    position: absolute;
    width: 258px;
    height: 6px;
    top: 39px;
    left: 11px;
    background-color: var(--variable-collection-separation-contour);
    border-radius: 8px;
}


.metrixboxwidth[b-kt0i9cxzyt] {
    width: 270px;
    height: 64px;
}

.rectangle-17[b-kt0i9cxzyt] {
    width: 206px;
    height: 6px;
    background-color: #33757c;
    border-radius: 8px;
}

.overlap-4[b-kt0i9cxzyt] {
    position: absolute;
    top: 8px;
    left: 306px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.group-25[b-kt0i9cxzyt] {
    position: absolute;
    width: 258px;
    height: 6px;
    top: 38px;
    left: 11px;
    background-color: var(--variable-collection-separation-contour);
    border-radius: 8px;
}

.rectangle-18[b-kt0i9cxzyt] {
    width: 94px;
    height: 6px;
    background-color: #fbdbaa;
    border-radius: 8px;
}

.text-wrapper-13[b-kt0i9cxzyt] {
    position: absolute;
    top: 14px;
    left: 11px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.overlap-5[b-kt0i9cxzyt] {
    position: absolute;
    width: 192px;
    height: 1024px;
    top: 0;
    left: 0;
    background-color: #ffffff;
    border-right-width: 1px;
    border-right-style: solid;
    border-color: var(--variable-collection-separation-contour);
}

.menu[b-kt0i9cxzyt] {
    position: absolute;
    width: 192px;
    height: 56px;
    top: 256px;
    left: -1px;
}

.text-wrapper-14[b-kt0i9cxzyt] {
    position: absolute;
    top: 17px;
    left: 52px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.img-2[b-kt0i9cxzyt] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 16px;
    left: 20px;
}

.image[b-kt0i9cxzyt] {
    position: absolute;
    width: 116px;
    height: 31px;
    top: 46px;
    left: 37px;
    object-fit: cover;
}

.overlap-wrapper[b-kt0i9cxzyt] {
    top: 192px;
    position: absolute;
    width: 192px;
    height: 56px;
    left: -1px;
}

.overlap-6[b-kt0i9cxzyt] {
    position: relative;
    width: 176px;
    height: 48px;
    top: 4px;
    left: 8px;
    background-color: #33767c;
    border-radius: 4px;
}

.dashboard[b-kt0i9cxzyt] {
    position: absolute;
    top: 13px;
    left: 44px;
    font-weight: 400;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.icons-project[b-kt0i9cxzyt] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 12px;
    left: 12px;
}

.menu-2[b-kt0i9cxzyt] {
    top: 320px;
    position: absolute;
    width: 192px;
    height: 56px;
    left: -1px;
}

.menu-3[b-kt0i9cxzyt] {
    top: 128px;
    position: absolute;
    width: 192px;
    height: 56px;
    left: -1px;
}

.menu-4[b-kt0i9cxzyt] {
    top: 409px;
    position: absolute;
    width: 192px;
    height: 56px;
    left: -1px;
}

.rectangle-19[b-kt0i9cxzyt] {
    position: absolute;
    width: 192px;
    height: 1px;
    top: 392px;
    left: -1px;
    background-color: var(--variable-collection-separation-contour);
}

.overlap-7[b-kt0i9cxzyt] {
    position: absolute;
    width: 1200px;
    /* height: 475px;*/
    top: 45rem;
    /*left: 17rem;*/
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.overlap-8[b-kt0i9cxzyt] {
    position: absolute;
    width: 1143px;
    height: 248px;
    top: 132px;
    left: 33px;
}

.group-26[b-kt0i9cxzyt] {
    position: absolute;
    width: 36px;
    height: 248px;
    top: 0;
    left: 0;
}

.tiers-15[b-kt0i9cxzyt] {
    position: absolute;
    width: 22px;
    height: 41px;
    top: 114px;
    left: 922px;
    transform: rotate(-180deg);
}

.group-27[b-kt0i9cxzyt] {
    position: relative;
    height: 41px;
}

.ellipse-48[b-kt0i9cxzyt] {
    top: 0;
    left: 0;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-16[b-kt0i9cxzyt] {
    position: absolute;
    width: 22px;
    height: 66px;
    top: 119px;
    left: 305px;
    transform: rotate(-180deg);
}

.group-28[b-kt0i9cxzyt] {
    position: relative;
    height: 66px;
}

.ellipse-49[b-kt0i9cxzyt] {
    top: 56px;
    left: 1px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-17[b-kt0i9cxzyt] {
    position: absolute;
    width: 15px;
    height: 66px;
    top: 63px;
    left: 242px;
    transform: rotate(-180deg);
}

.ellipse-50[b-kt0i9cxzyt] {
    top: 0;
    left: 5px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-18[b-kt0i9cxzyt] {
    position: absolute;
    width: 21px;
    height: 105px;
    top: 58px;
    left: 384px;
    transform: rotate(-180deg);
}

.ellipse-51[b-kt0i9cxzyt] {
    top: 85px;
    left: 2px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-52[b-kt0i9cxzyt] {
    top: 95px;
    left: 11px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.group-29[b-kt0i9cxzyt] {
    position: absolute;
    width: 1114px;
    height: 240px;
    top: 7px;
    left: 29px;
}

.tiers-19[b-kt0i9cxzyt] {
    position: absolute;
    width: 25px;
    height: 51px;
    top: 45px;
    left: 691px;
    transform: rotate(-180deg);
}

.group-30[b-kt0i9cxzyt] {
    position: relative;
    height: 51px;
}

.ellipse-53[b-kt0i9cxzyt] {
    top: 41px;
    left: 0;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.group-31[b-kt0i9cxzyt] {
    position: absolute;
    width: 1113px;
    height: 240px;
    top: 7px;
    left: 29px;
}

.tiers-20[b-kt0i9cxzyt] {
    position: absolute;
    width: 25px;
    height: 48px;
    top: 58px;
    left: 615px;
    transform: rotate(-180deg);
}

.ellipse-54[b-kt0i9cxzyt] {
    top: 38px;
    left: 0;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-21[b-kt0i9cxzyt] {
    position: absolute;
    width: 23px;
    height: 31px;
    top: 102px;
    left: 999px;
    transform: rotate(-180deg);
}

.group-32[b-kt0i9cxzyt] {
    position: relative;
    height: 31px;
}

.ellipse-55[b-kt0i9cxzyt] {
    top: 16px;
    left: 0;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-22[b-kt0i9cxzyt] {
    position: absolute;
    width: 20px;
    height: 46px;
    top: 97px;
    left: 770px;
    transform: rotate(-180deg);
}

.group-33[b-kt0i9cxzyt] {
    position: relative;
    height: 46px;
}

.ellipse-56[b-kt0i9cxzyt] {
    top: 0;
    left: 1px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-23[b-kt0i9cxzyt] {
    position: absolute;
    width: 20px;
    height: 139px;
    top: 68px;
    left: 156px;
}

.ellipse-57[b-kt0i9cxzyt] {
    top: 0;
    left: 10px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-24[b-kt0i9cxzyt] {
    position: absolute;
    width: 25px;
    height: 53px;
    top: 110px;
    left: 76px;
}

.ellipse-58[b-kt0i9cxzyt] {
    top: 43px;
    left: 15px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-25[b-kt0i9cxzyt] {
    position: absolute;
    width: 19px;
    height: 88px;
    top: 53px;
    left: 538px;
    transform: rotate(-180deg);
}

.ellipse-59[b-kt0i9cxzyt] {
    top: 46px;
    left: 0;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-26[b-kt0i9cxzyt] {
    position: absolute;
    width: 26px;
    height: 65px;
    top: 68px;
    left: 1074px;
    transform: rotate(-180deg);
}

.group-34[b-kt0i9cxzyt] {
    position: relative;
    height: 65px;
}

.ellipse-60[b-kt0i9cxzyt] {
    top: 55px;
    left: 6px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-61[b-kt0i9cxzyt] {
    top: 55px;
    left: 16px;
    background-color: #ed6f66;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-27[b-kt0i9cxzyt] {
    position: absolute;
    width: 20px;
    height: 90px;
    top: 95px;
    left: 461px;
    transform: rotate(-180deg);
}

.group-35[b-kt0i9cxzyt] {
    position: relative;
    height: 90px;
}

.ellipse-62[b-kt0i9cxzyt] {
    top: 80px;
    left: 0;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-28[b-kt0i9cxzyt] {
    position: absolute;
    width: 25px;
    height: 23px;
    top: 73px;
    left: 841px;
    transform: rotate(-180deg);
}

.group-36[b-kt0i9cxzyt] {
    position: relative;
    height: 23px;
}

.legends-2[b-kt0i9cxzyt] {
    left: 508px;
    display: inline-flex;
    align-items: flex-start;
    gap: 32px;
    position: absolute;
    top: 436px;
}

.group-37[b-kt0i9cxzyt] {
    width: 45px;
    position: relative;
    height: 14px;
    margin-right: -2px;
}

.group-38[b-kt0i9cxzyt] {
    width: 35px;
    position: relative;
    height: 14px;
    margin-right: -2px;
}

.filter-4[b-kt0i9cxzyt] {
    top: 75px;
    left: 260px;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    position: absolute;
    border-radius: 4px;
    overflow: hidden;
}

.filter-5[b-kt0i9cxzyt] {
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    position: absolute;
    top: 75px;
    left: 128px;
    border-radius: 4px;
    overflow: hidden;
}

.overlap-9[b-kt0i9cxzyt] {
    position: absolute;
    width: 32px;
    height: 32px;
    top: 76px;
    left: 1044px;
}

.group-39[b-kt0i9cxzyt] {
    position: absolute;
    width: 32px;
    height: 32px;
    top: 0;
    left: 0;
}

.group-40[b-kt0i9cxzyt] {
    position: absolute;
    width: 15px;
    height: 13px;
    top: 9px;
    left: 9px;
    background-image: url(./images/group-1087878-2.png);
    background-size: 100% 100%;
}

.filter-6[b-kt0i9cxzyt] {
    top: 75px;
    left: 23px;
    background-color: #e2e9e9;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    position: absolute;
    border-radius: 4px;
    overflow: hidden;
}

.rectangle-20[b-kt0i9cxzyt] {
    position: absolute;
    width: 1px;
    height: 32px;
    top: 75px;
    left: 1126px;
    background-color: var(--variable-collection-separation-contour);
}

.filter-7[b-kt0i9cxzyt] {
    top: 75px;
    left: 194px;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    position: absolute;
    border-radius: 4px;
    overflow: hidden;
}

.group-41[b-kt0i9cxzyt] {
    position: absolute;
    width: 18px;
    height: 18px;
    top: 82px;
    left: 1150px;
    background-image: url(./images/download.svg);
    background-size: 100% 100%;
}

.title-2[b-kt0i9cxzyt] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    position: absolute;
    top: 18px;
    left: 23px;
}

.group-42[b-kt0i9cxzyt] {
    position: absolute;
    width: 13px;
    height: 12px;
    top: 86px;
    left: 1097px;
    background-image: url(./images/image.png);
    background-size: 100% 100%;
}

.p[b-kt0i9cxzyt] {
    position: absolute;
    top: 389px;
    left: 90px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.overlap-10[b-kt0i9cxzyt] {
    position: absolute;
    width: 1200px;
    /* height: 475px;*/
    top: 79.5rem;
    /*left: 17rem;*/
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.group-43[b-kt0i9cxzyt] {
    position: absolute;
    width: 15px;
    height: 13px;
    top: 9px;
    left: 9px;
    background-image: url(./images/group-1087878.png);
    background-size: 100% 100%;
}

.group-44[b-kt0i9cxzyt] {
    position: absolute;
    width: 15px;
    height: 13px;
    top: 9px;
    left: 9px;
    background-image: url(./images/group-1087878-5.png);
    background-size: 100% 100%;
}

.tiers-29[b-kt0i9cxzyt] {
    position: absolute;
    width: 22px;
    height: 20px;
    top: 135px;
    left: 922px;
    transform: rotate(-180deg);
}

.group-45[b-kt0i9cxzyt] {
    position: relative;
    height: 20px;
}

.ellipse-63[b-kt0i9cxzyt] {
    top: 10px;
    left: 12px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-30[b-kt0i9cxzyt] {
    position: absolute;
    width: 24px;
    height: 10px;
    top: 86px;
    left: 841px;
    transform: rotate(-180deg);
}

.group-46[b-kt0i9cxzyt] {
    position: relative;
    height: 10px;
}

.ellipse-64[b-kt0i9cxzyt] {
    top: 0;
    left: 14px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-65[b-kt0i9cxzyt] {
    top: 38px;
    left: 0;
    background-color: #5b9ef5;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-66[b-kt0i9cxzyt] {
    top: 80px;
    left: 0;
    background-color: #5b9ef5;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-31[b-kt0i9cxzyt] {
    position: absolute;
    width: 19px;
    height: 56px;
    top: 85px;
    left: 538px;
    transform: rotate(-180deg);
}

.ellipse-67[b-kt0i9cxzyt] {
    top: 46px;
    left: 0;
    background-color: #5b9ef5;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-68[b-kt0i9cxzyt] {
    top: 0;
    left: 9px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-32[b-kt0i9cxzyt] {
    position: absolute;
    width: 23px;
    height: 15px;
    top: 102px;
    left: 999px;
    transform: rotate(-180deg);
}

.group-47[b-kt0i9cxzyt] {
    position: relative;
    height: 15px;
}

.ellipse-69[b-kt0i9cxzyt] {
    top: 5px;
    left: 13px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-33[b-kt0i9cxzyt] {
    position: absolute;
    width: 20px;
    height: 10px;
    top: 68px;
    left: 1074px;
    transform: rotate(-180deg);
}

.tiers-34[b-kt0i9cxzyt] {
    position: absolute;
    width: 19px;
    height: 29px;
    top: 114px;
    left: 770px;
    transform: rotate(-180deg);
}

.group-48[b-kt0i9cxzyt] {
    position: relative;
    height: 29px;
}

.ellipse-70[b-kt0i9cxzyt] {
    top: 19px;
    left: 9px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-35[b-kt0i9cxzyt] {
    position: absolute;
    width: 23px;
    height: 26px;
    top: 137px;
    left: 78px;
}

.group-49[b-kt0i9cxzyt] {
    position: relative;
    height: 26px;
}

.ellipse-71[b-kt0i9cxzyt] {
    top: 16px;
    left: 13px;
    background-color: #5b9ef5;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-36[b-kt0i9cxzyt] {
    position: absolute;
    width: 19px;
    height: 20px;
    top: 58px;
    left: 384px;
    transform: rotate(-180deg);
}

.ellipse-72[b-kt0i9cxzyt] {
    top: 10px;
    left: 9px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-37[b-kt0i9cxzyt] {
    position: absolute;
    width: 21px;
    height: 27px;
    top: 119px;
    left: 305px;
    transform: rotate(-180deg);
}

.group-50[b-kt0i9cxzyt] {
    position: relative;
    height: 27px;
}

.ellipse-73[b-kt0i9cxzyt] {
    top: 17px;
    left: 0;
    background-color: #5b9ef5;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-74[b-kt0i9cxzyt] {
    top: 0;
    left: 11px;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-38[b-kt0i9cxzyt] {
    position: absolute;
    width: 18px;
    height: 139px;
    top: 68px;
    left: 158px;
}

.ellipse-75[b-kt0i9cxzyt] {
    top: 0;
    left: 8px;
    background-color: #5b9ef5;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.ellipse-76[b-kt0i9cxzyt] {
    top: 129px;
    left: 0;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.tiers-39[b-kt0i9cxzyt] {
    position: absolute;
    width: 10px;
    height: 66px;
    top: 63px;
    left: 242px;
    transform: rotate(-180deg);
}

.ellipse-77[b-kt0i9cxzyt] {
    top: 56px;
    left: 0;
    background-color: #69e09d;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.legends-3[b-kt0i9cxzyt] {
    left: 511px;
    display: inline-flex;
    align-items: flex-start;
    gap: 32px;
    position: absolute;
    top: 436px;
}

.group-51[b-kt0i9cxzyt] {
    width: 49px;
    position: relative;
    height: 14px;
    margin-right: -2px;
}

.group-52[b-kt0i9cxzyt] {
    width: 100px;
    position: relative;
    height: 14px;
    margin-right: -2px;
}

.group-53[b-kt0i9cxzyt] {
    position: absolute;
    width: 13px;
    height: 12px;
    top: 86px;
    left: 1097px;
    background-image: url(./images/group-1087881.png);
    background-size: 100% 100%;
}

.filter-8[b-kt0i9cxzyt] {
    top: 75px;
    left: 200px;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    position: absolute;
    border-radius: 4px;
    overflow: hidden;
}

.overlap-11[b-kt0i9cxzyt] {
    position: absolute;
    width: 1200px;
    height: 88px;
    top: 107rem;
    /*left: 17rem;*/
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.button-primary[b-kt0i9cxzyt] {
    all: unset;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    position: absolute;
    top: 23px;
    left: 1040px;
    background-color: #33767c;
    border-radius: 4px;
    overflow: hidden;
}

.text-wrapper-15[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    font-weight: 400;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.icons-arrow-right[b-kt0i9cxzyt] {
    position: relative;
    width: 24px;
    height: 24px;
}

.reports-wrapper[b-kt0i9cxzyt] {
    top: 28px;
    left: 61px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    position: absolute;
}

.reports-2[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 24px;
    letter-spacing: 0;
    line-height: normal;
}

.text-wrapper-16[b-kt0i9cxzyt] {
    position: absolute;
    top: 0rem;
    left: 2rem;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
    display: inline-flex;
    padding: 8px;
    align-items: center;
    gap: 8px;
    border-radius: 4px;
    border: 1px solid #33767C;
}

.vector[b-kt0i9cxzyt] {
    position: absolute;
    width: 26px;
    height: 24px;
    top: 31px;
    left: 23px;
}

.comment-text-solid[b-kt0i9cxzyt] {
    position: absolute;
    width: 25px;
    height: 25px;
    top: 34px;
    left: 865px;
}

.overlap-12[b-kt0i9cxzyt] {
    position: absolute;
    width: 1200px;
    top: 121rem;
    /*left: 17rem;*/
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.rectangle-21[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 74px;
    left: 24px;
    object-fit: cover;
}

.rectangle-22[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 74px;
    left: 313px;
    object-fit: cover;
}

.rectangle-23[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 74px;
    left: 602px;
    object-fit: cover;
}

.rectangle-24[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 74px;
    left: 891px;
    object-fit: cover;
}

.rectangle-25[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 316px;
    left: 24px;
    object-fit: cover;
}

.rectangle-26[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 316px;
    left: 313px;
    object-fit: cover;
}

.rectangle-27[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 316px;
    left: 602px;
    object-fit: cover;
}

.rectangle-28[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 316px;
    left: 891px;
    object-fit: cover;
}

.rectangle-29[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 558px;
    left: 24px;
    object-fit: cover;
}

.rectangle-30[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 558px;
    left: 313px;
    object-fit: cover;
}

.rectangle-31[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 558px;
    left: 602px;
    object-fit: cover;
}

.rectangle-32[b-kt0i9cxzyt] {
    position: absolute;
    width: 287px;
    height: 240px;
    top: 558px;
    left: 891px;
    object-fit: cover;
}



.group-54[b-kt0i9cxzyt] {
    position: absolute;
    width: 186px;
    height: 19px;
    top: 814px;
    left: 508px;
}

.text-wrapper-17[b-kt0i9cxzyt] {
    position: absolute;
    top: 0;
    left: 0;
    font-weight: 400;
    color: #33767c;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.icons-arrow[b-kt0i9cxzyt] {
    position: absolute;
    width: 16px;
    height: 16px;
    top: 2px;
    left: 168px;
}

.title-3[b-kt0i9cxzyt] {
    top: 16px;
    left: 24px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    position: absolute;
}

.drop-down[b-kt0i9cxzyt] {
    display: flex;
    width: 184px;
    height: 32px;
    align-items: center;
    gap: 8px;
    padding: 8px 0px 8px 8px;
    position: absolute;
    top: 13rem;
    background-color: #ffffff;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.newest-first[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
}

.img-3[b-kt0i9cxzyt] {
    position: relative;
    width: 16px;
    height: 16px;
}

.drop-down-2[b-kt0i9cxzyt] {
    display: flex;
    width: 139px;
    height: 32px;
    align-items: center;
    gap: 8px;
    padding: 8px 0px 8px 8px;
    position: absolute;
    top: 13rem;
    /*  left: 84rem;*/
    background-color: #ffffff;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.text-wrapper-18[b-kt0i9cxzyt] {
    position: absolute;
    top: 103px;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 35px;
    letter-spacing: 0;
    line-height: normal;
    justify-content: left;
}

.header[b-kt0i9cxzyt] {
    position: absolute;
    width: 1248px;
    height: 56px;
    top: 0;
    /*left: 192px;*/
    background-color: #ffffff;
}

.text-wrapper-19[b-kt0i9cxzyt] {
    position: absolute;
    top: 17px;
    left: 1108px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.icons-logout[b-kt0i9cxzyt] {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 16px;
    left: 1200px;
}

.overlap-group-wrapper[b-kt0i9cxzyt] {
    position: absolute;
    width: 42px;
    height: 40px;
    top: 8px;
    left: 1060px;
}

.overlap-group-5[b-kt0i9cxzyt] {
    position: relative;
    width: 40px;
    height: 40px;
    background-color: var(--variable-collection-text-secondary);
    border-radius: 20px;
}

.text-wrapper-20[b-kt0i9cxzyt] {
    position: absolute;
    top: 9px;
    left: 11px;
    font-weight: 400;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.dashboard-my[b-kt0i9cxzyt] {
    position: absolute;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.button-primary-2[b-kt0i9cxzyt] {
    display: flex;
    align-items: flex-end;
    gap: 39px;
    padding: 8px;
    /*  left: 1248px;*/
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid;
    border-color: #33767c;
    width: 168px;
    position: absolute;
    top: 9rem;
}

.button-primary-2-1[b-kt0i9cxzyt] {
    display: flex;
    align-items: flex-end;
    gap: 5px;
    padding: 8px;
    /*left: 66rem;*/
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid;
    border-color: #33767c;
    width: 168px;
    position: absolute;
    top: 9rem;
}

.dvprebuttonparent[b-kt0i9cxzyt] {
    float: right;
    align-items: flex-end;
    margin-left: 52.5rem;
}

.dvnxtbuttonparent[b-kt0i9cxzyt] {
    float: right;
    align-items: flex-end;
    margin-left: 10rem;
}

.dvstation[b-kt0i9cxzyt] {
    /*float: right;*/
    align-items: flex-end;
    margin-left: 53rem;
}

.dvcalender0[b-kt0i9cxzyt] {
    /*float: right;*/
    align-items: flex-end;
    margin-left: 66rem;
}

.text-wrapper-21[b-kt0i9cxzyt] {
    position: relative;
    width: fit-content;
    font-weight: 400;
    color: #33767c;
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-21-1[b-kt0i9cxzyt] {
    font-weight: 400;
    color: #33767c;
    font-size: 18px;
    letter-spacing: 0;
    /*line-height: normal;*/
    white-space: nowrap;
    align-content: flex-start;
}


.button-primary-3[b-kt0i9cxzyt] {
    height: 45px;
    left: 66rem;
    /*  width: 168px;*/
    position: absolute;
    top: 105px;
    color: #33767c;
}

.dvpreviousbtn[b-kt0i9cxzyt] {
    margin-right: 23rem;
}

.dvnextbtn[b-kt0i9cxzyt] {
    margin-left: 12.5rem;
}

.filterdowpdowndiv[b-kt0i9cxzyt] {
    float: right;
    margin-right: 0.5rem;
}

.filterdropdown[b-kt0i9cxzyt] {
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    border-radius: 4px;
    border: 1px solid var(--separation-contour, #E0E0E0);
    background: #FFF;
    font-size: 0.8rem;
    padding: 8px 0px 8px 8px;
}

.calenderdiv[b-kt0i9cxzyt] {
    float: right;
}


.calenderInsidedv[b-kt0i9cxzyt] {
    padding: 5px 5px 5px 5px !important;
}

.btn-see-detail[b-kt0i9cxzyt] {
    padding: 20px 10px 10px 20px;
}

.dv-comment-text[b-kt0i9cxzyt] {
    position: absolute;
    top: 1.7rem;
    left: 47.7rem;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
    display: inline-flex;
    padding: 8px;
    align-items: center;
    gap: 8px;
    color: var(--Text-secondary, #676E80);
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    /* border-radius: 4px;
    border: 1px solid #33767C;*/
}

.pointer[b-kt0i9cxzyt] {
    cursor: pointer;
}

.picsofcss[b-kt0i9cxzyt] {
    width: 1200px;
    height: 900px;
    /* top: 114rem; */
    /* left: 17rem; */
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

/* /Components/Pages/MyProject/MyProjReportPage.razor.rz.scp.css */

.dashboard-my[b-bk4q7y5j8o] {
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.overlap[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 192px;
    height: 1024px;
    top: 0;
    left: 0;
    background-color: #ffffff;
    border-right-width: 1px;
    border-right-style: solid;
    border-color: var(--variable-collection-separation-contour);
}

.menu[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 192px;
    height: 56px;
    top: 128px;
    left: -1px;
}

.text-wrapper[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 17px;
    left: 52px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.img[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 24px;
    height: 24px;
    top: 16px;
    left: 20px;
}

.overlap-group-wrapper[b-bk4q7y5j8o] {
    top: 192px;
    /*position: absolute;*/
    width: 192px;
    height: 56px;
    left: -1px;
}

.overlap-group[b-bk4q7y5j8o] {
    position: relative;
    width: 176px;
    height: 48px;
    top: 4px;
    left: 8px;
    background-color: #33767c;
    border-radius: 4px;
}

.dashboard[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 13px;
    left: 44px;
    font-weight: 400;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.icons-project[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 24px;
    height: 24px;
    top: 12px;
    left: 12px;
}

.menu-2[b-bk4q7y5j8o] {
    top: 256px;
    /*position: absolute;*/
    width: 192px;
    height: 56px;
    left: -1px;
}

.menu-3[b-bk4q7y5j8o] {
    top: 320px;
    /*position: absolute;*/
    width: 192px;
    height: 56px;
    left: -1px;
}

.image[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 116px;
    height: 31px;
    top: 46px;
    left: 37px;
    object-fit: cover;
}

.menu-4[b-bk4q7y5j8o] {
    top: 409px;
    /*position: absolute;*/
    width: 192px;
    height: 56px;
    left: -1px;
}

.rectangle[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 192px;
    height: 1px;
    top: 392px;
    left: -1px;
    background-color: var(--variable-collection-separation-contour);
}

.header[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1248px;
    height: 56px;
    top: 0;
    /*left: 192px;*/
    background-color: #ffffff;
}

.text-wrapper-2[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 17px;
    left: 1108px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.icons-logout[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 24px;
    height: 24px;
    top: 16px;
    left: 1200px;
}

.group[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 42px;
    height: 40px;
    top: 8px;
    left: 1060px;
}

.div-wrapper[b-bk4q7y5j8o] {
    width: 40px;
    background-color: var(--variable-collection-text-secondary);
    border-radius: 20px;
    position: relative;
    height: 40px;
}

.text-wrapper-3[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 9px;
    left: 11px;
    font-weight: 400;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.overlap-2[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 60.5rem;
    height: 33.1rem;
    top: 609px;
    /*   left: 17rem;*/
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
    bottom: 10rem;
}

.overlap-3[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1143px;
    height: 270px;
    top: 109px;
    left: 37px;
}

.group-2[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1002px;
    height: 238px;
    top: 30px;
    left: 86px;
}

.group-3[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1113px;
    height: 199px;
    top: 29px;
    left: 29px;
}

.rectangle-2[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1112px;
    height: 1px;
    top: 156px;
    left: 0;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-3[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1112px;
    height: 1px;
    top: 198px;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-4[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1112px;
    height: 1px;
    top: 78px;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-5[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1112px;
    height: 1px;
    top: 117px;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-6[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1112px;
    height: 1px;
    top: 38px;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-7[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1112px;
    height: 1px;
    top: 0;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.group-4[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1114px;
    height: 240px;
    top: 29px;
    left: 29px;
}

.rectangle-8[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1113px;
    height: 1px;
    top: 239px;
    left: 1px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-9[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 240px;
    height: 1px;
    top: 120px;
    left: -119px;
    background-color: var(--variable-collection-separation-contour);
    transform: rotate(90deg);
}

.tiers[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1016px;
    height: 102px;
    top: 162px;
    left: 97px;
    background-image: url(./images/group-1087891.png);
    background-size: 100% 100%;
}

.group-5[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 997px;
    height: 145px;
    top: 85px;
    left: 87px;
}

.tiers-2[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1031px;
    height: 124px;
    top: 134px;
    left: 72px;
}

.group-6[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 36px;
    height: 248px;
    top: 22px;
    left: 0;
}

.text-wrapper-4[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 234px;
    left: 14px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-5[b-bk4q7y5j8o] {
    top: 195px;
    left: 7px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-6[b-bk4q7y5j8o] {
    top: 156px;
    left: 0;
    /*position: absolute;*/

    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-7[b-bk4q7y5j8o] {
    top: 117px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-8[b-bk4q7y5j8o] {
    top: 78px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-9[b-bk4q7y5j8o] {
    top: 39px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-10[b-bk4q7y5j8o] {
    top: 0;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.overlap-wrapper[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 86px;
    height: 30px;
    top: 0;
    left: 1013px;
}

.overlap-4[b-bk4q7y5j8o] {
    position: relative;
    height: 29px;
    top: 1px;
}

.date-picker[b-bk4q7y5j8o] {
    display: flex;
    width: 86px;
    height: 24px;
    align-items: center;
    gap: 8px;
    padding: 8px;
    /*position: absolute;*/
    top: 5px;
    left: 0;
    background-color: #333333;
    border-radius: 4px;
    overflow: hidden;
}

.text-wrapper-11[b-bk4q7y5j8o] {
    position: relative;
    width: fit-content;
    margin-top: -4px;
    margin-bottom: -2px;
    font-weight: 400;
    color: #ffffff;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 14px;
    white-space: nowrap;
}

.end-date[b-bk4q7y5j8o] {
    margin-top: -5px;
    margin-bottom: -5px;
    margin-right: -2px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 2px 0px;
    position: relative;
    flex: 0 0 auto;
}

.end-date-2[b-bk4q7y5j8o] {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-weight: 400;
    color: #1c2023;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 14px;
    white-space: nowrap;
}

.polygon[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 8px;
    height: 6px;
    top: 0;
    left: 56px;
}

.group-7[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 157px;
    height: 176px;
    top: 2px;
    left: 823px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
    box-shadow: 0px 4px 4px #41414140;
}

.group-8[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 157px;
    height: 40px;
    top: 7px;
    left: 0;
}

.overlap-group-2[b-bk4q7y5j8o] {
    width: 155px;
    background-color: #ebf2f2;
    position: relative;
    height: 40px;
}

.icons-check[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 16px;
    height: 16px;
    top: 12px;
    left: 132px;
}

.text-wrapper-12[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 12px;
    left: 7px;
    font-weight: 400;
    color: #33767c;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
}

.group-9[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 157px;
    height: 40px;
    top: 47px;
    left: 0;
}

.text-wrapper-13[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 12px;
    left: 7px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
}

.group-10[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 157px;
    height: 40px;
    top: 87px;
    left: 0;
}

.group-11[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 157px;
    height: 40px;
    top: 127px;
    left: 0;
}

.element[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 388px;
    left: 90px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.button-primary[b-bk4q7y5j8o] {
    all: unset;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    /*position: absolute;*/
    top: 14px;
    left: 51rem;
    background-color: #33767c;
    border-radius: 4px;
    overflow: hidden;
}

.text-wrapper-14[b-bk4q7y5j8o] {
    position: relative;
    width: fit-content;
    font-weight: 400;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.icons-arrow-right[b-bk4q7y5j8o] {
    position: relative;
    /*width: 24px;*/
    height: 24px;
    left: 1.6rem;
}

.title[b-bk4q7y5j8o] {
    left: 27px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    /*position: absolute;*/
    top: 17px;
}

.rectangle-10[b-bk4q7y5j8o] {
    position: relative;
    width: 30px;
    height: 4px;
    background-color: #ed6f66;
}

.reports[b-bk4q7y5j8o] {
    position: relative;
    width: fit-content;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 24px;
    letter-spacing: 0;
    line-height: normal;
}

.legends[b-bk4q7y5j8o] {
    display: inline-flex;
    align-items: flex-start;
    gap: 32px;
    /*position: absolute;*/
    top: 435px;
    left: 506px;
}

.legend[b-bk4q7y5j8o] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    position: relative;
    flex: 0 0 auto;
}

.group-12[b-bk4q7y5j8o] {
    width: 48px;
    position: relative;
    height: 14px;
    margin-right: -2px;
}

.rectangle-11[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 9px;
    height: 9px;
    top: 2px;
    left: 0;
    background-color: #5b9ef5;
    border-radius: 1px;
}

.text-wrapper-15[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 0;
    left: 14px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.group-13[b-bk4q7y5j8o] {
    position: relative;
    width: 50px;
    height: 14px;
    margin-right: -2px;
}

.rectangle-12[b-bk4q7y5j8o] {
    background-color: #69e09d;
    /*position: absolute;*/
    width: 9px;
    height: 9px;
    top: 2px;
    left: 0;
    border-radius: 1px;
}

.filter[b-bk4q7y5j8o] {
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    /*position: absolute;*/
    top: 74px;
    left: 27px;
    background-color: #33767c1a;
    border-radius: 4px;
    overflow: hidden;
}

.all-projects[b-bk4q7y5j8o] {
    position: relative;
    width: fit-content;
    margin-top: -0.5px;
    font-weight: 400;
    color: #33767c;
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.all-projects-wrapper[b-bk4q7y5j8o] {
    left: 106px;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    /*position: absolute;*/
    top: 74px;
    border-radius: 4px;
    overflow: hidden;
}

.filter-2[b-bk4q7y5j8o] {
    left: 176px;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    /*position: absolute;*/
    top: 74px;
    border-radius: 4px;
    overflow: hidden;
}

.filter-3[b-bk4q7y5j8o] {
    left: 249px;
    display: inline-flex;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 8px;
    /*position: absolute;*/
    top: 74px;
    border-radius: 4px;
    overflow: hidden;
}

.overlap-5[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 32px;
    height: 32px;
    top: 75px;
    left: 47rem;
}

.group-wrapper[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 32px;
    height: 32px;
    top: 0;
    left: 0;
}

.group-14[b-bk4q7y5j8o] {
    height: 32px;
}

.group-15[b-bk4q7y5j8o] {
    width: 32px;
    height: 32px;
}

.group-16[b-bk4q7y5j8o] {
    width: 32px;
    height: 32px;
    background-color: #ebf2f2;
    border-radius: 4px;
}

.group-17[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 15px;
    height: 13px;
    top: 9px;
    left: 9px;
    background-image: url(./images/group-1087878-2.png);
    background-size: 100% 100%;
}

.group-18[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 18px;
    height: 18px;
    top: 81px;
    left: 1161px;
    background-image: url(./images/download.svg);
    background-size: 100% 100%;
}

.drop-down[b-bk4q7y5j8o] {
    display: flex;
    width: 157px;
    height: 32px;
    align-items: center;
    gap: 8px;
    padding: 8px 0px 8px 8px;
    /*position: absolute;*/
    top: 74px;
    left: 35.5rem;
    background-color: #ffffff;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.img-2[b-bk4q7y5j8o] {
    position: relative;
    width: 16px;
    height: 16px;
}

.newest-first[b-bk4q7y5j8o] {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
}

.rectangle-13[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1px;
    height: 32px;
    top: 74px;
    left: 1137px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-14[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1px;
    height: 32px;
    top: 74px;
    left: 1032px;
    background-color: var(--variable-collection-separation-contour);
}

.overlap-6[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 32px;
    height: 32px;
    top: 75px;
    left: 50rem;
    border-radius: 4px;
}

.group-19[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 32px;
    height: 32px;
    top: 0;
    left: 0;
    background-color: #33767c33;
    border-radius: 4px;
}

.group-20[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 13px;
    height: 12px;
    top: 11px;
    left: 10px;
    background-image: url(./images/image.png);
    background-size: 100% 100%;
}

.overlap-7[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 60.5rem;
    height: 33.1rem;
    top: 1107px;
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
    margin-top: 3.5rem;
}

.drop-down-2[b-bk4q7y5j8o] {
    display: flex;
    width: 157px;
    height: 32px;
    align-items: center;
    gap: 8px;
    padding: 8px 0px 8px 8px;
    /*position: absolute;*/
    top: 49px;
    left: 860px;
    background-color: #ffffff;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.group-21[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 13px;
    height: 12px;
    top: 60px;
    left: 1104px;
    background-image: url(./images/group-1087881.png);
    background-size: 100% 100%;
}

.group-22[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 18px;
    height: 18px;
    top: 56px;
    left: 1157px;
    background-image: url(./images/download.svg);
    background-size: 100% 100%;
}

.rectangle-15[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1px;
    height: 32px;
    top: 49px;
    left: 1133px;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-16[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1px;
    height: 32px;
    top: 49px;
    left: 1033px;
    background-color: var(--variable-collection-separation-contour);
}

.group-23[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 32px;
    height: 32px;
    top: 49px;
    left: 1050px;
}

.overlap-8[b-bk4q7y5j8o] {
    position: relative;
    height: 32px;
}

.group-24[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 15px;
    height: 13px;
    top: 9px;
    left: 9px;
}

.overlap-9[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1143px;
    height: 248px;
    top: 98px;
    left: 33px;
}

.group-25[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1002px;
    height: 238px;
    top: 8px;
    left: 86px;
}

.group-26[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1113px;
    height: 199px;
    top: 7px;
    left: 29px;
}

.group-27[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1114px;
    height: 240px;
    top: 7px;
    left: 29px;
}

.tiers-3[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 1011px;
    height: 182px;
    top: 59px;
    left: 81px;
}

.group-28[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 36px;
    height: 248px;
    top: 0;
    left: 0;
}

.title-2[b-bk4q7y5j8o] {
    left: 23px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    /*position: absolute;*/
    top: 17px;
}

.legend-wrapper[b-bk4q7y5j8o] {
    top: 402px;
    left: 550px;
    display: inline-flex;
    align-items: flex-start;
    gap: 32px;
    /*position: absolute;*/
}

.group-29[b-bk4q7y5j8o] {
    width: 100px;
    position: relative;
    height: 14px;
    margin-right: -2px;
}

.rectangle-17[b-bk4q7y5j8o] {
    background-color: #ed6f66;
    /*position: absolute;*/
    width: 9px;
    height: 9px;
    top: 2px;
    left: 0;
    border-radius: 1px;
}

.element-2[b-bk4q7y5j8o] {
    top: 354px;
    left: 86px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.button-primary-2[b-bk4q7y5j8o] {
    display: flex;
    width: 168px;
    gap: 39px;
    /*left: 80rem;*/
    align-items: flex-start;
    padding: 8px;
    /*position: absolute;*/
    top: 105px;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid;
    border-color: #33767c;
}

.text-wrapper-16[b-bk4q7y5j8o] {
    position: relative;
    width: fit-content;
    color: #33767c;
    font-size: 18px;
    white-space: nowrap;
    font-weight: 400;
    letter-spacing: 0;
    line-height: normal;
}

.button-primary-3[b-bk4q7y5j8o] {
    justify-content: right;
    display: inline-flex;
    gap: 20px;
    /*left: 51rem;*/
    align-items: flex-start;
    padding: 8px;
    /*position: absolute;*/
    top: 105px;
    /* border-radius: 4px;*/
    overflow: hidden;
    /* border: 1px solid;
    border-color: #33767c;*/
    /*width:20rem;*/
}

.growthnservivalcss[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 35.5rem;
    height: 415px;
    top: 170px;
    /*left: 42.5rem;*/
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.title-3[b-bk4q7y5j8o] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    /*position: absolute;*/
    top: 15px;
    left: 23px;
}

.overlap-11[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 631px;
    height: 279px;
    top: 66px;
    left: 46px;
}

.group-30[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 591px;
    height: 248px;
    top: 4px;
    left: 40px;
}

.group-31[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 55px;
    height: 278px;
    top: 0;
    left: 0;
}

.text-wrapper-17[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 264px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-18[b-bk4q7y5j8o] {
    top: 240px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-19[b-bk4q7y5j8o] {
    top: 216px;
    left: 5px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-20[b-bk4q7y5j8o] {
    top: 192px;
    left: 5px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-21[b-bk4q7y5j8o] {
    top: 168px;
    left: 5px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-22[b-bk4q7y5j8o] {
    top: 144px;
    left: 5px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-23[b-bk4q7y5j8o] {
    top: 120px;
    left: 5px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-24[b-bk4q7y5j8o] {
    top: 96px;
    left: 5px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-25[b-bk4q7y5j8o] {
    top: 72px;
    left: 5px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-26[b-bk4q7y5j8o] {
    top: 48px;
    left: 5px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-27[b-bk4q7y5j8o] {
    top: 24px;
    left: 5px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-28[b-bk4q7y5j8o] {
    top: 0;
    left: 5px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.group-32[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 592px;
    height: 275px;
    top: 4px;
    left: 39px;
}

.rectangle-18[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 592px;
    height: 1px;
    top: 274px;
    left: 0;
    background-color: var(--variable-collection-separation-contour);
}

.rectangle-19[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 275px;
    height: 1px;
    top: 137px;
    left: -137px;
    background-color: var(--variable-collection-separation-contour);
    transform: rotate(90deg);
}

.vector[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 398px;
    height: 182px;
    top: 90px;
    left: 83px;
}

.rectangle-20[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 45px;
    height: 18px;
    top: 210px;
    left: 67px;
    background-color: #5b9ef5;
}

.rectangle-21[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 45px;
    height: 12px;
    top: 216px;
    left: 128px;
    background-color: #5b9ef5;
}

.rectangle-22[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 45px;
    height: 8px;
    top: 220px;
    left: 200px;
    background-color: #5b9ef5;
}

.rectangle-23[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 45px;
    height: 12px;
    top: 216px;
    left: 267px;
    background-color: #5b9ef5;
}

.rectangle-24[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 45px;
    height: 210px;
    top: 18px;
    left: 339px;
    background-color: #5b9ef5;
}

.rectangle-25[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 45px;
    height: 166px;
    top: 62px;
    left: 402px;
    background-color: #5b9ef5;
}

.rectangle-26[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 45px;
    height: 36px;
    top: 228px;
    left: 481px;
    background-color: #5b9ef5;
}

.rectangle-27[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 45px;
    height: 8px;
    top: 220px;
    left: 552px;
    background-color: #5b9ef5;
}

.p[b-bk4q7y5j8o] {
    top: 353px;
    left: 128px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.group-33[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 61px;
    height: 278px;
    top: 69px;
    left: 695px;
}

.text-wrapper-29[b-bk4q7y5j8o] {
    top: 216px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-30[b-bk4q7y5j8o] {
    top: 192px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-31[b-bk4q7y5j8o] {
    top: 168px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-32[b-bk4q7y5j8o] {
    top: 144px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-33[b-bk4q7y5j8o] {
    top: 120px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-34[b-bk4q7y5j8o] {
    top: 96px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-35[b-bk4q7y5j8o] {
    top: 72px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-36[b-bk4q7y5j8o] {
    top: 48px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.text-wrapper-37[b-bk4q7y5j8o] {
    top: 24px;
    left: 0;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 12px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.legends-2[b-bk4q7y5j8o] {
    top: 383px;
    left: 244px;
    display: inline-flex;
    align-items: flex-start;
    gap: 32px;
    /*position: absolute;*/
}

.group-34[b-bk4q7y5j8o] {
    width: 114px;
    position: relative;
    height: 14px;
    margin-right: -2px;
}

.group-35[b-bk4q7y5j8o] {
    width: 115px;
    position: relative;
    height: 14px;
    margin-right: -2px;
}

.text-wrapper-38[b-bk4q7y5j8o] {
    top: 103px;
    font-weight: 600;
    color: var(--variable-collection-primary-text);
    font-size: 35px;
    letter-spacing: 0;
    line-height: normal;
    width: 20rem;
}

.overlap-12[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 384px;
    height: 415px;
    top: 170px;
    /*left: 17rem;*/
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.date-picker-2[b-bk4q7y5j8o] {
    display: flex;
    width: 336px;
    height: 104px;
    align-items: flex-start;
    gap: 8px;
    padding: 8px;
    /*position: absolute;*/
    top: 294px;
    left: 23px;
    background-color: #f0f4f8;
    border-radius: 4px;
    overflow: hidden;
}

.text-wrapper-39[b-bk4q7y5j8o] {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-weight: 400;
    color: var(--variable-collection-text-secondary);
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
}

.end-date-wrapper[b-bk4q7y5j8o] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 2px 0px;
    position: relative;
    flex: 0 0 auto;
}

.overlap-13[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 156px;
    height: 56px;
    top: 79px;
    left: 24px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.text-wrapper-40[b-bk4q7y5j8o] {
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.rectangle-wrapper[b-bk4q7y5j8o] {
    /*position: absolute;*///
    width: 132px;
    height: 6px;
    top: 36px;
    left: 11px;
    background-color: var(--variable-collection-separation-contour);
    border-radius: 8px;
}

.rectangle-28[b-bk4q7y5j8o] {
    width: 106px;
    height: 6px;
    background-color: #33757c;
    border-radius: 8px;
}

.overlap-14[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 156px;
    height: 56px;
    top: 79px;
    left: 204px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.text-wrapper-41[b-bk4q7y5j8o] {
    /*position: absolute;*/
    top: 11px;
    left: 11px;
    font-weight: 400;
    color: var(--variable-collection-primary-text);
    font-size: 16px;
    letter-spacing: 0;
    line-height: normal;
    white-space: nowrap;
}

.group-36[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 132px;
    height: 6px;
    top: 35px;
    left: 11px;
    background-color: var(--variable-collection-separation-contour);
    border-radius: 8px;
}

.rectangle-29[b-bk4q7y5j8o] {
    width: 48px;
    height: 6px;
    background-color: #fbdbaa;
    border-radius: 8px;
}




.span[b-bk4q7y5j8o] {
    color: #0a125d;
}

.text-wrapper-42[b-bk4q7y5j8o] {
    font-weight: 600;
    color: #33757c;
}

.text-wrapper-43[b-bk4q7y5j8o] {
    font-weight: 600;
    color: #0a125d;
}



.text-wrapper-44[b-bk4q7y5j8o] {
    font-weight: 700;
    color: #ed6f66;
}

.chartviewimg[b-bk4q7y5j8o] {
    width: 100%;
    height: 100%;
    flex-shrink: 0;
}

.exportimg[b-bk4q7y5j8o] {
    padding: 0.6rem;
}

.divexportcsv[b-bk4q7y5j8o] {
    flex-shrink: 0;
    border-radius: 8px;
    /* border: 1px solid var(--separation-contour, #E0E0E0);*/
    background: #FFF;
    /*position: absolute;*/
    width: 3rem;
    height: 2rem;
    top: 4.7rem;
    left: 53rem;
    background-size: 100% 100%;
}

.divtableviewalert[b-bk4q7y5j8o] {
    flex-shrink: 0;
    border-radius: 8px;
    /* border: 1px solid var(--separation-contour, #E0E0E0);*/
    background: #FFF;
    /*position: absolute;*/
    width: 3rem;
    height: 2rem;
    top: 0rem;
    left: 2.7rem;
    background-size: 100% 100%;
}

.divexportcsvalert[b-bk4q7y5j8o] {
    flex-shrink: 0;
    border-radius: 8px;
    /* border: 1px solid var(--separation-contour, #E0E0E0);*/
    background: #FFF;
    /*position: absolute;*/
    width: 3rem;
    height: 2rem;
    top: 0.1rem;
    left: 2.7rem;
    background-size: 100% 100%;
}

.dvsperatorbio[b-bk4q7y5j8o] {
    top: 0px;
}

.col-md-2[b-bk4q7y5j8o] {
    width: 25rem !important;
}

.col-button[b-bk4q7y5j8o] {
    width: 10rem;
}

.dvpreviousbtn[b-bk4q7y5j8o] {
    margin-right: 23rem;
}

.dvnextbtn[b-bk4q7y5j8o] {
    margin-left: 12.5rem;
}

.textcomment[b-bk4q7y5j8o] {
    width: 20rem;
    height: 5.7rem;
    background-color: #f0f4f8;
}

.overlap-15[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 336px;
    height: 56px;
    top: 151px;
    left: 24px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.overlap-16[b-bk4q7y5j8o] {
    /*position: absolute;*/
    width: 336px;
    height: 56px;
    top: 223px;
    left: 24px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid;
    border-color: var(--variable-collection-separation-contour);
}

.metrics-card[b-bk4q7y5j8o] {
    border: 1px solid #E6E6E6;
    border-radius: 5px;
    padding: 20px;
}

.metric-box[b-bk4q7y5j8o] {
    padding: 6px;
    border-radius: 5px;
    margin-bottom: 10px;
    height: 3rem;
    padding-left: 18px;
    padding-right: 18px;
    border-style: solid;
    border-width: thin;
    border-color: lightgray;
    background-color: #ffffff;
}
.text-control[b-bk4q7y5j8o] {
    height: 6rem;
    background: #f9f9f9;
}

    .metric-box p[b-bk4q7y5j8o] {
        margin: 0;
    }

.growth-chart[b-bk4q7y5j8o] {
    border: 1px solid #E6E6E6;
    border-radius: 5px;
    padding: 20px;
}
/* /Components/Pages/MyProject/Project.razor.rz.scp.css */
.tenaka-science[b-qw8naivli3] {
    position: relative;
    width: 100%;
   
    background-color: #f6f8fa;
}

    .tenaka-science .footer[b-qw8naivli3] {
        position: absolute;
        position: absolute;
        width: 1440px;
        height: 40px;
        top: 1816px;
        left: 0;
        background-color: var(--variable-collection-primary-text);
    }

    .tenaka-science .text-wrapper[b-qw8naivli3] {
        position: absolute;
        top: 10px;
        left: 612px;
       
        font-weight: 600;
        color: #ffffff;
        font-size: 14px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .overlap[b-qw8naivli3] {
        position: absolute;
        width: 1440px;
        height: 1712px;
        top: 0;
        left: 0;
    }

    .tenaka-science .header[b-qw8naivli3] {
        position: absolute;
        width: 1248px;
        height: 56px;
        top: 0;
        left: 192px;
        background-color: #ffffff;
    }

    .tenaka-science .div[b-qw8naivli3] {
        position: absolute;
        top: 17px;
        left: 1108px;
      
        font-weight: 400;
        color: var(--variable-collection-primary-text);
        font-size: 18px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .icons-logout[b-qw8naivli3] {
        top: 16px;
        left: 1200px;
        position: absolute;
        width: 24px;
        height: 24px;
    }

    .tenaka-science .group[b-qw8naivli3] {
        position: absolute;
        width: 42px;
        height: 40px;
        top: 8px;
        left: 1060px;
    }

    .tenaka-science .overlap-group[b-qw8naivli3] {
        position: relative;
        width: 40px;
        height: 40px;
        background-color: var(--variable-collection-text-secondary);
        border-radius: 20px;
    }

    .tenaka-science .text-wrapper-2[b-qw8naivli3] {
        position: absolute;
        top: 9px;
        left: 11px;
       
        font-weight: 400;
        color: #ffffff;
        font-size: 18px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .overlap-2[b-qw8naivli3] {
        position: absolute;
        width: 1416px;
        height: 1712px;
        top: 0;
        left: 0;
    }

    .tenaka-science .menu[b-qw8naivli3] {
        position: absolute;
        width: 192px;
        height: 1024px;
        top: 0;
        left: 0;
        background-color: #ffffff;
        border-right-width: 1px;
        border-right-style: solid;
        border-color: var(--variable-collection-separation-contour);
    }

    .tenaka-science .menu-2[b-qw8naivli3] {
        top: 128px;
        position: absolute;
        width: 192px;
        height: 56px;
        left: -1px;
    }

    .tenaka-science .text-wrapper-3[b-qw8naivli3] {
        position: absolute;
        top: 17px;
        left: 52px;
       
        font-weight: 400;
        color: var(--variable-collection-primary-text);
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .img[b-qw8naivli3] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 16px;
        left: 20px;
    }

    .tenaka-science .overlap-group-wrapper[b-qw8naivli3] {
        top: 192px;
        position: absolute;
        width: 192px;
        height: 56px;
        left: -1px;
    }

    .tenaka-science .overlap-group-2[b-qw8naivli3] {
        position: relative;
        width: 176px;
        height: 48px;
        top: 4px;
        left: 8px;
        background-color: var(--variable-collection-main-color);
        border-radius: 4px;
    }

    .tenaka-science .dashboard[b-qw8naivli3] {
        position: absolute;
        top: 13px;
        left: 44px;
      
        font-weight: 400;
        color: #ffffff;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .icons-project[b-qw8naivli3] {
        top: 12px;
        left: 12px;
        position: absolute;
        width: 24px;
        height: 24px;
    }

    .tenaka-science .menu-3[b-qw8naivli3] {
        top: 256px;
        position: absolute;
        width: 192px;
        height: 56px;
        left: -1px;
    }

    .tenaka-science .menu-4[b-qw8naivli3] {
        top: 320px;
        position: absolute;
        width: 192px;
        height: 56px;
        left: -1px;
    }

    .tenaka-science .image[b-qw8naivli3] {
        position: absolute;
        width: 116px;
        height: 31px;
        top: 46px;
        left: 37px;
        object-fit: cover;
    }

    .tenaka-science .menu-5[b-qw8naivli3] {
        top: 409px;
        position: absolute;
        width: 192px;
        height: 56px;
        left: -1px;
    }

    .tenaka-science .rectangle[b-qw8naivli3] {
        position: absolute;
        width: 192px;
        height: 1px;
        top: 392px;
        left: -1px;
        background-color: var(--variable-collection-separation-contour);
    }

    .tenaka-science .menu-6[b-qw8naivli3] {
        top: 473px;
        position: absolute;
        width: 192px;
        height: 56px;
        left: -1px;
    }

    .tenaka-science .overlap-3[b-qw8naivli3] {
        position: absolute;
        width: 1401px;
        height: 1458px;
        top: 254px;
        left: 15px;
    }

    .tenaka-science .rectangle-2[b-qw8naivli3] {
        position: absolute;
        width: 1200px;
        height: 1458px;
        top: 0;
        left: 201px;
        background-color: #ffffff;
        border-radius: 8px;
        border: 1px solid;
        border-color: var(--variable-collection-separation-contour);
    }

    .tenaka-science .title[b-qw8naivli3] {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1px;
        position: absolute;
        top: 40px;
        left: 225px;
    }

    .tenaka-science .rectangle-3[b-qw8naivli3] {
        position: relative;
        width: 30px;
        height: 4px;
        background-color: #ed6f66;
    }

    .tenaka-science .reports[b-qw8naivli3] {
        position: relative;
        width: fit-content;
       
        font-weight: 600;
        color: var(--variable-collection-primary-text);
        font-size: 24px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .text-wrapper-4[b-qw8naivli3] {
        position: absolute;
        top: 93px;
        left: 225px;
      
        font-weight: 600;
        color: var(--variable-collection-primary-text);
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .group-wrapper[b-qw8naivli3] {
        position: absolute;
        width: 368px;
        height: 320px;
        top: 126px;
        left: 225px;
        background-color: var(--variable-collection-BG);
        border-radius: 4px;
        border: 1px dashed;
        border-color: var(--variable-collection-main-color);
    }

    .tenaka-science .group-2[b-qw8naivli3] {
        position: relative;
        width: 238px;
        height: 108px;
        top: 105px;
        left: 66px;
    }

    .tenaka-science .drop-your-image-here[b-qw8naivli3] {
        position: absolute;
        top: 67px;
        left: 0;
       
        font-weight: 600;
        color: transparent;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .span[b-qw8naivli3] {
        color: #676e80;
    }

    .tenaka-science .text-wrapper-5[b-qw8naivli3] {
        color: #33767c;
    }

    .tenaka-science .text-wrapper-6[b-qw8naivli3] {
        position: absolute;
        top: 91px;
        left: 53px;
      
        font-weight: 400;
        color: #b3b3b3;
        font-size: 14px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .group-3[b-qw8naivli3] {
        position: absolute;
        width: 31px;
        height: 28px;
        top: 0;
        left: 102px;
    }

    .tenaka-science .rectangle-4[b-qw8naivli3] {
        position: absolute;
        width: 1199px;
        height: 1px;
        top: 466px;
        left: 202px;
        background-color: var(--variable-collection-separation-contour);
    }

    .tenaka-science .text-wrapper-7[b-qw8naivli3] {
        position: absolute;
        top: 486px;
        left: 225px;
       
        font-weight: 600;
        color: var(--variable-collection-primary-text);
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .field-filled[b-qw8naivli3] {
        width: 1152px;
        top: 519px;
        position: absolute;
        height: 61px;
        left: 225px;
    }

    .tenaka-science .p[b-qw8naivli3] {
        position: absolute;
        width: 368px;
        top: -1px;
        left: 0;
      
        font-weight: 400;
        color: var(--variable-collection-text-color);
        font-size: 14px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .text-wrapper-8[b-qw8naivli3] {
        color: #0a125d;
    }

    .tenaka-science .text-wrapper-9[b-qw8naivli3] {
        color: #ed6f66;
    }

    .tenaka-science .mangroves-orange-wrapper[b-qw8naivli3] {
        position: absolute;
        width: 1152px;
        height: 40px;
        top: 21px;
        left: 0;
        background-color: #ffffff;
        border-radius: 4px;
        border: 1px solid;
        border-color: var(--variable-collection-seperation-stroke);
    }

    .tenaka-science .mangroves-orange[b-qw8naivli3] {
        position: absolute;
        height: 19px;
        top: 9px;
        left: 7px;
       
        font-weight: 400;
        color: var(--variable-collection-primary-text);
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .field-filled-2[b-qw8naivli3] {
        top: 596px;
        left: 225px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .overlap-4[b-qw8naivli3] {
        position: absolute;
        width: 368px;
        height: 40px;
        top: 21px;
        left: 0;
        background-color: #ffffff;
        border-radius: 4px;
        border: 1px solid;
        border-color: var(--variable-collection-seperation-stroke);
    }

    .tenaka-science .icons-arrow-down[b-qw8naivli3] {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 7px;
        left: 335px;
    }

    .tenaka-science .field-filled-3[b-qw8naivli3] {
        top: 596px;
        left: 617px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .field-filled-4[b-qw8naivli3] {
        top: 596px;
        left: 1009px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .text-wrapper-10[b-qw8naivli3] {
        color: #505666;
        font-family: var(--field-title-font-family);
        font-style: var(--field-title-font-style);
        font-weight: var(--field-title-font-weight);
        letter-spacing: var(--field-title-letter-spacing);
        line-height: var(--field-title-line-height);
        font-size: var(--field-title-font-size);
    }

    .tenaka-science .group-4[b-qw8naivli3] {
        position: absolute;
        width: 139px;
        height: 24px;
        top: 7px;
        left: 7px;
    }

    .tenaka-science .overlap-group-3[b-qw8naivli3] {
        position: absolute;
        width: 40px;
        height: 24px;
        top: 0;
        left: 0;
        background-color: var(--variable-collection-primary-text);
        border-radius: 20px;
    }

    .tenaka-science .icons-close[b-qw8naivli3] {
        position: absolute;
        width: 12px;
        height: 12px;
        top: 6px;
        left: 23px;
    }

    .tenaka-science .text-wrapper-11[b-qw8naivli3] {
        position: absolute;
        height: 19px;
        top: 3px;
        left: 8px;
       
        font-weight: 400;
        color: #ffffff;
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .text-wrapper-12[b-qw8naivli3] {
        position: absolute;
        height: 19px;
        top: 3px;
        left: 48px;
        
        font-weight: 400;
        color: var(--variable-collection-text-secondary);
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .field-filled-5[b-qw8naivli3] {
        top: 827px;
        left: 1009px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .div-2[b-qw8naivli3] {
        position: absolute;
        width: 368px;
        top: -1px;
        left: 0;
       
        font-weight: 400;
        color: var(--variable-collection-text-secondary);
        font-size: 14px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .field-default[b-qw8naivli3] {
        width: 368px;
        top: 673px;
        position: absolute;
        height: 61px;
        left: 225px;
    }

    .tenaka-science .mangroves-orange-2[b-qw8naivli3] {
        position: absolute;
        height: 19px;
        top: 9px;
        left: 7px;
        
        font-weight: 400;
        color: var(--variable-collection-text-secondary);
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .field-default-2[b-qw8naivli3] {
        top: 673px;
        left: 617px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .field-default-3[b-qw8naivli3] {
        top: 673px;
        left: 1009px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .field-default-4[b-qw8naivli3] {
        top: 750px;
        left: 225px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .field-default-5[b-qw8naivli3] {
        top: 750px;
        left: 617px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .field-default-6[b-qw8naivli3] {
        top: 750px;
        left: 1009px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .field-default-7[b-qw8naivli3] {
        top: 827px;
        left: 225px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .field-filled-6[b-qw8naivli3] {
        top: 827px;
        left: 617px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .rectangle-5[b-qw8naivli3] {
        position: absolute;
        width: 1199px;
        height: 1px;
        top: 904px;
        left: 202px;
        background-color: var(--variable-collection-separation-contour);
    }

    .tenaka-science .text-wrapper-13[b-qw8naivli3] {
        position: absolute;
        top: 924px;
        left: 225px;
        
        font-weight: 600;
        color: var(--variable-collection-primary-text);
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .field-filled-7[b-qw8naivli3] {
        top: 957px;
        left: 225px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .field-filled-8[b-qw8naivli3] {
        top: 957px;
        left: 617px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .field-filled-9[b-qw8naivli3] {
        top: 957px;
        left: 1009px;
        position: absolute;
        width: 368px;
        height: 61px;
    }

    .tenaka-science .rectangle-6[b-qw8naivli3] {
        position: absolute;
        width: 1199px;
        height: 1px;
        top: 1038px;
        left: 202px;
        background-color: var(--variable-collection-separation-contour);
    }

    .tenaka-science .before-after-visual[b-qw8naivli3] {
        position: absolute;
        top: 1058px;
        left: 225px;
        
        font-weight: 600;
        color: var(--variable-collection-primary-text);
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .text-wrapper-14[b-qw8naivli3] {
        position: absolute;
        top: 1402px;
        left: 0;
       
        font-weight: 400;
        color: var(--variable-collection-text-secondary);
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .text-wrapper-15[b-qw8naivli3] {
        position: absolute;
        top: 1082px;
        left: 617px;

        font-weight: 400;
        color: var(--variable-collection-text-secondary);
        font-size: 16px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .div-wrapper[b-qw8naivli3] {
        position: absolute;
        width: 368px;
        height: 320px;
        top: 1114px;
        left: 225px;
        background-color: var(--variable-collection-BG);
        border-radius: 4px;
        border: 1px dashed;
        border-color: var(--variable-collection-main-color);
    }

    .tenaka-science .text-wrapper-16[b-qw8naivli3] {
        position: absolute;
        top: 91px;
        left: 32px;
      
        font-weight: 400;
        color: #b3b3b3;
        font-size: 14px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .group-5[b-qw8naivli3] {
        position: absolute;
        width: 368px;
        height: 320px;
        top: 1114px;
        left: 617px;
        background-color: var(--variable-collection-BG);
        border-radius: 4px;
        border: 1px dashed;
        border-color: var(--variable-collection-main-color);
    }

    .tenaka-science .text-wrapper-17[b-qw8naivli3] {
        position: absolute;
        top: 79px;
        left: 216px;
       
        font-weight: 400;
        color: var(--variable-collection-text-secondary);
        font-size: 18px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .text-wrapper-18[b-qw8naivli3] {
        position: absolute;
        top: 103px;
        left: 216px;
      /*  font-family: "Qanelas-SemiBold", Helvetica;
        font-weight: 600;*/
        color: var(--variable-collection-primary-text);
        font-size: 35px;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .overlap-wrapper[b-qw8naivli3] {
        position: absolute;
        width: 684px;
        height: 59px;
        top: 134px;
        left: 474px;
    }

    .tenaka-science .overlap-5[b-qw8naivli3] {
        position: relative;
        height: 59px;
        margin: -50px;
        margin-left: -298px;
    }

    .tenaka-science .rectangle-7[b-qw8naivli3] {
        position: absolute;
        width: 200px;
        height: 1px;
        top: 0px;
        left: 131px;
        background-color: var(--variable-collection-separation-contour);
    }

    .tenaka-science .rectangle-8[b-qw8naivli3] {
        position: absolute;
        width: 200px;
        height: 1px;
        top: 0px;
        left: 354px;
        background-color: var(--variable-collection-separation-contour);
    }

    .tenaka-science .group-6[b-qw8naivli3] {
        position: absolute;
        width: 684px;
        height: 59px;
        top: 0;
        left: 0;
    }

    .tenaka-science .step[b-qw8naivli3] {
        position: absolute;
        width: 230px;
        height: 59px;
        top: 0;
        left: 0;
    }

    .tenaka-science .stepper-active[b-qw8naivli3] {
        background-color: var(--variable-collection-main-color);
        display: flex;
        flex-direction: column;
        width: 32px;
        height: 32px;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding: 5px 13px;
        position: absolute;
        top: 0;
        left: 99px;
        border-radius: 16px;
        background-color: #327173;
    }

    .tenaka-science .element[b-qw8naivli3] {
        position: relative;
        width: fit-content;
        
        font-weight: 600;
        color: #ffffff;
        font-size: 14px;
        text-align: center;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .v-rifier-les-d-tails[b-qw8naivli3] {
        position: absolute;
        height: 19px;
        top: 39px;
        left: 57px;
      
        font-weight: 400;
        color: var(--variable-collection-primary-text);
        font-size: 16px;
        text-align: center;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .overlap-group-4[b-qw8naivli3] {
        position: absolute;
        width: 453px;
        height: 59px;
        top: 0;
        left: 231px;
    }

    .tenaka-science .stepper-default[b-qw8naivli3] {
        background-color: #f0f4f8;
        border: 1px solid;
        border-color: var(--variable-collection-separation-contour);
        display: flex;
        flex-direction: column;
        width: 32px;
        height: 32px;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding: 5px 13px;
        position: absolute;
        top: 0;
        left: 99px;
        border-radius: 16px;
    }

    .tenaka-science .text-wrapper-19[b-qw8naivli3] {
        position: relative;
        width: fit-content;
        margin-left: -1.00px;
        margin-right: -1.00px;
      
        font-weight: 600;
        color: var(--variable-collection-text-secondary);
        font-size: 14px;
        text-align: center;
        letter-spacing: 0;
        line-height: normal;
    }

    .tenaka-science .v-rifier-les-d-tails-2[b-qw8naivli3] {
        left: 48px;
        position: absolute;
        height: 19px;
        top: 39px;
       
        font-weight: 400;
        color: var(--variable-collection-text-secondary);
        font-size: 16px;
        text-align: center;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .step-2[b-qw8naivli3] {
        position: absolute;
        width: 230px;
        height: 59px;
        top: 0;
        left: 223px;
    }

    .tenaka-science .v-rifier-les-d-tails-3[b-qw8naivli3] {
        left: 69px;
        position: absolute;
        height: 19px;
        top: 39px;
       
        font-weight: 400;
        color: var(--variable-collection-text-secondary);
        font-size: 16px;
        text-align: center;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .button-primary[b-qw8naivli3] {
        all: unset;
        box-sizing: border-box;
        display: flex;
        width: 110px;
        height: 40px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 8px 16px;
        position: absolute;
        top: 1736px;
        left: 1174px;
        background-color: #ffffff;
        border-radius: 4px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--variable-collection-main-color);
    }

    .tenaka-science .text-wrapper-20[b-qw8naivli3] {
        position: relative;
        width: fit-content;
       
        font-weight: 400;
        color: var(--variable-collection-main-color);
        font-size: 18px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .button[b-qw8naivli3] {
        all: unset;
        box-sizing: border-box;
        display: flex;
        width: 108px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 8px 8px 8px 16px;
        position: absolute;
        top: 1736px;
        left: 1308px;
        background-color: #33767c;
        border-radius: 4px;
        overflow: hidden;
    }

    .tenaka-science .text-wrapper-21[b-qw8naivli3] {
        position: relative;
        width: fit-content;
       
        font-weight: 400;
        color: #ffffff;
        font-size: 18px;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .tenaka-science .icons-arrow-right[b-qw8naivli3] {
        position: relative;
        width: 24px;
        height: 24px;
    }
/* Original CSS code here */

/* Additional CSS for accessibility and semantic improvements */
.menu a[b-qw8naivli3] {
    text-decoration: none;
    color: inherit;
}

    .menu a:hover[b-qw8naivli3],
    .menu a:focus[b-qw8naivli3] {
        background-color: var(--variable-collection-BG);
    }

.overlap-3[b-qw8naivli3] {
    overflow-y: auto;
    max-height: calc(100vh - 56px);
}

input[type="text"][b-qw8naivli3],
input[type="number"][b-qw8naivli3],
select[b-qw8naivli3] {
    width: 100%;
    padding: 8px;
    border: 1px solid var(--variable-collection-seperation-stroke);
    border-radius: 4px;
    font-size: 16px;
}

    input[type="text"]:focus[b-qw8naivli3],
    input[type="number"]:focus[b-qw8naivli3],
    select:focus[b-qw8naivli3] {
        outline: 2px solid var(--variable-collection-main-color);
    }

.button:hover[b-qw8naivli3],
.button-primary:hover[b-qw8naivli3] {
    opacity: 0.9;
}

.button:focus[b-qw8naivli3],
.button-primary:focus[b-qw8naivli3] {
    outline: 2px solid var(--variable-collection-main-color);
}

.visually-hidden[b-qw8naivli3] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/*@media (max-width: 768px) {
    .tenaka-science {
        width: 100%;
    }

    .overlap-3 {
        padding: 20px;
    }

    .field-filled,
    .field-default {
        width: 100%;
    }
}*/

.divcardfirst[b-qw8naivli3] {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
    padding: 20px;
    height: 33rem;
    border: 1px solid #dfe3e8;
}


.divcard[b-qw8naivli3] {
    border-radius: 0px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
    padding: 20px;
    height: 33rem;
    border: 1px solid #dfe3e8;
}
.required[b-qw8naivli3] {
    
    color:red;
}
.selectbox[b-qw8naivli3] {
    width: 310px !important;
    border: 1px solid #dfe3e8;
    
}
.form-label[b-qw8naivli3] {
    font-weight:normal !important;
}
.divcardlast[b-qw8naivli3] {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
    padding: 20px;
    height: 33rem;
    border: 1px solid #dfe3e8;
}
.orgsubmit[b-qw8naivli3] {
    display: flex;
    gap: 10px;
    margin-right: 176px;
    justify-content: end;
}

.stepper-checked[b-qw8naivli3] {
    display: flex;
    flex-direction: column;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-left: 99px;
    margin-right: -4.00px;
    position: relative;
    background-color: var(--variable-collection-main-color);
    border-radius: 16px;
}

    .stepper-checked .vector[b-qw8naivli3] {
        position: relative;
        width: 14px;
        height: 10px;
        margin-left: -4.00px;
        margin-right: -4.00px;
    }

.form-label-text[b-qw8naivli3] {
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 12px;
}

.form-check-label[b-qw8naivli3] {
    line-height: 1;
    padding-top: 2px; /* small adjustment */
}

.orgtext[b-qw8naivli3] {
    /* Remove height, negative margin, and unnecessary properties */
    display: inline-block; /* ensures label aligns properly */
    vertical-align: top; /* aligns label to the top */
}
/*.orgtext {
    height: 48px;
    margin-top: -25px;
    margin-left: 27px;
    text-align: left;
}*/

.form-check-input:checked[b-qw8naivli3] {
    background-color: #327173 !important;
    border-color: #327173 !important;

}
.fish-card[b-qw8naivli3] {
    border: 1px solid #dfe3e8;
    border-radius: 5px;
    padding: 10px;
    text-align: center;
    transition: border-color 0.3s;
    overflow: hidden;
}

    .fish-card img[b-qw8naivli3] {
        /*width: 200px;
        height: auto;*/
        border-radius: 5px;
        width: 100%;
        height: auto;
        display: block;
    }

    .fish-card:hover[b-qw8naivli3] {
        border-color: #0d6efd;
    }

.stepper-checked-second[b-qw8naivli3]{
    display: flex;
    flex-direction: column;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-left: 99px;
    margin-right: -4.00px;
    position: relative;
    background-color: var(--variable-collection-main-color);
    border-radius: 16px;
}

.dropdown-toggle[b-qw8naivli3]::after {
    
    border-top: 0em solid !important;
}

/* Limit dropdown height and enable scroll */
.dropdown-menu[b-qw8naivli3] {
    max-height: 250px; /* adjust height as needed */
    overflow-y: auto; /* vertical scrollbar if items exceed max-height */
    overflow-x: hidden; /* prevent horizontal scrollbar */
}

/* Handle long text inside dropdown */
.dropdown-item[b-qw8naivli3] {
    display: block;
    width: 100%;
    white-space: nowrap; /* keep text in one line */
    overflow: hidden; /* hide overflow */
    text-overflow: ellipsis; /* add "..." for long text */
}

    /* Optional: show full text on hover */
    .dropdown-item:hover[b-qw8naivli3] {
        overflow: visible;
        white-space: normal; /* allow wrapping when hovered */
    }

.selectbox[b-qw8naivli3] {
    display: inline-block;
    max-width: 300px; /* same as your dropdown width */
    overflow: hidden; /* hide overflowing text */
    white-space: nowrap; /* keep text on one line */
    text-overflow: ellipsis; /* add "..." */
    vertical-align: middle;
}

.info-alert[b-qw8naivli3] {
    background-color: #e7f3fe; /* Light blue background */
    border: 1px solid #b3d7ff; /* Border with blue tint */
    color: #00376b; /* Text color */
    padding: 10px 15px; /* Inner padding */
    border-radius: 5px; /* Rounded corners */
    font-family: Arial, sans-serif; /* Font style */
    display: flex;
    align-items: center; /* Vertically align content */
    gap: 10px; /* Space between icon and text */
}

    .info-alert[b-qw8naivli3]::before {
        content: "ℹ️"; /* Information icon */
        font-size: 18px; /* Icon size */
        color: #00376b; /* Icon color */
    }