table {
            width: 100%;
            border-collapse: collapse;
        }
        th, td {
            border: 1px solid black;
            padding: 8px;
            text-align: left;
        }
        th {
            background-color: #f2f2f2;
        }
/* MENU STYLES */
        #menuContainer11 {
            position: fixed;
            top: 10px;
            right: -100%; /* Initially hidden, using 100% for full width */
            width: 100%; /* Full width of the viewport */
            max-width: 100%; /* Maximum width */
            height: 90%;
            background: linear-gradient(
                45deg,
                #22FFF8  5%,
                
                #74ECFF  20%,
                
                #74ECFF  50%,
               
                #22FFF8  70%,
                
                #74ECFF  100%
            );
            background-size: 400% 400%;
            animation: gradientFlow 10s ease infinite;
            box-shadow: -2px 0px 5px rgba(0, 0, 0, 0.2);
            transition: right 0.8s ease-in-out;
            padding: 15px;
            display:flex;
            justify-content:center;
            z-index: 1000;
            overflow-y: auto;
            margin-top:5%;
            box-sizing: border-box; /* Ensures padding doesn't increase width */
        }

        /* TAB BUTTON STYLES */
        #menuTab11 {
            position: fixed;
            top: 10%;
            right: 3%;
            background: blue;
            color: white;
            padding: 10px;
            font-size: 16px;
            border-radius: 10px 10px 10px 10px;
            cursor: pointer;
            z-index: 1001;
            transform: translateY(-50%);
        }

        /* CONTENT INSIDE MENU */
        #menuContainer11 a {
            display: block;
            padding: 10px;
            text-decoration: none;
            color: black;
            font-size: 18px;
        }

        #menuContainer11 a:hover {
            background: #2BF8FF;
        }

        /* Responsive adjustments */
        @media (min-width: 850px) {
            #menuContainer11 {
                max-width: 100%;
                right: -100%; /* Specific pixel value for desktop */
            }
        }
    /* MENU STYLES */
        #menuContainer12 {
            position: fixed;
            top: 10px;
            right: -100%; /* Initially hidden, using 100% for full width */
            width: 100%; /* Full width of the viewport */
            max-width: 100%; /* Maximum width */
            height: 90%;
            background: linear-gradient(
                45deg,
                #22FFF8  5%,
                
                #74ECFF  20%,
                
                #74ECFF  50%,
               
                #22FFF8  70%,
                
                #74ECFF  100%
            );
            background-size: 400% 400%;
            animation: gradientFlow 10s ease infinite;
            box-shadow: -2px 0px 5px rgba(0, 0, 0, 0.2);
            transition: right 0.8s ease-in-out;
            padding: 15px;
            display:flex;
            justify-content:center;
            z-index: 1000;
            overflow-y: auto;
            margin-top:5%;
            box-sizing: border-box; /* Ensures padding doesn't increase width */
        }

        /* TAB BUTTON STYLES */
        #menuTab12 {
            position: fixed;
            top: 10%;
            right: 25%;
            background: blue;
            color: white;
            padding: 10px;
            font-size: 16px;
            border-radius: 10px 10px 10px 10px;
            cursor: pointer;
            z-index: 1001;
            transform: translateY(-50%);
        }

        /* CONTENT INSIDE MENU */
        #menuContainer12 a {
            display: block;
            padding: 10px;
            text-decoration: none;
            color: black;
            font-size: 18px;
        }

        #menuContainer11 a:hover {
            background: #2BF8FF;
        }

        /* Responsive adjustments */
        @media (min-width: 850px) {
            #menuContainer12 {
                max-width: 100%;
                right: -100%; /* Specific pixel value for desktop */
            }
        }
        
         /* MENU STYLES */
        #menuContainer13 {
            position: fixed;
            top: 10px;
            right: -100%; /* Initially hidden, using 100% for full width */
            width: 100%; /* Full width of the viewport */
            max-width: 100%; /* Maximum width */
            height: 90%;
            background: linear-gradient(
                45deg,
                #22FFF8  5%,
                
                #74ECFF  20%,
                
                #74ECFF  50%,
               
                #22FFF8  70%,
                
                #74ECFF  100%
            );
            background-size: 400% 400%;
            animation: gradientFlow 10s ease infinite;
            box-shadow: -2px 0px 5px rgba(0, 0, 0, 0.2);
            transition: right 0.8s ease-in-out;
            padding: 15px;
            display:flex;
            justify-content:center;
            z-index: 1000;
            overflow-y: auto;
            margin-top:5%;
            box-sizing: border-box; /* Ensures padding doesn't increase width */
        }

        /* TAB BUTTON STYLES */
        #menuTab13 {
            position: fixed;
            top: 10%;
            right: 50%;
            background: blue;
            color: white;
            padding: 10px;
            font-size: 16px;
            border-radius: 10px 10px 10px 10px;
            cursor: pointer;
            z-index: 1001;
            transform: translateY(-50%);
        }

        /* CONTENT INSIDE MENU */
        #menuContainer13 a {
            display: block;
            padding: 10px;
            text-decoration: none;
            color: black;
            font-size: 18px;
        }

        #menuContainer13 a:hover {
            background: #2BF8FF;
        }
        
        

        /* Responsive adjustments */
        @media (min-width: 850px) {
            #menuContainer13 {
                max-width: 100%;
                right: -100%; /* Specific pixel value for desktop */
            }
        }
        
        /* MENU STYLES */
        #menuContainer14 {
            position: fixed;
            top: 10px;
            right: -100%; /* Initially hidden, using 100% for full width */
            width: 100%; /* Full width of the viewport */
            max-width: 100%; /* Maximum width */
            height: 90%;
            background: linear-gradient(
                45deg,
                #22FFF8  5%,
                
                #74ECFF  20%,
                
                #74ECFF  50%,
               
                #22FFF8  70%,
                
                #74ECFF  100%
            );
            background-size: 400% 400%;
            animation: gradientFlow 10s ease infinite;
            box-shadow: -2px 0px 5px rgba(0, 0, 0, 0.2);
            transition: right 0.8s ease-in-out;
            padding: 15px;
            display:flex;
            justify-content:center;
            z-index: 1000;
            overflow-y: auto;
            margin-top:5%;
            box-sizing: border-box; /* Ensures padding doesn't increase width */
        }

        /* TAB BUTTON STYLES */
        #menuTab14 {
            position: fixed;
            top: 10%;
            right: 70%;
            background: blue;
            color: white;
            padding: 10px;
            font-size: 16px;
            border-radius: 10px 10px 10px 10px;
            cursor: pointer;
            z-index: 1001;
            transform: translateY(-50%);
        }

        /* CONTENT INSIDE MENU */
        #menuContainer14 a {
            display: block;
            padding: 10px;
            text-decoration: none;
            color: black;
            font-size: 18px;
        }

        #menuContainer14 a:hover {
            background: #2BF8FF;
        }
        
        

        /* Responsive adjustments */
        @media (min-width: 850px) {
            #menuContainer14 {
                max-width: 100%;
                right: -100%; /* Specific pixel value for desktop */
            }
        }
.logoutbutton {
            position: fixed;
            top: 10%;
            left: 5%;
            background: blue;
            color: white;
            padding: 10px;
            font-size: 16px;
            border-radius: 10px 10px 10px 10px;
            cursor: pointer;
            z-index: 1001;
            transform: translateY(-50%);
        }
        .logoutbutton1 {
            
            background: blue;
            color: white;
            
            padding: 10px;
            font-size: 16px;
            border-radius: 10px 10px 10px 10px;
            cursor: pointer;
            z-index: 1001;
            transform: translateY(-50%);
        }
        @keyframes gradientFlow {
            0% {
                background-position: 0% 50%;
            }
            50% {
                background-position: 100% 50%;
            }
            100% {
                background-position: 0% 50%;
            }
        }
    