/* @group Reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, main, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

body {
  line-height: 1; }

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main {
  display: block; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '"';
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

:focus {
  outline: 0; }

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none; }

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0; }

/* @end */
/* @group default margin/padding */
/*let's start with the lists*/
/* @end */
/* @group Forms */
form {
  margin: 0; }

legend {
  border: 0;
  *margin-left: -7px;
  text-shadow: 0 1px 1px #d4d4d4; }

input, select, label {
  vertical-align: middle; }

button, input, select, textarea {
  font-size: 100%; }

button, input {
  line-height: normal; }

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0; }

input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box; }

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

textarea {
  overflow: auto;
  vertical-align: top; }

/* @end */
@font-face {
  font-family: 'SizmoPro-Medium';
  src: url("../fonts/SizmoPro-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/SizmoPro-Medium.otf") format("opentype"), url("../fonts/SizmoPro-Medium.woff") format("woff"), url("../fonts/SizmoPro-Medium.ttf") format("truetype"), url("../fonts/SizmoPro-Medium.svg#SizmoPro-Medium") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'SizmoPro';
  src: url("../fonts/SizmoPro.eot?#iefix") format("embedded-opentype"), url("../fonts/SizmoPro.otf") format("opentype"), url("../fonts/SizmoPro.woff") format("woff"), url("../fonts/SizmoPro.ttf") format("truetype"), url("../fonts/SizmoPro.svg#SizmoPro") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'SizmoLinePro-Medium';
  src: url("../fonts/SizmoLinePro-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/SizmoLinePro-Medium.otf") format("opentype"), url("../fonts/SizmoLinePro-Medium.woff") format("woff"), url("../fonts/SizmoLinePro-Medium.ttf") format("truetype"), url("../fonts/SizmoLinePro-Medium.svg#SizmoLinePro-Medium") format("svg");
  font-weight: normal;
  font-style: normal; }

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

body {
  font: 100%/1.5 "SizmoPro-Medium";
  color: #F5F5ED;
  background-color: #000; }

html, body {
  height: 100%; }

img {
  max-width: 100%;
  height: auto; }

h1, h2, h3, h4, h5, h6 {
  color: #F5F5ED; }

p {
  margin: 0; }

a {
  color: #F5F5ED;
  text-decoration: none; }

.page a {
  text-decoration: underline; }

.chapter-image {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  z-index: -1;
  height: 100%;
  overflow-y: hidden; }

.page {
  display: none; }

.body {
  position: absolute;
  left: 0;
  right: 0;
  top: 5.3125rem;
  width: 100%;
  zoom: 1;
  clear: both;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch; }
  .body:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden; }

@media (max-width: 1022px) {
  .body {
    top: 3.125rem; } }

.logout-link {
  display: none; }

.page h2:first-child,
.page h3:first-child {
  margin-top: 0; }

.home-header {
  padding: 0 1.25rem;
  line-height: 5.3125rem;
  text-align: right; }
  .home-header h1.exhibition-title {
    font-family: "SizmoPro";
    font-style: italic;
    float: left;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: calc(100% - 5.3125rem - 40px);
    font-size: 3.125rem; }
  .home-header ul {
    list-style: none;
    margin: 2.8125rem 0 0 0;
    padding: 0;
    display: inline-block;
    line-height: 0.75rem; }
    .home-header ul li {
      display: inline-block; }
      .home-header ul li a {
        font-size: 1.375rem;
        margin: 0 0 0 0.625rem;
        padding: 0 0 0 0.625rem;
        border-left: 1px solid #fff; }
      .home-header ul li:first-child a {
        border-left: 0 none;
        margin: 0;
        padding: 0; }
      .home-header ul li.current a {
        text-decoration: underline; }

@media (max-width: 1022px) {
  .home-header {
    padding: 0 0.625rem;
    line-height: 3.125rem;
    text-align: right; }
    .home-header h1.exhibition-title {
      letter-spacing: -3px;
      font-size: 1.625rem; }
    .home-header ul {
      list-style: none;
      margin: 0;
      padding: 0;
      display: inline-block; }
      .home-header ul li {
        display: inline-block; }
        .home-header ul li a {
          font-size: 1.125rem;
          line-height: 0.5rem; } }

.chapter-nav {
  margin: 2rem 0 0 1.25rem;
  padding: 0;
  list-style: none; }
  .chapter-nav a {
    font-family: "SizmoLinePro-Medium";
    font-size: 2.75rem;
    line-height: 3.375rem;
    text-transform: uppercase;
    display: block;
    overflow: hidden;
    padding: 0.75rem 0;
    white-space: nowrap; }
    @media (max-width: 720px) {
      .chapter-nav a {
        font-size: 2rem;
        line-height: 2.625rem;
        padding: 0.5rem 0; } }
    .chapter-nav a .line {
      margin-left: -6px; }
  .chapter-nav.has-7-chapters a {
    font-size: 2.375rem;
    line-height: 3rem;
    padding: 0.5rem 0; }
    @media (max-width: 720px) {
      .chapter-nav.has-7-chapters a {
        font-size: 1.5rem;
        line-height: 2.125rem;
        padding: 0.375rem 0; } }
  .chapter-nav.has-8-chapters a {
    font-size: 2rem;
    line-height: 2.625rem;
    padding: 0.375rem 0; }
    @media (max-width: 720px) {
      .chapter-nav.has-8-chapters a {
        font-size: 1.375rem;
        line-height: 2rem;
        padding: 0.375rem 0; } }
  .chapter-nav.has-9-chapters a {
    font-size: 1.875rem;
    line-height: 2.375rem;
    padding: 0.375rem 0; }
    @media (max-width: 720px) {
      .chapter-nav.has-9-chapters a {
        font-size: 1.8125rem;
        line-height: 1.75rem;
        padding: 0.375rem 0; } }
.top-bar {
  background: transparent;
  zoom: 1;
  position: fixed;
  z-index: 2000;
  top: 0;
  left: 0;
  right: 0;
  height: 5.3125rem; }
  .top-bar:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden; }

.top-nav li {
  list-style: none;
  padding: 0;
  margin: 0; }

.top-nav ul > li {
  float: left; }

.top-nav .app-nav li span,
.top-nav .app-nav li a {
  text-decoration: none;
  display: block;
  width: 5.3125rem;
  cursor: pointer; }
  .top-nav .app-nav li span img,
  .top-nav .app-nav li a img {
    display: block; }

.top-nav li.current a,
.top-nav li.current > span {
  background: rgba(0, 0, 0, 0.65); }

.top-nav li.question-answer.current a {
  background: transparent; }

.top-nav {
  zoom: 1; }
  .top-nav:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden; }
  .top-nav h2.chapter-title {
    color: #F5F5ED;
    font-size: 3rem;
    line-height: 3rem;
    float: left;
    padding-top: 1.5rem;
    margin: 0 0 0 0.625rem;
    font-family: "SizmoLinePro-Medium";
    max-width: calc(100% - 435px);
    letter-spacing: -3px;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
  .top-nav .app-nav {
    float: right; }

.top-nav ul.sub-nav {
  position: absolute;
  top: 5.3125rem;
  right: 5.3125rem;
  background: transparent;
  display: none;
  width: 4 * 5.3125rem; }
  .top-nav ul.sub-nav li {
    background: transparent;
    float: none;
    margin-bottom: 0.625rem; }
    .top-nav ul.sub-nav li a {
      display: block;
      padding: 0.25rem 0.625rem;
      width: 100%;
      font-size: 1.375rem;
      text-transform: uppercase;
      line-height: 2rem;
      color: #F5F5ED; }

@media (max-width: 1022px) {
  .chapter-nav {
    margin: 0 0 0 0.625rem;
    padding: 0;
    list-style: none; }
    .chapter-nav a {
      font-family: "SizmoLinePro-Medium";
      font-size: 1.875rem;
      line-height: 2.125rem;
      text-transform: uppercase;
      padding: 0.3125rem 0;
      white-space: nowrap; }
      .chapter-nav a .line {
        margin-left: -4px; }
  .top-nav .app-nav li span,
  .top-nav .app-nav li a {
    width: 3.125rem; }
  .top-nav ul.sub-nav {
    top: 3.125rem;
    right: 3.125rem;
    width: 4 * 3.125rem; }
    .top-nav ul.sub-nav li {
      margin-bottom: 10px; }
      .top-nav ul.sub-nav li a {
        display: block;
        padding: 0.375rem 0.625rem;
        width: 100%;
        font-size: 1.125rem;
        text-transform: uppercase;
        line-height: 1.375rem;
        color: #F5F5ED; }
  .top-nav {
    zoom: 1; }
    .top-nav:after {
      content: ".";
      display: block;
      height: 0;
      clear: both;
      visibility: hidden; }
    .top-nav h2.chapter-title {
      font-size: 1.5rem;
      line-height: 1.5rem;
      float: left;
      padding-top: 1.0625rem;
      margin: 0 0 0 0.625rem;
      font-family: "SizmoLinePro-Medium";
      max-width: none;
      width: calc(100% - 260px);
      letter-spacing: inherit; } }

.resource-page {
  background-color: rgba(0, 0, 0, 0.65);
  margin-right: 5.3125rem;
  margin-left: 5.3125rem;
  padding: 0.75rem;
  color: #F5F5ED;
  zoom: 1; }
  .resource-page:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden; }
  .resource-page h3.headline {
    font-size: 1.5rem;
    line-height: 1.75rem;
    font-family: "SizmoPro-Medium";
    text-transform: uppercase;
    margin-bottom: 2.25rem; }
  .resource-page .lead,
  .resource-page .image-text,
  .resource-page .image-width-caption,
  .resource-page .legend-only,
  .resource-page .more {
    margin-bottom: 2.25rem;
    clear: both;
    font-size: 1.375rem;
    line-height: 1.75rem;
    font-family: "SizmoPro-Medium"; }
  .resource-page .lead {
    clear: both;
    padding-left: 0; }
  .resource-page .image-text {
    float: left;
    width: 100%; }
  .resource-page .legend-only,
  .resource-page .caption {
    padding-top: 0.75rem;
    width: 100%;
    font-size: 1rem;
    line-height: 1.3125rem;
    font-family: "SizmoPro-Medium"; }
  .resource-page figure img {
    display: block; }

@media (max-width: 1022px) {
  .resource-page {
    background-color: rgba(0, 0, 0, 0.65);
    margin-right: 3.125rem;
    margin-left: 3.125rem;
    padding: 0.75rem;
    zoom: 1; }
    .resource-page:after {
      content: ".";
      display: block;
      height: 0;
      clear: both;
      visibility: hidden; }
    .resource-page .lead,
    .resource-page .image-text,
    .resource-page .image-width-caption,
    .resource-page .legend-only,
    .resource-page .more {
      font-size: 1.25rem; } }

#panel {
  background-color: rgba(0, 0, 0, 0.65);
  margin-right: 5.3125rem;
  margin-left: 39.0625%;
  padding: 0.75rem;
  color: #F5F5ED;
  zoom: 1; }
  #panel:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden; }
  #panel h3.headline {
    font-size: 1.5rem;
    line-height: 1.75rem;
    font-family: "SizmoPro-Medium";
    text-transform: uppercase;
    margin-bottom: 2.25rem; }
  #panel .lead,
  #panel .image-text,
  #panel .image-width-caption,
  #panel .legend-only,
  #panel .more {
    margin-bottom: 2.25rem;
    clear: both;
    padding-left: 5.3125rem;
    font-size: 1.375rem;
    line-height: 1.75rem;
    font-family: "SizmoPro-Medium"; }
  #panel .lead {
    clear: both;
    padding-left: 0; }
  #panel .image-text {
    float: left;
    width: 100%; }
  #panel .caption {
    padding-top: 0.75rem; }
    #panel .caption.legend-only {
      padding-top: 0;
      margin-top: -1.5rem; }
  #panel .legend-only,
  #panel .caption {
    width: 100%;
    font-size: 1rem;
    line-height: 1.3125rem;
    font-family: "SizmoPro-Medium"; }
  #panel figure img {
    display: block; }

@media (max-width: 1022px) {
  #panel {
    background-color: rgba(0, 0, 0, 0.65);
    margin-right: 3.125rem;
    margin-left: 3.125rem;
    padding: 0.75rem;
    zoom: 1; }
    #panel:after {
      content: ".";
      display: block;
      height: 0;
      clear: both;
      visibility: hidden; }
    #panel .lead,
    #panel .image-text,
    #panel .image-width-caption,
    #panel .legend-only,
    #panel .more {
      padding-left: 3.125rem;
      font-size: 1.25rem; } }

.video-pages {
  height: 100%; }
  .video-pages .page {
    background: #000;
    height: 100%; }

video {
  max-width: 100%;
  background: rgba(0, 0, 0, 0.65); }

::-internal-media-controls-download-button {
  -webkit-appearance: -internal-media-download-button;
  display: none !important; }

.picture-in-picture-button,
::-webkit-media-controls-picture-in-picture-button,
::-webkit-media-controls-fullscreen-button {
  display: none; }

.circle {
  background: rgba(29, 75, 95, 0.8);
  width: 616px;
  height: 616px;
  border-radius: 50%;
  margin: 0 auto;
  vertical-align: middle;
  position: relative;
  font-size: 1.625rem;
  line-height: 1.9375rem;
  color: #F5F5ED; }

.inner-circle {
  position: absolute;
  top: 90px;
  left: 100px;
  width: 415px;
  height: 395px; }
  .string-length-l .inner-circle {
    top: 150px; }
  .string-length-xl .inner-circle {
    top: 110px; }

.circle p {
  overflow-wrap: break-word; }

.question {
  text-transform: uppercase; }

.answer {
  display: none;
  padding-top: 0.75rem; }

.show-answer {
  margin: 0.75rem 0 0 0; }
  .show-answer .button {
    cursor: pointer;
    display: inline-block;
    padding: 0.25rem;
    text-transform: initial;
    text-decoration: underline; }

@media (max-width: 1022px) {
  .circle {
    background: rgba(29, 75, 95, 0.8);
    width: 410px;
    height: 410px;
    border-radius: 50%;
    margin: 0 auto;
    vertical-align: middle;
    position: relative;
    font-size: 1.125rem;
    line-height: 1.4375rem; }
  .inner-circle {
    position: absolute;
    top: 60px;
    left: 60px;
    width: 320px;
    height: 320px; }
    .string-length-l .inner-circle {
      top: 100px; }
    .string-length-xl .inner-circle {
      top: 85px; } }

.edit {
  margin: 20px 20px 80px 20px; }
  .edit a {
    display: inline-block;
    padding: 5px 20px;
    border: 1px solid #F5F5ED;
    color: #F5F5ED; }

.template-video .video-page {
  margin: 20px; }

.instructions {
  margin: 0 20px 5px 20px; }

#add-video {
  padding: 20px;
  margin: 20px 20px 40px 20px;
  border: 1px solid #F5F5ED; }
  #add-video ul {
    list-style: none; }
  #add-video input[type=text] {
    padding: 5px 10px;
    background: #F5F5ED;
    border: 1px solid #F5F5ED;
    color: #000;
    font-family: courier;
    width: 480px;
    max-width: 100%; }
  #add-video .LanguageSupportLabel {
    display: none; }
  #add-video button {
    background: #000;
    border: 1px solid #F5F5ED;
    cursor: pointer;
    font-family: courier;
    color: #F5F5ED;
    display: inline-block;
    padding: 5px 10px;
    margin-top: 15px; }