/* This style is split into its logical parts based on the page. The 
 * target for this stylesheet is primarily the Gecko rendering engine 
 * (Mozilla, Firebird, Netscape 6/7), KHTML (Safari, Konquerer), and 
 * Internet Explorer 5.5/6. Version 4 browsers are to not supported in 
 * any form.
 *
 * Gecko is the must work platform, as that is what all users will 
 * have garunteed at university. In most situations, this will probably
 * result in KHTML rendering correctly too.
 *
 * IE renders poorly, and does not accurately support the box model, and    
 * large portions of CSS. In most situations we will try to support IE, 
 * but in a situation where we add useablilty in Gecko, but IE 
 * will suffer, IE suffers. this may also occur for layout. I can handle
 * IE looking ugly.
 *
 * When writing CSS use the following structure:
 *      tag {
 *          color/line details
 *
 *          typeface details
 *
 *          positioning details
 *      }
 * also, there is a common indent for the value for each key.
 */

/* This is basic style information common to the whole site, eg typeface
 * color etc.
 */ 
body {
    color:              black;
    background-color:         #777;
    
    font:               11pt  'lucida grande' 'helvetica neue' 'helvetica' 'Arial';
    line-height:        150%;
    
    padding:            0px;
    margin:             0px auto;
    margin-top:         0px;
    margin-bottom:      0px;
}

#center {
    display:            block;
    width:              1000px;
    margin:             auto;
}

a {
    font-weight:        bold;
    margin:             1px;
}

a:link {
    color:             #000000;
    text-decoration:    none;
}

a:visited {
    color:              #555555;
    text-decoration:    none;
}

a:hover {
    color:              #d00;
    text-decoration:    underline;
}

a:active {
    color:              #aa0000;
    text-decoration:    underline;
}
/* Style rules for the banner section of the page.
 *
 */
#banner {
    color:              white;
    
    background:         url(../images/banner/banner.jpg) no-repeat bottom right;
    border:             none;
    
    padding:            0px;
    
    height:             152px;
    width:              100%;
}

#banner img { display:none; } // hide the image that is actual there

#banner h1, #banner h2 {
    text-align:         right;
    text-decoration:    none;
    font:               white "Lucida Grande";
    font-weight:        200;
    margin:             0px;
    padding:            6px;
}

#banner h1 {
    font-size:          17px;
    
    padding-right:      10px;
}

#banner h2 {
    font-size:          60px;
    
    overflow:           hidden;
    padding-top:        19px;
    height:             17px;
}

/* Style rules for the content section
 *
 */
#content {
    color:              black;
    border:             none;
    background-color:   #0x333333 !important;
    padding:            6px;
    padding-left:       10px;
    padding-right:      10px;
    
    float:              left;
    display:            block;
    width:             850px;
}


#content h1, #content h2, #content h3, #content h4 {
    color:              #003366;
    line-height:120%;
}
/*
 * #content p {
 *    text-align:         justify;
 *    color:              #222222;
 */}

#content blockquote {
    padding:            6px;
    border:             1px #ccc dashed;
    background-color:   #eee;
}

#Content > #pageOptions {
    border:             1px #ccc dashed;
    padding:            3px;
    background-color:   #eee;
}

#content > #pageOptions a + a {
    border-left:        1px #ccc dashed;
    padding-left:       3px;
}

/* style information for the controls / links pane.
 *
 * in the standard design this is to the right of the content.
 */
#control {
    color:              black;
    border:             none;

    margin-top:         10px;
    padding:            6px;
    padding-top:        6px;
    
    background-color:   #777; 
    
    float:              right;
    width:              100px;
 border:             1px #ddd solid;

}

#controlGroup dt {
//    border:             1px #ddd solid;
    background-color:   #777;
    font-weight:        bold;
    text-align:         center;
    
    padding:            3px;
    padding-left:       6px;
    padding-right:      6px;
    
    margin-bottom:      3px; 
}

#controlGroup dt:after {
//    content:            ' >';
    
    color:              #444;
}

#controlGroup + #controlGroup {
    margin-top:         -7px;


}

#controlGroup dd {
    color:              black;
    font-size:          8pt;
    background-color:   #777;

    padding:            5px;
    margin:             0;
    indent:             0;


    display:            block;
} 

#controlGroup dd label {
    
 
}

#controlGroup dd input {
    width:              80px;
    font-size:          7pt;


}

#control #updateStamp {
    padding:            6px;
    padding-top:        4px;
    padding-bottom:     4px;
    color:              #333333;
    font-size:          7pt;
    text-align:         center;
    
    border:             #ddd 1px dashed;
}

/* Style the page footer.
 */
 
#footer {
    color:              #aaaaaa;
    font:               7pt "Lucida Grande";
                
    border:             0px;
    border-top:         #ddd 1px dashed;

    padding:            6px;            
    padding-left:       25px;
    padding-right:      25px;
    
    margin-top:         25px;
    margin-bottom:      25px;
    
    width:              820px;
    display:            block;
    clear:              both;
}

/* the error section that will appear on borkbork.
 *
 */
#error {
    border:             1px #ccc dashed;
    background-color:   #eee;
    padding:            6px;
}

#error h1, #error h2, #error h3, #error h4 { 
    color:              #44cc00;
}

#error h1:first-child {
    font-style:         italic;
}

/* Forms
 *
 */ 

textarea,input {
    font-size:  8pt;
}
