
@font-face {
    font-family: "Circe-Lighter";
    src: url('/fonts/CRC25.otf') format('opentype');
    font-weight: normal;
}

@font-face {
    font-family: "Circe-Light";
    src: url('/fonts/CRC35.otf') format('opentype');
    font-weight: normal;
}

@font-face {
    font-family: "Circe-Normal";
    src: url('/fonts/CRC55.otf') format('opentype');
    font-weight: normal;
}

@font-face {
    font-family: "Circe-Bold";
    src: url('/fonts/CRC65.otf') format('opentype');
    font-weight: normal;
}

@font-face {
    font-family: "Circe-Bolder";
    src: url('/fonts/CRC75.otf') format('opentype');
    font-weight: normal;
}

:root {
    --circe-lighter: 'Circe-Lighter', sans-serif;
    --circe-light: 'Circe-Light', sans-serif;
    --circe: 'Circe-Normal', sans-serif;
    --circe-bold: 'Circe-Bold', sans-serif;
    --circe-bolder: 'Circe-Bolder', sans-serif;
    --fluent-font-family-base: 'Circe-Normal', Arial, sans-serif;
    --body-font: 'Circe-Normal', sans-serif !important;
}

body {
    font-family: var(--circe);
/*    font-weight: normal;*/
    color: #111;
}

.ligher {
    font-family: var(--circe-lighter) !important;
}

.light {
    font-family: var(--circe-light) !important;
}

.bold {
    font-family: var(--circe-bold) !important;
}

.bolder {
    font-family: var(--circe-bolder) !important;
}


/*--------------------------------------------------------------------------------------------------------------------
 *     TEXT SIZES:
 *-------------------------------------------------------------------------------------------------------------------*/


h1, h2, h3, h4, h5, h6, p, span {
    font-weight: normal;
    line-height: 120%!important;
    margin: 0;
}

h1 {
    font-size: 5rem !important;
/*    line-height: 4.5rem !important;*/
}

h2 {
    font-size: 4rem !important; /* 64px */
/*    line-height: 3.5rem !important;*/
}

h3 {
    font-size: 3rem !important; /* 48px */
/*    line-height: 3rem !important;*/
}

h4 {
    font-size: 2.5rem !important; /* 40px */
/*    line-height: 2.5rem !important;*/
}

h5 {
    font-size: 2rem !important; /* 32px */
/*    line-height: 2rem !important;*/
}

h6 {
    font-size: 1.5rem !important; /* 24px */
/*    line-height: 1.5rem !important;*/
}

p {
    font-size: 1.1rem !important; /* 17.6px */
}

button {
    font-size: 1rem !important; /* 16px */
}


/* Mobile text sizes */
@media (max-width: 767px) {
    h1 {
        font-size: 2.5rem !important;
/*        line-height: 2.25rem !important;*/
    }

    h2 {
        font-size: 2.25rem !important; /* 28px */
/*        line-height: 2.25rem !important;*/
    }

    h3 {
        font-size: 2rem !important; /* 24px */
/*        line-height: 2rem !important;*/
    }

    h4 {
        font-size: 1.75rem !important; /* 20px */
/*        line-height: 1.75rem !important;*/
    }

    h5 {
        font-size: 1.5rem !important; /* 17.6px */
/*        line-height: 1.5rem !important;*/
    }

    h6 {
        font-size: 1.25rem !important; /* 16px */
/*        line-height: 1.25rem !important;*/
    }

    p {
        font-size: 1rem !important; /* 12px */
    }

    button {
        font-size: 1rem !important; /* 16px */
    }
}
