/*########### =HTML =BODY #############*/

a.pageSelect {
} 
/*style used for jquery as an exception for jquery url rules*/

html {
	width: 100%;
/*	overflow-x:hidden;*/
}

body {
	background-color: #f2EDD9;
	background-image: url(../images/bg-body-left.jpg);
	background-repeat: repeat-y;
	background-position: 0px 0;
	background-image: url(../images/bg-body-left.jpg), url(../images/bg-body-right.jpg);
	background-repeat: repeat-y, repeat-y;
	background-attachment: scroll, fixed;
	background-position: 0px 0, right top;
	min-width: 800px;
	width: 100%;
	font-size: 62.5%;
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, Tahoma, sans-serif;
	}


/* @group =subnav*/

html body.noSubNav,
html body.ThoughtsHolder,
html body.ImagesHolder,
html body.Page,
html body.ErrorPage  {
	background-position: -220px 0;
	background-position: -220px 0, right top;
}

body.noSubNav div#aboutContainer,
body.noSubNav div#subNavContainer {
	width: 0;
	margin: 0;
	padding: 0;
	display: none;
	visibility: hidden;
	font-size: 0.000001em;
}

html body.noSubNav div#about,
body.noSubNav div#subNav {
	width: 0;
	top: 0;
	margin: 0;
	padding: 0;
}

body.noSubNav #wrapper #wrapper2,
body.ThoughtsHolder #wrapper #wrapper2,
body.ImagesHolder #wrapper #wrapper2,
body.Page #wrapper #wrapper2,
body.ErrorPage #wrapper #wrapper2 {
	padding:0 20px 0 46px;
}

/*change top margin to force css redraw and re-center the content with auto*/
body.noSubNav div.contentContainer,
body.ThoughtsHolder div.contentContainer,
body.ImagesHolder div.contentContainer,
body.Page div.contentContainer {
	margin: 0 auto;
	padding:  50px 0;
}

body.noNavigation div#navigation div#navigationContainer {
	height: 0;
	margin: 0;
	padding: 0;
	display: none;
	visibility: hidden;
	font-size: 0.000001em;
	text-align: left;
	text-indent: -10000px;
	}

/*########### =wrapper #############*/

#wrapper {
	margin: 0;
	padding: 0;
	display:block;
	display: table;
	width: 100%;
}

#wrapper2 {
	padding:0 20px 0 260px;
	margin: 0;
	position: relative;
	display:block;
}
/* @end */

/*########### =navigation #############*/

div#navigation {
	padding-bottom: 21px;
	background: url(../images/navigation-border.jpg) repeat left bottom;
	width: 100%;
	height: auto;
  	font-size: 1.1em;
  	position: relative;
}

div#navigation div#navigationContainer {
	background-color: #eee0bd;
	background-image: url(../images/bg-navigation-container2.png);
	background-repeat: repeat-y;
	background-position: 0px 0;
	background-image: url(../images/bg-navigation-container2.png), url(../images/bg-navigation-container.png);
	background-repeat: repeat-y, repeat-y;
	background-attachment: scroll, fixed;
	background-position: 0 0, right top;
	width: 100%;
	overflow: hidden;
	height: auto;
	padding: 5px 0 5px 0;
}

div#navigation ul {
	padding: 24px 0 28px 150px;
	display: block;
	min-width: 400px;
	max-width: 600px;
	width: 100%;
	text-align: left;
	overflow: hidden;
	position: relative;
}

div#navigation ul li {
	padding-top: 1px;
	display: block;
	float: left;
	margin-top:-2px;
}

div#navigation ul li a {
	text-transform: uppercase;
	display: block;
	border: solid 1px #af9064;
	margin-left: -1px;
	text-decoration: none;
	color: #917348;
	padding: 5px 20px;
	line-height: 16px;
}

div#navigation ul li a:hover {
	background-color: #bf9f71;
	color: #eee;
}

div#navigation ul li.section a {
	color: #917348;
	font-weight: bold;
	background: #ead5b6;
}

div#navigation ul li.section a:hover {
	color: #917348;
	background: #ead5b6;
}

span.pc {
	position: absolute;
	display: block;
	bottom: 30px;
	right: 0;
	height: 50px;
	width: 280px;
	background: url(../images/paper-cut.png) no-repeat right bottom;
}


/*########### =navigationTab #############*/
#navigation span#navigationTab {
	visibility: visible;
	display: block;
	position: absolute;
	height: 32px;
	width: 121px;
	bottom: -11px;
	left: 300px;
	font-size: 0.1px;
	line-height: 0.1px;
	text-indent: -10000px;
	z-index: 102;
	background: url(../images/navigation-tab.png) no-repeat 0 -5px;
	white-space: nowrap; /* required in IE 6 */
    outline: 0; /* prevent dotted border in Firefox */
}


html.js #navigation span#navigationTab:hover {background-position: 0 -42px;}

#navigation h1 {
	visibility: visible;
	display: block;
	position: absolute;
	height: 36px;
	width: 155px;
	bottom: -10px;
	right:0;
	font-size: 0.1px;
	line-height: 0.1px;
	text-indent: -10000px;
	z-index: 102;
	background: url(../images/logo.png) no-repeat 0 0;
	white-space: nowrap; /* required in IE 6 */
    outline: 0; /* prevent dotted border in Firefox */
}

#navigation h1 a {
	display: block;
	background: url(../images/logo.png) no-repeat 0 0;
	white-space: nowrap; /* required in IE 6 */
    outline: 0; /* prevent dotted border in Firefox */
	height: 36px;
	position: absolute;
	top: 0;
}

#navigation h1 a.home {
	width: 119px;
	left: 0;
	/*border: solid 1px #f0f;*/
	/*background: #f0f;*/
}

#navigation h1 a:hover.home {
	background-position: 0 -36px;
}


#navigation h1 a.contact {
	width: 36px;
	right: 0;
	background-position: -119px 0;
}

#navigation h1 a:hover.contact {
	background-position: -119px -36px;
}

/*########### =subNav #############*/

div#about, 
div#subNav {
	position: absolute;
	top: -50px;
	left: 0;
	width: 210px;
	padding-top: 70px;
	padding-left:  10px;
	background: url(../images/bg-subnav.jpg) no-repeat left top;
	text-align: left;
	color: #393939;
	font-size: 1.1em;
	/*border:  solid 1px yellow;*/
 }
 
#subNav h2 {
	background: #727b61;
	color: #eee;
	line-height: 21px;
	padding: 0px;
	font-weight: bold;
	border-bottom: 1px solid #747e62;
	border-top: solid 1px #8c9977;
	margin-right: 0px;
	width: 180px;
	font-size:1.3em;
}

#subNav h2 a {color: #aaa; text-decoration: none; display: block; padding: 0 3px 0 10px;}
#subNav h2 a:hover {color: white; /*background-color: #363636*/ }


#subNav ul#subNavMenu {
	width: 180px;
	padding-bottom: 20px;
}

#subNav ul li {
	padding: 0px;
	line-height: 20px;
/*	background: url(../images/li-subnav.png) no-repeat 163px 6px;*/
	max-height: 42px;
	border-bottom: solid 1px #747e62;
	/*overflow: hidden;*/
	/*border: solid 1px red;*/
}

#subNav ul li a {
/*border: solid 1px blue;*/
	width: 167px;
	display: block;
	/*background-color: #c1baa6;*/
	border-bottom: 1px solid #747e62;
	border-top: solid 1px #8c9977;
	color: #393939;
	text-decoration: none;
	padding: 0 3px 0 10px;
	max-height: 40px;
	/*overflow: hidden;*/
}

#subNav ul li a:hover {
	color: #000;
	background: #829266;
	border-left: 1px solid #747e62;
	border-right: 1px solid #747e62;
	padding: 0 2px 0 9px;
}

#subNav ul li.current {background-image: url(../images/li-subnav-current.png);}

body #subNav ul li.current a {
	font-weight: bold;
	background: #8a9f65;
	padding: 0 2px 0 9px;
	border-left: 1px solid #747e62;
	border-right: 1px solid #747e62;
}

body #subNav ul li.current a:hover {
	/*color: #000;*/
	background: #8a9f65;
	border-left: 1px solid #8a9f65;
	border-right: 1px solid #8a9f65;
}

#subNav ul li:last-child a {
	border-bottom: 1px solid #747e62;
}

/*########### =subNavTab #############*/

div#about #aboutTab,
div#subNav #subNavTab {
	display: block;
	position: absolute;
	height: 90px;
	width: 42px;
	top: 50px;
	right: -42px;
	font-size: 0.1px;
	z-index: 200;
	line-height: 0.1px;
	text-indent: -10000px;
	background: url(../images/subnav-tab.png) no-repeat 0 0;
	white-space: nowrap; /* required in IE 6 */
    outline: 0; /* prevent dotted border in Firefox */
}

html.js #about #aboutTab:hover,
html.js #subNav #subNavTab:hover {background-position: -42px 0;}


/*########### =contentContainer #############*/
div.contentContainer {				
				width:  800px;
				margin: 50px auto;
				padding-top: 15px;
				min-height: 250px;
}


/*########### =content #############*/
div.content {
				width:620px;
				margin:0 auto;
				padding-top:  15px;
				min-height: 250px;
}