.floatLeft {
	float: left;
}

.floatRight {
	float: right;
}

.clear {
	clear: both;
}

.participantName {
	width: 550px;
}

.attendanceImageContainer {
	width: 30px;
}

.pointer {
	cursor: pointer;
}

.label {
	padding: 2px;
	width: 100px;
}

.value {
	padding: 2px;
	width: 300px;
}

.serialBlock {
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 10px;
	border-bottom: 1px solid gray;
	background-color: #CCCCCC;
	cursor: pointer;
}

.scheduleBlock {
	padding-left: 10px;
	border-bottom: 1px solid #DDDDDD;
	background-color: #FFFFFF;
}

.scheduleElement {
	padding-top: 7px;
	padding-left: 10px;
	padding-bottom: 5px;
}

.courseElement {
	display: block;
	height: 16px;
	margin-right: 7px
}

.courseAction {
	display: block;
	height: 24px;
	width: 24px;
	margin-right: 12px
}

.scheduleContainer {
	display: none;
}

.participantBlock {
	padding-top: 4px;
	padding-left: 60px;
	padding-bottom: 5px;
	border-bottom: 1px solid #DDDDDD;
	background-color: #F5F5F5;
}

.participantContainer {
	display: none;
}

.arrow {
	height: 20px;
   	width: 20px;
	margin-bottom: -5px;
}

.dateFilter {
	padding-left: 10px;
	padding-bottom: 10px;
	padding-top: 10px;
}

.checkboxElement {
	vertical-align: middle;
}


.dateField {
	width: 70px;
}

.emptyList {
	margin-top: 30px;
	text-align: center;
}

.attendanceForm {
	border-bottom: 1px solid lightgray;
}

.grayscale {
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}