/* Styles for cross browsers consistency */
div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
}
/* ------------------------- */

html {
	font-family: Arial, Helvetica, sans-serif;
	font-size:  76%;
	height: 100%;
	overflow-y: scroll;
}
body {
	color: #000;
	/* background-color: #D1E6EB; */
	background-color: #ffff99;
	margin: 0 auto;
	Height: 100%;
	z-index: -1;
}
::-webkit-scrollbar {
  -webkit-appearance: none;
  height: 10px;
  width: 10px;
}

::-webkit-scrollbar-thumb {
  border-radius: 4px;
  /* background-color: rgba(0, 0, 0, .5);	 */
  background-color: #bbbbbb;
  /* background-color: #3e698c; */
  box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

body.test{background-color: #ffbfbf ;}
.pageHolder{
	min-height: 96vh;
	width: 96%;
	min-width: 1000px;
	max-width: 1400px;
	background-color: transparent;
	margin: 0 auto; 
	border: 0px ;
	z-index: -1;
}	

.pageMain {
	position: relative;

	overflow-y: hidden;
	width: 96%;
	min-width: 998px;
	max-width: 1400px;
	top:26px;
	margin: 0 auto; 
	background-color: #FFFFFF;
	border: 2px solid #315971;
	border-top: 0;
	min-height: 94vh;
	padding: 20px 15px 0 15px;
}
.user{float:right;}
.quickMenu{
	position: fixed;
	margin-left: 340px;
	}
	
.documentLink{
	display:table-cell;
	vertical-align: middle;	
}
.ui-autocomplete {
	max-height: 200px;
	overflow-y: scroll; 
	overflow-x: hidden;
	font-size: 1.1em;
}

.quoteCreatProjectButton{
	margin: 0 0 0 30px;
}	
div #copy{
	display: none;
	color: #D90000; 
	font-weight: bold;
	font-size: 120%;
}

.hiddenCell{
	display:none;
}
	

	
tbody tr:first-child .up, tbody tr:last-child .down{visibility:hidden;} /*Hides first UP button & last DOWN button*/
.hidden {display:none;} /*Hides 'hidden' elements from formatting*/

.submit{margin: 0 10px 30px 20px;	}
.submitComponentHolder{margin: 0 0 0 30px;}
.submitComponentHolder div{display: inline-block;}
.addRow{
	margin: 0 10px 0 30px;
	max-width: 150px;
	border-radius:0;
	}
/* Styles for links. */
a, a:link {	color: #2D4262; }
a:visited {	color: #000;}
a:hover {	color: #5275AA;}
a:focus {	color: #000;}
a:active {	color: #000;}
td a:focus {	
	background-color: #FFBFBF ;
	border-radius:6px;}
h1 {
	margin-top: 0em;
	margin-right: 1em;
	margin-bottom: 0em;/*both set to zero and padding in header div is used instead to deal with compound ie pc problems that are beyound summary in a simple comment.*/
	font: normal 2em Calibri, Arial, Helvetica, sans-serif;
}
/* STYLING FOR SERVICE SALES INVOICE */

input, textarea, select{
	background-color:#D1E6EB;
	border-radius:6px;
	border:1px solid #22274c;
	display:inline-block;
	padding:1px 5px;
	text-decoration:none;
	max-width: 200px;
	}
	
select option.grey{
	color: #666666;
	background-color:#cccccc;
}	
select option.dark{
	color: #ffffff;
	background-color:#222222;
}		
select option.amber{
	color: #402000;
	background-color:#ffb973;
}		
select option.red{
	color: #660000;
	background-color:#ffbfbf;
}	
/* select option.red{ */
	/* color: #660000; */
	/* background-color:#ffbfbf; */
	/* mix-blend-mode: difference; */
/* } */

td img{margin: 4px 0;}
.newRow, .copyRow{/* Hides background input for 'insertRow button to make tabbable	*/
	background-image: url('../images/icons/+.png');
	background-color:transparent;
	margin: 4px 0;
	width: 14px;
	height: 14px;
	border: 0;
	padding: 0;
	}
	
textarea{
	overflow-y: hidden;
	resize: none;
	height: auto;  
	font-family: Arial, Helvetica, sans-serif;
	font-size:  110%;
	margin: 0;
	padding:1px 5px 0px 5px;
}
input:focus,textarea:focus,select:focus,.button:focus {
	box-shadow: 0 0 2px 2px #FF4C4C;
	border-radius:6px;
}

input{
	padding:2px 5px;
}
table {
	width: auto;
	table-layout: auto;
	border-spacing: 0;
	border-collapse:collapse;
	font-size: 100%;
}
/*
td{
	vertical-align: top;
}
*/
	
div.window{
	width: 420px;
	display:inline-block;
	vertical-align:top;
	margin: 0 0 0 20px;
}
iframe {
	width: 400px;
	height: 205px;
	border: 0px solid #22274c;
    overflow-x: hidden;
    overflow-y: auto;
} 

.accountHistory{float:right; margin: 10px 20px 0 0;}

form .Main div, form .Totals div{
	margin: 0 0 15px 0;
}
form .Main, form .RecData, form .Branch {
	display:inline-block;
	max-width: 300px;
	margin: 0 0 0 20px;
	}
form .Main input, form .Main select, form .Main textarea, form .RecData input, form .RecData select , form .Branch input, form .Branch select, .formattedDate:not(th){
	float:right;
	max-width: 150px;
	margin: 0 0 0 0px;
	}
form .Totals {
	min-width: 180px;
	display:inline-block;
	vertical-align:top;
	margin: 0 0 0 40px;
	}
form .Totals input {
	float:right;
	max-width: 80px;
	text-align: right;
	margin: 0 0 0 5px;
	}
	
.mainTable{border-collapse: collapse; border: 0;}
.mainTable thead{display: none;}


[class^="Default"],[class^="Default"] tr td:nth-last-child(-n+2){display:none;}

.Detail,.Default {
	margin: 30px 0 0 0;
	overflow-x : auto;
}
.Detail td,.Default td{vertical-align: top;}
/*--
.Detail td input,.Detail td select,.Detail td textarea,.Default td input,.Default td select,.Default td textarea{
	max-width: 150px;
	-moz-border-radius:0;
	-webkit-border-radius:0;
	border-radius:0;
	}
	--*/

div[class^="Detail"] td input,div[class^="Detail"] td select,div[class^="Detail"] td textarea,div[class^="Default"] td input,div[class^="Default"] td select,div[class^="Default"] td textarea{
	max-width: none;
	/*--max-width: 150px;--*/
	-moz-border-radius:0;
	-webkit-border-radius:0;
	border-radius:0;
	}

.Detail td select,.Default td select{max-width: 250px;}
.Detail tbody .formattedDate,.Default tbody .formattedDate{
	float:right;
	}
.Detail .formattedDateholder{width:120px;}
.Detail .formattedDateholder .ui-datepicker-trigger{padding: 0px;}
.Detail tbody .hasDatepicker{
	float:left;
	}

.productID{width: 100px;}
.taxRateID{width: 80px;}
.addRowholder, .addRows {display:inline; margin: 0 5px 0 0;}

input [type="hidden"], .hiddenholder {display: none;}	


.buttonholder {	
	float:right;
	width: 95px;
}
.textareaholder{
	clear:both;
}

.submit,.button,.up,.down,.newRow,.copyRow,.deleteRow,.addRows,.addRows,.buttonClear,.net{ cursor: pointer; cursor: hand; }
.submit,input.button,.addRowsinput,.reset,.complete,.button:not(th){
	box-shadow:inset 2px 2px 0px 0px #6696bd;
	background-color:#315971;
	border-radius:6px;
	border:1px solid #000000;
	display:inline-block;
	color:#ffffff;
	padding:2px 10px;
	text-decoration:none;
	text-shadow:1px 1px 0px #000000;
}
.button a{
	color:#ffffff;
	text-decoration:none;
	text-shadow:1px 1px 0px #000000;
}
.submit:hover,input.button:hover,.addRows:hover, .clear,.reset,.complete:hover, .button:not(th):hover{
	box-shadow:inset 2px 2px 0px 0px #8A8A8A;
	background-color:#3f3f3f;
}
.button:disabled,.submit:disabled{
	box-shadow:inset 2px 2px 0px 0px #8A8A8A;
	background-color:#3f3f3f;
	padding:2px 10px;
	color:#888888;
	cursor: auto; cursor: auto;
}
input.button:not(th):active {
	position:relative;
	top:1px;
	right:-1px;
}

th input.button, th input.buttonClear{height: 25px; width: 80px;vertical-align:center;text-align: center;padding: 1px 5px; }
input[class*='formattedDate'],input[class*='sqlDate']{width: 80px;}
.ui-datepicker-trigger {
	float:right;
	display: inline;
	background-color: transparent;
	border:0px solid #315971;
	height: 24px;
	margin:0;
	text-decoration:none;
	font-size:0px; 
	vertical-align:bottom;
	padding: 0 5px;
}
 #tooltip{
  position:absolute;
  border:1px solid #333;
  background:#f7f5d1;
  padding:2px 5px;
  color:#333;
  display:none;
  } 
.alert {
	width: 150px;
	  position:absolute;
	text-align: center;
	color: #B30000;
	border:1px solid #B30000;
	background-color: #fff;
	font-weight:bold;
	text-decoration:none;
	display: none;
	padding: 3px 5px;
	-webkit-box-shadow: inset 0px 0px 1px 1px #B30000;
	-moz-box-shadow: inset 0px 0px 1px 1px #B30000;
	box-shadow: inset 0px 0px 1px 1px #B30000;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	z-index: 99;
	font-size:12px; 
}

.recMessage,.VATReturnMessage{
	font-size:  130%;	
	color: #8c0000;
	background-color: #FF7373;
	border:2px solid #8c0000;
	padding: 5px10px;
	border-radius: 20px;
}

.alertTypeAmber{
	font-size:  130%;	
	color: #402000;
	background-color: #ffcc99;
	border:2px solid #b35900;
	padding: 5px 10px;
	border-radius: 20px;
}

.inputAlert{
	color: #660000;
    background-color: #ffbfbf;
	border: 1px solid #660000;
	
}

.numerical:not(th){text-align:right;}
.textCentre:not(th){text-align:center;}

.label{width: 160px; padding: 2px 20px;}
.value{width: 80px; padding: 2px 0px;margin: 0 20px;text-align: right;font-weight:bold;}
input[id^='value'],#openingBalance0,#closingBalance0,#discrepancy0,#clearedOpeningBalance0,#statementBalance0{
	width: 80px;
	text-align: right;
	}
	
.viewInvoice{ text-align: center; width: 70px;}
/* ---------- Two Column CSS ---------- */

.csscolumns {
	overflow:hidden;
	width: 100%;
}

.productPickerWindow{width:97%;padding:20px 0;  position:absolute; top:150px; height:500px; background-color:#fff; overflow: auto; display:none;}

.productPickerFrame{width:100%; height:500px;}

.Detail td .wide {
	max-width: 300px;
}

.metaDataPlaceHolder{
	width: 400px;
}
.metaDataholder{
	display: inline-block;
}
.metaData{
	background-color: #ffffff;
	border:0px solid #000000;
	padding: 0 0 0 5px;
	
}
.closeMetaData{
	float:right;
	text-decoration: underline;
	cursor: pointer; 
	cursor: hand;
}
.changeTransactionTypeHolder,
.createScheduleOptionHolder{
	display:none;
	width: 240px;
    height: 120px;
    background-color: #ffffff;
	border: 2px solid #1b313d;
    position: absolute;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
	padding: 10px;
    margin: auto;
	text-align: centre;

}

.submitRadioButtons, .submitButtonHolder{
	margin:0 0 20px 20px;
}

.submitRadioButtons input{
	margin:0 20px 0 5px;
}
.submitButtonHolder div{
	display:inline-block;
	width:70px;
	float:none;
	margin: 0 10px 0 0;
}
.submitButtonHolder .button{
	
}
/**/

/* This is CSS for File drop box  */
#dragandrophandler{
	display: table-cell;
	position: relative;
	border:2px dotted #0B85A1;
	width:180px;
	height:80px;
	color:#92AAB0;
	padding:10px 10px 10 10px;
	margin:30px 0px;
	font-size:200%;
	text-align: center;
	vertical-align: middle;
}
.progressBar {
    width: 100px;
    height: 16px;
    border: 1px solid #ddd;
    border-radius: 5px; 
    overflow: hidden;
    display:inline-block;
    margin:0px 10px 5px 5px;
    vertical-align:top;
}
 
.progressBar div {
    height: 100%;
    color: #fff;
    text-align: right;
    line-height: 16px; /* same as #progressBar height if we want text middle aligned */
    width: 0;
    background-color: #0ba1b5; border-radius: 3px; 
}
.statusbar
{
    border-top:1px solid #A9CCD1;
    min-height:20px;
    /*width:700px;*/
    width:180px;
    padding:10px 10px 0px 10px;
    vertical-align:top;
	margin:5px 0 !important;
}
.statusbar:nth-child(odd){
    background:#EBEFF0;
}
.filename{
	display:inline-block;
	vertical-align:top;
	cursor:pointer;
}
.filesize{
	display:inline-block;
	vertical-align:top;
	color:#30693D;
	width:60px;
	margin-left:10px;
	margin-right:5px;
	text-align: right;
}
.abort{
    background-color:#A8352F;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;display:inline-block;
    color:#fff;
    font-family:arial;font-size:13px;font-weight:normal;
    padding:4px 15px;
    cursor:pointer;
    vertical-align:top
    }
.uploadSuccess{	
	border:2px dotted #006633 !important;
	color:#006633 !important;
	background-color:#dfffbf;
}
.uploadFail{
	border:2px dotted #8c0000 !important;
	color:#8c0000 !important;
	background-color:#ffbfbf;
}
small { font-size: 50%;}
#deleteUploadedFile{
	display:inline-block;
	/* margin-left:20px; */
	margin-right:5px;
	cursor:pointer;
}

/* end drop box CSS */


tbody td .pdfAddToBatch::before{
	content: "";
	background-image: url("https://www.everydaysoftware.co.uk/images/icons/addtoBatch.png");
	background-size: 100% 100%;
     display: inline-block;
    width: 15px;
    height: 17px;
    margin: 0;
    cursor:pointer;
}

.amberTL{
	background-color: #ffb973;
}
.blueTL{
	background-color: #73b9ff;
}
.redTL{
	background-color: #ff9999;
}