@media only screen and (max-width: 566px) {
    #title-cart { display: block; text-align: right; font-size: 30px; line-height: 50px; color: var(--main); position: fixed; top: 10; left: 0; right: 0; text-align: center; }
    #title-cart .image-only { position: absolute; left: 50%; margin-left: -31px; }
    .iheader { border-bottom:solid 1px #eee; }
    .iheader, .language-one { height: 50px; }
    .ibody { top: 90px; }
    .language-one { line-height:50px; width: 100px; margin-left:10px; }
    .language-one .language-title { font-size: 15px; }
    .fcontainer_fp_location_at_delivery_address .input-append a { width: 9% !important; }
    .tips-button a { font-size: 20px !important; margin: 10px !important; padding: 10px !important; }
    #order_number { line-height: 20px !important; margin-left: 1% !important; width:90% !important; margin-left: 5% !important; padding:5px !important; font-size:20px !important; }
    .button-logout .bgh-big-button, .button-login .bgh-big-button { font-size:21px !important; line-height: 50px; padding-left: 50px; padding-right: 50px; margin: 40px; }
    #search-on-home { bottom: 80px !important; }
    #search-on-home input { height: 60px !important; }
    .bgh-body-container { bottom: 143px !important; }
    /**cart ux**/

    #top-menu { width: 100% !important; max-width: 100% !important; height: auto !important; overflow-y: scroll !important; white-space: nowrap; padding-left: 0px; padding-right: 0px; position: fixed!important; z-index: 10000000000 !important; top: 50px; bottom: 80px; left: 100%; right: 0; background: white; transition: all 0.5s; border-left: solid 1px #c3c3c3; border-top: solid 1px #c3c3c3; border-bottom: solid 1px #c3c3c3; }
    #top-menu.show-up { left: 50%; }
    #top-menu div.card:first-child { border-top: none !important; }
    #top-menu div.card:last-child { margin-bottom: 0px; }
    #top-menu > div.card { float: left !important;  margin-left: 0px !important; height: 70px; text-align: left; margin-right: 10px; border-top: solid 1px #dadada; margin-bottom: 30px; }
    #top-menu > div.card> div.bgh-btn { white-space: break-spaces; font-size: 12px; line-height: 20px; float: left; margin-top: -20px; }
    #top-menu > div.card:hover> div.bgh-btn { color: white; }
    #top-menu > div.card:hover > div.bgh-btn, #top-menu > div.card > div.active { border: none !important; background-color: transparent !important; color: white; }
    #top-menu > div.card > div.active { color: var(--main)  !important; }
    #top-menu > div.card:hover { background-color: var(--main); line-height: 70px; color: white !important;  }
    #top-menu > div.card > div { float:left; clear: none; }
    #fp-home > a.btn { display: none; }
    .bgh-body-container { top: -80px !important; }
    #fp-cart { width: 100%; margin-left: -100% !important; transition: all 0.5s; }
    #fp-cart .bgh-footer { margin-left:100% !important; width: 100%; transition: all 0.5s; }
    #fp-cart.show { margin-left: 0 !important; }
    #fp-cart.show .bgh-footer { margin-left:0 !important; }
    #fp-product .bgh-body-container { top:120px !important; bottom: 82px !important; }
    #fp-cart { background: transparent !important; z-index: 1; }
    #fp-cart .bgh-header { width: 80%; border-right: 1px solid #dadada; background: white; }
    #fp-cart #bgh-body-cart { width: 80%; border-right: 1px solid #dadada; background: white; }
    #fp-cart #bgh-total-cart { width: 75%; border-right: 1px solid #dadada; background: white; height: 100%; }
    #bgh-total-cart > div > h3.name { font-size: 11px !important; }
    #bgh-body-cart > div > h5.price { font-size: 15px !important; }
    #bgh-body-cart > div > h5.name { font-size: 13px !important; }
}