/* CSS Test */
@charset "utf-8";
html, body {
	width: 100%;
	height: 100%;
	position: relative;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
:root {
	font-size: 14px /*10.5pt*/;
}
:focus, *:focus {
	outline: thin dotted;
}
/* ---- fonts & variants + ---- */
/* fonts */
body {
	/*font-family: "PT Sans Narrow","PT Sans",arial, sans-serif;
	line-height: 1.4;*/
	font-family: "PT Sans Narrow","PT Sans",arial, sans-serif;
	line-height: 1.4;
	/*
	 * 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
	 *    http://clagnut.com/blog/348/#c790
	 * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom
	 *    www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
	 */
	font-size: 1em; /* 1 */
	-webkit-text-size-adjust: 1em; /* 2 */
	-ms-text-size-adjust: 1em; /* 2 */
}


/* text styles override */
.small {
	font-size: 80% !important;
}
.smaller {
	font-size:60% !important;
}
.big {
	font-size: 120% !important;
}
.bigger {
	font-size:150% !important;
}
.bold {
	font-weight:bold !important;
}
.light {
	font-weight:normal !important;
}
.underlined {
	text-decoration:underline !important;
}
.italic {
	font-style:italic;
}
.small-caps {
	font-variant:small-caps;
}
.txtc {
	text-align: center;
}
.txtl {
	text-align: left ;
}
.txtr {
	text-align: right;
}
.txtj {
	text-align: justify;
	/* Non standard for webkit */
	word-break: break-word;
	-webkit-hyphens: auto;
	-webkit-hyphenate-character: "\2010";
	hyphenate-character: "\2010";
	-webkit-hyphenate-limit-after: 1;
	-webkit-hyphenate-limit-before: 3;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto
}
.red {
    color: maroon;
}
/* ampersand */
.amper {
	display:inline-block;
	background:url(../img/amp.png) 0 0 no-repeat;
	width:32px;
	height:32px;
	line-height: 0;
	position: relative;
	bottom: -10px;
}

.nowrap {
	white-space: nowrap;
}
hr.sep {
	margin-left: 30%;
	margin-right: 30%;
}
.no-margins {
	margin: 0;
}
/* ---- Paragraphs ----------- */
/* reset text-indent */
p {
	text-indent: 0;
}
/* 1. indent text in countinuous paragraphs 2. remove margins between paragraphs - better handle than p + p */
p.follow {
	text-indent: 1em; /*1*/
	margin-top: -1.25rem; /*2*/
}
.lead {
	font-size: 1.25em;
	font-style: normal;
	font-weight: normal;
	text-transform: lowercase;
	font-variant: small-caps;
	letter-spacing: 0.08em;
}
p.spaced {
	margin-top: 2em;
}
/* sup and sub definitions */
sub,
sup {
	position: relative;
	font-size: 75%;
	line-height: 0;
	vertical-align: baseline;
}
sup {
	top: -0.4em;
}
sub {
	bottom: -0.25em;
}

/* -----  General styling ----- */
body {
	background-color: #FDFDFD;
	text-shadow: 0 1px 1px rgba(0,0,0,0.2);
}
h1,h2,h3,h4,h5,h6 {
	font-weight: bold;
}
h1,h2,h3,h4,h5,h6,
a {
	font-family: inherit;
	color: #0097DB;
/* 	text-shadow: none; */
}
 .panel h1,
 .panel h2,
 .panel h3,
 .panel h4,
 .panel h5,
 .panel h6 {
	font-family: inherit;
	color: #0097DB !important;
 }
h1,h2 {
	margin-bottom: 1.4em;
}
h3 {
	margin-bottom: 1.2em;
}
h4 {
	margin-bottom: 1em;
}
h5,h6,ul,ol,dl {
	margin-bottom: .5em;
}
h1.hlist,h2.hlist,h3.hlist,h4.hlist,h5.hlist,h6.hlist {
	margin-bottom: .2em;
}
h1,h2,h3,h4,h5,h6,ul,ol,dl,p {
	line-height: 1.4;
}

.sub-title {
	font-size: 1rem;
	font-weight: normal;
	color: #222;
}
a:hover,
a:focus {
	color: #0070A0;
/* 	font-weight: bold; */
	text-decoration: none;
	border-bottom: 1px solid #0070A0;
}
a:hover.no-underl,
a:focus.no-underl {
	border-bottom: none;
}
ul,ol,dl {
	padding-left: .8em;
	padding-right: .8em;
	margin-left: 1.1rem;
	margin-right: 1.1rem;
}

/* left alignment for no-bullet lists */
ul.no-bullet {
	padding-left: .575em;
	padding-right: 0;
	margin-left: -1.375rem;
}
ul.no-bullet li {
	margin-left: 1.375rem;
}
ul.no-bullet.inline-list li ul {
	margin-left: -1.375rem;
}
/* custom bullet lists */
ul.caret, ul.angle {
	list-style: none;
	padding-left: 1em;
	text-indent: -.7em;
	margin-left:0;
}
ul.caret li:before, ul.angle li:before {
	font-family: FontAwesome;
	font-weight: normal;
	font-style: normal;
	text-decoration: inherit;
	-webkit-font-smoothing: antialiased;
}
ul.caret li:before {
	content: "\f0da  ";
}
ul.angle li:before {
	content: "\f105  ";
}

/* color classes */
.blue {
	color: #0097DB;
}
.grey {
	color: #555;
}

.blue-bar {
	width: 100%;
	height: 10px;
	background: #0097DB;
}
/* page elements */

/* header */
header {
	margin-bottom: 1em;
}
.brand {
	height: 58px;
	/*display: inline-block;
	width: 180px;
	height: 56px;*/
	background-image: url("../img/logo@2x.png");
	background-color: transparent;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	-moz-background-size: auto 100%;
	-webkit-background-size: auto 100%;
	-o-background-size: auto 100%;
	background-size: auto 100%;
	margin-top: 30px;
	margin-bottom: 2rem;
}
/* Nav */
nav {
	height: 58px;
	font-size: 1.125rem;
	font-weight: bold;
}
nav ul.inline-list {
/* 	margin-top: 76px; */
	position: absolute;
	bottom: -3px;
	margin-left: 0;
	font-size: 1.125rem;
	/*height: 1.4em;
	line-height: 1.4em;*/
	margin-bottom: 0;
}
nav li:first-child {
	margin-left: 0;
}

nav a, nav a:hover, nav a:link {
	text-decoration: none;
	color: #0097DB;
}

nav a {
	border-bottom: 2px solid #ddd;
	height: 1.4em;
}
nav a:hover, nav a:focus {
	border-bottom: 2px solid #666;

}
nav a.active {
	border-bottom: 2px solid #222;
}

nav.tab-bar {
	background: none;
	height: 1.6rem;
}

nav.tab-bar section.right-small {
	border-left: solid 1px transparent;
	box-shadow: none;
}

nav.tab-bar a.menu-icon, nav.tab-bar a.menu-icon:hover, nav.tab-bar a.menu-icon:active {
	border: none;
	text-indent: 0;
	display: block;	
	width: 50px;
	height: 50px;
	top: 8px;
	right: 0.9375rem;
}

/* side nav */
.side-nav {
	font-family: "PT Sans Narrow","PT Sans",arial, sans-serif;
}
.side-nav a {
	border-bottom: 2px solid transparent;
}

.side-nav a:hover, .side-nav a:focus {
	border-bottom: 2px solid #666;
}
[data-magellan-expedition] {
	background: #FDFDFD;
	/* background: transparent; */
	min-width: 0;
	max-width: 192px;
}
.magellan-container {
	padding: 0;
/* 	margin-top: 4.5rem; */
}

ul.mobnav li {
	padding-bottom: .5em;
}

.back-to-top {
	position: device-fixed;
	position: fixed;
	bottom: 1rem;
	right: 1rem;
	z-index: 100000;
	background: #FDFDFD;
	border: 1px solid #FDFDFD;
	border-radius: 10px;
}

.up {
	margin-top: 1rem;
}

.right-off-canvas-menu {
	background: #FDFDFD;
}

ul.off-canvas-list li a {
	font-weight: bold;
	color:#0097DB;
	border-bottom: 1px solid #ddd;
}

/* various */
.panel {
	margin: 3rem 0 2rem;
	padding: 1.4rem;
}

.spacer {
	display: block;
	width: 100%;
	height: 1px;
	margin: 1.5rem 0;
}

/* map */
.map-small {
	margin-top: 1em;
	width: 100%;
	height: auto;
}
.map-small a {
	display: inline-block;
	width: 100%;
	margin-bottom: 5px;
	position: relative;
	text-align: center;
}
.map-small a:hover, .map-small a:focus {
	text-decoration: none;
	border-bottom: none;
}
.map-small a img {
	border: 1px solid rgba(0,0,0,0.2);
	box-shadow: inset 0 0 3px rgba(0,0,0,0.2);
	padding: 4px;
	width: 100%;
}
.map-small a span  {
	color: #555;
	font-size: 11px;
	position: absolute;
	left: 7px;
	bottom: 4px;
}

.gmaps {
	border: 1px solid rgba(0,0,0,0.2);
	box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
/* 	padding: 4px; */
	height: 400px;
}


/* images */
.th {
	margin-bottom: 10px;
}
.caption {
	padding: 0 2px;
	font-size: 90%;
}

/* block grid */

.team-photo {
}
.team-desc {
}

/* forms */
.form {
	margin-top: 2.5rem;
}

.form label {
	font-size: 1rem;
}
.form label sup {
	font-size: 60%;
	top: -.6em;
	color: #c60f13;
}
.form textarea {
	min-height: 12rem;
	min-width: 100%;
	max-width: 100%;
}
.form #thanks {
	text-shadow: none;
	font-weight: bold;
}
.form #thanks h5 {
	color: #fff;
}

.addr-field textarea {
	min-height: 7rem;
}

/* Icons */
.prefix [class^="fi-"], .prefix [class*="fi-"] {
	margin-left: 0.3em;
}

/* buttons */
button {
	font-family: "PT Sans Narrow","PT Sans",arial, sans-serif;
	line-height: 1em;
	box-shadow: none;
	background: #0097DB;
	margin: 0;
	border: 1px solid #2284a1;
}
button.btn-small, .button.btn-small {
	padding: 0.8rem 1.5rem;
}
button.square {
	padding: 0.8rem;
}
.show-for-touch a.button {
	box-shadow: none;
	background: #0097DB;
	width: 100%;
	padding-right:1em;
	padding-left: 1em;
}
.show-for-touch a.button:hover,
.show-for-touch a.button:focus {
	text-decoration: none;
	background-color: #007095;
	border-bottom: none;
}

/* input, error */
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea {
	border: 1px solid #D9D9D9;
}
.error input, .error textarea, .error select {
	background-color: rgba(198, 15, 19, 0.1);
	border-color: #C60F13;
}
span.error, small.error,
[data-abide] .error small.error, [data-abide] span.error, [data-abide] small.error,
.error > small, .error small.error {
	background: none repeat scroll 0 0 #C60F13;
	font-style: normal;
	text-shadow: none;
}
.error label, .error label.error, label.error {
	color: #C60F13;
}

/* footer */
.copyright, .techno, .author {
	text-align: center;
	margin-bottom: .5em;
	font-size: .8rem;
}
.techno {
	color: #666;
	font-size: 16px;
}
.techno i:hover {
	color: #333;
}
.author a {
/* 	font-weight: bold; */
}
.tooltip {
	background: #0097db;
	font-weight: normal;
	text-shadow: none;
	border: 1px solid #2284a1;
}
.tooltip > .nub {
	border-color: transparent transparent #0097db transparent;
}

/* ---- Selections ----------- */
/* Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate */
/*::-moz-selection { background: #2d353e; color: #fff; text-shadow: none; }
::selection { background: #2d353e; color: #fff; text-shadow: none; }*/

/* ---- Placeholders ---------- */
/*input::-webkit-input-placeholder { color:#666; }
input:-moz-placeholder { color:#666; }
input:-ms-placeholder { color:#666; }
textarea::-webkit-input-placeholder { color:#666; }
textarea:-moz-placeholder { color:#666; }
textarea:-ms-placeholder { color:#666; }*/

/* ---- Chrome Frame Prompt ---------- */
.chromeframe { margin:0;padding: 0.2em 1em;border:1px solid red;text-align:center;background:#ffaa00; color:#000;text-shadow:none;font-weight:normal; }
.chromeframe-red { margin: 0.2em 0; padding: 0.2em 1em; text-align:center; color:white; background:maroon;text-shadow:none; }
.chromeframe a { text-decoration: underline; }


/* ==|== Helper Classes ========================== */
/* non-semantic helper classes - Please define your styles before this section. From H5BP */
/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; line-height: 0; }
.ir br { display: none; }
/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }
/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }
/* Contain floats: h5bp.com/q // Micro clearfix hack,Source: nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: ""; display: table; }
 .clearfix:after { clear: both; }
 .clearfix { *zoom: 1; }
.visible { display: block !important;opacity:1 !important;visibility:visible !important; }
/* special class for centered span and content / works only on elem w declared width!! */

/* All browsers in the universe (that I know of) use a default em-size of 16px. The only exception to this rule is BlackBerry OS6 which uses different default font-sizes on different devices (22px and even 17px). This will normalize the base font-size for all current and future browsers. It does remove the ability to adjust the font-size in the browser in IE9 though so you might want to put the code in a somewhat restricting mediaquery: */

/* max-width 640px, mobile-only styles, use when QAing mobile issues */
@media only screen and (max-width: 40em) {
	:root {
		font-size: 16px; 
	}

	button.btn-small, .button.btn-small {
		width: 100% !important;
		font-size: 1.1rem;
		line-height: 1.2;
	}
}

/* min-width 641px, medium screens */
@media only screen and (min-width: 40.063em) {
	.brand {
		background-position: 2px 0;
		margin-bottom: 5rem;
	}
	.copyright {
		text-align: left;
	}
	.author {
		text-align: right;
	}
	.tooltip > .nub {
		border-color: transparent transparent #0097db transparent;
	}
	.tooltip.tip-top > .nub {
		border-color: #0097db transparent transparent transparent;
	}
	.tooltip.tip-left > .nub {
		border-color: transparent transparent transparent #0097db;
	}
	.tooltip.tip-right > .nub {
		border-color: transparent #0097db transparent transparent;
	}
	.medium-block-grid-1-2 > li:nth-of-type(2n) {
		clear: none;
		width: 66.66666%;
		list-style: none;
	}
	.medium-block-grid-1-2 > li:nth-of-type(2n+1) {
		clear: both;
		width: 33.33333%;
		list-style: none;
	}
	.medium-block-grid-2-1 > li:nth-of-type(2n) {
		clear: none;
		width: 33.33333%;
		list-style: none;
	}
	.medium-block-grid-2-1 > li:nth-of-type(2n+1) {
		clear: both;
		width: 66.66666%;
		list-style: none;
	}

	/* positions */
	.top {
		position: absolute;
		top:0;
		left: 0;

	}
	.bottom {
		position: absolute;
		bottom:0;
		left: 0;
	}

	.team-photo {
		height: 294px;
	}
	.team-photo img {
		max-height: 294px;
	}
	.team-desc {
		height: 294px
	}
	.team-desc p.bottom {
		margin: 0 0.9375rem 10px;
	}
}

/* min-width 641px and max-width 720px, to adjust left position of nav */
@media only screen and (min-width: 40.063em) and (max-width: 46.25em) {
	
}

/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
@media only screen and (min-width: 40.063em) and (max-width: 64em) {nav ul.inline-list {
		right: 1em /*9.5858%*/;
	}
}

/* max-width 1024px, use when QAing tablet-only issues */
@media only screen and (max-width: 64em) {
	button.small, .button.small {
		font-size: 1rem;
		line-height: 1.2;
	}

}


/* specials pixel ratio devices */
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (min-device-pixel-ratio: 2),
only screen and (min-resolution: 192dpi),
only screen and (min-resolution: 2dppx) {
	/* iPhone 4, Opera Mobile 11 and other high pixel ratio devices */
	/* 	Crisp background images */
	.logo {
		background: transparent url("../img/logo@2x.png") 0 0 no-repeat;
		background-size: 180px 55px;
	}
}