/*-------- COLOURS --------*/


body {
	background: url("../images/pageBorderLeft.gif") repeat-y left top;
}

#page {
	background: url("../images/pageBorderRight.gif") repeat-y top right;
}

a, a:visited, a:hover {
	color:black;
	border-bottom: 1px solid red;
}

a img {
	border:none;
}

#headNav li, #footer ul li, #homeNav li, .rowActions ul li, #pageNav li {
	border-left:1px solid #BB0000;
}

#headNav li:first-child, #footer ul li:first-child, #homeNav li:first-child, #pageNav li:first-child, .rowActions ul li:first-child  {
	border:none;
}
#footer #footerContent, .exercise-assistant #content {
	background:#F9F9F9;	
}

#footerContent {
	border-top:1px dotted #CCCCCC;
}


form.compact label, td, th, #sidebar .row, .twocol-sidebar #pageHead, .onecol-sidebar #pageHead, .onecol #pageHead, .exercise-assistant #pageHead {
	border-bottom:1px dotted #CCCCCC;
	
}

#sidebar, .quickEditor, .tags {
	background:#F6F6F6;
}

.job,.job .downArrow  {
	background-color: #d5e5ec;
}

.job .downArrow {
	background-image: url(../images/jobDownArrow.gif);
}



#noscriptWarning, .gapSolutions, .gap,.job.dragging {
	background:#FFFFBB;
}

.button,a.button,input[type="submit"],input[type="button"],.ui-combobox-arrow{
	color:black;
	border:1px solid #BBBBBB;
	border-bottom:1px solid #BBBBBB;

	background: url("../images/lowerShadow241.gif") bottom #F1F1F1 repeat-x;
	background: -webkit-gradient(linear, left top, left bottom,from(rgb(242,242,242)),to(rgb(217,217,217)));
	background: -moz-linear-gradient(
		center top,
		rgb(242,242,242) 0%,
		rgb(217,217,217) 100%
	);
	cursor: pointer;
}

.assistant input[type="submit"], input[type="submit"].importantButton, .selected, .button.important {
	color:white;
	background:url("../images/redGloss.gif") repeat-x left top #E65345;
	background: -webkit-gradient(linear, left top, left bottom,color-stop(0.51,rgb(204,5,5)),color-stop(0.49,rgb(255,52,52)),from(rgb(254,180,180)),to(rgb(253,104,104)));
	background: -moz-linear-gradient(
				    center top,
				    rgb(254,180,180) 0%,
				    rgb(255,52,52) 48%,
				    rgb(204,53,53) 51%,
				    rgb(253,104,104) 100%
				);
	border: 1px solid red;
}

.upperShadow,#mainMeta,#horizon {
	background: url("../images/lowerShadow255.gif") bottom left repeat-x;
	background: -webkit-gradient(linear,left top, left bottom,from(rgba(255,255,255,0)),to(rgba(20,20,20,0.1)));
	background: -moz-linear-gradient(
					center top,
					rgb(255,255,255) 0%,
					rgb(240,240,240) 80%,
					rgb(200,200,200) 100%
	);
}


.evaluation .correct {
	background: #14F000;
	color:white;
}

.evaluation .not {
	background: yellow;
	color:black;
}
.evaluation .wrong {
	background: #DF1414;
	color:white;
}


.tag {
	background-color: #e5effa;
	border: 1px solid #d5deeb;
}

.job[exercise=mulcho], .job[exercise=mulcho] .downArrow {
	background-color: #c6f6c2;
}

.job[exercise=gaps], .job[exercise=gaps] .downArrow {
	background-color: #f3fcbb;
}

.job[exercise=tetris], .job[exercise=tetris] .downArrow {
	background-color: #d0f9fe;
}

.job.empty {
	background:none;
	border: 1px dashed #d5d6d5;
	color: #bababa;
}

.mediaExplanation, #loggedInName {
	color: #bababa;
}	

.inactive {
	color: #ccc;
}

/*-------- TYPO --------*/

body {
	font-family: Arial,Helvetica,sans;
	font-size:12px;
}

h1, h2, h3 {
	font-weight: 100;
}

a {
	text-decoration: none;
}

th {
	text-align: left;
}

.assistant #main {
	font-size: 1.2em;
	line-height: 1.5em;
}

.exercise-assistant #content {
	font-size: 1.5em;
	line-height: 1.5em;
}

.exercise-assistant small {
	line-height:1em;
}
form.rich input[type="text"],form.rich input[type="password"] {
	border:red 1px solid;
}

.assistant form.compact {
	font-size: .8em;
	line-height:1.1em;
}
form.compact label {
	font-weight:bold;
}


.assistant input[type="submit"], input[type="submit"].importantButton, .button.important {
	font-weight:bold;
	text-align: center;
}

.assistant .alert {
	font-size:.8em;
}


#exerciseTable {
	font-size: 1.2em;
}

#pageHead h2 input[type=text] {
	font-size: 1.2em;
}

#pageHead h3 input[type=text] {
	font-size: 1.2em;
}
.evaluation > div {
	text-align: center;
	text-indent: -10000px;
}

.evaluation.nohover > div {
	text-align: left;
	text-indent: 0;
	padding:.3em;
}

.job.empty p {
	text-align: center;
	font-size:2em;
}

.exercise-assistant input[type="submit"], .exercise-assistant a.button {
	font-size:14px;
}

.mediaExplanation {
	font-size: 1.3em;
}	

/*-------- LAYOUT ---------*/

/* GENERAL LAYOUT */

html, body {
	height: 100%;
}

body {
	margin:0;
	padding:0;
}


#page {
	position: relative;
	float: left;
	margin:0;
	padding:0;
	width:100%;
	min-height:100%;
	min-width:770px;
}

#main {
	margin:0;
	padding-bottom: 3em;
}

.onecol-sidebar #content {
	margin-top: 0;
	margin-left:24%;
}

#leftCol {
	float: left;
	padding-right:3em;
}
#rightCol {
	float: left;
}

.colWidth60 {
	max-width: 60%;
}

.colWidth20 {
	max-width: 20%;
}
#headNav li, #footer ul li, #homeNav li, #pageNav li, #setNav li,.tagList li {
	list-style: none;
	display:inline;
	padding:0 1em 0 1em;
}
#setNav li{
	padding:0;
}

.pageSubNav {
	margin-bottom: 1em;
}

.pageSubNav li {
	display: inline;
	list-style: none;
	padding-right: 1em;
}

.tagList li {
	padding: 0 .2em 0 .2em;
}

#students li {
	list-style: none;
	padding-top:.2em;
}

#headNav li:first-child, #footer ul li:first-child, #homeNav li:first-child, #pageNav li:first-child, .rowActions ul li:first-child  {
	padding:0 1em 0 0;
}

.exercise-assistant ul {
	margin-left:1em;
}




/* UI */

fieldset {
	border:none;
	margin:0 0 2em 0 ;
	padding:0;
}

label {
	width:10em;
	padding-top:.5em;
	display: inline-block;
}

.exercise-assistant label {
	display:inline;
	width:auto;
}

ul {
	margin:0;
	padding:0;
}
.assistant input[type="submit"], input[type="submit"],input[type="button"], input[type="submit"].importantButton, .button,
.ui-combobox-arrow  {
	-moz-border-radius: 4px;
	-webkit-border-radius:4px;
	padding:.5em 1em .5em 1em;
	margin:.3em;
}

#pageLinks a {
	margin:.2em;
}

.assistant .alert {
	width:60%;
}

.exercise-assistant .alert {
	padding-left:1em;
}
.assistant .alert p{
	padding:0 0 0 .5em;
	margin: .2em;
}

.exercise-assistant form {
	width:70%;
	padding-bottom:5em;
}

.exercise-assistant form.formAddSetTag, .exercise-assistant form.formChangeSetCountdown, .exercise-assistant form.formChangeSetRandomOrder {
	padding: 0;
}

.exercise-assistant form#newQuestion {
	width:100%;
}

.exercise-assistant fieldset {
	display: block;
}
fieldset.right {
	float:right;
	text-align: right;
}
fieldset.left {
	float:left;
	text-align: left;
}

.exercise-assistant input[type=text],.exercise-assistant textarea {
	font-size:1.2em;
	width:100%;
	margin-bottom: .4em;
}

.exercise-assistant input[type=text].set_countdown_display {
	width:3em;
}

.button.big, input[type="submit"].big{
	min-width:10em;
	padding:1em;
	margin-bottom:1em;
}
.button.small, input[type="submit"].small{
	min-width:4em;
	padding:.2em .5em .2em .5em;
}

.button.square, input[type="submit"].square{
	min-width:1em;
}


.rowActions {
	visibility: hidden;
}
.rowActions a {
	font-size:.9em;
}

.rowActions ul {
	margin:0;
	padding:0;
	display: inline;
}

.rowActions ul li {
	list-style: none;
	display: inline;
	padding: 0 .5em 0 .5em;
}

.row#newSetWithAssistant {
	height:4em;
	padding-top: 3em;
}

.tag {
	padding:2px;
	padding-left:4px;
	margin:2px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.tagList {
	margin:.5em 0 .5em 0;
}

.tagList li {
	line-height: 2em;
}


 #pageLinks {
	padding-top: 1em;
	text-align: center;
 }
/* HEADER */

.bigLogo #header h1 {
	margin: 35px 0px 0px 37px;
	height:79px;
	width:514px;
	background: url("../images/logoBig.gif") no-repeat;
	text-indent:-10000px;
}
.smallLogo #header h1 {
	margin: 12px 0px 0px 37px;
	height:56px;
	width:390px;
	background: url("../images/logoSmall.gif") no-repeat;
	text-indent:-10000px;
}
#headNav {
	margin: 0;
	padding: 0;
	position: absolute;
	right:27px;
	top:0px;
	margin-top:7px;
}

#header > a {
	border: none;
}

.smallExerciseLogo {
	width:2.5em;
	height: 2.5em;
	vertical-align: middle;
}

/* MAIN */

h4 {
	margin-bottom: 0.2em;
}

.assistant.bigLogo #main
{
	margin-left:120px;
}

.assistant.smallLogo #main
{
	margin-left:85px;
}

.twocol #main, #mainMeta, .onecol #main {
	margin:0 27px 0 27px;
	padding-left:1em;
}

.welcome #main {
	position: relative;
	margin:0 27px 0 27px;
}

.exercise-assistant #main {
	margin: 0 27px 0 27px
}

.onecol-sidebar #main, .twocol-sidebar #main {
	margin:0 27px 0 27px;
}

.onecol-sidebar #pageHead, .twocol-sidebar #pageHead, .exercise-assistant #pageHead {
	position: relative;
	padding-left:1em;
	margin:0;
}

#mainMeta {
	padding:1em 1em .5em 1em;
}

.exercise-assistant #content {
	padding:1em;
	min-height: 100%;
}

.introduction, .assistant.bigLogo p {
	width: 60%;
}

form.rich input[type="text"],form.rich input[type="password"] {
	height:2em;
	width:20em;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	margin-left:.2em;
	font-size: 1.2em;
	padding-left:.5em;
	margin-bottom:.5em;
}

/* quickstart */



#quickstartForm input#qCode {
	display: inline;
	margin:0;
	margin-bottom: .2em;
	padding:2px 6px;
	margin-left:2px;
	border:0;
	width:14em;
	vertical-align: bottom;
}

#quickstartForm {
	position: relative;
	top:-1em;
	float:left;
	padding:0;
	margin: 1em 0 0 43px;
	vertical-align: baseline;
	
}

#quickstartForm form {
	float: left;
	overflow: hidden;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	vertical-align: bottom;
	border:rgb(186,186,186) 1px solid;
	height: 20px;
}


#quickstartForm input[type=submit] {
	height:100%;
	width:auto;
	border:0;
	margin:0;
	padding:0 .3em;
	color:#888;
	height:21px;
	-moz-border-radius-topleft: 0px;
	-webkit-border-top-left-radius:0px;
	-moz-border-radius-bottomleft: 0px;
	-webkit-border-bottom-left-radius:0px;
	vertical-align: top;
}




/* sidebar */

#sidebar {
 	float:left;
 	width:23%;
 	overflow: hidden;
 	min-height:100%;
 	padding-bottom:5em;
 	margin-right:1%;
 }
 
#sidebar .row, #sidebar .moreOptions {
	padding-left:1em;
	padding-bottom: .4em;
}


/* login */

#homeNav {
	margin-top:4em;
	padding:0;
}

#homeNav li {
	font-size: 1.2em;
}


#homeNav li:first-child {
	padding-left: 0;
}


/* registrations */

.email_check_alert {
	background: #FFB;
	padding:1em;
	font-weight: bold;
}
/* welcome */

#horizon {
	position: absolute;
	height:10em;
	top:1em;
	width:100%;
	z-index: -1;
}

* html #horizon {
	display: none;
}

.welcome #items {
	margin-left:5em;
	margin-top:5em;
}

#exerciseList {
	/*float: left;*/
}
#exerciseList li {
	float:left;
	width:20%;
	max-width:200px;
	margin-right: 5%;
	height:26em;
	list-style: none;
}

#exerciseList li a {
	border:none;
}


#exerciseList .logoContainer {
	height: 200px;
}

.welcomeText {
	font-size:1.2em;
}

/* exercises */

#setTable, #parcourTable {
	width:100%;
}

#setTable td, #parcourTable td{
	margin:0;
	padding:0.2em;
}

#pageHead h2 input[type=text],#pageHead h3 input[type=text] {
	border:none;
	width:50%;
}

#setNav {
	position: absolute;
	top:.5em;
	right:.3em;
}

#setViews {
	margin-bottom: 1em;
}

#setViews li {
	list-style: none;
	display: inline;
	padding-right:1em;
}



/* media */

#mediaTable td,.studentList td, .userList td, .classList td  {
	padding: .5em 1em .5em 0;
}

#mediaTable fieldset {
	margin:0;
}

.ui-combobox-list {
	background:white;
	border:#eee 1px solid;
}

.ui-combobox-item {
	width:100%;
	display: inline-block;
}

.medium {
		width:100%;
		overflow: hidden;
		padding-top:.5em;
	}
	
	.medium .preview, .medium .name, .medium .edit {
		float:left;
		overflow: hidden;
	}
	
	.medium .preview {
		width:6em;
	}
	
	.medium .preview img {
		width:5em;
	}
	
	.medium .name, .medium .edit {
		width:10em;
	}
	
	#content .medium .name {
		width:auto;
		padding-right:1em;
	}
	
.mediaExplanation {
	width:70%;
	margin:1em;
	margin-left:3em;
}	

/* parcours */


.job {
	position: relative;
	padding:.1em .5em;
	margin-bottom:19px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	list-style: none;
	width:25em;
	cursor: pointer;
}

.job.empty {
	cursor: default;
}

.job .downArrow {

	position: absolute;
	left:45%;
	bottom:-19px;
	width:62px;
	height:19px;
}

.job:last-child .downArrow, .job.dragging .downArrow {
	display: none;
}

/* mulcho */

.onecol-sidebar #newQuestion {
}
#newQuestion h3 {
	float: left;
	margin-bottom: 0;
}
#fsQuestionType {
	margin: 0;
}

#fsQuestionType label {
	cursor: pointer;
}

#fsQuestionType input {
	visibility: hidden;
}

#fsQuestionType label {
	margin-top:.6em;
	padding:.7em;
	width:auto;
	-webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
}

#fsQuestionType label.checked, #newQuestionContent {
	background: #ededed;
}

#newQuestionContent {
	position: relative;
	left:-1%;
	width: 99%;
	padding:1%;
	overflow: hidden;
}

#newQuestionContent h4 {
	margin-top: 0;
}

#newQuestionMain {
	float: left;
	width: 50%;
}

#newQuestionOptional {
	float: right;
	width: 45%;
}

#newQuestionMain .correctHeader {
	float: right;
}

.onecol-sidebar #newQuestion #fsSubmit {
	display: block;
	clear: both;
} 
#fsQuestionText textarea {
	width:98%;
	height:4em;
}

#fsQuestionAnswer {
	margin-bottom: 1em;
}

#fsAddAnswer {
	margin-top: 0;
}

#fsQuestionAnswer input[type=text] {
	width:91%;
}


#fsAddAnswer {
	padding-top:.5em;
}

#fsSubmit {
	float: right;
}
#questions {
	width:100%;
	margin-bottom: 20%;
}

#questions tr.question td {
	border: none;
	vertical-align: middle;
}

#questions select {
	width:10em;
}
#questions input[name=question_link] {
	width:8em;
}

#fsMedia {
	width:100%;
}

.onecol-sidebar  #newQuestion #fsSubmit {
	position: absolute;
	margin: 0;
	bottom:10px;
	right:10px;
}

#questions td {
	vertical-align: top;
}

#questions td:last-child,#questions th:last-child {
	text-align: center;
}

#questions .linkButton, #questions .mediaButton {
	padding: 0 3px;
	padding-top: 7px;
}

.optionalQuestionContent {
	z-index: 20;
}

.questionPanel {
}

.questionPanel .panelHead {
	padding: 4px;
	padding-top: 10px;
	width:30px;
	background: white;
	-webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;
	border-right:1px solid #aaa;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	z-index:1001;
	position: relative;
	top:1px;
}

.questionPanel.questionMediaPanel .panelHead {
	margin-left:186px;
}

.questionPanel .panelContent {
	padding: 4px;
	position: relative;
	background: white;
	-webkit-box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
	-webkit-border-bottom-left-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
	-moz-border-radius-bottomleft: 4px;
	-moz-border-radius-bottomright: 4px;
	-moz-border-radius-topright: 4px;
	border-bottom:1px solid #aaa;
	border-right:1px solid #aaa;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
}

.questionMediaPanel .panelContent {
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}

.questionLinkPanel {
	display: none;
}
.questionMediaPanel {
	display: none;
	width:20em;
	z-index: 1000;
}

#content .questionMediaPanel  .medium .name {
	width:5em;
	overflow:hidden;
}

.questionMediaPanel .preview {
	width:4em;
}
.questionMediaPanel .preview img {
	width:3em;
}

#content .questionMediaPanel  .medium .edit {
	width: auto;
}

#content .questionMediaPanel  .medium .edit p {
	float: left;
	margin: 0.3em;
}


.questionPanel .panelContent h4 {
	margin-top: 0;
}

.deleteMediumFromNewQuestionLink {
	display: none;
}

.medium:hover .deleteMediumFromNewQuestionLink {
	display: inline;
}
td.optional {
	position: relative;
}

.qOptionsButton {
	display: none;
}

.questionRowOptional {
	display: none;
}

.questionRowOptional .medium {
	width:15em;
	float: left;
}

.questionRowOptional .medium p {
	margin-top:.5em;
}

.questionRowOptional .medium .edit {
	width:auto;
}

.questionRowOptional p.addMedium {
	float: left;
}

.setStatistics {
	width:100%;
}
.evaluation > div {
	float: left;
}

.evaluation.bars {
	width:30%;
}

.evaluation.single {
	max-width: 6em;
}

.setStatistics td {
	padding:.3em 0 .3em 1em;
}

.setStatistics .questionText {

	width: 60%;
}


/* assistant questions */


.exercise-assistant #newQuestion fieldset {
	display: inline;
	margin:0 1em 0 0;
	vertical-align: top;
}

.exercise-assistant #fsQuestionText textarea {
	width:30em;
	height:4em;
}
.exercise-assistant #fsQuestionAnswer input[type=text] {
	width:30em;
}

.exercise-assistant #fsAddAnswer {
	padding-top:.5em;
}

.exercise-assistant #fsSubmit {
	float: right;
}
.exercise-assistant #questions {
	width:100%;
}
.exercise-assistant #questions select {
	width:10em;
}
.exercise-assistant #questions input[name=question_link] {
	width:8em;
}


.exercise-assistant #fsQuestionType input {
	visibility: visible;
}

.exercise-assistant #fsSubmit {
	float: right;
}
/* tetris */

#entries td {
	vertical-align: top;
}

/* gaps */

	
	#sentences div.sentence {
		margin-bottom: .4em;
	}
	
	#sentences .sentence > a, .gap > a {
		text-decoration: none;
		border:none;
	}
	
	div.gapSolutions {
		position: absolute;
		z-index: 10;
		padding: .5em;
		-webkit-border-radius:4px;
		-webkit-border-top-left-radius:0px;
		border-bottom: #ccc 1px solid;
		border-right: #ccc 1px solid;
		
	}
	
	.gapSolutions ul {
		margin:0;
		padding:0;
	}
	.gapSolutions ul li {
		list-style: none;
	}
	
	.gapSolutions .closeButton {
		float:right;
	}
	
	
	.gap {
		padding: .2px;
	}
	
	.sentence > .sentenceMeta {
		visibility: hidden;
	}
	.sentence:hover > .sentenceMeta {
		visibility: visible;
	}
	
	input[name=sentence_text] {
		width:50em;
	}
	ul.sentenceMeta {
		margin:0;
		margin-left: .2em;
		padding: 0;
		display: inline;
	}
	
	ul.sentenceMeta li {
		display: inline;
		list-style: none;
		margin:0;
		padding: 0;
	}
	
	ul.sentenceMeta li a {
		margin:0;
	}
	
	/*gapsExercise*/
	
	#gapExercise {
		margin-left:27px;
		margin-right:27px;
		padding:1em;
	}
	
	.sentence {
		font-size:1.2em;
	}
	
	#set_countdown {
		position: absolute;
		right:3em;
		padding:.4em;
		width:10em;
		border:1px solid #999;
		background:#ffe;
		text-align: center;
	}
	
	/* options */
	
	ul.optionList {
		margin:0;
		padding:0;
		padding-bottom: 1em;
	}
	ul.optionList li {
		list-style: none;
	}


/* quickEditor */

.quickEditor {
	position: relative;
	width:100%;
	overflow: hidden;
}
.quickEditColumn {
	width:20em;
	float:left;
}

.quickEditRow#introduction textarea {
	height:10em;
}

.quickEditor .buttons {
	position: absolute;
	bottom:1em;
	right:2em;
}
	
/* texts */

#textTable {
	margin-top:3em;
}

#textTable td {
	padding:1em;
}



/* FOOTER */


#footer {
	position: absolute;
	bottom:0;
	left:0;
	width:100%;
	margin:0;
	padding-top:1em;
}

#footer #footerContent {	
	padding:.5em;
	padding-right:0;
	margin: 0 27px 0 27px;
}

#footer p {
	display: inline;
}
#footer ul {
	position:absolute;
	right:27px;
	top:17px;
}

/* BEHAVIOURS */

tr:hover .rowActions {
	visibility: visible;
}

.evaluation > div:hover {
	text-indent:0;
}

.noborder {
	border:0;
}