@media all and (max-width: 1000px) {

  .top-svg{
    width:150px;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
  }

  .lineup-3{
    fill: none;
  }
  .lineup-4{
    fill: none;
  }
  .lineup-5{
    fill: none;
  }
  .lineup-6{
    fill: none;
  }
  .lineup-7{
    fill: none;
  }
  .lineup-8{
    fill: none;
  }
  .lineup-9{
    fill: none;
  }
  .lineup-10{
    fill: none;
  }
  .lineup-11{
    fill: none;
  }
  .lineup-12{
    fill: none;
  }

    .cls-1 {
      stroke: #0edc89;
      stroke-dasharray: 2000;
      /* stroke-dashoffset: 2000; */
      stroke-width: 90px;
      -webkit-animation: heart_line_1 0.7s linear 5s;
      animation: heart_line_1 0.7s linear 5s;
      fill: none;
      opacity: 0;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      }
      @keyframes heart_line_1 {
      0% { stroke-dashoffset: 2000;opacity: 1 }
      1% { opacity: 1;}
      100% { stroke-dashoffset: 0;opacity: 1 }
      }
      @-webkit-keyframes heart_line_1 {
      0% { stroke-dashoffset: 2000;opacity: 1 }
      1% { opacity: 1;}
      100% { stroke-dashoffset: 0;opacity: 1 }
      }

      .cls-2 {
        stroke: #E30012;
        stroke-dasharray: 5000;
        /* stroke-dashoffset: 2000; */
        stroke-width: 120px;
        -webkit-animation: heart_line_2 2s linear 4.5s;
        animation: heart_line_2 2s linear 4.5s;
        fill: none;
        opacity: 0;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        }
        @keyframes heart_line_2 {
        0% { stroke-dashoffset: 5000;opacity: 1;}
        1% { opacity: 1;}
        100% { stroke-dashoffset: 0;opacity: 1 }
        }
        @-webkit-keyframes heart_line_2 {
        0% { stroke-dashoffset: 5000;opacity: 1 }
        1% { opacity: 1;}
        100% { stroke-dashoffset: 0;opacity: 1 }
        }

        .cls-3 {
          stroke: #0edc89;
          stroke-dasharray: 2000;
          /* stroke-dashoffset: 2000; */
          stroke-width: 90px;
          -webkit-animation: heart_line_3 0.7s linear 0.3s;
          animation: heart_line_3 0.7s linear 0.3s;
          fill: none;
          opacity: 0;
          -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
          }
          @keyframes heart_line_3 {
          0% { stroke-dashoffset: 2000;opacity: 1 }
          1% { opacity: 1;}
          100% { stroke-dashoffset: 0;opacity: 1 }
          }
          @-webkit-keyframes heart_line_3 {
          0% { stroke-dashoffset: 2000;opacity: 1 }
          1% { opacity: 1;}
          100% { stroke-dashoffset: 0;opacity: 1 }
          }

          .cls-4 {
            stroke: #E30012;
            stroke-dasharray: 5000;
            /* stroke-dashoffset: 2000; */
            stroke-width: 110px;
            -webkit-animation: heart_line_4 1.2s linear 0.3s;
            animation: heart_line_4 1.2s linear 0.3s;
            fill: none;
            opacity: 0;
            -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
            }
            @keyframes heart_line_4 {
            0% { stroke-dashoffset: 5000;opacity: 1 }
            1% { opacity: 1;}
            100% { stroke-dashoffset: 0;opacity: 1 }
            }
            @-webkit-keyframes heart_line_4 {
            0% { stroke-dashoffset: 5000;opacity: 1 }
            1% { opacity: 1;}
            100% { stroke-dashoffset: 0;opacity: 1 }
            }

            .cls-5{
              stroke: #0edc89;
              stroke-dasharray: 5000;
              /* stroke-dashoffset: 2000; */
              stroke-width: 100px;
              -webkit-animation: heart_line_5 1.2s linear 0.3s;
              animation: heart_line_5 1.2s linear 0.3s;
              fill: none;
              opacity: 0;
              -webkit-animation-fill-mode: forwards;
              animation-fill-mode: forwards;
              }
              @keyframes heart_line_5 {
              0% { stroke-dashoffset: 5000;opacity: 1 }
              1% { opacity: 1;}
              100% { stroke-dashoffset: 0;opacity: 1 }
              }
              @-webkit-keyframes heart_line_5 {
              0% { stroke-dashoffset: 5000;opacity: 1 }
              1% { opacity: 1;}
              100% { stroke-dashoffset: 0;opacity: 1 }
              }

              .cls-6{
                stroke: #E30012;
                stroke-dasharray: 5000;
                /* stroke-dashoffset: 2000; */
                stroke-width: 90px;
                -webkit-animation: heart_line_6 1.2s linear 0.3s;
                animation: heart_line_6 1.2s linear 0.3s;
                fill: none;
                opacity: 0;
                -webkit-animation-fill-mode: forwards;
                animation-fill-mode: forwards;
                }
                @keyframes heart_line_6 {
                0% { stroke-dashoffset: 5000;opacity: 1 }
                1% { opacity: 1;}
                100% { stroke-dashoffset: 0;opacity: 1 }
                }
                @-webkit-keyframes heart_line_6 {
                0% { stroke-dashoffset: 5000;opacity: 1 }
                1% { opacity: 1;}
                100% { stroke-dashoffset: 0;opacity: 1 }
                }

                .cls-7{
                  stroke: #E30012;
                  stroke-dasharray: 2000;
                  /* stroke-dashoffset: 2000; */
                  stroke-width: 110px;
                  -webkit-animation: heart_line_7 0.7s linear 0.3s;
                  animation: heart_line_7 0.7s linear 0.3s;
                  fill: none;
                  opacity: 0;
                  -webkit-animation-fill-mode: forwards;
                  animation-fill-mode: forwards;
                  }
                  @keyframes heart_line_7 {
                  0% { stroke-dashoffset: 2000;opacity: 1 }
                  1% { opacity: 1;}
                  100% { stroke-dashoffset: 0;opacity: 1 }
                  }
                  @-webkit-keyframes heart_line_7 {
                  0% { stroke-dashoffset: 2000;opacity: 1 }
                  1% { opacity: 1;}
                  100% { stroke-dashoffset: 0;opacity: 1 }
                  }

                  .cls-8{
                    stroke: #0edc89;
                    stroke-dasharray: 5000;
                    /* stroke-dashoffset: 2000; */
                    stroke-width: 100px;
                    -webkit-animation: heart_line_8 1.2s linear 0.3s;
                    animation: heart_line_8 1.2s linear 0.3s;
                    fill: none;
                    opacity: 0;
                    -webkit-animation-fill-mode: forwards;
                    animation-fill-mode: forwards;
                    }
                    @keyframes heart_line_8 {
                    0% { stroke-dashoffset: 5000;opacity: 1 }
                    1% { opacity: 1;}
                    100% { stroke-dashoffset: 0;opacity: 1 }
                    }
                    @-webkit-keyframes heart_line_8 {
                    0% { stroke-dashoffset: 5000;opacity: 1 }
                    1% { opacity: 1;}
                    100% { stroke-dashoffset: 0;opacity: 1 }
                    }

                    .cls-9{
                      stroke: #0edc89;
                      stroke-dasharray: 5000;
                      /* stroke-dashoffset: 2000; */
                      stroke-width: 100px;
                      -webkit-animation: heart_line_9 1.2s linear 0.3s;
                      animation: heart_line_9 1.2s linear 0.3s;
                      fill: none;
                      opacity: 0;
                      -webkit-animation-fill-mode: forwards;
                      animation-fill-mode: forwards;
                      }
                      @keyframes heart_line_9 {
                      0% { stroke-dashoffset: 5000;opacity: 1 }
                      1% { opacity: 1;}
                      100% { stroke-dashoffset: 0;opacity: 1 }
                      }
                      @-webkit-keyframes heart_line_9 {
                      0% { stroke-dashoffset: 5000;opacity: 1 }
                      1% { opacity: 1;}
                      100% { stroke-dashoffset: 0;opacity: 1 }
                      }

                      .cls-10{
                        stroke: #E30012;
                        stroke-dasharray: 5000;
                        /* stroke-dashoffset: 2000; */
                        stroke-width: 180px;
                        -webkit-animation: heart_line_10 1.2s linear 0.3s;
                        animation: heart_line_10 1.2s linear 0.3s;
                        fill: none;
                        opacity: 0;
                        -webkit-animation-fill-mode: forwards;
                        animation-fill-mode: forwards;
                        }
                        @keyframes heart_line_10 {
                        0% { stroke-dashoffset: 5000;opacity: 1 }
                        1% { opacity: 1;}
                        100% { stroke-dashoffset: 0;opacity: 1 }
                        }
                        @-webkit-keyframes heart_line_10 {
                        0% { stroke-dashoffset: 5000;opacity: 1 }
                        1% { opacity: 1;}
                        100% { stroke-dashoffset: 0;opacity: 1 }
                        }

                        .cls-11{
                          stroke: #E30012;
                          stroke-dasharray: 5000;
                          /* stroke-dashoffset: 2000; */
                          stroke-width: 100px;
                          -webkit-animation: heart_line_11 1.2s linear 0.3s;
                          animation: heart_line_11 1.2s linear 0.3s;
                          fill: none;
                          opacity: 0;
                          -webkit-animation-fill-mode: forwards;
                          animation-fill-mode: forwards;
                          }
                          @keyframes heart_line_11 {
                          0% { stroke-dashoffset: 5000;opacity: 1 }
                          1% { opacity: 1;}
                          100% { stroke-dashoffset: 0;opacity: 1 }
                          }
                          @-webkit-keyframes heart_line_11 {
                          0% { stroke-dashoffset: 5000;opacity: 1 }
                          1% { opacity: 1;}
                          100% { stroke-dashoffset: 0;opacity: 1 }
                          }

                          .cls-12{
                            stroke: #0edc89;
                            stroke-dasharray: 5000;
                            /* stroke-dashoffset: 2000; */
                            stroke-width: 100px;
                            -webkit-animation: heart_line_11 1.2s linear 0.3s;
                            animation: heart_line_11 1.2s linear 0.3s;
                            fill: none;
                            opacity: 0;
                            -webkit-animation-fill-mode: forwards;
                            animation-fill-mode: forwards;
                            }
                            @keyframes heart_line_12 {
                            0% { stroke-dashoffset: 5000;opacity: 1 }
                            1% { opacity: 1;}
                            100% { stroke-dashoffset: 0;opacity: 1 }
                            }
                            @-webkit-keyframes heart_line_12 {
                            0% { stroke-dashoffset: 5000;opacity: 1 }
                            1% { opacity: 1;}
                            100% { stroke-dashoffset: 0;opacity: 1 }
                            }



                          }