#mainmenu.offcanvas.offcanvas-end {top:calc(10px + constant(safe-area-inset-top))!important; top:calc(10px + env(safe-area-inset-top))!important;bottom:calc(10px + constant(safe-area-inset-bottom))!important;bottom:calc(10px + env(safe-area-inset-bottom))!important; border-radius: 20px 0 0 20px;box-shadow: 0 15px 25px 1px rgba(0,0,0,.1); width:320px; height:auto;background:#008c95;}

#mainmenu .offcanvas-header {padding: 10px 50px 10px 20px;text-align: left; height:75px; border-radius: 20px 0 0 0; background:#008c95;margin-bottom: 40px;color:#fff;}
#mainmenu .offcanvas-header .btn-close {display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-content: center; align-content: center;-webkit-align-items: center; align-items: center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content: center; position: absolute; top:12px; right:5px; width:45px;height:45px;padding: 0; margin: 0;background:transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat; opacity: 0.75}
#mainmenu .offcanvas-header .btn-close:hover {opacity: 1;}
#mainmenu h5.offcanvas-title {font-size: 18px; line-height: 24px; text-align: left; margin: 0; font-weight: 500; color:#fff;font-style: italic;}
#mainmenu h5.offcanvas-title > span {display: block; font-style: normal; font-weight: 400;}
#mainmenu .offcanvas-body {padding-left:0;padding-right:0;}

#mainmenu .navbar-nav {position: relative;padding: 0 0 40px 0;}
#mainmenu .navbar-nav li {position: relative; margin: 0px 0;border-bottom: solid 1px rgba(255,255,255,0.4);}
#mainmenu .navbar-nav li a {font-size: 15px; display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-content: center; align-content: center;-webkit-align-items: center; align-items: center; position: relative; color:#512d6d; font-weight: 500; padding: 0 30px 0 50px; text-decoration: none;line-height: 130%; min-height: 50px;color:#fff;}
#mainmenu .navbar-nav li a span {}
#mainmenu .navbar-nav li > a > i.bi {position: absolute;left:15px;}
#mainmenu .navbar-nav li > a > i.fa-shirt {position: absolute;left:15px;}
#mainmenu .navbar-nav li > a > i.fa-chevron-right {position: absolute; right:15px;color:#fff;}

html.webapp #mainmenu .navbar-nav > li.mobileapplink {display: none;}

#mainmenu .submenu {position: fixed; right: -100%; top:calc(10px + constant(safe-area-inset-top))!important; top:calc(10px + env(safe-area-inset-top))!important;bottom:calc(10px + constant(safe-area-inset-bottom))!important;bottom:calc(10px + env(safe-area-inset-bottom))!important; border-radius: 20px 0 0 20px;box-shadow: 0 15px 25px 1px rgba(0,0,0,.1); width:320px; max-width:100%; height:auto; z-index:1046;-webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0);transition:all 0.5s; background:#008c95; }
#mainmenu .submenu.subopen {right:0; -webkit-transform:translate3d(0px, 0, 0); transform: translate3d(0px, 0, 0);}

#mainmenu .submenu > div {padding:0px; position: relative; display: -webkit-box; display:-moz-box; display:-webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack:space-between; -ms-flex-pack:justify; justify-content: space-between; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items:center; margin-bottom: 50px; border-radius: 20px 0 0 0; background:#008c95;}
#mainmenu .submenu > div a.mp-back {padding: 10px 50px 10px 20px; position: relative; display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-content: center; align-content: center;-webkit-align-items: center; align-items: center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content: flex-start; width:100%; height:75px;color:#fff; font-size: 18px; line-height: 1; font-weight: bold;}
#mainmenu .submenu > div a.mp-back i {position: relative; margin-right:15px; }


#mainmenu .submenu > ul {position: relative;padding: 16px 0;}
#mainmenu .submenu > ul li {position: relative;}
#mainmenu .submenu > ul li.nothing {font-size: 15px; font-style: italic; padding: 0 20px 0 20px;border:none;text-align: left;color:#fff;}
#mainmenu .submenu > ul li a i.icon {position: absolute;left:15px;}

#mainmenu a.gotomain {text-align: center;display: block; font-weight: normal; color:#fff; text-decoration: underline;}

#searchmenu {right:15px;left:15px;border-radius: 20px;height:auto; bottom:75px; transform: translateY(150%); border:none; box-shadow: 0 15px 25px 1px rgba(0,0,0,.1); }
#searchmenu.offcanvas.show:not(.hiding), #searchmenu.offcanvas.showing {transform:none;}
#searchmenu .offcanvas-header {position: relative;background:#e4f0f2; border-radius: 20px 20px 0 0;}
#searchmenu h5.offcanvas-title {font-size: 16px; line-height: 24px; text-align: left; margin: 0; font-weight: 700;}
#searchmenu .offcanvas-body {position: relative;padding-top:25px;padding-bottom: 25px;}
#searchmenu form {width:100%; margin-left:auto; margin-right:auto; position: relative;}
#searchmenu form input {padding-right:40px;}
#searchmenu form .col-12 {padding: 0;position: relative;}
#searchmenu form button.btn {position: absolute;right:0;top:0;height:100%;z-index: 2; padding:0 25px;border-radius: 0;background:none; border:none; color:#333; font-size: 16px;}


#locationmenu {right:15px;left:15px;border-radius: 20px;height:auto; bottom:75px; transform: translateY(150%); border:none; box-shadow: 0 15px 25px 1px rgba(0,0,0,.1); }
#locationmenu.offcanvas.show:not(.hiding), #locationmenu.offcanvas.showing {transform:none;}
#locationmenu .offcanvas-header {position: relative;background:#e4f0f2; border-radius: 20px 20px 0 0;}
#locationmenu h5.offcanvas-title {font-size: 16px; line-height: 24px; text-align: left; margin: 0; font-weight: 700;}
#locationmenu .offcanvas-body {position: relative;padding-top:20px;padding-bottom: 20px;}
#locationmenu ul {position: relative;}
#locationmenu ul li {position: relative;}
#locationmenu ul li a {position: relative; display: block; padding: 4px 0; margin: 4px 0; border-bottom: 1px solid #ddd;}

@media (min-width:768px) {
    #mainmenu.offcanvas.offcanvas-end {width:400px;}
    #mainmenu .submenu {width:400px;}
}

@media (max-width: 390px) {
    #mainmenu .offcanvas-header {margin-bottom: 15px;}
    #mainmenu .submenu > div {margin-bottom: 15px;}
}

@media (max-width: 375px) {
    #mainmenu .offcanvas-header {margin-bottom: 15px;}
    #mainmenu .submenu > div {margin-bottom: 15px;}
}

@media (max-width: 350px) {
    #mainmenu .offcanvas-header {margin-bottom: 0;}
    #mainmenu .submenu > div {margin-bottom: 0;}
}