/*@font-face {
    font-family: "vazir";
    src: url("../fonts/Sahel-FD.eot");
    src: url("../fonts/Sahel-FD.woff") format("woff");
    src: url("../fonts/Sahel-FD.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}*/

:root{
    --hover-light-red:rgba(224, 61, 65, 0.08);
    --main-red:rgb(238, 29, 35);
    --category-dark-gray:rgb(48, 48, 48);
    --hover-light-blue:rgb(0, 153, 173);
   --tab-active-red:rgba(238, 29, 35,0.9);
}


/*html{
    overflow-y: scroll;
    overflow-x: hidden;
    scroll-behavior: smooth;
}

html, body{
    margin: 0;
    padding: 0;
}

body{
    background-color: rgb(236, 236, 236);

}*/

/*a{
    color: black;
    outline: none;
    text-decoration: none !important;
    
}

a:active, a:focus{
    background: transparent;
}*/



/**:not(i), *::before:not(i), *::after:not(i) { list-style: none; font-family: "vazir"; }

img { margin: 0; padding: 0; border: none; line-height: normal; vertical-align: middle; }

.container { max-width: 100%; }tab-content

.dark { position: absolute; right: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.226); z-index: 1; }*/

/*===================LARGE SCREEN MENU============================*/
nav { position: relative; z-index: 100 !important; }
.navigation-lg { background-color: white; text-align: right; }
    .navigation-lg > .container { position: relative; }
    .navigation-lg .menu-level-1 { display: flex; padding: 0; margin: 0; }
    .navigation-lg .menu-level-1 { list-style:none !important }
            .navigation-lg .list-level-3 ul li { list-style:none !important; padding-bottom:10px; }
        .navigation-lg .menu-level-1 .list-level-1 > a { display: inline-block; border-radius: 25px; padding:  1rem !important; font-size: 1.5rem; margin: 1rem 0.5rem; }

        .navigation-lg .menu-level-1 .list-level-1:hover > a { background: var(--hover-light-red); color: var(--main-red); }

        .navigation-lg .menu-level-1 .list-level-1:hover .mega-menu { display: block; }

    .navigation-lg .mega-menu { position: absolute; top: 100%; right: 50%; transform: translate(50%); width: 97%; background: #eee; border:2px solid #eee; /*height: 33rem;*/ display: none; }
        .navigation-lg .mega-menu .row { height: 100%; }
        .navigation-lg .mega-menu .col-lg-2 { background: rgb(243, 243, 243); padding:0px !important; margin:0px !important }


    .navigation-lg .list-level-2 a { color: var(--category-dark-gray); font-size: 1.3rem; display: block; width: 100%; height: 100%; padding: 0.8rem; margin: 0 !important; position: relative; }
        .navigation-lg .list-level-2 a.active::after { content: ""; position: absolute; height: 100%; top: 0; left: -0.7rem; border-radius: 2px; width: 5px; background: var(--tab-active-red); }

    .navigation-lg .list-level-3 { padding: 1rem 0; }

        .navigation-lg .list-level-3 li a { color: #444; }

            .navigation-lg .list-level-3 li a.list-link:hover { color: black; }

            .navigation-lg .list-level-3 li a.list-title { display: inline-block; color: var(--main-red); margin: 0.4rem auto; position: relative; }
                .navigation-lg .list-level-3 li a.list-title::before { content: "."; position: absolute; font-size: 5rem; line-height: 10px; top: -6px; right: -25px; }
                .navigation-lg .list-level-3 li a.list-title:hover { color: var(--hover-light-red); }

        .navigation-lg .list-level-3 ul { display: flex; flex-direction: column; flex-wrap: wrap; height: 28rem; }

        .navigation-lg .list-level-3 .more { margin-right: 3rem; color: var(--hover-light-blue); padding: 0.5rem 1rem; border-radius: 5px; }
            .navigation-lg .list-level-3 .more:hover { background: rgba(0, 204, 255, 0.219); }

    .navigation-lg .menu-level-3 .col-lg-4 { display: flex; align-items: flex-end; }
    .navigation-lg .menu-level-3 img { width: 100%; }

.list-level-2 a.active { background: var(--tab-active-red); color: white; }
.navigation-lg .tab-content { padding-top:0px !important }

@media screen and (max-width: 992px) {
    .navigation-lg, .dark { display: none !important; }
}



/*===================SMALL SCREEN MENU============================*/

.navigation-sm-toggle { color: #908d8d; font-size: 2.8rem; position: absolute;   }
    .navigation-sm-toggle:hover { color: black; }
.navigation-sm { position: fixed; top: 0; right: 0; background-color: white; height: 100%; width: 35vw; padding: 2rem 0rem; overflow-y: scroll; transition: transform 0.5s; text-align: right; }


    .navigation-sm:not(.side-closed) { box-shadow: 0 0 0 10000px rgba(156, 156, 156, 0.589); }

    .navigation-sm .logo { width: 28rem; display: block; margin: 2rem auto; padding-bottom: 2rem; border-bottom: 1px solid rgb(175, 175, 175); }

.side-closed { transform: translateX(100%); }


.navigation-sm .fa-close { position: absolute; top: 1rem; left: 1rem; font-size: 2rem; color: rgba(29, 29, 29,0.8); }

.navigation-sm ul { margin: 0 !important; padding: 0; }

.navigation-sm li { line-height: 3.5rem; list-style:none !important }
.navigation-sm .menu-level-1 li a { font-size: 1.4rem; }
    .navigation-sm .menu-level-2 li a:not(.list-level-3 a) { color: var(--category-dark-gray); }
/*.navigation-sm .menu-level-1 li > a { color:#555 !important}*/

.navigation-sm .fa-chevron-circle-left { transform: rotate(-90deg); vertical-align: middle; /*font-size: 1.8rem;*/ margin-left: 0.6rem; transition: 0.2s; color:#999 !important }

.d-none { display:none !important }

.navigation-sm .menu-level-2 { background-color: rgb(240, 240, 240); margin: 0; }

.navigation-sm .list-level-1 a { margin-right: 1rem; }
.navigation-sm .list-level-2, .navigation-sm .list-level-3 { padding-right: 2rem; border: none; }
.navigation-sm .list-level-4 { padding-right: 3rem !important; }

    .navigation-sm .list-level-4 a:hover { color: black; }

.collapsed { color: black !important; }
    .collapsed span { transform: rotate(0deg) !important; }

     .navigation-sm-toggle { top: -6.2rem; }

@media screen and (max-width: 750px) {
    .navigation-sm { width: 45vw; }
   
}

@media screen and (max-width: 650px) {
    .navigation-sm { width: 50vw; }
}

@media screen and (max-width: 570px) {
    .navigation-sm { width: 60vw; }

        .navigation-sm .logo { width: 13rem; }
}

@media screen and (max-width: 470px) {
    .navigation-sm { width: 75vw; }

        .navigation-sm .list-level-2, .navigation-sm .list-level-3 { padding-right: 1rem; }
        .navigation-sm .list-level-4 { padding-right: 2rem !important; }
  
}

@media screen and (min-width: 992px) {
    .navigation-sm, .navigation-sm-toggle { display: none; }
}