* {
    margin: 0;
    padding: 0
}

/*Coin*/
.bitcoin {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 2%;
  z-index: 1000;
} 

.coin {
  font-size: 200px;
  width: 0.1em;
  height: 1em;
  background: linear-gradient(#faa504, #141001);
  margin: auto;
  left: 0;
  right: 0;
  bottom: 0;
  animation: rotate_4001510 7s infinite linear;
  transform-style: preserve-3d;
}

.coin .side, .coin:before, .coin:after {
  content: "";
  position: absolute;
  width: 1em;
  height: 1em;
  overflow: hidden;
  border-radius: 50%;
  right: -0.4em;
  text-align: center;
  line-height: 1;
  transform: rotateY(-90deg);
  -moz-backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.coin .tails, .coin:after {
  left: -0.4em;
  transform: rotateY(90deg);
}

.coin:before, .coin:after {
  background: linear-gradient(#faa504, #141001);
  backface-visibility: hidden;
  transform: rotateY(90deg);
}

.coin:after {
  transform: rotateY(-90deg);
}

@keyframes rotate_4001510 {
  100% {
    transform: rotateY(360deg);
  }
}

.svg_back {
  transform: scaleX(-1);
}


#landing-page{
  height: 80vh;
  background:url(https://cdn.dribbble.com/users/43762/screenshots/1193020/line-graph-dribbbble.gif) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
}

.landing-content {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin-top: 12%;
  line-height: 1.7;
  font-family: "Lato", sans-serif;
  font-weight: 700;
}

.landing-content h3, .landing-content h1{
  text-align: center;
  color: white;
  font-size: 32px;
}

.landing-content h3 {
  color: yellow;
}

.landing-content h1 {
  font-size: 65px;
}

/*Landing Btn*/
.landing-btn {
  background: linear-gradient(30deg, #000 35%, #ea8b19 73%);
  position: relative;
  padding: 20px 45px;
  font-size: 20px;
  font-weight: 500;
  color: white;
  border: 3px solid #ea8b19;
  border-radius: 8px;
  transition: all .3s ease-in-out;
  margin-top: 5%;
  display: flex;
  justify-content: center;
  align-items: center;
}



.star-1 {
  position: absolute;
  fill: #ea8b19;
  top: 20%;
  left: 20%;
  width: 25px;
  height: auto;
  filter: drop-shadow(0 0 0 #ea8b19);
  z-index: -5;
  transition: all 1s cubic-bezier(0.05, 0.83, 0.43, 0.96);
}

.star-2 {
  position: absolute;
  fill: #ea8b19;
  top: 45%;
  left: 45%;
  width: 15px;
  height: auto;
  filter: drop-shadow(0 0 0 #ea8b19);
  z-index: -5;
  transition: all 1s cubic-bezier(0, 0.4, 0, 1.01);
}

.star-3 {
  position: absolute;
  fill: #ea8b19;
  top: 40%;
  left: 40%;
  width: 5px;
  height: auto;
  filter: drop-shadow(0 0 0 #ea8b19);
  z-index: -5;
  transition: all 1s cubic-bezier(0, 0.4, 0, 1.01);
}

.star-4 {
  position: absolute;
  fill: #ea8b19;
  top: 20%;
  left: 40%;
  width: 8px;
  height: auto;
  filter: drop-shadow(0 0 0 #ea8b19);
  z-index: -5;
  transition: all .8s cubic-bezier(0, 0.4, 0, 1.01);
}

.star-5 {
  position: absolute;
  fill: #ea8b19;
  top: 25%;
  left: 45%;
  width: 15px;
  height: auto;
  filter: drop-shadow(0 0 0 #ea8b19);
  z-index: -5;
  transition: all .6s cubic-bezier(0, 0.4, 0, 1.01);
}

.star-6 {
  position: absolute;
  fill: #ea8b19;
  top: 5%;
  left: 50%;
  width: 5px;
  height: auto;
  filter: drop-shadow(0 0 0 #ea8b19);
  z-index: -5;
  transition: all .8s ease;
}

.landing-btn:hover {
  background: #000;
  color: #ea8b19;
  box-shadow: 0 0 50px #ea8b19;
}

.landing-btn:hover .star-1 {
  position: absolute;
  top: -110%;
  left: -60%;
  width: 30px;
  height: auto;
  filter: drop-shadow(0 0 10px #ea8b19);
  z-index: 2;
}

.landing-btn:hover .star-2 {
  position: absolute;
  top: -45%;
  left: 0%;
  width: 20px;
  height: auto;
  filter: drop-shadow(0 0 10px #ea8b19);
  z-index: 2;
}

.landing-btn:hover .star-3 {
  position: absolute;
  top: 55%;
  left: 15%;
  width: 11px;
  height: auto;
  filter: drop-shadow(0 0 10px #ea8b19);
  z-index: 2;
}

.landing-btn:hover .star-4 {
  position: absolute;
  top: 45%;
  left: 85%;
  width: 15px;
  height: auto;
  filter: drop-shadow(0 0 10px #ea8b19);
  z-index: 2;
}

.landing-btn:hover .star-5 {
  position: absolute;
  top: 25%;
  left: 140%;
  width: 25px;
  height: auto;
  filter: drop-shadow(0 0 10px #ea8b19);
  z-index: 2;
}

.landing-btn:hover .star-6 {
  position: absolute;
  top: -5%;
  left: 60%;
  width: 15px;
  height: auto;
  filter: drop-shadow(0 0 10px #ea8b19);
  z-index: 2;
}

.fil0 {
  fill: #ea8b19;
}

.landing-btn-box {
  /* Entfernen Sie 'float: left' und setzen Sie Flexbox-Eigenschaften */
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%; /* Stellen Sie die volle Breite ein */
  height: 100%; /* Stellen Sie die volle Höhe ein */
  transition: .5s linear;
  position: relative;
  padding: 0; /* Entfernen Sie Padding, das die Zentrierung beeinträchtigt */
  margin: 0; /* Entfernen Sie negative Margen */
  background: transparent;
  text-transform: uppercase;
  font-weight: 900;
}

.landing-btn-box:hover {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
  cursor: pointer;
  color: white;
  background: black;
}

.landing-btn-box:hover:before {
  border-color: #fff;
  height: 100%;
  transform: translateX(0);
  transition: .3s transform linear, .3s height linear .3s;
}

.landing-btn-box:hover:after {
  border-color: #ea8b19;
  height: 100%;
  transform: translateX(0);
  transition: .3s transform linear, .3s height linear .5s;
}

/*Responsive CSS*/

/*Responsive Landing Mobile*/
@media (max-width: 767px) {
  .bitcoin {
    padding-top: 82%;
  }

  .landing-content h1 {
    font-size: 40px;
  }

  .landing-content h3 {
    font-size: 20px;
    margin-left: 5%;
    margin-right: 5%;
  }
}