body { background: #ffffff; color: #000000; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }

html { height: 100%; }

body { border-top: 2rem solid #ee1b25; border-left: 2rem solid #ee1b25; border-bottom: 2rem solid #ee1b25; border-right: 2rem solid #ee1b25; margin: 0; height: 100%; box-sizing: border-box; overflow-y: hidden; }

#border { margin: 0; height: 100%; box-sizing: border-box; box-shadow: 1rem 1rem black; overflow: scroll; }

#main { padding-top: 1rem; padding-left: 1rem; padding-right: 1rem; max-width: 80em; margin: 0 auto; }

h1, h2, h3 { text-transform: uppercase; }

h1 { font-size: 110%; }

h2 { font-size: 105%; }

h3, h4, h5 { font-size: 100%; }

header .logo-wrapper { width: 100%; }

header .logo { display: block; width: 100%; max-width: 30em; margin: 0 auto; }

nav { border-top: 1px solid #9d9d9d; border-bottom: 1px solid #9d9d9d; margin-top: 1em; margin-bottom: 1em; padding-top: 0.5em; padding-bottom: 0.5em; text-align: center; }

nav a { display: block; padding-top: 0.5em; padding-bottom: 0.5em; text-transform: uppercase; color: black; text-decoration: none; }

@media (min-width: 800px) { nav a { display: inline; padding-left: 1.5em; padding-right: 1.5em; } }

nav a:hover { background-color: #dddddd; }

main { padding-top: 1em; }

@media (min-width: 800px) { main { display: flex; } }

article { padding-left: 2em; padding-right: 2em; padding-bottom: 1em; }

@media (min-width: 800px) { article { flex: 1 0 0; } }

aside { padding-left: 2em; padding-right: 2em; border-top: 1px solid #9d9d9d; }

@media (min-width: 800px) { aside { border-top: none; border-left: 1px solid #9d9d9d; flex: 0 0 20em; } }

aside img { width: 50%; }

.index-wrapper { width: 100%; }

@media (min-width: 1200px) { .index-wrapper { display: flex; } }

@media (min-width: 1200px) { .index-quote { flex: 0 0 50%; } }

.index-quote blockquote { font-size: 200%; font-weight: bold; font-family: serif; padding-right: 1em; }

.index-quote cite { color: #9d9d9d; }

@media (min-width: 1200px) { .index-image { flex: 0 0 50%; } }

.index-image img { width: 100%; max-width: 40em; }

blockquote { margin: 0; }
