:root {
    --grundton:     #1f5a66;
    --text:         #80eaff;
    --akzent_dunkel:#203a40;
    --akzent_hell:  #ffe14c;
    
    --std_padding:  2px 2px 2px 2px;
    --std_margin:   0px 0px 0px 0px;
}
@font-face {
    font-family: 'droid';
    src: url('font/DisposableDroid.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body{
    display:        flex;
    background:     var(--grundton);
    color:          var(--text);
    border:         none;
    margin:         0px;
    padding:        0px;
    font-family:    'droid', monospace;
    font-size:      16pt;
} 

article {
    display:        block;
    background:     var(--akzent_dunkel);
    box-shadow:     0px 5px 15px 0px var(--akzent_dunkel);
    padding:        20px;
    margin:         auto;
}

section {
    display:        block;
    text-align:     center;
}

p {
    margin:         0px;
}

span {
    margin:         0px;
}

nav {
    background:     var(--akzent_dunkel);
    margin:         0px;
}

ul {
    padding: 0px;
    margin: 0px;
}

li {
    display:        block;
    list-style:     none;
    transition:     ease-in-out .3s;
}
li:hover {
    background:     var(--akzent_hell);
    color:          var(--akzent_dunkel);
}

input {
    display:        inline-block;
    background:     var(--akzent_dunkel);
    color:          inherit;
    font:           inherit;
    font-size:      24pt;
    border:         solid 1px var(--text);
    border-radius:  5px;
    padding:        2px;
    width:          100%;
    box-sizing:     border-box;
    -moz-box-sizing:border-box;
}

#headline {
    display:        block;
    font-size:      64pt;
    color:          var(--akzent_hell);
    text-align:     center;
}

#underline {
    display:        block;
    font-size:      20pt;
    text-align:     center;
}
