body {
    margin:0;
    padding:0;
    font-family: 'Roboto', sans-serif;
}
div#body {
    max-width: 1000px;
    min-width: 480px;
    margin: 0 auto;
}
header.menu nav ul {
    padding:0;
    margin:0;
    list-style-type:none;
    display:flex;
    text-align:center;
}
header.menu nav ul li {
    flex: 1 1 100%;
    background-image: linear-gradient(to bottom, transparent 51%, #80DEEA 50%, #80DEEA 95%, #00B0FF 95%);
    background-size: 100% 200%;
    transition: all .25s ease-in-out;
}
header.menu nav ul li:hover {
    background-position: bottom center;
}
header.menu nav ul li a {
    display:block;
    padding:8px;
    color:black;
    text-decoration:none;
    text-shadow:0 0 4px white;
}
header.menu h1 {
    margin:0;
    text-align:center;
    padding:.5rem;
    border:1px solid #1A237E;
    border-style:solid none;
    background: linear-gradient(to right, #5C6BC0, #3F51B5, #5C6BC0) #3F51B5;
    text-shadow:0 0 4px #8C9EFF;
    color:white;
    font-weight:normal;
}
header.menu h1.kyle {
    background: linear-gradient(to right, #00BCD4, #26C6DA, #00BCD4) #00BCD4;
    text-shadow:#84FFFF;
    border:1px solid #006064;
    border-style:solid none;
}
div#body {
    box-sizing: border-box;
    box-shadow: 0 -16px 16px black;
}
section#content {
    padding:8px;
}
.subheading {
    border:1px solid black;
    padding:8px;
    border-radius:8px;
    background:radial-gradient(#cfe0e6,lightblue);
    text-align:center;
}
header.small, h1.small, h2.small {
    margin-top:1em;
    border-bottom:1px dotted grey;
    text-align:center;
}
.links {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
}
.links a {
    color:white;
    text-shadow:0 0 4px black;
    text-decoration:none;
    font-size:1.5rem;
    background:white;
    text-align:center;
    border-radius:8px;
    box-shadow:2px 2px 4px black;
    margin:4px 8px;
    padding:8px;
    background:url(linkicons/noise.png) rgb(20,20,20);
    transition:all .1s;
}
.links a.private:after {
    content:" *";
    color:red;
}
.links a:hover, .links a:active {
    box-shadow:2px 2px 8px 2px black;
}
form.add {
    max-width:500px;
    margin:0 auto;
}
label.stats {
    display:block;
    text-align:center;
}
form.add label {
    display:flex;
}
form.add label span, form.add input, form.add header, form.add textarea, form.add span.holder{
    padding:.5rem .75rem;
    border:1px solid grey;
    border-bottom-style:none;
}
form.add label span{
    flex:1;
    border-right:none;
}
form.add input, form.add textarea, form.add span.holder {
    flex:2;
}
form.add input:focus, form.add textarea:focus {
    outline:none;
}
form.add label:last-of-type span, form.add label:last-of-type input {
    border-bottom-style:solid;
}
form.add header {
    margin-top:8px;
    background-image:radial-gradient(#cfe0e6,lightblue);
}
dl.stats div {
    display:flex;
    flex-wrap:wrap;
}
dl.stats div dt {
    text-align:right;
    flex:1;
    padding:8px;
    opacity:.38;
}
dl.stats div dd {
    flex:4;
    padding:8px;
    margin-left:0;
    overflow:hidden;
    word-wrap:break-word;
}
.center {
    text-align:center;
}
.error {
    color:red;
    text-align:center;
    font-weight:bold;
}
img.full {
    display:block;
    margin:0 auto;
    border-radius:8px;
    box-shadow:2px 2px 8px black;
}
@media only screen and (max-width: 480px) {
    header.menu {
        min-width:auto;
    }
    div#body, header.menu nav {
        min-width:auto;
    }
    header.menu nav ul {
        flex-direction:column;
        box-shadow: 0 0 8px black;
    }
    header.menu nav ul li {
        border-bottom:1px solid grey;
    }
    dl.stats div dd {
        flex:2;
    }
}