@font-face {
    font-family: 'Barmeno Regular';
    src: url('../fonts/Barmeno Regular.ttf') format('truetype');
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Barmeno Bold';
    src: url('../fonts/Barmeno Bold.otf') format('opentype');
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Barmeno Extra Bold';
    src: url('../fonts/Barmeno Extra Bold.otf') format('opentype');
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Myriad Pro Regular';
    src: url('../fonts/Myriad Pro Regular.ttf') format('truetype');
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Myriad Pro Semibold';
    src: url('../fonts/Myriad Pro Semibold.ttf') format('truetype');
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Myriad Pro Bold';
    src: url('../fonts/Myriad Pro Bold.ttf') format('truetype');
    font-style: normal;
    font-weight: 1000;
    font-display: swap;
}


/**************
    HEADING
**************/
h1 {
    font-family: 'Barmeno Extra Bold', serif !important;
    font-weight: 1000;
    font-size: 36px;
    text-transform: uppercase;
}
h2 {
    font-family: 'Myriad Pro Bold', serif !important;
    font-weight: 1000;
    font-size: 24px;
    text-transform: capitalize;
}
h3 {
    font-family: 'Barmeno Extra Bold', serif !important;
    font-weight: 1000;
    font-size: 24px;
    text-transform: uppercase;
}
h4 {
    font-family: 'Myriad Pro Bold', serif !important;
    font-weight: 700;
    text-transform: uppercase;
}
h5 {
    font-family: 'Myriad Pro Semibold', serif !important;
    font-weight: 700;
    text-transform: capitalize;
}
h4 {
    font-size: 24px !important;
}
h5 {
    font-size: 18px !important;
}
h6 {
    font-size: 16px !important;
}

/**************
    CONTENT
**************/
body, nav, ul, li,
p, li, span, a, label, button, input, textarea {
    font-family: 'Myriad Pro Regular', serif;
    font-weight: 400;
    font-size: 14px !important;
}

.ff-b-reg {
    font-family: 'Barmeno Regular', serif !important;
}
.ff-b-bold {
    font-family: 'Barmeno Bold', serif !important;
}
.ff-b-extra {
    font-family: 'Barmeno Extra Bold', serif !important;
}
.ff-m-reg {
    font-family: 'Myriad Pro Regular', serif !important;
}
.ff-m-bold {
    font-family: 'Myriad Pro Bold', serif !important;
}

/* xs: phone - portrait */
/* default */

/* sm: phone - landscape */
@media (min-width: 576px) {
}

/* md: tablet */
@media (min-width: 768px) {
    h1 {
        font-size: 64px !important;
    }
    h2 {
        font-size: 42px !important;
    }
    h3 {
        font-size: 24px !important;
    }
    h4 {
        font-size: 24px !important;
    }
    h5 {
        font-size: 16px !important;
    }
    h6 {
        font-size: 14px !important;
    }
}

/* lg: desktop */
@media (min-width: 992px) {
    h1 {
        font-size: 64px !important;
    }
    h2 {
        font-size: 42px !important;
    }
    h3 {
        font-size: 24px !important;
    }
    h4 {
        font-size: 24px !important;
    }
    h5 {
        font-size: 20px !important;
    }
    h6 {
        font-size: 18px !important;
    }

    body, nav, ul, li,
    p, li, span, a, label, button, input, textarea {
        font-size: 16px !important;
    }
    small {
        font-size: 14px !important;
    }
}

/* xl: wide */
@media (min-width: 1200px) {
}

/* super wide */
@media (min-width: 1440px) {
}