/**
 * CSS Definitionen fuer den geschuetzten Bereich
 *
 * @copyright www.lemontree.at
 * @author Gerhard Buchecker <gbuchecker@lemontree.at>
 *
 *********************************************************************************/

/*--------------------------------------------------------------------------------*/

.customer_menu {
    padding: 10px 0 0 0;
    text-align: center;
    /* border-bottom: 1px solid #cccccc; */
}
.customer_menu div.item {
    display: inline-block;
}
.customer_menu a {
    padding: 5px 12px;
    margin-bottom: 5px;
    background-color: #eeeeee;
    display: inline-block;
}
.customer_menu a:hover, .customer_menu a.active, .customer_menu a.active:hover {
    text-decoration: none;
    background-color: #3c3b6e;
    color: #ffffff;
}

.customer_content {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}
.no_access_subheader {
    font-weight: bold;
    margin-top: 25px;
}

.right {
    text-align: right;
    float: none !important;
    margin: 0! important;
}

.clear {
    clear: both;
}
.nowrap {
    white-space: nowrap;
}
.off {
    display: none;
}
.float_left {
    float: left;
}
.float_right {
    float: right;
}
.float_none {
    float: none;
}
.valign_middle {
    vertical-align: middle !important;
}

a.forward::before {
    content: " \00BB  ";
}
a.forward:hover {
    text-decoration: underline;
}
.alert {
    color: #FF0000;
}
.caution {
    color: #fe5b00;
}

/*--------------------------------------------------------------------------------*/

table.formular {
    background-color: transparent;
    margin: 20px auto 20px auto;
    text-align: left;
}

table.formular tr.fehler {
    background-color: #cccccc;
}

table.formular tr.sc { /* verstecktes Feld als Spamschutz */
    display: none;
}

table.formular td {
    padding: 1px 1px 1px 5px;
    vertical-align: top;
}

table.formular th {
    padding: 4px 5px 1px 5px;
    font-weight: bold;
    text-align: left;
    vertical-align: top;
    width: 165px;
}

table.formular th.login {
    width: 80px !important;
    font-weight: normal;
}
table.formular th.balance_list {
    width: auto;
    white-space: nowrap;
}

table.formular tr.fehler th {
    color: #cc0000;
}

table.formular td.bezeichnung {
    font-weight: bold;
    background-color: #bccee2;
    padding: 4px 2px 4px 5px;
}

table.formular td.abschnitt {
    padding: 20px 10px 5px 5px;
    font-weight: bold;
}

table.formular td.text {
    padding: 5px 10px 15px 5px;
    font-weight: normal;
}


table.formular td.item {
    background-color: #eeeeee;
}

table.formular td.alert,
table.formular tr.alert a {
    color: #FF0000 !important;
}
table.formular td.alert_icon {
    background-image: url(../../images/alert.png);
    background-repeat: no-repeat;
    background-position: 3px center;
    width: 10px;
}
table.formular td.caution {
    color: #fe5b00;
}
table.formular td.caution_icon {
    background-image: url(../../images/caution.png);
    background-repeat: no-repeat;
    background-position: 3px center;
    width: 10px;
}

table.formular td input {
    font-size: inherit;
}
table.formular td input.standard {
    width: 250px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: inherit;
    padding: 3px 3px;
}
table.formular td input.small {
    width: 150px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: inherit;
}
table.formular td input.medium {
    width: 175px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: inherit;
}
table.formular td textarea {
    width: 98%;
    height: 150px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: inherit;
}
table.formular td select {
    font-family: Arial, Helvetica, sans-serif;
    font-size: inherit;
    padding: 3px 3px;
}

table.formular td div.standard {
    width: 300px;
    padding: 3px 1px;
    background-color: #eeeeee;
}
table.formular td div.components {
    padding: 0;
}
table.formular td div.components input {
    margin: 2px 0;
}
table.formular td div.info {
    width: 250px;
    padding: 5px 0 5px 0;
    color: #888888;
}
table.formular td div.money {
    width: 125px;
    padding: 3px 1px;
    background-color: #eeeeee;
    text-align: right;
}
table.formular td div.eb_date {
    width: 125px;
    padding: 3px 1px;
    background-color: #eeeeee;
    text-align: right;
}
table.formular td div.sum {
    border-top: 1px solid #000000;
    padding: 3px 2px 3px 0;
    text-align: right;
}
table.formular td div.balanceOfProduct {
    border-top: 1px solid #000000;
    padding: 3px 2px 3px 0;
    text-align: right;
}
table.formular td div.balanceOfProduct.money {
    width: 125px;
    padding: 3px 1px;
    text-align: right;
    background-color: transparent;
    border-top: 1px solid #000000;
}

table.formular td input.submit,
table.formular td input.delete {
    margin: 0 0 5px 0;
    float: left;
}
table.formular td input.reset {
    margin: 0 0 5px 0;
    float: right;
}
table.formular td input.change,
table.formular td input.delete,
table.formular td input.delete_row {
    padding-left: 3px;
    padding-right: 3px;
    margin: 0 0 0 1px;
}
table.formular td input.delete,
table.formular td input.delete_row {
    border: 1px solid #3c3b6e;
    color: #3c3b6e;
    background-color: rgb(240,240,240);
}
table.formular td {
    position: relative;
}
table.formular td div.program_type {
    width: 120px;
    display: inline-block;
}
table.formular td div.program_info {
    width: 175px;
    display: inline-block;
}
table.formular td.percent_info {
    font-weight: normal;
    font-size: 85%;
    vertical-align: middle;
    text-align: right;
}

.hidden {
    display: none;
}

.graph {
    text-align: center;
    padding: 0;
}
.graph img {
    margin: 20px 0;
}
.graph_link {
}


/*--------------------------------------------------------------------------------*/
/* EndingBalance, Portfolio, Kundenliste und Mailingliste */

form[name=formEndingBalance] table.formular th {
    width: auto;
}

form[name=formCustomerList] table.formular th,
form[name=formMailingList] table.formular th {
    width: auto;
    padding: 3px 5px;
}
form[name=formCustomerList] table.formular td, form[name=formMailingList] table.formular td {
    padding: 2px 5px;
}
form[name=formCustomerList] table.formular a:hover,
form[name=formMailingList] table.formular a:hover,
form[name=formEndingBalanceSearch] table.formular a:hover {
    text-decoration: underline;
}
form[name=formCustomerList] table.formular tr:hover,
form[name=formMailingList] table.formular tr:hover {
    background-color: #eeeeee;
}

form[name=formComissionList] table.formular th {
    width: auto;
    padding: 3px 10px 3px 5px;
}
form[name=formComissionList] table.formular td {
    padding: 2px 10px 2px 5px;
}

form[name=formComissionSearch] label[for=fieldPeriod] {
    font-weight: bold;
    padding-right: 10px;
}
form[name=formDepositsList] table.formular th {
    width: auto;
    padding: 3px 10px 3px 5px;
}
form[name=formDepositsList] table.formular td {
    padding: 2px 10px 2px 5px;
}
form[name=formDepositDetailsList] table.formular th {
    width: auto;
    padding: 3px 10px 3px 5px;
}
form[name=formDepositDetailsList] table.formular th.right {
    text-align: right;
}
form[name=formDepositDetailsList] table.formular td {
    padding: 2px 10px 2px 5px;
    white-space: nowrap;
}
form[name=formDepositDetailsList] table.formular td.text {
    padding: 0 0 20px 0;
    text-align: center;
}

form[name=formDepositsSearch] label[for=fieldPeriod] {
    font-weight: bold;
    padding-right: 10px;
}

form[name=formCustomer] #divTransferFrom,
form[name=formCustomer] #divTransferInto {
    padding: 1px 0;
}
form[name=formCustomer] #divTransferFrom select,
form[name=formCustomer] #divTransferInto select {
    width: auto;
}
form[name=formCustomer] label[for=fieldTransferFrom],
form[name=formCustomer] label[for=fieldTransferInto] {
    display: inline-block;
}
form[name=formCustomer] #divTransferAmount div {
    width: 120px;
    display: inline-block;
    padding: 0 4px 2px 0;
}
form[name=formCustomer] #divTransferAmount div input {
    width: 120px;
}

form[name=formTransfer] th {
    width: 115px;
}
form[name=formTransfer] #divTransferFrom,
form[name=formTransfer] #divTransferInto {
    padding: 1px 0;
}
form[name=formTransfer] #divTransferFrom select,
form[name=formTransfer] #divTransferInto select {
    width: auto;
}
form[name=formTransfer] label[for=fieldTransferFrom],
form[name=formTransfer] label[for=fieldTransferInto] {
    display: inline-block;
}
form[name=formTransfer] #divTransferAmount div {
    width: 120px;
    display: inline-block;
    padding: 0 4px 2px 0;
}
form[name=formTransfer] #divTransferAmount div input {
    width: 120px;
}

form[name=formSettings] table.formular tr th {
    width: auto;
}

/*--------------------------------------------------------------------------------*/
/* Statementliste */

div.graphs {
    text-align: center;
}

div.statements {
    width: 80%;
    max-width: 840px;
    margin: 0 auto 20px auto;
}

/*--------------------------------------------------------------------------------*/

.messageBox {
    padding: 5px;
    margin: 10px 0 10px 0;
    border:1px solid #C1C1C1;
    background-color: #dddddd;
    color: #666666;
    text-align: center;
}

.messageBox div, .messageBox div.li {
    margin: 0;
    padding: 0;
    color: #666666;
}

.messageBoxError {
    padding: 5px;
    margin: 10px 0 10px 0;
    border:1px solid #cc0000;
    background-color: #eeeeee;
    color: #cc0000;
    text-align: center;
}

.messageBoxError div {
    margin: 0 0 0 0;
    color: #cc0000;
}

.messageBoxError div.li {
    color: #cc0000;
    text-indent: -9px;
    margin: 0 0 0 9px;
}

.messageBoxError a {
    color: #cc0000;
    text-decoration: underline;
}

/*--------------------------------------------------------------------------------*/

.gblib_messagebox,
.gblib_messagebox_error {
    margin-top: 1em;
}
.gblib_messagebox button.close,
.gblib_messagebox_error button.close {
    background-color: transparent;
}

/*--------------------------------------------------------------------------------*/
/* Media Queries  */

@media only screen and (max-width:750px) {
    table.formular td input.standard {
        width: 100%;
    }

    form[name=formCustomerSheets] table.formular th,
    form[name=formCustomerSheets] table.formular td {
        display: block;
        width: auto;
    }

    form[name=formPassword] table.formular th,
    form[name=formPassword] table.formular td {
        display: block;
        width: auto;
    }

    .statements table td {
        width: auto;
        display: block;
    }
}

/*--------------------------------------------------------------------------------*/