.st1 .logo {animation: col 3s linear infinite;}

.motion a:hover {
		background-color:#f5ec4f;
			 color: black;
	}
		 .trid a:hover {
		background-color:#bcee23;
			 color: black;
	}
		 .gd a:hover {
		background-color:#25fbc5;
			 color: black;
	}
		 .web a:hover {
		background-color:#a7b3ff;
			 color: black;
	}
		 .game a:hover {
		background-color:#ff999e;
			 color: black;
	}
		 .ill a:hover {
		background-color:#ffd145;
			 color: black;
	}
		 .gif a:hover {
		background-color:#8cee8a;
			 color: black;
	}
		 .com a:hover {
		background-color:#D7D7D7;
			 color: black;
	}

@keyframes col {
  12.5% {
    fill: #f5e04f;
  }
 
  20% {
    fill: #bcee24;
  }
 
 
 
  50% {
    fill: #00f1eb;
  }
	
  70% {
    fillr: #ff9fee;
  }

 
  
	
	100% {
    fill: #f5e04f;
  }
}

	
div.rainbow  {
  background-color: #f5e04f;
  animation: bgColor 20s infinite linear;
  position: absolute;
  top: 100%;
  left: 50%;
	width: 100%;
	font-family: 'Inter', sans-serif;
    	font-size:18px;
	font-weight:600;     
      letter-spacing: 0px;
transform: translate(-50%, -100%);
 color:black;
 padding: 15px 16px;
border-radius : 0px;
  pointer-events: none;
	text-align: center;
}



div.rain  {
  background-color: #f5ec4f;
  animation: bgColor 20s infinite linear;
  width: 100%;
  height: 100px;
	border: 1px;
	border-color: black;
}

nav ul{
	background-color: #f5ec4f;
  animation: bgColor 20s infinite linear;
	
}
@keyframes bgColor {
  12.5% {
    background-color: #f5e04f;
  }
 
  20% {
    background-color: #bcee24;
  }
 
 
 
  50% {
    background-color: #00f1eb;
  }
	
  70% {
    background-color: #ff9fee;
  }

 
  
	
	100% {
    background-color: #f5e04f;
  }
}



table{

padding-top: 0px;
	margin-top: 0px;
	
}

tr {
padding-top: 0px;	
	
}
td {
	padding-bottom: 0px;
	padding-top: 0px;
	padding-left: 0px;
	padding-right: 0px;
}


.main-container {
  width: 100%;
	padding-top: 0px;
margin-top: 0px;
  font-family: "Roboto", sans-serif;
 border-radius: 0px;
  overflow: hidden;
 
}


	

.video {
padding-top: 0px;
	margin-top: 0px;
	width: 100%;
  position: relative;
}


.video video {
	padding-top: 0px;
	margin-top: 0px;
  width: 100%;

}


.video .hover-text {
  background: #f5ec4f;
	
  color:black;
   position: absolute;
  top: 100%;
  left: 50%;
	width: 100%;
	font-family: 'Inter', sans-serif;
    	font-size:18px;
	font-weight:600;     
      letter-spacing: 0px;
transform: translate(-50%, -100%);
  
 padding: 15px 16px;
 border-radius: 0px;
  pointer-events: none;
	text-align: center;
opacity: 100%;

}

.video .hover-text.active {
	background: #f5ec4f;
 color: rgba(0, 0, 0, 0.8);
	font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600;     
    
 opacity: 1;
  letter-spacing: 0;
  transform: translate(-50%, -100%);
 
}

.hover-text2 {
  
  position: absolute;
  top: 100%;
  left: 50%;
	width: 100%;
	font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
transform: translate(-50%, -100%);
  background: #bcee23;
  color:black;
padding: 15px 16px;
border-radius: 0px;
  pointer-events: none;
opacity: 100%;

}

.hover-text2.active {
		 background: #bcee23;
  color: rgba(0, 0, 0, 0.7);
font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
 opacity: 1;
  letter-spacing: 0;
  transform: translate(-50%, -100%);
}

 
.hover-text3 {
  
  position: absolute;
  top: 100%;
  left: 50%;
	width: 100%;
	font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
transform: translate(-50%, -100%);
  background: #25fbc5;
  color:black;
padding: 15px 16px;
border-radius: 0px;
  pointer-events: none;
opacity: 100%;

}

.hover-text3.active {
		background: #25fbc5;
  color: rgba(0, 0, 0, 0.7);
font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
 opacity: 1;
  letter-spacing: 0;
  transform: translate(-50%, -100%);
}

.hover-text4 {
  
  position: absolute;
  top: 100%;
  left: 50%;
	width: 100%;
	font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
transform: translate(-50%, -100%);
  background: #a7b3ff;
  color:black;
padding: 15px 16px;
border-radius: 0px;
  pointer-events: none;
opacity: 100%;

}

.hover-text4.active {
		
	background: #a7b3ff;
 color: rgba(0, 0, 0, 0.7);
font-family: 'Inter', sans-serif;
	
    text-align: center;
	font-size:18px;
	font-weight:600; 
 opacity: 1;
  letter-spacing: 0;
  transform: translate(-50%, -100%);
}

.hover-text5 {
  
  position: absolute;
  top: 100%;
  left: 50%;
	width: 100%;
	font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
transform: translate(-50%, -100%);
  background: #ff999e;
  color:black;
padding: 15px 16px;
border-radius: 0px;
  pointer-events: none;
opacity: 100%;

}

.hover-text5.active {
		 background: #ff999e;
 color: rgba(0, 0, 0, 0.7);
font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
 opacity: 1;
  letter-spacing: 0;
  transform: translate(-50%, -100%);
}


.hover-text6 {
  
  position: absolute;
  top: 100%;
  left: 50%;
	width: 100%;
	font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
transform: translate(-50%, -100%);
  background: #ffd145;
  color:black;
padding: 15px 16px;
border-radius: 0px;
  pointer-events: none;
opacity: 100%;

}

.hover-text6.active {
		 background: #ffd145;
   color: rgba(0, 0, 0, 0.7);
font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
 opacity: 1;
  letter-spacing: 0;
  transform: translate(-50%, -100%);
}


.hover-text7 {
  
  position: absolute;
  top: 100%;
  left: 50%;
	width: 100%;
	font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
transform: translate(-50%, -100%);
  background: #8cee8a;
  color:black;
padding: 15px 16px;
border-radius: 0px;
  pointer-events: none;
opacity: 100%;

}

.hover-text7.active {
		 background: #8cee8a;
   color: rgba(0, 0, 0, 0.7);
font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
 opacity: 1;
  letter-spacing: 0;
  transform: translate(-50%, -100%);
}

.hover-text8 {
  
  position: absolute;
  top: 100%;
  left: 50%;
	width: 100%;
	font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
transform: translate(-50%, -100%);
  background:#D7D7D7;
  color:black;
padding: 15px 16px;
border-radius: 0px;
  pointer-events: none;
opacity: 100%;

}

.hover-text8.active {
  background:#D7D7D7;
color: rgba(0, 0, 0, 0.8);
font-family: 'Inter', sans-serif;
    text-align: center;
	font-size:18px;
	font-weight:600; 
 opacity: 1;
  letter-spacing: 0;
  transform: translate(-50%, -100%);
}