.mega-menu-wrapper {top: 220px;position: fixed;left: 0;right: 0;opacity: 0;z-index: 99;-webkit-transform: rotate3d(1, 0, 0, 90deg) perspective(800px);transition: all 0.3s ease-out;}.mega-menu-wrapper:before{content:'';display:block;height:6px;position:absolute;top:-6px;left:0;right:0;background:transparent}.main-menu ul li:hover .mega-menu-wrapper{opacity:1;-webkit-transform: rotate3d(1, 0, 0, 0deg);}.clearfix{zoom:1}.mega-post{text-align: center;padding:0!important;width:23%;margin:0 1%!important}.mega-menu{background:#fff;padding:1.5% .5%!important;overflow: hidden;margin-top: -4px;box-shadow: 0 0 6px rgba(0,0,0,0.27);}.mega-post a{margin:0!important}.mega-post.clearfix a {padding: 0;height: 0;}.mega_post-title{color: #FFF;margin: 0;line-height: 22px;font-size: 16px;position: absolute;bottom: 0;width: 100%;padding: 20px 10px;background-image: linear-gradient(transparent,rgba(0, 0, 0, 1));}.mega-tags span{margin:0 1px;display:inline-block}.mega-tags i{margin:0 5px;font-size:16px}.mega-tags {display: none;}

<script>
//<![CDATA[
var theLabel=$(".main-menu ul li a");theLabel.each(function(c){var e=$(this),f=e.text(),g=e.attr("href");if("mega"===g){var h=e.parent();e.addClass("mega-icon"),e.attr("href","/search/label/"+f+"?&max-results=10");f.match(/<.*>/g);f.replace(/<.*>/g,""),$.ajax({url:"/feeds/posts/default/-/"+f+"?alt=json-in-script&max-results=4",type:"get",dataType:"jsonp",success:function(c){for(var e=new Array,f="",g=0;g<4;g++){for(var r,i=c.feed.entry[g],j=i.title.$t,k=i.author[0].name.$t,l=c.feed.entry[0].published.$t,m=l.substring(0,4),n=l.substring(5,7),o=l.substring(8,10),p=[,"يناير ","فبراير ","مارس ","أبريل ","مايو ","يونيو ","يوليو ","أغسطس ","سبتمبر ","أكتوبر ","نوفمبر ","ديسمبر "],q=o+" "+p[parseInt(n,10)]+" "+m,t=0;t<i.link.length;t++)if("alternate"==i.link[t].rel){r=i.link[t].href;break}if("content"in i)var u=i.content.$t;s=u,a=s.indexOf("<img"),b=s.indexOf('src="',a),o=s.indexOf('"',b+5),d=s.substr(b+5,o-b-5),a!=-1&&b!=-1&&o!=-1&&""!=d&&(e[g]=d);var v=e[g].replace("s1600/","s500-c/"),f=f+'<li class="mega-post clearfix"><a href="'+r+'" class="mega_post-image" style="background: url('+v+') no-repeat center;background-size: cover;height: 200px;"></a><a href="'+r+'"><h3 class="mega_post-title truncate">'+j+'</h3></a><div class="mega-tags"><span><i class="material-icons">  </i>'+k+'</span><span><i class="material-icons">  </i>'+q+"</span></div></li>"}h.append('<div class="mega-menu-wrapper"><div class="container"><ul class="mega-menu clearfix">'+f+"</ul></div></div>")}})}});
//]]>
</script>