/* http://meyerweb.com/eric/tools/css/reset/  v2.0 | 20110126   License: none (public domain) */
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;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;} body {line-height: 1.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;}
/* end reset */

body {color: #202020; background: #efefef; font-family: Verdana, Geneva, sans-serif; font-size: .75em;}
.header {margin: 0; padding: 0;}
.container {margin: 0; padding: 0 0 1% 0; text-align: center;}
img {border-width: 0; max-width: 90%;}
.logo {position: relative; z-index: 5; margin: 1em; width: 32%; max-width: 240px;}
h1 {font-size: 1.8em; margin: .2em 0 0 0;}
h2 {font-size: 1.4em; margin: .2em 0 .8em 0;}
h3 {font-size: 1.1em; margin: .8em 0 .8em 0;}

.seeme {position: relative; display: block; font-style: italic; font-size: 1.4em; z-index: 5; margin: .5em}
p {line-height: 1.3; margin: .5em auto .8em auto; max-width: 50em;}
a {text-decoration:none;}
.sm {font-size: .7em;}
.words {position:relative; z-index: 3; background: #eaeaea; padding: 0; border-style: solid; border-width: 2px 0 2px 0;
border-color: gray;}
.bridgecollage{padding: 0 0 14em 0; overflow: hidden; max-width: 1570px; margin: 0 auto;}
.bridgecollage img {max-width: 46%;}
.bridgecollage1, .bridgecollage2, .bridgecollage3, .bridgecollage4, .bridgecollage5 {position: absolute; display: block; padding: .2em; border: solid 2px gray; background: #ddd;}
.bridgecollage1:hover, .bridgecollage2:hover, .bridgecollage3:hover, .bridgecollage4:hover, .bridgecollage5:hover {z-index: 5;}
.bridgecollage1 {margin:0 0 2% 6%; z-index: 0;-ms-transform:rotate(-20deg);-webkit-transform:rotate(-20deg);-moz-transform:rotate(-20deg);-o-transform:rotate(-20deg);transform:rotate(-20deg);}
.bridgecollage2 {margin:5% 0 2% 45%; z-index: 1;-ms-transform:rotate(20deg);-webkit-transform:rotate(20deg);-moz-transform:rotate(20deg);-o-transform:rotate(20deg);transform:rotate(20deg);}
.bridgecollage3 {margin:34% 0 2% 2%; z-index: 3;-ms-transform:rotate(-12deg);-webkit-transform:rotate(-12deg);-moz-transform:rotate(-12deg);-o-transform:rotate(-12deg);transform:rotate(-12deg);}
.bridgecollage4 {margin:32% 0 2% 45%; z-index: 4;}
.bridgecollage5 {margin:20% 0 2% 16%; z-index: 2;-ms-transform:rotate(5deg);-webkit-transform:rotate(5deg);-moz-transform:rotate(5deg);-o-transform:rotate(5deg);transform:rotate(5deg);}

.s {padding: 2em 0 0 1em; margin: 0 0 1em 0;}
.gal {display:none;}
.s:hover > .gal {display:block;}
.l {padding: 2em 0 0 1em; margin: 0 0 1em 0; border-width: .1em 0 .1em 0; border-style: solid; border-color: #DCE7ED;
background: rgb(247,247,247);
background: -moz-linear-gradient(top,  rgba(247,247,247,1) 0%, rgba(229,232,234,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(247,247,247,1)), color-stop(100%,rgba(229,232,234,1)));
background: -webkit-linear-gradient(top,  rgba(247,247,247,1) 0%,rgba(229,232,234,1) 100%);
background: -o-linear-gradient(top,  rgba(247,247,247,1) 0%,rgba(229,232,234,1) 100%);
background: -ms-linear-gradient(top,  rgba(247,247,247,1) 0%,rgba(229,232,234,1) 100%);
background: linear-gradient(to bottom,  rgba(247,247,247,1) 0%,rgba(229,232,234,1) 100%);}

.ss {padding: 10px;}
.more {background: #ffffff; max-width: 600px;}
.clr {clear: both; padding: 1.6% 0 1.6% 0;}
.clrdos {clear: both; padding: 0 0 1px 0;}
.clrcut {display: none;}
.container ul {line-height: 150%; list-style-type: disc; margin: 0 .5em 0 1.5em;}
.container li {margin: .2em 0 .4em 0;}
.boldit {font-weight:bold; color: #626262;}
.boldital {font-style:italic; font-weight:bold;}
.bq {font-size: 360%;}
.blue {color: blue;}
.ft {padding: 20px 6px 6px 20px; text-align: center;}
.digft {display: inline-block; margin: 1px 0 0 0; padding: 0 20px 16px 10px;}
.digftc {display: block; margin: 1px 0 0 0; padding: 0 2.5em 2.5em .8em;}
.c {width: 42%; float: left; margin: 1px 0 1px 0; padding: 1em 1em 1em 0; min-height: 14em;}
.center {text-align: center;}
.sup {position: relative; top: -0.5em; font-size: 80%;}
.praise {display: block; font-family: Georgia, serif; font-weight:bold; font-size: 1.3em; padding: 10px 10px 10px 30px;
 color: #cc0000;}
.praisediv {width: 500px; float: left; max-width: 92%;}
.accent {position: relative; clear: both; font-size: 110%; margin: 30px 0 10px 0;
 padding: 16px 0 1% 5%; border-width: .1em 0 .1em 0; border-style: solid; border-color: #DCE7ED;
background: #ededed;
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(225,231,234,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(225,231,234,1)));
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(225,231,234,1) 100%);
background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(225,231,234,1) 100%);
background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(225,231,234,1) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(225,231,234,1) 100%);}

.map {position: relative; padding: 20px 1% 480px 1%; overflow: hidden; max-width: 100%;}
.map iframe {position: absolute; top: 0; left: 0; width: 100%; max-width: 100%;}

@media only screen and (min-width: 350px) {.bridgecollage{padding: 0 0 20em 0;}}
@media only screen and (min-width: 500px) {.bridgecollage{padding: 0 0 24em 0;}}
@media only screen and (max-width: 600px) {body {font-size: 0.983em;}}
@media only screen and (min-width: 601px) {body {font-size: 1em;} .bridgecollage{padding: 0 0 30em 0;} .ma {width: 48%;}}
@media only screen and (min-width: 800px) {.bridgecollage{padding: 0 0 34em 0;}}
/* normal bigger, skip for smaller */
@media only screen and (min-width: 900px) {
body {font-size: 1.063em;}
.words {padding: .3em 0 .3em 0; border-width: 3px 0 3px 0;}
.bridgecollage{padding: 0 0 40em 0;}
}

/* two column */
@media only screen and (min-width: 1026px) {
body {font-size: 1.125em;}
.bridgecollage{padding: 0 0 45em 0;}
.bridgecollage1, .bridgecollage2, .bridgecollage3, .bridgecollage4, .bridgecollage5 {
padding: .8em; border: solid 4px gray;}
.d {float:left; max-width: 45%;}
.thrd {clear:both; text-align: center;}
.accent {padding-top: 20px;}
.c {width: 42%; height: 14em; padding: 1em 2em 2em 0;}
.pod{width: 100%;}
}

@media screen and (min-width: 1200px) {.ma {width: 32%;}}
@media screen and (min-width: 1300px) {.bridgecollage{padding: 0 0 50em 0;}}
@media screen and (min-width: 1600px) {p, li {font-size: 105%;} .bridgecollage{padding: 0 0 54em 0;}}

/* back to normal desktop thirds*/
@media screen and (min-width: 1800px) {
body {font-size: 1.25em;}
 .thrd {clear:none; float: left; text-align: left;}
.clrcut {clear: both; padding: 0 0 1px 0;}
.c {width: 22%; float: left; margin: 1px 0 1px 0; padding: 1em 1% 2em 0;}
.accent {padding: 1.5% 0 1% 5%;}
.mainint {width: 85%; height: 150px;}
}
@media screen and (min-width: 2000px) {body {font-size: 1.313em;} .clrcut {display: none;}
.whitedos, .whitetres {max-width: 14em;}}
@media screen and (min-width: 2400px) {body {font-size: 1.5em;} .whiteisix {max-width: 40em;}}
@media screen and (min-width: 2800px) {body {font-size: 2em;}}
@media screen and (min-width: 3000px) {body {font-size: 2.5em;} 
.inpodleft {padding: 1em 1em 1em 0; max-width: 46%;} 
.pod {margin: 1em 1em 0 0; float: left;}}
@media screen and (min-width: 3400px) {body {font-size: 3em;}}