@media only screen and (max-width: 1600px) {
    /* -- Universal Setting
    --------------------------------------------------*/
    html:lang(en) > body {
        font-size: 14px;
    }
    
    body {
        font-size: 15px;
    }
    
    /* -- Color & Font
    --------------------------------------------------*/
    .font-h1 { font-size: 50px; }
    .font-h2 { font-size: 42px; }
    .font-h3 { font-size: 36px; }
    .font-h4 { font-size: 26px; }
    .font-h5 { font-size: 18px; }
    .font-h6 { font-size: 14px; }

    .font-p-lg { font-size: 16px; }
    .font-p-md { font-size: 15px; }
    .font-p-sm { font-size: 14px; }
    .font-p-xs { font-size: 13px; }
}

@media only screen and (max-width: 1200px) {
    /* -- Universal Setting
    --------------------------------------------------*/
    html:lang(en) > body {
        font-size: 13px;
    }
    
    body {
        font-size: 14px;
    }
    
    /* -- Color & Font
    --------------------------------------------------*/
    html:lang(en) .font-h1 { font-size: 36px; }
    html:lang(en) .font-h2 { font-size: 26px; }
    html:lang(en) .font-h3 { font-size: 22px; }
    html:lang(en) .font-h4 { font-size: 18px; }
    html:lang(en) .font-h5 { font-size: 16px; }
    html:lang(en) .font-h6 { font-size: 14px; }

    html:lang(en) .font-p-lg { font-size: 14px; }
    html:lang(en) .font-p-md { font-size: 13px; }
    html:lang(en) .font-p-sm { font-size: 12px; }
    html:lang(en) .font-p-xs { font-size: 12px; }
    
    .font-h1 { font-size: 44px; }
    .font-h2 { font-size: 38px; }
    .font-h3 { font-size: 32px; }
    .font-h4 { font-size: 22px; }
    .font-h5 { font-size: 16px; }
    .font-h6 { font-size: 13px; }

    .font-p-lg { font-size: 15px; }
    .font-p-md { font-size: 14px; }
    .font-p-sm { font-size: 13px; }
    .font-p-xs { font-size: 12px; }
    
    /* -- Main Content
    --------------------------------------------------*/
    #homeBannerPC .banner-slogan {
        font-size: 2em;
    }
    
    #homeBannerPC ul.banner-nav > li > a {
        font-size: 1.5em;
    }
    
    #goHome {
        right: 15px;
    }
    
    /* -- Components
    --------------------------------------------------*/
    /* -- Styled Block -- */
    .styled-side-nav-block .styled-side-search,
    .styled-side-nav-block .styled-side-nav {
        width: 25%;
    }
    
    .styled-side-nav-block .styled-side-search._fixed,
    .styled-side-nav-block .styled-side-nav._fixed {
        left: 15px;
        width: -webkit-calc((100% - 15px * 2) * 0.25 - 0.01px);
        width: -moz-calc((100% - 15px * 2) * 0.25 - 0.01px);
        width: calc((100% - 15px * 2) * 0.25 - 0.01px);
    }
    
    .styled-side-nav-block .styled-side-block {
        width: 75%;
    }
    
    @media only screen and (orientation: portrait) {
        
    }

    @media only screen and (orientation: landscape) {
        
    }
}

@media only screen and (max-width: 991px) {
    /* -- Customized Setting
    --------------------------------------------------*/
    .content-text iframe {
        width: -webkit-calc(100vw - 15px * 2 - 5em * 2);
        width: -moz-calc(100vw - 15px * 2 - 5em * 2);
        width: calc(100vw - 15px * 2 - 5em * 2);
        height: -webkit-calc((100vw - 15px * 2 - 5em * 2) * 0.5625);
        height: -moz-calc((100vw - 15px * 2 - 5em * 2) * 0.5625);
        height: calc((100vw - 15px * 2 - 5em * 2) * 0.5625);
    }
    
    /* -- Nav
    --------------------------------------------------*/
    #navMainPC,
    #navMainM {
        height: 100%;
    }
    
    #navLang {
        right: 60px;
        bottom: 58px;
        width: auto;
        margin: auto;
    }
    
    #navSearch {
        top: 30px;
        right: 120px;
        margin: auto;
    }
    
    #navCurrency {
        left: 60px;
        right: auto;
        bottom: 58px;
        width: auto;
        height: 1.5em;
        padding: 0 1.5em 0 0;
        line-height: 1.5;
        border: none;
    }
    
    #navCurrency::before {
        left: auto;
        right: 0.5em;
    }
    
    .lang-btn-trigger {
        display: none;
    }
    
    ul.nav-main {
        display: block;
        width: 100%;
        height: 100%;
        padding-top: 1em;
        padding-bottom: 1em;
        text-align: center;
        overflow-x: hidden;
    }
    
    ul.nav-main > li {
        display: block;
        width: 100%;
        float: none;
    }
    
    ul.nav-main > li ~ li {
        margin-top: 1em;
    }
    
    ul.nav-main > li > a {
        display: inline-block;
        max-width: 100%;
        padding: 0 1em;
        font-size: 2em;
        vertical-align: bottom;
    }
    
    ul.nav-main > li.with-dropdown > a::before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: auto;
        right: 0;
        width: 8px;
        height: 2px;
        margin: auto;
        background-color: #9e8f68;
    }
    
    ul.nav-main > li.with-dropdown > a::after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: auto;
        right: 3px;
        width: 2px;
        height: 8px;
        margin: auto;
        background-color: #9e8f68;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }
    
    ul.nav-main > li.with-dropdown._open > a::after {
        height: 0;
    }
    
    ul.nav-dropdown {
        display: block;
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        margin: 0 auto;
        padding: 0;
    }
    
    ul.nav-main > li.with-dropdown._open > ul.nav-dropdown {
        max-height: 200vh;
    }
    
    ul.nav-dropdown > li {
        margin-top: 1em;
        margin-bottom: 1em;
    }
    
    ul.nav-dropdown > li ~ li {
        margin-top: 1em;
        margin-bottom: 1em;
    }
    
    ul.nav-dropdown > li > a {
        font-size: 1em;
    }
    
    ul.nav-lang,
    ul.nav-lang._open {
        position: relative;
        top: auto;
        bottom: auto;
        right: auto;
        opacity: 1;
        z-index: 0;
    }

    ul.nav-lang > li,
    ul.nav-lang > li._active,
    ul.nav-lang > li:not(._active) {
        display: inline-block;
        margin-left: auto;
        margin-right: auto;
        vertical-align: bottom;
    }

    ul.nav-lang > li ~ li {
        margin-left: 1.5em !important;
    }
    
    /* -- Footer
    --------------------------------------------------*/
    #siteNavContainer._open #siteFooter {
        left: 0;
        right: 0;
        bottom: 0;
        height: -webkit-calc(10px + 18px + 30px + 1.5em);
        height: -moz-calc(10px + 18px + 30px + 1.5em);
        height: calc(10px + 18px + 30px + 1.5em);
        margin: auto;
        text-align: center;
        overflow: hidden;
    }
    
    #siteFooter ul.nav-footer {
        display: none;
    }
    
    #siteFooter .footer-media-container {
        max-width: -webkit-calc(9em + 60px * 2);
        max-width: -moz-calc(9em + 60px * 2);
        max-width: calc(9em + 60px * 2);
        padding-left: 60px;
        padding-right: 60px;
        text-align: center;
    }
    
    #siteFooter p {
        margin: 30px auto 10px;
    }
    
    /* -- Main Content
    --------------------------------------------------*/
    #siteNavContainer {
        height: 100%;
        overflow: hidden;
    }
    
    #siteNavContainer._open {
        padding-bottom: 0;
    }
    
    #siteNavContainer._open::before {
        position: fixed;
    }
    
    #siteNavContainer #siteNav {
        height: 100%;
        margin-bottom: 0;
        padding-top: 80px;
        padding-bottom: -webkit-calc(10px + 18px + 30px + 1.5em + 10px);
        padding-bottom: -moz-calc(10px + 18px + 30px + 1.5em + 10px);
        padding-bottom: calc(10px + 18px + 30px + 1.5em + 10px);
        padding-left: 0;
        padding-right: 0;
    }
    
    #siteNavContainer #siteBrandM,
    #siteNavContainer #siteNavOther,
    #siteNavContainer #navLang,
    #siteNavContainer #navSearch,
    #siteNavContainer #siteFooter {
        display: none;
    }
    
    #siteNavContainer._open #siteBrandM,
    #siteNavContainer._open #siteNavOther,
    #siteNavContainer._open #navLang,
    #siteNavContainer._open #navSearch,
    #siteNavContainer._open #navCurrency,
    #siteNavContainer._open #siteFooter {
        display: inline-block;
        position: fixed;
    }
    
    #siteNavContainer._open #siteNavOther {
        z-index: 1;
    }
    
    #introBlockTitle {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        margin-top: 5vh;
    }

    #introBlockContent {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        margin-top: 5vh;
        padding-bottom: 0;
    }
    
    #blockProducts .styled-card {
        width: -webkit-calc((100% - 2em * 1) / 2);
        width: -moz-calc((100% - 2em * 1) / 2);
        width: calc((100% - 2em * 1) / 2);
    }

    #blockProducts .styled-card ~ .styled-card {
        margin-left: 2em;
    }

    #blockProducts .styled-card:nth-child(n+3) {
        margin-top: 2em;
    }

    #blockProducts .styled-card:nth-child(3n+1) {
        margin-left: 2em;
        clear: none;
    }
    
    #blockProducts .styled-card:nth-child(2n+1) {
        margin-left: auto;
        clear: both;
    }
    
    .fp-side-left {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        height: auto;
        margin: auto;
    }

    .fp-side-left .main-banner {
        width: 100%;
        height: auto;
    }

    .fp-side-left img {
        width: 100%;
        height: auto;
    }

    .fp-side-right {
        position: relative;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        padding-top: 0 !important;
    }

    .fp-side-left .fp-side-container,
    .fp-side-right .fp-side-container {
        padding: 0 3em;
    }

    /* .fp-side-left .fp-side-heading,
    .fp-side-right .fp-side-heading {
        width: auto;
        height: 7em;
    }
    
    .fp-side-heading.fp-side-heading {
        margin-top: -3em;
    }
    
    .fp-side-heading > img {
        width: auto;
        height: 100%;
    } */
    
    .hf-bg-white .styled-hamburger .bar {
        background-color: #fff !important;
    }
    
    .hf-bg-white #siteHeader._active .styled-hamburger .bar {
        background-color: #9e8f68 !important;
    }
    
    /* -- Components
    --------------------------------------------------*/
    /* -- Styled Block -- */
    .styled-post-block {
        width: 100%;
        max-width: initial;
        padding-left: 5em;
        padding-right: 5em;
    }
    
    .styled-post-block .post-content {
        margin-left: -5em;
        margin-right: -5em;
    }
    
    .styled-post-block ul.post-social-container {
        right: 1.5em;
    }
    
    .styled-post-block ul.post-social-container._fixed {
        right: -webkit-calc(1.5em + 15px);
        right: -moz-calc(1.5em + 15px);
        right: calc(1.5em + 15px);
    }
    
    .styled-block-1 .block-col {
        float: none;
    }

    .styled-block-1 .block-col.block-col-3 {
        width: 100%;
    }
    
    .styled-block-1 .block-col:nth-child(even) .main-img {
        margin-left: 50%;
        margin-right: auto;
    }
    
    .styled-block-1 .block-col:nth-child(even) .main-link {
        left: 0;
        right: auto;
    }

    .styled-block-1 .main-img img {
        display: none;
    }

    .styled-block-1 .main-img img.hover-img {
        display: block;
    }

    .styled-block-1 .main-link {
        -webkit-box-align: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
    
    .styled-block-1 .main-link > .link-title {
        margin: 0 auto;
    }
    
    /* -- Form | Input -- */
    .nav-site-search-bar > input {
        width: 12em;
        opacity: 1;
        z-index: 0;
    }

    .nav-site-search-bar > input + .search-btn {
        opacity: 1;
        z-index: 1;
    }

    .nav-site-search-bar .search-btn-trigger {
        z-index: -1;
    }
    
    
    @media only screen and (orientation: portrait) {
        /* -- Universal Setting
        --------------------------------------------------*/
        html:lang(en) > body {
            font-size: 15px;
        }
        
        body {
            font-size: 16px;
        }
    
        /* -- Color & Font
        --------------------------------------------------*/
        html:lang(en) .font-h1 { font-size: 40px; }
        html:lang(en) .font-h2 { font-size: 36px; }
        html:lang(en) .font-h3 { font-size: 26px; }
        html:lang(en) .font-h4 { font-size: 22px; }
        html:lang(en) .font-h5 { font-size: 18px; }
        html:lang(en) .font-h6 { font-size: 16px; }

        html:lang(en) .font-p-lg { font-size: 16px; }
        html:lang(en) .font-p-md { font-size: 15px; }
        html:lang(en) .font-p-sm { font-size: 14px; }
        html:lang(en) .font-p-xs { font-size: 13px; }
        
        .font-h1 { font-size: 56px; }
        .font-h2 { font-size: 48px; }
        .font-h3 { font-size: 40px; }
        .font-h4 { font-size: 28px; }
        .font-h5 { font-size: 20px; }
        .font-h6 { font-size: 16px; }

        .font-p-lg { font-size: 18px; }
        .font-p-md { font-size: 16px; }
        .font-p-sm { font-size: 15px; }
        .font-p-xs { font-size: 14px; }
        
        /* -- Main Content
        --------------------------------------------------*/
        #siteNavContainer #siteNav {
            padding-top: 12.5vh;
        }
        
        #blockPosts .styled-card {
            float: none;
            width: 100%;
        }

        #blockPosts .styled-card:nth-child(2n+1) {
            clear: none;
        }
        
        .home-page-bg {
            background-image: url(../images/bg-img-home-m.png);
        }
        
        /* -- Components
        --------------------------------------------------*/
        /* -- Styled Card -- */
        .styled-card-1 .card-content {
            margin-top: 12px;
            padding-right: 65px;
        }

        .styled-card-1 .card-content .card-title {
            font-size: 18px;
            line-height: 20px;
        }

        .styled-card-1 .card-content .card-price {
            font-size: 16px;
            line-height: 20px;
        }

        .styled-card-1 .card-content ul.card-colors {
            max-width: 65px;
        }

        .styled-card-1 .card-content ul.card-colors > li {
            padding-top: 4px;
            padding-bottom: 4px;
        }

        .styled-card-1 .card-content ul.card-colors > li ~ li {
            margin-left: 8px;
        }

        .styled-card-1 .card-content ul.card-colors > li:nth-child(4n+1) {
            margin-left: auto;
        }

        .styled-card-1 .card-content ul.card-colors > li > span {
            width: 12px;
            height: 12px;
        }
        
        .styled-card-3 .card-img {
            width: 16em;
            padding-top: 8.4em;
        }

        .styled-card-3 .card-title {
            width: -webkit-calc(100% - 16em);
            width: -moz-calc(100% - 16em);
            width: calc(100% - 16em);
            padding: 0.45em 0 0.45em 1em;
        }
    }

    @media only screen and (orientation: landscape) {
        /* -- Universal Setting
        --------------------------------------------------*/
        html:lang(en) > body {
            font-size: 12px;
        }
        
        body {
            font-size: 13px;
        }
        
        /* -- Color & Font
        --------------------------------------------------*/
        html:lang(en) .font-h1 { font-size: 36px; }
        html:lang(en) .font-h2 { font-size: 26px; }
        html:lang(en) .font-h3 { font-size: 22px; }
        html:lang(en) .font-h4 { font-size: 18px; }
        html:lang(en) .font-h5 { font-size: 16px; }
        html:lang(en) .font-h6 { font-size: 14px; }

        html:lang(en) .font-p-lg { font-size: 14px; }
        html:lang(en) .font-p-md { font-size: 13px; }
        html:lang(en) .font-p-sm { font-size: 12px; }
        html:lang(en) .font-p-xs { font-size: 12px; }
    
        .font-h1 { font-size: 44px; }
        .font-h2 { font-size: 38px; }
        .font-h3 { font-size: 32px; }
        .font-h4 { font-size: 22px; }
        .font-h5 { font-size: 16px; }
        .font-h6 { font-size: 13px; }

        .font-p-lg { font-size: 15px; }
        .font-p-md { font-size: 14px; }
        .font-p-sm { font-size: 13px; }
        .font-p-xs { font-size: 12px; }
    }
}

@media only screen and (max-width: 767px) {
    /* -- Universal Setting
    --------------------------------------------------*/
    html:lang(en) > body {
        font-size: 13px;
    }
    
    body {
        font-size: 14px;
    }
    
    /* -- Color & Font
    --------------------------------------------------*/
    html:lang(en) .font-h1 { font-size: 36px; }
    html:lang(en) .font-h2 { font-size: 26px; }
    html:lang(en) .font-h3 { font-size: 22px; }
    html:lang(en) .font-h4 { font-size: 18px; }
    html:lang(en) .font-h5 { font-size: 16px; }
    html:lang(en) .font-h6 { font-size: 14px; }

    html:lang(en) .font-p-lg { font-size: 14px; }
    html:lang(en) .font-p-md { font-size: 13px; }
    html:lang(en) .font-p-sm { font-size: 12px; }
    html:lang(en) .font-p-xs { font-size: 12px; }
    
    .font-h1 { font-size: 42px; }
    .font-h2 { font-size: 36px; }
    .font-h3 { font-size: 30px; }
    .font-h4 { font-size: 20px; }
    .font-h5 { font-size: 15px; }
    .font-h6 { font-size: 12px; }

    .font-p-lg { font-size: 16px; }
    .font-p-md { font-size: 15px; }
    .font-p-sm { font-size: 14px; }
    .font-p-xs { font-size: 13px; }
    
    /* -- Customized Setting
    --------------------------------------------------*/
    .content-text img {
        width: auto;
        max-width: 100%;
        height: auto;
        max-height: 100%;
    }
    
    .content-text iframe {
        width: -webkit-calc(100vw - 15px * 2);
        width: -moz-calc(100vw - 15px * 2);
        width: calc(100vw - 15px * 2);
        height: -webkit-calc((100vw - 15px * 2) * 0.5625);
        height: -moz-calc((100vw - 15px * 2) * 0.5625);
        height: calc((100vw - 15px * 2) * 0.5625);
    }
    
    /* -- Header
    --------------------------------------------------*/
    #siteHeader {
        height: 60px;
    }
    
    #siteBrand {
        top: 10px;
        left: 15px;
        height: 40px;
    }
    
    #navToggle {
        top: 21px;
        right: 15px;
    }
    
    .site-brand .brand-img {
        height: 40px;
    }
    
    /* -- Nav
    --------------------------------------------------*/
    #siteNavOther {
        top: 15px;
        right: 20px;
    }
    
    #navLang {
        right: 25px;
        bottom: 42px;
    }
    
    #navSearch {
        top: 15px;
        right: 60px;
        margin: auto;
    }
    
    #navCurrency {
        left: 25px;
        bottom: 42px;
    }
    
    ul.nav-main > li > a {
        font-size: 1.5em;
    }
    
    /* -- Section
    --------------------------------------------------*/
    .section-container {
        padding: 0;
    }
    
    /* -- Footer
    --------------------------------------------------*/
    #siteNavContainer._open #siteFooter {
        height: -webkit-calc(6px + 18px + 18px + 1.5em);
        height: -moz-calc(6px + 18px + 18px + 1.5em);
        height: calc(6px + 18px + 18px + 1.5em);
    }
    
    #siteFooter .footer-media-container {
        max-width: -webkit-calc(9em + 25px * 2);
        max-width: -moz-calc(9em + 25px * 2);
        max-width: calc(9em + 25px * 2);
        padding-left: 25px;
        padding-right: 25px;
    }
    
    #siteFooter p {
        margin: 18px auto 6px;
    }
    
    /* -- Main Content
    --------------------------------------------------*/
    #siteNavContainer {
        padding: 0 15px;
    }
    
    #siteNavContainer._open {
        padding-top: 10px;
    }
    
    #siteNavContainer::after {
        width: 10px;
    }
    
    #siteNavContainer #siteNav {
        padding-top: 50px;
        padding-bottom: -webkit-calc(6px + 18px + 18px + 1.5em + 6px);
        padding-bottom: -moz-calc(6px + 18px + 18px + 1.5em + 6px);
        padding-bottom: calc(6px + 18px + 18px + 1.5em + 6px);
    }
    
    #shopContainer {
        padding: 2em 0;
    }
    
    .shop-page-bg {
        top: 60px;
        height: -webkit-calc(100% - 60px);
        height: -moz-calc(100% - 60px);
        height: calc(100% - 60px);
    }
    
    .fp-side-left .fp-side-container,
    .fp-side-right .fp-side-container {
        padding: 0;
    }

    /* .fp-side-left .fp-side-heading,
    .fp-side-right .fp-side-heading {
        width: auto;
        height: 5em;
    }
    
    .fp-side-heading.fp-side-heading {
        margin-top: -2.25em;
    } */
    
    .fp-side-content .gallery {
        padding-left: 0;
        padding-right: 0;
    }
    
    #pageCalculator {
        padding-top: 0;
    }
    
    #pageCalculator .popup-content {
        width: 100%;
    }
    
    #pageCalculator .popup-content .content-container {
        height: 100%;
    }
    
    #pageVerify .section-paragraph {
        padding-left: 0;
        padding-right: 0;
    }
    
    #pageVerify .iframe-wrapper {
        width: 100%;
        margin: 1em auto 2em;
    }
    
    #pageVerify .iframe-wrapper > iframe {
        width: 100%;
        margin: 0 auto;
    }
    
    /* -- Components
    --------------------------------------------------*/
    /* -- Styled Heading -- */
    .styled-heading-section {
        margin: 0 auto 0.5em;
        text-align: center;
        color: #9e8f68;
    }
    
    /* -- Styled Block -- */
    .styled-side-nav-block .styled-side-search._fixed {
        position: absolute;
        top: 20px;
        left: auto;
        width: 25%;
    }
    
    .styled-side-nav-block .styled-side-nav._fixed {
        position: relative;
        top: auto;
        left: auto;
        width: 25%;
        max-height: initial;
        overflow-x: initial;
    }
    
    .styled-post-block {
        padding: 1em 0;
    }

    .styled-post-block .post-content {
        margin: 1em auto;
        padding: 0;
    }
    
    .styled-post-block ul.post-social-container {
        position: fixed;
        top: auto !important;
        bottom: 0 !important;
        left: 0 !important;
        right: auto !important;
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
        background-color: #fff;
        opacity: 0.91;
    }
    
    .styled-post-block ul.post-social-container > li {
        float: left;
    }

    .styled-post-block ul.post-social-container > li ~ li {
        margin-top: 0;
        margin-left: 1em;
    }
    
    .styled-post-block ul.post-social-container > li > a {
        width: 2.5em;
        padding-top: 2.5em;
    }
    
    /* -- Styled Card -- */
    .styled-card-1 .card-content {
        margin-top: 8px;
        padding-right: 50px;
    }

    .styled-card-1 .card-content .card-title {
        font-size: 13px;
        line-height: 14px;
    }

    .styled-card-1 .card-content .card-price {
        margin: 0.125em auto 0;
        font-size: 13px;
        line-height: 14px;
    }

    .styled-card-1 .card-content ul.card-colors {
        max-width: 50px;
    }

    .styled-card-1 .card-content ul.card-colors > li {
        padding-top: 3px;
        padding-bottom: 3px;
    }

    .styled-card-1 .card-content ul.card-colors > li ~ li {
        margin-left: 5px;
    }

    .styled-card-1 .card-content ul.card-colors > li:nth-child(4n+1) {
        margin-left: auto;
    }

    .styled-card-1 .card-content ul.card-colors > li > span {
        width: 8px;
        height: 8px;
    }
    
    @media only screen and (orientation: portrait) {
        /* -- Customized Setting
        --------------------------------------------------*/
        #searchFormProduct #searchBarProduct > input {
            padding: 0 0.5em 0 2.125em;
            font-size: 1em;
            line-height: 2;
            background-color: #eee;
            border: none;
            border-radius: 0.25em;
        }

        #searchFormProduct #searchBarProduct > button {
            left: 0.5em;
            right: auto;
            width: 1.125em;
            height: 1.125em;
        }
        
        #navProducts {
            display: none;
        }
        
        /* -- Nav
        --------------------------------------------------*/
        #navMainPC { display: none; }
        #navMainM { display: block; }
        
        /* -- Main Content
        --------------------------------------------------*/
        #containerCurrency ul > li:nth-child(3n+1) {
            clear: none;
        }
        
        #containerCurrency ul > li:nth-child(2n+1) {
            clear: both;
        }
        
        /* -- Components
        --------------------------------------------------*/
        /* -- Styled Block -- */
        .styled-side-nav-block .styled-side-nav-btn-open,
        .styled-side-nav-block .styled-side-nav-btn-close {
            display: inline-block;
        }
        
        .styled-side-nav-block .styled-side-search,
        .styled-side-nav-block .styled-side-search._fixed {
            position: relative;
            top: auto;
            left: auto;
            width: auto;
            padding: 0 0 1em;
            z-index: auto;
        }
        
        .styled-side-nav-block .styled-side-nav,
        .styled-side-nav-block .styled-side-nav._fixed {
            position: fixed;
            top: 60px;
            bottom: 0;
            left: -15em;
            float: none;
            width: auto;
            max-width: 15em;
            max-height: -webkit-calc(100% - 60px);
            max-height: -moz-calc(100% - 60px);
            max-height: calc(100% - 60px);
            margin: auto;
            padding: 2em 1em;
            background-color: rgba(255,255,255,0.91);
            -webkit-transition: left 0.3s ease-in-out;
            -moz-transition: left 0.3s ease-in-out;
            -ms-transition: left 0.3s ease-in-out;
            -o-transition: left 0.3s ease-in-out;
            transition: left 0.3s ease-in-out;
            overflow-x: hidden;
            z-index: 88886;
        }
        
        .styled-side-nav-block .styled-side-nav._open {
            left: 0;
            border-right: 1px solid rgba(158,143,104,0.5);
            box-shadow: 1px 1px 3px rgba(158,143,104,0.5);
        }
        
        .styled-side-nav-block .styled-side-block {
            float: none;
            width: 100%;
        }

        .styled-block-1 .block-col ~ .block-col {
            margin-top: 5em;
        }
        
        .styled-block-1 .block-col .main-img,
        .styled-block-1 .block-col:nth-child(even) .main-img {
            width: 100%;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: 1em;
        }
        
        .styled-block-1 .block-col .main-link,
        .styled-block-1 .block-col:nth-child(even) .main-link {
            position: relative;
            top: auto;
            bottom: auto;
            left: auto;
            right: auto;
            width: 100%;
        }
        
        .styled-block-1 .main-link > .link-title {
            text-align: center;
        }
        
        /* -- Styled Card -- */
        .styled-card-1 .card-words {
            height: auto;
            padding-left: 0.5em;
            padding-right: 0.5em;
        }
        
        .styled-card-1 .card-words > * {
            float: none;
            width: 100%;
        }
        
        .styled-card-1 .card-words > *:nth-child(even) {
            text-align: left;
        }
        
        .styled-card-3 {
            padding: 0.5em 0 0;
        }
        
        .styled-card-3 ~ .styled-card-3 {
            border-top: 1px solid #f3f3f3;
        }
        
        .styled-card-3 .card-more {
            display: inline-block;
        }

        .styled-card-3 .card-img {
            display: none;
        }

        .styled-card-3 .card-title {
            position: relative;
            top: auto;
            bottom: auto;
            right: auto;
            width: 100%;
            padding: 0;
        }

        .styled-card-3 .card-title .title {
            height: auto;
            font-size: 1.125em;
            line-height: normal;
            white-space: normal;
            text-overflow: initial;
            -o-text-overflow: initial;
        }

        .styled-card-3 .card-title .description {
            display: none;
        }
        
        /* -- Styled Timeline -- */
        .styled-timeline .timeline-line {
            top: 60px;
            left: 30px;
            right: auto;
            width: 2px;
            height: -webkit-calc(100% - 60px);
            height: -moz-calc(100% - 60px);
            height: calc(100% - 60px);
        }

        @-webkit-keyframes timeline-expand {
            0% {
                height: 0;
            }
            100% {
                height: -webkit-calc(100% - 60px);
                height: -moz-calc(100% - 60px);
                height: calc(100% - 60px);
            }
        }

        @keyframes timeline-expand {
            0% {
                height: 0;
            }
            100% {
                height: -webkit-calc(100% - 60px);
                height: -moz-calc(100% - 60px);
                height: calc(100% - 60px);
            }
        }
        
        .styled-timeline .timeline-article .each-article {
            width: 100%;
            padding: 0 0 0 40px;
        }

        .styled-timeline .timeline-article .each-article::before {
            top: 10px;
            width: 16px;
            height: 16px;
        }

        .styled-timeline .timeline-article .each-article::after {
            top: 16px;
            width: 4px;
            height: 4px;
        }

        .styled-timeline .timeline-article .each-article:nth-child(odd)::before {
            left: 8px;
            right: auto;
        }

        .styled-timeline .timeline-article .each-article:nth-child(odd)::after {
            left: 14px;
            right: auto;
        }

        .styled-timeline .timeline-article .each-article:nth-child(even)::before {
            left: 8px;
        }

        .styled-timeline .timeline-article .each-article:nth-child(even)::after {
            left: 14px;
        }

        .styled-timeline .timeline-article .each-article:first-child::before {
            top: 13px;
        }

        .styled-timeline .timeline-article .each-article:first-child::after {
            top: 19px;
        }

        .styled-timeline .timeline-article .each-article:nth-child(odd),
        .styled-timeline .timeline-article .each-article:nth-child(even) {
            float: none;
            text-align: left;
        }

        .styled-timeline .timeline-article .each-article .main-title {
            font-size: 28px;
        }

        .styled-timeline .timeline-article .each-article .title {
            font-size: 24px;
        }

        .styled-timeline .timeline-article .each-article .content {
            font-size: 14px;
        }
        
        .styled-timeline .timeline-article .each-article .img-container img {
            width: 49%;
        }

        .styled-timeline .timeline-article .each-article:nth-child(odd) .img-container img,
        .styled-timeline .timeline-article .each-article:nth-child(even) .img-container img {
            float: left;
        }

        .styled-timeline .timeline-article .each-article:nth-child(odd) .img-container img ~ img,
        .styled-timeline .timeline-article .each-article:nth-child(even) .img-container img ~ img {
            margin-left: 2%;
            margin-right: auto;
        }
    }

    @media only screen and (orientation: landscape) {
        /* -- Main Content
        --------------------------------------------------*/
        #containerCurrency ul > li:nth-child(4n+1) {
            clear: none;
        }
        
        #containerCurrency ul > li:nth-child(3n+1) {
            clear: both;
        }
    }
}

@media only screen and (max-width: 575px) {
    
    
    @media only screen and (orientation: portrait) {
        
    }

    @media only screen and (orientation: landscape) {
        
    }
}

@media only screen and (max-width: 575px) {
    /* -- Main Content
    --------------------------------------------------*/
    #blockProducts .styled-card {
        width: -webkit-calc((100% - 1em * 1) / 2);
        width: -moz-calc((100% - 1em * 1) / 2);
        width: calc((100% - 1em * 1) / 2);
    }

    #blockProducts .styled-card ~ .styled-card {
        margin-left: 1em;
    }

    #blockProducts .styled-card:nth-child(n+3) {
        margin-top: 1em;
    }

    #blockProducts .styled-card:nth-child(3n+1) {
        margin-left: 1em;
    }
    
    #blockProducts .styled-card:nth-child(2n+1) {
        margin-left: auto;
    }
    
    /* -- Components
    --------------------------------------------------*/
    /* -- Styled List -- */
    ul.styled-list-color > li ~ li {
        margin-left: 0.75em;
    }
    
    @media only screen and (orientation: portrait) {
        
    }

    @media only screen and (orientation: landscape) {
        
    }
}

@media only screen and (max-width: 480px) {
    /* -- Header
    --------------------------------------------------*/
    #siteHeader {
        top: auto;
        bottom: 0;
        background-color: #9e8f68 !important;
        border: none !important;
        opacity: 1 !important;
    }
    
    #siteHeader > *:not(#headerNav) {
        display: none !important;
    }
    
    #siteHeader > #headerNav {
        display: block;
    }
    
    /* -- Nav
    --------------------------------------------------*/
    #navLang,
    #siteNavContainer._open #navLang {
        display: none;
    }
    
    ul.nav-main.nav-align-left {
        padding-left: 15px;
        text-align: left;
    }
    
    ul.nav-main.nav-align-left > li > a {
        padding: 0;
        font-size: 1.125em;
    }
    
    ul.nav-main.nav-align-left > li.with-dropdown > a::before,
    ul.nav-main.nav-align-left > li.with-dropdown > a::after {
        display: none;
    }
    
    ul.nav-main.nav-align-left > li.with-dropdown > ul.nav-dropdown {
        padding-left: 1.125em;
    }
    
    ul.nav-main.nav-align-left > li.with-dropdown > ul.nav-dropdown > li > a {
        display: inline-block;
        vertical-align: bottom;
        white-space: normal;
    }
    
    /* -- Section
    --------------------------------------------------*/
    #siteContainer {
        padding-top: 30px;
        padding-bottom: 90px;
    }

    #siteContainer.no-padding {
        padding-top: 0;
        padding-bottom: 60px;
    }
    
    /* -- Footer
    --------------------------------------------------*/
    #siteFooter .footer-media-container {
        margin-right: 0;
        text-align: right;
    }
    
    /* -- Main Content
    --------------------------------------------------*/
    #siteNavContainer {
        top: 100%;
        bottom: 0;
        height: auto;
        max-height: none;
    }

    #siteNavContainer._open {
        top: 0;
        max-height: none;
    }
    /* #siteNavContainer {
        top: -webkit-calc(100% - 60px);
        top: -moz-calc(100% - 60px);
        top: calc(100% - 60px);
        bottom: 60px;
        height: auto;
        max-height: none;
    }

    #siteNavContainer._open {
        top: 0;
        max-height: none;
    } */
    
    #siteNavContainer::before {
        display: none;
    }
    
    #siteNavContainer #siteNav {
        padding-top: 80px;
    }
    
    #goHome {
        bottom: -webkit-calc(60px + 2px);
        bottom: -moz-calc(60px + 2px);
        bottom: calc(60px + 2px);
    }
    
    @media only screen and (orientation: portrait) {
        
    }

    @media only screen and (orientation: landscape) {
        
    }
}

@media only screen and (max-width: 320px) {
    /* -- Components
    --------------------------------------------------*/
    /* -- Styled List -- */
    ul.styled-list-color > li ~ li {
        margin-left: 0.375em;
    }
    
    @media only screen and (orientation: portrait) {
        
    }

    @media only screen and (orientation: landscape) {
        
    }
}

@media(-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:3/2),(min-resolution:1.5dppx),(min-resolution: 192dpi) {
    
}