﻿:root {
    --main-color: #ff8500; /* رنگ اصلی نارنجی */
    --main-hover-color: #e67600; /* کمی تیره‌تر برای هاور */
    --dark-color: #cc5f00; /* نسخه تیره‌تر برای عناصر مهم */
    --box-color: #fff7ef; /* پس‌زمینه خیلی روشن هماهنگ */
    --dark-box-color: #fff; /* پس‌زمینه متوسط */
    --dark-font-color: #7a3a00; /* رنگ فونت تیره هماهنگ */
}
/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, nav ul, nav li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;margin: 0;padding: 0;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
@font-face {
    font-family: MamiFood;
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Bold.eot');
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Bold.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff/IRANSansWeb(FaNum)_Bold.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb(FaNum)_Bold.ttf') format('truetype');
}

@font-face {
    font-family: MamiFood;
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Medium.eot');
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Medium.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff/IRANSansWeb(FaNum)_Medium.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb(FaNum)_Medium.ttf') format('truetype');
}

@font-face {
    font-family: MamiFood;
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Light.eot');
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Light.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff/IRANSansWeb(FaNum)_Light.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb(FaNum)_Light.ttf') format('truetype');
}

@font-face {
    font-family: MamiFood;
    font-style: normal;
    font-weight: 200;
    src: url('../fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot');
    src: url('../fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff/IRANSansWeb(FaNum)_UltraLight.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb(FaNum)_UltraLight.ttf') format('truetype');
}

@font-face {
    font-family: MamiFood;
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/eot/IRANSansWeb(FaNum).eot');
    src: url('../fonts/eot/IRANSansWeb(FaNum).eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff/IRANSansWeb(FaNum).woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb(FaNum).ttf') format('truetype');
}
.f-6{font-size:.6em;}
.f-8{font-size:.8em;}
.f1{font-size:1em;}
.f2{font-size:1.2em;}
.f3{font-size:1.3em;}
.f4{font-size:1.4em;}
.f6{font-size:1.6em;}
.f8{font-size:1.8em;}
a {text-decoration: none;}
.clear {clear: both;}
.clear40 {clear: both;height:40px;}
body {font-family: MamiFood;color: #333;background:#fff;direction: rtl;}
.topline {width: 100%;border: none;border-bottom: 2px solid   var(--main-color);}
/*.header {width: 100%;display: inline-block;background:#f0eeff*/ /*url(/images/bg.png)*//*;padding-bottom:3px;border-bottom:1px dashed var(--main-hover-color);margin-bottom:-30px;}*/
.header {
    width: 100%;
    display: inline-block;
    background-image: linear-gradient(to bottom, #717171 0%, rgba(0, 0, 0, 0) 100%);
    position:relative;
    z-index:3;
}
.divlocationSearch{background:#f3fafe;display: inline-block;width: 100%;margin-top:-10px;padding:10px;}
.go-up {
    background:url("/images/form-icon/upload.png") no-repeat;
    position: fixed;
    bottom: 10px;
    right: 10px;
    width: 33px;
    height: 33px;
    cursor: pointer;
    display: none;
}

.wrap {
    width: 90%;
    margin: 0 auto;
    display: block;
}
.onecolumn{
    float: right;
    width: 100%;
    box-sizing: border-box;
    display: block;
}

.maincolumn {
    /* تغییرات جدید */
    display: flex;
    flex-wrap: wrap; /* اجازه بده آیتم‌ها به خط بعد بروند */
    justify-content: center; /* آیتم‌ها را در کل عرض وسط‌چین می‌کند */
    gap: 15px; /* فاصله بین کارت‌ها (جایگزین مارجین دستی) */
    /* تنظیمات قبلی تو */
    float: left;
    width: 80%;
    box-sizing: border-box;
    font-size: 1em;
    position: relative;
    /*min-height: 80vh;*/
}

.rightcolumn {
    float: left;
    width: 20%;
    box-sizing: border-box;
    border: 1px solid var(--dark-box-color);
    display: block;
}
.logo {
    width: 164.6px;
    height: 120px;
    float: right;
    padding: 0;
    margin: 5px 40px;
}

.loginstyle {
    float: left;
    width: 65%;
    direction: ltr;
    margin-left: 0px;
    text-align: left;
}
.inline-block{display:inline-block;}
.lnkReg{border-bottom:2px solid #009933; color:#009933; padding:0 5px;font-weight:500;margin:0 5px;font-size:1.2em;}
.welcome-customer{float:right;margin:22px 27px -57px 0px;background:var(--dark-box-color); padding:5px 20px;border-radius:4px;font-size:.8em;color:#555;}
    .loginstyle .loginbtn {
        /*background-color:  var(--main-color);*/
        border: none;
        color: var(--box-color);
        border-radius: 0 0 4px 4px;
        padding: 5px 25px;
        text-align: center;
        display: inline-block;
        font-weight: 500;
        cursor: pointer;
        margin: 0px 0px 0px 2px;
        -webkit-transition: all .5s;
        -moz-transition: all .5s;
        -o-transition: all .5s;
        -ms-transition: all .5s;
        transition: all .5s;
    }

        .loginstyle .loginbtn:hover{
            /*background-color: var(--main-hover-color);*/
            font-weight: bold;
        }
    .loginstyle .btnCustomer {
        font-size:.8em;
        background-color: var(--dark-box-color);
        border: 1px solid var(--main-color);
        border-top:none;
        color: var(--main-color);
        border-radius: 0 0 4px 4px;
        padding:8px 20px 4px 20px;
        text-align: center;
        display: inline-block;
        font-weight: 400;
        cursor: pointer;
        margin: 0px 0px 0px 2px;       
        -webkit-transition: all .5s;
        -moz-transition: all .5s;
        -o-transition: all .5s;
        -ms-transition: all .5s;
        transition: all .5s;
    }
        .loginstyle .btnCustomer:hover {
             background-color: #009933;
            font-weight: bold;
            /*border:none;*/
            border-color:#009933;
            color:var(--box-color);
        }
.nopad {
    padding: 18px 0;
}

.pad {
    padding: 35px 0px;
}
/*.btnPoll{border: 1px solid var(--main-color);font-size:.9em;font-weight:400;color:var(--main-color);background-color:var(--box-color); border-radius:12px; padding:3px 15px;cursor:pointer;}*/
/*.btnShowPoll{border: 1px solid #818181;font-size:.85em;font-weight:400;color:#818181;background-color:var(--dark-box-color); border-radius:12px; padding:3px 8px;cursor:pointer;}*/
/*menu*/
/*.menu-icon{display:none;position:absolute;left:10px;top:50px; width: 40px; height: 40px; background:url("/images/form-icon/hmenu.png") no-repeat;}

.menu {
    float: right;
    margin-top:0px;
    
}

    .menu ul {
        width: 100%;
    }

        .menu li {
        float: right;
        text-align: center;
    }

        .menu li a {
            display: block;
            color: var(--box-color);
            background-color:  var(--main-hover-color);
            padding: 5px 21px;
            margin: 10.5px 5px 0 0px;
            font-weight: 500;
            border-radius:4px;
            -webkit-transition: all .5s;
            -moz-transition: all .5s;
            -o-transition: all .5s;
            -ms-transition: all .5s;
            transition: all .5s;
            box-sizing: border-box;
        }

.nopad {
    padding: 18px 0;
}

.pad {
    padding: 35px 0px;
}

.menu li a:hover,.menu li a:focus {
    background-color: var(--main-color);
    color: var(--box-color);
}*/
/*end_menu*/



/*  GRID OF FOUR   ============================================================================= */
/*.section {
    clear: both;
    padding: 0;
    margin: 0px;
}

.group:before,
.group:after {
    content: "";
    display: table;
}

.group:after {
    clear: both;
    text-align: center;
}

.group {
    zoom: 1;
    background: url(/images/Mami3.png) no-repeat 80px 50%;
}

    .group:hover {
        background: url(/images/Mami3.png) no-repeat 80px 50%;
    }

.col_1_of_4 {
    display: block;
    float: right;
    text-align: center;
    margin: 5px 0 30px 0;
}
.span_1_of_4 {
    width: 24.8%;
    padding: 0;
    box-sizing: border-box;
}

    .span_1_of_4 h3 {
        font-size: 1.2em;
        font-weight: 500;
        border-bottom: 1px solid #cccccc;
        text-align: center;
        margin: 0 5%;
        padding: 0 0 5px 0;
        -webkit-box-shadow: 0 4px 6px -6px #ee4149;
        -moz-box-shadow: 0 4px 6px -6px #ee4149;
        box-shadow: 0 4px 6px -6px #cccccc;
        animation-name: foont;
    }

@keyframes foont {

    100% {
        -webkit-transform: scale(1.3);
        -ms-transform: scale(1.3);
        transform: scale(1.3);
    }
}

.span_1_of_4 p {
    font-size: 0.7em;
    padding: 5px 5%;
    line-height: 20px;
}

.span_1_of_4 img {
    border: 1px solid #ccc;
    background-color: var(--box-color);
    border-radius: 50%;
    padding: 10px;
}

.arrow {
    position: relative;
    top: 30%;
    left: 0;
}

.img-item {
    float: right;
    width: 14%;
    box-sizing: border-box;
    text-align: center;
    margin: 40px 4.3% 10px 4.3%;
}

    .img-item:hover {
        transform: scale(1.3);
        cursor: pointer;
    }

    .img-item img {
        border: 1px solid #ccc;
        border-radius: 50%;
        background-color: var(--box-color);
        padding: 10px;
    }

.img-arrow {
    float: right;
    width: 9%;
    box-sizing: border-box;
    margin: 80px -3.2% 0 -3.2%;
    padding-right: 10px;
    visibility: hidden;
}

@keyframes visi {
    50% {
        visibility: visible;
        transition: 1s visibility;
    }
}

.img1 {
    animation-name: visi;
    animation-duration: 2s;
    animation-delay: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.img2 {
    animation-name: visi;
    animation-duration: 2s;
    animation-delay: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: ease;
}

.img3 {
    animation-name: visi;
    animation-duration: 2s;
    animation-delay: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in;
}*/


/****************************************************************SearchBox************************************************************/
/*.SearchDiv {
    width: 75%;
    margin: 0 auto;
    z-index: 100;
}

.SearchBox {
    background: var(--dark-box-color);
    padding: 0;
    width: 100%;
    box-sizing: border-box;
    text-align: center; 
}*/

.txt {
    background-color: white;
    background-position: 98% 50%;
    background-repeat: no-repeat;
    padding: 10px 50px 10px 20px;
    margin: .5% 0;
    border: 1px solid #969494;
    color: #555;
    box-sizing: border-box;
    font: .8em MamiFood;
    border: 1px solid #ccc;
    border-radius:8px;
}
.div-relative{position:relative;}
/*.divautocomplete{position:relative;width:24%;display:inline-block;}

#txtZone {
    background:var(--box-color) url('/images/formicon/searchicon.png')  100% -200px no-repeat;
    font-size:1.2em;
}

#txtCity {
    background:var(--box-color) url('/images/formicon/searchicon.png')  100% -148px no-repeat;
    font-size:1.2em;
}

#txtState {
    background:var(--box-color) url('/images/formicon/searchicon.png')  100% -96px no-repeat;
    font-size:1.2em;
}*/

/*.btn_search {
    background-repeat: no-repeat;
    padding: 10px 12px 10px 50px;
    margin: .7% 0;
    font-weight: bold;
    color: var(--box-color);
    cursor: pointer;
    border: none;
    font: 1em MamiFood;
    font-weight: bold;
    box-sizing: border-box;
    
}

#btnSearch {
    background:url('/images/formicon/searchicon.png') -0px 3px no-repeat;
    background-color: var(--main-color);
    width: 12%;
    min-width:100px;
    font-size:1.2em;
}

#btnSearchMap {
    background:url('/images/formicon/searchicon.png') -0px -44px no-repeat;
    background-color: var(--main-color);
    background-color: #009933;
    width: 14%;
    min-width:180px; 
    font-size:1.2em; 
}

#btnSearch:hover, #btnSearch:focus {
    background-color: #009933;
}

#btnSearchMap:hover, #btnSearchMap:focus {
    background-color: var(--main-color);
}*/
/*.searchicon{position:relative;top:-1px;right:1px;cursor:pointer;}*/
/****************************************************************EndSearchBox************************************************************/
/******************************************************************CompleteBox*********************************************************************/
/*.autoZone {
    position: absolute;
    top: 85px;
    left: 152px;
    width: 27%;
    padding: 2px;
    z-index: 10;
    max-height: 100px;
    display: none;
}

.autoResturant {
    position: absolute;
    top:55px;
    left:0%;
    width: 100%;
    padding: 2px;
    z-index: 10;
    height: auto;
    display: none;
}
.autoMami {
    position: absolute;

    top:40px;
    left:-1%;
    width: 100%;
    padding: 2px;
    z-index: 10;
    height: auto;
    display: none;
    text-align:right;
}

.complete-box {
    margin-top: 5px;
    background: var(--box-color);
    border: 1px solid #ee4149;
    padding: 10px 2px 15px 2px;
    border-radius: 4px;
    max-height: 308px;
    overflow-y: auto;
}

    .complete-box li {
        list-style: none;
       
    }

        .complete-box li a {
            direction: rtl;
            display: block;
            color: #555; 
            font-size: 18px;
            padding: 18px 38px 8px 0;
            cursor: pointer;
            position:relative;
        }
            .complete-box li a img {
                width: 24px;
                height: 24px;
                position: absolute;
                top:30%; 
                right:8px;
            }
            .complete-box li a .foodname {margin-right:53px; }

            .complete-box li a .foodimg {
                width: 80px;
                height: 40px;
                float: right;
                display:inline-block;
                margin:-5px -5px 0 0;
                border-radius:4px;

            }

 .prl0{padding-left:0;padding-right:0;}
            .complete-box li a:hover, .complete-box li .current, .complete-box .selected a {
                color: var(--box-color);
                background-color: #ee4149;
            }*/
/******************************************************************EndCompleteBox*********************************************************************/
.title {
    border: none;
    width:100%;
    margin:0px auto 5px auto;
    background-color: var(--box-color);
    -webkit-box-shadow: 0 4px 6px -6px #555;
    -moz-box-shadow: 0 4px 6px -6px #555;
    box-shadow: 0 4px 6px -6px #555;
    box-sizing: border-box;
    border-radius:4px;/*0 0 12px 12px;*/
}

.foodmenu-header {
    
    padding: 5px 7px 5px 7px;
    background-image: url(../images/onlinepic.png);
    background-position: 2% 100%;
    text-align: center;
    font-size: 1.2em;
    font-weight: bold;
    z-index: 9;
    color: var(--main-color); 
}
.search-icon{float:right;cursor:pointer;display:none;margin-left:10px;background:url("/images/formicon/searchicon.png") -10px -260px no-repeat;width:32px; height:40px;font-size:.8em;}
.event-header {
    font-size: .75em;
    padding: 7px 17px 7px 7px;
    /*margin-top:10px;*/
    color: #555;
    display:inline-block;
}
/*.event-header a{font-weight:bold;text-decoration:none;color: var(--main-color);}
.event-header a{color:var(--main-hover-color);}*/
    .event-header div {
        font-weight: 500;
        display: inline;
        padding: 0 5px 0 2px;
    }

    .event-header span {
        
        padding-right: 5px;
        display: inline;
        font-weight:bold;
    }
    .event-header a {
       text-decoration:none;
       color: var(--main-color);
       font-weight:bold;
       display:inline-block;
       padding:3px;
       margin:2px;
    }
    .event-header a:hover {
       text-decoration:underline;
       color:var(--main-hover-color);
       
    }
    .event-header .tag {
        border: 1px solid var(--main-hover-color);
        background: url("/images/form-icon/closed.png") calc(100% - 3px) 5px no-repeat;
        padding: 3px 23px 3px 7px;
        float: right;
        margin: 2px;
        box-sizing: border-box;
        transition:.8s all;
        border-radius:4px;
        cursor:pointer;
    }
    .event-header .tag:hover{background-color:var(--main-hover-color);color:var(--box-color);}
    .event-header #date {
        float: left;
        width: 11%;
        padding-right: 5px;
        box-sizing: border-box;
        position:relative;
    }
 .event-header .dateicon{width:20px;height:24px;position:absolute;top:-3px;right:-24px;background: url(/images/formicon/headericon.png) -3px -3px;}
.event-header #events{display:inline-block;width:88%;margin:1px 0 -6px 0;overflow:hidden;max-height:20px;}

.col300 {
    width: 150px;
}
.col3,.col1-3 {
    width: 31%;
}
.col2-3{width:64%;}
.col4 {
    width: 22.5%;
}

.col6 {
    width: 7.5%;
}

.col5 {
    width: 14.5%;
}

.col2 {
    width: 49%;
}

.col54 {
    width: 54%;
}

.col44,.col44t {
    width: 44%;
}

.col80,.col80t {
    width: 80%;
}

.col1 {
    width: 100%;
}

.col98 {
    width: 98%;
}

.col99 {
    width: 99%;
}
.col24{width:24%;}
.col38{width:38%;}
.RightMenu,.SearchMenu{ 
    width: 100%;
    background-color: var(--box-color);
    margin: 0 0 5px 0;
    box-sizing: border-box;
    z-index: 9;
    text-align: right;
    padding:6px;
    border-radius:12px;
   
}
.vertical-menu {
    width: 100%;
    box-sizing: border-box;
}

   .vertical-menu li,.vertical-menu row{
        display:block;
        font-size: 1em;
        cursor: pointer;
        padding: 15px;
        background-color: #f9f9f9;
        margin: 2px 0;
        position:relative;
        color:#867979;
    top: 0px;
    right: 0px;
}
   .vertical-menu li .dropdown-content {
    display: none;
    opacity:0;
    visibility:hidden;
    position: absolute;
    right:180px;
    top:0px;
    background-color:var(--main-color);
    min-width: 320px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    text-align:right; 
    padding:5px;
    box-sizing:border-box;
    -webkit-transition: opacity 5s, visibility 5s;
          transition: all 5s;
          overflow-y:auto;
          max-height:50vh;
}

 .vertical-menu li .dropdown-content a {
    
    color: #818181;
    background-color:#f9f9f9;
    padding:15px 16px;
    text-decoration: none;
    display: block;
    margin: 2px 0;box-sizing:border-box;
    
}
   .vertical-menu li a{width:100%;position:absolute;right:0;top:0;
                       display:block;
        font-size: 1em;
        cursor: pointer;
        padding: 15px ;
        background-color: #f9f9f9;
        margin: -15px -15px;
        position:relative;
        color:#867979;

   }
    .vertical-menu li img{position:absolute;left:10px;top:25%;}
    .vertical-menu li .CountItem,.vertical-menu li .dropdown-content a .CountItem{position:absolute;left:15px;top:15%;border-radius:50%;padding:5px;text-align:center;min-height:20px;min-width:20px;font-size:.8em;border:1px solid #ccc;}
    .vertical-menu li .walletprice,.vertical-menu li .dropdown-content a .walletprice{position:absolute;left:35px;top:25%;border-radius:4px;padding:2px 5px;text-align:center;min-height:20px;min-width:20px;font-size:.8em;border:1px solid #ccc;}
    .vertical-menu li b,.vertical-menu li .dropdown-content a b{position:absolute;left:7px;top:25%;padding:5px 2px;min-height:20px;text-align:right;font-size:.7em;display:inline-block}
        .vertical-menu li:hover,.vertical-menu row:hover , .vertical-menu .current,.vertical-menu li a:hover,.vertical-menu li:hover .dropdown-content {
            background-color: #e7e7e7;
            color: #555;
            display: block;
            visibility: visible;
            opacity:1;
             /*box-sizing:border-box;*/
        }

        .vertical-menu li:first-child,.vertical-menu row:first-child {
            font-size: 1.2em;
            color:var(--box-color);
            cursor: pointer;
            padding: 5% 5px 5% 5px;/*40px*/
            background: var(--main-color); /*url(/images/formicon/guide.png) no-repeat 96% 50%;*/
            margin: 5px 0;
        }

            .vertical-menu li:first-child:hover,.vertical-menu row:first-child:hover {
                /*background: #b6ff00 url(/images/formicon/guide_h.png) no-repeat 96% 50%;*/
                color: var(--main-hover-color);
            }
    .vertical-menu .block,.vertical-menu .block:hover {
        background: var(--dark-box-color);
        cursor: not-allowed;
        opacity: .5;
    }


.titr {
    font-size: 1.6em;
    padding: 10px 14px;
    background: var(--dark-box-color);
    color: var(--dark-color);
    border-right: 4px solid var(--main-color);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    font-weight: 600;
}

.mamfeed-titr {
    border-bottom: 4px solid #ffd800;
    font-size: 1.6em;
    padding: 1% 15px 1% 0;
    /*margin:-20px 0 15px 0;*/
    color:#726100;
}
.mamfeed-vertical-menu {
    width: 100%;
    box-sizing: border-box;
    background-color:var(--box-color)ade;
}

   .mamfeed-vertical-menu li,.mamfeed-vertical-menu row{
        display:block;
        font-size: 1em;
        cursor: pointer;
        padding: 15px;
        background-color: #f9f9f9;
        margin: 2px 0;
        position:relative;
        color:#867979;
    }
   .mamfeed-vertical-menu li .dropdown-content {
    display: none;
    opacity:0;
    visibility:hidden;
    position: absolute;
    right:180px;
    top:0px;
    background-color:var(--main-color);
    min-width: 320px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    text-align:right; 
    padding:5px;
    box-sizing:border-box;
    -webkit-transition: opacity 5s, visibility 5s;
          transition: all 5s;
          overflow-y:auto;
          max-height:50vh;
}

 .mamfeed-vertical-menu li .dropdown-content a {
    
    color: #a99000;
    background-color:var(--box-color)ef7;
    padding:15px 16px;
    text-decoration: none;
    display: block;
    margin: 2px 0;box-sizing:border-box;
    
}
   .mamfeed-vertical-menu li a{width:100%;position:absolute;right:0;top:0;
                       display:block;
        font-size: 1em;
        cursor: pointer;
        padding: 15px ;
        background-color:var(--box-color)ef7;
        margin: -15px -15px;
        position:relative;
        color:#a99000;

   }
    .mamfeed-vertical-menu li img{position:absolute;left:10px;top:25%;}
    .mamfeed-vertical-menu li .CountItem,.mamfeed-vertical-menu li .dropdown-content a .CountItem{position:absolute;left:15px;top:15%;border-radius:50%;background-color:var(--box-color)ade;padding:5px;text-align:center;min-height:20px;min-width:20px;font-size:.8em;border:1px solid #ffd800;color:#726100;}

        .mamfeed-vertical-menu li:hover,.mamfeed-vertical-menu row:hover , .mamfeed-vertical-menu .current,.mamfeed-vertical-menu li a:hover,.mamfeed-vertical-menu li:hover .dropdown-content {
            background-color: var(--box-color)abc;
            color: #726100;
            display: block;
            visibility:visible;
            opacity:1;
             /*box-sizing:border-box;*/
        }

        .mamfeed-vertical-menu li:first-child,.mamfeed-vertical-menu row:first-child {
            font-size: 1.2em;         
            cursor: pointer;
            padding: 5% 40px 5% 5px;
            background: #ffd800 url(/images/formicon/guide.png) no-repeat 96% 50%;
            margin: 5px 0;
        }

            .mamfeed-vertical-menu li:first-child:hover,.mamfeed-vertical-menu row:first-child:hover {
                background: #ffd800 url(/images/formicon/guide_h.png) no-repeat 96% 50%;
                color: #555;
            }
    .mamfeed-vertical-menu .block,.mamfeed-vertical-menu .block:hover {
        background: var(--dark-box-color);
        cursor: not-allowed;
        opacity: .5;
    }

    



.box-btn {
    /*background-color: #009933;*/
    width: 91.5%;
    border: none;
    color: #009933;
    padding: 10px 0;
    text-align: center;
    display: inline-block;
    font-size: 1.4em;
    cursor: pointer;
    margin: 5px 4%;
    font-weight: bold;
    border: 1px solid #eee;
    background-color: #f1f1f1;
    transition: 1s background;
    position: relative;
}

    .box-btn:hover {
        /*background-color:var(--main-color);*/
        color: var(--box-color);
        background-color:  var(--main-color);
        border: 1px solid var(--box-color);
    }

.menu-item {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    position: absolute;
    z-index: 10;
    top: 12%;
    left: 8%;
    border: 3px solid var(--box-color);
    box-sizing: border-box;
    font-size: .8em;
    padding:5px;
    text-align:center;
}

.box-btn addtocart {
    background: var(--dark-box-color) url(/images/icon/shopping-basket1.png) no-repeat 18% 50%;
}

    .box-btn addtocart:hover {
        background: var(--main-color) url(/images/icon/shopping-basket2.png) no-repeat 18% 50%;
    }

/* باکس اصلی */
.category-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* = وسط‌چین افقی */
    align-items: flex-start; /* باکس‌ها بالا هم‌تراز می‌شن */
    gap: 20px; /* فاصله بین کارت‌ها */
    width: 100%;
    margin: 0 auto;
}
.box {
    border: 1px solid #eee;
    border-radius: 14px;
    overflow: hidden;
   /* float: right;*/
    background: #fff;
    transition: .3s ease;
    position: relative;

}

    /* hover کارت */
    .box:hover {
        box-shadow: 0 10px 25px rgba(0,0,0,.12);
        transform: translateY(-4px);
    }

/* ظرف تصویر */
.a-img-box {
    width: 100%;
    aspect-ratio: 16 / 9; /* نسبت تصویر → واکنش‌گرا */
    overflow: hidden;
    position: relative;
    display: block;
}


    /* عکس */
    .a-img-box img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: 1.2s ease;
    }

    /* zoom نرم */
    .a-img-box:hover img {
        transform: scale(1.15);
    }

/* عنوان روی عکس */
.box-h3 {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    margin: 0;
    padding: 12px;
    background: linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0));
    text-align: center;
    color: #fff;
    font-size: 1.2em;
    z-index: 3;
}

    /* لینک داخل عنوان */
    .box-h3 a {
        color: #fff;
        font-weight: 600;
        text-shadow: 0 2px rgba(0,0,0,.4);
        display: block;
    }

        /* پنهان کردن عنوان اگر کاربری عنوان نگذارد */
        .box-h3:empty,
        .box-h3 a:empty {
            display: none !important;
        }

.mami_image {
    border-radius: 50%;
    width: 120px;
    height: 120px;
    border: 1px dashed #555;
    padding: 2px;
    position: absolute;
    top: -55%;
    right: calc(50% - 60px);
    background: var(--box-color);
    overflow:visible;
}
.mami_image1 {
    border-radius: 50%;
    width: 80px;
    height: 80px;
    border: 1px dashed #555;
    padding: 2px;
    position: absolute;
    top: -25%;
    right: calc(50% - 40px);
    background: var(--box-color);
    overflow:visible;
}
 .mamiPanel{min-width:50px;background-color:#b6ff00;text-align:center;border:1px solid #ccc;padding:0 10px; font-size:.8em;font-weight:400;}
.box .row b {
    padding: 0px;
    margin: -5px 0 0px 0;
    display: inline-block;
    font-size: 1.4em;
    font-weight: 400;
    color: var(--main-color);
    /*width:100%;
    box-sizing:border-box;*/
}
.FoodPrice{text-decoration:line-through;}

    .box b:hover {
        color: #009933;
    }

.box p {
    margin: 10px 0; /*background:#f9f9f9;padding:10px;border:1px solid var(--dark-box-color);*/
}
.margin10-0{margin: 7px 2px;}
.box h1 {/*.box h2,*/
    font-size: 1.4em;   
    clear: both;
    padding: 0 2px;   
    font-weight:400;
}
.h-Red-center{color: var(--main-color);text-align: center;}
.h-black-center{color: #555;text-align: center;}
.h-Red-right{color: var(--main-color);text-align:right;}
.h-black-right{color: #555;text-align:right;}
#nav{padding-right:15px;}
#nav a{color:#555;}
    .box h2 a,.box h1 a,#nav a:hover {
        color: var(--main-color);
    }
    .box h2 a:hover,.box h1 a:hover {
        color: #009933;
    }
.date{position:relative;}
.rfvDate{position:absolute;top:-70px;right:0;width:97%;background-color:#f3fed7;height:70px;padding:15px 10px 10px 10px;box-sizing:border-box;opacity:.98;border:2px solid #b6ff00;border-radius:4px;font-size:1.2em;line-height:40px;margin:0 5px;/*overflow-y:auto;*/}
.rfvDate-closed{position:absolute;top:-65px; right:10px;background:url(/images/form-icon/closed.png) no-repeat;width:16px; height:16px;cursor:pointer;}
.rfvDate-closed:hover{background:url(/images/form-icon/red-closed.png) no-repeat;}
.row {
    padding: 5px 0;
    text-align: center;
    display:block;
    font-size:1em;
    /*z-index:99999;*/
}
.divreport{font-size:.8em;display:inline-block; padding:5px 5px;}
.divRecipereport{font-size:.85em;display:inline-block; padding: 1px 0px; border:1px dashed #eee; width:45%; margin:0 4% 1% -3%; border-radius:4px; background-color:var(--dark-box-color);}
.divNewsreport{font-size:.85em;display:inline-block; padding: 1px 0px; border:1px dashed #eee; width:31%; margin:0 1.8% 1% -1%; border-radius:4px; background-color:var(--dark-box-color);}
.telegram{font-size:1em;display:inline-block; padding:3px 0px 3px 15px;background-color:#00c8ff;border:2px solid #01e6e6; border-radius:4px;color:var(--box-color);font-weight:500;margin-left:4%;}
.divNewsreport img,.divRecipereport img,.divreport img,.telegram img{margin:5px 5px -5px 0;width:16px; height:16px;}
.divNewsreport a,.divRecipereport a,.divreport a{color:#555;}
.divNewsreport a:hover,.divRecipereport a:hover,.divreport a:hover{color:var(--main-color);}
.divkeyword{font-size:.8em;display:inline-block; padding: 0 3px;}
.divkeyword img{margin:20px 10px -10px 0;width:24px; height:24px;}
.divkeyword a{background-color:#f9f9f9; color:var(--main-color);border:1px solid var(--main-color);border-radius:4px;padding:5px 15px;margin:2px;transition:all 1s;display:inline-block;}
.divkeyword a:hover{background-color:var(--main-color);color:var(--box-color);}
.divshare{font-size:1.2em;font-weight:500;display:inline-block; padding:10px 15px 15px 20px;background-color:#00c8ff;border:2px solid #01e6e6; border-radius:4px;transition:all 1s;cursor:pointer;color:var(--box-color);}
.divshare img{margin:5px 2px -10px 2px;width:24px; height:24px;}
.divshare:hover,.telegram:hover{color:#00c8ff;border-color:#00c8ff;background-color:#d9f6fe;}
.txt-bold {
    font-weight: bold;
    display: inline;
}

.row .star {
    width: 14px;
    height: 14px;
}

.row .mamiimg {
    border-radius: 50%;
    max-width: 40px;
    max-height: 40px;
    border: 1px dashed #818181;
    float: right;
    margin: 0px 4% 5px 0px;
    padding: 2px;
}
.row .mamiimg28 {
    border-radius: 50%;
    max-width: 28px;
    max-height: 28px;
    border: 1px dashed #818181;
    float: right;
    margin: 0px 4% 5px 0px;
    padding: 2px;
}
.row .mamiimg128 {
    border-radius: 50%;
    max-width: 128px;
    max-height: 128px;
    border: 1px dashed #818181;
    float: right;
    margin: 0px 4% 5px 0px;
    padding: 2px;
}
.row .mamidelimg{float:right;width:24px;height:24px;margin: 11px 10px 5px -60px;}
.row .maminame {
    float: right;
    padding: 3px 5px 0 0;
    box-sizing: border-box;
    font-weight: 500;
    font-size:.9em;
    color:#726100;
    margin: 7px 2px;
}
.row .Rating .star{width:16px;height:16px;border:none;margin-top:2px;}
.row .maminame #MamiPicHelp {
        font-size: 1em;
        font-weight: normal;
        display:none;
    }

.txt-center {
    text-align:center;
}
.divCenter{margin:0 auto;}
.txt-right {
    text-align:right;
}

/*cart*/
.footercart{width:100%;color:var(--box-color);background-color:var(--main-color);text-align:center;position:fixed;bottom:0;padding:8px 0;font-size:1.2em;z-index:99;font-weight:500;display:none;cursor:pointer;}
.footercart span{background-color:var(--box-color);color:var(--main-color);border-radius:50%;margin-right:10px;padding:0px;position:relative;font-size:1em;display:inline-block;width:35px;height:35px;}
.orderbox {
    width: 100%;
    background-color: #ffe6e6;
    margin: 0 0 0 0;
    box-sizing: border-box;
    z-index: 9;
    text-align: right;
    display:block;
}

    .orderbox h3 {
        background: url(../images/title1.png) no-repeat right;
        padding: 10px 20px 20px 0;
        position: relative;
        top: 5px;
        right: -7px;
        color: var(--box-color);
        cursor: pointer;
        /*font-size:1em;*/
        font-weight: bold;

    }

    .orderbox .list {
        margin-top: 5px;
        border-bottom: 1px solid #f1f1f1;
        padding: 10px 2px;
        /*min-height:134px;*/
        height: 244px;
        overflow-x: hidden;
        font-size: 14px;
        display:block;
    }

    .orderbox .noitem {
        width: 100%;
        min-height: 100px;
        text-align: center;
        color: #5b5b5b;
        padding: 2px 0;
    }

        .orderbox .noitem #first-item {
            padding: 20px;
        }

    .orderbox .btnfinal {
        width: 100%;
        padding: 3% 10%;
        background: #009933;
        color: var(--box-color);
        text-align: center;
        margin: 0 auto;
        cursor: pointer;
        font-size: 1em;
        font-weight: bold;
        box-sizing: border-box;
        border-radius: 4px;
        -webkit-transition: all .5s;
        -moz-transition: all .5s;
        -o-transition: all .5s;
        -ms-transition: all .5s;
        transition: all .5s;
    }

.order {
    width: 96%;
    padding: 2px 2%;
    color: #555;
}

    .order .fbox {
        border: 1px solid #009933;
    }

    .order .fname {
        float: right;
        /*width: 68%;*/
        padding: 5px 0 6px 5px;
        cursor: pointer;
        position: relative;
        display: inline-block;
    }

        .order .fname .tooltip {
            visibility: hidden;
            width: 130px;
            /*background-color: var(--box-color);*/
            color: var(--box-color);
            text-align: center;
            padding: 2px;
            border-radius: 4px;
            padding: 2px;
            box-sizing: border-box;
            position: absolute;
            z-index: 10;
            top: 0;
            right: 20px;
            margin-left: 2px;
            opacity: 1;
            transition: 3s opacity;
        }
        .order .fname:hover .tooltip {
            visibility: visible;
            opacity: .2;
        }

        .order .fname .tooltip img {
            width: 100%;
            height: auto;
            margin: 0 auto;
        }

    .order .removeitem {
        float: right;
        width: 8%;
        padding: 3px 0 1px 0;
        min-height: 25px;
    }

        .order .removeitem img {
            width: 16px;
            height: 16px;
            cursor: pointer;
        }

    .order .oprice {
        float: right;
        padding: 0px 0 2px 0;
        font-size:1.1em;
    }
    .order .fprice {
        float: right;
        font-size: .9em;
        text-decoration:line-through #ee4149;
        padding-left:5px;
    }
        .order .oprice span {
            font-size: 10px;
        }

    .order .Ccount {
        float: left;
        width: 30px;
        height:30px;
        text-align: center;
        padding: 1px 0 0 0;
        box-sizing: border-box;
        border-radius: 50%;
        background-color: #ffd800;
        border: 1px solid #bbb;
        margin: -1% 2% 0 0;
    }
    .order .reserve{font-size:.8em; width:100%;}
    .order .percent{font-size:.8em;color:var(--main-color);float:left;padding:5px 0 0 5px;}
    .order .btn {
        float: left;
        width: 8%;
        text-align: center;
        padding: 0 1px;
        cursor: pointer;
        line-height: 20px;
        border-top: 2px solid #bbb;
        border-bottom: 2px solid #bbb;
        background-color: var(--dark-box-color);
    }

    .order .minus {
        border-radius: 50% 0 0 50%;
        border-left: 2px solid #bbb;
        border-right: 1px solid #bbb;
    }

    .order .add {
        border-radius: 0 50% 50% 0;
        border-left: 1px solid #bbb;
        border-right: 2px solid #bbb;
    }

    .order .minus:hover {
        background-color: #ccc;
        color: var(--main-color);
    }

    .order .add:hover {
        background-color: #ccc;
        color: #009933;
    }

.line {
    border: none;
    border-bottom: 1px dashed #bbb;
    margin: 0px auto;
    width: 99%;
    clear: both;
    box-sizing: border-box;
}
.sum {
    width: 100%;
    background: var(--box-color)2f3;
    font-size: .8em;
    padding:5px;
    color: #555;
    display: inline-block;
    box-sizing: border-box;
}

    .sum .R {
        float: right;
        width: 50%;
        padding: 2% 2% 0 0;
        margin-bottom: 0%;
        box-sizing:border-box;
    }

    .sum .L {
        float: left;
        width: 50%;
        padding: -2% 0 1% 2%;
        margin-bottom: 0%;
        box-sizing:border-box;
        text-align:left;
    }

        .sum .L span {
            font-size: 1.5em;
        }
        .sum .R span{font-size: 1.2em;}

    .sum p {
        font-size: .8em;
        padding: 10px 0 0 0;
        width: 100%;
        text-align: center;
        box-sizing: border-box;
    }
.txt-Green{color:#027629}
.txt-Red{color:var(--main-color);}
.txt-Red-error{color:#ff0000;}
.txt-Orange{color:#ff6a00;}
.txt-Brown{color:#726100;}
.txt-Sorkhabi{color:var(--main-hover-color);}
.txt-Sormei{color: var(--main-color);}
.txt-White{color:var(--box-color);}
.txt-lightBlack{color:#867979;}
.txt-oldPrice{text-decoration:line-through var(--main-color);}
/*endcart*/
/*Footer*/
.footerbox {
    padding:1%;
    float: right;
    background-color:var(--box-color);
    box-sizing: border-box;
    font-size: .8em;
    transition: .2s all;
    text-align: center;
    margin:0 5px 10px 5px;
    border-radius:0 0 4px 4px;
    opacity:.6;
    color: #333;
}

    .footerbox a {
        display: block;
        color: #333;
        font-size: 1em;
        background-repeat: no-repeat;
        padding: 2px 35px 2px 0;
        transition: 2s background-image;
        text-align: right;
        margin: 0 0 0 10px;opacity:1;
    }

        .footerbox a:hover {
            color: #202020;
            font-weight: bold;
        }
/*#about_us {background: url('/images/formicon/footericon.png') 102% -722px no-repeat;}
#about_us:hover {background: url('/images/formicon/footericon.png') 102% -692px no-repeat;}
#contact_us {background: url('/images/formicon/footericon.png') 102% -90px no-repeat;}
#contact_us:hover {background: url('/images/formicon/footericon.png') 102% -60px no-repeat;}
#work_with_us,#agent {background: url('/images/formicon/footericon.png') 102% -601px no-repeat;}
#work_with_us:hover,#agent:hover {background: url('/images/formicon/footericon.png') 102% -571px no-repeat;}
#guide {background: url('/images/formicon/footericon.png') 102% -194px no-repeat;}
#guide:hover {background: url('/images/formicon/footericon.png') 102% -164px no-repeat;}
#lnkmami {background: url('/images/formicon/footericon.png') 102% -315px no-repeat;}
#lnkmami:hover {background: url('/images/formicon/footericon.png') 102% -285px no-repeat;}
#lnkmenu {background: url('/images/formicon/footericon.png') 102% -376px no-repeat;}
#lnkmenu:hover {background: url('/images/formicon/footericon.png') 102% -346px no-repeat;}
#foodreserve {background: url('/images/formicon/footericon.png') 102% -662px no-repeat;}
#foodreserve:hover {background: url('/images/formicon/footericon.png') 102% -632px no-repeat;}
#blog {background: url('/images/formicon/footericon.png') 102% -865px no-repeat;}
#blog:hover {background: url('/images/formicon/footericon.png') 102% -805px no-repeat;}
#mfnews {background: url('/images/formicon/footericon.png') 102% -435px no-repeat;}
#mfnews:hover {background: url('/images/formicon/footericon.png') 102% -405px no-repeat;}
#lnksabzak {background: url('/images/formicon/footericon.png') 102% -749px no-repeat;}
#lnksabzak:hover {background: url('/images/formicon/footericon.png') 102% -779px no-repeat;}
#mruls {background: url('/images/formicon/footericon.png') 102% -255px no-repeat;}
#mruls:hover {background: url('/images/formicon/footericon.png') 102% -225px no-repeat;}
#company {background: url('/images/formicon/footericon.png') 102% -32px no-repeat;}
#company:hover {background: url('/images/formicon/footericon.png') 102% -2px no-repeat;}
#party {background: url('/images/formicon/footericon.png') 102% -496px no-repeat;}
#party:hover {background: url('/images/formicon/footericon.png') 102% -466px no-repeat;}
.tNews {background: url('/images/form-icon/footericon.png') calc(100% - 5px) -119px no-repeat;width: 60%;font-size:1.2em;}
.bNews {background: url('/images/form-icon/footericon.png') 10px -522px no-repeat;background-color: var(--main-color);display:inline-block;font-size:1.4em;}*/
.social{float:left;margin:0 10px;}
.social a{width:24px;height:24px;display:inline-block;}
.namad{width:90px;height:95px;}
.bg-android {background: url('/images/form-icon/social/socialicon.png') -54px -10px;}
.bg-aparat {background: url('/images/form-icon/social/socialicon.png') -142px -98px;}
.bg-facebook {background: url('/images/form-icon/social/socialicon.png') -10px -54px;}
.bg-google_plus {background: url('/images/form-icon/social/socialicon.png') -54px -54px;}
.bg-instagram {background: url('/images/form-icon/social/socialicon.png') -98px -10px;}
.bg-linkedin {background: url('/images/form-icon/social/socialicon.png') -98px -54px;}
.bg-pinterest {background: url('/images/form-icon/social/socialicon.png') -10px -10px;}
.bg-rss {background: url('/images/form-icon/social/socialicon.png') -54px -98px;}
.bg-skype {background: url('/images/form-icon/social/socialicon.png') -98px -98px;}
.bg-telegram {background: url('/images/form-icon/social/socialicon.png') -142px -10px;}
.bg-twitter {background: url('/images/form-icon/social/socialicon.png') -10px -98px;}
.bg-youtube {background: url('/images/form-icon/social/socialicon.png') -142px -54px;}

#btnNews:hover {background-color: #009933;}
.copy {
    text-align: center;
    width: 100%;
    padding: 5px 0;
    display: block;
    clear: both;
    /*background-color: var(--dark-box-color);*/
    font-size: .6em;
}
/*endFooter*/

 .comment {
    width: 100%;   
    padding: 8px;
    box-sizing: border-box;
    margin: 10px 0;    
}

.comment h3{
        padding: 20px 70px 20px 8px;
        margin-bottom: 10px;
        position:relative;
        vertical-align:middle;
        display:block;
    }
.comment h3 img {
            position: absolute;
            right: 5px;
            top:5px;
            padding:2px;
            border:1px dashed #818181;
            border-radius:50%;
            width:48px;
            height:48px;
        }
.btnReply{margin:-8px 0 -10px 0;}
.comment b {
        float: left;
        font-size: 1em;
        font-weight: normal;
        color: #867979;
    }
.comment p{padding:.5% 1%;}
.usercomment{border: 1px solid var(--dark-box-color);background: var(--box-color);}
.admincomment{border: 1px solid #fee9db;background: var(--box-color);display:inline-block;}
.admincomment .userreply{ border: 1px solid #f1f1f1;background: #f9f9f9; width:93%;float:right; margin:-3px 0 20px 0;font-size:.8em;}
.admincomment .answer{width:7%;float:right;}
.usercomment h3{background: var(--dark-box-color)}
.admincomment h3{background: #fee9db;}
.admincomment .userreply h3 {background: #f1f1f1; padding: 10px 50px 10px 8px;}
.admincomment .userreply h3 img{width:32px;height:32px;}
.admin-comment {
    width: 100%;
    background: var(--box-color);
    padding: 8px;
    box-sizing: border-box;
    margin: 10px 0;
    border: 1px solid #ffd2b2;
    display:inline-block;
}
  .admin-comment h3 {
        background: #ffd2b2 url(/images/formicon/man.png) no-repeat 99% 50%;
        padding: 8px 45px 8px 8px;
        margin-bottom: 10px;
    }
 .admin-comment .user-question {
     float:right;
        width: 93%;
        background: #f9f9f9;
        padding: 8px;
        box-sizing: border-box;
        margin:0 0 10px 0;
        border: 1px solid #f1f1f1;
    }
 .admin-comment .answer{width:7%;float:right;}
 .admin-comment .user-question h3 {
        background: #f1f1f1 url(/images/formicon/man.png) no-repeat 99% 50%;
        padding: 8px 45px 8px 8px;
        margin-bottom: 10px;
    }
 .user-comment {
    width: 100%;
    background: var(--box-color);
    padding: 8px;
    box-sizing: border-box;
    margin: 10px 0;
    border: 1px solid var(--dark-box-color);
    font-size:.9em;
}

    .user-comment h3 {
        background:var(--box-color)9f9; /*#ffe6e6;*/
        padding: 12px 65px 8px 8px;
        margin-bottom: 10px;
        position:relative;
        line-height:20px;
        font-weight: normal;
        
    }
.user-comment h3 .uimage {position:absolute;top:5px;right:3px;border:1px dashed #888; border-radius:50%; padding:2px; width:50px;height:50px;}
    .user-comment b {
        float: left;
        font-size: 1em;
        font-weight: normal;
        color: #867979;
    }
.mleft1 {
    margin-left: 1%;
}

.mright1 {
    margin-right: 1%;
}

.mright2 {
    margin-right: 2%;
}

.mtop1 {
    margin-top: 1%;
}
.mtop-20 {
    margin-top: -20px;
}
.mtop-10 {
    margin-top: -10px;
}
.mtop-5 {
    margin-top: -5px;
}
.mbottom1 {
    margin-bottom: 1%;
}
.mbottom30 {
    margin-bottom:-30px;
}

.m-1 {
    margin: 1%;
}
.mr20 {
    margin-right: 20px;
}
.ml20 {
    margin-left: 20px;
}
.mt-12l-6{margin:-12px 0 0 -6px;}

.mtop2 {
    margin-top: 2%;
}

.mbottom2 {
    margin-bottom: 2%;
}

.m-foodbox,.m-Counter {
    margin: 1.5% 2.2% 0 0;
}

.p-2 {
    padding: 2% 2.5%;
}

.p-1200 {
    padding: 1.5% 2% 0 0;
}

.p-12 {
    padding: 1.5% 2%;
}
.p-1{padding:1%;}
.ptop15{padding:15px;}
.pt15px{padding-top:15px;}
.pb15px{padding-bottom:15px;}
.p-10px{padding:10px;}
.pr35p{padding-right:35px;}
.pr70p{padding-right:70px;}
.pr10p{padding-right:10px;}
.plr5p{padding:0 5px;}
.mCenter{margin:10px auto;float:initial;}
.CenterPosition{margin-left:auto;margin-right:auto;display:block;}



#ddlFoodGroup,#ddlSabzakGroup {
    width: 33%;
    font-size:1em;
    background-image: url(/images/formicon/sortdown.png);
}

#ddlFoodSort {
    width: 33%;
    font-size:1em;
    background-image: url(/images/formicon/sortdown.png);
}

#txtFoodSearch {
    width: 33%;
    font-size:1em;
    background-image: url(/images/formicon/FoodSearch.png);
}

#txtMamiSearch {
    width: 26.5%;
    background-image: url(/images/formicon/mamisearch.png);
}




.btn-sort {
    float: right;
    width: 15%;
    padding: 10px 5px;
    box-sizing: border-box;
    border: 2px solid #bbb;
    text-align: center;
    margin: .5%;
    cursor: pointer;
    border-radius: 4px;
    background-color: var(--dark-box-color);
    font-size: 1.2em;
    font-family:MamiFood;
}

    .btn-sort:first-child {
        border: none;
        margin-right: 0;
        width: 19%;
        color: #867979;
        font-weight: bold;
        background-color: var(--box-color);
        font-size: 1.2em;
    }
        .btn-sort:first-child:hover {
            border:none;
            cursor:auto;
        }

    .btn-sort:hover{
        color: var(--main-color);
        border: 2px solid var(--main-color);
        background-color: var(--box-color);
        font-size: 1.2em; /*font-weight:bold;*/
    }

.btn-sort-selected {
    float: right;
    width: 15%;
    padding: 10px 5px;
    box-sizing: border-box;
    border: 2px solid var(--main-color);
    text-align: center;
    margin: .5%;
    color: var(--main-color);
    font-weight: 500;
    border-radius: 4px;
    background-color: var(--box-color);
    font-size: 1.2em;
    font-family:MamiFood;
}

/*Form*/
.title-defaultimage{display:block;margin:0;background-color:#f3fed7;font:1.2em Mamifood;color:#009933;padding:1% 0;width:100%;text-align:center;border-bottom:2px solid #b6ff00;box-sizing:border-box;}
.success-message{display:inline-block; margin:15px 5px;border:2px solid #b6ff00;background-color:#f3fed7;font:1em Mamifood;color:#009933;padding:.5% 1%;border-radius:4px;text-align:center;}
.success-message2{display:inline-block; margin:15px 5px;border:2px solid #b6ff00;background-color:#b6ff00;font:1em Mamifood;color:#009933; padding:.5% 1%;border-radius:4px;text-align:center;}
.error-message{display:inline-block; margin:0 5px 10px 5px;border:2px solid #ee4149;background-color:#fec1c1;font:1em Mamifood;color:#ee4149;padding:.5% 1%;border-radius:4px;text-align:center;font-size:.8em;}
.error-message2{display:inline-block; margin:0 auto;border:2px solid var(--main-color);background-color:var(--box-color);font:1em Mamifood;color:var(--main-color);padding:.5% 1%;border-radius:4px;text-align:center;}
.error-message3{display:inline-block; margin:-5px 0;background-color:var(--box-color);font:1em Mamifood;color:var(--main-color);padding-right:12px;box-sizing:border-box;}
.admin-message{display:block;margin:0 auto 3% auto;border:2px solid #b6ff00;background-color:#f3fed7;font:1.2em Mamifood;color:#009933;padding:1% 3%;width:75%;border-radius:4px;position:relative;text-align:center;}
.mamfeed-message{display:block;margin:0 auto 3% auto;border:2px solid #ffd800;background-color:var(--box-color)ade;font:1.2em Mamifood;color:#726100;padding:1% 3%;width:75%;border-radius:4px;position:relative;text-align:center;}
.closed,.hclosed{position:absolute;top:10px; right:10px;background:url(/images/form-icon/closed.png) no-repeat;width:16px; height:16px;cursor:pointer;}
.closed:hover,.hclosed:hover{background:url(/images/form-icon/red-closed.png) no-repeat;}
.admin-message p{padding:1% 0;}
.admin-message p b{font-weight:bold;text-decoration:underline;}
.admin-message .warning{color:var(--main-color);}
.admin-message .warning img{margin-left:2px;position:relative;top:5px;}
.btn-adminMessage{ background-color:#b6ff00;
        border:1px solid #009933;
        border-top:none;
        color: #009933;
        border-radius: 0 0 4px 4px;
        padding: 5px 25px;
        text-align: center;
        font-weight: 500;
        cursor: pointer;
        margin:0px 0px 0px 2px;
        position:absolute;
        top:-11px;
        right:calc(100% - 100px);
        display:none;
        /*-webkit-transition: all .5s;
        -moz-transition: all .5s;
        -o-transition: all .5s;
        -ms-transition: all .5s;
        transition: all .5s;*/

}
.underline{border-bottom:1px solid #e7e7e7;}
.form {
    width:100%; padding:10px;box-sizing:border-box;position:relative;font-size:1em;
}
.min-height60vh{min-height:60vh}
.form .txt {
        float: right;
       /* background-color: var(--box-color);*/
        font: 1em MamiFood;
        color: #555;
        padding: 10px 15px;
        margin: 8px .5%;
        border: 1px solid #e7e7e7;
        border-radius: 4px;
        transition: .5s all;
        box-sizing: border-box;
    }
.form .txt:hover,.form .txt:focus {
            outline: none;
            /*font-size:1.2em;*/
            border: 1px solid #ee4149;
            box-shadow: 0px 0px 3px 0px var(--main-color);
            opacity: 1;
            color: #ee4149;
        }
.form .lable{ float: right;
        background-color: var(--box-color);
        font: 1em MamiFood;
        color: #555;
        padding: 10px 15px;
        margin: 2px .5%;/*8px*/
        /*border-bottom: 1px solid #e7e7e7;*/
        transition: .5s all;
        box-sizing: border-box;}
 .form .lable1{float:right;margin:5px .5% -5px .5%;padding: 0px 4px;/*border:1px solid var(--box-color);*/box-sizing:border-box;text-align:right;font:1em MamiFood;}
.form .btnInsert{margin:30px auto; padding:13px 30px; background-color:#009933;color:#b6ff00;font: 1.4em MamiFood;display:block; cursor:pointer;border-radius:4px;border:2px solid #009933;}
.form .btnInsert:hover,.form .btnInsert:focus{background-color:#b6ff00;color:#009933;}
.form .btn{margin:9px 2px; padding:7px 35px 7px 15px; font:bold 1.2em MamiFood; cursor:pointer;border-radius:4px;border:none;}
.form div-group{float: right; width: 50%; box-sizing: border-box; padding: 1%;}
.form .counter{position:absolute;top:4px;left:5px;min-width:35px;min-height:35px;font-size:.8em; border:1px solid #bbb; border-radius:50%;text-align:center;background-color:#f9f9f9;padding:6px 3px;box-sizing:border-box;}
.form .btnicon{position:absolute;top:20%;right:6px;}
.form .add{background:#70cb70 url(/images/form-icon/add.png) no-repeat calc(100% - 5px) 50%;color:#027629;position:relative;
    top: 0px;
    right: 0px;
}
.form .sent{background:#70cb70 url(/images/form-icon/sent.png) no-repeat  calc(100% - 5px) 50%;color:#027629;}
.form .accept{background:#70cb70 url(/images/form-icon/checked.png) no-repeat  calc(100% - 6px) 50%;color:#027629;}
.form .update{background: url('/images/form-icon/update.png') calc(100% - 5px) 50% no-repeat;
    color:#ff6a00;border:1px solid #ff6a00;opacity:.7;transition:1s opacity;
    background-color: #ffd2b2;
    background-attachment: scroll;
}
.form .delete{background:#fec1c1 url(/images/form-icon/delete.png) no-repeat 90% 50%;color:var(--main-color);border:1px solid var(--main-color);opacity:.7;transition:1s opacity;}
.form .btnRed{background:#fec1c1;color:var(--main-color);border:1px solid var(--main-color);transition:1s opacity;}
.form .onTopLeft{position:absolute;left:26px;
top:-62px;
}
.form .onTopLeft2{position:absolute;left:0px;top:0px;}
.form .download{background:#b6ff00 url(/images/form-icon/download.png) no-repeat 90% 50%;color:#009933;border:1px solid #009933;opacity:.7;transition:1s opacity;text-decoration:none;}
.form .cancel{background:#b6ff00 url(/images/form-icon/cancel.png) no-repeat 90% 50%;color:#009933;border:1px solid #009933;opacity:.7;transition:1s opacity;}
.form .show{background:var(--dark-box-color) url(/images/form-icon/show.png) no-repeat 93% 50%;color:#818181;border:1px solid #818181;opacity:.7;transition:1s opacity;}
.form .search{background:var(--main-color) url(/images/form-icon/WhiteSearch.png) no-repeat 93% 50%;color:var(--box-color);border:1px solid var(--main-color);opacity:.7;transition:1s opacity;}
.form .Refree{background:#ffd2b2 url(/images/form-icon/whistle.png) no-repeat 93% 50%;color:#ff6a00;border:1px solid #ff6a00;opacity:.7;transition:1s opacity;}
.form .map{background:url(/images/form-icon/green-marker.png) no-repeat calc(100% - 10px) 50%;color:#009933;border-bottom:1px dotted #009933;opacity:.7;transition:2s opacity;box-sizing:border-box;}
.form .map:hover{background:url(/images/form-icon/red-marker.png) no-repeat calc(100% - 10px) 50%;color:var(--main-color);border-bottom:1px dotted var(--main-color);opacity:1;}

 .btn-nopad{padding:5px; font:500 .9em MamiFood; cursor:pointer;border-radius:4px;text-align:center;}
.form .btn-counter{margin:2px; padding:8px 10px 8px 50px; font:bold 1.2em MamiFood; cursor:pointer;border-radius:4px;display:inline-block;}
.form .btn-counter-icon{margin:9px 2px; padding:8px 35px 8px 43px; font:bold 1.2em MamiFood; cursor:pointer;border-radius:4px;}
.form .btn_silver{background:var(--dark-box-color);color:#818181;border:1px solid #818181;}
.form .btn_disable{background:#f8f8f8;color:#bbb;border:1px solid #bbb;}
.form .btn_Yellow{background:#fce97e;color:#655f31;border:1px solid #655f31;}
.form .btn_Green{background:#70cb70;color:#027629;border:1px solid #027629;}
.form .btn_Red{background:#fec1c1;color:var(--main-color);border:1px solid var(--main-color);}
.form .btn_Orange{background:#ffd2b2;color:#ff6a00;border:1px solid #ff6a00;}
.form .btn_Purple{background:#efcefe;color:#b200ff;border:1px solid #b200ff;}
.form .btn_Blue{background:#a1ebff;color:#007696;border:1px solid #007696;}
.form .btn_Brown{background:#f4d9be;color:#784614;border:1px solid #784614;}
.form .btn_gold1{background:#ffd700;color:#655f31;border:1px solid #655f31;}
.form .btn_gold2{background:#ffeb7f;color:#655f31;border:1px solid #655f31;}
.form .btn_gold3{background:var(--box-color)7cc;color:#655f31;border:1px solid #655f31;}
.form .selectbtn{border-bottom:3px solid #ee4149;display:inline-block; padding:2px 0;}
.radius12px{border-radius:12px;}
.radius4px{border-radius:4px;}

.form .prewiew{width:100px; height:50px;border:1px solid #e7e7e7;padding:2px;margin:9px 5px -29px 0;}
 .prewiew-FS{width:24px; height:24px;padding:2%;}
.form .update:hover,.form .delete:hover,.form .cancel:hover{opacity:1;}
    .form .iconpad {
        padding-right: 50px;
       /* background-position: 98% 50%;
        background-repeat: no-repeat;*/
    }
    .form .nextline{clear:both;}
    .form .Right-aline{text-align:right;}
    .form .Left-aline:focus {
        direction: ltr;
    }
    .icon-phone{background:url(/images/form-icon/Phone24.png) no-repeat calc(100% - 10px) 50%;}
    .icon-phone:hover,.icon-phone:focus{background:url(/images/form-icon/Red-Phone.png) no-repeat calc(100% - 10px) 50%;}
    .icon-cellphone{background:url(/images/form-icon/CellPhone24.png) no-repeat calc(100% - 10px) 50%;}
    .icon-cellphone:hover,.icon-cellphone:focus{background:url(/images/form-icon/Red-CellPhone.png) no-repeat calc(100% - 10px) 50%;}
    .icon-user{background:url(/images/form-icon/user24.png) no-repeat calc(100% - 10px) 50%;}
    .icon-user:hover,.icon-user:focus{background:url(/images/form-icon/red-user.png) no-repeat calc(100% - 10px) 50%;}
    .icon-family{background:url(/images/form-icon/family.png) no-repeat calc(100% - 10px) 50%;}
    .icon-family:hover,.icon-family:focus{background:url(/images/form-icon/red-family.png) no-repeat calc(100% - 10px) 50%;}
    .icon-chef{background:url(/images/form-icon/chef24.png) no-repeat calc(100% - 10px) 50%;}
    .icon-chef:hover,.icon-chef:focus{background:url(/images/form-icon/red-chef.png) no-repeat calc(100% - 10px) 50%;}
    .icon-ostan{background:url(/images/form-icon/ostan24.png) no-repeat calc(100% - 10px) 50%;}
    .icon-ostan:hover,.icon-ostan:focus{background:url(/images/form-icon/red-ostan.png) no-repeat calc(100% - 10px) 50%;}
    .icon-city{background:url(/images/form-icon/city24.png) no-repeat calc(100% - 10px) 50%;}
    .icon-city:hover,.icon-city:focus{background:url(/images/form-icon/red-city.png) no-repeat calc(100% - 10px) 50%;}
    .icon-zone{background:url(/images/form-icon/zone24.png) no-repeat calc(100% - 10px) 50%;}
    .icon-zone:hover,.icon-zone:focus{background:url(/images/form-icon/red-zone.png) no-repeat calc(100% - 10px) 50%;}
    .icon-idcard{background:url(/images/form-icon/idcard24.png) no-repeat calc(100% - 10px) 50%;}
    .icon-idcard:hover,.icon-idcard:focus{background:url(/images/form-icon/red-idcard.png) no-repeat calc(100% - 10px) 50%;}
    .icon-postcode{background:url(/images/form-icon/postcode24.png) no-repeat calc(100% - 10px) 50%;}
    .icon-postcode:hover,.icon-postcode:focus{background:url(/images/form-icon/red-postcode.png) no-repeat calc(100% - 10px) 50%;}
    .icon-address{background:url(/images/form-icon/address24.png) no-repeat calc(100% - 10px) 15%;}
    .icon-address:hover,.icon-address:focus{background:url(/images/form-icon/red-address.png) no-repeat calc(100% - 10px) 15%;}
    .icon-resume{background:url(/images/form-icon/resume.png) no-repeat calc(100% - 10px) 15%;}
    .icon-resume:hover,.icon-resume:focus{background:url(/images/form-icon/red-resume.png) no-repeat calc(100% - 10px) 15%;}
    .icon-melicode{background:url(/images/form-icon/melicode.png) no-repeat calc(100% - 10px) 50%;}
    .icon-melicode:hover,.icon-melicode:focus{background:url(/images/form-icon/red-melicode.png) no-repeat calc(100% - 10px) 50%;}
    .icon-edjucation{background:url(/images/form-icon/edjucation.png) no-repeat calc(100% - 10px) 50%;}
    .icon-edjucation:hover,.icon-edjucation:focus{background:url(/images/form-icon/red-edjucation.png) no-repeat calc(100% - 10px) 50%;}
    .icon-lunch{background:url(/images/form-icon/lunch.png) no-repeat calc(100% - 10px) 50%;}
    .icon-lunch:hover,.icon-lunch:focus{background:url(/images/form-icon/red-lunch.png) no-repeat calc(100% - 10px) 50%;}
    .icon-bankcard{background:url(/images/form-icon/bankcard.png) no-repeat calc(100% - 10px) 50%;}
    .icon-bankcard:hover,.icon-bankcard:focus{background:url(/images/form-icon/red-bankcard.png) no-repeat calc(100% - 10px) 50%;}
     .icon-bank{background:url(/images/form-icon/bank.png) no-repeat calc(100% - 10px) 50%;}
    .icon-bank:hover,.icon-bank:focus{background:url(/images/form-icon/red-bank.png) no-repeat calc(100% - 10px) 50%;}
    .icon-delivery{background:url(/images/form-icon/delivery.png) no-repeat calc(100% - 10px) 50%;}
    .icon-delivery:hover,.icon-delivery:focus{background:url(/images/form-icon/red-delivery.png) no-repeat calc(100% - 10px) 50%;}
    .icon-money{background:url(/images/form-icon/money.png) no-repeat calc(100% - 10px) 50%;}
    .icon-money:hover,.icon-money:focus{background:url(/images/form-icon/red-money.png) no-repeat calc(100% - 10px) 50%;}
    .icon-image{background:url(/images/form-icon/image.png) no-repeat calc(100% - 10px) 50%;}
    .icon-image:hover,.icon-image:focus{background:url(/images/form-icon/red-image.png) no-repeat calc(100% - 10px) 50%;}
    .icon-healthcard{background:url(/images/form-icon/healthcard.png) no-repeat calc(100% - 10px) 50%;}
    .icon-healthcard:hover,.icon-healthcard:focus{background:url(/images/form-icon/red-healthcard.png) no-repeat calc(100% - 10px) 50%;}
    .icon-contract{background:url(/images/form-icon/contract.png) no-repeat calc(100% - 10px) 50%;}
    .icon-contract:hover,.icon-contract:focus{background:url(/images/form-icon/red-contract.png) no-repeat calc(100% - 10px) 50%;}
    .icon-recipe{background:url(/images/form-icon/recipe.png) no-repeat calc(100% - 10px) 15%;}
    .icon-recipe:hover,.icon-recipe:focus{background:url(/images/form-icon/red-recipe.png) no-repeat calc(100% - 10px) 15%;}
    .icon-menu{background:url(/images/form-icon/menu.png) no-repeat calc(100% - 10px) 50%;}
    .icon-menu:hover,.icon-menu:focus{background:url(/images/form-icon/red-menu.png) no-repeat calc(100% - 10px) 50%;}
    .icon-food{background:url(/images/form-icon/food.png) no-repeat calc(100% - 10px) 50%;}
    .icon-food:hover,.icon-food:focus{background:url(/images/form-icon/red-food.png) no-repeat calc(100% - 10px) 50%;}
    .icon-measure{background:url(/images/form-icon/measure.png) no-repeat calc(100% - 10px) 50%;}
    .icon-measure:hover,.icon-measure:focus{background:url(/images/form-icon/red-measure.png) no-repeat calc(100% - 10px) 50%;}
     .icon-groceries{background:url(/images/form-icon/groceries.png) no-repeat calc(100% - 10px) 50%;}
    .icon-groceries:hover,.icon-groceries:focus{background:url(/images/form-icon/red-groceries.png) no-repeat calc(100% - 10px) 50%;}
     .icon-count{background:url(/images/form-icon/count.png) no-repeat calc(100% - 10px) 50%;}
    .icon-count:hover,.icon-count:focus{background:url(/images/form-icon/red-count.png) no-repeat calc(100% - 10px) 50%;}
    .icon-email{background:url(/images/form-icon/email.png) no-repeat calc(100% - 10px) 50%;}
    .icon-email:hover,.icon-email:focus{background:url(/images/form-icon/red-email.png) no-repeat calc(100% - 10px) 50%;}
    .icon-pincode{background:url(/images/form-icon/pincode.png) no-repeat calc(100% - 10px) 50%;}
    .icon-pincode:hover,.icon-pincode:focus{background:url(/images/form-icon/red-pincode.png) no-repeat calc(100% - 10px) 50%;}
    .icon-password{background:url(/images/form-icon/password.png) no-repeat calc(100% - 10px) 50%;}
    .icon-password:hover,.icon-password:focus{background:url(/images/form-icon/red-password.png) no-repeat calc(100% - 10px) 50%;}
     .icon-wallet{background:url(/images/form-icon/wallet.png) no-repeat calc(100% - 10px) 50%;}
    .icon-wallet:hover,.icon-wallet:focus{background:url(/images/form-icon/red-wallet.png) no-repeat calc(100% - 10px) 50%;}
     .icon-judge{background:url(/images/form-icon/judge.png) no-repeat calc(100% - 10px) 50%;}
    .icon-judge:hover,.icon-judge:focus{background:url(/images/form-icon/red-judge.png) no-repeat calc(100% - 10px) 50%;}
     .icon-title{background:url(/images/form-icon/title.png) no-repeat calc(100% - 10px) 50%;}
    .icon-title:hover,.icon-title:focus{background:url(/images/form-icon/red-title.png) no-repeat calc(100% - 10px) 50%;}
    .icon-summery{background:url(/images/form-icon/summery.png) no-repeat calc(100% - 10px) 15%;}
    .icon-summery:hover,.icon-summery:focus{background:url(/images/form-icon/red-summery.png) no-repeat calc(100% - 10px) 15%;}
    .icon-content{background:url(/images/form-icon/content.png) no-repeat calc(100% - 10px) 50%;}
    .icon-content:hover,.icon-content:focus{background:url(/images/form-icon/red-content.png) no-repeat calc(100% - 10px) 50%;}
    .icon-keyword{background:url(/images/form-icon/keyword.png) no-repeat calc(100% - 10px) 50%;}
    .icon-keyword:hover,.icon-keyword:focus{background:url(/images/form-icon/red-keyword.png) no-repeat calc(100% - 10px) 50%;}
    .icon-url{background:url(/images/form-icon/url.png) no-repeat calc(100% - 10px) 50%;}
    .icon-url:hover,.icon-url:focus{background:url(/images/form-icon/red-url.png) no-repeat calc(100% - 10px) 50%;}
    .icon-link{background:url(/images/form-icon/link.png) no-repeat calc(100% - 10px) 50%;}
    .icon-link:hover,.icon-link:focus{background:url(/images/form-icon/red-link.png) no-repeat calc(100% - 10px) 50%;}
    .icon-radius{background:url(/images/form-icon/radius.png) no-repeat calc(100% - 10px) 50%;}
    .icon-radius:hover,.icon-radius:focus{background:url(/images/form-icon/red-radius.png) no-repeat calc(100% - 10px) 50%;}
    .icon-color{background:url(/images/form-icon/color.png) no-repeat calc(100% - 10px) 50%;}
    .icon-color:hover,.icon-color:focus{background:url(/images/form-icon/red-color.png) no-repeat calc(100% - 10px) 50%;}
    .icon-zoom{background:url(/images/form-icon/zoom.png) no-repeat calc(100% - 10px) 50%;}
    .icon-zoom:hover,.icon-zoom:focus{background:url(/images/form-icon/red-zoom.png) no-repeat calc(100% - 10px) 50%;}
    .icon-method{background:url(/images/form-icon/method.png) no-repeat calc(100% - 10px) 50%;}
    .icon-method:hover,.icon-method:focus{background:url(/images/form-icon/red-method.png) no-repeat calc(100% - 10px) 50%;}
    .icon-skill{background:url(/images/form-icon/skill.png) no-repeat calc(100% - 10px) 50%;}
    .icon-skill:hover,.icon-skill:focus{background:url(/images/form-icon/red-skill.png) no-repeat calc(100% - 10px) 50%;}
    .icon-meal{background:url(/images/form-icon/meal.png) no-repeat calc(100% - 10px) 50%;}
    .icon-meal:hover,.icon-meal:focus{background:url(/images/form-icon/red-meal.png) no-repeat calc(100% - 10px) 50%;}
    .icon-groups{background:url(/images/form-icon/groups.png) no-repeat calc(100% - 10px) 50%;}
    .icon-groups:hover,.icon-groups:focus{background:url(/images/form-icon/red-groups.png) no-repeat calc(100% - 10px) 50%;}
    .icon-subgroups{background:url(/images/form-icon/subgroups.png) no-repeat calc(100% - 10px) 50%;}
    .icon-subgroups:hover,.icon-subgroups:focus{background:url(/images/form-icon/red-subgroups.png) no-repeat calc(100% - 10px) 50%;}
    .icon-time{background:url(/images/form-icon/time.png) no-repeat calc(100% - 10px) 50%;}
    .icon-bid{background:url(/images/form-icon/bid.png) no-repeat calc(100% - 10px) 50%;}
    /*.icon-time:hover,.icon-time:focus{background:url(/images/form-icon/red-time.png) no-repeat calc(100% - 10px) 50%;}*/
    .icon-poll{background:url(/images/form-icon/poll.png) no-repeat calc(100% - 10px) 50%;}
    .icon-poll:hover,.icon-poll:focus{background:url(/images/form-icon/red-poll.png) no-repeat calc(100% - 10px) 50%;}
    .icon-calendar{background:url(/images/form-icon/calendar.png) no-repeat calc(100% - 10px) 50%;}
    .icon-calendar:hover,.icon-calendar:focus{background:url(/images/form-icon/red-calendar.png) no-repeat calc(100% - 10px) 50%;}


    .icon-foodsuff{background:url(/images/form-icon/groceries.png) no-repeat 99% 50%;}
    .icon-recipe-title{background:url(/images/form-icon/recipe.png) no-repeat 99% 20%;}
    .icon-judge-title{background:url(/images/form-icon/chef24.png) no-repeat 99% 50%;}
    .icon-Users-title{background:url(/images/form-icon/family.png) no-repeat 99% 50%;}
    .icon-share-title{background:url(/images/form-icon/share.png) no-repeat 99% 50%;}

.form .imgbox {
  position: relative;
  width: 32%;
  float:right;
  margin:5px;
  box-sizing:border-box;
}
.form .imgbox b {
  color:var(--main-color);
  font-size:1.3em;
  border:1px solid var(--box-color);
  box-sizing:border-box;
  display:inline;
}
 .imagebox{position:relative;width:100%;margin-bottom:20px;box-sizing:border-box;}
 /*{display:block;margin:0 auto 3% auto;border:2px solid #ffd800;background-color:var(--box-color)ade;font:1.2em Mamifood;color:#726100;padding:1% 3%;width:75%;border-radius:12px;position:relative;text-align:center;}*/
 .adminMessage{position:absolute;top:0;right:0;width:100%;background-color:#f3fed7;color:#726100;height:83%;padding:30px 20px 20px 20px;box-sizing:border-box;opacity:.98;border:2px solid #ffd800/*#b6ff00*/;border-radius:4px;overflow-y:auto;font-size:1.2em;line-height:40px;}
 .ShoppingErrorMessage{position:absolute;top:0;right:0;width:100%;background:/*var(--box-color)ade*/#f3fed7 url(/images/form-icon/closed.png) no-repeat 98% 2%;color:#726100;height:60%;padding:30px 20px 20px 20px;box-sizing:border-box;opacity:.98;border:2px solid #b6ff00/*#ffd800*/;border-radius:4px;overflow-y:auto;font-size:1.2em;line-height:40px;cursor:pointer;z-index:1;}
 .imgbox{border: 1px solid #eee;transition: .2s all;box-sizing: border-box;}
 .imgbox:hover{box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.2), 0 4px 2px 0 rgba(0, 0, 0, 0.19);}
.form .imgbox .image , .imagebox .image{
 width:100%;
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
  
}

.form .imgbox .middle,.imagebox .middle {
    text-align:center;
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  width:100%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%)
}

.form .imgbox:hover .image , .imagebox:hover .image{
  opacity: 0.3;
}

.form .imgbox:hover .middle, .imagebox:hover .middle {
  opacity: 1;
}
.rtbl{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling: touch;}
.table{border:1px solid #f0f0f0; border-radius:4px;padding:2px;box-sizing:border-box;}
.table a{color:#818181;}
.table-title{padding:10px;font:1.2em Mamifood;display:inline-block;box-sizing:border-box;border:none;margin:0 0 0 0px; font-weight:bold;vertical-align:middle;}
.table-cell{padding:10px;/*text-align:center;*/display:inline-block;box-sizing:border-box;border:none;margin:0 0 -5px 0;vertical-align:middle;}
.table-row{background-color:var(--dark-box-color);border:none; display:block;width:100%;box-sizing:border-box;}
.table-row span{font-size:1.8em;padding:0 5px 0 2px;font-weight:500;}
.table-cell .btnadd{margin:0 10px -5px 8px; width:16px; height:16px;cursor:pointer;}
.form .color-lightPink,.color-lightPink{background-color:#fef0f0;}
.form .bordercolor-lightPink,.bordercolor-lightPink{border-color:#fc9e9e;}
.form .color-white-Pink,.color-white-Pink{background-color:#fef9f9;}
.form .color-lightGreen,.color-lightGreen{background-color:#affe91;}
.form .color-whiteGreen,.color-whiteGreen{background-color:#e2fed7;}
.form .bordercolor-whiteGreen,.bordercolor-whiteGreen{border-color:#48ff00;}
.form .color-silver,.color-silver{background-color:#f9f9f9;}
.form .color-white,.color-white{background-color:#fefefe;}
.form .color-yellow,.color-yellow{background-color:#fce97e;}
.form .color-orange,.color-orange{background-color:#ffd2b2;}
.form .color-purple,.color-purple{background-color:#efcefe;}
.form .color-brown,.color-brown{background-color:#d9d5b7;}
.form .color-green,.color-green{background-color:#22cc77;}
.form .color-bronze,.color-bronze{background-color:#cd7f32;}
.form .color-silver1,.color-silver1{background-color:#cccccc;}
.form .color-phosphori,.color-phosphori{background-color:#b6ff00;}
.form .color-gold,.color-gold{background-color:#ffd700;}

.form .color-gold1,.color-gold1{background-color:#ffd700;}
.form .color-gold2,.color-gold2{background-color:#ffeb7f;}
.form .color-gold3,.color-gold3{background-color:var(--box-color)7cc;}

.form .color-sorkhabi, .color-blue {background-color: #67baf6;transition:1s all;}
.form .color-sorkhabi, .color-blue:hover {background-color: #0092fb;}
.form .color-sorkhabi,.color-sorkhabi{background-color:#2055da}
.form .color-sorkhabi:hover,.color-sorkhabi:hover{background-color: var(--dark-color);}
.form .color-sormei,.color-sormei{background-color: var(--main-color);}
.form .color-sormei:hover,.color-sormei:hover{background-color:var(--main-hover-color);}

.border-silver{border:1px solid var(--dark-box-color);}
.col24{width:24%;}
.col14{width:13.8%;}
.col20{width:19.5%;}
.col7{width:16%;}
.col67{width:67%;}
.col65{width:65%;}
.col63{width:63%;}
.col56{width:56%;}
.col2p{width:2%;}
.col47{width:47.6%;}
.col60p{width:60px;}
.col80p{width:83px;}
.col120p{width:120px;}
.col12{width:12%;}

/*EndForm*/

.foodstuff_icon{width:24px;height:24px;position:absolute;top:-15px;right:-24px;}
.foodstuff_del{width:20px;height:20px;cursor:pointer;position:absolute;top:-10px;right:-52px;}
.foodstuff{ display:inline-block; box-sizing:border-box;position:absolute;top:-12px;right:0px;z-index:1;padding:0 4px;background-color:var(--box-color);}
.dotbetween{border-top:2px dotted #818181;width:80%;display:inline-block; position:relative;z-index:0;margin:20px 60px 20px 0; font-size:1em;box-sizing:border-box; }
.amount{width:60%;box-sizing:border-box;position:absolute;top:-12px;left:0;z-index:1;background-color:var(--box-color);padding-right:10px;}
.dotbetween1{border-top:2px dotted #818181;width:100%;display:inline-block; position:relative;z-index:0;margin:20px 0px 20px 0; font-size:1em;box-sizing:border-box;}
.leftitem{box-sizing:border-box;position:absolute;top:-12px;left:0;z-index:1;background-color:var(--box-color);padding-right:10px;text-align:right;}
.rightitem{display:inline-block; box-sizing:border-box;position:absolute;top:-12px;right:0px;z-index:1;padding:0 4px;background-color:var(--box-color);}
/*MApMarker*/
.MapInfo{width:150px !important; font:1em Mamifood;text-align:center;background-color:#b6ff00;}
.MapInfo .title{width:100% !important;background-color:var(--box-color);padding:0px; }
.MapInfo .title img{width:100px; height:100px; border:1px solid var(--box-color); border-radius:50%; padding:2px;box-sizing:border-box;}
.MapInfo .title p{font-size:1.2em;font-weight:bold;}


.content{width:100%; padding:1% 2%; box-sizing:border-box; font-size:1.2em;box-sizing:border-box;}
.content h3{font-size:1.09em;font-weight:600;}
.content h2{font-size:1.3em;font-weight:500;}
.content ul{margin-right:20px;list-style:disc;}
.content ol{margin-right:20px;list-style:decimal;}
.content li{margin-right:20px;}
.content img{max-width:90%;/*margin:5px auto;display:block;*/border:1px solid var(--dark-box-color); padding:5px;}
.content a{text-decoration:underline;color:#222;transition:all .5s;}
.content a:hover{text-decoration:none;color:var(--main-color);}
.InvoicePage-Logo{position: absolute; top: 5%; right:calc(50% - 100px);}

.DContent{padding:2%;}
.DContent ul,.DContent ol{margin-right:20px;list-style:inside;}

.LtoR{direction:ltr;}
.RtoL{direction:rtl;}


.divmamfeed{border:1px solid #f1f1f1;border-top:none;background-color:#f9f9f9;border-radius:4px;padding:5px;color:#867979; display:inline-block; width:100%; box-sizing:border-box; margin:0 0 -8px 0; position:relative;}
.divmamfeed:hover{background-color:#f1f1f1;color:var(--main-color);}
.divmamfeed .mamipic{float:right;border:1px dashed #555;border-radius:50%; padding:3px;width:26.5%; height:26.5%;}
.divmamfeed .mamirating{float:right;padding:5% 4% 2% 0;width:60%; }
.mamirating img{width:13.3%;height:13.3%; padding:1px 2px;}
.divmamfeed .mamfidcount{background:url(/images/form-icon/gold.png) no-repeat calc(100% - 0px) 35%; padding-right:30px;padding-bottom:2px;}
.divmamfeed .fmamfidcount {background:url(/images/form-icon/gold.png) no-repeat calc(100% - 10px) 35%; padding-right:30px;background-size:16px;}
.mamfidcount b{font-size:.9em;font-weight:normal;}
.divmamfeed .mamfidcount span,.divmamfeed .fmamfidcount span{font-size:120%;font-weight:bold;}
.divmamfeed .CountItem{position:absolute;left:0px;top:32%;border-radius:50%;background-color:var(--box-color)ade;padding:5px;text-align:center;min-height:20px;min-width:20px;font-size:1em;font-weight:500; border:1px solid #ffd800;color:#726100;}


 .pager
{
     float:right;
    text-align:center;
    margin:8px 8px 0 0px;
    padding:3px 4px;	
}
.pager a{width:24px; text-align:center; cursor:pointer; background:#f9f9f9; margin:0 -1px; padding:2px; text-decoration:none; color:#6e6c76;  border:1px solid #aaa;}
.pager a:hover,.pager .current { width:24px; text-align:center; cursor:pointer; background:var(--main-color); margin:0 -1px; padding:2px; text-decoration:none; color:#000;border:1px solid #aaa;}
.pager .item-count {text-align:center;background:#f9f9f9; padding:1px 5px; color:#6e6c76;  border:1px solid #aaa;display:inline-block;font:1em MamiFood;margin-right:10px;}







.ZoneMapBox{font-family:MamiFood;font-size:1em;padding:20px 10px;width:150px;}
.ZoneMapBox h1{font-size:1.2em;font-weight:bold;}

.height60vh{min-height:60vh;}
.p-32{padding:4% 2%;}
.footDesc{position:absolute; bottom:5px;left:10px; font-size:1.2em;background:url(/images/form-icon/content.png) no-repeat 100% 50%;padding-right:20px; }
.footIcon{position:absolute; bottom:5px;left:10px; font-size:1.2em;padding-right:20px; }
.Subgroupbox{width:30.5%;background-color:var(--box-color)9f9;text-align:center;position:relative;color:#818181;border:1px solid #ffe6e6;display:inline-block;margin:2% 1%;padding:50px 0;border-radius:4px 0 4px 0;transition:all 1s;}
.Subgroupbox span {
  font-size:1.6em;
}
.Subgroupbox:hover{background-color:#efffc6; border-color:#b6ff00;}
.btnEmployee{background-color:#efffc6;text-align:center;position:relative;color:#009933;border:1px solid #b6ff00;display:inline-block;margin:2% 1%;padding:30px 0 50px 0;border-radius:4px 0 4px 0;transition:all 1s;box-sizing:border-box;}
.btnEmployee:hover{background-color:var(--box-color)9f9; border-color:#ffe6e6;}
.btnEmployee img{position:absolute; bottom:0px;left:10px; font-size:1.2em;padding-right:20px;opacity:.7;}
.divEmployee a{color:#009933;font-size:1.4em;text-decoration:none;}
.divEmployee strong {color:var(--main-color); text-align:center;}
.divEmployee strong b{color:#009933;font-weight:500;}
.lnkbtn{text-align:center;position:relative;color:#555;border:1px solid #ddd;display:inline-block;margin:2% 1%;padding:40px 10px;border-radius:4px;transition:all 1s;}
.lnkbtn:hover,.lnkbtn:focus{background-color:var(--box-color)9f9; border-color:#ffe6e6; color:var(--main-color);}

.regular-checkbox {
	/*-webkit-appearance: none;
	background-color: #fafafa;
	border: 1px solid #cacece;
	box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
	padding: 9px;
	border-radius: 4px;
	display: inline-block;
	position: relative;*/
}
.regular-checkbox:active, .regular-checkbox:checked:active {
	box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}

.regular-checkbox:checked {
	background-color: #e9ecee;
	border: 1px solid #adb8c0;
	box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);
	color: #99a1a7;
}
.regular-checkbox:checked:after {
	content: '\2714';
	font-size: 14px;
	position: absolute;
	top: 0px;
	left: 3px;
	color: #99a1a7;
}

.pointer{cursor:pointer;}
/**************************************************************   Tab   *******************************************************************************/
	/*.container{
			width: 100%;
			margin: 0 auto;
		}



		ul.tabs{
			margin: 0px;
			padding: 0px;
			list-style: none;
            background:#ccc;

		}
		ul.tabs li{
			background:none;
			color: var(--box-color);
			display: inline-block;
			padding: 10px 33px 10px 15px;
			cursor: pointer;
            position:relative;
            font-size:1.4em;
            font-weight:500;
            border-left:1px solid var(--box-color);
            box-sizing:border-box;
            transition:all .8s;
		}
            ul.tabs li img {position:absolute;top:12px;right:3px;width:24px;height:24px; }
            
		ul.tabs li.current{
			background: #f9f9f9;
			color: #333;
		}

		.tab-content{
			display: none;
			background: #f9f9f9;
			padding: 15px;
		}
        .tab-content ol{margin-right:30px;list-style:decimal;}
        .tab-content ul{margin-right:30px;list-style:disc;}
		.tab-content.current{
			display: inherit;
		}*/
/**************************************************************   ENDTab   *******************************************************************************/
.Loader {
    position: fixed;
    z-index: 999;
    height: 100%;
    width: 100%;
    top: 0;
    background: rgba(0, 0, 0, .5);
}
    .Loader .center {
        z-index: 1000;
        margin:20vh auto;
        padding:5px;
        width: 150px;
        height: 155px;
        background-color: White;
        border-radius: 4px;
        filter: alpha(opacity=90);
        opacity: .9;
        -moz-opacity: .9;
    }
    .Loader .center img {
        opacity: .9;        
        width: 150px;
        height: 155px;
    }


.sticky-right-btn{
  position: fixed;
  top:60px;
  right: -190px;
  width: 115px;
  height: 0px;
  text-align:right;
  z-index:99;
  margin-top:-15px;
   opacity:.8;
transition:all 1s;
}
.sticky-right-btn a{
                transform: rotate(-90deg);
				-webkit-transform: rotate(-90deg); 
				-moz-transform: rotate(-90deg); 
				-o-transform: rotate(-90deg); 
				filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
                display: block;                 
                text-align:center;
                background-color:#b6ff00;
                height: 280px; 
                width: 165px;
                padding:4px;
                color:#009933;  
                font-size: 17px; 
                font-weight: bold; 
                text-decoration: none; 
                border:2px solid #009933;
                border-radius:4px 4px 0 0;
               
        
}
.sticky-right-btn:hover{right:-70px;opacity:1;}
.sticky-right-btn a img{
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
        margin:10px 10px 0 0;
        border: 1px dashed #555;
        border-radius:50%;
        padding:2px;
        display:block;
        width:100px;
        height:100px;
    }
.sticky-right-btn a .UName{
    transform: rotate(90deg);
				-webkit-transform: rotate(90deg); 
				-moz-transform: rotate(90deg); 
				-o-transform: rotate(90deg);
                 margin:-70px 30px 0 -80px;
                 /*font-weight:500;*/ 
                 font-size:1em;
                 position:relative;
}
.sticky-right-mamfeed{
  position: fixed;
  top:300px;
  right: -150px;
  height: 0px;
  text-align:right;
  z-index:99;
  margin-top:-15px;
   opacity:.8;
transition:all 1s;

}
.sticky-right-mamfeed a{
    background:url("../images/form-icon/gold.png") no-repeat 6% 40%;
                display: block;                 
                text-align:center;
                background-color:#ffd800;/*#ffd800;*/
                height: 35px; 
                width: 110px;
                padding:10px 30px 4px 50px;
                color:#655f31;  
                font-size: 14px; 
                font-weight: bold; 
                text-decoration: none; 
                border:2px solid #655f31;
                border-radius:4px 0 0 4px;
                      
}
.sticky-right-mamfeed a span{font-size: 17px;}
.sticky-right-mamfeed:hover{right:-20px;opacity:1;}
.sticky-right-mamfeed a .UName {
                 /*font-weight:500;*/ 
                 font-size:1em;
                 position:relative;
}
.sticky-right-mamfeed a .UName .micon{
        /*margin:20px 100px 0 0;*/
        padding:2px;
        display:block;
        width:24px;
        height:24px;
        position:absolute;
        top:-2px;
        left:2%;
}

.color-mamfeed{ background-color:#ffd800;}
.display-none{display:none;}

                
.reciver, .sender{position:relative; display:inline-block;padding:4px 10px 20px 10px;margin:0 40px 25px 0; border-radius:4px 0 4px 0;min-width:160px; max-width:80%; }
.reciver p, .sender p{font-size:1.3em;}
 .imgSender{border:1px dashed; padding:3px; width:32px; height:32px; border-radius:50%;position:absolute; top:5px;right:-45px}
 .MsgDate{position:absolute;right:5px;bottom:2px;padding-right:5px;} 
 
 .chat-header{background:#f9f9f9;width:98%;padding:15px 10px;box-sizing:border-box; margin:-2% -2% 10px -2%;font-size:1.3em;position:absolute;top:4%;right:4%;} 
 .chat-header span{font-size:.8em;padding-right:20px;}             
 .btnSendMessage{background:#70cb70; height: 80px; width: 17%; display: inline-block; float: right; margin: 1% 2% 0 0; border-radius: 0px 4px 4px 0px; position: relative; cursor: pointer;}
 .btnSendMessage img{top: 35%; right: 10%; position: absolute;}
 .btnSendMessage span{top: 35%; right: 35%; position: absolute; color: #026d26; font-weight: bold;}
  .btnSendMessage:hover, .btnSendMessage:focus{background:#00bd3f;}
  .nomessage{font-size:1.6em;font-weight:bold;position:absolute;top:35%;right:35%;color:#aaa;}



  .fright,.sfright{float:right;}
  .fleft,.sfleft{float:left;}


.container-popup {
    position: relative;
    position: fixed;
    width:100%;height:100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,.5);
    z-index:99999;
    display:none;
}

.popup {
    width: 30%;
    max-height:85%;
    background:#f3fafe;
    position:relative;
    top: 10vh;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    border:1px solid  var(--main-color);
    border-radius:4px;
    display:block;
    overflow-y:auto;
}
.popup-header{width:100%;background: var(--main-color);color:var(--box-color);text-align:center;padding:10px;box-sizing:border-box;margin-bottom:5px;font-weight:400;font-size:1.2em;position:absolute;top:0;right:0;box-sizing:border-box;}
 .popup-header .closed{background:url(/images/form-icon/closed.png) no-repeat; position:absolute;top:35%;right:10px;cursor:pointer;}
.popup .popup-header .closed:hover{background:url(/images/form-icon/red-closed.png) no-repeat;}
.popup .popup-content{padding:10px 15px;font:.9em;margin-top:50px;}


.mode11{position:absolute;top:-5px;right:15px;z-index:1;/*width:44px;height:63.25px;*/opacity:.7;}
#rmenu-icon{cursor:pointer;margin:-5px 0 -12px -10px; width:32px; height:32px;display:none;}
#rmenu_icon_admin{cursor:pointer;display:none;}

.btnRecive{font-size:1.2em;background-color:#70cb70;color:#027629;text-align:center;padding:5px 10px;border:1px solid #027629;border-radius:4px;cursor:pointer;}
.btnDelay{font-size:1.2em;background-color:#fe9e9e;color:var(--main-color);text-align:center;padding:5px 10px;border:1px solid var(--main-color);border-radius:4px;cursor:pointer;}

.help{
    position:absolute;
    display: inline-block;
    padding:6px 3px;
    margin:5px;
    cursor:pointer;
    top:15px;left:-30px;
}

.help .helptext {
    visibility: hidden;
    width:330px;
    background-color: #f3fed7;
    color: #009933;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
    top: -0px;
    right: 110%;
    padding:10px 15px 10px 5px;
    text-align:right;
    font-size:1.1em;
    border:1px solid #009933;
    transition:all .5s;
}

.help .helptext::after {
    content: "";
    position: absolute;
    top: 20px;
    left: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent transparent #009933;
}
.help:hover .helptext {
    visibility: visible;
}

.btnloader{position:absolute;top:calc(50% - 10px);left:calc(50% - 80px);}
.friendlist{height: 70vh; overflow-y: auto;overflow-x:hidden;float: right;width: 23%;box-sizing: border-box;border: 1px solid var(--dark-box-color);margin-top: 1.6%;display: block;}
.friendmessagebox{width:98%;margin:2% 2% 0 0;padding-right:2%; height: 60vh; overflow-y: auto;}
.btnMore{margin:25px auto;max-width:25%; text-align:center;background-color:var(--main-color);color:var(--box-color);border-radius:4px;padding:.3%;cursor:pointer;font-size:1.2em;font-weight:500;transition:all 1s;}
.btnMore:hover,.btnMore:focus{background-color:#009933;}

.menu-listbox{border:15px solid #f9f9f9;border-radius:4px;float:right;width:56%; padding:1%;}
.menu-list-img-box{border:15px solid #f9f9f9; border-radius:4px;padding:1%;float:left;width:33%}
.menu-list-img-box img{width:100%;border-radius:4px;}
.menu-row {
  display: flex;
  flex-wrap: wrap;
  padding: 0 4px;
}

.menu-column {
  flex: 32%;
  max-width: 32%;
  padding: 0 5px;

}

.menu-column .box {
  width:100%;
  margin-top: 8px;
  vertical-align: middle;
}
.menu-column .box h2 {
        font-size: 1.2em;
}
@media screen and (max-width: 800px) {
  .menu-column {
    flex: 50%;
    max-width: 50%;
  }
}
@media screen and (max-width: 600px) {
  .menu-column {
    flex: 100%;
    max-width: 100%;
  }
}

.divctrl{width:48%;background-color:#ddd;float:right;margin:1%;border-radius:4px;}
.divimgtxt .a0{float: right; width:calc(100% - 42px); display: inline-block; line-height: 42px; padding-right: 8px; box-sizing:border-box;cursor:pointer;color:#111;text-decoration:line-through;opacity:.6;}
.divimgtxt .a1{float: right; width:calc(100% - 42px); display: inline-block; line-height: 42px; padding-right: 8px; box-sizing:border-box;cursor:pointer;color:#111;text-decoration:none;opacity:1;}
.divimgtxt {width: 40%;overflow: hidden;box-sizing: border-box;float:right;}
.divimgtxt .attrimg{float: right;  width: 42px; height: 42px; display: inline-block;cursor:pointer;border:1px solid #bbb;box-sizing:border-box; /*background-color:var(--box-color);*/}
.text{float: right; width:60%; height:42px; box-sizing:border-box;}

.wizard{width:60%;border-bottom:3px solid #ccc;position:relative;margin:50px auto;}
.wizard .img1{position:absolute;top:-32px;right:-7px;}
.wizard .img2{position:absolute;top:-32px;right:calc(50% - 42px);}
.wizard .img3{position:absolute;top:-32px;left:-7px;}

.divcarousel{margin:0 auto; background:var(--main-color);display:inline-block;width:50%;}
.carousel-container {
    display: flex;
    justify-content:center;
    flex-wrap: wrap;
    gap: 15px;
}

.carousel {
    border: 1px solid #f0f0f0;
    background-color: var(--box-color);
    width: 324px;
    /* float: right; <-- این را حذف کن */
    margin-bottom: 20px; /* فاصله از پایین */
    font-size: .9em;
    padding-bottom: 5px;
    position: relative;
    border-radius: 12px;
    overflow: hidden;
}

.margin1{margin:0 .8% .8% 0;}
.carousel:hover{box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.2), 0 8px 10px 0 rgba(0, 0, 0, 0.19);}
.carousel .content{padding:0 10px;text-align:center;overflow:hidden;}
.carousel .content img{width:50px;height:50px;border-radius:50%;border:1px dashed #ccc;padding:2px;float:right;}
.carousel-img {
    width: 100%;
    height: 243px; /* همان ارتفاع عکس قبلی */
    overflow: hidden;
    border-radius: 12px 12px 0 0;
}

    .carousel-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: 1s all;
    }

        .carousel-img img:hover {
            transform: scale(1.3);
        }
.carousel h2 {
    padding: 5px;
    background-color: var(--dark-box-color);
    font-size: 1em;
    transition: .5s all;
    text-decoration: none;
    color: var(--dark-color);
    border-radius: 4px;
    height:53px;
}
.carousel h2:hover{background-color: var(--main-color);color:var(--box-color);}
.property{padding:2px;background-color:var(--dark-box-color);border:1px solid #ccc;width:23%;float:right;box-sizing:border-box;margin:1%;border-radius:4px;padding:0 5px;font-size:.8em;}
.property_splite {
    padding: 2px;
    background-color: var(--dark-box-color);
    border: 1px solid #ccc;
    width: 72%;
    float: right;
    box-sizing: border-box;
    margin: 1%;
    border-radius: 4px;
    padding: 0 5px;
    font-size: .8em;
}
.price{margin:1% 0 0 0;text-align:right;color:var(--main-hover-color);}
.price span{color:#555;font-size:.7em;}
.price .bid{ background:var(--dark-box-color) url("../images/form-icon/bid.png") calc(100% - 5px) 4px no-repeat;border:1px solid #ccc;float:right;padding:2px 30px 2px 6px;font-size:.8em;background-size:16px 16px;margin:0 1% 0 2%;min-width:calc(23% - 36px);border-radius:5px;text-align:center;}
.carousel .location{/*border:1px solid #ccc;*/background:url("/images/form-icon/address.png") calc(100% - 10px) 8px no-repeat;padding:7px 35px 0 20px;display:inline-block;background-size:24px 24px;}
.carousel .location a{color:var(--dark-font-color);}
.carousel .location a:hover{color: var(--main-color);}
.carousel a{text-decoration:none;color:#818181;}
.carousel .special{position:absolute;top:5px;left:0;background: var(--main-color);color:var(--box-color);padding:5px 10px;font-weight:500;border-radius:0 15px 15px 0;}

.icon-true{background:url("/images/form-icon/itrue.png") calc(100% - 5px) 5px no-repeat;background-size:24px 24px;}
.icon-false{background:url("/images/form-icon/ifalse.png") calc(100% - 5px) 5px no-repeat;background-size:24px 24px;text-decoration:line-through;opacity:.5}
.div-attr{float:right;height:60px;width:25%;padding:5px 30px 5px 5px;/*border:1px solid #818181;*/box-sizing:border-box;}
.div-attr span{font-size:.7em;}
.div-attr a{color: var(--main-color);}
.div-attr a:hover{color:var(--main-hover-color);}
.title-attr{border-bottom:1px dashed #aaa;font-size:1em;margin-bottom:20px;}

.property1{padding:2px;background-color:var(--dark-box-color);border:1px solid #ccc;float:right;box-sizing:border-box;margin:5px;border-radius:4px;padding:0 15px;font-size:.8em;text-align:center;}
.div-price{width:50%;text-align:center;box-sizing:border-box;float:right;border:1px solid #f9f9f9;position:relative;}
.title-price{position:absolute;top:0px;right:0px;background: var(--main-color);color:var(--box-color); padding:5px 20px;/*border:1px solid #ccc;*/border-radius:4px 0 0 4px;}

.img-user{border-radius:50%;border:1px dashed #818181;padding:3px;}


.instagram_gallery .instaDiv {
    position: relative;
    width: 31%;
    margin-left: 2%;
    margin-bottom: 2%;
    display: inline-block;
    border:1px solid var(--dark-box-color);
}

    .instagram_gallery .instaDiv img {
        width: 100%;
    }

    .instagram_gallery .instaDiv .instaLike {
        background: url(/images/icons/like.png) calc(100% - 5px) 10px no-repeat;
        background-color: #000;
        color: var(--box-color);
        position: absolute;
        bottom: 5px;
        right: 0px;
        padding: 5px 27px 5px 10px;
        opacity: .7;
    }

    .instagram_gallery .instaDiv .instaComment {
        background: url(/images/icons/comment.png) 5px 10px no-repeat;
        background-color: #000;
        color: var(--box-color);
        position: absolute;
        bottom: 5px;
        left: 0px;
        padding: 5px 10px 5px 27px;
        opacity: .7;
    }

    .instagram_gallery .instaDiv .instaVideoicon {
        background: url(/images/icons/video.png) 100%  no-repeat;
        color: var(--box-color);
        position: absolute;
        top: 5px;
        right:5px;
        height: 24px;
        width: 24px;
        padding-right: 27px;
        padding-top: 2px
    }
.box-Red{background-color:#cc2222;border:1px solid #da2055;}
.box-Purple{background:#7722cc;box-shadow:#4e026f 3px 3px 10px;}
.box-Blue{background:#22cccc;box-shadow:#01617c 3px 3px 10px;}
.box-Brown{background:#655f31;box-shadow:#655f31 3px 3px 10px;}
.box-gold{background:#cccc22;box-shadow:#715f00 3px 3px 10px;}
.widget{width:31%;display:inline-block;padding:2%;box-sizing:border-box;margin:1%;transition:1s all;}
.widget:hover{opacity:.5;}
.widget .icon{width:30%;float:right;}
.widget .body{width:70%;float:right;padding-right:4%;color:#fff;box-sizing:border-box;}
.widget .body .small{width:100%;padding-right:5px;box-sizing:border-box;font-weight:700; font-size:1.5em;}
.widget .body .large{min-width:100%;padding-left:5px;font-size:3em;margin:0;text-align:left;margin-bottom:-10px;box-sizing:border-box;}












.search-section {
    width: 100%;
    max-width: 2000px;
    margin: auto;
    height: 850px;
    position: relative;
    background-image: url(/images/bg/b1.jpg);
    background-size: 2000px 850px;
    background-repeat: no-repeat;
    background-position: center center;
    text-align: center;
}

.bg-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    transition: opacity .6s ease;
}

.search-section__top-layer {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
}

.search-section h1 {
    color: #fff;
    font-size: 4em;
    font-weight: 500;
    text-shadow: 0px 3px var(--dark-font-color);
    position:relative;
    z-index:1;
}

.search-section__center-layer {
    margin: 0 auto;
    position: relative;
}

.search-section__bottom-layer {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    height: 125px;
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0) 100%);
}

.search-section__main__services {
    display: flex;
    width: 400px;
    margin: auto;
    justify-content: space-between;
    align-items: center;
    margin-top: 50px;
    position: relative;
}

.villa-service {
    background-image: url(/images/bg/villaicon.png);
}

.apartment-service {
    background-image: url(/images/bg/apartmenticon.png);
}

.land-service {
    background-image: url(/images/bg/landicon.png);
}

.search-section__main__services__item__image {
    width: 100px;
    height: 100px;
    border-radius: 30px;
    box-sizing: content-box;
    position: relative;
    transition: 1s all;
    border: 5px solid #818181;
    margin: 0 10px;
}

    .search-section__main__services__item__image:hover {
        opacity: .8;
    }

.search-section__main__services__title {
    color: white;
    font-size: 20px;
    font-weight: 500;
    text-align: center;
    line-height: 40px;
}

.search-section__main__services__number {
    position: absolute;
    width: 50px;
    height: 50px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    border: 2px solid var(--dark-box-color);
    background-color: var(--main-color);
    border-radius: 50%;
    top: 50px;
    right: -22px;
}

    .search-section__main__services__number p {
        line-height: 52px;
        color: var(--box-color);
    }

.search-section {
    text-align: center;
}
.SearchDiv1{width:55%;margin:0 auto;position:relative;}
.SearchBox1{padding:10px 0;width:100%;box-sizing:border-box;text-align:center;border: 1px solid rgba(255, 255, 255, 0.1); background-color: rgba(0, 0, 0, 0.4);    border-radius: 12px;}
/*.divautocomplete1{position:relative;width:26%;display:inline-block;}*/
.btnFilter{background:url('/images/form-icon/reSearch.png') 10px 10px no-repeat;background-color:#daa520;width:17%;min-width:100px;font-size:1em;transition:1s all;}
.btnFilter:hover{background-color:#cccc22;}
.btn_search{background-repeat:no-repeat;padding:7px 12px 7px 50px;margin:.7% 0;font-weight:bold;color:#534741;cursor:pointer;border:none;font:1em MamiFood;font-weight:bold;box-sizing:border-box;border-radius:8px;}

.div-center{margin:0 auto;}
.addvilla{position:absolute;top:50px;left:130px;cursor:pointer;transition:1s all;z-index:9;}
.addvilla:hover{opacity:.8;}
.addvilla img{width:64px; height:64px;}
.tooltip .tooltiptext {
  visibility: hidden;
  width: 150px;
  background-color: #22cc77;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: -5px;
  left: 110%;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 100%;
  margin-top: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent #22cc77 transparent transparent;
}
.tooltip:hover .tooltiptext {
  visibility: visible;
}

/* Make it a marquee */
.marquee {
    width: 100%;
    font-size: .8em;
    margin: 0 auto;
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    animation: marquee 80s linear infinite;
}

    .marquee:hover {
        animation-play-state: paused
    }

    .marquee a {
        color: #1c3867;
    }

        .marquee a:hover {
            text-decoration: underline;
            color: #ff00bb;
        }
/* Make it move */
@keyframes marquee {
    0% {
        text-indent: 27.5em;
    }

    100% {
        text-indent: -500%;
    }
}


.switch {
    position: relative;
    display: inline-block;
    width: 120px;
    height: 28px;
    margin:2px auto;
}

    .switch input {
        display: none;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color:#ca2222;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 22px;
        width: 22px;
        left: 4px;
        bottom: 3px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #2ab934;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(90px);
    -ms-transform: translateX(90px);
    transform: translateX(90px);
}

/*------ ADDED CSS ---------*/
.on {
    display: none;
}

.on, .off {
    color: white;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    font-size: 12px;
}

input:checked + .slider .on {
    display: block;
}

input:checked + .slider .off {
    display: none;
}

/*--------- END --------*/

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }
.sold {
        position: absolute;
        top: 18%;
        left: 0;
        width: 100%;
        text-align: center;
        background: var(--main-hover-color);
        color: #fff;
        padding: 5px 0px;
        font-size: 3em;
        opacity: .6;
        z-index: 2;
    }


.whatsapp_icon {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 40px;
    background-color: #25d366;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
    cursor: pointer;
}

    .whatsapp_icon img {
        margin-top: 14px;
        transition: all .5s;
    }

    .whatsapp_icon p {
        color: #333;
        font-size: .5em;
        position: absolute;
        top: 15px;
        left: -122px;
        width: 100px;
        background-color: #25d366;
        padding: 5px 10px;
        z-index: -10;
        border-radius: 5px;
        color: #fff;
        opacity: .8;
    }

.whatsapp_div {
    position: fixed;
    width: 350px;
    height: 400px;
    bottom: 110px;
    right: 20px;
    background-color: #f7f7f7;
    font-size: .9em;
    border-radius: 15px;
    text-align: right;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
    display: none;
}

    .whatsapp_div:hover {
        box-shadow: 4px 8px 8px #999;
    }

.whatsapp_div_header {
    background: #25d366 url(/images/icons/whatsapp.png) calc(100% - 20px) 20px no-repeat;
    width: 100%;
    height: 100px;
    padding: 15px 70px 15px 15px;
    border-radius: 15px 15px 0 0;
    box-sizing: border-box;
    color: #FFF;
}

    .whatsapp_div_header h2 {
        font-size: 1.4em;
    }

.whatsapp_div_body {
    width: 100%;
    height: 280px;
    padding: 15px;
    color: #737373;
    overflow-y: auto;
    box-sizing: border-box;
}

.whatsapp_div_body_user_account {
    position: relative;
    display: block;
    background: #f0f0f0 url(/images/icons/whatsapp_green.png) 10px calc(50%) no-repeat;
    min-width: 100%;
    height: 95px;
    padding: 15px 70px 15px 45px;
    border-right: 2px solid #25d366;
    box-sizing: border-box;
    color: #444;
    margin: 5px 0;
    cursor: pointer;
}

    .whatsapp_div_body_user_account:hover {
        box-shadow: 0px 0px 7px #25d366;
    }

    .whatsapp_div_body_user_account .userimage {
        position: absolute;
        top: 15px;
        right: 5px;
        border-radius: 50%;
        width: 50px;
        height: 50px;
        border: 1px dashed #444;
        padding: 2px;
    }

.seeall {
    background-color: var(--main-hover-color);
    color: var(--box-color);
    border: 1px solid var(--main-hover-color);
    width: 250px;
    text-align: center;
    padding: 7px;
    margin: 0 auto;
    border-radius: 12px;
    transition: .5s all;
    display: block;
    margin-top:10px;
}

    .seeall:hover {
        background-color: var(--main-color);
        color: var(--box-color);
        border: 1px solid var(--main-color)
    }

.bg-0star {
    min-width: 80px;
    height: 16px;
    padding-right: 88px;
    line-height: 15px;
    background: url('/images/stars_sprites.png') 100% -5px no-repeat;
}

.bg-1star {
    min-width: 80px;
    height: 16px;
    padding-right: 88px;
    line-height: 15px;
    background: url('/images/stars_sprites.png') 100% -31px no-repeat;
}

.bg-2star {
    min-width: 80px;
    height: 16px;
    padding-right: 88px;
    line-height: 15px;
    background: url('/images/stars_sprites.png') 100% -57px no-repeat;
}

.bg-3star {
    min-width: 80px;
    height: 16px;
    padding-right: 88px;
    line-height: 15px;
    background: url('/images/stars_sprites.png') 100% -83px no-repeat;
}

.bg-4star {
    min-width: 80px;
    height: 16px;
    padding-right: 88px;
    line-height: 15px;
    background: url('/images/stars_sprites.png') 100% -109px no-repeat;
}

.bg-5star {
    min-width: 80px;
    height: 16px;
    padding-right: 88px;
    line-height: 15px;
    background: url('/images/stars_sprites.png') 100% -135px no-repeat;
}

.share-buttons {
    margin-top: 15px;
    direction: rtl;
    font-size: 12px;
}
    .share-buttons span {
        display: inline-block;
        vertical-align: middle;
        margin-left: 5px;
        transform: translateY(-4px); 
    }

    .share-button {
        display: inline-flex;
        align-items: center;
        padding: 0px 10px;
        margin-left: 2px;
        border-radius: 8px;
        text-decoration: none;
        font-size: 12px;
        font-weight: bold;
        color: white;
        transition: background 0.3s ease;
    }

    .share-button svg, .share-button img {
        width: 16px;
        height: 16px;
        margin-left: 6px;
    }

    .share-button.teleg {
        background-color: #0088cc;
    }

        .share-button.teleg:hover {
            background-color: #007ab8;
        }

    .share-button.whatsapp {
        background-color: #25D366;
    }

        .share-button.whatsapp:hover {
            background-color: #1ebe5b;
        }

    /* رنگ صحیح ایتا – نارنجی رسمی */
    .share-button.eitaa {
        background-color: #F57C00;
    }

        .share-button.eitaa:hover {
            background-color: #e66e00;
        }











/*اسلایدر*/
/*.card-carousel {
    position: relative;
    overflow: hidden;
    perspective: 1500px;
}

.cc-track {
    position: relative;
    height: 260px;
    transform-style: preserve-3d;
}

.cc-slide {
    position: absolute;
    left: 50%;
    top: 10%;
    width: 420px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-50%) scale(.7);
    transition: transform .6s ease, opacity .6s ease;
}


    .cc-slide.active,
    .cc-slide.left,
    .cc-slide.right {
        opacity: 1;
        visibility: visible;
    }


    .cc-slide.active {
        transform: translateX(-50%) translateZ(120px) scale(1);
        z-index: 3;
    }


    .cc-slide.left {
        transform: translateX(-160%) rotateY(45deg) scale(.85);
        z-index: 2;
    }


    .cc-slide.right {
        transform: translateX(60%) rotateY(-45deg) scale(.85);
        z-index: 2;
    }*/


.card-carousel {
    position: relative;
    perspective: 1800px;
    height: 280px;
}

.cc-track {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    margin-top: 2%;
}

.cc-slide {
    position: absolute;
    left: 50%;
    top: 0;
    width: 420px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-50%) scale(.6);
    transition: all .6s ease;
    backface-visibility: hidden;
}

    /* visible slides */

    .cc-slide.left,
    .cc-slide.active,
    .cc-slide.right {
        opacity: 1;
        visibility: visible;
    }

    /* center */

    .cc-slide.active {
        transform: translateX(-50%) translateZ(140px) scale(1);
        z-index: 3;
    }

    /* left */

    .cc-slide.left {
        transform: translateX(-170%) rotateY(45deg) scale(.85);
        z-index: 2;
    }

    /* right */

    .cc-slide.right {
        transform: translateX(70%) rotateY(-45deg) scale(.85);
        z-index: 2;
    }



    .cc-slide img {
        width: 100%;
        border-radius: 18px;
        display: block;
    }

    

.cc-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
    border: none;
    font-size: 28px;
    cursor: pointer;
    z-index: 5;
}

.cc-prev {
    left: 10px;
}

.cc-next {
    right: 10px;
}

.cc-dots {
    position: absolute;
    bottom: -35px;
    left: 50%;
    transform: translateX(-50%);
}

.cc-dot {
    width: 8px;
    height: 8px;
    background: #ccc;
    display: inline-block;
    border-radius: 50%;
    margin: 4px;
    cursor: pointer;
}

    .cc-dot.active {
        background: #e8a749;
    }

/*@media (min-width:1400px) {

    .cc-slide {
        width: 460px;
    }
}

@media (min-width:1700px) {

    .cc-slide {
        width: 520px;
    }
}*/


/* tablet */

@media (max-width:1024px) {

    .cc-slide {
        width: 340px;
    }

        .cc-slide.left {
            transform: translateX(-150%) rotateY(40deg) scale(.85);
        }

        .cc-slide.right {
            transform: translateX(50%) rotateY(-40deg) scale(.85);
        }
}



/* mobile */

@media (max-width:768px) {

    .card-carousel {
        height: 200px;
       /* overflow: hidden;*/
    }

    .cc-slide {
        width: 260px;
    }

        .cc-slide.left {
            transform: translateX(-120%) rotateY(30deg) scale(.8);
        }

        .cc-slide.right {
            transform: translateX(20%) rotateY(-30deg) scale(.8);
        }
}


/* small mobile */

@media (max-width:480px) {

    .card-carousel {
        height: 150px;
        /*overflow-x: hidden;*/
    }

    .cc-slide {
        width: 210px;
    }

        .cc-slide.left {
            transform: translateX(-110%) rotateY(25deg) scale(.75);
            opacity: .7;
        }

        .cc-slide.right {
            transform: translateX(10%) rotateY(-25deg) scale(.75);
            opacity: .7;
        }
}


.bg-dots {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 5;
}

.bg-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255,255,255,.5);
    cursor: pointer;
}

    .bg-dot.active {
        background: #fff;
    }






/* --- پایه --- */
.menu {
    float: right;
    margin-top: 0;
    direction: rtl;
}

    .menu ul {
        width: 100%;
        padding: 0;
        margin: 0;
    }

    .menu li {
        float: right;
        list-style: none;
        position: relative;
        overflow: visible !important; /* خیلی مهم */
    }

        /* لینک‌های منوی اصلی */
        .menu li a {
            display: block;
            padding: 8px 22px;
            margin: 10px 5px 0 0;
            background-color: var(--main-hover-color);
            color: var(--box-color);
            border-radius: 4px;
            font-weight: 500;
            transition: all .3s;
        }

            .menu li a:hover,
            .menu li a:focus {
                background-color: var(--main-color);
                color: var(--box-color);
            }

/* --- زیرمنو --- */

.submenu {
    display: none;
    position: absolute;
    right: 5px;
    top: 45px;
    min-width: 200px;
    background: var(--main-color);
    padding: 0;
    margin: 0;
    z-index: 9999;
    border-radius: 4px;
    overflow: hidden; /* باعث دیده شدن radius می‌شود */
}

    .submenu li {
        float: none;
    }

        .submenu li a {
            margin: 0;
            padding: 10px 15px;
            border-radius: 0;
        }

/* نمایش زیرمنو در دسکتاپ */
.menu li:hover > .submenu {
    display: block;
    background-color: var(--main-hover-color);
}

/* --- آیکن منوی موبایل --- */
.menu-icon {
    display: none;
    position: absolute;
    left: 10px;
    top: 38px;
    width: 40px;
    height: 40px;
    background: url("/images/form-icon/hmenu.png") no-repeat center center;
    background-size: 32px;
    cursor: pointer;
    z-index: 2000;
}

/* --- حالت موبایل --- */
@media only screen and (max-width: 768px) {

    .menu-icon {
        display: block;
    }

    .menu {
        width: 0;
        position: absolute;
        left: 0;
        top: 80px;
        background: var(--main-hover-color);
        overflow: hidden;
        height: auto;
        transition: 0.4s;
        z-index: 1500;
        border-radius: 0 8px 8px 0;
        padding: 0;
    }

        .menu.open {
            width: 220px;
        }

        .menu ul {
            width: 100%;
        }

        .menu li {
            float: none;
            width: 100%;
            border-bottom: 1px solid var(--box-color);
            text-align:center;
        }

            .menu li a {
                margin: 0;
                border-radius: 0;
                padding: 12px 22px;
            }

    /* زیرمنو در موبایل آکاردئونی می‌شود */
    .submenu {
        position: static;
        background: #f4f4f4;
        display: none;
        border-radius: 0;
    }
        .submenu li{
            border-bottom:1px solid var(--main-hover-color);
        }

        .submenu li a {
            padding: 10px 20px;
            color: var(--main-hover-color);
            background-color: var(--box-color);
        }

    /* غیرفعال کردن hover در موبایل */
    .menu li:hover > .submenu {
        display: none !important;
    }

    /* نمایش زیرمنو فقط وقتی li.active باشد */
    .menu li.active > .submenu {
        display: block !important;
    }
}
.password-wrapper {
    position: relative;
    display: inline-block;
}

    .password-wrapper .toggle-password {
        position: absolute;
        left: 10px; /* یا هر جهتی که RTL دوست داری */
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
        font-size: 18px;
        color: #666;
    }