/* Layout styles */

body {
	font-family: Arial, Helvetica, sans-serif;
	margin: 0;
	border: 0;
	font-size: 70%;
}

textarea:focus, input:focus {
	border: 1px solid #FF0000;	
	background-color: #FFFFBA;
}

a:link {
	color: #659702;
}

a:hover {
	text-decoration: none;
}

a:visited {
	color: #995200;
}

.spacer {
	clear: both;
}
/* Overall container */

#container {
	margin: 5px;
	border: 1px solid gray;
}

/* Page header and menu bar */

#header {
	 height: 55px;
	 background-image: url(../images/admin/bg-header.jpg);
	 background-repeat: repeat-x;
}

#header img {
	display: block;
}

#navbar {

}

#user_info {
	position: absolute;
	top: 12px;
	right: 12px;
	text-align: right;
	width: 150px;
	font: 10px arial;
}

#user_info a {
	color: #000;
}
/* Footer */

#footer {
	text-align: right;
	color: gray;
	background-color: #E4E4E4;
	border-top: 1px solid gray;
}

#footer a {
	color: gray;
}

/* Content container */

#content {
	padding: 0.5em;
	border-top: 1px solid gray;
}


/* Header styles */

h1 {
	font-size: 120%;
	margin: 0;
	color: #000;
}

h2 {
	font-size: 110%;
	margin-top: 0;
	color: #659702;
}


/* Table for the alphabet on the customers_edit page */

.letters_table a {
	display: block;
	width: 15px;
	height: 15px;
	border: 1px solid gray;
	padding: 3px;
	text-decoration: none;
}

.letters_table a:hover {
	background-color: #DDD;
}

/* Table for the enquiry items list */

.item_table th {
	background-color: #E4E4E4;
}

/* Form styles */

.validation-error {
	background: linear-gradient(-45deg, rgba(255,255,255,0.8), rgba(255,255,255,0.85)) #C23A2C;
	background: repeating-linear-gradient(-45deg, rgba(255,255,255,0.9) 0, rgba(255,255,255,0.9) 1.8em, rgba(255,255,255,0.92) 1.8em, rgba(255,255,255,0.92) 3.6em) #C23A2C;
	border: 1px solid;
	border-radius: 0.225em;
	color: #C23A2C;
	display: block;
	font-size: 14px;
	line-height: 1.8;
	margin: 0.9em 0;
	padding: 0.9em 1.8em;
}

.validation-error--successtho {
	background-color: #27ae61;
	color: #27ae61;
}

#content input, #content select, #content textarea {
	border: 1px solid #7F9DB9;
	font-size: 12px;
}

#content textarea {
	width: 100%;
}

#content .checkbox {
	border: none;
}

#content .dataform legend {
	color: #688C1C;
	font-weight: bold;
	font-size: 105%;
	padding-bottom: 0.5em;
}

#content .dataform fieldset {
	padding: 0.5em;
	margin: 2px;
	border: 1px solid gray;
	background-color: #EAEAE8;
}

#content .fullwidth {
	width: 100%;
}

#content .dataform .buttoncontainer {
	padding: 0.5em;
	margin: 0.25em;
	border: 1px solid gray;
	background-color: #CBE8AA;
	text-align:right;
}

#content .dataform .buttoncontainer input, #content .dataform .buttoncontainer select {
	font-size: 14px;
}

.readonlyMessage{
	text-align: right;
	color: #FF0000; 
	font-size: 105%;
	padding-right: 4px; 
	font-weight: bold;
	/*background-color: #E8E8E8;
	border: 1px solid red;*/
}

/* Text styles */

.text_red {
	color: #C90339;
}

.text_gray {
	color: gray;
}

.capitalise {
	text-transform: capitalize;
}

.text_green {
	color: #659702;
}

.strikethrough {
	text-decoration: line-through;
	color: gray;
}

/* Edit gallery menu */

.gallery_menu ul {
	margin: 0 0 0 0.5em;
	padding: 0;
}

.gallery_images {
	border-left: 1px solid gray;
}

.gallery_image_border {
	border: 1px solid silver;
}

.homepagephoto {
	background-color: #D4E3B5;
}

/* Tab navigation */

#content ul.tabnav {
	border-bottom: 1px solid #ccc;
	margin: 0;
	padding-bottom: 19px;
	padding-left: 10px;
}

#content ul.tabnav li {
	display: inline;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#content ul.tabnav li a {
	background: #E8EBF0;
	border: 1px solid #ccc;
	color: #666;
	float: left;
	font-weight: normal;
	line-height: 14px;
	margin-right: 8px;
	padding: 2px 10px 2px 10px;
	text-decoration: none;
}

#content ul.tabnav li a.currenttab {
	background: #fff;
	border-bottom: 1px solid #fff;
	color: #000;
}

#content ul.tabnav_disabled {
	border-bottom: 1px solid #ccc;
	margin: 0;
	padding-bottom: 2px;
	padding-left: 10px;
}

#content ul.tabnav_disabled li {
	display: inline;
	list-style-type: none;
	margin: 0;
	padding: 0;
	line-height: 14px;
	margin-right: 8px;
	padding: 2px 10px 2px 10px;
	background: #E4E4E4;
	border: 1px solid #ccc;
	color: silver;
}

#content ul.tabnav_disabled li.currenttab {
	background: #fff;
	border-bottom: 1px solid #fff;
	color: silver;
}

/* Ajax results */

#AjaxResults {
	float: right;
	text-align: right;
	width: 200px;
	height: 25px;
	overflow: hidden;
	transition: height 0.1s linear;
}

#AjaxResults:empty {
	height: 0;
}

#AjaxStatus {
	float: right;
	text-align: right;
	width: 300px;
	height: 25px;
}

.ajaxMessage{
	text-align: right;
	color: #FF0000; 
	font-weight: bold;
}

/* img decoration */
.imgFrameReadonly  {
/* placeholder for now */
	border: solid 2px #fff;
}

.imgFrame  {
/* placeholder for now */
	border: solid 2px #fff;
}

.imgFrame:hover  {
	border: solid 2px #eece44;
}
/*************************************** Details iframe */

#details_frame {
	width: 100%;
	height: 600px;
	max-height: calc(100dvh - 50px);
}

/**************************************** Tab on edit pages */

.edit_tabs
{
	margin: 0;
	padding: 4px;
	background: #D1D2CE;
	font-family: "MS Sans Serif", Arial, Helvetica, Tahoma, sans-serif;
	position: relative;
	height: 18px;
}

.edit_tabs ul
{
	list-style: none;
	margin: 0;
	padding: 0;
	border: none;
	width: 100%;
}

.edit_tabs li
{
	display: block;
	margin: 0;
	padding: 0;
	float: left;
	width: auto;
	margin-left: 2px;
	margin-right: 2px;
}

.edit_tabs a
{
	color: #444;
	display: block;
	width: auto;
	text-decoration: none;
	background: #D1D2CE;
	margin: 0;
	padding: 2px 6px;
	border-left: 1px solid #D1D2CE;
	border-top: 1px solid #D1D2CE;
	border-right: 1px solid #D1D2CE;
	border-bottom: 1px solid #D1D2CE;
	font-size: 11px;
}

.edit_tabs a:hover { 
	background: #e0e0d4; 
	border-right: 1px solid #808080;
	border-bottom: 1px solid #808080;
	border-left: 1px solid #fff;
	border-top: 1px solid #fff;
}

.edit_tabs a:active, .edit_tabs a.edit_tabs_current { 
	background: #e0e0d4; 
	border-left: 1px solid #808080;
	border-top: 1px solid #808080;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
}

.edit_tabs a#edit_tabs_canx {
	position: absolute;
	right: 0;
	top: 2px;
}

/******************************************** Table within dataform */

.datatable {
	border-collapse: collapse;
}

.datatable thead {
	border: 1px solid silver;
}

.datatable .borderBox{
	border: 1px solid silver;
}

.datatable th {
	background-color: #E6E0BE;
	text-align: left;
	padding: 4px;
	color: #000;
}

.datatable td {
	border-bottom: 1px solid silver;
	padding: 4px;
}

.datatable td td {
	padding: 0;
	border-bottom: none;
}

.datatable tfoot {
	border: 1px solid gray;
	font-weight: bold;
}

/******************************************** Table within report */

.datareport {
	border-collapse: collapse;
	border: 1px solid silver;
}

.datareport .numeric{
	text-align: right;
}

.datareport thead {
	border: 1px solid grey;
	font-weight: bold;
	background-color: #C4E281;
	text-align: left;
	padding: 4px;
}

.datareport tfoot {
	font-weight: bold;
	color:#FF0000;
	padding-top: 4px;
	padding-bottom: 4px;
}

.datareport .positivenumber {
	color:#0000FF;
	text-align: right;
	padding: 4px;
}

.datareport .negativenumber {
	color:#FF0000;
	text-align: right;
	padding: 4px;
}

.datareport th {
	padding: 4px;
}

.datareport td {
	border-bottom: 1px solid #CCCCBB;
	background-color: #fff;
	padding: 3px;
	padding-left: 4px;
}

.datareport td td {
	padding: 0;
	border-bottom: none;
}

.hl {color:#f00;background-color:#ff0;font-weight:bold;}


/* 
	Tabs
*/

#content ul.subsection_tabs {
	list-style:none;
	margin:0 0 5px 0;
	padding:0;
	clear:both;
	border-bottom:1px solid #ccc;
	height:20px;
	clear:both
}
#content ul.subsection_tabs li.tab {
	float:left;
	margin-right:7px;
	text-align:center
}
#content ul.subsection_tabs li.tab a {
	display:block;
	height:20px;
	padding:0 6px 0 6px;
	background-color:#fff;
	color:#666;
	width:120px
}
#content ul.subsection_tabs li.tab a:hover {
	color:#666
}
#content ul.subsection_tabs li.tab a.active {
	background-color:#ddd
}
#content ul.subsection_tabs li.source_code {
	float:right
}

#content .subsection_tabs {
	font-family:Verdana;
	color:#333;
	font-size:11px;
	font-weight:bold
}
#content li.subsection_tabs {
	font-family:Verdana;
	color:#333;
	font-size:11px;
	line-height:18px
}

#progress_bar {  
     width:102px;  
     height:7px;  
     border:1px solid #ccc;  
     padding:0;  
     margin:0;  
     position:relative;  
     background-image:url("/js/progress_bar.gif");  
     background-repeat:repeat-x;  
 } 
  
 #progress_bar div {  
     background-color:#fff;  
 } 

abbr, acronym, .help {
  border-bottom: 1px dotted #333;
  cursor: help;
  }



/* Table for the ASP data grid */
/*
.datagrid {
 	border: none;
	width: 95%;
}

.datagrid td {
	border: 1px solid gray;
	padding: 0.2em;
}

.datagrid th {
	border: 1px solid gray;
	background-color: #C4E281;
	text-align: left;
	padding: 0.2em;
}

.datagrid input, .datagrid select {
	font-size: 10px;
	margin: 2px;
}

.datagrid ul {
	margin: 0 20px;
}
*/
/* Table for the ASP data grid */

.datagrid {
 	border: none;
}

.datagrid td {
	border: 1px solid gray;
	padding: 0.2em;
	padding: 4px;
}

#idAreaoEdit1 td { border: none !important; padding: 0; }
#idAreaoEdit2 td { border: none !important; padding: 0; }

.datagrid th {
	border: 1px solid gray;
	background-color: #C4E281;
	text-align: center;
	padding: 4px;
	width: 10%;
}

.datagrid input, .datagrid select {
	font-size: 10px;
	margin: 2px;
}

.datagrid ul {
	margin: 0 20px;
}
/* Table for the ASP data grid (but butter) */

.datagrid-better {
 	border: none;
}

.datagrid-better td {
	border: 1px solid gray;
	padding: 0.2em;
	padding: 4px;
}

.datagrid-better th {
	border: 1px solid gray;
	background-color: #C4E281;
	text-align: center;
	padding: 4px;
}

.datagrid-better input, .datagrid-better select {
	font-size: 10px;
	margin: 2px;
}

.datagrid-better ul {
	margin: 0 20px;
}

/* Dialog */

.dialog {
	background: #efefef;
	border: 1px solid #999;
	border-radius: 0.25em;
	box-shadow: 0 0.45em 0.9em #0003;
	font-size: 16px;
	line-height: 1.8;
	margin: 0 auto;
	padding: 1.8em;
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
}

.dialog::backdrop {
	background: #0004;
}

.dialog__title {
	border-bottom: 1px solid #ccc;
	font-size: 1.25em;
	font-weight: 700;
	line-height: 1.8;
	margin: 0 0 0.45em 0;
	padding: 0 0 0.45em 0;
}

.dialog__body {
	max-height: 50dvh;
	max-width: 40em;
	padding-right: 1.8em;
	overflow: auto;
}

.dialog__buttons {
	border-top: 1px solid #ccc;
	margin: 0.45em -0.45em 0 -0.45em;
	padding: 0.45em 0 0 0;
}

.dialog__button {
	background: #CCC;
	background: linear-gradient(#efefef, #dedede);
	border: 1px solid #0002;
	border-radius: 0.25em;
	cursor: pointer;
	line-height: 1.8;
	margin: 0.45em;
	padding: 0.225em 1.35em;
}

.dialog__button:hover {
	background: #efefef;
}

.dialog__button:active {
	background: #dedede;
}

/* mc */

.mc__pill, .manage_link {
	background: #000;
	border-radius: 9.5px;
	color: #fff;
	cursor: default;
	display: inline-block;
	font-size: 10px;
	line-height: 1;
	margin: 2px;
	padding: 4px 7px;
	vertical-align: bottom;
}

.manage_link {
	background: none;
	color: #036;
}

.manage_link:hover {
	background: none;
	color: #900;
}

@import url('tooltip.css');
