@font-face {
  font-family: AppFont;
  src: url("../fonts/Montserrat-Regular.ttf") format("truetype"); }
@font-face {
  font-family: AppFontBold;
  src: url("../fonts/Montserrat-Bold.ttf") format("truetype"); }
@font-face {
  font-family: AppFontBoldItalic;
  src: url("../fonts/Montserrat-BoldItalic.ttf") format("truetype"); }
@font-face {
  font-family: AppFontItalic;
  src: url("../fonts/Montserrat-Italic.ttf") format("truetype"); }
@font-face {
  font-family: AppFontLight;
  src: url("../fonts/Montserrat-Light.ttf") format("truetype"); }
@font-face {
  font-family: AppFontLightItalic;
  src: url("../fonts/Montserrat-LightItalic.ttf") format("truetype"); }
@font-face {
  font-family: AppFontMedium;
  src: url("../fonts/Montserrat-Medium.ttf") format("truetype"); }
@font-face {
  font-family: AppFontMediumItalic;
  src: url("../fonts/Montserrat-MediumItalic.ttf") format("truetype"); }
@font-face {
  font-family: AppFontBlack;
  src: url("../fonts/Montserrat-Black.ttf") format("truetype"); }
@font-face {
  font-family: AppFontExtraBold;
  src: url("../fonts/Montserrat-ExtraBold.ttf") format("truetype"); }
@font-face {
  font-family: AppFontBlackItalic;
  src: url("../fonts/Montserrat-BlackItalic.ttf") format("truetype"); }
@font-face {
  font-family: AppFontThin;
  src: url("../fonts/Montserrat-Thin.ttf") format("truetype"); }
@font-face {
  font-family: AppFontThinItalic;
  src: url("../fonts/Montserrat-ThinItalic.ttf") format("truetype"); }
#body {
  background-color: white; }

.header {
  display: -webkit-flex;
  -webkit-flex-direction: column;
  -webkit-justify-content: center;
  -webkit-align-items: center;
  display: -moz-flex;
  -moz-flex-direction: column;
  -moz-justify-content: center;
  -moz-align-items: center;
  display: -ms-flex;
  -ms-flex-direction: column;
  -ms-justify-content: center;
  -ms-align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 100vw;
  height: 4.5em;
  background-image: url(../img/header_bg.jpg);
  background-size: cover;
  background-position: center; }
  .header .logo_box {
    display: -webkit-flex;
    -webkit-flex-direction: row;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -moz-flex;
    -moz-flex-direction: row;
    -moz-justify-content: center;
    -moz-align-items: center;
    display: -ms-flex;
    -ms-flex-direction: row;
    -ms-justify-content: center;
    -ms-align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 0.6em; }
    .header .logo_box .logo {
      position: relative;
      width: 2em;
      height: 100%;
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat; }
      .header .logo_box .logo[data-logo="thermo"] {
        background-image: url(../img/thermo_logo.png);
        background-size: 65%; }
      .header .logo_box .logo[data-logo="kaon"] {
        background-image: url(../img/kaon_logo.png);
        background-size: 59%; }
    .header .logo_box .logo_divider {
      position: relative;
      width: 1px;
      height: 100%;
      background-color: white; }
  .header .title {
    position: relative;
    margin-top: 1em;
    color: white;
    font-size: 0.6em;
    font-family: AppFontExtraBold;
    user-select: text; }
  .header .subtitle_container {
    display: -webkit-flex;
    -webkit-flex-direction: row;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    display: -moz-flex;
    -moz-flex-direction: row;
    -moz-justify-content: center;
    -moz-align-items: center;
    display: -ms-flex;
    -ms-flex-direction: row;
    -ms-justify-content: center;
    -ms-align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 7.2em;
    height: 0.8em;
    margin-top: 0.4em;
    border-top: solid white 2px;
    border-bottom: solid white 2px; }
    .header .subtitle_container .subtitle {
      position: relative;
      color: white;
      font-size: 0.32em;
      user-select: text; }

.main_content {
  display: -webkit-flex;
  -webkit-flex-direction: row;
  -webkit-justify-content: center;
  -webkit-align-items: center;
  display: -moz-flex;
  -moz-flex-direction: row;
  -moz-justify-content: center;
  -moz-align-items: center;
  display: -ms-flex;
  -ms-flex-direction: row;
  -ms-justify-content: center;
  -ms-align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 100vw;
  height: calc(100vh - 3.4em); }
  .main_content .text_content {
    position: relative;
    width: 8em;
    margin-right: 0.5em;
    color: #484848;
    margin-bottom: 1em; }
    .main_content .text_content .title {
      position: relative;
      margin-bottom: 0.1em;
      font-size: 0.4em;
      font-family: AppFontExtraBold;
      user-select: text; }
    .main_content .text_content .subtitle {
      position: relative;
      line-height: 1.5;
      margin-bottom: 1em;
      font-size: 0.27em;
      user-select: text; }
    .main_content .text_content .quote {
      position: relative;
      margin-bottom: 1em;
      color: #ED3134;
      font-size: 0.26em;
      font-family: AppFontBold;
      user-select: text;
      line-height: 1.5; }
    .main_content .text_content .split_content {
      position: relative;
      display: flex;
      display: -webkit-flex;
      -webkit-flex-direction: row;
      -webkit-justify-content: center;
      -webkit-align-items: center;
      display: -moz-flex;
      -moz-flex-direction: row;
      -moz-justify-content: center;
      -moz-align-items: center;
      display: -ms-flex;
      -ms-flex-direction: row;
      -ms-justify-content: center;
      -ms-align-items: center;
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      margin-bottom: 0.25em; }
      .main_content .text_content .split_content .thumbnail_img {
        position: relative;
        /*
        background-image: url(../img/case_study_thumbnail.png);
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        */
        margin-right: 0.1em;
        max-width: 2.5em; }
      .main_content .text_content .split_content .right_content {
        position: relative;
        margin: 0.1em; }
        .main_content .text_content .split_content .right_content .explanation {
          position: relative;
          margin-bottom: 1em;
          font-size: 0.25em;
          font-family: AppFontBold;
          user-select: text; }
        .main_content .text_content .split_content .right_content a.button {
          position: relative;
          background: #cf142b;
          color: white;
          margin-right: 10em;
          font-family: AppFontBold;
          bottom: 1em;
          font-size: 0.25em;
          padding: 1em;
          text-align: center;
          user-select: text;
          text-decoration: none;
          border-radius: 4px; }
    .main_content .text_content .description {
      position: relative;
      line-height: 1.5em;
      font-size: 0.25em;
      user-select: text;
      width: 210%; }
      .main_content .text_content .description u {
        color: #3f87fb; }
  .main_content .video_content {
    position: relative;
    width: 8em;
    height: auto;
    margin-bottom: 2em; }
    .main_content .video_content #video {
      width: 100%;
      height: 4.51em; }
    .main_content .video_content .play_icon {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 1.4em;
      height: 1.4em;
      transform: translate(-50%, -50%);
      background-image: url(../img/play_button.png);
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;
      transition: opacity 0.5s ease; }
    .main_content .video_content #video_cover {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }
    .main_content .video_content.video_playing .play_icon {
      opacity: 0;
      pointer-events: none; }
    .main_content .video_content.video_playing #video_cover {
      display: none; }

.bodyPortrait .header {
  height: 7em; }
.bodyPortrait .main_content {
  flex-direction: column;
  justify-content: flex-start; }
  .bodyPortrait .main_content .text_content {
    width: 15em;
    margin-right: 0;
    margin-bottom: 0.5em;
    margin-top: 1em; }
    .bodyPortrait .main_content .text_content .title {
      font-size: 0.6em; }
    .bodyPortrait .main_content .text_content .subtitle,
    .bodyPortrait .main_content .text_content .quote {
      font-size: 0.4em; }
    .bodyPortrait .main_content .text_content .split_content .thumbnail_img {
      max-width: 3.5em; }
    .bodyPortrait .main_content .text_content .split_content .right_content .explanation {
      font-size: 0.4em; }
    .bodyPortrait .main_content .text_content .split_content .right_content .button {
      font-size: 0.4em;
      bottom: -0.5em; }
    .bodyPortrait .main_content .text_content .description {
      width: auto;
      font-size: 0.3em; }
  .bodyPortrait .main_content .video_content {
    width: 15em; }
    .bodyPortrait .main_content .video_content #video {
      height: 6.71em; }
    .bodyPortrait .main_content .video_content .play_icon {
      width: 2.1em;
      height: 2.1em; }

.bodyPhone.bodyPortrait .main_content {
  justify-content: flex-start; }
  .bodyPhone.bodyPortrait .main_content .video_content {
    width: 17em;
    margin-right: 0em; }
.bodyPhone.bodyPortrait .header {
  font-size: 1.3em;
  height: 8.3em;
  margin-bottom: 1em; }
.bodyPhone .header .logo_box {
  height: 1.1em; }
  .bodyPhone .header .logo_box .logo {
    width: 4em; }
.bodyPhone .header .title {
  font-size: 1em;
  text-align: center;
  line-height: 1.2; }
.bodyPhone .header .subtitle_container {
  width: 12.4em;
  height: 1em; }
  .bodyPhone .header .subtitle_container .subtitle {
    font-size: 0.52em; }
.bodyPhone .main_content .text_content {
  margin-top: 0.5em;
  width: 12.5em;
  font-size: 1.35em; }
  .bodyPhone .main_content .text_content .description {
    width: auto; }
.bodyPhone .main_content .video_content {
  width: 14em;
  margin-right: 0.5em; }
  .bodyPhone .main_content .video_content #video {
    height: 9.51em; }
  .bodyPhone .main_content .video_content .play_icon {
    width: 3.6em;
    height: 3.6em; }

@media only screen and (max-width: 1120px) {
  .header {
    height: 7em;
    font-size: 1.2em; }
    .header .logo_box {
      height: 0.8em !important; }
      .header .logo_box .logo {
        width: 3.4em !important; }

  .main_content {
    flex-direction: column;
    justify-content: flex-start; }
    .main_content .text_content {
      width: 15em;
      margin-right: 0;
      margin-bottom: 0.5em;
      margin-top: 1em; }
      .main_content .text_content .title {
        font-size: 0.6em; }
      .main_content .text_content .subtitle,
      .main_content .text_content .quote {
        font-size: 0.4em; }
      .main_content .text_content .split_content .thumbnail_img {
        max-width: 3.5em; }
      .main_content .text_content .split_content .right_content .explanation {
        font-size: 0.4em; }
      .main_content .text_content .split_content .right_content .button {
        font-size: 0.4em;
        bottom: -0.5em; }
      .main_content .text_content .description {
        width: auto;
        font-size: 0.3em; }
    .main_content .video_content {
      width: 15em; }
      .main_content .video_content #video {
        height: 6.71em; }
      .main_content .video_content .play_icon {
        width: 2.1em;
        height: 2.1em; } }

/*# sourceMappingURL=custom.css.map */