/* user css file */

/*
  Dieser Mobile/Desktop Ansatz folgt der Direktive Mobile-First und betrachtet alle Endgeräte
  mit einer Auflösung von mindestens 768px Breite als Desktopgeräte, genauso, wie Unipark das
  auch macht (ab 767px und kleiner werden die Matrixfragen vertikal dargestellt)

  Zuvor wurde jedoch ein anderer Ansatz verwendet, der hier nochmal notiert wird, falls dieser
  aus Kompatibilitätsgründen nochmal relevant wird:
-----
.forMobileOnly {
	display: none;
}
.forDesktopOnly {
	display: block;
}

@media screen and (max-width: 600px) {
	.forMobileOnly {
		display: block;
	}
	.forDesktopOnly {
		display: none;
	}
}
-----
*/
.forMobileOnly {
  display: block;
}
.forDesktopOnly {
  display: none;
}

@media only screen and (min-width: 768px) {
  .forMobileOnly {
  	display: none;
  }
  .forDesktopOnly {
  	display: block;
  }
}


@media only screen {
	#header {
		margin-bottom: 3rem;
	}
}


h1 {
  color: #00549F;
  line-height: 1.1em;
}

a, a:link, a:visited {
  color: #0BB3DF;
  text-decoration: none;
}
a:active, a:focus, a:hover {
  color: #0BB3DF;
}


table.report {
  border: 3px solid #00549F;
  border-radius: 5px;
  border-collapse: separate;
}

td.left, td.right {
  padding: 3px 10px;
}
td.left {
  width: 75%;
  font-weight: bold;
  font-size: 0.8em;
}
td.right {
  text-align: center;
  border-left: 3px dashed #00549F;
}

table.report tr:nth-child(even) {
  background-color: rgba(240, 240, 240, 0.5);
}
table.report tr:nth-child(odd) {
  
}

.lv3 {
  color: red;
  background-color: rgb(255, 214, 204) !important;
  font-weight: bold;
}
.lv3:nth-child(even) {
  background-color: rgba(255, 214, 204, 0.5) !important;
}
.lv2 {
  color: orange;
  background-color: rgb(255, 238, 204)  !important;
  font-weight: bold;
}
.lv2:nth-child(even) {
  background-color: rgb(255, 238, 204, 0.5)  !important;
}
.lv1 {
  color: green;
}


#chapters {
  border-top: 1px solid rgb(241,241,241);
  border-bottom: 1px solid rgb(241,241,241);
  width: 100%;
  text-align: center;
  margin-top: 20px;
}
.currentPos {
  color: #00549F;
  font-weight: bold;
}


abbr[title] {
  /*position: relative;*/
  border-bottom: 1px dotted gray;
  text-decoration: none;
}


abbr[tooltip] {
    position: relative;
    border-bottom: none;
    text-decoration-style: dotted;
    text-decoration-line: underline;
}

abbr[tooltip]:hover::after,
abbr[tooltip]:focus::after {
    content: attr(tooltip);
	
    position: absolute;
    left: 0px;
    bottom: -3em;
    width: auto;
    white-space: nowrap;
	
    font-size: .8em;
    color: rgb(73, 73, 73);
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid rgb(73, 73, 73);
    box-shadow: 1px 1px 5px 0 rgb(73, 73, 73);
    padding: 1px 8px;
    z-index: 9999;
}

.btn, input[type="button"], input[type="submit"], input[type="reset"], .buttonbar input, .buttonbar button, .button {
    box-shadow: 4px 4px 4px #d3d3d3;
}