/* fsofa */
.block {
	margin: 20px 4px 4px 4px;
	padding: 1em;
	border: 2px solid #646464;
	border-radius: 8px;
	position: relative;
	box-sizing: border-box;
}

.block h2 {
	position: absolute;
	top: -32px;
	left: 10px;
	padding: 3px 8px;
	background: #646464;
	border-radius: 8px;
	font-size: 120%;
	color: #ffffff;
	font-weight: bold;
}

.empty {
	text-align: center;
}

@media screen {
	a {
		color: #323232;
		text-decoration: none;
	}

	a:link {
		text-decoration: none;
	}

	a:hover {
		color: #ffffff;
		text-decoration: none;
	}

	a:active {
		text-decoration: none;
	}

	a:visited {
		text-decoration: none;
	}

	iframe {
		border: 0px;
	}

	.sub-menu {
		text-align: right;
		padding: 0.5em 1em;
		position: relative;
	}

	header {
		background: #151515;
		background-image: url(/img/headerbg.jpg);
		background-repeat: no-repeat;
		color: #ffffff;
		text-shadow:
	   -1px -1px 0 #151515,  
		1px -1px 0 #151515,
		-1px 1px 0 #151515,
		 1px 1px 0 #151515;
	}

	header > a {
		white-space: nowrap;
		overflow: hidden;
		font-size: 300%;
		color: #ffffff;
		display: block;
		padding: 16px;
	}

	header .fsofa-address {
		position: absolute;
		top: 1.5em;
		left: 52em;
		font-size: 80%;
	}

	.glyphicon {
		vertical-align: text-top;
	}

	#user-menu {
		position: absolute;
		top: 0px;
		right: 2em;
		background: #424242;
		border-bottom-right-radius: 4px;
		border-bottom-left-radius: 4px;
		padding: 8px;
		white-space: nowrap;
	}

	#user-menu input {
		display: inline;
		width: auto;
	}

	#user-menu form {
		display: inline;
	}

	#user-menu .submit {
		display: inline;
	}

	#user-menu input, #vlife-user-menu select {
		color: #000000;
	}

	#user-menu a {
		color: #cfcfcf;
		text-decoration: none;
	}
	
	#user-menu .button {
		background: #151515;
		padding: 0.4em 2em;
	}

	#user-menu a:hover {
		color: #ffffff;
		text-decoration: none;
	}

	#content {
		margin: auto;
	}

	th {
		background: #323232;
		color: #ffffff;
	}

	th a {
		color: #ffffff;
	}

	tr:nth-child(even) {
		background: #efefef;
	}
	
	tr:nth-child(odd) {
		background: #fafafa;
	}

	tbody tr:hover {
		background: #cfcfcf;
	}

	label {
		display: block;
	}

	input, textarea, select {
		width: 98%;
		display: block;
		margin: auto;
		padding: 2px;
	}

	.input {
		position: relative;
	}

	.input > .sub-menu {
		position: absolute;
		right: 1%;
		top: -3px;
		padding: 0px;
	}

	.input > .sub-menu > .button {
		font-size: 0.7em;
		padding: 2px 4px;
	}

	.input .error-message {
		padding: 1em;
		background: #ee6464;
		color: #ffffff;
		margin: 0px 1%;
	}

	.input .error-message ul {
		margin: 0px;
		padding: 0.0em 1em;
	}

	.input label {
		margin: 0px 1%;
		white-space: nowrap;
	}

	.input.checkbox {
		padding: 0px 1%;
	}

	.input.checkbox input {
		float: left;
		width: auto;
		display: inline;
	}

	div.submit {
		text-align: right;
		padding: 0.25em 1em;
		clear: both;
	}

	.button input, .submit input {
		width: auto;
		display: inline;
	}

	.faux-input {
		border: 1px solid #aaaaaa;
		color: #000000;
		background: #eeeeee;
		min-height: 1.8em;
		padding: 0.1em 0.4em;
		margin: auto;
		width: 98%;
	}

	.faux-input a:hover {
		color: #afafaf;
	}

	.input .options {
		position: absolute;
		right: 4px;
		top: 3px;
		font-size: 80%;
		display: none;
	}

	.input .options a {
		padding: 2px;
		border: 1px solid #afafaf;
		border-radius: 2px;
	}

	a.button {
		display: inline-block;
		padding: 0.2em 1em;
		margin: 0.1em auto;
		min-width: 100px;
		text-align: center;
		background: #424242;
		color: #ffffff;
		border-radius: 4px;
	}
	
	a.button.disabled {
		opacity: 0.5;
	}

	a.button:hover {
		background: #afafaf;
		color: #ffffff;
	}

	.message {
		padding: 0.5em;
		background: #aaaaff;
		color: #ffffff;
		text-align: center;
		font-size: 2em;
	}

	.message.error {
		background: #e74c3c;
	}

	.message.success {
		background: #2ecc71;
	}

	.dialog {
		display: none;
	}

	.input-spacer {
		height: 3.2em;
	}

	.button-link {
		border: 2px solid #afafaf;
		background: #efefef;
		border-radius: 4px;
		padding: 2px 8px;
		min-width: 100px;
		text-align: center;
		display: inline-block;
	}

	.button-link:hover {
		color: #646464;
		background: #cfcfcf;
	}

	.search-form {
		text-align: left;
		position: absolute;
		left: 1em;
		top: 1em;
	}

	.search-form .input {
		display: inline-block;
		width: 200px;
	}

	.terms-of-service {
		height: 200px;
		overflow-x: hidden;
		overflow-y: scroll;
		border: 2px solid #efefef;
		border-radius: 4px;
	}

	.dashboard-link {
		display: block;
		padding: 0.25em;
		background: #646464;
		color: #ffffff;
		font-size: 1.2em;
		text-align: center;
		margin: 0.25em 0.25em 0.25em -0.25em;
		border-radius: 0.33em;
	}

	.dashboard-link:hover {
		margin-right: 0em;
	}

	.work-order-item-image {
		position: relative;
		background-position: center;
		background-size: cover;
		width: 150px;
		height: 150px;
		display: inline-block;
	}

	.work-order-item-image .delete-link {
		position: absolute;
		bottom: 1%;
		right: 5%;
		background: #ffffff;
		border-radius: 4px;
		padding: 1% 4%;
	}

	.work-order-item-image .edit-link {
		position: absolute;
		bottom: 1%;
		left: 5%;
		background: #ffffff;
		border-radius: 4px;
		padding: 1% 3%;
	}

	.work-order-item-image .view-image-link {
		position: absolute;
		bottom: 1%;
		left: 43%;
		background: #ffffff;
		border-radius: 4px;
		padding: 1% 3%;
	}

	.work-order-item-thumb {
		position: relative;
		background-position: center;
		background-size: cover;
		width: 64px;
		height: 64px;
		display: inline-block;
	}

	.no-close .ui-dialog-titlebar-close {
		display: none;
	}

	#breadcrumb-menu {
		padding: 0.5em 1em;
		margin: 0px;
		background: #323232;
		color: #ffffff;
		font-size: 130%;
	}

	#breadcrumb-menu > a {
		color: #ffffff;
	}

	#breadcrumb-menu > a:hover {
		color: #cfcfcf;
	}

	body[data-controller=WorkOrders] #breadcrumb-menu, body[data-controller=WorkOrders] th, body[data-controller=WorkOrders] .block h2, body[data-controller=WorkOrders] .button {
		background: #c0392b;
	}

	body[data-controller=WorkOrderItems] #breadcrumb-menu, body[data-controller=WorkOrderItems] th, body[data-controller=WorkOrderItems] .block h2, body[data-controller=WorkOrderItems] .button {
		background: #c0392b;
	}

	body[data-controller=WorkOrderItemImages] #breadcrumb-menu, body[data-controller=WorkOrderItemImages] th, body[data-controller=WorkOrderItemImages] .block h2, body[data-controller=WorkOrderItemImages] .button {
		background: #c0392b;
	}

	body[data-controller=Stores] #breadcrumb-menu, body[data-controller=Stores] th, body[data-controller=Stores] .block h2, body[data-controller=Stores] .button {
		background: #3498db;
	}

	body[data-controller=BillingAccounts] #breadcrumb-menu, body[data-controller=BillingAccounts] th, body[data-controller=BillingAccounts] .block h2, body[data-controller=BillingAccounts] .button {
		background: #1abc9c;
	}

	body[data-controller=Users] #breadcrumb-menu, body[data-controller=Users] th, body[data-controller=Users] .block h2, body[data-controller=Users] .button {
		background: #8e44ad;
	}

	body[data-controller=Manufacturers] #breadcrumb-menu, body[data-controller=Manufacturers] th, body[data-controller=Manufacturers] .block h2, body[data-controller=Manufacturers] .button {
		background: #e67e22;
	}
	
	body[data-controller=Payments] #breadcrumb-menu, body[data-controller=Payments] th, body[data-controller=Payments] .block h2, body[data-controller=Payments] .button {
		background: #27ae60;
	}

	body[data-action=dashboard] #breadcrumb-menu, body[data-action=dashboard] th, body[data-action=dashboard] .block h2, body[data-action=dashboard] .button {
		background: #323232;
	}

	body[data-action=login] #breadcrumb-menu, body[data-action=login] th, body[data-action=login] .block h2, body[data-action=login] .button {
		background: #323232;
	}

	body[data-prefix=customer] #breadcrumb-menu, body[data-prefix=customer] th, body[data-prefix=customer] .block h2, body[data-prefix=customer] .button {
		background: #c0392b;
	}

	body[data-controller=Invoices] #breadcrumb-menu, body[data-controller=Invoices] th, body[data-controller=Invoices] .block h2, body[data-controller=Invoices] .button {
		background: #6ebc1a;
	}
	
	.ui-autocomplete {
		z-index: 9999;
	}
	
	.input .description {
		font-size: 9px;
		padding: 2px;
		background: #efefef;
		display: table;
	}

	.enable-disable-link .glyphicon-ok-circle {
		color: #10ca00
	}

	.enable-disable-link .glyphicon-remove-circle {
		color: #ca1000
	}

	table .glyphicon {
		font-size: 120%;
	}

	.glyphicon.false {
		opacity: 0.2;
	}
	
	.negative {
		color: #c0392b;
	}
	
	.positive {
		color: #27ae60;
	}
	
	#user-menu a.unread {
		animation: blink-red 1s steps(3, start) infinite;
	}
	
	tr.unread {
		font-weight: bold;
	}
	
	tr.message-type-admin {
		color: #2ecc71;
	}
	
	tr.message-type-system {
		color: #e74c3c;
	}
	
	.sender-store {
		font-size: 0.7em;
	}
	
	#message-entities tr td {
		height: 3em;
		line-height: 0.9em;
	}
}

@keyframes blink-red {
	to { color: #ff0000; }
}

@media print {
	body {
		font-size: 10px;
	}
	
	header {
		display: none;
	}
	
	#breadcrumb-menu {
		display: none;
	}
	
	form {
		display: none;
	}
	
	.print-link {
		display: none;
	}
	
	iframe {
		display: none;
	}
	
	table {
		border: 1px solid #000000;
	}
	
	tr {
		border-right: 1px solid #000000;
		border-bottom: 1px solid #000000;
	}
	
	td {
		border-left: 1px solid #000000;
		border-top: 1px solid #000000;
	}
	
	.button {
		display: none;
	}
}