body{
   --TSBackground: linear-gradient(145deg, #ffffff, #b6d2ca);
   --tekst: rgb(99, 99, 99);
}

.dark-theme{
   --TSBackground: linear-gradient(145deg, #6a6a6a, #303030);
   --tekst: white;
}



main {
    background-color: var(--TSBackground);
    position: absolute;
    z-index: 0;
    top: 7.5%;
    left: 16.5%;
    width: 67%;
    height: 37.5%;
    box-sizing: border-box;
    padding: 1rem 1.25rem;
    overflow: hidden;
}


img {
    display: block;
    height: 60%;
    width: auto;
}

h1 {
    position: absolute;
    top: 65%;
    left: 5%;
    width: 50%;
    max-width: 50%;
    gap: 0.3rem;

}

h2 {
    position: absolute;
    top: 75%;
    left: 5%;
    width: 50%;
    max-width: 50%;
    gap: 0.3rem;
}

@media (max-width:1200px) {
        h1 {
        top: 40%;
    }

    h2 {
        top: 60%;
    }
}


aside {
    position: absolute;
    top: 8%;
    right: 4%;
    z-index: 5;
    pointer-events: auto;
    width: 50%;
    max-height: 84%;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 1em;
    color: var(--tekst);
    background: var(--bar);
    border: 0.0625rem solid var(--border);
    border-radius: 1em;
    box-shadow: 0.125rem 0.1875rem 0.25rem var(--shadow);
    font-size: clamp(12px, 1.5cqi, 18px);
    overflow-wrap: anywhere;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

#bericht {
    display: block;
    width: 100%;
    min-height: 10em;
    box-sizing: border-box;
    font: inherit;
    resize: vertical;
}