sup {
		font-size: 0.5em;
		position: relative;
		top: -0.1em;
	}

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

	.align-center {
		text-align: center;
	}

	.align-right {
		text-align: right;
	}

	.nowrap {
		white-space: nowrap;
	}
	
	.active-text {
		padding-left: 1em;
		color: #ccc;
	}	

/* Form */

	form {
		margin: 0 0 2rem 0;
	}
	
		form.narrow {
			width: 20rem;
    		margin: 0 auto 2rem auto;
		}	

		form > :last-child {
			margin-bottom: 0;
		}

		form > .fields {
			display: -moz-flex;
			display: -webkit-flex;
			display: -ms-flex;
			display: flex;
			-moz-flex-wrap: wrap;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			margin: -2rem 0 2rem -2rem;
			width: calc(100% + 4rem);
		}

			form > .fields > .field {
				-moz-flex-grow: 0;
				-webkit-flex-grow: 0;
				-ms-flex-grow: 0;
				flex-grow: 0;
				-moz-flex-shrink: 0;
				-webkit-flex-shrink: 0;
				-ms-flex-shrink: 0;
				flex-shrink: 0;
				padding: 2rem 0 0 2rem;
				width: calc(100% - 2rem);
			}

				form > .fields > .field > :last-child {
					margin-bottom: 0;
				}

				form > .fields > .field.half {
					width: calc(50% - 1rem);
				}

				form > .fields > .field.third {
					width: calc(100%/3 - 0.6666666667rem);
				}

				form > .fields > .field.quarter {
					width: calc(25% - 0.5rem);
				}

		@media screen and (max-width: 480px) {
			
			form.narrow {
				width: inherit;
				margin: 0 0 2rem 0;
			}				

			form > .fields {
				margin: -1.5rem 0 2rem -1.5rem;
				width: calc(100% + 3rem);
			}

				form > .fields > .field {
					padding: 1.5rem 0 0 1.5rem;
					width: calc(100% - 1.5rem);
				}

					form > .fields > .field.half {
						width: calc(100% - 1.5rem);
					}

					form > .fields > .field.third {
						width: calc(100% - 1.5rem);
					}

					form > .fields > .field.quarter {
						width: calc(100% - 1.5rem);
					}

		}		

	/*form .field {
		margin: 0 0 2em 0;
		vertical-align: top;
		width: 100%;
		float: left;
		position: relative;
	}*/
	
	form .field label {
		display: block;
		margin: 0 0 0.5em 0;
	}
	
	form .field input[type="text"],
	form .field input[type="password"], 
	form .field input[type="email"],
	form .field input[type="color"],
	form .field input[type="range"],
	form .field textarea,
	form .field select {
		width: 100%;
	}	
	
	form .field input[type="checkbox"] + label, 
	form .field input[type="radio"] + label {
		display: inline-block;
		/* padding-left: 2.4em;  -- uncomment and rejoice when default radio styling is replaced  */
		padding-right: 0.75em;
		position: relative;
	}
	
	/*form .third {
		width: calc(33.3333% + 0.20833em) !important;
		padding-left: 0.625em;
		margin-bottom: 0em;
	}
	
	form .third.first {
		width: calc(33.3333% + 0.20833em) !important;
		margin-left: -0.625em;
	}		*/
	
	form .field input[type="range"] + .status {
		position: absolute;
		top: 0;
		right: 0;
		color: rgba(0, 0, 0, 0.5);
	}	
	
	.form-color {
		position: relative;
		/* border-radius: 4px; */
	}	
	
	.form-color .swatch {
		width: 1.2em;
		height: 1.2em;
		border-radius: 3px;
		display: block;
		border: solid 1px rgba(250,247,255,0.1);
		position: absolute;
		/* top: 0.5em;
		left: 0.5em; */
		-moz-pointer-events: none;
		-webkit-pointer-events: none;
		-ms-pointer-events: none;
		pointer-events: none;
		top: 0.4em;
		left: 0.4em;
	}	
	
	form .field .form-color input {
		padding-left: 2.5em;
		/* padding-left: 3.5em; */
		text-transform: uppercase;
	}	
	
	.form-color .content {
		position: relative;
		background: rgba(250,247,255,0.035);
		padding: 0.75em;
		border-radius: 0 0 0.25em 0.25em;
		border-top: solid 1px rgba(250,247,255,0.1);
		width: 100%;
		display: none;
	}	
	
	.form-color .content .inner {
		position: relative;
		height: auto;
	}	
	
	.form-color .content .inner .hueSlider {
		position: relative;
		display: block;
		width: 1.5em;
		margin-right: 0.75em;
		height: 15em;
		float: left;
	}	
	
	.form-color .content .inner .hueSlider .cursor {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 0.7em;
		margin-top: -0.3em;
		z-index: 1;
		-moz-pointer-events: none;
		-webkit-pointer-events: none;
		-ms-pointer-events: none;
		pointer-events: none;
	}	

	.form-color .content .inner .picker {
		position: relative;
		display: block;
		width: calc(100% - 2.25em);
		height: 15em;
		float: left;
		margin-bottom: 0.75em;
	}

	.form-color .content .inner .picker .cursor {
		display: block;
		position: absolute;
		top: 25%;
		left: 25%;
		width: 0.65em;
		height: 0.65em;
		margin: -0.325em 0 0 -0.325em;
		box-shadow: 0 0 0 1px #ffffff, 0 0 0 2px #000000;
		border-radius: 100%;
		z-index: 1;
		-moz-pointer-events: none;
		-webkit-pointer-events: none;
		-ms-pointer-events: none;
		pointer-events: none;
	}
	
	.form-color .content .inner .alphaSlider {
		position: relative;
		display: block;
		height: 1.5em;
		clear: both;
		width: 100%;
	}	
	
	.form-color .content .inner .alphaSlider .cursor {
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 0.7em;
		margin-left: -0.3em;
		z-index: 1;
		-moz-pointer-events: none;
		-webkit-pointer-events: none;
		-ms-pointer-events: none;
		pointer-events: none;
	}	
	
	.form-search {
		position: relative;
		/* border-radius: 4px; */
	}	
	
	form .field .form-search input {
		padding-left: 2.5em;
		/* padding-left: 3.5em; */
	}
	
	form .field .form-search::before {
		-moz-osx-font-smoothing: grayscale;
		-webkit-font-smoothing: antialiased;
		font-family: FontAwesome;
		font-style: normal;
		font-weight: normal;
		text-transform: none !important;
		content: "\f002";
		left: 0.5em;
		top: 0.5em;
    	position: absolute;
	}		
	
	.form-date {
		position: relative;
		/* border-radius: 4px; */
	}	
	
	form .field .form-date input {
		padding-left: 2.5em;
		/* padding-left: 3.5em; */
	}
	
	form .field .form-date::before {
		-moz-osx-font-smoothing: grayscale;
		-webkit-font-smoothing: antialiased;
		font-family: FontAwesome;
		font-style: normal;
		font-weight: normal;
		text-transform: none !important;
		content: "\f073";
		left: 0.5em;
		top: 0.5em;
    	position: absolute;
	}		
	
	.select-wrapper {
		text-decoration: none;
		display: block;
		position: relative;
	}

/*
		.select-wrapper:before {
			-moz-osx-font-smoothing: grayscale;
			-webkit-font-smoothing: antialiased;
			font-family: FontAwesome;
			font-style: normal;
			font-weight: normal;
			text-transform: none !important;
		}

		.select-wrapper:before {
			color: rgba(144, 144, 144, 0.25);
			content: '\f078';
			display: block;
			height: 2.75em;
			line-height: 2.75em;
			pointer-events: none;
			position: absolute;
			right: 0;
			text-align: center;
			top: 0;
			width: 2.75em;
		}

		.select-wrapper select::-ms-expand {
			display: none;
		}
		
		.select-wrapper.alt:before {
			width: 2.625em;
		}	
		
	*/
	
	input[type="submit"].fit,
	input[type="reset"].fit,
	input[type="button"].fit,
	button.fit,
	.button.fit {
		display: block;
		margin: 0 0 1em 0;
		width: 100%;
	}	

/* Image */

	.image {
		border-radius: 6px;
		border: 0;
		display: inline-block;
		position: relative;
	}

		.image img {
			border-radius: 6px;
			display: block;
		}

		.image.left {
			float: left;
			padding: 0 1.5em 1em 0;
			top: 0.25em;
		}

		.image.right {
			float: right;
			padding: 0 0 1em 1.5em;
			top: 0.25em;
		}

		.image.left, .image.right {
			max-width: 40%;
		}

			.image.left img, .image.right img {
				width: 100%;
			}

		.image.fit {
			display: block;
			margin: 0 0 2em 0;
			width: 100%;
		}

			.image.fit img {
				width: 100%;
			}

		.image.main {
			display: block;
			margin: 0 0 3em 0;
			width: 100%;
		}

			.image.main img {
				width: 100%;
			}

		.image.ss {
			margin: 1em;
		}

			.image.ss img {
				width: 200px;
			}

/* Table */

	.table-wrapper {
		-webkit-overflow-scrolling: touch;
		overflow-x: auto;
	}

	.data-table table {
		margin: 0 0 2em 0;
		width: 100%;
	}

		.data-table table tbody tr {
			border: solid 1px rgba(144, 144, 144, 0.25);
			border-left: 0;
			border-right: 0;
		}

			.data-table table tbody tr:nth-child(2n) {
				background-color: rgba(144, 144, 144, 0.075);
			}

		.data-table table td {
			padding: 0.75em 0.75em;
		}

		.data-table table th {
			color: #3d424f;
			font-size: 0.9em;
			font-weight: 600;
			padding: 0.75em;
			text-align: left;
		}

		.data-table table thead {
			border-bottom: solid 2px rgba(144, 144, 144, 0.25);
		}

		.data-table table tfoot {
			border-top: solid 2px rgba(144, 144, 144, 0.25);
		}

		.data-table table.alt {
			border-collapse: separate;
		}

			.data-table table.alt tbody tr td {
				border: solid 1px rgba(144, 144, 144, 0.25);
				border-left-width: 0;
				border-top-width: 0;
			}

				.data-table table.alt tbody tr td:first-child {
					border-left-width: 1px;
				}

			.data-table table.alt tbody tr:first-child td {
				border-top-width: 1px;
			}

			.data-table table.alt thead {
				border-bottom: 0;
			}

			.data-table table.alt tfoot {
				border-top: 0;
			}


/* List */


		ul.icons {
			cursor: default;
			list-style: none;
			padding-left: 0;
		}

			ul.icons li {
				display: inline-block;
				padding: 0 1em 0 0;
			}

				ul.icons li:last-child {
					padding-right: 0;
				}

				ul.icons li .icon:before {
					font-size: 1.5em;
				}
				
			ul.icons.light .icon::before {
				color: rgba(144,144,144,0.075);
				-moz-transition: color 0.2s ease-in-out;
    			-webkit-transition: color 0.2s ease-in-out;
    			-ms-transition: color 0.2s ease-in-out;
    			transition: color 0.2s ease-in-out;
			}	
			
			ul.icons.light .icon:hover::before {
				color: rgba(144,144,144,0.25);
			}
			
		ul.image-select {
			cursor: default;
			list-style: none;
			padding-left: 0;
			margin-left: 0;
		}

			ul.image-select li {
				display: inline-block;
				padding: 0 1em 0 0;
			}

				ul.image-select li:last-child {
					padding-right: 0;
				}	
				
			ul.image-select input[type=radio] {
				display: none;
			}		
			
			ul.image-select img {
				border-radius: 6px;
				cursor: pointer;
			}						

			ul.image-select li.selected {
				position: relative;
			}
			
			ul.image-select li.selected:after {
				content: '';
				position: absolute;
				top: -0.3em;
				left: -0.3em;
				right: 0.7em;
				bottom: -0.3em;		
				border-radius: 8px;
				border-width: 2px;
				border-style: solid;
				border-color: rgba(144,144,144,0.25);
			}		

			ul.image-select li.selected:first-child:after {
				left: -0.3em;
			}	

/* Color Schemes */

	.scheme {
    	display: inline-block;
    	margin: 0 0 1em 0;
    	line-height: 1.5em;
    	vertical-align: top;
		cursor: pointer;	
		letter-spacing: 0;	
		padding: 0 1.5em 0 0;
	}
	
	.scheme.selected,
	.scheme-special.selected,
	.scheme-custom.selected {
		position: relative;
	}
	
	.scheme.selected:after,
	.scheme-special.selected:after,
	.scheme-custom.selected:after {
		content: '';
		position: absolute;
		top: -0.3em;
		left: -0.5em;
		right: 0.5em;
		bottom: -0.4em;		
		border-radius: 8px;
    	border-width: 2px;
    	border-style: solid;
    	border-color: rgba(144,144,144,0.25);
	}		

	.scheme-special.selected:after,
	.scheme-custom.selected:after {
		right: 1em;
		left: -0.5em;
	}	
		
	/*.scheme:first-child {
		padding-left: 0;
	}*/
	
	.scheme.selected:first-child:after,
	.scheme-special.selected:first-child:after,
	.scheme-custom.selected:first-child:after {
		left: -0.5em;
	}	
	
	.scheme li {
    	display: inline-block;
    	width: 1.25em;
    	height: 1.25em;
    	margin: 0 -0.34em 0 0;
    	text-indent: 1.25em;
    	white-space: nowrap;
    	vertical-align: middle;
    	overflow: hidden;
	}
	
	.scheme li:first-child {
    	border-radius: 6px 0 0 6px;	
		margin-left: 0;
	}
	
	.scheme li:last-child {
    	border-radius: 0 6px 6px 0;
	}
	
	.scheme-special,
	.scheme-custom {
    	display: inline-block;
    	margin: 0;
    	line-height: 1.5em;
    	vertical-align: top;
		cursor: pointer;	
		padding: 0 1.5em 0 0;
	}		
	
	.scheme-special li,
	.scheme-custom li {
    	display: inline-block;
		border-radius: 6px;
		color: #fff;
    	width: 5.5em;
    	height: 1.25em;
		text-indent: 0.5em;
		line-height: 1.25em;
		padding-left: 0;
    	white-space: nowrap;
    	vertical-align: middle;
    	overflow: hidden;
	}	
	
	.scheme-special li {
		background-color: #4bb2b6;
	}	
	
	.scheme-custom li {
		background-color: #595C68;
	}
	
	label.scheme-wrapper {
		
	}	
	
	label.scheme-wrapper > input{
	visibility: hidden;
	position: absolute;
	}
	
	label.scheme-wrapper > input + ul{ 
		cursor:pointer;
		margin-bottom: 1.5em;
	}
	
	label.scheme-wrapper > input:checked + ul {
		position: relative;
	}	
	
	label.scheme-wrapper > input:checked + ul:after {
		content: '';
		position: absolute;
		top: -0.3em;
		left: -0.5em;
		right: 0.5em;
		bottom: -0.4em;		
		border-radius: 8px;
    	border-width: 2px;
    	border-style: solid;
    	border-color: rgba(144,144,144,0.25);
	}	
	
	label.scheme-wrapper > input:checked + ul.scheme-special:after,
	label.scheme-wrapper > input:checked + ul.scheme-custom:after	 {
		right: 1em;
		left: -0.5em;
	}	
	
	label.scheme-wrapper > input:checked + ul:first-child:after,
	label.scheme-wrapper > input:checked + ul.scheme-special:first-child:after,
	label.scheme-wrapper > input:checked + ul.scheme-custom:first-child {
		left: -0.5em;
	}		
	
	.scheme-big {
		display: block;
		margin-bottom: 0;
		vertical-align: middle;
		position: relative;
		top: 0.5em;
	}	
	
	.scheme-big li {
		display: block;
		float: left;
		width: 4em;
		height: 3em;
		text-indent: 4em;
		white-space: nowrap;
		overflow: hidden;
		border-radius: 6px;
		margin: 0 1em 1em 0;
	}	
	
/* Radio Wrapper */	

	label.radio-wrapper {
		
	}	
	
	label.radio-wrapper > input{
		visibility: hidden;
		position: absolute;
	}
	
	label.radio-wrapper > input + .radio-click{ 
		cursor:pointer;
		margin: 0;
	}
	
	label.radio-wrapper > input:checked + .radio-click {
		position: relative;
	}	
	
	label.radio-wrapper > input:checked + .radio-click:after {
		content: '';
		position: absolute;
		top: -0.5em;
		left: -0.5em;
		right: -0.5em;
		bottom: -0.5em;		
		border-radius: 8px;
    	border-width: 2px;
    	border-style: solid;
    	border-color: rgba(144,144,144,0.25);
	}	
		
	
/* Prices */	
	
	form .field .price {
		display: block;
		font-size: 0.8em;
		margin-bottom: 2em;
		margin-left: 2em;
	}	
	
	form .field .price h2 {
		font-size: 3em;
		margin-left: 0;
		display: inline;		
	}	
	
	form .field .save {
		display: inline-table;
		margin-top: -1em;
		margin-left: 2em;
		position: absolute;
		color: #aa4444;
		font-size: 1.1em;
	}	
	
	form .field .save:after {
		content: '';
		position: absolute;
		top: -0.2em;
		left: -0.5em;
		right: -0.5em;
		bottom: -0.4em;
		border-radius: 8px;
		background-color: #f5f5f5;
		z-index: -1;
	}			
	
	
	
	
	
/* Depreciated Styling */


.stackingTable {
  width: 100%;
  max-width: 100%;
  margin-bottom: 20px;
}

.stackingTable > thead > tr > th,
.stackingTable > tbody > tr > th,
.stackingTable > tfoot > tr > th,
.stackingTable > thead > tr > td,
.stackingTable > tbody > tr > td,
.stackingTable > tfoot > tr > td {
  padding: 0.5em 0.5em 0.5em 0.5em;
}

.stackingTable > thead > tr > th {
  vertical-align: bottom;

}
.stackingTable > caption + thead > tr:first-child > th,
.stackingTable > colgroup + thead > tr:first-child > th,
.stackingTable > thead:first-child > tr:first-child > th,
.stackingTable > caption + thead > tr:first-child > td,
.stackingTable > colgroup + thead > tr:first-child > td,
.stackingTable > thead:first-child > tr:first-child > td {
  border-top: 0;
}


.stackingTable table {
  margin-bottom: 20px;
}

.stackingTable table > thead > tr > th,
.stackingTable table> tbody > tr > th,
.stackingTable table> tfoot > tr > th,
.stackingTable table> thead > tr > td,
.stackingTable table> tbody > tr > td,
.stackingTable table> tfoot > tr > td {
  padding: 0.5em 0.5em 0em 0.5em;
}

.stackingTable-bordered {
/*color defined in backend6*/
  border: 1px solid #dddddd;
}

.stackingTable-bordered tr td{
	border-top:1px solid #dddddd;
}

.stackingTable-bordered > thead > tr > th,
.stackingTable-bordered > tbody > tr > th,
.stackingTable-bordered > tfoot > tr > th,
.stackingTable-bordered > thead > tr > td,
.stackingTable-bordered > tbody > tr > td,
.stackingTable-bordered > tfoot > tr > td {
/*color defined in backend6*/
}
.stackingTable-bordered > thead > tr > th,
.stackingTable-bordered > thead > tr > td {
  border-bottom-width: 2px;
}
.stackingTable-striped > tbody > tr:nth-child(odd) > td,
.stackingTable-striped > tbody > tr:nth-child(odd) > th {
  background-color: #f9f9f9;
 }
.stackingTable-hover > tbody > tr:hover > td,
.stackingTable-hover > tbody > tr:hover > th {
  background-color: #f5f5f5;
}

	
@media screen and (max-width: 767px) {
.stackingTable {
  width: 100%;
  max-width: 100%;
  margin-bottom: 0px;
}

.stackingTable > thead > tr > th,
.stackingTable > tbody > tr > th,
.stackingTable > tfoot > tr > th,
.stackingTable > thead > tr > td,
.stackingTable > tbody > tr > td,
.stackingTable > tfoot > tr > td {
  padding: 8px;
  line-height: 1.42857143;
  vertical-align: top;
  display: block;
}


       
}


/* ===============  Complex data table =================================*/

.dataTable {
  width: 100%;
  max-width: 100%;
  margin-bottom: 20px;
}


.dataTable > thead > tr > th,
.dataTable > tbody > tr > th,
.dataTable > tfoot > tr > th,
.dataTable > thead > tr > td,
.dataTable > tbody > tr > td,
.dataTable > tfoot > tr > td {
  padding: 8px;
  line-height: 1.42857143;
  vertical-align: top;
}


.dataTable-bordered {
/*color defined in backend6*/
  border: 1px solid #dddddd;
}

.dataTable-bordered tr td{
	border-top:1px solid #dddddd;
}
.dataTable-bordered > thead > tr > th,
.dataTable-bordered > tbody > tr > th,
.dataTable-bordered > tfoot > tr > th,
.dataTable-bordered > thead > tr > td,
.dataTable-bordered > tbody > tr > td,
.dataTable-bordered > tfoot > tr > td {
/*color defined in backend6*/
}
.dataTable-bordered > thead > tr > th,
.dataTable-bordered > thead > tr > td {
  border-bottom-width: 2px;
}



/* =============== remove border =================================*/
.noBorder,
tr.noBorder td,
tr.noBorder,
td.noBorder {
	border : 0;
    border-style : none;
    border-width : medium;
    border-color : none;
	border-top: none;
}



/* ===============  forms.css =================================*/


.formActions{    
    text-align: right;
	BACKGROUND-COLOR: #f5f5f5;
}
    
/* Grouped Vertically */
.input-group {
  display:block;
  padding-bottom:3em;
}

.input-group label {
  float:left;
  text-align: right;
}


.input-group input {
 float: right;
 width: 97%;
 text-align: right;
 white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}



 input[type="text"],
 input[type="password"],
 input[type="email"],
 input[type="url"],
 input[type="date"],
 input[type="month"],
 input[type="time"],
 input[type="datetime"],
 input[type="datetime-local"],
 input[type="week"],
 input[type="number"],
 input[type="search"],
 input[type="tel"],
 input[type="color"],
 select,
 textarea {

    margin-bottom: 0.5em;
    padding: 0.3em 0.4em;
    display: inline-block;
    border: 1px solid #e6e6e6;
    box-shadow: inset 0 1px 3px #e6e6e6;
    -webkit-transition: 0.3s linear border;
    -moz-transition: 0.3s linear border;
    -ms-transition: 0.3s linear border;
    -o-transition: 0.3s linear border;
    transition: 0.3s linear border;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -webkit-border-radius: 0;  /* Safari 3-4, iOS 1-3.2, Android 1.6- */    
    -moz-border-radius: 0;  /* Firefox 1-3.6 */     
    border-radius: 0;  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
}


.stackingTable input[type="text"],
.stackingTable  input[type="password"],
.stackingTable input[type="email"],
.stackingTable input[type="url"],
.stackingTable input[type="date"],
.stackingTable input[type="month"],
.stackingTable input[type="time"],
.stackingTable input[type="datetime"],
.stackingTable input[type="datetime-local"],
.stackingTable input[type="week"],
.stackingTable input[type="number"],
.stackingTable input[type="search"],
.stackingTable input[type="tel"],
.stackingTable input[type="color"],
.stackingTable select,
.stackingTable textarea,
.dataTable input[type="text"],
.dataTable input[type="password"],
.dataTable input[type="email"],
.dataTable input[type="url"],
.dataTable input[type="date"],
.dataTable input[type="month"],
.dataTable input[type="time"],
.dataTable input[type="datetime"],
.dataTable input[type="datetime-local"],
.dataTable input[type="week"],
.dataTable input[type="number"],
.dataTable input[type="search"],
.dataTable input[type="tel"],
.dataTable input[type="color"],
.dataTable select,
.dataTable textarea {
    width:100%;
  }


 input[type="text"]:focus,
 input[type="password"]:focus,
 input[type="email"]:focus,
 input[type="url"]:focus,
 input[type="date"]:focus,
 input[type="month"]:focus,
 input[type="time"]:focus,
 input[type="datetime"]:focus,
 input[type="datetime-local"]:focus,
 input[type="week"]:focus,
 input[type="number"]:focus,
 input[type="search"]:focus,
 input[type="tel"]:focus,
 input[type="color"]:focus,
 select:focus,
 textarea:focus {
    outline: 0;
    outline: thin dotted \9; /* IE6-9 */
    border-color: #7d838f;
}

 input[type="file"],
 input[type="radio"],
 input[type="checkbox"] {
    margin-left: 0.5em;
}

 input[type="file"]:focus,
 input[type="radio"]:focus,
 input[type="checkbox"]:focus {
    outline: thin dotted #333;
}

 input[type="text"][disabled],
 input[type="password"][disabled],
 input[type="email"][disabled],
 input[type="url"][disabled],
 input[type="date"][disabled],
 input[type="month"][disabled],
 input[type="time"][disabled],
 input[type="datetime"][disabled],
 input[type="datetime-local"][disabled],
 input[type="week"][disabled],
 input[type="number"][disabled],
 input[type="search"][disabled],
 input[type="tel"][disabled],
 input[type="color"][disabled],
 select[disabled],
 textarea[disabled] {
    cursor: not-allowed;
    box-shadow: inset 0 1px 10px #ededed;
}
 input[readonly],
 select[readonly],
 textarea[readonly],
 input[readonly]:focus,
 select[readonly]:focus,
 textarea[readonly]:focus {
    background: #fdfdfd; 
    color: #<?=$color['text']?>; 
    border-color: #fafafa;
}
 input:focus:invalid,
 textarea:focus:invalid,
 select:focus:invalid {
    color: #b94a48;
    border: 1px solid #ee5f5b;
}
 input:focus:invalid:focus,
 textarea:focus:invalid:focus,
 select:focus:invalid:focus {
    border-color: #e9322d;
}
 input[type="file"]:focus:invalid:focus,
 input[type="radio"]:focus:invalid:focus,
 input[type="checkbox"]:focus:invalid:focus {
    outline-color: #e9322d;
}
 select {
    border: 1px solid #e6e6e6;
    background-color: white;
}
 select[multiple] {
    height: auto;
}
 label {
	width: auto;
	padding-right: 0.5em;
    color: currentColor;
	display: inline;
	position: relative;
}
 fieldset {
    margin: 0;
    padding: 0.35em 0 1.75em;
    border: 0;
}

textarea { min-height: 4em;}

input[type=submit], input[type=button], .btn, input.btn  {
  display: inline-block;
  margin-bottom: 0;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  /*color defined in backend6*/

  padding: 0.3em 0.4em;
  line-height: 1.4em;
 
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   transition: all 0.5s linear;

}

input[type=submit]:focus,
input[type=submit]:active:focus{
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

input[type=submit]:hover,
input[type=submit]:focus,
.btn,
input.btn  {
/*color defined in backend6*/
  text-decoration: none;
}

input[type="submit"].form-button-block,
input[type="reset"].form-button-block,
input[type="button"].form-button-block {
  width: 100%;
}
.input-group{
  margin-bottom:10px;
}

input[type=submit] , input[type=button], .btn {
  display: inline-block;
  /*  margin-bottom: 0.5em; */
}
 
 
.formGroup{
  	display: table;
	border-collapse: separate;
	position: relative;
	width: 100%;
}

.formGroup input[type="text"],
.formGroup input[type="password"],
.formGroup input[type="email"],
.formGroup input[type="url"],
.formGroup input[type="date"],
.formGroup input[type="month"],
.formGroup input[type="time"],
.formGroup input[type="datetime"],
.formGroup input[type="datetime-local"],
.formGroup input[type="week"],
.formGroup input[type="number"],
.formGroup input[type="search"],
.formGroup input[type="tel"],
.formGroup input[type="color"],
.formGroup select,
.formGroup textarea {
	width: calc(100% - 6em) !important;
	position: relative;
	display: table-cell;
}  

/* only needs this for old form images */
.formGroup img{
	width:20px;
	height:20px;
	padding-top:.3em;
	vertical-align::middle;
}

.formGroup label{
	width: 6em;
}

.formGroup input.dayHist,
.formGroup input.yearHist {
	display:inline;
	position:relative;
	width: 32% !important;	
	margin-bottom: 0.5em;
}

.formGroup select.monthHist {
	display:inline;
	position:relative;
	width: 32% !important;	
	margin: 0 0.5em;
}

/* Grouped buttons contained inside form-actions */   
.formActions{ clear:both;}
/* used to hide colums in a data table */
.hideColumn{display:none;}

/*colors for backend_layout below.*/
th {
    background-color:#eceff4;
    font-weight:bold;
    color:#464646;
    }

/*colors for forms.*/
     
.btn, input.btn{ 
    border:1px solid #91A3AD;
    color: #9E1C1F;
    font-weight:600; /* bold to match older button style */
    
    background: rgb(255,255,255) !important; /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(238,239,252,1) 50%, rgba(223,225,238,1) 51%, rgba(190,189,210,1) 100%) !important; /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(50%,rgba(238,239,252,1)), color-stop(51%,rgba(223,225,238,1)), color-stop(100%,rgba(190,189,210,1))) !important; /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(238,239,252,1) 50%,rgba(223,225,238,1) 51%,rgba(190,189,210,1) 100%) !important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(238,239,252,1) 50%,rgba(223,225,238,1) 51%,rgba(190,189,210,1) 100%) !important; /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(238,239,252,1) 50%,rgba(223,225,238,1) 51%,rgba(190,189,210,1) 100%) !important; /* IE10+ */
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(238,239,252,1) 50%,rgba(223,225,238,1) 51%,rgba(190,189,210,1) 100%) !important; /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#bebdd2',GradientType=0 ) !important; /* IE6-9 */
    padding: 0.2em 0.5em !important
}

.btn:hover, input.btn:hover{ 
    background: #dadeea;
	color: #9E1C1F;
}

.btn-pri, input.btn-pri{
	background: #bdc4cc; /* Old browsers */
	background: -moz-linear-gradient(top, #bdc4cc 0%, #7d838f 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #bdc4cc 0%,#7d838f 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #bdc4cc 0%,#7d838f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bdc4cc', endColorstr='#7d838f',GradientType=0 ); /* IE6-9 */
	color:#f6f6f4;
}


/* throwaway fixes */

	.tempfix {
		padding: 1em;
	}
	.tempfix td {
		vertical-align: top;
	}
	.tempfix input[type="radio"] {
		margin-right: 0.5em;
	}

	.tempfix.rowpad td {
		padding: 0.5em 0;
	}