body {
background-image: url(../../img/keyboard.jpg);
}

.welcome {
font-size: 2rem;
color: #F86624;
text-align: center;
font-family: 'Permanent Marker', cursive;

}

@media (max-width: 480px) {
  .welcome {
    font-size: 1.5rem;
  }
}
@media (max-width: 360px) {
  .welcome {
    font-size: 1.7rem;
  }
}

.blau {
color: #0371E6;
display: inline-block;
}

.blau2 {
color: #2B88D6;
display: inline-block;
}

.blau3 {
color: #1B2A41;
display: inline-block;
}

.pink {
color: #D800B8;
display: inline-block;
}

.rot {
color: #88292F;
display: inline-block;
}

.gelb {
color: #F7B406;
display: inline-block;
}

.gelb2 {
color: #FFE66D;
display: inline-block;
}

.weiss {
color: #F7FFF7;
display: inline-block;
}

.orange {
color: #F86624;
display: inline-block;
}

/* === UHR ===*/

.uhrContainer {
	width: 100%;
	display: flex;
	justify-content: center;
	background-image: linear-gradient(to bottom, rgb(0, 0, 0) ,rgba(0, 0, 0, 0));
}


#clock {
  font-family: 'Share Tech Mono', monospace;
  color: #F86624;
  text-align: center;
  position: relative;
  color: #F86624;
  text-shadow: 0 0 20px #F7FFF7, 0 0 20px rgba(255, 139, 0, 0.6);
  padding-left: 10px;
}
#clock .time {
  letter-spacing: 0.05em;
  font-size: 25px;
  padding: 5px;
}
#clock .date {
  letter-spacing: 0.1em;
  font-size: 20px;
}
#clock .text {
  letter-spacing: 0.1em;
  font-size: 15px;
}


/* === UHR ENDE ===*/