* {
	margin: 0;
}

html, body {
	height: calc(100% - 20px);
	font-family: Arial,Verdana;
	letter-spacing: 1px;
	font-size: 18px;
	line-height: 1.5;
	margin: 10px;
}

body{
	padding-left: 2px;
	padding-right: 2px;
}

.logo {
	height: 90px;
}

select {
	font-size: inherit;
	font-family: inherit;
	letter-spacing: inherit;
	padding: 10px;
	border-radius: 5px;
}

td {
	padding: 5px 10px;
}

.rightalign{
	text-align:right;
}

.tablehead{
	color: #333745;
	font-size: 16px;
	font-weight:bold;
	border-bottom: solid 1px #333745;
	margin-bottom: 4px;
	margin-top: 4px;
}

.wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0px auto -21px;
}

.footer .push{
	height: 20px;
}

.footer{
	text-indent: 5px;
	width: 100%;
	text-indent: 5px;
	margin-left: -22px;
	padding: 10px;
	width: calc(100% + 24px);
	background-color: #333745;
	color: white;
	font-size: 0.8rem;
}

A{
	color : #333745;
}

.footer A{
	text-decoration: underline;
	color: white;
}

h1{
	color: #333745;
	font-size: 2rem;
	line-height: 2;
	/*border-bottom: solid 1px #333745;*/
	margin-bottom: 4px;
	margin-top: 4px;
}

th{
	border: solid 0px white;
}

h2{
	color: #333745;
	font-size: 22px;
	border-bottom: solid 1px #333745;
	margin-bottom: 4px;
	margin-top: 4px;
}

.infofield{
	min-height:80px;
	background-repeat:no-repeat;
	BACKGROUND-IMAGE: url(../images/icons/010.png); 
	color:black;
	background-color:white;
	border:dashed 2px black;
	padding-left:70px;
	padding-top:5px;
	padding-right:5px;
	padding-bottom:5px;
	margin:4px;
}

.alertfield{
	min-height:80px;
	background-repeat:no-repeat;
	BACKGROUND-IMAGE: url(../images/icons/224.png); 
	color:black;
	background-color:white;
	border:dashed 2px red;
	padding-left:70px;
	padding-top:5px;
	padding-right:5px;
	padding-bottom:5px;
	margin:4px;
}

.gridheader{
	background-color:Black;
	text-align:left;
	color:White;
	padding:4px;
}

.periodselector{
	margin:4px;
	padding:3px;
	border: solid 1px  #4C4C4C;
	font-weight:bold;
	text-decoration:none;
}

.periodselectorselected{
	background-color:#333745;
	color:White;
	margin:4px;
	padding:3px;
	border: solid 1px  #4C4C4C;
	font-weight:bold;
	text-decoration:none;
}

.btnGeneric, .btnCopyAddress, .btnCheckIdeal, .btnLogin, .btnMail, .btnOrder, .btnCompany, .btnContact,.btnCancel, .btnSave, .btnDelete, .btnNew, .btnSearch, .btnUpdate, .btnOpenArticle, .btnUpload, .btnImport, .btnExportCsv{
	font-size: 1.2rem;
	padding: 10px 20px;
	color: #fff;
	background-color: #59BEE3;
	border: solid 1px transparent;
	border-radius: 10px;
	/* height: 20px; */
	/* min-height: 20px; */
	margin-top: 0px;
	margin-right: 2px;
	margin-left: 0px;
	background-repeat: no-repeat;
	/* background-position: left top; */
	text-decoration: none;
	margin-bottom: 10px;
	width: auto;
}

.btnMail{
	 /*background-image: url(../images/icons/small_006.png);*/
	  float: left;
	  width: auto;
}

.btnGeneric{
	  float: left;
	  width: auto;
}

.btnGeneric:hover, .btnCopyAddress:hover, .btnCheckIdeal:hover, .btnLogin:hover, .btnMail:hover, .btnOrder:hover, .btnCompany:hover, .btnContact:hover,.btnCancel:hover, .btnSave:hover, .btnDelete:hover, .btnNew:hover, .btnSearch:hover, .btnUpdate:hover, .btnOpenArticle:hover, .btnUpload:hover, .btnImport:hover, .btnExportCsv:hover{
	background-color: #fff;
	color: #59BEE3;
	border-color: #59BEE3;
}

.btnLogin{
	width: auto;
	vertical-align: bottom;
	background-position: left bottom;
}

.btnSave{
/*	  background-image: url(../images/icons/small_142.png);*/
	  float: left;
	  width: auto;
}

/*---Tab menu */
.tabselected{
	position:relative;
	z-index:5;
	padding-right:6px;
	padding-left:6px;
	padding-top:6px;
	padding-bottom:2px;
	border-bottom:solid 1px  white;
	height:28px;
	min-height:28px;
	margin-top:0px;
	margin-bottom:0px;
	margin-right:2px;	
	margin-left:2px;	
	text-decoration: none;		
	top:1px;
}

.tabdeselected{
	position:relative;
	z-index:5;
	padding-right:6px;
	padding-left:6px;
	padding-top:4px;
	padding-bottom:2px;
	height:28px;
	min-height:28px;
	margin-top:0px;
	margin-bottom:0px;
	margin-right:2px;	
	margin-left:2px;
	color:Gray;
	text-decoration: none;		
	top:1px;
}

.tabIconselected {
	border-radius: 10px 10px 0px 0px;
	position: relative; 
	cursor:default; 
	z-index:5;  
	padding: 10px;
	border-bottom:solid 1px #333745; 
	color: white;
	margin-top:0px; 
	margin-bottom:0px;
	background-color: #333745; 
	text-decoration: none; 
	float:left; 
	text-align:center; 
	top: 3px;
	cursor: pointer;
} 
	
.tabIcondeselected {
	float: left;
	z-index: 1;
	text-align: center;
	vertical-align: text-bottom;
	color: #333745;
	padding-top: 2px;
	border-bottom: solid 1px white;
	border-left: solid 1px white;
	border-right: solid 1px white;
	border-top: solid 1px white;
	height: 28px;
	margin-top: 4px;
	margin-bottom: 0px;
	margin-right: 1px;
	margin-left: 1px;
	padding: 10px;
	text-decoration: none;
	cursor: pointer;
}

.tabmenulines {
	position: absolute;
	left: 0px;
	top: 51px;
	z-index: -5;
	background-color: #333745;
	padding-top: 1px;
	height: 143px;
	text-decoration: none;
} 
	
.tabmenuline {
	position: relative; 
	left: 0px; 
	top: 39px; 
	z-index:-5; 
	border-top:solid 1px #333745; 
	padding-top:1px; 
	text-decoration: none;
} 
	
.iconmenu {
	cursor:pointer; 
	float:left; 
	background-repeat: no-repeat;
	background-position: center top !important; 
	border-color:#333745;
	min-width: 80px !important; 
	width:80px; 
	text-align: center; 
	vertical-align:bottom; 
	padding-top:40px; 
	height:60px; 
	margin-left: 3px;
	margin-right: 3px;
}

.iconmenu A { 
	color:#fff; 
	padding: 40px 10px 0px 10px; 
	font-size: 0.9rem;
	text-decoration: none;
}

.iconmenuselect {
	color: black; 
	cursor:pointer; 
	float:left; 
	min-width: 80px; 
	width:80px; 
	background-repeat: no-repeat; 
	background-position: center top; 
	text-align:center; 
	vertical-align:bottom; 
	padding-top:40px; 
	height:50px;
	margin-left: 2px; 
	margin-right: 2px;
}

.iconmenuselect A { 
	padding: 40px 5px 0px 5px;
	color:white;
	font-weight:bold;
	text-decoration: none;
	font-size: 0.9rem;
}

.iconmenu A:hover, .iconmenuselect a:hover {
	text-decoration: underline;
}

.helptext{
	color:White;
	border-top: solid 1px #59BEE3;
	background-color: #59BEE3;
	text-indent: 5px;
	padding-top: 2px;
	width: calc(100% - 20px) !important;
}
/*---Tab menu  ---*/

.input, .inputnumber, inputcheckbox{
	border: 1px solid #333745;
	padding: 10px;
	font-size: inherit;
	font-family: inherit;
	letter-spacing: inherit;
	border-radius: 5px;
	background-color:white;
}

.inputnumber{
	text-align:right;
}

.inputcheckbox{
	font-weight:bold;
}

.gridrowover{
	background-color: #d3d3d3;
	cursor: pointer;
}

.DecisionNotReady{
	background-color: #3399cc;
}

.subtotal{
	text-align: right;
	border-top: black 1px solid;
	font-weight: bold;
	height: 30px;
	vertical-align:top;
}

.subtotaltext{
	text-align: left;
	font-weight: bold;
	height: 30px;
	vertical-align:top;
}

.numberselector{
	color:Black;
	font-size:13pt;
	text-decoration:none;
	position:relative;
	top: 3px;
	border:2px solid #056492;	
	width:30px;
	height:10px;
	padding:3px;	
	margin:5px;
}

.numberselectorselected{
	color:Black;
	font-size:13pt;
	text-decoration:none;
	position:relative;
	top:3px;
	border:2px solid #DC3507;	
	width: 30px;
	height:10px;
	padding:3px;
	margin:5px;
}

.documenttext{
	font-family: Arial, Verdana;
	min-height: 20px;
	font-size: 12px;
	cursor: pointer;
}

.documenttext2{
	font-family: Arial, Verdana;
	background-color: #d3d3d3;
	font-size: 12px;
	cursor: pointer;
}

.projectbutton{
	float:left;
}

.projectbox{
	border: 1px solid black;
	text-align:right;
	float:left;
	width: 286px;
	height: 200px;
	margin:5px;
	padding:8px;
}

.projectboxselected{
	border: 1px solid  #333745;
	background-color:#E7F5CE;
	text-align:right;
	float:left;
	width:202px;
	height:100px;
	margin:5px;
	padding:8px;
}

.teambuttons{
	clear:both;
	float:left;
	border: 1px solid #333745;
	padding:4px;
	margin:2px;
}

.teambuttons a{
	text-decoration:none;
}

.teambuttons img{
	padding-right:4px;	
}

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
	input[type=checkbox], input[type=radio] {
		--active: #59BEE3;
		--active-inner: #fff;
		--focus: 2px #59BEE3;
		--border: #59BEE3;
		--border-hover: #59BEE3;
		--background: #fff;
		--disabled: #F6F8FF;
		--disabled-inner: #E1E6F9;
		-webkit-appearance: none;
		-moz-appearance: none;
		height: 21px;
		outline: none;
		display: inline-block;
		vertical-align: top;
		position: relative;
		margin: 0;
		cursor: pointer;
		border: 1px solid var(--bc, var(--border));
		background: var(--b, var(--background));
		transition: background 0.3s, border-color 0.3s, box-shadow 0.2s;
	}

	input[type=checkbox]:after, input[type=radio]:after {
		content: "";
		display: block;
		left: 0;
		top: 0;
		position: absolute;
		transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s);
	}

	input[type=checkbox]:checked, input[type=radio]:checked {
		--b: var(--active);
		--bc: var(--active);
		--d-o: .3s;
		--d-t: .6s;
		--d-t-e: cubic-bezier(.2, .85, .32, 1.2);
	}

	input[type=checkbox]:disabled, input[type=radio]:disabled {
		--b: var(--disabled);
		cursor: not-allowed;
		opacity: 0.9;
	}

	input[type=checkbox]:disabled:checked, input[type=radio]:disabled:checked {
		--b: var(--disabled-inner);
		--bc: var(--border);
	}

	input[type=checkbox]:disabled + label, input[type=radio]:disabled + label {
		cursor: not-allowed;
	}

	input[type=checkbox]:hover:not(:checked):not(:disabled), input[type=radio]:hover:not(:checked):not(:disabled) {
		--bc: var(--border-hover);
	}

	input[type=checkbox]:focus, input[type=radio]:focus {
		box-shadow: 0 0 0 var(--focus);
	}

	input[type=checkbox]:not(.switch), input[type=radio]:not(.switch) {
		width: 21px;
	}

	input[type=checkbox]:not(.switch):after, input[type=radio]:not(.switch):after {
		opacity: var(--o, 0);
	}

	input[type=checkbox]:not(.switch):checked, input[type=radio]:not(.switch):checked {
		--o: 1;
	}

	input[type=checkbox] + label, input[type=radio] + label {
		font-size: inherit;
		font-family: inherit;
		letter-spacing: inherit;
		line-height: 21px;
		display: inline-block;
		vertical-align: top;
		cursor: pointer;
		margin-left: 14px;
	}

	input[type=checkbox]:not(.switch) {
		border-radius: 7px;
	}

	input[type=checkbox]:not(.switch):after {
		width: 5px;
		height: 9px;
		border: 2px solid var(--active-inner);
		border-top: 0;
		border-left: 0;
		left: 7px;
		top: 4px;
		transform: rotate(var(--r, 20deg));
	}

	input[type=checkbox]:not(.switch):checked {
		--r: 43deg;
	}

	input[type=checkbox].switch {
		width: 38px;
		border-radius: 11px;
	}

	input[type=checkbox].switch:after {
		left: 2px;
		top: 2px;
		border-radius: 50%;
		width: 15px;
		height: 15px;
		background: var(--ab, var(--border));
		transform: translateX(var(--x, 0));
	}

	input[type=checkbox].switch:checked {
		--ab: var(--active-inner);
		--x: 17px;
	}

	input[type=checkbox].switch:disabled:not(:checked):after {
		opacity: 0.6;
	}

	input[type=radio] {
		border-radius: 50%;
	}

	input[type=radio]:after {
		width: 19px;
		height: 19px;
		border-radius: 50%;
		background: var(--active-inner);
		opacity: 0;
		transform: scale(var(--s, 0.7));
	}
  
	input[type=radio]:checked {
		--s: .5;
	}
}