﻿
/* basic elements */
html { margin: 0; padding: 0; }
body { font: 62.5% arial, sans-serif; background: #909090; color: #404040; margin: 0; padding: 0; height: 100%; }
 
#dummyDiv{ position: absolute; width: 100%; height: 100%; }   
    

/**************** STRUCTURE **************
- dummyDiv - this is so that the central panel will fill the full height in all browsers (hopefully!)
    - container
        - header
            - logoDiv
                + a
                    + img
            - phoneDiv
                + span
            - piccie
                + img
        - main
            - mainNavDiv
                + p
                    + a
            - contentDiv
                - contentHeader
                    + h1
                - breadcrumbDiv
                    + a
                - contentBody
                    + hr
                    + subHeading
                        + h2
                    + p
                        + span
                    + ul
                        + li
                - footerDiv
                    + p (addressText)
                        + span
                            + a
                    + p (baseNav)
                        + a
                    + p (copyrightText)
                        + span
                    + p (badges)
                        + a
                            + img
*/

#container { width: 90%; min-height: 100%; max-width: 954px; min-width: 800px; margin: 0px auto 0px auto; padding: 0px; border-left: solid 2px #202020; border-right: solid 2px #202020; background: white url(../media/wave.jpg) no-repeat top left; } 


/***************** HEADER *****************/
#header { height: 260px; padding: 0px; margin: 0px; }

    /* logo */
    #logoDiv { float: left; left: 0px; top: 0px; width: 400px; }
        #logoDiv img { padding: 12px 0px 0px 64px; width: 338px; height: 82px; border: none; }

    /* phone number */
    #phoneDiv { float: right; top: 10px; right: 0px; padding: 6px 60px 0px 0px; }
        #phoneDiv span { font-family: "Trebuchet MS", arial, Sans-Serif; font-size: 2.6em; font-weight: bold; color: #125b90; }

    #piccie { clear: right; float: right; width: 151px; height: 136px; padding: 50px 80px 0px 0px; }

/************** MAIN CONTENT **************/
#main { clear: both; padding: 0px 30px 30px 30px; }

    /* nav area */
    #mainNavDiv { float: left; left: 0px; width: 200px; padding: 0px; }
        #mainNavDiv ul { list-style: none; padding: 0px; margin: 0px; }
        #mainNavDiv a { display: block; font-size: 1.4em; text-decoration: none; font-weight: bold; padding: 0px 0px 20px 0px; }
        #mainNavDiv a:hover { color: #ff660a; }
        .mainNavSel { color: #125b90; }
        .mainNavUnSel { color: #202020; }

    /* content area */
    #contentDiv { margin: 0px 0px 0px 204px; padding: 0px; }
        
        #contentHeader { float: left; left: 0px; width: 300px; padding: 0px 0px 0px 6px; }
        #contentHeader h1 { font-family: "Trebuchet MS", arial, Sans-Serif; font-size: 2.0em; font-weight: bold; color: #ff660a; padding: 0px; margin: 0px; }
        
        #breadcrumbDiv { margin: 0px 0px 0px 204px; text-align: right; padding: 0px 6px 0px 0px; }
        #breadcrumbDiv a { padding: 0px 4px 0px 4px; font-size: 1.4em; text-decoration: underline; color: #125b90; }
        #breadcrumbDiv a:hover { color: #ff660a; }       
        
        #contentBody { padding: 0px; margin: 2em 0px 0px 0px; }
        #contentBody hr { height: 2px; color: #cecfd1; background-color: #cecfd1; border: none; }
        #contentBody p { font-size: 1.4em; padding: 0px 6px 0px 6px; }
        #contentBody a { color: #125b90; text-decoration: underline; }
        #contentBody a:hover { color: #ff660a; }
        #contentBody ul { list-style-type: disc; font-size: 1.4em; } 
        #contentBody p label, .textBoxes, .dropDowns { float: left; margin-bottom: 10px; }
        #contentBody p label { width: 4.6em; padding-right: 20px; }
        #contentBody p label.checkBoxes { width: auto; }
        .subHeading { background-color: #cecfd1; }
        .subHeading h2 { font-size: 1.4em ; font-weight: bold; padding: 2px 6px 2px 6px; color: #202020; }        
        br { clear: left }
        
        /* contact page specifics */
        #emailForm { font-size: 1.4em; }
        .reqNote { color: #ff660a; }
        .reqField { color: #ff660a; font-weight: bold; font-size: 1.4em; }
        .errorStyle { color: #ff660a; }
        #lblMessage { color: #ff660a; font-size: 1.4em; }
        .textBoxes { width: 460px; color: #125b90; }
        .dropDowns { width: 460px; height: 200px; font-family: arial, sans-serif; font-size: inherit; color: #125b90; }
        .checkBoxes { padding-right: 20px; }
        #submitBtn { clear: both; }

    /* footer */
    #footerDiv { padding: 0px 6px 0px 6px; margin: 0px; text-align: center; font-size: 1.2em; line-height: 90%; }

        #addressText a { color: #125b90; text-decoration: underline; }
        #addressText a:hover { color: #ff660a; }
        #baseNav a { padding: 0px 4px 0px 4px; text-decoration: underline; color: #125b90; }
        #baseNav a:hover { color: #ff660a; }
        #badges img { border: none; height: 31px; width: 88px; padding: 8px 2px 0px 2px; }
