body {
			font-family: Verdana;
			background: rgb(0,0,0);
			overflow: auto;
			margin: 0;
			padding: 0;
		}
		
		.lilita-one-regular {
		  font-family: "Lilita One", serif;
		  font-weight: 400;
		  font-style: normal;
		}
		
		a {
			text-decoration: none;
			color: #222;
			transition: 0.3s;
		}
		
		a:visited {
			text-decoration: none;
			color: #222;
			transition: 0.3s;
		}
		
		a:hover {
			text-decoration: none;
			color: #777;
			transition: 0.3s;
		}

	
		div.topcontainer {
			background: rgb(255, 194, 0);
			width: 100%;
			position: relative;
			right: 0px;
		}
	
		div.logo {
			background-image:url(media/ss-logo.png);
			background-position: center;
			background-size: initial;
			background-repeat: no-repeat;
			margin: auto;
			padding: 10px;
			width: 350;
			height: 178;
		}
		
		div.links {
			color: #222222;
			font-size: 50px;
			font-family: Lilita One;
			margin: auto;
			width: 90%;
			text-align: center;
			transition: 0.3s;
		}
		
		div#small {
			color: #222222;
			font-size: 32px;
			text-decoration: none !important;
		}
		
		
		div.text {
			margin: 0;
			color: #fff;
			font-size: 24px;
			text-align: center;
			font-family: Lilita One;
			background: #000;
			position: absolute;
			left: 0px;
			width: 100%;
			float: left;
			margin-top: 20px;
			z-index: 2;
		}
		
		div.textbox {
			padding: 40px;
		}
		
		div.text a {
			color: #fff;
			text-decoration: underline;
			transition: 0.2s;
		}
		
		div.text a:hover {
			color: #FFC200;
			text-decoration: underline;
			transition: 0.2s;
		}
		
		audio {
		  width: 500px;
		  border-radius: 24px;
		  position: relative;
		  top: 50px;
		  left: 100px;
		  z-index: 50;
		  visibility: hidden;
		}
		
		/* Tooltip container */
		.tooltip {
		  position: relative;
		  display: inline-block;
		  cursor: pointer;
		}

		/* Tooltip text styling */
		.tooltip .tooltiptext {
		  width: 250px;
		  background-color: #222;
		  color: #fff;
		  text-align: center;
		  border-radius: 6px;
		  padding: 8px;
		  position: absolute;
		  z-index: 1;
		  bottom: 125%; /* Position above the tooltip */
		  left: 50%;
		  font-size: 32px;
		  transform: translateX(-50%) scale(0.5);
		  opacity: 0;
		  transition: opacity 0.3s ease, transform 0.3s ease;
		  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
		  pointer-events: none; /* Prevent interactions when hidden */
		}

		/* Tooltip arrow */
		.tooltip .tooltiptext::after {
		  content: "";
		  position: absolute;
		  top: 100%; /* Arrow at the bottom of the tooltip */
		  left: 50%;
		  transform: translateX(-50%);
		  border-width: 5px;
		  border-style: solid;
		  border-color: #222 transparent transparent transparent;
		}

		/* Show tooltip on hover */
		.tooltip:hover .tooltiptext {
		  opacity: 1;
		  transform: translateX(-50%) scale(1);
		  pointer-events: auto; /* Enable interactions when visible */
		}