/* Hospital To Home */
/* Primary brand colour #007EA7 */

/* This style sheet is broken up into six core componets and uses normalize.css as a reset.
   Styles are applied 'Mobile First' with media queries for larger screen sizes.

1) Typography
2) Default content UI elements - E.g. forms, buttons, and tables
3) General site layout - E.g. header, content area, and footer
4) Page specific layouts and custom styles
5) Reporting
6) Third party overrides - E.g. jQuery UI
7) Other

/* Font import */

	@font-face {
	  	font-family: 'Poppins';
	  	src: url('https://staging.pathways2care.uk/index.php?Request=file&FileStore=project&Path=%2Ffonts%2Fpoppins%2FPoppins-SemiBold.ttf') format('truetype');
	  	font-weight: 600;
	    font-style: normal;
	}

	@font-face {
	  	font-family: 'Open Sans';
	  	src: url('https://staging.pathways2care.uk/index.php?Request=file&FileStore=project&Path=%2Ffonts%2Fopensans%2FOpenSans-Regular.ttf') format('truetype');
	  	font-weight: normal;
	    font-style: normal;
	}

	@font-face {
	  	font-family: 'Open Sans';
	  	src: url('https://staging.pathways2care.uk/index.php?Request=file&FileStore=project&Path=%2Ffonts%2Fopensans%2FOpenSans-SemiBold.ttf') format('truetype');
	  	font-weight: 600;
	    font-style: normal;
	}

	@font-face {
	  	font-family: 'Open Sans';
	  	src: url('https://staging.pathways2care.uk/index.php?Request=file&FileStore=project&Path=%2Ffonts%2Fopensans%2FOpenSans-Italic.ttf') format('truetype');
	  	font-weight: normal;
	    font-style: italic;
	}

	@font-face {
	  	font-family: 'Open Sans';
	  	src: url('https://staging.pathways2care.uk/index.php?Request=file&FileStore=project&Path=%2Ffonts%2Fopensans%2FOpenSans-SemiBoldItalic.ttf') format('truetype');
	  	font-weight: 600;
	    font-style: italic;
	}

/* End font import */

	body {
		font-family: 'Open Sans', Arial, Helvetica, sans-serif;
		color: #444444;
		font-size: 1rem;
		line-height: 1.5;
	}

	/* Temporary hides */

	#site_title,
	#app_version,
	#UnexpectedOutput,
	hr {
		display: none;
	}

/* 1. Typography and list styles */

/* Default text */
	p {
		margin: 0 0 1rem 0;
		padding: 0;
	}

	h1, h2, h3, h4, h5, h6 {
		font-family: 'Poppins', Arial, Helvetica, sans-serif;
		color: #007EA7;
		margin: 1rem 0 0.75rem 0;
		font-weight: 600;
	}

	h1 {
		font-size: 1.5rem;
	}

	h2 {
		font-size: 1.375rem;
	}

	h3 {
		font-size: 1.25rem;
	}

	h4 {
		font-size: 1.125rem;
	}

	a {
		color: #007EA7;
		text-decoration: none;
		font-weight: 600;
	}

	a:hover {
		color: #000000;
		text-decoration: underline;
	}

/* Lists */

	ul {
		margin: 0.5rem 1rem 1rem 1.5rem;
		padding: 0;
		list-style: disc;
	}

	li {
		margin: 0 0 0.5rem 0;
		padding: 0;
	}

/* Definition lists are used for the activity display */
	dd {
		margin: 0;
		padding: 0;
	}

/* End #1 Typography */

/* 2. Default content UI elements */

/* Buttons
   We use lots of different class names for buttons
 */

	.LargeButton,
	.Button,
	button,
	#AddTeam,
	.DeleteTeam,
	.DeleteNewTeam {
		color: #FFFFFF;
		background-color: #007EA7;
		border-radius: 0.25rem;
		padding: 0.5rem 1.25rem;
		border: 0;
		font-weight: 600;
		width: auto;
	}

/* Custom styling for 'Manage presets' button */ 
.ReportPageOptions a.Button {
	line-height: 1.125;
	display: inline-block;
}

/* Hover states for the above */
	.LargeButton:hover,
	.Button:hover,
	button:hover,
	#AddTeam:hover,
	.DeleteTeam:hover,
	.DeleteNewTeam:hover {
		background-color: #000000;
		cursor: pointer;
		color: #FFFFFF;
		text-decoration: none;
	}

/* Cancel */
	#Cancel.LargeButton,
	.LargeButtonCancel,
	.LargeButtonCancel.LargeButtonDisabled,
	.SendAlert.LargeButton.selected {
		background-color: #FFFFFF;
		color: #666666;
		font-weight: normal;
		border: solid 1px #CCCCCC;
	}

	.SendAlert.LargeButton.selected {
		padding-top: 0.4375rem;
		padding-bottom: 0.4375rem; 
	}

/* Cancel hover states */
	#Cancel.LargeButton:hover,
	.LargeButtonCancel:hover,
	.LargeButtonCancel.LargeButtonDisabled:hover,
	.SendAlert.LargeButton.selected:hover {
		background-color: #DDDDDD;
		color: #444444;
	}

/* Delete */
	.DeleteNewTeam,
	.LargeButtonDelete,
	.DeleteTeam {
		background-color: red;
		margin-left: 3rem;
	}

/* Disabled */
	.LargeButton.LargeButtonCancel.LargeButtonDisabled {
		text-decoration: none;
	}

	.LargeButtonDisabled {
		background-color: #CCCCCC;
	}

	.LargeButtonDisabled:hover {
		background-color: #CCCCCC;
		cursor: default;
	}

/* Button group position */

	.StandardInputForm .ButtonGroup {
		margin-top: 3rem;
	}

	@media screen and (min-width: 750px) {
		.StandardInputForm .ButtonGroup {
			margin-left: 250px;
		}
	}

	#SendNotifications button {
		margin-bottom: 4px;
	}

	#SendNotifications .Alert.selected {
		background-image: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fnotification-selected-tick.png');
		background-repeat: no-repeat;
		background-position: 94% 50%;
		padding-right: 40px;
		background-size: 20px 20px;
		background-color: #005a77;		
	}

/* End buttons */

/* Forms */

/* Defaault form styling */

	label {
		display: block; /* For smaller screens to show inputs under labels */
		vertical-align: top;
		margin-top: 5px;
		font-weight: 600;
	}

	@media screen and (min-width: 750px) {
		label {
			display: inline-block; /* For large screens */
			float: left;
			width: 250px;
		}
	}

	input, select {
		border: solid 1px #999999;
		border-radius: 0.25rem;
		font-size: 1rem;
		padding: 0.375rem 0.5rem;
		width: 100%;
		line-height: 1.5;
		box-sizing: border-box;
	}

	@media screen and (min-width: 600px) {
		input, select {
			max-width: 350px;
		}
	}

	select {
		background-image: url("https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Farrow-triangle-down.png");
		background-position: top 12px right 12px;
		background-repeat: no-repeat;
		-webkit-appearance: none;
		-moz-appearance: none;
		-ms-appearance: none;
		-o-appearance: none;
		appearance: none;
		box-sizing: border-box;
		padding-right: 35px;
	}

	#LookupTableData input {
		min-width: auto;
	}

	.FieldCheckboxList {
		display: inline-block;
		margin-top: 1.5rem;
		vertical-align: top;
		margin-bottom: 0;
		font-size: 1.125rem;
	}

	.FieldCheckboxList label {
		margin-top: 0;
	}

	.CheckboxListItem label,
	.BooleanLabel label {
		display: inline-block; /* for all screens */
		width: 240px;
		margin-right: 10px;
	}

	fieldset {
		margin: 0;
		padding: 0;
		border: 0;
		width: 300px;
	}

	@media screen and (min-width: 600px) {
		fieldset {
			display: inline-block;
		}
	}

	.FieldDatePicker {
		margin-bottom: 0;
		display: inline;
	}

/* Date picker */

	input.DateDay,
	input.DateMonth,
	input.TimeHour,
	input.TimeMinute {
		width: auto;
		text-align: center;
	}

	input.DateYear {
		width: auto;
		text-align: center;
	}

/* Criteria to reside date/time specific */

/* forces the time to wrap to avoid it breaking onto two lines at certain resolutions */
	@media screen and (max-width: 1080px) {
		.CriteriaToResideDateTime {
			width: 500px;
		}
	}

	.CriteriaToResideDateTime input.DateYear {
		margin-right: 25px;
	}

	.CriteriaToResideDateTime input {
		margin-bottom: 10px;
	}
/* End criteria to reside date/time specific */			

	.ui-datepicker-trigger {
		vertical-align: middle;
		width: 40px;
		height: 40px;
	}

	textarea {
		border: solid 1px #999999;
		border-radius: 0.25rem;
		font-size: 1rem;
		background-color: #FFFFFF;
		padding: 0.375rem 0.5rem;
		font-family: 'Open Sans', sans-serif;
		width: 100%;
		max-width: 420px;
		box-sizing: border-box;
		min-height: 200px
	}

	input[type="checkbox"] {
		width: 20px;
		margin-top: 13px;
	}

	input[type="radio"] {
		width: 3rem;
	}

/* Custom styles */

	.not-editable-input-text-only {
		margin-top: 1.5rem;
	}

	.not-editable-input-text-only p label {
		margin-top: 0;
	}

	#frmEditLookup .ButtonGroup {
		text-align: left !important;
		margin-left: 0 !important;
	}


	#PatientHistory .DateHeader {
		font-weight: 600;
		font-size: 1.125rem;
	}

	#PatientHistory .TimeHeader {
		font-weight: 600;
		font-size: 0.9375rem;
	}


/* Form container */
	#frmUpdateDischarge,
	#frmRegisterNewDischarge,
	#frmEditPatient,
	#frmEditCaseNote,
	#frmProcessNewDischarge,
	#frmOrganisationEdit,
	#frmRoleEdit,
	#frmAdvancedSearch,
	#frmEditUser {
		padding: 4%;
		box-sizing: border-box;
		background-color: #fafafa;
		border-radius: 0.25rem;
		width: 100%;
		max-width: 860px;
		border: solid 1px #e5e5e5;
	}

/* Overrides for the tabbed view */
	#frmUpdateDischarge,
	#frmEditCaseNote,
	#frmEditPatient {
		border: 0;
		padding: 2% 0;
	}


/* Tables */

	/* Allows for horizontal scroll on smaller screens */
	.table-container {
		overflow-y: auto;
	}

	table {
		margin: 1rem 0 2rem 0;
		border-collapse: collapse;
		max-width: 100%;
		text-align: left;
		border-top: 1px solid #333333;
		border-left: 1px solid #333333;
	}

	th {
		background-color: #007EA7;
		border-right: 1px solid #333333;
		border-bottom: 1px solid #333333;
		padding: 0.375rem;
		font-size: 0.8125rem;
		line-height: 1.2;
		color: #FFFFFF;
	}

	@media screen and (min-width: 900px) {
		th {
			font-size: 0.875rem;
			padding: 0.375rem 0.75rem;
		}
	}

	@media screen and (min-width: 1100px) {
		th {
			font-size: 0.9375rem;
		}
	}

	th a {
		color: #FFFFFF;
	}

	th a:hover {
		color: #FFFFFF;
	}

	td {
		border-right: 1px solid #333333;
		border-bottom: 1px solid #333333;
		padding: 0.375rem;
		font-size: 0.8125rem;
	}

	@media screen and (min-width: 900px) {
		td {
			font-size: 0.875rem;
			padding: 0.375rem 0.75rem;
		}
	}

	@media screen and (min-width: 1100px) {
		td {
			font-size: 0.9375rem;
		}
	}

/* Audit log table */

	#DischargeAuditLogTable tr:hover {
		background-color: #DDDDDD;
	}

	#DischargeAuditLogTable .ChangedFieldName {
		font-weight: 600;
		margin-right: 5px;
	}

	#DischargeAuditLogTable .ChangeArrow {
		color: #007EA7;
		margin-right: 5px;
		margin-left: 5px;
		font-weight: 600;
		line-height: 1;
	}

	#DischargeAuditLogTable .NewValue {
		font-weight: bold;
	}

	#DischargeAuditLogTable .MatchHighlight {
		background-color: #007EA7;
		font-weight: 600;
	}

	#DischargeAuditLogTable .EnableExpand td:first-child,
	#DischargeAuditLogTable .DisableExpand td:first-child {
		cursor: pointer;
		background-repeat: no-repeat;
		background-position: right;
	}

	#DischargeAuditLogTable .EnableExpand td:first-child {
		background-image: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fexpand-arrow.png');
		background-position: 95% 50%;
		padding-right: 30px;
		background-size: 16px 16px;
	}

	#DischargeAuditLogTable .DisableExpand td:first-child {
		background-image: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fcollapse-arrow.png');
		background-position: 95% 50%;
		padding-right: 30px;
		background-size: 16px 16px;		
	}

	#DischargeAuditLogTable .EnableExpand td {
		background-color: #EEEEEE;
	}

	#DischargeAuditLogTable .Parent.DisableExpand td {
		background-color: #EEEEEE;
	}

	#DischargeAuditLogTable .Child td {
		background-color: #EEEEEE;
	}

/* Roles table */
	.BoolYes {
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fgreen-tick-icon.png') no-repeat 50% 50%;
		background-size: 16px 16px;
	}

	.BoolNo {
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fred-cross-icon.png') no-repeat 50% 50%;
		background-size: 16px 16px;
	}

	.BoolYes .roles-options-text,
	.BoolNo .roles-options-text,
	.BoolYes .islocalauthority-text,
	.BoolNo .islocalauthority-text {
		visibility: hidden;
		width: 20px;
		display: inline-block;
		vertical-align: middle;
	}

	/*.role-table-role {
		min-width: 150px;
	}

	.role-table-id {
		min-width: 50px;
	}*/

/* Notifications */

	#NotificationsPanel p {
		border: solid 3px #0088cc;
		border-left: solid 10px #0088cc;
		padding: 0.5rem 1rem;
		font-weight: 600;
		font-size: 1.25rem;
		color: #0088cc;
	}

	#NotificationsPanel .Error {
		border: solid 5px red;
		border-left: solid 10px red;
		color: red;
	}

	#NotificationsPanel .Warning {
		border: solid 5px orange;
		border-left: solid 10px orange;
		color: orange;
	}

	#NotificationsPanel .DataUpdated {
		border: solid 5px green;
		border-left: solid 10px green;
		color: green;
	}

	.DataErrorDescription {
		color: red;
		font-weight: 600;
		font-size: 0.8125rem;
		margin: 0.25rem 0 1rem 0;
		display: block;
	}

	@media screen and (min-width: 750px) {
		.DataErrorDescription {
			margin-left: 250px;
		}
	}

	@media screen and (min-width: 750px) {
		#TeamList .DataErrorDescription {
			margin-left: 180px;
		}
	}

	.RequiredData {
		background-color: #FFFCCC;
	}

/* End notifications */

/* End #2 */

/* 3) General site layout */

	#pagecontainer {
		margin: 0 auto;
		width: 94%;
		padding: 0 3%;
		max-width: 1200px;
	}

/* Header */

	#site_header {
		padding: 1rem 0;
		margin: 0;
		overflow: hidden;
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fheader-gradient-bg.png') repeat-x 0 100%;
	}

	#app_logo {
		float: left;
		margin-right: 0.5rem;
	}

	@media screen and (min-width: 600px) {
		#app_logo {
			margin-right: 1.5rem;
		}
	}

	#app_logo img {
		max-height: 40px;
		margin-top: 6px;
	}

	@media screen and (min-width: 600px) {
		#app_logo img {
			max-height: 60px;
			margin-top: 0;
		}
	}

	#home_link {
		display: block;
	}


	#frmSearch {
		float: left;
		margin-top: 0.5rem;
	}

	@media screen and (min-width: 600px) {
		#frmSearch {
			margin-top: 0.875rem;
		}
	}

	#frmSearch input {
		padding: 0.5rem;
		border: solid 1px #007EA7;
		min-width: 85px;
		max-width: 85px;
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
		border-right: 0;
		font-size: 0.875rem;
	}

	@media screen and (min-width: 370px) {
		#frmSearch input {
			min-width: 120px;
		}
	}

	@media screen and (min-width: 450px) {
		#frmSearch input {
			min-width: 170px;
		}
	}

	@media screen and (min-width: 500px) {
		#frmSearch input {
			min-width: 200px;
			font-size: 1rem;
		}
	}

	@media screen and (min-width: 750px) {
		#frmSearch input {
			min-width: 150px;
		}
	}

	@media screen and (min-width: 900px) {
		#frmSearch input {
			min-width: 250px;
		}
	}

	#frmSearch input.LargeButton {
		padding: 0.5rem 0.75rem;
		margin-left: 0rem;
		min-width: auto;
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
		border-top-right-radius: 0.25rem;
		border-bottom-right-radius: 0.25rem;
	}

	#frmSearch input.LargeButton:hover {
		border-color: black;
	}

	#frmSearch p {
		float: left;
	}

	#loginstatus {
		float: right;
	}

	@media screen and (min-width: 600px) {
		#loginstatus {
			float: right;
		}
	}

	@media screen and (min-width: 1000px) {
		#loginstatus {
			width: auto;
		}
	}

	.user-detail {
		float: right;
	}

	.user-icon {
		width: 100%;
		max-width: 18px;
		margin-right: 0.375rem;
		vertical-align: middle;
	}

	.system-menu {
		float: right;
		clear: right;
		list-style: none;
		margin: 0;
		padding: 0;
	}

	.system-menu li {
		display: inline-block;
		margin-left: 1rem;
	}

	.user-name {
		margin-right: 0.5rem;
		color: #FFFFFF;
	}

	@media screen and (min-width: 800px) {
		.user-name {
			display: none;
		}
	}

	@media screen and (min-width: 1100px) {
		.user-name {
			display: inline;
			color: #444444;
		}
	}

	.user-last-name {
		text-transform: uppercase;
	}

/* Mobile menu */

	@media only screen and (min-width: 800px) {
		#MenuToggle {
			display: none;
		}
	}

	@media only screen and (max-width: 799px) {
		.header-nav {
			display: none;
		}
	}

	.TopMenuVisible #loginstatus {
		position: absolute;
		top: 0;
		right: 0;
		height: auto;
		z-index: 100;
		width: 100%;
		padding: 3%;
		box-sizing: border-box;
		background-color: #005A77;
		display: block;
		border-bottom: solid 5px #000000;
	}

	.TopMenuVisible #loginstatus a {
		color: #FFFFFF;
	}

	.TopMenuVisible .header-nav {
		display: block;
	}

	.TopMenuVisible .header-nav li {
		color: #FFFFFF;
		text-align: right;
	}

	.header-nav li {
		list-style: none;
	}

	#loginstatus a#MenuToggle {
		position: relative;
		color: #007EA7;
		float: right;
		text-decoration: none;
		border: solid 1px #007EA7;
		padding: 0.5rem 10px;
		border-radius: 0.25rem;
		font-weight: bold;
		font-size: 0.875rem;
		clear: right;
		margin-top: 0.5rem;
	}

	@media only screen and (min-width: 500px) {
		#loginstatus a#MenuToggle {
			font-size: 1rem;
		}
	}

	@media only screen and (min-width: 600px) {
		#loginstatus a#MenuToggle {
			margin-top: 0.875rem;
		}
	}

	.TopMenuVisible #loginstatus a#MenuToggle {
		color: #FFFFFF;
		border: solid 1px #FFFFFF;
	}

/* end header */

 /* Footer */

	#footer {
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fheader-gradient-bg.png') repeat-x 0 0;
		width: 100%;
		text-align: center;
		padding: 2rem 2% 1rem 2%;
		box-sizing: border-box;
		margin-top: 5rem;
		overflow: auto;
	}

	#footer ul {
		list-style: none;
		margin: 0 0 1rem 0;
		padding: 0;
	}

	#footer #app_copyright {
		float: left;
	}

	#footer .legal {
		float: left;
		clear: left;
	}

	@media only screen and (min-width: 750px) {
		#footer .legal {
			float: right;
			clear: none;
		}
	}

	#footer .legal li {
		display: inline;
		margin-right: 1rem;
	}

	@media only screen and (min-width: 750px) {
		#footer .legal li {
			margin-left: 2rem;
			margin-right: 0;
		}
	}

/* End footer */

/* Content general layout */

	#page_header {
		clear: left;
	}

	#page_title {
		padding-bottom: 0.5rem;
	}

/* End #3 */

/* 4) Page specific layouts and custom styles */

/* Default person view */

/* Patent details left block */

	#PatientDetails {
		padding: 1.5rem;
		border-radius: 5px;
		margin: 0 0 1rem 0;
		box-sizing: border-box;
		background-color: #005a77;
		color: #FFFFFF;
		width: 100%;
	}

	@media screen and (min-width: 800px) {
		#PatientDetails {
			float: left;
			width: 32%;
			/*display: inline;*/
		}
	}

	#PatientDetails p {
		margin-bottom: 0.75rem;
	}

	#PatientDetails .label {
		font-weight: 600;
	}

	.nhs-number,
	.postcode {
		display: inline-block;
	}

	.nhs-number {
		margin-right: 0.5rem;
	}

	.current-location {
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fcurrent-location-icon.png') no-repeat 4px 0;
		padding-left: 30px;
		background-size: 16px 24px;
	}

	#PatientDetails h1,
	#PatientDetails h2 {
		color: #FFFFFF;
		font-size: 1.125rem;
		margin-bottom: 0.25rem;
		margin-top: 0;
	}

	#PatientDetails .discharge p {
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fwhite-calendar-icon.png') no-repeat 0 0;
		padding-left: 30px;
		background-size: 24px 24px;
	}

	#PatientDetails .pathway p {
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fwhite-pathway-icon.png') no-repeat 0 0;
		padding-left: 30px;
		background-size: 24px 24px;
	}

	.location {
		font-weight: 600;
	}

/* End patient details block */



/* Case Deletion History block */

	#DeletionHistory .ExcludedCasesList {
		list-style-type: none;
		margin: 0;
	}

	#DeletionHistory td a {
		text-decoration: underline;
	}

/* End Case Deletion History block */


/* Patient history block */

	#PatientHistory {
		width: 100%;
		padding: 0.5rem 1.5rem 1.5rem 1.5rem;
		border-radius: 5px;
		margin: 0 0 1rem 0;
		box-sizing: border-box;
		background-color: #fafafa;
		border: solid 1px #e5e5e5;
	}

	@media screen and (min-width: 800px) {
		#PatientHistory {
			border-top-left-radius: 0;
			border-top-right-radius: 0;
			float: right;
			width: 65%;
		}
	}

	#PatientHistory .date {
		font-weight: 600;
	}

/* End patentient history */

/* Primary editing links */

	#ActionButtons {
		border: solid 1px #007EA7;
		background-color: #f4f8f9;
		padding: 1.5rem;
		border-radius: 5px;
		margin: 0 0 1rem 0;
		box-sizing: border-box;
		background-color: #007EA7;
		margin-bottom: 0;
		padding: 0.5rem 1rem;
		margin-bottom: 1rem;
	}

	@media screen and (min-width: 800px) {
		#ActionButtons {
			float: right;
			width: 65%;
			margin-bottom: 0;
			border-bottom-left-radius: 0;
			border-bottom-right-radius: 0;
		}
	}

	@media screen and (max-width: 1100px) {
		#ActionButtons ul {
			margin: 0.5rem 0 0 0;
		}
	}

	#ActionButtons ul {
		margin: 0;
	}

	#ActionButtons li {
		list-style: none;
		margin: 0.5rem 0;
		display: inline-block;
		margin-right: 5px;
	}

	#ActionButtons a {
		color: #FFFFFF;
		padding: 0.25rem 0.5rem;
	}

	#ActionButtons a:hover {
		background-color: #005a77;
		border-radius: 4px;
		padding: 0.25rem 0.5rem;
		text-decoration: none;
	}

	#ActionButtons a.active {
		background-color: #FFFFFF;
		border-radius: 4px;
		color: #007EA7;
	}

	#ActionButtons a.active:hover {
		text-decoration: none;
	}

/* End primary editing links */

/* End defauly person view */

/* Content layout */

/* Ogrganisation edit */

	#TeamList {
		margin-left: 0;
		list-style: none;
	}

/* Discharge update form */

	.CheckboxListContainer {
		clear: left;
	}

	#page-update_discharge .CheckboxList ul,
	#page-user_edit .CheckboxList ul {
		list-style: none;
		margin-left: 1rem;
	}

	@media screen and (min-width: 600px) {
		#page-update_discharge .CheckboxList ul,
		#page-user_edit .CheckboxList ul {
			margin: 0.5rem 0 2rem 0;
		}
	}

	#page-user_edit .CheckboxListContainer .CheckboxListItem {
		clear: left;
	}

	#page-user_edit .CheckboxListContainer .CheckboxListItem label {
		margin-top: 8px;
	}	

	#page-update_discharge .CheckboxList li input,
	#page-user_edit .CheckboxList li input {
		max-width: 20px;
	}

	#page-update_discharge .BooleanLabel input {
		max-width: 20px;
	}

	#page-update_discharge .BooleanLabel {
		margin-top: 40px;
		margin-left: 1rem;
	}

	@media screen and (min-width: 600px) {
		#page-update_discharge .BooleanLabel {
			margin-left: 0;
		}
	}

	.FieldDropDownList.HideField {
		margin-top: 30px;
	}

	.FieldDropDownList.HideField select {
		width: 500px;
	}

	input.OtherField {
		margin-left: 250px;
		min-width: 332px;
	}

/* Discharge form 'ReadOnly' */

	.ReadOnly label {
		margin-top: 0;
	}

	.ReadOnly .FieldHasOther p {
		margin-left: 250px;
	}

	.ReadOnly .FieldHasOther p.FieldDropDownList {
		margin-left: 0;
	}

/* Login and password reset forms */

	#page-login .content,
	#page-password_reset .content,
	#page-login #page_title,
	#page-password_reset #page_title {
		width: 100%;
		max-width: 650px;
		margin: 0 auto;
	}

/* Role edit form */

	#frmRoleEdit {
		width: 100%;
		max-width: 600px;
	}

	#frmRoleEdit .roles-input-container label {
		width: 126px;
	}

	#frmRoleEdit label {
		width: 280px;
		display: inline-block;
	}

	@media screen and (min-width: 600px) {
		#frmRoleEdit label {
			width: 460px;
		}
	}

	#frmRoleEdit .roles-group p,
	#frmRoleEdit .roles-input-container p,
	#frmRoleEdit p.ButtonGroup {
		border: 0;
		padding: 0;
	}

	#frmRoleEdit .roles-input-container {
		margin-bottom: 1.5rem;
	}

	#frmRoleEdit .ButtonGroup {
		margin-left: 0px;
	}

	@media screen and (min-width: 600px) {
		#frmRoleEdit .ButtonGroup {
			margin-left: 180px;
		}
	}

	#frmRoleEdit .roles-group {
		margin-bottom: 0.75rem;
		padding: 0 0 1.25rem 0;
		border-bottom: 1px solid #CCCCCC;
	}

	#frmRoleEdit p {
		margin-bottom: 0.75rem;
		padding: 0 0 1.25rem 0;
		border-bottom: 1px solid #CCCCCC;
	}

	#frmRoleEdit .parent-container p {
		margin-bottom: 0;
		background-color: #fafafa;
	}

	#frmRoleEdit .child-container {
		padding-left: 25px;
	}

	#frmRoleEdit .child-container p {
		margin-bottom: 0;
		background-color: #fafafa;
	}

	#frmRoleEdit .child-container p:first-child {
		margin-top: 10px;
	}

	#frmRoleEdit .child-container label {
		width: 255px;
		font-size: 0.9375rem;
	}

	@media screen and (min-width: 600px) {
		#frmRoleEdit .child-container label {
			width: 435px;
		}
	}

	#frmRoleEdit .grandchild-container {
		padding-left: 50px;
	}

	#frmRoleEdit .grandchild-container p {
		margin-bottom: 0;
		background-color: #fafafa;
	}

	#frmRoleEdit .grandchild-container p:first-child {
		margin-top: 10px;
	}

		#frmRoleEdit .grandchild-container label {
		width: 230px;
		font-size: 0.9375rem;
	}

	@media screen and (min-width: 600px) {
		#frmRoleEdit .grandchild-container label {
			width: 410px;
		}
	}

	.Paginator {
		margin: 2em;
		padding: 0.5em;
	}

	.Paginator label {
		width: auto;
		margin: 0.25rem 1rem 0 0;
	}

	.Paginator ul {
		display: inline;
		list-style: none;
		padding: 0;
		margin: 0;
	}

	.Paginator li {
		display: inline-block;
		margin-right: 10px;
	}

	.Paginator li.CurrentPage {
		background-color: #007EA7;
		padding: 0.25rem 0.5rem;
		border-radius: 0.25rem;
		color: #FFFFFF;
	}

/* search results form */

	.date-from-to input {
		min-width: 20px;
	}

/* Organisation edit */

	#TeamList li {
		padding: 1.5rem;
		width: 100%;
		max-width: 600px;
		border-radius: 0.5rem;
		background-color: #EEEEEE;
		border: solid 1px #DDDDDD;
		margin-bottom: 1rem;
		box-sizing: border-box;
	}

	#TeamList li label {
		width: 226px;
	}

	.DeleteTeam,
	.DeleteNewTeam {
		margin: 0.5rem 0 0 0;
		display: inline-block;
	}

	#page-update_discharge .HideField {
		display: none;
	}

/* Dashboards */

	.dashboard-container {
		margin: 2rem 0;
	}

	.block {
		float: left;
		width: 48%;
		padding: 1rem 1rem 0.5rem 1rem;
		background-color: #005A77;
		box-sizing: border-box;
		margin: 0 2% 1rem 0;
		/*box-shadow: 3px 3px #007EA7;*/
		border: solid 1px #E5E5E5; /* was #333333*/
		border-radius: 5px;
	}

	@media screen and (min-width: 600px) {
		.block {
			width: 31%;
			margin-bottom: 1.5rem;
		}
	}

	@media screen and (min-width: 800px) {
		.block {
			width: 17.95%;
			margin-bottom: 2rem;
		}
	}

	.list {
		width: 97%;
		background-color: #fafafa;
	}

	@media screen and (min-width: 850px) {
		.list {
			width: 47.85%;
		}
	}

	@media screen and (min-width: 850px) {
	.list.first {
		clear: left;
	}}

	.list.small {
		width: 97%;
		background-color: #fafafa;
		margin-bottom: 2rem;
	}

	@media screen and (min-width: 800px) {
		.list.small {
			width: 97.6%;
		}
	}

	@media screen and (min-width: 800px) {
		.table-container {
			width: 100%;
			float: left;
		}
	}

	.block h3 {
		font-size: 0.875rem;
		margin: 0;
		line-height: 1.2;
		color: #000000;
	}

	.block.list h3 {
		font-size: 1rem;
	}

	.large h3 {
		min-height: 30px;
		margin-bottom: 1rem;
	}

	@media screen and (min-width: 700px) {
		.large h3 {
			min-height: 50px;
		}
	}

	@media screen and (min-width: 1100px) {
		.large h3 {
			min-height: 40px;
		}
	}

	.block table {
		margin: 1rem 0;
		min-width: 99%;
		/*box-shadow: 3px 3px #007EA7;*/
		border: solid 1px #333333;
	}

	.block th {
		min-width: auto;
	}

	.block td {
		line-height: 1.2;
		background-color: #FFFFFF;
	}

	.table-left-column {
		text-align: left;
	}

	.block ul {
		list-style: none;
		margin: 1rem 0;
	}

	.block li {
		border-bottom: solid 1px #DDDDDD;
		padding-bottom: 0.375rem;
		font-size: 0.8125rem;
	}

	.block span {
		margin-bottom: 0;
	}

	.block a {
		font-weight: 600;
	}

	.large a,
	.large span {
		font-size: 2rem;
		line-height: 1;
		color: #FFFFFF;
	}

	.large ul {
		margin: 0;
	}

	.large li {
		margin: 0;
		border-bottom: 0;
	}

	.large h3 {
		color: #FFFFFF;
	}

	.red-flag {
		padding-left: 25px;
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fred-flag.png') no-repeat 0 0;
		background-size: 20px 20px;
		min-height: 32px;
		vertical-align: middle;
	}

	@media screen and (min-width: 800px) {
		.red-flag {
			background-size: 32px 32px;
			padding-left: 40px;
		}
	}

	.pathway h3 {
		padding-left: 40px;
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fpathway-arrows-icon-blue.png') no-repeat 0 0;
		background-size: 32px 32px;
		min-height: 32px;
		vertical-align: middle;
		padding-top: 8px;
	}

	.caseload h3 {
		padding-left: 40px;
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fcaseload-icon-blue.png') no-repeat 0 0;
		background-size: 32px 32px;
		min-height: 32px;
		vertical-align: middle;
		padding-top: 8px;
	}

	.edds h3 {
		padding-left: 40px;
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fdischarged-icon-blue.png') no-repeat 0 0;
		background-size: 32px 32px;
		height: 32px;
		vertical-align: middle;
		padding-top: 8px;
	}

	.delays h3 {
		padding-left: 40px;
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fdelayed-icon-blue.png') no-repeat 0 0;
		background-size: 32px 32px;
		height: 32px;
		vertical-align: middle;
		padding-top: 8px;
	}

	.final-assessment h3 {
		padding-left: 40px;
		background: url('https://staging.pathways2care.uk/index.php?Request=image&FileStore=project&Path=%2Fimages%2Fat-destination-icon-blue.png') no-repeat 0 0;
		background-size: 32px 32px;
		height: 32px;
		vertical-align: middle;
		padding-top: 8px;
	}

	.dashboard-name {
		width: 220px;
		display: inline-block;
		vertical-align: top;
		margin-right: 10px;
	}

	.dashboard-location {
		width: 140px;
		display: inline-block;
		vertical-align: top;
		margin-right: 10px;
	}

	.dashboard-pathway {
		width: 30px;
		display: inline-block;
		vertical-align: top;
	}

	.dashboard-date {
		width: 100px;
		display: inline-block;
		vertical-align: top;
	}

	.dashboard-status {
		width: 24px;
		display: inline-block;
		vertical-align: top;
	}

	.dashboard-status img {
		width: 20px;
	}

	.dashboard-container p {
		font-size: 0.875rem;
	}

	.dashboard-container .LargeButton {
		margin-left: 20px;
		font-size: 0.875rem;
		display: inline-block;
		margin-top: 1rem;
	}

	.no-results {
		margin-top: 1rem;
	}

/* End dashboard */

/* Sys Admin */

	.SystemList {
		float: left;
		width: 100%;
		padding: 1rem 1rem 0.5rem 1rem;
		background-color: #FAFAFA;
		box-sizing: border-box;
		margin: 0 0 1rem 0;
		border: solid 1px #E5E5E5; /* was #333333*/
		border-radius: 5px;
	}

	@media screen and (min-width: 400px) {
		.SystemList {
			margin: 0 2% 1rem 0;
			width: 48%;
			margin-bottom: 1.5rem;
		}
	}

	@media screen and (min-width: 700px) {
		.SystemList {
			width: 31%;
			margin-bottom: 1.75rem;
		}
	}

	@media screen and (min-width: 1000px) {
		.SystemList {
			width: 17.95%;
			margin-bottom: 2rem;
		}
	}

	@media screen and (min-width: 700px) {
		.SystemList:nth-of-type(4n) {
			clear: left;
		}
	}

	@media screen and (min-width: 1000px) {
		.SystemList:nth-of-type(4n) {
			clear: none;
		}
	}

	@media screen and (min-width: 1000px) {
		.SystemList:nth-of-type(5n+1) {
			clear: left;
		}
	}	

	.SystemList h3 {
		margin-top: 0;
		color: #000000;
		font-size: 1rem;
	}

	.SystemList ul {
		margin: 0;
	}	

	.SystemList li {
		list-style: none;
		font-size: 0.9375rem;
	}

/* End sys admin */

/* End #4 */

/* 5) Reporting */

	#ReportPresets select {
		max-width: none;
		padding-right: 40px;
	}

	/* Removes overlap of inputs and report output and adds extra space above output */
	.ReportViewPage {
		clear: both;
		margin-top: 40px;
	}

	/* Removes margin applied above due to duplicated class use */
	.ButtonGroup.ReportViewPage,
	.CurrentSelectedFilters.ReportViewPage {
		margin-top: 0;
	}

	/* Tweaks to the position of the report switcher */
	.ReportViewPage #SelectGraphOutput {
		display: inline-block;
	}

	.ReportViewPage #SelectGraphOutputType {
		margin: 0.5rem 0 1rem 0 !important;
		top: 0 !important;
		right: 0 !important;
	}

	.ReportViewPage #SelectGraphOutput {
		margin: 0.5rem 0 1rem 0 !important;
	}

	#page-report_builder .ReportingBlock.DisplayAs .InputLabel {
		width: 200px !important;
	}


	/* TODO stops the table breaking off the page
	#TablePlaceholder,
	#SubPlaceholder {
		overflow-y: auto;
	}

	#TablePlaceholder table,
	#SubPlaceholder table {
		margin-top: 70px;
	}

	#TablePlaceholder form button,
	#SubPlaceholder form button {
		position: absolute;
		left: calc((100% - 1200px) / 2);
		margin-top: 20px;
	} */

/* End #5 */

/* 6) Third party overrides */

/* jQuery UI date picker modal */

	.ui-datepicker select.ui-datepicker-month,
	.ui-datepicker select.ui-datepicker-year {
		min-width: 200px;
	}

	.ui-datepicker th {
		background-color: #FFFFFF;
	}

	.ui-datepicker table th {
		min-width: 30px;
		color: #007EA7;
	}

	.ui-datepicker td {
		padding: 0;
	}

	.ui-widget-header {
		background-color: #FFFFFF !important;
		background-image: none !important;
		border: 0 !important;
	}

	.ui-datepicker {
		width: 22rem;
	}

	.ui-state-default {
		background-image: none !important;
		background-color: #EFEFEF !important;
	}

	.ui-widget-content .ui-state-active {
		background-color: #007EA7 !important;
		background-image: none !important;
		color: #FFFFFF !important;
	}

/* ChosenJS */

	.chosen-container .chosen-container-multi {
		width: 100% !important;
		max-width: 350px;
	}

	.chosen-container-multi .chosen-choices {
		border: solid 1px #999999;
		border-radius: 0.25rem;
		font-size: 1rem;
		background-color: #FFFFFF;
		background-image: none;
		padding: 0.375rem 0.5rem;
		font-family: 'Open Sans', sans-serif;
		width: 100% !important;
		max-width: 350px;
		box-sizing: border-box;
	}	

/* End #6 */

/* 7) Other */

/* Styling tester */

	blockquote {
		border-left: solid 5px #007EA7;
		background-color: #f4f8f9;
		margin: 1rem 1rem 1rem 0;
		padding: 1rem 1.5rem;
	}

/* End styling tester */

/* End #7 */

/* END */