
@media only screen and (max-width: 480px ){
 @font-face{
font-family:'DroidNaskh-Bold';
src: url('DroidNaskh-Bold.ttf');
src: url('DroidNaskh-Bold.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

@font-face{
font-family:'DroidNaskh-Regular';
src: url('DroidNaskh-Regular.ttf');
src: url('DroidNaskh-Regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}



body {font: normal 100% DroidNaskh-Regular,tahoma,'trebuchet ms', sans-serif; 
 color: #747474;font-size:13px;margin:0;line-height: 150%;
 }


a {text-decoration:none;}
a:hover{color:#478fca;}
a:visited {color: #478fca;}
img {border-style:none;}
p{overflow: hidden;
  text-align:justify;
  }
  

   html, body {height: 100%;}
   
   
   
.GrayIMG{

  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */


filter: gray; /* IE6-9 */
 -webkit-filter: grayscale(1);

  }

.GrayIMG2{
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */

opacity: 0.4;
filter: alpha(opacity=40); /* For IE8 and earlier */

filter: gray; /* IE6-9 */
 -webkit-filter: grayscale(1)  brightness(100%);

  }

  
  .GrayIMG:hover{
filter: none;
 -webkit-filter: grayscale(0);
  }

 .GrayIMG2:hover{
opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */

filter: none;
 -webkit-filter: grayscale(0);
 filter: none;
  }
  
.button{
    background-color: #cccccc;
	background: #cccccc url(enter_.png) 14px 9px no-repeat;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
	-webkit-appearance: none;
    border-radius:6px;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    border:none;
	width:134px;
	height:27px;
	margin-top:0px;
	font: normal 100% DroidNaskh-Regular,tahoma,'trebuchet ms', sans-serif;
}



.button:hover {
    border: none;
    box-shadow: 0px 0px 1px #777;
	background-color: #AD1417;
}

#whole_container_upper
{
width:100%;
margin: auto;
padding: 0;
background-color:#ffffff;
}

#whole_container
{
width:100%;
margin: auto;
padding: 0px;
text-align:center;
padding:0;
border-bottom-style:solid;
border-bottom-width:7px;
border-bottom-color: #AD1417;
background-color:#f8f8f8;
z-index:-2;

}




#header{
width:100%;
margin: auto;
}
.clearer{width: 100%; clear: both;line-height:0px;}

.clear_1{clear:both;width:100%;height:1px;line-height:0px;}
.clear_5{clear:both;height:5px;line-height:0px;}
.clear_7{clear:both;height:7px;line-height:0px;}
.clear_12{clear:both;height:12px;line-height:0px;}


#header .lang{display:none;}

#header .lang_mob_0{padding-top:5px;margin-bottom:10px;width:100%;height:40px;background-color:#488ec9;line-height:300%;font-size:12px;color:white;}
#header .lang_mob_0 img{float:left;margin-left:5px;}
#header .lang_mob_0 a .group_link{margin-left:2px;float:left;font-size:15px;color:white;}
#header .lang_mob_0 .group_title{margin-right:10px;float:right;font-size:12px;color:white;}



#header .logo{width:100%;margin:auto;text-align:center;}
#header .logo a img{}

#header .men{width:100%; height:85px;margin:auto;}
ul#menu
{
margin:auto;
padding-left:0px;
float:right;
}

ul#menu li
{
float:left;
border:none;
text-align:right;
  list-style: none;
width:49%;
  height: 25px;
 
  }

ul#menu li a
{ font: normal 100% DroidNaskh-Regular,tahoma,'trebuchet ms', sans-serif;
  display: block;  
  margin: 3px 3px 3px 3px;
 
  text-align: center;
  color: #FFF;
  text-decoration: none;
  color:#747474;
  
  
} 





ul#menu li.selected a
{
color: #AD1417;
}


ul#menu li a:hover{
color: #AD1417;
}


ul#menu li.last_one{
display:none;
}


#slider11{
width:100%;
margin-top:10px;


}
#slider #img{width:100%,height:100%;}
.relative{ 
position:relative;
}

 #slider11 .img_top {
 position:absolute;
 top:0;
 height:6px;
 width:100%;
 background-image:url('top_slider.png');
 background-repeat: repeat-x;
 
}

.slider_colored{
height:290px;
margin-top:-11px;
padding-right:5%; 
padding-left:5%; 
padding-top:0px;
padding-bottom:1px;
 background-color:#4A8BC1;
 color:#fff;
 opacity:1;
 
}

.slider_colored p{
direction:rtl;
line-height:normal;
height:170px;
overflow:hidden;
}

#MYcontainer{
width:90%;
margin: auto;
color:#888888;
direction:rtl;
margin-top:20px;
}

#MYcontainer #left_container{
width:328px;
margin:auto;
text-align:center;
height:auto;
height:600px;
margin-bottom:20px;
margin-top:20px;
}

#MYcontainer #left_container #group_left{
width:328px;
height:290px;
margin: auto;
margin-left:15px;
margin-right: 15px;
float:right;
overflow:hidden;

}
#MYcontainer #left_container #group_left #title{
margin-top:30px;
text-align:right;
font-size:15px;
width:100%;
float:right;
color:#555555;
}
#MYcontainer #left_container #group_left #logo{
display:none;
margin-top:20px;
float:left;
margin-left:18px;
}

#MYcontainer #left_container #group_left .img1{
width:190px;
height:120px;
float:right;
padding: 0;
overflow:hidden;
}

#MYcontainer #left_container #group_left .img1 img{
min-width:190px;
min-height:120px;

}


#MYcontainer #left_container #group_left .img3{
width:300px;
height:280px;
float:right;
padding: 0;
overflow:hidden;
}
#MYcontainer #left_container #group_left .img3 img{
min-width:300px;
min-height:280px;

}


#MYcontainer #left_container #group_left .img2{
display:none;
float:left;
width:90px;
height:80px;
overflow:hidden;
}

#MYcontainer #left_container #group_left .img2 img{
min-width:90px;
min-height:80px;

}


#MYcontainer #left_container #group_left:hover img{
filter: none;
 -webkit-filter: grayscale(0);

}

#MYcontainer #left_container #group_left #read_item_mob_0{
width:102px;
height:120px;
background-color:#ebebeb;
float:left;
margin-left:25px;

}
#MYcontainer #left_container #group_left #read_item_mob_0 img{
margin-top:31px;
}
#MYcontainer #left_container #group_left #read_item_mob_0:hover{
background-color:#cecccc;
}



#MYcontainer #left_container #group_left #datee{
float:right;
text-align:right;
direction:rtl;
color: #AD1417;
width:100%;
height:20px;
overflow:hidden;
}
#MYcontainer #left_container #group_left p{
margin-top:3px;
margin-bottom:0px;
float:right;
height:77px;
width:300px;
direction:rtl;
font-size: 12px;
line-height:160%;
}

#MYcontainer #left_container #group_left #read_item{
display:none;
margin-top:0px;
float:left;
text-align:left;
margin-left:15px;

}
#MYcontainer #group_right{

width:99%;
width:328px;
margin:auto;
text-align:center;
}

#MYcontainer #group_right #delivery_agents_container{
margin:auto;
width:236px;
height:146px;
margin-top:32px;
}

#MYcontainer #group_right #delivery_agents_container #delivery_agents{
width:236px;
height:126px;
margin-right:1px;
float:left;
position:relative;
}

#MYcontainer #group_right #delivery_agents_container #delivery_agents a img{

}

#MYcontainer #group_right #delivery_agents_container #delivery_agents p{
font-size:18px;
position:absolute;
width:55px;
height:55px;
float:left;
left:18px;
text-align:center;
top:30px;
z-index:2;
color:#fff;
padding-top:4px;
line-height:150%;
}

#MYcontainer #group_right #offers
{
margin:auto;
margin-top:24px;
width:100%;
height:92px;
text-align:center;
}

#MYcontainer #group_right #offers img{
margin-top:10px;
}


#MYcontainer #group_right  #item{
margin:auto;
margin-top:20px;
width:134px;
height:263px;

}
#MYcontainer #group_right #item:hover img{
filter: none;
opacity: 1;
filter: alpha(opacity=100);
 -webkit-filter: grayscale(0);
}
#MYcontainer #group_right #item:hover .strip {
filter: none;
opacity: 1;
filter: alpha(opacity=100);
 -webkit-filter: grayscale(0);
}

#MYcontainer #group_right  #item .img1{
width:134px;
height:77px;
overflow:hidden;
}

#MYcontainer #group_right  #item .img1 img{
min-width:134px;
min-height:77px;
}


#MYcontainer #group_right  #item .strip{
margin-top:10px;
width:100%;
height:5px;
background-color:#AD1417;
float:left;
}


#MYcontainer #group_right  #item .title{
margin-top:21px;
float:right;
color: #AD1417;
height:20px;
overflow:hidden;

}

#MYcontainer #group_right  #item p{
margin-top:1px;
margin-bottom:10px;
float:right;
height:94px;
font-size: 12px;
line-height:160%;
}








#footer{
width:100%;
margin: auto;
text-align:center;
min-height:110px;
margin-top:50px;
text-align:center;
}
 #footer  .bottom_menu {
margin:auto;
padding:auto;
width:240px;
min-height:20px;
 }
 #footer  .bottom_menu ul{
 
margin:auto;
}
#footer  .bottom_menu li {
 height:15px;
width:80px;
}

 #footer  .bottom_menu li a{
 font-size:10px;
 height:15px; margin:0 4px 0 4px;
}

#footer .social_media{

width:180px;
margin:auto;
margin-bottom:55px;
}

#footer .social_media img{
margin-top:10px;
height:37px;
margin-left:7px;
float:left;
}

#footer .cr{
clear:both;
width:100%;
text-align:center ;
margin:auto;
direction:rtl;
height:10px;
margin-top:1px;

font-size:10px;
}








#flooting_menu{
line-height: 1.1;
position:absolute;
margin:auto;
margin-top:10px;
z-index:10;
width:100%px;
height:100px;
display:none;

}
#flooting_menu .flooting_menu_item{
position:relative;
float:left;
width:100px;
height:100px;
background:#717773;
color:#fff;
text-align:center;
cursor: pointer;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
    filter: alpha(opacity=80);
    -khtml-opacity: 0.80;
    -moz-opacity: 0.80;
    opacity: 0.80;
	
}
#flooting_menu .flooting_menu_item:hover{
cursor: pointer;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
    filter: alpha(opacity=60);
    -khtml-opacity: 0.60;
    -moz-opacity: 0.60;
    opacity: 0.60;
}

#flooting_menu .flooting_menu_item a{
color:#fff;
margin-top:-10px;
text-align:center;
}
#flooting_menu .flooting_menu_item img{
color:#fff;
margin-top:20px;
}
#flooting_menu .flooting_menu_item p{
text-align:center;
margin:0;
}









}





