body{
	background-color:black;
	color:white;
	margin:0;
	scroll-behavior:smooth;
}
nav{
	width:100%;
	height:60px;
	position:fixed;
	top:0;
}
.left{
	float:left;
}
.right{
	float:right;
}
.logo{
	font-size:40px;
	position:fixed;
	left:1%;
	margin:-0.7% 0% 0 0%;
}
.home{
	background-color:#383735;
	border-radius:50%;
	font-size:30px;
	padding:0.3%;
	margin:-0.5% 0.7% 0 3%;
}
.search_bar{
	width:455px;
	padding:0.5%;
	height:35px;
	background-color:#383735;
	margin:-1.5% 0 0 0;
	border-radius:40px;
	color:grey;
	font-size:19px;
}
.search{
	margin:1.5% 0 0 2%;
}
.browse{
	margin:1.5% 2% 0 0%;
	font-size:21px;
}
.log_in{
	background-color:white;
	font-size:19px;
	border-radius:40px;
	padding:1% 2%;
	color:black;
	font-weight:bold;
	margin:-0.8% 1% 0 1%;
}
.sign_up{
	margin:0 1%;
	color:darkgrey;
	font-weight:bold;
}
.download{
	margin:0 0%;
	color:darkgrey;
	font-weight:bold;
	font-size:19px;
	padding:0 3% 0 0;
}
.other{
	margin:0;
	width:320px;
	padding:0;
}
.sign_up:hover,
h2:hover,
.all:hover,
.cookie:hover,
.download:hover{
	color:white;
}
h2:hover,
.all:hover,
.title:hover,
.title2:hover,
.from:hover,
.from2:hover,
.cookie:hover{
	text-decoration:underline;
}
aside{
	width:23%;
	height:450px;
	position:fixed;
	top:11%;
	left:0.5%;
	border-radius:10px;
	background-color:#171716;
}
.lib{
	font-size:18px;
	margin:5% 0 0 5%;
}
.plus{
	margin:1%;
	margin:5% 5% 0 5%;
	color:darkgrey;

}
.scroll{
	width:85%;
	height:25%;
	overflow-y:scroll;
	margin:30% auto 3% auto;
	border-radius:10px;
}
.section{
	border-radius:10px;
	background-color:#383735;
	padding:3% 5%;
	margin:0 0 7% 0;
}
.bold{
	font-weight:bold;
	font-size:18px;
}
.normal{
	font-size:16px;
}
.about{
	font-size:13px;
	margin:2% 3%;
}
button[type="button"]{
	border:none;
	border-radius:40px;
	padding:5% 8%;
	background-color:white;
	font-weight:bold;
}
.margin{
	margin:2.5% 16%;
}
.eng{
	border:1px solid grey;
	border-radius:30px;
	margin:15% 16%;
	color:white;
	background-color:#171716;
	font-size:16px;
	padding:2% 5%;
}
main{
	width:69%;
	height:400px;
	background-color:#171716;
	border-radius:10px;
	position:fixed;
	padding:2% 3%;
	top:11%;
	right:0.5%;
	overflow-y:scroll;
}
.main{
	width:100%;
}
.heading{
	margin:0% 0 2% 0;
	height:50px;
}
.row1{
	width:900px;
	display:flex;
	height:320px;
	overflow:auto;
}
.row2{
	width:900px;
	height:400px;
	display:flex;
	height:260px;
	overflow:auto;
}
.row3{
	width:900px;
	height:400px;
	display:flex;
	height:290px;
	overflow:auto;
}
.all{
	margin:3% 2% 2% 0%;
}
.container{
	width:150px;
	height:270px;
	padding:5px;
	border-radius:8px;
	margin:1% 1%;
}
.container2{
	width:150px;
	height:230px;
	border-radius:8px;
	padding:5px;
	margin:0 1%;
}
.container:hover,
.container3:hover,
.container2:hover{
	background-color:#383735;
}
.song{
	width:150px;
	margin:-20px 0 0% -40px;
	border-radius:8px;
}
.artist{
	width:150px;
	height:150px;
	border-radius:50%;
	margin:-20px 0 0% -40px;
}
.play{
	display:none;
	background-color:green;
	border-radius:50%;
	font-size:30px;
	padding:8px;
	width:30px;
	height:30px;
	margin:0 0 -72% 0;
	position:relative;
	bottom:50px;
	left:80%;
	z-index:3;
}
.container:hover .play,
.container3:hover .play,
.container2:hover .play{
	display:inline-block;
}
.title{
	font-size:19px;
	margin:0% 0 0 5px;
}
.title2{
	font-size:19px;
	text-align:center;
	margin:0% 0 0 0;
}
.container:hover .title,
.container3:hover .from3,
.container2:hover .title2{
	margin-top:-45px;
}
.from{
	color:grey;
	font-size:17px;
	margin:0 0 0 5px;
}
.from2{
	color:grey;
	text-align:center;
	font-size:17px;
	margin:0 0 0 0;
}
.from3{
	color:grey;
	font-size:17px;
	margin:0 0 0 5px;
}
.container3{
	width:150px;
	height:230px;
	padding:5px;
	border-radius:8px;
	margin:1% 1%;
}
.white{
	font-weight:bold;
	color:white;
	margin:7% 0;
	font-size:19px;
}
.list{
	margin:3% 0% 2% 0%;
	width:15%;
}
.list2{
	margin:3% 0% 2% 0%;
	width:18%;
}
.foot{
	height:250px;
	margin-top:100px;
	font-size:15px;
	background-color:#171716;
	column-count:5;
}
.hr{
	margin-top:15%;
}
.footer{
	color:grey;
	margin:7% 0;
	font-size:17px;
}
.icon{
	font-size:22px;
	background-color:#383735;
	padding:5px;
	margin:6% 1.1%;
	border-radius:50%;
}
.divider{
	margin:1% 0 8% 0;
}
.foot_note{
	width:100%;
	height:70px;
	position:fixed;
	bottom:0;
	background: #e046e0;
	background: linear-gradient(90deg, rgba(224, 70, 224, 1) 0%, rgba(108, 80, 217, 1) 53%, rgba(74, 174, 240, 1) 100%);
}
.p{
	margin-left:1%;
	font-size:18px;
}
.preview{
	font-weight:bold;
}
.sign{
	
	background-color:white;
	font-size:16px;
	border-radius:40px;
	padding:1% 2%;
	color:black;
	font-weight:bold;
	margin:1% 1% 0 1%;
	border:none;
}
.footer:hover{
	color:white;
}.icon:hover{
	background-color:grey;
}