.Logo {
    color: #001133;
    position: fixed;
    transition: 0.5s;
    font-size: 24pt;
    z-index: 100;
}
.Logo:hover {
    background: linear-gradient(to right, #000000, #ffffff, #777777, #aa00ff, #000000);
    background-size: 125%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: inline-block; /* Ensures the gradient fits the text width */
    font-size: 35pt;
    animation: fade 5s ease-in-out infinite;
    cursor:pointer;
    font-style: italic;
}
@keyframes fade{
    0% {background-position: 0,0;}
    100% {background-position: 1000%,0;}
}
.ChangeTheme{
    background-color: grey;
    border-radius: 5px;
    border: 5px solid #000000 ;
    height: 50px;
    width: 200px;
    z-index: 1;
    float: left;
    margin-top: 23%;
}
.window{
    height: 200px;
    width: 150px;
    border: 5px solid rgb(0, 0, 0);
    padding: 0%;
    float: left;
    background-color: rgb(219, 219, 219);
    margin: 5px;
    border-width: 3px;  
    border-radius: 10px;
    transition: 0.3s;
}
.window:hover{
    height: 225px;
    width: 175px;
    background-image: linear-gradient(to right, #ff0000, #ffaa00, #ffff00, #00ff00, #0000ff, #aa00ff, #ff0000);
    background-size: 200%;
    background-blend-mode: color;
    animation: windowhoveranim 1s ease-in-out infinite;
}
@keyframes windowhoveranim{
    0% {background-position: 0 0;}
    50% {background-position: 100% 0}
    100% {background-position: 200% 0;}
}
.windowlist{
    position: absolute;
    width: 900px;
    height: 200px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.WindowTitle{
    display: flex;
    justify-content: center;
}

@media (max-width: 600px) {
    .windowlist {
        max-width: 100%;
    }
}

.ideatext {
    transition: 0.3s;
    font-size: 12pt;
}
.ideatext:hover{
    animation: ideabounce 1s ease-in-out infinite;
    font-size: 17pt;
}

@keyframes ideabounce{
}