/*
Styles for main site
Copyright (c) 2012, Webkey, LLC

// 2013-05-03 Jordan - search input submit with css instead of hardcoded
// 2012-09-08 Cory - finalize styling
// 2012-08-25 Cory - migrate from MOS, revise for WJN, replace main.css with layout.css to rebuild new layout on skeleton
// 2012-08-12 Jordan - Replace with Skeleton
// 2011-12-17 Jordan - Reset everything
// 2011-11-03 Jordan
// 2011-05-24 Jordan

-----------------------------------------  */

/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* TABLE OF CONTENTS
==================================================

	#Site Styles
		-General
		-Navigation
		-Login
		-Blog
	#Page Styles
	#Media Queries
	#Font-Face */

/* SITE STYLES
================================================== */

/* general */

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

ul, li, ol { margin:0; padding:0; }

.floatright {float:right;}
.floatleft {float:left;}
.clearboth {clear:both;}

html { font-family:'Nunito','Arial',Sans-serif; }

body { margin:0; padding:0; text-align:center; }

.layout { margin:0px auto; text-align:left; }

/* header */

.band.header { border-top:5px solid #1ca4fc; margin:0; padding:0; height:175px; }

.header .container .sixteen {padding-top: 20px;}
.header #motto.columns img {position: relative; float: right;}
.header #motto.columns img:last-child {padding: 10px 10px 0 0;}

/* navigation */

.band.nav { margin:0; padding:0 0 30px 0; }

nav.primary {
	border-top:1px solid #7fc9e9;
	border-bottom:1px solid #7fc9e9;
	height:40px;
	z-index: 1000;
	margin:0 auto;
	padding:0;
	background: #FFFFFF;
}

nav.primary ul,
nav.primary ul li {
	margin: 0px;
	height: 38px;
	padding:0;
}

nav.primary select {
	display: none;
	width: 100%;
	height: 27px;
	margin: 10px 0;
}

nav.primary selected {
	display: none;
	width: 100%;
	height: 27px;
	margin: 10px 0;
	color:#1ca4fc;
}

nav.primary ul li {
	display: inline;
	float: left;
	position: relative;
}

nav.primary ul li a {
	display: inline-block;
	line-height: 37px;
	padding: 0 10px;
	text-transform: lowercase;
	text-decoration: none;
	font-weight: normal;
	letter-spacing: 0.05em;
	color: #5e5e5e;
	font-size: 16px;
}

nav.primary ul li a:hover {
	background: #7fc9e9;
	cursor: pointer;
	color:#1ca4fc;
}

.navPlus { color:#5e5e5e; }

/* sub navigation */

nav.primary ul ul {
	opacity: 0;
  	filter: alpha(opacity=0);
	position: absolute;
	top:100%;
	left: 0;
	z-index: 1000;
	height: 0px;
	overflow: hidden;
	width: 150px;
	border-left: 1px solid #7fc9e9;
	border-right: 1px solid #7fc9e9;
	-webkit-transition: opacity 0.2s ease-out;
	-moz-transition: opacity 0.2s ease-out;
	-o-transition: opacity 0.2s ease-out;
	-ms-transition: opacity 0.2s ease-out;
	transition: opacity 0.2s ease-out;
}

nav.primary ul li span {
	display: none;
}

nav.primary ul li:hover ul {
	opacity: 10;
  	filter: alpha(opacity=100);
  	color:#1ca4fc;
	height: auto;
	overflow: auto;
	background: #FFFFFF;
}

nav.primary ul ul li {
	float: none;
	display: list-item;
	border-bottom: 1px solid #7fc9e9;
}

nav.primary ul ul li a {
	display: block;
	line-height: 35px;
	text-transform: none;
	white-space: nowrap;
	font-size: 14px;
}

nav.primary ul li:hover > a {
	background: #FFFFFF;
	color:#1ca4fc;
}

/* search & networking */

#search {
	float:left;
	margin:0 10px 0 10px;
	height:22px;
	width:152px;
}

#keywords {
	border: 1px solid #bfe4f4;
	height:22px;
	width:152px;
	color:#5e5e5e;
}

#search input#submit {
	float:right;
	position:absolute;
	margin:0px 4px 4px 130px;
	background:url('/sites/wjn/assets/go.png') no-repeat center;
	width:22px;
	height:22px;
	text-indent:-999px;
	border:none;
	padding:4px;
}

#networking {
	float:right;
	margin:8px 4px;
	width:100%;
}

.tweet, .query {
	min-height:100px;
	font-family:'Nunito','Arial',Sans-serif; color:#000000; font-size: 14px; line-height: 18px; margin-bottom: 14px;
}

.tweet_list {
	list-style: none;
	margin: 0;
	padding: 0;
	overflow-y: hidden;
/* 	background-color: #ecf7fa; */
}

.tweet_list a:link, .tweet_list a:visited, .tweet_list a:active {
	color: #085258;
}

.tweet_list li {
	overflow-y: auto;
	overflow-x: hidden;
	padding: 10px 0 ;
	list-style-type: none;
	margin:0 0 7px 0;
	border-bottom:1px solid #7fc9e9;
}

.tweet_list li a {
	color: #085258;
}

.tweet_list .tweet_even {
/* 	background-color: #FFFFFF; */
}

.tweet_list .tweet_avatar {
	padding-right: .5em; float: left;
}

.tweet_list .tweet_avatar img {
	vertical-align: middle;
}

/* panorama */

#panorama {
	float: left;
	height:319px;
	width: 100%;
	margin:0 0 30px -6px;
}

.no-script {
background: #CCCCCC url('/sites/wjn/assets/background.jpg');
}

.innerfade {
margin:0;
padding:0;
}

.header ol li{list-style:none outside;}

.header ul li{list-style:none outside;}

#header_images ul, #header_images li {
list-style:none;
margin:0;
padding:0;
display: inline;
border:0px solid red;
}

#layout-header-row {
width: 603px;
}

#layout-header {
width: 603px;
height:319px;
}

#layout-header .main_image {
width: 603px;
height:319px;
margin:-1px 0 0 0;
padding:0;
}

#layout-header ul,li {
margin: 0px;
padding: 0px;
}

/* content */

.band.content { margin:0; padding:10px; min-height: 500px; }

.band.content a:link, .band.content a:visited {
	color:#1ca4fc;
	text-decoration: none;
}

.band.content a:active {
	color:#1ca4fc;
	text-decoration: none;
}

.band.content a:hover {
	color:#1ca4fc;
	text-decoration: underline;
}

.content ul, .content li {
	margin:0 0 0 8px;
}

#footer_facebook {height: 30px;}

/* sidebar 2 */

#sidebar2 ul, #sidebar2 li {
	margin:0;
}

/* footer */

#footerSubPages ul, #footerSubPages li, #footerSubPages ol { margin:0; padding:0; }

.band.footer {
	margin:0;
	padding:0;
	border-top:1px solid #7fc9e9;
	font-size: 12px;
	white-space: normal;
}

nav.footer ul ul {
	overflow: hidden;
	text-align: left;
	margin:0;
	float:left;
	display:block;
	width:145px;
}

nav.footer ul li:hover ul {
  	color:#1ca4fc;
}

nav.footer ul ul li {
	text-align: left;
	float:left;
	display:block;
	white-space: normal;
	width:145px;
}

nav.footer ul ul li a {
	text-transform: none;
	font-size: 12px;
	color:#5e5e5e;
}

nav.footer ul li:hover > a {
	color:#1ca4fc;
}

nav.footer selected {
	color:#1ca4fc;
}

.band.footer a:link, .band.footer a:visited {
	color:#5e5e5e;
	text-decoration: none;
}

.band.footer a:active {
	color:#1ca4fc;
	text-decoration: none;
}

.band.footer a:hover {
	color:#1ca4fc;
	text-decoration: underline;
}

#footerMainPages {
	text-align: left;
	float:left;
	width:145px;
	border-right:1px solid #7fc9e9;
	min-height: 130px;
	margin-top:-7px;
	display:block;
}

#footerMainPagesLast {
	border-right:0px;
	text-align: left;
	float:left;
	width:145px;
	min-height: 150px;
	margin-top:-7px;
	display:block;
}

#footerSubPages {
	text-align: left;
	float:left;
	list-style: none;
	width:145px;
	display:block;
}

#copyright {
	list-style: none;
	text-align: left;
	float:left;
	color:#7fc9e9;
}

#copyright a:link, #copyright a:active, #copyright a:visited {
	color:#7fc9e9;
	text-decoration: none;
}

#copyright a:hover {
	color:#5e5e5e;
	text-decoration: underline;
}

.footerHeader {
	margin:10px 0 10px 0;
}

/* forms */

.contact form label {
	display:block;
	margin:0 0 0 0;
}

/* PAGE STYLES
================================================== */

h1 { font-family:'Nunito','Arial',Sans-serif; color:#000000; font-size: 28px; line-height: 28px; margin-bottom: 7px; }

h2 { font-family:'Nunito','Arial',Sans-serif; color:#5e5e5e; font-size: 18px; line-height: 21px; margin-bottom: 14px; }

h3 { font-family:'Nunito','Arial',Sans-serif; color:#000000; font-size: 16px; line-height: 21px; margin-bottom: 2px; }

h4 { font-family:'Nunito','Arial',Sans-serif; color:#5e5e5e; font-size: 14px; line-height: 18px; margin-bottom: 7px; }

h5 { font-family:'Nunito','Arial',Sans-serif; color:#5e5e5e; font-size: 14px; line-height: 18px; margin-bottom: 14px; }

h6 { font-family:'Nunito','Arial',Sans-serif; color:#5e5e5e; font-size: 14px; line-height: 12px; margin:0 0 12px 0; text-transform: uppercase; letter-spacing: 0.08em; }

p  { font-family:'Nunito','Arial',Sans-serif; color:#000000; font-size: 14px; line-height: 18px; margin-bottom: 14px; margin-top:7px; }

#footer li {float:left; margin:0 5px 0 0;}

/* LOGIN STYLES
================================================== */

#login{margin:20px auto; margin-top:100px; width:300px; border:1px solid #ccc; padding:30px; background:#fff; text-align:left; font-family:'Nunito','Arial',Sans-serif; }

#login h1{margin:15px 5px 5px 0; padding:0; color:#000; font:1.5em Verdana,Arial,Helvetica,sans-serif}

#login img{margin:0 0 10px -10px; border:0px solid #ededed}

#login p{margin:5px; margin-left:0; padding:0; color:#333; font:0.85em Verdana,Arial,Helvetica,sans-serif}

#login p a:link, #login p a:visited{font-size:10px; text-decoration:none}

#login p a:hover{font-size:10px; text-decoration:underline}

#login p.loginSubmit{margin:6px 0}

#login p.loginForgot{margin:10px 0 0 0}

#login .error{color:#c00}

#login input{display:block; padding:3px; margin-top:4px}

#login p.loginReminderText{margin:10px 0; padding:4px; color:#333; border:1px solid #ededed; background:#ffc}

#login input.loginUserBox, #login input.loginPassBox{margin:2px 0 8px 0; border:1px solid #ccc}

div.login-link{margin:10px}

div.login-link a:link, div.login-link a:visited{font-size:x-small; text-decoration:underline}

/* BLOG STYLES
================================================== */

/* blog pagination */

a.page_link{padding:0 2px}
a.previous_link{padding:0 5px 0 0}
a.page_link.active_page{color:#fff!important}
a.next_link{padding:0 0 0 5px}

/* blog page styles */

#blog_category_list{float:right}
#blog_category_list h3{margin:40px 0 5px 0; padding:0}
#blog_category_list ul{margin:0}
#blog_category_list ul li{list-style:none}
#blog_category_list_home{float:left; margin:0; padding:0}
#blog_category_list_home h3{margin:40px 0 5px 0; padding:0}
#blog_category_list_home ul{margin:0}
#blog_category_list_home ul li{list-style:none; margin:7px 0}

.archiveyear{color:#fff; font-size:14px}
.archiveyear a{font-size:15px}
.archivemonths{margin:0}
.archivemonths li{list-style:none; padding:0 0 0 15px}
.archivemonths li h2{padding:0; margin:0 0; color:#fff; font-size:12px}
.archivemonths li h2 a{font-size:12px}
.archivedpostlist{padding:3px 0 3px 15px; margin:0}

/* blog post styles */

.postbody{padding:0;}
.postcategory, .posttags{display:block; padding:0; font-size: 10px;}
.postmeta { color:#999999; font-size: 10px; }
.comment{padding:4px 2px; margin:0 0 4px 0; width:400px}
.comment.zebrastripe{background:#fff; background: rgba(255, 255, 255, 0.2); padding:2px 0 0 2px}
.commentdate{color:#555}
.postcomments form label{display:block}
.comments_to_post{width:400px}
.postcomments form input{padding:2px}
.blogPosting { border-bottom:0px solid #7fc9e9; margin-bottom:14px; }
.postlist ul, .postlist li{ margin:5px 0 5px -7px; padding:0; }

/* MEDIA QUERIES
================================================== */

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	#motto {display: none;}
	#search {margin:0 5px 0 0; width: 100px;}
	#search input#submit {margin: 0 4px 4px 78px;}
	#sidebar2 {width: 460px;}
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
	#logo {text-align: center;}
	#motto {display: none;}
	#search {margin:0 10px 0 25px;}
	#panorama {height: 230px;}

	nav.primary select { display: block; margin-top: 5px; }
	nav.primary ul { display: none; }
	img {max-width: 420px; height: auto !important;}

	#footerMainPages, #footerMainPagesLast {display: none;}
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
	img {max-width: 300px; height: auto !important;}
	#panorama {height: 160px;}
	#search {margin: 0 5px 0 0; width: 85px}
	#search input#submit {margin: 0px 4px 4px 63px;}
}

/* EMBED FONTS
================================================== */

/* nunito-regular - latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 300;
  src: url('/sites/wjn/assets/fonts/nunito-v9-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Nunito Regular'), local('Nunito-Regular'),
       url('/sites/wjn/assets/fonts/nunito-v9-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/sites/wjn/assets/fonts/nunito-v9-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/sites/wjn/assets/fonts/nunito-v9-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/sites/wjn/assets/fonts/nunito-v9-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/sites/wjn/assets/fonts/nunito-v9-latin-regular.svg#Nunito') format('svg'); /* Legacy iOS */
}

/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/