/* Schriftarten */
/* font-family: 'East Sea Dokdo', cursive; */
/* font-family: 'Itim', cursive; */
/* font-family: 'Faster One', cursive; */


body {
  background-image: url(../../../../../seiten/games/kopfrechnen/kopfrechnenIMG/kr12.jpg);
  background-size: cover;
  background-repeat: no-repeat;

}
*{
box-sizing: border-box;
  }


.Kopfrechnen {
font-family: 'East Sea Dokdo', cursive;
text-align: center;
font-size: 5rem;
color: #30638E;
text-shadow: 5px 1px 5px black;
}

.einleitungsText {
  text-align: center;
  font-size: 1.3rem;
  font-family: 'Itim', cursive;
  text-shadow: 1px 0px 1px #30638E;
}
.einleitungsText > div > b {
  color: #0A8754;
  text-shadow: 1px 0px 1px black;
  text-decoration: underline;
}

.dieAufgabe {
font-family: 'East Sea Dokdo', cursive;
font-size: 3rem;
text-align: center;
color: #FFF05A;
text-shadow: 3px 0px 0px black;
width: 400px;
background-color: rgb(44, 44, 44, 0.5);
}

.eingabeFeldDiv {
  text-align: center;
  margin-top: 10px;
}
.eingabefeld {
  font-family: 'East Sea Dokdo', cursive;
  height: 70px;
  width: 400px;
  background-color: rgb(170, 170, 170, 0.7);
  color: black;
  text-shadow: 1px 2px 7px #FFF05A;
  font-size: 4rem;
}


.borderJD {
  border: solid 1px white;
  margin-bottom: 100px;
}
.containerJD {
justify-content: flex-end;

}

.spalteLinks {
  margin-top: 35px;
  margin-right: 0px;
}
.spalteRechts {
  margin-top: 35px;
  /* border: solid 1px #FFF05A; */
  box-shadow: 20px 20px 2px rgb(44, 44, 44, 0.3);
  border-radius: 20px;
}

.AuflistungLinks {
  font-family: 'Itim', cursive;
  font-weight: bold;
  text-align: left;
  font-size: 1.5rem;
  background-color: rgb(170, 170, 170, 0.7);
}

.deinName {
  font-family: 'Itim', cursive;
  font-weight: bold;
  text-align: left;
  font-size: 1.5rem;
  background-color: rgb(255, 240, 90, 0.5);
  width: 240px;
}
.inputName {
  font-family: 'East Sea Dokdo', cursive;
  background-color: rgb(170, 170, 170, 0.7);
  color: black;
  text-shadow: 1px 2px 7px #FFF05A;
  font-size: 2.5rem;
  height: 45px;
  width: 240px;
}

.containerSpeicherbutton {
  transition: 1s;
}
.speicherButton {
font-family: 'Itim', cursive;
font-size: 1.2rem;
background-color: rgb(44, 44, 44, 0.5);
text-align: center;
color: #30638E;
text-shadow: 1px 0px 1px black;
font-weight: bold;
cursor: pointer;
border-radius: 5px;
transition: 0.5s;
width: 240px;
height: 45px;
border: solid 1px #FFF05A;
}
.speicherButton:hover {
  color: #0A8754;
}

.highScoreUeberschrift {
  text-align: center;
  background-color: rgb(195, 197, 194, 0.3);
  border-radius: 5px;
}
.highScoreUeberschrift > div {
  font-family: 'Faster One', cursive;
  font-size: 2rem;
  text-align: center;

  margin-bottom: 0px;
  color: #30638E;
  text-shadow: 1px 0px 1px black;
  padding-left: 10px;
  padding-right: 10px;

}
.platzhalter {
  height: 45px;
}

.AuflistungRechts {
  font-family: 'Itim', cursive;
  font-weight: bold;
  text-align: left;
  font-size: 1.5rem;
  background-color: rgb(170, 170, 170, 0.3);
  text-shadow: 1px 0px 20px #FFF05A;
}


@media (max-width: 2560px) {
	.iweg {font-size: 0px;}
}


@media (max-width: 1024px) {
.AusgabeDerDaten {margin-left: 50px;}
}
@media (max-width: 740px) {
  .AusgabeDerDaten {margin-left: 20px;}
  .einleitungsText {font-size: 1rem;}
  .AuflistungLinks {font-size: 1.2rem; width: 150px;}
  .deinName {font-size: 1.2rem; width: 150px;}
  .inputName {font-size: 1.2rem; width: 150px;}
  .speicherButton {font-size: 0.8rem; width: 150px;}
  #punkteid{width: 20px; margin-left: 20px;}
  #levelid{width: 20px; margin-left: 20px;}
  #rundenid{width: 20px; margin-left: 20px;}
  .highScoreUeberschrift > div {font-size: 1.3rem;}
  .platzhalter {height: 15px;}
  .AuflistungRechts {font-size: 1.1rem;}
  #erspieltId{font-size: 0.9rem;}
  #dieAufgabeId{width: 500px;}
}
@media (max-width: 480px) {
.AusgabeDerDaten {margin-left: 20px;}
.einleitungsText {font-size: 1rem;}
.AuflistungLinks {font-size: 1.2rem; width: 150px;}
.deinName {font-size: 1.2rem; width: 150px;}
.inputName {font-size: 1.2rem; width: 150px;}
.speicherButton {font-size: 0.8rem; width: 150px;}
#punkteid{width: 20px; margin-left: 20px;}
#levelid{width: 20px; margin-left: 20px;}
#rundenid{width: 20px; margin-left: 20px;}
.highScoreUeberschrift > div {font-size: 1.3rem;}
.platzhalter {height: 15px;}
.AuflistungRechts {font-size: 1.1rem;}
#erspieltId{font-size: 0.9rem;}
#dieAufgabeId{width: 500px;}
.iweg {font-size: 2rem;}
}
@media (max-width: 420px) {
  .dieAufgabeRow{width: 250px; font-size: 1.5rem; margin-left: auto; margin-right: auto;}
  .dieAufgabe{width: 250px; font-size: 1.5rem; margin-left: auto; margin-right: auto;}
  .eingabefeld{width: 250px; font-size: 2.5rem; margin-left: auto; margin-right: auto; height: 50px;}
  .AusgabeDerDaten {margin-left: 0px;}
  .einleitungsText {font-size: 0.8rem; margin: 0px;}
  .AuflistungLinks {font-size: 0.9rem; width: 100px;}
  .deinName {font-size: 0.9rem; width: 100px;}
  .inputName {font-size: 0.9rem; width: 100px;}
  .speicherButton {font-size: 0.7rem; width: 100px;}
  #punkteid{width: 20px; margin-left: 20px;}
  #levelid{width: 20px; margin-left: 20px;}
  #rundenid{width: 20px; margin-left: 20px;}
  .highScoreUeberschrift{padding: 0px;}
  .highScoreUeberschrift > div {font-size: 1rem;}
  .platzhalter {height: 15px;}
  .AuflistungRechts {font-size: 0.9rem;}
  #erspieltId{font-size: 0.7rem;}
  #spielerName{font-size: 0.7rem;}
}
@media (max-width: 360px) {
  .dieAufgabeRow{width: 250px; font-size: 1.5rem; margin-left: auto; margin-right: auto;}
  .dieAufgabe{width: 250px; font-size: 1.5rem; margin-left: auto; margin-right: auto;}
  .eingabefeld{width: 250px; font-size: 2.5rem; margin-left: auto; margin-right: auto; height: 50px;}
  .AusgabeDerDaten {margin-left: 0px;}
  .einleitungsText {font-size: 0.8rem; margin: 0px;}
  .AuflistungLinks {font-size: 0.9rem; width: 100px;}
  .deinName {font-size: 0.9rem; width: 100px;}
  .inputName {font-size: 0.9rem; width: 100px;}
  .speicherButton {font-size: 0.7rem; width: 100px;}
  #punkteid{width: 20px; margin-left: 20px;}
  #levelid{width: 20px; margin-left: 20px;}
  #rundenid{width: 20px; margin-left: 20px;}
  .highScoreUeberschrift{padding: 0px;}
  .highScoreUeberschrift > div {font-size: 1rem;}
  .platzhalter {height: 15px;}
  .AuflistungRechts {font-size: 0.9rem;}
  #erspieltId{font-size: 0.7rem;}
  #spielerName{font-size: 0.7rem;}
}

/* 360 OK */
/* 480 OK */
/* 768 OK */
/* 1024 OK */
/* 1280 OK */