::-moz-selection { background: #76a1b8; }

::selection { background: #76a1b8; }

.player { background: #043854; display: block; height: 100vmin; margin-left: -40px; margin-left: -5vw; margin-right: -40px; margin-right: -5vw; margin-top: 40px; margin-top: 5vw; margin-bottom: 0; overflow: hidden; position: relative; }

@media (max-width: 800px) { .player { margin-left: -40px; } }

@media (min-width: 1200px) { .player { margin-left: -60px; } }

@media (max-width: 800px) { .player { margin-right: -40px; } }

@media (min-width: 1200px) { .player { margin-right: -60px; } }

@media (max-width: 800px) { .player { margin-top: 40px; } }

@media (min-width: 1200px) { .player { margin-top: 60px; } }

.player:after { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #fff; opacity: 0.2; -webkit-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out; }

.player.clicked:after { display: none; }

.player.clicked .video-overlay-play-button { display: none; }

.player:hover .video-overlay-play-button { -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }

.player:hover .video-overlay-play-button circle { stroke: #f37320; }

.player:hover .video-overlay-play-button polygon { fill: #f37320; }

.player:hover:after { opacity: 0; -webkit-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out; }

.player .video-overlay-play-button { display: block; height: auto; margin: auto; max-width: 100px; position: absolute; position: absolute; top: 0; right: 0; bottom: 0; left: 0; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }

@media (min-width: 500px) { .player { height: 620px; } }

.rotunda .player { background: url("../img/rotunda.jpg"); background-size: cover; }

.poes_room .player { background: url("../img/poes_room.jpg"); background-size: cover; }

.applied_biomechanics .player { background: url("../img/applied_biomechanics.jpg"); background-size: cover; }

.national_anthem .player { background: url("../img/national_anthem.jpg"); background-size: cover; }

.inside_the_vault .player { background: url("../img/inside_the_vault.jpg"); background-size: cover; }

.view_from_pegasus .player { background: url("../img/view_from_pegasus.jpg"); background-size: cover; }

.rehearsing_opera .player { background: url("../img/rehearsing_opera.jpg"); background-size: cover; }

.player iframe { display: block; height: 100vmin; border: none; margin-bottom: 0; padding: 0; position: relative; border: 0; max-height: 100%; }

@media (min-width: 500px) { .player iframe { height: 620px; } }

.player .player-button { background: url("../img/rotunda_inner.jpg"); opacity: 0.25; outline: none; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; }

.controls { background: rgba(238, 238, 238, 0.75); display: none; margin-left: -40px; margin-left: -5vw; margin-right: -40px; margin-right: -5vw; margin-bottom: 80px; margin-bottom: 10vw; margin-top: 0; position: relative; padding-top: 10px; }

@media (max-width: 800px) { .controls { margin-left: -40px; } }

@media (min-width: 1200px) { .controls { margin-left: -60px; } }

@media (max-width: 800px) { .controls { margin-right: -40px; } }

@media (min-width: 1200px) { .controls { margin-right: -60px; } }

@media (max-width: 800px) { .controls { margin-bottom: 80px; } }

@media (min-width: 1200px) { .controls { margin-bottom: 120px; } }

.clicked + .controls { display: block; }

.controls > * { margin: 8px; cursor: pointer; opacity: 0.5; }

.controls > *:hover { opacity: 1; }

.toggleplay { display: inline-block; background: url("../vectors/ic_pause_black_24dp.svg"); background-size: 30px; width: 30px; height: 30px; }

.toggleplay.paused { background: url("../vectors/ic_play_arrow_black_24dp.svg"); background-size: 30px; }

.time { display: inline-block; height: 30px; vertical-align: top; line-height: 30px; }

.togglemute { display: inline-block; float: right; background: url("../vectors/ic_volume_up_black_24dp.svg"); background-size: 30px; width: 30px; height: 30px; }

.togglemute:after { content: ""; display: table; clear: both; }

.togglemute.muted { background: url("../vectors/ic_volume_off_black_24dp.svg"); background-size: 30px; }

noscript { display: block; font-size: 1.5em; margin-top: 2em; }

.wonder noscript p { max-width: 100%; }

@media (min-width: 800px) { .player { display: none; } }

.videoWrapper { margin-left: -40px; margin-left: -5vw; margin-right: -40px; margin-right: -5vw; margin-top: 40px; margin-top: 5vw; position: relative; width: calc(100% + 10vw); height: 75px; background-color: #000; }

@media (max-width: 800px) { .videoWrapper { margin-left: -40px; } }

@media (min-width: 1200px) { .videoWrapper { margin-left: -60px; } }

@media (max-width: 800px) { .videoWrapper { margin-right: -40px; } }

@media (min-width: 1200px) { .videoWrapper { margin-right: -60px; } }

@media (max-width: 800px) { .videoWrapper { margin-top: 40px; } }

@media (min-width: 1200px) { .videoWrapper { margin-top: 60px; } }

.videoWrapper43 { padding-top: 75%; }

.videoWrapper169 { padding-top: 56%; }

.videoIframe { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background-color: transparent; }

.videoPoster { position: absolute; top: 0; right: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; cursor: pointer; border: 0; outline: none; background-position: 50% 50%; background-size: 100% 100%; background-size: cover; text-indent: -999em; overflow: hidden; opacity: 1; -webkit-transition: opacity 800ms, height 0s; transition: opacity 800ms, height 0s; -webkit-transition-delay: 0s, 0s; transition-delay: 0s, 0s; }

.videoPoster:before { content: ''; position: absolute; top: 50%; left: 50%; width: 80px; height: 80px; margin: -40px 0 0 -40px; border: 5px solid #fff; border-radius: 100%; -webkit-transition: border-color 300ms; transition: border-color 300ms; }

.videoPoster:after { content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 0; margin: -20px 0 0 -10px; border-left: 40px solid #fff; border-top: 25px solid transparent; border-bottom: 25px solid transparent; -webkit-transition: border-color 300ms; transition: border-color 300ms; }

.videoPoster:hover:before, .videoPoster:focus:before { border-color: #f37320; }

.videoPoster:hover:after, .videoPoster:focus:after { border-left-color: #f37320; }

.videoWrapperActive .videoPoster { opacity: 0; height: 0; -webkit-transition-delay: 0s, 800ms; transition-delay: 0s, 800ms; }

.iframe-container { display: none; }

@media (min-width: 800px) { .iframe-container { display: block; } }

body { color: #000; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }

.main-content { background-color: #fff; overflow: hidden; padding-bottom: 40px; position: initial; }

.main-content h1, .main-content h2, .main-content h3 { margin: 0; }

.main-footer { position: relative; z-index: 100; }

.ftitle, .lede, .fsticky-text, .pq, .fstat { -webkit-transition: opacity .2s; transition: opacity .2s; }

.wf-loading .ftitle, .wf-loading .lede, .wf-loading .fsticky-text, .wf-loading .pq, .wf-loading .fstat { opacity: 0; }

.fhed-sm { font-family: "franklin-gothic-urw-comp", "FranklinGothic URW Comp", Tahoma, Verdana, Segoe, sans-serif; font-size: 14px; font-weight: 700; letter-spacing: 0.0428571429em; line-height: 1; text-transform: uppercase; }

.fheader { background-image: url("../img/dome_room.jpg"); background-size: cover; background-position: 50% 100%; color: #fff; margin: 0 auto; min-height: 135vmin; position: relative; z-index: 10; }

@media (min-width: 400px) { .fheader { background-position: 50% 55%; min-height: 90vmin; } }

.fheader .fcontent-column { position: absolute; top: 0; right: 0; bottom: 0; left: 0; top: initial; bottom: 4vmin; }

.fheader .ftitle { font-family: "franklin-gothic-urw", "FranklinGothic URW Comp", Tahoma, Verdana, Segoe, sans-serif; font-size: 50px; font-size: 8.3vw; font-weight: 900; line-height: 0.9; letter-spacing: -0.125vw; max-width: 66%; }

@media (max-width: 602.409638554px) { .fheader .ftitle { font-size: 50px; } }

@media (min-width: 1204.81927711px) { .fheader .ftitle { font-size: 100px; } }

@media (min-width: 700px) { .fheader .ftitle { margin-left: 0; max-width: 66%; } }

.fheader .fbyline { font-family: "franklin-gothic-urw", "FranklinGothic URW Comp", Tahoma, Verdana, Segoe, sans-serif; font-size: 17px; font-size: 4vw; font-weight: 700; letter-spacing: 0.25px; letter-spacing: 0.25vw; margin-top: 20px; margin-top: 1vw; line-height: 1.2; max-width: 65%; text-transform: uppercase; }

@media (max-width: 425px) { .fheader .fbyline { font-size: 17px; } }

@media (min-width: 650px) { .fheader .fbyline { font-size: 26px; } }

@media (max-width: 100px) { .fheader .fbyline { letter-spacing: 0.25px; } }

@media (min-width: 500px) { .fheader .fbyline { letter-spacing: 1.25px; } }

@media (max-width: 2000px) { .fheader .fbyline { margin-top: 20px; } }

@media (min-width: 4000px) { .fheader .fbyline { margin-top: 40px; } }

@media (min-width: 700px) { .fheader .fbyline { margin-left: 0; max-width: 40%; } }

.byline { color: #f37320; display: block; font-family: "franklin-gothic-urw", "FranklinGothic URW Comp", Tahoma, Verdana, Segoe, sans-serif; font-size: 17px; font-size: 4vw; letter-spacing: 0.25px; letter-spacing: 0.25vw; margin-bottom: 30px; margin-bottom: 3.5vw; line-height: 1.2; max-width: 65%; }

@media (max-width: 425px) { .byline { font-size: 17px; } }

@media (min-width: 650px) { .byline { font-size: 26px; } }

@media (max-width: 100px) { .byline { letter-spacing: 0.25px; } }

@media (min-width: 500px) { .byline { letter-spacing: 1.25px; } }

@media (max-width: 857.142857143px) { .byline { margin-bottom: 30px; } }

@media (min-width: 1428.57142857px) { .byline { margin-bottom: 50px; } }

.fcontent { position: relative; z-index: 20; }

section { display: block; margin-top: 120px; margin-top: 9vw; position: relative; }

@media (max-width: 1333.33333333px) { section { margin-top: 120px; } }

@media (min-width: 2555.55555556px) { section { margin-top: 230px; } }

section.fcontent-column h1 { display: block; font-weight: 900; font-size: 40px; font-size: 4vw; line-height: 1; margin-top: 30px; margin-top: 3.5vw; margin-bottom: 30px; margin-bottom: 3.5vw; position: relative; }

@media (max-width: 1000px) { section.fcontent-column h1 { font-size: 40px; } }

@media (min-width: 1200px) { section.fcontent-column h1 { font-size: 48px; } }

@media (max-width: 857.142857143px) { section.fcontent-column h1 { margin-top: 30px; } }

@media (min-width: 1428.57142857px) { section.fcontent-column h1 { margin-top: 50px; } }

@media (max-width: 857.142857143px) { section.fcontent-column h1 { margin-bottom: 30px; } }

@media (min-width: 1428.57142857px) { section.fcontent-column h1 { margin-bottom: 50px; } }

.preface.fcontent-column { padding-bottom: 0; }

.preface:after { border-bottom: 1px solid #000; content: ''; display: block; height: 60px; height: 14.5vw; position: relative; width: 100%; }

@media (max-width: 413.793103448px) { .preface:after { height: 60px; } }

@media (min-width: 1379.31034483px) { .preface:after { height: 200px; } }

.preface + .wonders { margin-top: 40px; margin-top: 3vw; }

@media (max-width: 1333.33333333px) { .preface + .wonders { margin-top: 40px; } }

@media (min-width: 2666.66666667px) { .preface + .wonders { margin-top: 80px; } }

.preface p { max-width: 680px; }

@media (min-width: 768px) { .preface p { max-width: 85%; width: 680px; } }

.st_twitter_custom { background: url(../vectors/twitter_share_icon_large.svg); height: 60px; pointer-events: all; width: 60px; }

.st_facebook_custom { background: url(../vectors/facebook_share_icon_large.svg); height: 60px; pointer-events: all; width: 60px; }

.st_email_custom { background: url(../vectors/email_share_icon_large.svg); height: 60px; pointer-events: all; width: 60px; }

.sharethis-buttons { display: none; height: 100%; margin: auto; max-width: 1640px; pointer-events: none; position: absolute; left: 0; right: 0; top: 176vw; width: 100%; z-index: 100; }

@media (min-width: 768px) { .sharethis-buttons { display: block; } }

.wonder .sharethis-buttons { display: block; top: initial; bottom: -50px; bottom: -5vw; left: 0; right: initial; }

@media (max-width: 1000px) { .wonder .sharethis-buttons { bottom: -50px; } }

@media (min-width: 2000px) { .wonder .sharethis-buttons { bottom: -100px; } }

@media (min-width: 1000px) { .wonder .sharethis-buttons { top: initial; bottom: 730px; bottom: 70vw; } }

@media (min-width: 1000px) and (max-width: 1042.85714286px) { .wonder .sharethis-buttons { bottom: 730px; } }

@media (min-width: 1000px) and (min-width: 1064.28571429px) { .wonder .sharethis-buttons { bottom: 745px; } }

.wonder .sharethis-buttons .st_twitter_custom { background: url(../vectors/twitter_share_icon_small.svg); height: 20px; width: 20px; }

.wonder .sharethis-buttons .st_facebook_custom { background: url(../vectors/facebook_share_icon_small.svg); height: 20px; width: 20px; }

.wonder .sharethis-buttons .st_email_custom { background: url(../vectors/email_share_icon_small.svg); height: 20px; width: 20px; }

.sharethis-wrapper { display: block; position: absolute; top: 40px; top: 8vw; right: 40px; right: 8vw; }

@media (max-width: 500px) { .sharethis-wrapper { top: 40px; } }

@media (min-width: 1000px) { .sharethis-wrapper { top: 80px; } }

@media (max-width: 500px) { .sharethis-wrapper { right: 40px; } }

@media (min-width: 1000px) { .sharethis-wrapper { right: 80px; } }

.wonder .sharethis-wrapper { top: initial; right: initial; bottom: 0; }

@media (min-width: 768px) { .wonder .sharethis-wrapper { right: 0; left: initial; } }

.sharethis-wrapper span { clear: both; color: #043854; display: block; font-weight: 700; opacity: 0.38; position: relative; text-transform: uppercase; -webkit-transition: opacity 0.25s ease-in-out; transition: opacity 0.25s ease-in-out; }

.sharethis-wrapper span:hover { opacity: 1; -webkit-transition: opacity 0.25s ease-in-out; transition: opacity 0.25s ease-in-out; }

.wonder .sharethis-wrapper span { display: inline-block; line-height: 0; opacity: 1; }

.wonder .sharethis-wrapper span.section_share { vertical-align: text-bottom; }

.wonder .sharethis-wrapper span.section_share:hover { opacity: 0.5; }

.sharethis-wrapper span + span { margin-top: 10px; margin-top: 2vw; }

@media (max-width: 500px) { .sharethis-wrapper span + span { margin-top: 10px; } }

@media (min-width: 1000px) { .sharethis-wrapper span + span { margin-top: 20px; } }

.wonder .sharethis-wrapper span + span { margin-top: 0; margin-left: 25px; margin-left: 0.5vw; }

@media (max-width: 400px) { .wonder .sharethis-wrapper span + span { margin-left: 2px; } }

@media (min-width: 800px) { .wonder .sharethis-wrapper span + span { margin-left: 4px; } }

.wonder { position: relative; margin-bottom: 145px; margin-bottom: 18.5vw; }

@media (max-width: 783.783783784px) { .wonder { margin-bottom: 145px; } }

@media (min-width: 1189.18918919px) { .wonder { margin-bottom: 220px; } }

.wonder + .wonder { margin-top: 145px; margin-top: 18.5vw; }

@media (max-width: 783.783783784px) { .wonder + .wonder { margin-top: 145px; } }

@media (min-width: 1189.18918919px) { .wonder + .wonder { margin-top: 220px; } }

.wonder p { font-weight: 300; line-height: 1.5; margin: 0 0 1.15em; max-width: 570px; }

.rotunda h1, .poes_room h1 { margin-top: 0; max-width: 66%; width: 200px; }

.applied_biomechanics h1 { margin-top: 0; max-width: 80%; width: 320px; }

.national_anthem h1, .inside_the_vault h1 { margin-top: 0; max-width: 80%; width: 520px; }

.view_from_pegasus h1, .rehearsing_opera h1 { margin-top: 0; max-width: 100%; width: 330px; }

.fcontent-column { font-family: "franklin-gothic-urw", "FranklinGothic URW Comp", Tahoma, Verdana, Segoe, sans-serif; font-size: 24px; letter-spacing: .02em; line-height: 1.9; margin-left: auto; margin-right: auto; padding: 20px; position: relative; }

@media (min-width: 320px) { .fcontent-column { padding: 20px 40px; } }

@media (min-width: 700px) { .fcontent-column { padding: 30px 110px; } }

@media (min-width: 1000px) { .fcontent-column { margin-left: auto; margin-right: auto; max-width: 42em; padding-bottom: 50px; padding-top: 50px; } }

.fcontent-column .wonder { font-size: 18px; width: 100%; }

.fcontent-column .wonder-inner { padding-bottom: 0; position: relative; }

@media (min-width: 768px) { .fcontent-column .wonder-inner { padding-bottom: 25px; padding-bottom: 5vw; } }

@media (min-width: 768px) and (max-width: 500px) { .fcontent-column .wonder-inner { padding-bottom: 25px; } }

@media (min-width: 768px) and (min-width: 800px) { .fcontent-column .wonder-inner { padding-bottom: 40px; } }

@media (min-width: 1000px) { .fcontent-column .wonder-inner { padding-bottom: 0; } }

.fcontent-column .wonder-inner p em { display: block; font-size: 20px; }

.fcontent-column .wonder-inner p a { color: #f37320; display: inline-block; font-weight: 700; text-decoration: underline; vertical-align: middle; }

.fcontent-column .wonder-inner p a.vr_link:before { background-repeat: no-repeat; background-size: contain; content: ''; display: inline-block; height: 20px; -webkit-transform: translateY(4px); transform: translateY(4px); margin-right: 10px; position: relative; width: 32px; background-image: url(../vectors/cardboard_logo.svg); background-position: center; background-repeat: no-repeat; background-size: contain; }

.fcontent-column p { font-weight: 300; line-height: 1.5; margin: 0 0 1.15em; }

.fcontent-column p a { color: #f37320; font-weight: 700; text-decoration: underline; }

.fcontent-column .fhed-sm { position: absolute; top: 40px; left: 20px; text-align: center; width: 80px; }

@media (max-width: 699px) { .fcontent-column .fhed-sm { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } }

@media (min-width: 1000px) { .fcontent-column .fhed-sm { top: 60px; } }

.fcontent-column .fhed-sm span { display: block; margin: 0 auto .75em; }

.fcontent-column .lede { font-family: "franklin-gothic-urw", "FranklinGothic URW Comp", Tahoma, Verdana, Segoe, sans-serif; font-weight: 700; text-transform: uppercase; }

.wf-loading .fcontent-column .lede { opacity: 0; }

.fcontent-column .pq { color: #76a1b8; font-family: "franklin-gothic-ext-comp-urw", "FranklinGothic URW Ext Comp", Tahoma, Verdana, Segoe, sans-serif; font-size: 36px; font-weight: 400; letter-spacing: 0.0277777778em; line-height: 1; margin: 1em 0; padding: 0; position: relative; text-transform: uppercase; z-index: 2; }

@media (min-width: 1000px) { .fcontent-column .pq { font-size: 48px; margin-right: -40px; } }
