#userLoginUI {
	display: none;
    width: 300px;
    margin: 30px auto;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

	font-size: 12px;
}

#userNameContainer {
 	padding: 14px;
}

#shineBoxLeft {
  display: block;
  width: 387px;
  height: 269px;
  position: absolute;
  top: -74px;
  left: -217px;
  pointer-events: none;
  transform: rotate(115deg);
  background: linear-gradient(50deg, rgb(152 152 152 / 19%), rgb(255 0 0 / 0%));
}

#userLoginInput[type=text] {
	width: 100%;
    padding: 8px 5px;
    background: linear-gradient(#1f2124, #27292c);
    border: 1px solid #222;
    box-shadow: 0 1px 0 rgba(255,255,255,0.1);
    border-radius: 0.3em;
    margin-bottom: 20px;
    box-sizing: border-box;
	color: white;
}

#userLoginInput[type=text]:hover {
 	background:#27292c;
}

#nameTitle {
  padding:8px 5px;
}

#userLoginPlayButton {
	padding: 5px 20px;
    font-size: 13px;
    margin: 10px 10px 10px;
    width: 93%;
    height: 40px;
}

#commandsFeedback {
	pointer-events: none;
    position: absolute;
    left: 16px;
    top: 131px;
    /* height: 221px; */
    width: 266px;
    opacity: 0;
}

.commandsFeedback_fade {
	animation-name: commandsFeedback_fade;
	animation-duration: 4s;
}
 
@keyframes commandsFeedback_fade {
	0% {
	   opacity: 0;
	}

	10% {
		opacity: 1;
	}
 
	75% {
	   opacity: 1;
	}
 
	100% {
	   opacity: 0;
	}
}

.animated_rainbow_1 {
    background: linear-gradient(90deg, #f00,#ff2b00,#f50,#ff8000,#fa0,#ffd500,#ff0,#d4ff00,#af0,#80ff00,#5f0,#2bff00,#0f0,#00ff2b,#0f5,#00ff80,#0fa,#00ffd5,#0ff,#00d4ff,#0af,#007fff,#05f,#002bff,#00f,#2a00ff,#50f,#7f00ff,#a0f,#d400ff,#f0f,#ff00d4,#f0a,#ff0080,#f05,#ff002b,#f00);
    color: #0000;
    -webkit-background-clip: text;
    background-clip: text;
    display: inline-block;
	animation: animatedBackground_a 5s linear;
}

@keyframes animatedBackground_a {
    0% { 
		background-position: 0 0;
		opacity: 0;
	}

	10% {
		opacity: 1;
	}
 
	75% {
	   opacity: 1;
	}

    100% { 
		background-position: 1000px 0;
		opacity: 0;
	}
}