.grade {
	color: white;
	top: 30%;
}

div[class*="gradeCard-A"], div[class*="gradeCard-B"] {
	background-color: LimeGreen;
}

div[class*="gradeCard-C"], div[class*="gradeCard-D"] {
	background-color: DarkOrange;
}

div[class*="gradeCard-E"], div[class*="gradeCard-F"] {
	background-color: red;
}

.searchBarSetup {
	border-radius: 0.25rem 0rem 0rem 0.25rem;
}

.searchBarSetupIcon {
	border-radius: 0rem 0.25rem 0.25rem 0rem;
}

.cardHover:hover {
	box-shadow: 0 0.1rem 0 #568cc4;
	text-decoration: none;
}

.cardHover:hover div h6, .cardHover:hover div p, .cardHover:hover .mdi-wrench
	{
	color: #568cc4 !important;
}

.cardHover a {
	text-decoration: none !important;
}

.userTable tbody tr td {
	border-bottom: 1px solid #dee2e6 !important;
	border-top: 0 !important;
}

.userTable thead tr th {
	border-top: 0 !important;
}

/* Report Card Helpers */
.reportCardTitle {
	font-size: 12px;
}

.vl {
	border-left: 1px solid #e6e6e6;
}

/* End of Report Card Helpers */
.hl {
	border-bottom: 1px solid #e6e6e6;
}

.hl-top {
	border-top: 1px solid #e6e6e6;
}

.marginForDynamicClose {
	margin-left: -2.55rem !important;
}

.setViewPortForPre {
	max-width: 80vw !important;
}

.removeBoxSizing {
	box-sizing: border-box !important;
}

.bottomTableHeadBorder {
	border-bottom: 2px solid #dee2e6 !important;
}

table.dataTable thead th {
	background: transparent !important;
	white-space: nowrap;
}

/* For Sort Arrow displayed above header tags */
.dataTable .sort-icon::after {
	display: inline-block;
	padding-left: 25px;
	width: 16px;
	height: 15px;
	font-family: "Material Design Icons";
}

.dataTable .sorting .sort-icon::after {
    content: "\F143";
}
.dataTable .sorting_desc .sort-icon::after {
    content: "\F143";
}
.dataTable .sorting_asc .sort-icon::after {
    content: "\F140";
}

/* Chevron up / down on collapse */
.messagesCollapser.mdi-chevron-down.collapsed::before {
	content: "\F140";
}

.messagesCollapser.mdi-chevron-down::before {
	content: "\F143";
}

#certificate-modal-body .certificate-info {
	max-height:200px;
}

.scrollable {
 height: calc(100vh - 55px);
 overflow: auto;
}

.login-background {
  background: url('../2keys/2keys_assets/login-background.png') no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}