
.font-exo {
  font-family: "Exo", sans-serif;
  font-optical-sizing: auto;
  font-weight: 350;
  font-style: normal; }

#tv-screen {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-width: 135px;
    min-height: 500px;
    background-color: rgb(0, 0, 0);
}

#ps3-wave {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index:0;}

#master-hud
{ 
    top: 10px;
    left: 10px;
    width: 400px;
    height: 110px;
    background-color: transparent;
    position: Absolute;
    z-index: 1;   
}

#left-hud {
    width: 39%;
    height: 100%;
    background-color: transparent;
    position: Absolute;   
}

#artist-photo {
    position: absolute;
    top: 5px;
    left: 110px;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: rgb(255, 255, 255);
}

#artist-name {
    position: absolute;
    left: 150px;
    top: 13px;
    color: white;
}

#album-cover {
    position: absolute;
    top: 5px;
    left: 5px;
    width: 100px;
    height: 100px;
    background-color: rgb(213, 100, 1);
}

#track-name {
    position: absolute;
    left: 110px;
    top: 90px;
    color: white;
}

#progress-bar {
    left: 110px;
    top: 50px;
    position: absolute;
    color: rgb(7, 34, 211);
}

#ship-icon {
    position: absolute;
    top: 1px;
    left: 5px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: rgb(213, 1, 75);}
#bottom-hud {
    bottom: 10px;
    left: 10px;
    width: 70px;
    height: 300px;
    background-color: rgba(8, 26, 227, 0.8);
    position: Absolute; }

#bottom-right-hud {
        bottom: 10px;
        right: 10px;
        width: 150px;
        height: 150px;
        background-color: transparent;
        position: absolute;}

.info-button {
    display: block;
    text-decoration: none;
    text-align: center;
    margin: 5px;    
    padding: 5px;
    text-align: center;
    transition: all 0.3s ease;
    background: #079a895d; 
    color: #00ffb76a;
    backdrop-filter: blur(10px);
    clip-path: polygon(
        10px 0%, 
        100% 0%, 
        100% calc(100% - 10px), 
        calc(100% - 10px) 100%, 
        0% 100%, 
        0% 10px);
   }

.info-button:hover {
    font-weight: 600;
    color: #00000075;
    background-color: #5042b8cd;;
    transform: scale(1.05);
    filter: drop-shadow(0 0 8px #00ff80);
    box-shadow: inset 0 0 8px #00ff80;
     
}