*, *:before, *:after {
    box-sizing: border-box;
}


* {
    font-family: 'Arial', sans-serif;
    color: #333;
}

html {
    font-size: 125%;
}

:root {
    
    --margin-left: 2vw;
    --margin-right: 2vw;

    --margin-top: 1rem;
    --margin-bottom: 1rem;

    --icon-size: 1.25rem;
}


a.back-button {
    font-size: 0.75rem;
}

header a:not(:hover) {
	text-decoration: none;
}

.icons a {
	text-decoration: none;
}

.icons a:hover {
	opacity: 0.85;
}


header,
footer {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
}

header {
    margin-bottom: 3rem;
}


header, 
footer {
    justify-content: center;
}

:not(.home) main {
    text-align: center;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;

}

footer > *:not(:first-child) {
    position: relative;
    top: 0.1rem;
}

footer > *:not(:first-child)::before {
    content: " | ";
}

/* layout */

body {
    margin: 0;
}

body {
    
    margin-left: var(--margin-left);
    margin-right: var(--margin-right);
    margin-top: var(--margin-top);
    margin-bottom: var(--margin-bottom);

}


body {
    display: flex;
    flex-flow: column nowrap;
    min-height: calc(100vh - var(--margin-top)*2);
}

main {
    flex: 1;
}


.home header {
    margin-bottom: 0;
}


.home main {
    display: flex;
    justify-content: center;
    align-items: center;
}

.home main .logo {
    position: relative;
    top: -1rem;

}

.home main .logo {
    width: 75vw;
}

.home main .icons {
    display: flex;
    justify-content: center;
    margin-top: 3rem;
}

.icons a:not(:first-of-type) {
    margin-left: 0.75rem;
}


.back-button {
    display: flex;
    align-items: center;
}

.back-button svg {
    margin-right: 0.15rem;
}