﻿/*

+----------------------------------------------------------------------------------------------------+
|                                                                                                    |
|    TYPOGRIDPHY - TYPOGRAPHICAL AND GRID LAYOUT CSS FRAMEWORK FROM HARRY ROBERTS OF CSS WIZARDRY    |
|                                                                                                    |
+-------------------------------------------------+--------------------------------------------------+
|                                                 |                                                  |
|   TYPOGRIDPHY IS © COPYRIGHT OF HARRY ROBERTS   |   v 0.1.1                                        |
|   IT IS FREE TO BE USED AND MODIFIED PROVIDED   |   May 2008                                       |
|   THIS TEXT REMAINS INTACT -- CSSWIZARDRY.COM   |   http://csswizardry.com                         |
|                                                 |                                                  |
+-------------------------------------------------+--------------------------------------------------+




/* RESET */
td {  
	margin:0; 
	padding:0; 
} 
th {  
	margin:0; 
	padding:0; 
} 
blockquote {  
	margin:0; 
	padding:0; 
} 
p {  
	margin:0; 
	padding:0; 
} 
textarea {  
	margin:0; 
	padding:0; 
} 
input {  
	margin:0; 
	padding:0; 
} 
fieldset {  
	margin:0; 
	padding:0; 
} 
form {  
	margin:0; 
	padding:0; 
} 
pre {  
	margin:0; 
	padding:0; 
} 
h6 {  
	margin:0; 
	padding:0; 
} 
h5 {  
	margin:0; 
	padding:0; 
} 
h4 {  
	margin:0; 
	padding:0; 
} 
h3 {  
	margin:0; 
	padding:0; 
} 
h2 {  
	margin:0; 
	padding:0; 
} 
h1 {  
	margin:0; 
	padding:0; 
} 
li {  
	margin:0; 
	padding:0; 
} 
ol {  
	margin:0; 
	padding:0; 
} 
ul {  
	margin:0; 
	padding:0; 
} 
dd {  
	margin:0; 
	padding:0; 
} 
dt {  
	margin:0; 
	padding:0; 
} 
dl {  
	margin:0; 
	padding:0; 
} 
div {  
	margin:0; 
	padding:0; 
} 
body {  
	margin:0; 
	padding:0; 
} 
table { 
	border-collapse:collapse; 
	border-spacing:0; 
} 
img {  
	border:0; 
} 
fieldset {  
	border:0; 
} 
var { 
	font-style:normal; 
	font-weight:normal; 
} 
th { 
	font-style:normal; 
	font-weight:normal; 
} 
strong { 
	font-style:normal; 
	font-weight:normal; 
} 
em { 
	font-style:normal; 
	font-weight:normal; 
} 
dfn { 
	font-style:normal; 
	font-weight:normal; 
} 
code { 
	font-style:normal; 
	font-weight:normal; 
} 
cite { 
	font-style:normal; 
	font-weight:normal; 
} 
caption { 
	font-style:normal; 
	font-weight:normal; 
} 
address { 
	font-style:normal; 
	font-weight:normal; 
} 
ul { 
	list-style:none; 
} 
ol { 
	list-style:none; 
} 
th { 
	text-align:left; 
} 
caption { 
	text-align:left; 
} 
h6 { 
	font-size:100%; 
	font-weight:normal; 
} 
h5 { 
	font-size:100%; 
	font-weight:normal; 
} 
h4 { 
	font-size:100%; 
	font-weight:normal; 
} 
h3 { 
	font-size:100%; 
	font-weight:normal; 
} 
h2 { 
	font-size:100%; 
	font-weight:normal; 
} 
h1 { 
	font-size:100%; 
	font-weight:normal; 
} 
q:after { 
	content:''; 
} 
q:before { 
	content:''; 
} 
acronym {
	border:0; 
}
abbr {
	border:0; 
}
/*---------- END RESET ----------*/


/*-------------------------------------------+
|                                            |
|            MAIN STRUCTURE STYLES           |
|                                            |
+-------------------------------------------*/
html{
	font-size:100%;
	min-height:101%;
}
body{
	font-size:66.5%;
	font-family:Georgia;
	color:#000000;
	background: #ffffff; 
	border-top:3em solid #B60000;
	text-align:justify;
	padding:0 1em;
}
#wrapper{
	width:70em;
	margin:0 auto;
}
#header{
	width:70em;
	padding-top:1.5em;
	margin-bottom:2em;
}
/*NAVIGATION
-------------------------------------------------------- */
#nav{
	font-size:2em;
}
#nav a{
	font-variant:small-caps;
	color:#B60000;
}
#nav a:hover{
	text-decoration:underline;
	color:#00597B;
}
#nav span{
	float:right;
	margin-top:-1.2em;
}
/*FOOTER NAVIGATION
-------------------------------------------------------- */
#footer-nav{
	word-spacing:0.2em;
}
#footer-nav a{ color:#B60000; font-weight:bold; text-decoration:none; border-bottom: 2px solid #79ABC4;}
#footer-nav a:hover { color:#00597B; font-weight:bold; text-decoration:none; border-bottom: 2px solid #79ABC4;}
#footer-nav a:visited{ color:#B60000; font-weight:bold; text-decoration:none; border-bottom: 2px solid #79ABC4;}


/*GRIDS
-------------------------------------------------------- */
/* Set styles common among all grids - all grid divs must be assigned this class */
.generic{
	border-top:0.5em solid #B60000; /* The border at the top of each grid */
	float:left;
	padding-top:1em;
	margin-bottom:2em;
	text-align: justify;
}
/* Sets styles for any 'start' grids - this class MUST be given to a grid that is the first in a horizontal series */
.clear{
	clear:both;
}
/* Sets styles for any 'end' grids - this class MUST be given to a grid that is the last in a horizontal series */
.end{
	margin-left:0 !important;
	margin-right:0 !important;
}
/* 280px */
.twoeighty{
	width:28em;
	margin-right:4em;
		margin-top:4em;
}
/* 340px */
.threeforty{
	width:34em;
	margin-right:2em;
}
/* 600px */
.sixhun{
	width:60em;
	margin-right:2em;
		float:left;
	padding-top:1em;
	margin-bottom:2em;
	text-align: justify;

}
/*-------------------------------------------+
|                                            |
|                FONT STYLES                 |
|                                            |
+-------------------------------------------*/
/*PARAGRAPHS
-------------------------------------------------------- */
.generic p{
	font-size:1.4em;
	line-height:1.4em;
	margin-bottom:0.5em;
	}

/*HEADINGS
-------------------------------------------------------- */
h1{
	color:#00597B;
	font-size:4em;
	margin-bottom:0.6em;
	font-style:italic;
	line-height:1.2em;
}
h2{
	color:#498EAF;
	font-size:3em;
	margin-bottom:0.9em;
	line-height:0.9em;
}
h3{
	color:#00597B;
	font-size:2em;
	margin-bottom:1.2em;
	line-height:1.2em;
	font-variant:small-caps;
}
h4{
	color:#B60000;
	font-size:2em;
	margin-bottom:1.5em;
	line-height:1.5em;
	font-variant:small-caps;
}
/*LINKS
-------------------------------------------------------- */
p a{ color:#B60000; font-weight:bold; text-decoration:none; border-bottom: 2px solid #79ABC4;}

p a:hover{ color:#00597B; font-weight:bold; text-decoration:none; border-bottom: 2px solid #79ABC4;}

h1 a{ color:#B60000; font-weight:bold; text-decoration:none; border-bottom: 2px solid #79ABC4;}

h1 a:hover{ color:#00597B; font-weight:bold; text-decoration:none; border-bottom: 2px solid #79ABC4;}

li a{color:#B60000; font-weight:bold; text-decoration:none; border-bottom: 2px solid #79ABC4;}

li a:hover{ color:#00597B; font-weight:bold; text-decoration:none; border-bottom: 2px solid #79ABC4;}


/*-------------------------------------------+
|                                            |
|               IMAGE STYLES                 |
|                                            |
+-------------------------------------------*/
img{
	font-size:1em;
}
img.left-img{ /* Float any image to the LEFT and give it some margin */
	font-size:1em;
	float:left;
	padding:4px;
	border:1px solid #ccc;
	margin-bottom:1.8em;
	margin-right:2em;
	margin-top:0.3em;
}
img.right-img{ /* Float any image to the RIGHT and give it some margin */
	font-size:1em;
	float:right;
	padding:4px;
	border:1px solid #ccc;
	margin-bottom:1.8em;
	margin-left:2em;
	margin-top:0.3em;
}
