/* -------------------------------------------
Filename: (whatever .css document's name is)
Title: (give your style a name)
Author: (place your name here)
URL: (place your home page here for other to find you, the author)
/*


/* ----------- RESET DEFAULT SETTINGS */

body,div,dt,dd,dl,h1,h2,h3,h4,h5,h6,form,fieldset,pre,p,ol,ul,li,blockquote,th,td { margin: 0; padding: 0;}
table {border-collapse: collapse; border-spacing: 0; }
fieldset,img {border: 0;}
address,caption,cite,code,dfn,th,var {font-style: normal; font-weight: normal;}
ol,ul {list-style: none;}
caption,th {text-align: left;}
q:before,q:after {content:'';}
a { text-decoration: none; }

/* -------------------------------------------
					LAYOUT
---------------------------------------------*/

body {
	background: #291e09 url('../images/body-bg.gif') repeat-x top left;
	
}
#wrapper {
	margin: 0 auto; /* centers container on the page */
	width: 549px;
}
#container {
	width: 425px;
	background: #fff url('../images/container-bg.gif') repeat top left;
	margin-left: 124px;
}
#header {
	height: 70px;
}
#navigation {
	position: fixed;
	top: 85px;
	width: 124px;
	background: url('../images/sidebar-bottom.gif') no-repeat bottom left;
	padding-bottom: 20px;
	z-index: 0;
}
#content {
	padding: 4px;
	width: 400px;
}
#footer {
	padding-top: 50px;
	clear: both;
	height: 67px;
	background: url('../images/footer-bg.gif') no-repeat bottom left;	
	
}

/* -------------------------------------------
				TYPOGRAPHY
---------------------------------------------*/
body { font-size: small; font-family: "Centry Gothic", "Avant Garde", Verdana, sans-serif;}

h1, h2, h3, h4, h5 {
	font-weight: normal;
	font-family: "Georgia", "Times New Roman", serif;
}
h2 {font-size: 160%;  font-variant: small-caps;}
h3 {font-size: 100%; text-align: center;}
p, ul li { font-size: 90%;}

#content h2 {
	border-bottom: 1px dotted #bbb;
	margin-right: 30px;
	margin-left: 50px;
}
#header h1 {
	text-indent: -50000px;
	height: 70px;
	background:  url('../images/header-bg.gif') no-repeat top left;	
}
#navigation h2 {
	height: 2em;
	margin-bottom: -.5em;
	padding: 10px 0 0 10px;
	background: #291e09 url('../images/sidebar-top.gif') no-repeat top left;
	text-align: center;	
}


#bodyText { line-height: 1.65em; padding: 0 40px 1.5em 60px;}
#bodyText strong {font-weight: normal; font-family: Georgia; font-size: 110%; color: #222;}
#bodyText p, #bodyText dd {padding-bottom: 1.5em;}
#bodyText dt {font-style: oblique; text-transform: uppercase;}
#bodyText li {list-style-type: square;}

#footer p {
	padding: 10px 0 0 60px;
}
.nav-contact a {
	border-bottom: 1px solid #7a7a7a;
}
/* -------------------------------------------
				LINK STYLES
---------------------------------------------*/

h2 a {color: #bbb;}
#navigation ul li a:link, #navigation ul li a:active, #navigation ul li a:visited {
	display: block;
	height: 2em;
	width: 134px;
	text-align: center;
	padding: 1em 0 0 0;
	background: #c1c1c1 url('../images/nav-bg-off.gif') repeat-x top left;
}

#navigation ul li a:hover {
	display: block;
	background: #fff url('../images/nav-bg-on.gif') repeat-x top left;
}

#navigation ul li a.current {
	background: #fff url('../images/nav-bg-on.gif') repeat-x top left;
	
}
#content h2 {
	padding: 20px 0 4px 0;
}

.gallery p {
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	margin-top: 4px;
	text-align: center;
	clear: both;
}
/* -------------------------------------------
		   EXTRA CSS SECTION HEAD
---------------------------------------------*/
a {
	color: #6696CC;
}
a:link{
	color: #6696CC;
}

a:visited {
	color: #90B1D5;
}
#navigation a {color: #666;}
a:hover {
	color: #888;
}
.frame {
	margin: 10px 0 10px 0;
}
.gallery .frame a {
	display: block;
	width: 178px;
	height: 122px;
	background: url('../images/frame-off.png') no-repeat top left;
}
.gallery .frame img{
	width: 150px;
	height: 96px;
	margin: 14px 0 0 14px;
}
.gallery .frame a:hover {
	background: url('../images/frame.png') no-repeat top left;
}
.gallery .frame p a, .gallery .frame p a:hover  {
	display: inline;
	background: none;
}
.gallery .alignLeft {
	margin-left: 20px;
}
.gallery .alignRight {
	margin-right: 10px;
}

.gallery .smallThumb { width: 170px; }
.gallery .smallThumb img {
	width: 40px; height: 40px;
	margin: 0;
}
.gallery .smallThumb a{
	float: left;
	width: 40px;
	height: 40px;
	margin: 0 0 5px 10px;
	border: 3px solid #666;
	background-image: none;
}
.gallery .smallThumb a:hover{
	width: 40px;
	height: 40px;
	border: 3px solid #aaa;
	background-image: none;
}


.alignLeft {
	float: left;
}

.alignRight {
	float: right;
}
img.alignLeft {margin: 0 10px 2px 0; border: 3px solid #121212;}
.clear {clear: both;}
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */