body {
  position: absolute;
  margin: 0;
  height: 100%;
  width: 100%;
  min-height: 672px;
  min-width: 1024px;
  overflow: auto;
  background-image: url(../images/outsideApp02.gif);
}

#loadingScreen {
  position: absolute;
  height: 100%;
  width: 100%;
}

#loadingMessage {
  position: absolute;
  top: 50%;
  margin-top: -75px;
  width: 100%;
  color: #ffffff;
  text-align: center;
  font-size: 50pt;
  font-family: imfellPI;
}

.page {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -336px;
  margin-left: -512px;
  height: 672px;
  width: 1024px;
  overflow: hidden;
}

.scripts-screen-area, .notebook-screen-area {
  position: absolute;
  height: 672px;
  width: 1024px;
}

.scripts-screen-area {
  top: 0px;
  left: 0px;
}

.notebook-screen-area {
  top: 0px;
  right: 0px;
}

.hide {
  display: none !important;
}

.selectable {
  cursor: pointer;
  cursor: hand;
}

.fit-image {
  max-height: 100%;
  max-width: 100%;
}

.clear-image {
  height: 100%;
  width: 100%;
}

.hidden-button {
  background: transparent;
  border: none !important;
  font-size: 0;
}

.shadowed {
  box-shadow: 10px 10px 20px #333333;
}

/* Fonts */
@font-face {
  font-family: broadsheet;
  src: url(../fonts/broadsheet.woff);
}
@font-face {
  font-family: imfellEN;
  src: url(../fonts/IMFeENrm29C.woff);
}
@font-face {
  font-family: imfellGP;
  src: url(../fonts/IMFeGPrm29C.woff);
}
@font-face {
  font-family: imfellPI;
  src: url(../fonts/IMFePIrm29C.woff);
}
@font-face {
  font-family: imfellPIit;
  src: url(../fonts/IMFePIit29C.woff);
}
#dashboard {
  position: absolute;
  height: 100%;
  width: 100%;
  background-image: url(../images/dashboard/desktop.jpg);
  background-size: 100% 100%;
}

.dashboard-option {
  position: absolute;
}

#dashboardLogo {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -151.5px;
  margin-left: -138.5px;
  height: 389px;
  width: 277px;
}

#characterSelect {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -300.5px;
  margin-left: -396.5px;
  height: 601px;
  width: 793px;
  opacity: 1;
  background-image: url(../images/dashboard/charPickerPop.png);
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}

.character-select-hidden {
  opacity: 0 !important;
}

.character-select-list {
  position: absolute;
  top: 30%;
  left: 5%;
  right: 10%;
  height: 70%;
  width: 85%;
}

.character-select-name {
  height: 20%;
  width: 33.33%;
  color: #000000;
  float: left;
  text-align: center;
  font-size: 14pt;
  font-family: imfellPI;
}

#dashboardPortrait {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -224px;
  margin-left: -149.5px;
  height: 388px;
  width: 299px;
}

.dashboard-scripts {
  left: 0px;
  height: 672px;
  width: 119px;
  -webkit-transition: left 0.4s ease-in-out;
  -moz-transition: left 0.4s ease-in-out;
  -o-transition: left 0.4s ease-in-out;
  transition: left 0.4s ease-in-out;
}

.dashboard-scripts-hidden {
  left: -119px !important;
}

.dashboard-notebook {
  right: 0px;
  height: 672px;
  width: 96px;
  -webkit-transition: right 0.4s ease-in-out;
  -moz-transition: right 0.4s ease-in-out;
  -o-transition: right 0.4s ease-in-out;
  transition: right 0.4s ease-in-out;
}

.dashboard-notebook-hidden {
  right: -96px;
}

.dashboard-delegates {
  top: 0px;
  height: 96px;
  width: 1024px;
  -webkit-transition: top 0.4s ease-in-out;
  -moz-transition: top 0.4s ease-in-out;
  -o-transition: top 0.4s ease-in-out;
  transition: top 0.4s ease-in-out;
}

.dashboard-delegates-hidden {
  top: -96px;
}

.dashboard-scraps {
  bottom: 0px;
  height: 132px;
  width: 1024px;
  -webkit-transition: bottom 0.4s ease-in-out;
  -moz-transition: bottom 0.4s ease-in-out;
  -o-transition: bottom 0.4s ease-in-out;
  transition: bottom 0.4s ease-in-out;
}

.dashboard-scraps-hidden {
  bottom: -132px;
}

.character-link {
  position: absolute;
  top: 20%;
  left: 50%;
  margin-left: -200px;
  height: 50px;
  width: 400px;
  text-align: center;
  font-size: 30pt;
}

.character-link a {
  color: #ffffff;
  text-decoration: none;
}

#dashboardPopupBackground {
  position: absolute;
  height: 672px;
  width: 1024px;
  background-color: #000000;
  opacity: 0.4;
}

#settingsWindow {
  position: absolute;
  top: 90px;
  left: 325px;
  height: 518px;
  width: 394px;
  background-image: url(../images/dashboard/settings.png);
  background-size: 100% 100%;
  transform: rotate(0deg);
  z-index: 100;
  -webkit-transition: top 0.4s ease-in-out, left 0.4s ease-in-out, height 0.4s ease-in-out, width 0.4s ease-in-out;
  -moz-transition: top 0.4s ease-in-out, left 0.4s ease-in-out, height 0.4s ease-in-out, width 0.4s ease-in-out;
  -o-transition: top 0.4s ease-in-out, left 0.4s ease-in-out, height 0.4s ease-in-out, width 0.4s ease-in-out;
  transition: top 0.4s ease-in-out, left 0.4s ease-in-out, height 0.4s ease-in-out, width 0.4s ease-in-out;
}

#settingsWindowSelect {
  position: absolute;
  top: 500px;
  left: 85px;
  height: 95px;
  width: 230px;
}

.settings-window-minimized {
  top: 520px !important;
  left: 60px !important;
  height: 394px !important;
  width: 300px !important;
  transform: rotate(-10deg) !important;
}

.settings-window-hidden {
  top: 700px !important;
}

.settings-window-backgrounded {
  z-index: 0 !important;
}

#settingsOptions {
  position: absolute;
  top: 20%;
  left: 10%;
  width: 76%;
  text-align: center;
  opacity: 1;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}

.settings-options-hidden {
  opacity: 0 !important;
}

.settings-option {
  height: 70px;
  font-size: 20pt;
  font-family: imfellPI;
}

.settings-option a {
  color: #000000;
  text-decoration: none;
}

#scrapsBackground {
  position: absolute;
  top: -90px;
  height: 762px;
  width: 1024px;
  background-image: url(../images/scraps/scraps.png);
  background-size: 100% 100%;
  -webkit-transition: top 0.4s ease-in-out;
  -moz-transition: top 0.4s ease-in-out;
  -o-transition: top 0.4s ease-in-out;
  transition: top 0.4s ease-in-out;
}

.scraps-closed {
  top: 540px !important;
}

.scrap-draggable-area {
  position: absolute;
  top: 139px;
  left: 0px;
  height: 623px;
  width: 1024px;
  overflow: hidden;
}

.scrap-overlay {
  position: absolute;
  z-index: 500;
}

.scraps-button {
  position: absolute;
  top: 90px;
  left: 322px;
  height: 49px;
  width: 380px;
}

#scrapDropZone {
  position: absolute;
  top: 0px;
  left: 32px;
  height: 413px;
  width: 960px;
}

#shuffleButton {
  position: absolute;
  top: 95px;
  left: 82px;
}

#searchButton {
  position: absolute;
  top: 95px;
  right: 82px;
}

.search-popup-background {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  background-color: #000000;
  opacity: 0.4;
  z-index: 575;
}

#searchWindow {
  position: absolute;
  top: 90px;
  left: 686px;
  height: 461px;
  width: 290px;
  color: #000000;
  background-image: url(../images/scraps/searchPop.png);
  background-size: 100% 100%;
  text-align: center;
  z-index: 600;
}

#searchClose {
  position: absolute;
  top: 10px;
  left: 40px;
  height: 25px;
  width: 204px;
}

#searchInput {
  position: absolute;
  top: 25px;
  left: 23px;
  height: 62px;
  width: 202px;
  padding: 18px;
  text-align: center;
}

.search-input-digit {
  margin-top: 3%;
  width: 50%;
  float: left;
}

#searchDigits {
  position: absolute;
  top: 97px;
  height: 220px;
  width: 194px;
  padding: 45px;
}

.search-digit {
  height: 58px;
  width: 64px;
  float: left;
}

.scrap-container {
  position: absolute;
  top: 594px;
  height: 151px;
  width: 317px;
  color: #ffffff;
  font-size: 20pt;
  font-family: imfellPI;
  pointer-events: none;
  z-index: 12;
}

.scrap-box-body {
  position: absolute;
  height: 94%;
  width: 100%;
  margin-top: 4%;
  margin-bottom: 2%;
  margin-left: 3.5%;
  margin-right: -3.5%;
}

.yea-box {
  left: 23px;
  text-align: left;
}

.nay-box {
  right: 22px;
  text-align: right;
}

.unsure-box {
  left: 354px;
  text-align: center;
}

.uni-over {
  background-image: url(../images/scraps/highlight.png);
}

.scrap-any {
  position: absolute;
}

.scrap-full {
  padding: 18px 36px;
  background-image: url(../images/paperScrap_05_wShadow.png);
  background-size: 100% 100%;
}

.scrap-large {
  width: 570px;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: height 0.4s ease-in-out;
  -o-transition: height 0.4s ease-in-out;
  transition: height 0.4s ease-in-out;
}

.scrap-small-container {
  position: relative;
  height: 71px;
  width: 62px;
  float: left;
}

.scrap-small {
  padding-top: 10px;
  height: 71px;
  width: 62px;
  margin-top: -4px;
  margin-bottom: -4px;
  margin-left: -0.7px;
  margin-right: -0.7px;
  color: #000000;
  background-size: 100% 100%;
  text-align: center;
  pointer-events: all;
  cursor: pointer;
  cursor: hand;
  z-index: 15;
}

.scrap-small-selected {
  background-image: url(../images/scraps/scrapIcon_b.png);
}

.scrap-small-unselected {
  background-image: url(../images/scraps/scrapIcon.png);
}

.scrap-small-number {
  position: absolute;
  top: 25px;
  width: 40px;
  left: 6px;
}

.scrap-small-number img {
  height: 35px;
  width: 35px;
}

.scrap-heading {
  display: table;
  height: 70px;
  width: 100%;
  padding-bottom: 10px;
}

.scrap-heading-image-left {
  display: table-cell;
  float: left;
}

.scrap-heading-image-right {
  display: table-cell;
  float: right;
}

.scrap-heading-number {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

.scrap-body {
  text-align: justify;
  font-size: 12pt;
  line-height: 25px;
}

.scrap-body::first-letter {
  height: 36px;
  margin: 13px 8px 0px 0px;
  font-size: 40pt;
  float: left;
}

.scrap-box-large, .scrap-box-large-container {
  position: absolute;
  height: 413px;
  width: 1024px;
}

.scrap-box-large {
  top: 0px;
  left: 0px;
  -webkit-transition: top 0.4s ease-in-out;
  -moz-transition: top 0.4s ease-in-out;
  -o-transition: top 0.4s ease-in-out;
  transition: top 0.4s ease-in-out;
}

.scrap-box-large-hidden {
  top: -413px !important;
}

.scrap-box-large-current {
  z-index: 491 !important;
}

.scrap-box-large-container {
  top: 139px;
  left: 0px;
  overflow: hidden;
  z-index: 490;
}

.yea-box-large {
  background-image: url(../images/scraps/backdrop_blue.jpg);
}

.nay-box-large {
  background-image: url(../images/scraps/backdrop_red.jpg);
}

.unsure-box-large {
  background-image: url(../images/scraps/backdrop_grey.jpg);
}

.scrap-to-notes-button {
  position: absolute;
  top: 88%;
  right: 20px;
}

.scrap-box-scrap {
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left: -285px;
  overflow-y: auto;
}

.scrap-close-button {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 550;
}

#notebookBackground {
  position: absolute;
  top: 0px;
  left: -50px;
  height: 672px;
  width: 1074px;
  background-image: url(../images/notebook/notes.png);
  background-size: 100% 100%;
  overflow: hidden;
  -webkit-transition: left 0.4s ease-in-out;
  -moz-transition: left 0.4s ease-in-out;
  -o-transition: left 0.4s ease-in-out;
  transition: left 0.4s ease-in-out;
}

.notebook-closed {
  left: 928px !important;
}

.notes-button {
  position: absolute;
  left: 0%;
  height: 100%;
  width: 5.25%;
  z-index: 30;
}

#notebookMenuIcon {
  position: absolute;
  top: 0.75%;
  left: 29.62%;
  height: 36px;
  width: 430px;
  background-image: url(../images/notebook/notesDrop_blank.png);
}

#notebookSectionName {
  position: absolute;
  top: 10px;
  left: 42%;
  margin-left: -145px;
  width: 324px;
  height: 18px;
}

.notebook-menu-image {
  height: 18px;
  width: 324px;
  opacity: 0.5;
}

.notebook-intro-speech-icon {
  position: absolute;
  top: 0.75%;
  left: 11%;
}

#notebookMenuBackground {
  position: absolute;
  height: 672px;
  width: 1024px;
  background-color: #000000;
  opacity: 0.4;
  z-index: 99;
}

#notebookMenuPopup {
  position: absolute;
  top: -1.8%;
  left: 27%;
  height: 397px;
  width: 480px;
  background-image: url(../images/notebook/notesDropdwn.png);
  opacity: 1 !important;
  z-index: 100;
}

.notebook-menu-spacer {
  height: 4.9%;
  width: 100%;
}

.notebook-menu-item {
  padding: 12px;
  height: 4%;
  width: 95%;
  text-align: center;
  font-size: 10pt;
  cursor: pointer;
  cursor: hand;
}

.notebook-intro-speech {
  position: absolute;
  top: 9%;
  left: 7%;
  height: 545px;
  width: 366px;
  color: #000000;
  background-image: url(../images/notebook/paperScrap_00_Introsp_02.png);
  background-size: 100% 100%;
  float: left;
  text-align: center;
  font-family: imfellPI;
  z-index: 10;
}

.notebook-intro-speech-header {
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
}

.notebook-intro-speech-desc {
  font-size: 14pt;
}

.notebook-intro-speech-name {
  font-size: 20pt;
}

.notebook-intro-speech-body {
  height: 67.5%;
  padding: 15px;
  margin: 15px;
  text-align: justify;
  font-size: 14pt;
  overflow-y: auto;
}

.notebook-delegates-link {
  position: absolute;
  top: 92%;
  left: 2.5%;
}

.arguments-page, .arguments-page-mask, .essay-page {
  position: absolute;
  top: 11%;
  height: 80%;
  width: 42%;
  color: #000000;
  text-align: left;
  font-family: imfellPI;
  -webkit-transition: left 0.4s ease-in-out;
  -moz-transition: left 0.4s ease-in-out;
  -o-transition: left 0.4s ease-in-out;
  transition: left 0.4s ease-in-out;
}

.arguments-page, .essay-page {
  background-image: url(../images/notebook/paperScrap_04.png);
  background-size: 100% 100%;
}

.arguments-header {
  padding: 30px;
  font-family: imfellPIit;
  font-size: 24px;
  color: #330C00;
  line-spacing: 30px;
}

.arguments-for {
  left: 44%;
  z-index: 6;
  float: left;
}

.arguments-for-left {
  left: 8% !important;
}

.arguments-against {
  left: 88%;
  z-index: 8;
}

.arguments-against-left {
  left: 52% !important;
}

.page-mask {
  opacity: 0;
}

#notebookRubricIcon {
  position: absolute;
  top: 0.75%;
  left: 86.5%;
}

#rubricBackground {
  position: absolute;
  height: 672px;
  width: 1024px;
  background-color: #000000;
  opacity: 0.4;
  z-index: 100;
}

#rubricWindow {
  position: absolute;
  top: 5.5%;
  left: 50%;
  margin-left: -457.5px;
  transform: rotate(2deg);
  color: #ffffff;
  font-family: imfellPI;
  z-index: 100;
}

#notebookScrap {
  position: absolute;
  top: 9%;
  left: 7.5%;
  width: 422px;
  z-index: 20;
}

#notebookScrapHeading {
  padding: 30px 30px 0px 30px;
}

#notebookScrapBody {
  max-height: 360px;
  padding: 0px 15px 15px 15px;
  margin: 0px 15px 15px 15px;
}

#notebookScrapClose {
  width: 100%;
  margin-top: 10px;
  font-size: 10pt;
  cursor: pointer;
  cursor: hand;
}

.notebook-scrap-sorter-button {
  position: absolute;
  top: 0.25%;
  left: 5%;
  height: 43px;
  width: 245px;
}

#notebookScrapSorter {
  position: absolute;
}

#notebookScrapSorterBackground {
  position: absolute;
  height: 672px;
  width: 1024px;
  background-color: #000000;
  opacity: 0.4;
  z-index: 99;
}

#notebookScrapSorterPopup {
  position: absolute;
  left: -10px;
  height: 672px;
  width: 422px;
  opacity: 1;
  background-image: url(../images/notebook/notesSorter.png);
  z-index: 100;
}

.notebook-scrap-sorter-close {
  position: absolute;
  top: 1%;
  left: 14%;
  height: 4.5%;
  width: 58%;
}

.notebook-yea-box {
  top: 9.5%;
  left: 11.5%;
  height: 21.5%;
  width: 75.5%;
  text-align: left;
}

.notebook-unsure-box {
  top: 37.5%;
  left: 11.5%;
  height: 21.5%;
  width: 75.5%;
  text-align: center;
}

.notebook-nay-box {
  top: 66.2%;
  left: 11.5%;
  height: 21.5%;
  width: 75.5%;
  text-align: right;
}

.notebook-go-to-scraps {
  position: absolute;
  top: 90.75%;
  left: 11%;
  height: 34px;
  width: 326px;
}

.essay-questions-page {
  position: absolute;
  top: 11%;
  left: 9.5%;
  height: 80%;
  width: 42%;
  color: #000000;
  background-image: url(../images/notebook/paperScrap_04.png);
  background-size: 100% 100%;
  text-align: left;
  font-family: imfellPI;
  -webkit-transition: left 0.4s ease-in-out;
  -moz-transition: left 0.4s ease-in-out;
  -o-transition: left 0.4s ease-in-out;
  transition: left 0.4s ease-in-out;
}

.essay-questions-header {
  padding: 30px 30px 0px 30px;
  font-family: imfellPIit;
  font-size: 21px;
  color: #330C00;
  line-height: 30px;
}

.rebuttal-header {
  padding: 30px 30px 10px 30px;
  font-family: imfellPIit;
  font-size: 24px;
  color: #330C00;
  line-height: 50px;
}

.essay-header {
  padding: 30px 30px 10px 30px;
  font-family: imfellPIit;
  font-size: 24px;
  color: #330C00;
  line-height: 30px;
}

.essay-questions-body {
  height: 70%;
  padding: 0px 15px 15px 15px;
  margin: 15px;
  overflow-y: auto;
}

.essay-question {
  padding-bottom: 10px;
}

.essay-question-text {
  font-weight: bold;
}

.essay-question-entry {
  height: 100px;
  width: 96%;
  font-size: 12pt;
  font-family: imfellPI;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  resize: none;
  margin: 5px;
  outline: none;
}

.essay-page {
  left: 54.5%;
}

.essay-entry {
  width: 84%;
  height: 66%;
  line-height: 24px;
  text-align: left;
  font-size: 14pt;
  font-family: imfellPI;
  background-color: rgba(0, 0, 0, 0);
  border: 0;
  resize: none;
  margin: 0px 15px;
  padding: 0px 15px 15px 15px;
  outline: none;
}

.essay-questions-right {
  left: 49.5% !important;
}

.essay-right {
  left: 92% !important;
}

.submit-button {
  position: absolute;
  bottom: -0.75%;
  left: 86.5%;
}

.card-animation-mask {
  position: absolute;
  top: 17.25%;
  left: 7%;
  width: 93%;
  height: 602px;
  overflow: hidden;
}

.card-list {
  position: absolute;
  top: 5%;
  left: 1.5%;
  width: 433px;
  height: 602px;
  background-image: url(../images/notebook/glossaryEvents_bg.png);
  z-index: 20;
}

.card-list-body {
  top: 13%;
  left: 11%;
  height: 73.5%;
  width: 50.5%;
  padding: 0px 15px;
  margin: 0px 15px;
  font-size: 18pt;
  font-family: imfellPI;
  position: absolute;
  overflow-y: auto;
}

.card-list-entry {
  padding-top: 10px;
  padding-right: 5px;
  clear: both;
}

.glossary-icon {
  padding-right: 5px;
  width: 20px;
  height: 20px;
  float: left;
}

.card-list-term {
  float: left;
}

.card-frame {
  position: absolute;
  height: 419px;
  width: 633px;
  padding: 10px;
  color: #000000;
  background-image: url(../images/notebook/paperScrap_00_Events.png);
  background-size: 100% 100%;
  font-family: imfellPI;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  z-index: 10;
}

.card-left {
  left: -42%;
}

.card-center {
  left: 30%;
}

.card-right {
  left: 102%;
}

.glossary-card-title {
  padding-top: 12%;
  height: 20%;
  width: 100%;
  text-align: center;
  font-size: 30pt;
}

.event-card-title {
  padding-top: 3%;
  height: 20%;
  width: 100%;
  text-align: center;
  font-size: 30pt;
}

.card-body {
  margin-top: 7%;
  height: 60%;
  width: 90%;
  padding: 0px 15px;
  margin: 40px 15px 15px 15px;
  border: 0;
  resize: none;
  background-color: rgba(0, 0, 0, 0);
  font-size: 27pt;
  overflow-y: auto;
}

#scriptsBackground {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 672px;
  width: 1078px;
  background-image: url(../images/scripts/scriptsEmpty.png);
  background-size: 100% 100%;
  -webkit-transition: left 0.4s ease-in-out;
  -moz-transition: left 0.4s ease-in-out;
  -o-transition: left 0.4s ease-in-out;
  transition: left 0.4s ease-in-out;
}

.scripts-closed {
  left: -959px !important;
}

.scripts-button {
  position: absolute;
  right: 0px;
  height: 672px;
  width: 74px;
}

#scriptsContainer {
  position: absolute;
  height: 92%;
  width: 92%;
  padding-top: 4%;
  padding-left: 3%;
  padding-right: 5%;
  padding-bottom: 4%;
  float: left;
}

.script-icon {
  padding-top: 5%;
  padding-left: 1.5%;
  padding-right: 0.75%;
  padding-bottom: 5%;
  float: left;
}

.script-icon img {
  width: 100%;
  height: 100%;
}

#scriptWindowBackground {
  position: absolute;
  left: 0px;
  height: 672px;
  width: 1024px;
  background-color: #000000;
  opacity: 0.4;
  z-index: 10;
}

.script-window, .map-colonies, .map-british-empire {
  position: absolute;
  top: 30px;
  left: 78px;
  height: 602px;
  width: 868px;
  background-size: 100% 100%;
  z-index: 20;
}

.script-window {
  background-image: url(../images/scripts/scriptsPaper.jpg);
}

.map-colonies {
  transform: rotate(-2deg);
  background-image: url(../images/scripts/map_colonies.jpg);
}

.map-british-empire {
  transform: rotate(-3deg);
  background-image: url(../images/scripts/map_british-empire.jpg);
}

#scriptView {
  position: absolute;
  height: 530px;
  width: 778px;
  margin: 36px 45px;
  overflow-y: auto;
}

.script-title {
  margin-bottom: 10px;
  text-align: center;
  font-family: imfellPI;
  font-size: 24pt;
}

.script-ornament {
  margin-left: 103px;
  margin-right: 103px;
  width: 572px;
}

.script-text {
  padding: 0% 7.5%;
  font-family: imfellPI;
  font-size: 20pt;
}

.script-highlight {
  background-color: rgba(255, 255, 127, 0.3);
}

#delegatesBackground {
  position: absolute;
  top: 0%;
  height: 717px;
  width: 1024px;
  background-image: url(../images/delegates/delegateview.png);
  background-size: 100% 100%;
  -webkit-transition: top 0.4s ease-in-out;
  -moz-transition: top 0.4s ease-in-out;
  -o-transition: top 0.4s ease-in-out;
  transition: top 0.4s ease-in-out;
}

.delegates-closed {
  top: -621px !important;
}

.delegates-button {
  position: absolute;
  top: 86%;
  height: 7.5%;
  width: 100%;
}

#delegatesBody {
  position: absolute;
  height: 100%;
  width: 100%;
}

.delegates-name {
  position: absolute;
}

.character-card {
  position: absolute;
  left: 0px;
  height: 672px;
  width: 1024px;
  z-index: 100;
  -webkit-transition: top 0.4s ease-in-out;
  -moz-transition: top 0.4s ease-in-out;
  -o-transition: top 0.4s ease-in-out;
  transition: top 0.4s ease-in-out;
}

.character-card-hide {
  top: -672px;
}

.character-card-display {
  top: 0px;
}

#characterBackground {
  position: absolute;
  height: 100%;
  width: 100%;
  background-image: url(../images/delegates/charcard_bg.jpg);
}

.character-intro-speech {
  position: absolute;
  top: 0%;
  left: 10.4%;
  height: 90%;
  width: 36.8%;
  color: #000000;
  float: left;
  text-align: center;
  font-family: imfellPI;
  z-index: 10;
}

.character-intro-speech-banner {
  position: absolute;
  top: 0%;
  left: 9.8%;
  height: 72px;
  width: 161px;
}

.character-intro-speech-desc {
  font-size: 12pt;
}

.character-intro-speech-name {
  position: absolute;
  top: 21%;
  width: 100%;
  text-align: center;
  font-size: 20pt;
}

.character-intro-speech-body {
  position: absolute;
  top: 28%;
  height: 48%;
  padding-left: 5%;
  padding-right: 5%;
  text-align: justify;
  font-size: 14pt;
  overflow-y: auto;
}

.character-intro-speech-side {
  position: absolute;
  top: 83%;
  width: 90.5%;
  padding-left: 4%;
  padding-right: 5.5%;
}

.character-side-button {
  height: 30px;
  width: 50%;
  float: left;
  text-align: center;
  font-size: 14pt;
  cursor: pointer;
  cursor: hand;
}

.character-intro-notes-button {
  position: absolute;
  top: 91%;
  width: 100%;
  text-align: center;
}

#characterImage {
  position: absolute;
  top: 5%;
  left: 49%;
}

#howToBehave {
  position: absolute;
  bottom: 0%;
  left: 62%;
}

#howToBehaveBackground {
  position: absolute;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 50;
}

#howToBehavePopup {
  position: absolute;
  top: 5%;
  left: 48%;
  height: 77%;
  width: 39%;
  padding: 5%;
  color: #000000;
  background-image: url(../images/delegates/howtoPop.png);
  font-family: imfellPI;
  z-index: 90;
}

#howToBehaveTitle {
  padding: 2%;
  text-align: center;
  font-size: 20pt;
}

#howToBehaveBody {
  padding: 2%;
  text-align: left;
  font-size: 14pt;
}

#closeCharacterCard {
  position: absolute;
  top: 7%;
  right: 5%;
}

#exhortationsIcon {
  position: absolute;
  z-index: 10;
}

.default-exhortations-icon {
  top: 0.75%;
  left: 80.75%;
}

.notes-exhortations-icon {
  top: 0.75%;
  left: 72.75%;
}

.character-exhortations-icon {
  top: 6.9%;
  right: 10%;
}

#exhortationsBackground {
  position: absolute;
  height: 672px;
  width: 1024px;
  background-color: #000000;
  opacity: 0.4;
  z-index: 100;
}

#exhortationsPopup {
  position: absolute;
  top: 5.5%;
  left: 50%;
  margin-left: -457.5px;
  transform: rotate(2deg);
  z-index: 100;
}