/* CSS RESET */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:                     0;
    padding:                    0;
    border:                     0;
    outline:                    0;
    font-size:                  62.5%;
    font-family:                "proxima-nova",sans-serif;
    vertical-align:             baseline;
    background:                 transparent;
}
body {
    background-color:           #000;
    width:                      100vw;
    height:                     100vh;
}
div, li {
    box-sizing:                 border-box;
    -webkit-box-sizing:         border-box;
    -moz-box-sizing:            border-box;
    -ms-box-sizing:             border-box;
    -o-box-sizing:              border-box;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:                    block;
}
ul {
    list-style:                 none;
}
blockquote, q {
    quotes:                     none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content:                    '';
    content:                    none;
}
a {
    margin:                     0;
    padding:                    0;
    font-size:                  100%;
    vertical-align:             baseline;
    background:                 transparent;
    text-decoration:            none;
}
ins {
    background-color:           #efefef;
    color:                      #000;
    text-decoration:            none;
}
mark {
    background-color:           #0CC;
    color:                      #FFF;
    font-style:                 italic;
    font-weight:                bold;
}
del {
    text-decoration:            line-through;
}
abbr[title], dfn[title] {
    border-bottom:              1px dotted;
    cursor:                     help;
}
table {
    border-collapse:            collapse;
    border-spacing:             0;
}
hr {
    display:                    block;
    height:                     1px;
    border:                     0;
    border-top:                 1px solid #cccccc;
    margin:                     1rem 0;
    padding:                    0;
}
input, select {
    vertical-align:             middle;
}
::selection {
    background:                 #e51818;
    color:                      #FFF;
}
::-moz-selection {
    background:                 #e51818;
    color:                      #FFF;
}
::-ms-selection {
    background:                 #e51818;
    color:                      #FFF;
}
::-o-selection {
    background:                 #e51818;
    color:                      #FFF;
}
/*               */
/* CSS RESET END */
/*               */

#container {
    width:                     80vw;
    height:                    100vh;
    min-width:                 320px;
    margin:                    0 10vw 0 10vw;
    display:                   flex;
    flex-direction:            column;
}
header {
    width:                     100%;
    -webkit-flex:              1;
    -ms-flex:                  1;
    flex:                      1;
    display:                   flex;
    align-items:               center;
}
@media (max-width: 480px) {
  header h1 {
      font-size:                 4.5rem;
      color:                     rgb(255,255,255);
      font-weight:               700;
      line-height:               3rem;
  }
  main {
      width:                     100%;
      -webkit-flex:              1;
      -ms-flex:                  1;
      flex:                      1;
      color:                     rgb(255,255,255);
      font-size:                 2.2rem;
      display:                   flex;
      align-items:               center;
    }
    footer ul li a:link,
    footer ul li a:visited {
      color:                      rgb(255,255,255);
      font-size:                  2rem;
    }
}
@media (max-width: 900px) {
  header h1 {
      font-size:                 2.8rem;
      color:                     rgb(255,255,255);
      font-weight:               700;
      line-height:               3rem;
  }
  main {
      width:                     100%;
      -webkit-flex:              1;
      -ms-flex:                  1;
      flex:                      1;
      color:                     rgb(255,255,255);
      font-size:                 2rem;
      display:                   flex;
      align-items:               center;
    }
    footer ul li a:link,
    footer ul li a:visited {
      color:                      rgb(255,255,255);
      font-size:                  1.8rem;
    }
}
@media (min-width: 901px) {
  header h1 {
      font-size:                 2.8rem;
      color:                     rgb(255,255,255);
      font-weight:               700;
      line-height:               3rem;
  }
  main {
      width:                     100%;
      -webkit-flex:              1;
      -ms-flex:                  1;
      flex:                      1;
      color:                     rgb(255,255,255);
      font-size:                 2.2rem;
      display:                   flex;
      align-items:               center;
    }
    footer ul li a:link,
    footer ul li a:visited {
      color:                      rgb(255,255,255);
      font-size:                  2.0rem;
    }
}
main a:link,
main a:visited {
    color:                     #f6d361;
    text-decoration:           none;
    border-bottom:             1px solid #555;
    -moz-transition:           border 1s ease-in-out;
    -o-transition:             border 1s ease-in-out;
    -webkit-transition:        border 1s ease-in-out;
    -ms-transition:            border 1s ease-in-out;
    transition:                border 1s ease-in-out;
}
main a:hover,
main a:active {
    border-bottom:              1px solid #FFF;
    -moz-transition:            border 1s ease-in-out;
    -o-transition:              border 1s ease-in-out;
    -webkit-transition:         border 1s ease-in-out;
    -ms-transition:             border 1s ease-in-out;
    transition:                 border 1s ease-in-out;
}
footer {
    width:                     100%;
    -webkit-flex:              1;
    -ms-flex:                  1;
    flex:                      1;
    display:                   flex;
    align-items:               center;
}
footer ul li {
  float:                      left;
  margin:                     0 2.5rem 2.5rem 0;
  border-bottom:              1px solid #555;
  -moz-transition:            border 1s ease-in-out;
  -o-transition:              border 1s ease-in-out;
  -webkit-transition:         border 1s ease-in-out;
  -ms-transition:             border 1s ease-in-out;
  transition:                 border 1s ease-in-out;
}
footer ul li:hover {
  border-bottom:              1px solid #FFF;
  -moz-transition:            border 1s ease-in-out;
  -o-transition:              border 1s ease-in-out;
  -webkit-transition:         border 1s ease-in-out;
  -ms-transition:             border 1s ease-in-out;
  transition:                 border 1s ease-in-out;
}
.cookienotice {
  position:                   absolute;
  bottom:                     0;
  display:                    block;
  box-sizing:                 border-box;
  background-color:           #000;
  width:                      100vw;
  height:                     3.5rem;
  font-size:                  1.2rem;
  padding:                    1rem 0 0rem 10vw;
  color:                      rgb(150,150,150);
  border-top:                 1px solid #222;
}