@import url("//fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,800");
@import url("font-awesome.min.css");

/* ==================================================================================
	Based on the ZeroFour template by HTML5Up (http://html5up.net/zerofour)
	Uses a modified Skeleton framework (http://getskeleton.com)
	- first, we reset (zero out ) evertthing and extablish the "border-box" model
	- Containers start around line 50 (media queries around line 90)
	- Grid starts around line 140 (media queries around line 330) 
	- Basic ZeroFour styles start around line 800 and continues around line 915 with:
		Section, Article, Header, and Footer
		Forms
		Tables
		Images
		Lists
		Icon
		Banner
		Wrappers (header, main, and footer)
	- ZeroFour media queries start around line 1450
	- Custom styles and overrides start about line 1900
	 
	- Desktop & Tablet	min-width 737 pixels
	- Tablet only		min-width 737, max-width 1200 pixels
	- Phone only 		max-width 736 pixels
================================================================================== */
	
/************** 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, 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;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
body {
	-webkit-text-size-adjust: none;
}

/************** BOX MODEL **************/

*, *:before, *:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

/************** SKELETON CONTAINERS **************/

.container {
	margin-left: auto;
	margin-right: auto;
}
.container.\31 25\25 { /* .container.125% */
 width: 100%;
 max-width: 1200px;
 min-width: 960px;
}
.container.\37 5\25 { /* .container.75% */
 width: 720px;
}
.container.\35 0\25 { /* .container.50% */
 width: 480px;
}
.container.\32 5\25 { /* .container.25% */
 width: 240px;
}
.container {
	max-width: 960px;
}
 @media screen and (min-width: 737px) {
.container.\31 25\25 { /* .container.125% */
 width: 100%;
 max-width: 1500px;
 min-width: 1200px;
}
.container.\37 5\25 { /* .container.75% */
 width: 900px;
}
.container.\35 0\25 { /* .container.50% */
 width: 600px;
}
.container.\32 5\25 { /* .container.25% */
 width: 300px;
}
.container {
	max-width: 1200px;
}
}
 @media screen and (min-width: 737px) and (max-width: 1200px) {
 .container.\31 25\25 { /* .container.125% */
 width: 100%;
 max-width: 1250px;
 min-width: 1000px;
}
 .container.\37 5\25 { /* .container.75% */
 width: 750px;
}
 .container.\35 0\25 { /* .container.50% */
 width: 500px;
}
 .container.\32 5\25 { /* .container.25% */
 width: 250px;
}
.container {
	max-width: 1000px;
}
}
 @media screen and (max-width: 736px) {
 .container.\31 25\25 { /* .container.125% */
 width: 100%;
 max-width: 125%;
 min-width: 100%;
}
 .container.\37 5\25 { /* .container.75% */
 width: 75%;
}
 .container.\35 0\25 { /* .container.50% */
 width: 50%;
}
 .container.\32 5\25 { /* .container.25% */
 width: 25%;
}
.container {
	width: 100% !important;
}
}

/************** SKELETON GRID **************/

.row {
	border-bottom: solid 1px transparent;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.row > * {
	float: left;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.row:after, .row:before {
	content: '';
	display: block;
	clear: both;
	height: 0;
}
.row.uniform > * > :first-child {
	margin-top: 0;
}
.row.uniform > * > :last-child {
	margin-bottom: 0;
}
.row.\30 \25 > * { /* .row.0% > * */
	padding: 0 0 0 0px;
}
.row.\30 \25 { /* .row.0% */
	margin: 0 0 -1px 0px;
}
.row.uniform.\30 \25 > * { /* .row.uniform.0% */
	padding: 0px 0 0 0px;
}
.row.uniform.\30 \25 { /* .row.0% */
	margin: 0px 0 -1px 0px;
}
.row > * {
	padding: 0 0 0 40px;
}
.row {
	margin: 0 0 -1px -40px;
}
.row.uniform > * {
	padding: 40px 0 0 40px;
}
.row.uniform {
	margin: -40px 0 -1px -40px;
}
 .row.\32 00\25 > * { /* .row.200% > * */
 padding: 0 0 0 80px;
}
 .row.\32 00\25 { /* .row.200% */
 margin: 0 0 -1px -80px;
}
.row.uniform.\32 00\25 > * { /* .row.uniform.200% > * */
 padding: 80px 0 0 80px;
}
.row.uniform.\32 00\25 { /* .row.uniform.200% */
 margin: -80px 0 -1px -80px;
}
 .row.\31 50\25 > * { /* .row.150% > * */
 padding: 0 0 0 60px;
}
 .row.\31 50\25 { /* .row.150% */
 margin: 0 0 -1px -60px;
}
.row.uniform.\31 50\25 > * { /* .row.uniform.150% > * */
 padding: 60px 0 0 60px;
}
.row.uniform.\31 50\25 { /* .row.uniform.150% */
 margin: -60px 0 -1px -60px;
}
 .row.\35 0\25 > * {
 padding: 0 0 0 20px;
}
 .row.\35 0\25 {
 margin: 0 0 -1px -20px;
}
.row.uniform.\35 0\25 > * {
 padding: 20px 0 0 20px;
}
.row.uniform.\35 0\25 {
 margin: -20px 0 -1px -20px;
}
 .row.\32 5\25 > * {
 padding: 0 0 0 10px;
}
 .row.\32 5\25 {
 margin: 0 0 -1px -10px;
}
.row.uniform.\32 5\25 > * {
 padding: 10px 0 0 10px;
}
.row.uniform.\32 5\25 {
 margin: -10px 0 -1px -10px;
}
 .\31 2u, .\31 2u\24 {
 width: 100%;
 clear: none;
 margin-left: 0;
}
 .\31 1u, .\31 1u\24 {
 width: 91.6666666667%;
 clear: none;
 margin-left: 0;
}
 .\31 0u, .\31 0u\24 {
 width: 83.3333333333%;
 clear: none;
 margin-left: 0;
}
.\39 u, .\39 u\24 {
	width: 75%;
	clear: none;
	margin-left: 0;
}
.\38 u, .\38 u\24 {
	width: 66.6666666667%;
	clear: none;
	margin-left: 0;
}
.\37 u, .\37 u\24 {
	width: 58.3333333333%;
	clear: none;
	margin-left: 0;
}
.\36 u, .\36 u\24 {
	width: 50%;
	clear: none;
	margin-left: 0;
}
.\35 u, .\35 u\24 {
	width: 41.6666666667%;
	clear: none;
	margin-left: 0;
}
.\34 u, .\34 u\24 {
	width: 33.3333333333%;
	clear: none;
	margin-left: 0;
}
.\33 u, .\33 u\24 {
	width: 25%;
	clear: none;
	margin-left: 0;
}
.\32 u, .\32 u\24 {
	width: 16.6666666667%;
	clear: none;
	margin-left: 0;
}
.\31 u, .\31 u\24 {
	width: 8.3333333333%;
	clear: none;
	margin-left: 0;
}
 .\31 2u\24 + *, .\31 1u\24 + *, .\31 0u\24 + *, .\39 u\24 + *, .\38 u\24 + *, .\37 u\24 + *, .\36 u\24 + *, .\35 u\24 + *, .\34 u\24 + *, .\33 u\24 + *, .\32 u\24 + *, .\31 u\24 + * {
 clear: left;
}
.\-11u {
	margin-left: 91.66667%;
}
.\-10u {
	margin-left: 83.33333%;
}
.\-9u {
	margin-left: 75%;
}
.\-8u {
	margin-left: 66.66667%;
}
.\-7u {
	margin-left: 58.33333%;
}
.\-6u {
	margin-left: 50%;
}
.\-5u {
	margin-left: 41.66667%;
}
.\-4u {
	margin-left: 33.33333%;
}
.\-3u {
	margin-left: 25%;
}
.\-2u {
	margin-left: 16.66667%;
}
.\-1u {
	margin-left: 8.33333%;
}
 @media screen and (min-width: 737px) {
.row > * {
	padding: 30px 0 0 50px;
}
.row {
	margin: -50px 50px -1px 0;
}
.row.uniform > * {
	padding: 50px 0 0 50px;
}
.row.uniform {
	margin: -50px 0 -1px -50px;
}
 .row.\32 00\25 > * {
 padding: 100px 0 0 100px;
}
 .row.\32 00\25 {
 margin: -100px 0 -1px -100px;
}
.row.uniform.\32 00\25 > * {
 padding: 100px 0 0 100px;
}
.row.uniform.\32 00\25 {
 margin: -100px 0 -1px -100px;
}
 .row.\31 50\25 > * {
 padding: 75px 0 0 75px;
}
 .row.\31 50\25 {
 margin: -75px 0 -1px -75px;
}
.row.uniform.\31 50\25 > * {
 padding: 75px 0 0 75px;
}
.row.uniform.\31 50\25 {
 margin: -75px 0 -1px -75px;
}
 .row.\35 0\25 > * {
 padding: 25px 0 0 25px;
}
 .row.\35 0\25 {
 margin: -25px 0 -1px -25px;
}
.row.uniform.\35 0\25 > * {
 padding: 25px 0 0 25px;
}
.row.uniform.\35 0\25 {
 margin: -25px 0 -1px -25px;
}
 .row.\32 5\25 > * {
 padding: 12.5px 0 0 12.5px;
}
 .row.\32 5\25 {
 margin: -12.5px 0 -1px -12.5px;
}
.row.uniform.\32 5\25 > * {
 padding: 12.5px 0 0 12.5px;
}
.row.uniform.\32 5\25 {
 margin: -12.5px 0 -1px -12.5px;
}
 .\31 2u\28desktop\29, .\31 2u\24\28desktop\29 {
 width: 100%;
 clear: none;
 margin-left: 0;
}
 .\31 1u\28desktop\29, .\31 1u\24\28desktop\29 {
 width: 91.6666666667%;
 clear: none;
 margin-left: 0;
}
 .\31 0u\28desktop\29, .\31 0u\24\28desktop\29 {
 width: 83.3333333333%;
 clear: none;
 margin-left: 0;
}
.\39 u\28desktop\29, .\39 u\24\28desktop\29 {
	width: 75%;
	clear: none;
	margin-left: 0;
}
.\38 u\28desktop\29, .\38 u\24\28desktop\29 {
	width: 66.6666666667%;
	clear: none;
	margin-left: 0;
}
.\37 u\28desktop\29, .\37 u\24\28desktop\29 {
	width: 58.3333333333%;
	clear: none;
	margin-left: 0;
}
.\36 u\28desktop\29, .\36 u\24\28desktop\29 {
	width: 50%;
	clear: none;
	margin-left: 0;
}
.\35 u\28desktop\29, .\35 u\24\28desktop\29 {
	width: 41.6666666667%;
	clear: none;
	margin-left: 0;
}
.\34 u\28desktop\29, .\34 u\24\28desktop\29 {
	width: 33.3333333333%;
	clear: none;
	margin-left: 0;
}
.\33 u\28desktop\29, .\33 u\24\28desktop\29 {
	width: 25%;
	clear: none;
	margin-left: 0;
}
.\32 u\28desktop\29, .\32 u\24\28desktop\29 {
	width: 16.6666666667%;
	clear: none;
	margin-left: 0;
}
.\31 u\28desktop\29, .\31 u\24\28desktop\29 {
	width: 8.3333333333%;
	clear: none;
	margin-left: 0;
}
 .\31 2u\24\28desktop\29 + *, .\31 1u\24\28desktop\29 + *, .\31 0u\24\28desktop\29 + *, .\39 u\24\28desktop\29 + *, .\38 u\24\28desktop\29 + *, .\37 u\24\28desktop\29 + *, .\36 u\24\28desktop\29 + *, .\35 u\24\28desktop\29 + *, .\34 u\24\28desktop\29 + *, .\33 u\24\28desktop\29 + *, .\32 u\24\28desktop\29 + *, .\31 u\24\28desktop\29 + * {
 clear: left;
}
.\-11u\28desktop\29 {
	margin-left: 91.66667%;
}
.\-10u\28desktop\29 {
	margin-left: 83.33333%;
}
.\-9u\28desktop\29 {
	margin-left: 75%;
}
.\-8u\28desktop\29 {
	margin-left: 66.66667%;
}
.\-7u\28desktop\29 {
	margin-left: 58.33333%;
}
.\-6u\28desktop\29 {
	margin-left: 50%;
}
.\-5u\28desktop\29 {
	margin-left: 41.66667%;
}
.\-4u\28desktop\29 {
	margin-left: 33.33333%;
}
.\-3u\28desktop\29 {
	margin-left: 25%;
}
.\-2u\28desktop\29 {
	margin-left: 16.66667%;
}
.\-1u\28desktop\29 {
	margin-left: 8.33333%;
}
}
 @media screen and (min-width: 737px) and (max-width: 1200px) {
.row > * {
	padding: 20px 0 0 35px;
}
#footer-detailed .lastrow {
	padding: 20px 35px 0 50px;
}
.row {
	margin: -35px 35px -1px 0;
}
.row.uniform > * {
	padding: 35px 0 0 35px;
}
.row.uniform {
	margin: -35px 0 -1px -35px;
}
 .row.\32 00\25 > * {
 padding: 70px 0 0 70px;
}
 .row.\32 00\25 {
 margin: -70px 0 -1px -70px;
}
.row.uniform.\32 00\25 > * {
 padding: 70px 0 0 70px;
}
.row.uniform.\32 00\25 {
 margin: -70px 0 -1px -70px;
}
 .row.\31 50\25 > * {
 padding: 52.5px 0 0 52.5px;
}
 .row.\31 50\25 {
 margin: -52.5px 0 -1px -52.5px;
}
.row.uniform.\31 50\25 > * {
 padding: 52.5px 0 0 52.5px;
}
.row.uniform.\31 50\25 {
 margin: -52.5px 0 -1px -52.5px;
}
 .row.\35 0\25 > * {
 padding: 17.5px 0 0 17.5px;
}
 .row.\35 0\25 {
 margin: -17.5px 0 -1px -17.5px;
}
.row.uniform.\35 0\25 > * {
 padding: 17.5px 0 0 17.5px;
}
.row.uniform.\35 0\25 {
 margin: -17.5px 0 -1px -17.5px;
}
 .row.\32 5\25 > * {
 padding: 8.75px 0 0 8.75px;
}
 .row.\32 5\25 {
 margin: -8.75px 0 -1px -8.75px;
}
.row.uniform.\32 5\25 > * {
 padding: 8.75px 0 0 8.75px;
}
.row.uniform.\32 5\25 {
 margin: -8.75px 0 -1px -8.75px;
}
 .\31 2u\28tablet\29, .\31 2u\24\28tablet\29 {
 width: 100%;
 clear: none;
 margin-left: 0;
}
 .\31 1u\28tablet\29, .\31 1u\24\28tablet\29 {
 width: 91.6666666667%;
 clear: none;
 margin-left: 0;
}
 .\31 0u\28tablet\29, .\31 0u\24\28tablet\29 {
 width: 83.3333333333%;
 clear: none;
 margin-left: 0;
}
.\39 u\28tablet\29, .\39 u\24\28tablet\29 {
	width: 75%;
	clear: none;
	margin-left: 0;
}
.\38 u\28tablet\29, .\38 u\24\28tablet\29 {
	width: 66.6666666667%;
	clear: none;
	margin-left: 0;
}
.\37 u\28tablet\29, .\37 u\24\28tablet\29 {
	width: 58.3333333333%;
	clear: none;
	margin-left: 0;
}
.\36 u\28tablet\29, .\36 u\24\28tablet\29 {
	width: 50%;
	clear: none;
	margin-left: 0;
}
.\35 u\28tablet\29, .\35 u\24\28tablet\29 {
	width: 41.6666666667%;
	clear: none;
	margin-left: 0;
}
.\34 u\28tablet\29, .\34 u\24\28tablet\29 {
	width: 33.3333333333%;
	clear: none;
	margin-left: 0;
}
.\33 u\28tablet\29, .\33 u\24\28tablet\29 {
	width: 25%;
	clear: none;
	margin-left: 0;
}
.\32 u\28tablet\29, .\32 u\24\28tablet\29 {
	width: 16.6666666667%;
	clear: none;
	margin-left: 0;
}
.\31 u\28tablet\29, .\31 u\24\28tablet\29 {
	width: 8.3333333333%;
	clear: none;
	margin-left: 0;
}
 .\31 2u\24\28tablet\29 + *, .\31 1u\24\28tablet\29 + *, .\31 0u\24\28tablet\29 + *, .\39 u\24\28tablet\29 + *, .\38 u\24\28tablet\29 + *, .\37 u\24\28tablet\29 + *, .\36 u\24\28tablet\29 + *, .\35 u\24\28tablet\29 + *, .\34 u\24\28tablet\29 + *, .\33 u\24\28tablet\29 + *, .\32 u\24\28tablet\29 + *, .\31 u\24\28tablet\29 + * {
 clear: left;
}
.\-11u\28tablet\29 {
	margin-left: 91.66667%;
}
.\-10u\28tablet\29 {
	margin-left: 83.33333%;
}
.\-9u\28tablet\29 {
	margin-left: 75%;
}
.\-8u\28tablet\29 {
	margin-left: 66.66667%;
}
.\-7u\28tablet\29 {
	margin-left: 58.33333%;
}
.\-6u\28tablet\29 {
	margin-left: 50%;
}
.\-5u\28tablet\29 {
	margin-left: 41.66667%;
}
.\-4u\28tablet\29 {
	margin-left: 33.33333%;
}
.\-3u\28tablet\29 {
	margin-left: 25%;
}
.\-2u\28tablet\29 {
	margin-left: 16.66667%;
}
.\-1u\28tablet\29 {
	margin-left: 8.33333%;
}
}

@media screen and (max-width: 736px) {
.row > * {
	padding: 10px 0 0 10px;
}
.row {
	margin: -10px 0 -1px -10px;
}
.row.uniform > * {
	padding: 10px 0 0 10px;
}
.row.uniform {
	margin: -10px 0 -1px -10px;
}
.row.\32 00\25 > * {
 padding: 20px 0 0 20px;
}
 .row.\32 00\25 {
 margin: -20px 0 -1px -20px;
}
.row.uniform.\32 00\25 > * {
 padding: 20px 0 0 20px;
}
.row.uniform.\32 00\25 {
 margin: -20px 0 -1px -20px;
}
.row.\31 50\25 > * {
 padding: 15px 0 0 15px;
}
.row.\31 50\25 {
 margin: -15px 0 -1px -15px;
}
.row.uniform.\31 50\25 > * {
 padding: 15px 0 0 15px;
}
.row.uniform.\31 50\25 {
 margin: -15px 0 -1px -15px;
}
 .row.\35 0\25 > * {
 padding: 5px 0 0 5px;
}
 .row.\35 0\25 {
 margin: -5px 0 -1px -5px;
}
.row.uniform.\35 0\25 > * {
 padding: 5px 0 0 5px;
}
.row.uniform.\35 0\25 {
 margin: -5px 0 -1px -5px;
}
 .row.\32 5\25 > * {
 padding: 2.5px 0 0 2.5px;
}
 .row.\32 5\25 {
 margin: -2.5px 0 -1px -2.5px;
}
.row.uniform.\32 5\25 > * {
 padding: 2.5px 0 0 2.5px;
}
.row.uniform.\32 5\25 {
 margin: -2.5px 0 -1px -2.5px;
}
 .\31 2u\28mobile\29, .\31 2u\24\28mobile\29 {
 width: 100%;
 clear: none;
 margin-left: 0;
}
 .\31 1u\28mobile\29, .\31 1u\24\28mobile\29 {
 width: 91.6666666667%;
 clear: none;
 margin-left: 0;
}
 .\31 0u\28mobile\29, .\31 0u\24\28mobile\29 {
 width: 83.3333333333%;
 clear: none;
 margin-left: 0;
}
.\39 u\28mobile\29, .\39 u\24\28mobile\29 {
	width: 75%;
	clear: none;
	margin-left: 0;
}
.\38 u\28mobile\29, .\38 u\24\28mobile\29 {
	width: 66.6666666667%;
	clear: none;
	margin-left: 0;
}
.\37 u\28mobile\29, .\37 u\24\28mobile\29 {
	width: 58.3333333333%;
	clear: none;
	margin-left: 0;
}
.\36 u\28mobile\29, .\36 u\24\28mobile\29 {
	width: 50%;
	clear: none;
	margin-left: 0;
}
.\35 u\28mobile\29, .\35 u\24\28mobile\29 {
	width: 41.6666666667%;
	clear: none;
	margin-left: 0;
}
.\34 u\28mobile\29, .\34 u\24\28mobile\29 {
	width: 33.3333333333%;
	clear: none;
	margin-left: 0;
}
.\33 u\28mobile\29, .\33 u\24\28mobile\29 {
	width: 25%;
	clear: none;
	margin-left: 0;
}
.\32 u\28mobile\29, .\32 u\24\28mobile\29 {
	width: 16.6666666667%;
	clear: none;
	margin-left: 0;
}
.\31 u\28mobile\29, .\31 u\24\28mobile\29 {
	width: 8.3333333333%;
	clear: none;
	margin-left: 0;
}
.\31 2u\24\28mobile\29 + *, .\31 1u\24\28mobile\29 + *, .\31 0u\24\28mobile\29 + *, .\39 u\24\28mobile\29 + *, .\38 u\24\28mobile\29 + *, .\37 u\24\28mobile\29 + *, .\36 u\24\28mobile\29 + *, .\35 u\24\28mobile\29 + *, .\34 u\24\28mobile\29 + *, .\33 u\24\28mobile\29 + *, .\32 u\24\28mobile\29 + *, .\31 u\24\28mobile\29 + * {
	clear: left;
}
.\-11u\28mobile\29 {
	margin-left: 91.66667%;
}
.\-10u\28mobile\29 {
	margin-left: 83.33333%;
}
.\-9u\28mobile\29 {
	margin-left: 75%;
}
.\-8u\28mobile\29 {
	margin-left: 66.66667%;
}
.\-7u\28mobile\29 {
	margin-left: 58.33333%;
}
.\-6u\28mobile\29 {
	margin-left: 50%;
}
.\-5u\28mobile\29 {
	margin-left: 41.66667%;
}
.\-4u\28mobile\29 {
	margin-left: 33.33333%;
}
.\-3u\28mobile\29 {
	margin-left: 25%;
}
.\-2u\28mobile\29 {
	margin-left: 16.66667%;
}
.\-1u\28mobile\29 {
	margin-left: 8.33333%;
}
}

/************** BASIC STYLES **************/
@-ms-viewport {
	width: device-width;
}
body {
	background: #303238 url("/incl/specialty/assets/css/images/bg01.png");
	font-family: 'Open Sans', arial, helvetica, sans-serif;
	color: #585858; /* validates triple-A; originally #7b818c */
	font-weight: 400;
}
body.is-loading * {
	-moz-transition: none !important;
	-webkit-transition: none !important;
	-ms-transition: none !important;
	transition: none !important;
	-moz-animation: none !important;
	-webkit-animation: none !important;
	-ms-animation: none !important;
	animation: none !important;
}
input, select, textarea {
	font-family: 'Open Sans', arial, helvetica, sans-serif; /added aditional fall-backs */
	color: #585858 /* validates triple-A; #7b818c */
	font-weight: 400;
}
a {
	color: #2063ba; /* originally inherit */
	text-decoration: underline;
}
a:hover, a:focus { /* added focus */
	text-decoration: none;
}
h1, h2, h3, h4, h5, h6 {
	text-transform: uppercase;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: #404248;
	margin: 0 0 1em 0;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
	color: inherit;
	text-decoration: none;
}
h2 {
	font-size: 2em;
	line-height: 1.3em;
}
/*h2.icon {
	line-height: 48px;
}*/
h2.icon:before, h3.icon:before { /* added h3 */
	position: relative;
	top: 0.05em;
	margin-right: 0.5em;
	opacity: 0.5; /* 0.25 */
}
h3, h4, h5, h6 {
	margin-top: 2em;
}
h3 { 
	font-size: 1.35em;
}
h4 { /* specified h4, h5 and h6 fallback to the reset value - 100% of standard */
	font-size: 1.10em;
}
#main-wrapper h2:first-child, #main-wrapper h3:first-child, #main-wrapper h4:first-child, #main-wrapper h5:first-child, #main-wrapper h6:first-child { /* added for first headings in columns */
	margin-top: 0;
}
b, strong {
	/* color: #404248; */
	font-weight: 700;
}
i, em {
	font-style: italic;
}
br.clear {
	clear: both;
}
sub {
	position: relative;
	top: 0.5em;
	font-size: 0.8em;
}
sup {
	position: relative;
	top: -0.5em;
	font-size: 0.8em;
}
hr {
	border: 0;
	border-top: solid 1px #ddd;
}
blockquote {
	/* border-left: solid 0.5em #ddd; */
	margin: 1em 0 1em 2em;
	/* font-style: italic; */
}
p, ul, ol, dl, table {
	margin-bottom: 2em;
}

/* use this to make a simple, two column layout inside another row */
div.row.twocol {
	margin-right: 0;
}
div.row.twocol div {
	padding-left: 0;
}
div.row.twocol div:first-child {
	padding-right: .5em;
}
div.row.twocol div:nth-child(2) {
	padding-left: .5em;
}

/************** SECTION, ARTICLE, HEADER, and FOOTER **************/
section, article {
	margin-bottom: 5em;
}
section > :last-child, article > :last-child, section:last-child, article:last-child {
	margin-bottom: 0;
}
header {
	margin: 0 0 2em 0;
}
header h2, header h3 {
	margin: 0 0 0.25em 0;
}
header p {
	display: block;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 0.065em;
	font-size: 0.95em; /* 0.9em */
	color: #585858; /* #696969; */
	margin: 0;
}
header p strong {
	color: #404248;
	font-weight: 800;
}
header.major { /* these make the double borders under the 'major' headlines */
	border-bottom: solid 1px #dbdbdb;
	margin: 0 0 2.5em 0;
}
header.major:after {
	content: '';
	display: block;
	border-top: solid 1px #dbdbdb;
	height: 8px;
}
header.major h2, header.major h3 { /* customized this to allow super-or subheadings */
	margin: 0 0 1.2em 0;
}
header.major > p {
	margin: 0;
	position: relative;
	top: -1em;
}
header.major h2 + p  {
	top: -1.6em;
}
footer {
	margin: 2.0em 0 0 0;
}
.footer-logo {
	max-width: 120px;
}
.image.footer-logo.black, .image.footer-logo.pei, .tare-logo, .image.footer-logo.tare {
	display:none;
}

/************** FORMS **************/
form label {
	display: block;
	text-transform: uppercase;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: #404248;
	margin: 0 0 1em 0;
	font-size: 0.8em;
}
form input[type="text"], form input[type="email"], form input[type="password"], form select, form textarea {
	-webkit-appearance: none;
	display: block;
	width: 100%;
	border-radius: 8px;
	border: solid 1px #eee;
}
form input[type="text"]:focus, form input[type="email"]:focus, form input[type="password"]:focus, form select:focus, form textarea:focus {
	box-shadow: 0 0 2px 1px #4091bf;
}
form input[type="text"], form input[type="email"], form input[type="password"] {
	line-height: 3em;
	padding: 0 1em;
}
/* form select {
	line-height: 3em;
	padding: 0 1em;
} */
form textarea {
	min-height: 9em;
	padding: 1em;
}
form .formerize-placeholder, form ::-webkit-input-placeholder, form :-moz-placeholder, form ::-moz-placeholder, form :-ms-input-placeholder {
	color: #555 !important;
}
form ::-moz-focus-inner {
	border: 0;
}

/* SELECT ARROW / ADDED TO STYLE SHEET BY DFPS */ 
form select {
 	/* basic */
	display: inline-block;
	font: inherit;
	border: 1px solid #bbb; 
	line-height: 1.5em;
	padding: 0.5em 3.5em 0.5em 1em;
	background-color: #fff;
		/* reset */
	margin: 0;      
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-appearance: none;
	-moz-appearance: none;
	/* arrow */
	background-image:
       linear-gradient(45deg, transparent 50%, gray 50%),
       linear-gradient(135deg, gray 50%, transparent 50%),
       linear-gradient(to right, #bbb, #bbb);
	background-position:
	   calc(100% - 30px) calc(1em + 1px),
       calc(100% - 20px) calc(1em + 1px),
       calc(100% - 3.5em) 0.25em;
	background-size:
       10px 10px,
	   10px 10px, 
	   1px 2em;
	background-repeat: no-repeat;
}
form select:focus {
  background-image:
    linear-gradient(45deg, grey 50%, transparent 50%),
    linear-gradient(135deg, transparent 50%, grey 50%),
    linear-gradient(to right, #bbb, #bbb);
  background-position:
	calc(100% - 20px) 1em,
	calc(100% - 30px) 1em, 
	calc(100% - 3.5em) 0.25em;
  background-size:
    10px 10px,
    10px 10px,
    1px 2em;
  background-repeat: no-repeat;
}
select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

/************** TABLES **************/
table {
	width: 100%;
}
/* I substituted "datatable" for "default"... */
table.datatable tr {
	border-top: solid 1px #dbdbdb;
}
table.datatable tr:first-child {
	border-top: 0;
}
table.datatable td {
	padding: 0.5em 1em 0.5em 1em;
}
table.datatable th {
	text-align: left;
	padding: 0.5em 1em 0.5em 1em;
	text-transform: uppercase;
	font-weight: 800;
	letter-spacing: 0.04em;
	margin: 0 0 1em 0;
	font-size: 0.8em;
}

/* slightly stylized version of above for simple, two-column tables such as conference schedules */
table.datatable.twocol {
	width: auto;
	margin-right:auto;
	margin-left:auto;
}
table.datatable.twocol td {
	padding: 1em;
}
table.datatable.twocol td:first-of-type {
	text-align: right;
	font-weight: bold;
	white-space:nowrap;
}
table.datatable.twocol th {
	display: inline;
	position: absolute;
	left: -10000px;
}
table.datatable.twocol tr:nth-child(2) {
	border-top: none;
}

/************** IMAGES **************/
.image {
	position: relative;
	display: inline-block;
}
.image img {
	display: block;
	width: 100%;
	border-radius: 8px;
}
.image:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	background: url("/incl/specialty/assets/css/images/bg02.png"); /* I substituted the lighter bg02 for bg01 */
	width: 100%;
	height: 100%;
	opacity: 0.75;
}
.image.fit {
	display: block;
	width: 100%;
}
.image.featured {
	display: block;
	width: 100%;
	margin: 0 0 2.5em 0;
}
.image.left {
	float: left;
	margin: 0 2em 2em 0;
}
.image.centered {
	display: block;
	margin: 0 0 2.5em 0;
}
.image.centered img {
	margin: 0 auto;
	width: auto;
}
.image.middle { /* behaves similar to deprecated align=absmiddle */
	vertical-align: middle;
	margin: 0 5px .25em 5px;
}
.image.plain img {
	border-radius: 0;
}
.image.plain:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	background: none;
	width: 100%;
	height: 100%;
	opacity: 0.75;
}
/* easy container for images and videos */
/* the mobile class retains its float with 50% max-width in mobile - good for small and/or narrow images */
.rightbox, .rightbox-mobile, .leftbox, .leftbox-mobile {
    max-width: 50%;
	text-align: center;
}
.rightbox, .rightbox-mobile {
	float: right;
    margin: 0 0 1em 2em;
}
.leftbox, .leftbox-mobile {
	float: left;
    margin: 0 2em 1em 0;
}


/************** BUTTONS **************/

input[type="button"], input[type="submit"], input[type="reset"], button, .button {
	background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)), url("/incl/specialty/assets/css/images/bg02.png");
	-moz-transition: background-color 0.2s ease-in-out;
	-webkit-transition: background-color 0.2s ease-in-out;
	-ms-transition: background-color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out;
	-webkit-appearance: none;
	position: relative;
	display: inline-block;
	background-color: #2063ba; /* #4091bf */
	border-radius: 8px;
	box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.35), inset 0px 2px 1px 0px rgba(255, 255, 255, 0.35);
	text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
	color: #fff !important;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 0.95em;
	letter-spacing: 0.075em;
	padding: 1em 2em;
	border: 0;
	white-space: nowrap;
	cursor: pointer;
}
input[type="button"].icon:before, input[type="submit"].icon:before, input[type="reset"].icon:before, button.icon:before, .button.icon:before {
	opacity: 0.5;
	margin-right: 0.5em;
	position: relative;
	top: 0.05em;
}
input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover, button:hover, .button:hover {
	background-color: #3273c7; /* #50a1cf */
}
input[type="button"]:active, input[type="submit"]:active, input[type="reset"]:active, button:active, .button:active {
	background-color: #1053a9; /* #3081af */
}
input[type="button"].medium, input[type="submit"].medium, input[type="reset"].medium, button.medium, .button.medium {
	font-size: 1.25em;
	padding: 1em 2.25em;
}
input[type="button"].big, input[type="submit"].big, input[type="reset"].big, button.big, .button.big {
	font-size: 1.5em;
	padding: 1em 2.25em;
}
input[type="button"].alt1, input[type="submit"].alt1, input[type="reset"].alt1, button.alt, .button.alt1 {
	background-color: #464a52;
}
input[type="button"].alt1:hover, input[type="submit"].alt1:hover, input[type="reset"].alt1:hover, button.alt1:hover, .button.alt1:hover {
	background-color: #565a62;
}
input[type="button"].alt1:active, input[type="submit"].alt1:active, input[type="reset"].alt1:active, button.alt1:active, .button.alt1:active {
	background-color: #363a42;
}
/* added additional button types */
input[type="button"].alt2, input[type="submit"].alt2, input[type="reset"].alt2, button.alt2, .button.alt2 {
	background-color: #ebc661;
	color: #404248 !important;
	text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.1);
}
input[type="button"].alt2:hover, input[type="submit"].alt2:hover, input[type="reset"].alt2:hover, button.alt2:hover, .button.alt2:hover {
	background-color: #f4cf6b;
}
input[type="button"].alt2:active, input[type="submit"].alt2:active, input[type="reset"].alt2:active, button.alt2:active, .button.alt2:active {
	background-color: #e3bd56;
}
input[type="button"].alt3, input[type="submit"].alt3, input[type="reset"].alt3, button.alt3, .button.alt3 {
	background-color: #c61717;
}
input[type="button"].alt3:hover, input[type="submit"].alt3:hover, input[type="reset"].alt3:hover, button.alt3:hover, .button.alt3:hover {
	background-color: #d41111;
}
input[type="button"].alt3:active, input[type="submit"].alt3:active, input[type="reset"].alt3:active, button.alt3:active, .button.alt3:active {
	background-color: #bf2828;
}

/************** LISTS **************/

/* basic list styles have been added, and several pointless classes have been removed... */
#main-wrapper ol {
	list-style: decimal;
}
#main-wrapper ul {
	list-style: disc;
}
#main-wrapper ol ol {
	list-style: lower-alpha;
	margin-bottom: 1em;
}
#main-wrapper ul ul {
	list-style: circle;
	margin-bottom: 0;
}
#main-wrapper li, #main-wrapper dt, #main-wrapper dd {
	margin-bottom: 5px;
}
ul.divided li { /* link lists in footer */
	border-top: solid 1px #eee;
	padding: 0.5em 0 0 0;
	margin: 0.5em 0 0 0;
}
ul.divided li:first-child {
	border-top: 0 !important;
	padding-top: 0 !important;
	margin-top: 0 !important;
}
ul.menu li {  /* bottom line of footer */
	border-left: solid 1px #eee;
	display: inline-block;
	padding: 0 0 0 1em;
	margin: 0 0 0 1em;
}
ul.menu li:first-child {
	border-left: 0;
	margin-left: 0;
	padding-left: 0;
}
dt {
	font-weight: bold;
	text-transform: uppercase;
	color: #404248;
}
dt a {
	text-decoration: none;
}
dt a:hover {
	text-decoration: underline;
}
dd {
	margin-left: 2em;
}
dl.contact dt {  /* used in footer */
	display: block;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 0.065em;
	font-size: 0.9em;
	color: #696969;
	float: left;
	width: 8em;
}
dl.contact dd { 
	margin: 0 0 1em 8em;
}

/************** BOX CLASS **************/
/* this class and its subordinate class, feature, is how most styling is applied to page content... */
/* using them is necessary, and it's a lot of work - but it's a good design... that's why I chose it... */

.box.excerpt {
	position: relative;
	overflow: hidden;
}
.box.excerpt header {
	margin: 0 0 1em 0;
}
.box.excerpt .image, .box.excerpt p {
	margin-bottom: 0;
}
.box.feature1 {
	text-align: center;
}
.box.feature1 header.first h2 {
	font-size: 2.5em;
}
.box.feature1 header.first p {
	font-size: 1.2em;
}
.box.feature1 header.second {
	position: relative;
	display: inline-block;
	text-align: left;
	margin: 0 auto;
	left: 24px;
}
.box.feature1 header.second p {
	line-height: 1.3em;
}
.box.feature1 header.second:before {
	font-size: 48px;
	position: absolute;
	right: 100%;
	margin-right: 18px;
	opacity: 0.5;
	/* bottom: -4px; */
}
.box.feature2 {
	text-align: center;
}
.box.article-list article {
	border-bottom: solid 1px #dbdbdb;
	margin: 0 0 2.75em 0;
	padding: 0 0 2.75em 0;
}
.box.article-list article:last-child {
	border-bottom: 0;
	margin-bottom: 0;
	padding-bottom: 0;
}
.date {
	display: block;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 0.065em;
	font-size: 0.9em;
	color: #696969;
	margin: 0 0 0.25em 0;
}

/************** ICONS **************/

.icon {
	text-decoration: none;
}
.icon:before {
	display: inline-block;
	font-family: FontAwesome;
	font-size: 1.25em;
	text-decoration: none;
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.icon > .label {
	display: none;
}

/************** BANNER **************/

#banner {
	text-align: center;
}
#banner h2 { /* I removed the borders, added a background, and tweaked a number of things */
	color: #fff;
	color: rgba(255, 255, 255, 0.85); /* 0.75 */	
	font-size: 4em; /* 2.35em */
	font-weight: 700;
	line-height: 1.3em;
	margin: 0.5em auto 2.5em auto;
	background-color: #000;
	background-color: rgba(0, 0, 0, 0.50);
	padding: 25px;
	display: inline-block;
}
#banner h2 strong {
	font-weight: 800;
	color: inherit;
}
#banner p { /* I added background and tweaked several things */
	text-transform: uppercase;
	color: #000;
	color: rgba(0, 0, 0, 0.85);
	font-size: 2em;
	font-weight: 700;
	line-height: 1.3em;
	letter-spacing: 0.04em;
	background-color: #000;
	background-color: rgba(255, 255, 255, 0.65);
	padding: 15px;
	display: inline-block;
}

/************** WRAPPERS **************/
/****** header, main, and footer ******/

#header-wrapper, .splash-wrapper {
	background: url("/incl/specialty/assets/css/images/bg01.png") , url("/incl/specialty/images/aquarium.jpg");
	background-position: top left, center center;
	background-size: auto, cover;
}
#main-wrapper {
	background: #fff;
}
#footer-wrapper {
	background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("/incl/specialty/assets/css/images/bg03.png"), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("/incl/specialty/assets/css/images/bg03.png"), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("/incl/specialty/assets/css/images/bg03.png"), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)), url("/incl/specialty/assets/css/images/bg03.png"), url("/incl/specialty/assets/css/images/bg02.png");
	position: relative;
	background-repeat: repeat-x, no-repeat, repeat;
	background-size: 100% 100%, 100% 15em, auto auto;
	background-position: top left, top center, top left;
}
.wrapper > .inner {
	position: relative;
	z-index: 2;
}
.wrapper { /* I removed the darkest and lightest wrapper background styles */
	position: relative;
	text-shadow: 1px 1px 0 #fff;
	background-color: #fff;
}
.wrapper:first-of-type { 
	background-image: url("/incl/specialty/assets/css/images/bg03.png") , url("/incl/specialty/assets/css/images/bg02.png") ;/* top and middle images */
	background-repeat: no-repeat, repeat;
	background-size: 100% 15em, auto auto;
	background-position: top center, top left;
}
.wrapper:last-of-type { 
	background-image: url("/incl/specialty/assets/css/images/bg02.png"), url("/incl/specialty/assets/css/images/bg04.png"); /* middle and bottom images */
	background-repeat: repeat, no-repeat;
	background-size: auto auto, 100% 15em;
	background-position: top left, bottom center;
}
.wrapper:only-of-type { /* I removed the darkest and lightest wrapper background styles */
	background-image: url("/incl/specialty/assets/css/images/bg03.png") , url("/incl/specialty/assets/css/images/bg04.png") , url("/incl/specialty/assets/css/images/bg02.png"); /* top, bottom, and texture images */
	background-repeat: no-repeat, no-repeat, repeat;
	background-size: 100% 15em, 100% 15em, auto auto;
	background-position: top center, bottom center, top left;
}

/* Header */
#header {
	margin-bottom: 0;
}
.page-title-logo .row {
	display: flex;
	align-items: center;
}
.page-title-logo .image:before {
	 background: none;
}
.page-title-logo p a, .page-title-logo h2 a {
	color: inherit;
	text-decoration: none;
}

/* Footer */
#footer {
	margin-bottom: 0;
	text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
	position: relative;
	z-index: 2;
}
#footer strong {
	color: #fff;
}
#footer, #footer a {
	color: #acb2bf;
}
#footer h2, #footer h2 a {
	color: whitesmoke;
}
#footer h2 {
	font-size: 1.35em;
}
#footer .button.alt {
	box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 1px 0px rgba(255, 255, 255, 0.25);
}
#footer ul.divided li, #footer ul.menu li {
	border-color: #444;
	border-color: rgba(255, 255, 255, 0.075);
}
#footer ul.divided li a {
	text-decoration: none;
}
#footer ul.menu {
	margin: 0;
}
#footer dl.contact dt {
	color: #ddd;
}
#footer-detailed {
	padding-bottom: 2em;
	margin-bottom: 3em;
	margin-left: 0;
	border-bottom: solid 1px;
    border-color: rgba(255, 255, 255, 0.075);
}
#footer-detailed {
     margin-top: -30px;
}
#footer-simple {
	text-align: center;
	margin-left: 0;
	padding: 0;
	color: inherit;
	display: table;
	width: 100%;
}
#footer-simple .\32 u  {
	text-align: right;
}
#footer-simple .\31 0u {
    padding: 60px 15px 0;
}
#footer-simple .\39 u {
	display: table-cell;
	vertical-align: middle;
}
#footer-simple a, #footer .contact a { /* I tweaked the link styles for accessibilty */
	color: inherit;
	text-decoration: none;
}
#footer a:hover, #footer-simple a:hover, #footer .contact a:hover, #footer ul.divided li a:hover, #footer ul.menu a:hover  {
	color: #f3f3f3;;
	text-decoration: underline;
}
#footer .lastrow p:first-of-type a:hover {	
	text-decoration: none;
}

/************** MEDIA QUERY: DESKTOP & TABLET **************/

@media screen and (min-width: 737px) {

/* Basic */
body, input, select, textarea {
	font-size: 11pt;
	line-height: 1.85em;
}

/* Sidebar */
#sidebar h2 {
	font-size: 1.5em;
}

/* Wrappers */
#header-wrapper, .splash-wrapper {
	padding: 2em 0 0 0;
	height: 9em;
}
.wrapper {
	padding: 5em 0;
	min-height: 500px; /* hack for very short pages */
}
.wrapper + .wrapper {
	padding: 0 0 5em;
}

#footer-wrapper {
	padding: 1em 0 1em 0;
}

/* Header */
#header { /* I reworked this to be a "sticky" menu - many changes made from here on out... */
	position: fixed;
	top: 0;
	right: 0;
	width: 90%;
	margin: 1em 5% 2em;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.1);
	padding: 0.75em;
	z-index: 50;
}
#header .inner {
	position: relative;
	height: 5.5em;
	border-radius: 8px;
}
#header .inner {
	background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg02.png");
	background-color: #3B3E45;
	background-color: rgba(59, 62, 69, 0.9);
	box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.45), inset 0px 2px 1px 0px rgba(255, 255, 255, 0.15);
	text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
}
#header h1 {
	position: absolute;
	left: 1.75em;
	top: 50%;
	margin-top: -0.65em;
	font-size: 1.5em;
	color: #fff;
}

/* Nav */
#nav {
	position: absolute;
	right: 2em;
	top: 0;
	line-height: 5.5em;
}
#nav > ul > li {
	float: left;
	padding: 0 0.3em 0 0.3em;
}
#nav > ul > li > a, #nav > ul > li > span {
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 0.95em;
	letter-spacing: 0.075em;
	padding: 0.4em;
	border-radius: 6px;
}
#nav > ul > li.active > a, #nav > ul > li.current_page_item > a, #nav > ul > li.active > span, #nav > ul > li.current_page_item > span {
	background: rgba(0, 0, 0, 0.15);
	box-shadow: inset 1px 1px 0px 0px rgba(0, 0, 0, 0.025), 1px 1px 0px 0px rgba(255, 255, 255, 0.025);
}
#nav > ul > li:last-child {
	padding-right: 0;
}
#nav > ul > li > ul {
	display: none;
}
#nav > ul > li.nav-social {
	padding:0;
}
#nav > ul > li.nav-social > a {
	padding: 5px;
	font-size: 1.5em;
}
.mobile-only {
	display: none;
}
.mobile-not {
	display: block;
}
.dropotron {
	background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0)), url("/incl/specialty/assets/css/images/bg02.png");
	position: relative;
	background-color: #3B3E45;
	background-color: rgba(59, 62, 69, 0.9);
	border-radius: 8px;
	box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.5), inset 0px 0px 0px 2px rgba(255, 255, 255, 0.075), inset 0px 2px 1px 0px rgba(255, 255, 255, 0.2), 0px 2px 14px 0px rgba(0, 0, 0, 0.4);
	text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5);
	padding: 1.5em;
	line-height: 2.5em;
	min-width: 15em;
}
.dropotron.level-0 {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	margin-top: -2px;
	box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.5), inset 0px 0px 0px 2px rgba(255, 255, 255, 0.075), 0px 2px 14px 0px rgba(0, 0, 0, 0.4);
}
.dropotron a, .dropotron span {
	color: #ACB2BF; /* #AAA */
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 0.8em;
	letter-spacing: 0.075em;
}
.dropotron li:hover > a, .dropotron li:hover > span {
	color: #fff;
}

/* Banner */
#banner {
	width: 940px;
	margin: 0 auto;
	overflow: hidden;
	padding: 9em 0 6em 0;
}
#banner p {
	text-align: center;
	line-height: 1.5em;
	margin: 0;
}
.box.feature1 .button {
	width: 90%;
}
#main-wrapper ol, #main-wrapper ul {
	margin-left: 40px;
}

/* FIXED HEADER */
/* I added this as a simpler, more utilitarian header */
/* somewhat confusingly, I needed both an outer class "fixed" AND an inner id "header-fixed" to overwrite the base styles... */
/* this is a dark slate gray that matches the footer - import other top menu style sheets to override the colors */
#header-wrapper.fixed, #header-wrapper.fixed .dropotron {
	background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url(/incl/specialty/assets/css/images/bg02.png);
   	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url(/incl/specialty/assets/css/images/bg02.png);
   	background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url(/incl/specialty/assets/css/images/bg02.png);
   	background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url(/incl/specialty/assets/css/images/bg02.png);
   	background-color: #3B3E45; /* hex code fallback */
   	background-color: rgba(59, 62, 69, 0.9);
	box-shadow: 0 0.3em 0.5em rgba(0, 0, 0, 0.2);
	text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.2);
}
#header-wrapper.fixed {
    position: fixed;
    z-index: 10000;
    left: 0;
    top: 0;
    width: 100%;
	padding: 0.5em 1em 0.3em;
    height: auto;
	border-radius: 0; 
}
header#header-fixed {
	max-width: 1200px;
	margin: 0 auto;
}
header#header-fixed #logo {
	float: left;
}
header#header-fixed h1 {
	margin-bottom: 0;
}
header#header-fixed #nav {
	position: static;
	float: right;
	line-height: inherit;
}
#header-wrapper.fixed + div#main-wrapper > .wrapper { /* add space to top of content to offset header */
	padding-top: 7em
}

header#header-fixed #nav > ul > li > a, header#header-fixed #nav > ul > li > span, header#header-fixed h1 {
    color: #404248;
}
header#header-fixed .dropotron {
	padding: 1.5em;
	line-height: 2.5em;
	min-width: 15em;
	border-radius: 5px;
}
header#header-fixed .dropotron.level-0, header#header-fixed .dropotron.level-1 {
	box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.1), 0.2em 0.2em 0.5em rgba(0, 0, 0, 0.2);
}
header#header-fixed .dropotron.level-0 {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	margin-top: 8px;
}
header#header-fixed .dropotron a, .dropotron span {
	color: #DBDCDD; /* WHITE color: #737375; */
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 0.8em;
	letter-spacing: 0.075em;
}
header#header-fixed .dropotron li:hover > a, .dropotron li:hover > span {
	color: #404248;
}
header#header-fixed #nav > ul > li > a, header#header-fixed #nav > ul > li > .dropotron a:hover, header#header-fixed #nav > ul > li > span, header#header-fixed h1 {
    	color: whitesmoke;
	}
.page-title-logo {
	margin-left: 15%;
	margin-right: 15%;
}
section.page-title-logo {
	margin-bottom: 3em;
}
}

/************** MEDIA QUERIES: ACCOMODATIONS FOR LARGE BROWSERS **************/
/* These were added new to accomodate the more flexible, fixed nav bar and its components... */
/* ...so that the logo and nav menu would stay together but not run into one another as the browser expanded */
/* These will probably have to be tweaked with every new design.... */
@media screen and (min-width: 1200px) {
	#header-wrapper.splash, .splash-wrapper  {
		height: 40em;
	}
	#footer-simple .\31 0u {
    	padding-top: 70px;
	}
	.page-title-logo {
		margin-left: 20%;
		margin-right: 20%;
	}
}
@media screen and (min-width: 1400px) {
	#header {
		width: 80%;
		margin-left: 10%;
		margin-right: 10%;
}
}
@media screen and (min-width: 1600px) {
	#header {
		width: 70%;
		margin-left: 15%;
		margin-right: 15%;
}
}
@media screen and (min-width: 1900px) {
	#header {
		width: 60%;
		margin-left: 20%;
		margin-right: 20%;
}
}
@media screen and (min-width: 2200px) {
	#header {
		width: 50%;
		margin-left: 25%;
		margin-right: 25%;
}
}

/************** MEDIA QUERY: TABLET ONLY **************/

@media screen and (min-width: 737px) and (max-width: 1200px) {

/* Basic */
body {
	/* min-width: 1000px; !!! I removed this, seems illogical and was causing horizontal scroll bars... what was he thinking??? */
	line-height: 1.75em;
	font-size: 10.75pt;
}
.container {
	width: auto !important; /*  */
}
input, select, textarea {
	line-height: 1.75em;
	font-size: 10.75pt;
}

/* Wrappers */
#header-wrapper.splash, .splash-wrapper  {
	height: 36em;
}
#header-wrapper.fixed {
	padding-left: 1em;
	padding-right: 1em;
}
#footer-wrapper {
	padding: 1em 0;
}
.wrapper {
	padding: 4em 0;
}
.wrapper + .wrapper {
	padding: 0 0 4em;
}

/* Banner */
#banner {
	width: 940px;
	padding: 8.5em 0 0 0;
}
#header {
	min-width: 750px;
}
#header h1 {
	display: block;
	top: 35%;
	float: none;
	clear:both;
}
#nav {
	float: right;
	top: 20%;
	clear: both;
}
#header-fixed #nav {
	clear: none;
}
.dropotron.level-0 {
	margin-top: -16px;
}
#banner h2 {
	font-size: 3em;
	line-height: 1.3em;
	margin: 0.5em 0 3.5em 0;
}
#banner p {
	font-size: 1.25em;
	line-height: 1.75em;
	letter-spacing: 0.04em;
}
}

/************** MEDIA QUERY: PHONE ONLY **************/

#navPanel, #titleBar {
	display: none;
}

@media screen and (max-width: 736px) {

/* Basic */
html, body {
	overflow-x: hidden;
}
body, input, select, textarea {
	line-height: 1.75em;
	font-size: 10pt;
	letter-spacing: 0;
}
h2, h3, h4, h5, h6 {
	font-size: 13pt !important;
}
h2 {
	line-height: 1.5em;
}

/* Section/Article */
section, article {
	clear: both;
	margin-bottom: 4em !important;
}
#footer-detailed section { /* I added this and the following to even out my footer elements in mobile */
    margin-bottom: 2em !important;
}
#footer-detailed section h2:nth-of-type(2) {
	padding-top: 10px;
}

/* Image */
.image.left {
	width: 25%;
	margin-bottom: 2em !important;
}

/* Button */
.button {
	width: 100%;
	font-size: 1.1em;
	text-align: center;
	padding: 1em 0 1em 0;
	border-radius: 8px;
}

/* List */
ul.menu li {
	display: block;
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
}
ul.actions li {
	display: block;
	padding: 0;
	margin: 1em 0 0 0;
}
ul.actions li:first-child {
	margin-top: 0;
}
/* Box */
.box.excerpt .image-left {
	margin-right: 0;
}
.box.excerpt header {
	margin-left: 32%;
}
.box.excerpt p {
	clear: both;
}
.box.feature1 section {
	margin-bottom: 1em !important;
}

/* Off-Canvas Navigation */
#page-wrapper {
	-moz-backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-transition: -moz-transform 0.5s ease;
	-webkit-transition: -webkit-transform 0.5s ease;
	-ms-transition: -ms-transform 0.5s ease;
	transition: transform 0.5s ease;
	padding-bottom: 1px;
}
#titleBar {
	-moz-backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg02.png");
	background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg02.png");
	-moz-transition: -moz-transform 0.5s ease;
	-webkit-transition: -webkit-transform 0.5s ease;
	-ms-transition: -ms-transform 0.5s ease;
	transition: transform 0.5s ease;
	background-color: rgba(59, 62, 69, 0.9);
	box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.5), inset 0px 0px 0px 2px rgba(255, 255, 255, 0.075), 0px 1px 6px 0px rgba(0, 0, 0, 0.35);
	display: block;
	height: 44px;
	left: 0;
	position: fixed;
	text-shadow: -1px -1px 0 black;
	top: 0;
	width: 100%;
	z-index: 10001;
}
#titleBar .title {
	display: block;
	text-transform: uppercase;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: #fff;
	line-height: 44px;
	text-align: center;
}
#titleBar .title a {
	text-decoration: none;
	color: inherit;
}
#titleBar .toggle {
	position: absolute;
	left: 0;
	top: 0;
	width: 60px;
	height: 44px;
	opacity: 0.25;
}
#titleBar .toggle:before {
	display: inline-block;
	font-family: FontAwesome;
	text-decoration: none;
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: 18px;
	width: 44px;
	height: 44px;
	line-height: 44px;
	text-align: center;
	color: #fff;
	content: '\f0c9';
}
#titleBar .toggle:active {
	opacity: 0.5;
}
#navPanel {
	-moz-backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	background-image: -moz-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg01.png");
	background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg01.png");
	background-image: -ms-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg01.png");
	background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)), url("/incl/specialty/assets/css/images/bg01.png");
	-moz-transform: translateX(-275px);
	-webkit-transform: translateX(-275px);
	-ms-transform: translateX(-275px);
	transform: translateX(-275px);
	-moz-transition: -moz-transform 0.5s ease;
	-webkit-transition: -webkit-transform 0.5s ease;
	-ms-transition: -ms-transform 0.5s ease;
	transition: transform 0.5s ease;
	background-color: #303238;
	box-shadow: inset -1px 0px 0px 0px rgba(0, 0, 0, 0.5), inset -2px 0px 0px rgba(255, 255, 255, 0.15), inset -2px 0px 10px 0px rgba(0, 0, 0, 0.35);
	display: block;
	height: 100%;
	left: 0;
	overflow-y: auto;
	position: fixed;
	top: 0;
	width: 275px;
	z-index: 10002;
}
#navPanel .link {
	display: block;
	color: #aaa;
	text-decoration: none;
	height: 44px;
	line-height: 44px;
	border-top: solid 1px rgba(255, 255, 255, 0.05);
	border-bottom: solid 1px rgba(0, 0, 0, 0.15);
	padding: 0 1em 0 1em;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 0.95em;
	letter-spacing: 0.075em;
}
#navPanel .link:first-child {
	border-top: 0;
}
#navPanel .link:last-child {
	border-bottom: 0;
}
#navPanel .indent-1 {
	display: inline-block;
	width: 1em;
}
#navPanel .indent-2 {
	display: inline-block;
	width: 2em;
}
#navPanel .indent-3 {
	display: inline-block;
	width: 3em;
}
#navPanel .indent-4 {
	display: inline-block;
	width: 4em;
}
#navPanel .indent-5 {
	display: inline-block;
	width: 5em;
}
#navPanel .depth-0 {
	color: #fff;
}
body.navPanel-visible #page-wrapper {
	-moz-transform: translateX(275px);
	-webkit-transform: translateX(275px);
	-ms-transform: translateX(275px);
	transform: translateX(275px);
}
body.navPanel-visible #titleBar {
	-moz-transform: translateX(275px);
	-webkit-transform: translateX(275px);
	-ms-transform: translateX(275px);
	transform: translateX(275px);
}
body.navPanel-visible #navPanel {
	-moz-transform: translateX(0);
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
}

/* Wrappers */
#header-wrapper, .splash-wrapper {
	background-position: 35% 50%;
}
#header-wrapper.splash, .splash-wrapper {
	padding-top: 44px;
}
#main-wrapper.splash  {
	padding-top: 0;
}
#footer-wrapper {
	padding: 1em 20px 0 20px;
}
#footer-wrapper .row#footer-simple > * {
	padding: 1em 0 0 0;
}
.wrapper {
	padding: 5em 20px 1em 20px;
}
.wrapper + .wrapper {
	padding-top: 0;
}


/* Header */
#header, #nav, #header-fixed, #header-fixed-adjuster {
	display: none;
}

/* Banner */
#banner {
	padding: 20px 20px 10px;
}
#banner h2 {
	font-size: 2.0em !important;
	padding: 20px;
	margin-bottom: 3em
}
#banner h2 br {
	display: none;
}
#banner p {
	font-size: 1.5em;
	padding: 10px;
	margin-bottom: 1.5em;
}

/* Page Title with Logo */
.page-title-logo {
	margin-left: 5%;
	margin-right: 5%;
}
section.page-title-logo {
	margin-bottom: 3em !important;
}
.page-title-logo .\33 u.\31 2u\28mobile\29 {
	width: 25%
}
.page-title-logo .\39 u.\31 2u\28mobile\29 {
	width: 75%
}

/* Footer */
#footer-simple {
	margin-top: -1em;
	padding-bottom: 2em;
}
.image.middle.footer-logo {
	display: block;
	margin-right: auto;
	margin-left: auto;
}
#footer-simple .\32 u  {
	text-align: center;
}
#footer-simple .\31 0u  {
	padding-top: 0;
}

#skiplinks {
	margin-top: 0;
}

#main-wrapper ol, #main-wrapper ul {
	margin-left: 25px;
}

/* this doesn't work in nav panel, which is created by javascript */
.mobile-not {
	display: none;
}
.rightbox, .leftbox {
	float: none;
	margin: 0;
	padding: 0 1em 1em;
    max-width: 100%;
}
.rightbox-mobile, .leftbox-mobile {
    max-width: 40%;
}
table.datatable.twocol {
	width:100%;
	margin-right:0;
	margin-left:0;
}
div.row.twocol div:first-child {
	padding-right: 0;
	padding-left: 10px;
}
div.row.twocol div:nth-child(2) {
	padding-left: 10px;
}
}

/************** CUSTOM STYLES **************/
audio {
	max-width:350px;
}
.video-featured {
    width: 90%;
    text-align: center;
    clear: both;
    margin: 0 auto 2em;
}
.page-title {
	margin-bottom: 0 !important;
}
section.page-title header.major {
	margin-bottom: 1.5em;
}
.masthead {
	/* no styling yet */
}
.conclusion {
	/* no styling yet */
}
#skiplinks a, #skiplinks a:hover, #skiplinks a:visited {
	position: absolute;
	top: -500px;
	left: 0;
	overflow: hidden;
	text-decoration: none;
}
#skiplinks a:active, #skiplinks a:focus {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	text-decoration: none;
	padding: 5px 0 5px 10px;
	background-color: #3B3E45;
    color: #fff;
	border-right: solid 8px #eee;
	border-bottom: solid 8px #eee;
	width: 200px;
}
#skiplinks a:after {
	content: " >>"
}
#skiplinks a:hover {
	text-decoration: underline;
}
.offscreen { /* move text needed only for accessibility offscreen */
	position: absolute;
	left: -10000px;
}
/* this is a hack that makes anchor links not get covered up by fixed header nav bar */
#content a:target, #content h1:target, #content h2:target, #content h3:target, #content h4:target, #content h5:target, #content h6:target {
	margin-top: -50px;
	padding-top: 50px;
}
#content a:target {
	display: block;
	border: none;
}

/************** PHOTO GALLERY **************/
/* flex containers created for TARE Heart Galleries, but available sitewide */
div#photo_gallery {
	clear: left;
	padding: 0;
	margin: 0 0 10px 0;
}
div#photo_gallery.photo_rows { /* horizontal flex rows - best for images of the same dimension */
	display: -webkit-box; /* Chrome and Safari */
	display: -webkit-flex; /* Chrome and Safari */
	display: -ms-flexbox; /* IE */
	display: -moz-box; /* Firefox */
	display: flex;
	flex-flow: row wrap; /* makes the boxes line up in a row and wrap like words in a sentence */
	-webkit-flex-flow: row wrap;
	-ms-flex-flow: row wrap;
	-moz-flex-flow: row wrap;
	justify-content: flex-start; /* justifies to the left, like a normal sentence. */
	-webkit-justify-content: flex-start;
	-ms-justify-content: flex-start;
	-moz-justify-content: flex-start;
	align-items: stretch; /* aligns to top and bottom, filling the space - making a row of equally sized boxes */
	-webkit-align-items: stretch;
	-ms-align-items: stretch;
	-moz-align-items: stretch;
}
div#photo_gallery.photo_columns { /* vertical columns - best for images of various dimensions */	
	-webkit-column-count: 5;
	-webkit-column-gap: 0px;
	-moz-column-count: 5;
	-moz-column-gap: 0px;
	column-count: 5;
	column-gap: 10px;
}
div#photo_gallery div.portrait_box {
	text-align: center;
	font-weight: bold;
	padding: 10px;
	margin-bottom: 10px;
	border-radius: 8px;
	border: 1px solid #ddd;
	background-color: #fdfdfd;
	background-color: rgba(255, 255, 255, 0.7);
	box-shadow: 0 0.2em 0.3em rgba(0, 0, 0, 0.2);
}
div#photo_gallery.photo_rows div.portrait_box {
	width: 19%;
	margin-right: 1%;
}
div#photo_gallery div.portrait_box img {
	max-width: 100%;
	transition: all .2s ease-in-out;
	border-radius: 8px;
	border: 1px solid #eee;
	border: 1px solid rgba(204, 204, 204, 0.3);
}
div#photo_gallery div.portrait_box p {
	margin-bottom: 0;
}
/*  This is related to my failed attempt to have a larger pop-up. The idea was to put a second, larger, hidden image inside the photo box. When you hovered over the box, the display property of the hidden image changes, and the CSS centers it in the middle of the page. In and of itself, it worked fine, but there were usability issues - mainly that there was no "close" button like you would have in a more complicated modal window.

div#photo_gallery.photo_rows div.portrait_box .bigimage, div#photo_gallery.photo_columns div.portrait_box .bigimage {
	display: none;
}
div#photo_gallery.photo_rows div.portrait_box:hover .bigimage, div#photo_gallery.photo_columns div.portrait_box:hover .bigimage {
	display: block;
	margin-left: auto;
	margin-right: auto;
  	max-width: 90%;
	max-height: 90vh;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
} */
/* This is related to the above. Using two different methods, I overlaid a "learn more" and "close window" button on top of the image. Again, it mostly worked fine, though placing the buttons on the images was a little wonky since the images themselves were different sizes and aspect ratios. The main issue had to do with the "close window" button, which could cause repetitive flashing if positioned in just the right spot...  
div#photo_gallery div.portrait_box:hover + span, div#photo_gallery div.portrait_box:hover a::after {
	display: block;
	font-size: 100%;
	background-color: #FFF;
	padding: 0 10px;
	border: 1px solid #ccc;
	position: fixed;
}
div#photo_gallery.photo_rows div.portrait_box span, div#photo_gallery.photo_rows div.portrait_box + span {
	display: none;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
div#photo_gallery div.portrait_box:hover a::after {
	content: "learn more";
	top: 75%;
	left: 40%;
}
div#photo_gallery div.portrait_box:hover + span {
	top: 75%;
	left: 50%;
} */
div#photo_gallery div.portrait_box img:hover, div#photo_gallery div.portrait_box img:active, div#photo_gallery div.portrait_box img:focus {
	transform: scale(2.0);
}
div#photo_gallery div.portrait_box a {
	text-decoration: none
}
div#photo_gallery div.portrait_box a:hover {
	text-decoration: underline;
}
div.photo_nav {
	font-size: 120%;
	font-weight: bold;
	text-align: center;
}
div.photo_nav a {
	padding: 5px 10px;
	text-decoration: none;
	border: 1px solid transparent;
	text-shadow: none;
	border-radius: 3px;
}
div.photo_nav a:hover {
	border-color: #2063ba;
	background-color: #d2e0f1; /* fallback */
	background-color: rgba(32, 99, 186, 0.15);
}
div.photo_nav a.active {
	border-color: #ccc;
	background-color: #eee; /* fallback */
	background-color: rgba(204, 204, 204, 0.6);
}
@media screen and (min-width: 1500px) {
	div#photo_gallery div.portrait_box img:hover, div#photo_gallery div.portrait_box img:active, div#photo_gallery div.portrait_box img:focus {
		transform: scale(2.5);
	}
}
@media screen and (min-width: 1300px) and (max-width: 1399px) {
	div#photo_gallery div.portrait_box img:hover, div#photo_gallery div.portrait_box img:active, div#photo_gallery div.portrait_box img:focus {
		transform: scale(2.2);
	}
}
@media screen and (min-width: 1000px) and (max-width: 1199px) {
	div#photo_gallery.photo_rows div.portrait_box {
		width: 24%;
	}
	div#photo_gallery.photo_columns {
		column-count: 4;
	}
	div#photo_gallery div.portrait_box img:hover, div#photo_gallery div.portrait_box img:active, div#photo_gallery div.portrait_box img:focus {
		transform: scale(1.8);
	}
}
@media screen and (min-width: 737px) and (max-width: 999px) {
	div#photo_gallery.photo_rows div.portrait_box {
		width: 32%;
	}
	div#photo_gallery.photo_columns {
		column-count: 3;
	}
	div#photo_gallery div.portrait_box img:hover, div#photo_gallery div.portrait_box img:active, div#photo_gallery div.portrait_box img:focus {
		transform: scale(1.6);
	}
}
@media screen and (min-width: 481px) and (max-width: 736px) {
	div#photo_gallery.photo_rows div.portrait_box {
		width: 49%;
	}
	div#photo_gallery.photo_columns {
		column-count: 2;
	}
	div#photo_gallery div.portrait_box img:hover, div#photo_gallery div.portrait_box img:active, div#photo_gallery div.portrait_box img:focus {
		transform: scale(1.2);
	}
}
@media screen and (max-width: 480px) {
	div#photo_gallery.photo_rows div.portrait_box {
		width: 100%;
		margin-right: 0;
	}
	div#photo_gallery.photo_columns {
		column-count: 1;
	}
	div#photo_gallery div.portrait_box img:hover {
		transform: none;
	}
	section.page-title-logo {
		margin-bottom: 2em !important;
	    margin-left: 0;
	    margin-right: 0;
	}
}

/************** PRINT **************/
/* this was added to the style sheet - no print styling came with the template */
@media print {
	* { /* general override of everything */
    	text-shadow: none !important;
    	color: #000 !important; 
    	background: transparent !important;
    	box-shadow: none !important;
  	}
  	#header-wrapper, .splash-wrapper {
		display:none
	}
	#footer-wrapper {
		display:none
	}
	#main-wrapper {
		margin-top: 25px;
	}
	.row {
		margin: 0;
	} 
	.row > * {
		float:none;
		width: 100%
	}
	header.major > p {
	    top: 0;
		margin-bottom: 10px;
	}
	body, p, li  {
		line-height: 1.5;
	}
	ol, ul {
		margin-left: 5%;
	}
	.image:before {
    	opacity: 0;
	}
}