/* media query start ****************************************************/
@media only screen and (max-width: 1280px) {
  .timeline-bg {
    height: auto;
    min-height: 100vh;
  }

  .heading-32 {
    font-size: 40rem;
  }

  .para-18 {
    font-size: 24rem;
  }

  .start-system-button {
    font-size: 24rem;
  }

  .para-16 {
    font-size: 22rem;
  }

  .timeline-bg .content-wrapper {
    padding-right: 100rem;
    padding-left: 100rem;
  }

  .padding-r {
    padding-right: 60rem;
  }

  .startbtn {
    font-size: 22rem;
    left: 222rem;
    top: 5rem;
    width: 225rem;
    height: 65rem;
  }

  .image-inner img {
    width: 81%;
    top: 157rem;
    left: 59rem;
  }

  .image-inner1 img {
    width: 81%;
    top: 151rem;
    left: 40rem;
  }

  .tab.data-1 {
    top: 254rem;
    right: 60rem;
  }

  .tab.data-2 {
    right: 54rem;
    bottom: 176rem;
  }

  .tab.data-3 {
    bottom: 8rem;
    left: 308rem;
  }

  .tab.data-4 {
    bottom: 176rem;
    left: 40rem;
  }

  .tab.data-5 {
    left: 44rem;
    top: 254rem;
  }

  .tab.data-6 {
    top: 101rem;
    left: 308rem;
  }

  ul.list-item {
    margin-left: 34rem;
  }

  .blue-overlay br {
    display: none;
  }

  div#imgInner7 img {
    left: 45rem;
    top: 153rem;
    width: 84%;
  }

  .data-indicator.hide .support-indicator::before {
    left: -2rem;
  }
}

@media only screen and (max-width: 991px) {
  :root {
    font-size: .070333333333336vw;
  }

  .order-3-lg {
    order: 3;
  }

  .timeline-bg .content-wrapper {
    padding: 80rem 0 100rem;
  }

  .content-inner1.landing-screen .heading-32.mb-40 {
    margin-bottom: 30rem;
  }

  .padding-r {
    padding-right: 0;
  }

  .timmer-img {
    position: relative;
    width: 75%;
    margin: auto;
  }

  .progress-container {
    top: 67rem;
    left: -8rem;
  }

  img.blue-glow {
    width: 96.2%;
    left: 17rem;
    top: 0px;
  }

  .image-inner img {
    width: 62%;
    top: 220rem;
    left: 237rem;
  }

  .tc-home-icon {
    width: 60rem;
    height: 60rem;
    right: 60rem;
    top: 0rem;
  }
  section {
    padding: 50rem 0 50rem;
}
  .startbtn {
    left: 37%;
    top: 4rem;
    width: 322rem;
    height: 97rem;
    font-size: 30rem;
    border-radius: 29px;
  }

  .tab .title {
    font-size: 36rem;
  }

  .blue-overlay {
    padding: 30rem 30rem;
    width: 100%;
  }

  .mb-30 {
    margin-bottom: 30rem;
  }

  .tab {
    height: 78rem;
    width: 78rem;
    border: 8rem solid rgba(0, 225, 255, 1);
  }

  .tab.data-1 {
    top: 366rem;
    right: 236rem;
  }

  .tab.data-2 {
    right: 225rem;
    bottom: 251rem;
  }

  .tab.data-3 {
    bottom: 2rem;
    left: 46.5%;
  }

  .tab.data-4 {
    left: 202rem;
    bottom: 256rem;
  }

  .tab.data-5 {
    top: 364rem;
    left: 217rem;
  }

  .tab.data-6 {
    top: 139rem;
    left: 46.5%;
  }

  .tab.run, .tab.active {
    border: 8rem solid rgba(255, 255, 255, 0.85);
  }

  .tabs-wrapper .time-span {
    font-size: 26rem;
  }

  .tab.data-2 .time-span {
    left: 110rem;
  }

  .tab.data-1 .time-span {
    left: 120rem;
  }

  .tab.data-3 .time-span {
    top: 100rem;
  }

  .tab.data-4 .time-span {
    right: 120rem;
  }

  .tab.data-5 .time-span {
    right: 110rem;
  }

  .tabs-wrapper .tab.active .time-span {
    font-size: 40rem;
  }

  .start-content {
    padding-right: 0;
    width: 100%;
    padding-top: 0rem;
  }

  .data-indicator .icon-box {
    border-left: none;
    transition: all 0.3s ease-in;
    padding: 20rem 15rem 0rem 0rem;
  }

  .data-indicator .icon-box.active {
    border-top: 4rem solid #FF7E24;
    border-left: none;
    transition: all 0.3s ease-in;
  }

  .data-indicator {
    display: flex;
    justify-content: space-between;
    width: 100%;
    border-top: 1px solid #0046A0;
  }

  .data-indicator .img-content {
    width: 80rem;
    height: 60rem;
    margin-right: 20rem !important;
    position: relative;
  }

  ul.list-item {
    margin-left: 36rem;
    margin-top: 8rem;
    margin-bottom: 8rem;
  }

  .tabs-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    transform: translate(0%, 0%);
    z-index: 99;
  }

  .inner-inner-content {
    bottom: unset;
    top: 40%;
  }

  .timeline-bg {
    align-items: flex-start;
  }

  .tc-home-icon img {
    opacity: 1;
  }

  span.text-sm {
    font-size: 20rem;
    margin-left: 8rem;
  }

  div#imgInner7 img {
    width: 63%;
    top: 220rem;
    left: 223rem;
  }

  button.replay-btn {
    bottom: 27%;
    left: 44%;
    font-size: 40rem;
  }

  .order-2-lg {
    order: 2;
  }

  .order-1-lg {
    order: 1;
  }

  .progress-bar {
    width: 100%;
    height: 100%;
  }

  .heading-96 {
    font-size: 180rem;
  }

  .image-inner1 img {
    width: 63%;
    top: 196rem;
    left: 232rem;
  }

  @keyframes pulse {
    0% {
      box-shadow: 0 0 0 0px rgb(255, 126, 36, 0.7);
    }

    100% {
      box-shadow: 0 0 7px 25px rgba(0, 112, 244, 0);
    }
  }

  .data-indicator.hide .support-indicator::before {
    content: none;
  }

  .data-indicator.hide .icon-box4 {
    border-left: none;
    border-top: 4rem solid #FF7E24;
    transition: all 0.3s ease-in;
  }

  .data-indicator.hide {
    justify-content: center;
  }
}

@media only screen and (max-width: 767px) {

  .heading-32 {
    font-size: 56rem;
  }

  .tabs-wrapper .tab.active .time-span {
    font-size: 44rem;
  }

  .para-16, .para-18, .start-system-button, .tabs-wrapper .time-span {
    font-size: 34rem;
  }

  .tab .title {
    font-size: 28rem;
    margin-top: 3rem;
  }

  .start-system-button img {
    object-position: -40rem 0rem;
    width: 40rem;
    height: 40rem;
    margin-left: 20rem;
  }

  .data-indicator .icon-box.active {
    border-top: 3px solid #FF7E24;
  }

  .list-item ::marker {
    font-size: 32rem;
  }

  ul.list-item {
    margin-left: 55rem;
  }

  .tc-home-icon {
    width: 70rem;
    height: 70rem;
    right: 60rem;
  }

  .content-inner .para-18.mb-30 {
    margin-bottom: 50rem;
  }

  .mb-30 {
    margin-bottom: 40rem;
  }

  span.text-sm {
    font-size: 26rem;
    margin-left: 8rem;
  }

  .para-28 {
    font-size: 40rem;
  }

  @keyframes pulse {
    0% {
      box-shadow: 0 0 0 0px rgb(255, 126, 36, 0.7);
    }

    100% {
      box-shadow: 0 0 7px 18px rgba(0, 112, 244, 0);
    }
  }

  .data-indicator.hide .icon-box4 {
    border-top: 3px solid #FF7E24;
  }
}

@media only screen and (max-width: 575px) {
  :root {
    font-size: .092333333333336vw;
  }

  .tab {
    height: 60rem;
    width: 60rem;
    border: 7rem solid rgba(0, 225, 255, 1);
  }

  .tab.data-1 {
    top: 263rem;
    right: 184rem;
  }

  .tab.data-2 {
    right: 173rem;
    bottom: 185rem;
  }

  .tab.data-3 {
    bottom: 3rem;
    left: 46%;
  }

  .tab.data-4 {
    left: 157rem;
    bottom: 184rem;
  }

  .tab.data-5 {
    top: 260rem;
    left: 169rem;
  }

  .tab.data-6 {
    top: 103rem;
    left: 46%;
  }

  .progress-container {
    top: 50rem;
    left: -3rem;
  }

  .startbtn {
    left: 36.5%;
    top: 3rem;
    font-size: 32rem;
    width: 241rem;
    height: 70rem;
  }

  .data-indicator .icon-box {
    padding: 30rem 15rem 0rem 0rem;
  }

  .tc-home-icon {
    width: 75rem;
    height: 75rem;
    right: 30px;
  }

  .timeline-bg .icon-box img {
    margin-right: 20rem;
    width: 80rem;
  }

  .image-inner img {
    width: 62%;
    top: 166rem;
    left: 179rem;
  }

  .inner-inner-content {
    bottom: unset;
    top: 36%;
  }

  .inner-inner-content .heading-32.mb-40 {
    margin-bottom: 10rem;
  }

  section {
    padding: 40px 0 40px;
  }

  .mb-30 {
    margin-bottom: 30rem;
  }

  .mb-30.heading-32 {
    margin-bottom: 30rem;
  }

  .content-inner .para-18.mb-30 {
    margin-bottom: 40rem;
  }

  .start-system-button {
    padding: 25rem 80rem;
  }

  .container {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }

  .tab.data-4 .time-span, .tab.data-5 .time-span {
    right: 100rem;
  }

  .tab.data-2 .time-span, .tab.data-1 .time-span {
    left: 100rem;
  }

  .tab.data-3 .time-span {
    top: 90rem;
  }

  .startbtn:hover {
    transform: scale(1);
    transition: all 0.3s ease-in;
  }

  img.blue-glow {
    width: 95.5%;
    left: 12rem;
    top: 0px;
  }

  ul.list-item {
    margin-left: 15px;
  }

  .list-item ::marker {
    font-size: 14px;
  }

  div#imgInner7 img {
    width: 61%;
    top: 163rem;
    left: 170rem;
  }

  button.replay-btn {
    bottom: 25%;
    left: 42%;
    font-size: 40rem;
  }

  .timeline-bg .content-wrapper {
    padding: 100rem 0 90rem;
  }

  p.para-16.fraction.text-white.mb-30 {
    font-size: 28rem;
  }

  .tab.run, .tab.active {
    border: 7rem solid rgba(255, 255, 255, 0.85);
  }

  .progress-bar {
    width: 99%;
    height: 100%;
  }

  .heading-96 {
    font-size: 120rem;
  }

  .image-inner1 img {
    width: 60%;
    top: 158rem;
    left: 160rem;
  }
}

@media only screen and (max-width: 425px) {
  .para-16, .para-18, .start-system-button, .tabs-wrapper .time-span {
    font-size: 42rem;
  }

  .blue-overlay {
    padding: 40rem;
  }

  .heading-32 {
    font-size: 66rem;
  }

  .content-inner1.landing-screen .heading-32.mb-40 {
    margin-bottom: 40rem;
  }

  .mb-40 {
    margin-bottom: 50rem;
  }

  ul.list-item {
    margin-left: 14px;
  }

  .inner-inner-content .para-18 {
    font-size: 32rem;
  }

  .start-system-button img {
    object-position: -55rem 0rem;
    width: 55rem;
    height: 55rem;
  }

  .content-inner .para-18.mb-30 {
    margin-bottom: 44rem;
  }

  .tc-home-icon {
    top: -25px;
  }

  .tab.data-5 {
    top: 254rem;
    left: 165rem;
  }

  .tab.data-1 {
    top: 254rem;
    right: 177rem;
  }

  .tab.data-2 {
    right: 165rem;
    bottom: 180rem;
  }

  .tab.data-4 {
    left: 146rem;
    bottom: 180rem;
  }

  .tab.data-3 {
    bottom: 0rem;
    left: 46%;
  }

  div#imgInner7 img {
    width: 63%;
    top: 154rem;
    left: 158rem;
  }

  button.replay-btn {
    bottom: 23%;
    left: 40%;
    font-size: 40rem;
  }

  .tab {
    height: 56rem;
    width: 56rem;
  }

  p.para-16.fraction.text-white.mb-30 {
    font-size: 34rem;
  }

  .image-inner img {
    width: 63%;
    top: 150rem;
    left: 162rem;
  }

  .startbtn {
    left: 36.5%;
    top: 0rem;
    font-size: 32rem;
    width: 234rem;
    height: 70rem;
  }

  @keyframes pulse {
    0% {
      box-shadow: 0 0 0 0px rgb(255, 126, 36, 0.7);
    }

    100% {
      box-shadow: 0 0 7px 15px rgba(0, 112, 244, 0);
    }
  }
}

@media only screen and (max-width: 360px) {
  .para-16, .para-18, .start-system-button {
    font-size: 48rem;
  }

  .tabs-wrapper .time-span, .data-indicator .para-16 {
    font-size: 42rem;
  }

  .data-indicator .img-content {
    width: 85rem;
    height: 65rem;
  }

  .tc-home-icon {
    width: 85rem;
    height: 90rem;
  }

  .tab.data-5 {
    top: 248rem;
    left: 160rem;
  }

  .tab.data-1 {
    top: 246rem;
    right: 168rem;
  }

  .tab.data-2 {
    right: 155rem;
    bottom: 171rem;
  }

  .tab.data-4 {
    left: 143rem;
    bottom: 171rem;
  }

  .image-inner img {
    width: 64%;
    top: 154rem;
    left: 159rem;
  }

  .startbtn {
    left: 36.7%;
    top: 1rem;
    width: 224rem;
    height: 67rem;
  }

  @keyframes pulse {
    0% {
      box-shadow: 0 0 0 0px rgb(255, 126, 36, 0.7);
    }

    100% {
      box-shadow: 0 0 5px 10px rgba(0, 112, 244, 0);
    }
  }
}


/* media query start ******************************************************/