/* Davey Here.  Welcome to Elizabethan Fare's cascading style sheet.                     */
/* www.elizabethanFare.com                                                               */
/* email praise to elizabeth@elizabethanFare.com                                         */
/* updated 2010.05.13 2009.07.02 2008.10.10  06.11 10  05 04 03  05.30 29 28 27   22 21 20          */
/*                                                                                       
The following is an attempt to itemize all the structures within eFare.com's html pages. 
Each may demand a separate presentation, as you like it.
     category: aka titleLarge (distinguishing Catering/Event Planning/Locations/Service Providers  from specific service providers like Vermont Digital Productions)
     instance: aka title
     tagline - N.B. capitalization: there aint any
     text
     firstLetter
     mainContent (not the header image, not the footer, not the navigation side or navigation bottom)
     navigationSidebar
     navigationFooter
     backToTop
     finePrint: aka textSmall
     finePrintLink: aka linksSmall
     serviceProvider (has links to a bunch of different ones; handy to change text alignment of link list)
     backToServiceProviders
     gratuitousPlugs - for service providers that eFare uses & hopes will link back to eFare to improve search engine optimization - name isn't helpful for meaning - this is the container for the specific stuff that serviceProviders links point to.
     links
     linkToCategory: aka linksLarge
     linksMenu - navigation menu for menuSelections.html has different color - maybe keep this color for all links?
     photographerCredit - for Christopher David
     textForm - plain text w/ unusual color - used as form captions - might use as 2nd color for text elsewhere
matching the linksMenu color.
     eventPlanning textForm - not the same as textForm dammit - used on Event Planning page which may take over the contact.php page
     bold or emphasized - for contact us categories & for who we are names (not as prominent as title)
     italicized - for testimonials
     italicized bold - for testimonial signatures
*/

/*     color numbers 
  cream colored background used on all pages  #EEEBC8
  darker cream to simulate navigation sidebar #E3DFBA
  dark purple color #531B4A
  old yucky   color #663333
  dark green  color #003300
  baby bright blue  #01AFF0
  lovely blue       #000066 used in contact form
  lovely maroon     #660000  should consider instead of green
  gold (but don't call it that)	#FFD700  - by the name of gold won't permit css verification
*/

/*     margin specifications 
  margin-top:    0px;
  margin-right:  0px;
  margin-bottom: 0px;
  margin-left:   0px;
*/

/* DEPRECATED .underscore {  color: #000000; text-decoration: none} */

/* the built into css way of doing the first letter specification (e.g. see below) is buggy so I don't use it */
/* <div class="verse">  */
/* p {} */
/* .verse p:first-letter{font-weight: bold;}  */
/* firstLetter is apparently only used on home page for the first letter of every paragraph - nice use of span - script*/
.firstLetter {  font-family: "Edwardian Script ITC"; font-size: 24px; color: #003300; font-weight: 300}

/* underlineNot is used on the left hand navigation column on every page. It's name is more meaningful than the above underscore and should be used instead.  It might find a use on the footer navigation links too, eh? */
/* I'm embarrased to have to use underlineNot but I couldn't get it to work as a child of a child of span (i.e. 
span.navigationFooter.a  Silly davey, the syntax that might work better is "span navigation.a" */
.underlineNot {  color: #000000; text-decoration: none;} /* note the color specification is being over-ridden */

/* underlineNot following is used on new index.html page w/ pictures - 2010.05.13 */
.underlineNot a button img {  color: #E3DFBA; text-decoration: none;} /* color should be same as color for button */

button {color: #531B4A; background-color: #E3DFBA }

button:hover{
  color: #E3DFBA;  /* cream: #E3DFBA; green: #003300; */
  background-color: #660000;   /*  purple: #531B4A; #EEEBC8; */
}


body /* consider text -- aka color -- having same color as background */
{
background:   #531B4A;  /* purple grape color - not the burgundy of eFare */
color:        #003300;  /* text color that is - dark green */ /*  #660000;  */ /* lovely maroon */
}
a:link    { color: #003300; } /* dark green */
a:visited { color: #003300; } /* dark green */

/* debugging layout: factoring out common border width */
.mainContent, .navigationSidebar, .navigationFooter, .finePrint, h1, h2, h5, .right, .left, .center, .captionAbove, .captionRight, .captionBelow, .captionLeft, .pictureAndCaption, .spacer, .recommendedServiceProviders ul .sampleMenuNavigation .sampleMenuNavigation ul{
  border-width:  0px;
  border-style:  solid;
}

/* debugging validation certification & testor */
.validatorXHTMLandCSS{
  display: none; /* previously : none;  : block;*/
}

/* font specification grouped together in one place */
p, ul, div, h3 {
font-family: verdana, arial, helvetica, sans-serif; /* verdana! */
font-size: small; /* yes! */
}

/* unordered list apparently better than bunch of break tags */
ul {
  list-style-type: none;
  float: left;
  margin:        0px;
  border-color:  gray;
  border-width:  0;
  border-style:  solid;
  padding-top:     0;
  padding-right:   0;
  padding-bottom:  1em;
  padding-left:    0;          /* bingo: needed padding-left: 0; to move list left */
}


/* in the process of removing tables, had to add multiply nested div's.  */
/* negativeSpaceForWebDesigner is one of them, permits finePrint to be displayed outside the mainContent */
.negativeSpaceForWebDesigner{
  width: 640px;  /* formerly 640. not sure this is necessary */
  background-color: #E3DFBA;  /* darker cream that simulates navigation sidebar */
  background-image: url(images/background2column.jpg); /* success! */
  margin:        1px auto 1px auto;  /* toggle me */
  border-style:  solid;
  border-color:  black;
  border-width:  3px;
  padding-top:     0;
  padding-right:   0;
  padding-bottom:  0;
  padding-left:    0;
}

/* following added 2010.05.13 for indexWithPics */
.negativeSpaceForWebDesigner .indexWithPics{
  background-color: #EEEBC8;  /* green: #003300; light cream: #EEEBC8; */
}

.mainContent { 
   width: 461px;   /*  465 278 481 467 496px 467px */ /* width is inherited by links.html serviceProvider ul li */
/*  height: auto; */
  background-color: #EEEBC8;  /* cream */
  margin: auto; /* N.B. navigationFooter needs to inherit value of margin bottom left */
  padding: 16px 16px 16px 16px;
  border-style:  solid;
  border-color:  yellow;
  float:  right;
}

/*           <td width="144" valign="top" rowspan="2"> */
/* navigationSidebar is used in left hand navigation column on every page */
.navigationSidebar{
  width: 128px; /* formerely 142 144 */
/*  background-color: E3DFBA; */  /* darker cream slight green hue */ /* unfortunately over-rides background image so do not use*/
  margin-top:    70px; /* formerly 70px 98px 84px */
  margin-right:  3px; /* formerly 3px */
  padding:       0 4px 0 0; /* formerly 12px */
  border-style:  solid;
  border-color:  purple;
  float:         left;
}

.navigationSidebar a {
  text-decoration: none;
}

.navigationSidebar ul {
  float:         right;
}

/* a touch of purple for ya, sour grapes */
.navigationSidebar ul li a:HOVER {
  color: #531B4A;
}


.navigationSidebar li {
  margin:        0 0 0 0;
  padding:       8px 0 0 0; /* formerly 12px 0 0 0 */
  text-align:    right;
  font-family:   times; /* formerly verdana, arial, helvetica, sans-serif; */
  font-size:     17px;
  font-weight:   bold;
}

/* div.navigationFooter is used on bottom navigation row on every page except.  Maybe it should be a child of mainContent. */
/* maybe it shouldn't have any association with mainContent what so ever. */
/* except index.html over-rides this specification. lol. */
.navigationFooter{  
  margin:    1.1em 0 0 0;  /* should inherit from mainContent class in which its display is embedded */
  border-style:  solid;
  border-color:  gray;
  padding:       1em 0 0 0; 
  text-align: center;
  clear: both;
}

.navigationFooter a{
  text-decoration: none;
}

/* purple matching the navigation side bar color */
.navigationFooter a:HOVER{
  color: #531B4A;
}

.backToTop {
  margin:  0 0 20px 0;
  padding: 12px 0 12px 0;
  text-align: center;
  clear: both;
}

.finePrint {
  text-align: center;
  margin:        1px auto 1px auto;
  border-color:  gray;
  clear: both;   /* may be a mickey mouse fix, but was required for Firefox at one point */
}

.finePrint p {
  font-size:    0.8em;
  color:        white; /* formerly  #FFFFCC; */ /* white */
  text-align: center;  
  margin:        0 0 0 0;  
  padding-top:     1px;
  padding-right:   0;
  padding-bottom:  0;
  padding-left:    0;      
}



/* factoring out common attributes for headlines */
h1, h2, h5 {
  margin-top:    0.1em;     /* sometime 10px; */
  margin-right:  0px;
  margin-bottom: 0.1em;     /* sometime 10px; */
  margin-left:   0px;
  border-color:  gray;
  padding:       0; 
}

/* h1 is used for Categories e.g. Catering/Event Planning/Locations/Service Providers.*/
/* h1 is used on cheese page */
h1
{
font-family: arial, helvetica, verdana ; /* formerly - I like : helvetica & can't distinguish from :arial; not fond of :verdana;  Try  sans-serif */
font-size: 1.4em;      /* formerly : 18px; font size em is relative to parent element which is ? */
font-weight: bold;     /* prefer it to be spread out a bit; formerly :bold; :normal :500; */
color: #531B4A;        /* purple grape color - not the burgundy of eFare */
}

/* h2 is used for Instances of Categories e.g. specific service providers like Vermont Digital Productions*/
h2
{
  font-family: verdana;
  text-align: center;
  font-size: 1.2em;
  font-weight: bold;
  color: #003300;      /* dark green */
  clear: both;
}

/* h3 is no longer used in left hand navigation column on every page.*/
/* h3 not used on service page */
/* h3 is used on cake page - strong & spaced */
h3
{
  font-weight: bold;
  margin: 0 0 12px 0;
  padding: 50px 0 0 0;
}

/* deprecated: h4 is used in left hand navigation column on photo gallery pages, including hors d'oeuvres & cheese pages.*/
/* I would like to deprecated this & use it as h3 so as to free up h4 on services.html but I'll use h5 instead */
/* h4 not used on service page */
h4 
{

}

/* h5 is used for specific service providers by name     */
h5 
{
  font-family: verdana;
  text-align: center;
  font-size: 1em;  /* this aint so different from h2 1.1em */
  font-weight: bold;
  color: #003400;  /* not dark green anymore*/
  clear: both;
}

.right { /* Modified from Jim's code. Thanks, Jim. */
  margin-top:    0px;
  margin-right:  0px;
  margin-bottom: 0px;
  margin-left:   0px;
  padding:       12px 0px 12px 12px;
  border-color:  red;
  text-align:    right;  /* maybe this is symmetry taken too far */
  float:         right;
}

.left { 
  margin-top:    0px;
  margin-right:  0px;
  margin-bottom: 0px;
  margin-left:   0px;
  padding:       12px 12px 12px 0px;
  border-color:  blue;
  float:         left;
}


/* glaringly missing is center.  how do you specify float center? */
.center {
  margin: 9px auto 9px auto;  /* could try 10px */
  padding:        0 0 0 0; 
  border-color:  #FFD700;  /* yellow? FFD700 */
  text-align: center;  /* works for div tags & p tags but not img tags. go figure. so put div tags around img . */
  clear: both;
}


.captionAbove { /* deprecated */
  margin:         0 0 0 0;
  padding:        12px 0 0 0; 
  border-color:   blue;
  text-align:     center;
}

.captionRight { /* deprecated */
}

.captionBelow { /* deprecated. note name change: formerly caption BEWARE STILL IN USE by cakes & tabletop*/
  margin:         -12px 0 10px 0;
  padding:        0 0 20px 0; 
  border-color:   blue;
  text-align:     center;
}

.captionLeft { /* deprecated */
  margin:         0 0 0 0;
  padding:       12px 0px 12px 4px;
  border-color:  red;
  text-align:    right;  /* maybe this is symmetry taken too far */
  float:         left;
}


.spacer {
  margin:  0 0 0 0;
  padding: 12px 0 0 0;
  border-color: fuchsia;
}

.clear {          /* A bit redundant, I suppose */
  clear: both;
}

.clear p{        /* when h3 won't do - i.e. inherits margins & padding from h3 */
  margin: 0 0 12px 0;
  padding: 50px 0 0 0;
}

.clearRight {     /* A bit redundant, I suppose */
  clear: right;
}

.clearLeft {      /* A bit redundant, I suppose */
  clear: left;
}

/* photographerCredit is used on horsdoeurves.php mainCourse.php for Christopher David */
.photographerCredit {
  font-size:    0.8em;
  color:        black;
  margin:       0 0 0 0;  /* margin to be over-ridden on a page-specific basis */
}

/*  begin index.php specifics  or is it index.html  or  is it home                                              */
.home {
  margin:        0 22px 0 22px;
  padding:       0 0 0 0;
  line-height:   18px;
}

.home p {

}
/* MS Internet Explorer has been choosing its own defaults for line-height which are the defaults FireFox uses. */
.home p .firstLetter {
  line-height:   24px;
}
/* to align vermont vows seal with bottom navigation */
#col1 {float:left;width:70%;}
#col2 {float:left;width:30%;margin: -1.0em 0 0 0;}
#col2 img{border:0px solid #EEEBC8;}  /* needs to be same color as the background image, cream in this case */
}

/*  end index.php specifics                                                                                */

/*  the following is specific to the services.php page                                                     */
/* serviceProviders is a division within category services on services.php page */
.serviceProviders {
  margin-left:   1em;
  margin-right:  0em;
  margin-bottom: 1em;
  border:        0;
  text-align:    right;
}
/*  the above is specific to the services.php page                                                         */

/*  the following is specific to the links.php page               aka recommended service providers page   */

/* verify: recommendedServiceProviders is internal page navigation link within category services on links.php page */
.recommendedServiceProviders {
  margin-left:   1em;
  margin-right:  0em;
  margin-bottom: 1em;
  border:          0;
  text-align: center;
}

.recommendedServiceProviders ul{
  margin-left:   auto;
  margin-right:  auto;
  padding:       10px 160px 40px 160px;  /* the magic 160px number is derived from .mainContent width */
  border-color:  red;
}

.recommendedServiceProviders ul li{
  margin-left:   auto;
  margin-right:  auto;
}

/* backToServiceProviders is in page navigation link on links.php page */
.backToServiceProviders   {  
  text-align:      center;    /* center me please  */
  text-decoration: underline; /* underline for links got turned off somewhere so turn back on */
  margin-top:    1.1em;       /* not affecting every instance but affecting some */
  margin-right:  0px;
  margin-bottom: 1.1em;
  margin-left:   0px;
  border-width:  0;
  border-style:  solid;
  border-color:  red;
  padding:       1em; 
  clear: both;
}

.nameAndAdress {
}

.nameAndAdress ul {
               /* move list left is inherited from ul*/
}

.gratuitousPlugs {
}

.gratuitousPlugs ul {
}

.tagline { 
  color:         #000066;
  clear:         both;
  text-align:    center;    /* center me please - N.B. works for div but not for span, of course!  */
}


/*   links.php page specific end                                                                                */

/* begin cheese.php page specific                                                                               */
.cheese{
}
.cheese h4{
  margin:        0px 0px 0px 0px;
  padding:       0px 0px 0px 0px;
  font-weight:   normal;
  font-size:     12px;
}


/* end cheese.php page specific                                                                                 */

/* begin contact.php page specific                                                                              */

/* textForm is used on contact.php page */
.textForm {
  color:         #000066;  /* lovely blue */
  text-align:    center;
}

/* contact used on contact.php page */
.contact {
}

.contact .nameAndAddress {
  margin: 6px 0 0 48px;
}

.contact p {
  margin: 10px 0 0 0;
}
/*  contact.php page specific  end                                                                    */


/* begin eventPlanning.php page specific                                                                              */
/* copying this verbatim from Joomla inplementation - bloated and shameful                                            */

.eventPlanning {
  width: 461;
}

.eventPlanning .textForm {
  color: #003300; /*  should inheret from body not from Contact Us page's use of .textForm -  dark green  color #003300  */
  text-align:    left; /* as holly rae would say, "for the love of god." */
}

.eventPlanning h4 {
  margin: 0em 0em 0em 0em;
  padding: 0em 0em 0.3em 0em;
  color: #531B4A;  /* dark purple color #531B4A; */
}

/* f1 is used in menu creation fieldset from salad on down - from 2008.summer - where I gave up updating 2009.summer */
.f1 {

}


/* I think the following may be current. consider not trashing when ready.  But what did it do? */
/* oh my god. you're not serious.  wtf.  delete this at once */
.textFormEventPlanning fieldset div .f1 {
float: left;
  padding: 3px 0 0 10px;
  margin: 3px 0 0 10px;
background-color: #ccc;
}

/* this is class for all the menu creation fieldset multiline text input boxes  - classes are more powerful than ids or at least more general */
.inputTextField {
  width: 32em;
  float: left;
  color: black;
/*  background: lime;*/
  margin: 0.5em 1.0em 1.0em 0em;
  border: 1px solidt #d7b9c9
}


#finalComments_inputTextField {
  width: 34em;
}

/* eventPlanning used on eventPlanning.php page */

#eventPlanning_submit:HOVER {
  font-weight:  bold;
}


/* yes verified this is in use */
 .eventPlanning .continued{
  margin:        0px 0px 0px 40px;
}

.eventPlanning p {
  margin: 10px 0 0 0;
}

.eventPlanning fieldset {
/* width: 220px; */
  margin: 30px 0.0em 0.0em 0.0em;
}

.eventPlanning legend {
  font-family:   arial;
  font-size: 20px;
}

.eventPlanning #event p label {
  width: 9em;
  float: left;
  text-align: right;
  margin-right: 0.5em;
  display: block
}

.eventPlanning #event p input{
  width: 16em;
  color: black;
  background: white;
  border: 1px solidt #d7b9c9
}

/* should match the width of input. Glad to know that 16em=19em. Makes me very very happy. I'm going to go hang myself. */
.eventPlanning #event p textarea{
  width: 19em;
  color: black;
  background: white;
  border: 1px solidt #d7b9c9
}

.eventPlanning #timeLineDevelopment {
 /* width: 220px; */
}

.eventPlanning #timeLineDevelopment p label {
  width: 27em;  /* davey says change this width to be greater than 27em and I'll hunt you down and you will wish you had not */
  float: left;
  text-align: left;
  margin-right: 0.5em;
  display: block
}

.eventPlanning #timeLineDevelopment p input {
  width: 10em;
  float: left;
  color: black;
/*  background: red; */
  margin-right: 1.0em;
  border: 1px solidt #d7b9c9
}

.eventPlanning #timeLineDevelopment p textarea {
  width: 34em;
  float: right;
  color: black;
 /* background: red; */
  margin-right: 1.0em;
  border: 1px solidt #d7b9c9
}




.eventPlanning #menuCreation p label {
  width: 27em;
  float: left;
  text-align: left;
  margin-right: 0.5em;
  display: block
}

.eventPlanning #menuCreation p input {
  width: 10em;
  float: left;
/*  color: black; */
/*  background: yellow; */
/*  margin-right: 1.0em; */
/*  border: 1px solidt #d7b9c9 */
}
.eventPlanning #menuCreation .clear {
  margin: 0em 0em 0em 0em;
  padding: 1.0em 0em 1.0em 0em;
}




/*  eventPlanning.php page - what an embarrassment - bloated beyond belief      */

/*  eventPlanning.php page specific  end       */



/*  horsdoeuvres.php page specific  beginning                                                         */
.horsdoeuvres{
}

/* photographerCredit is used on horsdoeurves.php for Christopher David */
/* not happy about having to specify in pixels where div should go; need way of relating placement to bottom of photo */
.horsdoeuvres .photographerCredit {
  margin:       170px 0 0 0;
}
/*  horsdoeuvres.php page specific  end                                                               */ 

/*  locations.php page specific  beginning                                                            */
.locations{
}
/*  locations.php page specific  end                                                                  */ 

/*  mainCourse.php page specific  beginning                                                           */
.mainCourse {
}
.mainCourse .photographerCredit {
  margin:       70px 0 0 0;
}
/*  mainCourse.php page specific  beginning                                                           */


/* begin sampleMenu.php page specifics                                                                */
/* sampleMenu is everything on sampleMenu.php & contains two partitions: sampleMenus and sampleMenuNavigation */
.sampleMenu {
  background:  #EEEBC8;
}

.sampleMenus {
  margin:        0px auto 0px auto;
  padding:       0px;
  border-color:  aqua;
/*  border-width:  1px;   */
/*  border-style:  solid; */
  text-align:    center;
  clear:         both;
}

.sampleMenus h2 {

  margin:       24px 0 24px 0;
  padding:      0 0 0 0;
  text-align:   center;
  clear:         both;
}

.sampleMenus h3 {
  font-weight:  bold;
  margin:       26px 0 12px 0;
  padding:      0 0 0 0;
  text-align:   center;
  clear:         both;
}

.sampleMenus h4 {
  font-weight:  normal;
  margin:       0 0 0 0;
  padding:      0 0 0 0;
  text-align:   center;
  clear:         both;
}

.bottomLine {
  margin:       60px 0 24px 0;
  padding:      0 0 0 0;
  text-align:   center;
  clear:         both;
}

/* we are very displeased with this .sampleMenuNavigation level of specificity */
.sampleMenuNavigation {
  margin:        0px auto 0px auto;
  border-color:  aqua;
/*  border-width:  1px;   */
/*  border-style:  solid; */
  text-align:    center;
}

.sampleMenuNavigation ol {
  margin:        0px auto 0px auto;
  padding:       10px 211px 40px 211px;  /* the magic 211px number is pure elbow grease. */
  border-color:  teal;
/*  border-width:  1px;   */
/*  border-style:  solid; */
}

.sampleMenuNavigation ol li {
  margin-left:   auto;
  margin-right:  auto;
  border-color:  silver;
/*  border-width:  1px;   */
/*  border-style:  solid; */
}

/* end sampleMenu.php page specifics                                                                  */


/* begin tabletop.php page specifics                                                                  */
.tabletop{
}
/* end tabletop.php page specifics                                                                    */

/* begin testimonials.php page specifics                                                              */
.testimonials{
}

.testimonials p{
  margin:        12px 0px 12px 0px;
  padding:       0px 0px 0px 0px;
/* formerly   text-decoration: underline; */
}

/* end testimonials.php page specifics                                                                */

/* blockquote is used in testimonials.php */
blockquote {
  margin-bottom: 80px;
  font-style: italic;
/*  color:    blue; */
}

/* begin thanks.php page specifics                                                                    */
.thanks{
  margin:        90px 0px 150px 0px;
  padding:       0px 0px 0px 0px;
}
/* end thanks.php page specifics                                                                      */

/* begin who.php page specifics                                                                       */
.who{
}

.who p {
  margin:        0px 0px 38px 0px; 
  padding:       12px 0px 0px 0px; /* unfortunately the padding-top has to inherit value from .left */
}

/* end who.php page specifics                                                                         */
/* begin chooseYourOwnMenu.php page specifics                                                         */
.chooseYourOwnMenu{
}
.chooseYourOwnMenu h3{
  margin:        14px 0px 6px 0px; 
  padding:       0px 0px 0px 0px;
  font-weight:   normal;
  font-size:     14px;
  font-weight:   bold;
}
.chooseYourOwnMenu h4{
  margin:        0px 0px 0px 0px; 
  padding:       0px 0px 0px 0px;
  font-weight:   normal;
  font-size:     12px;
}

.chooseYourOwnMenu .continued{
  margin:        0px 0px 0px 25px; 
}

.chooseYourOwnMenu span{
  color: teal;
}
/* end chooseYourOwnMenu.php page specifics                                                           */
/* ttd is used on chooseYourOwnMenu.php */
.ttd {
  margin:        0px 0px 0px 0px; 
  padding:       12px 0px 0px 0px;
  color: red;
}