/* Font Declaration */
@font-face {
    font-family: "Crimson";
    src: url("../../../fonts/Crimson_Text/CrimsonText-Bold.ttf");
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: "Crimson";
    src: url("../../../fonts/Crimson_Text/CrimsonText-SemiBold.ttf");
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: "Crimson";
    src: url("../../../fonts/Crimson_Text/CrimsonText-Regular.ttf");
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Source";
    src: url("../../../fonts/Source_Sans_Pro/SourceSansPro-SemiBold.ttf");
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: "Source";
    src: url("../../../fonts/Source_Sans_Pro/SourceSansPro-Regular.ttf");
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Source";
    src: url("../../../fonts/Source_Sans_Pro/SourceSansPro-Light.ttf");
    font-weight: 300;
    font-display: swap;
}

/* Class Base */
.source-light {
    font-family: "Source";
    font-style: normal;
    font-weight: 300;
}

.source-regular {
    font-family: "Source";
    font-style: normal;
    font-weight: 400;
}

/* Syntax Base */
h1 {
    font-family: "Crimson";
    font-style: normal;
    font-weight: bold;
    font-size: 3rem;
    color: #0f0f0e;
}

h2 {
    font-family: "Crimson";
    font-style: normal;
    font-weight: 600;
    font-size: 2.25rem;
    color: #0f0f0e;
}

h3 {
    font-family: "Crimson";
    font-style: normal;
    font-weight: normal;
    font-size: 1.5rem;
    color: #0f0f0e;
}

h4 {
    font-family: "Source";
    font-style: normal;
    font-weight: 600;
    font-size: 1.25rem;
    color: #0f0f0e;
}

p {
    font-family: "Source";
    font-style: normal;
    font-weight: 300;
    font-size: 1rem;
    line-height: 150%;
    color: #0f0f0e;
}

span {
    font-family: "Source";
    font-style: normal;
    font-weight: 300;
    font-size: 0.9375rem;
    line-height: 150%;
    color: #0f0f0e;
}

/* Responsive Font */

@media only screen and (max-width: 998px) {
    h1 {
        font-size: 2rem;
    }
    h2 {
        font-size: 1.5rem;
    }
    h3 {
        font-size: 1.25rem;
    }
    h4 {
        font-size: 1rem;
    }
    p {
        font-size: 0.9375rem;
        font-weight: 400;
    }
    span{
        font-size: 0.875rem;
        font-weight: 400;
    }
}

.font-icon {
    font-size: 30px;
}
