#algset-table{
	width: 100%;
	text-align: left;
}

#algset-table td{
	width: 25%;
}

#algset-table select{
	width: 100%;
}


#case-preview img{
	width: 250px;
}


/* hint preview */
#hint-table{
	width: 100%;
	font-size: 22px;
	text-align: left;
}

.button-round{
	width: calc(50% - 4px);
	margin: 2px;
}

#case-preview{
	float: left;
	width: 50%;
	text-align: right;
	padding-right: 10px;
}

#case-preview img{
	text-align: right;
}

#alg-preview{
	float: left;
	width: 50%;
}

.hint-alg{
	width: 100%;
}

#case_select_button{
	height: 30px;
	line-height:30px;
}

#case_selection_panel{

}

#case_selection_bar{
	float: left;
	width: calc(100% - 8px);
	height: auto;
	border: 1px solid black;
	margin: 3px;
	padding: 5px;
}

#case_selection_bar .button-round{
	float: right;
	width: 100px;
	height: 30px;
	line-height: 30px;
	min-width: 100px;
	margin: 0px;
	margin-left: 5px;
}

#case_selection_label{
	float: left;
	line-height: 30px;
}

#case_selection_cases{
	float: left;
	width: calc(100% - 8px);
	height: auto;
	border: 1px solid black;
	margin: 3px;
}

#case_selection_cases img{
	width: 80px;
}

.case_selection{
	border: 2px solid black;
	margin: 5px;
	padding: 5px;
	float: left;
}

.innerRect{
	background-color: white;
	padding: 5px;
}



/* mobile ---------------------------------------------------------------------------------------- */
@media only screen and (max-width: 780px){
	.button-round{
		min-width: 10px;
	}
	
	#case_select_button{
		width: 100%;
	}
	
	#hint-table{
		font-size: 18px;
	}
	
	#alg-preview{
		font-size: 16px;
	}
	
	#case-preview img{
		width: 120px;
	}
}