/*	 	LAST UPDATE: 22/06/2012 			*/
/*	 	STS BLUE LOOK & FEEL APPLIED 		*/

/* HTML ELEMENTS  */
html { height:100%; }
html, table { z-index:-1000; font-size: 100%;   /* IE Hack to enforce correct font-sizing */ }

body {margin: 0px; padding: 0px; border: 0px; font-size: 100%;  /* This removes the border around the viewport in old versions of IE */ width: 100%; background: #EEF3FA !important;  font: normal 12px Verdana, Geneva, sans-serif;  }
form { margin: 0px; border: 0px; display:inline;}
input { font-family: Verdana; }

pre {
	font-family:verdana;
}

h1, h2, h3, h4 { margin: .8em 0 .2em 0; padding: 0; font-weight: bold; font-family:	Verdana,Geneva,sans-serif;}
h1 {margin-top: 0px; margin-bottom: 12px;  font-size: 1.4em; color:#394A59;font-family:Verdana,Geneva,sans-serif; }
h2 { font-size: 1.15em; margin-bottom: 6px; color: #900020;  }
h3 { font-size: 1.1em;  }
p { margin: .8em 0 .8em 0; padding: 0; clear: right; line-height: 17px; }
a { color: #1542A5; text-decoration: none;} 
a:hover, a:active, a:focus { color: #1542A5; background: none; text-decoration: underline; }
img { margin: 0; border: none;  }
ul, li { margin-top: 6px; margin-bottom: 6px; }


/* LAYOUT STYLES */

/* LAYOUT: HEADER */
#header { clear: both; float: left; width: 100%; border: 0; margin: 0; padding: 0; height: 100px; background: #2655A5 url(../images/header.jpg) no-repeat center; color: #FFF; }
#header_loggedIn { clear: both; float: left; width: 100%; border: 0; margin: 0; padding: 0; height: 100px; background: #2655A5 url(../images/headerLoggedIn.jpg) no-repeat center; color: #FFF; }
#app-title { font: normal 20px Verdana,Geneva,sans-serif; font-weight:bold; color:#343434; margin-bottom:14px;}
.subheader { background: #E1E5F1; border-bottom: 1px solid #F2EAD9; border-top: 1px solid #93AAD2; padding: 3px 0px; }	 

h1.sands, 
.sands_banner { background: #112B46;  
		font-size: 16px; 
		font-weight:bold;
		color: white; 
		padding: 11px; }

/* PT Removed all print layouts, so prints same as screen. Background graphics required. Will print lhs menu. (04/09/2014 PT SKILLS_REFORM Defect 893)*/ 

/* LAYOUT: GLOBALNAVBAR (Underneath Header) */
#globalnavbar {width: 100%; height: 30px; background: url(../images/subheader.jpg); border-top: 1px solid #FFF; overflow:hidden;}
#globalnavbarMenu { margin-top: 6px; margin-left: 18px; float: left; display: inline; }

.navbar-nav > li > a.nav-selected {background-color: #fdea11; color:black;}
 
ul.MenuItems { list-style: none; padding: 0px; margin: 0; }
ul.MenuItems li { margin: 0; display: inline; }
ul.MenuItems li a { padding: 0; text-decoration: none; color: #000; }
ul.MenuItems li a:hover { text-decoration: underline; }

.menuItemSelected {font-weight:bold;}

#globalSearch { /* border: 1px solid #9F3; */ margin: 0 0; height: 28px; width: 500px; float: right; display: inline; }
#utility { /* border: 1px solid #9F3; */ margin-right: 6px; margin-top: 6px; float: right; overflow: hidden; outline: none; }
#utility a {margin:3px;}
#globalSearch #div { padding-right: 10px; /* seperated from above because of the box model bug *//* seperated from above because of the box model bug */ }

#search { /* border: 1px solid #C3C; */ text-align: right; margin: 0; padding: 3px 0 0 0; float: right; display: inline; }
#search #q { /* border: 1px solid #CCC; */ height: 17px; }
#search #submit { color: #000; width: 40px; height: 22px; border: 0px solid #ABABAB; background: #FFF; }

/* LAYOUT: PAGE */
/* 22/07/2014 PT Allow max width of 1200px (inclusive of borders). Retain min-width of 992px (inclusive of borders). 
                 Note: This is the only place needed to make change to min and max width - bodies and tables will resize accordingly.
                 Note: Minimum size 992px targeted for 1024 wide monitor with window maximized (maximized window does not have browser chrome).
                 Note: To simulate a maximized window on a 1024 wide monitor, resize window to including chrome to 1040.
                 */
/* 4/12/14 JM	Min-width now 992px in alignment with bootstrap responsive threshold. */
div#layout-all { margin: 0 auto; min-width: 992px; max-width: 1198px; border-left: 1px solid #F2EAD9; border-right: 1px solid #F2EAD9;}
table.layout-all { width: 100%; text-align: left; background: white; }
table.layout-all td { vertical-align: top; }
td.layout-leftnav { width: 142px; /* 192 - 10 - 10 */ padding: 10px; background:#FCFBF7; }
td.layout-rightnav { width: 270px; }
td.layout-rightnavWider { width: 375px; }
td.layout-main { width: 617px; border-left: 1px solid #ccc; }
td.layout-main-double { width: 783px; /* 809 - 18 - 18 */ padding: 10px 18px 10px 18px; border-left: 1px solid #ccc;}
td.layout-main-double-no-width { padding: 10px 18px 10px 18px; border-left: 1px solid #ccc;}
td.layout-main-triple { width: 966px; /* 1002 - 18 - 18 */ padding: 10px 18px 10px 18px; }
div.layout-rightnav { width: 220px; word-wrap: break-word; }
div.layout-rightnavWider { width: 320px; float:right; word-wrap: break-word; }

.body-dialog { padding: 10px; text-align: left; background: white !important; }
.body-iframe { padding: 10px 0px; text-align: left; background: white !important; }
.body-nopad {	padding:0px; text-align:left; background:white !important; }
	
/* LAYOUT: LEFT-NAVIGATION */
#navigation { padding: 0; font-family:arial;}
#navigation li { margin: .2em 0 .5em 0; }
#navigation li.navHeading { color: #2755A6; font-weight: bold; }
#navigation li.arrowRight { background: url(../images/arrow.gif) no-repeat right 50%; padding-right: 10px; }
#navigation a { color: #000; }
#navigation li.navon a { font-weight: bold; }
#navigation li.arrowRight a { font-weight: normal; }
#navigation ul.level1 { margin: 0; padding: 0; list-style-type: none; }
#navigation ul.level2 { margin: 0 0 0 0.5em; padding: 0; list-style-type: none; }
#navigation ul.level3 { margin: 0 0 0 0.5em; padding: 0; list-style-type: none; }
.bottomborder { border-top:1px solid #cccccc;margin:8px 0px; }

/* LAYOUT: FOOTER */
#footer {overflow:hidden; clear: both; width: 100%; height: 80px; border-top: 1px solid #CCC; text-align: left; font: normal 80% Verdana, Geneva, sans-serif; background-color: #93AAD2; }
a.floatLeftFooter { float: left; clear: none; margin: 0px 80px 0px 12px; }
a.floatRightFooter { float: right; clear: none; margin-right: 12px;  margin-top: -47px;}
#footer a { color: #000;  }
#footer a:hover {  color: #000; background: none; text-decoration: underline; }
#footer p { margin: 0; margin-top: 30px; }
	
	
	
/* PAGE ELEMENTS */

/* Breacrumbs */ 
#breadcrumbs {
	margin: 0px 0px 10px 0px;
	padding-left: 10px;
	padding-top: 5px;
	background-color: #e1e5f1;
	border-bottom: 1px solid #CCC;
	height: 20px;
}
	
/* On This Page */	
#onThisPage { clear: both; margin: 10px 0 10px 0; padding: 0 0 0 5px; background-color: #FFF; border: 1px solid #E3E5F3; }
#onThisPage h2 { margin: 0; padding-top: 5px; color: #333; font-weight: normal; }

	
/* FORMS */
.layout-form { padding: 5px 12px 12px 12px; border: 1px solid #93AAD2; margin-bottom: 10px; border: 1px solid #e3e5f3; background: #fcfcfe; }
.layout-form2 {
	background:none repeat scroll 0 0 #FCFCFE;
	border:1px solid #E3E5F3;
	margin-bottom:10px;
	padding:5px;
}

.layout-form table td input[type="radio"] { margin-top: -2px; }
.layout-buttons { padding: 6px 0px 12px 0px; }


/* Buttons */


div.app-save {
	margin-top:5px;
	position:relative;
}
.btn-saving,
.btn-save,
.btn-saved {
	position:absolute;
	top:0px;
	left:675px;
	width:100px;
	text-align:left !important;
}


input[type="submit"],
input[type="reset"],
input[type="button"],
input.button,
button.button,
a.button  {
	border: 1px solid #93AAD2;
	background: #fefefe;
	color: #000;
        padding: 4px 6px ;
	 
	text-align:center;
	font-family: sans-serif;
	font-size: 13px;
margin: 2px 0;
}
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
input.button:hover,
button.button:hover,
a.button:hover { background: #E1E5F1; } 

button.button span {
	padding:0px 10px;
}



button.disabled,
button.disabled:hover {
	background:#f0f0f0;
	border:1px solid #ccc;
	color:#999;
}
button.disabled img {
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}

/* Misc. */
.layout-info { background: #E1E5F1; padding: 8px; margin-bottom:8px; }
.layout-info-small { background: #E1E5F1; padding: 8px; font-size: 11px; margin-bottom:8px; }

td.label, th.label {
	font-size: 11px;
	font-weight: bold;
	padding-top: 9px;
	padding-right: 8px;
	text-align: right;
	vertical-align: top;
	color: #000000;
	display:table-cell;
	line-height:15px;
	/* * white-space:nowrap; */
}
td.label2, th.label2 {
	background:none repeat scroll 0 0 #F0F0F0;
	border-bottom:1px solid #FAFAFA;
	font-size:11px;
	padding:8px;
}
th.label div.label-supplement,
td.label div.label-supplement {
	font-size:10px;
	font-weight:normal;
	color:#999;
}
th.mandatory,
th.required,
td.mandatory,
td.required {
	background:url(../images/star_mandatory.gif) no-repeat right 8px;
}

td.field { padding-top: 9px; padding-left:4px; vertical-align:top;}
td.field2 {
	padding-top:6px;
	padding-left:4px;
}
td.field input {
	margin: 0px;
	font-size: 12px;
	font-family: verdana;
	margin-top: -4px;
	margin-bottom:1px;
	
	vertical-align: bottom;
}
td.field-button {
	padding:8px 0px 0px 4px;
}
td.field input.error {	border:1px dotted red; color:black; padding:2px;}

table.table-results td input.disabled,
td.field input.disabled {
	background:#f0f0f0;
	border:1px solid #7F9DB9;
	padding-left:2px;
	padding-right:2px;
	padding:2px;
}
td.field select { margin:0px;font-size: 12px; font-family: verdana; margin-top: -3px; padding:2px 0px; * padding 2px;  }
td.field textarea,
td.field2 textarea {font-size: 12px; font-family: verdana; margin-top: -3px; }
td.field input[type="radio"] { margin-top:-3px !important;}
td.field input[type="submit"] { margin-bottom:1px !important;}
td.field a { }
td.field p {margin-top: -3px; }

td.field label { /* For labels next to checkboxes & radio buttons */ padding-left: 2px; padding-right: 10px; font-weight:normal; display: inline; }

div.layout-form span.error { float: left; display: block; padding-left: 8px; }
td.field span.error label {/* For inline error messages next to form fields */	font-style:italic;	padding-left:4px; padding-right:0px; }
div.error { font-weight: bold; color: #FF0000; background-color: #FFEEEE; border: 1px solid red; padding: 5px; margin-bottom: 4px; }

/* 
Standard reused fragment in <rtow:errors /> tag.
Colors taken from bootstrap for accessibility contrast compliance. 
*/

div.rtow-errors-messages div.message-panel { border: 1px solid black; padding: 6px;  margin-bottom: 6px; }
div.rtow-errors-messages div.error { border-color: #843534; color: #843534; background-color: #F2DEDE; }
div.rtow-errors-messages div.warning { border-color: #66512C; color: #66512C; background-color: #FCF8E3; }
div.rtow-errors-messages div.information { border-color: #3C763D; color: #3C763D; background-color: #DFF0D8; }
div.rtow-errors-messages div.message-item {text-indent: -24px; margin-left: 24px; margin-bottom:5px; font-weight: normal;}
div.rtow-errors-messages img {height:16px; padding-right:8px; position:relative; top: -1px;}

td.label div.label-note { font-size: 9px; line-height: 11px; padding: 2px; color: #666; }
td.field div.field-note {
	font-size: 9px;
	line-height: 11px;
	padding: 2px;
	color: #666;
	* margin-top: -5px;
	* position:absolute;
}

td.field div.field-note-small {
	font-size: 9px;
	line-height: 10px;
	color: #666;
}

.note {   font-size: 12px; line-height: 13px; color:#800000; text-decoration: none; font-weight:bold; }
.note_small {   font-size: 9px; line-height: 10px; text-decoration: none;  }
.href {   font-size: 11px; line-height: 10px; text-decoration: none;  }

/* HREFS */
a.toplink { float: right; font-size: 12px; margin-top: 6px; }
a.excel { background: url(../images/export_excel.gif) no-repeat right  -2px; padding-right: 20px; }
a.popup { background: url(../images/icon_popup.gif) no-repeat right  -1px; padding-right: 16px; }

/* MISC. STYLES */
.seperator { border-bottom: 1px solid #CCC; margin:0 0 6px; }	
.admin {	color: #ff6600; }
.error { color: red; }

.scroll-vertical {
	border:1px solid #7F9DB9;
	padding:2px;
	overflow-y:scroll;
	overflow-x:hidden;
}
.sts-green {
	color: #2755A6; 
}
	
.text-waiting,
.text-focus,
.text-complete
.text-waiting {
	color:#888;
}
.text-focus {
	color:#bbb;
}
.text-complete {
	color:black;
}


/* --------------------------
	RESULTS TABLE
   -------------------------- */

div.layout-table-results { border: 1px solid #0066cc; border-top: 0px; margin-bottom: 8px; }
div.layout-table-results.scrollv { border-top: 1px solid #0066cc; }

div.layout-table-results .scroll-inner { overflow-y: auto; overflow-x: hidden; width: auto; }
div.layout-table-results .scroll-inner thead tr { position:absolute; top:0px;}

div.layout-panel-empty { padding: 8px; border: 1px solid #93AAD2; background: #E1E5F1; }
div.layout-table-results div.layout-panel-empty { border:0px;border-top:1px solid #0066cc; }
div.shadow-panel-link { padding: 8px; border: 1px solid #93AAD2; background: #F2F2F2; }
div.shadow-panel-link a { font-size: 10px; text-decoration: underline; }

table.table-results { width: 100%; border-color: #9CB4E4; border-bottom:1px solid white; }

.table-results th { font-weight: bold; padding: 6px; text-align: left; vertical-align: top; color: white; background-color: #5C80BC; border-right: 1px solid #DAE0F4; font: bold 12px Arial, Verdana, Geneva, sans-serif; border-bottom: 1px solid white; }

.table-results tr.super th {  }

.table-results th a { display: block; padding: 6px; margin: -6px; color: white; text-decoration: none; }
.table-results th a:hover,
.table-results th a:active { color:white; text-decoration: underline;  background-color: #B4C5E0; }
.table-results th.order1 a,
.table-results th.order2 a { padding-right: 15px; background-repeat: no-repeat; background-position: right 12px; }
.table-results th.order1 a {	background-image: url(../images/desc.gif);	}
.table-results th.order2 a {	background-image: url(../images/asc.gif); }
.table-results th a .small { font-size: 9px; }

.table-results td {
	background-color: #F5F5F5;
	font-size: 12px; 
	padding: 6px 6px; 
	text-align: left; 
	vertical-align: top;
	color: black;
	border-right: 1px solid white;
}
.table-results tr.odd td { background-color: #E5E5F1;}
.table-results tr.total td {
	background-color:#dedede;
	border-top:1px solid white;
}
.table-results tr.hover td,
.table-results tr.sub td { }
.table-results td a { color: #1542A5; }

.table-results td.checkbox { padding-top: 2px; padding-bottom: 0px; width: 1%; text-align: center; }
.table-results td.image { padding-top: 2px; padding-bottom: 0px; width: 1%; text-align: center; }
.table-results td.input { padding:0px;}
.table-results td.button { padding:2px 2px 3px; width:1px;}

.table-results-double tr td { border-bottom: 1px solid white; }
.table-results-double tr.odd td { border-bottom: 1px solid white; }


/* RESULTS NAVIGATION */
.tableCaption { text-align: left; font-size: 11px; display: none; }
.layout-navigation { height: 29px; width: auto; margin: auto; border-right: 1px solid white; background-color: #E6E6E6; font-size: 11px; padding: 0px; }
.layout-navigation .messages { float: left; padding: 7px; color: black; }
.layout-navigation .pages { float: right; padding: 5px; }
.layout-navigation .pages a,
.layout-navigation .pages .selected,
.layout-navigation .pages .inactive {        display: block; float: left; width: 20px; text-align: center; text-decoration: none;        padding:2px 0px 1px;        * padding: 3px 0px 0px;         height:17px;         margin-left: 3px;         color: #2755A6;         background-color: white; }
.layout-navigation .pages a:hover { color: white; background-color: #5C80BC; }
.layout-navigation .pages .selected { color: white; background-color: #2755A6; }
.layout-navigation .pages .inactive { color: silver; background-color: #E6EAF8; background-color: #fafafa; }
.layout-navigation .pages .divider { display: block; float: left; width: 2px; }
.layout-navigation .pages .big {     font-size: 13px;     padding:1px 0px 2px;    * padding:2px 0px 1px; }    


/* DISPLAYTAG EXPORT LINKS */
.exportlinks { border-top:1px solid white; padding:5px; background-color: #E6E6E6; }
span.export { padding-left:18px; }
span.excel { background: url(../images/ico_file_excel.png) no-repeat left 50%;}
  

.help {
    cursor:help;
}
.tooltip{ 
	position: absolute; 	top: 0; 	
        left: 0; z-index: 3; 
	display: none;
	text-decoration:none;
	color:#303030;	
	background-color: #CDE6AC;
	border:3px solid #A9DB66;
	max-width:300px;
	font-family: verdana;
	font-size:11px;
	line-height:18px;
	padding:10px 13px;
	white-space:normal;
	text-align:center;
	font-weight:normal !important;
	
 }
 #whole_section {
	width:100%;
	height:100%;
 }
.show-50 {
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}



/* =====================
	JQUERY CALENDAR VIEW WIDGET
   ===================== */
.ui-datepicker-trigger { /* Jquery UI Datepicker used in VTU */ vertical-align: bottom !important;  margin: 0px; border: 0px; }	

a.calendar-widget { /* 
		HREF USED TO HOUSE THE ICON WHICH LAUNCHES THE CALENDAR POPUP 
		<a class="calendar-widget">&nbsp;</a>  NB! Must include the &nbsp; character!!
	*/ padding: 4px 14px 0px 0px; margin-left: 0px; background: url(../images/cal.gif) no-repeat 1px 3px; text-decoration: none; vertical-align:top; }

a.calendar-widget:hover { text-decoration: none; }	
div.calendar select { width: 55px; margin: 0px; font-family:verdana; font-size:11px; }
div.calendar{font-family:verdana; margin-left: -210px; margin-top: 200px; font-size: 11px; color: #3e3e3e; padding: 0px; background: white; border: 1px solid #ccc;}
div.calendar.popup{ margin-left: -40px; margin-top: -100px; z-index: 9999; }
div.calendar table{ background-color: #ffffff;  border-collapse: separate; border-spacing: 1px;  }
div.calendar thead.tr:first { background-color: #2755A6;}
div.calendar thead td { border: 0px; }

div.calendar td{ padding: 3px 2px; text-align: center; }
div.calendar td.title{ font-weight: bold; padding: 4px; color: white; font-size: 12px; background: #2755A6; }
div.calendar th{ font-weight: bold; }
div.calendar tr.days td { width: 22px; color: #1542A5; text-align: right; cursor: pointer; border: 1px solid #e5e5e5; }
div.calendar td.button { cursor: pointer; padding: 0px; padding-top: 2px; font-size: 11px; text-decoration: none; }
div.calendar td.button:hover { text-decoration: underline; }
div.calendar td.button { color: #1542A5; }
div.calendar tr.days td:hover{ border-color: #e8a800; border-color: #2755A6; background-color: #e5e5e5; cursor: pointer; }
div.calendar tr.days td:hover{ background-color: #ffffff; }
div.calendar tr.days td:active
div.calendar td.button:active{ background-color: #cde; }
div.calendar tr.days td.selected{ font-weight: bold; background-color: #2755A6; border-color: #2755A6 !important; color: #fff !important; }
div.calendar tr.days td.weekend {color:#1542A5; }
div.calendar tr.days td.today{ font-weight: bold; border-color: #3d60ba;color:#1542A5; }
div.calendar tr.days td.otherDay{ background: #e5e5e5; color: #fff; }


a#help-icon-link {}
a#help-icon-link img#help-icon {margin: -5px;padding-right: 2px; }
a#help-text-link {display:none; }


/* Hidden fieldsets offscreen for sighted users, but readby screen readers. */
fieldset.accessibility-hidden  {border:0;padding:0;margin:0}
fieldset.accessibility-hidden legend {position:absolute; left:-9999px; width:100px; height:auto; overflow:hidden;}

/* Fix the displaytag table issue caused by bootstrap css */
.table-results th a  {box-sizing: content-box; -webkit-box-sizing:content-box;}


.label:empty { display:flex; }


.activity-schedule>ul {
	padding:0;
	list-style-type: none;
	-webkit-padding-start: 0px;
}
.activity-schedule>li {
	font-size: 11px;
	/*border: 1px solid black;*/
	text-align: center;
	vertical-align: middle;
}

.activity-schedule>li>a{border-radius:6px; padding:5px 5px; text-decoration: underline; background-color:#e8e8e8;}
.activity-schedule>li.active>a{border-radius:6px; padding:5px 5px; text-decoration: underline; background-color:#428bca;}
.activity-schedule>li+li{margin-left:0px;border-left: 0px;}
span.hide-text { position: absolute; top: -9999px; left: -9999px;}
.helpText { margin: -2px 0 0 -1px;}
.greyed { color: grey; }
.qtip { max-width: 450px; font-size: 12px; line-height: normal;}