/* ============================================== */
/* ======== Base Styles for All Devices ========= */
/* ============================================== */

/* 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;
}
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;
}


/* GENERAL
--------------------------------- */
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; }

body.in-iframe {
	margin-left: -18px; /* Setting the offset here to account for the left bubble */
}

p {
	line-height: 1.2;
	margin-bottom: 1em;
}

em {
  font-style: italic;
}

strong {
  font-weight: bold;
}

/* CONTAINERS
--------------------------------- */
#container {
	margin: 0 auto;
	max-width: 950px;
}

.masthead img {
	display: block;
	width: 100%;
}

#logo {
	margin: 0 auto;
	position: relative;
	width: 100%;
	z-index: 1001;
}

body.in-iframe #logo {
	margin-left: -6px;
}

#logo .logo-bot {
	position: absolute;
	right: 0;
	top: 100%;
	width: 31.9544984%;
	z-index: 1001;
}

#mc-paypass {
	position: absolute;
	height: 61.2716763%;
	right: 2.27507756%;
	top: 16.1849711%;
	width: 12.8231644%;
	z-index: 1010;
}

.lt-ie9 #mc-paypass { /* IE needs a bg to make link work */
	background: url(../img/c.gif);
}

.faux {
	display: none;
}


/* CONTENT
--------------------------------- */
.mod {
	float: left;
	height: 338px;
	margin: 0 0 20px 20px;
	position: relative;
	width: 290px;
}

.mod img {
	max-width: 100%;
}

.cols2,
.video,
.video iframe,
.video-streaming {
	height: auto;
	width: 290px;
}

.video,
.video-streaming {
	padding: 0;
}

/* Limelight streaming video */
.video-streaming .LimelightEmbeddedPlayer {
	display: block;
	height: 194px;
	margin: 1.35% auto 0;
	width: 290px;
}

.video-streaming object,
.video-streaming table,
.video-streaming video {
	width: 290px;
	height: 194px;
}

.video-streaming .flag {
  display: none;
}

/* if need a padded module */
.text {
	height: 308px; /* 338px - 30px */
	padding: 15px;
	width: 260px; /* 290px - 30px */
}

/* :::: Info Flags :::: */
.flag a {
	text-decoration: none;
}


.flag span {
	margin-left: 1px;
}

h2.flag {
	z-index: 30;
}

h2.flag span {
	display: block;
}



/* :::: Module: Events :::: */
.events {
	height: 306px;
	width: 258px;
}

.scroll .has-more:hover {
	cursor: pointer;
}

.events h2 {
	height: 70px;
	margin: 0 auto 20px;
	text-align: center;
	width: 250px;
}

.events .scroll {
	height: 205px;
	overflow: auto;
}

.events ol {
	width: 245px;
}

.events li {
min-height: 35px;
padding-top: 5%;
position: relative;
}

.events li:first-child {
	padding-top: 0;
}

.events li .info {
	width: 65%; /* or 9.75em */
}

.events li time {
	float: left;
	padding: 0 20px 7px 1px;
}

.events p,
.events .pre {
	margin-bottom: 0;
}

.events .pre {
  white-space: pre-wrap; /* css-3 */
  white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
  white-space: -pre-wrap; /* Opera 4-6 */
  white-space: -o-pre-wrap; /* Opera 7 */
  word-wrap: break-word; /* Internet Explorer 5.5+ */
  font-family: arial, helvetica, sans-serif;
  color: #fff;
  font-size: 12px;
}

.events h3 {
	margin-top: 1px;
}

.events li:after { /* vertical bar between date and info */
	content: "\00a0";
	display: block;
	position: absolute;
	bottom: 0px;
	left: 68px;
	width: 0px;
	height: 12px;
	z-index: 20;
}

.scroll .info {
margin-left: 80px;
}

#scroll-events:focus {
	outline: none;
}

/* JS enabled */
.js .scroll .info {
	height: 1.7em;
	overflow: hidden;
}

.js .events ol {
	width: 242px; /* 250 */
}


/* SHARED SUBPAGE STYLES
----------------------------------------- */
.subpage h1 {
	margin-bottom: 0;
}

.subpage {
	padding: 0 10px 10px;
}

.subpage article {
	position: relative;
}

.subpage .content .flag {
	padding: 10px 11px 10px 13px;
	top: 20px;
}

.subpage hgroup h2 {
	margin: 0.3% 0 1.4%;
}

.subpage .byline {
	margin-top: 0;
}

.subpage p {
	margin-top: 3.5%;
}

.subpage .content {
	padding: 24px 20px;
}

/* :::: Read the Latest :::: */
.latest {
	margin: 20px auto 0;
	width: 290px;
} 

.latest h1.mod {
	height: 298px; /* 338px - 40px */
	margin-bottom: 20px;
	padding: 20px;
	width: 250px; /* 290px - 40px */
}

.latest .mod {
	margin-left: 0;
	margin-right: 20px;
}

.latest .mod:last-child {
	margin-right: 0;
} 

/* :::: Social Icons :::: */
.social {
	min-height: 20px;
}

.social li {
	float: left;
	margin-right: 2%;
}


/* ARTICLE DETAIL PAGE
----------------------------------------- */
.subpage.article {
	padding: 0 15px 10px;
}

.article header {
margin-bottom: 3.5%;
}

.subpage.article .content {
	padding-top: 4em;
}

.article .photos {
	margin: 0 auto;
	width: 290px;
	overflow: hidden;
}

.article .photos img {
	display: block;
	max-width: 100%;
  width: 99%;
  margin: 0 auto;
}

.article .content iframe {
	max-width: 575px;
	width: 100%;
}


/* SLIDESHOW PAGE
----------------------------------------- */
.slideshow .content {
	clear: both;
	padding-top: 1px;
}

.slideshow .description p {
	margin: 0 0 3.5%;
}

#slides {
	position: relative;
}

.js .slideshow .content {
	padding-top: 11px;
}

.thumbs {
	margin: 0 auto;
}

.thumbs li {
	float: left;
	margin-right: 5px;
	position: relative;
}

.thumbs li:last-child {
	margin-right: 0;
}

.thumbs li img:hover {
	cursor: pointer;
}

#controls {
	display: none;
}

#controls a {
	height: 100%;
	width: 100%;
}

#btn-prev,
#btn-next {
	height: 17.5652174%; /* 101px / 575px */
	position: absolute;
	top: 41.5652174%; /* 239px / 575px */
	width: 11.0989011%; /* 101px / 910px */
background-size: 203px 101px;
	z-index: 30;
}

#btn-prev {
	left: 0;
}

#btn-next {
	background-position: -103px 0;
	right: 0;
}

/* Full size image area */
#photo-wrapper {
    margin: 0 auto 2%;
    overflow: hidden;
    position: relative;
}

#photo-wrapper.has-thumbs {
    margin-bottom: -5.95%;  /* 9.04347826   -52px / 510px */
}

#photo-fullsize {
	left: 0;
	position: absolute;
	top: 0;
}

#photo-fullsize li {
    float: left;
}

#photo-wrapper,
#photo-fullsize li {
	width: 156px; /* low it for default */
	height: 94px;
}

#photo-wrapper img {
	width: 100%;
}


/* HELPER CLASSES
------------------------------------------------ */
/*:::: Gilder/Levin Img Replacement :::: */
.gl {
    display: block;
    position: relative;
    overflow: hidden;
}

.gl span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
}

.gl a:hover {
    border: none;
    text-decoration:none;
}

.gl a span, a.gl span {
    display: block;
    cursor: pointer;
    border: 0;
}

/* H5BP */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }

.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }


/* REQUIRED FOR jScrollPane 
------------------------------------------------ */
.jspContainer {
	overflow: hidden;
	position: relative;
}

.jspPane {
	position: absolute;
}

.jspVerticalBar {
	position: absolute;
	top: 0;
	right: 0;
	width: 4px;
	height: 100%;
	background: #ededed;
}

.jspVerticalBar *,
.jspHorizontalBar * {
	margin: 0;
	padding: 0;
}

.jspCap {
	display: none;
}

.jspTrack {
	background: #ededed;
	position: relative;
}

.jspDrag {
	background: #00abf6;
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
}

.jspTrack,
.jspDrag {
-webkit-border-radius: 2px; /* Saf3-4, iOS 1-3.2, Android ≤1.6 */
     -moz-border-radius: 2px; /* FF1-3.6 */
          border-radius: 2px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
}

.jspArrow {
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled {
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow {
	height: 16px;
}

.jspVerticalBar .jspArrow:focus {
	outline: none;
}

.jspCorner {
	background: #eeeef4;
	float: left;
	height: 100%;
}

/* CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner {
	margin: 0 -3px 0 0;
}


/* ========================================================== */
/* ======== Media Queries for Various Viewport Sizes ======== */
/* ========================================================== */

/* 320px
---------------------------------------------- */
@media only screen and (min-width: 320px) {

	.masthead {
		margin: 0 auto;
		max-width: 967px;
	}

	.subpage.slideshow {
		margin-top: -2.5%;
	}

	.main {
		margin: 0 auto;
	}

	/* :: Slideshow :: */
	.subpage.slideshow  {
		padding-right: 15px;
		padding-left: 15px;
	}

	#photo-wrapper,
	#photo-fullsize li {
	    width: 290px;
	    height: 176px;
	}

	.thumbs.t1 { width: 67px; }
	.thumbs.t2 { width: 140px; }
	.thumbs.t3 { width: 213px; }
	.thumbs.t4 { width: 283px; }

	.thumbs.t5,
	.thumbs.t6, 
	.thumbs.t7,
	.thumbs.t8,
	.thumbs.t9,
	.thumbs.t10 { padding-left: 3px; width: 292px; }

	/* prev and next btns */
	#btn-prev,
	#btn-next {
		height: 38px;
		width: 38px;
		background-size: auto 38px;
    background-position: 0 0;
	}

	#btn-next {
		background-position: -40px 0;
	}

}

/* 320px - 479px
---------------------------------------------- */
@media only screen and (min-width: 320px) and (max-width: 479px) {

	.subpage.slideshow .content .flag {
		top: 30px;
		font-size: .5em;
	}

}


/* 480px - 631px
---------------------------------------------- */
@media only screen and (min-width: 480px) and (max-width: 631px) {

	/*.main.home .mod {
		float: none;
		margin-left: auto;
		margin-right: auto;
	}*/

}

/* 480px
---------------------------------------------- */
@media only screen and (min-width: 480px) {

	.subpage.slideshow .content .flag {
		top: 50px;
	}

	.subpage .content .flag {
		top: 28px;
	}

	.thumbs li {
		margin-right: 6px;
	}

	/* :: Slideshow :: */
	#photo-wrapper,
	#photo-fullsize li {
	    width: 450px;
	    height: 272px;
	}

	.thumbs.t5 { width: 359px; padding: 0; }

	.thumbs.t6, 
	.thumbs.t7,
	.thumbs.t8,
	.thumbs.t9,
	.thumbs.t10 { padding-left: 3px; width: 365px; }

	/* prev and next btns */
	#btn-prev,
	#btn-next {
		background-size: auto 50px;
		height: 50px;
		width: 50px;
	}

	#btn-next {
		background-position: -52px 0;
	}

}


/* 632px
---------------------------------------------- */
@media only screen and (min-width: 632px) {

	.faux {
		display: none;
		float: right;
		height: 47px;
		width: 45.7685665%;
	}

	.subpage .content .flag {
		top: 60px;
	}

	.subpage.slideshow .content .flag {
		top: 75px;
	}

	.main {
		width: 632px;
	}

	.cols2,
	.video,
	.video iframe,
	.video-streaming {
		height: 338px;
		width: 600px;
	}

	.video-streaming .LimelightEmbeddedPlayer,
	.video-streaming object,
	.video-streaming table,
	.video-streaming video {
		height: 321px;
		width: 480px;
	}

	.video-streaming:first-child {
		margin-top: 38px;
	}

	.subpage {
		padding: 5px 20px 20px;
	}

	.subpage.article .content {
		padding-top: 24px;
	}

	.subpage h1 {
		font-size: 1.5em; /* 32px / 16px */
	}

	.subpage hgroup h2 {
		font-size: 1.05em; /* 18px / 16px */
	}

	.subpage .byline {
		font-size: .825em;
	}

	.subpage p {
		font-size: .75em;
	}

	/* :: Slideshow :: */
	#photo-wrapper,
	#photo-fullsize li {
	    width: 570px;
	    height: 345px;
	}

	.thumbs.t6 { width: 432px; padding: 0; }

	.thumbs.t7,
	.thumbs.t8,
	.thumbs.t9,
	.thumbs.t10 { padding-left: 3px; width: 438px; }

	/* prev and next btns */
	#btn-prev,
	#btn-next {
		background-size: auto 70px;
		height: 70px;
		width: 70px;
	}

	#btn-next {
		background-position: -72px 0;
	}

}


/* 768px
---------------------------------------------- */
@media only screen and (min-width: 768px) {

	.top-strip {
		display: block;
		margin-bottom: -128px;
		height: 128px;
	}

	.home {
		margin-top: -5px;
	}

	.subpage.slideshow .content .flag {
		top: 101px;
	}

	.article hgroup {
		max-width: 25em;
	}

	.main {
		width: 728px;
	}

	.main.home {
		width: 640px;
	}

	.latest {
		width: auto;
	}

	.video-streaming:first-child {
		margin-top: 48px;
	}

	/* :: Article ::; */
	.article .content {
	  float: right;
	  width: 63%;
	}

	.article .photos {
	  width: 100%;
	}

	/* :: Slideshow :: */
	.subpage.slideshow  {
		padding-right: 20px;
		padding-left: 20px;
	}

	#photo-wrapper,
	#photo-fullsize li {
	    width: 728px;
	    height: 441px;
	}

	.thumbs.t8 { width: 578px; padding: 0; }
	.thumbs.t9,
	.thumbs.t10 { padding-left: 3px; width: 365px; }

	/* prev and next btns */
	#btn-prev,
	#btn-next {
		height: 81px;
		width: 81px;
		background-size: auto 81px;
	}

	#btn-next {
		background-position: -83px 0;
	}

	.slideshow .content header {
		float: left;
		padding-right: 8.79120879%;
		width: 40%;
	}

	.slideshow .description {
		float: right;
		width: 51%;
	}

}


/* 950px
---------------------------------------------- */
@media only screen and (min-width: 950px) {
/*body {background: red;}*/
	.top-strip {
		margin-bottom: -144px;
		height: 144px;
	}

  .main,
	.main.home {
		width: auto;
	}

	.video-streaming:first-child {
		margin-top: 0;
	}

	/* :: Article ::; */
  .article header {
    float: left;
    width: 50%;
		max-width: 25em;
	}
	.article .content {
	    width: 876px;
	}
  .article .article-body {
    float: right;
    width: 50%;
  }
  .subpage p {
    margin-top: 0
  }

	.subpage h1 {
		font-size: 2em; /* 32px / 16px */
	}

	.subpage hgroup h2 {
		font-size: 1.125em; /* 18px / 16px */
	}

	.subpage .byline {
		font-size: .875em;
	}

	/* :: Slideshow :: */
	#photo-wrapper,
	#photo-fullsize li {
	    height: 575px;
	    width: 910px;
	}

	#slides .thumbs { padding: 0; }
	.thumbs.t1 { width: 67px; }
	.thumbs.t2 { width: 140px; }
	.thumbs.t3 { width: 213px; }
	.thumbs.t4 { width: 286px; }
	.thumbs.t5 { width: 359px; }
	.thumbs.t6 { width: 432px; }
	.thumbs.t7 { width: 505px; }
	.thumbs.t8 { width: 578px; }
	.thumbs.t9 { width: 651px; }
	.thumbs.t10 { width: 724px; }

	.slideshow .latest h1.mod {
		width: 250px;
	}

	/* prev and next btns */
	#btn-prev,
	#btn-next {
		height: 101px;
		width: 101px;
		background-size: 203px 101px;
	}
#btn-next {
	background-position: -103px 0;
}


}