/* BASIC RESET */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{margin:0; padding:0;}

html, body{
	height: 100%;
	font:100% 'Didot','Arial', sans-serif; 
}

#main{
    margin: 2px 10px;
    background-color: #FFF;
	position: relative;
	margin-bottom: 15px;
}

#buffer{
	position: relative;
	height: 56px;
	width: 100%;
    background-color: #FFF;
}

#top{
	padding: 4px 10px;
	margin: -2px 0px;
	position: fixed;
	height: 50px;
	width: 100%;
	z-index: 12;
	background-color: white;
}

#topscroll{
	width: 100%;
	overflow: none;
}

#bubble{
	display: none;
	position: fixed;
	background-color: #DDD;
	margin: 0 auto;
	width: 772px;
	height: 200px;
	margin-left: calc(50% - 410px); 
	margin-top: 50px;
	padding: 10px;
	border-style: solid;
	border-width: 2px 2px;
	border-color: #000;	
}
#bubbleArtist, #bubbleName{
}

.bubble, .bubbleSong, #close{
	background-color: #FFF;
	float: left;
	width: 370px;
  margin: 1px 1px;
  border-style: solid;
	border-width: 2px 2px;
	border-color: #000;
	padding: 5px;
}

#bubbleSongs{
	height: 90px;
	overflow: hidden;
}

#bubbleKey, #close{
	float: left;
	width: 177px;
}

#bubbleLeft, #bubbleRight{
	float: left;
	width:300px;
}

.song, song, sorter, header, .info, .bubblesong{
  font-size: 18px;
  letter-spacing:-1.5px;
  margin: 1px 1px;
  border-style: solid;
	border-width: 2px 2px;
	border-color: #000;
	float: left;
	height: 24px;
	top: 2px;
	padding: 0px 5px;

}

.info{
	height: 120px;
	width: 358px;
}

.song, song{
	width: calc(33% - 13px);
	white-space: nowrap;
	overflow: hidden;
}

sorter{
	width: calc(8.333333% - 18px);
	text-align:center;
	background-color:#DDD;
	padding: 0px -6px;
	position: relative;
	float:left;
	height: 24px;
	padding-top:10px;
	padding-bottom:10px;
	margin:0px 1px 2px 1px;
}

#showD{
	color: grey;
}

break{
	width: 100%;
	float: none;
}
a:visited{
   color:blue;
}

.gradeR, .gradeS, .hidden, .gradeX, header{
     display:none; 
}

song.clicked{
 height:300px;
}

.hard a div h1{
   color: #88f;
}

.A h1{
	color: #E86000;
}

.hard .A h1{
	color: #EA8;
}

.B h1{
	color: #B08;
}

.hard .B h1{
	color: #E8A;
}

a, a:visited{color:black;}
h1{color:blue;
	font-size: 18px;
	font-weight: normal;}

@media screen and (max-width: 1000px){
.song{
	width: calc(50% - 17px);
    letter-spacing:-1px;
}
}

@media screen and (max-width: 699px){
.song{
	width: 360px;
    letter-spacing:-1px;
}
}