/* -- dennisvogel.com style by Dennis Vogel 2006 -- */

/* ---------- Global ---------- */
A IMG {
        border: none;
        }

.hidden {
        display: none;
        }
/* Set any element in the site to have the class "hidden", and it won't show on the page at all */

/* ---------- Main Layout ----------- */
#page-container {
        width: 750px;
        margin: 0px 100px 0px 100px;
        background: #FFF;
        text-align: left;
}

#content {
}

#content .padding {
        padding: 25px 25px 0px 25px;
        }

/* When only using two values, the first will define the padding on the top and bottom, while the second value will define the padding on the left and right. When using the 4 value padding specification, the corresponding directions to values are: top, right, bottom, left */
/* An element's padding is the amount of space between the border and the content of the element. */
/* margin defines the space around elements. It is possible to use negative values to overlap content. */
/* property allows one to set all margins; alternatively, the properties margin-top, margin-bottom, margin-left, and margin-right may be used. */

#header {
        height: 30px;
        padding: 20px 0px 5px 25px;
        }

#navigation {
        overflow: hidden;
        border-bottom: 4px solid #CCC;
        background: #FFF;
        margin: 0px 20px 0px 25px;
        padding-bottom: 2px;
        }
        
#navigation ul {
        width: 100%;
        padding: 0;
        background: #555;
        list-style-type: none;
        }
        
#navigation li {
        display: inline;
        padding: 0;
        margin: 0;
        }
        
#navigation a {
        background: #555;
        border-right: 1px solid #000;
        padding: 18px 29px 4px 10px;
        margin: 0;
        color: #FFF;
        text-decoration: none;
        display: block;
        float: left;
        width: auto;
        font: bold 1.1em/100% Arial, Helvetica, sans-serif;
        letter-spacing: 1px;
        }
        
#navigation a:hover, #navigation a:focus {
        background: #F63;
        }

#navigation a:active {
        background: #F60;
        color: #FFF;
        }
        
/* #navigation {
        height: 25px;
        background-color: #666666;
        text-align: center;
        font-weight: bold;
        font-size: 10pt;
        color: #FFFFFF;
        }

#navigation UL {
        margin: 0;
        padding: 0;
        text-decoration: none;
        }
        
#navigation LI {
        display:inline;
        padding:0;
        margin:0;
        }

#navigation A:LINK {
        text-decoration: none;
        }

#navigation A:VISITED {
        text-decoration: none;
        }
        */
        
#footer {
        height: 40px;
        font-size: 8pt;
        color: #999;
        border-top: 2px solid #CCC;
        margin: 10px 20px 0px 25px;
        padding: 4px 0px 0px 2px;
        }

#footer A:LINK, #footer A:VISITED {
        color: #999;
        }

#footer A:HOVER, #footer A:FOCUS, #footer A:ACTIVE {
        color: #F63;
        }

/* ---------- Main Tags ---------- */
HTML, BODY, P, H1, H2, H3, H4 {
        margin: 0;
        padding: 0;
        }
  
BODY {
                background : #CCC;
        font-family: Arial, Verdana, sans-serif;
        font-size: 10pt;
        color: #666;

        text-align: center;
        }
        
body.index li#index,
body.index li#index a,
body.about li#about,
body.about li#about a,
body.articles li#articles,
body.articles li#articles a, 
body.photos li#photos,
body.photos li#photos a, 
body.projects li#projects,
body.projects li#projects a, 
body.recipes li#recipes,
body.recipes li#recipes a, 
body.reference li#reference,
body.reference li#reference a  {
        background:#CCC;
        color:#FFF;
}

P {
        padding-bottom: 15px;
        }


/* ---------- Headings ---------- */
H1 {
        font-weight: normal;
        font-size: 16pt;
        word-spacing: 4px;
        letter-spacing: 1px;
        }
  
H2 {
        text-transform: uppercase;
        font-weight: bold;
        font-size: 11pt;
        color: #FF6633;
        }
  
H3 {
    font-weight: bold;
        font-style: italic;
        font-size: 10pt;
        }

H4 {
        font-style: italic;
        font-size: 10pt;
        }
  
/* ---------- Lists ---------- */
UL {
        list-style-type: square;
        padding-left: 50px;
        padding-bottom: 10px;
        margin: 0;
        }

OL {
        padding-left: 50px;
        padding-bottom: 10px;
        margin: 0;
        }
 
  /* ---------- Links ---------- */
A:LINK {
        color: #F63;
        }
/* A (anchor) command actually affects ALL the link properties */
/* Defines the style for unvisited  */

A:VISITED {
        color: #9999CC;
        }
/* Defines the style for visited  */

A:HOVER {
        color: #F63;
        }
        
A:ACTIVE {
        color: #669900;
        }
/* A link that has been clicked on it but not yet released */

/* A:hover must be placed after the A:link and A:visited rules, since otherwise the cascading rules will hide the 'color' property of the A:hover rule. Similarly, because A:active is placed after A:hover, the active color (lime) will apply when the user both activates and hovers over the A element. */

/* ---------- Tables ---------- */
TABLE {
        font-size: 10pt;
        margin: 10px;
        padding: 0px;
        border: 1px solid #999;
        }
       
TH {
        background:#555;
        color:#FFF;
        font-weight: bold;
        text-align: center;
        letter-spacing:1px;
        margin: 0px;
        padding: 2px 10px;
        }

TD {
        margin: 0px;
        padding: 2px 10px;
        border-left: 1px solid #999;
        border-bottom: 2px solid #999;
        }

		
TABLE.PLAIN {
        font-size: 10pt;
        margin: 0px;
        padding: 0px;
        border: none;
        }
  
TH.PLAIN {
        background:#555;
        color:#FFF;
        font-weight: bold;
        text-align: center;
        letter-spacing:1px;
        margin: 0px;
        padding: 2px 10px;
        }

TD.PLAIN {
        margin: 0px;
        padding: 0px;
        border: none;
        }

        
TABLE.FORM {
        font-size: 10pt;
        margin: 0px;
        padding: 0px;
        border: none;
        }
		
TH.FORM {
        background: none;
        color:#555;
		VALIGN: TOP;
		ALIGN: LEFT;
		font-weight: bold;
        text-align: LEFT;
        letter-spacing:1px;
        margin: 0px;
        padding: 2px 10px;
        }

TD.FORM {
        margin: 0px;
        padding: 0px;
        border: none;
        }

  
/* ---------- Non-Standard Elements ---------- */
.source {
        font-style: italic;
        }

.quote {
        font-style: italic;
        }