/*
Theme Name: Flowerpot
Theme URI: http://www.rootstowisdom.com
Author: Kenan Rubenstein for Boy Blue & Co.
Author URI: http://www.boyblueandco.com/
Description: Custom theme for Roots to Wisdom and Anastasia Poland
Version: 1.0
Text Domain: boyblue


Colors:
Black: 			#242833
Dark blue: 		#245BC9
Light blue: 	#648795
bright blue: 	#94bccf
bright green: 	#cfe488
Purple: 		#65507c

*/

.green {
	fill: #cfe488;
}

/* Fonts 



    Warnock Pro Light
        font-family: "warnock-pro", serif;
        font-weight: 300;
        font-style: normal;
    Warnock Pro Light Italic
        font-family: "warnock-pro", serif;
        font-weight: 300;
        font-style: italic;
    Warnock Pro Regular
        font-family: "warnock-pro", serif;
        font-weight: 400;
        font-style: normal;
    Warnock Pro Italic
        font-family: "warnock-pro", serif;
        font-weight: 400;
        font-style: italic;
    Warnock Pro Semibold
        font-family: "warnock-pro", serif;
        font-weight: 600;
        font-style: normal;
    Warnock Pro Semibold Italic
        font-family: "warnock-pro", serif;
        font-weight: 600;
        font-style: italic;
    Warnock Pro Bold
        font-family: "warnock-pro", serif;
        font-weight: 700;
        font-style: normal;
    Warnock Pro Bold Italic
        font-family: "warnock-pro", serif;
        font-weight: 700;
        font-style: italic;
    Warnock Pro Light Caption
        font-family: "warnock-pro-caption", serif;
        font-weight: 300;
        font-style: normal;
    Warnock Pro Light Italic Caption
        font-family: "warnock-pro-caption", serif;
        font-weight: 300;
        font-style: italic;
    Warnock Pro Caption
        font-family: "warnock-pro-caption", serif;
        font-weight: 400;
        font-style: normal;
    Warnock Pro Italic Caption
        font-family: "warnock-pro-caption", serif;
        font-weight: 400;
        font-style: italic;
    Warnock Pro Semibold Caption
        font-family: "warnock-pro-caption", serif;
        font-weight: 600;
        font-style: normal;
    Warnock Pro Semibold Italic Caption
        font-family: "warnock-pro-caption", serif;
        font-weight: 600;
        font-style: italic;
    Warnock Pro Bold Caption
        font-family: "warnock-pro-caption", serif;
        font-weight: 700;
        font-style: normal;
    Warnock Pro Bold Italic Caption
        font-family: "warnock-pro-caption", serif;
        font-weight: 700;
        font-style: italic;
    Warnock Pro Light Display
        font-family: "warnock-pro-display", serif;
        font-weight: 300;
        font-style: normal;
    Warnock Pro Light Italic Display
        font-family: "warnock-pro-display", serif;
        font-weight: 300;
        font-style: italic;
    Warnock Pro Display
        font-family: "warnock-pro-display", serif;
        font-weight: 400;
        font-style: normal;
    Warnock Pro Italic Display
        font-family: "warnock-pro-display", serif;
        font-weight: 400;
        font-style: italic;
    Warnock Pro Semibold Display
        font-family: "warnock-pro-display", serif;
        font-weight: 600;
        font-style: normal;
    Warnock Pro Semibold Italic Display
        font-family: "warnock-pro-display", serif;
        font-weight: 600;
        font-style: italic;
    Warnock Pro Bold Display
        font-family: "warnock-pro-display", serif;
        font-weight: 700;
        font-style: normal;
    Warnock Pro Bold Italic Display
        font-family: "warnock-pro-display", serif;
        font-weight: 700;
        font-style: italic;
    Warnock Pro Light Subhead
        font-family: "warnock-pro-subhead", sans-serif;
        font-weight: 300;
        font-style: normal;
    Warnock Pro Light Italic Subhead
        font-family: "warnock-pro-subhead", sans-serif;
        font-weight: 300;
        font-style: italic;
    Warnock Pro Subhead
        font-family: "warnock-pro-subhead", sans-serif;
        font-weight: 400;
        font-style: normal;
    Warnock Pro Italic Subhead
        font-family: "warnock-pro-subhead", sans-serif;
        font-weight: 400;
        font-style: italic;
    Warnock Pro Semibold Subhead
        font-family: "warnock-pro-subhead", sans-serif;
        font-weight: 600;
        font-style: normal;
    Warnock Pro Semibold Italic Subhead
        font-family: "warnock-pro-subhead", sans-serif;
        font-weight: 600;
        font-style: italic;
    Warnock Pro Bold Subhead
        font-family: "warnock-pro-subhead", sans-serif;
        font-weight: 700;
        font-style: normal;
    Warnock Pro Bold Italic Subhead
        font-family: "warnock-pro-subhead", sans-serif;
        font-weight: 700;
        font-style: italic;

		
		
		
    Neue Kabel Thin
        font-family: "neue-kabel", sans-serif;
        font-weight: 100;
        font-style: normal;
    Neue Kabel Thin Italic
        font-family: "neue-kabel", sans-serif;
        font-weight: 100;
        font-style: italic;
    Neue Kabel ExtraLight
        font-family: "neue-kabel", sans-serif;
        font-weight: 200;
        font-style: normal;
    Neue Kabel ExtraLight Italic
        font-family: "neue-kabel", sans-serif;
        font-weight: 200;
        font-style: italic;
    Neue Kabel Light
        font-family: "neue-kabel", sans-serif;
        font-weight: 300;
        font-style: normal;
    Neue Kabel Light Italic
        font-family: "neue-kabel", sans-serif;
        font-weight: 300;
        font-style: italic;
    Neue Kabel Regular
        font-family: "neue-kabel", sans-serif;
        font-weight: 400;
        font-style: normal;
    Neue Kabel Italic
        font-family: "neue-kabel", sans-serif;
        font-weight: 400;
        font-style: italic;
    Neue Kabel Book
        font-family: "neue-kabel", sans-serif;
        font-weight: 500;
        font-style: normal;
    Neue Kabel Book Italic
        font-family: "neue-kabel", sans-serif;
        font-weight: 500;
        font-style: italic;
    Neue Kabel Medium
        font-family: "neue-kabel", sans-serif;
        font-weight: 600;
        font-style: normal;
    Neue Kabel Medium Italic
        font-family: "neue-kabel", sans-serif;
        font-weight: 600;
        font-style: italic;
    Neue Kabel Bold
        font-family: "neue-kabel", sans-serif;
        font-weight: 700;
        font-style: normal;
    Neue Kabel Bold Italic
        font-family: "neue-kabel", sans-serif;
        font-weight: 700;
        font-style: italic;
    Neue Kabel ExtraBold
        font-family: "neue-kabel", sans-serif;
        font-weight: 800;
        font-style: normal;
    Neue Kabel ExtraBold Italic
        font-family: "neue-kabel", sans-serif;
        font-weight: 800;
        font-style: italic;
    Neue Kabel Black
        font-family: "neue-kabel", sans-serif;
        font-weight: 900;
        font-style: normal;
    Neue Kabel Black Italic
        font-family: "neue-kabel", sans-serif;
        font-weight: 900;
        font-style: italic;


	
		
Calluna Sans Light

    font-family: "calluna-sans", sans-serif;
    font-weight: 300;
    font-style: normal;

Calluna Sans Light Italic

    font-family: "calluna-sans", sans-serif;
    font-weight: 300;
    font-style: italic;

Calluna Sans Regular

    font-family: "calluna-sans", sans-serif;
    font-weight: 400;
    font-style: normal;

Calluna Sans Italic

    font-family: "calluna-sans", sans-serif;
    font-weight: 400;
    font-style: italic;

Calluna Sans Semibold

    font-family: "calluna-sans", sans-serif;
    font-weight: 600;
    font-style: normal;

Calluna Sans Semibold Italic

    font-family: "calluna-sans", sans-serif;
    font-weight: 600;
    font-style: italic;

Calluna Sans Bold

    font-family: "calluna-sans", sans-serif;
    font-weight: 700;
    font-style: normal;

Calluna Sans Bold Italic

    font-family: "calluna-sans", sans-serif;
    font-weight: 700;
    font-style: italic;

Calluna Sans Black

    font-family: "calluna-sans", sans-serif;
    font-weight: 900;
    font-style: normal;

Calluna Sans Black Italic

    font-family: "calluna-sans", sans-serif;
    font-weight: 900;
    font-style: italic;
	
	
	
	
Gist Upright Black

    font-family: "gist-upright", sans-serif;
    font-weight: 900;
    font-style: normal;

	
	Gist Light

    font-family: "gist", sans-serif;
    font-weight: 300;
    font-style: normal;

Gist Regular

    font-family: "gist", sans-serif;
    font-weight: 400;
    font-style: normal;

Gist Bold

    font-family: "gist", sans-serif;
    font-weight: 700;
    font-style: normal;

Gist Black

    font-family: "gist", sans-serif;
    font-weight: 900;
    font-style: normal;

Gist Upright Light

    font-family: "gist-upright", sans-serif;
    font-weight: 300;
    font-style: normal;

Gist Upright Regular

    font-family: "gist-upright", sans-serif;
    font-weight: 400;
    font-style: normal;

Gist Upright Bold

    font-family: "gist-upright", sans-serif;
    font-weight: 700;
    font-style: normal;

Gist Upright Black

    font-family: "gist-upright", sans-serif;
    font-weight: 900;
    font-style: normal;
	
	
	
	
Mokoko Hair

    font-family: "mokoko", serif;
    font-weight: 100;
    font-style: normal;

Mokoko Hair Italic

    font-family: "mokoko", serif;
    font-weight: 100;
    font-style: italic;

Mokoko Thin

    font-family: "mokoko", serif;
    font-weight: 200;
    font-style: normal;

Mokoko Thin Italic

    font-family: "mokoko", serif;
    font-weight: 200;
    font-style: italic;

Mokoko Light

    font-family: "mokoko", serif;
    font-weight: 300;
    font-style: normal;

Mokoko Light Italic

    font-family: "mokoko", serif;
    font-weight: 300;
    font-style: italic;

Mokoko Regular

    font-family: "mokoko", serif;
    font-weight: 400;
    font-style: normal;

Mokoko Italic

    font-family: "mokoko", serif;
    font-weight: 400;
    font-style: italic;

Mokoko Medium

    font-family: "mokoko", serif;
    font-weight: 500;
    font-style: normal;

Mokoko Medium Italic

    font-family: "mokoko", serif;
    font-weight: 500;
    font-style: italic;

Mokoko SemiBold

    font-family: "mokoko", serif;
    font-weight: 600;
    font-style: normal;

Mokoko SemiBold Italic

    font-family: "mokoko", serif;
    font-weight: 600;
    font-style: italic;

Mokoko Bold

    font-family: "mokoko", serif;
    font-weight: 700;
    font-style: normal;

Mokoko Bold Italic

    font-family: "mokoko", serif;
    font-weight: 700;
    font-style: italic;

Mokoko Extra Bold

    font-family: "mokoko", serif;
    font-weight: 800;
    font-style: normal;

Mokoko Extra Bold Italic

    font-family: "mokoko", serif;
    font-weight: 800;
    font-style: italic;

Mokoko Black

    font-family: "mokoko", serif;
    font-weight: 900;
    font-style: normal;

Mokoko Black Italic

    font-family: "mokoko", serif;
    font-weight: 900;
    font-style: italic;
	
*/


/* Animation */

@keyframes reveal {
	0%, 25% {
	    opacity: 0;
	}
	100% {
	    opacity: 1;
	}
}

@keyframes semifade {
	0% {
	    opacity: 1;
	}
	100% {
	    opacity: .15;
	}
}


/* Global / Reset */

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, 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 {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
	display: block;
	margin: 0;
}
audio, canvas, video {
	display: inline-block;
	max-width: 100%;
}

html {
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}
body {
	background: #fff;
}

a {
	color: #65507c;
	text-decoration: none;
	transition: color .4s, background .8s, border .4s, padding .5s, border-radius .5s;
}
a:hover, a:active {
	color: #cfe488;
}
a:focus, a:hover, a:active {
	outline: 0;
}


abbr[title] {
	border-bottom: 1px dotted #2b2b2b;
	cursor: help;
}

b, strong, dt {font-weight: 600;}
address, cite, dfn, em, i {font-style: italic;}
mark, ins {
	background: #fff9c0;
	text-decoration: none;
}

code, kbd, tt, var, samp, pre {
	font-family: monospace, serif;
	-webkit-hyphens: none;
	-moz-hyphens:    none;
	-ms-hyphens:     none;
	hyphens:         none;
}
pre {
	border: 1px solid rgba(0, 0, 0, 0.1);
	margin-bottom: 24px;
	max-width: 100%;
	overflow: auto;
	padding: 12px;
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}

blockquote, q {
	-webkit-hyphens: none;
	-moz-hyphens:    none;
	-ms-hyphens:     none;
	hyphens:         none;
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: "";
	content: none;
}
blockquote {
	font-weight: 400;
	line-height: 1.6;
	margin-bottom: 24px;
}
blockquote cite {
	display: block;
	font-size: 14px;
	line-height: 1.9;
	color: #65507c;
	font-weight: 400;
	font-style: normal;
	text-transform: uppercase;
	margin: 5px 0 0;
}
blockquote strong, blockquote b {font-weight: 400;}

small {font-size: smaller;}
big {font-size: 125%;}

sup, sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sup {bottom: 1ex;}
sub {top: .5ex;}

ul, ol {list-style: none;}

img {
	-ms-interpolation-mode: bicubic;
	border: 0;
	vertical-align: middle;
	max-width: 100%;
	height: auto;
}
svg {
	width: 100%;
	height: 100%;
	transition: fill .3s;
	display: block;
}
svg .cls-1{fill:#648795;}
svg .cls-2{fill:#245bc9;}
svg .cls-3{fill:#65507c;}
svg .cls-4{fill:#242833;}

fieldset {border: 1px solid rgba(0, 0, 0, 0.1);}
legend {white-space: normal;}
button, input, select, textarea {
	color: inherit;
	font-family: inherit;
	font-weight: inherit;
	font-size: 100%;
	margin: 0;
	max-width: 100%;
	vertical-align: baseline;
}
button, input {line-height: normal;}
input, textarea {
	background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0)); /* Removing the inner shadow, rounded corners on iOS inputs */
}
button, html input[type="button"], input[type="reset"], input[type="submit"] {
	-webkit-appearance: none;
	cursor: pointer;
}
button[disabled], input[disabled] {cursor: default;}
input[type="checkbox"], input[type="radio"] {padding: 0;}
input[type="search"], input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
button::-moz-focus-inner, input::-moz-focus-inner {
	border: 0;
	padding: 0;
}
textarea {
	overflow: auto;
	vertical-align: top;
}

table {
	border-collapse: separate;
	border-spacing: 0;
	width: 100%;
}
caption, th, td {
	font-weight: normal;
	text-align: left;
}
th {font-weight: bold;}

del {color: #767676;}

hr {display: none;}

iframe {
	max-width: 100% !important;
	width: 100%;
}

/* non-standard selection styling */
::selection {
	background: #f16800;
	color: #fff;
	text-shadow: none;
}
::-moz-selection {
	background: #f16800;
	color: #fff;
	text-shadow: none;
}


/* Fonts */

body,
#menu li li {
	font-family: 'calluna-sans', sans-serif;
	font-size: 20px;
	color: #242833;
	font-weight: 400;
	line-height: 1;
}

.section-links a, #menu,
h3, h4, h5, h6,
#announcement-bar, #branding, blockquote {
	font-family: 'mokoko', sans-serif;
}
#content h2, blockquote::before {
	font-family: 'gist-upright', serif;
}

#branding .titles, #menu li, h3, .section-links a, blockquote {
	font-size: 24px;
}
#content h2 {
	font-size: 36px;
}

#content h2 {
	font-weight: 200;
}
#menu li li {
	font-weight: 300;
}
#announcement-bar, blockquote {
	font-weight: 600;
}
#content h3, #menu {
	font-weight: 700;
}
#menu li li, #content h2 {
	font-weight: 400;
}

#content h2 {
	line-height: 1.1;
}
#content h3 {
	line-height: 1.3;
}

blockquote {
	quotes: "\201C""\201D""\2018""\2019";
	padding-left: 112px;
	position: relative;
	margin: 0 0 12px;
	color: #65507c;
}
blockquote:before {
	content: "\201C";
	display: block;
	font-size: 192px;
	position: absolute;
	top: 0;
	left: 0;
	line-height: 1;
	color: #94bccf;
	font-weight: 400;
}

cite {
	display: block;
	border-top: 2px solid #648795;
	margin: 0 0 64px 112px;
	color: #648795;
	line-height: 1.3;
	padding: 8px 0 0;
}
cite span {
	display: block;
}


/* Structure */

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

#masthead .banner,
article,
#colophon .banner {
	padding: 0 16px;
}
.banner {
	height: 100%;
}


/* Header */

#masthead {
	position: fixed;
	top: 0;
	left: 0;
	height: 64px;
	width: 100%;
	z-index: 999;
}
#masthead .banner {
	background: #fff;
	box-shadow: 0 0 24px rgba(23, 49, 98, .4);
}
#masthead h1 {
	float: left;
	width: 100%;
	height: calc(100% - 4px);
	overflow: hidden;
	padding: 0 48px 0 0;
	max-width: 480px;
	transition: opacity .9s ease-in-out .3s, max-width .6s;
}
.gradient {
	fill: #000;
	fill: url(#New_Gradient_Swatch_1);
}

#announcement-bar {
	background: #65507c;
	background: linear-gradient(to right, #65507c 0%,#65507c 100%);
	color: #fff;
	line-height: 1.6;
	text-transform: uppercase;
	font-size: 19px;
	margin: 70px 0 0;
	border-bottom: 3px solid #fff;
}
#announcement-bar .announcement-content {
	padding: 20px 16px 16px;
	display: block;
}
#announcement-bar a {
	color: #fff;
}

#marketing-modal {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	background: rgba(255,255,255,.6);
	background: rgba(23, 49, 98, .6);
	transition: opacity .5s;
	line-height: 1.6;
}
#marketing-modal > a.close {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}
#marketing-modal > a.close .label {
	display: none;
}
#marketing-modal.closed {
	opacity: 0;
	pointer-events: none;
}
#marketing-modal .modal-content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: 16px;
	background: #fff;
	border-radius: 5px;
	width: calc(100% - 32px);
	max-width: 704px;
	box-shadow: 0px 5px 30px rgba(23, 49, 98, .4);
	z-index: 2;
}
#marketing-modal .modal-content .close {
	position: absolute;
	top: 16px;
	right: 16px;
	border-radius: 50%;
	width: 48px;
	height: 48px;
	background: #648795;
	transition: background .4s, transform .8s;
}
#marketing-modal .modal-content .close:hover {
	background: #65507c;
	transform: rotate(360deg);
}
#marketing-modal .modal-content h2 {
	padding-right: 64px;
}
#marketing-modal .modal-content .close .label {
	display: none;
}
#marketing-modal .modal-content .close .icon {
	display: block;
	position: absolute;
	top: 0;
	left: -2px;
	height: 100%;
	width: 100%;
}
#marketing-modal .modal-content .close .icon svg {
	fill: #fff
}


/* Main Nav */

#menu {
	width: 80px;
	position: absolute;
	top: 0;
	right: 0;
}

#menu h2 {
	position: absolute;
	right: 0;
	top: 0;
	width: 64px;
	height: 64px;
	display: block;
	overflow: hidden;
	transition: transform .6s, height .6s, width .6s, top .6s, right .6s;
	z-index: 9;
}
#menu h2 .label {
	display: none;
}
#menu.active h2 {
	transform: rotate(90deg);
}
#menu h2 svg {
	margin: 0;
	fill: #242833;
	height: 100%;
	display: block;
	overflow: visible;
	transition: transform .6s, fill .6s, filter .6s;
}
#menu.active h2 svg {
	transform: translate(20%, 0);
}
#menu h2 a {
	display: block;
	padding: 16px;
	height: 100%;
}
#menu.active h2 a svg {
	fill: #65507c;
	
}
	
	
#menu h2 svg rect {
	transition: transform .6s, fill .6s, filter .6s;
}
#menu h2 svg #menu-rect-1 {
	transform-origin: 0 20px;
}
#menu h2 svg #menu-rect-3 {
	transform-origin: 0 0px;
}
#menu h2 svg #menu-rect-2 {
	transform-origin: 25% 0;
}
#menu.active h2 svg #menu-rect-3 {
	transform: rotate(45deg);
}
#menu.active h2 svg #menu-rect-1 {
	transform: rotate(-45deg);
}
#menu.active h2 svg #menu-rect-2 {
	transform: scale(0, 1);
}
	

#menu ul li {
	display: inline-block;
	text-align: center;
	padding: 0;
	vertical-align: top;
}

	#main-menu {
		padding: 19px 0;
		position: fixed;
		top: 64px;
		bottom: 0;
		right: 0;
		width: 480px;
		max-width: calc(100vw - 64px);
		transition: transform .5s, top .6s, box-shadow .6s;
		transform: translate(100%, 0);
		background: #65507c; /* Old browsers */
		background: linear-gradient(to bottom, #242833 0%,#648795 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		overflow-y: auto;
		z-index: -1;
	}
	#menu.active #main-menu {
		transform: translate(0, 0);
	}
	#menu ul li {
		display: block;
		text-align: left;
	}
	#menu ul a {
		display: block;
		color: #fff;
		padding: 19px 32px;
		position: relative;
		z-index: 1;
		overflow: hidden;
	}
	
	#menu ul a:hover {
		color: #cfe488;
	}
	#menu ul ul {
		margin-bottom: 24px;
		margin-left: 32px;
	}
	#menu ul ul a {
		padding: 8px 32px;
	}
	#menu ul ul a::after {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		width: 2px;
		background: #fff;
	}

	#menu .overlay {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		width: 100%;
		background: rgba(255,255,255,0);
		cursor: alias;
		z-index: -2;
		pointer-events: none;
		transition: top .6s, background .6s;
	}
	#menu.active .overlay {
		background: rgba(255,255,255,.8);
		pointer-events: auto;
	}
	#menu .overlay .label {
		display: none;
	}



/* Content */

#content {
	margin: 64px 0 0;
}
section {
	padding: 0 0 6%;
}
.section {
	clear: both;
}
article {
	line-height: 1.5;
	position: relative;
	animation: reveal 2s ease-in-out;
	margin-bottom: 16%;
}
section article {
	margin-bottom: 0;
}
article h2 {
	margin: 0 0 4px;	
}
#content h2 span,
#content h3 span {
	display: block;
}
#content h3 + p {
	margin-top: 4px;
}

section h2 {
	margin: 24px 0 32px;
	background: #65507c; /* Old browsers */
	background: linear-gradient(80deg, #65507c 0%,#648795 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	color: transparent;
	-webkit-background-clip: text;
	background-clip: text;
	position: relative;
	padding: 0 0 32px;
}
section h2::after,
section h2::before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	height: 100%;
}
section h2::before {
	border-bottom: 4px solid #94bccf;
	border-radius: 0 0 36px 0;
	width: 100%;
	bottom: 0;
	transition: width 2s, border-radius 1s ease-in-out 1.2s;
}
section h2::after {
	border-top: 2px solid #94bccf;
	border-radius: 0 48px 0 0;
	width: calc(100% + 36px);
	top: calc(100% + 2px);
	transition: width 2.7s, border-radius 1.5s ease-in-out 1.7s;
}
section.preseen h2::after,
section.preseen h2::before {
	width: 0;
	border-radius: 0;
}


.entry-content h3 {
	margin: 45px 0 6px;
}
#content h4 {
	font-weight: 300;
	text-transform: uppercase;
	margin: 30px 0 5px;
}
article p:not(:last-child) {
	margin: 0 0 32px;
}

article ul {
	margin: 0 0 32px 16px;
	list-style-type: square;
}

article img {
	margin: 30px 0;
	border-radius: 3px;
}
article .wp-caption {
	text-transform: uppercase;
	font-size: 10px;
	text-align: right;
	max-width: 100%;
	font-weight: 400;
}
article .wp-caption img {
	margin: 0 0 15px;
}

article img.attachment-boyblue-splash {
	width: 100%;
}
article header.page-header {
	position: relative;
	padding: 60px 0;
}

#page article .section-content {
	transition: height .6s, opacity .6s;
	overflow: hidden;
}
#page article .item-content {
	transition: height .6s, opacity .6s;
	overflow: hidden;
}
#page article .section.hidden .section-content {
	height: 0 !important;
	opacity: 0;
}
#page article li.hidden .item-content {
	height: 0 !important;
	opacity: 0;
}

.post-edit-link {
	position: absolute;
	top: 0;
	right: 100%;
	padding: 0 20px 0 0;
	font-size: 12px;
	text-transform: uppercase;
}

.entry-content p,
.entry-content ul,
.entry-content ol,
.entry-content form {
/*	width: 94%;*/
/*	max-width: 720px;*/
	margin: 0 auto 30px;
}




/* Splash */
#section-splash {
	background-color: #00005b;
	position: relative;
	color: #fff;
	animation: reveal .5s ease-in-out;
	overflow: hidden;
	padding: 0;
}

#content #section-splash h2 {
	font-size: 22px;
	font-weight: 700;
	padding: 0;
}
#section-splash .titles span{
	display: block;
	line-height: 1.3;
}
#branding .logo {
	display: none;
}
#branding .titles {
	margin: 0;
	position: absolute;
	bottom: 16px;
	left: 16px;
}

#section-splash .splash-image::before {
	position: absolute;
	content: '';
	bottom: 0;
	left: 0;
	width: 100%;
	height: 96px;
	background: linear-gradient(to top, rgba(0,0,0,.4) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}


/* Sections */
#page section {
	position: relative;
}
section .photo-credit {
	position: relative;
	z-index: 6;
	text-transform: uppercase;
	font-size: 11px;
	font-weight: 300;
	padding: 4%;
	position: absolute;
	top: 0;
	right: 0;
}
section .photo-credit a {
	color: #65507c !important;
	opacity: .5;
	transition: opacity .3s;
}
section .photo-credit a:hover {
	opacity: 1;
}

.blue {
	background: #242833;
	background: linear-gradient(to bottom, #242833 60%, #65507c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	color: #fff;
	color: #efe9fc;
}
#content .blue h3 {
	color: #fff;
}
.blue a, .purple a, .lightblue a {
	color: inherit;
}
.purple {
	background: #65507c;
	background: linear-gradient(to bottom, #65507c 75%,#65507c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */	
	color: #fff;
}
.purple-2 {
	background: #65507c;
	background: linear-gradient(to bottom, #242833 25%,#65507c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */	
	color: #fff;
}

.blue a:hover,
.lightblue a:hover,
.purple a:hover{
	color: #cfe488;
}
.blue header,
.lightblue header,
.purple header,
.blue .section-links,
.lightblue .section-links,
.purple .section-links {
	border-color: #65507c;
}

section.blue h2 {
	background: linear-gradient(80deg, #94bccf 0%,#cfe488 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	-webkit-background-clip: text;
	background-clip: text;
}
section.blue h2::before {
	border-color: #94bccf;
}
section.blue h2::after {
	border-color: #648795;
}

.splash-image + article header {
	margin: 32px 0;
}
#content .splash-image + article header h2 {
	margin: 0;
}

.splash-image {
	position: relative;
}
.splash-image img {
	width: 100%;
}

a .icon,
#announcement-bar .icon {
	height: 15px;
	width: 20px;
	display: inline-block !important;
	vertical-align: 0px;
	margin: 0 0 0 2px;
}

#content header.page-header {
	position: relative;
	background: #242833;
	background: linear-gradient(135deg, #242833 0%,#245bc9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.page-work-with-me #content header.page-header,
.single #content header {
	background: #648795;
	background: linear-gradient(135deg, #648795 0%,#cfe488 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.page-about #content header.page-header {
	background: #cfe488;
	background: linear-gradient(135deg, #648795 0%,#cfe488 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.page-contact #content header.page-header {
	background: #65507c;
	background: linear-gradient(135deg, #242833 0%,#65507c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.page-media #content header.page-header {
	background: #65507c;
	background: linear-gradient(135deg, #65507c 0%,#65507c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.page-press #content header.page-header {
	background: #65507c;
	background: linear-gradient(135deg, #242833 0%,#65507c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.header-bg {
	padding: 16% 0;
	background-position: 0 center;
	background-size: cover;
}
.page-upcoming-events .header-bg {
	background-position: 0 20%;
}
#content header.page-header h2 {
	padding: 4%;
	color: #fff;
}

/* Services List */
#services-list li {
	margin-bottom: 48px;
	transition: margin-bottom .6s
}
#services-list li.hidden {
	margin-bottom: 12px;
}

#press-list li {
	margin: 0 0 30px;
	line-height: 1.7em;
}
#press-list li span {
	display: inline-block;
}
#press-list li .citation {
	font-style: italic;
	font-weight: 300;
}
#press-list li .citation .source {
	font-style: normal;
	font-weight: 400;
}

.video-embed {
	width: 100%;
	margin: 16px 0;
}


#services-list li:not(.hidden) h3 a {
	color: #242833;
}

#page article .section a .icon {
	transform: rotate(-180deg);
	transition: transform 1s, transform-origin 1s;
	vertical-align: middle;
	margin: 0 0 0 -20px;
}
#content h3 .accordian span {
	display: inline-block;
	vertical-align: top;
}
#content h3 .accordian span.label {
	margin-right: 24px;
}
#page article .section.hidden a .icon {
	transform: rotate(90deg);
}
a .icon svg {
	fill: #242833;
}
footer a .icon svg {
	fill: #94bccf;
}
footer a:hover .icon svg {
	fill: #cfe488;
}
.hidden a .icon svg {
	fill: #648795;
}
.hidden a:hover .icon svg {
	fill: #65507c;
}

#articles-list {
	margin: 0 -8px;
	}
.article-preview {
	margin: 0 0 16px;
	clear: both;
	padding: 0 8px;
}
.article-preview.standard {
	width: calc( 100%/3);
	display: inline-block;
	vertical-align: top;
}
.article-preview.featured {
	background: #e1eef9;
	margin: 24px -8px;
	padding: 16px;
}
#content .article-preview.featured h3 {
	margin: 0 0 24px;
}
#content .article-preview.standard h3 {
	display: none;
}
#content .article-preview.featured .article-links {
	color: inherit;
}
h3 .article-date {
	font-size: 14px;
	font-weight: 400;
	line-height: 1.7;
}
h3 .article-author {
	color: #65507c;
}
.featured h3 .article-author {
	text-transform: none;
	font-weight: 400;
	font-size: 20px;
	line-height: 1.5;
}
.standard h3 .article-author {
	display: inline-block !important;
}
.article-preview.featured .entry-preview {
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.6;
	font-size: 18px;
}
.entry-preview {
	margin-top: 6px;
	line-height: 1.7em;
}
.article-thumb {
	float: right;
	width: 32%;
	max-width: 200px;
	margin: 0 0 4% 6%;
}
.featured .pub-logo {
	width: 20%;
	max-width: 96px;
	float: right;
	clear: right;
	margin: 0 0 16px 24px;
}
.standard .pub-logo {
	height: calc( (100vw - 64px)/3 );
	max-height: 192px;
	position: relative;
	overflow: hidden;
}
.pub-logo img {
	display: inline-block;
	vertical-align: middle;
	margin: 0;
	border-radius: 0;
}
.standard .pub-logo img {
	width: 192px;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
article .article-thumb img {
	border-radius: 50%;
	margin-top: 0;
}
h3 a {
/*	color: #242833;*/
}
h3 a .subtitle {
	color: #242833;
	transition: color .3s;
}
h3 a:hover .subtitle {
	color: inherit;
}
.article-links {
	font-size: 19px;
	color: #cfe488;
}
h3 + .article-links {
	margin-top: -8px;
}
.entry-content {
	margin: 32px 0;
}
.entry-content + .article-links {
	margin-top: 16%;
}
.section-links {
	margin: 32px 0 0;
	padding: 16px 0 0 0;
	border-top: 2px solid #94bccf;
	text-align: center;
}
.article-link {
	display: block;
}
.article-link a {
	display: inline-block;
}
.section-links a,
.read-link a,
a.button {
	color: #65507c;
	display: inline-block;
	padding: 16px 24px 16px 24px;
	font-weight: 900;
	line-height: 1.5em;
	margin: 0 12px 12px;
	position: relative;
	z-index: 1;
	vertical-align: top;
}
.section-links a::before,
.read-link a::before,
a.button::before,
.section-links a::after,
.read-link a::after,
a.button::after {
	content: '';
	display: block;
	position: absolute;
	height: 100%;
	width: 0;
	z-index: -1;
	transition: width .8s, border-color .4s, border-radius .6s ease-in-out .4s;
}
.section-links a::before,
.read-link a::before,
a.button::before {
	bottom: 0;
	right: 50%;
	border-radius: 0;
	border-bottom: 3px solid #65507c;
}
.section-links a::after,
.read-link a::after,
a.button::after {
	top: calc(100% - 3px);
	left: 50%;
	border-radius: 0;
	border-top: 3px solid #65507c;
}
.section-links a:hover::before,
.read-link a:hover::before,
a.button:hover::before,
.section-links a:hover::after,
.read-link a:hover::after,
a.button:hover::after {
	width: 50%;
	border-color: #648795;
	border-radius: 0 16px;
}
.section-links a:hover,
.read-link a:hover,
a.button:hover {
	color: #648795;
}

.section-links a svg,
.read-link a svg,
#announcement-bar svg {
	fill: #fff;
}
.section-links a .icon,
.read-link a .icon,
#announcement-bar .icon {
	transition: transform .5s cubic-bezier(.41,1.24,.62,1.51);
}
.section-links a:hover .icon,
.read-link a:hover .icon,
#announcement-bar a:hover .icon {
	transform: translate(8px, 0);
}

.blue .section-links a,
.purple .section-links a,
.babyblue .section-links a {
	color: #94bccf;
}

.blue .section-links a:hover,
.purple .section-links a:hover,
.babyblue .section-links a:hover {
	color: #cfe488;
}
.blue .section-links a:hover::after,
.purple .section-links a:hover::after,
.babyblue .section-links a:hover::after,
.blue .section-links a:hover::before,
.purple .section-links a:hover::before,
.babyblue .section-links a:hover::before {
	border-color: #cfe488;
}



/* Events Calendar */

#events-calendar {
	font-size: 17px;
}
#events-calendar h3 {
	text-align: center;
	font-family: 'Josefin Slab', serif;
	margin: 64px 0 32px;
	font-weight: 600;
	font-size: 25px;
}
#calendar h4 {
	margin: 0 !important;
	font-weight: 700;
	line-height: 1.4;
}
#calendar h4 .private-event {
	font-weight: 400;
}
#calendar .event {
	padding-left: 68px;
	position: relative;
	line-height: 1.4;
}
#calendar .event .event-date {
	position: absolute;
	left: 0;
	top: 0;
	font-family: 'Josefin Slab', serif;
	font-size: 48px;
	line-height: 1;
	width: 52px;
	text-align: right;
}
#calendar .event-location span {
	display: inline-block;
}
#calendar .event.featured .event-location {
	text-transform: uppercase;
	color: #65507c;
	font-weight: 700;
	display: block;
	line-height: 1.4;
}

#calendar .event.featured {
	background: #e1eef9;
	margin: 16px -16px;
	padding: 16px 16px 16px 84px;
}
#calendar .event.featured .event-date {
	position: absolute;
	left: 16px;
	top: 16px;
}
#calendar .event.featured h4 {
	color: #648795;
}
#calendar .event-links a {
	display: block;
	text-transform: uppercase;
	font-weight: 600;
/*	color: #245BC9;*/
}
#calendar .event-links a:hover {
	color: #65507c;
}
#calendar .event-links .icon {
	width: 16px;
	height: 24px;
	vertical-align: middle;
	margin: -6px 8px 0 0;
	fill: #648795;
/*	fill: #245BC9;*/
}
#calendar .event-links a:hover .icon {
	fill: #65507c;
}
#calendar .event-notes {
	margin-bottom: 16px;
}
#events-calendar .event-title {
	font-weight: 700;
	text-transform: uppercase;
}
#calendar-archive .event span {
	display: inline-block;
}


/* Forms */

label .helper {
	display: none;
}
input,
textarea,
select {
	width: 100%;
	padding: 16px 18px 12px;
	border-radius: 2px;
	border: 0;
	background: #648795;
	color: #fff;
	margin: 0 0 15px;
	transition: background-color .3s, box-shadow .4s;
}
select {
	-moz-appearance: none;
	-webkit-appearance: none;
	background: none;
	height: 40px;
	border: 1px solid #aaaaaf;
	color: #aaaaaf;
	padding: 0 12px;
	position: relative;
	cursor: pointer;
}
span.select {
	position: relative;
	display: block;
}
span.select:after {
	content: '';
	display: block;
	position: absolute;
	top: 11px;
	right: 16px;
	height: 18px;
	width: 15px;
	background: transparent url('images/icon_select_lei.svg') no-repeat right 0;
	background-size: auto 100%;
	z-index: 4;
	pointer-events: none;
}
select option {
	background: #242833;
	color: #fff;
	font-weight: 300;
	height: 40px;
	padding: 8px 12px;
}
select:focus,
select option:focus {
	color: #42424b;
	outline: none;
}
select:-moz-focusring { /* hack: remove FF's focus ring */
    color: transparent;
    text-shadow: 0 0 0 #42424b;
}
input:focus,
textarea:focus {
	background: #242833;
	outline: none;
	color: #fff;
}
input[type="submit"] {
	background: #648795;
	text-transform: uppercase;
	font-weight: 700;
	color: #fff;
}
input[type="submit"]:hover,
input[type="submit"]:focus {
	background: #cfe488;
}

/* placeholders */
::-webkit-input-placeholder {
   color: #fff;
   opacity: 1;
}
::-moz-placeholder {  /* Firefox 19+ */
   color: #fff;  
   opacity: 1;
}
:-ms-input-placeholder {  
   color: #fff;  
   opacity: 1;
}

/* WPCF7 overrides */

.wpcf7 .wpcf7-response-output {
	margin: 0;
	padding: 0;
}
.wpcf7 .wpcf7-mail-sent-ok,
.wpcf7 .wpcf7-validation-errors {
	border: none;
}
input.wpcf7-not-valid,
textarea.wpcf7-not-valid {
	background: #65507c;
	color: #fff;
}
.wpcf7 span.wpcf7-not-valid-tip {
	color: #65507c;
	margin: -15px 0 15px;
}
.wpcf7 .ajax-loader {
	position: relative;
	float: right;
	margin: -58px 7px 0 0;
	background: #fff;
	padding: 10px;
	border-radius: 1px;
}



/* Footer */

#colophon {
	background: #242833; /* Old browsers */
	color: #94bccf;
	
}
#colophon a {
	font-weight: 700;
	color: inherit;
	text-decoration: underline;
}
#colophon a:hover {
	color: #cfe488;
}
#colophon .banner {
	padding: 32px 16px;
	line-height: 1.5em;
	margin-left: auto;
	margin-right: auto;
}
#colophon span {
	display: inline-block;
}
#colophon .generator {
	display: none;
}
#colophon .designer {
	display: block;
	font-size: 16px;
}

#colophon .contact {
	margin: 0 16px 32px;
}
#colophon .contact span {
	display: block;
}
#colophon .links a {
	display: inline-block;
	margin: 0 16px 24px;
	vertical-align: baseline;
}
#colophon .links a .icon {
	display: block;
	height: 64px;
	width: 64px;
	position: relative;
}
#colophon .links a .label {
	display: none;
}

#colophon .links a .icon svg {
	height: 100%;
	width: 100%;
}


/* Responsivity */

/* Future-proof the viewport meta tag */
@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}


@media screen and (min-width: 651px) {
	
	#marketing-modal .modal-content {
		padding: 32px 32px 16px;
	}
	
	#content h2,
	#content #section-splash h2 {
		font-size: 36px;
	}
	
	article {
		margin: 0 32px 64px;
	}
	.article-preview.featured {
		margin: 32px -24px;
		padding: 32px;
	}
	#content .article-preview.featured h3 {
		font-size: 23px;
	}
	
	.pub-logo {
		margin: 0 0 32px 0;
		text-align: center;
	}
	
	article .alignright {
		float: right;
		max-width: 300px !important;
		margin: 0 0 30px 50px;
	}
	
	
	.read-link a {
		display: inline-block;
	}
	
	#events-calendar {
		font-size: 18px;
	}
	#calendar .event {
		padding-left: 84px;
		margin: 32px 0;
		line-height: 1.5;
	}
	#calendar .event .event-date {
		font-size: 64px;
		width: 64px;
		top: -4px;
		font-weight: 300;
		line-height: .9;
	}
	#calendar .event.featured {
		padding: 32px 32px 32px 116px;
		margin: 16px -32px;
	}
	#calendar .event.featured .event-date {
		position: absolute;
		left: 32px;
		top: 28px;
	}
	
	.video-embed {
		margin: 24px 0;
	}
	
	#colophon .banner {
		padding: 64px 32px;
		text-align: center;
	}
	
}

@media screen and (min-width: 916px) {
	
	#masthead {
	    border: none;
		transition: height .6s;
	}
	#masthead .banner {
		transition: background 1s, box-shadow 1s;
	}
	body:not(.scrolling) #masthead {
		height: 72px;
	}
	body:not(.scrolling) #masthead h1 {
		max-width: 520px;
	}
	body:not(.scrolling) #menu h2 {
		height: 72px;
		width: 72px;
	}
	.home:not(.scrolling) #masthead .banner {
		background-color: transparent;
		box-shadow: 0 0 0 rgba(23, 49, 98, .0);
		
	}
	
	.home:not(.scrolling) #masthead h1 {
		opacity: 0;
		pointer-events: none;
	}
	.home:not(.scrolling) #menu {
		z-index: 1;
	}
	.home:not(.scrolling) #menu h2 {
		right: calc(4vw - 16px);
		top: calc(4vw - 24px);
		height: 80px;
		width: 80px;
	}
	.home:not(.scrolling) #menu h2 a svg {
		fill: #fff;
		filter: drop-shadow(0px 8px 8px rgb(0 0 0 / 0.4));
	}
	
	body:not(.scrolling) #main-menu {
		top: 72px;
	}
	.home:not(.scrolling) #main-menu {
		top: 0;
	}
	#marketing-modal .modal-content {
		padding: 48px 48px 32px;
	}
	#marketing-modal .modal-content h2 {
		padding-right: 32px;
	}
	
	#announcement-bar {
		text-align: center;
		margin-top: 80px;
		position: relative;
	}
	#announcement-bar a:before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		background: #cfe488;
		background: linear-gradient(135deg, #648795 0%,#648795 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		opacity: 0;
		transition: opacity .8s;
	}
	#announcement-bar a:hover:before {
		opacity: 1;
	}
	#announcement-bar a span {
		position: relative;
		z-index: 2;
	}
	
	#content {
		margin-top: 0;
	}
	#content h2 {
		font-size: 48px;
		transition: opacity 1.6s, transform 1.6s;
		margin-top: 0;
	}
	section article {
		margin-top: 40px;
	}
	article + section article, 
	section.white + section.white article,
	.splash-image + article {
		margin-top: 0 !important;
	}
	
	.splash-image + article header {
		padding: 112px 0 23px;
		margin: -80px 0 32px;
	}
	
	#content #section-splash h2 {
		font-size: 32px;
		font-weight: 600;
	}
	
	#content h4 {
		margin-top: 45px;
		font-size: 26px;
	}
	
	article {
		max-width: 680px;
		margin: 0 auto 64px;
	}
	article .section-content {
		margin-right: -60px;
	}
	article ul {
		margin-left: 18px;
	}
	section.blue article::before,
	section.blue article::after,
	section.blue article .section-content::before,
	section.blue article .section-content::after {
		content: '';
		display: block;
		position: absolute;
		border: 3px solid #94bccf;
	}
	section.blue article::before,
	section.blue article::after {
		top: 48px;
		bottom: 48px;
		width: 100px;
		border-radius: 48px;
		transition: top 3s, bottom 5s, border-radius 2s ease-in-out 1.5s;
	}
	section.blue.preseen article::before,
	section.blue.preseen article::after	{
		top: 50%;
		bottom: 50%;
		border-radius: 0;
	}
	section.blue article::before {
		right: calc(100% + 40px);
		border-width: 0 4px 0 0;
	}
	section.blue article::after {
		left: calc(100% + 40px);
		border-width: 0 0 0 4px;
	}
	section.blue article .section-content::before,
	section.blue article .section-content::after {
		border-width: 0 2px;
		left: -64px;
		right: -64px;
		border-color: #648795;
	}
	section.blue article .section-content::before {
		top: 0;
		bottom: calc(50% + 8px);
		border-radius: 64px 64px 16px 16px;
		transition: top 4s, border-radius 2s ease-in-out 2.5s;
	}
	section.blue article .section-content::after {
		bottom: 0;
		top: calc(50% + 8px);
		border-radius: 16px 16px 64px 64px;
		transition: bottom 4s, border-radius 2s ease-in-out 2.5s;
	}
	section.blue.preseen article .section-content::before {
		top: calc(50% - 8px);
		border-radius: 0;
	}
	section.blue.preseen article .section-content::after {
		bottom: calc(50% - 8px);
		border-radius: 0;
	}
	section.blue .section-links {
		padding-bottom: 48px;
	}
	
	article .section-content p, article .section-content p {
		margin-right: 60px;
	}
	
	.article-preview {
		margin: 0 0 32px;
	}
	.article-preview.featured {
		margin: 48px -64px 64px;
		padding: 64px;
		border-radius: 10px;
		background: none;
		border: 3px solid #cfe488;
	}
	.article-thumb {
		max-width: 224px;
		margin: -32px -32px 4% 6%;
	}
	
	article .entry-content .alignright {
		margin-right: -60px;
	}
	
	section {
		overflow: hidden;
	}
	.splash-image {
		max-height: calc(100vh - 100px);
		height: 56vw;
		background-size: cover;
		background-position: 50% 50%;
		transition: opacity 1.2s, transform 1.9s;
	}
	.preseen .splash-image {
		opacity: 0;
		transform: scale(1.1, 1.1);
	}
	.splash-image img {
		display: none;
	}
	#section-splash {		
		padding: 0;
		height: 56vw;
		max-height: calc(100vh - 100px);
		position: relative;
		background: #65507c; /* Old browsers */
		background: linear-gradient(45deg, #65507c 0%,#648795 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	}
	#section-splash .splash-image img {
		display: none;
	}
	#section-splash .splash-image {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-size: cover;
		background-position: 50% 50%;
		transition: opacity 1.2s, transform 1.9s;
	}
	#section-splash .splash-image::before {
		display: none;
	}
	#section-splash .splash-image::after {
		position: absolute;
		content: '';
		top: 0;
		left: 0;
		width: 50%;
		height: 100%;
		background: linear-gradient(to right,  rgba(0,0,0,.7) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	}
	.scrolling #section-splash .splash-image, .preload #section-splash .splash-image {
		opacity: 0;
		transform: scale(1.1, 1.1);
	}
	
	#branding {
		position: absolute;
		top: 8%;
		left: 7%;
		transition: opacity 1.2s ease-in-out .6s
	}
	.preload #branding {
		opacity: 0;
	}
	#branding .logo {
		display: block;
		height: 440px;
		width: 346px;
	}
	#section-splash .logo svg {
		fill: #fff;
	}
	#branding .titles {
		font-size: 22px;
		position: static;
		margin: -48px 0 0;
		color: #94bccf;
		font-weight: 300;
	}
	#section-splash .titles span {
		line-height: 1.3;
	}
	
	
	.header-bg {
		position: absolute;
		padding: 0;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		opacity: .15;
		animation: semifade 2s ease-in-out;
	}
	#content header.page-header h2 {
		padding: 144px 64px 80px;
		text-align: center;
		animation: reveal 2.5s ease-in-out;
	}
	
	#content .article-preview.standard h3 {
		display: block;
		text-align: center;
		font-size: 16px;
		margin: 32px 0;
	}
	#content .article-preview.standard h3 .subtitle {
		color: #242833;
		text-transform: none;
	}
	
	.read-link a {
		background: none;
		padding: 0;
		color: #648795;
		margin: 0;
	}
	.read-link a:hover {
		color: #65507c;
	}
	.read-link a svg {
		fill: #648795;
	}
	.read-link a:hover svg {
		fill: #65507c;
	}
	
	.page-upcoming-events .header-bg {
		background-position: 0 15%;
	}
	
	#colophon {
		font-size: 18px;
	}
	
	#calendar h3 {
		font-size: 29px;
		margin: 64px 0 32px;
	}
	#calendar h4 {
		font-size: 100%;
	}
	#calendar .event {
		margin-top: 36px;
	}
	#calendar .event .event-date {
		font-size: 64px;
		line-height: .9;
		width: 64px;
		top: -6px;
	}
	#calendar .event.featured {
		padding: 50px 64px 48px 148px;
		margin: 16px -64px;
		border-radius: 10px;
	}
	#calendar .event.featured .event-date {
		left: 64px;
		top: 45px;
	}
	#calendar .event.featured h4 {
		margin: 0;
		font-size: 27px;
		line-height: 1.2;
		font-weight: 600;
	}
	
	.video-embed {
		margin: 32px 0;
	}
	
	#colophon .banner {
		padding: 96px 0;
		max-width: 680px;
	}
	
}

@media screen and (min-width: 1101px) {
	
	body {
		font-size: 22px;
	}
	h3, .section-links a {
		font-size: 25px;
	}
	
	body:not(.scrolling) #masthead {
		height: 80px;
	}
	body:not(.scrolling) #masthead h1 {
		max-width: 560px;
	}
	body:not(.scrolling) #menu h2 {
		height: 80px;
		width: 80px;
	}
	
	body:not(.scrolling) #main-menu {
		top: 80px;
	}
	
	#content header.page-header h2 {
		padding-top: 152px;
	}
	
	.home:not(.scrolling) #menu h2 {
		height: 88px;
		width: 88px;
	}
	
	#marketing-modal .modal-content {
		padding: 64px 64px 48px;
	}
	#marketing-modal .modal-content h2 {
		padding-right: 32px;
	}
	#marketing-modal .modal-content .close {
		top: 32px;
		right: 32px;
	}
	
	#content h2 {
		font-size: 62px;
		line-height: 1.1;
	}
	section article {
		margin-top: 48px;
	}
	
	section.blue article::before {
		right: calc(100% + 64px);
	}
	section.blue article::after {
		left: calc(100% + 64px);
	}
	section.blue article .section-content::before,
	section.blue article .section-content::after {
		left: -88px;
		right: -88px;
	}
	
	article ul {
		margin-left: 20px;
	}
	
	
	#branding .logo {
		height: 510px;
		width: 400px;
	}
	#branding .titles {
		margin-top: -60px;
	}
	
	.splash-image + article header {
		padding: 136px 0 32px;
		margin: -88px 0 32px;
	}
}

@media screen and (min-width: 1281px) {
	
	body {
		font-size: 23px;
	}
	h3, .section-links a {
		font-size: 26px;
	}
	#content h2 {
		font-size: 72px;
		line-height: 1.1;
		
	}
	section article {
		margin-top: 56px;
	}
	
	
	.home:not(.scrolling) #menu h2 {
		height: 96px;
		width: 96px;
	}
	
	#branding .logo {
		height: 570px;
		width: 450px;
	}
	#branding .titles {
		margin-top: -66px;
		font-size: 24px;
	}

	.splash-image + article header {
		padding: 152px 0 32px;
		margin: -96px 0 32px;
	}
	section.blue article::before {
		right: calc(100% + 72px);
	}
	section.blue article::after {
		left: calc(100% + 72px);
	}
	section.blue article .section-content::before,
	section.blue article .section-content::after {
		left: -96px;
		right: -96px;
	}
	
}

@media screen and (min-width: 1481px) {
	
	body {
		font-size: 24px;
	}
	h3, .section-links a {
		font-size: 28px;
	}
	#content h2 {
		font-size: 80px;
		line-height: 1.1;
	}
	section article {
		margin-top: 64px;
	}
	
	body:not(.scrolling) #masthead {
		height: 88px;
	}
	body:not(.scrolling) #masthead h1 {
		max-width: 600px;
	}
	body:not(.scrolling) #menu h2 {
		height: 88px;
		width: 88px;
	}
	.home:not(.scrolling) #menu h2 {
		height: 100px;
		width: 100px;
	}
	
	#content header.page-header h2 {
		padding-top: 160px;
	}
	
	body:not(.scrolling) #main-menu {
		top: 88px;
	}
	
	.splash-image + article header {
		padding: 168px 0 32px;
		margin: -104px 0 32px;
	}
	article {
		max-width: 740px;
	}
	article::before {
		right: calc(100% + 80px);
	}
	article::after {
		left: calc(100% + 80px);
	}
	section.blue article .section-content::before,
	section.blue article .section-content::after {
		left: -104px;
		right: -104px;
	}
	
	#branding .logo {
		height: 660px;
		width: 520px;
	}
	#branding .titles {
		margin-top: -74px;
	}
	
	#colophon .banner {
		padding: 128px 0;
		max-width: 740px;
	}
	
}


@media screen and (min-width: 1621px) {
	
	.home:not(.scrolling) #menu h2 {
		height: 104px;
		width: 104px;
	}
	
}



/* Print */

@media print {
	body {
		background: none !important; /* Brute force since user agents all print differently. */
		color: #2b2b2b;
		font-size: 12pt;
	}
}