
/*  
   COLOR EXPERIMENTATION LIBRARY
   #CCCC99 Gold
   #FAFAD2 Light Golden Rod Yellow
   #711515 Maroon
   #000033 Very Dark Blue (almost black)
   #DCDCDC Medium Gray shade
   #8B0000 Dark red
   #FFFF99; light yellow
   #000033; almost black
   #FFFFCC; pale yellow
   #660000; Cederholm Burgundy Font Color
   #F4F4ED; Simple Bits Gray
   #94B569; Nice Green from Zen Garden Boot Site
   #74A050; Another Nice (Darker) Green from Zen Garden
   #D0EEA8; A Lighter Green from Zen Garden
   #446E98; A Blue from Zen Garden
   #7788D4; A Purple like color
   #E7D8AF; A light brown (tan) background from Zen Garden
   #DAC89A; A darker light brown (tan) background from Zen Garden
   
   #F29997  Nantucket Red (Pinky)
   #C3CDD4  Gun metal Gray
   #C8E0EB  Light Gun metal Gray
   #963032  Muted Red
   #A74345  Lighter Muted Red
   #ECECC6  Sandy
   #659012  Kermit Green
   #98AE4C  Less Kermit Green - looks good with White Font Arial All Caps
   
    From HaveAMint.com
   #666666 Gray Black
   #BCE27F Lighter Green
   #94BA65 Darker Green
   #8DB05E Darkest Green (Nav Panel)
   
    Joyent.com
   #FAFAD2 Original Content Tan
   #DED6B2 Dark Sand
   #E2DBBE Lighter Sand
   #F4F2E5 Lightest Sand
   #FFA302 Orange
   
   CSCI E-12 site
   #0677A3 Nav Panel Blue
   #5C9DB0 Nav Panel Blue Hover
   
   Zen Garden http://www.benklemm.de/
   #F7AA00 Orange
   #AD3C00 Burnt Orange
   #CFEF53 Light Lime Green
   
   FONT GUIDE
   Arial, sans-serif; 
   Verdana, Geneva, Arial, sans-serif; 
*/


/* I used Dan Cederholm's book entitled "Bulletproof Web Design" extensively as a learning tool in developing site and my CSS.
   In a few places, I may have replicated something in this book.  But mostly, I have adapted what I learned to fit the
   needs of this project.  This was an excellent book and learning tool. To a much lesser extent, I made use of some
   of the CSS in Christopher Schmidt's book entitled "The CSS Cookbook"....another very good book.*/


/* General Styles and styles for main Content Div */

body {    
    background: #659012;
    margin: 0;
    padding: 0;
    font-family: Verdana, Geneva, Arial, sans-serif;      
    font-size: small;      
    }

#wrapper {
    min-width: 500px;
    max-width: 1400px;
    }
    
#header {
 /* border-bottom: 2px solid #87B825; */
    /*border-bottom: 1px solid #ccc;*/
    background: #AD3C00;
    font-size: 110%;
    }
    
#headerInfo {
 /* border-bottom: 2px solid #87B825; */
    background: #AD3C00;
    font-size: 100%;
    color: #cc9;
    }

p {margin: 0 0 10px 0;}

h1 {
    margin: 0;
    padding: 20px;        
    font-family: Georgia, serif;     
    font-variant: small-caps;
    font-size: 250%;
    color: #FAFAD2; 
    }
    
#message {
    margin: 0;
    padding: 10px;
    font-size: 110%;
    color: #cc9;
    text-align: center;
    background: #666666;    
    }

#message strong {padding: 0 0 0 28px;}
    
#content {
    float: right;
    width: 80%;
    background: #FAFAD2; 
    line-height: 1.5em;
    }
    
#content .gutter {padding: 25px;}
    
#content .gutter.altgutter {
    padding: 25px 25px 25px 50px;
    }


#content h2, #content h3 {
    margin: 0 0 1em 0;
    padding: 0;
    font-family: Georgia, serif;
    font-weight: normal;
    color: #663;    
    }
    
#content h2 {font-size: 150%;}

#content h2.heading_alt {
    text-transform: uppercase;       /* to capitalize certain h2's */
    color: #000033;                  /* and darken the font */
    }

#content h3 {font-size: 125%;}

#mailwrap em {color: red;}

 
#navigation {
    float:left;
    width:20%;
    font-size: 111%;
    font-weight: bold;
    font-variant: small-caps;
    line-height: 1.7em;
    }
    
/* #navigation .gutter {padding: 15px;} */

#navigation ul#mainnav { 
    list-style: none; 
    margin-left: 0px;
    margin-top: 1em; 
    padding: 0; 
    width: 100%;
    }

#navigation ul#mainnav li { 
    margin: 0; 
    border-top: 1px none #333; 
    }
    
#navigation ul#mainnav li a { 
    display: block; 
    text-decoration: none; 
    padding: 2px 5px 2px .5em; 
    }

#navigation ul#mainnav a:link {color: white;}

#navigation ul#mainnav a:visited {color: #cc9;}

#navigation ul#mainnav a:hover {
    color: white;
    background-color: #8DB05E;
    }

#navigation ul#mainnav a:active {color: red;}

/* .akey {text-decoration: underline;} */


/* SELECTORS BELOW CONTROL THE ILLUMINATION OF NAV LINKS FOR THE SELECTED PAGE */

body#page_about #navigation ul#mainnav #navlink_about a,
body#page_mail #navigation ul#mainnav #navlink_mail a,
body#page_articles #navigation ul#mainnav #navlink_articles a,
body#page_contact #navigation ul#mainnav #navlink_contact a,
body#page_blog #navigation ul#mainnav #navlink_blog a,
body#page_gallery #navigation ul#mainnav #navlink_gallery a,
body#page_videos #navigation ul#mainnav #navlink_videos a,
body#page_directions #navigation ul#mainnav #navlink_directions a,
body#page_expect #navigation ul#mainnav #navlink_expect a,
body#page_faq #navigation ul#mainnav #navlink_faq a,
body#page_links #navigation ul#mainnav #navlink_links a,
body#page_logistics #navigation ul#mainnav #navlink_logistics a,
body#page_menu #navigation ul#mainnav #navlink_menu a,
body#page_regform #navigation ul#mainnav #navlink_regform a,
body#page_schedule #navigation ul#mainnav #navlink_schedule a {
    color: #659012;
    background-color: #CFEF53;
    }
    
/* ABOUT PAGE CSS - experiment with the definition list for image, title, description combos */

.feature {
    margin: 15px 0;
    padding: 15px;
    background: #ECECC6;
    border: 2px dotted #DED6B2; 
    }

.feature.alt {
    background: #DED6B2;
    border: 2px dotted #FAFAD2; 
    }

.feature dt {
    margin: 0 0 .5em 0;
    font-family: Georgia, serif;
    font-size: 140%;
    font-weight: bold;
    color: #693;
    }

dl.feature dt img {
    float: right;
    clear: right;
    margin: 0 0 0 15px;
    }

dl.feature.alt dt img {
    float: left;
    clear: left;
    margin: 0 15px 0 0;
    }
    
dl.feature dd {
    margin-left: 0px;
 /*   font-size: 90%; */
    line-height: 1.5em;
    padding: 5px 0;
    }

dl.feature.alt dd {
   margin-right: 0px;
   }

dl.feature:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }  
    
/* WHAT TO EXPECT PAGE experiment with the image floats for image, title, description combos */

#content div.img_title_descr {
    margin: 0 0 10px 0; 
    padding: 10px 0 0 0;
    border-top: 1px dashed #999;
    width: 100%;    
    }

#content div.img_title_descr h3 {
    background: #DED6B2;
    color: #693;
    padding: 2px 0 2px 3px;
    }

#content div.img_title_descr img {
    float: right;  
    margin: 0 3px 5px 15px; 
    }

#content div.img_title_descr.alt img {
    float: left;  
    margin: 0 15px 5px 3px; 
    }

#content div.img_title_descr p {
    padding-left: 3px;
  /*  font-size: 90%; */
    line-height: 1.5em;  
    }  
    
#content div.img_descr {
    padding: 10px 5px;
    background: #ECECC6;
    border: 2px dotted #DED6B2;
    }
    
#content div.img_descr:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }
    
/* GENERAL CSS FOR IMAGES */

img {
    padding: 6px;
    border-top: 1px solid #999;
    border-left: 1px solid  #999;
    border-bottom: 1px solid #ccc; 
    border-right: 1px solid #ccc;
    background: #F4F2E5;
    }

a:hover img { 
    border-style: solid;
    background: #999;
    }

div#map img {     /* override image CSS for the embedded Google map */
   padding: 0px;
   border: none;
   background: none;
   }
   
/* SCHEDULE PAGE CSS for Schedule Table */

table#schedule {
    font-family: Verdana, Geneva, Arial, sans-serif;
    border-top: 1px solid #999;
    border-left: 1px solid #999;
    }


table#schedule caption {
  /*  margin: 5px 0px 20px 0px;*/
    padding: 5px 0px 20px 0px;
    font-size: 2.0em;
    text-transform: uppercase; 
    color: #000033;
    }


table#schedule th, #schedule td {
    padding: 10px;
    border-right: 1px solid #999;
    border-bottom: 1px solid #999;
    }
    
table#schedule th {
    background: #ccc;
    text-align: left;
    font-weight: normal;
    font-size: .85em;
    }
    
table#schedule tr {vertical-align: top;} 
  
table#schedule th.daycol {width: 12%;}       /* to flexibly control the width of each column. Sum = 100% */ 
table#schedule th.timecol {width: 18%;} 
table#schedule th.eventcol {width: 48%}
table#schedule th.locationcol {width: 22%;}
    
table#schedule ol {
    list-style-type: circle;
    list-style-position: outside;
    font-family: Arial, sans-serif;   
    font-style: italic;
    background: #DED6B2;
    border: 2px dotted #FAFAD2;
    width: 90%;
    margin-left: 0px;
    padding: 10px 0px 10px 25px;
    line-height: 1.3em;
    }

ul#schedule_notes {
    list-style-type: circle;
    font-size: .9em;
    margin: 10px 0 0 12px;
    padding: 0;
    }

ul#schedule_notes li {
    margin: 0;
    padding: 2px;
    }
    
ul#schedule_notes li span {
    font-weight: bold;
    text-transform: uppercase;
    text-decoration: underline;
    }
    
/* MENU PAGE CSS */

dl#chef {
    max-width: 600px;
    }

div#menu ul {
    list-style: none;
    padding: 0px;         
    margin-left: auto;
    margin-right: auto;    
    }

div#menu ul.menuouter li {
    font-variant: small-caps;
    font-size: 1.3em;
    margin-top: 18px; 
    margin-bottom: 2px;
   }

div#menu ul.menuinner li {
    font-variant: normal;
    font-weight: normal;
    font-size: .7em;
    margin: 5px 0 0 10px;
    padding: 0px;
    }
    
/* FAQ PAGE CSS */

#faq #question_div {
    margin-bottom: 10px;
    }

#faq ul#questions {
    list-style-type: circle;
    margin: 0;
    padding: 0 0 0 17px;
    }
    
#faq ul#questions li { 
    margin: 0;
    padding: 1px 0;
    }

#faq dl {
    margin: 0;   
    }

#faq dt {
    padding-top: 10px;
    border-top: 1px dashed #999;
    font-weight: bold;
 /* background: url(../images/misc/up_arrow.png);  */
 /* background-position: right;  */
 /* background-repeat: no-repeat;  */
    }

#faq dd {margin: 10px 0 10px 10px;}

#faq img {
    padding: 10px 5px;
    }
    


/* PHOTOS PAGE CSS */ 

div.videogroup {   
    float: left;
    border: 1px solid #999;
    margin-bottom: 1.5em;
    padding: 1em 1.5em;
    }

div#video img {
    padding: .5em;  
    margin: 3px 0px;
    }
    
/* DIRECTIONS PAGE CSS */

#directions ul {
    list-style-type: circle;
    list-style-position: inside;
    margin: 25px 0 15px 15px;
    padding: 0;
    }

#directions ul#address {
    list-style-type: none;
    margin-top: 5px;
    line-height: 1.3em;
    font-variant: small-caps;
    font-size: 1.1em;
    }

#directions #turnbyturn_div {
    margin-bottom: 10px;
    }

#directions ul#turnbyturn {
    list-style-type: circle;
    margin: 0;
    padding: 0 0 0 17px;
    }
    
#directions ul#turnbyturn li { 
    margin: 0;
    padding: 1px 0;
    }

#directions dl {
    margin: 0;   
    }

#directions dt {
    padding-top: 10px;
    border-top: 1px dashed #999;
    font-weight: bold;
 /* background: url(../images/misc/up_arrow.png);  */
 /* background-position: right;  */
 /* background-repeat: no-repeat;  */
    }

#directions h3 {
    padding-top: 10px;
 /*   border-top: 1px dashed #999; */
 		color:black;
    font-weight: bold;
 /* background: url(../images/misc/up_arrow.png);  */
 /* background-position: right;  */
 /* background-repeat: no-repeat;  */
    }

#faq dd {margin: 10px 0 10px 10px;}


/* MAIL-IN REGFORM CSS */

#regform dl {
    margin: 0 0 10px 0;
    padding: 0;
    }

#regform dl dt {
    font-weight: bold;
    margin: 0;
    padding: 0 0 1px 0;
    }

#regform dd {
    margin: 0;
    padding: 6px 0 0 10px;
    }
    
#regform .regbox dd {
    margin-bottom: 10px;
    }
    
#regform dl#mmg {    
    margin-top: 5px;
    text-transform: uppercase;
    }
    
#regform dl#mmg dt, div#regform dl#mmg dd {
    margin: 0;
    padding: 0px;
    }
    
#regform table#feesched {
    border-top: 1px solid #999;
    border-left: 1px solid #999;
    border-collapse: collapse;
    margin-bottom: 10px;
    margin-right: 20px;
    }
    
#regform table#feesched caption {
    font-weight: bold;
    text-align: left;
    padding-bottom: 4px;
    margin: 0;
    }  

#regform table#feesched th, #feesched td {
    padding: 5px 10px;
    border-right: 1px solid #999;
    border-bottom: 1px solid #999;
    }
    
#regform table#feesched th {
    background: #ccc;
    text-align: left;
    font-weight: normal;
    font-size: .85em;
    }
    
#regform table#feesched tr {vertical-align: top;} 
  
#regform h4 {
    margin: 0 0 10px 0; 
    padding: 10px 0 0 0;
    /*border-top: 1px dashed #999;*/
    width: 90%;    
    color: black;
		font-weight: normal;
    }

#regform h3 {
    margin: 0 0 10px 0; 
    padding: 10px 0 0 0;
    /*border-top: 1px dashed #999;*/
    width: 100%;    
    color: black;
		font-weight: bold;
    }


/* LINKS & CONTACTS PAGES CSS */

div.list_outer dl {
    font-weight: normal;
    font-variant: normal;
    margin: 0;
    padding: 0;   

   }
    
div.list_outer dt {
    font-variant: small-caps;
    font-size: 1.2em;
    margin-top: 18px; 
    margin-bottom: 2px;
   }
    
div.list_outer dd {
    margin-left: 8px;
    margin-bottom: 2px;
   }
   

/* SHARED BY MENU AND LINKS & CONTACTS PAGES */

div.list_outer {          /* USEABLE ON MENU*/
    line-height: normal; 
    }

.float_me {               /* USEABLE ON MENU*/
    float: left;
    }
    
.first_float {
    margin-right: 5em;
    }    

div.list_inner {
    margin-bottom: 2em;   /* USEABLE ON MENU*/
    }


/* FOOTER CSS */

#footer {
    clear: both;
    border-top: 1px solid #ccc;
    background: #666666;
    font-size: .9em;
    color: #cc9;
    }

#footer dl {
    margin: 5px 0 0 0;
    padding: 0;
    text-align: center;
    }
    
#footer dt {
    text-transform: uppercase;
    font-size: 1.1em;
    font-weight: bold;
    margin: 0 0 2px 0;
    }

#footer dd {margin: 0 0 1px 0;}

#footer ul {
    margin: 0px 3px 3px 3px;
    padding: 0;
    list-style: none;
    font-size: .9em;
    overflow: auto;
    }

#footer ul li {margin: 8px 0;}

#footer ul li#uri {float: left;}

#footer ul li#lastmod {float: right;}

#footer dl dd a {text-decoration: none;}

#footer dl dd a:link {color: white;}
 
#footer dl dd a:visited {color: #cc9;}
 
#footer dl dd a:hover {color: black;}

#footer dl dd a:active {color: red;}

#ajaxticker1{
width: 600px;
height: 20px;
/*border: 1px ridge black;*/
padding: 5px;
background-color: #666666;
}

#ajaxticker1 div{ /*IE6 bug fix when text is bold and fade effect (alpha filter) is enabled. Style inner DIV with same color as outer DIV*/
background-color: #666666;
}

.someclass{ 
}

/* HACKS for self-clearing floats - Cederholm Bulletproof Web Design p 114 */

* html div.img_descr { height: 1% } /* for IE5+6 */

*:first-child+html div.img_descr { min-height: 1px } /* for IE7 */
    
* html dl.feature { height: 1% } /* for IE5+6 */

*:first-child+html dl.feature { min-height: 1px } /* for IE7 */