@charset "utf-8";

/**
 * Table of Contents:
 *
 * 1.0 - Reset
 * 2.0 - Basic Structure
 * 3.0 - Header
 *   3.1 - Site Header
 *   3.2 - Navigation
 * 4.0 - Content
 *   4.1 - Entry Header
 *   4.2 - Entry Meta
 *   4.3 - Entry Content
 *   4.4 - Galleries
 *   4.5 - Post Formats
 *   4.6 - Attachments
 *   4.7 - Post/Paging Navigation
 *   4.8 - Author Bio
 *   4.9 - Archives
 *   4.10 - Search Results/No posts
 *   4.11 - 404
 *   4.12 - Comments
 *   4.13 - Multisite
 *   4.14 - Accommodation and Events
 *   4.15 - Map
 * 4.0 - Footer
 * 5.0 - Media Queries
 * 6.0 - Print
 * ----------------------------------------------------------------------------
 */

/*  1.0 - Reset
	http://meyerweb.com/eric/tools/css/reset/ 
   	v2.0 | 20110126
   	License: none (public domain)
*/

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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	text-decoration:none;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* 2.0 - Basic Structure */
html, body {
	background-color:#CCC;
	height:100%;
}
div.site {
	background-color:white;
	margin: 0 auto 0 auto;
	max-width:1000px;
	width:100%;
	height:100%;
	opacity:1;
}
article, footer {
	background-color:white;
	padding: 2em; 
}

div.rightinsert150 {
	background-color:white;
	float:right;
	width:100%;
	margin-left:6pt;
	max-width:150px;
}
div.rightinsert200 {
	background-color:white;
	float:right;
	width:100%;
	margin-left:6pt;
	max-width:200px;
}
div.rightinsert250 {
	background-color:white;
	float:right;
	width:100%;
	margin-left:6pt;
	max-width:250px;
}
div.rightinsert300 {
	background-color:white;
	float:right;
	width:100%;
	margin-left:6pt;
	max-width:300px;
}
div.rightinsert350 {
	background-color:white;
	float:right;
	width:100%;
	margin-left:6pt;
	max-width:350px;
}
div.rightinsert400 {
	background-color:white;
	float:right;
	width:100%;
	margin-left:6pt;
	max-width:400px;
}
	@media (max-width: 800px) {
		div.rightinsert400 {
			float:left;
			margin:0 9999px 6pt 0;
		}
		img.img400 {
			width:380px;
			height:auto;
		}
	}

	@media (max-width: 750px) {
		div.rightinsert350 {
			float:left;
			margin:0 9999px 6pt 0;
		}
		img.img350, img.img400 {
			width:330px;
			height:auto;
		}
	}

	@media (max-width: 600px) {
		div.rightinsert300 {
			float:left;
			margin:0 9999px 6pt 0;
		}
		img.img300, img.img350, img.img400 {
			width:280px;
			height:auto;
		}
	}

	@media (max-width: 550px) {
		div.rightinsert250 {
			float:left;
			margin:0 9999px 6pt 0;
		}
		img.img250, img.img300, img.img350, img.img400 {
			width:380px;
			height:auto;
		}
	}

	@media (max-width: 400px) {
		div.rightinsert200 {
			float:left;
			margin:0 9999px 6pt 0;
		}
		img.img200, img.img250, img.img300, img.img350, img.img400 {
			width:180px;
			height:auto;
		}
		img.soloimg400 {
			width:380;
			height:auto;
		}
	}

	@media (max-width: 350px) {
		div.rightinsert150 {
			float:left;
			margin:0 9999px 6pt 0;
		}
		img.img150, img.img200, img.img250, img.img300, img.img350, img.img400 {
			width:130px;
			height:auto;
		}
		img.soloimg350, img.soloimg400 {
			width:330;
			height:auto;
		}
	}

/**
 * 3.0 Header
 * ----------------------------------------------------------------------------
 */

/**
 * 3.1 Site Header
 * ----------------------------------------------------------------------------
 */

.site-header .home-link {
	background-color:white;
	color: #141412;
	display: block;
	margin: 0 auto;
	max-width: 1000px;
	min-height: 230px;
	padding: 0;
	text-decoration: none;
	width: 100%;
}
img.header-logo-strip {
	max-width:413px; 
	height:auto;
	margin: 10px auto 10px auto;
}
	@media (max-width: 800px) {
		.site-header .home-link {
			min-height:150px;
		}
		img.header-logo-strip {
			margin: 8px 15px 0 0;
			max-height:130px;
		}
		
	}
.site-header .site-title:hover {
	text-decoration: underline;
}

/**
 * 3.2 Navigation
 * ----------------------------------------------------------------------------
 */

.clearfix::after
{
	content: '';
	display: table;
	clear: both;
}

div.navcontainer {
	width:100%;
	max-width:1000px;
	background-color:#000000;;
}

#nav
{
	width: 100%; /* was 60em */
	max-width:1000px;
	margin: 0 auto 0 auto;
	font-family: sans-serif;
	font-weight: 400;
}

	#nav > a
	{
		display: none;
	}

	#nav li
	{
		position: relative;
	}
		#nav li a
		{
			color: #fff;
			display: block;
		}
		#nav li a:active
		{
			background-color: #c00 !important;
		}

	#nav span:after
	{
		width: 0;
		height: 0;
		border: 0.313em solid transparent; /* 5 */
		border-bottom: none;
		border-top-color: #e4ecf4;
		content: '';
		vertical-align: middle;
		display: inline-block;
		position: relative;
		right: -0.313em; /* 5 */
	}

	/* first level */

	#nav > ul
	{
		height: 2em; /* 60 */
		background-color: #000000;
		list-style:none;
	}
		#nav > ul > li
		{
			/*width: 14.2857%;*/
			
			height: 100%;
			float: left;
		}
			#nav > ul > li > a
			{
				height: 100%;
				font-size: 0.95em; /* 24 */
				line-height: 2em; /* 60 (24) */
				text-align: center;
				
			}
				#nav > ul > li:not( :last-child ) > a
				{
					border-right: 1px solid #000000;
				}
				#nav > ul > li:hover > a,
				#nav > ul:not( :hover ) > li.active > a
				{
					background-color: #000000;
				}


		/* second level */

		#nav li ul
		{
			background-color: #000000;
			display: none;
			position: absolute;
			top: 100%;
			width:160px;
		}
			#nav li:hover ul
			{
				display: block;
				left: 0;
				right: 0;
			}
				#nav li:not( :first-child ):hover ul
				{
					left: -1px;
				}
				#nav li ul a
				{
					font-size: 0.95em; /* 20 */
					border-top: 1px solid #000000;
					padding: 0.75em; /* 15 (20) */
				}
					#nav li ul li a:hover,
					#nav li ul:not( :hover ) li.active a
					{
						background-color: #000000;
					}

#menu-home {min-width: 25%;}
#menu-vision {width: 25%;}
#menu-product {width: 25%}
#menu-howto {width: 25%}


@media only screen and ( max-width: 62.5em ) /* 1000 */
{
	#nav
	{
		width: 100%;
		position: static;
		margin: 0;
	}
}

@media only screen and ( max-width: 40em ) /* 640 */
{
	html
	{
		font-size: 75%; /* 12 */
	}

	#nav
	{
		position: relative;
		top: auto;
		left: auto;
	}
		#nav > a
		{
			width: 3.125em; /* 50 */
			height: 3.125em; /* 50 */
			text-align: left;
			text-indent: -9999px;
			background-color: #000000;
			position: relative;
		}
			#nav > a:before,
			#nav > a:after
			{
				position: absolute;
				border: 2px solid #fff;
				top: 35%;
				left: 25%;
				right: 25%;
				content: '';
			}
			#nav > a:after
			{
				top: 60%;
			}

		#nav:not( :target ) > a:first-of-type,
		#nav:target > a:last-of-type
		{
			display: block;
		}


	/* first level */

	#nav > ul
	{
		height: auto;
		display: none;
		position: absolute;
		left: 0;
		right: 0;
	}
		#nav:target > ul
		{
			display: block;
		}
		#nav > ul > li
		{
			width: 100%;
			float: none;
		}
			#nav > ul > li > a
			{
				height: auto;
				text-align: left;
				padding: 0 0.833em; /* 20 (24) */
			}
				#nav > ul > li:not( :last-child ) > a
				{
					border-right: none;
					border-bottom: 1px solid #000000;
				}


		/* second level */

		#nav li ul
		{
			position: static;
			padding: 1.25em; /* 20 */
			padding-top: 0;
		}
}

/**
 * 4.0 Content
 * ----------------------------------------------------------------------------
 */

/**
 * 4.1 Entry Header
 * ----------------------------------------------------------------------------
 */
 
h1,h2,h3,h4,h5,h6 {
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:red;
	font-style:italic;	 
	margin-bottom:0.5em;
}
h1 {
	font-size:2em;
}
h2 {
	font-size:1.8em;
}

/**
 * 4.3 Entry Content
 * ----------------------------------------------------------------------------
 */
p {
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	margin-bottom:1em;
	text-align:justify;
}

article li {
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	margin-bottom:0.5em;
	text-align:justify;
	list-style:decimal;
	left:0;
	margin-left:18pt;
}

footer p {
	text-align:center;
}