/*
Form controls
*/

/* basic fieldset styling */
fieldset
{
    position: relative;
    margin: 0 0 1em 0;
    background: #b4c7e2;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}

fieldset a
{
    background-color: #657cb0;
    color: White;
    text-align: center;
    width: 25px;
    display: table-cell;
    display: inline-block;
}


fieldset a:hover
{
    background-color: Gray;
    color: White;
    text-align: center;
    width: 25px;
    display: table-cell;
    display: inline-block;
}



label
{
    font-weight: bold;
    text-align: right;
    margin-right: 10px;
    position: relative;
    float: left;
    width: 200px;
    line-height: normal;
}

.label
{
    font-weight: bold;
    text-align: right;
    margin-right: 10px;
    position: relative;
    float: left;
    width: 200px;
    line-height: normal;
}



input[disabled], select[disabled], textarea[disabled]
{
    color: #ccc;
}



input.formInputText
{
    font-size: 1.0em;
    color: #666;
    background-color: #fee;
    vertical-align: middle;
    border: 1px #f66 solid;
}



input.formInputText:hover
{
    color: #000;
    background-color: #ccffff;
    border-style: solid;
    border-width: 1px;
    border-color: Gray;
}

input.formInputText:focus
{
    color: #000;
    background-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    border-color: Gray;
}


select.formInputText
{
    font-size: 1.0em;
    color: #666;
    background-color: #fee;
    vertical-align: middle;
    border: 1px #f66 solid;
    width: 200px;
}



select.formInputText:hover
{
    color: #000;
    background-color: #ccffff;
    border-style: solid;
    border-width: 1px;
    border-color: Gray;
}

select.formInputText:focus
{
    color: #000;
    background-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    border-color: Gray;
}



textarea.formInputText
{
    font-size: 1.0em;
    color: #666;
    background-color: #fee;
    padding: 2px;
    border: 1px #f66 solid;
    margin-right: 5px;
    margin-bottom: 5px;
    font-family: arial,sans-serif;
}

textarea.formInputText:hover
{
    color: #000;
    background-color: #ccffff;
    border-style: solid;
    border-width: 1px;
    border-color: Gray;
}

textarea.formInputText:focus
{
    color: #000;
    background-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    border-color: Gray;
}


select.formSelect
{
    font-size: 1.0em;
    color: #666;
    background-color: #fee;
    border: none;
    vertical-align: middle;
}

select.formSelect:hover
{
    color: #333;
    background-color: #ccffff;
    border: none;
}

select.formSelect:focus
{
    color: #000;
    background-color: #ffffff;
    border: none;
}

input.formInputButton
{
    font-size: 1.0em;
    vertical-align: middle;
    text-align: center;
    color: #300;
    background-color: #fee;
    border: 1px #f66 solid;
    cursor: pointer;
    height: 20px;
}

input.formInputButton:hover
{
    background: #333 url(../../images/styles/llsh.gif) repeat-x;
    color: #FFFFFF;
}
input.formInputButton:active
{
    background: #333 url(../../images/styles/llsh.gif) repeat-x;
    color: #FFFFFF;
}




.form a
{
    background-color: #6da6f7;
    color: White;
    text-align: center;
    width: 25px;
    display: table-cell;
    display: inline-block;
}



.form a:hover
{
    background-color: Gray;
    color: White;
    text-align: center;
    width: 25px;
    display: table-cell;
    display: inline-block;
}



/* 
Table Design
Top level
----------------------------------------------- */

.top table
{
    border-collapse: collapse;
    background: #EFF4FB url(../../images/styles/teaser.gif) repeat-x;
    border-left: 1px solid #686868;
    border-right: 1px solid #686868;
    font: 0.9em/145% 'Trebuchet MS' ,helvetica,arial,verdana;
    color: #333;
    clear: both;
    width: 100%;
}


.top td, .top th
{
    padding: 5px;
}

.top caption
{
    padding: 0 0 .5em 0;
    text-align: left;
    font-size: 1.4em;
    font-weight: bold;
    text-transform: uppercase;
    color: #333;
    background: transparent;
}

/* =links
----------------------------------------------- */

.top table a
{
    color: #950000;
    text-decoration: none;
}

.top table a:link
{
}

.top table a:visited
{
    /*		font-weight:normal;	*/ /*		color:#666;	*/ /* text-decoration: line-through; */
}



.top table a:hover
{
    border-bottom: 1px dashed #bbb; /* color:#666; */
    color: #666;
}


/* =head =foot
----------------------------------------------- */

.top thead th, .top tfoot th, .top tfoot tr
{
    background: #333 url(../../images/styles/llsh.gif) repeat-x;
    color: #fff;
    font-weight: bold;
    margin: 0 20px 0 0px;
    padding: 15px 0px 5px 0;
    font-size: 120% !important /*Non-IE6*/;
    font-size: 100% /*IE6*/;
}



.top tfoot td
{
    text-align: right;
}

/* =body
----------------------------------------------- */

.top tbody th, .top tbody td
{
    border-bottom: inset 1px #000000;
}

.top tbody th
{
    white-space: nowrap;
}

.top tbody th a
{
    color: #333;
}

.top .odd
{
}



/*
Sub level
*/
.sub table
{
    width: 100% !important;
    font: 1.0em/145% 'Trebuchet MS' ,helvetica,arial,verdana !important;
    clear: both !important;
    border-style: solid !important;
    border-width:1px; 
    border-color: #000000 !important;
    
}

.sub thead th, .sub tfoot th, .sub tfoot tr
{
    /* border-top:1px solid #686868; */
     background: #b4c7e2;
   /*  background: #ffffff url(../../images/styles/roundedcornr_blue_grad_grad.gif) repeat-x top left; */
    color: Black;
    height: 40px;
}

.sub tbody td, .sub tbody th
{
    /*	border-top:1px solid #686868; */
    background: #E6EAE8;
    color: Black;
}

.sub tbody td.blue
{
    font-weight: bold;
    color: Black;
    background-color: #6da6f7;
    display: table-cell;
    text-align: center;
}

.sub tbody td.green
{
    font-weight: bold;
    color: Black;
    background-color: #83aa7a;
    display: table-cell;
    text-align: center;
}

.sub tbody td.orange
{
    font-weight: bold;
    color: Black;
    background-color: #dec26a;
    display: table-cell;
    text-align: center;
}

.sub tbody td.red
{
    font-weight: bold;
    color: Black;
    background-color: #de6a6c;
    display: table-cell;
    text-align: center;
}

.sub tbody td.grey
{
    font-weight: bold;
    color: Black;
    background-color: #dfdbdb;
    display: table-cell;
    text-align: center;
}




.trselected
{
    background: #b4c7e2;
}


/* Used for colouring weather variables */
.red
{
    font-weight: bold;
    color: Black;
    background-color: #de6a6c;
    width: 60px;
    margin: 1px 1px 1px 1px;
    text-align: center;
}


.gray
{
    font-weight: bold;
    color: Black;
    background-color: #cccccc;
    width: 60px;
    margin: 1px 1px 1px 1px;
    text-align: center;
}

.orange
{
    font-weight: bold;
    color: Black;
    background-color: #dec26a;
    width: 60px;
    margin: 1px 1px 1px 1px;
    text-align: center;
}

.green
{
    font-weight: bold;
    color: Black;
    width: 60px;
    background-color: #83aa7a;
    margin: 1px 1px 1px 1px;
    text-align: center;
}

.blue
{
    font-weight: bold;
    background-color: #6da6f7;
    color: Black;
    width: 60px;
    display: table-cell;
    margin: 1px 1px 1px 1px;
    text-align: center;
}


.modalBackground
{
    background-color: Gray;
    filter: alpha(opacity=45);
    opacity: 0.45;
}