﻿


@media only screen and (max-width:1600px){

}

@media only screen and (max-width:850px){

}

@media only screen and (max-width:740px) {

 #header{padding:1% 2%}
 #Searchbox{display:none;}
 .divMenu nav{display:none}
 #header div#logo{width:25%;}
 #header div#logo img{width:100%;}
 div.divMenu{padding:1% 2%;}
 div.divTel{left:2%;top:60%;}

 
div#divDiscounth div#divDiscounthIn{display:block;}
div#divDiscounth div#divDiscounthIn .divstoneIn{width:100%;margin-bottom:5%;}
div#divDiscounth h2#headdis{font-size:1.2em;line-height:3}

div.divpriceall{display:block;}
div.divpriceall div.divPricelists{width:100%;}
div.divartistic div.divartistic1{display:block}
div.divartistic div.divartistic1 div.divartisticinL{width:100%;}
div.divartistic div.divartistic1 div.divartisticinR{width:100%;}
div.divartistic div.divartistic2{display:block}
div.divartistic div.divartistic2 div.divartisticinL{width:100%;}
div.divartistic div.divartistic2 div.divartisticinR{width:100%;}

#divProductSet{display:block;margin:1% 2%;}
#divProductSet .divProductSetimg{width:100%;}
#divProductSet .divProductSetpro{width:100%;}

.parallax-s{padding: 80% 0;}
.testimonial-container {width:95%;}
footer div.divFooterIn{float:initial !important;width:100%;margin-bottom:2%;border-bottom: 1px solid #ffffff4f;}
footer img{width:30%;}
footer div.divFooterIn a{font-size:.8em;margin-bottom:.5%;}
footer div.divFooterIn li div.divT2{font-size:.8em;}
footer .divFootersIn #divSocial{float:initial !important;margin:0 auto;text-align:center;}
footer #divCopyright{font-size:.6em}
div.divpriceAllm{padding:2% 1%;}
.tabs-nav{overflow:scroll;}

div.Marquee ul{position: absolute;top: 78%;width: 90%;height: 200px;left: 50%;margin-left: -145px;margin-top: -130px;}
div.Marquee ul > li{padding:5px;}
div.Marquee{margin-top:20%;}

div.divContentIn{padding:0% 2%}

.logo-parent{max-height:initial;display:initial;}
.items-box{margin-bottom:initial;height:initial;}
.contaner{height:initial;margin:5%;width:90%;}
nav.Menu{width:0%;}
.divPriceStones .divPriceStoneIn{display:block;}
.divPriceStones .divPriceStoneR{width:100%;overflow:scroll;height:200px;margin-bottom:3%;padding:0% 3%;}
.divPriceStones .divPriceStoneL {width:100%;}
.divListp{display:block;}
.divPriceStones .divPriceStoneL .divImageprice{width:100%;}
.divPriceStones .divPriceStoneL .divPricestone2{width:100%;}
.divPriceStones .divPriceStoneL .divPriceStone h2{margin-top:3%;}
.divcona{display:block;}
.divcona .divconr{width:100%;overflow:scroll;height:200px;margin-bottom:3%;padding:0% 3%;}
.divcona .divconl{width:100%;}
div.divGalley{width:49%}
div.divGalley div.divTitle{font-size:.9em}
div.divBackStone #divBack h1{font-size:1.4em}
.social-links{padding:0 0%;}
.social-links__icon{inline-size:4.5rem;block-size:4.5rem;margin-bottom:5%;}
.social-links__text{line-height:0;font-size:.95em}
.social-links i{font-size:1.8em;}

div#divStoneSide{width:100%;float:initial;position:initial}
div#divStoneSide p{display:none}
div#divStone{width:100%;float:inherit}
#divStoneSide2{display:none;}

.AnalyzDesk{display:none;}
.AnalyzResp{display:block;}

div#divStone .Box{font-size: .8em;}

div.divContent-L2{display:block;}
div.divContent-L2 div.L2R{width:98%;}
div.divContent-L .divImg{width:100%;}
.hamburger{display:block}
#divKarino{margin-bottom:5%}
}

@media only screen and (max-width:480px){
div.divTel i{padding:10px 10px 8px 8px;font-size:.9em}
div.divTel a{font-size:1em;}
div.divTel P{font-size:.8em;line-height:1.35;}
div#divpoh{font-size:.8em;padding:.25% 1.5%;}
#divBanner #divTopSearch #divTopSearchIn{display:block;}
select.ddlsearch{width:100%;font-size:12px;}
.btnsearch{width:100%;line-height:0;font-size:12px;}

#divBanner #divTopSearch #divTopSearchIn{width:80%;padding:2% 3%;}
#divBanner #divTopSearch h2{font-size:1.2em;}

.containerT{flex-wrap:wrap !important;}
.containerT .cardTimer{margin:1% 1%;width:31.333% !important;}

.mkdf-banner-holder .mkdf-banner-title.mkdf-title-highlighted{padding:.25% 10px;}
.hover-title{font-size:1.2em;}
figure.snip1088{width:90%;float:initial !important;margin:0 auto;margin-bottom:3%}

.divBanner .divText h3{font-size:1.3em;}
.divBanner .divText p{font-size:.9em}
.btnR{font-size:12px}

}

@media only screen and (max-width:400px){

}

@media only screen and (max-width:350px) {

}

@media only screen and (max-width:320px) {

}

/* تنظیمات عمومی منو */
nav.Menu {
    display: table;
    float: right;
    position: relative;
    z-index: 999;
}

/* استایل دکمه همبرگری */
.hamburger {
    display: none;   /* یا block بر حسب نیاز */
    width:27px;             /* عرض بزرگتر برای راحتی کلیک */
    position: relative;
    cursor: pointer;
    margin-top:5px;
    z-index: 1001;
    padding: 6px;            /* فضای خالی داخلی که قابل کلیک باشه */
    box-sizing: content-box;
    -webkit-tap-highlight-color: transparent;
}

/* خطوط داخل همبرگر — اما کلیک نکنند (تا کلیک به والد برسه) */
.hamburger span {
    position: absolute;
    left: 6px;               /* تنظیم موقعیت از چپ یا راست بر حسب RTL */
    right: 6px;
    height: 3px;
    border-radius: 3px;
    background: #ef4056;
    transition: all 0.3s ease;
    pointer-events: none;    /* مهم: اجازه نده span کلیک دریافت کند */
}
.hamburger span:nth-child(1) { top: 0; }
.hamburger span:nth-child(2) { top: 8px; }
.hamburger span:nth-child(3) { top: 16px; }

/* حالت باز شدن (ضربدر شدن منو) */
.hamburger.active span:nth-child(1) {
    transform: rotate(-45deg);
    top: 9px;
}
.hamburger.active span:nth-child(2) {
    opacity: 0;
}
.hamburger.active span:nth-child(3) {
    transform: rotate(45deg);
    top: 9px;
}

/* منوی موبایل */
@media (max-width: 740px) {
    .menu {
        position: fixed;
        top: 0;
        right: -250px; /* خارج از دید */
        width: 250px;
        height: 100vh;
        background: #fff;
        box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
        flex-direction: column;
        padding-top: 70px;
        overflow-y: auto;
        transition: right 0.4s cubic-bezier(0.77, 0, 0.175, 1);
        visibility: hidden;
        opacity: 0;z-index:1000000;
    }

    .menu.open {
        right: 0;
        visibility: visible;
        opacity: 1;
    }

    .menu li {
        display: block;
        float: none;
        text-align: right;
        margin: 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    }

    .menu li a {
        padding: 12px 20px;
        color: #404040;
        font-size: 15px;
    }

    .hamburger {
        display: block;
    }

    /* زیرمنوها در حالت موبایل */
    .menu ul.sub-menu {
        position: static;
        width: 100%;
        background: #f9f9f9;
        box-shadow: none;
        transform: none;
        transition: none;
        visibility: visible;
        opacity: 1;
        display: none;
    }

    .menu li.open > ul.sub-menu {
        display: block;
    }

    .menu li a::after {
        content: "›";
        float: left;
        transition: transform 0.3s;
    }

    .menu li.open > a::after {
        transform: rotate(90deg);
    }
}
    /* overlay (پشه‌گون/نیمه شفاف پشت منو) */
    .menu-overlay {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        background: rgba(0,0,0,0.35);
        visibility: hidden;
        opacity: 0;
        transition: opacity 0.3s ease, visibility 0.3s;
        z-index: 1000; /* کمتر از همبرگر (1001) و بیشتر از منو (100) */
    }

    /* وقتی منو بازه overlay نمایش داده شود */
    .menu.open ~ .menu-overlay,
    .menu.open + .menu-overlay,
    .menu-overlay.open {
        visibility: visible;
        opacity: 1;
    }

    /* در صورتی که ساختار HTML‌ات فرق داره (مثلاً overlay قبل از ul) از این کلاس برای کنترل نمایش استفاده می‌کنیم */
    .menu-overlay.open {
        visibility: visible;
        opacity: 1;
    }

    /* اطمینان از اینکه کلیک‌ها داخل منو جلو گرفته می‌شوند */
    .menu,
    .menu * {
        -webkit-user-select: none;
        user-select: none;
    }
