@font-face {
    font-family: 'Lora';
    src: url('font/Lora-VariableFont_wght.ttf') format("truetype-variations");
    font-weight: 400 700;
}
@font-face {
    font-family: 'Montserrat';
    src: url('font/Montserrat-VariableFont_wght.ttf') format("truetype-variations");
    font-weight: 400 700;
}
@font-face {
    font-family: 'Poppins';
    src: url('font/Poppins-VariableFont_wght.otf');
    font-weight: 400 700;
}
@font-face {
    font-family: 'Cormorant Garamond';
    src: url('font/CormorantGaramond-VariableFont_wght.ttf');
    font-weight: 400 700;
}



html { font-size: 18px; }
body { background-color: #FFFFFF; font-family: "Lora", sans-serif; }
html, body { margin: 0; }
h1, h2, h3, p, div {margin: 0; padding: 0; border: 0; color: black; text-shadow: none; text-align: left; }
h1, h2, h3, h4, p, li, div, span, input, select { color: rgb(27, 27, 27); }
h1, h2 { font-family: "Cormorant Garamond"; }

.pgCourse { margin: auto; }
.center { text-align: center; }
.flex { display: flex; }
.yellow { color: #FEA94C; }

.pgOuter { width: 100%; margin: 0; }
.pgInternal { 
    box-shadow: 0 0 0 1px #0000000d, 0 11px 20px #6c5e4117; 
    background-color: white;
    border-radius: 5px;
}

@media only screen and (max-width: 639px) {
    h1 { font-size: 2rem; line-height: 125%; margin-bottom: 0.6em; }
    h2 { font-size: 1.9rem; line-height: 140%; margin-bottom: 0.6em; padding-top: 0.8em; }
    h3, .h3size { font-size: 1rem; line-height: 160%; margin-bottom: 0.6em; padding-top: 0.8em; }
    h4 { font-size: 1.125rem; line-height: 1.6; margin-bottom: 0.6em; }
    p, li, div, span, a, button, input, select { font-size: 0.9rem; line-height: 1.5; margin-bottom: 1em; }
    div { margin-bottom: 0; }
    .pgOuter { padding-block: 60px; }
    .pgCourse { max-width: 100vw; padding-left: 1rem; padding-right: 1rem; }
    .pgInternal { padding: 20px; width: calc(90vw - 40px); margin-inline: auto; }
}


@media only screen and (min-width: 640px) {
    h1 { font-size: 3rem; line-height: 125%; margin-bottom: 0.6em; }
    h2 { font-size: 2.5rem; line-height: 150%; margin-bottom: 0.6em; padding-top: 0.8em; }
    h3, .h3size { font-size: 1.3rem; line-height: 160%; margin-bottom: 0.6em; padding-top: 0.8em; }
    h4 { font-size: 1.125rem; line-height: 1.6; margin-bottom: 0.6em; }
    p, li, div, span, a, button, input, select { font-size: 1rem; line-height: 1.6; margin-bottom: 1em; }
    div { margin-bottom: 0; }
    .pgOuter { padding-block: 60px 80px; }
    .pgExtraSize { padding-top: 120px !important; padding-bottom: 120px !important; }
    .pgCourse { max-width: 640px; padding-left: 2rem; padding-right: 2rem; }
    .fa-star { font-size: 12px; }
    .pgNarrow, .pgInternal { max-width: 940px; }
    .pgInternal { padding: 50px; }
}
