
:root {
    --blue0:   #172038;
    --blue1:   #253a5e;
    --blue2:   #3c5e8b;
    --blue3:   #4f8fba;
    --blue4:   #73bed3;
    --blue5:   #a4dddb;
    --green0:  #19332d;
    --green1:  #25562e;
    --green2:  #468232;
    --green3:  #75a743;
    --green4:  #a8ca58;
    --green5:  #d0da91;
    --brown0:  #4d2b32;
    --brown1:  #7a4841;
    --brown2:  #ad7757;
    --brown3:  #c09473;
    --brown4:  #d7b594;
    --brown5:  #e7d5b3;
    --yellow0: #341c27;
    --yellow1: #602c2c;
    --yellow2: #884b2b;
    --yellow3: #be772b;
    --yellow4: #de9e41;
    --yellow5: #e8c170;
    --red0:    #241527;
    --red1:    #411d31;
    --red2:    #752438;
    --red3:    #a53030;
    --red4:    #cf573c;
    --red5:    #da863e;
    --purple0: #1e1d39;
    --purple1: #402751;
    --purple2: #7a367b;
    --purple3: #a23e8c;
    --purple4: #c65197;
    --purple5: #df84a5;
    --black0:  #090a14;
    --black1:  #10141f;
    --black2:  #151d28;
    --black3:  #202e37;
    --black4:  #394a50;
    --black5:  #577277;
    --white0:  #394a50;
    --white1:  #577277;
    --white2:  #819796;
    --white3:  #a8b5b2;
    --white4:  #c7cfcc;
    --white5:  #ebede9;
}


form {
    margin: 1em;
}


div.formItem {
    margin-top: 1em;
    margin-left: 1em;
}

label.inlineWide {
    display: inline-block;
    width: 11em;
}

label.inlineNarrow {
    display: inline-block;
    width: 3em;
}


label.block {
    display: block;
    width: 11em;
}

a {
    font-weight: bold;
    color: var(--red5);
}
body, html {
    margin: 0;
    padding: 0;
    background-color: var(--blue2);
    font-family: Verdana, Arial, sans-serif;
}

div.zinesection{
}

div.zinecontainer {
    margin-top: 2rem;
    margin-bottom: 2rem;
    display: flex;
    align-items: center;
    justify-content: left;
}

div.zinetext {
    display: inline-block;
    padding-left: 1rem;
    max-width: 50%;
    font-family: Verdana, Arial, sans-serif;
    font-size: small;
}

img.zine {
    max-width: 50%;
    display: inline-block;
}


hr {
    border: .1rem solid var(--green4);
}


main {
    background-color: var(--white5);
    padding: 15px;
    max-width: 100%;
    margin: auto;
}

h1 {
    color: var(--green4);
    display: inline;
}
h2 {
    text-align: left;
    margin-left: 1em;
}
h3 {
    color: #444;
}

.center {
    text-align: center;
}

.button {
    color: var(--white5);
    background-color: var(--red5);
    width: 13em;
    height: 2em;
    margin-top: 1em;
    margin-bottom: 2em;
    font-weight: bold;
}

img.title {
    max-width: 100%;
    height: auto;
}



textarea {
    width: 100%;
}



main {
    width: 60rem;
}

textarea {
    width: 40rem;
}

div.zinecontainer {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}

div.zinetext {
    font-size: medium;
    padding-left: 2rem;
}

