.basicLightbox {
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.8);
  opacity: 0.01;
  transition: opacity 0.4s ease;
  z-index: 1000;
  will-change: opacity;
}
.basicLightbox--visible {
  opacity: 1;
}
.basicLightbox__placeholder {
  max-width: 100%;
  transform: scale(0.9);
  transition: transform 0.4s ease;
  z-index: 1;
  will-change: transform;
}
.basicLightbox__placeholder > img:first-child:last-child,
.basicLightbox__placeholder > video:first-child:last-child,
.basicLightbox__placeholder > iframe:first-child:last-child {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  max-width: 95%;
  max-height: 95%;
}
.basicLightbox__placeholder > video:first-child:last-child,
.basicLightbox__placeholder > iframe:first-child:last-child {
  pointer-events: auto;
}
.basicLightbox__placeholder > img:first-child:last-child,
.basicLightbox__placeholder > video:first-child:last-child {
  width: auto;
  height: auto;
}
.basicLightbox--img .basicLightbox__placeholder, .basicLightbox--video .basicLightbox__placeholder, .basicLightbox--iframe .basicLightbox__placeholder {
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.basicLightbox--visible .basicLightbox__placeholder {
  transform: scale(1);
}

.load-more-btn {
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
  color: #868686;
  font-weight: 700;
  line-height: 1;
  transition: color 0.25s;
  font-size: 14px;
}

.load-more-btn:hover {
  color: var(--color-accent);
}

.load-more-btn span,
.load-more-btn svg {
  display: block;
}

.load-more-btn svg {
  width: 40px;
  height: 40px;
  margin-right: 0.5rem;
}

@media screen and (min-width: 1559px) {
  .load-more-btn {
    font-size: 20px;
  }
  .load-more-btn svg {
    width: 58px;
    height: 58px;
  }
}
@media screen and (max-width: 1023px) {
  .special-1000-main-slides .special-section:first-child {
    min-height: 100vh;
  }
  .special-1000-main-images {
    display: none;
  }
  .special-1000-main-slides {
    position: relative;
    z-index: 2;
  }
  .special-section {
    display: flex;
    width: 100%;
    justify-content: flex-start;
    align-items: center;
  }
  .special-section_date,
  .special-section_details {
    padding-top: 64px;
  }
  .special-section_date {
    padding-bottom: 64px;
  }
  .special-section_slider {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-left: var(--x-pad);
    padding-right: var(--x-pad);
  }
  .special-section_slider .swiper {
    overflow: visible;
  }
  .swiper-special-1000 .swiper-slide {
    width: 80vw;
  }
  .special-1000-data .special-section_details {
    display: none;
  }
  .special-head {
    display: block;
    width: 100%;
    text-align: center;
    padding: var(--x-pad);
    font-size: 36px;
    line-height: 1.3;
  }
  .special-head span {
    display: block;
  }
  .special-lead {
    padding: 64px var(--x-pad) 0;
    text-align: center;
    line-height: 1.3;
    font-size: 16px;
  }
  .special-after-life-text {
    font-size: 24px;
    line-height: 1.3;
    font-weight: 600;
    margin-bottom: 0.5em;
  }
  .special-1000-main-slides .special-section {
    position: relative;
  }
  .special-1000-main-slides .outer {
    z-index: 2;
  }
  .sm-previews {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
  }
  .special-1000-data .swiper-slide:last-child {
    display: flex;
    height: auto;
    align-items: center;
    justify-content: center;
    width: 100%;
  }
  .special-after-life {
    text-align: center;
  }
  .special-1000-data {
    padding-bottom: 96px;
  }
}
/* Desktop */
@media screen and (min-width: 1024px) {
  .sm-previews {
    display: none;
  }
  .special-1000-days {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
  }
  .special-1000-main-pictures,
  .special-section {
    height: 100%;
    width: 100%;
    top: 0;
    position: fixed;
    visibility: hidden;
  }
  .special-1000-main-pictures .outer,
  .special-1000-main-pictures .inner,
  .special-section .outer,
  .special-section .inner {
    width: 100%;
    height: 100%;
    overflow-y: hidden;
  }
  .special-content {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    background-size: cover;
    background-position: center;
  }
  .special-section_slider .special-content {
    padding-top: var(--header-height);
  }
  .special-head {
    text-align: center;
    font-weight: 600;
    line-height: 1.2;
  }
  .special-head span {
    display: block;
  }
  .special-lead {
    text-align: center;
    padding-left: var(--x-pad);
    padding-right: var(--x-pad);
    line-height: 1.3;
    max-width: 55vw;
  }
  .special-lead p:not(:first-child) {
    margin-top: 0.5em;
  }
  .special-after-life {
    position: relative;
    z-index: 2;
    text-align: center;
  }
  .special-after-life-text {
    font-weight: 600;
    font-size: 26px;
    line-height: 1.3;
    margin-bottom: 0.5em;
  }
  .special-head {
    font-size: 4.1vw;
    font-size: clamp(42px, 4.7vw, 80px);
  }
  .special-section_details {
    padding-left: 150px;
    padding-right: 150px;
  }
  .special-section_details .special-content {
    width: calc(100% - 150px);
  }
  .swiper.swiper-special-1000 {
    padding-bottom: 32px;
  }
  .special-content .swiper-slide {
    width: calc(100vw - 300px);
    transition: all 0.5s;
  }
  .special-content .swiper-pagination {
    width: 50vw;
    top: unset;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 0);
    border-radius: 2px;
    --swiper-pagination-bullet-inactive-color: #fff;
    --swiper-pagination-bullet-inactive-opacity: 0.5;
    --swiper-pagination-bullet-horizontal-gap: 8px;
    --swiper-pagination-bullet-size: 12px;
  }
  .special-content .swiper-pagination .swiper-pagination-bullet-active {
    --swiper-pagination-color: var(--color-accent);
  }
  .special-content .swiper-pagination.is-hidden {
    opacity: 0;
  }
}
.indicator {
  display: none;
}

@media screen and (min-width: 1024px) {
  .indicator {
    display: block;
    position: fixed;
    bottom: var(--x-pad);
    right: var(--x-pad);
    transform: translate(-50%, -50);
    width: 0;
    height: 80px;
    border-left: 2px dashed rgba(255, 255, 255, 0.1);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.37s, visibility 0s 0.37s;
  }
  .show-scr-dwn .indicator {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.37s;
  }
  .indicator .arrow {
    position: absolute;
    top: 0;
    left: -2px;
    height: 20px;
    width: 2px;
    background: #fff;
    animation: animate 2s infinite;
  }
  .indicator .arrow:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: -3px;
    width: 8px;
    height: 8px;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
  }
  @keyframes animate {
    0% {
      transform: translateY(0);
      opacity: 0.5;
    }
    50% {
      transform: translateY(40px);
      opacity: 1;
    }
    100% {
      transform: translateY(80px);
      opacity: 0;
    }
  }
}
.indicator {
  display: none;
}

@media screen and (min-width: 1024px) {
  .indicator {
    display: block;
    position: fixed;
    bottom: var(--x-pad);
    right: var(--x-pad);
    transform: translate(-50%, -50);
    width: 0;
    height: 80px;
    border-left: 2px dashed rgba(255, 255, 255, 0.1);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s, visibility 0s 0.5s;
  }
  .show-scr-dwn .indicator {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.5s;
  }
  .indicator .arrow {
    position: absolute;
    top: 0;
    left: -2px;
    height: 20px;
    width: 2px;
    background: #fff;
    animation: animate 2s infinite;
  }
  .indicator .arrow:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: -3px;
    width: 8px;
    height: 8px;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
  }
  @keyframes animate {
    0% {
      transform: translateY(0);
      opacity: 0.5;
    }
    50% {
      transform: translateY(40px);
      opacity: 1;
    }
    100% {
      transform: translateY(80px);
      opacity: 0;
    }
  }
  .special-content .swiper {
    overflow: unset;
  }
  .special-content .swiper-slide:last-child {
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
  }
  .special-content .swiper-slide:last-child .image-slot {
    width: calc(100vw - 650px);
    height: 70vh;
    top: 50%;
    left: 50%;
    right: unset;
    bottom: unset;
    transform: translate(-50%, -50%);
  }
  .special-after-life {
    z-index: 10;
  }
  .special-content .swiper-slide .image-slot {
    opacity: 0;
    transition: opacity 0.25s;
  }
  .special-content .swiper-slide.swiper-slide-active .image-slot {
    opacity: 1;
  }
}
/*

.indicator{
  position: fixed;
  bottom: var(--x-pad);
  right: var(--x-pad);
  width: 14px;
  height: 14px;

  transform:rotate(45deg);

  border: 1px solid red;

  span{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    box-sizing:border-box;
    border:none;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    animation:animate 1s linear infinite;

    &:nth-child(1){
      top:-12px;
      left:-12px;
      animation-delay:0s;
    }

    &:nth-child(2){
      top:-6px;
      left:-6px;
      animation-delay:0.2s;
    }

    &:nth-child(3){
      top:0;
      left:0;
      animation-delay:0.4s;
    }

    &:nth-child(4){
      top: 6px;
      left: 6px;
      animation-delay:0.6s;
    }

    &:nth-child(5){
      top: 12px;
      left: 12px;
      animation-delay:0.8s;
    }
  }
}

@keyframes animate{
  0%{
    border-color:#fff;
    transform:translate(0,0);
  }
   20%{
    border-color:#fff;
     transform:translate(15px,15px);
  }
   20.1%,100%{
    border-color:#ffd64a;
  }
}
*/
.preloader {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background: #292929 url(/assets/nav-bg-904b8c5f039f56a2734d28aaae0eddc094745899c3ef567e59c898356a4daa04.png);
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.25s, visibility 0s 0.25s;
}

.preloader.is-preload {
  visibility: visible;
  opacity: 1;
}

.preloader-icon {
  width: var(--preload-size);
}

.preloader-icon svg {
  display: block;
  width: 100%;
  height: auto;
}

.preloader-progress {
  margin-top: 0.5em;
  text-align: center;
  font-size: var(--preload-fs);
}

@media screen and (max-width: 767px) {
  .preloader {
    --preload-size: 102px;
    --preload-fs: 32px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1559px) {
  .preloader {
    --preload-size: 170px;
    --preload-fs: 56px;
  }
}
@media screen and (min-width: 1560px) {
  .preloader {
    --preload-size: 230px;
    --preload-fs: 64px;
  }
}
.image-slot {
  position: absolute;
  top: 15%;
  bottom: 15%;
  left: 10%;
  right: 10%;
  perspective-origin: 50% 50%;
  transform-style: preserve-3d;
  perspective: 100vw;
}

.image-slot .abs-image {
  object-fit: contain;
}

.image-slot .abs-image.visible {
  transform: scale(1);
}

/*
.image-slot .abs-image {
  object-fit: contain;

  --f: .1; // the parallax factor (the smaller the better)
  --r: 0px; // radius

  --_f: calc(100%*var(--f)/(1 + var(--f)));
  --_a: calc(90deg*var(--f));
  // width: 250px; //the image size
  aspect-ratio: calc(1 + var(--f));
  object-fit: cover;
  clip-path: inset(0 var(--_f) 0 0 round var(--r));
  // transform: perspective(400px) var(--_t, rotateY(var(--_a)));
  transform: perspective(400px) var(--_t, rotateY(0));
  transition: .5s;
  cursor: pointer;
}

.image-slot .abs-image:hover {
  // -webkit-mask-position: 0 0;
  clip-path: inset(0 0 0 var(--_f) round var(--r));
  --_t: translateX(calc(-1*var(--_f))) rotateY(calc(-1*var(--_a)))
}
*/
.canvas-i-point {
  position: absolute;
  width: var(--size);
  aspect-ratio: var(--aspct);
  transform: translate3d(-50%, -50%, 0);
}

.special-1000-main-pictures .canvas-i-point {
  transform: translate3d(-50%, -50%, 0) scale(0);
  transition: all 0.75s;
}

.special-1000-main-pictures .canvas-i-point.visible {
  transform: translate3d(-50%, -50%, 0) scale(1);
}

@media screen and (max-width: 1023px) {
  .special-1000-data .image-slot {
    display: none;
  }
}
.special-date {
  padding: var(--x-pad);
  text-align: center;
  color: #6D6D6D;
}

.special-date-title {
  font-weight: 700;
  font-size: 40px;
  line-height: 1.1;
}

.special-date-desc {
  font-size: 600;
  line-height: 1.3;
  font-size: 24px;
  margin-top: 1em;
  padding-left: var(--x-pad);
  padding-right: var(--x-pad);
}

@media screen and (min-width: 768px) and (max-width: 1279px) {
  .special-date-title {
    font-size: 110px;
  }
  .special-date-desc {
    font-size: 32px;
  }
}
@media screen and (min-width: 1024px) {
  .special-date {
    padding: var(--x-pad) 150px;
  }
}
@media screen and (min-width: 1280px) {
  .special-date-desc {
    max-width: 50vw;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (min-width: 1280px) and (max-width: 1559px) {
  .special-date-title {
    font-size: 160px;
  }
  .special-date-desc {
    font-size: 36px;
  }
}
@media screen and (min-width: 1560px) {
  .special-date-title {
    font-size: 220px;
  }
  .special-date-desc {
    font-size: 40px;
  }
}
.special-card {
  width: 100%;
}

.special-card-viewer {
  position: relative;
  width: 100%;
}

.special-card-viewer::before {
  content: "";
  display: block;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
  background-color: gray;
}

.special-card-viewer video {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: contain;
}

.special-card-viewer img.abs-image {
  object-fit: contain;
}

.special-card-data {
  font-size: 16px;
  line-height: 1.3;
}

.special-card-info {
  font-size: 0.75em;
  color: #BABABA;
}

.special-card-title {
  font-size: 1.125em;
}

.special-card-text {
  margin-top: 1em;
}

@media screen and (min-width: 560px) {
  .special-card {
    display: grid;
    grid-template-columns: 50% 1fr;
    gap: 16px;
    padding-left: var(--x-pad);
    padding-right: var(--x-pad);
  }
}
@media screen and (min-width: 560px) and (max-width: 767px) {
  .special-card-data {
    font-size: 14px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
  .special-card {
    grid-template-columns: 56.8% 1fr;
    gap: 24px;
  }
  .special-card-data {
    font-size: 16px;
  }
  .special-card-text {
    margin-top: 0;
  }
}
@media screen and (min-width: 1280px) and (max-width: 1559px) {
  .special-card {
    grid-template-columns: 56.8% 1fr;
    gap: 32px;
  }
  .special-card-data {
    font-size: 18px;
  }
  .special-card-text {
    margin-top: 0.5em;
  }
}
@media screen and (min-width: 1560px) {
  .special-card {
    grid-template-columns: 53.4% 1fr;
    gap: 87px;
  }
  .special-card-data {
    font-size: 21px;
  }
  .special-card-text {
    margin-top: 0.5em;
  }
}
.special-card-video img,
.special-image {
  cursor: pointer;
}

.special-card-video:has(img)::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  font-size: 20px;
  display: block;
  width: 48px;
  height: 48px;
  line-height: 46px;
  text-align: left;
  padding-left: 18px;
  background-color: rgba(255, 255, 255, 0.5);
  background-image: url('data:image/svg+xml,<svg fill="currentColor" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 163.861 163.861" xml:space="preserve"><g stroke-width="0"></g><g stroke-linecap="round" stroke-linejoin="round"></g><g ><g><path d="M34.857,3.613C20.084-4.861,8.107,2.081,8.107,19.106v125.637c0,17.042,11.977,23.975,26.75,15.509L144.67,97.275 c14.778-8.477,14.778-22.211,0-30.686L34.857,3.613z"></path></g></g></svg>');
  background-position: 55% 50%;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  border-radius: 50%;
  color: black;
  cursor: pointer;
  transition: color 0.25s, background-color 0.25s;
}

.special-card-video:has(img):hover::after {
  color: var(--color-accent);
  background-color: rgb(255, 255, 255);
  background-image: url('data:image/svg+xml,<svg fill="rgb(252, 199, 0)" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 163.861 163.861" xml:space="preserve"><g stroke-width="0"></g><g stroke-linecap="round" stroke-linejoin="round"></g><g ><g><path d="M34.857,3.613C20.084-4.861,8.107,2.081,8.107,19.106v125.637c0,17.042,11.977,23.975,26.75,15.509L144.67,97.275 c14.778-8.477,14.778-22.211,0-30.686L34.857,3.613z"></path></g></g></svg>');
}

@media screen and (max-width: 1023px) {
  .special-sidebar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0px 8px;
    background: #000;
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    line-height: 1;
  }
  .special-sidebar.sm-active {
    opacity: 1;
    visibility: visible;
  }
  .special-sidebar .swiper-slide {
    width: 90px;
  }
  .special-sidebar .swiper-button-prev,
  .special-sidebar .swiper-button-next {
    display: none;
  }
  .special-nav-item {
    font-size: 14px;
    font-weight: 600;
    color: #6D6D6D;
    padding-top: 2em;
    padding-bottom: 2em;
    line-height: 1;
    display: block;
  }
  .special-nav-item_active {
    color: #fff;
  }
  .outer,
  .inner {
    width: 100%;
  }
}
@media screen and (min-width: 1024px) {
  .special-sidebar {
    position: fixed;
    top: calc(var(--header-height) + var(--x-pad));
    bottom: var(--x-pad);
    left: var(--x-pad);
    width: calc(150px - var(--x-pad));
    z-index: 10;
    opacity: 0;
    visibility: hidden;
  }
  .swiper-sidebar {
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 0;
    width: 100%;
  }
  .swiper-sidebar.swiper-locked .swiper-wrapper {
    justify-content: center;
  }
  .swiper-sidebar .swiper-slide {
    height: auto;
  }
  .special-nav-item {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #6D6D6D;
    transition: color 0.75s;
    text-align: center;
  }
  .special-nav-item:not(.active) {
    cursor: pointer;
  }
  .special-nav-item:not(.active):hover {
    color: var(--color-accent);
  }
  .special-nav-item.active {
    color: #fff;
  }
  .swiper-sidebar .swiper-slide:not(:first-child) .special-nav-item {
    padding-top: 4px;
  }
  .swiper-sidebar .swiper-slide:not(:last-child) .special-nav-item {
    padding-bottom: 4px;
  }
  .special-sidebar .swiper-button-prev,
  .special-sidebar .swiper-button-next {
    width: 100%;
    height: 16px;
    left: 0;
    right: 0;
    margin: 0;
    --swiper-navigation-size: 16px;
    --swiper-theme-color: #fff;
  }
  .special-sidebar .swiper-button-prev:after,
  .special-sidebar .swiper-button-next:after {
    transform: rotate(90deg);
  }
  .special-sidebar .swiper-button-prev {
    top: 0;
    bottom: auto;
    transform: translate(0, -16px);
  }
  .special-sidebar .swiper-button-next {
    top: auto;
    bottom: 0;
    transform: translate(0, 16px);
  }
}
@media screen and (min-width: 1560px) {
  .special-nav-item {
    font-size: 18px;
  }
  .swiper-slide:not(:first-child) .special-nav-item {
    padding-top: 6px;
  }
  .swiper-slide:not(:last-child) .special-nav-item {
    padding-bottom: 6px;
  }
}
.popup-navigation {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  background: #292929 url(/assets/nav-bg-904b8c5f039f56a2734d28aaae0eddc094745899c3ef567e59c898356a4daa04.png);
  display: flex;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s, visibility 0s 0.25s;
}

.show-special-timeline .popup-navigation {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.25s;
}

.popup-navigation-cell {
  position: relative;
  width: 100%;
  flex-grow: 2;
}

.popup-navigation-view {
  position: absolute;
  top: var(--x-pad);
  right: var(--x-pad);
  bottom: var(--x-pad);
  left: var(--x-pad);
  overflow: auto;
}

.popup-nav-list {
  text-align: center;
}

.popup-nav-list-item:not(:first-child) {
  margin-top: 32px;
}

.popup-nav-head {
  font-size: 24px;
  font-weight: 600;
}

.popup-nav-head span {
  cursor: pointer;
  transition: color 0.25s;
}

.popup-nav-head span:hover {
  color: var(--color-accent);
}

.popup-nav-desc {
  font-size: 14px;
  line-height: 1.2;
  margin-top: 1.2em;
}

#popup_navigation_close {
  position: absolute;
  top: var(--x-pad);
  right: var(--x-pad);
  z-index: 10;
}

@media screen and (min-width: 768px) and (max-width: 1279px) {
  #popup_navigation_close {
    top: 1rem;
  }
}
@media screen and (min-width: 1280px) and (max-width: 1559px) {
  #popup_navigation_close {
    top: 1.25rem;
  }
}
@media screen and (min-width: 1560px) {
  #popup_navigation_close {
    top: 1.5rem;
  }
}
@media screen and (min-width: 768px) {
  .popup-nav-list-item:not(:first-child) {
    margin-top: 48px;
  }
  .popup-nav-head {
    font-size: 40px;
  }
  .popup-nav-desc {
    font-size: 21px;
    max-width: 60%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (min-width: 1024px) {
  .popup-nav-head {
    font-size: 48px;
  }
}
.special-timeline-btn-box {
  display: none;
}

@media screen and (min-width: 1024px) {
  .special-timeline-btn-box {
    display: block;
    position: fixed;
    z-index: 10;
    top: calc(var(--header-height) + 16px);
    right: var(--x-pad);
    opacity: 0;
    visibility: hidden;
  }
  .special-timeline-btn {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: flex-end;
    margin: 0;
    padding: 0;
    border: 0 none;
    outline: 0 none;
    background: transparent none;
    cursor: pointer;
    text-transform: uppercase;
    color: #fff;
    transition: color 0.25s;
  }
  .special-timeline-btn:hover {
    color: var(--color-accent);
  }
  .special-timeline-btn-text {
    font-weight: 700;
    margin-right: 16px;
    font-size: 16px;
  }
  .special-timeline-btn-icon {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    width: 42px;
    height: 17px;
  }
  .special-timeline-btn-icon::before,
  .special-timeline-btn-icon::after {
    content: "";
  }
  .special-timeline-btn-icon::before,
  .special-timeline-btn-icon::after,
  .special-timeline-btn-icon span {
    display: block;
    height: 3px;
    background-color: currentColor;
  }
  .special-timeline-btn-icon::before {
    width: 100%;
  }
  .special-timeline-btn-icon span {
    width: 75%;
  }
  .special-timeline-btn-icon::after {
    width: 50%;
  }
}
@media screen and (min-width: 1560px) {
  .special-timeline-btn-text {
    font-size: 20px;
  }
}