/******************** Reset CSS styling to help improve cross-browser support ********************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/******************** HTML5 display-role reset for older browsers ********************/
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, 
blockquote:after,
q:before, 
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/********************************* End of resets ***************************************/


body { 
	color: #333333; 
	font-family: Verdana, sans-serif; 
	font-size: 1em; 
	background-color: #f8f8f8; 
	padding: 0px; 
	margin: 0px; 
}

/* For test system only */
body.test_system {
	background: #dddddd url("/static/images/test-body-background.png");
}

h1,
h2,
h3 {
	font-family: Helvetica, sans-serif; 
	color: #157e8d;
	font-weight: normal; 
}

h1 {
	font-size: 1.5em; 
	margin: 10px 10px 10px 0;
	line-height: 1.4em;
	overflow: auto;
	word-wrap: break-word;
}

/* The following span class has been introduced to deal with headers without html spaces between words */
h1 span.header_no_wrap {
	white-space: nowrap;
}

@media screen and (max-width:1000px) {

	h1 span.header_no_wrap {
		white-space: normal;
	}

}

h2 {
	font-size: 1.2em; 
}

h3 {
	font-size: 1.1em; 
	margin: 15px 0px 5px 0px;
}

p {
	font-size: 0.8em;
	line-height: 1.5em;
}

a:focus, 
input:focus, 
textarea:focus, 
select:focus, 
ul:focus {
	outline: 1px solid #157e8d;
}

em {
	font-style: italic;
}

strong {
	font-weight: bold;
}

/******************** HEADER ********************/

header { 
	margin: -20px 0 0 0; 
	clear: both; 
	padding: 10px 0px 0px 0px; 
	background-color: #fff; 
}

#header-inner {
	max-width: 1300px; 
	min-width: calc(768px - 4%); 
	margin: 0px auto 0px auto; 
	padding: 0px 2%;
	min-height: 70px;
}

#header-hidden {
	max-width: 1300px; 
	min-width: calc(768px - 4%); 
	margin: 0px auto 0px auto; 
	padding: 0 2%;
	height: auto;
	clear: both;
}

#header-inner img#logo {
	margin: 8px 0px 0px 0px; 
	padding: 0; 
	float: left; 
}

#header-inner #environment_name,
#header-inner #environment_name_screenbase {
	float: left;
	background-color: #c80000;
	margin: 12px 0px 0px 17px;
	padding: 10px 13px;
	border: 3px solid #c80000;
	border-radius: 2px;
	font-size: 1em;
	color: #fff;
	text-align: center;
}

#header-inner #environment_name_screenbase {
	margin: 0px;
	position: fixed;
	top: calc(100% - 60px);
	left: 10px;
	z-index: 30;
}

#header_bar {
	float: right; 
	width: auto;
	padding: 0px; 
	margin-top: 10px;
	margin-right: 10px;	
}

#settings_button, 
#account_details_button {
	float: left;
	padding: 4px 8px; 
	border-bottom: 3px solid #c8c8c8;
	border-radius: 2px; 
	cursor: pointer;
	background: #c8c8c8; /* For IE9 which doesn't understand linear-gradient */
	background: -webkit-linear-gradient(#c8c8c8, #d6d6d6); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(#c8c8c8, #d6d6d6); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(#c8c8c8, #d6d6d6); /* For Firefox 3.6 to 15 */
	background: linear-gradient(#c8c8c8, #d6d6d6); /* Standard syntax (must be last) */
}

#settings_button:hover, 
#account_details_button:hover, 
#settings_button:focus, 
#account_details_button:focus {
	background: #ebebeb;
	border-bottom: 3px solid #d6d6d6;
}

#settings_button {
	width: 48px;
	margin-right: 20px;
}

#account_details_button {
	clear: none; 
	font-size: 0.9em; 
	color: #222222;
	margin-right: 0px; 
	width: auto;
}

#account_details_button span {
	position: relative;
	top: -3px;
}

#settings_menu,
#account_details_menu {
	width: 300px; 
	font-size: 0.9em; 
	padding: 8px 0px 10px 0px;
	border: 1px solid #00778f;
	border-radius: 2px; 
	z-index: 2;
}

#settings_menu li,
#account_details_menu li {
	margin: 0px;
	line-height: 1.5em;
}

#settings_menu li a,
#account_details_menu li a {
	color: #0d5982;
	text-decoration: none;
	margin-left: 5px;
	padding-left: 20px;
	background-color: #fff !important;
	background: url("/static/images/pagination_right_arrow.png") no-repeat left 5px;
}

#settings_menu li a:hover,
#account_details_menu li a:hover,
#settings_menu li a:focus,
#account_details_menu li a:focus,
#settings_menu li a:active,
#account_details_menu li a:active {
	color: #666;
	text-decoration: underline;
	background-color: #fff !important;
	background: url("/static/images/right_arrow_highlight.png") no-repeat left 5px;
	border: none !important;
}

#account_details_menu li.user_logged_in {
	padding-bottom: 8px;
	padding-left: 8px;
	padding-right: 8px;
	margin-bottom: 5px;
	line-height: 1.3em;
	color: #666;
	border-bottom: 1px solid #aaa;
}

/*  Breadcrumb */

#breadcrumb-holder {
	width: 100%;
	float: left;
	margin-top: -4px;
	margin-left: 0px;
	margin-bottom: 25px;
	font-size: 0.9rem;
	text-indent: -10px;
	line-height: 1.7em;
	clear: right;
}

#breadcrumb-holder a {
	color: #0d5982;
	margin: 0px 10px;
}

#breadcrumb-holder a:hover,
#breadcrumb-holder a:focus,
#breadcrumb-holder a:active {
	text-decoration: none; 
	color: #555555;
}

/******************** MAIN PAGE LAYOUT ********************/

.form_section {
	width: 99%; 
	margin: 10px 0px; 
	padding: 0px; 
}

#page_content {
    display: none;
	max-width: 1300px; 
	min-width: calc(768px - 4%);
	margin: 20px auto 0px auto; 
	background-color: #ffffff; 
	height: 100%; 
	padding: 5px 2% 60px 2%;
}

#main_content {
	width: 82%; 
	float: right; 
	margin: 12px 0; 
	background-color: #ffffff; 
	padding: 0px 0px; 
	border: none; 
}

.ui-tabs .ui-tabs-panel {
	padding: 0px !important;
}

/******************** NAVIGATION ********************/

/** navigation top **/

#main-top-nav {
	width: 100%; 
	clear: both; 
	height: 44px; 
	background-color: #4b4b4b;
	margin: 0px; 
	padding: 0px; 
	border-top: 1px solid #f8f8f8;
}

#main-top-nav ul {
	list-style:none; 
	background-color: #4b4b4b;
	margin-top: 8px; 
	padding: 0px;
	height: 44px;
	max-width: 1300px;
	min-width: 768px;
	margin: 0px auto 0px auto;
	overflow: hidden;
}

#main-top-nav ul li {
	display: block; 
	font-size: 1em; 
	float: left; 
	padding: 0px; 
	margin: 0px; 
}

#main-top-nav ul li a {
	display: block; 
	text-decoration: none; 
	padding: 13px 22px 0px 22px; 
	color: #eeeee9; 
	height: 31px; 
}

#main-top-nav ul li a.selected_menu_item  {
	color: #4b4b4b;
	background-color: #f8f8f8;
}

#main-top-nav ul li a:hover {
	color: #ffffff; 
	background-color: #6c6c6c;
}

#main-top-nav ul li a:focus {
	color: #ffffff; 
	background-color: #6c6c6c;
	outline: none;
}

/* Search for project input in top navigation */

#main-top-nav ul li.nav_search_container {
	width: calc(35% - 33px);
	margin-top: 6px !important;
	float: right;
}

#main-top-nav ul li.nav_search_container input#menu_search_text {
	width: calc(98% - 74px);
	height: 26px;
	background-color: #f8f8f8;
	margin: 0px;
	border: none !important;
	float: left;
}

#main-top-nav ul li.nav_search_container button#menu_search_button {
	width: 33px;
	height: 32px;
	overflow: hidden;
	margin: 0px;
	padding: 0px 0px 0px 33px;
	float: left;
	border: none;
	background: #888 url("/static/images/search_icon_white_17x17.png") no-repeat 9px 9px;
	cursor: pointer;
	overflow: hidden;
}

#main-top-nav ul li.nav_search_container button#menu_search_button:hover,
#main-top-nav ul li.nav_search_container button#menu_search_button:focus,
#main-top-nav ul li.nav_search_container button#menu_search_button:active {
	background: #777 url("/static/images/search_icon_white_17x17.png") no-repeat 9px 9px;
}

#main-top-nav ul li.nav_search_container button#recent_projects_button {
	width: 32px;
	height: 32px;
	margin: 0px 0px 0px 3px;
	padding: 0px 0px 0px 32px;
	float: left;
	border: none;
	border-radius: 3px;
	background: #fff url("/static/images/view-recent.png") no-repeat 0px 0px;
	cursor: pointer;
	overflow: hidden;
}

#main-top-nav ul li.nav_search_container button#recent_projects_button:hover,
#main-top-nav ul li.nav_search_container button#recent_projects_button:focus,
#main-top-nav ul li.nav_search_container button#recent_projects_button:active {
	background: #fff url("/static/images/view-recent-hover.png") no-repeat 0px 0px;
}

/* Drop-down list of projects from Search for project */
#header_menus {
	display: none;
}

#header_menus + ul.ui-autocomplete,
body ul.ui-autocomplete#ui-id-11 {
	min-height: 200px;
	max-height: 400px !important;
	border: 1px solid #157e8d;
}

body ul.ui-autocomplete#ui-id-13 {
	height: 400px !important;
	overflow: scroll;
}

.nav_search_selection {
	display: block;
	font-size: 0.8em;
	max-width: 800px;
	line-height: 1.4em;
}

.nav_search_selection:last-child {
	border-bottom: none;
}

.nav_search_selection:hover,
.nav_search_selection:focus,
.nav_search_selection:active {

}

.nav_search_item {
	display: block;
	padding-bottom: 10px !important;
	padding-top: 10px !important;
	margin-bottom: 0px !important;
	border: none;
	border-bottom: 1px dotted #157e8d;
	outline: none !important;
	background-color: #f6fafb;
}

.nav_search_item:hover,
.nav_search_item:focus,
.nav_search_item:active {
	outline: none !important;
}

.nav_search_item:hover {
	cursor: pointer;
}

.nav_search_selection div h4 {
	margin-top: 5px;
	color: #157e8d !important;
	font-weight: bold !important;
}

.nav_search_item p {
	margin-top: 5px;
	color: #666666;
	font-size: 1em;
	font-weight: normal !important;
}

.nav_search_item a {
	font-size: 1em;
	color: #157e8d !important;
}

.nav_search_item div {
	margin-top: 5px;
}

/** Navigation lefthand side **/

nav#tabs {
	width: 15%;
	float: left;
}

nav#tabs .ui-tabs-nav {
	width: 100%;
	margin: 23px 0px 10px 0;
	padding: 10px 0px;
	background-color: #f8f8f8;
	border: 1px dotted #bebebe;
}

nav#tabs .ui-tabs-nav li {
	list-style: none;
	position: relative;
	top: 0;
	display: block; 
	width: 100%;
	padding: 0px;
	font-size: 0.8em; 
	border: none;
	outline: none;
	background-color: #f8f8f8;
	clear: both;
	margin-bottom: -1px;
}

nav#tabs .ui-tabs-nav li.ui-tabs-active {
	width: calc(100% + 30px);
	margin-left: -15px;
}

nav#tabs .ui-tabs-nav li a {
	text-decoration: none;
	display: block; 
	width: calc(100% - 10px);
	text-decoration: none; 
	padding: 12px 5px;
	color: #333333;
	background-color: #f8f8f8;
	border-bottom: 1px dotted #bebebe;
	text-align: center;
	white-space: normal;
}

nav#tabs .ui-tabs-nav li:last-child a {
	border-bottom: none;
}

nav#tabs .ui-tabs-nav li:first-child a {
	border-top: 1px dotted #f8f8f8;
}
nav#tabs .ui-tabs-nav li.ui-tabs-active {
	border: none;
}
nav#tabs .ui-tabs-nav li.ui-state-hover {
	background-color: #ffffff;
}
nav#tabs .ui-tabs-nav li.ui-state-hover a {
	background-color: #ffffff; 
	color: #000000;
	outline: none; 
}
nav#tabs .ui-tabs-nav li.ui-state-focus a {
	outline: 1px dotted #999999 !important;
}

nav#tabs .ui-tabs-nav li:first-child.ui-state-hover a {
	border-top: 1px dotted #bebebe;
}

nav#tabs .ui-tabs-nav li:last-child.ui-state-hover a {
	border-bottom: 1px dotted #bebebe;
}

nav#tabs .ui-tabs-nav li:first-child.ui-tabs-active a {
	border-top: none;
}

nav#tabs .ui-tabs-nav li.ui-tabs-active a {
	background-color: #6c6c6c;
	border: none;
	color: #ffffff; 
	outline: none !important;
}

@media screen and (max-width:1000px) {

	nav#tabs .ui-tabs-nav li.ui-tabs-active {
		width: calc(100% + 18px);
		margin-left: -9px;
	}
	nav#tabs .ui-tabs-nav {
		padding: 5px 0px;
	}
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active a,
.ui-tabs .ui-tabs-nav li.ui-state-disabled a,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading a {
	cursor: text;
}



/** DISPLAY TOGGLE BUTTONS - project list, report list, filter list, widgets (NB Colours for widgets in widgets.css) **/

#display_toggle_section {
	height: 32px;
	margin-bottom: 10px;
}

#display_toggle_section p {
	display: block;
	float: left;
	padding: 3px 0px 0px 0px;
	margin-right: 8px;
}

#display_toggle_section li {
	display: block;
	float: left;
	margin: 0px;
	height: 32px;
}

#display_toggle_section button {
	padding: 3px 8px;
    color: #333333;
	margin: 0px 2px;
	border: 1px solid #dbebff;
    border-bottom: 3px solid #dbebff !important;
	background: #e0eeff; /* For IE9 which doesn't understand linear-gradient */
	background: -webkit-linear-gradient(#e0eeff, #dbebff); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(#e0eeff, #dbebff); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(#e0eeff, #dbebff); /* For Firefox 3.6 to 15 */
	background: linear-gradient(#e0eeff, #dbebff); /* Standard syntax (must be last) */
}

#display_toggle_section button.display_toggle_button_selected {
    color: #000;
	border: 1px solid #cccccc;
	border-bottom: 3px solid #c0c0bd !important;
	background: #dadada; /* For IE9 which doesn't understand linear-gradient */
	background: -webkit-linear-gradient(#dadada, #cccccc); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(#dadada, #cccccc); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(#dadada, #cccccc); /* For Firefox 3.6 to 15 */
	background: linear-gradient(#dadada, #cccccc); /* Standard syntax (must be last) */
}

#display_toggle_section button.display_toggle_button span.toggle_hide {
	display: none;
}

#display_toggle_section button.display_toggle_button_selected span.toggle_show,
#display_toggle_section button.display_toggle_button_hidden span.toggle_hide {
	display: none;
}

#display_toggle_section button.display_toggle_button_selected span.toggle_hide,
#display_toggle_section button.display_toggle_button_hidden span.toggle_show {
	display: initial !important;
}

#display_toggle_section button:focus,
#display_toggle_section button:hover  {
    border: 1px solid #cfd5ff !important;
	border-bottom: 3px solid #cfd5ff !important;
}

#display_toggle_section button:focus.display_toggle_button_selected,
#display_toggle_section button:hover.display_toggle_button_selected {
    border: 1px solid #b1b1ae !important;
	border-bottom: 3px solid #c0c0bd !important;
}

/******************** FORM ELEMENTS ********************/

form {
	padding: 0px;
	border: none !important;
}

fieldset {
	padding: 0px 0px 20px 10px; 
	margin: 2px 0 30px 0; 
	background-color: #ffffff; 
	border: 1px solid #bebebe;
}

fieldset p {
	font-style: italic;
}

legend {
	font-size: 1.2em; 
	padding: 0px 15px; 
	margin: 0px; 
	font-family: Helvetica, sans-serif; 
	color: #157e8d;
}

label {
	font-size: .9em; 
	margin-top: 8px;
	margin-right: 8px; 
	display: block; 
	clear: none; 
	float: left; 
	text-align: right; 
	line-height: 1.4em; 
}

textarea,
select,
input,
button {
	font-family: Verdana, sans-serif; 
	font-size: 0.9em;
	line-height: 1.4em; 
	margin: 0px 0px 20px 0px; 
	border: 1px solid #cccccc;
	color: #000;
	background-color: #f4f4f4;
}

.form_section label,
.form_section textarea,
.form_section select,
.form_section input {
	font-size: 0.8em;
}

.form_section button {
	font-size: 0.8em !important;
}

select option {
	margin-top: 5px; /* only works in Firefox not Chrome or IE */
}

textarea {
	padding: 8px 3px 8px 8px;
	min-height: 27px;
}

select {
	padding: 3px 0 3px 3px;
	cursor: pointer;
	min-height: 33px;
}

input {
	padding: 3px 3px 3px 8px;
}

input[type="text"] {
	min-height: 25px;
}

input[type="email"] {
	min-height: 25px;
}

input[type="number"] {
	min-height: 25px;
}

/** Disabled controls (includes checklists) **/

input[disabled], 
textarea[disabled], 
select[disabled] {
	color: #666666;
	background-color: #fff;
	border: 1px solid #e8e8e8;
}

select[disabled] {
    -webkit-appearance: none; /* hide select down arrow */
    -moz-appearance: none; /* hide select down arrow */
	cursor: default;
}

select[disabled]::-ms-expand {
    display: none; /* hide select down arrow in IE10 */
}

a[disabled] {
	color: #666666 !important;
	text-decoration: none;
	outline: none;
}

a[disabled]:hover {
	cursor: default;
}

/* changes background on option list hover but only works in Firefox */
select option:hover, 
select option:checked {
    box-shadow: 0 0 10px 100px #0d5982 inset !important;
}

.form_section {
	padding: 0px; 
	margin: 15px 0px 0px 0px; 
}

.form_section div {
	padding: 0px; 
	margin: 5px 0px; 
}

.form_section p {
	margin-right: 10px;
}

.container_left, .container_right, .container_left_2, .container_right_2, .container_left_3, .container_right_3 {
	margin: 0px; 
	padding: 0px; 
}

.container_left, .container_left_2, .container_left_3 {
	float: left; 
	clear: none;
}

.container_left div, .container_right div, .container_left_2 div, .container_right_2 div, .container_left_3 div, .container_right_3 div {
	margin: 0px; 
	padding: 0px; 
}

.container_right, .container_right_2, .container_right_3 {
	float: right; 
}

/** Field and table locking **/

input.field_locked, 
textarea.field_locked, 
select.field_locked {
	color: #666666;
	background-color: #fff;
	padding-left: 8px !important;
	border: 1px solid #dddddd;
	opacity: 1 !important;
}

input[readonly=""], 
textarea[readonly=""], 
select[readonly=""] {
	color: #666666;
	background-color: #fff;
	border: 1px solid #dddddd;
	opacity: 1 !important;
}

/** For Safari 6.1+ **/

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) 
{ @media {
    input.field_locked, 
	textarea.field_locked { 
        color: #222222;
    }
}}

/** For Safari 9.0+ **/

_::-webkit-:not(:root:root), input.field_locked, 
	textarea.field_locked {
	color: #000;
}

select.field_locked {
    -webkit-appearance: none; /* hide select down arrow */
    -moz-appearance: none; /* hide select down arrow */
	cursor: default;
}

select.field_locked::-ms-expand {
    display: none; /* hide select down arrow in IE10 */
}

#field_unlock_dialog p {
	font-size: 0.8em;
    margin: 0px;
	margin-bottom: 20px;
	font-style: italic;
}

#field_unlock_dialog label {
	font-size: 0.8em;
}

#field_unlock_dialog textarea {
	font-size: 0.8em;
	width: 350px;
    height: 100px;
}

.unlock_button {
	border: none;
	height: 22px;
	width: 22px !important;
	padding: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	float: left; 
	background: url("/static/images/padlock-icon-locked-20x20.png") no-repeat 2px top;
	cursor: pointer;
}

button.add_button + input.unlock_button {
	margin-top: 25px;
}

.unlock_button:hover, 
.unlock_button:focus, 
.unlock_button:active {
	background: url("/static/images/padlock-icon-hover-20x20.png") no-repeat 2px top;
	outline: none;
}

.row_unlock_cell {
	width: 22px !important;
	border: none !important;
	padding: 0px !important;
	background-color: #fff !important;
}

.row_unlock_cell input {
	padding: 0px !important;
	position: relative;
	top: 5px;
}

.button_link .unlock_button,
.add_button .unlock_button  {
	margin-left: 10px;
	margin-top: 8px;
}

/******************** DIALOG WINDOWS ********************/

.ui-dialog {
	/*max-width: 1000px;*/
	padding: 0px;
	border-radius: 25px;
}

.ui-corner-all {
	border-radius: 2px;
}

.ui-dialog .ui-dialog-title {
	font-size: 1.5em;
	font-family: Helvetica, sans-serif; 
	margin: 7px 0px;
	color: #157e8d;
	line-height: 1.2em;
	font-weight: normal;
	white-space: normal !important;
	overflow: visible;
}

.ui-dialog .ui-widget-header {
	margin-bottom: 15px;
	border: none;
	border-bottom: 1px dotted #ccc;
	background: #fff;
}

/* close icon in title bar of dialog windows */

.ui-dialog-titlebar .ui-icon {
	width: 18px;
	height: 18px;
	background-position: left top;
}

.ui-dialog-titlebar .ui-icon,
.ui-dialog-titlebar .ui-widget-content .ui-icon,
.ui-dialog-titlebar .ui-widget-header .ui-icon,
.ui-dialog-titlebar .ui-state-default .ui-icon {
	background-image: none !important;
	border: none !important;
	outline: none !important;
}

.ui-dialog-titlebar button {
	border-bottom: none !important;
	border: none !important;
	outline: none !important;
	background-image: url("/static/images/pop-up-delete.png");
	background-color: #fff !important;
	width: 18px !important;
}

.ui-dialog-titlebar button.ui-button-icon-only {
	position: absolute !important;
	top: 30px !important;
	right: 23px !important;
}

.ui-dialog-titlebar button:hover,
.ui-dialog-titlebar button:focus,
.ui-dialog-titlebar button:active {
	background-image: url("/static/images/pop-up-delete-light.png");
	border: none !important;
	outline: none !important;
}

.ui-dialog .dialog_content label,
.ui-dialog .dialog_content select,
.ui-dialog .dialog_content input,
.ui-dialog .dialog_content textarea {
	font-size: 0.8em;
}

.ui-dialog .dialog_content p {
	font-size: 0.8em !important;
	font-style: italic;
}

.ui-dialog .dialog_content p input {
	font-size: 1em;
}

.ui-dialog ul.ui-menu {
	padding: 5px;
}

.ui-dialog li.ui-menu-item {
	font-size: 0.8em;
	line-height: 1.2em;
}

.ui-dialog .ui-dialog-buttonpane {
	margin-top: 0px;
	border-top: 1px dotted #ccc;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.ui-button {
	font-size: 0.8em;
	padding: 9px 30px 7px 30px;
	background: #00778f;
	border-bottom: 3px solid #006d82;
	border-radius: 3px; 
	white-space: normal;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.ui-button:hover,
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.ui-button:focus,
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.ui-button:active {
	padding: 9px 30px 7px 30px;
	border-bottom: 3px solid #005469;
	background-color: #005469;
	color: #fff;
	outline: none;
}

/******************** TWO-COLUMN LAYOUT ON STATUS SECTION ********************/

/* container solely used for creating same-height boxes for current activities and other actions - do not change these values */

#status .two_column_container {
	margin: 0px;
	padding: 0px;
	border: none;
}

#status .two_column_container .status_current_activities {
	width: calc(95% - 180px);
	float: left;
	padding-bottom: 0px;
}

#status .two_column_container .status_other_actions {
	width: 180px;
	float: right;
	padding-bottom: 0px;
}

#status .two_column_container .form_section {
	margin-bottom: 0px;
}

#status .two_column_container .status_other_actions input[type="submit"] {
	width: 170px;
}

/******************** BUTTONS ********************/

.button_link {
	margin-top: 18px !important;
}

.button_link a  {
	font-size: 0.8em; 
	color: #ffffff !important; 
	display: inline-block;
	float: left;
	text-align: center; 
	text-decoration: none; 
	padding: 10px 30px 8px 30px;
	border-bottom: 3px solid #006d82;
	border-radius: 3px; 
	background-color: #00778f;
	white-space: normal; 
}

.button_link a:focus, 
.button_link a:hover,
.button_link a:active {
	border-bottom: 3px solid #005469;
	background-color: #005469;
	outline: none;
}

.button_link a[disabled] {
	background: #eeeeee;
	color: #666666 !important;
	border-bottom: 3px solid #e8e8e8;
	cursor: default;
}

.add_button {
	display: inline-block;
	padding: 10px 30px 8px 30px !important;
	float: left;
	background: #00778f; 
	color: #fff;
	border-bottom: 3px solid #006d82;
	border-radius: 3px;
}

.add_button:hover,
.add_button:focus,
.add_button:active {
	border-bottom: 3px solid #005469;
	background: #005469;
	color: #fff;
	outline: none;
}

.add_button[disabled] {
	color: #666666 !important;
	background-color: #eeeeee;
	border: none;
	border-bottom: 3px solid #e8e8e8;
	opacity: 1;
}
	

/** Save, search, add project/person buttons **/

input[type="submit"] {
	-webkit-appearance:none !important;
	color: #ffffff; 
	padding: 8px 10px 6px 10px;
	margin-top: 0px;
	border: none; 
	border-bottom: 3px solid #006d82;
	border-radius: 3px; 
	background-color: #00778f;
	white-space: normal;
	cursor: pointer;
}

input[type="submit"]:focus, 
input[type="submit"]:hover,
input[type="submit"]:active {
	-webkit-appearance:none !important;
	border-bottom: 3px solid #005469;
	background-color: #005469;
	outline: none;
}

input[type="submit"]:disabled {
	-webkit-appearance:none !important;
	background: #eeeeee;
	color: #666666 !important;
	border-bottom: 3px solid #e8e8e8;
	cursor: default;
}

input[type="checkbox"] {
	width: 17px; 
	height:17px; 
	border: 1px solid red !important;
	float: left;
}

/** Non submit button for advanced search **/

button[type="button"] {
	color: #ffffff;
	padding: 3px 10px 2px 10px;
	margin-top: 2px;
	margin-left: 10px;
	border: none; 
	border-bottom: 3px solid #006d82;
	border-radius: 3px; 
	background-color: #00778f;
	white-space: normal;
	cursor: pointer;
}

button[type="button"]:focus, 
button[type="button"]:hover,
button[type="button"]:active {
	border-bottom: 3px solid #005469;
	background-color: #005469;
	outline: none;
}

/** Styling for item selector help 'add new' buttons **/

p.add_new_inline_button {
	display: block;
	clear: both;
	font-size: 0.9em;
	color: #555555;
}

.add_new_inline_button input {
	display: inline !important;
	background: none !important;
	border-bottom: 0px !important;
	padding: 0px !important;
	width: auto !important;
	color: #0d5982 !important;
	font-size: 1em;
	text-decoration: underline;
	text-transform: lowercase;
}

@-moz-document url-prefix() {
    .add_new_inline_button input {
    	padding: 5px !important;
		margin-left: 0px !important;
		margin-top: -8px !important;
    }
}

.add_new_inline_button input:hover,
.add_new_inline_button input:focus,
.add_new_inline_button input:active {
	text-decoration: none; 
	color: #555555 !important;
}

/** Letter create buttons **/

.dialog_content #upload_letter_description + .file_input_outer_wrapper .file_input_browse_button {
	font-size: 0.8em;
}

.dialog_content #upload_letter_description {
	margin-bottom: 15px;
}

/******************** TITLE BAR ********************/

/** Page heading for edit pages **/

#title_bar {
	clear: both; 
	margin: 16px 0; 
}

#title_bar h1 {
	max-width: 60%;
	float: left;
	clear: both; 
	margin-top: 0;
}

/** Ref number and copy / favourite buttons for edit pages **/

#title_bar .item_reference {
	font-size: 0.8em;
	font-weight: bold;
	color: #157e8d;
	display: inline !important;
	clear: right;
	white-space: nowrap;
}

#title_bar .item_reference #copy_button {
	width: 20px;
	height: 20px;
	margin-bottom: 0px !important;
	margin-left: 5px;
	border-bottom: none;
	background: none;
	background: url("/static/images/copy-documents-20x20.png") no-repeat left 0px;
}

#title_bar .item_reference #copy_button:hover,
#title_bar .item_reference #copy_button:focus {
	background: url("/static/images/copy-documents-20x20-hover.png") no-repeat left 0px;
}

#title_bar .item_reference button#favourite_button {
	width: 20px;
	height: 20px;
	margin-bottom: 0px !important;
	margin-left: 5px;
	border-bottom: 0px !important;
	background: #ffffff;
}

#title_bar .item_reference button.favourite_false {
	background: url("/static/images/favourite-star-hollow-16x16.png") no-repeat left 4px !important;
}

#title_bar .item_reference button.favourite_false:hover,
#title_bar .item_reference button.favourite_false:focus {
	background: url("/static/images/favourite-star-hollow-16x16-focus.png") no-repeat left 4px !important;
}

#title_bar .item_reference button.favourite_true {
	background: url("/static/images/favourite-star-filled-16x16.png") no-repeat left 4px !important;
}

#title_bar .item_reference button.favourite_true:hover,
#title_bar .item_reference button.favourite_true:focus {
	background: url("/static/images/favourite-star-filled-16x16-focus.png") no-repeat left 4px !important;
}

@-moz-document url-prefix() {
	#title_bar .item_reference button.favourite_true,
	#title_bar .item_reference button.favourite_false,
	#title_bar .item_reference button.favourite_true:hover,
	#title_bar .item_reference button.favourite_false:hover,
	#title_bar .item_reference button.favourite_true:focus,
	#title_bar .item_reference button.favourite_false:focus	{
		background-position: left 0px !important;
	}
}

/* For Firefox! */
@-moz-document url-prefix() {
	#title_bar .item_reference {
		padding-top: 8px;
	}
	#title_bar .item_reference button {
		height: 30px;
	}
}

/** Back to activity button **/

#title_bar #back_to_activity {
	display: block;
	float: right;
	clear: both;
	border: 1px solid #cccccc;
	border-radius: 2px;
	margin-top: 10px;
	margin-left: 20px;
}

#title_bar #back_to_activity a {
	display: block;
	font-size: 0.8em;
	padding: 8px;
	text-align: center;
	text-decoration: none;
	line-height: 1.3em;
	background: #dcdcdc;
	white-space: nowrap;
}

#title_bar #back_to_activity a:hover {
	background: #f0f0f0;
	color: #000000;
}

/** Title bar buttons **/

#title_bar #title_bar_button_area {
	width: 20%; 
	float: right;
}

#title_bar #title_bar_button_area input {
	float: right; 
	text-align: center;
}

#title_bar #title_bar_button_area button {
	float: right;
	text-align: center;
}

#title_bar #title_bar_button_area input:focus {
	outline: none !important;
}

#title_bar #title_bar_button_area button:focus {
	outline: none !important;
}

#title_bar #title_bar_button_area input#project_save_button, 
#title_bar #title_bar_button_area input#save_button,
#title_bar #title_bar_button_area input#sponsor_save_button,
#title_bar #title_bar_button_area input#site_save_button,
#title_bar #title_bar_button_area input#review_body_save_button,
#title_bar #title_bar_button_area input#funder_save_button,
#title_bar #title_bar_button_area input#contract_research_organisation_save_button,
#title_bar #title_bar_button_area input#clinical_research_network_save_button,
#title_bar #title_bar_button_area input#site_imaging_requirement_save_button,
#title_bar #title_bar_button_area input#trial_support_organisation_save_button,
#title_bar #title_bar_button_area input#save_filter_button {
	font-size: 0.8em;
	width: 100px; 
}

#title_bar #title_bar_button_area button#run_filter_button {
	font-size: 0.9em;
}

#title_bar #title_bar_button_area input[disabled]#project_save_button, 
#title_bar #title_bar_button_area input[disabled]#save_button {
	background: #eeeeee;
	color: #666666 !important;
	border-bottom: 3px solid #e8e8e8;
}

#title_bar #title_bar_button_area input#add_person_button {
	width: 180px; 
}

#title_bar #title_bar_button_area input#add_organisation_button {
	width: 200px; 
}

/******************** SEARCH BAR ********************/

#search_bar {
	float: left; 
	width: 100%; 
	margin-bottom: 20px; 
}

#search_bar input[type="text"] {
	width: 450px;
	margin: 0px 0px 10px 0px; 
	border: 1px solid #cccccc;
	float: left; 
}

#search_bar input[type="submit"] {
	float: left; 
	margin-top: 0px; 
	margin-bottom: 0px !important;
	width: 30px;
	height: 32px;
	font-size: 1px;
	background: url("/static/images/search_icon_18x18.png") no-repeat left 8px; 
	border-bottom: none;
	border: none;
	padding-top: 28px;
}

#search_bar input[type="submit"]:hover,
#search_bar input[type="submit"]:focus,
#search_bar input[type="submit"]:active {
	background: url("/static/images/search_icon_hover_18x18.png") no-repeat left 8px;
}

#search_bar #search_button {
	float: left;
	width: 33px;
	height: 33px;
	padding: 0px 0px 0px 33px;
	margin-right: 8px;
	border: none;
	background: #888 url("/static/images/search_icon_white_17x17.png") no-repeat 9px 9px;
	cursor: pointer;
	overflow: hidden;
}

#search_bar #search_button:hover,
#search_bar #search_button:focus,
#search_bar #search_button:active {
	background-color: #666;
}
	
#search_bar #search_results {
	white-space: nowrap;
	display: block;
	float: left;
	margin-top: 7px;
	width: 25%;
	font-size: 0.9em;
	color: #333333;
}

#search_results, #search_results a {
	font-size: 1em; 
	color: #0d5982;
}

#search_results, #search_results a:hover,
#search_results, #search_results a:focus,
#search_results, #search_results a:active {
	color: #4b4b4b;
}

/******************** TABLES ********************/

table {
	width: 100%; 
	border-collapse: collapse; 
	float: left; 
}

thead tr {
	background-color: #acacac;
}

table a {
	display: block; 
	text-decoration: none; 
	color: #222222;
	width: 100%; 
	height: 100%; 
}

th {
	font-size: 0.8em; 
	font-weight: normal; 
	padding: 10px; 
	text-align: left; 
	color: #000; 
	border: none; 
	line-height: 1.4em; 
}

td {
	font-size: 0.8em; 
	padding: 10px; 
	line-height: 1.4em; 
}

/* This style is to wrap organisation and company names that don't automatically wrap in the browser because the spaces between words are in some format that the browser doesn't understand. NB: a fixed css width has to be set for the cell for this to work. */

td span.wrap_name {
	display: block;
	word-wrap: break-word;
}

/** List tables **/

.change_list_section tbody tr {
	background-color: #ebebeb;
}

.change_list_section th {
	font-size: 0.9em;
	border-right: 1px dotted #ffffff; 
}

.change_list_section td {
	font-size: 0.9em;
	border-top: 3px solid #ffffff; 
	border-right: 1px dotted #ffffff; 
}

.change_list_section .hover_table_row {
	background-color: #f8f8f8;
}

.change_list_section .focus_table_row {
	background-color: #fff;
}

.change_list_section .delete_button_cell {
	background-color: #ffffff; 
	width: 22px;
	padding: 0px;
}

.change_list_section .delete_button_cell a {
	width: 22px;
	height: 22px;
	background: url("/static/images/delete.png") no-repeat left top; 
	position: relative;
	top: 7px;
	left: 10px;
}

.change_list_section .delete_button_cell a:hover,
.change_list_section .delete_button_cell a:focus,
.change_list_section .delete_button_cell a:active {
	background: url("/static/images/delete-hover.png") no-repeat left top; 
}

/* Pagination for list tables */

ul.pagination {
	display: block; 
	padding: 0px; 
	margin: 10px 0px 10px 0px; 
	clear: both; 
}

ul.pagination li {
	float: left; 
	clear: none; 
	display: block; 
	margin: 10px 6px 0px 0px; 
	padding: 0px; 
	font-size: 0.9em; 
}

ul.pagination li a {
	display: block; 
	background-color: #6e6e6e; 
	color: #ffffff; 
	margin: 0px; 
	padding: 5px; 
}

ul.pagination li a:hover,
ul.pagination li a:focus,
ul.pagination li a:active {
	background-color: #4b4b4b;
	outline: none;
	text-decoration: none; 
}

ul.pagination li.pagination-page {
	padding: 4px; 
	border: 1px solid #bebebe;
}

ul.pagination li.pagination-previous {
	background: url("/static/images/pagination_left_arrow.png") no-repeat left 40%; 
}

ul.pagination li.pagination-previous a {
	padding-left: 0px; 
	margin-left: 18px;
}

ul.pagination li.pagination-next {
	background: url("/static/images/pagination_right_arrow.png") no-repeat right 60%; 
}

ul.pagination li.pagination-next a {
	padding-right: 0px; 
	margin-right: 18px; 
}

ul.pagination li.pagination-previous a, ul.pagination li.pagination-next a {
	background-color: #ffffff; 
	color: #0d5982; 
}

ul.pagination li.pagination-previous a:hover, ul.pagination li.pagination-next a:hover {
	text-decoration: underline; 
	color: #4b4b4b;
}

/** Inline tables **/
table.inline_formset_table {
	border-left: 1px solid #ccc; 
	margin-top: 10px;
}

.inline_formset_table tbody tr {
	background-color: #ffffff;
	outline: none !important;
}

.inline_formset_table th {
	border-right: 1px solid #f1eacf; 
	font-size: 0.9em; 
}

.inline_formset_table th.last_heading_cell {
	border-right: 1px solid #acacac;
}

.inline_formset_table th.first_heading_cell {
	border-left: 1px solid #acacac;
}
	
.inline_formset_table td {
	border-bottom: 1px solid #ccc; 
	border-right: 1px solid #ccc; 
	padding: 10px; 
	margin: 0px; 
}

.inline_formset_table td input, 
.inline_formset_table td select, 
.inline_formset_table td textarea {
	font-size: 1em; 
	padding: 5px; 
	margin: 0px;
}

.inline_formset_table td input {
	width: 90%;
}

.inline_formset_table td textarea {
	width: 95%;
}

.inline_formset_table td select {
	width: 99%;
}

.inline_formset_table td textarea {
	height: 50px; 
	margin-bottom: -9px; 
}

.inline_formset_table tfoot th {
	text-align: right;
	padding: 20px;
}

.inline_formset_table tbody tr:focus,
.inline_formset_table tbody tr:active,
.inline_formset_table .hover_table_row {
	background-color: #eeeeee;
}

/* Delete button cells */

.inline_formset_table .delete_button_cell {
	background-color: #ffffff; 
	width: 22px; 
	border: none;
}

.inline_formset_table td.delete_button_cell input[type="button"] {
	height: 22px; 
	width: 22px; 
	padding: 0px; 
	margin: 0px; 
	background: url("/static/images/delete.png") no-repeat left top; 
	float: right;
	border: none;
	cursor: pointer;
	position: relative; 
	top: 5px;
}

.inline_formset_table td.delete_button_cell input[type="button"]:hover,
.inline_formset_table td.delete_button_cell input[type="button"]:focus,
.inline_formset_table td.delete_button_cell input[type="button"]:active {
	background: url("/static/images/delete-hover.png") no-repeat left top;
	outline: none !important;
}

.inline_formset_table td.delete_button_cell input[type="button"]:disabled {
	background: url("/static/images/delete-hover.png") no-repeat left top;
	cursor: default;
}

.inline_formset_table th.delete_button_cell span {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.inline_formset_table a.delete_link {
	width: 22px;
	height: 22px;
	background: url("/static/images/delete.png") no-repeat left top;
	position: relative; 
	top: 5px;
}

.inline_formset_table a.delete_link:hover,
.inline_formset_table a.delete_link:focus,
.inline_formset_table a.delete_link:active {
	background: url("/static/images/delete-hover.png") no-repeat left top;
	outline: none;
}

.inline_formset_table a.delete_link[disabled="disabled"] {
	background: url("/static/images/delete-hover.png") no-repeat left top;
	cursor: default;
}

.inline_formset_table a.delete_link span {
	position: absolute;
	left: -10000px;
}

/* Effective dates edit button cells */

.inline_formset_table .effective_dates_edit_button_cell {
	background-color: #ffffff;
	width: 22px;
	padding-right: 0px;
	border: none;
}

.inline_formset_table td.effective_dates_edit_button_cell {
	height: 22px;
	width: 22px;
	padding: 0px 0px 0px 5px !important;
	margin: 0px;
	/*float: right;*/
	border: none;
	cursor: pointer;
	position: relative;
	top: 0px;
}

.inline_formset_table td.effective_dates_edit_button_cell input[type="button"]:hover,
.inline_formset_table td.effective_dates_edit_button_cell input[type="button"]:focus,
.inline_formset_table td.effective_dates_edit_button_cell input[type="button"]:active {
	outline: none !important;
}

.inline_formset_table td.effective_dates_edit_button_cell input[type="button"]:disabled {
	cursor: default;
}

.inline_formset_table th.effective_dates_edit_button_cell span {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.inline_formset_table td.effective_dates_edit_button_cell a.effective_dates_edit_link  {
	width: 22px;
	height: 22px;
	margin: 0px !important;
	background: url("/static/images/calendar.png") no-repeat left top;
	position: relative;
	top: 5px;
}

.inline_formset_table  td.effective_dates_edit_button_cell a.effective_dates_edit_link:hover,
.inline_formset_table  td.effective_dates_edit_button_cell a.effective_dates_edit_link:focus,
.inline_formset_table  td.effective_dates_edit_button_cell a.effective_dates_edit_link:active {
	background: url("/static/images/calendar-hover.png") no-repeat left top;
	outline: none;
}

.inline_formset_table  td.effective_dates_edit_button_cell a.effective_dates_edit_link[disabled="disabled"] {
	background: url("/static/images/calendar-disabled.png") no-repeat left top;
	cursor: default;
}

.inline_formset_table a.effective_dates_edit_link span {
	position: absolute;
	left: -10000px;
}

.inline_formset_table .effective_dates_edit_button_cell ~ .delete_button_cell {
	padding-left: 0px !important;
}

input[title]:hover:after{
	content: attr(title);
	padding: 20px;
	color: red !important;
	font-size: 2em !important;
	line-height: 2em;
}

.inline_formset_table th.activity_status {
	border-right: 1px solid #acacac;
}

/* Delete row on inline-formset table dialog window */

.confirm_delete_dialog {
	min-height: 40px !important;
	font-style: italic;
}

/* Activity/summary/recruitment tables */

table.activity_summary_table {
	border-left: 1px solid #f1eacf; 
	margin: 10px 0px; 
}

.activity_summary_table tbody tr {
	background-color: #ffffff;
}

.activity_summary_table th {
	border-right: 1px solid #f1eacf; 
	font-size: 0.9em; 
	padding: 10px; 
}

.activity_summary_table th.last_heading_cell {
	border-right: 1px solid #acacac;
}

.activity_summary_table th.first_heading_cell {
	border-left: 1px solid #acacac;
}

.activity_summary_table td {
	border-bottom: 1px solid #eeeeee; 
	border-right: 1px solid #f1eacf; 
	padding: 8px; 
	margin: 0px; 
}

.activity_summary_table .hover_table_row {
	background-color: #eeeeee;
}

/* temporary measure to stop orange border around table entries - need to work out a way of producing hover styling, i.e. different background, on focus */ 
table.activity_summary_table a:active, 
table.activity_summary_table a:focus, 
.inline_formset_table table a:active, 
.inline_formset_table table a:focus {
	outline: none;
	background-color: #eeeeee;
}

.change_list_section table a:active, 
.change_list_section table a:focus {
	outline: none;
	background-color: #ffffff;
}

/******************** POP-UP WINDOWS THAT OCCUR THROUGHOUT SITE ********************/

.inline_table_edit_form {
	width: 500px; 
}

.inline_table_edit_form label {
	padding-top: 15px; 
}

.inline_table_edit_form input {
	width: 85%; 
	min-height: 25px; 
}

.inline_table_edit_form input[type="checkbox"] {
	margin-top: 18px; 
	width: 4%; 
}

.inline_table_edit_form #directorates_table .button_link .add_link {
	width: 200px; 
	padding: 8px; 
	margin-top: 25px; 
}

#confirm_delete_window {
	height: 300px; 
}

/* PERSON CREATE WINDOW - here because it needs to be accessed from several different forms */

#person_create_form {
	width: 700px; 
	margin-left: 7px;
	margin-right: 7px;
}

#person_create_form fieldset:last-of-type {
	margin-bottom: 10px;
	padding-bottom: 0px;
}

.dialog_content #person_create_form .errorlist {
	margin-top: 5px;
	margin-bottom: 0px;
}

#person_create_form #person_name_section {
	margin-top: -10px;
}

#person_create_form #person_name_section div {
	width: 48%;
	float: left; 
	clear: none; 
	padding: 0px; 
	margin: 0px;
	min-height: 55px;
	position: relative; 
	left:0px; 
	margin-right: 2%;
}

#person_create_form #person_name_section label {
	width: 41%;
	position: absolute; 
	left: 0px; 
	bottom: 7px;
}

#person_create_form #person_name_section input {
	width: 53%;
	margin-bottom: 0px; 
	position: absolute; 
	left: 43%; 
	bottom: 0px;
}

#person_create_form #person_name_section #person_name_initials input {
	width: 15%;
}

#person_create_form #person_name_section select {
	width: 30%;
	margin-bottom: 0px; 
	position: absolute; 
	left: 43%; 
	bottom: 0px;
}

#person_create_form #contact_details_section div {
	width: 50%;
	float: left; 
	clear: none; 
	padding: 0px; 
	margin: 0px;
	min-height: 55px;
}

#person_create_form #contact_details_section #contact_details_email_1 {
	width: 100%;
	clear: both;
}

#person_create_form #contact_details_section #contact_details_address {
	width: 69%;
	min-height: 120px;
}

#person_create_form #contact_details_section #contact_details_postcode {
	width: 31%;
}

#person_create_form #contact_details_section #contact_details_country {
	width: 100%;
}

#person_create_form #contact_details_section div label {
	width: 132px;
}

#person_create_form #contact_details_section div input {
	width: 170px;
}

#person_create_form #contact_details_section div textarea {
	width: 300px;
	height: 120px;
	margin-bottom: 15px;
}

#person_create_form #contact_details_section div select {
	width: 420px;
	margin-bottom: 0px;
}

#person_create_form #contact_details_section #contact_details_email_1 input {
	width: 300px;
}

#person_create_form #contact_details_section #contact_details_postcode label {
	width: 78px;
}

#person_create_form #contact_details_section #contact_details_postcode input {
	width: 100px;
}

/* ORGANISATION CREATE WINDOW */

#organisation_create_form {
	width: 700px;
}

#organisation_create_form #details_section div {
	min-height: 25px;
}

#organisation_create_form #details_section label {
	width: 12%; 
	margin-top: 7px;
}

#organisation_create_form #details_section input[type="text"] {
	width: 83%; 
	margin-bottom: 0px;
}

#organisation_create_form #details_section select {
	width: 30%; 
}

#organisation_create_form #details_section input[type="checkbox"] {
	float: left; 
	margin-left: 2px;
	margin-bottom: 0px;
}

#organisation_create_form #details_section .checkbox-container {
	clear: both; 
}

#organisation_create_form #details_section .checkbox-container label {
	width: 40%; 
	margin-left: 10px; 
	margin-top: 0px;
	text-align: left;	
}

#organisation_create_form #inline_organisation_prompt {
	font-size: 1em;
}

/* ACTIVITY CREATE WINDOW */

#activity_create {
	width: 700px !important; 
}

#activity_create label {
	width: 110px;
	margin-top: 7px;
}

#activity_create select {
	width: 575px; 
}

/* OVERRIDE STATUS POP-UP WINDOW */


#override_status label {
	font-size: 0.8em;
}

#override_status input {
	font-size: 0.8em;
}

#override_status select {
	font-size: 0.8em;
	width: 450px;	
}

#override_status p {
	font-size: 0.8em;
	margin-bottom: 15px;
	font-style: italic;
}

/* EFFECTIVE DATES POP-UP WINDOW */

#effective_dates_edit_form {
	width: 500px;
}

#effective_dates_edit_form div:first-of-type {
	margin-top: 20px;
}

#effective_dates_edit_form label {
	width: 245px;
}

#effective_dates_edit_form input {
	width: 120px;
}

/******************** TIMELINE SECTION ON STATUS TAB ********************/

#status_timeline {
	border: 1px solid #bebebe; 
	margin-top: 11px; 
	clear: both;
	margin-bottom: 25px;
}

#status_timeline h2 {
	padding: 0px 10px 0px 15px; 
	font-size: 1.2em; 
	background: #ffffff; 
	display: inline-block; 
	position: relative; 
	top: -12px;
	left: 10px;	
}

#status_timeline h2 span {
	font-size: 0.8em;
	color: #555555 !important;
}

.timeline_key .checkbox_container input[type="checkbox"],
.timeline_key .checkbox_container label {
	position: static !important;
}

.timeline_key .checkbox_container input[type="checkbox"] {
	margin-top: 8px;
}

.timeline_key .checkbox_container label {
	font-size: 0.8em;
	margin-left: 8px;
	margin-right: 0px;
}

.timeline_key .checkbox_container {
	display: block;
	margin-right: 22px;
	height: 30px;
	clear: none;
	float: right;
}

/******************** CHECKLIST SECTION ON STATUS TAB - PROJECTS AND ACTIVITIES ********************/

.activity-message {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden; 
}

/******************** DATE PICKER ********************/

.ui-datepicker {
	padding: 0px !important;
	border: 1px solid #267b8c !important;
}

.ui-datepicker .ui-datepicker-header {
	font-size: 0.9em;
	font-weight: normal;
	background: #fff;
	border: none;
}

.ui-datepicker .ui-datepicker-calendar {
	border: none !important;
}

.ui-datepicker .ui-datepicker-calendar th {
	border-right: 1px dotted #fff;
}

.ui-datepicker .ui-datepicker-calendar th:last-of-type {
	border-right: none;
}

.ui-datepicker td a {
	background: none !important;
	border: 1px solid #fff !important;
}

.ui-datepicker td a:hover,
.ui-datepicker td a:focus,
.ui-datepicker td a:active,
.ui-datepicker td.ui-datepicker-current-day a {
	border: 1px solid #aaa !important;
	border-radius: 2px;
}

.ui-datepicker select.ui-datepicker-month-year {
	width: 100%;
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 49%;
}

.ui-datepicker table {
	margin: 0px 0px 10px 0px;
}

.ui-datepicker th {
	border: 0;
}

.ui-datepicker td span,
.ui-datepicker td a {
	padding: .2em .8em .2em .2em;
	margin: 0px;
	width: 70%;
}

/******************** ERROR MESSAGES ********************/

/* Applied to any form fields showing a list of errors */

.errorlist {
	width: 100%;
	display: block;
    background: #cf1e00;
    color: #ffffff;
	padding: 0px;
	clear: both;	
}

.errorlist li {
	padding: 1px 10px 1px 10px;
	font-size: 0.9em;
	line-height: 1.3em;
}

.dialog_content .errorlist {
	position: static !important;
	margin-bottom: 5px;
} 

/* Applied to the error banner at the top of a page containing errors */

.error_notification {
    background: #cf1e00;
    color: #ffffff;
    height: 25px;
	padding: 5px 0px 0px 10px;
}

/* Applied to highlight a tab with an error */

.error_tab {
    background: #cf1e00 !important;
    color: #ffffff !important;
}

/* Applied to dialog box to highlight action that cannot be done */

.dialog_error_notification {
	max-width: 500px;
    background-color: #cf1e00;
    color: #ffffff;
	padding: 5px 10px 5px 10px;
	margin-bottom: 20px !important;
}

/******************** SKIP LINKS ********************/

.skip_to_link {
	position: absolute;
	top: -1000px;
	left: -1000px;
	height: 1px;
	width: 1px;
	text-align: left;
	overflow: hidden;
}

a.skip_to_link:active, 
a.skip_to_link:focus, 
a.skip_to_link:hover {
	left: 0; 
	top: 0;
	font-size: 0.9em;
	color: #555555;
	width: auto; 
	height: auto; 
	overflow: visible; 
	padding: 5px;
	background-color: white;
	outline: none !important;
}

/******************** CLEAR ********************/

.clear, 
.clear_title, 
.clear_form_section {
	width: 100%; 
	clear: both; 
	margin: 0px; 
}

.clear {
	height: 2px;
}

.clear_title {
	height: 10px;
}

.clear_form_section {
	height: 0px;
	padding: 0px;
	margin-bottom: -5px !important;
	margin-top: -5px !important;
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

/******************** CONFIRM DELETE WINDOW ********************/

.dialog_content p {
	font-size: 1em; 
}

.delete_object {
	max-width: 600px;
	margin-top: -12px !important;
}

.delete_object span.object_to_delete {
	font-style: normal !important;
	color: #157e8d;
}

/******************** APPLYING ALERT COLOURS ********************/

.red-alert {
	background: /*#c80000*/ #e89077 !important;
	color: #333333;
}

.amber-alert {
	background: /*#ffd13c*/ #f7c55f !important;
	color: #333333;
}

.green-alert {
	background: /*#025c32*/ #89e1a0 !important;
	color: #333333;
}

.red-alert a,
.amber-alert a,
.green-alert a {
	color: #333333 !important;
}

.completed-red-alert {
	color: #333333;
	background: #fff;
	border: 1px solid #c80000;
}

.completed-amber-alert {
	color: #333333;
	background: #fff;
	border: 1px solid #ffd13c;
}

.completed-green-alert {
	color: #333333;
	background: #fff;
	border: 1px solid #025c32;
}

.red-alert,
.amber-alert,
.green-alert,
.completed-red-alert,
.completed-amber-alert,
.completed-green-alert {
	padding: 5px;
	display: inline-block;
}

td .red-alert,
td .amber-alert,
td .green-alert,
td .completed-red-alert,
td .completed-amber-alert,
td .completed-green-alert{
	display: block;
}

.no-alert {
	color: #333333 !important;
	padding: 5px;
	display: inline-block;
}

.complete-no-alert {
	color: #333333 !important;
	padding: 5px;
	display: inline-block;
}

/* Alert colours in status page heading */

#status_timeline h2 .red-alert,
#status_timeline h2 .amber-alert,
#status_timeline h2 .green-alert {
	color: #333333 !important;
	font-size: 0.8em !important;
}

/******************** TOOL TIP ********************/

.ui-tooltip {
	font-size: 0.8em !important;
	max-width: 300px;
	padding: 8px;
	border: 1px solid #157e8d !important;
	border-radius: 2px;
	color: #333;
	background-color: #f8f8f8;
	position: absolute;
	z-index: 9999;
	line-height: 1.5em;
	box-shadow: none !important;
}
body .ui-tooltip {
	border: none;
}
div[id^="ui-tooltip-"] div {
	background-color: #f8f8f8;
	padding: 8px;
	border: 1px solid #157e8d;
	border-radius: 2px;
}

/******************** NOTIFICATIONS MESSAGE WHEN USER LOGS INTO STUDYLINE ********************/

.system_notification_form p {
	font-style: normal !important;
}

.system_notification_form p a {	
	margin-left: 7px;
	color: #0d5982;
	outline: none;
}

.system_notification_form p a:hover {
	color: #555;
	text-decoration: none;
}
	

.system_notification_form input[type="checkbox"] {
	margin-top: 9px;
	margin-right: 8px;
}

/******************** HIDE CONTENT FROM VIEW BUT STILL VISIBLE TO SCREENREADERS ********************/

.hide_content {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* hidden skip links at top of each page */

#header-hidden a {
	display: inline;
	clear: none;
	padding: 0px;
	margin: 0px;
	font-size: 0px;
	color: #ffffff;
}

#header-hidden a:active, #header-hidden a:focus {
	padding: 5px;
	margin: 0px !important;
	font-size: 0.9em;
	color: #333333;
}
	
input#activity_save_button[title]:hover:after {
	content: attr(title);
	color: #ff0000 !important;
	font-size: 2em;
	line-height: 2em;
}

/******************** FIELD HIGHLIGHTING AFTER CLICKING CHECKLIST ITEM ********************/

.highlight_field_div input, 
.highlight_field_div select, 
.highlight_field_div textarea{
    background-color: #ffffaa;
	color: #222222 !important;
}

.highlight_field_div input[type="checkbox"] + label {
	background-color: #ffffaa !important;
}

.highlight_field_div .button_link a {
    background-color: #ffffaa;
	color: #222222 !important;
	border-bottom: 3px solid #eee;
}

.highlight_field_div .button_link a:hover,
.highlight_field_div .button_link a:focus,
.highlight_field_div .button_link a:active {
	border-bottom: 3px solid #999;
}

.highlight_field_div button {
	background: #ffffaa;
	color: #222222 !important;
	border-bottom: 3px solid #eee;
}

.highlight_field_div button:hover,
.highlight_field_div button:focus,
.highlight_field_div .button:active {
	border-bottom: 3px solid #999;
}

/******************** TEXT HIGHLIGHTING ********************/
.text_highlight {
	margin-top: 20px !important;
	clear: both;
}

.text_highlight p {
	font-weight: bold;
	color: #555555;
}

.text_highlight a {
	color: #0d5982 !important;
	text-decoration: underline;
	font-weight: normal;
	font-style: normal;
}

.text_highlight a:focus,
.text_highlight a:hover,
.text_highlight a:active {
	color: #555555 !important;
	text-decoration: none;
}

/******************** MEDIA QUERIES ********************/

@media screen and (max-width:1360px) {

	#main-top-nav ul li.nav_search_container {
		margin-right: 20px;
	}
	
	#main-top-nav ul li a {
		padding: 13px 18px 0px 18px;
	}
	
	#main-top-nav ul li.nav_search_container {
		width: calc(33% - 33px);
	}
}

@media screen and (max-width:1040px) {

	#main-top-nav ul li a {
		padding: 13px 12px 0px 12px; 
	}
	
	#status .two_column_container .status_current_activities {
		width: calc(94% - 180px);
	}
	
	#main-top-nav ul li.nav_search_container {
		width: calc(33% - 33px);
	}
	
}

@media screen and (max-width:900px) {

	#main-top-nav ul li a {
		padding: 13px 10px 0px 10px; 
	}

}

@media screen and (max-width:880px) {
	
	#main-top-nav ul li.nav_search_container {
		width: calc(38% - 33px);
	}

	#main-top-nav ul li a {
		font-size: 0.9em;
		padding: 13px 7px 0px 7px; 
	}
	
	#main-top-nav ul li.nav_search_container input#menu_search_text {
		font-size: 0.8em;
	}
	
}

/******************** LINK BACK TO LIST ********************/

#back_to_list {
	font-size: 0.9em;
}

/******************** SCROLL ON PERSON/ORGANISATION SELECT FIELD ********************/

.ui-dialog div.ui-dialog-buttonpane + ul.ui-autocomplete {
	max-height: 150px;
	max-width: 632px;
	overflow: scroll;
}

.ui-dialog div.ui-dialog-buttonpane + ul.ui-autocomplete li.ui-menu-item {
	padding: 5px 0px;
	border-bottom: 1px dotted #555;
	outline: none !important;
}

.ui-dialog div.ui-dialog-buttonpane + ul.ui-autocomplete li.ui-menu-item div {
	background: none !important;
	border-color: #eee !important;
}

.ui-dialog div.ui-dialog-buttonpane + ul.ui-autocomplete li:hover {
	background: #eee;
}

/******************** ADD A NEW INSURANCE POLICY UNDERWRITER SELECT FIELD ********************/

.ui-dialog div.ui-resizable-nw + ul.ui-autocomplete {
	max-height: 230px;
	max-width: 550px;
	overflow: scroll;
}

.ui-dialog div.ui-resizable-nw + ul.ui-autocomplete li.ui-menu-item {
	padding: 5px 0px;
	border-bottom: 1px dotted #555;
	outline: none !important;
}

.ui-dialog div.ui-resizable-nw + ul.ui-autocomplete li.ui-menu-item div {
	background: none !important;
	border-color: #eee !important;
}

.ui-dialog div.ui-resizable-nw + ul.ui-autocomplete li:hover {
	background: #eee;
}

/******** Missing progress bar fix *********/
.ui-progressbar .ui-progressbar-value {
	margin: 0px;
	height: 100%;
	background-color: #157e8d;
	opacity: 0.25;
}