﻿body {
    background-color: #eff2f0;
    font-family: Almarai-Bold,"Helvetica Neue",Helvetica,Helvetica,Arial,sans-serif;
    
}
 @font-face 
{
font-family:"Almarai-Bold";
     src: url("/src/css/Arabic-font/Almarai/Almarai-Bold.ttf") format("truetype"),
         url("/src/css/Arabic-font/Almarai/Almarai-Bold.otf") format("otf"),
         url("/src/css/Arabic-font/Almarai/Almarai-Bold.eot") format("eot");
font-weight:normal;font-style:normal;
}
 .transition-animate {
     -webkit-transition: all 0.3s ease-in;
     -ms-transition: all 0.3s ease-in;
     -o-transition: all 0.3s ease-in;
     -moz-transition: all 0.3s ease-in;
     transition: all 0.3s ease-in;
 }
 .m-10 {
     margin: 10px
 }
 .m-b-20 {
     margin-bottom: 20px
 }
 .m-b-10 {
     margin-bottom: 10px !important
 }
 .m-t-10 {
     margin-top: 10px
 }
 .m-t-3 {
     margin-top: 3px
 }
 .m-t-20 {
     margin-top: 20px
 }
 .m-r-30 {
     margin-right: 30px
 }
 .m-b-4 {
     margin-bottom: 4px !important
 }
 .m-t-b-5 {
     margin:5px 0
 }
 .p-t-25 {
     padding-top:25px
 }
 .p-3-12 {
     padding: 3px 12px !important;
 }
 .p-0-20-16 {
     padding: 0 20px 16px
 }
 .p-t-0-imp {
     padding-top: 0 !important
 }
 @media (min-width: 601px) {
      .p-r-0 {
     padding-right: 0
 }
 }
 .text-left-i {
     text-align: left !important
 }
 .block {
     display: block;
 }
 .inline-block {
     display: inline-block
 }
 .width-100 {
     width: 100%
 }
 .overflow-auto {
     overflow: auto
 }
 .border-radius-8 {
     border-radius: 8px
 }
 .auto-width {
     width: auto !important
 }
 .height-25 {
     height: 25px
 }
 .max-height-223 {
     max-height: 223px;
     overflow-y: auto;
     overflow-x: hidden
 }
 .ddl {
     border-color: #f39c12;
     border-radius: 8px
 }
 .ddl:focus {
     outline: none
 }
 .no-border-radius {
     border-radius: 0 !important
 }

 /***********responsive table**************/
 @media screen and (max-width: 767px) {
     .table-responsive>.table>tbody>tr>td, .table-responsive>.table>tbody>tr>th, .table-responsive>.table>tfoot>tr>td, .table-responsive>.table>tfoot>tr>th, .table-responsive>.table>thead>tr>td, .table-responsive>.table>thead>tr>th {
         white-space: normal; 
}
 }

/*start admin edit style*/
.skin-purple .main-header .navbar {
    background-color: #90d1da;
}
.skin-purple .main-header .logo {
    background-color: #90d1da;
}
/*end admin edit style*/


.skin-purple .sidebar-menu>li:hover>a, .skin-purple .sidebar-menu>li.active>a {
    background: #90d1da;
    border-left-color: #90d1da;
}
.skin-purple .sidebar-menu > li > .treeview-menu {
    background: #90d1da;
}
.skin-purple .sidebar a {
    color: #656565;
}
.skin-purple .treeview-menu>li>a {
    color: #064763;
}
.skin-purple .sidebar-menu>li>.treeview-menu {
    margin: 0 0;
}
.skin-purple .user-panel>.info, .skin-purple .user-panel>.info>a {
    color: #525252;
}
.skin-purple .wrapper, .skin-purple .main-sidebar, .skin-purple .left-side {
    background-color:#fff;
}
.sidebar {
    padding-top: 15px;
}
.skin-yellow .main-header .logo {
    width: 100%
}
.main-header .logo {
    float: none
}
.main-header .navbar {
    margin-left: 0
}
.main-sidebar {
    top: 88px;
    padding-top: 0;
    min-height: 100%;
    max-height: 100%;
}
.user-panel {
    background-color: #f39c12
}
@media(min-width: 768px) {
    .sidebar-mini .content {
        margin-left: 230px;
        -webkit-transition: -webkit-transform .3s ease-in-out,width .3s ease-in-out;
        -moz-transition: -moz-transform .3s ease-in-out,width .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out,width .3s ease-in-out;
        transition: transform .3s ease-in-out,width .3s ease-in-out;
}
    .sidebar-collapse .content {
        margin-left: 0;
        -webkit-transition: -webkit-transform .3s ease-in-out,width .3s ease-in-out;
        -moz-transition: -moz-transform .3s ease-in-out,width .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out,width .3s ease-in-out;
        transition: transform .3s ease-in-out,width .3s ease-in-out;
    }
}

@media (max-width: 767px) {
    .skin-purple .main-header .logo {
    background-color: #67c3d0;
}

}

.content-wrapper, .right-side, .main-footer {
    margin-left: 0
}
@media (max-width: 767px) {
    .sidebar-open .content-wrapper, .sidebar-open .right-side, .sidebar-open .main-footer {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
}
}
@media(max-width: 500px) {
    .main-footer {
        font-size: 12px
    }
}
.main-sidebar {
    -ms-box-shadow: 1px 1px 3px #8d9c9e;
    -webkit-box-shadow: 1px 1px 3px #8d9c9e;
    box-shadow: 1px 1px 3px #8d9c9e;
}
a {
    color: #f39c12;
}
a:hover, a:active, a:focus {
    outline: none;
    text-decoration: none;
    color: #e08e0b;
}
.fa-style {
    color: #0e7abd;
     float: left;
      margin-top: 10px;
    margin-right: 5px;
    margin-left: 5px;
        width: 15px;
    height: 15px;
}
.margim-10 {
    margin: 10px
}
.box {
    background: #fef8e2;
    border-top: 3px solid #f39c12;
}
.box-header {
    background-color: #f9cd88;
    color: #039445
}
.input-group-btn {
    font-size: 14px
}
.btn.btn-default {
    padding: 6px 6px
}
.display-none {
    display: none
}
.bgcolor-med-orange {
    background-color: #f9cd88;
}
.dark-shadow:active, .dark-shadow:focus {
    box-shadow: 1px 1px 4px #ca9035 !important
}
.skin-yellow .main-header .navbar .nav>li>a:hover, .skin-yellow .main-header .navbar .nav>li>a:active, .skin-yellow .main-header .navbar .nav>li>a:focus, .skin-yellow .main-header .navbar .nav .open>a, .skin-yellow .main-header .navbar .nav .open>a:hover, .skin-yellow .main-header .navbar .nav .open>a:focus, .skin-yellow .main-header .navbar .nav>.active>a, .skin-yellow .main-header .navbar .sidebar-toggle:hover {
    background: #ffa800;
    border-radius: 15px;
}
.skin-yellow .main-header .logo {
    background-color: #ffffff;
    color: #00925c;
    border-bottom: 0 solid transparent;
}
.control-sidebar.control-sidebar-open, .control-sidebar.control-sidebar-open+.control-sidebar-bg {
    left: 0
}
.control-sidebar-bg, .control-sidebar {
        left: -230px;
}
.control-sidebar-bg, .control-sidebar {
    -webkit-transition: left .3s ease-in-out;
    -o-transition: left .3s ease-in-out;
    transition: left .3s ease-in-out;
}
.control-sidebar {
    padding-top: 100px
}
.skin-yellow .main-header .logo:hover {
    background-color: #ffffff;
}
.main-header .logo {
    height: 38px;
    line-height: 40px;
}                                
.skin-yellow .main-header .navbar .nav>li>a {
    margin: 3px
}

.main-header .sidebar-toggle {
    float: left;
    background-color: transparent;
    background-image: none;
    padding: 11px 15px;
    font-family: fontAwesome;
    margin: 3px;
}
.main-header .logo .logo-lg {
    display: inline-block
}
.float-right {
    float: right;
}
.market-language-btn.float-right {
    font-size: 13px
}
.market-language-btn .language-btn{
    color: #00925c;
}
/*********Shopping-master********/
/****Header*****/
.top-header {
    color: #ffa800;
    padding: 4px
}
.search-box {
    border: 2px solid #ffa800;
    -ms-border-radius: 25px;
    border-radius: 25px; 
    padding: 0 10px
}
.language-btn {
    color: #ffa800;
    font-family: Almarai-Bold;
}

.language-btn:hover {
    color: #dc8e00;
    text-decoration: underline
}
.search-box a {
    color: #ffa800;
    margin: 5px
}
.search-box input, .search-box input:focus{
    border: none;
    outline: none;
    width: 76%;
    background-color: transparent
}
@media (max-width: 380px) {
    .search-box input {
        width: 65%;
    }
}
.cart-item-count {
    display: inline-block;
    height: 24px;
    width: 24px;
    text-align: center;
    background-color: #fff;
    color: #5f9000;
    border-radius: 50%;
    line-height: 1.8
}
.master-cart i {
    font-size: 26px;
    color: #029241
}
.master-cart i:hover {
    font-size: 26px;
    color: #fff
}
.float-left {
    float: left
}
.bottom-header {
    padding: 4px;
    background-color: #ffa800;
}
.btn-white {
    background-color: #fff;
    border-radius: 25px;
    text-align: center;
    padding: 4px 10px;
    color: #ffa800;
    display: block;
    width: 162px
}

.text-green {
    color: #00925c !important
}
.content-wrapper {
    background-color: #fff
}
/*--cart--*/
.my-cart-b {
    background: none;
    text-decoration: none;
    color: #029241;
    font-size: 1em;
    border: 2px solid #029241;
    border-radius: 50px;
    /*padding: 0.5em 1em;*/
    outline: none;
}

.my-cart-b-white {
    background: none;
    text-decoration: none;
    color: #fff;
    font-size: 1em;
    border: 2px solid #fff;
    border-radius: 50px;
    /*padding: 0.5em 1em;*/
    outline: none;
    font-family: cursive;
    font-weight: bold;
    letter-spacing: 1.2px
}
a:focus {
    outline: thin dotted;
    outline: none;
    outline-offset: -2px;
}
.aspNetDisabled.btn.btn-warning {
    cursor: not-allowed
}
.aspNetDisabled.btn.btn-warning:hover {
   background-color:  #f39c12
}

.cart-table tbody tr td a {
    font-style: normal;
    text-decoration: none
}
.cart-table thead tr {
    background-color: #f9cd88;
    color: #00925c
}
.cart-table thead tr td {
    border: 1px solid #f4f4f4
}
.table.cart-table>tbody>tr>td {
    padding: 4px
}
.all-area-orders.cart-table tr td {
    border: none
}
.all-area-orders.cart-table>tbody>tr:nth-of-type(odd) {
    background-color: #fff;
}
.all-area-orders.cart-table>tbody>tr {
    border-bottom: 1px solid #ddd
}
/* Sweep To Bottom */
.my-cart-b{
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.my-cart-b:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #347900;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
    border-radius: 50px;
	border: 2px solid #347900;
}
.my-cart-b:hover, .my-cart-b:focus, .my-cart-b:active {
	color: white;
    background: none;
    border: 2px solid #347900;
    outline: none !important;
}
.my-cart-b:hover:before, .my-cart-b:focus:before, .my-cart-b:active:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}
.aspNetDisabled.my-cart-b {
    color: #7fad93;
    border: 2px solid #7fad93;
}
.aspNetDisabled.my-cart-b:before {
    background-color: #fff;
    border: 2px solid #fff;
        transform: none;
    -webkit-transform-origin: 50% 0;
    transform-origin: 0 0;
    
}
.aspNetDisabled.my-cart-b:hover {
    color: #7fad93;
    cursor: not-allowed;
        -webkit-transform: none;
    box-shadow: none;
    border: 2px solid #7fad93;

}
/*****market-name-section******/
.market-name-section {
    background-image: url(../img/header-img.jpg);
  background-color: #cccccc; /* Used if the image is unavailable */
  /*height: 100px;*/ /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
  padding: 19px 10px

}
.market-name-span {
    color: #fff;
    font-size: 4vw;
}
@media(max-width: 991px) {
    .btn {
        padding: 3px 6px;
        /*font-size: 0.85em*/
    }
    .market-name-section {
       height: 70px 
    }
}
@media(max-width: 767px) {
    .nav .dropdown.user.user-menu a {
    padding: 12px 20px !important;
    border-bottom: none
}
}

/*************Start Category menu************/
.multi-column-dropdown li {
    list-style-type: none;
    margin: 7px 0;
    
}
.multi-column-dropdown li a {
    color: #999 !important;
    -webkit-transition: all 0.3s ease-in;
     -ms-transition: all 0.3s ease-in;
     -o-transition: all 0.3s ease-in;
     -moz-transition: all 0.3s ease-in;
     transition: all 0.3s ease-in;
}
.multi-column-dropdown li a:hover {
    color: #000 !important;
    text-decoration: underline;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    background-color:#ffa800;
    color: #fff;
}
.nav > li > a {
    padding: 12px 20px  !important;
}
@media(max-width: 767px) {
    .nav > li > a {
        padding: 5px 14px !important;
        background-color: #fffadf;
        border-bottom: 2px solid #fff;
    }
    
}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border: none;
}
.navbar-default {
    background: none;
    border: none;
}
.navbar-collapse {
    padding: 0;
}
ul.multi-column-dropdown h6 {
    font-size: 1.5em;
    color: #000;
    margin: 0 0 1em;
    padding: 0.7em 0;
    border-bottom: 2px solid #62BF43;
    text-transform: capitalize;
    font-family: 'Glegoo', serif;
}

.dropdown-menu.multi {
    min-width: 745px;
    padding: 30px 30px;
}
 .nav .open > a:hover, .nav .open > a:focus {
    background: none;
    border: none;
}
 .nav .open > a {
    /*background: #fffadf;*/
    border: none;  
 }
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    background-color: transparent;
}
.navbar-default .navbar-nav > li > a:hover{
    color: #FFF;
    background-color: transparent;
}
.navbar-default .navbar-nav > li > a:focus {
    color: #333;
}
.navbar {
    min-height: auto;
    margin-bottom: 0px;
}
.dropdown-menu {
    top: 98%;
    left: -85%;
}
.multi1{
	left: -330%;
}
.row1 {
    padding-left: 0;
	padding-right:7px;
}
.row2{
	padding-right: 0;
	padding-left:7px;
}
.row-top {
    margin-top: 1em;
}

 .navbar-default .navbar-nav > .open > a:hover{
    color: #fff;
}
 .navbar-default .navbar-nav > .open > a:focus {
    color: #999;
}
span.fa.fa-shopping-cart.my-cart-icon {
    position: absolute !important;
    font-size: 1.5em;
    color: #039445;
}
.badge {
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height: 19px;
    padding: 0; 
    font-size: 10px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #ffa800;
    border-radius: 10px;
}

.multi1 {
    top: 98%;
    left: -129%;
}
.multi2 {
    top: 98%;
    left: -275%;
}



.hyper {
  margin: auto;
  padding: 0 50px;
  display: inline-block;
  position: relative;
  text-decoration: none;
  color: black;
  width: auto;
  overflow: hidden;
  z-index: 2;
  transition: all .5s ease;
}

.hyper span {
  z-index:2;
  position:relative;
}
.hyper:hover {
  color: white;
}
.hyper:hover:before {
  right: 95%;
    opacity: 1;
}
.hyper:hover:after {
	left: 5%;
    opacity: 1;
}
.hyper:before {
  opacity: 0;
  content: '';
  display: block;
  position: absolute; 
  background:#039445;
  width:4px;
  height: 100%;
  top: 0;
  right: 100%;
    transition:all .6s ease;
}
.hyper:after {
    opacity: 0;
  content: '';
  display: block;
  position: absolute; 
  background:#ffa800 ;
  width: 100%;
  height: 100%;
  top: 0;
  left: 100%;
    transition:all .5s ease;
}
.active a:before{
	opacity: 1;
	right: 97%;
}
.active1 a:before,.active1 a:hover:before{
	opacity: 1;
	right: 97%;
}
.active1 a:after ,.active1 a:hover:after{
	left: 3%;
    opacity: 1;
}


@media(max-width:767px) {
    /*.nav > li {
        
        display: block;
        height: 45px
    }

    .navbar-collapse {
        background: #fff;
    }

    .navbar-toggle {
        position: relative;
        float: left;
        padding: 9px 10px;
        margin-top: 0px;
        margin-right: 0px;
        margin-bottom: 0px;
        background-color: #ffa800;
        background-image: none;
        border: 1px solid #ffa800;
        border-radius: 0px;
    }

    .navbar-default .navbar-toggle .icon-bar {
        background-color: #FFF;
    }

    .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
        background-color: #ffa800;
    }

    nav.navbar.navbar-default {
        float: left;
        height: auto;
        width: 100%;
    }

    .navbar-collapse {
        max-height: none;
        background: #fff;
        overflow-x: hidden;
    }

    .dropdown-menu.multi {
        min-width: auto;
        padding: 0px;
        text-align: center;
    }

    ul.multi-column-dropdown {
        text-align: center;
    }

    .hyper:hover:before {
        right: 99.1%;
        opacity: 1;
    }

    .hyper:hover:after {
        left: 0.9%;
        opacity: 1;
    }

    .active a:before {
        opacity: 1;
        right: 99.1%;
    }

    .active a:after {
        left: 0.9%;
        opacity: 1;
    }

    .navbar-default .navbar-toggle {
        border-color: #ffa800;
    }

    .navbar-nav {
        margin: 1em 0 0;
    }

    .w3l img {
        width: 50%;
        margin: 2em auto;
    }

    .nav-top {
        margin-bottom: 1em;
    }

    .tabs li {
        display: inline-block;
    }*/



    .nav > li {
    float: none;
    display: block;
}
.navbar-collapse {
    background: #fff;
}

.navbar-toggle {
    position: relative;
    float: left;
    padding: 9px 10px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    background-color: #FAB005;
    background-image: none;
    border: 1px solid #FAB005;
    border-radius: 0px;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #FFF;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: #FAB005;
}
nav.navbar.navbar-default {
    float: left;
    height: auto;
    width: 100%;
}
.navbar-collapse {
    max-height: none;
    background: #fff;
	overflow-x: hidden;
}
.dropdown-menu.multi {
    min-width: auto;
    padding: 0px;
    text-align: center;
}
ul.multi-column-dropdown {
    text-align: center;
    padding: 0
}
.hyper:hover:before {
  right: 99.1%;
    opacity: 1;
}
.hyper:hover:after {
	left: 0.9%;
    opacity: 1;
}
.active a:before{
	opacity: 1;
	right: 99.1%;
}
.active a:after {
	left: 0.9%;
    opacity: 1;
}
.navbar-default .navbar-toggle {
    border-color: #FAB005;
}
.navbar-nav {
    margin: 1em 0 0;
}
.w3l img {
    width: 50%;
    margin: 2em auto;
}
.nav-top {
    margin-bottom: 1em;
}
.tabs li {
    display: inline-block;
}
.multi-column-dropdown li {
    background-color: #fffdf0;
}
.navbar-default .navbar-nav > .open {
        /*background-color: #fffadf*/
}
}

/*********my edit media collapsed menu*******/
@media (max-width: 767px) {
    /*.nav > li {
        display: inline-block;
    }*/
}
/*.nav>li>a {
  display: inline-block  
}*/
.my-collapsed-btn {
    margin: 8px 0;
    border-radius: 10px
}
.navbar-toggle .icon-bar {
    width: 15px    
}
.nav.navbar-nav {
    width: 100%;
    text-align: center
}


/*My Media*/

@media (min-width: 1400px) {
    .col-xl-1 {
        width: 8.33333333%;
    }
    .container {
    width: 75%;
}
}
@media (max-width: 767px) {
    .col-xs-my-4 {
        width: 33.33333333%;
        float:left
    }
}
@media(max-width: 500px) {
    .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
        padding: 4px;
    }
}

@media(max-width:600px) {
    .half-width {
        width: 50%
    }
}
@media(max-width:414px) {
    .full-width {
        width: 100%
    }
    .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
        padding: 3px;
    }
}

/*************End Category menu************/


/****start all category section*****/
.all-category-Section {
    background: #fff;
    padding-bottom: 30px

}
.shadow-category {

    background: #fff; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffe3ab 0%, #ffffff 84%, #ffffff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ffe3ab 0%,#ffffff 84%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ffe3ab 0%,#ffffff 84%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffe3ab', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
    width:100%;
    height:40px
}
@media (max-width: 767px) {
    .shadow-category {
        height: 10px
    }
}

/*start category title underline*/
.ser-t {
    text-align: center;
    margin: 0 auto;
    width: 20%;
    position: relative;
    margin-bottom: 25px
}
.ser-t b{
	width: 100%;
    height: 2px;
    display: block;
    background: #039445;
    margin-bottom: 3px;
}
.ser-t b.line{
	width: 80%;
	margin:0 auto;
}
.ser-t span{
	width: 40px;
    height: 40px;
    display: block;
    background: #fff;
    position: absolute;
    top: -7px;
    left: 42%;  
}
.ser-t  span i{
	width: 20px;height: 20px;
    display: block;
    border: 2px solid #039445;
    -webkit-transform: rotate(45deg) translate3d(0, 0, 0);
    -moz-transform: rotate(45deg) translate3d(0, 0, 0);
    -ms-transform: rotate(45deg) translate3d(0, 0, 0);
    -o-transform: rotate(45deg) translate3d(0, 0, 0);
    transform: rotate(45deg) translate3d(0, 0, 0);
    margin-left: 0.7em;
}
@media(max-width:600px) {
    .ser-t {
    width: 47%;
}
    .ser-t span {
    left: 39%;
}
}
@media(max-width:414px) {
    .ser-t {
        width: 64%;
    }

        .ser-t span i {
            width: 18px;
            height: 18px;
        }

        .ser-t span {
            width: 36px;
            height: 36px;
            left: 38%;
        }

    .ser-t {
        width: 64%;
    }
}
/*End category title underline*/
.block-item {
    margin-top:2% !important
}
.item-div {
    box-shadow: 0px 0px 4px #ffa800;
    border-radius: 20px;
    padding: 10px;
}


/*.item-img {
    height: 120px;
    margin: 0 auto;
    border-radius: 20px 20px 0 0
}*/
@media (max-width: 767px) {
    /*.item-img {
        height: 70px
    }*/
    .block-item {
    margin-top:4% !important
}
}
/*.item-name {
    color:#717171
}*/
.item-price {
    color: #909090
}
.inc-dec-area {
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.btn-inc-dec-div {
    width: 30%;
    /*float: left;*/
    /*height: 30px;*/
    /*background-color: #909090;*/
}
.btn-inc-dec-div:hover {
    /*background-color: #525252*/
    background-color: #ffd98f
}
.item-count-div {
    width: 40%;
    float: left;
    /*border: 1px solid #909090;*/
    /*height: 30px;*/
        line-height: 2;

}
 .item-count {

    /*color: #fff;*/
     color: #555;
    height: 15px;
    line-height: 1;
        padding: 8px 0;

 }

.caret.reflect {
        -webkit-transform: rotate(-180deg) translate3d(0, 0, 0);
    -moz-transform: rotate(-180deg) translate3d(0, 0, 0);
    -ms-transform: rotate(-180deg) translate3d(0, 0, 0);
    -o-transform: rotate(-180deg) translate3d(0, 0, 0);
    transform: rotate(-180deg) translate3d(0, 0, 0);
}

.show-more {
    text-decoration: underline;
    cursor: pointer;
}
.show-more:hover {
    text-decoration: underline;
    color: #dc8e00
}
/****End all category section*****/

/********Start Scroll to top**********/
.scroll-top {
    width: 33px;
    height: 33px;
    color: #fff;
    background-color: #ffa800;
    text-align: center;
    position: fixed;
    right: 15px;
    bottom: 10px;
    z-index: 2000;
    -ms-border-radius: 22px;
    border-radius: 22px;
    padding: 5px;
    -ms-box-shadow: 2px 2px 2px #ddd;
    -moz-box-shadow: 2px 2px 2px #ddd;
    -webkit-box-shadow: 2px 2px 2px #ddd;
    box-shadow: 2px 2px 2px #ddd;
    font-size: 17px;
    cursor: pointer;
    display: none;

}
.scroll-top:hover {
    background-color: #dc8e00;
    box-shadow: none
}
/********End Scroll to top**********/




/******pop-up**********/
/* start-pop-up*/

   /*.pop-up-overlay {
    height: auto;
    left: 0;
    min-height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 400;

}
   .pop-up-color-overlay {
    background: rgba(35, 34, 27, 0.85);
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
   }
 .pop-up-contant {
     overflow: auto;
	background: #fff;
    -ms-border-radius: 8px;
    -webkit-border-radius: 8px;
    -o-border-radius: 8px;
	border-radius: 8px;
  	margin-top: 160px;
	padding: 20px;
    -webkit-box-shadow: -4px 5px 16px rgb(0, 0, 0);
    -ms-box-shadow: -4px 5px 16px rgb(0, 0, 0);
    -o-box-shadow: -4px 5px 16px rgb(0, 0, 0);
    box-shadow: -4px 5px 16px rgb(0, 0, 0);
    position: relative;
    text-align: center;
}
.pop-up-elements {
    color : #1a1a1a;
    font-weight: 700;
    margin-top: 10px;
    z-index: 100;
    
}
.input-text-popup {
    background: #eeeeee !important;
    border: 2px solid #f7c70c !important;
    color: #797979 !important;
    width: 50%;
}*/


.popup {


        /*height: auto;
    left: 0;
    min-height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 400;*/



    position: absolute;     /*was fixed*/
    right: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    min-height: 100%;
    z-index: 9999;
    display: none;
    /*overflow-y: auto;*/
    display: block;
}
.pop-up-color-overlay {
    background-color: rgba(14, 10, 0, 0.88);
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
   }
.popup .inner-popup  {
       background-color: #fff;
       border: 1px solid #cccccc;
       width: 700px;
       left: 50%;
       position: absolute;            /*Was Absolute*/
       margin-left: -350px;   /*Half Width to make popup in center horizontaly*/
       top: 0;
       margin-top: 4%;      /*Half height text-align make popup in center verticaly*/
       border-radius: 5px;
    margin-bottom: 2%;
   }
@media (max-width: 767px) {
    .popup .inner-popup {
        width: 580px;
        margin-left: -290px; 
    }
   
}
@media(max-width:600px) {
    .popup .inner-popup {
    width: 400px;
    margin-left: -200px; 
}
    .show-more {
        font-size: 12px
    }

}
@media(max-width:414px) {
    .popup .inner-popup {
        width: 300px;
    margin-left: -150px; 
    }
}
@media(max-width: 767px ) and (min-width: 601px) {
      .popup .text-orange-border-thin {
        padding: 2px 3px;
        font-size: 13px
        }
      .popup .p-l-8 {
          padding-left: 8px
        }                           
}
.popup .box {
    border-top: none
}
@media(max-width: 601px) {
    .popup .text-orange-border-thin, .popup .order-price span{
        font-size: 12px;
    }
}

.modal-header {
    border-bottom: none;
    color: #ffa800;
    padding: 7px 15px;
}
.modal-body {
    padding: 0.5em 1em 0.3em;
    margin: 0.3em 1em;
    border: 1px solid #D0D0D0;
    /*max-height: 350px;*/
    max-height: 370px;
    overflow: auto;
    min-height: 60px;
}
@media(max-width: 414px) {
    .modal-body {
        padding: 3px;
        margin: 0
    }
}
.modal-footer {
    margin-top: 0px;
}
.modal-header .close span:hover {
    color: #ffa800
}
@media(max-width: 500px) {
    .btn.remove-btn, .close.remove-btn {
        padding: 1px 3px;
    font-size: 0.9em;
}
}


/*End popup*/

/*Start breadcrumb*/
.breadcrumb a:hover {
    text-decoration: underline
}
.breadcrumb {
    margin: 0
}
@media(max-width: 500px) {
    .breadcrumb {
        font-size: 10px
    }
}

/*End breadcrumb*/
/************Start all-area page*************/
.all-area-orders.width-33 th:first-child {
    width: 33%
}
.all-area-orders tr th {
    background-color: rgba(243, 156, 18, 0.5);
    color: #039445;
    border: 2px solid #f9f9f9;
}
.all-area-orders tr td {
    border: 2px solid #fff;
}
.all-area-orders tr td a {
    font-style: italic;
    text-decoration: underline;
    cursor: pointer;
}
.all-area-orders>tbody>tr:nth-of-type(odd) {
    background-color: #fef8e2
}
.table.all-area-orders>tbody>tr:nth-of-type(even) {
    background-color: #fff
}
.all-area-orders>tbody>.redtr {
    background-color: #ffc9d2 !important
}
/************End all-area page*************/

/************Start SpecificAreaOrders*************/
.input-group-btn:last-child>.dropdown-toggle.area-btn {
    border-radius: 6px 6px 6px 6px
}
.area-ddl {
    left: 0
}
.dropdown-menu.area-ddl>li>a:hover {
    background-color: rgba(243, 156, 18, 0.5);
}
.open>.dropdown-toggle.area-btn {
    border-color: #ec971f;
}
.btn-warning.area-btn:focus {
    border-color: #ec971f;
}
.text-area-orange {
    border: 2px solid #ec971f;
    border-radius: 5px;
    padding: 3px;
    width: 100%;
    display: block;
    min-height: 29px
}
.text-area-orange:focus {
    outline: none
}
@media (max-width: 991px) {
    .btn.area-btn {
        font-size: 14px
    }
}
/************End SpecificAreaOrders*************/
/********Start PrepareOrder*********/
/*.prepare-order-tbl .btn-inc-dec-div {
    width: 30%;

}
.prepare-order-tbl .item-count-div{
    width: 40%

}*/
.width-11p {
    width: 11%
}
.gray-btn {
    color: #909090
}
.gray-btn:hover {
    color: #333333
}
.fa-2x {
    font-size: 1.4em
}
.prepare-order-tbl img {
    width: 70px;
    height: 70px
}
.prepare-order-tbl {
    margin-bottom: 0
}
@media(max-width:550px) {
    .prepare-order-tbl {
        /*font-size: 2.4vw*/
        font-size: 2.7vw
        /*font-size:0.7em*/
    }
    .prepare-order-tbl img {
    width: 30px;
    height: 30px
}
}
.order-price {
    padding: 4px 10px;
    text-align: center;
    border: 2px solid #f9cd88;
    margin-bottom: 2px;
}
.orange-label {
    background-color: #f39c12;
    color: #fff;
} 
.prepare-order-btn-area {
    background-color: #f9cd88;
    padding: 5px;
}
.prepare-order-btn-area .my-cart-b {
    background-color: #fff;
    margin: 3px 8px
}
/********end PrepareOrder*********/
/********start items form********/
.text-orange-border-thin {
    border: 1px solid #ec971f !important; 
    border-radius: 5px;
    padding: 3px 7px;
}
.text-orange-border-thin:hover {
    border-color: #f39c12;
    box-shadow: 1px 1px 4px #f9cd88;
}
.text-orange-border-thin:focus {
    border-color: #f39c12 !important;
    box-shadow: 1px 1px 4px #f9cd88;
}
.aspNetDisabled.text-orange-border-thin:hover {
    box-shadow: none;
}
span.text-orange-border-thin, select.text-orange-border-thin, div.text-orange-border-thin {
        background-color: #fff4ca;
        box-shadow: none
}
span.text-orange-border-thin:hover, span.text-orange-border-thin:active, span.text-orange-border-thin:focus, div.text-orange-border-thin:hover, div.text-orange-border-thin:focus {
    box-shadow: none
}
.choose-file-area {
    padding: 6px 10px;
    background-color: #f7e4c6;
    /* margin-top: 7px; */
    border-radius: 5px;

}
input[type=file]:focus, input[type=checkbox]:focus, input[type=radio]:focus {
    outline: none
}
select option {
    background-color: #f7e4c6
}
.my-cart-b-orange {
    color: #f39c12;
    border: 2px solid #f39c12;
    background: #fff;
}
/********end items form********/
/*********start readyOrder form**********/
.blockorder {
    border-radius: 5px;
    background: #fef8e2;
    margin-top: 20px;
}
.blockorder-body {
    border: 2px solid #fef8e2;
}
.blockorder label {
    display: inline-block;
}
.blockorder span {
    display: inline-block
}
.blockorder-body div {
    padding: 5px 9px;
}
.blockorder-body div:nth-child(even) {
    background-color: #fff
}
.blockorder-header {
    background-color: rgb(249, 205, 136);
    color: #029241;
    border-radius: 5px 5px 0 0;
    padding: 10px
}
.blockorder {
        font-style: italic;
    cursor: pointer;
}
.ready-order-no-link {
color: #ffffff;
    font-weight: bolder;
    text-decoration: none;
    letter-spacing: 1px;
    text-shadow: 0px 0px 3px #4e3000;
    text-decoration: underline;
}
.ready-order-no-link:hover {
    color: #4e3000;
    text-shadow: 0px 0px 3px #fff;
    text-decoration: underline;
}
/*********end readyOrder form**********/

/***********Start InDeliverOrders***********/
.add-note-text-area {
    width: 100%;
    height: 200px;
    font-style: italic
}
/***********End InDeliverOrders***********/
/********start Items form**********/
.chk-box {
    display: inline-block;
    width: 25px;
    border: 1px solid #ddd;
    padding: 0 5px;
    background-color: #fff;
    border-radius: 5px;
    margin-right: 10px;
}
.added-sizes {
        border-radius: 8px;
    box-shadow: 1px 1px 5px #f9cd88 inset;
    padding: 10px;
        margin: 3px 0;
}
.btn.deactive-btn {
        background-color: #f8c97a;
    text-decoration: none;
    color: #fff;
    transition: all 0.5s ease-in;
    width: 90px;
}
.btn.active-btn {
    background-color: #f39c12;
    text-decoration: none;
    color: #fff;
    transition: all 0.07s ease-in;
    width: 90px
}
.btn.deactive-btn:hover, .btn.active-btn:hover {
        box-shadow: 2px 2px 2px #c37a06 inset;
}
.width-15p {
    width: 15%
}
@media(max-width: 500px) {
    .btn.deactive-btn {
        width: 60px;
        padding: 3px 2px;
        font-size: 2.6vw
    }
    .btn.active-btn {
        width: 60px;
        padding: 3px 2px;
        font-size: 2.6vw
    }
    .width-15p {
        width: 10%
    }
}
@media(max-width: 600px) {
    .table.item-tbl>tbody>tr>td {
    padding: 4px
}
}

/********end Items form**********/




/****start default shopping try choose size****/
/*.choose-size {
    background-color: #eee;
    border-radius: 5px;
    color: #333333;
    padding: 5px;
    margin-top: 10px
}
.div-choose-size {
    display: none;
    position: absolute;
    background-color: #fff4ca;
    border-radius: 9px;
    z-index: 500
}
.choose-size-block {
    display: block
}*/


    /************start default-shopping new design**************/
    .item-card-parent {
        display: flex;
        flex-flow: row wrap;
        justify-content: center;
    }
    .item-card {
        border-radius: 0 !important;
        background-color: #fff0b8;
        border-left: 4px solid;
        border-color: #347900;
        box-shadow: 1px 1px 1px #ddd;
        width: 250px;
        margin: 25px 14px;
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffa800+0,ffd583+8,ffffff+98 */
background: #ffa800; /* Old browsers */
background: -moz-linear-gradient(left,  #ffc14a 0%, #ffd583 8%, #ffffff 98%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #ffc14a 0%,#ffd583 8%,#ffffff 98%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #ffc14a 0%,#ffd583 8%,#ffffff 98%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa800', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
    }
    .items-img-container {
        width: 226px;
        height: 226px;
        overflow: hidden
    }
    .item-img {
        border-radius: 0;
        width: auto;
        height: 100%;
        max-height: 226px;
        /*max-width:226px*/
    }
    .item-name {
        color: #347900;
        font-weight: 800;
        background: #ffffffb8;
        padding: 6px;
    }
    button.text-orange-border-thin {
        background-color: #fff4ca;
        box-shadow: none;
    }
    .select-extra {
        height: 35px
    }
    .item-card-hr {
            border-top: 2px solid #347900;
    }
    .caret {
            border-top: 6px dashed;
    }
    .item-card-parent .dropdown-menu {
        min-width: 135px
    }
    /************End default-shopping new design**************/



    /***************Start default page*****************/ 
    .login-page {
        background-color: #000;
        background-image: url(/src/img/login-bg.jpg);
        background-position: top left;
        background-repeat: no-repeat;
        background-size: cover
    }
    .login-page .overlay {
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-color: rgba(14, 10, 0, 0.72);
        z-index: 2;
    }
    .login-page .login-box {
        position: relative;
        z-index: 5
    }
    .login-box-body {
        background: rgba(255, 223, 175, 0.42);
        border-radius: 34px;
    }
    .login-box-body .glyphicon {
        color: #ffa800
    }
    .sign-in-span{
        /*font-size: 30px;*/

        padding: 0 5px
    }
    .login-box-msg {
        margin: 0;
        text-align: left;
        padding: 9px 0;
        font-size: 18px;
    }
    .login-box-msg span {
        color: #ffa800;
    }
    .login-market-name {
        color: #ffa800
    }
    .login-logo {
        margin-bottom: 5px
    }
    .login-box-body .label-danger {
        background-color: transparent !important;
        color: #ff4444 !important;
        text-shadow: 1px 1px 2px #000000;
    }
    /***************End default page*****************/

    /*****start maincategory frm******/
/*.sub-div {
    border: 1px solid #ddd;
    padding: 10px 0;
    position: relative;
    border-radius: 25px;
    box-shadow: 1px 1px 3px #ddd;
         -webkit-transition: all 0.3s ease-in;
     -ms-transition: all 0.3s ease-in;
     -o-transition: all 0.3s ease-in;
     -moz-transition: all 0.3s ease-in;
     transition: all 0.3s ease-in;
}
.sub-div:hover {
    top: -5px
}*/

.item-card-sub-cat {
    padding: 5px
}
.items-img-container-sub-cat {
    position: relative;
    width: 236px;
    height:236px
}

    .backcolor-white {
        background: rgba(255,255,255,0.9);
    }

    .item-img-sub-cat {
        max-height: 236px
    }
    .caption {
        overflow: hidden;
        background: rgba(255, 227, 173, 0.74);;
        padding: 15px 10px;
        position: absolute;
        bottom: 0px;
        left: 0px;
        width: 100%;
    }
    /***************End default page*****************/ 