/* SeCommerce Zen theme/elements.css - version 0.4 2009-1-8
** http://www.silverearth.com/
**
** Base font settings are defined here along with basic styling of raw HTML elements.
**
** THIS FILE IS NOT MEANT TO BE EDITED DIRECTLY. Instead, override or extend these
** definitions by placing your custom CSS in the custom.css file; you may also create
** your own CSS files and link them to your site template.
*/

/***********************************************************************************
** Fonts
**
** Font sizing is based primarily on the following article:
** http://www.alistapart.com/articles/howtosizetextincss
**
** Specifying a 100% font-size in the body element helps keep IE browsers from
** incorrectly rendering fonts too large or small when fonts are resized in the browser.
**
** Specifying the font-size and line-height in ems, relative to the default 16px used
** by all modern browsers, produces the most consistent results across different browsers,
** while still allowing users to resize fonts in the browser (specifying font sizes in px
** makes it impossible to resize fonts in IE browsers).
**
** IMPORTANT: ALL OTHER FONT SIZES WILL BE RELATIVE TO THE VALUE SET HERE.
*/
body {
  font-size: 100%; /* Prevent exaggerated font resizing in IE6 and 7. */
}

#container {
  font-size: 0.813em;  /* 13px */
  line-height: 1.385em; /* 18px */
}

body, input, textarea, select {
  /* For recommendations on what fonts to set here, refer to 
     http://www.ampsoft.net/webdesign-l/WindowsMacFonts.html
     http://www.apaddedcell.com/web-fonts
     http://unitinteractive.com/blog/2008/06/26/better-css-font-stacks */
  font-family: Lucida Sans, Lucida Grande, Lucida Sans Unicode, sans-serif;
}

textarea {
  font-size: 1em; /* Without this, the font may get rendered at 16px regardless of the above settings. */
}

code, pre {
  font-family: Consolas, "Courier New", Courier, monospace;
  font-size: 1.083em; /* 13px: monospaced fonts are often harder to read. */
}
  
/***********************************************************************************
** Headers
**
** Heading sizes need to be set explicitly, or else each browser will render them differently
** according to its own default settings.
*/
h1 {
  font-size: 2em;     /* 24px */
  margin: 0.5em 0;    /* 12px */
}

h2 {
  font-size: 1.5em;   /* 18px */
  margin: 0.667em 0;  /* 12px */
}

h3 {
  font-size: 1.333em; /* 16px */
  margin: 0.75em 0;   /* 12px */
}

h4 {
  font-size: 1.167em;  /* 14px */
  margin: 0.857em 0;   /* 12px */
}

h5 {
  font-size: 1.083em;  /* 13px */
  margin: 0.923em 0;   /* 12px */
}

h6 {
  font-size: 1em;
  margin: 1em 0;
}

/***********************************************************************************
** Standardize block-level elements to ensure they get rendered the same in all browsers.
**
*/
p, ul, ol, dl, pre, table, fieldset, blockquote {
  margin: 1em 0;
}

ul, ol {
  margin-left: 0;
  padding-left: 2em;
}
  
li {
  margin: 0;
  padding: 0;
}

dt {
  margin: 0;
  padding: 0;
}

dd {
  margin: 0 0 0 2em;
  padding: 0;
}

table {
  border-collapse: collapse;
  width: 100%;
}

th {
  text-align: center;
  font-size: 1.167em; /* 14px */
  padding: 0.5em;
}

td {
  vertical-align: top;
}

img {
  border: 0;
}

/***********************************************************************************
** Links
**
** The order of link states used here is based on the following article:
** http://meyerweb.com/eric/thoughts/2007/06/11/who-ordered-the-link-states
*/
a:link {
  text-decoration: none;
  color: #07b;
}

a:visited {
  text-decoration: none;
  color: #159;
}

a:hover {
  text-decoration: underline;
}

a:focus {
}

a:active {
}

/***********************************************************************************
** Forms
*/
form {
  margin: 0;
  padding: 0;
}

fieldset {
  padding: 0.5em 1.5em;
}