/* =========== Timeline Mobile Css =========== */

.desktop-visible {
  display: block;
}
.desktop-hidden {
  display: none;
}

@media (max-width: 768px) {
  .timeline-media {
    overflow-x: hidden;
  }
}

@media (max-width: 768px) {
  .tl-caption-relative::after,
  .tl-caption .wp-caption-text,
  .tl-caption p.wp-caption-text {
    font-size: 12px !important;
  }
  .ctl-wrapper .ctl-icondot {
    position: absolute;
    width: calc(var(--ctw-ibx-size) / 4);
    height: calc(var(--ctw-ibx-size) / 4);
  }
  .ctl-wrapper .ctl-vertical-wrapper .ctl-icondot,
  .ctl-wrapper .ctl-vertical-wrapper .ctl-story.ctl-story-left .ctl-icondot {
    left: calc(var(--ctw-ibx-size) / 0.7 - var(--ctw-ibx-size) * 1.85);
  }

  .historical-timeline .ctl-inner-line-fill {
    width: 6px !important;
  }
  img.img-fluid.bottom-left-10.image-with-text-10.desktop-hidden {
    width: 146px;
    bottom: -1%;
  }

  .timeline-body
    .template-10.timeline-media.t10-1954
    .top-left-10.desktop-hidden {
    width: 80px;
    top: 13% !important;
  }

  .desktop-hidden {
    display: block;
  }
  .desktop-visible {
    display: none;
  }
  .ctl-wrapper .ctl-story {
    margin-bottom: calc(40px + var(--ctw-cbx-bottom-margin)) !important;
  }
  .ctl-story.story-decade-placeholder {
    float: left !important;
  }
  .timeline-body .template-7.timeline-media .top-left-7 {
    width: 120px;
    left: 6%;
    z-index: 3;
  }
  .timeline-body .template-7.timeline-media .bottom-left-7 {
    max-width: 136px;
    left: 0;
    bottom: 0;
    z-index: 2;
  }
  .timeline-body .template-7.timeline-media .top-right-7 {
    position: relative;
    display: block;
    max-width: 180px;
    z-index: 1;
  }
  .timeline-body .template-7.timeline-media .big-solid-block-7 {
    max-width: 80px;
    bottom: 26%;
    z-index: 0;
  }
  .timeline-body .template-7.timeline-media .small-solid-block-7 {
    max-width: 80px;
    bottom: 12%;
    z-index: 0;
  }
  .timeline-body .template-7.timeline-media .big-solid-block-7-red {
    width: 80px;
    right: 75%;
    bottom: 61%;
    z-index: 0;
  }

  .timeline-body .template-7.timeline-media.t7-2010 .bottom-left-7 {
    width: 270px;
  }
  .timeline-body .template-7.timeline-media.t7-1983 .small-solid-block-7 {
    bottom: 18%;
  }
  .timeline-body .template-7.timeline-media.t7-2010 .small-solid-block-7 {
    bottom: 18%;
  }
  .timeline-body .template-7.timeline-media.t7-2001 .small-solid-block-7 {
    bottom: 18%;
  }
  .timeline-body .template-7.timeline-media.t7-1956 .small-solid-block-7 {
    bottom: 18%;
  }
  .timeline-body .template-7.timeline-media.t7-1941 .small-solid-block-7 {
    bottom: 18%;
  }
  .timeline-body .template-13.timeline-media .bottom-right-13 {
    width: 100px !important;
    left: auto;
    right: 5%;
    z-index: -1;
  }
  .timeline-body .template-13 a.glightbox.main-image {
    width: 100%;
  }
  .timeline-body .template-13.timeline-media .solid-block-13 {
    width: 33%;
    left: 29%;
    top: 70px;
    z-index: 1;
  }
  .timeline-body .template-13.timeline-media .top-left-13 {
    width: 107px;
    left: 5%;
    top: 1%;
    z-index: 2;
  }
  .timeline-body .template-13.timeline-media .top-right-13 {
    width: 21%;
    right: 12%;
    top: 10%;
    z-index: 4;
  }
  .timeline-body .template-13.timeline-media.t13-1960 .bottom-right-13 {
    bottom: 10%;
  }

  .timeline-body .template-13.timeline-media.t13-1977 .bottom-right-13 {
    bottom: 10%;
  }

  .timeline-body .template-13.timeline-media.t13-1987 .bottom-right-13 {
    bottom: 12%;
  }

  .timeline-body .template-13.timeline-media.t13-1993 .bottom-right-13 {
    bottom: 7%;
  }

  .timeline-body .template-10.timeline-media .top-left-10 {
    width: 80px;
    left: 0%;
    top: 25%;
    z-index: 3;
  }

  .timeline-body .template-10.timeline-media .main-image-10 {
    z-index: 4;
    left: 12%;
  }
  .timeline-body .template-10.timeline-media .top-right-10 {
    max-width: 132px;
    right: 0px;
    top: 0;
    z-index: 0;
  }

  .timeline-body .template-10.timeline-media .bottom-right-10 {
    width: 150px;
    bottom: 10%;
    z-index: 5;
  }

  .timeline-body .template-10.timeline-media .bottom-left-10 {
    max-width: 90px;
    bottom: 18px;
  }

  .timeline-body .template-10.timeline-media .center-right-10 {
    right: 20%;
    top: 60%;
    width: 56px;
  }

  .timeline-body .template-10.timeline-media .center-right-arrow-10 {
    right: -10px;
    top: 50%;
    width: 61px;
  }

  /* .timeline-body .template-10.timeline-media.t10-1945 .top-right-10 {
    max-width: 186px;
  } */

  .timeline-body .template-10.timeline-media.t10-1954 .top-left-10 {
    width: 171px;
    left: 0%;
    top: -3%;
  }

  .timeline-body
    .template-10.timeline-media.t10-1961
    .image-with-text-10-right {
    max-width: 186px;
  }

  .timeline-body
    .template-10.timeline-media.t10-2017
    .image-with-text-10-right {
    max-width: 186px;
  }

  .timeline-body
    .template-10.timeline-media.t10-1970
    .image-with-text-10-right {
    max-width: 186px;
  }

  .timeline-body
    .template-10.timeline-media.t10-1974
    .image-with-text-10-right {
    max-width: 150px;
  }

  /* template 6 */
  .template-5.timeline-media .main-image-5 {
    width: 210px;
    max-width: 210px;
  }

  .template-5.timeline-media .left-bottom-5 {
    max-width: 126px;
    left: 6%;
  }

  .template-5.timeline-media .right-bottom-5 {
    width: 125px;
    max-width: 125px;
    right: 0;
    top: 30%;
    bottom: auto;
  }

  .template-5.timeline-media .top-right-5 {
    width: 80px;
    right: 17%;
    top: 15%;
  }

  .template-5.timeline-media .solid-block-5 {
    width: 70px;
    bottom: 23%;
    left: 45%;
  }

  /* template 6 */
  .img-fluid.bottom-left-6 {
    max-width: 130px;
    left: 5%;
  }

  img.img-fluid.top-left-6 {
    width: 80px;
    left: 0;
    top: 15%;
  }

  img.img-fluid.bottom-left-6 {
    width: 260px;
    top: 52%;
    z-index: 2;
    left: 15%;
  }

  img.img-fluid.small-solid-block-6 {
    width: 80px;
    bottom: 31%;
    right: 0;
  }

  img.img-fluid.big-solid-block-6 {
    width: 120px;
    top: 25%;
    left: 15%;
  }

  /*template 8*/

  img.img-fluid.main-image {
    width: 210px !important;
    max-width: 210px !important;
  }

  .template-8 img.img-fluid.left-bottom {
    max-width: 64px !important;
    top: 60%;
  }

  .template-8 img.img-fluid.right-bottom {
    width: 113px;
    right: 10%;
    top: 46%;
  }

  .template-8 img.img-fluid.top-right {
    width: 100px;
    right: 4%;
    top: 5%;
  }

  .template-8 img.img-fluid.solid-block {
    width: 80px;
    left: 45%;
    top: 15%;
  }
  .template-8 img.img-fluid.left-bottom.big-text-image-8 {
    max-width: 150px !important;
  }

  /* template 9*/

  img.img-fluid.main-image-9 {
    width: 212px;
    margin: 0;
  }
  img.img-fluid.top-left-9 {
    width: 250px;
  }
  img.img-fluid.top-left-9.image-left-without-text-9 {
    max-width: 118px;
    left: 10%;
  }

  img.img-fluid.right-bottom-9 {
    width: 120px;
    top: 70%;
  }

  img.img-fluid.top-right-9 {
    width: 75px;
    left: 36%;
    top: 18%;
  }

  img.img-fluid.solid-block-red-9 {
    width: 80px;
    top: 50%;
  }

  img.img-fluid.left-bottom-9 {
    width: 105px;
    bottom: 17%;
    left: 6%;
  }

  /*template 1*/

  img.img-fluid.main-image-1 {
    width: 250px;
  }

  .img-fluid.bottom-left-1 {
    max-width: 80px;
    bottom: 5%;
    left: 5%;
  }

  img.img-fluid.bottom-right-1 {
    width: 200px;
  }

  /*template 2 */

  img.img-fluid.main-image-2 {
    width: 264px;
  }

  img.img-fluid.bottom-right-2 {
    width: 170px;
    left: 43%;
  }

  img.img-fluid.left-center-2 {
    width: 94px;
    top: 50%;
    z-index: -2;
  }

  /* template 3*/

  img.img-fluid.main-image-3 {
    width: 250px;
  }

  img.img-fluid.bottom-left-3 {
    width: 100px;
    bottom: 15%;
  }

  img.img-fluid.bottom-right-3 {
    width: 200px;
    bottom: 9%;
  }

  img.img-fluid.top-right-3 {
    width: 54px;
    top: 0;
    right: 10%;
  }

  img.img-fluid.bottom-left-3.transparent-image-3-left {
    bottom: 4%;
  }

  img.img-fluid.bottom-right-3.transparent-image-3-right {
    bottom: -2%;
  }
  /*template 4 */

  .template-4.timeline-media {
    padding-bottom: 100px;
  }

  img.img-fluid.main-image-4 {
    width: 250px;
  }

  img.img-fluid.bottom-left-4 {
    width: 115px;
    bottom: 0;
    left: 10%;
  }

  img.img-fluid.bottom-right-4 {
    width: 130px;
    bottom: -5%;
    right: -10%;
  }

  img.img-fluid.right-center-4 {
    width: 55px;
  }

  img.img-fluid.left-2-11 {
    width: 50px;
  }

  /* img.img-fluid.left-1-11 {
    width: 50px;
    top: 63%;
    left: 15%;
  } */
  img.img-fluid.left-1-11 {
    display: none;
  }

  img.img-fluid.bottom-right-11 {
    width: 75px;
    right: 0;
  }

  a.glightbox.main-image-11 {
    top: 8%;
    width: 300px !important;
    min-width: 161px !important;
    right: -7%;
    position: absolute;
  }

  a.glightbox.main-image-11 img {
    width: 300px;
  }
  /* template 11 */
}

@media (max-width: 768px) {
  .timeline-media.template-2 .main-image-2 {
    width: 178px !important;
  }
  .timeline-media.template-2 .main-image-2 .wp-caption-text {
    max-width: 140px;
  }
  .template-5.timeline-media .main-image-5 {
    max-width: 240px;
  }
  .template-5 .tl-caption.left-bottom-5 .wp-caption-text {
    max-width: 230px;
    width: 200%;
  }
  .template-5 .img-fluid.bottom-left-6 {
    max-width: 128px;
    left: 5%;
  }
  .template-8 .img-fluid.left-bottom {
    max-width: 100px !important;
    left: 3%;
  }

  .template-8 .img-fluid.main-image {
    max-width: 235px;
  }

  /* timeline-media container padding fixed */

  .template-1.timeline-media {
    padding-bottom: 140px;
  }

  .template-3.timeline-media {
    padding-top: 20px;
    padding-bottom: 100px;
  }
  #ctl-story-1589 .template-3.timeline-media {
    padding-bottom: 140px;
  }
  .template-3 .tl-caption .wp-caption-text {
    max-width: 130px;
  }
  .img-fluid.bottom-right-3 {
    max-width: 168px;
  }
  .template-5.timeline-media {
    padding-bottom: 190px;
  }
  .template-5 .tl-caption .wp-caption-text,
  .template-13 .tl-caption-relative::after {
    max-width: 200px;
  }
  #ctl-story-1537 .template-5.timeline-media {
    padding-bottom: 220px;
  }

  .template-6.timeline-media {
    padding-bottom: 135px;
  }

  .template-6 .img-fluid.top-right-6 {
    width: 180px;
  }

  .template-7.timeline-media {
    padding-bottom: 70px;
  }

  #ctl-story-1539 .template-7.timeline-media {
    padding-bottom: 50px;
  }

  .template-7.timeline-media.t7-1956 {
    padding-top: 60px;
    padding-bottom: 100px;
  }

  .template-8.timeline-media {
    padding-top: 100px;
    padding-bottom: 122px;
  }

  #ctl-story-1588 .template-8.timeline-media {
    padding-bottom: 190px;
  }

  #ctl-story-1588 .template-8 .img-fluid.left-bottom-gif {
    max-width: 120px !important;
    left: 15px;
  }

  .template-8 .tl-caption .wp-caption-text {
    max-width: 140px;
  }

  .template-8 .tl-caption.left-bottom-gif .wp-caption-text {
    max-width: 120px;
  }

  .template-9.timeline-media {
    padding-top: 100px;
    padding-bottom: 166px;
  }

  .img-fluid.top-left-img-9 {
    max-width: 150px;
  }

  .img-fluid.top-left-9 {
    max-width: 135px;
  }

  .img-fluid.left-bottom-9 {
    max-width: 130px;
  }

  .template-9 .tl-caption .wp-caption-text {
    max-width: 170px;
  }

  #ctl-story-1591 .template-9.timeline-media {
    padding-bottom: 220px;
  }

  .template-10.timeline-media {
    padding-top: 100px;
  }

  .template-10 .tl-caption .wp-caption-text {
    max-width: 140px;
  }

  .template-11.timeline-media {
    padding-bottom: 75px;
  }

  .template-11.timeline-media .main-image {
    width: 170px;
  }

  .main-image-12 {
    max-width: 90px !important;
  }

  .img-fluid.left-image-12 {
    max-width: 80px;
    top: 22%;
    z-index: 2;
    right: 17%;
  }

  .template-13.timeline-media {
    padding-top: 110px;
    padding-bottom: 144px;
  }
  .img-fluid.bottom-right-13-gif {
    max-width: 130px;
  }
}