/* Regular */
@font-face {
    font-family: "libertine";
    src: url("/asset/font/LinLibertine_R.ttf");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Regular Italic */
@font-face {
    font-family: "libertine";
    src: url("/asset/font/LinLibertine_RI.ttf");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

/* Medium */
@font-face {
    font-family: "libertine";
    src: url("/asset/font/LinLibertine_RZ.ttf");
    font-weight: medium;
    font-style: normal;
    font-display: swap;
}

/* Medium Italic */
@font-face {
    font-family: "libertine";
    src: url("/asset/font/LinLibertine_RZl.ttf");
    font-weight: medium;
    font-style: italic;
    font-display: swap;
}

/* Bold */
@font-face {
    font-family: "libertine";
    src: url("/asset/font/LinLibertine_RB.ttf");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

/* Bold Italic */
@font-face {
    font-family: "libertine";
    src: url("/asset/font/LinLibertine_RBI.ttf");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

/* Light */
@font-face {
    font-family: "libertine";
    src: url("/asset/font/LinLibertine_DR.ttf");
    font-weight: light;
    font-style: normal;
    font-display: swap;
}

/* Light */
@font-face {
    font-family: "libertine";
    src: url("/asset/font/LinLibertine_aDRL.ttf");
    font-weight: light;
    font-style: italic;
    font-display: swap;
}



/* Title */
@font-face {
    font-family: "libertine-title";
    src: url("/asset/font/LinLibertine_aS.ttf");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Title Italic */
@font-face {
    font-family: "libertine-title";
    src: url("/asset/font/LinLibertine_aSI.ttf");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}


/* Bold Title */
@font-face {
    font-family: "libertine-title";
    src: url("/asset/font/LinLibertine_aBS.ttf");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

/* Bold Title Italic */
@font-face {
    font-family: "libertine-title";
    src: url("/asset/font/LinLibertine_aSZI.ttf");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}


@font-face {
    font-family: "baskerville";
    src: url("/asset/font/LibreBaskerville-Regular.ttf");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "baskerville";
    src: url("/asset/font/LibreBaskerville-Bold.ttf");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "baskerville";
    src: url("/asset/font/LibreBaskerville-Italic.ttf");
    font-style: italic;
    font-display: swap;
}

:root {
    --mobile-break: 900px;

    --color-text: #353535;
    --color-text-light: #444455;

    --color-shadow: #00000011;

    --color-background: #fffefe;
    --color-background-light: #eeeded;
    --color-highlight: #bbbbffff;

    --col-charcoal: #232323;
    --col-graphite: #353535;
    --col-teal: #3c6e71;
    --col-blue: #0A3161;
    --col-white: #ffffff;
    --col-gray: #d9d9d9;
    --col-red-light: #e25a5f;
    --col-red: #910D0D;
    --col-red-dark: #4a0d0f;
}


html {
    font-family: libertine;
    color: var(--color-text);
}

body {
    padding: 0px;
    margin: 0px;
    font-size: 22px;
    text-shadow: 2px 2px 2px var(--color-shadow);
    background: #FFFFFF;
    background: linear-gradient(90deg, rgba(255, 255, 255, 1) 20%, rgba(238, 237, 237, 1) 50%, rgba(255, 255, 255, 1) 80%);}

.page-content {
    max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 32px;
	padding: 16px 48px 48px 48px;
}

h1 {
    font-size: 3em;
    text-shadow: 4px 4px 1px var(--color-shadow);
}

h2 {
    font-size: 2em;
    text-shadow: 3px 3px 1px var(--color-shadow);
}

h3 {
    font-size: 1.5em;
    text-shadow: 2px 2px 1px var(--color-shadow);
    margin: 32px 0px 16px 0px;
}

li {
    font-size: 1em;
}

p {
    font-size: 1em;
}

.date {
    font-size: 0.8em;
    font-style: italic;
    margin: 0px 0px 32px 0px;
}

a {
    color: var(--color-text);
}

a:hover {
    color: var(--color-text-light);
}

.strong {
    font-family: baskerville;
    font-weight: bold;
    color: darkblue;
}

@media (max-width: 900px) {
    .page-content {
        padding: 16px 16px 16px 16px;
    }
}