@charset "utf-8";
/* CSS Document */

@charset "utf-8";
*{margin:0;padding:0}
html{overflow-y:scroll}
@font-face{font-family:'yekan';src:url(fonts/yekan.eot?#) format("eot"),url(fonts/yekan.woff) format("woff"),url(fonts/yekan.ttf) format("truetype")}
body{font-size:14px;color:#666;font-family:'yekan' !important;text-align:center;-webkit-font-smoothing:antialiased;}
span{color:#f33;font-size:13px}
span.white{color:#FFF; font-size:13px}
span.price{color:#42A0FF; font-size:14px}
span.red{color:#F33; font-size:13px; text-decoration:line-through}
#faq{position:fixed; bottom:15px; right:2%; width:50px; height:120px}
#faq table{border:0; padding:0; margin-top:0}
#faq image{width:auto; height:auto}
form{direction:rtl}
ul{list-style:none}
h1{font-size:14px;direction:rtl;color:#d40025;text-align:right;margin:5px 2%}
.hgray{color:#E0E0E0}
.pnorm{color:#E2E2E2; font-size:11px}
#ulblack{width:100%;  color:#333; border-bottom:1px solid #EDEDED; font-size:12px}
.newsul{list-style:disc}
.newsul li{border-bottom:1px dotted #CCC; color:#999; padding:3px 1%}
a.dgray:link, a.dgray:visited{width:100%; font-size:11px; width:100%; text-decoration:none; color:#666;}
#construction_whatsapp{display:none}


a.dgray:hover{color:#F8BC07;}
h2{font-size:14px;direction:rtl;color:#00699B;text-align:right;margin:10px 2%}
.redliner{width:100%; padding:1px; text-align:center; color:#FFF; font-size:12px; background:#d40025}
h3{font-size:11px;direction:rtl;color:#444;text-align:right;margin:10px 2%}
p{direction:rtl;text-align:justify;padding:0 2%; font-size:11px}
.wide{width:100%}
.online{width:30.5%; float:left; border:1px solid #B5B5B5; line-height:21px; padding:5px 1% 10px 1%}
.online img{width:100%; height:180px}
.sidebar{width:99%;height:35px;background:#5a5a5a;text-align:center;color:#FFF;font-size:11px;margin-top:3px; max-width:1280px; margin:auto; padding:10px 15px !important; border-radius:5px; text-align:right}
.sidelab{width:99%;height:auto;max-height:1000px;overflow:hidden;margin-top:7px;background:#FFF}
.sidesample{width:99%;height:auto;overflow:hidden;margin-top:7px}
a{color:#000;text-decoration:none;font-size:13px}
a.blink:link,a.blink:visited{color:#333;text-decoration:none}
a.blink:hover{color:#F33}
a.blue:link,a.blue:visited{color:#0080FF;text-decoration:none; font-size:13px}
a.blue:hover{color:#333}
a.gray:link,a.blue:visited{color:#777 !important;text-decoration:none; font-size:12px !important}
a.gray:hover{color:#F33}

#justshow{margin:auto}
#res_theone {
    display: none
}
#res_footer {
    display: none
}

#res_topper {
    display: none
}

#res_oll {
    display: none
}


.lightgray{width:95%; max-width:1200px; margin:auto; background:#D9D9D9; height:30px; margin:10px auto 30px auto; text-align:right; padding:5 px 20px}

.theprofive{width:21%; min-width:160px; height:380px; border:1px solid #D8D8D8; float:left; margin:15px 20px;}

.theprofive img{width:100%; height:140px;}

.thecertificate{width:20%; float:left; height:auto; min-height:280px; background:#EDEDED; margin:15px 2.5%}
.thecertificate img{width:90%; margin:5px auto}
.thevideo{width:45%; float:left; height:auto; min-height:380px; background:#EDEDED; margin:15px 2.5%}

a.theprofive:link,a.theprofive:visited{text-decoration:none;}

a.theprofive:hover{border:1px solid #F90}

a.theprofive div{width:100%;}

a.theprofive p{padding:0 5px; font-size:10px; text-align:right; color:#666;}

.myicons{width:16%; float:left; margin:20px 2%}
.myicons img{width:100%; height:auto};
a.compblue:link,a.compblue:visited{text-decoration:none;color:#4F4F4F; }
a.compblue div{width:20%; margin:30px 2% 0 2%; height:auto; overflow:hidden;  float:left; font-family:'yekan'  }
a.compblue img{border-radius:50%; padding:2px; width:100% !important}
a.compblue img:hover{
  transition: .5s ease;
  border:11px solid #CCC;}
a.compblue div:hover div{background:#FFF;}

.profive{width:18%; min-height:400px; border:1px solid #D8D8D8; float:left; margin:15px 1.5%; height:auto; direction:ltr !important}

.profive img{width:100%; height:140px;}



a.profive:link,a.profive:visited{text-decoration:none;}

a.profive:hover{border:1px solid #F90}

a.profive div{width:100%; direction:ltr !important}

a.profive p{padding:0 5px; font-size:10px; text-align:right; color:#666; direction:ltr !important}

#fixtop{width:100% !important; height:auto;  margin:0 auto auto auto; background:#FFF; z-index:1000 !important;}
#filler{width:100%; height:auto; min-height:180px}
#topblue{height:30px; background:#d40025; width:100% !important;}
.content{width:98%; max-width:1280px; height:auto; overflow:hidden; margin:5px auto}
.thecontent{width:98%; max-width:1280px; height:auto; overflow:hidden; margin:5px auto}
#topsearch{width:20%; float:left; margin:20px 0;}
#topsocial{width:25%; float:left; margin:18px 20px;}
#topsocial ul{list-style:none}
#topsocial li{display:inline; padding:2px 1%}
#topsocial img{width:auto; max-width:90%;}
#toplogo{width:35%; float:right}
#toplogo img{width:auto; max-width:100%; height:auto; float:right}

#postform{border: 1px #666 solid;
    border-radius: 25px; background:#EDEDED; padding-right:25px;padding-bottom:6px;padding-top:6px;border:0;color:#333;font-family:Tahoma; width:95%; max-width:300px;}
	
.main{width:100% !important; height:40px; background:#EDEDED}	
	
.halflefti{width:45%; float:left; color:#666 !important}
.halfrighti{width:45%; float:right}
	
.marger{width:100%; height:auto; margin:35px 0; overflow:hidden}
#leftyellow{width:56%; height:auto; overflow:hidden; padding:20px 2%; background:#d40025; min-height:150px; float:left}
#lypic{width:15%; float:right; min-width:220px; background:#FFF; min-height:100px; height:auto; overflow:hidden; padding:10px 1% 0 1%; box-shadow: 3px 3px #CCC;}
#lypic img{width:100%; height:auto}
#lytext{color:#333; width:37%; min-width:300px; float:right; margin-right:2%; max-width:380px; font-size:11px; text-align:right;}

#righttoit{width:39%; float:right; padding:15px 0; min-height:150px;  border-right:15px solid #000}
#toitcontent{color:#333; width:50%; min-width:260px; float:left; max-width:350px; font-size:11px; text-align:right;}	


#topper {
    width: 100%;
    height: 60px;
    background:url(footer.jpg) repeat
}
#mobmap{display:none;}
#descmap{width:37%; float:left; min-width:300px; padding:30px 3%;}
#topmiddle {
	width:100%;
	max-width:1280px;
    height: 60px;
    margin: auto;
}
#pclogo{width:25%; float:left; max-width:260px;}
#pclogo img{width:100%; height:auto}
#toplinks{width:60%; float:left; margin-left:7%}
#topcard{width:7%; float:right; height:60px; background:url(blackcart.png); color:#FFF; line-height:12px}
.topinline{list-style:none; width:94%; margin:1px auto}
.topinline li{display:inline; padding:0 2%; border-right:1px solid #444}
.in-line{list-style:none; width:94%; margin:15px auto}
.in-line li{display:inline; padding:4px 3%}
a.red:link,
a.red:visited {
    color:#F33;
    font-size: 12px;
    text-decoration: none
}

a.red:hover {
    color: #000
}
a.cartnum:link,a.cartnum:visited{color:#FFF; padding:20px 20px; border-radius:2px; margin-top:5px; font-family:Arial; font-size:16px}
a.cartnum:hover{color:#000;}
#redundent {
    width: 90%;
    max-width: 940px;
    margin: auto;
    height: auto;

    margin-top: 10px;
	padding-bottom:10px;
	border-bottom:1px solid #E1E1E1
}
.catlog {
    width: 17%;
    margin-left: 1.5%;
    float: left
}

.catlog img {
    width: 100%;
    height: auto
}
a.white:link,
a.white:visited {
    color: #FCFCFC;
    font-size: 12px;
    text-decoration: none; font-family:'yekan';
}

a.white:hover {
    color: #F33
}
.therestable{width:60%; float:left; min-width:350px; padding:30px 0;}
#newsfeed {
    width: 92%;
    height: auto;
    background-color: #FFF;
    box-shadow: 0px 5px 5px #CCC;
    max-width: 1080px;
    margin:15px auto;
    border: 1px solid #CCC;
    border-radius: 6px;
    direction: rtl;
    padding: 6px 2%;
	text-align:right
}
#middlered{width:60%; float:left; background:#d4494c; height:auto; overflow:hidden; min-height:100px; margin:20px 1%; padding:15px 2%}
#midlefti{width:67%; padding-right:2%; border-right:1px solid #EDEDED; color:#FFF; float:left}
#midrighti{widows:30%; float:right; color:#FFF}
#midrighti li{text-align:right}
#thelate{width:34%; float:right; margin-top:8px}
#specification{width:96%; margin:auto;}
#specification td{padding:4px 3px; font-size:14px; color:#0078B3; border-bottom:1px solid #EDEDED; text-align:right}

.thebox{width:28.5%; float:left; min-width:80px; max-width:120px !important; background:#FFF; border:1px solid #CCC; height:100px; margin:5px 1.5%; padding:5px 2%; border-radius:5px; line-height:16px}
.thebox img{width:100%; height:auto; max-height:130px;}

a.thebox:link, a.thebox:visited{color:#666; text-decoration:none; font-family:tahoma; font-size:10px}
a.thebox:hover{border:1px solid #f33; color:#f33;}


.fourbox{width:23%; float:left; min-width:140px; max-width:185px; background:#FFF; min-height:100px; margin:5px 1.5%;}
.fourbox img{width:100%; height:auto; max-height:130px;}

a.forbox:link, a.forbox:visited{color:#666; text-decoration:none; font-family:tahoma;}
a.fourbox:hover{ color:#f33; background:#EDEDED}

#comfooter{width:100%; height:auto; overflow:hidden;  background:#313131; padding:10px 0; background:url(footer.jpg) repeat}
#afooter{width:100%; height:auto; overflow:hidden; max-width:1280px; margin:auto;}
#afooter ul{list-style:none;}
#afooter li{text-align:right; padding:2px 2%; border-bottom:1px dotted #999; color:#CCC;}
#bfooter{width:100%; color:#fdc606; text-align:center; padding:4px 0; max-width:1280px; margin:auto; font-family:Arial;}
.justcontent{width:96%; max-width:1280px; padding:5px 0; margin:auto; font-family:'yekan'; color:#CCC}
.contactinfo{text-align:left; color:#f33; font-size:13px !important;  line-height:28px !important; font-family:'yekan';}
.imainfour{width:20%; float:left; margin:15px 0 25px 1%; line-height:27px}
.imainfour p{font-family:Tahoma; line-height:28px}
.tmainfour{width:29%; float:right; margin:15px 0 25px 2%;}

a.pgray:link , a.pgray:visited{color:#CCC; text-decoration:none; font-size:11px;}
a.pgray:hover{color:#FFF;}

#organic{width:100%; margin:auto; max-width:1280px; overflow:hidden; border-bottom:5px solid #CCC}
#footorganic{display:none}



.widediv{width:100%; height:auto; overflow:hidden}
#brands{width:100%; max-width:1280px; margin:5px auto; min-height:120px; padding:10px; background:#EDEDED; height:auto; overflow:hidden}
.eachbrand{width:14%; float:left; margin:5px 1%; border-radius:15px}
.eachbrand img{width:100%; height:auto}
.divall{width:98%;margin:auto;max-width:1280px;overflow:hidden; position:relative !important}
.divspace{width:98%;margin:40px auto;max-width:1280px;overflow:hidden; position:relative !important; font-size:50px; font-family:Arial}
.enggray{font-family:Arial; color:#A3A3A3; font-size:50px}
.engred{font-family:Arial; color:#F33; font-size:50px}

#ulinline{width:98%;margin:auto;max-width:1280px;overflow:hidden; position:relative !important}
#ulinline ul{list-style:none}
#ulinline li{display:inline; padding:2px 1%}
.redbon{width:96%; padding:5px 2%; text-align:right; color:#F33; background:#333; margin:10px auto; border-radius:4px}
#thesort {
    width: 100%;
    max-width: 1000px;
    margin: auto;
    height: auto;
    overflow:hidden
}

.the-resizer {
    width: 95%;
    height: auto;
}
#per_pro {
    width: 180px;
    height: 330px;
    float: left;
    border: 1px solid #999;
    margin: 5px 8px;
    text-align: center;
    direction: ltr;
    line-height: 17px;
	font-size:12px !important;
	line-height:20px;
}

#thepro_table {
    width: 100%;
    max-width: 1280px;
    margin: auto;
    text-align: right !important;
	font-size:13px !important;
	line-height:20px;
}
#subsub {
    width: 98%;
    border-spacing: 2px;
    text-align: center; 
}

#subsub td {
    height: 35px;
    background: #EDEDED;
    text-align: center;
    border: 2px solid #FFF;
}

a.subby:link,
a.subby:visited {
    font-size: 15px;
    text-decoration: none;
    color: #0080FF
}

a.subby:hover {
    color: #000
}

a.redcover:link , a.redcover:visited{color:#FFF; font-size:13px; background:#F33; padding:8px 15%; border-radius:4px; border:1px solid #CCC}
a.redcover:hover{background:#333}

.rslides{position:relative;list-style:none;overflow:hidden;width:99%;margin:auto; z-index:-100 !important}
.rslides li{-webkit-backface-visibility:hidden;position:absolute;display:none;width:100%;left:0;top:0; z-index:-100 !important}
.rslides li:first-child{position:relative;display:block;float:left}
.rslides img{display:block;height:auto;float:left;width:100%;border:0}
.rslides{margin:0 auto}
.rslides_container{position:relative;float:left;width:100%}
.rslides1_nav{position:absolute;-webkit-tap-highlight-color:rgba(0,0,0,0);top:50%;left:0;z-index:99;opacity:.7;text-indent:-9999px;overflow:hidden;text-decoration:none;height:61px;width:38px;background:transparent url(themes.gif) no-repeat left top;margin-top:-45px}
.rslides1_nav:active{opacity:1}
.rslides1_nav.next{left:auto;background-position:right top;right:0}
.rslides2_nav{position:absolute;-webkit-tap-highlight-color:rgba(0,0,0,0);top:0;left:0;display:block;background:#fff;opacity:0;filter:alpha(opacity=1);width:48%;text-indent:-9999px;overflow:hidden;height:91%}
.rslides2_nav.next{left:auto;right:0}
.rslides3_nav{position:absolute;-webkit-tap-highlight-color:rgba(0,0,0,0);opacity:.6;text-indent:-9999px;overflow:hidden;top:0;bottom:0;left:0;background:#000 url(themes.gif) no-repeat left 50%;width:38px}
.rslides3_nav:active{opacity:1}
.rslides3_nav.next{left:auto;background-position:right 50%;right:0}
.rslides1_nav:focus,.rslides2_nav:focus,.rslides3_nav:focus{outline:none}
.rslides_tabs{margin-top:10px;text-align:center}
.rslides_tabs li{display:inline;float:none;_float:left;*float:left;margin-right:5px}
.rslides_tabs a{text-indent:-9999px;overflow:hidden;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;background:#CCC;background:rgba(0,0,0,.2);display:inline-block;_display:block;*display:block;-webkit-box-shadow:inset 0 0 2px 0 rgba(0,0,0,.3);-moz-box-shadow:inset 0 0 2px 0 rgba(0,0,0,.3);box-shadow:inset 0 0 2px 0 rgba(0,0,0,.3);width:9px;height:9px}
.rslides_tabs .rslides_here a{background:#222;background:rgba(0,0,0,.8)}
.caption{position:absolute;display:block;bottom:0;left:0;right:0;padding:5px;text-align:center;background:#000;background:rgba(0,0,0,.8);color:#fff}
#mobilelink{display:none}
#rescat{display:none}
nav{width:100%;}
.nav_wrapper{position:relative;z-index:1000;width:100%;max-width:1280px;margin:auto;background:#000}
.nav_wra{position:relative;z-index:1000;width:100%;max-width:1280px;margin:auto;background:#000}
.btn{padding:10px 1%;margin:5px;color:#fff;text-decoration:none;font-family:sans-serif;transition:all .1s ease}
.btn:hover{transition:all .1s ease}
#search{float:right;font-size:35px;padding:2px 15px;line-height:40px;color:#009fe3;margin:0;font-weight:700;-webkit-transform:rotate(181deg);-moz-transform:rotate(181deg);-ms-transform:rotate(181deg);-o-transform:rotate(181deg);transform:rotate(181deg)}
#search:hover{color:#666}
.search_box{clear:both;width:100%;background:#009fe3;padding:0;margin:0;height:0;overflow:hidden;transition:all .1s ease-in-out}
.search_box.active{height:auto;padding:15px 0}
.search_box input{width:80%;font-size:13px;margin:0 0 0 15px;padding:10px;border:none;background:#fff}
.search_box input:focus{outline:none}
.search_box input.search_icon{clear:both;width:10%;height:auto;padding:10px;margin:0;margin-left:-5px;border:none;color:#fff;cursor:pointer;background:#8c949d;opacity:1;transition:all .1s ease}
.search_box input.search_icon:hover{background:#666}
.menu-link{display:none}
.spinner-master input[type=checkbox]{display:none}
.menu{width:100%;height:auto;background:#333;transition:all .3s ease}
.menu ul{padding:0;margin:0;list-style:none;position:relative;display:inline-block}
.menu > li > ul.sub_menu{min-width:10em;padding:4px 0;background-color:#f4f4f4;border:1px solid #fff}
.menu ul li{padding:0}
.menu > ul > li{display:inline-block}
.menu ul li a{display:block;text-decoration:none;color:#fff;font-size:13px}
.menu ul li a:hover{background:#666;color:#fff}
.menu ul li.hover > a{background:#666;color:#fff}
.menu ul li > a{padding:15px 30px}
.menu ul ul{display:none;position:absolute;top:100%;min-width:200px;background:#39484d}
.menu ul li:hover > ul{display:block}
.menu ul ul > li{position:relative}
.menu ul ul > li a{padding:10px 15px;height:auto;background:#39484d}
.menu ul ul > li a:hover{background:#666;color:#fff}
.menu ul ul ul{position:absolute;left:100%;top:0}
#hero{width:100%;height:auto;background:#e8ebf0;margin:70px 0 20px}
#hero img{width:100%;height:auto}
footer{width:100%;background:#09c;padding:10px;color:#fff;margin-top:40px}
footer a{color:#fff;text-decoration:none}
*{box-sizing:border-box}
.pro-id{width:96%; min-width:240px; max-width:1000px; height:auto; margin:15px auto 15px auto ; overflow:auto; background:#EDEDED}	
.picpro-id{width:30%; height:auto; float:left; min-width:200px; border:1px solid #EDEDED;}
.picpro-id img{width:100%; height:auto;}
.textpro-id{width:60%; float:left; margin-left:4%; height:auto;}


#mine {padding:0; margin:3px 0; list-style:none; height:25px; position:relative; z-index:500; font-family:'yekan'; direction:rtl !important}
#mine li {float:right; margin-right:1px;}
#mine li a {display:block; float:right;color:#FFFFFF; text-decoration:none; font-size:11px; padding:0 15px 0 15px;}


#mine table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;}

/* Default link styling */

/* Style the list OR link hover. Depends on which browser is used */

#mine li a:hover {z-index:200; position:relative;color:#f33; }
#mine li:hover {position:relative; z-index:200;}

#mine li:hover > a {color:#333;}
#mine li:hover > a.sub {color:#333;}

#mine li.current a {color:#f33;}


#mine li.current a.sub {color:#f33; background:#ffc324 url(down-arrow.gif) no-repeat right center;}

#mine :hover ul {left:0; top:40px; width:200px; background:#444;}

/* keep the 'next' level invisible by placing it off screen. */
#mine ul, 
#mine :hover ul ul {position:absolute; left:-20px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

#mine :hover ul :hover ul
{left:200px; top:-1px; background:#222; white-space:nowrap; width:200px; z-index:200; height:auto;}

#mine :hover ul li {margin:0; border-top:1px solid #666;}
#mine :hover ul li a {width:200px; padding:0; text-indent:10px; background:#d4494c; color:#FFF; height:30px; line-height:30px;}
#mine :hover ul li a.fly {background:#d4494c;}
#mine :hover ul li a.enfly {background:#d4494c; font-family:Tahoma !important}


#mine :hover ul :hover {background-color:#333; color:#fff;}
#mine :hover ul :hover a.fly {background-color:#333; color:#fff;}
#mine :hover ul :hover a.enfly {background-color:#333; color:#fff;  font-family:Tahoma !important}


#mine :hover ul li.currentsub a {background:#ffc324; color:#fff;}
#mine :hover ul li.currentsub a.fly {background:#ffc324 url(right-arrow.gif) no-repeat right center; color:#fff;}
#mine :hover ul li.currentsub a.enfly {background:#ffc324 url(right-arrow.gif) no-repeat right center; color:#fff;  font-family:Tahoma !important}


#mine :hover ul :hover ul li a {width:190px; padding:0; text-indent:10px; background:#3e3e3e; color:#FFF;}
#mine :hover ul :hover ul :hover {background-color:#d70; color:#fff;}

#mine :hover ul :hover ul li.currentfly a,
#mine :hover ul :hover ul li.currentfly a:hover {background:#ffc324; color:#fff;}

#mine :hover ul :hover ul li.currentenfly a,
#mine :hover ul :hover ul li.currentenfly a:hover {background:#ffc324; color:#fff;   font-family:Tahoma !important}










#n , #n ul{list-style:none;
           width:auto;
		   position:relative;
		   z-index:1 !important;
		   
} 
#n li{
	  float:left;
	  display:inline;
	  position:relative;
	  width:100%;
	  height:auto;
	  
}
#n a:link,#n a:visited{color:#FFF;
      background-color:transparent;
	  text-decoration:none;
}
#n a:hover{color:#F33;
font:Verdana, Geneva, sans-serif
}
#n ul{display:none !important;
margin-top:-25px !important;
position:absolute;
width:90%;
margin:auto;

}
#n ul li{border-top:#CCC solid thin;
border-bottom:0;
position:relatiove;
z-index:1000;
background-color:#000;
opacity:0.9;
filter:alpha;
color:#FFF;
margin-top:1px;

}

#n li:hover ul{text-decoration:none;
display:block !important;
color:#F0C;
}


#tableprice{width:96%; max-width:1020px; margin:auto; border-collapse:separate; border-spacing:4px; direction:ltr; text-align:center;}
#tableresprice{display:none}


a.puredark:link , a.puredark:visited{color:#333 !important; font-size:12px; text-decoration:overline}
a.puredark:hover{color:#FFF !important}

a.enggray:link,a.blue:visited{color:#555 !important;text-decoration:none; font-size:12px !important; font-family:Tahoma; text-decoration:overline}
a.enggray:hover{color:#FFF}

a.borgray:link,a.borgray:visited{color:#555 !important;text-decoration:none; font-size:12px !important; font-family:Tahoma; text-decoration:overline}
a.borgray:hover{color:#FFF}
@media all and (max-width: 768px) {
.example-header .container{width:100%}
#search{padding:10px}
.spinner-master *{transition:all .3s;box-sizing:border-box}
.spinner-master{position:relative;margin:15px;height:30px;width:30px;float:left}
.spinner-master label{cursor:pointer;position:absolute;z-index:99;height:100%;width:100%;top:5px;left:0}
.spinner-master .spinner{position:absolute;height:4px;width:100%;padding:0;background-color:#fff}
.spinner-master .diagonal.part-1{position:relative;float:left}
.spinner-master .horizontal{position:relative;float:left;margin-top:4px}
.spinner-master .diagonal.part-2{position:relative;float:left;margin-top:4px}
.spinner-master input[type=checkbox]:checked ~ .spinner-spin > .horizontal{opacity:0}
.spinner-master input[type=checkbox]:checked ~ .spinner-spin > .diagonal.part-1{transform:rotate(135deg);-webkit-transform:rotate(135deg);margin-top:10px}
.spinner-master input[type=checkbox]:checked ~ .spinner-spin > .diagonal.part-2{transform:rotate(-135deg);-webkit-transform:rotate(-135deg);margin-top:-12px}
a.menu-link{display:block;color:#fff;float:left;text-decoration:none;padding:10px 16px;font-size:1em}
a.menu-link:hover{color:#666}
a.menu-link:after{content:"\2630";font-weight:400}
a.menu-link.active:after{content:"\2715"}
.menu{clear:both;min-width:inherit;float:none}
.menu,.menu > ul ul{overflow:hidden;max-height:0;background-color:#39484d}
.menu > li > ul.sub-menu{padding:0;border:none}
.menu.active,.menu > ul ul.active{max-height:55em}
.menu ul{display:inline}
.menu li,.menu > ul > li{display:block}
.menu > ul > li:last-of-type a{border:none}
.menu li a{color:#fff;display:block;padding:.8em;position:relative}
.menu li.has-submenu > a:after{content:'+';position:absolute;top:0;right:0;display:block;font-size:1em;padding:.55em .5em}
.menu li.has-submenu > a.active:after{content:"-"}
.menu ul ul > li a{background-color:#39484d;padding:10px 18px 10px 30px}
.menu ul li a:hover{background:#4b5f65;color:#fff}
.menu ul li.hover > a{background:#4b5f65;color:#fff}
.menu ul ul,.menu ul ul ul{display:inherit;position:relative;left:auto;top:auto;border:none}
.search_box{position:absolute;top:60px;left:0;z-index:10}
.search_box input{width:70%}
.search_box input.search_icon{width:17%}
#hero{height:200px}

#mobthelogo{display:none}

#justshow{display:none}

}
@media screen and (max-width: 480px) {
	#construction_whatsapp{display:block !important; position:fixed; bottom:20px !important; left:10px !important;}
#construction_whatsapp img{width:auto; height:auto}
	.halflefti{display:none}
.halfrighti{width:95%; float:none; margin:auto}
#thesearch_table{width:90%; margin:0 auto 20px auto}
#topsearch{width:90%; float:none; margin:0 auto 20px auto;}
	#leftyellow{width:96%; height:auto; overflow:hidden; padding:10px 2%; background:#d40025; min-height:150px; float:none}
#lypic{width:40%; float:right; min-width:100px; background:#FFF;; height:auto; overflow:hidden; padding:10px 1% 0 1%; box-shadow: 3px 3px #CCC;}
#lypic img{width:100%; height:auto}
#lytext{color:#333; width:30%; float:left; margin-right:2%; max-width:380px; font-size:11px; text-align:right;}

#righttoit{width:96%; float:none; padding:15px 0; min-height:150px}
#toitcontent{color:#333; width:100%; min-width:260px; float:none; max-width:300px; font-size:11px; text-align:right;}
	.thecontent{display:none}
#fixtop{position:relative !important; height:auto; overflow:inherit}
#filler{min-height:200px}
#brands{display:none}
.myicons{width:46%;}
.online{float:none; width:96%; margin:auto}	
.mainleft{display:none}
.maincenter{width:98%; margin:auto; float:none}
.mainright{width:98%; margin:auto; float:none}
.github{display:none}
img{max-width:480px}
#topline{display:none}
#top-info{display:none}
#mobilelink{display:block;width:98%;margin:auto}
#reslogo{width:100%;height:auto}
#reslinks{background:#666;height:auto;width:100%}
#resul{width:98%}
#resul li{list-style:none;display:inline;text-align:center;width:30%;padding:0 6%;color:#FFF;border-right:1px solid #fff}
#ressearch{width:100%;height:auto;background:#FFF;margin:5px 0}
#thesearch_submit{font-size:9px;font-family:'yekan'}
#catagories{display:none}
#rescat{display:block;width:98%;margin:auto;height:auto;margin:7px 0}
#sprolinks{display:none}
#motto{font-size:12px}
.mainfour{width:94%;float:left;margin:auto;float:none}
.tmainfour{width:94%;float:left;margin:auto;float:none}
#news{display:none}
#latestpro{width:98%;float:none;margin:20px auto}
.profour{width:45%;height:200px;border:1px solid #D8D8D8;float:left;margin:15px 1.5%}
.profour img{width:100%;height:auto}
.per_pro{width:96%;height:auto;margin:10px auto 0 1%;border:1px solid #999;text-align:center; float:none}
.per_pro img{width:90%!important;height:auto!important}
.thepro_table{display:none}
#gmap{width:98%;float:none;height:400px;margin:auto}
#contactdetail{width:98%;float:none;margin:auto}
.galdiv{width:98%;min-width:260px;box-shadow:5px 5px 5px #666;float:none;margin-top:10px;margin-bottom:10px}
#prosetright{display:none}
#prosetleft{width:98%;float:none;margin:auto}
#thepro_table td{display:block}
#thepro_table img{width:70%!important;height:auto!important;margin:auto}
.thethree{width:41.5%!important;height:auto;padding:0;border-right:1px solid #CCC;margin-left:3%;float:left;text-align:center;vertical-align:text-top;min-width:140px}
#proelements{display:none}
.mobelements{display:block;width:100%}
#pictureslide{width:98%;margin:auto}
.profive{width:46%;height:350px;border:1px solid #D8D8D8;float:left;margin:15px 1.5%}
.profive img{width:100%;height:140px}
a.profive:link,a.profive:visited{text-decoration:none}
a.profive:hover{border:1px solid #F90}
a.profive div{width:100%}
a.profive p{padding:0 5px;font-size:10px;text-align:right;color:#666}
.theprofive{width:46%;height:350px;border:1px solid #D8D8D8;float:left;margin:15px 1.5%}
.theprofive img{width:100%;height:140px}
a.theprofive:link,a.theprofive:visited{text-decoration:none}
a.theprofive:hover{border:1px solid #F90}
a.theprofive div{width:100%}
a.theprofive p{padding:0 5px;font-size:10px;text-align:right;color:#666}
.imainfour{width:96%;float:none;margin:15px auto}
.brandicon{width:14.5%;height:auto;margin:15px 1%; float:left}
.mainfour{margin:20px auto}
#newstab{width:96%;float:none;margin-left:10px auto;color:#333;text-align:right}
#newstab ul{list-style:none}
#newstab li{border-bottom:1px dotted #666;padding:3px 0}
#thefixed{display:none}
#thetopper{display:none}
#footer-left{display:none}
#footer-right{width:98%;margin:auto;text-align:right}
#mobtop{width:98%;margin:auto;height:auto;overflow:auto;display:block}
#pro-info{width:98%;height:auto;overflow:auto;margin:auto}
#pro-picture{width:98%;min-width:280px;height:auto;border:1px solid #EDEDED;margin:auto}
.thebox{width:46%;margin:auto;height:auto;min-width:130px;float:left;margin:1% 0 1% 2.5%;border:1px solid #CCC; min-height:120px}
.thefour{width:24%;min-width:240px;height:220px;margin-left:1%}
.fourpro{width:43%;margin:2%;border:1px solid #CCC;height:115px;float:left}
.linkbox{width:96%;margin:auto;height:270px;border:1px solid #CCC;float:left}
#mobfooter{display:block;width:96%;height:100px;border-top:1px solid #CCC;background:#333;margin:auto;color:#CCC;text-align:center}
#manual{display:none}
#samplepro{width:98%;margin:auto;height:auto;overflow:auto}
#procontent{width:98%;margin:0 auto auto}
.theschetch{width:96%;height:270px;min-width:230px;float:left;margin:auto}
#brando{width:98%;min-width:240px;height:auto;overflow:auto;margin:auto}
#compinfo{width:98%;min-width:240px;height:auto;overflow:auto;margin:auto}
#onesample{display:none}
#threefields{width:96%;height:auto;margin:10px auto}
.picpro-id{width:98%;height:auto;border:1px solid #EDEDED}
.textpro-id{width:96%;height:auto}
#abox{width:98%;margin:auto;background:#CCC}
#bbox{width:98%;margin:auto}
#cbox{width:98%;margin:auto;background:#CCC}
#ntop{display:none}
.mobelements{display:block;width:100%}
.onethird{width:98%;margin:auto;float:none}
.per_pro{width:96%;height:auto;margin:10px auto 0 auto;border:1px solid #999;text-align:center; float:none;}
.per_pro img{width:90%!important;height:auto!important}
.thepro_table{display:none}
#descmap{display:none}
#mobmap{width:95%;height:400px;margin:auto;display:block}
    #subsub td {
        display: block
    }
    #llk {
        display: none
    }
    #res_topper {
        width: 98%;
        height: auto;
        overflow: hidden;
        margin: auto;
        display: block
    }
    #res_logo {
        width: 100%;
        height: auto
    }
    #res_logo img {
        width: 100%;
        height: auto
    }
    #res_oll {
        display: block;
        width: 98%;
        height: auto
    }
    #res_mlink {
        width: 100%;
        height: 75px !important;
        background: #666
    }
    #mlink_table {
        width: 100%;
        height: 75px !important;
    }
	#mlink_table tr {border-bottom:4px solid #FFF !important;}
    #mlink_table td {
        border-right: 1px solid #FFF;
        text-align: center
    }
    #mlink_table img {
        width: 100%;
        height: auto
    }
    #res_link {
        width: 100%;
        height: 45px;
        margin: auto
    }
    #res_rotar {
        width: 100%;
        height: auto
    }
    #res_rotar img {
        width: 100%;
        height: auto
    }
    #topper {
        display: none
    }
    #therotary {
        display: none
    }
    #theitems {
        display: none
    }
    #thethree td {
        display: block;
        width: 94%;
        height: auto;
        overflow: auto
    }
    #thefooter {
        display: none
    }
    #sfooter {
        display: none
    }
    #res_footer {
        background: #333;
        width: 98%;
        height: auto;
        overflow: auto;
        color: #FFF;
        line-height: 20px;
        margin: auto;
        display: block;
        text-align: center
    }
    #per_pro {
        width: 96%;
        height: auto;
        margin: 10px auto 0 auto;
        border: 1px solid #999;
        text-align: center;
		float:none;
    }
    #per_pro img {
        width: 98%;
        height: auto
    }
    #thepro_table {
        display: none
    }
    #res_theone {
        width: 98%;
        height: auto;
        margin: auto;
        overflow: auto;
        display: block
    }
    #res_theone table {
        width: 98%;
        height: auto;
        margin: auto;
        text-align: right
    }
    #res_theone img {
        width: 100%;
        height: auto
    }
    #redundent {
        display: none
    }
    #mmpro td {
        display: block;
        max-width: 220px
    }
    #mmpro img {
        max-width: 220px
    }
    span.line {
        color: #666;
        text-decoration: line-through;
    }
    #hope {
        display: none;
    }
    #descthelogo {
        display: none;
    }
    #mobthelogo {
        width: 60%;
        margin: auto;
        display: block;
        padding: 20px 0;
    }
    #descmap {
        display: none;
    }
    #mobmap {
        width: 95%;
        height: 400px;
        margin: auto;
        display: block;
    }
	#middlered{width:100%; margin:auto; float:none}
	#midlefti{width:100%; border:none; float:none}
	#midrighti{display:none}
	#thelate{width:100%; float:none}
	#descmap{display:none;}#mobmap{width:95%; height:400px; margin:auto; display:block;}
	 .picpro-id{width:98% !important; height:auto; border:1px solid #EDEDED;}.picpro-id img{width:100% !important; max-width:100% !important}
.textpro-id{width:96 !important%;  height:auto;}
.therestable{float:none; width:98%; margin:auto}
#tableresprice{display:block; width:98%; margin:auto; direction:ltr}
#tableprice{display:none}

a.compblue:link,a.compblue:visited{text-decoration:none;color:#4F4F4F;}
a.compblue div{width:85%;  margin:15px auto; height:auto; overflow:hidden;  float:none; }
a.compblue div.border{ border-bottom:3px solid #fcc604; margin-bottom:20px}
a.compblue div:hover{background:#FFF;}
a.compblue div:hover div{background:#FFF;}
#organic{display:none}
#footorganic{width:100%; margin:auto; max-width:1100px; overflow:hidden; display:block}
.thecertificate{float:none; width:40%; margin:15px 5%}
.thevideo{float:none; width:90%; margin:15px 5%}
}