/******************************************************************
Site Name: Blackmer Compressors IWP
Stylesheet: Main Stylesheet
******************************************************************/
@import url(../css/bootstrap.min.css);
/******************************************************************
SCSS Variables
******************************************************************/
@font-face {
  font-family: 'Roboto';
  src: url("../fonts/Roboto-Regular.ttf");
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: 'Roboto Bold';
  src: url("../fonts/Roboto-Bold.ttf");
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: 'Roboto Light';
  src: url("../fonts/Roboto-Light.ttf");
  font-weight: 300;
  font-style: normal; }

/******************************************************************
Forms
******************************************************************/
/***** Hubspot Contact Forms *****/
fieldset {
  max-width: 100% !important; }

fieldset > div {
  margin-bottom: 12px !important; }

fieldset label {
  font-size: 16px; }

.hs-form h3, .hbspt-form h3, .cta-content h3 {
  margin-top: 24px; }

.hs-form ul.inputs-list, .hbspt-form ul.inputs-list, .cta-content ul.inputs-list {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important; }

.hs-form ul.inputs-list li.hs-form-booleancheckbox, .hbspt-form ul.inputs-list li.hs-form-booleancheckbox, .cta-content ul.inputs-list li.hs-form-booleancheckbox {
  margin: 0; }

.hs-form ul.inputs-list li.hs-form-booleancheckbox input, .hbspt-form ul.inputs-list li.hs-form-booleancheckbox input, .cta-content ul.inputs-list li.hs-form-booleancheckbox input {
  margin-right: 10px; }

.hs-form ul.inputs-list li.hs-form-radio input, .hbspt-form ul.inputs-list li.hs-form-radio input, .cta-content ul.inputs-list li.hs-form-radio input {
  margin-right: 10px; }

.hs-form select:not(.primary), .hs-form input[type="text"], .hs-form input[type="email"], .hs-form input[type="tel"], .hs-form input[type="number"], .hs-form textarea, .hbspt-form select:not(.primary), .hbspt-form input[type="text"], .hbspt-form input[type="email"], .hbspt-form input[type="tel"], .hbspt-form input[type="number"], .hbspt-form textarea, .cta-content select:not(.primary), .cta-content input[type="text"], .cta-content input[type="email"], .cta-content input[type="tel"], .cta-content input[type="number"], .cta-content textarea {
  display: block;
  width: 100% !important;
  height: 44px;
  background-color: #fff;
  background-image: none;
  background-clip: padding-box;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  color: #495057;
  padding: .375rem .75rem;
  border: 1px solid #C7CCD1;
  border-radius: 0;
  -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; }

.hs-form select:not(.primary), .hbspt-form select:not(.primary), .cta-content select:not(.primary) {
  width: calc(50% - 90px);
  margin-bottom: 5px; }

.hs-form textarea, .hbspt-form textarea, .cta-content textarea {
  height: 150px; }

.hs-form .hs-dependent-field > div, .hbspt-form .hs-dependent-field > div, .cta-content .hs-dependent-field > div {
  padding-top: 12px; }

.hs-form .hs-dependent-field > div:first-of-type, .hbspt-form .hs-dependent-field > div:first-of-type, .cta-content .hs-dependent-field > div:first-of-type {
  padding: 0; }

.hs-form .legal-consent-container ul, .hbspt-form .legal-consent-container ul, .cta-content .legal-consent-container ul {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important; }

.hs-form .legal-consent-container ul li label, .hbspt-form .legal-consent-container ul li label, .cta-content .legal-consent-container ul li label {
  position: relative;
  font-size: 14px;
  font-weight: 500; }

.hs-form .legal-consent-container ul li label input, .hbspt-form .legal-consent-container ul li label input, .cta-content .legal-consent-container ul li label input {
  top: 5px;
  position: absolute; }

.hs-form .legal-consent-container ul li label span, .hbspt-form .legal-consent-container ul li label span, .cta-content .legal-consent-container ul li label span {
  display: inline-block;
  padding-left: 24px;
  margin: 0; }

.hs-form .legal-consent-container ul li label span p, .hbspt-form .legal-consent-container ul li label span p, .cta-content .legal-consent-container ul li label span p {
  font-size: 14px !important; }

.hs-form ul.hs-error-msgs, .hbspt-form ul.hs-error-msgs, .cta-content ul.hs-error-msgs {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important; }

.hs-form ul.hs-error-msgs li, .hbspt-form ul.hs-error-msgs li, .cta-content ul.hs-error-msgs li {
  margin: 0 !important; }

.hs-form ul.hs-error-msgs label, .hbspt-form ul.hs-error-msgs label, .cta-content ul.hs-error-msgs label {
  font-size: 14px;
  color: #c70e23;
  margin-bottom: 0; }

.hs-form .hs-recaptcha, .hbspt-form .hs-recaptcha, .cta-content .hs-recaptcha {
  margin-bottom: 24px; }

.hs-form .hs-recaptcha .grecaptcha-badge, .hbspt-form .hs-recaptcha .grecaptcha-badge, .cta-content .hs-recaptcha .grecaptcha-badge {
  box-shadow: #C7CCD1 0px 0px 1px !important; }

.hs-form input[type="submit"], .hbspt-form input[type="submit"], .cta-content input[type="submit"] {
  background-color: #004A8C;
  font-family: "proxima-nova", sans-serif;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff !important;
  margin: 0 15px 24px 0;
  padding: 10px 24px;
  border-radius: 0;
  border-color: transparent;
  -webkit-transition: background-color .24s ease-in-out;
  transition: background-color .24s ease-in-out;
  white-space: normal; }

.hs-form input[type="submit"]:hover, .hs-form input[type="submit"]:active, .hs-form input[type="submit"]:focus, .hs-form input[type="submit"]:active:hover, .hs-form input[type="submit"]:active:focus, .hbspt-form input[type="submit"]:hover, .hbspt-form input[type="submit"]:active, .hbspt-form input[type="submit"]:focus, .hbspt-form input[type="submit"]:active:hover, .hbspt-form input[type="submit"]:active:focus, .cta-content input[type="submit"]:hover, .cta-content input[type="submit"]:active, .cta-content input[type="submit"]:focus, .cta-content input[type="submit"]:active:hover, .cta-content input[type="submit"]:active:focus {
  color: #fff !important;
  background-color: #103370;
  border-color: transparent; }

.hbspt-form .field {
  margin-bottom: 24px; }

.hbspt-form .field.hs-fieldtype-booleancheckbox {
  margin: 0; }

.hbspt-form input[type="submit"] {
  margin: 0; }

.cta-content input[type="text"] {
  height: 40px; }

.cta-content select:not(.primary) {
  height: 40px; }

.form-group.repair-kit {
  margin-bottom: 40px;
  overflow: hidden; }

.form-group.repair-kit label {
  display: block; }

.form-group.repair-kit input[type="text"] {
  float: left;
  max-width: 300px;
  height: 44px;
  margin-right: 15px;
  margin-bottom: 12px; }

.form-group.repair-kit input[type="button"] {
  float: left; }

/******************************************************************
Base Stylesheet
******************************************************************/
/*****************************************
** Base Styling 
*****************************************/
body {
  font-family: "Roboto", Helvetica, Arial, sans-serif;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  background-color: #f4f4f4;
  transition: background-color .24s ease-in-out;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

h1, h2, h3, h4, h5, h6 {
  font-family: "Roboto Bold", Helvetica, Arial, sans-serif;
  font-weight: 700;
  color: #333333;
  line-height: 1.2;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 1.5vw; }
  h1 span, h2 span, h3 span, h4 span, h5 span, h6 span {
    white-space: nowrap; }
  h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: #004a8c;
    border-bottom: solid 1px transparent;
    transition: color .24s ease-in-out, border-color .24s ease-in-out; }
    h1 a:hover, h1 a:active, h1 a:focus, h1 a:active:hover, h1 a:active:focus, h2 a:hover, h2 a:active, h2 a:focus, h2 a:active:hover, h2 a:active:focus, h3 a:hover, h3 a:active, h3 a:focus, h3 a:active:hover, h3 a:active:focus, h4 a:hover, h4 a:active, h4 a:focus, h4 a:active:hover, h4 a:active:focus, h5 a:hover, h5 a:active, h5 a:focus, h5 a:active:hover, h5 a:active:focus, h6 a:hover, h6 a:active, h6 a:focus, h6 a:active:hover, h6 a:active:focus {
      text-decoration: none;
      color: #001426;
      border-color: #001426; }

h1 {
  font-size: 3.5vw; }
  h1 .subtitle {
    display: block;
    font-size: 1.5vw; }

h2 {
  font-size: 2vw; }

h3 {
  font-size: 1.75vw; }

h4 {
  font-size: 18px; }

.img-area img {
  cursor: pointer; }

img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border: none; }
  img.card {
    margin: 10px auto;
    border-radius: 8px;
    box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.15); }

p, li {
  font-size: 1.5vw;
  line-height: 1.25; }
  p a, li a {
    color: #004a8c;
    border-bottom: solid 1px transparent;
    transition: color .24s ease-in-out, border-color .24s ease-in-out; }
    p a:hover, p a:active, p a:focus, p a:active:hover, p a:active:focus, li a:hover, li a:active, li a:focus, li a:active:hover, li a:active:focus {
      color: #001426;
      text-decoration: none;
      border-color: #001426; }

.small p, .small li {
  font-size: 1.2vw;
  line-height: 1.25; }

p {
  margin-bottom: 30px; }
  p.larger {
    margin: 0; }

.centered {
  text-align: center; }

/*****************************************
** SVG Container + Functionality
*****************************************/
.svg-wrapper {
  width: 100vw;
  height: 100vh; }

.svg-container {
  display: block;
  position: relative;
  margin: auto;
  max-width: 1920px;
  max-height: 1080px;
  box-shadow: 0 0 12px 0px rgba(0, 0, 0, 0.5); }

/** Loading Screen **/
#cover {
  background: url(../images/loading.svg) no-repeat scroll center center #FFF;
  position: absolute;
  width: 100vw;
  height: 100vh;
  z-index: 100; }

.overlay {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #fff;
  /* The Fallback */
  background: rgba(255, 255, 255, 0.4); }

.brand-banner {
  position: absolute;
  bottom: 0px;
  border-bottom: 0.5vw solid #004a8c;
  width: 100%;
  height: 14%;
  z-index: 10; }
  .brand-banner .logo {
    height: 100%;
    padding: .7vw;
    width: 25%; }
    .brand-banner .logo img {
      height: 100%;
      width: auto !important; }
  .brand-banner .nav-links {
    position: absolute;
    right: 1vw;
    bottom: 0; }
    .brand-banner .nav-links button {
      font-size: 1.05vw;
      color: #fff;
      text-transform: uppercase;
      font-weight: 600;
      background-color: #004a8c;
      border: 0;
      padding: .4vw 1vw;
      display: inline-block;
      cursor: pointer; }

.screen {
  display: none;
  position: absolute;
  top: 1vw;
  left: 5.5vw;
  right: 5vw;
  bottom: 1vw;
  width: calc(100% - 10.5vw);
  height: calc(100% - 2.5vw); }
  .screen.active {
    display: block; }
    .screen.active .callout {
      display: block; }
    .screen.active.hide .callout {
      display: none; }
  .screen .title {
    max-width: 75%;
    width: auto;
    color: #fff;
    padding: 0 .6vw .6vw .6vw;
    text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.3); }

.box-modal {
  z-index: 10;
  background: #fff;
  /* The Fallback */
  background: rgba(255, 255, 255, 0.8);
  padding: 1.7vw; }
  .box-modal ul {
    margin: 0;
    padding: 0 0 0 2vw; }
    .box-modal ul li {
      margin: 1vw 0; }
  .box-modal .row {
    display: flex; }

.video-container {
  display: none;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%; }
  .video-container #video-player {
    width: 100%;
    z-index: 0; }
  .video-container.play {
    display: block; }

#replay {
  display: none;
  position: absolute;
  top: 1vw;
  right: 5vw;
  padding: 1vw;
  z-index: 11; }
  #replay .replay-btn i {
    margin-left: 7px; }
  #replay.active {
    display: block; }
    #replay.active.hide {
      display: none; }

#back {
  display: none;
  position: absolute;
  top: 1vw;
  left: 1vw;
  z-index: 10; }
  #back .back-btn {
    padding: 0.5vw 1vw;
    font-size: 1.5vw; }
  #back.active {
    display: block; }

.pulse {
  width: 48px;
  height: 48px;
  text-indent: -9999px;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 0 0 rgba(255, 255, 255, 0.4);
  animation: pulse 2s infinite;
  transition: background-color .24s ease-in-out;
  z-index: 25; }
  .pulse.pulse-close {
    background: #004a8c url("../images/icon_close.svg") no-repeat center center;
    background-size: 16px; }
  .pulse:hover, .pulse:active, .pulse:focus, .pulse:active:hover, .pulse:active:focus {
    background-color: #002f59;
    animation: none; }
  .pulse.text-label {
    text-indent: 0px;
    width: auto !important;
    height: auto !important;
    border-radius: 100px;
    font-size: 1.2vw;
    padding: .6vw 1.5vw;
    color: #fff;
    font-weight: bold;
    background: #004a8c; }
    .pulse.text-label .tag {
      clear: left;
      display: block;
      text-align: center;
      border-radius: 100px;
      font-size: .9vw;
      padding: 0vw .6vw .3vw .6vw;
      white-space: nowrap; }
    .pulse.text-label.toggle {
      position: absolute;
      top: 1vw;
      right: -3vw;
      width: 1vw !important;
      text-indent: -.3vw;
      padding-top: .65vw; }
  .pulse:not(.text-label) {
    background: #004a8c url("../images/icon_plus.svg") no-repeat center center;
    background-size: 16px; }

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4); }
  70% {
    box-shadow: 0 0 0 20px rgba(255, 255, 255, 0); }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); } }

/*****************************************
** Form Popup
*****************************************/
#form {
  display: none; }
  #form.active {
    display: block; }
  #form h1 {
    text-align: center;
    color: #004a8c; }
  #form iframe {
    width: 100% !important;
    overflow-y: scroll !important; }
  #form.form-wrapper {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99; }
    #form.form-wrapper #close {
      position: absolute;
      display: block;
      left: 73%;
      top: 3%;
      z-index: 100; }
      #form.form-wrapper #close .close-btn {
        display: block;
        padding: .4vw 1vw;
        font-size: 1.5vw;
        animation: none; }
  #form .form-container {
    position: absolute;
    top: -100%;
    left: 25%;
    width: 50%;
    max-height: 90%;
    display: block;
    background: #fff;
    padding: 1vw;
    border-radius: 2px;
    box-shadow: 0 0 18px 3px rgba(0, 0, 0, 0.5);
    overflow-y: scroll;
    transition: top .24s ease-in-out;
    transition-delay: .5s; }
    #form .form-container.active {
      top: 5%; }
  #form #hsForm_312f2bac-5797-4beb-8b45-13a23730a05c input[type="submit"] {
    background-color: #004a8c !important;
    text-transform: uppercase;
    border: 0;
    border-radius: 0px;
    padding: 15px 23px; }

#img-popup {
  display: none;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 99; }
  #img-popup.active {
    display: block; }
  #img-popup #close-img-popup {
    position: absolute;
    display: block;
    left: 63vw;
    top: 13%;
    z-index: 100; }
    #img-popup #close-img-popup .close-btn {
      display: block;
      padding: .4vw 1vw;
      font-size: 1.5vw;
      animation: none; }
  #img-popup img {
    position: absolute;
    top: 15%;
    left: 35vw;
    width: 30vw; }

#hiw {
  display: none;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 99; }
  #hiw.active {
    display: block; }
  #hiw #close-hiw {
    position: absolute;
    display: block;
    left: 84%;
    top: 13%;
    z-index: 100; }
    #hiw #close-hiw .close-btn {
      display: block;
      padding: .4vw 1vw;
      font-size: 1.5vw;
      animation: none; }
  #hiw h1 {
    text-align: center;
    color: #fff;
    background-color: #004a8c;
    position: absolute;
    width: 70%;
    top: 6%;
    font-size: 2.5vw;
    text-align: left;
    left: 15%;
    padding: 1vw 1.5vw;
    z-index: 99;
    line-height: 1; }
    #hiw h1 span {
      font-size: 1.5vw;
      line-height: 1.25; }
  #hiw #hiw-player {
    position: absolute;
    width: 70%;
    top: 15%;
    left: 15%; }

#ltvr {
  display: none;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 99; }
  #ltvr.active {
    display: block; }
  #ltvr #close-ltvr {
    position: absolute;
    display: block;
    left: 84%;
    top: 18%;
    z-index: 100; }
    #ltvr #close-ltvr .close-btn {
      display: block;
      padding: .4vw 1vw;
      font-size: 1.5vw;
      animation: none; }
  #ltvr h1 {
    text-align: center;
    color: #fff;
    background-color: #004a8c;
    position: absolute;
    width: 70%;
    top: 6%;
    font-size: 2.5vw;
    text-align: left;
    left: 15%;
    padding: 1vw 1.5vw;
    z-index: 99;
    line-height: 1; }
    #ltvr h1 span {
      font-size: 1.5vw;
      line-height: 1.25; }
  #ltvr #ltvr-player {
    position: absolute;
    width: 70%;
    top: 20%;
    left: 15%; }

/*****************************************
** SVG Styling + Touchpoints/Modals
*****************************************/
svg {
  max-width: 1920px;
  max-height: 1080px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom; }
  svg.contained {
    height: 100%; }
  svg.intro {
    background-image: url("../images/intro.jpg");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.index {
    background-image: url("../images/bg_main.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-1 {
    background-image: url("../images/ng.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-1.opened {
    background-image: url("../images/ng_ex.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-2 {
    background-image: url("../images/hd.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-2.opened {
    background-image: url("../images/hd_ex.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-3 {
    background-image: url("../images/lb.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-3.opened {
    background-image: url("../images/lb_ex.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-4 {
    background-image: url("../images/4.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-5 {
    background-image: url("../images/5.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-5A {
    background-image: url("../images/5A.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-5B {
    background-image: url("../images/5B.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-5C {
    background-image: url("../images/5C.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-5D {
    background-image: url("../images/5D.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }
  svg.modal-5E {
    background-image: url("../images/5E.png");
    -moz-transition: background-image 0.2s ease-in-out;
    -o-transition: background-image 0.2s ease-in-out;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out; }

.callout {
  display: none;
  cursor: pointer; }

#intro-callout {
  position: absolute;
  top: 50%;
  left: 59%;
  padding: 1vh 1.25vh; }

#callout-1 {
  position: absolute;
  top: 49%;
  left: 8%;
  width: 15vw !important; }

#modal-1-screen #modal-1 {
  width: 75%; }

#callout-1-1 {
  position: absolute;
  top: 89%;
  left: 58%; }

#callout-1-2 {
  position: absolute;
  top: 34%;
  left: 29%; }

#callout-1-3 {
  position: absolute;
  top: 72%;
  left: 50%; }

#callout-1-4 {
  position: absolute;
  top: 69%;
  left: 71%; }

#callout-1-5 {
  position: absolute;
  top: 54%;
  left: 71%; }

#callout-1-6 {
  position: absolute;
  top: 26%;
  left: 71%; }

#callout-1-7 {
  position: absolute;
  top: 14%;
  left: 34%; }

#callout-1-8 {
  position: absolute;
  top: 51%;
  left: 28%; }

#callout-1-9 {
  position: absolute;
  top: 62%;
  left: 71%; }

#callout-1-10 {
  position: absolute;
  top: 9%;
  left: 84%; }

#callout-2 {
  position: absolute;
  top: 49%;
  left: 42%;
  width: 15vw !important; }

#modal-2-screen #modal-2 {
  width: 75%; }

#callout-2-1 {
  position: absolute;
  top: 87%;
  left: 58%; }

#callout-2-2 {
  position: absolute;
  top: 43%;
  left: 32%; }

#callout-2-3 {
  position: absolute;
  top: 70%;
  left: 64%; }

#callout-2-4 {
  position: absolute;
  top: 60%;
  left: 69%; }

#callout-2-5 {
  position: absolute;
  top: 30%;
  left: 69%; }

#callout-2-6 {
  position: absolute;
  top: 7%;
  left: 70%; }

#callout-2-7 {
  position: absolute;
  top: 27%;
  left: 28%; }

#callout-2-8 {
  position: absolute;
  top: 51%;
  left: 27%; }

#callout-2-9 {
  position: absolute;
  top: 53%;
  left: 69%; }

#callout-2-10 {
  position: absolute;
  top: 9%;
  left: 84%; }

#callout-3 {
  position: absolute;
  top: 49%;
  left: 76%;
  width: 15vw !important; }

#modal-3-screen #modal-3 {
  width: 75%; }

#callout-3-1 {
  position: absolute;
  top: 86%;
  left: 59%; }

#callout-3-2 {
  position: absolute;
  top: 31%;
  left: 30%; }

#callout-3-3 {
  position: absolute;
  top: 62%;
  left: 69%; }

#callout-3-4 {
  position: absolute;
  top: 48%;
  left: 73%; }

#callout-3-5 {
  position: absolute;
  top: 28%;
  left: 74%; }

#callout-3-6 {
  position: absolute;
  top: 14%;
  left: 35%; }

#callout-3-7 {
  position: absolute;
  top: 9%;
  left: 84%; }

#callout-4 {
  position: absolute;
  top: 47%;
  left: 43%; }

#modal-4-screen #modal-4 {
  width: 75%; }

#callout-5 {
  position: absolute;
  top: 53%;
  left: 71%; }

#callout-5A {
  position: absolute;
  top: 28%;
  left: 21%; }

#modal-5A-screen #modal-5A {
  width: 75%; }

#callout-5B {
  position: absolute;
  top: 52%;
  left: 26%; }

#modal-5B-screen #modal-5B {
  width: 75%; }

#callout-5C {
  position: absolute;
  top: 59%;
  left: 52%; }

#modal-5C-screen #modal-5C {
  width: 75%; }

#callout-5D {
  position: absolute;
  top: 12%;
  left: 36%; }

#modal-5D-screen #modal-5D {
  width: 75%; }

#callout-5E {
  position: absolute;
  top: 48%;
  left: 68%; }

#modal-5E-screen #modal-5E {
  width: 75%; }

@media only screen and (min-width: 576px) {
  /******************************************************************
Mobile Landscape Stylesheet
******************************************************************/ }

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

@media only screen and (min-width: 992px) {
  /******************************************************************
Bootstrap Medium Stylesheet
******************************************************************/ }

@media only screen and (min-width: 1200px) and (max-height: 685px) {
  /******************************************************************
Base Stylesheet
******************************************************************/
  /*****************************************
** Base Styling 
*****************************************/
  body {
    font-family: "Roboto", Helvetica, Arial, sans-serif;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background-color: #f4f4f4;
    transition: background-color .24s ease-in-out;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }
  h1, h2, h3, h4, h5, h6 {
    font-family: "Roboto Bold", Helvetica, Arial, sans-serif;
    font-weight: 700;
    color: #333333;
    line-height: 1.2;
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 1.5vw; }
    h1 span, h2 span, h3 span, h4 span, h5 span, h6 span {
      white-space: nowrap; }
    h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
      color: #004a8c;
      border-bottom: solid 1px transparent;
      transition: color .24s ease-in-out, border-color .24s ease-in-out; }
      h1 a:hover, h1 a:active, h1 a:focus, h1 a:active:hover, h1 a:active:focus, h2 a:hover, h2 a:active, h2 a:focus, h2 a:active:hover, h2 a:active:focus, h3 a:hover, h3 a:active, h3 a:focus, h3 a:active:hover, h3 a:active:focus, h4 a:hover, h4 a:active, h4 a:focus, h4 a:active:hover, h4 a:active:focus, h5 a:hover, h5 a:active, h5 a:focus, h5 a:active:hover, h5 a:active:focus, h6 a:hover, h6 a:active, h6 a:focus, h6 a:active:hover, h6 a:active:focus {
        text-decoration: none;
        color: #001426;
        border-color: #001426; }
  h1 {
    font-size: 175%; }
    h1 .subtitle {
      display: block;
      font-size: 50%; }
  h2 {
    font-size: 2vw; }
  h3 {
    font-size: 1.75vw; }
  h4 {
    font-size: 18px; }
  img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    border: none; }
    img.card {
      margin: 10px auto;
      border-radius: 8px;
      box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.15); }
  p, li {
    font-size: 115%;
    line-height: 1.25; }
    p a, li a {
      color: #004a8c;
      border-bottom: solid 1px transparent;
      transition: color .24s ease-in-out, border-color .24s ease-in-out; }
      p a:hover, p a:active, p a:focus, p a:active:hover, p a:active:focus, li a:hover, li a:active, li a:focus, li a:active:hover, li a:active:focus {
        color: #001426;
        text-decoration: none;
        border-color: #001426; }
  .small p, .small li {
    font-size: 1.2vw;
    line-height: 1.25; }
  p {
    margin-bottom: 30px; }
    p.larger {
      margin: 0; }
  .centered {
    text-align: center; }
  /*****************************************
** SVG Container + Functionality
*****************************************/
  .svg-wrapper {
    width: 100vw;
    height: 100vh; }
  .svg-container {
    display: block;
    position: relative;
    margin: auto;
    max-width: 1920px;
    max-height: 1080px;
    box-shadow: 0 0 12px 0px rgba(0, 0, 0, 0.5); }
  /** Loading Screen **/
  #cover {
    background: url(../images/loading.svg) no-repeat scroll center center #FFF;
    position: absolute;
    width: 100vw;
    height: 100vh;
    z-index: 100; }
  .overlay {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #fff;
    /* The Fallback */
    background: rgba(255, 255, 255, 0.4); }
  .brand-banner {
    position: absolute;
    bottom: 0px;
    border-bottom: 0.5vw solid #004a8c;
    width: 100%;
    height: 14%;
    z-index: 10; }
    .brand-banner .logo {
      height: 100%;
      padding: .7vw;
      width: 25%; }
      .brand-banner .logo img {
        height: 100%; }
    .brand-banner .nav-links {
      position: absolute;
      right: 1vw;
      bottom: 0; }
      .brand-banner .nav-links button {
        font-size: 65%;
        color: #fff;
        text-transform: uppercase;
        font-weight: 600;
        background-color: #004a8c;
        border: 0;
        padding: .4vw 1vw;
        display: inline-block;
        cursor: pointer; }
  .screen {
    display: none;
    position: absolute;
    top: 1vw;
    left: 5.5vw;
    right: 5vw;
    bottom: 1vw;
    width: calc(100% - 10.5vw);
    height: calc(100% - 2.5vw); }
    .screen.active {
      display: block; }
      .screen.active .callout {
        display: block; }
      .screen.active.hide .callout {
        display: none; }
    .screen .title {
      max-width: 75%;
      width: auto;
      color: #fff;
      padding: 0 .6vw .6vw .6vw;
      text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.3); }
  .box-modal {
    z-index: 10;
    background: #fff;
    /* The Fallback */
    background: rgba(255, 255, 255, 0.8);
    padding: 1.7vw;
    max-height: 70vh;
    overflow: auto; }
    .box-modal ul {
      margin: 0;
      padding: 0 0 0 2vw; }
      .box-modal ul li {
        margin: 2% 0; }
    .box-modal .row {
      display: flex; }
  .video-container {
    display: none;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%; }
    .video-container #video-player {
      width: 100%;
      z-index: 0; }
    .video-container.play {
      display: block; }
  #replay {
    display: none;
    position: absolute;
    top: 1vw;
    right: 5vw;
    padding: 1vw;
    z-index: 11; }
    #replay .replay-btn i {
      margin-left: 7px; }
    #replay.active {
      display: block; }
      #replay.active.hide {
        display: none; }
  #back {
    display: none;
    position: absolute;
    top: 1vw;
    left: 1vw;
    z-index: 10; }
    #back .back-btn {
      padding: 0.5vw 1vw;
      font-size: 90%; }
    #back.active {
      display: block; }
  .pulse {
    width: 48px;
    height: 48px;
    text-indent: -9999px;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 0 0 rgba(255, 255, 255, 0.4);
    animation: pulse 2s infinite;
    transition: background-color .24s ease-in-out;
    z-index: 25; }
    .pulse.pulse-close {
      background: #004a8c url("../images/icon_close.svg") no-repeat center center;
      background-size: 16px; }
    .pulse:hover, .pulse:active, .pulse:focus, .pulse:active:hover, .pulse:active:focus {
      background-color: #002f59;
      animation: none; }
    .pulse.text-label {
      text-indent: 0px;
      width: auto !important;
      height: auto !important;
      border-radius: 100px;
      font-size: 60%;
      padding: 0.4vw 1.2vw;
      color: #fff;
      font-weight: bold;
      background: #004a8c; }
      .pulse.text-label .tag {
        clear: left;
        display: block;
        text-align: center;
        font-size: 60%;
        padding: 0vw;
        white-space: nowrap; }
      .pulse.text-label.toggle {
        position: absolute;
        top: 1vw;
        right: -3vw;
        width: 0vw !important;
        text-indent: -.2vw;
        padding-top: .4vw; }
    .pulse:not(.text-label) {
      background: #004a8c url("../images/icon_plus.svg") no-repeat center center;
      background-size: 16px; }
  @keyframes pulse {
    0% {
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4); }
    70% {
      box-shadow: 0 0 0 20px rgba(255, 255, 255, 0); }
    100% {
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); } }
  /*****************************************
** Form Popup
*****************************************/
  #form {
    display: none; }
    #form.active {
      display: block; }
    #form h1 {
      text-align: center;
      color: #004a8c; }
    #form iframe {
      width: 100% !important;
      overflow-y: scroll !important; }
    #form.form-wrapper {
      position: absolute;
      top: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.5);
      z-index: 99; }
      #form.form-wrapper #close {
        position: absolute;
        display: block;
        left: 73%;
        top: 3%;
        z-index: 100; }
        #form.form-wrapper #close .close-btn {
          display: block;
          padding: .4vw 1vw;
          font-size: 1.5vw;
          animation: none; }
    #form .form-container {
      position: absolute;
      top: -100%;
      left: 25%;
      width: 50%;
      max-height: 90%;
      display: block;
      background: #fff;
      padding: 1vw;
      border-radius: 2px;
      box-shadow: 0 0 18px 3px rgba(0, 0, 0, 0.5);
      overflow-y: scroll;
      transition: top .24s ease-in-out;
      transition-delay: .5s; }
      #form .form-container.active {
        top: 5%; }
    #form #hsForm_312f2bac-5797-4beb-8b45-13a23730a05c input[type="submit"] {
      background-color: #004a8c !important;
      text-transform: uppercase;
      border: 0;
      border-radius: 0px;
      padding: 15px 23px; }
  #img-popup {
    display: none;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99; }
    #img-popup.active {
      display: block; }
    #img-popup #close-img-popup {
      position: absolute;
      display: block;
      left: 68%;
      top: 13%;
      z-index: 100; }
      #img-popup #close-img-popup .close-btn {
        display: block;
        padding: .4vw 1vw;
        font-size: 1.5vw;
        animation: none; }
    #img-popup img {
      position: absolute;
      top: 15%;
      left: 30%;
      width: 40%; }
  #hiw {
    display: none;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99; }
    #hiw.active {
      display: block; }
    #hiw #close-hiw {
      position: absolute;
      display: block;
      left: 84%;
      top: 13%;
      z-index: 100; }
      #hiw #close-hiw .close-btn {
        display: block;
        padding: .4vw 1vw;
        font-size: 1.5vw;
        animation: none; }
    #hiw h1 {
      text-align: center;
      color: #fff;
      background-color: #004a8c;
      position: absolute;
      width: 70%;
      top: 6%;
      font-size: 2.5vw;
      text-align: left;
      left: 15%;
      padding: 1vw 1.5vw;
      z-index: 99;
      line-height: 1; }
      #hiw h1 span {
        font-size: 1.5vw;
        line-height: 1.25; }
    #hiw #hiw-player {
      position: absolute;
      width: 70%;
      top: 15%;
      left: 15%; }
  #ltvr {
    display: none;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99; }
    #ltvr.active {
      display: block; }
    #ltvr #close-ltvr {
      position: absolute;
      display: block;
      left: 84%;
      top: 18%;
      z-index: 100; }
      #ltvr #close-ltvr .close-btn {
        display: block;
        padding: .4vw 1vw;
        font-size: 1.5vw;
        animation: none; }
    #ltvr h1 {
      text-align: center;
      color: #fff;
      background-color: #004a8c;
      position: absolute;
      width: 70%;
      top: 6%;
      font-size: 2.5vw;
      text-align: left;
      left: 15%;
      padding: 1vw 1.5vw;
      z-index: 99;
      line-height: 1; }
      #ltvr h1 span {
        font-size: 1.5vw;
        line-height: 1.25; }
    #ltvr #ltvr-player {
      position: absolute;
      width: 70%;
      top: 20%;
      left: 15%; }
  /*****************************************
** SVG Styling + Touchpoints/Modals
*****************************************/
  svg {
    max-width: 1920px;
    max-height: 1080px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom; }
    svg.contained {
      height: 100%; }
    svg.intro {
      background-image: url("../images/intro.jpg");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.index {
      background-image: url("../images/bg_main.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-1 {
      background-image: url("../images/ng.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-1.opened {
      background-image: url("../images/ng_ex.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-2 {
      background-image: url("../images/hd.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-2.opened {
      background-image: url("../images/hd_ex.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-3 {
      background-image: url("../images/lb.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-3.opened {
      background-image: url("../images/lb_ex.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-4 {
      background-image: url("../images/4.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-5 {
      background-image: url("../images/5.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-5A {
      background-image: url("../images/5A.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-5B {
      background-image: url("../images/5B.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-5C {
      background-image: url("../images/5C.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-5D {
      background-image: url("../images/5D.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
    svg.modal-5E {
      background-image: url("../images/5E.png");
      -moz-transition: background-image 0.2s ease-in-out;
      -o-transition: background-image 0.2s ease-in-out;
      -webkit-transition: background-image 0.2s ease-in-out;
      transition: background-image 0.2s ease-in-out; }
  .callout {
    display: none;
    cursor: pointer; }
  #intro-callout {
    position: absolute;
    top: 50%;
    left: 59%;
    padding: 1vh 1.25vh; }
  #callout-1 {
    position: absolute;
    top: 49%;
    left: 6%;
    width: auto !important; }
  #modal-1-screen #modal-1 {
    width: 75%; }
  #callout-1-1 {
    position: absolute;
    top: 89%;
    left: 58%; }
  #callout-1-2 {
    position: absolute;
    top: 34%;
    left: 29%; }
  #callout-1-3 {
    position: absolute;
    top: 72%;
    left: 50%; }
  #callout-1-4 {
    position: absolute;
    top: 69%;
    left: 71%; }
  #callout-1-5 {
    position: absolute;
    top: 54%;
    left: 71%; }
  #callout-1-6 {
    position: absolute;
    top: 26%;
    left: 71%; }
  #callout-1-7 {
    position: absolute;
    top: 14%;
    left: 34%; }
  #callout-1-8 {
    position: absolute;
    top: 51%;
    left: 28%; }
  #callout-1-9 {
    position: absolute;
    top: 62%;
    left: 71%; }
  #callout-1-10 {
    position: absolute;
    top: 9%;
    left: 84%; }
  #callout-2 {
    position: absolute;
    top: 49%;
    left: 44%;
    width: auto !important; }
  #modal-2-screen #modal-2 {
    width: 75%; }
  #callout-2-1 {
    position: absolute;
    top: 87%;
    left: 58%; }
  #callout-2-2 {
    position: absolute;
    top: 43%;
    left: 32%; }
  #callout-2-3 {
    position: absolute;
    top: 70%;
    left: 64%; }
  #callout-2-4 {
    position: absolute;
    top: 60%;
    left: 69%; }
  #callout-2-5 {
    position: absolute;
    top: 30%;
    left: 69%; }
  #callout-2-6 {
    position: absolute;
    top: 7%;
    left: 70%; }
  #callout-2-7 {
    position: absolute;
    top: 27%;
    left: 28%; }
  #callout-2-8 {
    position: absolute;
    top: 51%;
    left: 27%; }
  #callout-2-9 {
    position: absolute;
    top: 53%;
    left: 69%; }
  #callout-2-10 {
    position: absolute;
    top: 9%;
    left: 84%; }
  #callout-3 {
    position: absolute;
    top: 49%;
    left: 76%;
    width: auto !important; }
  #modal-3-screen #modal-3 {
    width: 75%; }
  #callout-3-1 {
    position: absolute;
    top: 86%;
    left: 59%; }
  #callout-3-2 {
    position: absolute;
    top: 31%;
    left: 30%; }
  #callout-3-3 {
    position: absolute;
    top: 62%;
    left: 69%; }
  #callout-3-4 {
    position: absolute;
    top: 48%;
    left: 73%; }
  #callout-3-5 {
    position: absolute;
    top: 28%;
    left: 74%; }
  #callout-3-6 {
    position: absolute;
    top: 14%;
    left: 35%; }
  #callout-3-7 {
    position: absolute;
    top: 9%;
    left: 84%; }
  #callout-4 {
    position: absolute;
    top: 47%;
    left: 43%; }
  #modal-4-screen #modal-4 {
    width: 75%; }
  #callout-5 {
    position: absolute;
    top: 53%;
    left: 71%; }
  #callout-5A {
    position: absolute;
    top: 28%;
    left: 21%; }
  #modal-5A-screen #modal-5A {
    width: 75%; }
  #callout-5B {
    position: absolute;
    top: 52%;
    left: 26%; }
  #modal-5B-screen #modal-5B {
    width: 75%; }
  #callout-5C {
    position: absolute;
    top: 59%;
    left: 52%; }
  #modal-5C-screen #modal-5C {
    width: 75%; }
  #callout-5D {
    position: absolute;
    top: 12%;
    left: 36%; }
  #modal-5D-screen #modal-5D {
    width: 75%; }
  #callout-5E {
    position: absolute;
    top: 48%;
    left: 68%; }
  #modal-5E-screen #modal-5E {
    width: 75%; } }

@media only screen and (min-width: 1200px) {
  /******************************************************************
Bootstrap Large Stylesheet
******************************************************************/ }

@media only screen and (min-width: 1575px) {
  /******************************************************************
Bootstrap Large Stylesheet
******************************************************************/ }

@media only screen and (min-width: 1920px) {
  /******************************************************************
Bootstrap Large Stylesheet
******************************************************************/
  h1 {
    font-size: 64px; }
    h1 span, h1 .subtitle {
      font-size: 29px; }
  p, li {
    font-size: 30px; }
  .small p, .small li {
    font-size: 22px; }
  .screen .title {
    padding: 0px 15px 15px; }
  .pulse.text-label {
    font-size: 19px;
    padding: 9px 30px; }
    .pulse.text-label .tag {
      font-size: 14px;
      padding: 4px 12px; }
    .pulse.text-label.reversed {
      border-width: 3px;
      padding: 7px 30px; }
  #toggle-callout,
  #back .back-btn {
    padding: 10px 20px;
    font-size: 30px; }
  .box-modal ul {
    padding: 0 0 0 40px; }
    .box-modal ul li {
      margin: 20px 0; }
  #img-popup #close-img-popup {
    left: 1235px; }
  #img-popup img {
    left: 660px;
    width: 600px; } }
