/* Fonts */
/* -> Fleur De Leah - for italics */
@font-face {
    font-family: 'FleurDeLeah';
    font-display: optional;
    src: url('fonts/FleurDeLeah/fleurdeleah-regular-webfont.woff2') format('woff2'),
    url('fonts/FleurDeLeah/fleurdeleah-regular-webfont.woff') format('woff');
    
    font-style: italic;
}

/* -> Comorant - the base font */
@font-face {
    font-family: "Comorant";
    font-display: optional;
    src: url("fonts/Cormorant/Cormorant-Regular.ttf");
    font-style: normal;
}

@font-face {
    font-family: "Comorant";
    font-display: optional;
    src: url("fonts/Cormorant/Cormorant-Bold.ttf");
    font-style: normal;
    font-weight: bold;
}

/* Victor-Mono - for code */
@font-face {
    font-family: "VictorMono";
    font-display: optional;
    src: url('fonts/VictorMono/WOFF2/VictorMono-Regular.woff2') format('woff2'),
    url('fonts/VictorMono/WOFF/VictorMono-Regular.woff') format('woff');
    font-style: normal;
}

@font-face {
    font-family: "VictorMono";
    font-display: optional;
    src: url('fonts/VictorMono/WOFF2/VictorMono-Italic.woff2') format('woff2'),
    url('fonts/VictorMono/WOFF/VictorMono-Italic.woff') format('woff');
    font-style: italic;
}

/* Color Scheme */
:root {
    --dark-background: #191308;
    --dark-background-l: #322A26;
    --dark-foreground: #9CA3DB;
    /* --dark-foreground-l:#454B66; */
    --dark-foreground-l: #46A6B4;
    /* --dark-main-headings: #677DB7; */
    --dark-main-headings: #C8CFE5;
}

* {
    box-sizing: border-box;
    margin: 0 0;
    padding: 0 0;
}

body {
    font-family: "Cormorant", Times, serif;
    font-size: 24px;
    background: var(--dark-background);
    color: var(--dark-foreground);
    margin: 0 auto;
    padding: 1.6em;
}

p {
    color: var(--dark-foreground);
}


em,
strong {
    color: var(--dark-foreground-l)
}

em {
    font-family: 'FleurDeLeah', serif;
    font-size: 1.3em;
}

strong {
    font-weight: bold;
}

h1 {
    font-family: "FleurDeLeah", serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--dark-main-headings);
    margin-top: 1.61em;
}

p {
    margin-top: 0.8em;
}

ul, ol {
    margin-left: 1.61em;
}

ol {
    list-style-type: lower-greek;
}

img {
    max-width: 100%;
}

code {
    font-family: "VictorMono", monospace;
    font-size: 20px;
    color: pink;
}

/* Media queries */
@media only screen and (max-width: 400px) {
    body {
        width: 400px;
    }
}

@media only screen and (min-width: 401px) and (max-width: 960px) {
    body {
        width: auto;
    }
}

@media only screen and (min-width: 960px) {
    body {
        width: 960px;
    }
}