html { }

body{
    background-color: #FFF;
    font-family: sans-serif;
}

/* BASIC LAYOUT */
#header, #footer, #page, #mastnav {
    width: 90%;
    margin: 5px auto 0px;
    padding: 5px;
}

/* HEADER */

#header {
    border: 1px dotted #ccc;
    background-color: #FFF;
    position: relative;
    height: 100px;
}

#logo {
    position:absolute;
    top: 10px;
    left: 10px;
}

#language {
    position: absolute;
    border: 1px dotted #ccc;
    top:    10px;
    right:  10px;
}

#account {
    position: absolute;
    border: 1px dotted #ccc;
    top:    30px;
    right:  10px;
}

#language ul,
#account  ul {
    margin:0px;
    padding: 0px;
}

#language ul li,
#account  ul li {
    display: inline;
    padding-left: 5px;
}

#language ul li a,
#account  ul li a {
    font-size: 12px;
}

#language ul li a.active, #account  ul li a:hover,
#language ul li a.active, #account  ul li a:hover {
    text-decoration: none;
    color: orange;
}
#language ul li a.active, 
#language ul li a.active {
    cursor: text;
}

/* TOP LEVEL NAVIGATION */

#mastnav {
    background-color: #F0F0F0;
    border: 1px dotted #ccc;
}

#mastnav ul {
    margin:0px;
    padding: 0px;
}

#mastnav ul li {
    display: inline;
}

#mastnav ul li a {
    text-decoration: none;
    font-weight: bold;
    color: #149BDF;
    padding: 0px 5px;
}

#mastnav ul li a.active,
#mastnav ul li a:hover {
    color: orange;
}
#mastnav ul li a.active {
    cursor: text;
}

/* SUB NAVIGATION */

#subNavigation ul {
    margin: 0px 0px 10px;
    padding: 0px;
    border-top: 1px dotted grey;
}

#subNavigation ul li {
    list-style-type: none;
}

#subNavigation ul li a {
    display: block;
    height: 30px;
    line-height: 30px;
    padding-left: 5px;
    background-color:#E5F6FF;
    border-bottom: 1px dotted grey;
    color: #666;
    font-size: 12px;
    font-weight: bold;
    text-decoration: none;
}

#subNavigation ul li a:hover {
    background-color:#C9DCE5;
}

#subNavigation ul li ul li a {
    display: block;
    height: 20px;
    line-height: 20px;
    padding-left: 15px;
    background-color:#FFEBD6;
    border-bottom: 1px dotted grey;
    color: #666;
    font-size: 12px;
    font-weight: bold;
    text-decoration: none;
}

#subNavigation ul li ul li a:hover {
    background-color:#FCDFBF;
}

#subNavigation a.active {
    color: orange;
}

/* MAIN CONTENT */

#page {
    background-color: #F0F0F0;
    min-height: 300px;
    border: 1px dotted #ccc;
}

#leftcol {
    width:200px;
    min-height: 300px;
    float:left;
    background-color: #E5E3E3;
    border: 1px dotted #ccc;
}

#maincol {
    background-color: #E5E3E3;
    margin-left: 210px;
    border: 1px dotted #ccc;
    min-height: 300px;
    padding: 10px;
}

#maincol h1 {
    margin: 10px 5px;
    padding: 5px;
    color: #7A8089;
    border-bottom: 2px solid #7A8089;
}

.content {
    background-color: #D3D3D3;
    border: 1px dotted #bbb;
    min-height: 200px;
    padding: 10px;
}


/* FOOTER */

#footer {
    background-color: #F0F0F0;
    border: 1px dotted #ccc;
    margin-bottom: 100px;
}

#footer ul {
    margin:0px;
    padding: 0px;
}

#footer ul li {
    display: inline;
}

#footer ul li a {
    padding: 0px 5px;
}

/* FORMS - ERROR / SUCCESS */

.form div label {
    float:left;
    width: 30%;
}

.mandatory {
    color:red;
}

.errors {
    background-color: #ffdad5;
    border: 1px solid #CE5358;
    margin: 10px;
    padding: 5px;
    color: #CE5358;
}

.errors p {
    margin: 2px;
}

form select.error, 
form input.error,
form textarea.error {
    border: 1px solid #CE5358 !important;
    background-color: #ffdad5 !important;
}

.successes {
    background-color: #F2FFE7;
    border: 1px solid #A5D47F;
    margin: 0 0 1.6em;
    padding: 2%;
    width: 94%;
    color: #4C722D;
}

.successes ul {
    margin: 0;
    padding:0;
}

.successes li {
    list-style-type: none;
}


.small {
    font-size:12px;
    color: #666;
}