#-access-form-login input[name^="login-"],
#-access-form-login input[type=password],
#form-primary input,
#form-primary input[type="text"],
#form-primary select,
#form-primary textarea
{
    box-sizing: border-box;
    padding: 2px 4px;
}

#form-primary input[type="text"].amount{
    text-align: right;
}

#form-primary input[type="text"].error,
#form-primary select.error, 
#form-primary textarea.error {
    border: 1px solid red;
    background-color: #FFFCE2;
    background-image: url(../images/warning_obj.gif);
    background-position: left;
    background-repeat: no-repeat;
    padding-left: 15px;
}
    
#form-primary input[type="text"].warn,
#form-primary select.warn, 
#form-primary textarea.warn {
    border: 1px solid blue;
    background-color: #F0F1FF;
    background-image: url(../images/message_info.gif);
    background-position: left;
    background-repeat: no-repeat;
    padding-left: 15px;
    width: 385px;
}

#form-primary div.subSection>div:after,
#form-primary div.mainWrapper>div:after,
#form-primary div.mainWrapper>div.subSection-left>div:after
{
    /* each div corresponds to one single row of a form */
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

#form-primary div.subSection>div>label,
#form-primary div.mainWrapper>div>label,
#form-primary div.mainWrapper>div>div.optional>label,
#form-primary div.mainWrapper>div.subSection-left>div>label
{
    display:block;
    float:left;
    
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 5px;
    padding-right: 5px;
    text-align:right;    
    
    width:200px;
    font-weight:bold;
    vertical-align: top;

    margin-top:2px; /* changes based on overall font-size (!) */
}

#form-primary textarea[disabled], 
#form-primary input[type="text"][disabled], 
#form-primary select[disabled]
{ 
    color: #000; 
    background-color: #F1F3FF;
}

#form-primary
{
    color: white;
}

#form-primary .input-form .form-field
{
    margin-bottom: 4px;
}

#form-primary .input-form .field-label
{
    display: inline-block;
    height: 100%;
    margin-right: 5px;
    padding-top: 5px;
    vertical-align: top;
}

#form-primary .input-form .field-input
{
    display: inline-block;
    height: 100%;
    padding: 0px;
    width: auto;
}

#form-primary .input-form .field-input input[type="text"][name^="row-"]
{
    min-width: 200px;
    width: auto;
}

#form-primary input.eselect {
	background-image: url(../images/eselect/cmbbtn_out.gif);
	background-position: right;
	background-repeat: no-repeat;
	padding-right: 15px;
	width: 385px;
}

#form-primary input.eselect:hover {
	background-image: url(../images/eselect/cmbbtn_over.gif);
}

#form-primary input.calendar {
	background-image: url('../images/cal.png');
	background-position: right;
	background-repeat: no-repeat;
	padding-right: 15px;
	width: 385px;
}

/** preferred form css: table-like: 2-column default: left, right: label + input container **/

body.-css-table-like-form  form  div.section
{
    display:table;
    margin-bottom: 10px;
}

body.-css-table-like-form  form  div.section div.row
{
    /*display:table-row;*/
    padding: 2px;
    margin: 2px;
    vertical-align: middle;
}

    body.-css-table-like-form  form  div.section div.row.row-header
    {
        text-align: center;
        font-weight: bold;
    }       

body.-css-table-like-form  form  div.section div.row > label
{
    display:table-cell;
    vertical-align:middle;

    text-align:right;
    padding-right:10px;
    
    width:20%;
    min-width:150px;
}

    body.-css-table-like-form  form  div.section div.row div label /* no need min width for inner labels */
    {
        min-width: 0;
    }   

body.-css-table-like-form  form  div.section div.row > div
{
    display:table-cell;
    vertical-align:middle;

    width:80%;
}  

/** table-like: 3 column layout **/

body.-css-table-like-form  form  div.section.column-3 div.row > label
{
    display:table-cell;
    width:10%;
    vertical-align: top;   
}

body.-css-table-like-form  form  div.section.column-3 div.row > div
{
    display:table-cell;
    width: 15%;
    vertical-align: top;    
}   

body.-css-table-like-form  form  div.section.column-3 div.row > div.hidden-div
{
    display:table-cell;
    width: 65%;
    /* visibility: hidden; */
}   

body.-css-table-like-form form div.section.column-3 div.row div.hidden-div > label
{
    display:table-cell;
    width: 15%;
} 

body.-css-table-like-form form div.section.column-3 div.row div.hidden-div > div
{
    display:table-cell;
    width: 15%;    
} 

body.-css-table-like-form form div.section.column-3 div.row > div.hidden-div div.cashflow-div
{
    display: none;
}  

/** table-like: 4 column layout **/
body.-css-table-like-form form div.section.column-4 div.row > div,
body.-css-table-like-form form div.section.column-4 div.row > label
{
    display:table-cell;
    /* width: 25%; */ /* problematic in Chrome */
} 

body.-css-table-like-form #main #content form div.section.column-4 div.row > div.section
{
    display:table-cell;
    width: 25%;
    vertical-align: top;  
}  

body.-css-table-like-form  form#form-primary div.section.column-4 div.row > div input[type="text"]
{
    width: 90%;
}  

/** 6 column layout **/
body.-css-table-like-form  form  div.section.column-6 div.row > label
{
    display:table-cell;
    width:20%;
    vertical-align: top;
}

body.-css-table-like-form  form  div.section.column-6 div.row > div
{
    display:table-cell;
    width: 13%;
    vertical-align: top;
}   

/** table-like: 7 column layout **/

body.-css-table-like-form  form  div.section.column-7 div.row > label
{
    display:table-cell;
    width:10%;
    vertical-align: top;
}

body.-css-table-like-form  form  div.section.column-7 div.row > div
{
    display:table-cell;
    width: 20%;
    vertical-align: top;
}         

body.-css-table-like-form  form  div.section.column-7 div.row > div > div
{
    display: inline-block;
}

/** table-like: 8 column layout **/
body.-css-table-like-form #main #content form div.section.column-8{
    width: 100%;
}     

body.-css-table-like-form form div.section.column-8 div.row > label
{
    display:table-cell;
    width: 5%;
    vertical-align: top;   
    min-width: 0;
}

body.-css-table-like-form #main #content form div.section.column-8 div.row > div.section
{
    display:table-cell;
    width: 13%;
    vertical-align: top;  
}  

body.-css-table-like-form  form#form-primary div.section.column-8 div.row > div input[type="text"]
{
    width: 90%;
}  

/** legend: see also primary.css **/
body.-css-table-like-form  form  div.section.legend{
    margin-top: 10px;
    font-size: 0.909em;
}

body.-css-table-like-form  form  div.section.legend div.row > label /* no need min width for inner labels */
{
    min-width: 0;
    vertical-align: top;
}

body.-css-table-like-form  form  div.section.legend div ul{
    margin: 0;
    list-style-image: none;
    list-style: none;
    padding: 0;
}

body.-css-table-like-form  form  div.section.legend div ul li{
    margin: 0;
    padding: 0;
}

body.-css-table-like-form  form  div.section.legend div label{
    width: 40px;
    display: inline-block;
}

body.-css-table-like-form  form  div.section.legend div span:before{
    content: "-";
    padding-right: 10px;
}

/** table-like: input styles, utility classes, etc */

body.-css-table-like-form form div.section.-invisible
{
    visibility: hidden;
}

body.-css-table-like-form  form  div.section div.row > div a.popup-icon
{
    display: inline-block;
}   

body.-css-table-like-form  form#form-primary div.section div.row > div input[type="text"]
{
    width:50%;
}       

body.-css-table-like-form  form#form-primary div.section.column-3 div.row > div input[type="text"]
{
    width: 95%;
}


body.-css-table-like-form  form#form-primary div.section div.row > div input[type="submit"]
{
    width:100px
}

body.-css-table-like-form  form#form-primary div.section div.row > div input[type="radio"]
{
    width: auto;
}

body.-css-table-like-form  form#form-primary div.section div.row.-autosize-inputs > div input[type="text"]
{
    width:auto;
}

body.-css-table-like-form  form#form-primary div.section div.row > div input[type="text"].-very-short
{
    width:50px;
}

body.-css-table-like-form  form#form-primary div.section div.row.debug.hidden
{
    /* in debug mode, this is overriden, see debug.css */
    display:none;
}

body.-css-table-like-form  form#form-primary div.section div.row.debug.hidden input[type="text"]
{
    /* prevent additional border spacing from debug output from exceeding screen width */
    width:auto;
}

/** preferred form css: table-like: right-side: radio (horizontal + vertical) **/

body.-css-table-like-form  form div.section div.row > div .radio-container-vertical
{
    float:left;
    display:block;
}

body.-css-table-like-form  form div.section div.row > div .radio-container-horizontal
{
    float:left;
    display:block;
}

body.-css-table-like-form  form div.section div.row > div .radio-container-horizontal>div
{
    display:block; 
    float:left;
}

li:not(.ui-tabs-selected):not(.ui-state-active) > a.-tab-with-error
{
    background-color:#ffeaea;
    color:red;
}

li.ui-tabs-selected.ui-state-active > a.-tab-with-error
{
    background-color:red;
    color:white;
}

table.simpleGrid tr th.error {
    border: 1px solid red;
    color: red;
}     

table.transaction-table{
    width: 85%;
    margin: 0 auto;
    margin-bottom: 20px;
}

table.transaction-table tr:hover td{
    background: url(jquery-ui-1.8.17.custom/css/ui-lightness/images/ui-bg_highlight-soft_75_ffe45c_1x100.png) repeat-x; 
}

table.transaction-table th{
    padding: 5px;
    background: #F7B850;
    border: 1px solid #E89516;
    color: #FFFFFF;
    
    border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
}

table.transaction-table td{
    padding: 7px;
    border: 1px solid #CCCCCC;
    background: url(../images/gray_gradient.gif) repeat-x;
    color: #505E67;
}

div.dialogbox{
    display: none;
}

.datagrid{
    margin-bottom: 10px;
}

.simpleGrid td a{
    color: #333333;
}

    .simpleGrid td input[type="text"]{
        width: 95%;
    }            
    
    .simpleGrid td select{
        width: 95%;
    }

input[type="text"].currency{
    text-align: right;
}

.message.spins{
    padding: 3px 0 10px 30px;
    font-size: 0.909em;
}

.visibility-hidden{
    visibility: hidden;
}

.apply-bold{
    font-weight: bold;
}

.apply-left-indent{
    padding-left: 20px;
}

.print-hide{
    margin: 15px 10px 15px 10px;  
}   

    .print-hide a:before{
        content: " + ";
    }
    
    .print-hide a:after{
        content: " + ";
    }

input.hasDatepicker
{
    background: white url('../images/icons/calendarleave.png') no-repeat right center;
    background-size: 20px;
}