/**
 * standard style sheet
 *
 * @author Stefan Pöhner <programming@poehner24.de>
 * @version 1
 */

/**********************************************************/
/* COLORS
magenta: #c06
/COLORS */
/**********************************************************/

@charset "UTF-8";

/***********************************************************/
/* GLOBAL RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q,
s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}

/* remember to define focus styles! */
:focus { outline: 0; }
body {
line-height: 1;
color: black;
background: white;
}

ol, ul {
list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}

caption, th, td {
text-align: left;
font-weight: normal;
}

blockquote:before, blockquote:after, q:before, q:after {
content: "";
}

blockquote, q {
quotes: "" "";
}
/* /GLOBAL RESET */
/***********************************************************/


/**********************************************************/
/* GENERAL */
body {
color: #000;
font-size: 10pt;
font-family: Arial,Tahoma,Helvetica,sans-serif;
background-color: #ffffff;
}

table {
margin: auto;
border-spacing: 4px;
}

th {
font-weight: bold;
text-align: center;
}

h1 {
margin: 0 auto;
margin-bottom: 15px;
text-align: center;
font-size: 14pt;
font-weight: bold;
color: #000;
}

h2 {
font-size: 14pt;
font-weight: bold;
margin: 5px;
color: #c06;
}

h3 {
font-size: 12pt;
font-weight: bold;
}

a, a:link, a:active, a:visited {
color: #c06;
text-decoration: underline;
border: 0;
}

a:hover {
color: #c06;
border: 0;
}

ul {
}

.i {
font-style: italic !important;
}

fieldset {
border: 0;
}

pre {
font-size: 10pt;
}

form {
padding: 5px;
}

input, select, textarea, button {
padding-left: 3px;
border: 1px solid #c06;
background: #fff;
}

.link {
cursor: pointer;
}

.clear {
clear: both;
}

.red {
color: #f00;
}

#myself {
margin-top:40px !important;
}

table.listing {
border-spacing: 0;
border-collapse: collapse;
}

table.listing tr.alter {
background: #eee;
}

table.listing tr:hover > td {
background: #bbb;
}

table.listing td, table.listing th {
padding: 3px;
font-size: 9pt;
text-align: center;
}
/* /GENERAL */
/**********************************************************/


/**********************************************************/
/* FIREFOX SPECIFIC */
a:active {
outline: none;
}

a:focus {
-moz-outline-style: none;
}
/* /FIREFOX SPECIFIC */
/**********************************************************/


/**********************************************************/
/* POSITIONS */
.l {
text-align: left !important;
}

.c {
text-align: center !important;
}

.r {
text-align: right !important;
}
/* /POSITIONS */
/**********************************************************/


/**********************************************************/
/* CHECKBOX */
img.checkbox {
margin-bottom: -2px;
cursor: pointer;
}
/* /CHECKBOX */
/**********************************************************/


/**********************************************************/
/* INPUT */
input[readonly] {
background: #f4f4f4;
}
/* /INPUT */
/**********************************************************/


/**********************************************************/
/* PAGE */
div#page {
margin: 0 auto;
width: 980px;
}

#transparentLayer {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
background: url('images/transparent40.png');
}

#layerContent {
position: relative;
margin: 0 auto;
margin-top: 50px;
padding: 20px;
width: 800px;
min-height: 350px;
z-index: 100;
background: #fff;
}

#layerCancel {
position: absolute;
top: 15px;
right: 15px;
width: 20px;
}
/* /PAGE */
/**********************************************************/


/**********************************************************/
/* LINKS */
a.normal, a.normal:link, a.normal:active, a.normal:visited, a.normal:hover {
color: #0000ff;
text-decoration: underline;
}

a.magenta, a.magenta:link, a.magenta:active, a.magenta:visited {
color: #666;
text-decoration: none;
}

a.magenta:hover {
color: #c06;
}

a.onlyUnderline {
	color: inherit;
	text-decoration: underline;
}
/* /LINKS */
/**********************************************************/


/**********************************************************/
/* BUTTON */
img.button {
border: 0;
cursor: pointer;
}
/* /BUTTON */
/**********************************************************/


/**********************************************************/
/* HEADER */
#header {
padding-top: 10px;
}

#header .logo {
float: left;
width: 219px;
}

#info {
float: right;
border: 1px solid #aaa;
}

#info table {
font-size: 9pt;
}

#info .r {
text-align: right;
}

#info .l {
padding-right: 10px;
}

#menu {
clear: both;
margin-top: 60px;
background: none;
}

#menu1 {
padding: 2px;
font-size: 10pt;
background: #c06;
}

#menu2 {
margin-top: 4px;
font-size: 9pt;
background: #fff;
}

#menu1 a, #menu1 a:link, #menu1 a:visited, #menu1 a:active {
margin: 10px;
font-variant: small-caps;
font-weight: bold;
color: #fff;
text-decoration: none;
}

#menu2 a, #menu2 a:link, #menu2 a:visited, #menu2 a:active {
margin: 10px;
font-variant: normal;
font-weight: bold;
color: #000;
}

#menu a:hover {
text-decoration: underline;
}

#menu span.right {
float: right;
margin-top: 0;
}
/* /HEADER */
/**********************************************************/


/**********************************************************/
/* MESSAGES */
#messages {
position: absolute;
top: 0;
right: 0;
padding: 3px;
font-size: 9pt;
border: 1px solid #aaa;
}

#errors {
position: absolute;
top: 0;
right: 0;
padding: 3px;
font-size: 9pt;
color: #c22;
border: 1px solid #aaa;
}

#messageBox {
display: none;
position: absolute;
top: 0;
left: 0;
z-index: 1000;
width: 100%;
height: 100%;
background: url('images/transparent.png');
}

#messageBox .inner {
margin: 100px auto;
width: 300px;
height: 120px;
padding: 20px;
text-align: center;
background: #f0f0f0;
border: 1px solid #c06;
}

#messageBox p {
margin-top: 30px;
}

#messageBox form {
margin-top: 30px;
}
/* /MESSAGES */
/**********************************************************/


/**********************************************************/
/* MAIN */
div#main {
position: relative;
margin-top: 20px;
min-height: 500px;
}

div.helpBox {
display: none;
position: absolute;
top: 0;
right: 0;
width: 220px;
padding: 3px;
font-size: 9pt;
text-align: justify;
border: 1px solid #aaa;
}
/* /MAIN */
/**********************************************************/


/**********************************************************/
/* FOOTER */
/* /FOOTER */
/**********************************************************/


/**********************************************************/
/* SEARCHFORM */
#search {
position: relative;
margin: 20px;
text-align: center;
border: 1px solid #aaa;
}

#search select, #search input {
font-size: 9pt;
border: 1px solid #c06;
background: #fff;
}

#search #sSelect {
font-weight: bold;
}

#search input[type=submit] {
width: 75px;
}

#search input[type=text] {
width: 200px;
padding: 1pt 5px;
}

#search #sSelectValue {
width: 212px;
}

#search #sTextValue, #search #sSelectValue {
display: none;
}

#search #sLoading {
	display: none;
	position: absolute;
	top: 5px;
	right: 5px;
	width: 20px;
}
/* /SEARCHFORM */
/**********************************************************/


/**********************************************************/
/* OVERVIEW */
#overviewOrders {
position: relative;
float: right;
width: 300px;
min-height: 500px;
text-align: center;
border: 1px solid #aaa;
}

#overviewOrders table {
margin-top: 10px;
border-collapse: collapse;
font-size: 9pt;
}

#overviewOrders tr.order {
cursor: pointer;
}

#overviewOrders tr.order:hover {
background: #c06;
}

#overviewOrders td {
padding: 2px 4px;
text-align: center;
}

#overviewOrders .price {
text-align: right;
}

#overviewChangeOrder {
position: relative;
font-size: 10pt;
}

#overviewChangeOrder h2 {
margin-bottom: 30px;
}

#overviewChangeOrder h2 a {
color: inherit;
text-decoration: underline;
}

#overviewCostEstimate {
position: absolute;
top: 15px;
left: 287px;
font-size: 10pt;
}

#overviewInvoice {
position: absolute;
top: 15px;
left: 370px;
font-size: 10pt;
}

#overviewChangeOrder table {
margin: 0;
width: 260px;
border-spacing: 15px 5px;
border: 1px solid #c06;
}

#overviewChangeOrder textarea {
width: 260px;
height: 100px;
}

#overviewChangeOrder .box {
margin-top: 30px;
}

#overviewChangeOrder .statusBox {
width: 240px;
padding: 10px;
border: 1px solid #c06;
}

.orderStateBtn {
margin: 0px 5px;
}

#overviewNewPayment {
width: 60px;
padding: 0;
text-align: center;
}

#overviewOrderCustomer {
position: absolute;
top: 61px;
right: 10px;
width: 150px;
}

#overviewOrderCustomer p {
margin-bottom: 30px;
padding: 10px;
border: 1px solid #c06;
}

#overviewOrderItems {
position: absolute;
top: 60px;
left: 287px;
}

#overviewOrderItems table {
width: 330px;
border-spacing: 0 5px;
border: 1px solid #c06;
}

#overviewOrderItems tr:hover >td {
background: #eee;
}

#overviewOrderItems td {
padding: 0 2px;
text-align: center;
vertical-align: middle;
}

#overviewOrderItems th.d {
}

#overviewOrderItems th.q {
width: 30px;
}

#overviewOrderItems th.w {
width: 70px;
}

#overviewOrderItems th.h {
width: 70px;
}

#overviewOrderItems th.p {
width: 70px;
}

#overviewUpdating {
display: none;
position: absolute;
bottom: 10px;
right: 10px;
font-style: italic;
font-size: 10pt;
}

.today {
background: #f88;
}

.tomorrow {
background: #fc0;
}

.days {
background: #fff;
}

.statusBox .statusBtn {
width: 110px;
margin: 5px;
}

.statusBox input.b {
font-weight: bold;
}

#overviewBilling, #overviewDelivery {text-decoration:underline; cursor:pointer; margin-bottom:2px;}


/* ANNOUNCEMENTS */
#announceForm {
position: absolute;
left: 0;
bottom: 0;
width: 650px;
border: 1px solid #aaa;
}

#announcements {
border: 1px solid #c06;
}

#announcements p.announce {
margin: 7px 10px;
font-size: 9pt;
}

#announcements .date {
font-style: italic;
}

#announcements .user {
margin-left: 5px;
font-weight: bold;
}

#announcements .message {
margin-left: 5px;
}

#announcements .delete {
float: right;
width: 11px;
cursor: pointer;
}

#announceForm .input {
margin-top: 5px;
}

#announceForm #announceText {
margin: 0;
width: 580px;
}

#announceForm #announceSendBtn {
margin: 0;
width: 61px;
}
/* /ANNOUNCEMENTS */

/* CUSTOMER SEARCH */
#customerSearch #searchAllOrders {
position: absolute;
top: 7px;
left: 10px;
}

#customerSearch table {
font-size: 9pt;
max-width: 650px;
}

#customerSearch #search {
position: relative;
margin: 0px;
width: 650px;
text-align: center;
border: 1px solid #aaa;
}

#customerSearch td {
padding: 0 5px;
}

#customerSearch td.price {
text-align: right;
}
/* /CUSTOMER SEARCH */
/* /OVERVIEW */
/**********************************************************/


/**********************************************************/
/* LOGIN */
#login {
margin: 150px auto;
width: 300px;
border: 1px solid #c06;
background: #f5f5f5;
}

#login h2 {
text-align: center;
}

#login td[colspan] {
text-align: right;
}

#login input {
border: 1px solid #c06;
background: #fff;
}
/* /LOGIN */
/**********************************************************/


/**********************************************************/
/* MANAGE EMPLOYEES */
#newForm input {
width: 180px;
padding: 0 5px;
}

#newForm #newEmail {
padding-top: 2pt;
font-size: 8pt;
}

#newForm select {
width: 192px;
}

#newForm #newRights select {
margin-bottom: 2px;
}

#newForm .formBtn  {
width: 80px;
}

#newForm table {
border-spacing: 5px;
font-size: 10pt;
border: 1px solid #c06;
}

#newForm #newIdInfo img {
	width: 10px;
}

#newForm td[colspan] {
text-align: center;
}

#manage table#tList {
width: 100%;
font-size: 9pt;
border-collapse: collapse;
}

#list tr:hover {
background: #eee;
}

#list td {
padding: 5px;
text-align: center;
}

#list .salutation, #list .firstname, #list .lastname, #list .email, #list phone, #list .department, #list .store, #list .state, #list .lastlogin, #list .loginattempts {
}

#list .rights {
text-align: left;
}
/* /MANAGE EMPLOYEES */
/**********************************************************/


/**********************************************************/
/* PRODUCTS */
#formulaInput {
display: none;
position: absolute;
top: 0;
left: 0;
z-index: 99;
width: 100%;
height: 400px;
background: url('images/transparent.png');
}

#formulaSelection {
text-align: center;
}

#formulaSelection ul {
margin: 0 auto;
width: 200px;
border: 1px solid #c06;
background: #f0f0f0;
}

#formulaInput table, #formulaInput div, #formulaInput h3 {
margin: 0 auto;
padding: 10px 0;
width: 500px;
background: #f0f0f0;
}

#formulaInput ul {
border: 1px solid black;
}

#formulaInput li {
margin: 4px;
cursor: pointer;
}

#formulaInput div input {
margin: 10px;
}

#formulaInput input.formulaVarVal {
width: 60px;
margin-right: 4px;
}

#formulaInput td {
text-align: center;
}

#formulaInput td[colspan] {
text-align: center;
}

#formulaSubmit {
float: right;
}

#productDeleteBtn {
margin-right: 20px;
}

#newForm .productAddBtn {
width: 50px;
}
/* /PRODUCTS */
/**********************************************************/


/**********************************************************/
/* NEW ORDER */
#order {
position: relative;
}

#orderInfoContainer {
position: absolute;
top: 37px;
right: 0;
width: 220px;
}

#order .box {
margin-bottom: 30px;
width: 600px;
padding: 10px;
border: 1px solid #c06;
}

#orderConditions input {
	width: 130px;
	text-align: center;
}

#orderConditions select {
	width: 135px;
}

#orderInfoContainer .box {
width: 200px;
}

#orderCustomer {
height: 70px;
}

#orderCustomer div {
width: 200px;
text-align: center;
}

#orderNewCustomer {
float: left;
}

#orderExistingCustomer {
float: right;
}

#orderCustomer input[type=button] {
margin-top: 5px;
}

#orderNewCustomerDiv {
	margin-top: 30px;
}

#orderNotes textarea {
width: 595px;
height: 80px;
border: 1px solid #aaa;
}

#orderInfoCustomer {
display: none;
}

#orderInfoCustomer p, #orderInfoDelivery p {
margin-top: 10px;
font-size: 9pt;
}

#orderInfoSearchCustomerDiv {
	position: absolute;
	top: 15px;
	right: 3px;
}

#orderInfoDelivery select, #orderInfoDelivery input[type=button] {
font-size: 7pt;
}

#orderMustHaves, #orderCanHaves {
	display: none;
}

#orderInfoPrice table {
	border: 0;
}

#orderProducts{
position: relative;
}

.orderProduct {
position:relative;
margin-top: 10px;
padding: 5px;
border: 1px solid #aaa;
}

.subsetNote {
width: 583px;
border: 1px solid #aaa;
}

#orderAddProduct {
position: absolute;
top: 15px;
right: 10px;
}

.orderConfigureBtn { position:absolute; top:5px; right:5px; width:65px; }
.orderDeleteBtn { position:absolute; top:5px; right:75px; width:65px; }
.qty { position:absolute; top:5px; right:145px; }

.qty input {
width: 40px;
text-align: center;
}

.orderConfig {
padding: 10px;
}

.orderConfig table {
width: 100%;
border-spacing: 0 5px;
}

.orderConfig table td {
padding: 5px;
vertical-align: middle;
border-bottom: 1px solid;
border-top: 1px solid;
}

.orderConfig .item {
border-left: 1px solid;
}

.orderConfig .uses {
text-align: right;
border-right: 1px solid;
	vertical-align: top;
}

.free-description-input {
	width:100%;
	height:50px;
}

.orderConfig .uses input {
width: 50px;
padding: 0 5px;
font-size: 10pt;
text-align: center;
}

.orderConfig .uses .downBtn {
margin: 0 10px -4px 0;
width: 18px;
}

.orderGalleryCheck { display: none; position:absolute; top:5px; right:260px; }
.orderGalleryCheck input { margin-left: 6px; }

.orderPositionDiscount input { width:40px; }

#layerContent .categories {
float: left;
}

#layerContent .productList {
float: left;
margin-left: 20px;
width: 200px;
}

#layerContent .categories select, #layerContent .productList select {
width: 250px;
}

#layerContent .selected {
position: absolute;
left: 10px;
bottom: 10px;
}

#orderConfigAccept {
display: none;
position: absolute;
right: 10px;
bottom: 10px;
}

input#orderAddCoupon {
width: 40px;
margin-left: 5px;
}

/* /NEW ORDER */
/**********************************************************/


/**********************************************************/
/* CONFIRM ORDER */
#confirmDiv {
}

#confirmDiv table {
	border-spacing: 0;
	border-collapse: collapse;
}

#confirmDiv td {
	padding: 5px 10px;
}

#confirmDiv .total td {
	font-weight: bold;
	border-top: 1px solid black;
}

#confirmDiv .vat td {
font-weight: bold;
padding-bottom: 30px;
}

#confirmDiv .downpayment td {
border-top: 1px solid black;
}

#confirmDiv .due td {
font-weight: bold;
}

#confirmDiv table.itemDescription {
margin: 0 5px;
}

#confirmDiv table.itemDescription td {
padding: 0 3px;
}

#confirmDiv table.itemDescription td.r {
width: 50px;
}
/* /CONFIRM ORDER */
/**********************************************************/


/**********************************************************/
/* MANAGE CUSTOMERS */
#newForm .customerDeleteBtn {
float: left;
width: 100px;
}

#newForm .customerSubmitBtn {
float: right;
width: 100px;
}

#newForm input[type=checkbox] {
margin-left: 0;
width: 15px;
}

#customerOrders h3 {
margin: 0 auto;
text-align: center;
}

#customerOrders table {
margin: 30px auto;
font-size: 9pt;
border-collapse: collapse;
border-spacing: 0;
}

#customerOrders tr.alter {
background: #eee;
}

#customerOrders tr:hover > td {
background: #aaa;
}

#customerOrders td, #customerOrders th {
padding: 3px;
text-align: center;
}
/* /MANAGE CUSTOMERS */
/**********************************************************/


/**********************************************************/
/* LOGS */
#logs table {
margin-top: 30px;
border-collapse: collapse;
}

#logs table td {
font-size: 9pt;
}

#logs table td.date {
width: 122px;
}
/* /LOGS */
/**********************************************************/


/**********************************************************/
/* CASH ONLY */
#cashonly table {
width: 100%;
table-layout: fixed;
border-collapse: collapse;
}

#cashonly td, #cashonly th {
padding: 4px 0;
font-size: 8pt;
text-align: center;
vertical-align: middle;
}

#cashonly tr.alter {
background: #eee;
}

#cashonly tr:hover > td {
background: #aaa;
}

#cashonly input[type=checkbox] {
margin-right: 11px;
}

#cashonly input[type=submit] {
float: right;
}
/* /CASH ONLY */
/**********************************************************/


/**********************************************************/
/* CREATE INVOICES */
#createInvoices table {
width: 100%;
table-layout: fixed;
border-collapse: collapse;
}

#createInvoices h3 {
text-align: center;
margin-bottom: 30px;
}

#createInvoices td, #createInvoices th {
padding: 4px 0;
font-size: 8pt;
text-align: center;
vertical-align: middle;
}

#createInvoices tr.alter {
background: #eee;
}

#createInvoices tr:hover > td {
background: #aaa;
}

#createInvoices div {
margin: 30px auto;
text-align: center;
}
/* /CREATE INVOICES */
/**********************************************************/


/**********************************************************/
/* ACCOUNTING */
#accounting h3 {
margin: 0 auto;
text-align: center;
}

#accountingTable {
margin: 30px auto;
font-size: 9pt;
border-collapse: collapse;
border-spacing: 0;
}

#accountingTable tr.alter {
background: #eee;
}

#accountingTable tr:hover > td {
background: #aaa;
}

#accountingTable td, #accountingTable th {
padding: 3px;
text-align: center;
}


#sales table {
width:100%;
border-collapse: separate;
border-spacing: 10px;
}

#sales table td {
text-align: center;
}
/* /ACCOUNTING */
/**********************************************************/