body { 
	background: #f4f4f4;
	font-family:sans-serif;
	font-size:9pt;
}

input:invalid {
  background-color: #eaa;
}

textarea[readonly] {
	background: #f8f8f8;
}

a:hover {
	text-decoration: none;
}


a:hover .fa,
.hover:hover .fa{
	color: #fff;
}
a:hover .fa-inverse,
.hover:hover .fa-inverse {
	color: #000;
}


div#main {
	margin-left: 5%;
	margin-right: 5%;
	margin-top: 20px;
	padding: 0.5cm;
}

span.h2 {
	font-size: 1.2em;
	font-weight: bold;
	margin-top: 1em;
	margin-bottom: 1em;
	display: block;
}

div.errormsg {
	border: 1px solid #DD0000;
	color: #FF0000;
	font-weight:bold;
	font-style:italic;
	background-color: #222222;
	padding: 5px;
	border-radius:5px;
}

/*label, input { display:block; }*/

fieldset { padding:0; border:0; margin-top:25px; }

.validateTips { border: 1px solid transparent; padding: 0.3em; }

.dialog-input { margin-bottom:12px; width:95%; padding: .4em; }

.ui-icon:hover { background-color:#D0DEE7; }

.clearboth {clear: both;}


/******************************************************************************
 * Menu                                                                    *
 ******************************************************************************/

div.menu {
	background: #D0DEE7;
	height: 29px;
	padding: 5px 10px 0 10px;
	margin-left: -0.5cm;
	margin-right: -0.5cm;
	margin-top: -0.5cm;
	margin-bottom: 0.5cm;
	position: relative;
}

div.menu .entry {
	float: left;
	color: #383838;
	font-weight: bold;
	font-size: 1em;
	min-width: 7em;
	height: 15px;
	margin: 0px 10px;
	text-align: center;
	padding: 4px 0px;
}

div.menu .right {
	float: right;
	margin: 0px 10px;
}

div.menu .entry:hover {
	background: #E2EAF2;
}


/******************************************************************************
 * Tables                                                                    *
 ******************************************************************************/

th,td {
	text-align: left;
	vertical-align: top;
}

table.data {
	border-collapse: collapse;
}
table.data td,
table.data th {
	/*border: 1px solid #000000;*/
	border: 1px solid #aaa;
	padding: 3px 6px;
}
table.data tr.vmiddle td,
table.data tr.vmiddle th {
	vertical-align: middle;
}
table.data tr.vtop td,
table.data tr.vtop th {
	vertical-align: top;
}

table.data tr:hover {
	background-color: rgba(208, 222, 231, 0.5);
	box-shadow: 0px 0px 3px 1px rgba(208,222,231,0.8);
}

div.IconOn {
	float: left;
	width: 10px;
	height: 10px;
	background-color: #22DD22;
	border-radius: 5px;
	box-shadow: 1px 1px 2px #666666;
}
div.IconOff {
	float: left;
	width: 10px;
	height: 10px;
	background-color: #DD2222;
	border-radius: 5px;
	box-shadow: 1px 1px 2px #666666;
}

div.exercisesubmissionfeedback {delete
	padding: 11px;
	border: 1px solid #79B7E7;
	background-color: #D0DEE7;
	color: #E17009;
	border-radius: 3px;
	min-height: 22px;
}
div.exercisesubmissionsolution {
	padding: 5px;
	border: 1px solid #79B7E7;
	background-color: #D0DEE7;
	color: #E17009;
	font-weight: bold;
	border-radius: 3px;
}
div.exercisesubmissionsolution > .title {
	background-color: #87B6D9;
	color: #FFFFFF;
	padding: 2px;
	border-radius:3px;
}

dl.exerciseadmin {
	width: 100%;
}

dl.exerciseadmin > dt {
	padding: 4px 8px 2px;
	border-bottom: 1px solid #aaa;
	/*font-weight: bold;*/
	font-size: 1.1em;
}

dl.exerciseadmin > dd {
	/*border-bottom: 1px solid #aaa;*/
}


/******************************************************************************
 * Group Mgmt                                                                    *
 ******************************************************************************/

div.assigngroups_group_box {
	border: 2px solid #AAAAAA;
	width: 70px;
	min-height: 20px;
	padding:0px;
	float:left;
	overflow:hidden;
}

.connectedGroupsSortable {
	list-style-type: none;
	margin: 0;
	padding: 5px 0 0 0;
	min-height: 20px;
}
.connectedGroupsSortable li {
	margin: 0 5px 5px 5px;
	padding: 3px;
	border: 1px solid #c5dbec;
	background-color: #F27F65;
    font-weight: bold;
	cursor: pointer;
}

div.assigngroups_group_box li .hovertext {
	display:none;
}
div.assigngroups_group_box li:hover .hovertext {
	display:block;
}

.connectedGroupsSortable[data-group="1"] li[data-p0="1"],
.connectedGroupsSortable[data-group="2"] li[data-p0="2"],
.connectedGroupsSortable[data-group="3"] li[data-p0="3"],
.connectedGroupsSortable[data-group="4"] li[data-p0="4"],
.connectedGroupsSortable[data-group="5"] li[data-p0="5"],
.connectedGroupsSortable[data-group="6"] li[data-p0="6"],
.connectedGroupsSortable[data-group="7"] li[data-p0="7"],
.connectedGroupsSortable[data-group="8"] li[data-p0="8"],
.connectedGroupsSortable[data-group="9"] li[data-p0="9"],
.connectedGroupsSortable[data-group="10"] li[data-p0="10"],
.connectedGroupsSortable[data-group="11"] li[data-p0="11"],
.connectedGroupsSortable[data-group="12"] li[data-p0="12"],
.connectedGroupsSortable[data-group="13"] li[data-p0="13"],
.connectedGroupsSortable[data-group="14"] li[data-p0="14"],
.connectedGroupsSortable[data-group="15"] li[data-p0="15"],
.connectedGroupsSortable[data-group="16"] li[data-p0="16"],
.connectedGroupsSortable[data-group="17"] li[data-p0="17"],
.connectedGroupsSortable[data-group="18"] li[data-p0="18"],
.connectedGroupsSortable[data-group="19"] li[data-p0="19"],
.connectedGroupsSortable[data-group="20"] li[data-p0="20"]
{
	background-color: #97E297;
}

.connectedGroupsSortable[data-group="1"] li[data-p1="1"],
.connectedGroupsSortable[data-group="2"] li[data-p1="2"],
.connectedGroupsSortable[data-group="3"] li[data-p1="3"],
.connectedGroupsSortable[data-group="4"] li[data-p1="4"],
.connectedGroupsSortable[data-group="5"] li[data-p1="5"],
.connectedGroupsSortable[data-group="6"] li[data-p1="6"],
.connectedGroupsSortable[data-group="7"] li[data-p1="7"],
.connectedGroupsSortable[data-group="8"] li[data-p1="8"],
.connectedGroupsSortable[data-group="9"] li[data-p1="9"],
.connectedGroupsSortable[data-group="10"] li[data-p1="10"],
.connectedGroupsSortable[data-group="11"] li[data-p1="11"],
.connectedGroupsSortable[data-group="12"] li[data-p1="12"],
.connectedGroupsSortable[data-group="13"] li[data-p1="13"],
.connectedGroupsSortable[data-group="14"] li[data-p1="14"],
.connectedGroupsSortable[data-group="15"] li[data-p1="15"],
.connectedGroupsSortable[data-group="16"] li[data-p1="16"],
.connectedGroupsSortable[data-group="17"] li[data-p1="17"],
.connectedGroupsSortable[data-group="18"] li[data-p1="18"],
.connectedGroupsSortable[data-group="19"] li[data-p1="19"],
.connectedGroupsSortable[data-group="20"] li[data-p1="20"]
{
	background-color: #E8ED93;
}

.connectedGroupsSortable[data-group="1"] li[data-p2="1"],
.connectedGroupsSortable[data-group="2"] li[data-p2="2"],
.connectedGroupsSortable[data-group="3"] li[data-p2="3"],
.connectedGroupsSortable[data-group="4"] li[data-p2="4"],
.connectedGroupsSortable[data-group="5"] li[data-p2="5"],
.connectedGroupsSortable[data-group="6"] li[data-p2="6"],
.connectedGroupsSortable[data-group="7"] li[data-p2="7"],
.connectedGroupsSortable[data-group="8"] li[data-p2="8"],
.connectedGroupsSortable[data-group="9"] li[data-p2="9"],
.connectedGroupsSortable[data-group="10"] li[data-p2="10"],
.connectedGroupsSortable[data-group="11"] li[data-p2="11"],
.connectedGroupsSortable[data-group="12"] li[data-p2="12"],
.connectedGroupsSortable[data-group="13"] li[data-p2="13"],
.connectedGroupsSortable[data-group="14"] li[data-p2="14"],
.connectedGroupsSortable[data-group="15"] li[data-p2="15"],
.connectedGroupsSortable[data-group="16"] li[data-p2="16"],
.connectedGroupsSortable[data-group="17"] li[data-p2="17"],
.connectedGroupsSortable[data-group="18"] li[data-p2="18"],
.connectedGroupsSortable[data-group="19"] li[data-p2="19"],
.connectedGroupsSortable[data-group="20"] li[data-p2="20"]
{
	background-color: #F4CB4E;
}

/******************************************************************************
 * Option CSS Links                                                           *
 ******************************************************************************/

input.following_choice {
	display: none;
}

input.following_choice + * {
	display: none;
}

input.following_choice:checked + * {
	display: block;
}

/******************************************************************************
 * Home                                                                       *
 ******************************************************************************/

div.home {
	
}

div.home > ul,
div.home > ul > li {
	margin: 0;
	padding: 0;
	list-style: none;
}

div.home div.status {
	border-top: 1px solid #79b7e7;
}
div.home h3 {
	margin: 0;
	padding: 0.8em 0;
}

div.home ul.semesters > li {
	padding: 0.3em 0 1em;
	border-top: 1px solid #79b7e7;
}

div.home ul.semesters > li > ul.lectures {
	padding: 0.3em 1em; margin:0;
	
	display: flex;
	flex-wrap: wrap;
	justify-content: left;
	align-items: stretch;
	align-content: flex-start;
}

div.home ul.semesters > li > ul.lectures > li.lecture {
	flex: 0 0 25em; /* forbid courses to grow */
	
	/* as a flex parent */
	display: flex;
	flex-direction: column;
	align-items: flex-start; /* left-aligned content */
	
	margin: 0.6em;
	padding: 0 0 0.4em;
	border: 1px solid #79b7e7;
	border-radius: 5px;
	
	-webkit-box-shadow: 3px 3px 2px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 3px 3px 2px 0px rgba(0,0,0,0.2);
	box-shadow: 3px 3px 2px 0px rgba(0,0,0,0.2);
}

div.home ul.semesters > li > ul.lectures > li.lecture > h4 {
	width: 100%;
	box-sizing: border-box;
	margin: 0;
	padding: 0.7em 0;
	text-align: center;
	color: #e17009;
}

div.home ul.semesters > li > ul.lectures > li.lecture > div,
div.home ul.semesters > li > ul.lectures > li.lecture > p {
	box-sizing: border-box;
	margin: 0;
	padding: 0.2em 0.5em;
	width: 100%;
	border-top: 1px solid #79b7e7;
}

div.home ul.semesters > li > ul.lectures > li.lecture > div > h5 {
	/*float: left;*/
	margin: 0;
	padding: 0.1em 0.4em;
}

div.home ul.semesters > li > ul.lectures > li.lecture > div > ul {
	text-align: right;
}

div.home ul.semesters > li > ul.lectures > li.lecture > div > ul > li {
	margin: 0 0.3em 0.2em;
}

div.home ul.semesters > li > ul.lectures > li.lecture > div > table {
	margin: auto 0.3em auto auto;
}

div.home ul.semesters > li > ul.lectures > li.lecture > div th {
	font-weight: normal;
}

div.home ul.semesters > li > ul.lectures > li.lecture > p {
	text-align: center;
}


div.home ul.lectureNews > li {
	border-bottom: 1px solid #79b7e7;
	border-left: 1px solid #79b7e7;
	border-right: 1px solid #79b7e7;
}
div.home ul.lectureNews > li:first-child {
	border-top: 1px solid #79b7e7;
}

div.home ul.lectureNews > li > label > h3 {
	width: 100%;
	margin: 0;
	padding: 0.3em 1em;
	color: #2e6e9e;
	text-decoration: underline;
	cursor: pointer;
}

div.home ul.lectureNews > li > label > h3 .meta {
	display: inline-block;
	text-align: right;
	margin-right: 0;
}

div.home ul.lectureNews > li:target > label > h3 { color: #e17009; }
div.home ul.lectureNews > li:target > div.text {display: block;}

div.home ul.lectureNews > li > div.text {
	margin: 0;
	padding: 0.3em 1em 1em;
}


/******************************************************************************
 * Grading                                                                    *
 ******************************************************************************/

div.grading {

}

div.grading ul.members {list-style: none;}
div.grading ul.members li {list-style: none}
div.grading ul.members li::after {content:", ";}
div.grading ul.members li:last-child::before {content:"";}

div.grading ul.submissions {
	display: inline;
	margin: 0;
	padding: 0;
	list-style: none;
}
div.grading ul.submissions li {
	display: inline;
	margin: 0;
	padding: 0;
	list-style: none;
}
div.grading ul.submissions li label {
	display: inline;
	padding: 1px 3px;
	border: 1px solid #ddd;
	cursor: pointer;
}
div.grading ul.submissions li label.checked {
	border:2px solid #444;
	font-weight: bold;
	cursor: default;
}

div.grading ul.submissions li label.invalid {
	border:1px solid #eee;
	font-weight: lighter;
	cursor: default;
}

div.grading table {
	border-collapse: collapse;
}

div.grading table td {
	padding: 5px;
}

div.grading table.submission th:first-child {
	white-space: nowrap;
	text-align: right;
}

div.grading table.submission tr:first-child th:first-child {
	text-align: left;
}

div.grading table.submission td {
	width: 100%;
	padding: 3px;
}

div.grading table.submission tr {
	border-top: 1px solid #ddd;
}

div.grading table.submission tr:first-child {border-top: none;}

div.grading table.submission tr.variant.description,
div.grading table.submission tr.task.description {
	margin-top: 10px;
	border-top: 1px solid black;
}

div.grading table.submission tr.task.description td{
	padding-top: 5px;
}

div.grading input.percentage {
	height: 1em;
	width: 5em;
}

div.grading input.correct:checked + input.percentage {display: none;}

div.grading span.range { display: inline; }
div.grading span.full { display: none; }
div.grading input.correct:checked ~ span.range {display: none;}
div.grading input.correct:checked ~ span.full {display: inline;}

div.grading textarea.comment {
	min-height: 2em;
	min-width: 20em;
}

div.grading input#show-comments + form textarea { display: none; }

div.grading input#show-comments:checked + form textarea { display: inline-block; }

div.grading table.assignments td.type,
div.grading table.assignments td.submitted,
div.grading table.assignments td.graded {
	text-align: center;
}

div.grading input.submit {
	display: block;
	width: 7em;
	margin: 0.7em auto 0.3em;
}


/******************************************************************************
 * PRINT                                                                    *
 ******************************************************************************/

@media print {
	body { background: none; }
	body .noprint { display:none; }
	body .ui-corner-all { border: none; }
	body div#main { margin: 0px; padding:0px; }
	#exercises .ui-accordion-header-icon { display:none; }
	#exercises > div > *{display:block !important;}
}



/******************************************************************************
 * MISC                                                                    *
 ******************************************************************************/
 
 * > span.hideHoverOuter {
	display: none;
}
 *:hover > span.hideHoverOuter {
	display: inline;
}

tr + tr.hideHoverPrevious {
	display: none;
}
tr:hover + tr.hideHoverPrevious,
tr.hideHoverPrevious:hover {
	display: table-row;
	background-color: rgba(208, 222, 231, 0.5);
	box-shadow: 0px 0px 3px 1px rgba(208,222,231,0.8);
}

* + div.hideHoverPrevious {
	display: none;
}
*:hover + div.hideHoverPrevious,
* + div.hideHoverPrevious:hover {
	display: block;
}





/******************************************************************************
 * Submission                                                                     *
 ******************************************************************************/
div.codebox {
	box-shadow: 0px 0px 3px 1px rgba(50,50,50,0.8);
	border: 2px solid #666666;
	margin: 0.5rem;
	padding: 0.2rem;
	border-radius: 0.2rem;
	display: block;
	white-space: pre;
	font-family: monospace;
	tab-size: 4;
}

.readonlyAsDisabled[readonly] {
	background-color: #F0F0F0;
	color: #6d6d6d;
	border: 1px solid #c4c4c4;
	cursor: default;
}



/******************************************************************************
 * Footer                                                                     *
 ******************************************************************************/
.footermenu {
	text-align: center;
	margin-top: 1em;
}
.footermenu a {
	color: #222;
	text-decoration: none;
}
.footermenu a:hover {
	color: #FFF;
	background-color: #000;
}