/************* GENERAL STYLES ***/
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,
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-weight: inherit;
	font-style: inherit;
	font-family: inherit;
	vertical-align: baseline; }

:focus { outline: 0; }

body {
	background: #f9f8f5;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	line-height: normal;
	color: #222; }

	body.home { background: url(../images/bg_1.jpg) no-repeat fixed #f9f8f5; }

	body.documents { background: url(../images/bg_2.jpg) no-repeat 0px -300px #f9f8f5; }
	
	body.info { background: url(../images/bg_2.jpg) no-repeat 0px -300px #f9f8f5; }
	
	body.install { background: url(../images/bg_3.jpg) no-repeat 0px -300px #f9f8f5; }

	body.store { background: url(../images/bg_3.jpg) no-repeat 0px -300px #f9f8f5; }

	body.contact { background: url(../images/bg_4.jpg) no-repeat 0px -300px #f9f8f5; }
	
	/*body.gallery { background: url(../images/bg_4.jpg) no-repeat 0px -300px #f9f8f5; }*/

	body.home, body.documents, body.store, body.contact, body.info, body.install { background-size: cover; }

html, body { height: 100%; }

ul { list-style: none; }

ul.list {
	list-style: disc;
	padding: 0 0 16px 16px; }
	
	ul.list li { margin: 0 0 5px; }

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0; }

caption, th, td {
	text-align: left;
	font-weight: normal; }

blockquote:before, blockquote:after,
q:before, q:after {
	content: ""; }

blockquote, q { quotes: "" ""; }

strong { font-weight: bold; }

/*** FONT STYLES ***/
h1, h2, h3 {
	font-family: 'Libre Baskerville', serif;
	font-weight: normal;
	font-style: italic;
}

h1 { 
	font-size: 40px; 
	color: #31444e;
	margin: 0 0 30px -30px; }

h2 { 
	font-size: 30px; 
	color: #31444e;
	margin: 0 0 15px; }

h3 { 
	font-size: 24px; 
	color: #31444e;
	margin: 0 0 15px; }

a:link, a:visited { 
	color: #365e73;
	text-decoration: none; }
	
a:hover { text-decoration: underline; }

p { margin-bottom: 16px; }

.txt_center { text-align: center; }

/************* STRUCTURE STYLES ***/
.wrapper {
	width: 960px;
	margin: 0 auto; }

/*** PAGE ***/
#page {
	height: 100%;
	display: block;
	margin: 0 0 0 200px; }

/*** ASIDE NAV ***/
aside#nav {
	width: 200px;
	height: 100%;
	min-height: 600px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	background: #332929;
	color: #8e7878;
	font-size: 15px; }

	aside#nav img.logo {
		display: block;
		margin: 50px auto 0; }

	aside#nav nav#main {
		display: block;
		margin: 106px 0 0;
		text-transform: uppercase; }

		aside#nav nav#main a {
			display: block;
			padding: 7px 0 7px 30px;
			border-left: 5px solid #332929;
			color: #8e7878;
			transition: all 0.3s ease; }

			aside#nav nav#main a.active {
				background: #2b2323;
				border-color: #d0c8b3;
				color: #fff; }

			aside#nav nav#main a:hover {
				padding-left: 40px;
				text-decoration: none;
				color: #fff; }

	aside#nav a.navBtn {
		width: 40px;
		position: absolute;
		top: 32px;
		right: 5%;
		display: none; }

		aside#nav a.navBtn span {
			width: 100%;
			height: 6px;
			float: left;
			background: #d0c8b3; }

			aside#nav a.navBtn span.middle { margin: 6px 0; }

	nav#mobile {
		width: 100%;
		padding: 30px 0;
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 200;
		background: #2b2323;
		font-size: 20px;
		text-transform: uppercase;
		display: none; }

		nav#mobile a {
			display: block;
			padding: 5px 0 5px 40px;
			color: #fff; }

	aside#nav footer {
		width: 100%;
		position: absolute;
		bottom: 50px;
		left: 0;
		text-align: center;
		font-size: 14px; }

		aside#nav footer span { 
			font-family: 'Libre Baskerville', serif;
			font-style: italic; }

		aside#nav footer a { color: #8e7878; }

			aside#nav footer a:hover { 
				text-decoration: none;
				color: #fff; }

/*** CONTAINER ***/
#container {
	width: 100%;
	height: 100%;
	float: left; }

	section {
		width: 100%;
		height: 100%;
		float: left;
		background: #f9f8f5;
		box-sizing: border-box; }

		section#home { 
			position: relative;
			background: none; }

			section#home div { 
				position: absolute;
				top: 50%;
				left: 75px;
				margin-top: -150px;
				font-family: 'Libre Baskerville', serif;
				color: #fff;
				font-size: 85px;
				font-style: italic; }

			section#home a.btn { 
				width: 75px;
				height: 75px;
				position: absolute;
				bottom: 50px;
				left: 50%;
				margin-left: -37px;
				background: #31444e;
				border-radius: 75px;
				text-align: center;
				line-height: 85px; }

				section#home a.btn img { opacity: 0.5; }

				section#home a.btn:hover img { opacity: 1; }

		.contentWrap { 
			padding: 250px 0 0;
			display: table;
			background: none; }

		.innerWrap {
			width: 100%;
			height: 100%;
			float: none;
			display: table-cell;
			background: #f9f8f5; }

	article {
		width: 770px;
		float: left;
		padding: 35px 35px 50px 65px;
		margin: -72px 0 0 75px;
		background: #f9f8f5;
		border-top: 5px solid #9d9292;
		box-sizing: border-box; }

	.hr {
		width: 100%;
		height: 1px;
		float: left;
		margin: 20px 0 40px;
		background: #cecdcb;
		text-align: center;
		line-height: 0; }

		.hr div { 
			display: inline-block;
			position: relative;
			top: -4px;
			padding: 0 8px;
			background: #f9f8f5; }

		.hr span {
			width: 4px;
			height: 4px;
			display: block;
			background: #cecdcb;
			border-radius: 4px; }

	a.btn_store { 
		position: relative;
		font-size: 24px;
		font-weight: bold;
		color: #31444e; }

		.btn_store div {
			position: absolute;;
			bottom: 25px;
			right: 25px;
			z-index: 10; }

			.btn_store div span {
				display: block;
				margin: 0 0 0 -20px;
				font-family: 'Libre Baskerville', serif;
				font-style: italic;
				font-weight: normal;
				font-size: 19px; }

		.btn_store img { 
			width: 100%;
			border: 5px solid #9d9292;
			box-sizing: border-box; }

	.half {
		width: 48%;
		float: left; }

	.floatRight { float: right; }

/*** CONTACT ***/
form {
	width: 100%;
	float: right; }

	form .row {
		width: 100%;
		float: left;
		margin: 0 0 20px; }

	form label {
		display: block;
		margin: 0 0 5px;
		font-family: 'Libre Baskerville', serif;
		font-size: 15px;
		font-style: italic;
		color: #a09e98; }

	form input.text, form textarea {
		width: 100%;
		float: left;
		padding: 5px;
		background: #fff;
		border: 1px solid #cecdcb;
		font: inherit;
		font-size: 15px;
		box-sizing: border-box; }

		form textarea { height: 200px; }

	form input.submit {
		width: 100%;
		float: left;
		padding: 7px 0;
		background: #30434d;
		border: none;
		font: inherit;
		color: #90a7b2;
		cursor: pointer; }

		form input.submit:hover { 
			background: #3c5460;
			color: #fff; }

/*** STORE ***/
#store .product {
	width: 100%;
	float: left;
	padding: 0 0 40px;
	margin: 0 0 40px;
	border-bottom: 1px solid #cecdcb; }

	#store .product img.pic {
		float: left;
		margin: 0 20px 0 0; }

	#store .product .desc { overflow: hidden; }

	#store .product .price {
		margin: 0 0 20px;
		font-size: 20px;
		font-weight: bold; }

	#store .product a.add {
		float: left;
		padding: 7px 15px;
		background: #30434d;
		color: #90a7b2; }

		#store .product a.add:hover {
			background: #3c5460;
			color: #fff;
			text-decoration: none; }

	#store .product a.view {
		float: left;
		padding: 7px 15px; }

/*** MOBILE FOOTER ***/
footer#mobile {
	width: 100%;
	float: left;
	text-align: center;
	display: none;
	font-size: 15px;
	color: #a09e98; }


/*** MEDIA QUERIES ***/
@media all and (max-width: 1100px) {

	body.documents, body.store, body.contact { background-position: 0px 0px; }

	#page { margin: 0; }

	aside#nav {
		width: 100%;
		height: 100px !important;
		min-height: 100px !important;
		position: absolute; }

		aside#nav img.logo { 
			width: 80px;
			float: left;
			margin: 20px 0 20px 5%; }

		aside#nav nav#main {
			float: right;
			margin: 45px 5% 0 0; }

			aside#nav nav#main li { 
				float: left;
				margin: 0 0 0 30px; }

			aside#nav nav#main a { 
				padding: 0;
				border: none; }

			aside#nav nav#main a.active { 
				background: none;
				border: none; }

			aside#nav nav#main a:hover { padding: 0; }

		aside#nav footer { display: none; }

	section#home { text-align: center; }

		section#home div { 
			margin-top: -100px;
			left: 0;
			right: 0;
			font-size: 70px;
			text-shadow: 2px 2px 2px #999; }

		section#home a.btn { bottom: 30px; }

	section#homeContent { padding: 200px 0 0; }

	.contentWrap { padding: 300px 0 0; }

	.innerWrap { padding: 0 0 50px; }

	article { 
		width: 90%;
		float: none;
		margin: -72px auto 0; }

}

@media all and (max-width: 760px) {

	aside#nav nav#main { display: none; }
	
	aside#nav a.navBtn { display: block; }
}

@media all and (max-width: 640px) {

	aside#nav img.logo { width: 60px; }

	aside#nav nav#main { display: none; }

	aside#nav a.navBtn { display: block; }

	section#home div { font-size: 50px; }

	section#homeContent .half { 
		width: 100%;
		margin: 0 0 30px; }

	#store .product a.add { color: #fff; }

	form input.submit { color: #fff; }

	footer#mobile { display: block; }

}

@media all and (max-width: 500px) {

	#store .product { text-align: center; }

	#store .product img.pic { 
		float: none;
		margin: 0 0 20px; }

	#store .product .desc { width: 100%; }

	#store .product a.add, #store .product a.view {
		float: none;
		display: inline-block; }

}

@media all and (max-width: 400px) {

	h1 { 
		margin-left: 0;
		font-size: 30px; }

	h2 { font-size: 24px; }

	h3 { font-size: 20px; }

	article {
		margin: 0 auto;
		padding: 35px 0 50px 0;
		border: none; }

	section#home div { 
		padding: 0 10px;
		margin-top: -70px;
		font-size: 40px; }

	section#home a.btn { 
		width: 65px;
		height: 65px;
		margin-left: -32px;
		line-height: 70px; }

		section#home a.btn img { width: 25px; }

	section#homeContent { padding: 0 0 0; }

	.contentWrap { padding: 250px 0 0; }

}