
/* Typography for extra large screens */
@media (min-width: 1600px) {
    h1 { font-size: 3.5em; line-height: 1.2; } /* 56px / 16 = 3.5em */
    h2 { font-size: 3em; line-height: 1.25; } /* 48px / 16 = 3em */
    h3 { font-size: 2.5em; line-height: 1.3; } /* 40px / 16 = 2.5em */
    h4 { font-size: 2em; line-height: 1.35; } /* 32px / 16 = 2em */
    h5 { font-size: 1.75em; line-height: 1.4; } /* 28px / 16 = 1.75em */
    h6 { font-size: 1.5em; line-height: 1.45; } /* 24px / 16 = 1.5em */
    p { font-size: 1.25em; line-height: 1.6; } /* 20px / 16 = 1.25em */
}

@media only screen and (max-width:1460px){
    .siteContainer {
        max-width: 90%;
    }
    .clintRowMain img {
        width: 65px;
        height: 65px;
    }
}

/* Typography for large screens */
@media (min-width: 1200px) and (max-width: 1599px) {
    h1 { font-size: 3em; line-height: 1.2; } /* 48px / 16 = 3em */
    h2 { font-size: 2.5em; line-height: 1.25; } /* 40px / 16 = 2.5em */
    h3 { font-size: 2em; line-height: 1.3; } /* 32px / 16 = 2em */
    h4 { font-size: 1.75em; line-height: 1.35; } /* 28px / 16 = 1.75em */
    h5 { font-size: 1.5em; line-height: 1.4; } /* 24px / 16 = 1.5em */
    h6 { font-size: 1.25em; line-height: 1.45; } /* 20px / 16 = 1.25em */
    p { font-size: 1.125em; line-height: 1.6; } /* 18px / 16 = 1.125em */
}

@media only screen and (max-width:991px){
    .miniRemove svg {
        width: 25px;
        height: 26px;
    }
}

/* Typography for medium screens */
@media (min-width: 768px) and (max-width: 1199px) {
    h1 { font-size: 2.5em; line-height: 1.2; } /* 40px / 16 = 2.5em */
    h2 { font-size: 2em; line-height: 1.25; } /* 32px / 16 = 2em */
    h3 { font-size: 1.75em; line-height: 1.3; } /* 28px / 16 = 1.75em */
    h4 { font-size: 1.5em; line-height: 1.35; } /* 24px / 16 = 1.5em */
    h5 { font-size: 1.25em; line-height: 1.4; } /* 20px / 16 = 1.25em */
    h6 { font-size: 1.125em; line-height: 1.45; } /* 18px / 16 = 1.125em */
    p { font-size: 1em; line-height: 1.6; } /* 16px / 16 = 1em */
}

@media only screen and (max-width:767px){
    .heroBanner {
        padding: 30px 0;
    }

    .heroBanner h1 {
        font-size: 30px;
        line-height: 60px;
    }

    .heroBanner ul li {
        font-size: 14px;
        line-height: 20px;
    }

    .miniCartBox {
        padding: 25px 20px;
        min-width: 320px;
    }

    .miniCartheader {
        padding-bottom: 18px;
    }

    .miniCartheader h4 {
        font-size: 20px;
        line-height: 20px;
    }

    .miniImage {
        width: 40px;
    }

    .miniRemove svg {
        width: 20px;
        height: 20px;
    }
    
    .miniRemove {
        width: 25px;
        align-items: center;
    }

    .miniDetail {
        width: calc(100% - 70px);
        padding-left: 10px;
    }

    .miniDetail h4 {
        font-size: 16px;
        line-height: 20px;
    }

    .miniDetail span.quantity {
        font-size: 16px;
        line-height: 22px;
        margin: 6px 0 0;
    }

    p.woocommerce-mini-cart__buttons {
        padding-top: 26px;
        margin-top: 10px;
        row-gap: 12px;
    }

    p.woocommerce-mini-cart__buttons a.wc-forward {
        padding: 10px;
        font-size: 16px;
        line-height: 22px;
    }

    .miniCartheader a svg {
        width: 15px;
        height: 15px;
    }

    body ul.products li.product img {
        height: 180px;
    }
}
/* Typography for small screens */
@media (min-width: 480px) and (max-width: 767px) {
    h1 { font-size: 2em; line-height: 1.2; } /* 32px / 16 = 2em */
    h2 { font-size: 1.75em; line-height: 1.25; } /* 28px / 16 = 1.75em */
    h3 { font-size: 1.5em; line-height: 1.3; } /* 24px / 16 = 1.5em */
    h4 { font-size: 1.25em; line-height: 1.35; } /* 20px / 16 = 1.25em */
    h5 { font-size: 1.125em; line-height: 1.4; } /* 18px / 16 = 1.125em */
    h6 { font-size: 1em; line-height: 1.45; } /* 16px / 16 = 1em */
    p { font-size: 0.875em; line-height: 1.6; } /* 14px / 16 = 0.875em */
}

/* Typography for extra small screens */
@media (max-width: 479px) {
    h1 { font-size: 1.75em; line-height: 1.2; } /* 28px / 16 = 1.75em */
    h2 { font-size: 1.5em; line-height: 1.25; } /* 24px / 16 = 1.5em */
    h3 { font-size: 1.25em; line-height: 1.3; } /* 20px / 16 = 1.25em */
    h4 { font-size: 1.125em; line-height: 1.35; } /* 18px / 16 = 1.125em */
    h5 { font-size: 1em; line-height: 1.4; } /* 16px / 16 = 1em */
    h6 { font-size: 0.875em; line-height: 1.45; } /* 14px / 16 = 0.875em */
    p { font-size: 0.75em; line-height: 1.6; } /* 12px / 16 = 0.75em */
}