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

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

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

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

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

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

/* Utilities  */
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
li {
    line-height: normal !important;
}
/* End Utilities  */

/* 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;
}

.header-1 {
    font-family: "Crimson";
    font-style: normal;
    font-size: 28px;
}

.header-2 {
    font-family: "Crimson";
    font-style: normal;
    font-size: 24px;
}

.header-3 {
    font-family: "Crimson";
    font-style: normal;
    font-size: 20px;
}

.body-1 {
    font-family: "Source";
    font-style: normal;
    font-weight: 400;
    font-size: 1rem;
}

/* 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;
    }
}

@media only screen and (max-width: 767.98px) {
    .header-1 {
        font-size: 26px;
    }

    .header-2 {
        font-size: 19px;
    }

    .header-3 {
        font-size: 17px;
    }

    .body-1 {
        font-size: 14px;
    }

    .body-2 {
        font-size: 10px;
    }
}

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