/* --  purple:  6c2f4d    green: 8ba064     orange:  a35f0a  --*/

a:link,
a:visited,
a:active { text-decoration: none; color: #8bc03e; outline: none; }
a:hover { text-decoration: none; color: #449041; outline: none; }

a:link.underline,
a:visited.underline,
a:active.underline { text-decoration: underline; font-weight: normal; color: #8bc03e; outline: none; }
a:hover.underline { text-decoration: underline; font-weight: normal; color: #449041; outline: none; }
/* -------------------------------- Default Styles -------------------------------------- */
body { 
    margin: 0 0 0 0px; 
    font-family: "Lucida Grande","Arial","Helvetica"; 
    background-color: #ffffff; 
    background: url(../images/bg.jpg) top left;
    color: #333; 
    font-size: 12px; 
}
.clear { clear:both; }

h1 { margin: 2px 0px 12px 0px; color: #a35f0a; font-size: 300%; }
h2 { margin: 2px 0px 8px 0px; color: #8ba064; font-size: 380%; }
h3 { margin: 2px 0px 5px 0px; font-size: 130%; }
h4 { color: #aaa; font-weight: normal; font-size: 110%; padding-top: 5px;  font-style: italic; }
strong { font-weight: bold; }
p { margin: 4px 0px 4px 0px; }
em { font-style: italic; }

.hiddenSubmit { display: none; }

#fatalError { color: #CB0000; border: 1px dashed #cb0000; padding: 10px; margin: 10px; font-size: 90%;}
.errorBox { color:#CB0000; border-top: 1px solid #cb0000; border-bottom: 1px solid #cb0000; padding: 5px; margin-bottom: 5px; }
.errortext { color: #CB0000; padding-bottom: 10px; font-weight: bold; }
.lineError { color: #CB0000; }

.inputText { background-color: #fff; border: 1px solid #c5c3c3; padding: 1px; height: 14px; }
select { background-color: #fff; border: 1px solid #c5c3c3; padding: 1px; }
textarea { background-color: #fff; border: 1px solid #c5c3c3; padding: 1px; }
label { padding: 10px 0 0 0; font-size: 90%;}

table { 
    font-size: 100%;
}

ul, li {
    list-style: square;
}
    ul { 
        padding-left: 15px;
        padding-bottom: 10px;
    }
    li { 
        padding-left: 5px;
    }

label { 
    display: block;
}

#page { 
    width: 910px;
    text-align: left;
}

#header { 

}
    #header .logoBox {
        float: right;
    }
    
    #header .logo {
        width: 115px;
        height: 67px;
        background: url(../images/logo3.gif) top left no-repeat;
    }
    #header #dinnerButton { 
        width: 186px;
        height: 65px;
        margin-top: 20px;
        background: url(../images/dinnerButton.jpg) top left no-repeat;
    }
        #header #dinnerButton:hover {
            background-position: left -86px;
        }
    
    #header .rightTopMenu {
        float: right;
        text-align: right;
    }
    #header .topButtons { 
        height: 28px;
        background: url(../images/topButtons-right.gif) top right no-repeat;
        padding: 0 10px 0 0;
        width: 290px;
        font-size: 90%;
    }
        #header .topButtons .left { 
            height: 28px;
            width: 17px;
            float: left;
            background: url(../images/topButtons-left.gif) top right no-repeat;
        }
        #header .topButtons .spacer { 
            height: 28px;
            width: 4px;
            float: left;
            background: url(../images/topButtons-spacer.gif) top right no-repeat;
        }
        #header .topButtons .button { 
            float: left;
            height: 28px;
            padding: 4px 15px 0 15px;
        }
        #header .topButtons .button a:link,
        #header .topButtons .button a:visited,
        #header .topButtons .button a:active { 
            color: #777;
        }
        #header .topButtons .button a:hover {
            color: #aaa;
            text-decoration: underline;
        }
        
#menu {
    height: 44px;
    width: 910px;
    margin: 10px 0 15px 0;
}
    #menu #programs {
        width: 209px;
        height: 44px; 
        float: left;
        cursor: pointer;
        background: url(../images/menu.gif) top left no-repeat;
    }
        #menu #programs:hover {
            background-position: left -56px;
        }
    #menu #resources {
        width: 236px;
        height: 44px; 
        float: left;
        cursor: pointer;
        background: url(../images/menu.gif) -209px 0px no-repeat;
    }
        #menu #resources:hover {
            background-position: -209px -56px;
        }
    #menu #events {
        width: 138px;
        height: 44px; 
        float: left;
        cursor: pointer;
        background: url(../images/menu.gif) -445px 0px no-repeat;
    }
        #menu #events:hover {
            background-position: -445px -56px;
        }
    #menu #policy {
        width: 148px;
        height: 44px; 
        float: left;
        cursor: pointer;
        background: url(../images/menu.gif) -583px 0px no-repeat;
    }
        #menu #policy:hover {
            background-position: -583px -56px;
        }
    #menu #help {
        width: 176px;
        height: 44px; 
        float: left;
        cursor: pointer;
        background: url(../images/menu.gif) right 0px no-repeat;
    }
        #menu #help:hover {
            background-position: right -56px;
        }

    
/* ------------- Feature ----------------- */

#feature1 {
    height: 373px;
    width: 907px;
    background: url(../images/feature1.jpg) top left no-repeat;
    padding: 0px 0 0 10px;
}
#feature2 {
    height: 373px;
    width: 907px;
    background: url(../images/feature2.jpg) top left no-repeat;
    padding: 0px 0 0 10px;
}
#feature3 {
    height: 373px;
    width: 907px;
    background: url(../images/feature3.jpg) top left no-repeat;
    padding: 0px 0 0 10px;
}
#feature4 {
    height: 373px;
    width: 907px;
    background: url(../images/feature4.jpg) top left no-repeat;
    padding: 0px 0 0 10px;
}
    #feature1 .content,
    #feature2 .content,
    #feature3 .content,
    #feature4 .content {
        padding-top: 187px;
    }
    #feature1 #chicklets,
    #feature2 #chicklets,
    #feature3 #chicklets, 
    #feature4 #chicklets { 

    }
        
        #chicklets #veteran { 
            background: url(../images/chicklets.png) 0px 0px no-repeat;
            height: 186px;
            width: 208px;
            float: left;
        }
            #chicklets #veteran:hover { 
                background-position: 0px -214px;
            }

        #chicklets #family { 
            margin-left: 4px;
            background: url(../images/chicklets.png) -211px 0px no-repeat;
            height: 186px;
            width: 208px;
            float: left;
        }
            #chicklets #family:hover { 
                background-position: -211px -214px;
            }
            
        #chicklets #advocate { 
            margin-left: 10px;
            background: url(../images/chicklets.png) -426px 0px no-repeat;
            height: 186px;
            width: 208px;
            float: left;
        }
            #chicklets #advocate:hover { 
                background-position: -426px -214px;
            }


/* ---------------- Feature - Basic ------------------ */
#featureBasic {
    width: 907px;
    height: 129px;
    background: url(../images/feature-basic.jpg) top left no-repeat;
}
    #featureBasic .content {
        padding: 50px 0 0 20px;
    }
    #featureBasic h1 {
        color: #fff;
        font-family: "Georgia","Times New Roman","Serif";
    }


/* ---------------- main content -------------------- */
#mainContent {
    background: url(../images/main-bg.jpg) top left no-repeat;
}
    #mainContent .leftCol { 
        float: left;
        width: 627px;
    }
        
        /* --------- breadcrumbs ----------------- */
        #mainContent .leftCol #breadcrumbs { 
            margin: 20px 0 0 0;
            font-size: 90%;
        }
        #mainContent .leftCol #breadcrumb {
            background: url(../images/footer_breadcrumb.gif) top left no-repeat;
            list-style: none;
            line-height: 21px;
            display: inline;
            padding: 4px 0 5px 10px;
        }
        #mainContent .leftCol .ie #breadcrumb {
            padding: 0 0 5px 10px;
        }
        
        #mainContent .leftCol #breadcrumb li {
            list-style: none;
            padding: 0px;
            margin: 0px;
        }
        #mainContent .leftCol #breadcrumb li {
            display: inline;
            background: url(../images/footer_breadcrumb_item.gif) top right no-repeat;
            padding: 4px 25px 5px 0 !important;
        }
        #mainContent .leftCol #breadcrumb li.last {
            background: url(../images/footer_breadcrumb_last.gif) top right no-repeat;
        }
        #mainContent .leftCol #breadcrumb a:link, 
        #mainContent .leftCol #breadcrumb a:visited,
        #mainContent .leftCol #breadcrumb a:active { text-decoration: none; font-weight: normal; color: #777; }
        #mainContent .leftCol #breadcrumb a:hover { text-decoration: underline; font-weight: normal; color: #777; }

    
        #mainContent .leftCol p { 
            padding: 0px 0 9px 0;
        }
        #mainContent .leftCol a:link,
        #mainContent .leftCol a:active,
        #mainContent .leftCol a:visited { 
            color: #5f7c2b;
            text-decoration: underline;
        }
        #mainContent .leftCol a:hover { 
            color: #a8bf7d;
            text-decoration: underline;
        }
        
        #mainContent .leftCol .content {
            padding: 20px 40px 20px 40px;
        }
        #mainContent .leftCol h1 { margin: 2px 0px 12px 0px; color: #a35f0a; font-size: 300%; font-weight: normal; font-family: "Georgia","Times New Roman","Serif"; }
        #mainContent .leftCol h2 { margin: 10px 0px 8px 0px; color: #5f7c2b; font-size: 180%; font-weight: normal;  font-family: "Georgia","Times New Roman","Serif"; }
        #mainContent .leftCol h3 { margin: 2px 0px 5px 0px; font-size: 110%; font-weight: bold; }

        #mainContent .quote {
            background: url(../images/quote.gif) top left no-repeat;
            width: 543px;
            margin-bottom: 20px;
        }
            #mainContent .quote .content {
                padding: 40px 20px 10px 30px;
            }
            #mainContent .quote .quoteBottom {
                background: url(../images/quote-bottom.gif) top left no-repeat;
                width: 543px;
                height: 11px;
            }
            
        #mainContent  ul.news { 
            padding: 0 0 0 20px;
        }
            #mainContent  ul.news li { 
                padding: 0 0 10px 0;
            }
            
            #mainContent ul.news .title { 
                font-size: 120%;
            }
            #mainContent ul.news .date { 
                font-size: 80%;
                color: #999;
            }
            #mainContent ul.news .cat { 
                font-size: 80%;
                color: #999;
            }
                #mainContent ul.news .cat a { 
                    text-decoration: none;
                    color: #6c2f4d;
                }
                #mainContent ul.news .cat a:hover { 
                    color: #333;
                }
            #mainContent ul.news .desc { 
                font-size: 90%;
                color: #555;
            }
            
        #mainContent .person h3 { 
            font-size: 100%;
        }
            #mainContent .personTitle { 
                font-weight: normal;
            }
            
        #mainContent h3.togglerFAQ { 
            border-top: 1px solid #ddd;
            padding: 5px 0 0 10px;
            cursor: pointer;
            font-size: 90%;
        }
            .element { 
                padding-left: 20px;
            }
        
    #mainContent .rightCol { 
        float: left;
        width: 275px;
    }
        #mainContent .rightCol ul {
            color: #c1baad;
        }
        #mainContent .rightCol ul li {
            padding-bottom: 10px;
        }
        #mainContent .rightCol .content {
            padding: 20px 20px 20px 30px;
        }
        #mainContent .rightCol h1 { margin: 2px 0px 12px 0px; color: #a35f0a; font-size: 300%; font-weight: normal; font-family: "Georgia","Times New Roman","Serif"; }
        #mainContent .rightCol h2 { margin: 2px 0px 8px 0px; color: #5f7c2b; font-size: 180%; font-weight: normal;  font-family: "Georgia","Times New Roman","Serif"; }
        #mainContent .rightCol h3 { margin: 2px 0px 5px 0px; font-size: 130%; font-weight: bold; }
        
        #mainContent .rightCol .news {
            padding: 10px 0 20px 0;
            border-top: 1px dotted #aaa;
        }
        #mainContent .rightCol a:link,
        #mainContent .rightCol a:visited, 
        #mainContent .rightCol a:active { 
            color: #6c2f4d;
        }
        #mainContent .rightCol a:hover { 
            color: #a4567c;
        }
        #mainContent .rightCol .title { 
            font-size: 120%;
        }
        #mainContent .rightCol .date { 
            font-size: 80%;
            color: #999;
        }
        #mainContent .rightCol .desc { 
            font-size: 90%;
            color: #555;
        }

        /* --------------- right menu ---------------- */
        #mainContent .rightCol #rightMenu {
            background: url(../images/rightMenu-top.png) top left no-repeat;
            margin-left: 1px;
            padding: 18px 0 0 0px;
        }
            #mainContent .rightCol #rightMenu h3 { 
                font-family: "Georgia","Times New Roman","Serif";
                font-weight: normal;
                font-size: 180%;
                padding: 0 0 7px 20px;
                background: url(../images/rightMenu-headDiv.png) bottom left no-repeat;
                margin: 0px;
            }
            #mainContent .rightCol #rightMenu > ul {
                background: url(../images/rightMenu-bottom.png) bottom left no-repeat;
            }
            #mainContent .rightCol #rightMenu > ul,
            #mainContent .rightCol #rightMenu > ul > li {
                list-style: none;
                color: #6c2f4d;
                padding: 0 0 15px 0px;
            }
            #mainContent .rightCol #rightMenu > ul > li {        
                padding: 4px 0 6px 30px;
                background: url(../images/rightMenu-buttonDiv.png) bottom left no-repeat;
            }
                #mainContent .rightCol #rightMenu > ul > li.last {        
                    background: none;
                }
            #mainContent .rightCol #rightMenu > ul > li > a {
                display: block;
                color: #666;
            }
                #mainContent .rightCol #rightMenu > ul >li > a:hover {
                    padding-left: 3px;
                    color: #333;
                }
                
            #mainContent .rightCol #rightMenu > ul > li > ul,
            #mainContent .rightCol #rightMenu > ul > li > ul > li { 
                background: none;
                list-style: none;
                padding: 0;
                margin: 0;
            }
            #mainContent .rightCol #rightMenu > ul > li > ul {
                font-size: 90%;
                padding: 5px 0 10px 10px;
            }
                #mainContent .rightCol #rightMenu > ul > li > ul > li {
                    padding: 2px 0 2px 0;
                }
                #mainContent .rightCol #rightMenu > ul > li > ul > li > a {
                    display: block;
                    color: #666;
                }
                    #mainContent .rightCol #rightMenu > ul > li > ul > li > a:hover {
                        padding-left: 0px;
                        color: #333;
                    }
                    
        
/* ----------------- footer --------------------------- */
#footer { 
    width: 907px;
    height: 95px;
    background-color: #f4f0e1;
    border: 1px solid #e5e1d0;
    font-size: 85%;
    color: #6b6b6b;
}
    #footer .rightCol {
        float: right;
        padding: 10px 20px 10px 10px;
    }
    #footer .lightGrey {
        color: #afafaf;
    }
    #footer .rightCol a:link,
    #footer .rightCol a:visited, 
    #footer .rightCol a:active { 
        color: #6b6b6b;
        text-decoration: underline;
    }
    #footer .rightCol a:hover { 
        color: #afafaf;
    }
    #footer p {
        padding-bottom: 4px;
    }
    
    #footer .leftCol {
        padding: 10px 20px 10px 20px;
    }
        #footer .leftCol a:link,
        #footer .leftCol a:visited, 
        #footer .leftCol a:active { 
            color: #6b6b6b;
            text-decoration: none;
            padding: 2px 10px 2px 0px;
        }
        #footer .leftCol a:hover { 
            color: #afafaf;
        }
        #footer .leftCol p.copyright {
            padding: 10px 0 0 0;
            color: #afafaf;
        }