:root { --dark: #010101;
			--mid: ;
			--dull: ;
			--pale: ;
			--light: #ddd;
			
			--primary: #123456;
			--secondary: #654321;
}

body {background:var(--light);font-family:trebuchet ms;background:url('img/bg-05.png');}

	a {color: var(--primary);transition:color .5s;text-decoration:none;}
	a:hover {color: var(--secondary);}

.top {text-align:center;margin:3rem auto;}
.mainwrap {display:flex;}

.left {position:relative; overflow:hidden;min-height:90vh;margin-bottom:2rem;width:20vw;border-right:2px solid black;}  
.left iframe {height:1000000000%;width:100%;position:absolute;}
#yakunav {text-align:right;background:none;}
#yakunav a {display:block;font-size:1rem;}
#yakunav h2 {border-bottom:2px dotted black;font-size:1.2rem;}



.right {padding:0 2rem;width:100%;}
	.latesthold {display:flex;flex-wrap:wrap;}
	.latestblock {display:flex;flex-direction:column;width:300px;align-items:center;justify-content:center;text-align:center;}
	.latestblock img {width:250px; aspect-ratio: 1 / 1;transition: transform .5s;margin:1rem;}
	.latestblock span {font-size:.8rem;font-weight:600;border-bottom:2px dotted var(--dark);display:block;width:100%;transition:border-bottom-color .5s, letter-spacing .5s;padding-bottom:.25rem;}
	.latestblock h2 {font-size:1.1rem; margin: .5rem 1rem;transition: letter-spacing .5s;}
	
	.latestblock:hover a {color:black;}
	.latestblock:hover img {transform:scale(1.05);}
	.latestblock:hover h2, .latestblock:hover span {letter-spacing:2px;border-bottom-color:var(--secondary);}
	
/*about*/
	.abouthold {}
	.abouthold b {display:block;margin-top:2rem;}
	
/* artist pages */

	.artname {border-bottom:2px dotted var(--dark);margin-left:-1rem;padding-left:1rem;}

	.artistblock {margin:2rem auto;display:flex;flex-direction:column;align-items:center;border-bottom:2px solid var(--dark);}
	.artistblock img {height:40vh; width:40vh; }
	.artistblock span {text-align:center;display:block;}
	.artistblock li span:before {content:" | ";}
	.artistblock li span:after {content:"";}
	.artistblock:last-child {border:none;}
	
	.artnav {position:fixed;display:flex;flex-direction:column; background:var(--light);border:2px solid var(--dark);right:1rem;top:1rem;padding:.5rem;z-index:2;}
	
/* lyric pages */
	.lyrics img {margin:1rem auto; height:400px;width:400px; display:block;border:5px double var(--dark);}
	
	.lyrics h1, .lyrics h2 {text-align:center;}
	.lyrichold {display:flex;justify-content:space-evenly;border:2px solid var(--dark);border-left:none;border-right:none;border-top:2px dotted var(--dark);}
	.lyrichold div { padding:1rem;}
	
	.lyrics .note {opacity:0.5;display:block;margin:1rem 0;}
	
	.lyricbottom {display:flex;justify-content:space-between;}
	.lyricbottom a {display:inline-block;width:100%;padding:1rem .5rem;}
	.lyricbottom a:nth-of-type(2) {text-align:center;}
	.lyricbottom a:nth-of-type(3) {text-align:right;}