﻿
.desktop {
    background-color: #0a0a0a;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding-bottom:50px;
}

    .desktop .div {
        background-color: var(--backgrounddark);
        width: 1440px;
        /*height: 1694px;*/
        position: relative;
    }

    .desktop .frame {
        display: flex;
        flex-direction: column;
        width: 535px;
        align-items: flex-start;
        justify-content: center;
        gap: 4px;
        padding: 8px 48px;
        position: relative;
        /*top: 410px;*/
        left: 92px;
        border-radius: 20px;
    }

    .desktop .div-2 {
        flex: 0 0 auto;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        position: relative;
        align-self: stretch;
        width: 100%;
    }

    .desktop .textfeild-label {
        display: flex;
        align-items: center;
        padding: 0px 21px 0px 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .desktop .text-wrapper {
        position: relative;
        flex: 1;
        margin-top: -1.00px;
        font-family: var(--caption-font-family);
        font-weight: var(--caption-font-weight);
        color: var(--textfeildtextfeildlabel);
        font-size: var(--caption-font-size);
        letter-spacing: var(--caption-letter-spacing);
        line-height: var(--caption-line-height);
        font-style: var(--caption-font-style);
    }

    .desktop .text-field {
        display: flex;
        height: 48px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 16px;
        position: relative;
        align-self: stretch;
        width: 100%;
        background-color: var(--textfeildtextfeildenabledtextfieldbgenabled);
        border-radius: 12px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--textfeildtextfeildenabledtextfieldstrokenabled);
        color:#FFF;
    }

    .desktop .text-field-combobox {
        display: flex;
        height: 48px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 0px 5px;
        position: relative;
        align-self: stretch;
        width: 100%;
        background-color: var(--textfeildtextfeildenabledtextfieldbgenabled);
        border-radius: 12px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--textfeildtextfeildenabledtextfieldstrokenabled);
        color: #FFF;
    }

    .desktop .frame-wrapper {
        display: flex;
        align-items: center;
        padding: 0px 21px 0px 0px;
        position: relative;
        flex: 1;
        align-self: stretch;
        flex-grow: 1;
    }

    .desktop .div-wrapper {
        display: flex;
        width: 222px;
        align-items: center;
        justify-content: flex-end;
        position: relative;
    }

    .desktop .text-wrapper-2 {
        height: 16px;
        margin-top: -1.00px;
        font-family: var(--body-font-family);
        font-weight: var(--body-font-weight);
        color: var(--textfeildtextfeildtext);
        font-size: var(--body-font-size);
        letter-spacing: var(--body-letter-spacing);
        line-height: var(--body-line-height);
        white-space: nowrap;
        position: relative;
        flex: 1;
        font-style: var(--body-font-style);
    }

    .desktop .frame-2 {
        display: flex;
        align-items: center;
        gap: 8px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;

    }

    .desktop .text-field-2 {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .desktop .frame-3 {
        margin-right: -134.00px;
        display: flex;
        width: 222px;
        align-items: center;
        justify-content: flex-end;
        position: relative;
    }

    .desktop .frame-4 {
        margin-right: -59.50px;
        display: flex;
        width: 222px;
        align-items: center;
        justify-content: flex-end;
        position: relative;
    }

    .desktop .frame-5 {
        display: flex;
        flex-direction: column;
        width: 535px;
        align-items: flex-start;
        justify-content: center;
        gap: 4px;
        padding: 8px 48px 40px 48px;
        position: relative;
        /*top: 1000px;*/
        left: 88px;
        border-radius: 20px;
    }

    .desktop .frame-6 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .desktop .frame-7 {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        /*gap: 18px;*/
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .desktop .frame-8 {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 0px 8px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .desktop .p {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: var(--caption-font-family);
        font-weight: var(--caption-font-weight);
        color: var(--textfeildtextfeildlabel);
        font-size: var(--caption-font-size);
        letter-spacing: var(--caption-letter-spacing);
        line-height: var(--caption-line-height);
        white-space: nowrap;
        font-style: var(--caption-font-style);
    }

    .desktop .frame-9 {
        display: flex;
        align-items: flex-end;
        justify-content: center;
        gap: 4px;
        position: relative;
        flex: 1;
        flex-grow: 1;
    }

    .desktop .check-box {
        position: relative;
        width: 20px;
        height: 20px;
    }

    .desktop .text-wrapper-3 {
        position: relative;
        flex: 1;
        font-family: var(--caption-font-family);
        font-weight: var(--caption-font-weight);
        color: var(--textfeildtextfeildlabel);
        font-size: var(--caption-font-size);
        letter-spacing: var(--caption-letter-spacing);
        line-height: var(--caption-line-height);
        font-style: var(--caption-font-style);
    }

    .desktop .text-field-3 {
        height: 135px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        position: relative;
        align-self: stretch;
        width: 100%;
    }

    .desktop .textfeild-label-wrapper {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 16px;
        align-self: stretch;
        width: 100%;
        flex-grow: 1;
        background-color: var(--textfeildtextfeildenabledtextfieldbgenabled);
        border-radius: 12px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--textfeildtextfeildenabledtextfieldstrokenabled);
        position: relative;
        flex: 1;
    }

    .desktop .frame-10 {
        display: flex;
        flex-direction: column;
        width: 302px;
        align-items: flex-start;
        gap: 4px;
        position: relative;
        flex: 0 0 auto;
    }

    .desktop .frame-11 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .desktop .image {
        position: relative;
        width: 114px;
        height: 39.9px;
        object-fit: cover;
    }

    .desktop .refresh {
        position: relative;
        width: 48px;
        height: 48px;
    }

    .desktop .text-field-4 {
        display: flex;
        height: 48px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 16px;
        flex-grow: 1;
        background-color: var(--textfeildtextfeildenabledtextfieldbgenabled);
        border-radius: 12px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--textfeildtextfeildenabledtextfieldstrokenabled);
        position: relative;
        flex: 1;
    }

    .desktop .frame-12 {
        margin-right: -143.00px;
        display: flex;
        width: 222px;
        align-items: center;
        justify-content: flex-end;
        position: relative;
    }

    .desktop .frame-13 {
        display: flex;
        flex-direction: column;
        width: 644px;
        align-items: flex-start;
        justify-content: center;
        /*position: absolute;*/
        /*top: 955px;*/
        left: 72px;
    }

    .desktop .frame-111 {
        display: flex;
        flex-direction: column;
        width: 644px;
        align-items: flex-start;
        justify-content: center;
        /*position: absolute;*/
        /*top: 365px;*/
        left: 72px;
    }

    .desktop .text-wrapper-4 {
        position: relative;
        align-self: stretch;
        margin-top: -1.00px;
        font-family: var(--h5-font-family);
        font-weight: var(--h5-font-weight);
        color: var(--variable-collection-green-brand-green-brand-300);
        font-size: var(--h5-font-size);
        letter-spacing: var(--h5-letter-spacing);
        line-height: var(--h5-line-height);
        font-style: var(--h5-font-style);
        left:70px !important;
    }

    .desktop .overlap-group {
        position: relative;
        width: 644px;
        /*height: 486px;*/
        /*top: 85px;*/
        left: 72px;
    }

    .desktop .frame-14 {
        display: flex;
        flex-direction: column;
        width: 644px;
        align-items: flex-start;
        gap: 6px;
        /*position: absolute;*/
        /*top: 0;*/
        left: 0;
    }

    .desktop .img {
        position: relative;
        width: 39px;
        height: 34px;
    }

    .desktop .frame-15 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .desktop .frame-16 {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .desktop .frame-17 {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 13px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .desktop .text-wrapper-5 {
        position: relative;
        align-self: stretch;
        margin-top: -1.00px;
        font-family: var(--h3-bold-font-family);
        font-weight: var(--h3-bold-font-weight);
        color: var(--variable-collection-green-brand-green-brand-300);
        font-size: var(--h3-bold-font-size);
        letter-spacing: var(--h3-bold-letter-spacing);
        line-height: var(--h3-bold-line-height);
        font-style: var(--h3-bold-font-style);
    }

    .desktop .text-wrapper-6 {
        color: var(--variable-collection-neutral-neutral-400);
        font-size: var(--titel-2-font-size);
        line-height: var(--titel-2-line-height);
        position: relative;
        align-self: stretch;
        font-family: var(--titel-2-font-family);
        font-weight: var(--titel-2-font-weight);
        letter-spacing: var(--titel-2-letter-spacing);
        font-style: var(--titel-2-font-style);
    }

    .desktop .text-wrapper-7 {
        position: relative;
        /*align-self: stretch;*/
        font-family: var(--titel-2-font-family);
        font-weight: var(--titel-2-font-weight);
        color: #ffffff;
        font-size: var(--titel-2-font-size);
        /*letter-spacing: var(--titel-2-letter-spacing);*/
        /*line-height: var(--titel-2-line-height);*/
        font-style: var(--titel-2-font-style);
        width:600px;
    }

    .desktop .text-wrapper-8 {
        position: absolute;
        width: 644px;
        top: 254px;
        left: 0;
        font-family: var(--h5-font-family);
        font-weight: var(--h5-font-weight);
        color: var(--variable-collection-green-brand-green-brand-300);
        font-size: var(--h5-font-size);
        letter-spacing: var(--h5-letter-spacing);
        line-height: var(--h5-line-height);
        font-style: var(--h5-font-style);
    }

    .desktop .button {
        all: unset;
        box-sizing: border-box;
        display: flex;
        width: 439px;
        height: 40px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 8px 12px;
        position: relative;
        /*top: 1579px;*/
        left: 133px;
        background-color: var(--buttonbuttonenable);
        border-radius: 100px;
        overflow: hidden;
        border: 1px solid;
        border-color: var(--variable-collection-green-brand-green-brand-100);
    }

    .desktop .button-text {
        all: unset;
        box-sizing: border-box;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        position: relative;
        flex: 0 0 auto;
    }

    .desktop .button-2 {
        all: unset;
        box-sizing: border-box;
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: var(--body-font-family);
        font-weight: var(--body-font-weight);
        color: var(--buttonbuttontext);
        font-size: var(--body-font-size);
        text-align: center;
        letter-spacing: var(--body-letter-spacing);
        line-height: var(--body-line-height);
        white-space: nowrap;
        font-style: var(--body-font-style);
    }

    .desktop .frame-18 {
        display: flex;
        flex-direction: column;
        width: 535px;
        align-items: center;
        gap: 73px;
        position: fixed;
        top: 125px;
        left: 723px;
        overflow-y: scroll;
    }

        .desktop .frame-18::-webkit-scrollbar {
            width: 0;
            display: none;
        }

    .desktop .frame-19 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .desktop .frame-20 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .desktop .image-2 {
        position: relative;
        width: 15px;
        height: 13px;
    }

    .desktop .text-wrapper-9 {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-family: var(--m3-label-medium-font-family);
        font-weight: var(--m3-label-medium-font-weight);
        color: #ffffff;
        font-size: var(--m3-label-medium-font-size);
        text-align: center;
        letter-spacing: var(--m3-label-medium-letter-spacing);
        line-height: var(--m3-label-medium-line-height);
        white-space: nowrap;
        font-style: var(--m3-label-medium-font-style);
    }

    .desktop .text-wrapper-10 {
        color: #ffffff;
        font-size: var(--h3-font-size);
        text-align: center;
        line-height: var(--h3-line-height);
        position: relative;
        align-self: stretch;
        font-family: var(--h3-font-family);
        font-weight: var(--h3-font-weight);
        letter-spacing: var(--h3-letter-spacing);
        font-style: var(--h3-font-style);
    }

    .desktop .text-wrapper-11 {
        position: relative;
        align-self: stretch;
        font-family: var(--titel-1-font-family);
        font-weight: var(--titel-1-font-weight);
        color: #d4d4d4;
        font-size: var(--titel-1-font-size);
        text-align: center;
        letter-spacing: var(--titel-1-letter-spacing);
        line-height: var(--titel-1-line-height);
        font-style: var(--titel-1-font-style);
    }

    .desktop .group {
        position: relative;
        align-self: stretch;
        width: 100%;
        height: 456.35px;
        object-fit: cover;
    }
