* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100vh;
    font-family: Arial, sans-serif;
    text-align: center;
    position: relative;
  }

  .background-gld {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    background: #000000;
    overflow: hidden;
    z-index: -55;
}

.background-gld span {
    width: 1vmin;
    height: 1vmin;
    border-radius: 1vmin;
    backface-visibility: hidden;
    position: absolute;
    animation: move;
    animation-duration: 40;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@keyframes move {
    100% {
        transform: translate3d(0, 0, 1px) rotate(360deg);
    }
}
.backgro{
    color: #ffffff;
    color: #909090;
    color: #dcdcdc;
    
}


.background-gld span:nth-child(0) {
    color: #ffffff;
    top: 54%;
    left: 100%;
    animation-duration: 26s;
    animation-delay: -49s;
    transform-origin: 8vw 14vh;
    box-shadow: -2vmin 0 0.41588745952455575vmin currentColor;
}

.background-gld span:nth-child(1) {
    color: #ffffff;
    top: 80%;
    left: 88%;
    animation-duration: 77s;
    animation-delay: -48s;
    transform-origin: -18vw 5vh;
    box-shadow: -2vmin 0 0.7878112663423793vmin currentColor;
}

.background-gld span:nth-child(2) {
    color: #909090;
    top: 84%;
    left: 73%;
    animation-duration: 50s;
    animation-delay: -33s;
    transform-origin: -2vw 0vh;
    box-shadow: -2vmin 0 0.3489573810536979vmin currentColor;
}

.background-gld span:nth-child(3) {
    color: #dcdcdc;
    top: 22%;
    left: 13%;
    animation-duration: 56s;
    animation-delay: -50s;
    transform-origin: 13vw 13vh;
    box-shadow: 2vmin 0 0.3707053557315375vmin currentColor;
}

.background-gld span:nth-child(4) {
    color: #909090;
    top: 2%;
    left: 10%;
    animation-duration: 21s;
    animation-delay: -93s;
    transform-origin: -15vw -13vh;
    box-shadow: 2vmin 0 0.9331393770086026vmin currentColor;
}

.background-gld span:nth-child(5) {
    color: #dcdcdc;
    top: 15%;
    left: 6%;
    animation-duration: 17s;
    animation-delay: -36s;
    transform-origin: 16vw -18vh;
    box-shadow: 2vmin 0 0.6863979639765576vmin currentColor;
}

.background-gld span:nth-child(6) {
    color: #909090;
    top: 81%;
    left: 100%;
    animation-duration: 52s;
    animation-delay: -81s;
    transform-origin: 18vw 9vh;
    box-shadow: 2vmin 0 0.8843028307259418vmin currentColor;
}

.background-gld span:nth-child(7) {
    color: #909090;
    top: 2%;
    left: 41%;
    animation-duration: 63s;
    animation-delay: -4s;
    transform-origin: 5vw 1vh;
    box-shadow: -2vmin 0 0.5512633813386782vmin currentColor;
}

.background-gld span:nth-child(8) {
    color: #909090;
    top: 41%;
    left: 53%;
    animation-duration: 27s;
    animation-delay: -35s;
    transform-origin: 1vw 10vh;
    box-shadow: 2vmin 0 0.6908865044066026vmin currentColor;
}

.background-gld span:nth-child(9) {
    color: #909090;
    top: 88%;
    left: 92%;
    animation-duration: 13s;
    animation-delay: -58s;
    transform-origin: 18vw 12vh;
    box-shadow: 2vmin 0 0.41749223980361816vmin currentColor;
}

.background-gld span:nth-child(10) {
    color: #dcdcdc;
    top: 55%;
    left: 35%;
    animation-duration: 99s;
    animation-delay: -30s;
    transform-origin: 22vw -17vh;
    box-shadow: -2vmin 0 0.8099415481095349vmin currentColor;
}

.background-gld span:nth-child(11) {
    color: #ffffff;
    top: 13%;
    left: 36%;
    animation-duration: 78s;
    animation-delay: -4s;
    transform-origin: -16vw 8vh;
    box-shadow: -2vmin 0 0.5763756204429464vmin currentColor;
}

.background-gld span:nth-child(12) {
    color: #dcdcdc;
    top: 82%;
    left: 15%;
    animation-duration: 70s;
    animation-delay: -34s;
    transform-origin: 4vw 5vh;
    box-shadow: 2vmin 0 0.46327988744527737vmin currentColor;
}

.background-gld span:nth-child(13) {
    color: #ffffff;
    top: 53%;
    left: 28%;
    animation-duration: 13s;
    animation-delay: -61s;
    transform-origin: 19vw -16vh;
    box-shadow: -2vmin 0 0.6413830430747134vmin currentColor;
}

.background-gld span:nth-child(14) {
    color: #ffffff;
    top: 99%;
    left: 6%;
    animation-duration: 42s;
    animation-delay: -35s;
    transform-origin: -13vw -19vh;
    box-shadow: 2vmin 0 0.9935124542254711vmin currentColor;
}

.background-gld span:nth-child(15) {
    color: #ffffff;
    top: 45%;
    left: 7%;
    animation-duration: 43s;
    animation-delay: -82s;
    transform-origin: -9vw 1vh;
    box-shadow: 2vmin 0 0.6501349469243429vmin currentColor;
}

.background-gld span:nth-child(16) {
    color: #ffffff;
    top: 44%;
    left: 17%;
    animation-duration: 28s;
    animation-delay: -55s;
    transform-origin: -10vw -15vh;
    box-shadow: -2vmin 0 0.5676639085954606vmin currentColor;
}

.background-gld span:nth-child(17) {
    color: #909090;
    top: 8%;
    left: 30%;
    animation-duration: 22s;
    animation-delay: -65s;
    transform-origin: -4vw -13vh;
    box-shadow: 2vmin 0 0.4400473594562371vmin currentColor;
}

.background-gld span:nth-child(18) {
    color: #909090;
    top: 29%;
    left: 56%;
    animation-duration: 24s;
    animation-delay: -56s;
    transform-origin: 24vw -23vh;
    box-shadow: -2vmin 0 0.644737969126586vmin currentColor;
}

.background-gld span:nth-child(19) {
    color: #909090;
    top: 30%;
    left: 60%;
    animation-duration: 33s;
    animation-delay: -1s;
    transform-origin: -13vw 17vh;
    box-shadow: -2vmin 0 0.4843714661708375vmin currentColor;
}

.background-gld span:nth-child(20) {
    color: #ffffff;
    top: 54%;
    left: 35%;
    animation-duration: 101s;
    animation-delay: -69s;
    transform-origin: 10vw -13vh;
    box-shadow: 2vmin 0 0.25051233977956944vmin currentColor;
}

.background-gld span:nth-child(21) {
    color: #909090;
    top: 13%;
    left: 3%;
    animation-duration: 28s;
    animation-delay: -38s;
    transform-origin: -23vw -1vh;
    box-shadow: 2vmin 0 0.38426819677980606vmin currentColor;
}

.background-gld span:nth-child(22) {
    color: #909090;
    top: 78%;
    left: 80%;
    animation-duration: 62s;
    animation-delay: -43s;
    transform-origin: -5vw 2vh;
    box-shadow: -2vmin 0 1.1646239316370466vmin currentColor;
}

.background-gld span:nth-child(23) {
    color: #dcdcdc;
    top: 42%;
    left: 56%;
    animation-duration: 16s;
    animation-delay: -78s;
    transform-origin: 23vw 11vh;
    box-shadow: 2vmin 0 0.595068116328583vmin currentColor;
}

.background-gld span:nth-child(24) {
    color: #909090;
    top: 25%;
    left: 3%;
    animation-duration: 32s;
    animation-delay: -49s;
    transform-origin: 9vw -7vh;
    box-shadow: 2vmin 0 0.4924500023749555vmin currentColor;
}

.background-gld span:nth-child(25) {
    color: #ffffff;
    top: 100%;
    left: 26%;
    animation-duration: 59s;
    animation-delay: -87s;
    transform-origin: 22vw -16vh;
    box-shadow: -2vmin 0 1.088553463105363vmin currentColor;
}

.background-gld span:nth-child(26) {
    color: #dcdcdc;
    top: 97%;
    left: 96%;
    animation-duration: 28s;
    animation-delay: -15s;
    transform-origin: 23vw -20vh;
    box-shadow: 2vmin 0 1.20507563643406vmin currentColor;
}

.background-gld span:nth-child(27) {
    color: #909090;
    top: 12%;
    left: 38%;
    animation-duration: 86s;
    animation-delay: -95s;
    transform-origin: 5vw -1vh;
    box-shadow: -2vmin 0 0.6138231970687417vmin currentColor;
}

.background-gld span:nth-child(28) {
    color: #909090;
    top: 88%;
    left: 82%;
    animation-duration: 60s;
    animation-delay: -15s;
    transform-origin: 8vw 6vh;
    box-shadow: 2vmin 0 1.0464302320714003vmin currentColor;
}

.background-gld span:nth-child(29) {
    color: #dcdcdc;
    top: 99%;
    left: 2%;
    animation-duration: 71s;
    animation-delay: -54s;
    transform-origin: 7vw -3vh;
    box-shadow: -2vmin 0 0.9709027724517212vmin currentColor;
}

.background-gld span:nth-child(30) {
    color: #ffffff;
    top: 69%;
    left: 74%;
    animation-duration: 7s;
    animation-delay: -14s;
    transform-origin: -20vw 14vh;
    box-shadow: -2vmin 0 0.6273899602492438vmin currentColor;
}

.background-gld span:nth-child(31) {
    color: #ffffff;
    top: 63%;
    left: 79%;
    animation-duration: 94s;
    animation-delay: -48s;
    transform-origin: -9vw 7vh;
    box-shadow: 2vmin 0 1.007007948393757vmin currentColor;
}

.background-gld span:nth-child(32) {
    color: #909090;
    top: 78%;
    left: 28%;
    animation-duration: 12s;
    animation-delay: -30s;
    transform-origin: 1vw 20vh;
    box-shadow: 2vmin 0 0.8958077898345859vmin currentColor;
}

.background-gld span:nth-child(33) {
    color: #dcdcdc;
    top: 94%;
    left: 76%;
    animation-duration: 23s;
    animation-delay: -6s;
    transform-origin: -16vw 5vh;
    box-shadow: 2vmin 0 0.3735519192600386vmin currentColor;
}

.background-gld span:nth-child(34) {
    color: #dcdcdc;
    top: 51%;
    left: 74%;
    animation-duration: 69s;
    animation-delay: -30s;
    transform-origin: -24vw -15vh;
    box-shadow: -2vmin 0 0.7912960819166218vmin currentColor;
}

.background-gld span:nth-child(35) {
    color: #909090;
    top: 45%;
    left: 55%;
    animation-duration: 104s;
    animation-delay: -33s;
    transform-origin: -3vw 23vh;
    box-shadow: 2vmin 0 1.2189895938104485vmin currentColor;
}

.background-gld span:nth-child(36) {
    color: #909090;
    top: 78%;
    left: 61%;
    animation-duration: 38s;
    animation-delay: -78s;
    transform-origin: -21vw 25vh;
    box-shadow: 2vmin 0 0.35819507805601325vmin currentColor;
}

.background-gld span:nth-child(37) {
    color: #ffffff;
    top: 33%;
    left: 34%;
    animation-duration: 64s;
    animation-delay: -70s;
    transform-origin: 25vw 2vh;
    box-shadow: 2vmin 0 0.43634812033194414vmin currentColor;
}

.background-gld span:nth-child(38) {
    color: #909090;
    top: 55%;
    left: 75%;
    animation-duration: 34s;
    animation-delay: -47s;
    transform-origin: -19vw -16vh;
    box-shadow: -2vmin 0 1.1730781654471771vmin currentColor;
}

.background-gld span:nth-child(39) {
    color: #ffffff;
    top: 76%;
    left: 39%;
    animation-duration: 29s;
    animation-delay: -65s;
    transform-origin: 10vw -9vh;
    box-shadow: 2vmin 0 0.35967760371654134vmin currentColor;
}

.background-gld span:nth-child(40) {
    color: #909090;
    top: 58%;
    left: 33%;
    animation-duration: 76s;
    animation-delay: -98s;
    transform-origin: -4vw -3vh;
    box-shadow: 2vmin 0 0.8200425625586429vmin currentColor;
}

.background-gld span:nth-child(41) {
    color: #ffffff;
    top: 46%;
    left: 52%;
    animation-duration: 100s;
    animation-delay: -45s;
    transform-origin: -5vw -14vh;
    box-shadow: -2vmin 0 0.2908315931368449vmin currentColor;
}

.background-gld span:nth-child(42) {
    color: #909090;
    top: 72%;
    left: 6%;
    animation-duration: 34s;
    animation-delay: -76s;
    transform-origin: 1vw -19vh;
    box-shadow: 2vmin 0 0.9926869744856502vmin currentColor;
}

.background-gld span:nth-child(43) {
    color: #ffffff;
    top: 65%;
    left: 25%;
    animation-duration: 71s;
    animation-delay: -75s;
    transform-origin: 24vw 6vh;
    box-shadow: 2vmin 0 0.5391509880061863vmin currentColor;
}

.background-gld span:nth-child(44) {
    color: #dcdcdc;
    top: 78%;
    left: 22%;
    animation-duration: 101s;
    animation-delay: -91s;
    transform-origin: 18vw 8vh;
    box-shadow: -2vmin 0 0.5213118734388342vmin currentColor;
}

.background-gld span:nth-child(45) {
    color: #ffffff;
    top: 23%;
    left: 55%;
    animation-duration: 47s;
    animation-delay: -82s;
    transform-origin: 24vw 3vh;
    box-shadow: -2vmin 0 0.5219417054591817vmin currentColor;
}

.background-gld span:nth-child(46) {
    color: #909090;
    top: 15%;
    left: 65%;
    animation-duration: 9s;
    animation-delay: -12s;
    transform-origin: 16vw -7vh;
    box-shadow: 2vmin 0 0.6982092489833407vmin currentColor;
}

.background-gld span:nth-child(47) {
    color: #ffffff;
    top: 92%;
    left: 9%;
    animation-duration: 73s;
    animation-delay: -99s;
    transform-origin: -7vw -10vh;
    box-shadow: -2vmin 0 0.5584361145282981vmin currentColor;
}

.background-gld span:nth-child(48) {
    color: #ffffff;
    top: 82%;
    left: 78%;
    animation-duration: 87s;
    animation-delay: -53s;
    transform-origin: -1vw 2vh;
    box-shadow: 2vmin 0 0.7480916559688179vmin currentColor;
}

.background-gld span:nth-child(49) {
    color: #dcdcdc;
    top: 48%;
    left: 62%;
    animation-duration: 14s;
    animation-delay: -89s;
    transform-origin: 12vw 9vh;
    box-shadow: 2vmin 0 1.0000599727433155vmin currentColor;
}
  
  .loader {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 250px;
    height: 150px;
  }

  .logo-index {
    width: 333px;
    height: 333px;
    background: url('assets/images/kinlogo.png') no-repeat center center / contain;
    animation: heartbeat 2.5s infinite; /* Slowed down to 3s */
  }

  @media (max-width:600px){
      .logo-index {
    width: 166px;
    height: 222px;

  }
  }
  

  .bottom-text {
    position: absolute;
    bottom: 20px;
    text-align: center;
    width: 100%;
  }

  .copyright {
    font-size: 12px;
    color: #888;
  }

  .brand {
    font-size: 22px;
    font-weight: bold;
    color: #ffffff;
    margin-top: 9px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif
  }

  @keyframes heartbeat {
    0%, 100% {
      transform: scale(1);
    }
    25% {
      transform: scale(1.2);
    }
    50% {
      transform: scale(1);
    }
    75% {
      transform: scale(1.2);
    }
  }