<style>
.icon-mobile-men-top-right{
list-style:none;
float:right;
margin:0px;
padding: 0px;
display: none !important;
}
.icon-mobile-men-top-right #icon-mobile-menu a {    
color: #FFFFFF;
font-size: 30px;
font-style: normal; 
font-weight: normal;
position:absolute;     
top: 85px;  
right: 5px;
padding-right: 9px;
}
#flip {
display: none;
position:absolute;     
top: 115px;  
right: -20px;
z-index: 99902;
margin-right: 33px;
background: #F2F2F2;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#F2F2F2));
background-image: -webkit-linear-gradient(top, #fff, #F2F2F2);
background-image: -moz-linear-gradient(top, #fff, #F2F2F2);
background-image: -ms-linear-gradient(top, #fff, #F2F2F2);
background-image: -o-linear-gradient(top, #fff, #F2F2F2);
background-image: linear-gradient(top, #fff, #F2F2F2);
box-shadow: 0px 7px 20px rgba(0, 0, 0, 0.2);
border: 1px solid #e4e4e4;
border-radius: 3px;
padding: 1px;
opacity: 1;
width: 200px;
clear:both;
}
#flip li{
list-style:none;    
}
#icon-mobile-menu_menu .element_menu li
{
float:right;
margin-right: -30px;
}
@media screen and (max-width: 680px) {
.icon-mobile-men-top-right{
display: block !important;
}
}
</style>
<script type="text/javascript">
$(document).ready(function(){
    $("#icon-mobile-menu").click(function(){
        $("#flip").slideToggle("slow");
    });
});
</script>
<div class="icon-mobile-men-top-right">
<div id="icon-mobile-menu"><a title="mobile menu" href="#" class="fa fa-bars fa-3x"></a></div>
<div id="flip">
<ul style="display:inline;">
<li class="thead">{$lang['pages']}</li>
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span>
<a href="index.php" title="{$_CONF['info_row']['title']}">
{$lang['forum']}</a></li>
{if {$_CONF['info_row']['active_portal']} == '1'}
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span>
<a href="portal" title="{$lang['portal']}">
{$_CONF['info_row']['title_portal']}</a></li>
{/if}
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span>
<a href="whats_new" title="{$lang['latest_reply']}">{$lang['latest_reply']}</a></li>
{if {$_CONF['info_row']['active_team']} == '1'}
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span>
<a href="team.html" title="الإداريين">الإداريين</a></li>
{/if}
{if {$_CONF['info_row']['active_send_admin_message']} == '1'}
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span>
<a href="contact.html" title="اتصل بنا">اتصل بنا</a></li>
{/if}
{if {$_CONF['rows']['member_row']['usergroup']} == 5}
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span>
<a href="active_user.html" title="{$lang['send_active_code']}">{$lang['send_active_code']}</a></li>
{/if}
{if {$_CONF['info_row']['active_calendar']} == '1'}
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span>
<a href="calendar.html" title="calendar pkr">{$lang['Calendar']}</a></li>
{/if}
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span><a href="rules.html" title="{$lang['rules']}">{$lang['rules']}</a></li>

<!-- actikon_find_addokns_1 -->
{if {$subject_special_nm} > '0'}
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span>
<a href="special_subject.html" title="{$lang['Special_Subject']}">{$lang['Special_Subject']}</a></li>
{/if}
<!-- acation_fidnd_adwdons_2 -->
{get_hook}main_bar_1{/get_hook}

{if {$_CONF['member_permission']}}
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span>
<a href="index.php?page=usercp&index=1" title="{$lang['usercp']}">{$lang['usercp']}</a>
</li>
{/if}
<!-- actiown_finwd_addons_6 -->
<!-- action_find_addosans_1 -->
{if {$_CONF['group_info']['memberlist_allow']} == '1'}
<li class='menu_popup'>
<span class="fa fa-arrow-circle-left"></span>
<a href="members-list" title="{$lang['memberlist']}">{$lang['memberlist']}</a></li>
{/if}
{if {$_CONF['member_permission']}}
<li class="thead">{$lang['User_Control_Panel']}</li>
<li class='menu_popup'><a href="index.php?page=usercp&amp;control=1&amp;sign=1&amp;main=1">
{$lang['Change_Signature']}</a></li>
<li class='menu_popup'><a href="index.php?page=usercp&amp;control=1&amp;avatar=1&amp;main=1">
{$lang['Change_avatar']}</a></li>
<li class='menu_popup'><a href="index.php?page=usercp&amp;control=1&amp;info=1&amp;main=1">
{$lang['Your_Personal_Information']}</a></li>
<li class='menu_popup'><a href="index.php?page=usercp&amp;options=1&amp;subject=1&amp;main=1">
{$lang['Your_Subjects']}</a></li>
{if {$_CONF['info_row']['pm_feature']}}
{if {$_CONF['rows']['group_info']['use_pm']} == 1}<li class='menu_popup'><a href="index.php?page=pm_list&amp;list=1&amp;folder=inbox">
{$lang['Private_Messages']}</a></li>
{/if}
{/if}
<li class='menu_popup'><a href="index.php?page=profile&amp;show=1&amp;username={$_CONF['member_row']['username']}">
{$lang['Your_profile']}</a></li>
{if {$_CONF['group_info']['onlinepage_allow']} == '1'}<li class='menu_popup'><a href="index.php?page=online&amp;show=1">
{$lang['Whos_Online']}</a></li>
{/if}
{/if}

<!-- actioddn_find_addons_4 -->
{get_hook}main_bar_2{/get_hook}
</ul>
</div>
</div>


<ul class="header-menu">