/* base.css | v0.1 (28042010) 
 *
 * The purpose of this styles sheet is to set default styles for common browsers and address common issues (missing scrollbar, extended buttons in IE, gap below images, etc.)
 */
/* this choice of font-family is supposed to render text the same across platforms
 * letter-spacing makes the font a bit more legible
 */
.ss-xmreset{
	font-size:13px;
	line-height: 1.4;
	font-family: Arial, Helvetica;
}
.ss-xmreset h1, .ss-xmreset h2, .ss-xmreset h3, .ss-xmreset h4, .ss-xmreset h5, .ss-xmreset h6 {
  font-family: Arial, Helvetica;
  letter-spacing: .03em;
  margin:0 0 15px 0;
  padding:0;
}

.ss-xmreset ul, .ss-xmreset ol, .ss-xmreset form{
	margin:0 0 20px 0;
	padding:0;
}

.ss-xmreset pre, .ss-xmreset tt, .ss-xmreset code, .ss-xmreset kbd, .ss-xmreset samp, .ss-xmreset var {
  font-family: "Courier New", Courier, monospace;
}

/* These should be self explanatory
 */
.ss-xmreset h1 {font-size: 32px; letter-spacing:-0.5px; color:#fff; line-height:1;}
.ss-xmreset h2 {font-size: 20px; font-weight:bold; letter-spacing:-0.5px;}
.ss-xmreset h3 {font-size: 20px; font-weight:bold; letter-spacing:-0.5px;}
.ss-xmreset h4 {font-size: 1.2em; letter-spacing:-0.5px;}
.ss-xmreset h5 {font-size: 1.1em;}
.ss-xmreset h6 {font-size: 1em;}


/* styling for links and visited links as well as for links in a hovered, focus and active state 
 * make sure to keep these rules in that order, with :active being last
 * text-decoration: none is to make the links more legible while they are in a hovered, focus or active state
 * a:focus and :focus are used to help keyboard users, you may change their styling, but make sure to give users a visual clue of the element's state.
 * outline:none used with the pseudo-class :active is to avoid the sticky outline when a user clicks on a link, but choose to not follow it
 * note that the last rule does not do anything in IE as this browser does not support "outline" (besides, it treats :active and :focus the same)
 */
.ss-xmreset .hover{cursor:pointer;}
.ss-xmreset a {color: #000;}
.ss-xmreset a:visited {text-decoration: none;}
.ss-xmreset a:hover, .ss-xmreset .hover a {text-decoration: none; color:#fff;}
.ss-xmreset a:focus {text-decoration: none;}
.ss-xmreset a:focus,.ss-xmreset :focus {outline: none;}
.ss-xmreset a:active {outline: none;}

/* margin and padding values are reset for all these elements
 * you could remove from there elements you do not used in your documents, but I don't think it'd worth it 
 */
.ss-xmreset , .ss-xmreset p, .ss-xmreset dl, .ss-xmreset dt, .ss-xmreset dd, .ss-xmreset pre, .ss-xmreset code, .ss-xmreset fieldset, .ss-xmreset legend, .ss-xmreset input, .ss-xmreset button, .ss-xmreset textarea, .ss-xmreset blockquote, .ss-xmreset th, .ss-xmreset td {
  margin: 0;
  padding: 0;
}

/* this is to prevent border from showing around fieldsets and images (i.e., images inside anchors)
 */
.ss-xmreset fieldset, .ss-xmreset img {
  border: 0;
}

/* to prevent a gap from showing below images in some browsers 
 */
.ss-xmreset img {vertical-align: bottom;}

/* Styling of list items
 * This styles sheet contains a class to apply on lists to reset list-type and margin on LIs
 */
.ss-xmreset ol li {list-style-type: decimal;}
.ss-xmreset ul li {list-style-type: disc;}
.ss-xmreset ul ul li {list-style-type: circle;}
.ss-xmreset ul ul ul li {list-style-type: square;}
.ss-xmreset ol ol li {list-style-type: lower-alpha;}
.ss-xmreset ol ol ol li {list-style-type: lower-roman;}

/* These should be self explanatory
 * I believe *most* UAs style sub and sup like this by default so I am not sure there is value to include these rules here
 */
.ss-xmreset sub {
  vertical-align: sub;
  font-size: smaller;
}

.ss-xmreset sup {
  vertical-align: super;
  font-size: smaller;
}

/* color is to make that element stands out (see color set via body)
 * padding is used so Internet Explorer does not cut-off descenders in letters like p, g, etc.)
 */
.ss-xmreset legend {
  color: #000;
  padding-bottom: .5em; 
}

/* according to Eric Meyer's reset: tables still need 'cellspacing="0"' in the markup
 */
.ss-xmreset table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* caption and summary are very important for tabular data but because caption is nearly impossible to style across browsers many authors do not use it or use display:none to "hide" it (which is almost the same as not using it).
 * so to prevent such workaround, I am positioning this element off-screen
 */
.ss-xmreset caption {
  position: absolute;
  left: -999em;
}

/* all th should be centered unless they are in tbody (table body)
 */
.ss-xmreset th {text-align: center;} 
.ss-xmreset tbody th {text-align: left;} 

/* These should be self explanatory
 */
.ss-xmreset code {color: #06f;}
.ss-xmreset code, .ss-xmreset pre {font-size: small;}

/* This should be self explanatory
 */
.ss-xmreset blockquote, .ss-xmreset q, .ss-xmreset em, .ss-xmreset cite, .ss-xmreset dfn, .ss-xmreset i, .ss-xmreset cite, .ss-xmreset var, .ss-xmreset address {
  font-style: italic;
}

/* to prevent some browsers from inserting quotes on "q" and "p" ("p" in blockquotes)
 */
.ss-xmreset blockquote p:before, .ss-xmreset blockquote p:after, .ss-xmreset q:before, .ss-xmreset q:after {content: '';}

/* These should be self explanatory
 */
.ss-xmreset th, .ss-xmreset strong, .ss-xmreset dt, .ss-xmreset b {
  font-weight: bold;
}

.ss-xmreset ins {
  text-decoration: none;
  border-bottom: 3px double #333;
}

.ss-xmreset del {text-decoration: line-through;} 

.ss-xmreset abbr, .ss-xmreset acronym {
  border-bottom: 1px dotted #333;
  font-variant: normal;
} 

/* this is to reset the left/right gaps (created by the previous and next rules) on nested elements
 */
.ss-xmreset dd p, .ss-xmreset dd pre, .ss-xmreset dd ul, .ss-xmreset dd ol, .ss-xmreset dd dl, .ss-xmreset li p, .ss-xmreset li pre, .ss-xmreset li ul, .ss-xmreset li ol, .ss-xmreset li dl, .ss-xmreset fieldset p, .ss-xmreset fieldset ul, .ss-xmreset fieldset ol {
  padding-right: 0;
  padding-left: 0;
}

/* These should be self explanatory
 */
.ss-xmreset dd {
  margin-top: .5em;
}

.ss-xmreset li {margin-left:30px;}

/* we cannot use padding on a table to create left and right gaps (as we do with the elements above), instead we use margin 
 */ 
.ss-xmreset table {
  margin-right: 30px;
  margin-left: 30px;
} 

/* we use margin for hr for the same reason we do for table 
 */
.ss-xmreset hr {
  margin-right: 30px;
  margin-left: 30px;
  border-style: inset;
  border-width: 1px;
}


/* form elements
 * this should not affect the layout of the labels unless you style them in a way that padding applies
 * if I include this here it is mostly because when labels are styled with float and clear, top padding creates a gap between labels (bottom margin would, but not top margin)
 */
.ss-xmreset label {padding-top: 1.2em;}

/* line height helps to set the vertical alignment of radio buttons and check boxes (remember to group these in fieldsets) 
 */
.ss-xmreset fieldset {line-height: 1;}

/* vertical alignment of checkboxes (a different value is served to IE 7)
 */
.ss-xmreset input[type="checkbox"] {
  vertical-align: bottom; 
  *vertical-align: baseline;
}

/* vertical alignment of radio buttons
 */
.ss-xmreset input[type="radio"] {vertical-align: text-bottom;}

/* vertical alignment of input fields for IE 6
 */
.ss-xmreset input {_vertical-align: text-bottom;}

/* a specific font-size is set for these elements
 */
.ss-xmreset input, .ss-xmreset button, .ss-xmreset textarea, .ss-xmreset select, .ss-xmreset optgroup, .ss-xmreset option {
  font-size: .9em;
}

/* this is to fix IE 6 and 7 which create extra right/left padding on buttons
 * IMPORTANT: because IE 6 does not understand the first selector below, you need to apply the class "inputButton" to all input of type="button" in your documents
 * the first declaration is for IE 6 and 7, the second one for IE 6 only, the third one is for all browsers.
 */
.ss-xmreset button,
.ss-xmreset input[type="submit"],
.ss-xmreset input[type="reset"],
.ss-xmreset input[type="button"],
.ss-xmreset .inputButton {
  *overflow: visible;
  _width: 0;
  padding: .2em .4em;
}

/* Auto Clearing Method ( Not for IE ) */

.ss-clearfix:after{content: "."; display: block; height: 0; clear: both; visibility: hidden;}

/* CUSTOM STYLES */

.ss-xmreset .ss-floatLeft {
	float:left;
	display:inline; 
	margin:0 2em 1em 0;
}
.ss-xmreset .ss-floatRight {
	float:right;
	display:inline; 
	margin:0 0 1em 2em;
}

@media print{
	@import url("print.css");
}