/* For all browsers */
	h3 { padding-top: 0; margin-top: 0; }
	body
	{
		margin:0;
		font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, sans-serif;
		font-size: 1.3em;
		background-color: #FAFAFA;
	}
	.menu_icon { display:none; }
	a { color:#a05540; }
	a:hover { color:#CC0000; transition: color 0.5s ease; }
	select { font-size:1.0em;font-family:Montserrat; }
	nav 	
	{ 
		width: 100%; background: #484745; color: white;
		height: 70px; line-height: 70px;
		transition: background-color 1s ease;
		z-index: 10;
	}
	nav.scrolled
	{
		background: #5a5f72;
		position: fixed;
		top: 0;	
		transition: height 0.2s ease opacity 0.2s ease;
		height: 50px;
		line-height: 50px;
		opacity: 0.92;
	}
	nav.scrolled:hover { opacity: 1; transition: opacity 0.5s ease; }
	nav a { color: #FFFFFF; text-decoration: none; }
	nav a:hover { color:#FFFFFF; text-decoration: underline; transition: 0.25s text-decoration ease; }
	nav ul { list-style-type: none; }
	nav ul li
	{
		float: left;
		margin-right: 40px;
	}
	nav a.navtoggle { display:none; }
	.indent { padding-left:25px; }
	.video { display:inline;}
	.video-mobile { display:none; }
	.vid_box { height:180px;padding-bottom:15px; }
	#main_cont
	{
		width: 100%;
		//z-index: 10;
	}

	#header_image
	{
		height:202px;
		width:100%;
		min-height: 202px;
		background-image:url('../images/klee2.jpg'); 
		background-size: 100%; 
		background-repeat: no-repeat;
	}
	#header_image div { font-size: 1.7em; color: white; }
	#header_image div a { color: white; text-decoration: none;  }

	hr { border:0; height:1px; background-color:black; color:black; width: 80%; }

	#left-float-image
	{ 
		float:left;
		position:relative;
		top:0px;
		margin-left: -280px;
		padding:10px;
	}
	.follow-meta { float:left; padding-right:25px; font-size:0.9em; }
	.lightbox { display:none; padding: 20px 40px 40px 40px; }
	.lightbox .vidplayer { width:560px; margin:10px auto 10px auto; }
	.lightbox iframe { width:560px; height:315px; border:0px; }
	.lightbox .watchlink { float:left; font-size:0.9em; }
	.lightbox .closelink { float:right; }
	.vidthumb { float:left; padding-right:20px; width:240px; }

	/* Basic site design for large format browsers */
	@media screen and (min-width: 1400px) 
	{
		#header_image { min-width:800px; }
		#header_image div
		{
			width: 800px; 
			min-width: 800px; 
			margin: 0 auto 0 auto;
			padding-top: 150px;
		}

		#main
		{
			min-width: 800px;
			width: 800px;
			margin: 0 auto 0 auto;
			padding: 10px;
			line-height: 1.3;
		}

		nav { font-size: 1.1em; }
		nav ul { position:relative;width: 800px; min-width:800px; margin: 0 auto 0 auto;}
		nav span.home { position: relative; left: -900px; line-height:70px; opacity:0; transition: opacity 0.25s ease; }
		nav span { position: relative; left: -900px; line-height:50px; opacity: 1; transition: opacity 0.25s ease; } 
	}

	/* For MacBook Air screens, shrink main body to give space for left float image */
	@media screen and (max-width: 1399px) and (min-width: 1200px)
	{
		#header_image { min-width:650px; }
		nav ul { width: 650px; min-width:650px; margin: 0 auto 0 auto;}
		nav ul li { margin-right: 35px; }
		nav { font-size: 0.9em; }
		#header_image div
		{
			width: 650px; 
			min-width: 650px; margin: 0 auto 0 auto;
			padding-top: 150px;
		}

		#main
		{
			min-width: 650px;
			width: 650px;
			margin: 0 auto 0 auto;
			padding: 10px;
			line-height: 1.3;
			font-size: 0.9em;
		}

		nav { font-size: 1em; }
		nav span.home { position: relative; left: -800px; line-height:70px; opacity:0; transition: opacity 0.25s ease; }
		nav span { position: relative; left: -800px; line-height:50px; opacity: 1; transition: opacity 0.25s ease; } 
	}

	/* For smaller screens, drop left float image. */
	@media screen and (max-width: 1199px) and (min-width: 769px)
	{
		#header_image { min-width:650px; }
		nav ul { width: 650px; min-width:650px; margin: 0 auto 0 auto;}
		nav { font-size: 0.9em; }
		#header_image div
		{
			width: 650px; min-width: 650px; margin: 0 auto 0 auto;
			padding-top: 150px;
		}

		#main
		{
			min-width: 650px;
			width: 650px;
			margin: 0 auto 0 auto;
			padding: 10px;
			line-height: 1.3;
			font-size: 0.9em;
		}

		#left-float-image { float: left; padding-left:10px; padding-right: 20px; display:inline; margin-left:0;}
		nav span.home { display:none;}
		nav span { display:none;}
	}

	/* For mobile, collapse menu into hamburger menu. */
	@media only screen and (max-width: 768px)
	{
		nav ul { display:none;}
		nav ul li { display:none;}
		nav ul.open { display:block; position: absolute; left:-40px; top: 251px; margin:0; margin-left:0; z-index:25; }
		nav.scrolled ul.open { display:block; position: absolute; left:-40px; top: 50px; margin:0; margin-left:0; z-index:25;}
		nav ul li.open.first { border-top:1px solid white; }
		nav ul li.open { display:block; width:100%; overflow:hidden; border-bottom:1px solid white; background-color:#484745; padding-left:20px; }
		nav a.navtoggle { display:inline; padding-left:25px;}
		nav { 
			height:50px; line-height:50px; 
			font-size: 1.1em;background-color: #484745;
			min-width:450px;
		}

		/* General display changes */
		body { min-width:450px;}
		#header_image { 
			min-width:400px;
			max-width:768px;
			width:100%; height: 200px;
			background-size:cover;
		}
		/* Fix margin for header image */
		#header_image div { 
			position: absolute;
			padding-left: 20px;
			padding-top: 155px;
		}
		#main { 
			min-width:400px;
			max-width:650px;
			line-height: 1.2; font-size: 0.9em; 
			padding: 10px;
			padding-right: 20px;
		}
		#left-float-image { float:none; display:block; width:100%; margin:0;padding:0; padding-bottom:10px; text-align:center;}
		#left-float-image.nomobile { display:none; }
		nav span.home { position: relative; left: 25px; line-height:50px; opacity:0; transition: opacity 0.25s ease; }
		nav span { position: relative; left: 25px; line-height:50px; opacity: 1; transition: opacity 0.25s ease; } 
		.video { display:none;}
		.video-mobile { display:inline; }
		.vidthumb { float:left; padding-right:20px; width:180px; }
		.vid_box { height:150px;padding-bottom:10px; }
	}