/* # wordt gebruikt om een specifiek HTML-element te selecteren op basis van zijn id-attribuut. 
Bijvoorbeeld,als je een element hebt met id="header",zou je het kunnen selecteren met #header in CSS.

. wordt gebruikt om elementen te selecteren op basis van hun class-attribuut. 
Als je bijvoorbeeld een element hebt met class="button",zou je het kunnen selecteren met .button in CSS. */
:root {
    --lichtblauw:#0097c5;
    --donkerblauw:#045872;
    --wit:#ffffff;
    --grijswit:#ffffffd0;
  }
  .form-group {
    margin-bottom:10px;
  }
  label {
    display:inline-block;
    width:150px;
  }
  input[type="text"],input[type="password"] {
    width:20%;
    padding:5px;
    border:1px solid var(--lichtblauw);
    border-radius:5px;
  }
  .inlogknop {
    background-color:#0097c5;
    color:white;
    padding:15px 25px;
    border:none;
    cursor:pointer;
    border-radius:10px;
    margin:5px;
    font-size:16px;
    transition:background-color 0.3s ease;
  }
  .inlogknop:hover {
    background-color:#045872;
  }
  body {
    font-family:'Montserrat',Arial,Helvetica,sans-serif;
    text-align:center;
    margin:0;
    border:#045872;
    border-radius:20px;
    border-width:2px;
  }
  .contentWrapper {
    max-width:1000px;
    margin:0 auto;
    padding:0px;
    background-color:var(--wit);
    padding-bottom:40px;
  }
  h1 {
    font-size:40px;
  }
  h2 {
    font-size:25px;
  }
  p {
    font-size:20px;
  }
  .space-bottom {
    margin-bottom:50px;
  }