@charset "utf-8";


* {
	margin: 0px;
	padding: 0px;
}

body {
	padding: 0px;
	margin: 0px;
	font: 14px Arial, Helvetica, sans-serif;
}

.header {
	width: 800px;
	height: 38px;
	background-image: url(../var/ui-theme/img/header.gif);
}

a {
	text-decoration: none;
}

a.disabled {
	text-decoration: none;
	opacity:0.4;
	cursor: default;
}

.jqui-dnd-item, 
.ui-draggable,
.ui-sortable > * {
	cursor: url(../img/hand-open.gif), url(img/hand-open.cur), move;
}

.jqui-dnd-item:active, 
.ui-draggable:active {
	cursor: url(../img/hand-closed.gif), url(img/hand-closed.cur), move;
} 

.jqui-dnd-item-dragging,
.ui-draggable-dragging,
.ui-sortable-helper  {
	cursor: url(../img/hand-closed.gif), url(img/hand-closed.cur), move;
	z-index: 999;
}



/* PASS/FAIL */
.borderPass {
	border-color: #A3D175 !important;
	border-width: 2px !important;
}
.borderFail {
	border-color: #DB1600 !important;
}

.backgroundPass {
	background: #A3D175;
}
.backgroundFail {
	background: #DB1600;
}
.textPass {
	color: #A3D175 !important;
}
.textFail {
	color: #DB1600 !important;
}
.connectionsStrokePass {
	stroke: #A3D175;
}
.connectionsStrokeFail {
	stroke: #DB1600;
}







#world {
	margin:0 auto;
	margin-top: 20px;
	width: 800px;
	position:relative;
}

h1 {
	height: 38px;
	line-height: 35px;
	padding: 0px 0 0 15px;
}
h1 > * {
	font-weight: bold;
	font-size: 20px;
}

#contentContainer {
	border-width: 1px;
	border-style: solid;
	height: 654px;
	margin-top: 4px;
	margin-bottom: 2px;
}

#contentContainer .closeButton {
	position: absolute;
	width: 22px;
	height: 22px;
	margin-left: 776px;
	background: url(../img/btn-close.png) top left no-repeat;
}

.screen {
	position: absolute;
	width: 798px;
	height: 654px;
	background: #fff;
}

#contentContainer .screen .headline {
	overflow: hidden;
}

#contentContainer .screen .headline * {
	float: left;
	display: block;
}

#contentContainer .screen .headline h2 {
	height: 26px;
	font-size: 14px;
	font-weight: bold;
	line-height: 26px;
	padding-left: 15px;
}


/** **/
.contentDimensions {
	height: 498px;
	width: 798px;
}



/** v StartScreen v **/
#startScreen #themeText {
	height: 69px;
	text-indent: 15px;
	line-height: 65px;
}

#startScreen h3 {
	font-weight: bold;
	padding-left: 15px;
	height: 25px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-top-width: 1px;
	border-top-style: solid;
	line-height: 25px;
}

#startScreen .vrule {
	background: #0079AE;
	display:block;
	width: 1px;
	height: 558px;
}

#startScreen #inner {
	overflow: hidden;
	height: 559px;
}
#inner > div {
	float: left;	
}

#inner .col {
	height: 100%;	
}

#inner .col .content {
	padding-top: 35px;
	padding-left: 15px;
}

#practice {
	width: 498px;
	border-right-width: 1px;
	border-right-style: solid;
}

#practice table {
	width: 100%;	
}

#practice table tr.groupRow,
#practice table td {
	cursor: pointer;
}

#practice table h4 {
	cursor: default;
}

#practice tr.last td {
	font-weight: bold;
}
#practice table td {
	padding-bottom: 10px;
	font-size: 12px;
}

#practice td.topoLabel {
	text-align: right;
	padding-right: 100px;
}

#practice h4 {
	font-weight: bold;
	color: #000;
}


#test {
	width: 299px;
}
#test a {
	background: url(../var/ui-theme/img/forwards.svg) top left no-repeat;
	padding-left: 25px;
	height: 22px;
	display: block;
	line-height: 22px;
	margin-left: 30px;
	margin-bottom: 10px;
}

#test a.clearLastTest {
	background: url(../var/ui-theme/img/toStart.svg) top left no-repeat;
}

#test #statsHead {
	margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
}

#test #stats .chart {
	margin-left: 90px;
}
#test #stats .legend {
	margin-left: 60px;
	font-size: 11px;	
}

/*
#test #dia {
	overflow: hidden;
	font-size: 10px;
	text-align: center;
	margin-top: 30px;
	margin-bottom: 30px;
}
#test #dia .col {
	float: left;	
	width: 50px;
	margin-left: 30px;
	margin-right: 10px;
}
#test #dia .col .bg {
	border-width: 1px;
	border-style: solid;
	height: 100px;
	width: 50px;
}
#test #dia .col .overlay {
	width: 50px;
	background: #E9EDF6;
}
*/




/** ^ StartScreen ^ **/


/** **/
.lessonButtons {
	position: absolute;
	bottom: 15px;
	right: 20px;
	z-index: 100;
}
.lessonButtons a {
	display: inline-block;
	width: 22px;
	height: 22px;
}
/*
.lessonButtons a.check {
	background: url(../var/ui-theme/img/check.svg);
}
.lessonButtons a.reset {
	background: url(../var/ui-theme/img/toStart.svg);
}
*/
/** **/



/* v Runner v */
.runNav {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	height: 100px;
	margin-top: 10px;
}
.runNav a {
	width: 22px;
	height: 22px;
	display: inline-block;
	position: absolute;
}
.runNav .prev {
	/*background: url(../var/ui-theme/img/backwards.svg) top left no-repeat;*/
}


.runNav .next {
	/*background: url(../var/ui-theme/img/forwards.svg) top left no-repeat;*/
	margin-left: 25px;
}
.lessonText {
	font-size: 14px;
	margin-top: 10px;
	margin-left: 20px;
	margin-right: 20px;
}

.lessonViewInclude {
	height: 517px;
}
.lessonViewWrap {
	height: 517px;
	overflow: hidden;
}

/* ^ Runner ^ */

/** v ExRunner v **/
#exRunner {
	
}

#exRunner .runNav .floater {
	overflow: hidden;
}
#exRunner .runNav .floater > div {
	float: left;
}

#exRunner .runNav .floater .title {
	width: 730px;
}

#exRunner .runNav .floater .buttons {
	width: 60px;
}

#exRunner .steps {
	font-size: 20px;
	font-weight: bold;
	margin-left: 20px;
}
#exRunner .groupName {
	font-size: 18px;
	margin-left: 10px;
}


/** ^ ExRunner ^ **/


/** v TestRunner v **/
#testRunner .runNav .floater {
	overflow: hidden;
}
#testRunner .runNav .floater > * {
	float: left;
}

#testRunner .runNav .floater .ordinals {
	width: 730px;
	margin-left: 15px;
}

#testRunner .ordinal {
	width: 50px;
	font-size: 20px;
	margin-right: 10px;
	text-decoration: none;
	color: #555;
}
#testRunner .ordinal.done
{
	color: #ccc;
}
#testRunner .ordinal.active {
	color: #000;
	font-weight: bold;
}
/** ^ TestRunner ^ **/

/*** v Footer  v ***/
#footer {
	height: 33px;
	margin-top: 4px;
	padding-left: 760px;
}


#footer * {
	display: block;
	float: left;
}

#footer .vsep {
	width: 1px;
	height: 33px;
	background: #fff;
}
/*
#footer a {
	
}
#footer .clear {
	background: url(../img/Trash.png) top left no-repeat;
}
*/
#footer .imprint {
	width: 30px;
	height: 33px;
	margin-left: 5px;
	background: url(../var/ui-theme/img/btn-impressum.png) center left no-repeat;
}
#footer .imprint:hover {
	background: url(../var/ui-theme/img/btn-impressum-hover.png) center left no-repeat;
}




#colors #pass 		{ color: #45864E; }

#colors #fail 		{ color: #DB1600; }

.textWhite 			{ color: #fff;	}