:root {
    /* -=- Positioning & Display -=- */
    /* Gap */
    --gap-tiny: 0.25rem;
    --gap-extra-small: 0.5rem;
    --gap-small: 0.75rem;
    --gap-medium: 1rem;
    --gap-large: 1.5rem;
    --gap-extra-large: 2rem;
    --gap-xxl: 3rem;


    /* -=- Dimensions, marges, padding and borders -=- */
    /* Marges */
    --margin-tiny: 0.25rem;
    --margin-extra-small: 0.5rem;
    --margin-small: 0.75rem;
    --margin-medium: 1rem;
    --margin-large: 1.5rem;
    --margin-extra-large: 2rem;
    --margin-xxl: 3rem;

    /* Padding */
    --padding-tiny: 0.25rem;
    --padding-extra-small: 0.5rem;
    --padding-small: 0.75rem;
    --padding-medium: 1rem;
    --padding-large: 1.5rem;
    --padding-extra-large: 2rem;
    --padding-xxl: 3rem;

    /* Border radius */
    --border-radius-small: 0.25rem;
    --border-radius-medium: 0.5rem;
    --border-radius-large: 0.75rem;

    /* Border width */
    --border-width-regular: 0.0625rem;
    --border-width-thick: 0.125rem;

    /* Border color */
    --border-color-default: #E7E5F1;



    /* -=- Typography -=- */
    /* Font size */
    --font-size-heading-1: 2.5rem;
    --font-size-heading-2: 2rem;
    --font-size-heading-3: 1.5rem;
    --font-size-heading-4: 1.3125rem;
    --font-size-heading-5: 1.3125rem;
    --font-size-paragraph: 1.125rem;
    --font-size-paragraph-small: 1rem;
    --font-size-small: 0.75rem;
    --font-size-table-heading: 0.875rem;
    --font-size-table-footer: 0.875rem;
    --font-size-button: 1rem;
    --font-size-button-small: 0.8125rem;

    /* Line height */
    /*
    *   From parent  
    */
    /*
    --line-height-heading-1: 3.75rem;
    --line-height-heading-2: 3rem;
    --line-height-heading-3: 2.25rem;
    --line-height-heading-4: 1.96875rem;
    --line-height-heading-5: 1.96875rem;
    --line-height-paragraph: 1.5rem;
    --line-height-paragraph-small: 1.375rem;
    --line-height-table-heading: 1.375rem;
    --line-height-table-footer: 1.375rem;
    --line-height-button: 1.5rem;
    --line-height-button-small: 1.25rem;
    */

    /* Font family */
    --font-family-primary: 'Montserrat';
    --font-family-secondary: 'Helvetica';
    --font-family-tertiary: 'Montserrat';



    /* -=- Visual effects and animations -=- */
    /* Shadows */
    --shadow-shallow: 0.125rem 0.125rem 0.25rem 0 rgba(0, 0, 0, 0.1);
    --shadow-deep: 0.5rem 0.5rem 1rem 0 rgba(0, 0, 0, 0.15);



    /* -=- Other -=- */
    /* Aspect ratio */
    --image-aspect-ratio-default: 16 / 9;

    /* Colors */
    --color-body: #2D2B42;
    --color-primary: #44C8F5;
    --color-primary-subtle: #BCEBFB;
    --color-primary-border: #80DAF8;
    --color-primary-text: #2D2B42;
    --color-secondary: #7E78B8;
    --color-secondary-subtle: #D1CEE5;
    --color-secondary-border: #A7A3CF;
    --color-secondary-text: #2D2B42;
    --color-tertiary: #DBD9EB;
    --color-tertiary-subtle: #F2F1F8;
    --color-tertiary-border: #E7E5F1;
    --color-tertiary-text: #2D2B42;
    --color-emphasis: #6969FF;
    --color-success: #51BF9D;
    --color-success-subtle: #C0E8DC;
    --color-success-border: #89D3BC;
    --color-success-text: #2D2B42;
    --color-danger: #F06793;
    --color-danger-subtle: #FAC8D8;
    --color-danger-border: #F598B6;
    --color-danger-text: #2D2B42;
    --color-warning: #FCBA63;
    --color-warning-subtle: #FEE6C7;
    --color-warning-border: #FDD095;
    --color-warning-text: #2D2B42;
    --color-info: #7E78B8;
    --color-info-subtle: #D1CEE5;
    --color-info-border: #A7A3CF;
    --color-info-text: #6A659B;
    --color-light: #FAF9FC;
    --color-light-subtle: #FFFFFF;
    --color-light-border: #E7E5F1;
    --color-light-text: #9594A0;
    --color-dark: #2D2B42;
    --color-dark-subtle: #56527D;
    --color-dark-border: #A7A3CF;
    --color-dark-text: #6A659B;
    --color-border: #DBD9EB;

    --color-primary-tint-10: #ECEBF5;
    --color-primary-tint-50: #DBD9EB;
    --color-primary-tint-100: #D1CEE5;
    --color-primary-tint-200: #BCB9DA;
    --color-primary-tint-300: #A7A3CF;
    --color-primary-tint-400: #938EC3;
    --color-primary-tint-500: #7E78B8;
    --color-primary-tint-600: #6A659B;
    --color-primary-tint-700: #56527D;
    --color-primary-tint-800: #423E60;
    --color-primary-tint-900: #2D2B42;
    --color-secondary-tint-10: #E4F7FD;
    --color-secondary-tint-50: #CBF0FC;
    --color-secondary-tint-100: #BCEBFB;
    --color-secondary-tint-200: #9EE2FA;
    --color-secondary-tint-300: #80DAF8;
    --color-secondary-tint-400: #62D1F7;
    --color-secondary-tint-500: #44C8F5;
    --color-secondary-tint-600: #39A8CE;
    --color-secondary-tint-700: #2E88A7;
    --color-secondary-tint-800: #23687F;
    --color-secondary-tint-900: #184858;
    --color-tertiary-tint-10: #FAF9FC;
    --color-tertiary-tint-50: #F5F4F9;
    --color-tertiary-tint-100: #F2F1F8;
    --color-tertiary-tint-200: #ECEBF5;
    --color-tertiary-tint-300: #E7E5F1;
    --color-tertiary-tint-400: #E1DFEE;
    --color-tertiary-tint-500: #DBD9EB;
    --color-tertiary-tint-600: #B8B6C5;
    --color-tertiary-tint-700: #9594A0;
    --color-tertiary-tint-800: #72717A;
    --color-tertiary-tint-900: #4F4E55;
    --color-success-tint-10: #E6F6F1;
    --color-success-tint-50: #CEEDE4;
    --color-success-tint-100: #C0E8DC;
    --color-success-tint-200: #A5DECC;
    --color-success-tint-300: #89D3BC;
    --color-success-tint-400: #6DC9AD;
    --color-success-tint-500: #51BF9D;
    --color-success-tint-600: #44A084;
    --color-success-tint-700: #37826B;
    --color-success-tint-800: #2A6352;
    --color-success-tint-900: #1D4539;
    --color-danger-tint-10: #FDE9EF;
    --color-danger-tint-50: #FBD4E1;
    --color-danger-tint-100: #FAC8D8;
    --color-danger-tint-200: #F7B0C7;
    --color-danger-tint-300: #F598B6;
    --color-danger-tint-400: #F27FA4;
    --color-danger-tint-500: #F06793;
    --color-danger-tint-600: #CA577B;
    --color-danger-tint-700: #A34664;
    --color-danger-tint-800: #7D364C;
    --color-danger-tint-900: #562535;
    --color-warning-tint-10: #FEF5E8;
    --color-warning-tint-50: #FEECD3;
    --color-warning-tint-100: #FEE6C7;
    --color-warning-tint-200: #FDDBAE;
    --color-warning-tint-300: #FDD095;
    --color-warning-tint-400: #FCC57C;
    --color-warning-tint-500: #FCBA63;
    --color-warning-tint-600: #D49C53;
    --color-warning-tint-700: #AB7E43;
    --color-warning-tint-800: #836133;
    --color-warning-tint-900: #5B4324;
    --color-info-tint-10: #ECEBF5;
    --color-info-tint-50: #DBD9EB;
    --color-info-tint-100: #D1CEE5;
    --color-info-tint-200: #bcb9d7;
    --color-info-tint-300: #A7A3CF;
    --color-info-tint-400: #938EC3;
    --color-info-tint-500: #7E78B8;
    --color-info-tint-600: #6A659B;
    --color-info-tint-700: #56527D;
    --color-info-tint-800: #423E60;
    --color-info-tint-900: #2D2B42;
    --color-light-tint-10: #FFFFFF;
    --color-light-tint-10-rgba: rgba(255,255,255,1);
    --color-light-tint-50: #FCFCFD;
    --color-light-tint-100: #F5F4F9;
    --color-light-tint-200: #F2F1F8;
    --color-light-tint-300: #ECEBF5;
    --color-light-tint-400: #E7E5F1;
    --color-light-tint-500: #DBD9EB;
    --color-light-tint-600: #B8B6C5;
    --color-light-tint-700: #9594A0;
    --color-light-tint-800: #72717A;
    --color-light-tint-900: #4F4E55;
    --color-dark-tint-10: #ECEBF5;
    --color-dark-tint-50: #DBD9EB;
    --color-dark-tint-100: #D1CEE5;
    --color-dark-tint-200: #7E78B8;
    --color-dark-tint-300: #A7A3CF;
    --color-dark-tint-400: #938EC3;
    --color-dark-tint-500: #7E78B8;
    --color-dark-tint-600: #6A659B;
    --color-dark-tint-700: #56527D;
    --color-dark-tint-800: #423E60;
    --color-dark-tint-900: #2D2B42;

    /* Newsletter colors */
    --color-examenblad: #007bc7;
    --image-examenblad: url('../images/sources/logo_bron_rijksoverheid.png');
    --color-nos: #c00;
    --image-nos: url('../images/sources/logo_bron_nos.png');
    --color-telegraaf: #27509a;
    --image-telegraaf: url('../images/sources/logo_bron_telegraaf.png');
    --color-parool: #111;
    --image-parool: url('../images/sources/logo_bron_parool.png');
    --color-volkskrant: #3f97aa;
    --image-volkskrant: url('../images/sources/logo_bron_volkskrant.png');
    --color-ad: #d10a10;
    --image-ad: url('../images/sources/logo_bron_ad.png');
    --color-rijksoverheid: #01689b;
    --image-rijksoverheid: url('../images/sources/logo_bron_rijksoverheid.png');
    --color-nrc: #000;
    --image-nrc: url('../images/sources/logo_bron_nrc.png');
    --color-trouw: #95885f;
    --image-trouw: url('../images/sources/logo_bron_trouw.png');
    --color-rtlnieuws: #b3d4fc;
    --image-rtlnieuws: url('../images/sources/logo_bron_rtlnieuws.png');
    --color-nu: #010050;
    --image-nu: url('../images/sources/logo_bron_nu.png');
    --color-hartvannederland: #008cff;
    --image-hartvannederland: url('../images/sources/logo_bron_hartvannederland.png');
    --color-omroepbrabant: #e00;
    --image-omroepbrabant: url('../images/sources/logo_bron_omroepbrabant.png');
    --color-leeuwardercourant: #5059b3;
    --image-leeuwardercourant: url('../images/sources/logo_bron_leeuwardercourant.png');
    --color-degelderlander: #d10a10;
    --image-degelderlander: url('../images/sources/logo_bron_degelderlander.png');
    --color-tubantia: #d10a10;
    --image-tubantia: url('../images/sources/logo_bron_tubantia.png');
    --color-bndestem: #d10a10;
    --image-bndestem: url('../images/sources/logo_bron_bndestem.png');
    --color-metronieuws: #34c600;
    --image-metronieuws: url('../images/sources/logo_bron_metronieuws.png');
    --color-nhnieuws: #0ba3e1;
    --image-nhnieuws: url('../images/sources/logo_bron_nhnieuws.png');

    /* Fonts */
    --fontawesome-fontname: "Font Awesome 5 Free";

    /* System variables */
    --preheader-background: var(--color-warning-tint-500);
    --preheader-color: var(--color-body);

    --homepage-band-color: var(--color-secondary-tint-500);
}