/********************************************************************************/
/* Filename: main.css                                                           */
/* Author: Neil Spake                                                           */
/* Description: CSS file for common rules for all sections.                     */
/* Revision History:                                                            */
/* 09Mar2010 - Initial Version for 2010 renovation.                             */
/********************************************************************************/
/* NOTES:                                                                       */
/*  Font sizes:                                                                 */
/*   18px - 1.125em                                                             */
/*   16px - 1.0em                                                               */
/*   14px - 0.875em                                                             */
/*   12px - 0.75em                                                              */
/*   10px - 0.625em                                                             */
/*   9px  - 0.5625em                                                            */
/*                                                                              */
/*  font-family: Georgia, "Times New Roman", Times, sans-serif;                 */
/*  font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, sans-serif;*/
/*                                                                              */
/*                                                                              */
/* Box Model Notes:                                                             */
/*  Total Box Width  = margin + padding + width                                 */
/*  Total Box Height = margin + padding + height                                */
/*                                                                              */
/*  Colors:                                                                     */
/*   Today's Breweries - color: #000099; (dark blue)                            */
/*   Brewing History   - color: #996633; (brown)                                */
/*   Brewing News      - color: #000000; (black)                                */
/*   Brewing Events    - color: #cc0000; (reddish)                              */
/*   Related Links     - color: #006600; (green)                                */
/*   About The Site    - color: #006666; (aqua/teal)                            */
/*                                                                              */
/********************************************************************************/

/********************************************************************************/
/* BASIC XHTML ELEMENTS                                                         */
/********************************************************************************/

body {
/*  background: url('../images/general/blue_grad.gif');
  background-repeat: repeat-x; */
  
    background: #ffffff;
}

img {
    display: block;
    border: 0;
}

p {
    margin: 0;
    padding: 0;
    font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, sans-serif;
    font-size: 0.75em;
    text-align: justify;
}

/* H1, USED FOR PAGE TITLES */
h1 {
    margin: 0;
    padding: 0;  
    font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, sans-serif;
    font-size: 0.875em;
    font-weight: bold;
}

/* H2, USED FOR PAGE SUB HEADINGS (NEXT IMPORTANT AFTER PAGE TITLE) */
h2 {
    margin: 0;
    padding: 0;
    font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, sans-serif;
    font-size: 0.75em;
    font-weight: bold;
}

/* H3, CURRENTLY NOT USED */
h3 {
	margin: 0;
    padding: 0;
    font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, sans-serif;
    font-size: 0.67em;
    font-weight: bold;
}

/* H4,USED FOR SIDE NAVIGATION, AMONG OTHER THINGS */
h4 {
    margin: 0;
    padding: 0;
    font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, sans-serif;
    font-size: 0.67em;
    font-weight: bold;
}

/* H5, USED FOR SIDE NAVIGATION, AMONG OTHER THINGS */
h5 {
    margin: 0;
    padding: 0;
    font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, sans-serif;
    font-size: 0.67em;
    font-weight: normal;
}

/********************************************************************************/
/* CONTAINER                                                                    */
/********************************************************************************/
#container {
    margin: 10px 0 0 0;
    padding: 0;
    width: 800px;
    /* UNCOMMENT NEXT TWO TO CENTER */
/*    left: 50%;  
    margin-left: -400px; */
    background-color: #ffffff;
    border: 1px solid #000000;
}

/********************************************************************************/
/* HEADER (LOGO)                                                                */
/********************************************************************************/
#header {
    margin: 0;
    padding: 0;
    height: 100px;
    width: 800px;
    z-index: 1;
    background: url('../images/general/header.png') no-repeat;
    background-position: left center;
}

/********************************************************************************/
/* TOP NAVIGATION                                                               */
/********************************************************************************/
#topNav {
    float: left;
    margin: 0;
    padding: 0;
    width: 800px;
    z-index: 1;
    background: #cccccc;
}

#topNav ul {
    float: left;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
}

#topNav ul li {
    float: left;      /* This float causes the list items to display as though in-line. */
    margin: 0;
    padding: 0;
    display: block;
    font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, sans-serif;
    font-size: 0.75em;
    font-weight: bold;
}

#topNav ul a {
    float: left;
    display: block;
    margin: 0;
    padding: 0.25em 1.5em 0.25em 1.5em;
    border-top: 0px;
    border-right: 1px;
    border-bottom: 0px;
    border-left: 0px;
    border-color: #aaaaaa;
    border-style: solid;
    line-height: 25px;
    text-decoration: none;
    color: #000000;
}

#topNav ul .first a {
    border-right: 1px;
    border-color: #aaaaaa;
    border-style: solid;
}

#topNav ul a:hover {
    font-weight: bold;
    color: #ffffff;
    background-color: #000066;
    text-decoration: none;
}

#topNav ul .first a:hover {
    background-color: #cccccc;
    text-decoration: none;
    cursor: default;
}

/********************************************************************************/
/* CONTENT WRAPPER                                                              */
/********************************************************************************/
#contentWrapper {
    float: left;
    margin: 0;
    padding: 0;
    width: 800px;
    min-height: 400px;
/*    height: auto!important;
    height: 400px; */
    background-color: #ffffff;
}

/********************************************************************************/
/* SIDE NAVIGATION AREA                                                         */
/********************************************************************************/
/* AREA */
#sideNavArea {
    float: left;
    margin: 0;
    padding: 10px 0px 20px 0px;
    width: 200px;
}

/********************************************************************************/
/* CONTENT AREA                                                                 */
/********************************************************************************/
#content {
    float: right;
    margin: 0;
    padding: 10px 0 20px 0;
    width: 580px;
    min-height: 400px;
/*    height: auto!important;
    height: 400px; */
    background-color: #ffffff;
}

#content p {
    margin: 1.5em 20px 0px 0px;
    padding: 0;
}

#content p img {
}

#content p img.img_right {
    float: right;
    margin: 0px 0px 0px 10px;
}

#content p img.img_left {
    float: left;
    margin: 0px 10px 0px 0px;
}

#content p img.brew_map {
    float: right;
    margin: 0px 47px 0px 0px;
}

#content h2 {
	margin: 1.5em 20px 0px 0px;
}

#content h3 {
	margin: 1.5em 20px 0px 0px;
}

/* UNORDERED LIST , UL */
#content ul {
    margin: 10px 10px 0px 10px;
    padding: 0;
    list-style: none;
}

/* LIST ITEMS, UL LI */
#content ul li {
    margin: 0.75em 10px 0px 10px;
    padding: 0;
    font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica, sans-serif;
    font-size: 0.75em;
    font-weight: normal;
/*    display: inline; /* KLUDGE: Removes gaps in IE/Win, don't think I should use this for non-links */
}

/* LINK PROPERTIES, UL A */
#content ul a {
    display: block;
    margin: 0px 10px 0px 0px;
    padding: 0;
    height: 25px;
    line-height: 25px;
    text-decoration: underline;
    text-indent: 10px;
    color: #000066;
}

/********************************************************************************/
/* FOOTER (COPYRIGHT)                                                           */
/********************************************************************************/

#footer {
    clear: both;
}

#footer p {
    display: block;
    position: relative;
    padding: 0.5em 10px 0.5em 10px;
    height: 25px;
    line-height: 25px;
    font-weight: bold;
    vertical-align: middle;
    text-align: center;
    color: #000033;
    background-color: #cccccc;
}

