html{
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	overflow:hidden; 
}
body{
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	
	
}
#header{
	background: white;
	width: 100%;
	height: 5%;
	padding: 0;
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-weight: 100;
	font-size: 1.3em;
	font-weight: 300;
	color: black;
	padding-top: 1vh;
	border-bottom: 1px solid white;
}
#waveform{
	background: black;
	width: 100%;
	height: 71%;
	padding: 0;
	margin: 0;
	-moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none;




}
#controls{
	border-top: 1px solid white;
	background: white;
	width: 100%;
	height: 23%;
	padding: 0;
	margin: 0;
	padding-top: 1.5%;
	text-align: center;
	z-index: 3;
	overflow: hidden;

}

#canvas{
	
	position: absolute;
	-moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none;
    cursor: pointer;

	opacity: 0.0;
}
#canvas2{
	position: absolute;
	-moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none;
    z-index: 5;
   

	
}




.label{
	font-size: 1.3em;
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	-webkit-font-smoothing: antialiased;
	font-weight: 300;
	color: black;
	margin-bottom: -15px;
}



#transopse{
	width: 100%;
	margin: auto;
	display: inline;
}

#plus{
	background-color: #2a6496;
	width: 48%;
	cursor: pointer;
	float: right;
	color: white;
}
#minus{
	background-color: #2a6496;
	width: 48%;
	height: 40%;
	float: left;
	cursor: pointer;
	color: white;
	
}

#github{
	text-align: right;
}


#helpbutton{
	font-size: 2em;
	color:#2a6496;
	cursor: pointer;
}

#help{
	width: 100%;
	height: 100%;
	background-color: black;
	z-index: 3;
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	color:white;
	z-index: 3;
}

#drop{
	width: 50%;
	height: 12%;
	border: 2px dotted white;
	margin: auto;
	font-size: 1.5em;
	margin-top:4%;
}

.sample{
	background-color: white;
	border-right: black 2px solid;
	border-left: black 2px solid;
	color: black;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	cursor: pointer;
}

#x{
	font-size: 0.8em;
	color: #888888;
	margin-bottom: -40px;
}

#description{
	text-align: justify;
	margin:0;
	padding:0;
	font-size: 0.85em;
	font-weight: 100;
}

#badge{
	float: right;
	position: absolute;
	right: 15px;
}







