@import url('https://fonts.googleapis.com/css2?family=Encode+Sans+Expanded:wght@100;200;300;400;500;600;700;800;900&family=Lunasima:wght@400;700&family=Sarala:wght@400;700&display=swap');

:root {
 --dark-green:#2B371B;
 --light-green:#819155;
 --yellow:#F9CF67;
 --brown: #906A37;
 --black:#082430;
 --navy:#164d64;
 }

iframe{padding-bottom:10px}

body{background-color:var(--dark-green);
	font-family:Lunasima
	
}

.maindiv{background-color:var(--light-green);
	width: 290px;
	margin-left:auto;
	margin-right:auto;
	padding-left:4px;
	padding-right:4px;
	padding-top:14px;
	padding-bottom:1px;
	margin-bottom:20px;
	filter: drop-shadow(0px 6px 10px #1a220f);
}
h1{text-align:center;
	line-height:1;
	margin:0;
	color:var(--dark-green);
	
}
h2{text-align:center;

	font-weight:400;
	margin:0;
	color: var(--dark-green);
}
h3{margin:1px;text-align:center;margin-bottom:10px;
	color:var(--dark-green)
}

a{color:var(--yellow);
	background-color: var(--brown);
	padding:2px;
	border-radius:5px
}
a:hover{color:var(--brown);
	background-color: var(--yellow)
}

p{margin:10px;
	padding-bottom:8px;
	color:var(--black)
}

hr{color:var(--dark-green)}

.weird{text-align:center;
	line-height:1.5
}

.song{color:var(--navy)}

@media only screen and (max-width: 790px){
	.maindiv{
	margin-left:auto;
margin-right:2%}
}
@media only screen and (min-width: 565px){.musicpreviewend{display:none}}
@media only screen and (max-width: 565px){
	.musicpreview{
	display:none}
	.maindiv{margin-left:auto;margin-right:auto}
	.musicpreviewend{display:grid}
}

.musicpreviewend{background-color:var(--light-green);
	width: 290px;
	margin-left:auto;
	margin-right:auto;
	padding-left:4px;
	padding-right:4px;
	padding-top:14px;
	padding-bottom:1px;
	margin-bottom:20px;
	filter: drop-shadow(0px 6px 10px #1a220f);
	}
	
.songpreview{border: 0; width: 260px; height: 340px; margin-left:auto; margin-right:auto}