/* LOADER */

  html[lang="th-TH"] .tk-abchanel-pb-s {
    font-family: "Prompt", "abchanel-corpo", Arial, sans-serif;
  }

  html[lang="vi-VN"] .tk-abchanel-pb-s {
    font-family: abchanel-corpo-vietnam, PingFangHK-Semibold, Microsoft YaHei, sans-serif;
  }
  .language-ja_JP .js-main-content {
    padding-top: 0 !important;
  }
  /* .js .fnb_zonecom-enabled .fnb_main-container {
		padding: 0 0 100px 0;
	} */

  .fnb_menu-visible {
    overflow-y: scroll;
  }

  #loader-hgf {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 999;
    bottom: 0;
    left: 0;
  }

  #loader-hgf img {
    display: inline-block;
    position: absolute;
    width: 64px;
    height: 64px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    -webkit-animation: fadeInOut 1s linear infinite alternate;
    animation: fadeInOut 1s linear infinite alternate;
  }

  @-webkit-keyframes fadeInOut {
    0% {
      opacity: 0;
    }

    100% {
      opacity: 1;
    }
  }

  @keyframes fadeInOut {
    0% {
      opacity: 0;
    }

    100% {
      opacity: 1;
    }
  }

  /* LOADER END */

  @media screen and (min-width: 860px) {
    .header.is-narrow .header__level-one .nav .is-burger,
    .header.is-narrow .header__level-one .header__menu-label {
      fill: #fff;
      color: #fff;
    }

    .header__line {
      background-color: transparent;
      transition: background-color 1s;
    }

    .header.is-hovered .header__line {
      background-color: #000;
    }

    body.header-open .header.is-narrow .header__level-one .nav .is-burger,
    .header.is-hovered.is-narrow .header__level-one .nav .is-burger,
    body.header-open .header.is-narrow .header__level-one .header__menu-label,
    .header.is-hovered.is-narrow .header__level-one .header__menu-label {
      fill: currentColor;
      color: currentColor;
    }

    .header.is-narrow .header__outer .header__level-one {
      background: transparent;
      border-bottom: none;
    }

    body.header-open .header.is-narrow .header__outer .header__level-one,
    .header.is-hovered.is-narrow .header__outer .header__level-one {
      background: #fff;
      border-bottom: 1px solid #ececec;
    }

    .header {
      position: absolute;
      background-color: transparent;
      transition: background-color 1s;
      /* opacity: 0; */
    }

    .header__outer {
      background-color: transparent;
      transition: background-color 1s;
      border-color: transparent;
    }

    .header__level-one {
      border-color: transparent;
      transition: border-color 1s;
    }

    .header-open .header__level-one,
    .header.is-hovered .header__level-one {
      border-color: #000;
    }

    .header-open .header,
    .header-open .header__outer,
    .header.is-hovered,
    .header.is-hovered .header__outer {
      background-color: #fff;
      border-color: #ececec;
      transition: border-color 1s;
    }

    #main-navigation {
      opacity: 0;
      transition: opacity 1s;
      animation-delay: 1s;
    }

    .nav-right {
      opacity: 0;
      transition: opacity 1s;
      animation-delay: 1s;
    }

    .header-open #main-navigation,
    .header-open .nav-right,
    .header.is-hovered #main-navigation,
    .header.is-hovered .nav-right {
      opacity: 1;
    }

    .nav-item > a > svg > g {
      fill: transparent;
      transition: fill 0.5s;
    }

    .header-open .nav-item > a > svg > g,
    .header.is-hovered .nav-item > a > svg > g {
      fill: #000;
    }

    .icon.is-wishlist {
      fill: transparent;
    }
  }

  svg.new_logo {
    position: absolute;
    top: 38px;
    z-index: 1000;
    fill: #fff;
    filter: invert(1);
    left: 50%;
    transform: translateX(-50%);
  }

  @media screen and (max-width: 859px) {
    svg.new_logo {
      display: none;
    }
  }

  /* HEADER CHANGES 

	.header {
		position: absolute;
		opacity: 0;
	}

	.btj-dispatcher-container .new_logo {
		top: 38px;
		margin-bottom: 24px;
		display: block;
		position: absolute;
		z-index: 50;
		left: 50%;
		transform: translateX(-50%);
	}

	.btj-dispatcher-container .new_logo svg {
		fill: #fff;
		height: 1.75rem;
	}

	.btj-dispatcher-container .new_logo .fnb_Logo_Chanel_New {
		font-size: 27px;
		height: 27px;
		text-decoration: none;
	}

	*/

  /* PARFUMER HEADER */

  .btj-dispatcher-container .btj-header {
    width: 100%;
    height: 71vh;
    background-size: cover;
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    align-content: center;
    margin-bottom: 75px;
    position: relative;
    cursor: pointer;
  }

  .btj-dispatcher-container .btj-header .btj-header-content {
    position: relative;
    bottom: 30px;
    z-index: 500;
  }

  .btj-dispatcher-container .btj-header .btj-header-content .fnb_btn.fnb_white {
    border: 1px solid #dedede;
    color: #fff;
    background-color: transparent;
  }

  .btj-dispatcher-container .btj-header .video-header #video-header {
    padding: 0 !important;
  }

  .btj-dispatcher-container .btj-header .video-header img {
    object-fit: cover;
    min-height: 100%;
    height: 100%;
  }

  .btj-dispatcher-container .btj-header .video-header video,
  .btj-dispatcher-container .btj-header .video-header #video-header {
    height: 100% !important;
    width: 100%;
    object-fit: cover;
    pointer-events: none;
  }

  .btj-dispatcher-container .btj-header .shadow {
    display: none;
    position: absolute;
    width: 100%;
    height: 71vh;
    z-index: 49;
    background: linear-gradient(0deg, rgba(2, 0, 36, 0.5746673669467788) 0%, rgba(255, 255, 255, 0) 40%);
  }

  .btj-dispatcher-container .btj-header .video-header {
    position: absolute;
    width: 100%;
    height: 71vh;
    z-index: 48;
  }

  .btj-dispatcher-container .btj-header .trigger {
    width: 0;
    height: 0;
    top: 50%;
    left: 0;
    position: absolute;
  }

  .btj-dispatcher-container .btj-header h3 {
    color: #fff;
    text-align: center;
    margin-bottom: 30px;
    font-size: 20px;
    position: relative;
    z-index: 50;
  }

  .btj-dispatcher-container .btj-header a {
    position: relative;
    z-index: 50;
  }

  /* BTJ HEADER END */

  /* BTJ BODY */

  .btj-dispatcher-container .btj-content {
    width: 100%;
    max-width: 1368px;
    text-align: center;
    margin: 0 auto;
  }

  .btj-dispatcher-container .btj-content h2 {
    font-size: 16px;
    margin-bottom: 0px;
  }

  .btj-dispatcher-container .btj-content h1 {
    font-size: 30px;
    margin: 0 auto 3px auto;
  }

  .btj-dispatcher-container .btj-content > p {
    margin: 30px auto 75px auto;
    width: 55%;
  }

  /* BTJ BODY END */

  /* CHAPTERS */

  .btj-dispatcher-container .btj-content #chapters {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    max-width: 800px;
    margin: 0 auto;
    width: 100%;
  }

  .btj-dispatcher-container .btj-content #chapters .chapter {
    flex: 0 50%;
    margin-bottom: 25px;
  }

  .btj-dispatcher-container .btj-content #chapters .chapter .chapter-img-content {
    width: 375px;
    position: relative;
    overflow: hidden;
  }

  .btj-dispatcher-container .btj-content #chapters .chapter .chapter-img-content > img {
    width: 100%;
  }

  .btj-dispatcher-container .btj-content #chapters .chapter .chapter-img-content .chapter-content {
    bottom: 0;
    height: 100%;
    width: 100%;
    position: absolute;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    align-content: center;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.17) 0%, rgba(255, 255, 255, 0) 32%);
  }

  .btj-dispatcher-container .btj-content #chapters .chapter .chapter-img-content .poster {
    transform: scale(1);
    transition: transform 0.6s ease-in-out;
  }

  .btj-dispatcher-container .btj-content #chapters .chapter:hover .chapter-img-content .poster {
    transform: scale(1.06);
  }

  .btj-dispatcher-container .btj-content #chapters .chapter .chapter-img-content .chapter-content .playbtn {
    width: 12%;
    margin-bottom: 10px;
  }

  .btj-dispatcher-container .btj-content #chapters .chapter .chapter-img-content .chapter-content p {
    text-align: center;
    color: #fff;
    font-size: 14px;
    margin: 20px auto 20px auto;
    min-height: 46px;
  }

  /* CHAPTERS END */

  .btj-dispatcher-container {
    text-align: center;
  }

  .btj-dispatcher-container .quoteText {
    margin: 50px auto 20px auto;
    font-size: 17px;
    line-height: 26px;
    padding-top: 50px;
    width: 70%;
  }

  .btj-dispatcher-container .quoteAuthor {
    font-size: 20px;
    margin-bottom: 50px;
  }

  .btj-dispatcher-container #parfumeur-hashtag {
    width: 50%;
    margin: 120px auto 120px auto;
  }

  .fnb_main-container {
    padding: 0;
  }

  .btj-dispatcher-container .doubleCtaContainer {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
  }

  .btj-dispatcher-container .doubleCtaContainer a {
    margin: 0 10px;
  }

  @media screen and (max-width: 859px) {
    .btj-dispatcher-container {
      margin-bottom: 20px;
    }

    .btj-dispatcher-container .fnb_logo {
      display: none;
    }

    .btj-dispatcher-container .btj-header {
      margin-bottom: 30px;
    }

    .btj-dispatcher-container .btj-content #chapters .chapter .chapter-img-content .poster {
      opacity: 1;
    }

    .btj-dispatcher-container .doubleCtaContainer a {
      margin: 10px;
    }

    .btj-dispatcher-container .btj-header h1 {
      font-size: 28x;
      margin: 0 auto 15px auto;
    }

    .btj-dispatcher-container .btj-content h3 {
      font-size: 24px;
      width: 100%;
      margin: 0 auto;
    }

    .btj-dispatcher-container .btj-content > p {
      width: 85%;
      margin: 30px auto 60px auto;
      line-height: 20px;
    }

    .btj-dispatcher-container .quoteText {
      padding-top: 0;
      width: 80%;
      margin: 20px auto 20px auto;
      font-size: 14px;
    }

    .btj-dispatcher-container .quoteText br {
      display: none;
    }

    .btj-dispatcher-container .btj-content #chapters .chapter {
      opacity: 1;
    }

    .btj-dispatcher-container #parfumeur-hashtag {
      width: 90%;
      margin: 60px auto 60px auto;
    }

    .btj-dispatcher-container .btj-content #chapters {
      width: 100%;
    }

    .btj-dispatcher-container .btj-content #chapters .chapter {
      flex: 0 100%;
      padding: 0 25px;
    }

    .btj-dispatcher-container .btj-content #chapters .chapter .chapter-img-content {
      width: 100%;
    }
  }