/* Thank you iris for your work on this section */
:root {
    --bg: black;
    --text: white;
    --link: lightgrey;
    --toggle: 0;
}
body {background-color: black;}
main {
    /* default formatting to follow challenge media */
    background-color: var(--bg);
    color: var(--text);
    font-family: Arial, Helvetica, sans-serif;
    position: absolute; top: 0; left: 0;
    width: 100%;
    min-height: 100%;
}
#theme { 
    z-index: 10; 
    position: absolute; 
    left: 10px; 
    top: 10px; 
    display: none;
}
#theme:checked ~ main {
    --bg: white;
    --text: black;
    --link: dimgrey;
    --toggle: 2;
}
/* I owe you the world */
label {
    /* light mode toggle parameters */
    /* text var used bc it follows the inverse of bkgnd */
    background-color: var(--text);
    position: fixed;
    bottom: 0px;
    left: 0px;
    /* padding: 5px; */
    font-size: min(40px);
    z-index: 1;

    text-align: center;
    width: 55px;
    height: 55px;
}
#dark {
    /* swap toggles with page theme */
    z-index: var(--toggle);
}

h1 {
    /* title header */
    font-style: italic;
    font-size: min(60px, 8.5vw);
    text-align: center;
    padding-left: 2vw;
    padding-right: 2vw;
    margin-left: -1vw;      /* account for italicised text throwing off center */
    margin-top: 15px;
    margin-bottom: -10px;   /* bring "navbar" closer */
}
h2 {
    /* "navbar" */
    font-size: min(20px, 4vw);
    font-weight: normal;
    text-align: center;
    padding-left: min(10px);
    padding-right: min(10px);
    border-right: var(--link);
    border-right-width: 1px;
    border-right-style: solid;
}
h2:last-child {
    /* thank you iris */
    border-right-style: none;
}
h3 {
    /* page content headers */
    font-size: min(6vw, 40px);
    text-align: center;
    margin: 10px;
    margin-bottom: -15px;
}
h4 {
    /* front page content (this is stupid change it) */
    font-size: 20px;
    text-align: center;
    font-weight: normal;
    line-height: 1.25em;
}
h5 {
    /* FAQ questions */
    font-size: min(24px,6vw);
    margin-bottom: 10px;
}
p, ol {
    /* default text */
    font-size: min(20px, 5vw);
    font-weight: normal;
    line-height: 1.25em;
    margin-top: 0;
    margin-bottom: 10px;
}
ol {
    margin-top: 1.67em
}
li {
    /* ordered list readability adjustments */
    line-height: 1.5em;
    margin-left: -13px;
    margin-bottom: 10px;
    margin-right: 10px;
}
footer {
    /* footer to allow spacing for dark mode toggle */
    margin-bottom: 60px;
}
.centered-div {
    /* default div to center align page content */
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 20px;
    margin-right: 20px;
}
.content {
    /* justified page content element width */
    width: 800px;
}
a {
    /* default link formatting */
    color: var(--link);
    text-decoration: none;
}
a:hover {
    color: grey;
}
.mainheader, .mainheader:hover {
    /* remove main header link formatting for linking to index.html */
    color: var(--white);
    text-decoration: none;
}