body{
	background-color: #1e194b;
	height:auto;
	margin:0;
}
::-webkit-scrollbar {
    width: 5px;
    background: transparent;
}
::-webkit-scrollbar-thumb  {
  background: #0000001A;
}
.header_span{
	font-family: 'Galindo';
	font-size: 11px;
	color: white;
	text-decoration: none;
	cursor: default;
}
.header_span:hover{
	text-decoration: underline;
	cursor: pointer;
}
.about_title{
	font-family: 'Galindo';
	font-size: 22px;
	color: white;
	text-decoration: none;
	cursor: default;
	text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
}
.big_title{
	font-family: 'Galindo';
	font-size: 30px;
	color: #ffffffc7;
	text-decoration: none;
	cursor: default;
	display: block;
	width: fit-content;
	margin: 0 auto;
	letter-spacing: 2px
}
.about_text{
	font-family: 'Galindo';
	font-size: 12px;
	color: #ffffffde;
	text-decoration: none;
	cursor: default;
	letter-spacing: 0.5px;
}
.get_btn{
	cursor: default;
	box-shadow: none;
	width: 128px;
	object-fit: contain;
	border-radius: 10px;
}
.get_btn:hover{
	cursor: pointer;
	box-shadow: 0px 0px 2px 0px #ffffff
}
.shiroletter{
	color: #000000;
	font-family: 'Shirokuma';
	font-weight: 600;
	font-size: 50px;
}
.dot{
	background-color: black; 
	height: 8px; 
	width: 8px; 
	border-radius: 15px;
	margin: 10px;
	opacity: 0.3;
}
.loadquote{
	color: #000000;
	font-family: 'Butcher';
	font-weight: 600;
	font-size: 30px;
	letter-spacing: 0.3px;
	text-align: center;
	width: 35vw;
	margin: 50px auto 0 auto;
}
.utm{
	color: #000000;
	font-family: 'Pangolin';
	font-weight: 600;
	font-size: 20px;
	letter-spacing: 0.3px;
	text-align: center;
	margin: 10px auto 0 auto;
}
.quote_author{
	color: #FFFFFF;
	font-family: 'TrebuchetMS';
	opacity: 0.8;
	font-weight: bolder;
	font-size: 13px;
	letter-spacing: 1px;
	text-align: center;
	max-width: 60%;
	margin: 00px auto 30px auto;
}
.show_img{
	width: 90px;
	height: 90px;
	border-radius: 10px;
	margin: 10px;
	border: 2px solid transparent;
	cursor: pointer;
	filter: saturate(1);
}
.show_img_desaturate{
	filter: saturate(0);
}
.show_info{
	color: white;
	font-family: 'TrebuchetMS';
	font-weight: bolder;
	font-size: 13px;
	letter-spacing: 1px;
	text-align: center;
	opacity: 0.8;
}
.play_button{
    padding: 10px 45px;
    font-family: 'TrebuchetMS';
    font-weight: bolder;
    background: n;
    border: none;
    cursor: pointer;
    background: #5d1443;
    color: #FFFFFF;
    letter-spacing: 2px;
    font-size: 12px;
    border-radius: 5px;
}
.menu_item{
	height: 20px; 
	cursor: pointer; 
	margin: auto 12px;
	opacity: 0.8;
}
#menu_1{
	display: none; 
	width: 100%; 
	position: absolute; 
	margin: 0 6vw; 
	bottom: 15px;
}
#menu_2{
	display: flex; 
	width: auto; 
	position: absolute; 
	margin: 0 6vw; 
	bottom: 15px; 
	background: #00000080; 
	border-radius: 50px;
}
#profile{
	width: 35px; 
	height: 35px; 
	border-radius: 50px; 
	cursor: pointer; 
	border: 2px solid black;
}
#show_infopanel{
	display: none; 
	position: fixed; 
	width: 100%; 
	bottom: 0%; 
	height: 60px; 
	background: #02010f; 
	flex-direction: column;
}
#divi{
	width: 100%; 
	background: linear-gradient(91deg, #8667f9, #530017); 
	height: 2px; 
	margin: 0 auto;
}
.show_info_ico{
	opacity: 0.6; 
	width: 17px; 
	height: 17px;
}
#info_divi{
	width: 2px; 
	background-color: #b4b4b4; 
	height: 30px; 
	margin: auto 20px;
}
#show_name{
	font-size: 15px;
	margin: auto 0;
}
#vera{
	width: 275px; 
	height: 438px; 
	align-self: center; 
	pointer-events: none;
}
#vera_line1{
	background-color: black; 
	height: 4px; 
	width: 350px; 
	margin: 0 auto;
}
#vera_line2{
	background-color: black; 
	height: 3px; 
	margin: 10px auto 0 auto; 
	width: 190px;
}
#acc{
	width: 22px; 
	height: 22px; 
	padding: 6px 15px; 
	background: #00000080; 
	border-radius: 50px; 
	cursor: pointer;
}
#signup{
	color: #000000; 
	margin: auto 10px; 
	font-size: 15px; 
	text-shadow: -2px 1px 2px #FFFFFF;
}
@media screen and (orientation: portrait) and (any-pointer: coarse)
{
	.loadquote{
		max-width: 100%;
	}
	#signup{
		font-size: 35px; 
		text-shadow: 3px -2px 2px #FFFFFF;
	}
	.show_img{
		width: 180px;
		height: 180px;
		margin: 20px;
	}
	.menu_item{
		height: 50px; 
		cursor: pointer; 
		margin: auto 20px;
		opacity: 0.8;
		padding: 20px;
	}
	#acc{
		width: 50px;
		height: 50px;
		padding: 15px 30px;	
		background: #00000052;
	}
	#profile{
		width: 90px;
		height: 90px;
	}
	#menu_1{
		bottom: 20%;
	}
	#show_infopanel{
		height: 130px;
	}
	.play_button{
		padding: 20px 20px 20px 30px;
		width: 100px;
		height: 100px;
		border-radius: 100px;
		font-size: 30px;
	}
	#divi{
		height: 5px; 
		background-color: #5e5e5e;
	}
	.show_info{
		font-size: 30px;
	}
	.show_info_ico{
		height: 40px;
		width: 40px;
	}
	#show_added{
		display: none;
	}
	#info_divi{
		display: none;
	}
	#show_name{
		font-size: 25px;
	}
	.shiroletter{
		font-size: 100px;
	}
	.dot{
		margin: 20px 15px;
		height: 16px;
		width: 16px;
	}
	#vera{
		width: 450px;
		height: 715px;
	}
	#vera_line1{
		width: 520px;
		height: 6px;
	}
	#vera_line2{
		width: 420px;
		height: 4px;
		margin: 20px auto 0 auto
	}
	.loadquote{
		width: 80vw;
		font-size: 60px;
		margin: 120px auto 0 auto;
	}
	.quote_author{
		font-size: 30px;
		margin: 15vh auto 30px auto;
	}
	.utm{
		font-size: 30px;
		margin: 30px auto 0 auto;
	}
}
#popup_ok{
	font-family: 'TrebuchetMS'; 
	font-size: 12px; 
	font-weight: 900; 
	color: #000000CC; 
	padding: 10px 20px; 
	cursor: pointer;
}
#popup_ok:hover{
	color: #000000; 
}
.loader {
  border: 7px solid #cbcbcb; /* Light grey */
  border-top: 7px solid #9E3D48; /* Blue */
  border-radius: 50%;
  width: 40px;
  height: 40px;
  animation: spin 2s linear infinite;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -20px;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
/*.tabeA{
	border-radius: 15px;
	background-color: #000000cc;
	color:white;
	font-family: 'TrebuchetMS'; 
	font-size: 12px;
	padding: 5px 25px;
	font-weight: bolder;
	margin: 0 8px;
	opacity: 1;
	cursor: pointer;
}
.tabeD{
	border-radius: 15px;
	background-color: #000000cc;
	color:white;
	font-family: 'TrebuchetMS'; 
	font-size: 12px;
	padding: 5px 25px;
	font-weight: bolder;
	margin: 0 8px;
	opacity: 0.4;
	cursor: pointer;
}*/