@charset "UTF-8";
/* CSS Document */

body {
	margin:0;
	padding:0;
	text-align:center;
	font-size:11px;
	line-height:1.45;
	font-family:Verdana,Arial,Helvetica,sans-serif;
	color:#333333;
	text-align:center;
}

h1 {
	color:#4E4A4A;
	font-size:1.6em;
	font-weight:normal;
	line-height:1.3em;
	margin:0;
	padding:.4em 8px;

}
hr {
	color: #005288;
	border:0;
	background:#005288;
	height:1px;
}

a {
	color: blue;
	text-decoration:none;
}

a:hover {
	color:#7C3520;
	text-decoration:underline;
}

.clearfloat { 
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

img {
	border:0;
}

/* for messages on the public side */
#msg {
	display : inline-block; /* to make it go full width */
	padding: 10px 2% 10px 2%;
	width: 95.5%;
	font-weight: bold;
	font-style: italic;
	border: 2px solid #FF1526;
	background: #FBCACF;
	border: 2px solid #FF1526;
	color: #FF1526;
}

#surveyhead {
	display : inline-block; /* to make it go full width */
	padding: 10px 2% 10px 2%;
	width: 95.5%;
	font-family:"Times New Roman", Times, serif;
	text-align:left;
	font-size:1.2em;
	border: 2px solid #FF1526;
	background: #F2F2EB;
	border: solid 1px #005288;
	color:#005288;	
}
#whiteBkrnd {
	background:#fff;
	margin-top:2px;
	padding-bottom:8px;
}

#whiteBkrnd p{
	padding-left:8px;
	padding-right:8px;
}
/* MASTHEAD STYLES */

#masthead {
	width:100%;
}
	

#mastheadContainer {
	width: 88%;
	margin: 0 auto;
}

#contentPage {
/*	background:url(/images/TrainingServicesLogoExtend.jpg) center bottom no-repeat; */
	height:107px;
}

#moeLogo {
	position: absolute;
	top: 0px;
	left:0px;
	margin:0;
	text-align:left;
}

/* top nav */

#topNavDiv {
	float: right; 
	width: 200px; 
	padding:0;
}
#topNav {
	width: 200px; height: 44px;
    background: url(/images/topNav.gif);
    margin: 0 auto; padding: 0;
    position: relative;
}
#topNav li {
    margin: 0; padding: 0; list-style: none;
    position: absolute; top: 0;
}
#topNav li, #topNav a {
    height: 40px; display: block; 
}
#topNav a {padding-top:4px;}

#contactUs {left: 0; width: 90px;}
#help {left: 85px; width: 50px;}
#login {left: 131px; width: 69px;}
  
  
#contactUs a:hover { background: transparent url(/images/topNav.gif) 0 -44px no-repeat;}
#help a:hover { background: transparent url(/images/topNav.gif) -85px -88px no-repeat;}
#login a:hover { background: transparent url(/images/topNav.gif) -131px -132px no-repeat;}

#e-AdminLogo {
	margin:0 auto;
	text-align:center;
}

/* MAIN NAV */

#mainNav ul {
	list-style-type: none;
	padding-left:0;
	text-align:left;
	/*width:14%;*/
	margin-left:0;
	margin-right:0;
}

#mainNav li {
	background-image:url('/images/mainNavDash.gif');
	background-repeat: no-repeat;
	background-position: 0px 10px;
	padding: 3px 0 3px 14px;
	border-bottom:solid 1px #fff;
	text-align:left;
}
#mainNav li li:last-child {
	border-bottom: none;
}

/* CONTENT STYLES */

#contentBkrnd {
	background:#EDEDE2;
	padding:1.3em 0;
	width:100%;
}

#content {
	width:50%;
	margin: 0 auto;
	text-align:left;
}

#contentMain {
	width:88%;
	margin:0 auto;
}

#contentTableDiv {
	float:right;
	text-align:left;
	width:84%;
}
#mainNav {
	text-align:left;
	padding-left:0;
	margin:0;
}

/* breadcrumbs */

#breadcrumbs {
	background:#F2F2EB;
	border-bottom:solid 2px #fff;
	color: #005288;
	padding: 3px;
	}

#breadcrumbs ul {
	margin-left: 0;
	padding-left: 0;
	display: inline;
	border: none;
	} 

#breadcrumbs ul li {
	margin-left: 0;
	padding-left: 2px;
	border: none;
	list-style: none;
	display: inline;
	}

/* email styling */	
#emailcontent {
	width:98%;
	margin: 5 auto;
	text-align:left;
}
.emailTitle	{
	text-align:left;
	padding:0 0px 0 0;
	font-size:1.2em;
	font-weight: bold;
	color:#E4433E;
}

.emailfooter {
	border-top: 1px solid black;
	text-align:left;
	padding:0 0px 0 0;
	font-size:0.8em;
	color:#333333;
}
span.droptext {
	border-bottom: thin dotted; 
	background: white;
}
span.droptext:hover {
	text-decoration: none; 
	background: #ffffff; 
	z-index: 6; 
}
span.droptext span {
	position: absolute; 
	left: -9999px;
  	margin: 20px 0 0 0px; 
	padding: 3px 3px 3px 3px;
  	border-style:solid; 
	border-color:black; 
	border-width:1px; 
	z-index: 6;
}
span.droptext:hover span {
	left: 2%; 
	background: #ffffff;
} 
span.droptext span {
	position: absolute; 
	left: -9999px;
  	margin: 4px 0 0 0px; 
	padding: 3px 3px 3px 3px; 
  	border-style:solid; 
	border-color:#005288; 
	border-width:1px;
}
span.droptext:hover span {
	margin: 20px 0 0 170px; 
	background: #ffffff; 
	z-index:6;
} 

.EmailH1	{
	color:#4E4A4A;
	font-size:1.4em;
	font-weight:bold;
	line-height:1.2em;
	margin:0;
}

.EmailH2	{

}

/* table styling */

#gridTable, .contentTable7Col, .contentTable6Col, .contentTable5Col, .contentTable4Col, .contentTable3Col, .contentTable2Col, .contentTable1Col {
	border:0;
	width:100%;
	text-align:left;
	vertical-align:top;
	border-collapse:collapse;
}

.tableTitle {
	border-bottom:solid 1px #005288;
	text-align:left;
	padding:0 28px 0 0;
	font-family:"Times New Roman", Times, serif;
	font-size:1.2em;
	color:#005288;
}

.tableRowHead {
	text-align:left;
	padding:6px 0 0 0;
	color:#005288; 
}

.tableTitle a {
	color:#005288;
	text-decoration:none;
}

TD.calendarheading {
	border: 1px solid #EDEDE2;
	background : #EDEDE2;
}

TD.calendarnormal {
	background : White;
	border: 1px solid #EDEDE2;
	text-align:left;
}

.contentTable7Col th, .contentTable6Col th, .contentTable5Col th, .contentTable4Col th , .contentTable3Col th , .contentTable2Col th, .contentTable1Col th {
	color:#005288;
	background:#F6F6F0;
	font-weight:normal;
}

.contentTable7Col th, .contentTable6Col th, .contentTable5Col th, .contentTable4Col th , .contentTable3Col th , .contentTable2Col th, .contentTable1Col th, .contentTable5Col td, .contentTable4Col td , .contentTable3Col td , .contentTable2Col td, .contentTable1Col td {
	padding:6px 4px;
}

.contentTable7Col tr.bkrndColour, .contentTable6Col tr.bkrndColour, .contentTable5Col tr.bkrndColour, .contentTable4Col tr.bkrndColour , .contentTable3Col tr.bkrndColour , .contentTable2Col tr.bkrndColour, .contentTable1Col tr.bkrndColour {
	background:#F6F6F0;
}

#gridTable td.col2 {width:24%; vertical-align:top; padding:0 8px;}

#gridTable td.col2 p {margin-top:0;}

#gridTable td.col1 {width:76%; vertical-align:top; padding-left:8px;}

.contentTable7Col th.col1 {width:11;}
.contentTable7Col th.col2 {width:150;}
.contentTable7Col th.col3 {width:80;}
.contentTable7Col th.col4 {width:16%;}
.contentTable7Col th.col5 {width:100;}
.contentTable7Col th.col6 {width:100;}
.contentTable7Col th.col7 {width:150;}

.contentTable6Col th.col1 {width:20%;}
.contentTable6Col th.col2 {width:16%;}
.contentTable6Col th.col3 {width:16%;}
.contentTable6Col th.col4 {width:16%;}
.contentTable6Col th.col5 {width:16%;}
.contentTable6Col th.col6 {width:16%;}

.contentTable5Col th.col1 {width:32%;}
.contentTable5Col th.col2 {width:17%;}
.contentTable5Col th.col3 {width:17%;}
.contentTable5Col th.col4 {width:17%;}
.contentTable5Col th.col5 {width:17%;}

.contentTable4Col th.col1 {width:34%;}
.contentTable4Col th.col2 {width:22%;}
.contentTable4Col th.col3 {width:22%;}
.contentTable4Col th.col4 {width:22%;}

.contentTable3Col th.col1 {width:56%;}
.contentTable3Col th.col2 {width:22%;}
.contentTable3Col th.col3 {width:22%;}

.contentTable2Col th.col1 {width:56%;}
.contentTable2Col th.col2 {width:44%;}

.contentTable1Col th.col1 {width:100%;}																								
	

/*FOOTER STYLES */

#footer {
	width: 100%;
	height:85px;
	background:url(/images/footerBkrnd.jpg) repeat-x;
}
#footerContent {
	padding-top:26px;
	width:88%;
	margin: 0 auto;
	text-align: center;
}
#footerContentLeft {
	text-align:left;
	width:30%;
}
#footerContentRight {
	float:right;
	text-align:right;
	width:68%;	
}

.coursefull      {background-color:#F08080;}
.coursenotfull   {background-color:#98FB98;}

#faqdiv ul {
	list-style-type: none;
}

#faqdiv li {
	background-image: url('/images/mainNavDash.gif');
	background-repeat: no-repeat;
	background-position: 0px 10px;
	padding: 3px 0 3px 14px;
}

#faqdiv h3 {
	font-size: 1.17em;
	color: black;
	padding-bottom: 0px;
	padding-top: 0px;
	margin-bottom: 1em;
	margin-top: 1em;
}
#faqdiv .catDescription {
	font-style:italic;
}

.faqKeywords {
	margin-left: 1em;
	FONT-STYLE: italic;
}

.faqDescr {
	margin-left: 1em;
}

.faqDocs {
	margin-left: 1em;
	FONT-STYLE: italic;	
}

.faqDocsfile {
	FONT-STYLE: normal;
}

#faqHRCategory {
    border: 0;
    height: 1px;
    background: #333;
    background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:    -moz-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:     -ms-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:      -o-linear-gradient(left, #ccc, #333, #ccc); 
	}
	
#faqHR {
    border: 0;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
	}
	
.moduleHighlight {
	background-color: lavender
}

.menuHighlight {
	color: #005288; 
	font-weight: bold
}

.menuHighlight:hover {
	color: #005288;
}

/**
  * Our very own lightbox
  * 
  * Given an img tag like this:
  
<img src="http://lms.minedu.govt.nz/images/misc/ViKI_MOduleSheet.gif" alt="" border="0">
  
  * Edit markup like this:
  
<a class="lightbox" href="#" onclick="jQuery(this).next().addClass('show'); return false;">
   <img src="http://lms.minedu.govt.nz/images/misc/ViKI_MOduleSheet.gif" alt="" border="0">
</a> 
<div class="lightbox-target">
   <img src="http://lms.minedu.govt.nz/images/misc/ViKI_MOduleSheet.gif" alt="" border="0">
   <a class="lightbox-close" href="#" onclick="jQuery(this).parent().removeClass('show'); return false;"></a>
</div>

 **/

/* Styles the thumbnail */

a.lightbox {
	position: relative;
}

a.lightbox img {
	height: 150px;
	border: 3px solid white;
	box-shadow: 0px 0px 8px rgba(0,0,0,.3);
	margin: 20px 20px 20px 8px;
}

/* Add some text over the img */
a.lightbox:after {
    content: "Click to enlarge";
    background-color: #eee;
    padding: 5px;
    position: absolute;
    left: 50%;
    margin-left: -50px;
    top: -90px;
}

/* Styles the lightbox, removes it from sight and adds the fade-in transition */

.lightbox-target {
	position: fixed;
	top: -100%;
	width: 100%;
	left: 0;
	background: rgba(0,0,0,.7);
	width: 100%;
	opacity: 0;
	-webkit-transition: opacity .5s ease-in-out;
	-moz-transition: opacity .5s ease-in-out;
	-o-transition: opacity .5s ease-in-out;
	transition: opacity .5s ease-in-out;
	overflow: hidden;
}

/* Styles the lightbox image, centers it vertically and horizontally, adds the zoom-in transition and makes it responsive using a combination of margin and absolute positioning */

.lightbox-target img {
	margin: auto;
	*margin: 10px; /* for ie7 */
	position: absolute;
	top: 0;
	left:0;
	right:0;
	bottom: 0;
	max-height: 0%;
	max-width: 0%;
	border: 3px solid white;
	box-shadow: 0px 0px 8px rgba(0,0,0,.3);
	box-sizing: border-box;
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
}

/* Styles the close link, adds the slide down transition */

a.lightbox-close {
	display: block;
	width:50px;
	height:50px;
	box-sizing: border-box;
	background: white;
	color: black;
	text-decoration: none;
	position: absolute;
	top: -80px;
	right: 0;
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
    background-position-y: 17px;
    background-position-x: 19px;
    background-repeat: no-repeat;
    background-image: url(/images/btn_delete.gif);
}



.lightbox-target.show {
	opacity: 1;
	top: 0;
	bottom: 0;
	/* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}

.lightbox-target.show img {
	max-height: 100%;
	max-width: 100%;
}

.lightbox-target.show a.lightbox-close {
	top: 0px;
}
/* End lightbox */

/* rebrand start */
body {
	font-family: 'Lato', sans-serif;
	font-size: 14px;
}
#whiteBkrnd > a {
  padding-left: 8px;
}
#contentPage {
	height: 84px;
}
#contentBkrnd {
	padding-top: 0;
}
#topNavDiv {
	float: none;
	width: 100%;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-size: 2em;
}
#topNavDiv a {
	color: white;
}
#topNavDiv .last img {
	height: 62px;
}
#pageTitle {
	background-color: white;
}
#pageTitle #mainPageTitle {
	text-transform: uppercase;
	font-size: 2.5em;
	text-align: left;
	padding-left: 6%;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
}
#pageTitle #subPageTitle {
	font-size: 1.7em;
	text-align: left;
	padding-left: 6%;
	padding-bottom: 3px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
}
#pageTitle #triangles {
	height: 60px;
	float: right;
	width: 120px;
	margin-top: -60px;
}
#breadcrumbs {
	background: none;
	border-bottom: none;
	padding-top: 0;
}
/*
.front #contentTableDiv, .login #contentTableDiv {
	width: 100%;
}
*/
#mainNav li a.menuHighlight {
	color: #7E7E80;
}
#mainNav ul ul li {
	margin-left: 10px;
}

#pageTitle #triangles img {
	width: 120px;
	height: 60px;
}

/* resources - green */
.resources #contentPage, .default #contentPage, .help #contentPage {
	background-color: #8DC658; /* dark green */
}

.resources #contentMain, .default #contentMain, .help #contentMain {
	background-color: #D6ECBF; /* light green */
}
.resources #contentBkrnd, .default #contentBkrnd, .help #contentBkrnd {
	background-color: #D6ECBF; /* light green */
}
.resources   .contentTable7Col th, .resources .contentTable6Col th, .resources .contentTable5Col th, .resources .contentTable4Col th, .resources .contentTable3Col th, .resources .contentTable2Col th, .resources .contentTable1Col th {
	color: black;
	background: #C3E4A2; /* mid green */
}
.resources #mainNav li.menuHL {
	border-bottom: solid #8DC658 /* dark green */ 5px;
	margin-bottom: 5px;
}

.contact #contentPage {
	background-color: #DE4A41; /* dark red */
}
.contact #contentMain {
	background-color: #F4BFBC; /* light red */
}
.contact #contentBkrnd {
	background-color: #F4BFBC; /* light red */
}
.contact #mainNav li.menuHL {
	border-bottom: solid #8DE4A41 /* dark red */ 5px;
	margin-bottom: 5px;
}


/* blue - default */
.home #contentPage, .training #contentPage {
	background-color: #5687C7; /* dark blue */
}

.home #contentMain, .training #contentMain {
	background-color: #C2D6ED; /* light blue */
}
.home #contentBkrnd, .training #contentBkrnd {
	background-color: #C2D6ED; /* light blue */
}
.home .contentTable7Col th, .home .contentTable6Col th, .home .contentTable5Col th, .home .contentTable4Col th, .home .contentTable3Col th, .home .contentTable2Col th, .home .contentTable1Col th,
.training .contentTable7Col th, .training .contentTable6Col th, .training .contentTable5Col th, .training .contentTable4Col th, .training .contentTable3Col th, .training .contentTable2Col th, .training .contentTable1Col th {
	color: black;
	background: #60A8DE; /* mid blue */
}

.home #mainNav li.menuHL, .training #mainNav li.menuHL {
	border-bottom: solid #5687C7 /* dark red */ 5px;
	margin-bottom: 5px;
}

a.calendarArrow {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 33px;
  vertical-align: middle;
  line-height: 33px;
  color: black;
}
a.calendarArrow:hover {
	text-decoration: none;
}

.calendar TD.calendarheading {
	border: 1px solid #60A8DE;
	background: #60A8DE;
}
.calendar TD.calendarnormal {
	background: #C2D6ED;
}


/* profile and announcements  - red */
.profile #contentPage {
	background-color: #DE4A41; /* dark red */
}
.profile #contentMain {
	background-color: #F4BFBC; /* light red */
}
.profile #contentBkrnd {
	background-color: #F4BFBC; /* light red */
}
.profile #mainNav li.menuHL {
	border-bottom: solid #DE4A41 /* dark red */ 5px;
	margin-bottom: 5px;
}

/* timetable */
.timetable #contentPage {
	background-color: #F4B540; /* dark Orange */
}
.timetable #contentMain {
	background-color: #FAE6B2; /* light Orange */
}
.timetable #contentBkrnd {
	background-color: #FAE6B2; /* light Orange */
}
.timetable #mainNav li.menuHL {
	border-bottom: solid #F4B540 /* med Orange */ 5px;
	margin-bottom: 5px;
}
.timetable .contentTable7Col th, .timetable .contentTable6Col th, .timetable .contentTable5Col th, .timetable .contentTable4Col th, .timetable .contentTable3Col th, .timetable .contentTable2Col th, .timetable .contentTable1Col th {
	color: black;
	background: #F7DC90; /* mid orange */
}


.tableTitle {
	border: none;
	border-bottom: none;
}
.tableTitle, .tableTitle a {
	font-family: 'Montserrat', sans-serif;
	color: black;
}
#mainNav li {
	background-image: none;
	border-bottom: none;
	padding-left: 0;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
}
#mainNav li a {
	color: black;
}
#footer {
	background: none;
}
#footerContent {
	padding-top: 7px;	
}
#footer #footerContentLeft {
	width: 75%;
}
#footer #footerContentRight {
	width: 25%;
}
#footer #footerContentLeft img {
	margin-left: -6px;
}
#footer #footerContentRight img {
	width: auto;
	height: 72px;
	margin-right: -4px;
}
ul.arrowunderline{
	list-style-type:none;
	margin:0;
	padding:28px 0 10px 5px;
	text-align:left; /* enter "left", "right", or "center" to orient the menu accordingly */
}

ul.arrowunderline li{
	display:inline;
	margin-right:25px; /* spacing between each menu item */
}
ul.arrowunderline li.last {
    float: right;
	margin-top: -15px;
	margin-right: 0;
}

ul.arrowunderline li a{
	position:relative;
	padding-bottom:11px; /*spacing between each menu item and arrow underline beneath it */
	text-decoration:none;
}

ul.arrowunderline li a:selected{
	border-bottom:3px solid white; /* style of arrow underline */
}

ul.arrowunderline li a.selected:after{ /* use CSS generated content to add arrow to the menu */
	content:'';
	width:0;
	height:0;
	position:absolute;
	left:50%;
	margin-left:-14px; /* value should match border-width below */
	top: 25px;
	bottom: 0;
	border-width:14px; /* value should match margin-left above */
	border-style:solid;
	border-color: transparent transparent white transparent; /* create up arrow */
}

/* from Induction page */

td.tableInputLabel {
    max-width: 30px;
}
.backgrounddiv {
	background-color: white/*#EDEDE2*/;
}
.itemSummary {
  padding: 8px;
  word-wrap: normal;
}
#whiteBkrnd .itemSummary p {
  padding-left: 0;
}
.left_container input {
	float:left;
	margin-left: 4px;
	top: 3px;
	position: relative;
}
.left_container label {
	display: block;
	margin-left: 22px;
    padding-top: 2px;
    padding-right: 20px;
	padding-bottom: 7px;
}
.left_container label.group {
	padding-top: 0;
	font-weight: bold;
	padding-bottom: 0;
	margin-left: 3px;
}
.left_container label.group.dateheading {
	font-weight: normal;
	font-style: italic;
}
.left_container .showDetails {
	cursor: pointer;
}
.right_container {
    background: white;
    margin-left: 310px;
    min-height: 300px;
	overflow: auto;
}
.right_bottom_container {
	float: left;
	width: 100%;
	padding-bottom: 20px;
}
.left_container {
    float: left;
    width: 300px;
    background: white;
    min-height: 300px;
	padding-left: 5px;
	padding-right: 5px;
	border-right: 1px solid #C2D6ED;
}
.left_container .checklist_container, .right_container .right_details {
	position: relative;
	overflow-y: auto;
	-ms-overflow-y: auto;
}
.right_container {
	padding-left: 10px;
}
.inductionWrapper h1.tableTitle.checklist {
	border-bottom:none;
	padding-left: 2px;
} 
.inductionWrapper h1.tableTitle.other {
	border-bottom:none;
	padding-top: 18px;
} 
.inductionWrapper h1.tableTitle.learning {
	border-bottom:none;
	padding-left: 2px;
	display:inline;
} 
.aVideo{
	float:left;
	/*height:200px;*/
	width: 50%;
	padding-bottom: 10px;
}
.aVideo img {
	max-width: 96%;
	width: 300px;
	height: auto;
}
.aVideo div.contentWrapper {
	position: relative;
	width: 300px;
}
.aVideo div.title {
	background-color: #005288;
	color: white;
	margin-top: 15px;
	line-height: 2em;
	text-indent: 12px;
	width: 96%;
}
.aVideo a::after {
	content: '';
	position: absolute;
	background-repeat: no-repeat;
	background-image: url('/images/play_video.png');
	height: 250px;
	width: 250px;
	left: 85px;
	top: 28px;
	background-size: 50%;
}
ul.recLearnList {
  padding-left: 1px;
}
.induction_footer {
	min-width: 563px;
	padding-left: 5px;
	background-color: white;
	margin-top: 26px;
}
.induction_footer table {
	width: 100%;
	line-height: 2.5em;
}
.recsAndLinks li {
  float: left;  
   width: 25%;
}
ul.recLearnList, ul.recLearnListLegend {
  list-style: none;
}
.recLearnList li, .recLearnListLegend li {
  float: left;  
  width: 25%;
  line-height: 25px;
}
/*  To llow wrapping */
.recsAndLinks li:nth-child(5) {
  clear: both;
}
#legendHolder {
	margin-left: 234px;
	margin-top: -43px;
}
span.needsApproval {
	background: url('http://trainingservices.org.nz/images/flag_warn.gif') center no-repeat;
	height: 11px;
	width: 15px;
	display: inline-block;
}
li label, .legendText, .recsAndLinksSpan {
	display: inline-block;
	max-width: 75%;
	vertical-align: top;
	line-height: 15px;
	padding-top: 3px;
	*display: inline; 	/* IE7 hack */
	*zoom: 1;			/* IE7 hack */
}
#divider {
	background: #C2D6ED;
	margin-left: 5px;
	margin-right: 5px;
	height: 1px;
}
.tooltip{
    display: inline;
    position: relative;
}
.tooltip:hover:after{
    background: #eee;
	background: -webkit-linear-gradient(top, #FEFEFF, #E4E5F0);
	background: linear-gradient(top, #FEFEFF, #E4E5F0);	  	
    border-radius: 5px;
    top: 100%;
    color: black;
    content: attr(title_);
    left: 0;
    padding: 5px 15px;
    position: absolute;
    z-index: 98;
    width: 200px;
	border: 1px solid black;
}
.right_container.hasChecklistDetails {
  padding-right: 10px;
  padding-left: 10px;
}

.hide {
	display:none;
}
.inline {
	display: inline;
}
.inlineBlock {
	display: inline-block;
}
.block {
	display: block;
}
/* school left nav.  ie7 can't handle toggling of menu items so just hide them. */
.ie7 #leftNav #programmesLink,
.ie7 #leftNav #browseLink,
.ie7 #leftNav #profileLink,
.ie7 #leftNav #myTeamLink {
	display: none;
}			

/* for long URLS etc. */
table.documentstable.wordbreakLinks tr td:nth-child(1),
table.documentstable.wordbreakLinks tr td:nth-child(2) a,
.inductionWrapper .right_container a {
    word-break: break-all;
	display: inline-block;
}
.inductionWrapper .right_container .recsAndLinks a {
	word-break: normal;
	display: block;
}
@media only screen and (max-width: 1600px) {
    width: 25%;
}

@media only screen and (max-width: 1300px) {
    .recLearnListLegend li {
        width: 33%;
    }
    .aVideo {
    	width: 100%;
    }
}

@media only screen and (max-width: 1200px) {
    .recLearnListLegend li {
        width: 50%;
    }
    .recLearnList li {
        width: 33%;
    }
   .recsAndLinks li {
        float: none;
        width: 100%;
    }
}
@media only screen and (max-width: 1250px) {
	#legendHolder {
		margin-left: 0;
		margin-top: 0;
	}
}

@media only screen and (max-width: 1000px) {
     .recLearnList li {
        width: 50%;
    }
}
@media only screen and (max-width: 800px) {
     .right_container {
        margin-left: 0px;
    }
}
.circle {
	border-radius: 50%;
	width: 16px;
	height: 16px; 
	display: inline-block;
	margin-left: 6px;
	margin-right: 8px;
	top: 0px;
	position: relative;
	*display: inline; 	/* IE7 hack */
	*zoom: 1;			/* IE7 hack */
}
@media print {
	#contentPage,
	#pageTitle #triangles,
	#mainNav, 
	.profile #whiteBkrnd div table.gridTable, 
	input#submit1,
	a img {
		display: none;
	}
	#contentTableDiv {
		width: 100%;
	}
	form table tr td {
		white-space: nowrap;
	}

}
