:root {
    --row-height: 400px;
    --section-width: 400px;
}

* {
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
}

body
{
    color: black;
    display: flex;
    flex-direction: column;
    background: url('p/about/background.jpg');
    /* flex-wrap: wrap; */
    /* padding: 20px; */
}

/* row */
body > *
{
    position: relative;
    display: flex;
    width: 100%;
    height: var(--row-height);
}

/* items in row */
body > * > *
{
    position: relative;
    height: var(--row-height);
    flex: 1;
}

a {
    color: white;
    font-weight: bolder;
    text-shadow: 0px 0px 5px rgba(255,255,255,0.75);
    /* transition: text-shadow 0.1s ease-in-out; */
}

a:hover {
    text-shadow: 0px 0px 10px white, 0px 0px 10px white;
}

p a {
    color: black;
}

p a:hover {
    text-shadow: none;
}

img, video
{
    height: var(--row-height);
    width: 100%;
    object-fit: cover;
}

h1
{
    color: white;
    background-color: black;
    /* text-shadow: 0px 0px 5px white; */
    /* display: inline; */
    /* border-radius: 5px 5px 0 0; */
    margin: 5px 5px 0 5px;
}

h2
{
    color: white;
    font-size: 16px;
    background-color: black;
    /* border-radius: 0 5px 5px 0; */
}

p
{
    /* font-weight: bolder; */
    /* text-align: justify; */
    font-size: 14px;
    /* border: 2px solid black; */
    background: white;
    /* border-radius: 0 5px 5px 5px; */
    margin: 0 5px;
}

section
{
    position: absolute;
    height: fit-content;
    padding: 10px;
    z-index: 10;
    /* flex: 2; */
    flex: none;
    /* text-shadow: 0px 0px 15px black, 0px 0px 15px black, 0px 0px 15px black; */
    /* text-shadow: -1px -1px 1px rgba(0,0,0,0.75), 1px -1px 1px rgba(0,0,0,0.75), -1px 1px 1px rgba(0,0,0,0.75), 1px 1px 1px rgba(0,0,0,0.75); */
    /* backdrop-filter: blur(10px); */
    /* outline: 1px dashed black; */
}

section > *
{
    width: fit-content;
    /* backdrop-filter: blur(10px); */
    /* background-color: rgba(0,0,0,0.75); */
    padding: 7px 10px;
    margin: 0 0 10px 0;
}

section p
{
    max-width: min(100%, var(--section-width));
}

section h2
{
    /* display: inline; */
    /* line-height: 26px; */
    /* padding: 10px 15px; */
    padding: 4px 8px;
    /* margin: 0 5px; */
    /* margin-left: 15px; */
}