﻿




 @font-face {
 font-family: Estedad-FD-Regular;
 src: url('../fonts/Estedad-FD-Regular.ttf');
 }
 @font-face {
 font-family: Estedad-FD-Medium;
 src: url('../fonts/Estedad-FD-Medium.ttf');
 }
 @font-face {
 font-family: Estedad-FD-Bold;
 src: url('../fonts/Estedad-FD-Bold.ttf');
 }
  @font-face {
 font-family: Estedad-FD-Black;
 src: url('../fonts/Estedad-FD-Black.ttf');
 }
 @font-face {
 font-family: Estedad-FD-ExtraBold;
 src: url('../fonts/Estedad-FD-ExtraBold.ttf');
 }


body {
    padding:0; 
    font-family: Estedad-FD-Regular;
    font-size:12px;
    margin:0px auto auto auto;
    direction:rtl;
    text-align:right;
}

.css_transparent_bg {
            /*  display: none;  Hidden by default */
            position: fixed; /* Stay in place */
            z-index: -1; /* Sit on top */
            /* padding-top: 100px; */ /*Location of the box */
            padding-top: 1%;
            left: 0;
            top: 0;
            width: 100%; /* Full width */
            height: 100vh; /* Full height */
            overflow: auto; /* Enable scroll if needed */
            background-color: rgb(0,0,0); /* Fallback color */
            background-color: rgba(0,0,0,0.7); /* Black w/ opacity */
        }

.css_transparent_bg_shop {
            /*  display: none;  Hidden by default */
            position: fixed; /* Stay in place */
            z-index: -1; /* Sit on top */
            /* padding-top: 100px; */ /*Location of the box */
            padding-top: 0%;
            left: 0;
            top: 0;
            width: 100%; /* Full width */
            height: 100vh; /* Full height */
            overflow: auto; /* Enable scroll if needed */
            background-color: rgb(0,0,0); /* Fallback color */
            background-color: rgba(0,0,0,0.7); /* Black w/ opacity */
            border:0px solid blue;
        }

.loading_css
{
    position:absolute;
    top:0px;
    left:0px;

    justify-content:center; 
    display:flex; 
    align-items:center;
    width:100%; 
    height:100vh; 
    padding-bottom:200px; 
}

/********************  Scrollbar  *******************/
/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #ccd4db; 
  border-radius: 5px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #ccd4db; 
  border-radius: 5px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    box-shadow: inset 0 0 8px #929fb1;
    background: #e3e3e3; 
}

/************ Font color ************/
.color_1{ color:#929fb1; }
.color_2{ color:#ccd4db; }
.color_3{ color:#404b5a; }
.color_3_1{ color:#202833; }
.color_4{ color:#f8f9fb; }
.color_5{ color:#6e7a8a; }
.color_6{ color:#f8f9fa; }
.color_7{ color:#E1E7EC; }
.color_burple{ color:#3d348b; }
.color_burple_2{ color:#e3e1f4; }
.color_yellow_1{ color:#e6af2e; }
.color_yellow_2{ color:#fdf8ed; }
.color_green_1{ color:#fd6a0a; /*#0fd284;*/ }
.color_green_2{ color:#c6fbe6; }
.color_green_3{ color:#fd6a0a; /*#0fd284;*/ }
.color_green_4{ color:#0a915b; }
.color_green_4{ color:#14A368; }
.color_red_1{ color:#ff3c38; }
.color_red_2{ color:#ffebeb; }
.color_gray_1{ color:#AEBECD; }

/**************** Label *****************/
@media only screen and (max-width:650px)
{
    .header_1 {
        margin-right: 5%;
        font-size: 3.6vw;
        font-weight: bold;
    }
}
@media only screen and (min-width:650px)
{
    .header_1 {
        margin-right: 5%;
        font-size: 2.3vw;
        font-weight: bold;
    }
}
/*.header_1 {
    margin-right: 5%;
    font-size: 2.3vw;
    font-weight: bold;
}*/
.header_2 {
    margin-right: 5%;
    font-weight: bold;
}
.header_2_1 {
    margin-right: 5%;
    font-family: Estedad-FD-Bold;
    font-weight:700; 
    line-height:27px;
}
.header_2_2 {
    font-size:18px;
    font-family: Estedad-FD-Bold;
    font-weight:700; 
    line-height:150%;
}
.header_2_3 {
    font-size:14px;
    font-family: Estedad-FD-Bold;
    /*font-weight:700;*/ 
    line-height:200%;
}
.header_3 {
    margin-right: 5%;
    font-size:1vw; 
}
.header_4 {
    margin-right: 5%;
    font-family:Estedad-FD-ExtraBold;
}
.header_5 {
    margin-right: 5%;
    font-family:Estedad-FD-Regular;
    font-size:16px;
    font-weight:400;
}
.header_5_1 {
    margin-right: 5%;
    font-family:Estedad-FD-Regular;
    font-size:16px;
    font-weight:400;
    line-height:200%;
}
.header_6 {
    margin-right: 5%;
    font-family:Estedad-FD-ExtraBold;
    font-size:18px;
    font-weight:700;
}

.lbl_style_1 {
    font-size: 1.5vW;
    font-weight: bold;
    text-align: right;
    margin-top: 20px;
}
.lbl_style_2 {
    color:#fd6a0a; /*#0fd284;*/ 
    font-weight:bold; 
    font-size:20px;
    text-align:right; 
    padding-top:10px; 
    padding-bottom:10px; 
    padding:10px;
}

.p_style_1 {
    color:#6e7a8a; 
    font-weight:bold; 
    font-size:18px;
    text-align:justify; 
    text-justify:inter-word;
    padding-top:10px; 
    padding-bottom:10px; 
    padding:10px;
}
.p_style_2 {
    color:#6e7a8a; 
    font-family:Estedad-FD-Regular;
    font-weight:400;
    font-size:16px;
    text-align:justify; 
    text-justify:inter-word;
}

/*************** Divider *****************/ 
.horizontal_divider_1{
    background-color:#BDBDBD; 
    width:100%; 
    height:0.5px;
}
.horizontal_divider_2{
    background-color:#f1eeee; 
    width:100%; 
    height:0.5px;
}
.horizontal_divider_3{
    background-color:#ffffff; 
    width:100%; 
    height:1px;
}
.horizontal_divider_4{
    background-color:#aebecd; 
    width:100%; 
    height:1px;
}
.horizontal_divider_5{
    background-color:#F8F9FA; 
    width:100%; 
    height:2px;
}
/**********************************************************/ 
.bg_frame_body
{
    margin-bottom:50px; 
    margin-top:110px;
}
.bg_frame1
{
    background-color:#ffffff;
    border-radius:5px;
}

.bg_frame2
{
    background-color:#ffffff;
    border-radius:5px;
    /*border:1px solid #BDBDBD;*/
    border:1px solid #e6e7e9;
}

.bg_frame3
{
    background-color:#ffffff;
    border-radius:5px;
    border:1px solid #BDBDBD;
    box-shadow:0px 0px 10px rgba(0,0,0,0.1);
}

.bg_frame4
{
    background-color:#ff3c38;
    border-radius:15px;
    color:#ffffff;
    /*box-shadow:0px 0px 10px rgba(0,0,0,0.1);*/
}

.bg_frame5 {
    border-radius:5px;
    background-color:#0094ff;
    color:#ffffff;
}

.bg_frame6 {
    border-radius:15px;
    border:1px solid #ccd4db;
    color:#929fb1;
}

.bg_frame7 {
    border-radius:15px;
    background-color:#f8f9fa;
}

.bg_frame8 {
    border-radius: 5px;
    background-color: #fd6a0a; /*#fd6a0a; /*#0fd284;*/*/
}

.bg_frame9
{
    background-color:#e6e7e9;
    border-radius:5px;
    border:0px solid #BDBDBD;
}

.bg_frame10
{
    background-color:#000000;
    border-radius:5px;
    color:#ffffff;
}

.bg_frame11
{
    border:1px solid #ccd4db; 
    border-radius:15px; 
    padding:10px; 
    margin-bottom:5px; 
    font-weight:bold; 
    cursor:pointer;
    color:#6e7a8a;
}
.bg_frame11:hover
{
    border:1px solid #ccd4db; 
    border-radius:15px; 
    padding:10px; 
    margin-bottom:5px; 
    font-weight:bold; 
    cursor:pointer;
    color:#6e7a8a;
    background-color:#ccd4db;
}

.bg_frame12 {
    border-radius:5px;
    background-color:#6e7a8a;
}

.bg_frame_circle
{
    /*background-color:#dbdbdb;  */ 
    border:1px solid #BDBDBD;
    border-radius:50%;
    color:#0000ff;
    /*min-width:15px;*/
}
.bg_frame_circle:hover
{
    background-color:#0000ff;
    border-radius:50%;
    color:#ffffff;
}

/************ Dialogs ************/
.dialog_bg_1
{
    width:100%; 
    height:100vh; 
    border-radius:0px; 
    position:absolute; 
    top:0px; 
    right:0px;
}

.header_modal_bg 
{
    width: 100%;
    height: 40px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background-color: #fd6a0a; /*#0fd284;*/
}


.dialog_bg_2
{
    z-index:1;
    position:relative;  
    width:270px;
    height:200px;

    background-color:#ffffff;
    border-top-left-radius: 10px 10px;
    border-top-right-radius: 10px 10px;
    border-bottom-left-radius : 10px 10px;
    border-bottom-right-radius : 10px 10px;
    box-shadow: 0px 10px 50px rgba(0,0,0,5);
}

.color_search_header
{
    cursor:pointer; 
    margin-top:5px; 
    margin-bottom:5px; 
    color:#6e7a8a; 
    background-color:#f8f9fa;
    /*background-color:red;*/
    text-align:center;
    display:flex; 
    justify-content:center; 
    align-items:center; 
    padding:10px; 
    border-radius:15px;
    position: relative;
    display: inline-block;
  /*border-bottom: 1px dotted black;*/
}
 /*.color_search_header:hover { font-weight:bolder;  }*/
 .color_search_header .tooltiptext_header {
  visibility: hidden;
  width: 100px;
  background-color: black;
  color: #fff;
  text-align: center;
  font-size:14px;
  font-style:normal;
  font-weight:700;
  line-height:27px;
  border-radius: 10px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 70%;
  left: 62%;
  margin-left: -60px;

  /* Fade in tooltip - takes 1 second to go from 0% to 100% opac: */
  opacity: 0;
  transition: opacity 1s;
}

.color_search_header .tooltiptext_header::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #0FD284 transparent transparent transparent;
  
}

.color_search_header:hover .tooltiptext_header {
  visibility: visible;
  background-color:#fd6a0a; /*#0fd284;*/
  opacity: 1;
  
}
/************ Buttons ************/
.css_prev_btn
{
    width:6%;
    z-index:100000;           
}

.btn_style1
{
    background-color:#00603a;
    border-radius:5px;
    color:#ffffff;
    text-align:center;
    cursor:pointer;
    /*box-shadow:0px 0px 10px rgba(0,0,0,0.1);
        00603a
        .color_green_1{ color:#fd6a0a; /*#0fd284;*/ }
.color_green_2{ color:#c6fbe6; }
.color_green_3{ color:#fd6a0a; }
     


.btn_style2 {
    border-radius:5px;
    background-color:#0094ff;
    color:#ffffff;
    text-align:center;
    cursor:pointer;
}

.btn_style_green {
    border-radius: 25px;
    background-color: #fd6a0a; /*#0fd284; 2371b1 */
    color: #ffffff;
    text-align: center;
    cursor: pointer;
    padding: 10px;
}
.btn_style_green:hover {
    border-radius:25px;
    background-color:#5bdb9b;
    color:#ffffff;
    text-align:center;
    cursor:pointer;
    padding:10px;
}
.btn_style_green:focus {
    border-radius:25px;
    background-color:#00c96d;
    color:#ffffff;
    text-align:center;
    cursor:pointer;
    padding:10px;
}
.btn_style_green:active {
    border-radius:25px;
    background-color:#0a915b;
    color:#ffffff;
    text-align:center;
    cursor:pointer;
    padding:10px;
}

.btn_style_blue {
    border-radius: 15px;
    background-color: #2371b1;
    color: #ffffff;
    text-align: center;
    cursor: pointer;
    padding: 10px;
}

    .btn_style_blue:hover {
        border-radius: 15px;
        background-color: #14a1c8;
        color: #ffffff;
        text-align: center;
        cursor: pointer;
        padding: 10px;
    }

    .btn_style_blue:focus {
        border-radius: 15px;
        background-color: #005ac9;
        color: #ffffff;
        text-align: center;
        cursor: pointer;
        padding: 10px;
    }

    .btn_style_blue:active {
        border-radius: 15px;
        background-color: #005ac9;
        color: #ffffff;
        text-align: center;
        cursor: pointer;
        padding: 10px;
    }

.btn_style_white {
    border-radius:5px;
    background-color:#ffffff;
    color:#0094ff;
    text-align:center;
    cursor:pointer;
}

.btn_style_gray_1 {
    border-radius:5px;
    background-color:#f1eeee;
    color:#0094ff;
    text-align:center;
    cursor:pointer;
}

.btn_style_gray_2 {
    border-radius:25px;
    border:1px solid #aebecd;
    background-color:#ffffff;
    color:#404b5a;
    text-align:center;
    cursor:pointer;
    padding:10px;
}
.btn_style_gray_2:hover {
    border-radius:25px;
    border:1px solid #e7ecf0;
    background-color:#f8f9fa;
    color:#404b5a;
    text-align:center;
    cursor:pointer;
    padding:10px;
}
.btn_style_gray_2:focus {
    border-radius:25px;
    border:1px solid #e1e7ec;
    background-color:#e1e7ec;
    color:#404b5a;
    text-align:center;
    cursor:pointer;
    padding:10px;
}
.btn_style_gray_2:active {
    border-radius:25px;
    border:1px solid #ccd4db;
    background-color:#ccd4db;
    color:#404b5a;
    text-align:center;
    cursor:pointer;
    padding:10px;
}

.btn_style_gray_3 {
    border-radius:25px;
    border:1px solid #F8F9FA;
    background-color:#ffffff;
    text-align:center;
    cursor:pointer;
    padding:10px;
}

.btn_style_gray_4 {
    border-radius:25px;
    border:1px solid #F8F9FA;
    background-color:#ffffff;
    cursor:pointer;
    display:flex;
    justify-content:center;
    align-items:center;
    color:#404B5A;
    font-family:Estedad-FD-Bold;
    font-size:16px;
}

.btn_style_orange_5 {
    border-radius: 10px;
    border: 1px solid #aebecd;
    background-color: #fd6a0a;
    color: #ffffff;
    text-align: center;
    cursor: pointer;
    padding: 10px;
}

    .btn_style_orange_5:hover {
        border-radius: 10px;
        border: 1px solid #e7ecf0;
        background-color: #fc9d5f;
        color: #ffffff;
        text-align: center;
        cursor: pointer;
        padding: 10px;
    }

    .btn_style_orange_5:focus {
        border-radius: 10px;
        border: 1px solid #e1e7ec;
        background-color: #e1e7ec;
        color: #ffffff;
        text-align: center;
        cursor: pointer;
        padding: 10px;
    }

    .btn_style_orange_5:active {
        border-radius: 10px;
        border: 1px solid #ccd4db;
        background-color: #ccd4db;
        color: #ffffff;
        text-align: center;
        cursor: pointer;
        padding: 10px;
    }
/**************** TextBox *****************/
.txt_width
        {
            width:100%;
        }

.txt_style_2 {
    border: 0px;
    padding-right:5px;
    padding-left:5px;
}

.txt_style_2:focus {
    outline: none;
}

.txt_style_3 {
    /*border: 1px solid #929fb1;*/
    border: 1px solid #aebecd;
    border-radius:15px;
    padding:10px;
    background-color:white;
    /*padding-left:5px;*/ 
}

.txt_style_3:focus {
    outline: none;
    border: 1px solid #6e7a8a;
    /*border: 1px solid #404b5a;*/
}
.txt_style_3_1 {
    border: 2px solid #F8F9FA;
    border-radius:25px;
    padding:14px;
    background-color:white;
}

.txt_style_3_1:focus {
    outline: none;
    border: 2px solid #F8F9FA;
}
.txt_style_4{
    width:30px; 
    border-top-style:hidden; 
    border-right-style:hidden; 
    border-left-style:hidden; 
    border-bottom-style:groove;
    font-size:20px; 
    text-align:center;
}
.txt_style_4:focus {
    outline: none;
}

.txt_style_5
{
    background-color:#ffffff;
    border-radius:5px;
    /*border:1px solid #BDBDBD;*/
    border:1px solid #e6e7e9;
}
.txt_style_5:focus {
    outline: none;
    border: 1px solid #fd6a0a; /*#0fd284;*/
}


/*////////////////////////////////////*/

    .rb_style_1{
        position:relative;
            width: 16px;
        height: 16px;
        border-radius: 16px;
    background-color:white;
    border:1px solid #fd6a0a; /*#0fd284;*/
}
    .rb_style_1_checked{
            width: 16px;
        height: 16px;
        border-radius: 16px;
    background-color:#ffffff;
    border:1px solid #fd6a0a; /*#0fd284;*/
    
    
}
    .rb_child_style_1{
        width: 7px;
        height: 7px;
        border-radius:7px;
        top:25%;
        right:25%;
        position: absolute;
        background-color:#fd6a0a; /*#0fd284;*/
        /*width: 7px;
        height: 7px;
        border-radius:7px;
        background-color:#fd6a0a; /*#0fd284;*/
         margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);*/
 }

/*//////////     Product    /////////*/
        /*@media screen and (max-width: 470px) 
{
    .InfoCells_bg {
             display: grid; 
             grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); 
             grid-gap: 0px; 
             padding: 0px; 
        }

    .img_show_main{
        padding:5px; width:200px; height:340px;
    }
}

        .img_show_main
        {
        padding:5px; width:340px; height:340px;
        }*/

        /*@media screen and (max-width: 470px) 
        {

        }*/
         

        /*.grid-container {
          display: grid;
          grid-template-columns: 80px auto;
          grid-gap: 10px;
          padding: 10px;
        }

        .grid-container > div {
          text-align: right;
          padding: 0px 0;
        }*/

      .btn_style_shop {
          cursor:pointer; 
          font-weight:bold; 
          padding-top:5px; 
          padding-bottom:5px;
          color:#fd6a0a; /*#0fd284;*/
          text-align:center;
      }


      .bg_frame_green{
          border:1px solid #fd6a0a; /*#0fd284;*/
          border-radius:5px;
      }
      .bg_frame_gray{
          border:1px solid #F8F9FA;
          border-radius:10px;
      }

       * {box-sizing: border-box;}

        .img-zoom-container {
          position: relative;
          width:300px;
        }

        .img-zoom-lens {
          position: absolute;
          /*border: 1px solid #d4d4d4;*/
          border-radius:5px;
          /*set the size of the lens:*/
          width: 40px;
          height: 40px;
        }

        .img-zoom-result {
          border: 1px solid #e6e7e9;
          border-radius:15px;
          /*set the size of the result div:*/
          width: 340px;
          height: 340px;
        }


/*************** Menu *************/
.main_css_menu {
            cursor: pointer;
            margin-top: 0px;
            margin-bottom: 0px;
            color: #6e7a8a;
            font-weight:bold;
            text-align: center;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 5px;
            align-content:center;
}
    .main_css_menu:hover {
        font-weight: bolder;
        color: #1e87b0; /* fd6a0a; #0fd284;*/
    }
        .gmainGroup_css_menu {
            cursor: pointer;
            margin-top: 0px;
            margin-bottom: 0px;
            color: #6e7a8a;
            font-weight:bold;
            text-align: right;
            display: flex;
            /*justify-content: center;*/
            align-items: center;
            align-content:center;
            padding: 5px;
        }

            .gmainGroup_css_menu:hover {
                font-weight: bolder;
                color: #1e87b0; /*#0fd284;*/
            }

        .brand_css_menu {
            cursor: pointer;
            margin-top: 0px;
            margin-bottom: 0px;
            color: #6e7a8a;
            padding-top:5px;
            padding-right:5px;
        }

            .brand_css_menu:hover {
                font-weight: bolder;
                color: #1e87b0; /*ff6200;*/
                /*background-image: linear-gradient(to right,rgba(255,0,0,0) , #f8f9fa, rgba(255,0,0,0));*/
            }

        .cards_menu {
            display: grid;
            /*grid-template-columns: repeat(auto-fill, minmax(115px, 1fr));*/
            grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
            grid-gap: 0px;
            padding: 0px;
        }

        article_menu {
            position: relative;
            direction: rtl;
            text-align: right;
        }

        a:visited, a:link, a:active
        {
            text-decoration: none;
            color: #6e7a8a;
        }
        /*a:hover{
            color:#fd6a0a; /*#0fd284;*/
        }*/


         /******** Menu categories *******/    
        .div_bg_main_css
        {
            border:0px solid blue;
            position:relative;
            max-width:90%; 
            height:400px;
            
        }
        .div_categories_css
        {
            vertical-align:top;
            width:150px;
            height:400px;
            background-color:#f8f9fa;
            border-bottom-right-radius:10px;
        }
        .div_brands_css
        {
            vertical-align:top; 
            height:100%;
            background-color:white;
            border-bottom-left-radius:10px;
            
        }
        @media screen and (min-width: 901px) {

            .grid-container {
                 display: grid;
                 grid-template-columns: 22% 78%;
                 gap: 0px;
                 padding: 0px;
            }

            .grid-container > div {
                 background-color: rgba(255, 255, 255, 0.8);
                 text-align: center;
                 padding: 0px 0;
            }

            #div_bg_main {
                display:block;
            }

            #div_bg_main_tablet {
                display:none;
            }
        }
        
@media screen and (max-width: 900px) 
{
            .grid-container {
                display: grid;
                grid-template-columns: 100%;
                gap: 0px;
                padding: 0px;
            }

        .grid-container > div {
                    background-color: rgba(255, 255, 255, 0.8);
                    text-align: center;
                    padding: 0px 0;
                }
        #div_bg_main {
        display:none;
    }
    #div_bg_main_tablet {
        display:block;
    }

}
        /*************************************/
        .div_menu_categories_item_mobile_css {
            border:0px solid red;
            /*position:relative;*/
            width:100%; 
            /*margin-right:5%;*/
            background-color:#ffffff;
            height:50px;
            text-align:right;
            display: grid; 
            grid-template-columns: 40px auto 20px;  /*repeat(auto-fill, minmax(300px, 1fr));*/ 
            grid-gap: 0px; 
            padding: 0px; 
        }
        .div_menu_categories_item_css
        {
            border:0px solid red;
            /*position:relative;*/
            width:100%; 
            /*margin-right:5%;
            background-color:#ffffff;*/
            height:50px;
            text-align:right;
            display: grid; 
            grid-template-columns: 40px auto 20px;  /*repeat(auto-fill, minmax(300px, 1fr));*/ 
            grid-gap: 0px; 
            padding: 0px; 
            
        }
        .div_menu_categories_item_css:hover
        {
            border:0px solid red;
            /*position:relative;*/
            width:100%; 
            /*margin-right:5%;*/
            height:50px;
            background-color:#e1e7ec;
            display: grid; 
            grid-template-columns: 40px auto 20px;  /*repeat(auto-fill, minmax(300px, 1fr));*/ 
            grid-gap: 0px; 
            padding: 0px;
        }
        .div_menu_categories_item_css > div {
  
          /*text-align: center;*/
          padding: 2px;
          border:0px solid blue;
          
          align-content:center;
          align-items:center;
          display:flex;
          vertical-align:middle;
        }
        .div_categories_css
        {

            
        }
        .div_brands_css
        {
            vertical-align:top; 
            height:100%;
            background-color:white;
            border-bottom-left-radius:10px;
        }
/*********************************/
/*********** Default *************/

    @media only screen and (min-width: 500px)
    {
        /*.bg_mainbody_css {
            padding-right:10%; 
            padding-left:10%;
            border:0px solid blue;
        }*/
        .img_gmain_default {
            width:150px;
        }
        .title_gmain_default {
            font-family:Estedad-FD-Bold;
            font-size:18px;
        }
        .GMainGroup_bg {
            width:80%;
        }
        /* Proposal */
        .proposal_bg_default
        {
            border-radius:15px;
        }
        .proposal_main_bg_default
        {
            padding-right:10%;
            padding-left:10%;
        }

        /* GoodsSample */
        .img_goodssample_default {
            width:100%; 
            height:100%; 
            min-height:210px; 
            border-radius:15px;
        }

        /* Colour Suggestion */
        .img_colour_suggestion_css {
             content:url("https://ebaz.ir/images/img_offer.jpg");
        }

        /* Article */
        .bg_article_default {
             padding:5px; 
             border:0px; 
             margin:0px; 
             min-height:260px; 
             border:0px solid red;
        }
        .img_article_default
        {
            width:200px; 
            height:150px; 
            border-radius:15px;
        }
        .title_article_default {
            font-weight:normal;
            font-size:16px;
            padding:10px;
            text-align:justify;
        }
    }
    @media only screen and (max-width: 499px)
    {
        .bg_mainbody_css {
            padding-right:5%; 
            padding-left:5%;
            border:0px solid blue;
        }
        .img_gmain_default {
            width:90px;
        }
        .title_gmain_default {
            font-weight:bold;
            font-size:12px;
        }

        .GMainGroup_bg {
            width:98%;
        }

        /* Proposal */
        .proposal_bg_default
        {
            border-top-right-radius:15px;
            border-bottom-right-radius:15px;
        }
        .proposal_main_bg_default
        {
            padding-right:10%;
        }
        /* GoodsSample */
        .img_goodssample_default {
            width:100%; 
            height:100%; 
            min-height:110px; 
            border-radius:15px;
        }

        /* Colour Suggestion */
        .img_colour_suggestion_css {
             content:url("https://ebaz.ir/images/offer_mobile.png");
        }

        /* Article */
        .bg_article_default {
             padding:5px; 
             border:0px; 
             margin:0px; 
             min-height:160px; 
             border:0px solid red;
        }
        .img_article_default {
            width:120px;
            height:90px;
            border-radius:15px;
        }
        .title_article_default {
            font-weight:normal;
            font-size:12px;
            padding:10px;
            text-align:justify;
        }
    }


    /******************** Product ********************/

    .grid-container_product {
                display: grid;
                grid-template-columns: 90px auto;
                gap: 0px;
                padding: 0px;
            }

    .grid-container_product > div {
          background-color: rgba(255, 255, 255, 0.8);
          text-align: center;
          padding: 0px 0;
     }
    #div_bg_main {
        display:none;
    }
    #div_bg_main_tablet {
        display:block;
    }


    .InfoCells_bg {
             display: grid; 
             grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
             grid-gap: 50px; 
             padding: 0px; 
        }

        InfoCells { 
            position: relative; 
            direction: rtl; 
            text-align: center; 
            box-shadow: 0 0 0px; 
            border-radius: 5px; 
        }

    /******************* Products *********************/
    @media only screen and (min-width: 500px)
        {
            .img_goods_products {
                width:100%; height:100%; 
                /*min-height:215px;*/ 
                border-radius:15px;
            }
            .btn_add {
                position:absolute;
                right:0px;
                top:10px;
            }
            .lbl_before_price {
                text-align:center; color:#a0a0a0; text-decoration:line-through;
                position:absolute;
                right:100px;
                top:15px;
            }
            .lbl_after_price {
                padding-left:8px; border:0px solid red;
                position:absolute;
                left:0px;
                top:15px;
            }
        }
        @media only screen and (max-width: 499px)
        {
            .img_goods_products {
                width:100%; 
                height:100%;
                /*height:145px;*/ 
                border-radius:15px;
            }
            .btn_add {
                position:absolute;
                right:0px;
                bottom:5px;
            }
            .lbl_before_price {
                text-align:center; color:#a0a0a0; text-decoration:line-through;
                position:absolute;
                right:10px;
                top:0px;
            }
            .lbl_after_price {
                padding-left:8px; border:0px solid red;
                position:absolute;
                left:0px;
                top:0px;
            }
        }

    /******************* Footer *********************/

            @media only screen and (min-width: 500px) {
                .sevicesinfo_bg {
                    display:flex; justify-content:space-between; flex-wrap:wrap;
                }
                /*.sevicesinfo_footer {
                    direction:ltr; 
                    display:grid; 
                    grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); 
                    grid-gap:0px; 
                    padding:0px; 
                    border:0px solid red;
                }*/
                /*  */
                .footer_css_color {
                    direction:ltr; 
                    justify-content:center;
                    cursor: pointer;
                    margin-top: 5px;
                    margin-bottom: 5px;
                    color: #6e7a8a;
                    text-align: center;
                    display: flex;
                    justify-content: flex-start;
                    align-items: center;
                    padding: 5px;
                    border:0px solid blue;
                }
                .footer_menu {
                    display: grid;
                    grid-template-columns: repeat(auto-fill, minmax(50%, 1fr));
                    grid-gap: 0px;
                    padding: 0px;
                }
                article_footer {
                    position: relative;
                    direction: rtl;
                    /*text-align: right;*/
                }
                .video_dialog_bg {
                    width:94vh; max-height:90vh; margin-top:5vh;
                }
            }
            @media only screen and (max-width:900px) {
                .video_dialog_bg {
                    width:100vh; max-height:90vh; margin-top:5vh;
                }
            }
            @media only screen and (max-width: 499px)
            {
                .sevicesinfo_bg {
                    display:flex; 
                    justify-content:space-around; 
                    flex-wrap:wrap;
                }
                /*.sevicesinfo_footer {
                    direction:ltr; 
                    display:grid; 
                    grid-template-columns:repeat(auto-fill, minmax(120px, 1fr)); 
                    grid-gap:0px; 
                    padding:0px; 
                    border:0px solid red;
                }*/

                /*  */
                .footer_css_color {
                    direction:ltr; 
                    justify-content:center;

                    cursor: pointer;
                    margin-top: 5px;
                    margin-bottom: 5px;
                    color: #6e7a8a;
                    text-align: center;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    padding: 5px;
                    border:0px solid blue;
                }
                .footer_menu {
                    display: grid;
                    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
                    grid-gap: 0px;
                    padding: 0px;
                }
                article_footer {
                    position: relative;
                    direction: rtl;
                }

                .video_dialog_bg {
                    width:94%; max-height:90vh; margin-top:5vh;
                }

            }
            
/************************** Color Suggestion *****************************/

   .gmainGroup_css_room {
            position:relative; direction:rtl; text-align:center; background-color:#f8f9fa; border-radius:15px;
                                    color:#6e7a8a;
                                    width:113px;
                                    height:113px;
                                    margin:1px;
                                    display:flex; justify-content:center; align-items:center;
            margin:6px;
            font-size:16px;
        }

        .gmainGroup_css_room:hover {
            border:2px solid #fd6a0a; /*#0fd284;*/
            cursor:pointer;
        }
        
        .steps_bg {
            width:80%; 
            border:0px solid red;
        }

        .card_room_bg {  width:100%; margin-left:0%; }
         /*.card_room { display:grid; grid-template-columns:repeat(auto-fill, minmax(500px, 1fr)); grid-gap:0px; padding:0px; }*/
         .card_room { display:grid; grid-template-columns:repeat(auto-fit, minmax(500px, 1fr)); grid-gap:0px; padding:0px; }
          article_room { direction:rtl; color:#6e7a8a; border:0px solid green; }  /*border-radius:15px; position:relative; text-align:center;*/
          article_room:hover { color:#6e7a8a;  }   /*position:relative; border-radius:15px; direction:rtl; text-align:center;*/
          .bg_sugges_items {
              display:flex; flex-wrap:wrap; text-align:left; float:left; border:0px solid blue;
              direction:ltr;
          }

          .p_style_3 {
                  padding:24px;
                  width:338px;
                  line-height:200%;
              }
          #btn_np {
                  visibility:hidden;
              }

          @media screen and (max-width: 901px) {

              .steps_bg {
                    width:94%;
              }

              .card_room_bg {
                  width:100%;
                  margin-left:0%;
              }
              .card_room { display:grid; grid-template-columns:repeat(auto-fill, minmax(390px, 1fr)); grid-gap:0px; padding:0px; }
              .p_style_3 {
                  padding:12px;
                  width:300px;
              }
              .bg_frame_body {
                  margin-top:20px;
              }
          }
          @media screen and (max-width: 501px) {
              /*.card_room_bg { width:100%; border:0px solid red; }*/
              .steps_bg {
                   width:98%;
              }

              #btn_np {
                  visibility:visible;
              }
              .css_btn_np {
                  display:none;
              }
              .card_room_bg {
                  width:100%;
              }
              .card_room { display:grid; grid-template-columns:repeat(auto-fill, minmax(370px, 1fr)); grid-gap:0px; padding:0px; }
              .p_style_3 {
                  padding:12px;
                  width:280px;
              }
              .bg_sugges_items {
                display:flex; justify-content:space-around; flex-wrap:wrap; text-align:left; float:left; border:0px solid blue;
                direction:ltr;
              }

              .txt_third {
                  /** Rotation */
                    -webkit-transform: rotate(-90deg); 
                    -moz-transform: rotate(-90deg);    
                    transform:rotate(-90deg);
              }

              .bg_frame_body {
                  margin-top:0px;
              }
          }
          /*********************************************************/

@media screen and (max-width:501px) {
    .bg_price_filter {
        display: none;
    }
}


[slider] {
    position: relative;
    height: 14px;
    border-radius: 10px;
    text-align: left;
    margin: 45px 0 10px 0;
}

    [slider] > div {
        position: absolute;
        left: 13px;
        right: 15px;
        height: 14px;
    }

        [slider] > div > [inverse-left] {
            position: absolute;
            left: 0;
            height: 14px;
            border-radius: 10px;
            background-color: #CCC;
            margin: 0 7px;
        }

        [slider] > div > [inverse-right] {
            position: absolute;
            right: 0;
            height: 14px;
            border-radius: 10px;
            background-color: #CCC;
            margin: 0 7px;
        }

        [slider] > div > [range] {
            position: absolute;
            left: 0;
            height: 14px;
            border-radius: 14px;
            background-color: #1ABC9C;
        }

        [slider] > div > [thumb] {
            position: absolute;
            top: -7px;
            z-index: 2;
            height: 28px;
            width: 28px;
            text-align: left;
            margin-left: -11px;
            cursor: pointer;
            box-shadow: 0 3px 8px rgba(0, 0, 0, 0.4);
            background-color: #FFF;
            border-radius: 50%;
            outline: none;
        }

    [slider] > input[type=range] {
        position: absolute;
        pointer-events: none;
        -webkit-appearance: none;
        z-index: 3;
        height: 14px;
        top: -2px;
        width: 100%;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        -khtml-opacity: 0;
        opacity: 0;
    }

div[slider] > input[type=range]::-ms-track {
    -webkit-appearance: none;
    background: transparent;
    color: transparent;
}

div[slider] > input[type=range]::-moz-range-track {
    -moz-appearance: none;
    background: transparent;
    color: transparent;
}

div[slider] > input[type=range]:focus::-webkit-slider-runnable-track {
    background: transparent;
    border: transparent;
}

div[slider] > input[type=range]:focus {
    outline: none;
}

div[slider] > input[type=range]::-ms-thumb {
    pointer-events: all;
    width: 28px;
    height: 28px;
    border-radius: 0px;
    border: 0 none;
    background: red;
}

div[slider] > input[type=range]::-moz-range-thumb {
    pointer-events: all;
    width: 28px;
    height: 28px;
    border-radius: 0px;
    border: 0 none;
    background: red;
}

div[slider] > input[type=range]::-webkit-slider-thumb {
    pointer-events: all;
    width: 28px;
    height: 28px;
    border-radius: 0px;
    border: 0 none;
    background: red;
    -webkit-appearance: none;
}

div[slider] > input[type=range]::-ms-fill-lower {
    background: transparent;
    border: 0 none;
}

div[slider] > input[type=range]::-ms-fill-upper {
    background: transparent;
    border: 0 none;
}

div[slider] > input[type=range]::-ms-tooltip {
    display: none;
}

[slider] > div > [sign] {
    opacity: 0;
    position: absolute;
    margin-left: -11px;
    top: -39px;
    z-index: 3;
    background-color: #1ABC9C;
    color: #fff;
    width: 28px;
    height: 28px;
    border-radius: 28px;
    -webkit-border-radius: 28px;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    text-align: center;
}

    [slider] > div > [sign]:after {
        position: absolute;
        content: '';
        left: 0;
        border-radius: 16px;
        top: 19px;
        border-left: 14px solid transparent;
        border-right: 14px solid transparent;
        border-top-width: 16px;
        border-top-style: solid;
        border-top-color: #1ABC9C;
    }

    [slider] > div > [sign] > span {
        font-size: 12px;
        font-weight: 700;
        line-height: 28px;
    }


[slider]:hover > div > [sign] {
    opacity: 1;
}





