body {
  font-size: 16px;
}

#contentSection {
    align-content: center;
    /* border:1px #ff99ff solid; */
}

#content {
    margin-left:auto;
    margin-right: auto;
    align-content: left;
    text-align: left;
    width:80%;
    margin-top:200px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 1.2em;
    /* border: 1px #99ff99 solid;  */
    /* height: 1200px; */
}

#worldSVG {
    margin-top:1em;
    height: 100%;
    /* border:1px #000 solid; */
}

#tooltip {
  
  background-color: cornsilk;
  border: 1px solid black;
  border-radius: 5px;
  padding: 5px;
}

#marker {
    position: fixed;
    width:20px;
    height:20px;
    background-color:red;
    border:2px #000 solid;
    border-radius: 15px;
    
    left:599px;
    top:211px;
    
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.sheet {
    border:1px #999 solid;
    border-radius: 1.2em;
    padding:1em;
}

.sheet .header {
    margin-bottom:2em;
}

#cards {
    display:flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.card {
    margin-left:0.5em;
    margin-right:0.5em;
    flex-grow: 1;
    /* flex-basis: 12em; */
    margin-bottom: 1em;
}

.card_break {
  flex-basis: 100%;
  height: 0;
}

.math-calculation-lvl1 {
    padding-bottom:1px;
}

.calcCorrect {
 background-color:#075000;
 color:#fff;
 border-color: #fff;
 border-style: solid;
}

.calcCorrectCheck::after {
  content: "";
  /* \f00c */
}

.calcWrong {
  background-color:#5f0101;
  color:#fff;
  border-color: #fff;
  border-style: solid;
  animation: horizontal-shaking 0.35s 1;
}

@keyframes horizontal-shaking {
  0% { transform: translateX(0) }
  25% { transform: translateX(5px) }
  50% { transform: translateX(-5px) }
  75% { transform: translateX(5px) }
  100% { transform: translateX(0) }
}

#identicon {
  display:inline-block;
}

#character_create {
 /* dummy */
}

#character_create_name {
  display:inline-block;
}

#select_schoolyear_container input[type="radio"] {
  display: none;
}

#select_schoolyear_container label {
  border:1px #000 solid;
  text-align:center;
  line-height:1.6em;
  width:2em;
  height:2em;
  display:inline-block;
}

#select_schoolyear_container input[type="radio"]:checked+label {
  font-weight: bold; 
  box-shadow: 2px 2px;
  background-color:dodgerblue;
} 

#character_create_submit {
  border:0px;
  background-color: transparent;
  border:1px #000 dashed;
  border-radius: 15px;
  padding:0.2em;
  padding-left:0.4em;
  padding-right: 0.4em;
}

#character_create_submit:hover {
  font-weight: bold;
  background-color:dodgerblue;
}