@import url(fontawesome-all.min.css);
@import url("https://fonts.googleapis.com/css?family=Roboto:400,700");
html, body, div, span, applet, object,
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite,
code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b,
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; 
}
#net {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}
#app {
    z-index: 1;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

span {
    font-size: 28px;
    font-weight: 400;
    color: rgb(255, 255, 255);
}

/* Header */
#header h1 {
    font-size: 3.25em;
    margin: 0 0 0.55em 0; 
}

#header p {
    font-size: 1.35em;
    line-height: 1.65em; 
}

#header a {
color: inherit; 
}

@media screen and (max-width: 736px) {
    #header h1 {
        font-size: 2em; 
    }
    #header p {
        font-size: 1em; 
    } 
}

@media screen and (max-width: 480px) {
    #header {
        margin: 0 0 1em 0; 
    } 
}
  

/* Type */
body, input, select, textarea {
    color: rgba(255, 255, 255, 0.75);
    font-family: "Roboto", sans-serif;
    font-size: 16pt;
    font-weight: 400;
    letter-spacing: -0.01em;
    line-height: 1.65em; }
    @media screen and (max-width: 1680px) {
      body, input, select, textarea {
        font-size: 12pt; } }
    @media screen and (max-width: 1280px) {
      body, input, select, textarea {
        font-size: 11pt; } }
    @media screen and (max-width: 980px) {
      body, input, select, textarea {
        font-size: 12pt; } }
    @media screen and (max-width: 736px) {
      body, input, select, textarea {
        font-size: 12pt; } }
    @media screen and (max-width: 480px) {
      body, input, select, textarea {
        font-size: 12pt; } }
  
  a {
    -moz-transition: border-bottom-color 0.2s ease, color 0.2s ease;
    -webkit-transition: border-bottom-color 0.2s ease, color 0.2s ease;
    -ms-transition: border-bottom-color 0.2s ease, color 0.2s ease;
    transition: border-bottom-color 0.2s ease, color 0.2s ease;
    border-bottom: dotted 1px rgba(255, 255, 255, 0.25);
    color: #1cb495;
    text-decoration: none; }
    a:hover {
      border-bottom-color: transparent;
      color: #1cb495 !important;
      text-decoration: none; }
  
  strong, b {
    color: #fff;
    font-weight: 700; }
  
  em, i {
    font-style: italic; }
  
  p {
    margin: 0 0 2em 0; }
  
  h1, h2, h3, h4, h5, h6 {
    color: #fff;
    font-weight: 700;
    line-height: 1em;
    margin: 0 0 1em 0; }
    h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
      color: inherit;
      text-decoration: none; }
  
  h1 {
    font-size: 2.5em;
    line-height: 1.25em; }
  
  h2 {
    font-size: 1.75em;
    line-height: 1.5em; }
  
  h3 {
    font-size: 1.35em;
    line-height: 1.5em; }
  
  h4 {
    font-size: 1.1em;
    line-height: 1.5em; }
  
  h5 {
    font-size: 0.9em;
    line-height: 1.5em; }
  
  h6 {
    font-size: 0.7em;
    line-height: 1.5em; }
  
  sub {
    font-size: 0.8em;
    position: relative;
    top: 0.5em; }
  
  sup {
    font-size: 0.8em;
    position: relative;
    top: -0.5em; }
  
  blockquote {
    border-left: solid 8px rgba(255, 255, 255, 0.35);
    font-style: italic;
    margin: 0 0 2em 0;
    padding: 0.5em 0 0.5em 2em; }
  
  code {
    background: rgba(255, 255, 255, 0.125);
    border-radius: 6px;
    border: solid 2px rgba(255, 255, 255, 0.35);
    font-family: "Courier New", monospace;
    font-size: 0.9em;
    margin: 0 0.25em;
    padding: 0.25em 0.65em; }
  
  pre {
    -webkit-overflow-scrolling: touch;
    font-family: "Courier New", monospace;
    font-size: 0.9em;
    margin: 0 0 2em 0; }
    pre code {
      display: block;
      line-height: 1.75em;
      padding: 1em 1.5em;
      overflow-x: auto; }
  
  hr {
    border: 0;
    border-bottom: solid 2px rgba(255, 255, 255, 0.35);
    margin: 2em 0; }
    hr.major {
      margin: 3em 0; }
  
/* Footer */
#footer {
    -moz-transition: opacity 0.5s ease-in-out;
    -webkit-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
    bottom: 4em;
    color: rgba(255, 255, 255, 0.5);
    left: 4em;
    opacity: 0.5;
    position: absolute; }
    #footer .icons {
      margin: 0 0 0.5em 0; }
    #footer .copyright {
      font-size: 0.8em;
      list-style: none;
      padding: 0; }
      #footer .copyright li {
        border-left: solid 1px rgba(255, 255, 255, 0.25);
        display: inline-block;
        line-height: 1em;
        margin: 0 0 0 0.75em;
        padding: 0 0 0 0.75em; }
        #footer .copyright li:first-child {
          border-left: 0;
          margin-left: 0;
          padding-left: 0; }
      #footer .copyright a {
        color: inherit; }
    #footer:hover {
      opacity: 1; }
    #footer > :last-child {
      margin-bottom: 0; }
    @media screen and (max-width: 1680px) {
      #footer {
        bottom: 3.5em;
        left: 3.5em; } }
    @media screen and (max-width: 736px) {
      #footer {
        bottom: 2em;
        left: 2em; } }
    @media screen and (max-width: 360px) {
      #footer {
        bottom: 1.25em;
        left: 1.25em; } }
    @media screen and (max-height: 640px) {
      #footer {
        bottom: auto;
        left: auto;
        margin: 1em 0 0 0;
        position: relative; } }
  
/* Icons */
ul.icons {
    cursor: default;
    list-style: none;
    padding-left: 0; }
    ul.icons li {
      display: inline-block;
      padding: 0 1em 0 0; }
      ul.icons li:last-child {
        padding-right: 0; }
      ul.icons li .icon:before {
        font-size: 1.25em; }
      ul.icons li a {
        color: inherit; }
  
/* Icon */
.icon {
    text-decoration: none;
    border-bottom: none;
    position: relative; }
    .icon:before {
      -moz-osx-font-smoothing: grayscale;
      -webkit-font-smoothing: antialiased;
      display: inline-block;
      font-style: normal;
      font-variant: normal;
      text-rendering: auto;
      line-height: 1;
      text-transform: none !important;
      font-family: 'Font Awesome 5 Free';
      font-weight: 400; }
    .icon > .label {
      display: none; }
    .icon:before {
      line-height: inherit; }
    .icon.solid:before {
      font-weight: 900; }
    .icon.brands:before {
      font-family: 'Font Awesome 5 Brands'; }

/* Section/Article */
section.special, article.special {
    text-align: center; }
  
  header p {
    color: rgba(255, 255, 255, 0.5);
    position: relative;
    margin: 0 0 1.5em 0; }
  
  header h2 + p {
    font-size: 1.25em;
    margin-top: -1em;
    line-height: 1.5em; }
  
  header h3 + p {
    font-size: 1.1em;
    margin-top: -0.8em;
    line-height: 1.5em; }
  
  header h4 + p,
  header h5 + p,
  header h6 + p {
    font-size: 0.9em;
    margin-top: -0.6em;
    line-height: 1.5em; }
  
  @media screen and (max-width: 980px) {
    header br {
      display: none; } }
  
  @media screen and (max-width: 736px) {
    header br {
      display: inline; } }
  
  @media screen and (max-width: 480px) {
    header br {
      display: none; } }