@font-face {
  font-family: 'Bravura';
  src: url('fonts/Bravura.otf'); /* IE9 Compat Modes */;

}

body {

}


h1, h2 {
	text-align:center;
}

.notediv {
	margin-bottom: 2em;	
	border: 1px solid gray;
	width:105px;

	cursor:crosshair;
}

.notedivMedium {
	height: 65px;	
}

.notedivHigh {
	height: 85px;
}

.notediv div {
	position: relative;
	top: 25px;
	left: 5px;
}

.targetarea {
	width: 105px;
	height: 65px;
	text-align:center;
}

.keytargetarea {
	width: 105px;
	height: 65px;
	text-align:center;
	font-size:12px !important;
}

#score {
	position: sticky; 
	background-color:white;
	z-index: 200;
	top:0px;
	width:100%;
	text-align:center;
}

.newNote {
	font-family: Bravura;
	font-size:200%;

}

.droppable {
	font-size:200%;
	margin-top: 1em;
	border: 1px solid gray;
}

.lesson1greenbg {
	background-color:green;	
	color:white;
}

.draggable {
	color:black;
}

[data-animation="slideInOutLeft"] .modal-dialog {
  opacity: 0;
  transform: translateX(-100%);
  transition: all 0.5s var(--bounceEasing);
}
 
[data-animation="slideInOutLeft"].is-visible .modal-dialog {
  opacity: 1;
  transform: none;
  transition-delay: 0.2s;
}