/* CSS Document */
input,button,select,textarea{outline:none}
 *:focus { outline: none; }

img {max-width:100%;height: auto;}
.editor a {word-wrap: break-word;word-break: break-all;}
.table_scroll{overflow-x: auto; display: block;}
.datatable { width:100%; border-spacing:1px; background:#ededed;}
.datatable th { text-align:center; font-size:16px; padding:12px 3px; font-weight:normal;}
.datatable td { text-align:center; background:#fff; font-size:14px; padding:12px 3px;}

.NavSubmenu a{text-align: left; padding:0 5px;}
.NavSubmenu img{width: 30px; margin:0 0 0 5px ; display: inline-block;vertical-align:middle;}
.NavSubmenu span{display: inline-block; /*width: calc(100% - 44px); */vertical-align: middle;}

header { height:110px;}
.header-top { height:30px; background:#125800; position:relative;text-align: right;}
.header-bottom { height:80px; background:#edf7de; position:relative;}
.logo { position:absolute; top:0px; right:0px; z-index:100;}
/* --------------------------------------------
      6.2. Search Box
  -------------------------------------------- */

    .search_box{
      position: absolute;
      /*z-index:1000;*/
      right: 0;
      top: 0;
      height: 100%;
      width: 64px;
      -webkit-transition: all 0.5s;
      -o-transition: all 0.5s;
      transition: all 0.5s;
    }

    .search_box input:not([type="radio"]):not([type="checkbox"]):not([type="file"]){
      width: calc(100% - 460px); height:30px;
      outline: none;
      border: none;
      background-color:#edf7de;
      font: 300 16px/20px 'Lato',sans-serif;
      padding: 0px 20px 0px 20px;
      color:#3c9227 ;
      opacity: 0; visibility:hidden;
      -webkit-transition: all 0.5s;
      -o-transition: all 0.5s;
      transition: all 0.5s;
      border-bottom: 1px solid #125800;
      direction: rtl ;    
    }

    .search_btn{
      outline: none;
      border: none;
      background: none;
      position: absolute;
      width: 20px;
      height: 30px;
      top: 16px;
      margin-top: -10px;
      right: 1400px;
      color: #fff; cursor:pointer;
    }
	.search_btn:hover:before {opacity:0.7;  filter: alpha(opacity=70);}

    .search_btn:before{
      content: "\f002"; color:#fff;
      font: normal normal normal 17px FontAwesome;
      display: block;
      width: 100%;
      height: 100%;
    }

    .search_box.active .search_btn:before{
      content: "\f00d";
      color: #125800;
    }

    .search_box.active{
      width: 100%;
    }

    .search_box.active input:not([type="radio"]):not([type="checkbox"]):not([type="file"]){
      opacity: 1; visibility:visible;
    }
nav { padding:35px 15px 0 0;}
.menuzord-menu > li:first-child { position:absolute; z-index:999; border-right:1px solid #fff; left:0px; top:-57px; line-height:15px; padding-right:10px;}
.lang a { display:inline-block; color:#fff; font-size:13px; padding:0 10px;}
.lang a:hover { color:#e9f07d;}
#vie{
background: url(../images/vietnam.png) no-repeat center left;
padding-left: 45px;
display: none;
}
.prod_side_vie{
background: url(../images/vietnam.png) no-repeat 150px 4px #3c9227;
padding: 4px 60px 4px 40px;
color: #fff;
display: inline-block;
text-align: left;
margin-bottom: 8px;
border-radius: 2px;
transition: all .4s;
min-height: 38px;    
}
.prod_side_vie:hover {
  box-shadow: 0 2px 12px rgba(0,0,0,.2);
  background: url(../images/vietnam.png) no-repeat 10px 13px #327921;
  color: #fff;
}

.menuzord-menu>li>a:after { display:block; content:""; width:20px; height:2px; background:#d6dfc8; margin-top:8px;
-webkit-transition: all 0.2s ease-out 0s;
-moz-transition: all 0.2s ease-out 0s;
transition: all 0.2s ease-out 0s;}
.menuzord-menu>li>a:hover:after { background:#156d00; width:40px;}


nav ol{display: none; background-color: rgba(255,255,255,0.9); position: absolute; right: -450%; transform: translate(30%); width:900px; z-index: 1111; border-bottom: 3px solid #3c9227; text-align: right;}
nav ul{position: relative;}
nav ol li{display: inline-flex;}
nav ol li{text-align: center; width:30%; padding: 8px 0px; position: relative; height: 45px;


}

nav ol a{ position: absolute; width: 100%; left: 50%; transform: translate(-50% , -50%); top: 50%;}
nav ol li a{
flex-direction: row; display: inline-flex;align-items: center;
}
nav ol li:hover{background-color: #125800;}
nav ol li:hover a{ color: #fff;}
nav ol li:hover span{color: #fff;}
.classLink { display:none ;}

@media only screen and (max-width: 1280px) {
nav ol {
        width: 700px;
        right: 30%;
    }

}

@media only screen and (max-width: 980px) {
nav { padding:15px 0 0 0;}
.showhide:before { content:"قائمة طعام"; display:block; position:absolute; right:16px; bottom:-20px; text-align:right; font-size:12px; color:#3b3b3b; width:50px;}
.menuzord-menu > li:nth-of-type(1) { top:auto; right:auto; background:none !important; position:inherit; line-height:100%; padding:10px 0 !important; text-align:left; border-right-width:0; border-bottom:solid 1px rgba(0,0,0,.1);}
.menuzord-menu>li>a:after { display:none;}
.lang span { display:none !important;}
.lang a { color:#3b3b3b; font-size:16px;}
.lang a:hover { color:#3b3b3b;}

nav ol{position:inherit; right: inherit; transform:inherit; display: none; width: 100%; background-color: transparent; max-height: 280px; overflow: auto;}
nav ol li{width:100%; text-align: left; padding: 0 5px 0 10px;}
nav ol a{padding: 0 5px 0 10px; width: calc(100% - 15px);}
nav li.NavSubmenu > a{pointer-events:none;}
nav li i{position: absolute; right: 20px; font-size: 20px; top: 15px;}
.search_box input:not([type="radio"]):not([type="checkbox"]):not([type="file"]){
     width:100%;
     }
.search_btn{
     right: 25px;  
     }
#vie{
    margin-top: 15px;
    margin-left: 10px;
    background-position: center left;
    padding-top: 3px;
}
.prod_side_vie{
    margin-top: 15px;
    padding-top: 3px;
    display: block;
    min-height: 51px;
    font-size: 15px;
}

}
@media screen and (min-width: 980px) {
    nav ol{display: none !IMPORTANT; top: 32px;}
    nav ul li:hover ol ,nav ol:hover{display: inline-block !IMPORTANT;}
    nav ul li:hover ol.classLink ,nav ol.classLink:hover{display: none !IMPORTANT;}
    nav li i{display: none !IMPORTANT;}
  
    

}
@media only screen and (max-width: 768px) {

}
@media only screen and (max-width: 640px) {
.search_btn{right: 0;}
}
@media only screen and (max-width: 570px) {
.search_btn{right: 0;}
}

@media only screen and (max-width: 414px) {

}

@media only screen and (max-width: 320px) {

}