
/*
@media (min-width: 1021px) { * { font-size: 40px; } .menucenter { width: 25em; margin-left: auto; margin-right: auto;} }
@media (max-width: 1020px) { * { font-size: 39px; } .menucenter { width: 13em; margin-left: auto; margin-right: auto;} }
@media (max-width: 995px) { * { font-size: 38px; } }
@media (max-width: 970px) { * { font-size: 37px; } }
@media (max-width: 945px) { * { font-size: 36px; } }
@media (max-width: 920px) { * { font-size: 35px; } }
@media (max-width: 895px) { * { font-size: 34px; } }
@media (max-width: 870px) { * { font-size: 33px; } }
@media (max-width: 845px) { * { font-size: 32px; } }
@media (max-width: 820px) { * { font-size: 31px; } }
@media (max-width: 795px) { * { font-size: 30px; } }
@media (max-width: 770px) { * { font-size: 29px; } }
@media (max-width: 745px) { * { font-size: 28px; } }
@media (max-width: 720px) { * { font-size: 27px; } }
@media (max-width: 695px) { * { font-size: 26px; } }
@media (max-width: 670px) { * { font-size: 25px; } }
@media (max-width: 645px) { * { font-size: 24px; } }
@media (max-width: 620px) { * { font-size: 23px; } }
@media (max-width: 595px) { * { font-size: 22px; } }
@media (max-width: 570px) { * { font-size: 21px; } }
@media (max-width: 545px) { * { font-size: 20px; } }
@media (max-width: 520px) { * { font-size: 19px; } }
@media (max-width: 495px) { * { font-size: 18px; } }
@media (max-width: 470px) { * { font-size: 17px; } }
@media (max-width: 445px) { * { font-size: 16px; } }
@media (max-width: 420px) { * { font-size: 15px; } }
*/
/* @media (max-width: 999px) { */
	/* * { */
    /* font-size: 20px; */
	/* } */
/* } */





html {
	font-size: clamp(12px, 2.5vw, 16px) !important;
	height: 100%;
}

body {
	background: #f7f7f7;
	/* background: red; */
	/* background: #ffffff; */
    margin: 0;
    font-family: sans-serif;
	height: 100%;
}
  
  /* 1 spannt über beide Spalten */
.box1 {
	grid-column: span 2;
}

/* Portrait / schmal: alles untereinander */

  
  





.MathJax_Display {
	margin: 0.1em 0 ! important
}

/* td { */
	/* font-size:2.33333333em; */
	/* font-size:28pt; */
/* } */

input {
	font-size:1em;
	text-align: center;
	width:2.5em;
}

td.center {
	font-size:5.33333333em;
	text-align: center;
	/* font-size:28pt; */
}

.center {
	margin-left: auto;
	margin-right: auto;
}

.text {
	/* font-size:18pt; */
	font-size: 0.75em;
	/* font-weight: bold; */
}

.sup {
	/* font-size:18pt; */
	font-size: 0.75em;
	font-weight: normal;
}

.menutext {
	font-size: 0.7em;
}

h2 {
	font-size: 1.2em;
	font-weight: bold;
}

mn {
	font-size: 0.7em;
	font-weight: normal;
}

/* mi { */
	/* font-size: 1.0em; */
	/* font-weight: normal; */
/* } */

/* .button { */
	/* border: 2px solid black;  */
	/* cursor: pointer;  */
	/* color: white;  */
	/* border-radius: 20px 10px 20px 10px; */
	/* text-align: center; */
/* } */

.link {
	border: 2px solid black; 
	cursor: pointer; 
	color: black; 
	border-radius: 20px 10px 20px 10px;
	padding: 0.5em;
	margin: 0.125em;
	text-align: center;
}

.button {
	border: 2px solid black; 
	cursor: pointer; 
	color: blue; 
	border-radius: 2vh 1vh 2vh 1vh;
	border-radius: 1rem 0.5rem 1rem 0.5rem;
	padding: 0.5rem;
	margin: 0vh;
	text-align: center;
}
/* .button { */
  /* background: #f5f2ee; */
  /* background: #fff; */
  /* color: #000; */
  /* border-left: 4px solid #aaa; */
  /* border-right: 4px solid #aaa; */
  /* padding: 1vh; */
  /* border-radius: 6px; */
/* } */


.back_button {
	width:2rem; 
	height:2rem; 
	background-color: lightgray; 
	position:fixed; 	
	top:0; 	
	left:0; 
	text-align:center; 
	display: flex; 
	justify-content: center; 
	align-items: center;
}

.reload_button {
	width:2rem; 
	height:2rem; 
	background-color: lightgray; 
	position:fixed; 
	top:0; 
	right:0; 
	text-align:center; 
	display: flex; 
	justify-content: center; 
	align-items: center;
}

.zoom_button {
	width:2rem; 
	height:2rem; 
	background-color: lightgray; 
	position:fixed; 
	top:4rem; 
	right:0; 
	text-align:center; 
	display: flex; 
	justify-content: center; 
	align-items: center;
}

.collapseable {
	border: 2px solid lightgrey; 
	cursor: pointer; 
	color: black; 
	border-radius: 1vh 0.5vh 1vh 0.5vh;
	padding: 0.5vh;
	margin: 0vh;
	text-align: left;
	background-color: lightgrey;
}

.rahmen {
	border: 1px solid black; 
	cursor: pointer; 
	color: black; 
	border-radius: 2vh 1vh 2vh 1vh;
	padding: 0vh;
	margin: 0vh;
	text-align: left;

}


.VFTcontainer {
  margin-left: auto;
  margin-right: auto;
  border-collapse: collapse;
  cursor: pointer;
}

.VFT {
  margin-left: auto;
  margin-right: auto;
  border: 1px solid black;
  border-collapse: collapse;
  text-align: center;
  width:2.5em;
  height:2.5em;
}

.check {
	text-align: right;	
	font-size: 0.7em;
	color: white;
}



.headline {
  background: #f5f2ee;
  background: #fff;
  color: #000;
  border-left: 4px solid #aaa;
}



.head3 {
font-size: 120%; 
font-weight:bold;
}

.hinweis {
	font-size: 70%;
}


.container {
	display: grid;
    grid-template-columns: 30rem 30rem;
    gap: 1rem;
	
	justify-content: center;
	/* padding-top: 0.5rem; */
	/* padding-bottom: 0.5rem; */
	align-items: start;
}

.container_abi {
	background: #fff;
    max-width: 60rem;      /* angenehme Lesebreite */
    margin: 0 auto;         /* zentriert */
    text-align: center;
	border-radius: 6px;
	padding: 20px;
  }

.box {
    /* background: #e0e0e0; */
	background: #fff;
    padding: 20px;
    text-align: left;
    font-size: 1.5rem;
    border-radius: 6px;
}


.menuLink {
    /* background: #e0e0e0; */
	background: #eee;
    padding: 5px;
    text-align: left;
    font-size: 1.5rem;
    border-radius: 6px;
}

.centered {
	text-align: center;
}

.clickable {
	cursor: pointer; 
}


label {
  font-family: sans-serif;
  font-size: 1rem;
  padding-right: 10px;
}

  img.abi_aufgabe {
    max-width: 100%;        /* auf kleinen Displays vollständig sichtbar */
    height: auto;
    margin: 12px 0;
  }
  
  img.abi_ewh {
    max-width: 100%;        /* auf kleinen Displays vollständig sichtbar */
    height: auto;
    margin: 12px 0;
  }
  
    .outer_abi_physik {
      height: 100%;
      overflow-x: auto;
      overflow-y: hidden;
      background: #f5f5f5;

    }

.container_abi_physik {
      display: flex;
      height: 100%;
	  gap:1rem;
      width: clamp(0px, 190%, 121rem);
	  
  transform-origin: top left;
  transition: transform 0.3s ease;
	  
}

.container_abi_physik.fit {
    width: 100% !important;
}

.panel_abi_physik {
      width: clamp(0px, 100%, 60rem);
      height: 100%;

      overflow-y: auto;
      overflow-x: hidden;
      min-height: 0;

      box-sizing: border-box;
      padding: 1rem;
      border-right: 1px solid #ccc;
      background: white;

      /* cursor: pointer; */
	  scrollbar-width: none;          /* Firefox */
	  text-align:center;
}


.spacer_abi_physik {
  height: 1000px;
}

a {
  color: black;
  text-decoration: none;
}

/* Zustandsabhängiges Beispiel */
a:hover {
  color: black;
  text-decoration: none;
}

a:visited {
  color: black;
  text-decoration: none;
}

details {
  margin: 0;
}

summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

/* summary.centered { */
  /* justify-content: center; */
/* } */

summary::-webkit-details-marker {
  display: none;
}

.dropdownIcon {
  /* width: 16px; */
  /* height: 16px; */
  transition: transform 0.2s ease;
}

details[open] > summary .dropdownIcon {
  transform: rotate(90deg);
}


@media (min-width: 122rem) {
    .outer_abi_physik {
  
	display: flex;
  justify-content: center;
    }
}


@media (max-width: 64rem) {
    .container {
		grid-template-columns: clamp(0px, 100%, 30rem);
    }

    .box1 {
      grid-column: span 1;
    }
}
