
html {box-sizing: border-box;}
*, *:before, *:after {box-sizing: inherit;}

body {font-family:'Open Sans', Arial, sans-serif; font-size:16px; color:#484848; background:#fff; margin:0; width:100%; text-align:center;}
hr {height: 1px; color: #d9d9d9; background: #d9d9d9; font-size: 0; border: 0; width:100%; margin:30px auto 0 auto;}
p, li, blockquote {line-height:135%;}
h1 {color:#AD0D2B; margin:0; font-size:28px;}
h2 {margin:0 0 10px 0; padding:0 0 0 20px; font-size:18px; color:#AD0D2B; font-weight:normal; float:left;}
h3 {color:#AD0D2B; font-size:20px; font-weight:bold; margin:0;}

a:link {color:#0EA4D7; text-decoration:underline;}
a:active, a:visited {color:#666; text-decoration:underline;}
a:hover {color:#AD0D2B; text-decoration:underline;}

.container {max-width:1200px; width:90%; text-align:left; margin:0 auto; clear:both;}

.header {background:#d31f48;}
.header h1 {text-align:center; margin:auto; padding:40px 0;}
.header h2 {display:none; text-align:center; margin:45px auto 0 auto; padding:0; color:#E8ABB8; font-size:18px; font-weight:bold;}

.streaks {width:100%; height:auto; display:block;}
.streaksmobile {width:100%; height:auto; display:none;}

h2 {width:17%;}
hr {margin-right:28%; margin-bottom:30px;}

.contentregion {margin:0 28% 0 22%;}
.contentregion p:first-child {margin-top:0;}

.sidebar {background:#0EA4D7; color:#fff; width:23%; float:right;}
.sidebar h3 {color:#ABDFF1; font-size:14px; margin:20px 20px 10px 20px; padding:0; font-weight:bold;}
.sidebar p {margin:0 20px; padding:10px 0; color:#fff; font-size:12px; border-top:1px solid #4ABBE1;}
.sidebar p a {color:#fff;}
.sidebar ul {font-size:11px; margin:0px 20px 5px 30px; padding:0; text-indent:none; list-style:square inside;}
.sidebar ul li {text-indent:none; margin:0;}
.sidebar img.staffphoto {float:right; margin:0 0 10px 10px;}
.earlysidebar {display:block;}
.latesidebar {display:none;}
.latesidebar p, .latesidebar li {font-size:14px;}

.nav {clear:both; padding-bottom:30px;}
.nav ul {list-style:none; margin:0; padding:0; text-align:center; font-weight:600;}
.nav ul li {display:inline; margin:0; padding:0; text-indent:0;}
.nav ul li.selected {opacity:0.7;}
.nav ul li a {padding:10px 20px; color:#fff; text-decoration:none;}
.nav ul li a:link, .nav ul li a:visited {text-decoration:none;}
.nav ul li a:hover, .nav ul li.selected a:hover {opacity:1; text-decoration:underline;}

.folio {width:95%; margin:0 auto; padding:30px 0; display:block; background:#fff;}

.folioitem {float:left; width:32%; margin-left:2%; text-align:center; position:relative; margin-bottom:30px;}
.folio .folioitem:nth-child(3n+1) {margin-left:0;}

.folioitem img {width:100%; height:auto; position:relative; z-index:4;}
.folioitemcaption {position:absolute; z-index:5; text-align:center; background:#d31f48; color:#fff; padding:8px 10px 12px 10px; bottom:0; 
    margin: 0; border-radius:2px; width:100%; display:none; font-size:18px;}
.folioitemcaption span {font-size:14px; opacity:0.5; font-weight:normal;}
.folioitemcaption span:before {content:"\a"; white-space: pre;}
.folioitem:hover .folioitemcaption {display:block;}

.frontcol {float:left; width:25%; margin-left:5%;}
.frontcol:first-child {width:40%; margin-left:0; border-top:10px solid #C7113B; padding:20px 0;}
.frontcol:first-child h1 {margin-bottom:30px;}
.frontcol:last-child {border-top:10px solid #0EA4D7;}

.foliofull {margin-left:0;}
.contentfolio {margin:40px 0 20px 0; clear:both; border-top:1px solid #ccc;}
.contentfolio h2 {width:100%; font-size:15px; padding:10px 0; color:#666; float:none;}

ul.about {padding:0; margin:0; list-style:none;}
ul.about li {font-size:14px; line-height:135%; color:#484848; padding:10px 0; border-bottom:1px solid #d9d9d9;}
ul.about li:first-child {padding-top:0;}
ul.about li:last-child {border-bottom:0;}
ul.about li b {font-size:14px; color:#000;}

a.button {background:#0EA4D7; font-size:14px; padding:10px 40px; margin:20px 0; border-radius: 5px; display:inline-block; color:#fff; text-decoration: none; font-weight:bold;}
a.button i {opacity:0.5; margin-left:10px;}
a.button:hover {opacity:0.8;}

.foliohalf {width:15%; height:190px; margin:0 0 10px 0; padding:0; float:left; display:inline; font-size:11px; color:#999; text-align:left;}
.foliohalf span {width:15%; text-align:center; padding:0; margin:0;}
.foliohalf span img {border:1px solid #d9d9d9; margin:0 0 3px 0;}
.foliohalf a {text-decoration:none; color:#999;}

table.contact {border-collapse:collapse; margin-top:-5px;}
table.contact tr {vertical-align:top;}
table.contact tr th {padding:10px 15px 10px 0; text-align:left; font-weight:normal; opacity:0.7; font-size:12px;}
table.contact tr td {padding:10px;}

.aside {font-size:11px; margin:20px 0 0 30px;}

form {margin:0px;}

ul.front {margin:0; padding:0; list-style:square inside;}
ul.front li {font-size:14px; line-height:135%; color:#fff; padding-bottom:10px;}

cite {font-style:normal; font-weight:normal; font-size:10px; color:#999; line-height:115%;}


.footer {background:#d31f48; padding:40px 0; margin-top:50px; clear:both; display: block; overflow: hidden;}
.footer .footercol {width:29%; margin-left:2%; margin-right:2%; float:left; display: block;}
.footer .footercol .footerlogo {width:80%; max-width:200px; margin-top:10px;}
.footer ul.contact {list-style:none; margin:0; padding:0;}
.footer ul.contact li {color:#fff; margin:5px 0; font-size:18px;}
.footer ul.contact li cite {color:#fff; opacity:0.5;}
.footer ul.contact li a {color:#fff;}
.footer .adelaide {padding-top:20px; margin:50px 20px 0 20px; border-top:1px solid #fff; opacity:0.3; text-align:center; color:#fff;}


@media all and (max-width:1500px) {
.frontfolioitem {width:33.3333333%;}
}

@media all and (max-width:930px) {
.extraneous, .nav ul li.extraneous {display:none;}
.folioitem {width:48%; margin-left:4%;}
.folio .folioitem:nth-child(3n+1) {margin-left:4%;}
.folio .folioitem:nth-child(2n+1) {margin-left:0;}
.frontcol:first-child {font-size:14px;}
.currently, .keypoints, .people {font-size:12px;}
.frontcol:first-child h1 {font-size:25px;}
.frontcol h3 {font-size:18px;}
.footer .footercol {width:46%; text-align:center;}
.footer .footercol:first-child {display:none;}
}

@media all and (max-width:850px) {
.frontcol {width:27%; margin-left:3%;}
.frontcol:first-child {width:70%;}
.frontcol:last-child {width:100%; clear:both; margin-left:0; margin-right:0; padding-left:0; padding-right:0; float:none;}
.currently {float:left; width:45%; margin-right:5%;}
h2 {display:none;}
.contentregion, hr {margin-left:2%; margin-right:35%;}
.sidebar {width:26%; margin-right:2%; margin-bottom:30px;}
.streaks {display: none;}
.streaksmobile {display: block;}
}

@media all and (max-width:700px) {
.nav ul li a {padding:10px 5px; font-size:14px;}
.footer ul.contact li {font-size:15px;}
.sidebar {float:none; clear:both; width:100%; padding:2% 0; margin-top:30px;}
.earlysidebar {display:none;}
.latesidebar {display:block;}
.contentregion {width:100%; margin:0;}
hr {margin-right:0;}
}

@media all and (max-width:650px) {
.folio {width:90%;}
.folioitem {width:100%; margin-left:0;}
.folio .folioitem:nth-child(3n+1) {margin-left:0;}
.folio .folioitem:nth-child(2n+1) {margin-left:0;}
.folioitemcaption {position:relative; padding:8px 20px 12px 20px; display:block; font-size:14px;}
.folioitemcaption span {font-size:12px;}
.frontcol, .frontcol:first-child, .frontcol:last-child {width:100%; margin-left:0;}
.people {display:none;}
}

@media all and (max-width:500px) {
.currently {float:none; width:100%;}
.footer .footercol {width:100%; margin:0; margin-bottom:30px;}
.footer .footercol:first-child {display:block;}
}


