*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: "sans-serif";
	text-decoration: none;
	scroll-behavior: smooth;
}
body
{
	background: linear-gradient(#2b1055,#7597de);
}
header
{
	background: linear-gradient(to bottom, #242242, transparent);
	text-align: center;
	align-items: center;
	position: fixed;
	top: 0; left: 0; right: 0;
	width: 100%;
	padding: 20px 30px;
	display: flex;
	justify-content: space-between;
	z-index: 1000;
}
header .LOGO
{
	color: aliceblue;
	font-weight: 1000;
	font-size: 35px;
	text-transform: uppercase;
	letter-spacing: 2px;
}
header .navbar
{
	font-size: 1.3em;
	display: flex;
	justify-content: center;
	align-items: center;
}

header .navbar a
{
	margin-left: 20px;
	text-decoration: none;
	padding: 6px 15px;
	color: aliceblue;
	border-radius: 20px;
}
header .navbar a:hover
{
	background:#fff;
	color: #2b1055;
}
.Home
{
	position: relative;
	width: 100%;
	height: 100vh;
	padding: 0px;
	display: flex;
	justify-content: center;
	align-items: center;
}
section img#Cloud
{
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 9;
}
section img#Stars
{
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 8;
}
h1
{
	position:relative;
	text-align: center;
	align-items: center;
	top: -30px;
	color: aliceblue;
	z-index: 9;
	font-family: Cambria, 'Hoefler Text', 'Liberation Serif', Times, 'Times New Roman', 'serif';
	font-size: 500%;
}
#botton
{
	position: relative;
	padding: 10px 30px;
	display: inline-block;
	border-radius: 40px;
	border: 2px solid #2b1055;
	color: aliceblue;
	background: transparent;
	font-size: 1.5em;
	z-index: 11;
	align-items: center;
}
span
{
	background: #2b1055;
	height: 100%;
	width: 0;
	border-radius: 40px;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: -1;
	transition: 0.5s;
}
#botton:hover span{
	width: 100%;
}
#botton:hover
{
	border: none;
}

.About
{
	position: relative;
	padding: 100px;
	background:linear-gradient( #242242, #000);
}
.About h2
{
	position:relative;
	text-align: center;
	color: aliceblue;
	z-index: 9;
	right: 10px;
	font-family: Cambria, 'Hoefler Text', 'Liberation Serif', Times, 'Times New Roman', 'serif';
	font-size: 500%;
	margin-bottom: 80px;
}
.Text
{
	position: relative;
	display: flex;
	color: aliceblue;
	z-index: 9;
}
.Text p1
{
	position: relative;
	border-radius: 25px;
	left: 100px;
	width: 35%;
	height: 300px;
	font-size: 130%;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
}
.Text p2
{
	position: relative;
	border-radius: 25px;
	left: 320px;
	width: 35%;
	height: 300px;
	font-size: 130%;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
}
.About1
{
	position: relative;
	padding: 100px;
	background: #FFE8B4;
}
.About1 h3
{
	position:relative;
	text-align: center;
	color: aliceblue;
	z-index: 9;
	right: 20px;
	font-family: Cambria, 'Hoefler Text', 'Liberation Serif', Times, 'Times New Roman', 'serif';
	font-size: 500%;
	margin-top: -20px;
	margin-bottom: 200px;
}
section #Move
{
	top: 0;
	buttom: 0;
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	height: 120vh;
	background-image:image("pic/Move.jpg");
	background-size: cover;
	background-position: center;
}
.About1 p
{
	margin: 300px 100px 20px;
	padding: 50px;
	align-items: center;
	position:relative;
	color: #242242;
	border: 3px solid;
	border-radius: 40px;
	border-color: aliceblue;
	background: #FFFFFF; 
	opacity: 0.8;
	z-index: 9;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	font-size: 150%;
}
.About2
{
	position: relative;
	padding: 100px;
	background:linear-gradient(#FFE8B4, #FFDD86, #FFB8D6 );
}
.choose
{
	position: relative;
	border: 3px solid #fff;
	border-radius: 70px;
	background: #FF99B3;
	width: 80%;
	height: 100px;
	align-items: center
}
.About2 h4
{
	position:relative;
	text-align: center;
	align-items: center;
	color: aliceblue;
	z-index: 9;
	font-family: Cambria, 'Hoefler Text', 'Liberation Serif', Times, 'Times New Roman', 'serif';
	font-size: 500%;
	margin-bottom: 300px;
}
.row1
{
	position: relative;
	align-items: center;
	right: 240px;
	width: 50%;
	height: 50vh;
	display: flex;
	z-index: 9;
	margin: 150px 100px 100px;
}
.row1 a
{
	margin: 40px;
}
.row2
{
	position: relative;
	align-items: center;
	right: 240px;
	width: 50%;
	height: 50vh;
	display: flex;
	z-index: 9;
	margin: 100px;
}
.row2 a
{
	margin: 40px;
}
.Cute
{
	position: relative;
	padding: 100px;
	background: linear-gradient(#FFB8D6,#FFB8D6,#FFB8D6,#FFB8D6,#FFB8D6,#FFB8D6,#FFE8B4);
}
.TopicCute
{
	position: relative;
	right: -130px;
	border: 6px solid deeppink;
	border-radius: 20px;
	background: #fff;
	width: 70%;
	height: 210px;
	align-items: center;
	margin: 50px 100px;
}
.TopicCute img
{
	position: absolute;
	display: flex;
	padding: 15px;
	width: 200px;
	height: 200px;
}
h5
{
	position: relative;
	text-align: center;
	color:deeppink;
	z-index: 9;
	right: -60px;
	font-family: Cambria, 'Hoefler Text', 'Liberation Serif', Times, 'Times New Roman', 'serif';
	font-size: 400%;
	padding: 18px;
}
.MusicPic
{
	position: relative;
	padding: 100px;
}
.MusicPic img
{
	position: absolute;
	left: 120px;
	margin: -20px;
	width: 400px;
	height: 400px;
}
h6
{
	position:relative;
	left: 500px;
	text-align: left;
	color: aliceblue;
	z-index: 9;
	right: 20px;
	font-size: 500%;
	margin-bottom: 300px;
}

.Lyrics
{
	position: relative;
	display: flex;
	font-size: 15px;
	border-radius: 25px;
	left: 0;
	width: 38%;
	height: 100%;
	color: #00000;
	z-index: 9;
}
p
{
	position:relative;
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	font-size: 150%;
}
.Line
{
	border: 3px solid #fff;
}
.LinkPink
{
	position: relative;
	border: 3px solid deeppink;
	background: #fff;
	border-radius: 20px;
	width: 160px;
	height: 5vh;
	display: flex;
	margin-top: 30px;
}
.LinkPink a
{
	position: relative;
	color: deeppink;
	z-index: 9;
	font-size: 50%;
	padding: 3px;
	left: 12px;
}
.Energetic
{
	position: relative;
	padding: 100px;
	background: linear-gradient(#FFE8B4,#FFE8B4,#FFE8B4,#FFE8B4,#FFE8B4,#FFE8B4,#8CCAFF);
}
.TopicEnergetic
{
	position: relative;
	right: -130px;
	border: 6px solid #FFAE36;
	border-radius: 20px;
	background: #fff;
	width: 70%;
	height: 210px;
	align-items: center;
	margin: 50px 100px;
}
.TopicEnergetic img
{
	position: absolute;
	display: flex;
	padding: 15px;
	width: 200px;
	height: 200px;
}
.LinkYellow
{
	position: relative;
	border: 3px solid #FFAE36;
	background: #fff;
	border-radius: 20px;
	width: 160px;
	height: 5vh;
	display: flex;
	margin-top: 30px;
}
.LinkYellow a
{
	position: relative;
	color: #FFAE36;
	z-index: 9;
	font-size: 50%;
	padding: 3px;
	left: 12px;
}
.FeelGood
{
	position: relative;
	padding: 100px;
	background: linear-gradient(#8CCAFF,#8CCAFF,#8CCAFF,#8CCAFF,#8CCAFF,#8CCAFF,#FF874E);
}
.TopicFeelGood
{
	position: relative;
	right: -130px;
	border: 6px solid #2C3C9D;
	border-radius: 20px;
	background: #fff;
	width: 70%;
	height: 210px;
	align-items: center;
	margin: 50px 100px;
}
.TopicFeelGood img
{
	position: absolute;
	display: flex;
	padding: 15px;
	width: 200px;
	height: 200px;
}
.LinkBlue
{
	position: relative;
	border: 3px solid #2C3C9D;
	background: #fff;
	border-radius: 20px;
	width: 160px;
	height: 5vh;
	display: flex;
	margin-top: 30px;
}
.LinkBlue a
{
	position: relative;
	color: #2C3C9D;
	z-index: 9;
	font-size: 50%;
	padding: 3px;
	left: 12px;
}
.Hype
{
	position: relative;
	padding: 100px;
	background: linear-gradient(#FF874E,#FF874E,#FF874E,#FF874E,#FF874E,#FF874E,#D50003);
}
.TopicHype
{
	position: relative;
	right: -130px;
	border: 6px solid #FF5200;
	border-radius: 20px;
	background: #000000;
	width: 70%;
	height: 210px;
	align-items: center;
	margin: 50px 100px;
}
.TopicHype img
{
	position: absolute;
	display: flex;
	padding: 15px;
	width: 200px;
	height: 200px;
}
.LinkOrange
{
	position: relative;
	border: 3px solid #FF5200;
	background: #fff;
	border-radius: 20px;
	width: 160px;
	height: 5vh;
	display: flex;
	margin-top: 30px;
}
.LinkOrange a
{
	position: relative;
	color: #FF5200;
	z-index: 9;
	font-size: 50%;
	padding: 3px;
	left: 12px;
}
.Sexy
{
	position: relative;
	padding: 100px;
	background: linear-gradient(#D50003,#D50003,#D50003,#D50003,#151E3E);
}
.TopicSexy
{
	position: relative;
	right: -130px;
	border: 6px solid #B00002;
	border-radius: 20px;
	background: #000000;
	width: 70%;
	height: 210px;
	align-items: center;
	margin: 50px 100px;
}
.TopicSexy img
{
	position: absolute;
	display: flex;
	padding: 15px;
	width: 200px;
	height: 200px;
}
.LinkRed
{
	position: relative;
	border: 3px solid #B00002;
	background: #fff;
	border-radius: 20px;
	width: 160px;
	height: 5vh;
	display: flex;
	margin-top: 30px;
}
.LinkRed a
{
	position: relative;
	color: #FF5200;
	z-index: 9;
	font-size: 50%;
	padding: 3px;
	left: 12px;
}.Sad
{
	position: relative;
	padding: 100px;
	background: #151E3E;
}
.TopicSad
{
	position: relative;
	right: -130px;
	border: 6px solid #0C0851;
	border-radius: 20px;
	background: #000000;
	width: 70%;
	height: 210px;
	align-items: center;
	margin: 50px 100px;
}
.TopicSad img
{
	position: absolute;
	display: flex;
	padding: 15px;
	width: 200px;
	height: 200px;
}
.LinkDark
{
	position: relative;
	border: 3px solid #0C0851;
	background: #fff;
	border-radius: 20px;
	width: 160px;
	height: 5vh;
	display: flex;
	margin-top: 30px;
}
.LinkDark a
{
	position: relative;
	color: #0C0851;
	z-index: 9;
	font-size: 50%;
	padding: 3px;
	left: 12px;
}
#Info
{
	position: relative;
	display: flex;
	color: #fff;
	z-index: 9;
	font-size: 20px;
	margin-top: 30px;
}
#Info a
{
	position: relative;
	top: -10px;
	left: 995px;
}