body {
  font-family: 'Roboto', sans-serif;
  color: #003063; }

.hidden {
  display: none; }

.index-button,
.logout-button {
  position: absolute;
  top: 20px;
  z-index: 1; }

.index-button {
  left: 20px; }

.logout-button {
  right: 20px; }

img {
  max-width: 100%; }

.ui.header {
  font-family: "Doctor Soos Bold";
  text-transform: uppercase; }

h1.ui.header, h2.ui.header {
  color: #a0141e; }
  h1.ui.header, h2.ui.header {
    font-size: 46px; }
    @media screen and (min-width: 640px) {
      h1.ui.header, h2.ui.header {
        font-size: calc(46px + 6 * ((100vw - 640px) / 1060)); } }
    @media screen and (min-width: 1700px) {
      h1.ui.header, h2.ui.header {
        font-size: 52px; } }

h3.ui.header, h4.ui.header, h5.ui.header {
  font-weight: normal;
  color: #003063; }

h3.ui.header {
  font-size: 26px; }
  @media screen and (min-width: 640px) {
    h3.ui.header {
      font-size: calc(26px + 6 * ((100vw - 640px) / 1060)); } }
  @media screen and (min-width: 1700px) {
    h3.ui.header {
      font-size: 32px; } }

h4.ui.header {
  font-size: 18px; }
  @media screen and (min-width: 640px) {
    h4.ui.header {
      font-size: calc(18px + 6 * ((100vw - 640px) / 1060)); } }
  @media screen and (min-width: 1700px) {
    h4.ui.header {
      font-size: 24px; } }

h4.ui.header.main-header {
  margin-top: 0; }

h5.ui.header {
  font-size: 14px; }
  @media screen and (min-width: 640px) {
    h5.ui.header {
      font-size: calc(14px + 6 * ((100vw - 640px) / 1060)); } }
  @media screen and (min-width: 1700px) {
    h5.ui.header {
      font-size: 20px; } }

h5.ui.header.sub-header {
  margin-bottom: 0;
  padding-left: 1.2em; }

h5.ui.header.no-margin-bottom {
  margin-bottom: 0; }

p, ul {
  font-size: 14px; }
  @media screen and (min-width: 640px) {
    p, ul {
      font-size: calc(14px + 4 * ((100vw - 640px) / 1060)); } }
  @media screen and (min-width: 1700px) {
    p, ul {
      font-size: 18px; } }

p.alternate-font, p .alternate-font, ul.alternate-font, ul .alternate-font {
  font-size: 18px; }
  @media screen and (min-width: 640px) {
    p.alternate-font, p .alternate-font, ul.alternate-font, ul .alternate-font {
      font-size: calc(18px + 4 * ((100vw - 640px) / 1060)); } }
  @media screen and (min-width: 1700px) {
    p.alternate-font, p .alternate-font, ul.alternate-font, ul .alternate-font {
      font-size: 22px; } }

.alternate-font {
  font-family: "Doctor Soos Bold"; }

.normal-font {
  font-family: "Roboto", sans-serif; }

.blue-text {
  color: #003063; }

.red-text {
  color: #a0141e; }

.yellow-text {
  color: #d8af09; }

.light-blue-text {
  color: #7b86a9; }

.orange-text {
  color: #cb4f47; }

.boehringer-logo-wrapper {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 0 6em 4em;
  background-color: #ece9e4;
  transition: opacity 0.5s; }
  .boehringer-logo-wrapper .boehringer-logo {
    position: relative; }
    .boehringer-logo-wrapper .boehringer-logo::before {
      content: '';
      position: absolute;
      right: 200%;
      top: 50%;
      transform: translateY(-50%);
      width: 200%;
      height: 4px;
      background-color: #fff;
      transition: right 2s; }
    .boehringer-logo-wrapper .boehringer-logo.line::before {
      right: 0; }
    .boehringer-logo-wrapper .boehringer-logo img {
      position: relative;
      display: block;
      float: right;
      background-color: #ece9e4;
      padding-left: 2em;
      opacity: 0;
      transform: scale(1.5);
      transition: opacity 0.5s; }
    .boehringer-logo-wrapper .boehringer-logo.shown img {
      opacity: 1; }
    .boehringer-logo-wrapper .boehringer-logo::after {
      content: '';
      display: block;
      clear: both; }

.section {
  position: relative;
  overflow: hidden; }
  .section h1 {
    transform: translateX(-2000px);
    transition: transform 0.5s; }
    .section h1.slide-in {
      transform: translateX(0); }
  .section .image-slide {
    text-align: center; }
    .section .image-slide img {
      max-height: 150px;
      margin-top: 1em; }
    .section .image-slide.image-slide-left img {
      transform: translateX(-1920px);
      transition: transform 1s; }
    .section .image-slide.image-slide-right img {
      transform: translateX(1920px);
      transition: transform 1s; }
    .section .image-slide.shown img {
      transform: translateX(0); }
  .section .image-scale {
    text-align: center; }
    .section .image-scale img {
      max-height: 150px;
      margin-top: 1em; }
    .section .image-scale.image-scale-bottom img {
      transform: scale(0);
      transform-origin: 50% 100%;
      transition: transform 1s; }
    .section .image-scale.image-scale-center img {
      transform: scale(0);
      transform-origin: 50% 50%;
      transition: transform 1s; }
    .section .image-scale.shown img {
      transform: scale(1); }
  .section .next-section {
    position: absolute;
    left: 0;
    bottom: 10%;
    width: 100%;
    text-align: center;
    font-size: 4rem;
    cursor: pointer;
    transform: translateY(-20px);
    opacity: 0;
    transition: transform 0.5s, opacity 0.5s; }
    .section .next-section.shown {
      transform: translateY(0);
      opacity: 1; }
  .section .next-page-link {
    margin-top: 1em;
    transform: translateX(-1920px);
    transition: transform 1s; }
    .section .next-page-link.shown {
      transform: translateX(0); }