Untitled

<%@ Master Language="VB" CodeFile="Site.master.vb" Inherits="Site" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>CareFree Portal</title>
    <link href="Styles/Main.css" rel="stylesheet" type="text/css" />
    <link href="Styles/menus.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript" src="Scripts/script.js"></script>
    <script type="text/javascript" src="Scripts/modernizr.custom.79639.js"></script>
    <script src="Scripts/organictabs.jquery.js"></script>
    <asp:ContentPlaceHolder id="HeadContent" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div id="page">
        <div id="header">
            <asp:Image ID="imgLogo" runat="server" ImageUrl="~/Images/CFLogo.png" AlternateText="Portal" />
        </div>

       <div id="menubar">
            <div id="welcome">
                <asp:Label ID="lblWelcome" runat="server"></asp:Label>
                <asp:Button ID="btnLogout" runat="server" Text="Logout" />
            </div>


            <asp:Panel ID="pnlSidebar" runat="server">
                <div class="rotaWrapper">
                    <div id="ddRotas" class="wrapper-dropdown-rotas" tabindex="1">
                        <asp:Label ID="lblRotasMenu" runat="server">Rotas and absences</asp:Label>
                        <ul class="dropdown">
                            <li><asp:HyperLink ID="hypRotas" runat="server" NavigateUrl="~/Rotas.aspx">Rotas</asp:HyperLink></li>
                            <li><asp:HyperLink ID="hypAbsence" runat="server" NavigateUrl="~/Absence.aspx">Absences</asp:HyperLink></li>
                            <li><asp:HyperLink ID="hypTraining" runat="server" NavigateUrl="~/Training.aspx">Training</asp:HyperLink></li>
                        </ul>
                    </div>
                </div>
                <div class="wagesWrapper">
                    <div id="ddWages" class="wrapper-dropdown-wages" tabindex="1">
                        <asp:Label ID="lblWagesMenu" runat="server">Wages</asp:Label>
                        <ul class="dropdown">
                            <li><asp:HyperLink ID="hypWages" runat="server" NavigateUrl="~/Wages.aspx">Wages</asp:HyperLink></li>
                            <li><asp:HyperLink ID="hypPaySlips" runat="server" NavigateUrl="~/Payslips.aspx">Payslips</asp:HyperLink></li>
                        </ul>
                    </div>
                </div>
                <div class="docsWrapper">
                    <div id="ddDocs" class="wrapper-dropdown-docs" tabindex="1">
                        <asp:Label ID="lblDocumentsMenu" runat="server">Documents</asp:Label>
                        <ul class="dropdown">
                            <li><asp:HyperLink ID="hypDetails" runat="server" NavigateUrl="~/CarerDetails.aspx">Your details</asp:HyperLink></li>
                            <li><asp:HyperLink ID="hypDocumentsPersonal" runat="server" NavigateUrl="~/DocumentsPersonal.aspx">Personal documents</asp:HyperLink></li>
                            <li><asp:HyperLink ID="hypDocumentsAll" runat="server" NavigateUrl="~/Documents.aspx">Company documents</asp:HyperLink></li>
                        </ul>
                    </div>
                </div>
                <div class="messagesWrapper">
                    <div id="ddMessages" class="wrapper-dropdown-messages" tabindex="1">
                        <asp:Label ID="lblMessagesMenu" runat="server">Messages</asp:Label>
                        <ul class="dropdown">
                            <li><asp:HyperLink ID="hypMessages" runat="server" NavigateUrl="~/Messages.aspx">Messages</asp:HyperLink></li>
                        </ul>
                    </div>
                </div>
                <!--<div class="adminWrapper">
                    <div id="ddAdmin" class="wrapper-dropdown-admin" tabindex="1">
                        <asp:Label ID="lblAdminMenu" runat="server">Messages</asp:Label>
                        <ul class="dropdown">
                            <li><asp:HyperLink ID="hypAdminUsers" runat="server" NavigateUrl="~/Admin.aspx">Manage users</asp:HyperLink></li>
                            <li><asp:HyperLink ID="hypAdminFolders" runat="server" NavigateUrl="~/Folders.aspx">Folder settings</asp:HyperLink></li>
                        </ul>
                    </div>
                </div>-->
        </asp:Panel>
        </div>
    </div>
    <div id="main">
        <asp:ContentPlaceHolder id="MainContent" runat="server">
            <p>
            </p>
        </asp:ContentPlaceHolder>
    </div>
    </form>
    <script type="text/javascript">

            function DropDown(el) {
                this.dd = el;
                this.initEvents();
            }
            DropDown.prototype = {
                initEvents : function() {
                    var obj = this;

                    obj.dd.on('click', function(event){
                        $(this).toggleClass('active');
                        return false;
                    });
                },
            }

            $(function() {

                var ddRotas = new DropDown( $('#ddRotas') );
                var ddWages = new DropDown( $('#ddWages') );
                var ddMessages = new DropDown( $('#ddMessages') );
                var ddDocs = new DropDown( $('#ddDocs') );
                var ddAdmin = new DropDown( $('#ddAdmin') );

                $(document).click(function() {
                    // all dropdowns
                    $('.wrapper-dropdown-rotas').removeClass('active');
                    $('.wrapper-dropdown-wages').removeClass('active');
                    $('.wrapper-dropdown-docs').removeClass('active');
                    $('.wrapper-dropdown-messages').removeClass('active');
                    $('.wrapper-dropdown-admin').removeClass('active');
                });

            });

        </script>
 </body>
</html>