body {
	font-family: "helvetica",sans-serif;
	background-color: #575756;
}

h2 {
	text-align: center;
	color: #FFF;
	font-size: 19px;
}

#bigScreen {
	width: 1160px;
	height: 750px;
	margin: 0px auto;
	display: none;
}

#smallScreen {
	display: block;
}

#bigScreenGraphicDiv {
	display: inline-block;
	width: 750px;
	height: 750px;
}

#bigScreenTrialsDiv {
	display: inline-block;
	width: 400px;
	height: 750px;
}

#draft {
	pointer-events: none;
}

.button {
	cursor: pointer;
}

.scaling-svg-container {
	position: relative;
	height: 0;
	width: 100%;
	padding: 0;
	padding-bottom: 100%
}

.scaling-svg {
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0;
	top: 0;
}

.thisisthetooltip {opacity:0; pointer-events: none;}

.thishasatooltip:hover .thisisthetooltip {opacity:1; transition: opacity 0.3s;}

/* small screens */

.trialButton {
	max-width:330px; 
	margin: 0px auto;
	padding:5px;
}

/* medium screens */

@media screen and (min-width: 750px) {
	.trialButton {
		max-width:330px; 
		float:left; 
		
		padding:5px;
	}
  
}

/* large screens */

@media screen and (min-width: 1115px) {
	#bigScreenTrialsDiv {
		width: 400px;
		height: 750px;
	}

	#bigScreen {
		width: 1160px;
		height: 750px;
		margin: 0px auto;
		display: block;
	}

	#smallScreen {
		display: none;
	}
}