:root {
  /* Brand colours */
  --colorPrimary:          #0D00F1;
  --colorPrimaryDark:      #0e1c29;
  --colorPrimaryDarkish:   #162133;
  --colorPrimaryDarkFaded: #323d68;
  --colorPrimaryDarkDim:   #1a2e42;
  --colorAccent:           #00d4aa;

  /* Neutrals */
  --colorWhite:       #f6fbff;
  --colorLightestGrey:#f0f6fc;
  --colorGreyish:     #e8eef4;
  --colorGrey:        #c8d4dc;
  --colorDarkerGrey:  #8ca0b0;
  --colorDarkGrey:    #5a7080;
  --colorDarkestGrey: #2a4050;

  /* Spacing */
  --margin:          6%;
  --logo-margin:     7%;
  --buffer:          70px;
  --pad:             1.5rem;
  --space-x05:       0.5rem;
  --space-x1-smaller:0.75rem;
  --space-xl:        2rem;
  --space-2xl:       3.5rem;

  /* Type scale */
  --hf2:    2rem;
  --hf3:    1.5rem;
  --hf4:    1.1rem;
  --hf5:    0.9rem;
  --hfbody: 1rem;
}



@font-face {
    font-family: Open-Sans;
    src: local("Open Sans SemiBold"), local("OpenSans-SemiBold"),
         url(../fonts/OpenSans-SemiBold.ttf) format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Open-Sans;
    src: local("Open Sans Bold"), local("OpenSans-Bold"),
         url(../fonts/OpenSans-Bold.ttf) format("truetype");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Open-Sans;
    src: local("Open Sans Light"), local("OpenSans-Light"),
         url(../fonts/OpenSans-Light.ttf) format("truetype");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Open-Sans;
    src: local("Open Sans Regular"), local("OpenSans-Regular"),
         url(../fonts/OpenSans-Regular.ttf) format("truetype");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Komodo;
    src: local("Komodo"), local("KomodoLand"),
         url(../fonts/KomodoLand.ttf) format("truetype");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}