:root
{
    --vw: 100vw; /*To scale with scrollbar using js*/
    --vh: 100vh;
}

.header
{
    position: absolute;
    left: 0px;
    top: 0px;
    min-width: var(--vw);
    height: 80px;

    background: white;
    box-shadow: inset 0px 0px 0px 5px rgb(219, 219, 219);

    display: inline-block;
}

.masthead
{
    position: absolute;
    left: 5px;
    top: 5px;
    width: 190px;
    height: 70px;

    cursor: pointer;
}

.mode
{
    position: absolute;
    left: 200px;
    top: 15px;
    width: 50px;
    height: 50px;

    background: black;
    box-shadow: inset 0px 0px 0px 3px rgb(58, 58, 58);

    border-radius: 100%;
}

.main
{
    position: absolute;
    left: 0px;
    top: 80px;
    min-width: var(--vw);
    height: calc(var(--vh) - 80px);

    background: linear-gradient(rgb(219, 219, 219), white 20px);

    overflow: auto;
    display: inline-block;
}

.dropdown
{
    position: absolute;
    top: 5px;
    left: 5px;
    width: 160px;
    height: 70px;

    background-color: white;
    box-shadow: inset 0px 0px 0px 5px white;

    display: flex;
    justify-content: center;

    cursor: default;

    transition: background-color 0.2s cubic-bezier(0.1, 0.9, 1, 1), height 0.2s cubic-bezier(0.1, 0.9, 1, 1);
}

/*If the subdrop in a dropdown has focus, stay focused itself*/
.dropdown:hover, .dropdown:has(:focus)
{
    background-color: rgb(224, 224, 224);
    height: 300px;
}

.subdrop
{
    --targ-top: 0px;

    position: absolute;
    top: 0px;
    left: 10px;
    width: 140px;
    height: 70px;

    display: flex;
    justify-content: center;

    opacity: 0;
    transition: opacity 0.2s cubic-bezier(0.1, 0.9, 1, 1), top 0.2s cubic-bezier(0.1, 0.9, 1, 1);
}

/*If the subdrop in a dropdown has focus, keep all dropdowns visible still*/
.dropdown:hover .subdrop, .dropdown:has(:focus) .subdrop
{
    opacity: 1;
    top: var(--targ-top);
}

.subdrop:hover
{
    color: grey;
}

p
{
    position: absolute;
    color: black;

    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-weight: 500;
}

iframe, .iframe
{
    position: absolute;
    width: 1600px;
    height: 1000px;

    -webkit-transform:scale(0.5);
    -moz-transform:scale(0.5);
    -o-transform:scale(0.5);
    transform:scale(0.5);

    background: black;
}

/*For divs imitating iframes*/
.iframe
{
    --src: "";
    background: none;
}

input, textarea
{
    background: white;
    color: black;
}