@font-face {
    font-family: Stratos;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/Stratos-Regular/Stratos-Regular.eot?) format("eot"), url(../fonts/Stratos-Regular/Stratos-Regular.woff2) format("woff2"), url(../fonts/Stratos-Regular/Stratos-Regular.woff) format("woff"), url(../fonts/Stratos-Regular/Stratos-Regular.ttf) format("truetype")
}

body {
    font-family: Stratos, sans-serif;
    color: #04121b;
}

.font-secondary {
    color: rgba(4,18,27,.48);
}

.font-secondary {
    color: rgba(4,18,27,.48);
}

/* desktop */
.font-heading-xl {
    font-size: 40px;
    line-height: 48px;
    letter-spacing: -0.5px;
}

.font-heading-l {
    font-size: 32px;
    line-height: 40px;
    letter-spacing: -0.3px;
}

.font-heading-m {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -0.2px;
}

.font-heading-s {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.15px;
}

.font-text-xxl {
    font-size: 32px;
    line-height: 40px;
    letter-spacing: -0.1px;
}

.font-text-xl {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -0.1px;
}

.font-text-l2 {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.05px;
}

.font-text-l {
    font-size: 18px;
    line-height: 26px;
    letter-spacing: -0.05px;
}

.font-text-m {
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
}

.font-caption-m {
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0;
}

.font-caption-s {
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0;
}

/* mobile */
@media only screen and (max-width: 752px) {
    .font-heading-xl {
        font-size: 28px;
        line-height: 32px;
        letter-spacing: -0.25px;
    }

    .font-heading-l {
        font-size: 24px;
        line-height: 30px;
        letter-spacing: -0.2px;
    }

    .font-heading-m {
        font-size: 22px;
        line-height: 28px;
        letter-spacing: -0.15px;
    }

    .font-heading-s {
        font-size: 20px;
        line-height: 26px;
        letter-spacing: -0.15px;
    }

    .font-text-xxl {
        font-size: 24px;
        line-height: 30px;
        letter-spacing: -0.1px;
    }

    .font-text-xl {
        font-size: 22px;
        line-height: 28px;
        letter-spacing: -0.05px;
    }

    .font-text-l2 {
        font-size: 20px;
        line-height: 26px;
        letter-spacing: -0.05px;
    }

    .font-text-l {
        font-size: 18px;
        line-height: 24px;
        letter-spacing: -0.05px;
    }

    .font-text-m {
        font-size: 16px;
        line-height: 22px;
        letter-spacing: 0;
    }

    .font-caption-m {
        font-size: 16px;
        line-height: 22px;
        letter-spacing: 0;
    }

    .font-caption-s {
        font-size: 14px;
        line-height: 18px;
        letter-spacing: 0;
    }
}