@charset "utf-8";
/* CSS Document */

html {height: 100%; overflow: hidden;}
body {margin:0; padding:0; perspective: 1px; transform-style: preserve-3d; height: 100%; overflow-y: scroll; overflow-x: hidden; font-family: "Open Sans", sans-serif; font-weight: 400; font-style: normal;}
h1 {font-size: 3.25em; line-height: 1em; margin: 0 0 0.5em 0; font-family: "Open Sans Condensed", sans-serif; font-weight: 700; text-align: center; font-style: italic;}
h2 {font-size: 2.25em; line-height: 1em; margin: 0 0 0.5em 0; font-family: "Open Sans Condensed", sans-serif; font-weight: 700; font-style: normal;}
h3 {font-size: 2em; line-height: 1em; margin: 0 0 0.5em 0; font-family: "Open Sans Condensed", sans-serif; font-weight: 700; font-style: normal;}
p {margin: 0 0 1.25em 0; text-transform: inherit; font-size: 1.25em; font-family: "Open Sans", sans-serif; font-weight: 400; font-style: normal; line-height: 1.5em;}
p.intro {font-size:1.25em; line-height: 1.5em; margin: 0 0 0.5em 0; font-style: italic;}
p.caption {display:block; clear:both; font-size:1.25em; line-height: 1em; margin: 3em 10% 1em 10%}

a {color:#C69214; text-decoration:underline; font-weight:800; z-index:2; perspective:2px; pointer-events:auto !important}

blockquote {padding: 1.5em 4em 1em 4em; width:50%; position: relative; color: #FFF; text-transform: uppercase; background:#373A36;}
blockquote:nth-of-type(odd) {margin: 0 -25% 2rem 2rem; float:right}
blockquote:nth-of-type(even) {margin: 0 2rem 2rem -25%; float:left}

iframe {z-index:2; perspective:2px; pointer-events:auto !important}

.video-container {position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden; display:block; margin:1em auto; clear:both; z-index:2; perspective:2px; pointer-events:auto !important}
.video-container iframe,
.video-container object,
.video-container embed {position: absolute; top: 0; left: 0; width: 80%; height: 80%; margin:1em 10%}

.photoblock {padding: 1.5em 4em 1em 4em; width:50%; position: relative; color: #000}
.photoblock:nth-of-type(odd) {margin: 0 -25% 0 2rem; float:right; border-left:4px solid #373A36}
.photoblock:nth-of-type(even) {margin: 0 2rem 0 -25%; float:left; border-right:4px solid #373A36}
.photoblock img {clear:both; margin-bottom:1em}
.photoblock:nth-of-type(odd) img {float:left; clear:both; margin-bottom:1em}
.photoblock:nth-of-type(even) img {float:right}

blockquote br {display: none;}
blockquote .quote:before, blockquote .quote:after {content: "\201C"; font-weight: 800; font-size: 250%; position: absolute; color:#C69214; text-shadow: 0 0 5px rgba(0,0,0,0.4);}
blockquote .quote:before {top:0.5em; left:0.25em;}
blockquote .quote:after {content: "\201D"; bottom: 1.25em; right: 0.5em;}

blockquote.longform-series {background: #000000 !important;
background: -moz-linear-gradient(top,  #000000 0%, #45484d 100%) !important;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(100%,#45484d)) !important;
background: -webkit-linear-gradient(top,  #000000 0%,#45484d 100%) !important;
background: -o-linear-gradient(top,  #000000 0%,#45484d 100%) !important;
background: -ms-linear-gradient(top,  #000000 0%,#45484d 100%) !important;
background: linear-gradient(to bottom,  #000000 0%,#45484d 100%) !important;
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#45484d',GradientType=0 ) !important;
font-size:0.9em !important; line-height:1 !important; font-style:normal !important; color:#FFF !important; text-transform:none !important; padding: 1.5em 2em 1em 2em; width:33% !important; margin: 0 0 2rem 2rem !important; float:right !important;}
blockquote.longform-series a {}
blockquote.longform-series ul {margin:1em -1em 1em -3em !important; list-style:none !important}
blockquote.longform-series li {display:block !important; border-bottom:1px dotted #C69214 !important; padding:0.5em 0 !important}
blockquote.longform-series li:last-of-type {border-bottom:none !important}
blockquote.longform-series .desc:before {content: "\2014\a0"}

p.quote {font-size: 1.5em; line-height: 2em; font-style: italic; color: #FFF; text-transform:uppercase; margin-bottom:0.25 !important}
p.cite {color: #D0D0CE; text-transform:#373A36; line-height:1; font-size:100%; margin-top:0 !important}
p.cite:before {content: "\2014\a0"}
.pull-quote {margin: 1em 0em; padding: 0em 0em 0em 0.7em;}
.pullout {float:right; width:340px; margin:0 0 1em 1em; border-left: 3px solid #666; padding:0 1em}

.slide {position: relative; padding: 25vh 10%; height:100%; min-height: 100vh; width: 100vw; box-sizing: border-box; box-shadow: 0 -1px 10px rgba(0, 0, 0, .7); transform-style: inherit;}
.textslide {position: relative; padding: 10vh 25%; min-height: 100vh; width: 100vw; box-sizing: border-box; box-shadow: 0 -1px 10px rgba(0, 0, 0, .7); transform-style: inherit;pointer-events:none}
.textslide:nth-of-type(2n+1) {background-color:#ffebbf}
.photostrip {width:100vh !important; border-top:3px dotted #373A36; border-bottom:3px dotted #373A36; padding:1em 10%; margin:2em -10vh; overflow:auto}
.photostrip img {float:left; width:30%; height:30%; max-width:100%; box-shadow: 0 0 8px rgba(0, 0, 0, .7); margin-right:1em; display:block}
.photostrip img:last-of-type {margin-right:0; clear:right}
.slide:before, .textslide:before {content: ""; position: absolute; top: 0; bottom: 0; left:0; right:0;}
.title {width: 80%; padding: 5%; background: #FFF}
.headerbg {top: 0 !important; width: 80%; margin: 0 5% !important; padding: 2% 5%; border-radius: 15px; background: rgba(198,146,20, .7); box-shadow: 0 0 8px rgba(0,0,0,.7);}
.bigslidecaption {width: 80%; margin:3em 5% !important; padding: 2% 5%; border-radius: 15px; background: rgba(0,0,0, .7); box-shadow: 0 0 8px rgba(0, 0, 0, .7); color:#FFF}
.gamecaptionL, .gamecaptionR {padding: 2% 5%; border-radius: 15px; text-shadow: 3px 3px 3px rgba(0, 0, 0, .7); color:#FFF}
.gamecaptionL {margin:3em 40% 3em 0 !important}
.gamecaptionR {margin:3em 0 3em 40% !important}
.gamecaptionL h3, .gamecaptionR h3 {font-size:3em !important}
.gamecaptionL p, .gamecaptionR p {font-size:2em !important; line-height:1 !important}
.slide:nth-child(2n+1) .title {margin-left: 0; margin-right: auto;}
.slide:nth-child(2n) .title {margin-left: auto; margin-right: 0;}
.slide, .slide:before {background: 50% 50% / cover;}
.header {text-align: center; font-size: 175%; color: #000; text-shadow: 0 2px 2px #000;}
.header p {text-align: center; font-size: 125%; line-height: 1.5; color: #fff; text-shadow: 0 2px 2px #000;}
#title {background-image: url(fbyir-lead0.jpg); background-attachment: fixed;}
#game1 {background-image: url(fbyir-lead1.jpg); background-attachment: fixed;}
#game2 {background-image: url(fbyir-lead2.jpg); background-attachment: fixed;}
#game3 {background-image: url(fbyir-lead3.jpg); background-attachment: fixed;}
#game4 {background-image: url(fbyir-lead4.jpg); background-attachment: fixed;}
#game5 {background-image: url(fbyir-lead5.jpg); background-attachment: fixed;}
#game6 {background-image: url(fbyir-lead6.jpg); background-attachment: fixed;}
#game7 {background-image: url(fbyir-lead7.jpg); background-attachment: fixed;}
#game8 {background-image: url(fbyir-lead8.jpg); background-attachment: fixed;}
#game9 {background-image: url(fbyir-lead9.jpg); background-attachment: fixed;}
#game10 {background-image: url(fbyir-lead10.jpg); background-attachment: fixed;}
#game11 {background-image: url(fbyir-lead11.jpg); background-attachment: fixed;}
#game12 {background-image: url(fbyir-lead12.jpg); background-attachment: fixed;}
#game13 {background-image: url(fbyir-lead13.jpg); background-attachment: fixed;}
#game14 {background-image: url(fbyir-lead14.jpg); background-attachment: fixed;}
#slide15 {background-image: url(fbyir-lead15.jpg); background-attachment: fixed;}
#slide1:before,
#slide3:before {background-color:#FFF; transform: translateZ(-1px) scale(2);z-index:-1;}
#slide1 {font-size:150%; line-height:2}
#slide3, #slide5, #slide7, #slide9, #slide11, #slide13 {font-size:100%; line-height:1.2}
#slideend {background: #373A36;}
.masthead {margin:0 auto !important; text-align:center !important; overflow-y:auto !important; transform-style:flat !important; perspective:none !important; margin-top:2em !important}
.masthead img {width:auto !important; max-width:100% !important; position:relative !important; top:0 !important; left:auto !important; height:auto !important; transform: none !important; padding: !important; border-radius:none !important; background:none !important; box-shadow:none !important}
.honors {margin-top:2em; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 4em; -moz-column-gap: 4em; column-gap: 4em; -webkit-column-rule: 2px outset #C69214; -moz-column-rule: 2px outset #C69214; column-rule: 2px outset #C69214}
.honors p {font-weight:800 !important; font-size:1em}

@media (max-width: 767px) {
.video-container iframe,
.video-container object,
.video-container embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin:1em 0}
.title img {display:none}
.title {width: 94%; padding: 5% 3%; background: #FFF}
.textslide {position: relative; padding:5% 3%; padding: 3vh 3%; min-height: 100vh; width: 100vw; box-sizing: border-box; box-shadow: 0 -1px 10px rgba(0, 0, 0, .7); transform-style: inherit;}
.pullout {float:none; width:90%; margin:1em 0; border-top: 3px solid #666; border-bottom: 3px solid #666; border-left:none; padding:1em}
h1 {font-size: 2.5em}
h2 {font-size: 2em}
h3 {font-size: 1.25em}
h4 {font-size: 1em}
p.intro {font-size:1em;}

.gamecaptionL, .gamecaptionR {margin:3em 5% !important}
blockquote {width:70% !important; padding:1em 3em !important; margin: 1em 10% 1em 0 !important; float:none !important}
.photoblock {width:100% !important; padding:0 !important; margin: 2em auto 1em auto !important; float:none !important; border:none !important; border-top:4px solid #373A36 !important; border-bottom:4px solid #373A36 !important}
.photoblock img {max-width:100% !important; margin:1.5em auto 1em auto !important}
p.quote {font-size: 1.25em; line-height: 1.5em; font-style: italic; color: #FFF; text-transform:uppercase; margin-bottom:0.25 !important}
blockquote .quote:before {top:0.5em; left:0.25em;}
blockquote .quote:after {content: "\201D"; bottom: 1.75em; right: 0.5em;}
blockquote.longform-series {width:80% !important; padding:0.5em 3em 0.5em 2em !important; margin: 1em auto !important}
blockquote.longform-series img {display:block !important}
#slideend p {font-size:0.8em !important; line-height:1.25 !important}
.honors {-webkit-column-count:1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0; -moz-column-gap: 0; column-gap: 0; -webkit-column-rule: none; -moz-column-rule: none; column-rule: none}
}
@media (max-width: 479px) {
h1 {font-size: 1.75em}
h2 {font-size: 1.5em}
h3 {font-size: 1.25em}
h4 {font-size: 1em}
p.intro {font-size:1em;}
}