/* -----------------------------------*/
/* ---------->>> LAYOUT <<<-----------*/
/* -----------------------------------*/

* { margin: 0; outline: none; }

html, body { background: #ccc url(img/bg.png) repeat-y 0% 0%; height: 100%; }

#wrapper{ min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -35px; /* the bottom margin is the negative value of the footer's height */margin-bottom: 1px; }

#footer, #push { clear: both; height: 35px; }

#header{ background: url(img/header.jpg) no-repeat 0% 0%; height: 220px; }

#leftcolumn{ float: left; width: 180px; margin: 20px 0 0 20px; }

#maincolumn{ float: left; margin: 30px 150px; width: 460px; }

#footer{ background: url(img/footer.png) no-repeat 0% 0%; text-align: center; padding-top: 25px; }

#footerNav {
	margin: 0;
	padding: 0;
}

#footerNav ul {
	float: right;
	margin: 0;
	padding: 0;
}

#footerNav li {
	display: inline;
	list-style-type: none;
	margin: 0 5px;
	padding: 0;
}

/* -----------------------------------*/
/* ----------->>> FONTS <<<-----------*/
/* -----------------------------------*/

/*If you want this size in pixels, declare this percent.

(px)	(%)
10	77
11 	85
12 	93
13 	100
14 	108
15 	116
16 	123.1
17 	131
18 	138.5
19 	146.5
20 	153.9
21 	161.6
22 	167
23 	174
24 	182
25 	189
26 	197
27	204
28	212
29	219
30	227
31	235
32	242
33	250
34	257
35	265
36	272

*/

/* -----------------------------------*/
/* -------->>> NAVIGATION <<<---------*/
/* -----------------------------------*/

#menu {
	border-top: 1px solid #000;
}

ul#navigation{
	margin: 20px 0 0 0;
}

ul#navigation, ul#navigation ul {
	padding: 0;
	margin: 0 0 0 1px;
	list-style: none;
	z-index: 1000;
position: relative;
}

ul#navigation li { 
	line-height : 1.35em;
	position: relative;
	float: left;
}

ul#navigation>li li { /* Needed for Opera 9, maybe because it's decent CSS. Hide from IE6 */
	float: none;
}

#navigation a {
	border-bottom: 1px solid #000;
	display: block;
	width: 179px;
	color: #000;
	line-height: 2em;
	text-decoration: none;
	text-indent: 10px;
}

ul#navigation a:hover {
	color: #000;
	background-color: #fafafa;
}

ul#navigation li ul {
	border: 1px solid #000;
	border-bottom-width: 0;
	margin: -1px 0 0 1px;
	position : absolute;
	left: -999em;
}

ul#navigation li ul a {
	background-color: #fafafa;
}

ul#navigation li ul a:hover {
	background-color: #ccc;
}

#navigation li:hover ul ul, #navigation li.sfhover ul ul {
	left: -999em;
}

#navigation li:hover ul, #navigation li li:hover ul, #navigation li.sfhover ul, #navigation li li.sfhover ul {
	top: 0;
	left: 0;
	margin-left: 100%;
}


/* -----------------------------------*/
/* --------->>> HEADINGS <<<----------*/
/* -----------------------------------*/

h1, h2, h3, h4, h5, h6 
{ 	
	clear: both;
	color: #999;
	display: block;
	letter-spacing: 1px;
	margin: 20px 0; 
	text-transform: uppercase;
}

h1 {
	color: #000;
	font-size: 189%;
	margin: 0;
	padding: 5px 0 0 20px;
}

#header h1 a {
	color: #000;
	text-decoration: none;
}

h2 {
	font-size: 146.5%;
	margin-top: 0;
}

#maincolumn h2 a {
	color: #999;
	font-size: 100%;
	margin-top: 0;
	text-decoration: none;
}

#header h2 {
	color: #000;
	display: block;
	font-size: 100%;
	font-weight: normal;
	padding: 0 0 0 20px;
	text-transform: none;
	letter-spacing: 1px;
	text-transform: uppercase;
}

h3 {
	font-size: 131%;
}

h4, h5, h6 {
	color: #000;
	font-size: 100%;
}

/* -----------------------------------*/
/* ----------->>> LINKS <<<-----------*/
/* -----------------------------------*/

a, a:link, a:visited, a:active {
	color: #00e;
	text-decoration: underline;
}

a:hover {
	color: #c00;
	text-decoration: none;
}

/* -----------------------------------*/
/* ---------->>> STYLES <<<-----------*/
/* -----------------------------------*/

body {
	font:13px/1.231 arial,helvetica,clean,sans-serif;
}

select,input,button,textarea {
	font: 99% arial,helvetica,clean,sans-serif;
}

table {
	border-top: 1px solid #000;
	border-left: 1px solid #000;
	font-size: 98%;
	line-height: 1.4em;
	border-collapse: collapse;
	padding: 0;
	margin: 0;
	vertical-align: top;
	width: 548px;
}

th {
	background-color: #000;
	color: #fff;
	font-weight: bold;
	padding: 5px;
	white-space: nowrap;
}

td, tr {
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	padding: 5px;
	vertical-align: top;
}

td.center {
	text-align: center;
}

tr.stripe {
	background-color: #fafafa;
}


pre, code {
	font-family: monospace;
	font-size: 108%;
	line-height: 100%;
}

/* -----------------------------------*/
/* ---------->>> EXTRAS <<<-----------*/
/* -----------------------------------*/

p, pre, blockquote, form, label, dl, fieldset, address { 	
	margin: 20px 0; 
}

#maincolumn ul {
	padding: 0;
	margin: 0;
}

#maincolumn ul li {
	list-style-type: disc;
	margin-left: 20px;
}

#maincolumn ul ul li {
	list-style-type: disc;
}

#maincolumn ul ul li a {
	color: #c00;
}

img {
	border: 0;
}

img.alignleft {
	background-color: #fafafa;
	border: 1px solid #999; 
	float: left;
	margin: 4px 10px 0 0;
	padding: 4px;
}

img.alignright { 
	background-color: #fafafa;
	border: 1px solid #999;
	float: right; 
	margin: 4px 0 0 10px;
	padding: 4px;
}

img.aligncenter { 
	background-color: #fafafa;
	border: 1px solid #999;
	display: block;
	margin: 0 auto;
	padding: 4px;
}

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

.clear {
	display: inline-block;
}

* html .clear {
height: 1%;
}

/* -----------------------------------*/
/* ----------->>> FORM <<<------------*/
/* -----------------------------------*/

.wpcf7-form textarea, .wpcf7-form input {
	background: #fff url(img/shadow.png) repeat-x 0% 0%;
	border: 1px solid #999;
	margin-top: 5px;
	padding: 2px;
}

.wpcf7-form .submitButton {
	background: #999 url(img/submitButton.png) repeat-x scroll 0% 0%;
	border: 1px solid #999;
	color: #fff;
	font-weight: bold;
	letter-spacing: 1px;
	text-transform: uppercase;
}

/* -----------------------------------*/
/* ---------->>> GALLERY <<<----------*/
/* -----------------------------------*/

.gallery a img {
	border: 5px solid #999;
}

.gallery a img:hover {
	border: 5px solid #c00;
}
