/* =========================================================
   MODORA GLOBAL TYPOGRAPHY V1
   One font system: Manrope
========================================================= */

:root {
    --modora-font:
        "Manrope",
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Arial,
        sans-serif;
}


/* Base */
html,
body {
    font-family:var(--modora-font) !important;
}


/* Standard text elements */
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body p,
body a,
body li,
body label,
body button,
body input,
body select,
body textarea,
body option,
body table,
body th,
body td,
body strong,
body b,
body small {
    font-family:var(--modora-font) !important;
}


/* Forms */
body button,
body input,
body select,
body textarea {
    font-family:var(--modora-font) !important;
}


/* =========================================================
   MODORA HOMEPAGE
========================================================= */

body .mv21,
body .mv21 h1,
body .mv21 h2,
body .mv21 h3,
body .mv21 h4,
body .mv21 p,
body .mv21 a,
body .mv21 button,
body .mv21 input {
    font-family:var(--modora-font) !important;
}


/* =========================================================
   CATEGORY / CATALOG
   Override old Georgia declarations
========================================================= */

body.product-category-20
.content-top-breadcum h1,

body.product-category-20
#content > h1,

body.product-category-20
.category-title h1,

body.product-category-20
h1.page-title,

body.product-category-20
#column-left h2,

body.product-category-20
#column-left .box-heading,

body.product-category-20
.product-items .price-new,

body.product-category-20
.product-items .price,

body.product-category-20
.product-items .caption h2,

body.product-category-20
.product-items .caption h2 a,

body.product-category-20
a.subcat2 .subcat_title {
    font-family:var(--modora-font) !important;
}


/* Editorial headings remain premium through weight/spacing,
   not by switching to another font family */
body.product-category-20
.content-top-breadcum h1,

body.product-category-20
#content > h1 {
    font-weight:600 !important;
    letter-spacing:-2.2px !important;
}


/* Product price */
body.product-category-20
.product-items .price-new {
    font-weight:700 !important;
    letter-spacing:-.25px !important;
}


/* Product names */
body.product-category-20
.product-items .caption h2,
body.product-category-20
.product-items .caption h2 a {
    font-weight:500 !important;
}


/* Filter headings */
body.product-category-20
#column-left .box-heading {
    font-weight:700 !important;
    letter-spacing:-.1px !important;
}


/* =========================================================
   IMPORTANT:
   Do NOT override icon fonts
========================================================= */

body .fa,
body [class^="fa-"],
body [class*=" fa-"],
body .glyphicon {
    font-family:
        FontAwesome,
        "Glyphicons Halflings" !important;
}


/* =========================================================
   MODORA GLOBAL
   Remove legacy empty mobile header space
========================================================= */

@media(max-width:979px) {

    body {
        margin-top:0 !important;
        padding-top:0 !important;
    }

    body header {
        margin-top:0 !important;
        padding-top:0 !important;
    }

    body header .headertop {
        margin-top:0 !important;
        padding-top:0 !important;
    }

    body header
    .headertop > .container,
    body header
    .headertop > .container > .row {
        margin-top:0 !important;
        padding-top:0 !important;
    }

    /*
     * Legacy desktop utility area.
     * On mobile it leaves an empty block above MODORA.
     */
    body header
    .headertop .header-left {
        display:none !important;

        width:0 !important;
        height:0 !important;
        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;

        overflow:hidden !important;
    }

    body header
    .headertop .headerinner.header-logo {
        margin-top:0 !important;
        padding-top:0 !important;
    }
}


/* =========================================================
   MODORA GLOBAL
   Remove legacy empty mobile header space
========================================================= */

@media(max-width:979px) {

    body {
        margin-top:0 !important;
        padding-top:0 !important;
    }

    body header {
        margin-top:0 !important;
        padding-top:0 !important;
    }

    body header .headertop {
        margin-top:0 !important;
        padding-top:0 !important;
    }

    body header
    .headertop > .container,
    body header
    .headertop > .container > .row {
        margin-top:0 !important;
        padding-top:0 !important;
    }

    /*
     * Legacy desktop utility area.
     * On mobile it leaves an empty block above MODORA.
     */
    body header
    .headertop .header-left {
        display:none !important;

        width:0 !important;
        height:0 !important;
        min-height:0 !important;

        margin:0 !important;
        padding:0 !important;

        overflow:hidden !important;
    }

    body header
    .headertop .headerinner.header-logo {
        margin-top:0 !important;
        padding-top:0 !important;
    }
}


/* =========================================================
   MODORA GLOBAL V1.2
   Stable mobile sticky header
========================================================= */

@media(max-width:979px) {

    body {
        padding-top:0 !important;
    }

    body header {
        position:sticky !important;
        position:-webkit-sticky !important;

        top:0 !important;
        left:auto !important;
        right:auto !important;

        display:block !important;

        width:100% !important;

        margin:0 !important;

        z-index:1200 !important;

        transform:none !important;
    }


    /*
     * Desktop fixed-header logic must never
     * take control inside the mobile sticky header.
     */
    body header .headertop,
    body header .headertop.fixed {
        position:relative !important;

        top:auto !important;
        left:auto !important;
        right:auto !important;

        width:100% !important;

        margin:0 !important;

        animation:none !important;
        -webkit-animation:none !important;

        transform:none !important;
    }

}
