.titlelabel {
position: absolute;
--vw-multiple: 0.0115;
top: calc(var(--vw-multiple) * 100vw ); /* Center vertically */
transform: translateY(-50%);
color: #000000;
padding-left: .3vw;
padding-right: .3vw;

background: rgba(255, 255, 255, 1); /* Light background for better readability */
font-size: 2.5vh;
pointer-events: auto; /* Allow interaction with text */
z-index: 1000; /* Ensure text is above the canvas */
}

#myName {
  left: 2.5vw;
  justify-content: left;  
  font-weight: normal;
  text-decoration: none;
  /*cursor: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAARCAYAAADkIz3lAAAACXBIWXMAAAsSAAALEgHS3X78AAAAhklEQVQokYXQUQ3DMAxF0esiSBGUwqAMQiENQiGtDAphDN5+PDX17NRSFCU+cuyYJH5hZuchxFQlhlCSSTJgBnZC8rKABrwBdfstan8wQ35/wgpd4AiFtlgdHRWSxORVABbgWX6kl926Xtb06a6HIY4NlzibLsXphBlOYcAfoJXQ8Qt4SOILvdUBrpzLlWUAAAAASUVORK5CYII='), auto;
  cursor: url('assets/pointer.png'), auto;*/
  transition: color 0.3s ease;
}

#myName.hidden {
  color: transparent;
}

#location {
  left:48%;justify-content: center;
  text-decoration-color: transparent;
  padding-top: 3px;
  padding-bottom: 4px;
}

#dayOfWeek {
  right:2.5vw;justify-content: right;
  transition: color 0.3s ease;
}

#dayOfWeek.hidden {
  color: transparent;
}

   
.navbar {
font-size: 22px;
position: fixed;
bottom: 0;
margin-bottom: 2.5vh;
left: 3%;
width: 100%;
padding: 10px;
text-align: left;
cursor: auto;
cursor: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAARCAYAAADkIz3lAAAACXBIWXMAAAsSAAALEgHS3X78AAAAlElEQVQokX2QsQ3DMAwEj65cZoSMkJHsTTRCNrBHyAgZIaO4TPdpSCOWRBEgoBdO/BeRhCSAJ/AIXXdABRBwZHCAN+AzgvmzHsLXVwO4zZLA/R924C7Ygd8TSUk6gN3lfTRx8Wny87nskkGSaKzNbAE2l6ukHbiCGRQV1q/arsp8gikUGecq5mZm8i5xOQHfZomd+gHHDfP/QCLt0QAAAABJRU5ErkJggg==')10 10, auto;
/*cursor: url('assets/pointer.png'), auto;*/
}

.navtabs {
  text-decoration: none;
  font-weight: bold;
  /*cursor: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAARCAYAAADkIz3lAAAACXBIWXMAAAsSAAALEgHS3X78AAAAlElEQVQokX2QsQ3DMAwEj65cZoSMkJHsTTRCNrBHyAgZIaO4TPdpSCOWRBEgoBdO/BeRhCSAJ/AIXXdABRBwZHCAN+AzgvmzHsLXVwO4zZLA/R924C7Ygd8TSUk6gN3lfTRx8Wny87nskkGSaKzNbAE2l6ukHbiCGRQV1q/arsp8gikUGecq5mZm8i5xOQHfZomd+gHHDfP/QCLt0QAAAABJRU5ErkJggg==')10 10, auto;
  cursor: url('assets/pointer.png'), auto;*/
}

#rive-canvas:hover ~ #location {
  text-shadow: 0px 5px 3px rgba(0, 0, 0, 0.5);
  transition: text-shadow 0.4s ease-in-out;
}

#portfolio-link {color: red}
#playground-link {color: limegreen; ;}
#profile-link {color: blue;}
#server-link {color: rgb(0, 0, 0);}
#questions-link {color: rgb(171, 171, 171); }



.navbar p:hover .questions-link {
  text-shadow: 0px 0px 5px rgb(255, 255, 255);
  text-decoration: underline;
}

a:hover {
  text-decoration: underline;
}

#canvasView {
  position: fixed;
  left:1%;
  height: 110px; /*Decide if you want this*/
  overflow: visible;
  /*cursor: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAARCAYAAADkIz3lAAAACXBIWXMAAAsSAAALEgHS3X78AAAAhklEQVQokYXQUQ3DMAxF0esiSBGUwqAMQiENQiGtDAphDN5+PDX17NRSFCU+cuyYJH5hZuchxFQlhlCSSTJgBnZC8rKABrwBdfstan8wQ35/wgpd4AiFtlgdHRWSxORVABbgWX6kl926Xtb06a6HIY4NlzibLsXphBlOYcAfoJXQ8Qt4SOILvdUBrpzLlWUAAAAASUVORK5CYII='), auto;
  cursor: url('assets/pointer.png'), auto;*/
  cursor: default;
}

#rive-canvas {
  width: 100%;
  /*max-width: 100%;*/
  height: auto;
}