* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
:root {
    --color-red: white;
    --color-blue: black;
  }
body {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: linear-gradient(-50deg, black,black,white,black,black,white,black,black);
    animation: gradient 5s ease infinite;
    background-size: 400% 400%;
    height: 100vh;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%; 
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}
.container .coin-price{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 20px;
    border-radius: 5px;
    box-shadow: 0 0 3px #ccc;
    margin: 7px;
}


.container .coin-price .logo{
    width: 70px;
    margin-right: 10px;
}
.container .coin-price .logo img{
    width: 100%;
}
.container .coin-price div{
    display: block;
}
.container .coin-price div h1{
    font-size: 20px;
}
.coin-price {
    font-size: 20px;
}

@keyframes rainbow {
    0%, 100% {
        fill: red;
    }
    33% {
        fill: blue;
    }
    66% {
        fill: yellow;
    }
}

svg {
    animation: rainbow 60s linear infinite;
}

label {
    color: ;
    font-size: 4em;
    margin: 24px;
    font-weight: bold;
    letter-spacing: 4px;
    position: relative;
    animation: no1se 0.1 liner infinite both;
}
label:nth-child(1)::before,
label:nth-child(1)::after {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

label:nth-child(1)::before {
  color: var(--color-red);
  animation: shaking 0.3s linear infinite;
}

label:nth-child(1)::after {
  color: var(--color-blue);
  animation: shaking 0.3s linear infinite reverse;
}

@keyframes shaking {
  0% {
    transform: translate(0);
  }
  20% {
    transform: translate(-3px, 3px);
  }
  40% {
    transform: translate(-3px, -3px);
  }
  60% {
    transform: translate(3px, 3px);
  }
  80% {
    transform: translate(3px, -3px);
  }
  100% {
    transform: translate(0);
  }
}


