/* FONT IMPORTS */
@font-face {
    font-family: 'Aeonik';
    src: url('/fonts/Aeonik-Regular.woff2') format('woff2'),
         url('/fonts/Aeonik-Regular.woff') format('woff'),
         url('/fonts/Aeonik-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Aeonik';
    src: url('/fonts/Aeonik-Medium.woff2') format('woff2'),
         url('/fonts/Aeonik-Medium.woff') format('woff'),
         url('/fonts/Aeonik-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'SangBleu';
    src: url('/fonts/SangBleuKingdom-Regular-WebXL.woff2') format('woff2'),
         url('/fonts/SangBleuKingdom-Regular-WebXL.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'SangBleu';
    src: url('/fonts/SangBleuKingdom-Medium-WebXL.woff2') format('woff2'),
         url('/fonts/SangBleuKingdom-Medium-WebXL.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}


:root{
    --white: #FFFFFF;
    --pink: #FF00E6;
    --black: #000000;
    --light-grey: #d9d9d9;

    --text-size: 11px;
    --text-lineheight: 13px;

    --subheading-size: 13px;
    --subheading-lineheight: 16px;

    --heading-size: 24px;
    --heading-lineheight: 28px;
}

html{
    background-color: var(--black);
}

body {
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url("/images/illustrations/image12.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    color: var(--black);
    font-family: 'Aeonik', sans-serif;
}

/* tekst (Aeonik Regular) */
p, a {
    font-family: 'Aeonik', sans-serif;
    font-weight: 400;
    font-size: var(--text-size);
    line-height: var(--text-lineheight);
    color: var(--black);
}


/* functionele subheadings (Aeonik Medium) */
h2, h3, h4, h5 {
    font-family: 'Aeonik', sans-serif;
    font-weight: 500;
    font-size: var(--subheading-size);
    line-height: var(--subheading-lineheight);
}


/* main headings (SangBleu Medium) */
h1 {
    font-family: 'SangBleu', serif;
    font-weight: 500;
    font-size: var(--heading-size);
    line-height: var(--heading-lineheight);
}


/* highlighted */
.quote {
    font-family: 'SangBleu', serif;
    font-weight: 400;
    font-size: var(--heading-size);
    line-height: var(--heading-lineheight);
}


/* highlighted */
.highlight {
    color: var(--pink);
    font-family: 'Aeonik', sans-serif;
    font-weight: 500;
}