html { height: 100.2% }

body {
	background-color: #ffffff;
	margin: 0;
	padding: 0;
	height:100%;
	text-align : left;
	font-family: Arial, Helvetica, sans-serif;
	font-size : 0.8em;
	}

p, div.p {
	margin-top: 1em;
	margin-bottom: 1em;
}

p a, .p a, li a, td a, h1 a, h2 a, h3 a, h4 a, .downloadrow a, a.a-style, .ticket-links a, a.showChart, h4.toggle, h3.toggle  {
	text-decoration:none;
	font-weight:bold;
	color:#4F0163;
	outline-color: transparent;
	}

p a:visited, .p a:visited, li a:visited, td a:visited, h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, .downloadrow a:visited, a.a-style:visited, a.showChart:visited {
	color:#4F0163;
	}

p a:hover, .p a:hover, li a:hover, td a:hover, h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, .downloadrow a:hover, a.a-style:hover, a.showChart:hover {
	color:#c3801a;
	}

table {
	clear: both;
	}

.mceEditor table {
	clear: none;
}

a {cursor: pointer;}

a.gt, a.lt {white-space: nowrap;}

a.gt:before, a.lt.closed:before {content: '>>> '}

a.gt.open:before, a.lt:before {
	content: '<<< '
}

h3 {
	margin-top: 1.5em;
	margin-bottom: 0;
	}

h3.rowstripe{
	background-color: black;
	color: white;
	padding: 0.2em 0.4em;
	font-size: 0.95em;
}

h3 + img {
	margin-top: 1em;
}

h4.flagrow {
	color: #fff;
	background-color: #000;
	padding: 0.25em 0.6em;
	margin-bottom: 0;
}

h4.flagrow span.icon {
	float: right;
	position: relative;
	top: 0em;
	font-weight: normal;
	font-style: italic;
	font-size: 0.85em;
	margin-left: 1em;
}

h4.toggle, h3.toggle {
	display: block;
	margin-bottom: 0.8em;
	cursor: pointer;
}

h4.toggle:hover, h3.toggle:hover {
	color: #c3801a
}

h4.toggle.gold:hover, h3.toggle.gold:hover {
	color: #4F0163
}

h4.toggle:before, h3.toggle:before, a.toggle:before, a.toggle-above:before {
	content: '>>> '
}

h4.toggle.open:before, h3.toggle.open:before, a.toggle.open:before, a.toggle-above.open:before {
	content: '<<< '
}

div.assessment > h4 span.icon {
	top: 0;
}

.float.right, form.right {float:right;}

.float.left, form.left {float:left;}

textarea { resize: none}

/* HIDDEN TEXT EDIT FORM */

div.replace-with-text-edit {
	padding: 1em;
	border: solid 2px #666;
	position: relative;
}

form.hidden-text-edit {
	display: none;
}

form.hidden-text-edit textarea {
	width: 100% !IMPORTANT;
}


.TCNote {
	margin: 10px;
	padding: 12px;
	max-width: 250px;
	min-height: 40px;
	background-color: yellow;
	color: green;
	font-family: "Comic Sans MS" , 'Lucida Casual', "Brush Script MT" , cursive ;
	border-radius: 5px;
	box-shadow: 3px 3px 8px #666;
	}

.toggleall {
	cursor:pointer;
	text-decoration: underline;
	text-align: center;
	}

.alertbox {
	background: rgb(255, 200, 200);
	border: solid 1px red;
	padding: 0 1em;
	position: relative;
	margin-bottom: 1em;
}

.alertbox h3, .alertbox h4 {
	color: white;
	background: red;
	display: block;
	margin: 0 -0.9em;
	padding: 0.3em 2em;	
}

.alertbox.ab-info {
	border-color: green;
    background: rgb(200, 255, 200);
}
.alertbox.ab-info h3, .alertbox.info h4 {
    background: green;
}
 
.alertbox.ab-alert {
	border-color: #c3801a;
    background: rgb(255, 225, 200);
}
.alertbox.ab-alert h3, .alertbox.info h4 {
    background: #c3801a;
}

/* WHOLE INTRANET STRUCTURE */

#conn-page {
	position: relative;
	height: 100%;
	margin: 0 auto;
	}

#loggedinas {
	position: absolute;
	text-align: center;
	width: 100%;
	}

#loggedinas span {
	margin: auto;
	text-align:center;
	background-color: #fff370;
	padding: 5px 20px;
	max-width: 700px;
	font-weight: bold;
	border-radius: 0 0 10px 10px;
	}

#conn-banner {
	min-height:40px;
	width:100%;
	background-color: #4F0163;
	}

#conn-header {
	max-width:850px;
	min-width:680px;
	margin:auto;
	}

#conn-header ul {
	float: right;
	list-style:none;
	display: inline;
	}

#conn-header ul li {
	float:right;
	color: #ffffff;
	padding-right:0.8em;
	padding-left: 0.8em;
	}

#conn-header ul li a {
	color: #ffffff;
	}

#conn-header ul li a:hover {
	color: #c3801a;
	}

a#logo {
	display: inline-block;
	color: #fff;
	text-decoration: none;
	margin: 0;
	margin-left: 0.5em;
	font-size: 1.6em;
	font-weight: bold;
	position: relative;
	top: 0.4em;
	transition: all .2s ease-in-out;
}

a#logo:hover {
	transform: scale(1.15);
}

#staffLogSummary{
	border-bottom: solid 1px #ddd;
	padding: 0.1em  1em;
	margin-bottom: 1em;
}

#textarea
{
	margin: 0 auto 10px;
	padding:10px;
	min-width: 660px;
	position:relative;
	max-width:830px;
	}

#textarea.textarea-wide { max-width:1020px; }

#textarea.textarea-extrawide { max-width:1400px; }

#conn-rightpanel {
	position:absolute;
	top:0;
	right:0;
	display:block;
	width:200px;
	height:100%;
	}

#conn-footer {height: 120px}

#conn-footer {
	margin:auto;
	min-width: 680px;
	text-align: center;
	font-size:0.8em;
	border-top: 1px solid #000000;
	background-color: #fff;
	padding-top: 3px;
	}

#conn-footer a {
	text-decoration: none;
	}

#conn-footer ul {
	clear:left;
	float:left;
	list-style:none;
	margin:0;
	padding:0;
	position:relative;
	left:50%;
	text-align:center;
	}

#conn-footer ul li {
	float:left;
	margin:0;
	position:relative;
	text-align: center;
	right:50%;
	background-image: url(../images/goldsquare4.gif);
	background-repeat: no-repeat;
	background-position: 5px 5px;
	padding-left: 14px;
	}

/* NAVIGATION BAR */

#nav-header {
	width:100%;
	min-height: 3em;
	background-color: #eeeeee;
	/* z-index: 9; */
	}

#navbar {
	max-width: 850px;
	min-width: 680px;
	margin: auto;
	padding-top: 0.8em;
	padding-left: 0px;
	min-height: 32px;
	}

#navbar form.inline input {
	top: 6px;
}


#nav-hoverlist {
    position: relative;
    float:left;
    left: -12px;
    z-index: 8;
    display: block;
    }

#nav-dropdown {
    position: absolute;
    left: 0px;
    z-index:10;
    font-size: 1.25em;
    background-color: #eee;
    display: none;
    min-width: 160px;
    box-shadow: 3px 3px 4px #aaa;
    padding: 0 20px 0 20px;
    }


#nav-dropdown ul {
    list-style: none;
    padding: 0;
    margin: 10px 0;
    }

#nav-hoverlist li {
    margin: 0;
    padding: 0;
    }

#nav-hoverlist li + li {
    margin-top: 5px;
    }

#nav-hoverlist a {
	color: #c3801a;
	font-weight: bold;
	position: relative;
	top: -0.2em;
	text-decoration:none;
	}

a.dropdown {
	padding-right: 0.3em;
}

a.dropdown:after {
	position: relative;
    top: -0.12em;
    left: 0;
    display: inline-block;
    border-right: 0.3em solid transparent;
    border-top: 0.3em solid #c3801a;
    border-left: 0.3em solid transparent;
    content: '';
}

#nav-dropdown a {
	font-size: 1em;
	}

#nav-hoverlist > a {
    font-size: 2em;
    display:block;
    height: 30px;
    padding: 0 20px 0 20px;
    top: -3px;
    }

#nav-hoverlist a:visited
  {color: #c3801a;}

#nav-hoverlist a:hover {
	color: #aaa;
	cursor: pointer;
	}

#nav-hoverlist input {
	border: none;
	background-color: #f8f8f8;
	padding: 0.6em;
}

#nav-hoverlist input:focus {
	background-color: #fff;
}

a.dropdown:hover:after {
    border-top: 0.3em solid #aaa;
}

#nav-hoverlist a:active
  {color: #ccc;}

ul.nav-links {
	float: right;
	list-style: none;
	padding: 0.2em 0.8em 0 1em;
	margin: 0;
	}

ul.nav-links li {
	float: right;
	margin: 0;
	padding: 0 0 0 0.8em;
	white-space:nowrap;
	}

#navbar form.inline {
	top: -0.75em;
	}

form.inline label {
	font-weight: bold;
	}


/* BULLETS AND DECORATIONS */

ul.goldbullets {
	list-style: url(../images/goldsquare8.gif);
	padding-left: 2em;
	}

ul.goldbullets.twocolumn, ul.goldbullets.threecolumn {
	float: left;
}

ul.goldbullets.twocolumn {
	width: 45%;
}

ul.goldbullets.threecolumn{
	width: 28%;
}

ul.goldbullets li {
	padding-left:0.5em;
}

ul.goldbullets > li + li {
	padding-top: 0.5em;
	background-position: 0 0.85em;
}

ul.goldbullets ul, ol ul {
	list-style: disc url(../images/golddot8.png);
	padding-left: 1.5em;
	padding-bottom: 0.3em;
}

ul.goldbullets ul ul, ol ul ul {
	list-style: circle;
	padding-left: 1.5em;
	}

ul.goldbullets li li, ol li li {
	padding-top: 0.3em;
}

ul.goldbullets.bordered li {
	padding-bottom: 9px;
}

ul.goldbullets.bordered li + li {
	border-top: solid 1px #ccc;
}

ul.spaced li {
	padding-bottom:0.5em;
}

ul.spaced li + li {
	padding-top:0.7em;
	background-position:  0 1.05em;
}

.bullets-detail {
	margin-top:0.5em;
	margin-bottom:0.3em;
}

.bullets-note {
	padding-left:0.3em;
	margin-top: 0.2em;
	margin-bottom:0.2em;
	font-style: italic;
	font-size: 0.9em;
}

div.split-by-grey-line.include-first, div.split-by-grey-line +  div.split-by-grey-line {
	margin-top: 0.8em;
	padding-top: 0.3em;
	border-top: solid 1px #ccc;
}


/* VIEW BAR */

.viewbar {
	padding-bottom: 8px;
	position: relative;
	top: -4px;
	}

.viewbar h2 {
	margin: 0;
	}

.viewbar ul {
	float: right;
	padding: 0;
	margin: 0;
	list-style: none;
	max-width: 50%;
	}

.viewbar ul li {
	float: right;
	margin-bottom: 0px;
	}

.viewbar ul li a {
	color: #fff;
	font-size: 0.8em;
	float: right;
	margin-left: 8px;
	margin-bottom: 8px;
	padding: 4px 8px;
	background-color: #c3801a;
	}

.viewbar ul li a:hover {
	background: #7f5411;
	}

.viewbar-pic {
	width:25px;
	height:25px;
	border: solid 1px #4F0163;
	float:left;
	margin-right: 10px;
	}

.viewbar + h3 {
	margin-top: 0;
}

.overview-panel {
	display:block;
	background-color: #fff9cc;
	padding: 0.5em 1em;
	border-top: solid 3px #f6f6bc;
	border-bottom: solid 3px #f6f6b9;
	position: relative;
	z-index: 5;
	}

.overview-panel.event-panel {
	min-height: 120px	
}

.overview-panel h3 {
	margin-top: 0.6em;
	}

.overview-panel label {
	font-weight: normal !IMPORTANT
}

.overview-panel > form.radiosettings {
	float: left;
	padding: 7px 10px;
	margin-left: 4px;
	margin-right: 4px;
	}

.overview-panel > form.radiosettings label {
	font-weight: bold !IMPORTANT;
}

div.debug {
	border: 4px solid green;
	background-color: #f9f9f9;
	padding: 0 1.3em 0.5em;
}

/* JAVASCRIPT ALERT BANNER  */

.jsalert, .techalert {
	margin: auto;
	margin-top: 12px;
	padding: 0.8em;
	width:30em;
	background-color: red;
	color: white;
	text-align: center;
	font-weight: bold;
	font-size: 1.3em;
	border-radius: 15px;
	}

/* PERSONSEARCH  */

table.retainsize, table.retainsize td {
	font-size: 1em;
	padding-top: 0;
	padding-left: 0;
}

.closeabove {
	margin-top: 0.3em;
	margin-left: 0;
	padding-left: 2em;
}

/* SPLIT-HOVER-SELECT */

.split-select {
	width: 100%;
	font-size: 0.9em;
	margin-bottom: 4em;
	}

.split-select form {
	position: static;
	}

.split-select-parent {
	width:30%;
	padding: 0.5em;
	min-height: 30px;
	position: relative;
	}

.split-select-parent .split-left {
	background: #fff;
	display: block;
	padding: 10px 10% 10px 0;
	width: 40%;
	position: relative;
	}

.split-select-parent:nth-child(odd) .split-left {
	background: #eee;
	}

.split-select-parent:hover .split-left, .split-select-parent .split-left.active {
	background-color: #fea;
	}

.split-left form, .split-left span.mini-icons {
	position: absolute !IMPORTANT;
	right: 10px !IMPORTANT;
	top: 2px !IMPORTANT;
	cursor: pointer;
	display: block;
	}
.split-left span.mini-icons {
	top: 12px !IMPORTANT;
	}

.split-left span.icon {
	right: 5px !IMPORTANT;
	}

.split-select-parent > .split-right {
	display: none;
	}

.split-select-parent:hover > .split-right {
	display: block;
	position: absolute;
	top: 0;
	left:50%;
	margin: 0;
	}

.split-select-parent .split-right>ol, .split-select-parent .split-right>ul  {
	margin: 0;
	padding: 0;
	list-style-position: inside;
	height: 100%;
	}

.split-select-parent .split-right>ul  {
	list-style: none;
	}

.split-right {
	padding-top: 0 !IMPORTANT
}

.split-select-option  {
	margin: 0;
	padding: 10px 80px 10px 15px;
	position: relative;
	}

.split-select-option:hover  {
	background-color: #ed9;
	}


.split-select-option input  {
	position: absolute;
	right:5px;
	top: 5px;
	cursor: pointer;
	}


/* ORDERS */

a.orderline-link {
	display: inline-block;
	margin-top: 5px;
}

/* RESOURCES */

span.reading-attrib {
	display: block;
	margin-top: 0.3em;
	font-style: italic;
	font-size: 0.95em;
}

/* TO DO */

.todo-column {
	float:left;
	width:50%;
	}

.todo {
	width:90%;
	float:left;
	background-color: #fffaba;
	margin: 0 2% 20px 1%;
	padding: 10px 2% 5px;
	border-radius: 5px;
	box-shadow: 1px 2px 2px #888;
	}

.todo-right { margin-right: 1% }

.todo div.deadline {
	float:right;
	margin: -6px -6px 0;
	padding: 5px 15px 15px 25px;
	font-weight: bold;
	}

.todo div.due {
	background: transparent url('../images/connected/task-due.png') no-repeat ;
	}

.todo div.overdue {
	background: transparent url('../images/connected/task-overdue.png') no-repeat ;
	}

ul.todo-sub {
	float:left;
	padding-left:20px;
	margin:3px;
	}

ul.todo-sub li {
	font-size: 0.9em;
	}

div.taskfooter {
	float:left;
	clear:both;
	font-size:0.8em;
	margin-left:0.5em;
	}

.completed, .comp-date { color: #777; }

.completed { text-decoration: line-through; }

.comp-date { font-size:0.8em }

/* EVENTS AND EVALUATION */

ul.eval-comments li:hover {
	color:#c3801a;
}

form.comment-process {
	padding-right: 0;
}

li.more-comments {
	list-style-type: none;
	cursor: pointer;
	font-weight: bold;
	color: #4F0163
}

li.more-comments:hover {
	color: #c3801a
}

.rep-filters {
	background-color: #eee;
	padding: 0.5em 1em ;
	margin-bottom: 1em;
	margin-top: 1em;
}

.rep-filters form {
	display: inline-block; padding-right: 12px; margin-bottom: 8px
}

.rep-filters h3	{
	margin-top: -0.7em; margin-bottom: 1em;
}

.rep-filters h4	{
	color: #c3801a; margin: 0.5em 0 0.2em;
}

.filterblock {
	float: left;
	margin-bottom: 1em;
}

.filterblock.right {
	float: right;
}


.filterblock label {
	display: inline-block; width: 5em; margin-top: 0.5em;
}

.status {
	font-size: 1.4em;
	color: green;
	}

.status span {
	font-weight: bold;
	}

.status span + span {
	font-size: 0.65em;
	color: #4F0163;
	}

.event-checklist {
	width: 30%;
	float: right;
	margin: 20px 15px 15px 25px;
	border: solid 3px #c3801a;
	border-radius: 6px;
	box-shadow: 3px 3px 4px #ccc;
	background-color: #fff;
	position: relative;
	z-index: 10;
}

.checklist h3 {
	margin: 0;
	background-color: #c3801a;
	color: #fff;
	padding: 6px;
	}

.checklist > ul {
	list-style: none;
	padding: 8px 10px;
	margin: 0;
}

.checklist label {
	font-weight: bold;
	}

.checklist > ul > li {
	padding: 5px;
	margin: 0;
}

.checklist > ul > li + li {
	border-top: dotted #d9d9d9 0.1em;
}

.checklist .icon a {
	float:right;
	display: block;
	height: 16px;
	width: 16px;
}

.checklist .popform {
	float: right;
}

.event-notes {
	width: 60%;
}

.event-notes h4 {
	font-size: 0.9em;
	margin-bottom: 4px;
}

.event-notes textarea, event-notes div.textarea {
	width: 95%;
}

.contract-notes {
	width: 80%;
}

.contract-notes h4 {
	font-size: 0.9em;
	margin-bottom: 4px;
}

/* .contract-notes textarea, contract-notes div.textarea {
	width: 75%;
} */

.promo {
	padding: 8px;
}

.promo h3 {
	font-size: 1.1em;
	margin-top: 4px;
	margin-bottom: 4px;
}

input.submit-tuck {
	float: right;
	position: relative;
	top: -1.2em;
	right: 2em;
	margin: 0;
}

table.commercials {
	border: solid 1px black;
	margin-top: 1.2em
}

table.commercials tr:last-child {
	border-top: solid 1px black;
}

table.commercials td {
	padding: 0.8em 0.5em 0.5em ;
}

table.commercials td:last-child {
	text-align: right;
}


img#coverpreview {
	margin: 2em 0 1em ; 
	border: 1px solid #888;
	display: block;
	max-width: 500px;
	cursor: pointer;
	}

.coverpreview {
	width: 8em;
	cursor: pointer;
	background-color: #ccc;
	border: solid 2px #999;
}

.coverpreview:hover {
	width: 8em;
	cursor: pointer;
	border: solid 2px #c3801a;
	box-shadow: 3px 3px 3px #ccc
}

.coverpreview.grande {
	width: 28em;
}

.coverpreview.grande.float.left {
	margin-right: 2em;
}

div.coverpreview {
	height: 16em;
	padding: 1.5em;
}



/* USERS */

.user-checklist {
	width: 50%;
	position: relative;
	float:right;
	background-color: #eee;
	margin-left: 30px;
	}

.user-checklist:before {
	position: absolute;
	display: inline-block;
	border-top: 16px solid transparent;
	border-right: 16px solid #eee;
	border-bottom: 16px solid transparent;
	border-right-color: #eee;
	left: -16px;
	top: 16px;
	content: '';
}

.user-checklist  h3, .user-checklist  h4 {
	background-color: #eee;
	color: #c3901a;
	margin-left: 15px;
	padding: 9px 0px 3px;
	border-bottom: solid 1px #c3801a
	}

.user-checklist  h4 {
	color: #000;
	border: none;
	padding: 0;
	margin-bottom: 0
}

.user-checklist > ul > li+li {
	border-color: #888;
	}


/* ASSOCIATES */

.calendar {margin-bottom: 3em;}
.calendar a {float:left; display: block; width:1.5em; height:1em; border: 2px solid #999; font-size:1.8em; text-align:center;padding-bottom: 0.1em;
color: #666}
.calendar a.blank {background-color: transparent; border-color: transparent; font-weight:normal}
.calendar a.limited {background-color: darkorange; color: #710}
.calendar a.unavailable {background-color: darkred; color: white}
.calendar a.weekend, .calendar td.weekend {background-color: #888;}
.calendar a.past {background-color: #bbb; color:#444}
.calendar a.training {background-color:#0b0; color: white;}
.calendar a.training.past {background-color: #060;color:#fff}
.calendar a.provisional {background-color: #8e8; 	color: #666}
.calendar a.observing {background-color: #09b;color:#fff}
.calendar a.observing.past {background-color: #024;color:#fff}
.calendar a.weekend.past {background-color: #666;}
.calendar a.weekend.unavailable {background-color: #500; color:#220800}
.calendar a:hover {background-color: #c3801a !IMPORTANT; color:#fff !IMPORTANT}
.calendar tr.flagrow:hover {cursor:pointer}
.calendar tr.flagrow td {border-top: solid 6px #fff; border-bottom: solid 4px #fff;background-color:#4F0163}

table.calendar.multi {
	border-spacing: 10px
}

.calendar.multi td {
	width: 100px;
}

.calendar.multi td.date {
	border: solid 1px #ddd;
	font-size: 1.4em;
}

.calendar.multi td.date a {
	font-size: 1em;
}

.calendar.multi td.ellipsis {
	font-size: 3em;
	text-align: right;
	color: #aaa;
	vertical-align: bottom;
}

.calendar.multi h4 {
	font-weight: normal;
	font-size: 1.3em;
	margin: 0;
}

.avail-assoc {
	display: inline-block;
	background-color: #ddd;
	font-weight: bold;
	margin-top: 0.5em;
}

.avail-assoc span, .avail-assoc-remove {
	display: inline-block;
	background-color: #bbb;
	padding: 3px 5px;
}

.avail-assoc span {
	background-color: green;
	color: #fff
}

table.assoc-table {
	font-size: 1.11em
}

.assoc-pic {
	position: relative;
	top: 10px;
	margin-right: 25px;
	margin-bottom: 20px;
	border: solid 2px #c3801a;
}

/* LEARNING */

ol.learning-objectives {
	padding: 0;
	list-style-position: inside;
	}

ol.learning-objectives > li {
	padding: 8px 0 ;
	font-weight: bold;
	}

ol.learning-objectives ul.aims {
	font-weight: normal;
	padding-left: 35px;
	}

ol.learning-objectives ul.aims li li {
	padding-top: 5px;
	}
	
ol.aims > li > li {
	margin-bottom: 0.7em;
}

/* ELEARNING */

#elearning-display {
	position:relative;
	min-height: 400px;
	}

#elearning-page-bar {
	position: absolute;
	top: 0;
	left: 20px;
	width:74px;
	padding: 0.5em;
	margin-right: 25px;
	background-color: #eee;
	border-radius: 0 25px 0 0;
	box-shadow: 3px 4px 6px #888;
	min-height: 300px;
	}

#elearning-page-bar div {
	border-top: #ddd solid 1px;
	padding: 5px 0 15px 0;
		clear:both;
	}

#elearning-page-bar h4 {
	margin-top: 0.2em;
	margin-bottom: 0.5em;
	}

#elearning-page-bar a.page, #elearning-page-bar a.livepage {
	display: block;
	clear:both;
	margin: 5px;
	margin-left: 0;
	float:left;
	width: 25px;
	height: 35px;
	padding-top:0px;
	border: black solid 1px;
	text-decoration: none;
	text-align: center;
	line-height: 2;
	font-weight:bold;
	background-color: #d6ddbb;
	box-shadow: 2px 3px 2px #888;
	}

#elearning-page-bar a.page:hover {
	background-color: #c3801a;
	color: white;
	}

#elearning-page-bar a.livepage,
#elearning-page-bar a.livepage:hover {
	background-color: #445555;
	color: #fff;
	}

#elearning-page-bar ul {
	padding-top: 5px;
	}

#elearning-body {
	padding-left: 160px;
	max-width: 703px;
	}

.elearning-hiddenbox {
	position: relative;
	margin: 0 -1em 0 -1em;
	padding: 10px;
	border-radius: 15px;
	border: solid 3px #c3801a;
	}

.elearning-hiddenbox h3 {
	font-weight: bold;
	position: relative;
	margin: 0;
	padding-left: 8px;
	color: #c3901a;
}

.elearning-element {
	position:relative;
	padding-right: 120px;
	border-top: #eee solid 1px;
	min-height: 50px;
	}

.elearning-element > img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

.elearning-element > ul {
	list-style: url(../images/goldsquare8.gif);
	padding-left: 2em;
	}

.elearning-element > ul li {
	padding-left:0.5em;
}

.elearning-element > ul li+li {
	padding-top: 0.5em;
	background-position: 0 0.85em;
}

.elearning-batch-submit {
	text-align: right;
	border-top: #bbb solid 1px;
	padding-top: 10px;
	}

.elearning-editbox {
	position:absolute;
	right:0px;
	top:10px;
	}

.elearning-table {
	margin-top: 0.8em;
	}

p.journal-space {
	border: solid 1px #ddd;
	font-family: 'Comic Sans', 'Comic Sans MS', Arial, 'sans serif';
	padding: 10px;
	padding-left: 80px;
	min-height: 50px;
	background-color: #eee;
	background-image: url(../images/elearning/journal-trans-60.png);
	background-repeat: no-repeat;
	background-position: 5px 5px;
}

.journal-space > span {
	font-family: Arial, Helvetica, sans-serif;
	display: block;
	font-size: 0.85em;
	margin-top: 0.3em;
}

div.elearning-list-edit {
	background-color: white;
	margin-left: 0.8em;
	border: solid 1px #aaa;
	padding: 1em;
	}

div.elearning-list-edit > ul {
	list-style: square url(../images/goldsquare8.gif);
	padding-left: 2em;
	}

div.elearning-list-edit ul li {
	margin-top: 4px;
	margin-bottom: 4px;
	}

td.elearning-table-editbox {
	border: transparent solid 0px;
	width:70px;
	vertical-align:bottom;
	text-align: right;
	}

td.elearning-table-editbox.cols {
	border-left: dotted gray 1px;
	border-right: dotted gray 1px;
}

td.elearning-table-editbox.rows {
	border-top: dotted gray 1px;
	border-bottom: dotted gray 1px;
}

.mcq-aim {
	border-top: solid 1px #888;
	padding: 4px 8px;
	border-bottom: solid 1px #888;
	padding-bottom: 4px;
	background: black;
	color: white;
}

/* NAVIGATION BAR */

ul#navigation  {
	position: relative;
	width:100%;
	margin: 0 auto;
	font-size: 15px;
	line-height: 20px;
	text-align:center;
	text-decoration: none;
	padding: 5px 0;
	list-style-type: none;
	border-bottom: 1px solid #999;
	background-color: #eee;
	}

#navigation li {
	display: inline;
	margin: 0;
	}

#navigation a {
	display: inline-block;
	margin: 0 2px;
	height: 20px;
	width: 20px;
	padding: 2px;
	/* background-color: #f9f9f0; */
	}

#navigation a:hover {
	background-color: #c3801a;
	color: #fff;
	}

#navigation a.off, #navigation a.off:hover {
	color: #888;
	}

#navigation a.off:hover {
	background-color: #ddd;
	color: #888;
	cursor: pointer;
	}

#navigation a.thispage {
	background-color: #4F0163;
	color:#fff;
	cursor: pointer;
	}

#navigation a.thispage:hover {
	background-color: #000;
	color:#fff;
	}

#navigation a.first, #navigation a.last {
	background: transparent url(../images/elearning/elearning-navsprite.png) -3px -3px;
	}

#navigation a.last {background-position: -33px -3px}
#navigation a.last {background-position: -33px -3px}
#navigation a.first:hover {background-position: -3px -33px}
#navigation a.last:hover {background-position: -33px -33px}
#navigation a.last.off:hover {background-position: -33px -3px}
#navigation a.first.active {background-position: -3px -63px}
#navigation a.last.active {background-position: -33px -63px}


#navigation a.thispage:hover {
	background-color: #000;
	color:#fff;
	}

#navigation li.more:hover {
	cursor: default;
	}

li#nav-next, li#nav-prev {
	position: absolute;
	width: 35px;
	left: 0;
	top: 0;
	bottom: 0;
	padding: 5px 0;
	border-right: solid 1px #999;
	background-color: #eee;
	}

li#nav-next {
	left: auto;
	right: 0;
	border-right: none;
	border-left: solid 1px #999;
	}

li#nav-next a, li#nav-prev a {
	background: #eee url(../images/elearning/elearning-iconsprite.png?v=2) no-repeat;
	background-position: -252px -122px;
	}

li#nav-prev a {
	background-position: -315px -122px;
	}

li#nav-next a:hover {
	background-position: -273px -122px;
	background-color: #eee;
	}

li#nav-prev a:hover {
	background-position: -335px -122px;
	background-color: #eee;
	}

li#nav-next a.off, li#nav-next a.off:hover {
	background: #eee url(../images/elearning/elearning-iconsprite.png?v=2) no-repeat;
	background-position: -252px -122px;
	}

div.qualification {
	border: solid 2px #c3801a;
	border-radius: 10px;
	padding: 0 20px;
	margin-bottom: 1.5em;
}

div.qualification h3 {
	margin-top: 1em;
}

div.qualification .subtitle {
	font-style: italic;
	font-size: 1.1em;
	color: #666;
	margin-top: 0;
}

div.candidate-assign table.rowstripe tr.submitrow {
	background-color: transparent;
	border: none;
}

div.candidate-assign table.rowstripe td, div.candidate-assign table.rowstripe th {
	padding-left: 1em;
}

div.assessment, div.candidate-assign {
	box-shadow: 0px 2px 3px #ddd;
	border: solid 1px #ccc;
	margin-bottom: 20px;
}

div.assessment {
	background-color: #fff;
}

div.assessment > h4 {
	background-color: #ccf3bb; /* Green */
	margin: 0;
	padding: 5px 10px;
	cursor: pointer;
}

div.assessment.empty > h4 {
	background-color: #fdd; /* Red */
}

div.assessment.partial > h4 {
	background-color: #fec; /* Amber */
}

div.assessment.learning > h4 {
	background-color: #ff9; /* Yellow */
}

div.assessment.complete > h4 {
	background-color: #cef; /* Blue */
}

div.assessment.boring > h4 {
	background-color: #ddd; /* Grey */
}

div.assessment > h4:hover {
	background-color: #ddd;
}

div.assessment > h4 span {
	float: right;
	position: relative;
	top: 0.2em;
	font-weight: normal;
	font-style: italic;
	font-size: 0.85em;
	margin-left: 1em;
}

div.assessment > h4 span.icon {
	top: 0;
}

div.assessment h4.ticket {
	padding-left: 80px;
	position: relative;
}

div.assessment h4.ticket em {
	position: absolute;
	left: 10px;
	top: 8px;
}

div.assessment > div {
	padding: 0 15px 5px;
	position: relative;
	padding-top: 20px
}

div.assessment p.assessment-header {
	margin-top: -1em;
	font-weight: bold;
	color: green
}

div.assessment p.assessment-header span {
	border-bottom: 1px solid ;
	border-color: green;
	padding-bottom: 0.2em;
}

div.assessment p.assessment-header.empty span {
	color: red;
	border-color: red
}

div.assessment p.assessment-header.partial span {
	color: orange;
	border-color: orange
}

div.assessment p.assessment-header.learning span {
	color: darkgoldenrod;
	border-color: darkgoldenrod
}

div.assessment p.assessment-header.complete span {
	color: blue;
	border-color: blue
}

div.assessment p.assessment-header.boring span {
	color: #555; /* Grey */
	border-color: #555; /* Grey */
}

div.assessment tr.pathway td {
	font-size: 1.2em;
	color: #c3801a;
	padding-left: 0.2em;
	padding-top: 1em;
}

tr.qual-course {
	border-top: solid 1px #eee;
	border-bottom: solid 1px #eee;
}

div.ticket-links {
	position: absolute;
	top: 0; right: 10px;
	padding: 6px 14px;
	background-color: #eed;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	border: solid 1px #ccc;
	border-top: none;
	/* box-shadow: 2px 2px 2px #ddd */
}

ul.assoc-links {
	display:block;
	margin:  -5px -15px;
	margin-top: 1.8em;
	padding: 0 ;
	border-top: solid 1px #ddd;
	background-color: #eee;
	font-size: 0.85em;
}

ul.assoc-links li {
	display: inline-block;
	padding: 0;
	margin: 0;
	border-right: solid 1px #ddd;
}

ul.assoc-links li a {
	display: block;
	padding: 0.6em 1em;

}

ul.assoc-links li a:hover {
	background-color: #c3801a; color: #fff;
}

.cs-extras {
	float: right;
	background: #eee;
	padding: 0 1.6em 1em;
	width: 20em;
	position: relative;
}

.cs-extras div.p, .cs-extras p {
	border-bottom: solid 1px #ddd;
}

.cs-extras img {
	width: 50%;
	margin: 0 0.8em 0.5em 0;
	float: left;
}

.email-hidden {
	width: 350px;
	position: absolute;
	left: 200px;
	background-color: #ffc;
	border: solid 1px #fff;
	display: none;
	padding: 1em 2em;
	box-shadow: 5px 5px 5px #888888;
	z-index: 15;
}
a.email-content-cancel {
	float: right;
	position: relative;
	top: -0.5em;
	right: -1.5em;
	background-color: #eeb;
	padding: 4px 7px;
}
a.email-content-cancel:hover {
	background-color: #e1e1b1;
}

/* TEXT ABBREVIATION (for jquery) */

span.complete{
    display:none;
}

span.more{
	background:yellow;
    color:navy;
    font-weight: bold;
    padding:1px 3px;
    cursor:pointer;
}

/* CLICK TO REVEAL */

.clicktoreveal:hover {
	cursor:pointer;
	}

span.listitem {
	display: inline-block;
	vertical-align: text-top;
	}

span.disableddetector {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	opacity: 0;
	width: 1.5em;
	height: 1.5em; 
	}
	
input+span.disableddetector {
	display: none;
	}
	
input[disabled]+span.disableddetector {
	display: inline;
	}

#elearning-link {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 5;
	}

#elearning-link a {
	display: block;
	width: 100px;
	height: 100px;
	background: #4F0163 url(../images/elearning/elearning-buttonsprite3.png) -10px -6px no-repeat;
	border-radius: 0 60px 0 0;
	box-shadow: 3px 3px 4px #333;
	}

/* MESSAGE */

#message-area {
	position: absolute;
	top: 0px;
	left: 70px;
	right:70px;
	min-width: 200px;
	opacity: 0.95;
	background-color: #ee2;
	color: #000;
	font-weight: bold;
	z-index: 2;
	padding: 8px 45px;
	border-radius: 0px 0px 15px 15px;
	box-shadow: 2px 2px 3px #999;
	text-align: center;
	margin: 0;
}

#message-area a {
	display: block;
	width: 30px;
	height: 20px;
	padding: 0;
	margin: 0;
	position: absolute;
	right: 6px;
	top: 6px;
	border-left: solid 1px #000;
	text-decoration: none;
	font-size: 1.4em;
	font-weight: bold;
	font-family: Arial, sans serif;
	color: #000;
}

#message-area a:hover {
	color: #666;
	border-color: #666;
	cursor: pointer;
	}

div.alpha {
	float: left;
	padding-top: 0.4em;
	padding-bottom: 0.4em;
	display: block;
	}

div.alpha ul {
	display: inline-block;
	padding: 0;
	margin: 0;
	list-style: none;
	font-size: 0.85em;
	color: #aaa;
	}

div.alpha li {
	display: inline-block;
	padding-left: 0.2em;
}

div.alpha li + li {
	border-left: solid 1px #eee;
	}

div.float a {
	font-weight: bold;
	color:#4F0163;
	cursor:pointer;
	}

div.float a:hover {
	color:#c3801a;
	}

/* QUICK HIDE/SHOW  */

.hidden {
	display: none;
}

.hiddendata {
	padding: 3px;
	}

a.showdata {cursor:pointer}

/* POPUP FORMS */

.popform {
	position: relative;
	display: inline-block;
	}

.popform a {
	font-weight: bold;
	color:#4F0163;
	cursor:pointer;
	}

.popform a:hover {
	color:#c3801a;
	}

.popform form {
	display: none;
	min-width: 150px;
	position: absolute;
	left: -20px;
	top: -20px;
	padding: 10px;
	background-color: #545;
	border-radius: 8px;
	opacity: 0.9;
	z-index: 15;
	}

.popform form.active {
	opacity: 1;
	}

.popform.offset form {
	left: 70px;
	}

.popform input, .popform label {
	margin: 3px 0;
	display: block;
	}
	
.popform input.hidden {
	display:none;
}

.popform select {
	margin-bottom: 0.3em
}

.popform legend {
	color: #c3801a;
	font-weight: bold;
	font-size: 1.2em;
}

.popform label {
	color: #fff;
	font-weight: bold;
	font-size: 1.1em;
}

.popform p {
	color: #fff;
}

.popform .labelnote {
	color: #fff;
	display: block;
}

.popform table {
	font-size: 1.2em;
}

.popform input[type=submit], .popform input[type=reset], .popform input[type=button] {
	display: inline-block;
}

tr.formrow {
	position: relative;
	}

tr.formrow > td > input, tr.formrow > td > select {
	border: none;
	background-color: transparent;
	}

tr.formrow.fr-active > td > input, tr.formrow.fr-active > td > select {
	border: solid 1px black;
	background-color: white;
}

tr.formrow.fr-active td {
	background-color: #bce3f3;
	padding-top: 5px;
	padding-bottom: 5px;
}


/* TABS */

#tabs {
	display:none;
	}

#tabs > div {
	min-height: 250px;
}

#tabs > div > p:first-child, #tabs > div > h3:first-child {
	margin-top: 0;
}

#tabs > div.clear {
	min-height:1px
	}

#tabs > ul {
	margin-bottom: 8px;
}

li a {outline-color: transparent;}

form.headerfilter {
	float: right;
	padding: 5px 0px 5px 3px;
	}

form.headerfilter label {
	font-weight: bold;
	}

form.headerfilter select {
	background-color: #fffaec;
	}

#tabs form.headerfilter {
	position: relative;
	top: -16px;
	}

form.tablefilter {
	display: block;
	background: #bce3f3;
	text-align: right;
	padding: 7px 10px;
}

form.tablefilter > fieldset {
	display: inline-block;
	border: 0;
	padding: 0;
	margin-left: 8px;
	position: relative;
	text-align: left;

}

form.tablefilter > fieldset label {
	font-weight: bold;
	font-size: 1em;
}

#tabloader, #calendarloader {
	margin-top: 100px;
	display: block;
    margin-left: auto;
    margin-right: auto;
    top: -15px;
	}

tr.rowpointer td {
	background-color: #7fbfcf;
	color: #fff;
	font-weight: bold;
	font-size: 1.2em;
	}

tr.rowpointer td {
	text-align: center;
	}

table.upload td  {
	border-left: solid 1px #aaa;
	font-weight: bold;
}

table.upload td  {
	border-left: solid 1px #aaa;
}

table.upload td  {
	border-left: solid 1px #aaa;
}

table.upload td.ignore  {
	font-weight: normal;
	font-style: italic;
	font-size: 0.8em;
	background:#ddd;
}

table.upload tr  {
	border-top: solid 1px #aaa;
}

table.upload tr.header td, table.upload tr.header th  {
	color: #fff;
	background: #000;
}

table.upload th {
	color: #c3801a !IMPORTANT
}

.downloadrow {
	padding-left: 6em;
	position: relative;
	min-height: 8em;
	font-size: 0.9em;
	padding-top: 1em;
	border-top: solid 1px #ccc
}

.downloadrow em {
	font-size: 0.9em;
	color: #999;
	}

.downloadrow a img {
	display: block;
	position: absolute;
	width: 4.5em;
	left: 0em;
	top: 1.5em;
	}



/* LETTER CIRCLES (STAND-IN FOR ICONS) */

a.letter-disc, .icon a.letter-disc {
	font-size: 10px;
	padding-top: 1px;
	width: 16px;
	height: 15px;
	text-align: center;
	border-radius: 10px;
	background-color: #6f96a5;
	background-image: none !IMPORTANT;
	color: #fff !IMPORTANT;
}

a.letter-disc:hover, .icon a.letter-disc:hover {
	background-color: #c3801a !IMPORTANT;
	background-image: none !IMPORTANT;
}

/* FEEDBACK QUOTES (based on www) */

.feedback-quotes li {
	display:block;
	background-color: #f9f0d4;
	padding: 0.8em 1.4em;
	position: relative;
	margin-bottom: 2em;
	margin-top: 2em;
	border: solid 1px #f3d096;
}

.feedback-quotes li {
	display:block;
	background-color: #f9f0d4;
	padding: 0.8em 1.4em;
	position: relative;
	margin-bottom: 2em;
	margin-top: 2em;
	border: solid 1px #f3d096;
}

.feedback-quotes.cols {
	padding-left: 0.3em;
	padding-right: 0.7em;
	width: 30%;
	margin-right: 0;
	float: left;
	min-width: 10em;
}

.feedback-quotes.cols li {
	margin-bottom: 1em;
	margin-top: 1em;
}

.feedback-quotes.cols span.biglquotes, .feedback-quotes.cols span.bigrquotes {
	display: none;
}


.feedback-quotes li p {
	margin-top: 0.6em;
	margin-bottom: 0.6em;
}

.feedback-quotes li em {
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	margin-top: 0.5em;
	line-height: 1.4em
	}



/* TEXT FORMATS (KEEP AT END TO OVERRIDE) */

.imagerep {
	position: absolute;
    left: -999em;
    width: 1em;
    overflow: hidden;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}

.clear { clear:both; }

.small { font-size: 0.8em }

.smallish { font-size: 0.9em; line-height: 1.3em}

.tiny {font-size: 0.7em}

.larger { font-size: 1.1em }

.large { font-size: 1.2em }

.huge { font-size: 1.5em }

.gold { color: #c3801a !IMPORTANT; }

.red { color: red !IMPORTANT; }

.green { color:green !IMPORTANT }

.grey {color: #999 !IMPORTANT; }

.greyish {color: #666 !IMPORTANT}

.orange {color: orange !IMPORTANT}

.white {color: #fff !IMPORTANT; }

.greyfill {background-color: #bbb !IMPORTANT}

.greenfill {background-color: green !IMPORTANT}

.goldfill {background-color: #c3801a !IMPORTANT}

.redfill {background-color: red !IMPORTANT}

.orangefill {background-color: orange !IMPORTANT}

.bluefill {background-color: #bce3f3 !IMPORTANT}

.whitefill {background-color: #fff !IMPORTANT}

.nonbreaking, table.nonbreaking-headers th { white-space: nowrap; }

.regular {font-weight: 400 !IMPORTANT}
.light {font-weight: 200 !IMPORTANT}
.strong, .bold { font-weight: 700  !IMPORTANT }

.italic { font-style: italic  !IMPORTANT }
.roman { font-style: normal }

.underlined { text-decoration: underline  !IMPORTANT }

p.lined { border-top: solid 2px black; border-bottom: solid 2px black; padding: 0.5em;}

.centred {text-align: center !IMPORTANT}

.leftalign {text-align: left !IMPORTANT}

.rightalign {text-align: right !IMPORTANT}

.topalign {vertical-align: top !IMPORTANT}

.bottomalign {vertical-align: bottom !IMPORTANT}

.v-centred {vertical-align: middle !IMPORTANT}

.strikethrough { text-decoration: line-through !IMPORTANT}

.no-border {border: none 0px transparent !IMPORTANT}

.padded {
	padding-top: 0.5em !IMPORTANT;
	padding-bottom: 0.5em !IMPORTANT
}

/*

.ui-timepicker-inline { display: inline; }

#ui-timepicker-div { padding: 0.2em; }
.ui-timepicker-table { display: inline-table; width: 0; }
.ui-timepicker-table table { margin:0.15em 0 0 0; border-collapse: collapse; }

.ui-timepicker-hours, .ui-timepicker-minutes { padding: 0.2em;  }

.ui-timepicker-table .ui-timepicker-title { line-height: 1.8em; text-align: center; }
.ui-timepicker-table td { padding: 0.1em; width: 2.2em; }
.ui-timepicker-table th.periods { padding: 0.1em; width: 2.2em; }

/* span for disabled cells */
.ui-timepicker-table td span {
        display:block;
    padding:0.2em 0.3em 0.2em 0.5em;
    width: 1.2em;

    text-align:right;
    text-decoration:none;
}
/* anchors for clickable cells */
.ui-timepicker-table td a {
    display:block;
    padding:0.2em 0.3em 0.2em 0.5em;
    width: 1.2em;
    cursor: pointer;
    text-align:right;
    text-decoration:none;
}


/* buttons and button pane styling */
.ui-timepicker .ui-timepicker-buttonpane {
    background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0;
}
.ui-timepicker .ui-timepicker-buttonpane button { margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
/* The close button */
.ui-timepicker .ui-timepicker-close { float: right }

/* the now button */
.ui-timepicker .ui-timepicker-now { float: left; }

/* the deselect button */
.ui-timepicker .ui-timepicker-deselect { float: left; }

pre {
	font-size: 0.93em;
    white-space: pre-wrap !IMPORTANT;
	word-break: keep-all !IMPORTANT;
	tab-size: 1em;
}

