/**
    =======================================================================
    Created: 2023 07 21
    =======================================================================
    Purpose: Cascading Style Sheets Supporting Same Named .php Script
    =======================================================================
**/
#Menu
{
    margin: 1px 1px;
    position: relative;
    z-index: 3000;
}

#Menu a
{
    color: #442ddd;
    margin: 0 12px 0 0 !important;
    white-space: nowrap;
}
#Menu a:link, #Menu a:visited, #Menu a:hover, #Menu a:active
{
    /*color: #ffff00;*/
    text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
}

.MenuLink
{
    display: inline-block;
    vertical-align: middle;
    padding: 6px 0 3px !important;
    text-align: center;
    width: 100px;
}

.MenuLink:hover, .MenuLink:active
{
    background-color: #e8e8e8;
}

.MenuSep
{
    margin: 4px 0 0 10px;
    padding: 6px 0 !important;
    text-align: center;
    width: 100%;
}
.MenuSep hr
{
    margin: 0;
    padding: 0;
    width: 100%;
}
.MenuSep span
{
    color: #007acc;
    text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
}

/* Dropdown Button */
.dropbtn
{
    padding: 0 6px 10px;
    border: none;
    color: #442ddd;
    text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
}

/* The container <div> - needed to position the dropdown content */
.dropdown
{
    position: relative;
    display: inline-block;
    
    text-align: left;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content
{
    display: none;
    position: absolute;
    background-color: #e8e8e8;
    border-Left: 2px solid #99ccff;
    border-right: 2px solid #99ccff;
    border-bottom: 2px solid #99ccff;

    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    margin: 7px 0 0;
    /*z-index: 1;*/
}

/* Links inside the dropdown */
.dropdown-content a
{
    cursor: pointer;
    padding: 12px 16px;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover
{
    color: #ff4000;
    text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content
{
    display: block;
}
.dropbtn:focus-within .dropdown-content
{
    display: block;
}
.dropdown:focus-within .dropdown-content
{
    display: block;
}
#Menu a:focus .dropdown-content
{
    display: block;
}