html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
}
body {
    height: 100%;
    background: #fff;
    color: #444;
    line-height: 1.4;
}

blockquote, q {quotes: none;}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
/*:focus {outline: 0;}*/

/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* remove Dotted Outline on Links */
a {outline: none;}

/* removing the Border from Image Links */
a image {border: none;}

/* base.css | v0.2 (03282010) | Thierry Koblentz */

/* using height:100% on html and body allows to style containers with a 100% height
 * the overflow declaration is to make sure there is a gutter for the scollbar in all browsers regardless of content
 * note that there is no font-size declaration set in this rule. If you wish to include one, you should use font-size: 100.01% to prevent bugs in IE and Opera
 */
html {
    height: 100%;
	overflow-y: scroll;
}

/* this choice of font-family is supposed to render text the same across platforms
 * letter-spacing makes the font a bit more legible
 */
body, input, button, textarea, select {
	font-family: "Palatino Linotype", Freeserif, serif;
	letter-spacing: .05em;
}
h1, h2, h3, h4, h5, h6 {
	font-family: Georgia, "DejaVu Serif", serif;
	letter-spacing: .1em;
}

/* These should be self explanatory */
h1 {font-size: 1.5em;}
h2 {font-size: 1.4em;}
h3 {font-size: 1.3em;}
h4 {font-size: 1.2em;}
h5 {font-size: 1.1em;}
h6 {font-size: 1em;}

h1, h2, h3, h4, h5 {font-weight: normal;}

/* 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)
 */
a:link {color: #000;}
a:visited {text-decoration: none;}
a:hover {text-decoration: none;}
a:focus {text-decoration: none;}
a:focus,:focus {outline: 1px dotted #000;}
a:active {outline: none;}

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

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

ol, ul {list-style: none;}

/*li {margin-left:30px;}*/

/* Styling of list items
 * This style sheet contains a class to apply on lists to reset list-type and margin on LIs */


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

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

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

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

/* top margin solution */
/* this is my approach to create white space between elements, you do not have to adhere to it
 * rather than stylling these elements with top and bottom margin, or simply bottom margin I only use top margin */
h1, h2, h3, h4, h5, h6, p, pre, dt, hr, legend, input, button, textarea, select, address, table {margin-top: 1.2em;}

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

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

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

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

/* a specific font-size is set for these elements */
input, button, textarea, select, optgroup, 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.
 */
button,
input[type="submit"],
input[type="reset"],
input[type="button"],
.inputButton {
	*overflow: visible;
	_width: 0;
	padding: .2em .4em;
}

/* External link styling*/
/*a[href^="http://"] {
	background: transparent url(../images/icons/external.png) center right no-repeat;
	display: inline-block;
	padding-right: 18px;
}*/

/* File type links */
/* PDF document links */
a[href$='.pdf'] {
	background:transparent url(../images/icons/acrobat.png) center left no-repeat;
	display:inline-block;
	padding-left: 20px;
	line-height: 18px;
} 
/* Word Document Links 
a[href$='.doc'], a[href$='.rtf'], a[href$='.wps'], a[href$='.txt'] {
	background:transparent url(../images/icons/word.png) center left no-repeat;
	display:inline-block;
	padding-left: 20px;
	line-height: 18px;
}*/
/* Text Document Links 
a[href$='.rtf'], a[href$='.txt'] {
	background:transparent url(../images/icons/text.png) center left no-repeat;
	display:inline-block;
	padding-left: 20px;
	line-height: 18px;
}*/
/* mailto: links */
/*a[href^="mailto:"] {
	background:transparent url(../images/icons/mailto.png) center left no-repeat;
	display:inline-block;
	padding-left: 20px;
	line-height: 18px;
}*/
