body {
    font-family: Arial, Helvetica, sans-serif;
    margin: 0px;
}

#pageMessagePanel
{
    position: absolute;
    top: -100px;

    border: solid #AAAAFF 2px;
    background-color: #EEEEFF;
    padding: 10px;
    color: blue;
    font-weight: bold;
    font-size: 16px;
    transition: top 1s;
    cursor: pointer;
}

#pageMessagePanel.drop
{
    top: 0px;
}

/* ------------------ FORM -----------------------------*/

.formPanel
{
    border: solid #bbbbbb 1px;
    border-radius: 3px;
    background-color: #eeffee;
    display: inline-block;
}

.formPanel .header
{
    font-size: 20px;
    padding: 10px 20px;
    text-align: left;
    background-color: #ddeedd;
    font-weight: bold;
}

.formPanel .errorPanel
{
    border-top: solid #bbbbbb 1px;
    background-color: #ffeeee;
    color: red;
    padding: 10px 20px;
    font-size: 15px;
    text-align: left;
}

.formPanel .formBoxes
{
    background-color: white;
    padding: 20px;
    border-top: solid #bbbbbb 1px;
    border-bottom: solid #bbbbbb 1px;
    text-align: left;
    background-color: #eeffee;
}

.formPanel .formBoxes .formLabel
{
    font-weight: bold;
}

.formPanel .formBoxes .formLabel:not(:first-child)
{
    margin-top: 15px;
}

.formPanel .formBoxes .formBox
{
    margin-top: 5px;
}

.formPanel .formBoxes .formBox .formBoxBox
{
    border: solid #bbbbbb 1px;
    border-radius: 3px;
    font-size: 16px;
    width: 500px;
    padding: 4px;
}

.formBoxes select
{
    border: solid #bbbbbb 1px;
    border-radius: 3px;
    font-size: 16px;
    padding: 4px;
}

.formPanel .footer
{
    padding: 10px 20px;
    text-align: left;
    font-size: 14px;
    background-color: #ddeedd;
}

.formPanel .footer .footerLink:not(:first-child)
{
    margin-top: 5px;
}


.formButton, .formButtonRed, .formButtonGreen
{
    border-top: solid #999999 1px;
    border-left: solid #999999 1px;
    border-bottom: solid #999999 2px;
    border-right: solid #999999 2px;
    border-radius: 5px;
    padding: 5px 10px;
    font-weight: bold;
    font-size: 16px;
}

.formButtonSmall, .formButtonSmallRed, .formButtonSmallGreen
{
    border-top: solid #999999 1px;
    border-left: solid #999999 1px;
    border-bottom: solid #999999 2px;
    border-right: solid #999999 2px;
    border-radius: 5px;
    padding: 3px 5px;
    font-weight: bold;
    font-size: 12px;
}

.formButton, .formButtonSmall
{
    background-color: #DDDDFF;
}

.formButtonRed, .formButtonSmallRed
{
    background-color: #FFDDDD;
}

.formButtonGreen, .formButtonSmallGreen
{
    background-color: #DDFFDD;
}

.formButton:hover, .formButtonSmall:hover
{
    background-color: #CCCCFF;
}

.formButtonRed:hover, .formButtonSmallRed:hover
{
    background-color: #FFCCCC;
}

.formButtonGreen:hover, .formButtonSmallGReen:hover
{
    background-color: #CCFFCC;
}

.leftRightTable
{
    width: 100%;
}

.leftRightTable td
{
    vertical-align: middle;
}

.leftRightTable td:not(:first-child)
{
    text-align: right;
}