@font-face {
    font-family: 'Knockout';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/Knockout-29.otf') format('opentype');
  }


body {background-color: #000;font-family: Arial, Helvetica, sans-serif;}
header {background-color: #191B26;height:3.25rem;}
header div {max-width:70rem;margin:0 auto;display: flex;align-items: center;justify-content: space-between;}
section {width: 70rem;margin: 0 auto;}
section > div {width: 29rem;color:#fff;}
section .fname {width:45%;float:left;}
section .lname {width:45%;float:right;}
section .birthdate {width:30%;clear: both;}
section label {color:#977959;margin-bottom:.375rem;display: inline-block;font-family: Knockout, Arial, Helvetica, sans-serif;font-size: 1.25rem;}
section input {width: 100%;margin-bottom: 1rem;background-color: #191B26;border:none;border-bottom: 1px solid #977959;color: #fff;height: 2.75rem;box-sizing: border-box;}
section button {background-color: #FF1746;border:none;color: #fff;font-family: Knockout, Arial, Helvetica, sans-serif;font-size: 1.25rem;width: 100%;height:2.75rem;cursor: pointer;}
section button.error {background-color: transparent;border: 2px solid #FF1746;color: #FF1746;}
section button.ok {background-color: #0AFABC;color:#191B26;border:none;}
#form p {font-size: .75rem;}
aside {position: absolute;top:3.25rem;right:0;z-index: -1;}

@media screen and (max-width: 70rem){
  header {width: 100%;}
  header div {width: 90%;}
  section {width:100%;}
  section > div {width:90%;margin:0 auto;}
  section label {display: block;}
  section .fname, section .lname, section .birthdate {float:none;width: 100%;}
  section button {width: 100%;margin:2rem 0;}

  aside {position: static;}
  aside img {width: 100%;height: auto;}
}