﻿
/* ******************************************
     Main Body  
   ****************************************** */

    html, body, form { padding: 0; margin: 0; }
    body { font-family: "Helvetica", "Arial", "Sans-Serif"; font-size: 12px; background-color: #EEEEEE; background-image: url('../Images/bg.jpg'); background-repeat: repeat-x; background-position: top left; }
    body, div, td { color: #222222; }
    
    .clear { float: none; clear: both; height: 0px; padding: 0px; margin: 0px; }

/* ************************************************************************************
     Major Layout Elements 
   ************************************************************************************ */

/* ******************************************
     Main Page Body
   ****************************************** */

    #wcMain { margin: 0px auto 0px auto; width: 957px; }

/* ******************************************
     Page Header 
   ****************************************** */

    #wcHeader {  }
        
        #wcHeader #topNav { padding: 8px 24px 0px 0px; text-align: right; }
        
            #wcHeader #topNav div { display: inline; padding: 0px 4px 0px 4px; font-size: 10px; vertical-align: middle; }
            #wcHeader #topNav div a { color: #777777; text-decoration: none; }
            #wcHeader #topNav .searchText { display: inline; width: 150px; border: 1px solid #777777; padding: 0px 0px 1px 0px; color: #777777; font-size: 12px; }
            #wcHeader #topNav .searchButton { display: inline; border: 0px; background-color: #777777; color: #FFFFFF; padding: 0px 4px 1px 4px; margin: 0px; font-size: 12px; }
        
        #wcHeader #logo { padding: 0px 8px 0px 8px; }
        
        #wcHeader #navBar { text-align: right; padding-bottom: 4px; }
        
            #wcHeader #navBar ul { list-style-type: none; padding: 0px; margin: 0px; }
            #wcHeader #navBar li { display: inline; padding: 0px 14px 0px 14px; font-size: 16px;  margin-bottom: 4px; }
                #wcHeader #navBar li .selected { border-bottom: 4px solid #6b003d; margin-bottom: 0px; }
                #wcHeader #navBar li a { color: #777777; text-decoration: none; }
                    #wcHeader #navBar li a:link { }
                    #wcHeader #navBar li a:visited {  }
                    #wcHeader #navBar li a:hover { border-bottom: 4px solid #6b003d; margin-bottom: 0px; }
                    #wcHeader #navBar li a:active { border-bottom: 4px solid #6b003d; margin-bottom: 0px; }
            
            /*
            #wcHeader .navItem { display: inline; padding: 0px 10px 0px 10px; font-size: 18px; color: #555555; text-decoration: none; margin-bottom: 4px; }
                #wcHeader a.navItem:link { }
                #wcHeader a.navItem:visited {  }
                #wcHeader a.navItem:hover { border-bottom: 4px solid #6b003d; margin-bottom: 0px; }
                #wcHeader a.navItem:active {  }
            */
              
        #wcHeader #separator { height: 4px; background-color: #777777; font-size: 4px;}
            
/* ******************************************
     Page Breadcrumbs 
   ****************************************** */
    #wcBreadcrumbs { border-left: 1px solid #777777; border-right: 1px solid #777777; padding: 8px 16px 8px 16px; font-size: 14px; font-weight: bold; color: #777777; background-color: #FFFFFF; margin: 0px; }
    #wcBreadcrumbs .navParent { font-size: 18px; }
    #wcBreadcrumbs a { text-decoration: none; color: #777777; }
    #wcBreadcrumbs a:link {  }
    #wcBreadcrumbs a:visited {  }
    #wcBreadcrumbs a:hover { border-bottom: 1px solid #23a491; color: #23a491; }
    #wcBreadcrumbs a:active { border-bottom: 1px solid #23a491; color: #23a491; }

/* ******************************************
     Page Body 
   ****************************************** */

    #wcBody { border: 1px solid #777777; background-color: #FFFFFF; }
    
        #wcBody #pageTitle { font-size: 24px; color: #777777; padding: 12px 0px 12px 0px; border-bottom: 1px solid #BBBBBB;  }

        #wcBody #subNav { font-family: "Arial"; font-size: 12px; padding: 12px 0px 0px 0px; vertical-align: top; }
            #wcBody #subNav ul { list-style-type: none; margin: 0px; padding: 0px; }
                #wcBody #subNav ul li { list-style-type: none; margin: 0px; padding: 4px 0px 4px 0px; }
                    #wcBody #subNav ul li .selected { background-image: url("../Images/bg-nav-selected.gif"); background-repeat: no-repeat; background-position: left center; }
                    #wcBody #subNav ul li a { text-decoration: none; color: #777777; padding: 4px 0px 4px 28px; }
                    #wcBody #subNav ul li a:link { text-decoration: none; }
                    #wcBody #subNav ul li a:visit { text-decoration: none; }
                    #wcBody #subNav ul li a:active { text-decoration: none; }
                    #wcBody #subNav ul li a:hover { text-decoration: none; font-weight: bold; background-image: url("../Images/bg-nav-selected.gif"); background-repeat: no-repeat; background-position: left center; }
                #wcBody #subNav ul ul { list-style-type: none; margin: 0px; padding: 6px 4px 12px 16px; }
        
        #wcBody #content { width: 715px; vertical-align: top; }
            #wcBody #content #titleImage { padding: 0px; margin: 0px; }
                /*  #wcBody #content #text { border-top: 6px solid #2269a5; border-bottom: 6px solid #2269a5; padding: 8px 12px 8px 0px; } */
                #wcBody #content #text { padding: 8px 12px 8px 0px; }
                #wcBody #content #text h1 { font-size: 20px; font-weight: bold; margin: 20px 0px 20px 0px; padding: 0px; line-height: 0px; }
                #wcBody #content #text p { margin: 12px 0px 12px 0px; }
                    #wcBody #content #text p .bold { font-weight: bold; }
                #wcBody #content #text li { margin: 0px 0px 0px 12px; } 
                
                #wcBody #content #resourceText { padding: 0px 0px 0px 16px; }

/* ******************************************
     Page Footer 
   ****************************************** */

    #wcFooter { color: #777777; }
        #wcFooter #footerNav { text-align: center; color: #777777; font-size: 12px; padding: 8px 0px 8px 0px; }
            #wcFooter #footerNav .link { display: inline; font-size: 10px; padding: 0px 4px 0px 4px; text-decoration: none; color: #777777; }
                #wcFooter #footerNav a.link:link { }
                #wcFooter #footerNav a.link:visited {  }
                #wcFooter #footerNav a.link:hover { border-bottom: 1px solid #BBBBBB; margin-bottom: 0px; }
                #wcFooter #footerNav a.link:active {  }
            
            #wcFooter #footerNav .copyright { margin-top: 8px; }
            
            #wcFooter #icon { text-align: center; }

/* ************************************************************************************
     Re-Usable Elements 
   ************************************************************************************ */

    .resourcesItemBullet { background-image:  url(../Images/bullet.gif); background-repeat: no-repeat; background-position: left center; }
    .resourcesItem { margin: 0px; padding: 0px 0px 4px 16px; }
    .resourcesItem a { color: #6b003d; text-decoration: none; margin-bottom: 1px; }
    .resourcesItem a:hover { color: #6b003d; border-bottom: 1px solid #6b003d; margin-bottom: 0px; }
    
    
/* ************************************************************************************
     Page-Specific Elements 
   ************************************************************************************ */


/* ******************************************
     Default Page 
   ****************************************** */

    #frontPage { background-color: #FFFFFF; border: 1px solid #777777; }
    
    #frontPage .bigImage { margin: 0px; padding: 0px; }
    #frontPage .column { border-left: 1px solid #CCCCCC; border-right: 1px solid #CCCCCC; margin: 0px; padding: 0px; }
    #frontPage .column2 { border-left: 1px solid #CCCCCC; border-right: 1px solid #CCCCCC; }
    #frontPage .infoBlock { margin: 0px; width: 204px; padding: 16px 16px 16px 16px; color: #222222; font-size: 12px; }
    
    #frontPage .findOut { font-size: 12px; text-align: right; padding: 8px 10px 4px 0px; }
    #frontPage .findOut1 { color: #6b003d; }
    #frontPage .findOut2 { color: #28266c; }
    #frontPage .findOut3 { color: #2269a5; }
    #frontPage .findOut4 { color: #22a490; }
    #frontPage .findOutMore { display: block; color: #6b003d; padding: 8px 8px 4px 0px; }
    
    #frontPage .box { border-left: 1px solid #CCCCCC; border-right: 1px solid #CCCCCC; }
    #frontPage .box1 { background-color: #6b003d; font-size: 8px; }
    #frontPage .box2 { background-color: #28266c; font-size: 8px; }
    #frontPage .box3 { background-color: #2269a5; font-size: 8px; }
    #frontPage .box4 { background-color: #22a490; font-size: 8px; }
    
    #frontPage .bigInfoBlockA { padding: 20px 16px 20px 16px; text-align: center; vertical-align: middle; }
    #frontPage .bigInfoBlockB { padding: 20px 16px 20px 0px; color: #222222; font-size: 12px; vertical-align: middle; }

/* ******************************************
     Contact Us Page 
   ****************************************** */

    #contactUs .contactUsTitle { vertical-align: top; font-weight:bold; width: 140px; }
    
    #contactUs .contactUsInfo { }

/* ******************************************
     Respirator Form 
   ****************************************** */
    
    #respiratorForm { width: 550px; margin: 0px auto 0px auto; font-size: 11px; }
    
    .numberColumn { vertical-align: top; font-size: 11px; padding-bottom: 14px; }
    .questionColumn { vertical-align: top; font-size: 11px; padding-bottom: 14px; }
    .numberColumn-nopadding { vertical-align: top; font-size: 11px; }
    .questionColumnB { vertical-align: top; font-size: 11px; padding: 0px 0px 14px 36px; }
    
   #respiratorForm div { margin: 10px 0px 4px 0px; }
   #respiratorForm .required { margin: 0px 0px 10px 0px; }




/* ******************************************
     Calendar of Events 
   ****************************************** */
    
.calendarEvent { padding: 16px 24px 24px 24px; border: 1px solid #CCCCCC; margin: 0px 0px 24px 0px; width: 680px; }
.calendarEventTitle{ font-size: 16px; font-weight: bold; padding: 0px 0px 8px 0px; }
.calendarEventLabel { width: 80px; font-weight: bold; }
.calendarEventInfo { }

.calendarMain { background-color: #FFFFFF; border: 1px solid #000000; width: 680px; }
.calendarMain a { text-decoration: none; color: #6b003d; }
.calendarMain div { line-height: 10px; }
.calendarTitle td { font-size: 18px; font-weight: bold; text-align: center; background-color: #CCCCCC; }
.calendarNextPrev a { font-weight: bold; font-size: 14px; }
.calendarSelected { background-color: #22a490; color: #FFFFFF;  }
.calendarToday { background-color: #22a490; color: #FFFFFF; }
.calendarDay, .calendarToday, .calendarSelected { height: 80px; vertical-align: top; text-align: left; border: 1px solid #CCCCCC; }
.calendarDayNames { border-bottom: 1px solid #000000; }
.calendarEventList { font-size: 9px; }
