body {
    text-align: center;
    font-family: Aileron, Segoe UI, Arial, sans-serif;
    font-size: larger;
    background: url('media/pictures/mainbg_small.webp') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /*color: #DFB52B;*/
    color: #164077;
}

a {
    /*color: #F7EE93;*/
    color: #021129;
}

section {
    max-width: 650pt;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 40pt;
}

.homepagetitle {
    font-size: xxx-large;
    font-family: Aileron, Segoe UI, Arial, sans-serif;
    float: left;
    position: relative;
    /*color: #DFB52B;*/
    color: #021129;
}

nav {
    font-size: xx-large;
    font-family: Aileron, Segoe UI, Arial, sans-serif;
    float: right;
    margin: 10pt;
}

p, li {
    font-size: 17pt;
    margin: 0pt;
}

@media screen and (orientation: portrait) and (width <= 800pt) {
     nav > a {
        float: right;
        clear: right;
     }
     nav > span {
        display: none;
     }
}

h1 {
    font-family: Zapfino, Segoe UI, Arial, sans-serif;
    /*color: #FFF;*/
    color: #021129;
    padding-top: 30pt;
    text-wrap: balance;
}

h2 {
    font-family: Zapfino, Segoe UI, Arial, sans-serif;
    color: #FFF;
    /*color: #021129;*/
    text-wrap: balance;
}

.quote {
    color: #ff2007;
    font-weight: bold;
}


.andreaspicture {
    padding-top: 150pt;
}

.andreaspicture > picture > img {
    width: 200pt;
    height: 200pt;
    object-fit: cover;
    border-radius: 100pt;
}

ul {
    text-align: left;
}

.blocktext {
    text-align: justify;
}

section > div {
    background-color: #ffffff76;
    padding: 20pt;
}