/* Make sure that the mobile version og the pie chart is displayed*/

@media(max-width: 767px){
	.pie-chart{
		height: 300px;
		margin-top: 50px;
	}
	
	.teacher-tab-options{
		padding-top:30px;
	}
}

@media(min-width: 768px ) and ( max-width: 991px){
	.pie-chart{
		height: 300px;
	}

	.teacher-tab-options{
		padding-top:30px;
		height:300px;
		overflow-y:auto;
		overflow-x:hidden;
	}

	.left-pane-desktop{
		height: 100%;
	}
}
@media(min-width: 992px){
	.pie-chart{
		height: 300px;
	}

	.teacher-tab-options{
		height:360px;
		padding-top:50px;
		overflow-y:auto;
		overflow-x:hidden;
	}

	.left-pane-desktop{
		height: 100%;
	}
	/*See if there is a better way to pull the bottom row of stats down in 'HOD' portal*/
	.pull-down{
	margin-top:80px !important;
/*	position: absolute;
	bottom: 0px;*/
}
}
/* Stat numbers in the teacher and HOD portals */
.stat-element{
	width:75px;
	margin:0px auto;
}

	.stat-number{
		font-size: 35px;
		font-weight: bold;
		text-align: center;
	}

	.stat-text{
		font-size: 15px;
		font-weight: bold;
	}



.module-form{

}

.module-heading{
	font-size: 22px;
	text-align: center;
}

/******* State Properties ********/
.is-hidden{
	display:none;
}

.is-invisible{
	visibility: hidden;
}




/*Theme Styles*/

.light-blue{
	color:#3498DB;
}

.background-light-blue{
	background-color: #3498DB;
}
.background-green{
	background-color: #1ABC9C;
/*	opacity: 0.3;*/
}
.green{
	/*color : #27AE60;*/
	color:#00C957;

}


.background-red{
	background-color: red;
	/*	opacity: 0.3;*/
}
.red{
	color: red;
}

.maroon{
	color:#C0392B;
}

.background-maroon{
	background-color: #C0392B;
}

.dark-green{
	color: #27AE60;
}
.background-dark-green{
	background-color: #16A085;
	/*opacity: 0.3;*/
}



.lemon-yellow{
	/*color:#F1C40F;*/
	color:#2ECC71;
}
.background-lemon-yellow{
	background-color:#F1C40F;
		/*opacity: 0.3;*/
}


.orange-yellow{
	color:#F39C12;
}
.background-orange-yellow{
	background-color:#F39C12;
	/*opacity: 0.3;*/
}


.orange{
	color:#E67E22;
}
.background-orange{
	background-color:#E67E22;
	/*opacity: 0.3;*/
}


.dark-orange{
	color:#D35400;
}
.background-dark-orange{
	background-color:#D35400;
	/*opacity: 0.3;*/
}


.yellow{
	color:yellow;
}
.background-yellow{
	background-color:yellow;
	/*opacity: 0.3;*/
}

.white{
	color: white;
}

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

.light-grey{
	color : #ECF0F1;
}

.background-light-grey{
	background-color : #ECF0F1;
}