
:root {
--color_whitish: #FFFCF0;
--color_whitish_darker: #F7F1DD;
--color_written: #059;
--color_written_green: #072;
--color_expl: #8FC;
--color_note: #FA5;
--color_subj: #809;
--color_subj_light: #D5F;
--color_role: #464;
--color_role_light: #BDB;

overflow-wrap: break-word;
}

/* whitish: H32 S240 V233 */
/* whitish_darker: H32 S150 V220 */
/* written: H138 S240 V72 */

.breakAny
{
overflow-wrap:anywhere !important;
}

* {
box-sizing: border-box;
/* overflow-wrap: break-word; */
}

/* b */
/* { */
/* overflow-wrap:inherit; */
/* } */

html,body
{
overscroll-behavior-y: contain;
}


body {
/* background-image: url('bg_005.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100% 100%; */
/* background-color:#333333; */
/* background-color:#282827; */

background-image:url(body-bg.jpg);
background-attachment:fixed;


/* scroll-snap-type:y mandatory; */
/* overscroll-behavior:none; */
/* overscroll-behavior-y: contain; */

}

div.body_logo_left,div.body_logo_right
{
/*overwritten for media in landscape mode*/
display:none;
}


@media screen
{
div.frame
{
width:min(calc(100vh * 12 / 16),100vw);
/* min-height:93vh; */
margin:auto;
/* border:0.5rem solid #222; */
border:0.5rem solid rgb(26,22,15);
border-radius:1rem;
padding:0.5rem;

/* background-image:url(Dorf_002_market_small_003.jpg); */
/* background-repeat:no-repeat; */
/* background-attachment:fixed; */
/* background-size:auto 100%; */
/* background-position:-8% 50%; */
/* background-clip:padding-box;
 */
position:relative;
box-shadow:inset 0 -0.3rem 0.9rem 0 rgb(40, 30, 10);
overflow:clip;

}

div.background_img
{
/* position:fixed; */
/* z-index:-10; */
/* top:0; */
/* left:0; */
/* bottom:0; */
/* right:0; */
/* overflow:clip; */

position:absolute;
height:100%;
width:100%;
left:0;
top:0;

z-index:-10;
background-image:url(bg_Dorf_001.jpg);
background-repeat:no-repeat;
background-attachment:fixed;
background-size:auto 100vh;
/* background-position:-8% 50%; */
/* background-clip:padding-box; */
/* transition:background linear 1s; */
}


/* div.background_has_inner */
/* { */
/* display:flex; */
/* flex-direction:column; */
/* } */

@keyframes background_blend_animation
{
0%	{background-color:rgba(0,0,0,0.9);}
100%	{background-color:transparent;}
}

div.background_blend
{
/* padding:0.5rem; */
animation:background_blend_animation 0.7s ease-in 0.1s both;
/* flex:1; */
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
z-index:-1;
}



}

@media only screen and (orientation: landscape) {

@keyframes body_logo_animation
{
/* 0%	{filter:brightness(0%);} */
/* 100%	{filter:brightness(20%);} */
0%		{scale:95%;opacity:0%;}
100%	{scale:100%;opacity:10%;}
}

.body_logo_animated
{
animation:body_logo_animation 4s linear 2.0s both;
}

div.body_logo_left,div.body_logo_right
{
display:block;
background-image:url(Logo_white_w800.png);
position:fixed;
top:5vh;
/* width:calc(calc((100vw - min(calc(100vh * 12 / 16),100vw))*0.5) * calc(max(calc(((100vw - min(calc(100vh * 12 / 16),100vw))*0.5) - 10vw), 1px))); */
width:calc((100vw - min(calc(100vh * 12 / 16),100vw))*0.5);
height:90vh;
background-repeat:no-repeat;
background-size:60%;
background-position:center center;
z-index:-1;
/* filter:brightness(20%); */
opacity:10%;
}

div.body_logo_left
{
left:0;
}

div.body_logo_right
{
right:0;
}

}

@keyframes header_title_animation{
0%	{opacity:0.7;}
100%	{opacity:1.0;}
/* 0%	{left:-0.3rem;} */
/* 100%	{left:0rem;} */
/* 0%	{transform:scale(99%);opacity:0.8;} */
/* 100%	{transform:scale(100%);opacity:1.0;} */
}

table.header
{
width:100%;
text-align:center;
}

td.header_logo
{
width:12rem;
}

td.header_title
{
font-size:3rem;
text-align:center;
color:#fff;
/* text-shadow: 0 0 0.3rem #dfd, 0.03rem 0.03rem 0.1rem #555; */
text-shadow: 0 0 0.3rem #dfd;
border-bottom:0.2rem solid black;
border-top:0.2rem solid black;
}

span.header_title
{
/* position:relative; */
/* display:inline-block; */
animation:header_title_animation 0.8s ease-out 0.0s both;
}

.print_alt
{
display:none;
}

@media print
{
.print_not
{
display:none !important;
}
.print_alt
{
display:initial;
}

div.background
{
width:100%;
margin:auto;
/* border:0.5rem solid #222; */
/* border-radius:1rem; */
/* padding:0.5rem; */
/* background-image:url(Dorf_002_market_small.jpg); */
/* background-repeat:no-repeat; */
/* background-attachment:fixed; */
/* background-size:auto 100%; */
/* background-position:150% 50%; */
}

}

.mobile_not
{
}
.mobile_only
{
display:none;
}

div.footer
{
position:absolute;
bottom:0;
left:0.5rem;
right:0.5rem;
}

div.user_info
{
text-align:center;
padding:0.25rem;
color:#FFD;
background: rgba(34, 34, 34, 0.5);
}

div.footer_info
{
text-align:center;
padding:0.5rem;
color:#FFD;
background: rgba(34, 34, 34, 0.8);
border-radius:1rem;
min-height:5rem;
border:0.1rem solid rgba(0,170,213,0.3);
}

ul
{
margin:0;
}

/* maybe not used ??? >>> */
.delay
{
display:none;
}


.button {
padding: 0.7rem 1.4rem;
/* border: 0.15rem solid #4CAF50; */
border: none;
color: #000;
text-shadow: 0 1rem 1rem #CB7, 0 -1rem 1rem #FFE, 1rem 0 1rem #FEB, -1rem 0 1rem #FEB,0 0rem 1rem #FFE;
background-color: #AAA895;
/* background-image:url(bg_button.jpg); */
/* background:linear-gradient(#AAA89555,#AAA89555),url(bg_button.jpg); */
/* box-shadow: -0.1rem 0.15rem 0.5rem 0.2rem rgba(0,0,0,0.2); */
box-shadow: -0.1rem 0.15rem 0.5rem 0.2rem rgba(0,0,0,0.2), inset 0 0 0.5rem 0.05rem rgba(10,5,0,0.9), inset 0 0 0.1rem 0.05rem rgba(10,5,0,0.9), 0 0 0.2rem 0.05rem #ADA;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 2rem;
margin: auto;
/* transition-duration: 0.9s; */
transition: color 0.9s, text-shadow 0.4s ease-in, background 0.9s, box-shadow 0.9s;
cursor: pointer;
border-radius:0.6rem;
}

.button:hover {
background-color: #4CAF50;
/* background: linear-gradient(#4CAF50CC,#4CAF50CC),url(bg_button.jpg); */
color:var(--color_whitish);
text-shadow:none;
box-shadow: -0.1rem 0.15rem 0.5rem 0.2rem rgba(0,0,0,0.2), inset 0 0 0.5rem 0.05rem rgba(10,5,0,0.0), inset 0 0 0.1rem 0.05rem rgba(10,5,0,0.0), 0 0 0.2rem 0.05rem transparent;
/* transition-duration: 0.1s; */
transition: color 0.1s, text-shadow 0.1s, background 0.1s, box-shadow 0.3s;
}

.button:disabled {
background-color: #88AA88;
color: var(--color_whitish);
text-shadow:none;
border: 0.15rem solid #4CAF50;
box-shadow: -0.1rem 0.15rem 0.5rem 0.2rem rgba(0,0,0,0.2), inset 0 0 0.5rem 0.05rem rgba(10,5,0,0.0), inset 0 0 0.1rem 0.05rem rgba(10,5,0,0.0), 0 0 0.2rem 0.05rem transparent;
/* transition-duration: 0.1s; */
transition: color 0.1s, text-shadow 0.1s, background 0.1s, box-shadow 0.1s;
cursor:default;
}

.button:focus {
/* border: 0.15rem solid #5DF; */
box-shadow: -0.1rem 0.15rem 0.5rem 0.2rem rgba(0,0,0,0.2), inset 0 0 0.5rem 0.05rem rgba(10,5,0,0.9), inset 0 0 0.1rem 0.05rem rgba(10,5,0,0.9), 0 0 0.3rem 0.2rem #5DF;
}

.buttonMid {
padding: 0.3rem 0.7rem;
border: 0.15rem solid #4CAF50;
color: #000;
text-shadow: 0 0.5rem 0.5rem #CB7, 0 -0.5rem 0.5rem #FFE, 0.5rem 0 0.5rem #FEB, -0.5rem 0 0.5rem #FEB,0 0rem 0.5rem #FFE;
background-color: #AAA895;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1.5rem;
margin: auto;
/* transition-duration: 0.9s; */
transition: color 0.9s, text-shadow 0.4s ease-in, background 0.9s;
cursor: pointer;
border-radius:0.6rem;

}

.buttonMidMT {	/*buttonMid + Margin Top*/
padding: 0.3rem 0.7rem;
border: 0.15rem solid #4CAF50;
color: #000;
text-shadow: 0 0.5rem 0.5rem #CB7, 0 -0.5rem 0.5rem #FFE, 0.5rem 0 0.5rem #FEB, -0.5rem 0 0.5rem #FEB,0 0rem 0.5rem #FFE;
background-color: #AAA895;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1.5rem;
margin: auto;
margin-top:0.25rem;
/* transition-duration: 0.9s; */
transition: color 0.9s, text-shadow 0.4s ease-in, background 0.9s;
cursor: pointer;
border-radius:0.6rem;
}

.buttonMidFlat {
padding: 0.1rem 0.7rem;
border: 0.15rem solid #4CAF50;
color: #000;
text-shadow: 0 0.5rem 0.5rem #CB7, 0 -0.5rem 0.5rem #FFE, 0.5rem 0 0.5rem #FEB, -0.5rem 0 0.5rem #FEB,0 0rem 0.5rem #FFE;
background-color: #AAA895;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1.5rem;
margin: auto;
/* transition-duration: 0.9s; */
transition: color 0.9s, text-shadow 0.4s ease-in, background 0.9s;
cursor: pointer;
border-radius:0.6rem;
}

.buttonMid:hover {
background-color: #4CAF50;
color: var(--color_whitish);
text-shadow:none;
/* transition-duration: 0.1s; */
transition: color 0.1s, text-shadow 0.1s, background 0.1s;
}

.buttonMidMT:hover {
background-color: #4CAF50;
color: var(--color_whitish);
text-shadow:none;
/* transition-duration: 0.1s; */
transition: color 0.1s, text-shadow 0.1s, background 0.1s;
}

.buttonMidFlat:hover {
background-color: #4CAF50;
color: var(--color_whitish);
text-shadow:none;
/* transition-duration: 0.1s; */
transition: color 0.1s, text-shadow 0.1s, background 0.1s;
}

.buttonMid:disabled {
background-color: #88AA88;
color: var(--color_whitish);
text-shadow:none;
/* transition-duration: 0.1s; */
transition: color 0.1s, text-shadow 0.1s, background 0.1s;
cursor:default;
}
.buttonMidMT:disabled {
background-color: #88AA88;
color: var(--color_whitish);
text-shadow:none;
/* transition-duration: 0.1s; */
transition: color 0.1s, text-shadow 0.1s, background 0.1s;
cursor:default;
}


button.simLeBParent {
width: 100%;
/* border: 0.15rem solid #AAA; */
border: none;
background:none;
/* border-radius:0.4rem; */
/* text-align:center; */
/* padding:0 0.1rem; */
padding:0;
font-size:1rem;
display:block;
}

button.simLeBParentSingle {
width: 100%;
border: 0.15rem solid #AAA;
background:none;
border-radius:0.4rem;
text-align:center;
padding:0 0.1rem;
font-size:1.5rem;
display:block;
}

button.simLeBParent:hover {
/* border: 0.15rem solid #DC0; */
/* border-radius:0.4rem; */
box-shadow: inset 0 0 0.7rem 1rem #FF0;
}

button.simLeBParentSingle:hover {
border: 0.15rem solid #DC0;
box-shadow: inset 0 0 0.7rem 0.5rem var(--color_whitish);
}

.buttonSiBa{
border: 0.15rem solid #997;
color: #997;
background-color:rgba(51,51,51,0.3);
text-align: center;
text-decoration: none;
display: block;
font-size: 1.5rem;
margin: auto;
cursor: pointer;
border-radius:2rem;
height:4rem;
width:3rem;
}

button.buttonSiBa:hover {
border: 0.15rem solid #DC0;
box-shadow: 0 0 0.4rem 0 #DC0;
color: #DC0;
background-color:rgba(51,51,51,0.7);
}

button.buttonSiBaLO:hover {
border: 0.15rem solid #D00;
box-shadow: 0 0 0.5rem 0 #D00;
color: #D00;
background-color:rgba(51,51,51,0.7);
}



div.SiBa
{
position:fixed;
/* top:0%; */
/* bottom:0%; */
top:50%;
transform:translateY(-50%);
left:max(calc(50vw - calc(min(calc(100vh * 12 / 16),100vw)) * 0.5 - 4rem), 0rem);
display:flex;
align-items:center;
justify-content:space-around;
z-index:1;
background:rgba(0,0,0,0.1);
border-radius:0.5rem;
border:0.15rem solid rgba(0,0,0,0.1);
padding:0.3rem 0;
}


button.MobilePageUpDown{
z-index:1;
display:none;
position:fixed;
border:0.15rem solid #997;
color:#997;
background-color:rgba(51,51,51,0.3);
text-align:center;
text-decoration:none;
font-size:1.5rem;
margin:auto;
cursor:pointer;
border-radius:2rem;
height:4rem;
width:3rem;
box-shadow:0.1rem 0.15rem 0.5rem 0.1rem rgba(0,0,0,0.8);
}


button.MobilePageUp{
top:80%;
right:1rem;
transform:translateY(-50%);
}
button.MobilePageDown{
top:95%;
right:1rem;
transform:translateY(-100%);
}


.menu{
font-size: 2rem;
}

.menuAction{
font-size: 2rem;
}

.menu_noW{
font-size: 2rem;
}

.text_small
{
font-size:1rem;
}

div.menu_Scroll_outer
{
width:93%;
margin:0 auto;
border: 0.2rem solid #5DF;
border-radius: 0.6rem;
background: rgba(53, 87, 96, 0.4);	/*H:128, S:70, V:70, A:30% */ 
/* padding: 0.5rem; */
padding: 0.5rem;
box-shadow: 0 0 0.5rem 0.1rem #5DF, inset 0 0 0.7rem 0.1rem #5DF;
}

div.menu_Scroll_head
{
/* like table.menu (incl. border-spacing) */
margin-top:1.5rem;
margin-left:1rem;
margin-right:1rem;
font-size:2rem;
font-weight:bold;

/* like th.menu: */
padding: 0.25rem;
border-radius: 0.3rem;
text-align:center;
color:var(--color_whitish);
text-shadow:0 0 0.9rem rgba(25,13,0,0.7);
background-color:rgba(0,0,0,0.3);
border:0.1rem solid rgba(0,170,213,0.3);	/* HSV: 128/240/100 */
}

div.table_ScrollX_inner{
max-width:100%;
overflow-x:auto;
}

table.menu_Scroll{
border-spacing: 1rem 1.5rem;
width:100%;
}


/* div.ScrollX{ */
/* max-width:100%; */
/* overflow-x:auto; */
/* } */











div.menu{
width:93%;
margin:0 auto;
border: 0.2rem solid #5DF;
border-radius: 0.6rem;
background: rgba(53, 87, 96, 0.4);	/*H:128, S:70, V:70, A:30% */ 
padding: 0.5rem;
box-shadow: 0 0 0.5rem 0.1rem #5DF, inset 0 0 0.7rem 0.1rem #5DF; 
}



table.menu{
width:93%;
margin:0 auto;
/*border: 0.2rem solid #A0B0FF;*/
border: 0.2rem solid #5DF;		/* HSV: 128/240/160 */
border-radius: 0.6rem;
/*background-color: #D0E0FF;*/
/* background: rgba(44, 92, 105, 0.4);	/*H:128, S:100, V:70, A:30% */
background: rgba(53, 87, 96, 0.4);	/*H:128, S:70, V:70, A:30% */ 
padding: 0.5rem;
border-spacing: 1rem 1.5rem;
box-shadow: 0 0 0.5rem 0.1rem #5DF, inset 0 0 0.7rem 0.1rem #5DF; 
}


/* table.menu_ScrollX{ */
/* margin:auto; */
/* padding:0; */
/* border-spacing: 1rem 1.5rem; */
/* } */


table.menuAction{
width:93%;
margin:0 auto;
/* border: 0.2rem solid #F5D; */
border: 0.2rem solid #FA5;
border-radius: 0.6rem;
/*background-color: #D0E0FF;*/
/* background: rgba(105, 44, 92, 0.1);	/*H:208, S:100, V:70, A:10% */
background: rgba(105, 74, 44, 0.4);	/*H:20, S:100, V:70, A:30% */
padding: 0.5rem;
border-spacing: 1rem 1.5rem;
/* box-shadow: 0 0 0.5rem 0.1rem #F5D, inset 0 0 0.7rem 0.1rem #F5D; */
box-shadow: 0 0 0.5rem 0.1rem #FA5, inset 0 0 0.7rem 0.1rem #FA5;
}


table.menu_info{
width:93%;
margin:0 auto;
border: 0.3vw solid #A0D090;
border-radius: 0.6rem;
background-color: #D0F0C0;
padding: 0.5rem;
border-spacing: 1rem 1.5rem;
}

table.info{
width:93%;
margin:0 auto;
/*border: 0.2rem solid #A0B0FF;*/
border: 0.2rem solid #5DF;
border-radius: 0.6rem;
/*background-color: #D0E0FF;*/
/* background: rgba(44, 92, 105, 0.4);	/*H:128, S:100, V:70, A:30% */
background: rgba(53, 87, 96, 0.4);	/*H:128, S:70, V:70, A:30% */ 
padding: 0.5rem;
border-spacing: 0.3rem 0.3rem;
box-shadow: 0 0 0.5rem 0.1rem #5DF, inset 0 0 0.7rem 0.1rem #5DF; 
font-size:1.5rem;
}

table.info_notRunning
{
border: 0.2rem solid #F65;
box-shadow: 0 0 0.5rem 0.1rem #F65, inset 0 0 0.7rem 0.1rem #F65;	
}

table.info_Scroll{
width:100%;
border-spacing: 0.3rem 0.3rem;
}

/* >> used for table.tita: >> */
div.tita_ScrollX_outer{
width:93%;
margin:0 auto;
border: 0.2rem solid #5DF;
border-radius: 0.6rem;
background: rgba(53, 87, 96, 0.4);	/*H:128, S:70, V:70, A:30% */ 
padding: 0.5rem;
box-shadow: 0 0 0.5rem 0.1rem #5DF, inset 0 0 0.7rem 0.1rem #5DF;

overflow-x:auto;
}

table.tita
{
margin:auto;
padding:0;
border-spacing:2px;
}


td.menu{
padding: 0.25rem;
border-radius: 0.3rem;
text-align:center;
/* background-color: var(--color_whitish); */
/* background-image:url(creampaper_orig.png); */
background-image:url(seamless_paper_texture.png);
box-shadow:inset 0 0 0.2rem rgba(0,0,0,0.5);
}

td.menu_darker{
padding: 0.25rem;
border-radius: 0.3rem;
text-align:center;
background-color: var(--color_whitish_darker);
box-shadow:inset 0 0 0.2rem rgba(0,0,0,0.5);
}

td.info{
padding:0.1rem 0.25rem;
border-radius: 0.3rem;
text-align:left;
background-color: var(--color_whitish);
font-size: 1.5rem;
}

td.infoC{
padding:0.1rem 0.25rem;
border-radius: 0.3rem;
text-align:center;
background-color: var(--color_whitish);
font-size: 1.5rem;
}

td.infoR{
padding:0.1rem 0.25rem;
border-radius: 0.3rem;
text-align:right;
background-color: var(--color_whitish);
font-size: 1.5rem;
}

td.bgGray
{
background-color:#CCC;
}


tr:nth-child(odd) td.info{
/* background-color: #DEDBCF; */
background-color: var(--color_whitish_darker);
}

tr:nth-child(odd) td.infoC{
/* background-color: #DEDBCF; */
background-color: var(--color_whitish_darker);
}

tr:nth-child(odd) td.infoR{
/* background-color: #DEDBCF; */
background-color: var(--color_whitish_darker);
}

tr:nth-child(odd) td.bgGray{
/* background-color: #DEDBCF; */
/* background-color: var(--color_whitish_darker); */
background-color:#CCC;
}


/* tr.info:nth-child(4n) td.info{ */
/* background-color: #D3CFC0; */
/* } */

tr:hover td.info{
background-color: #E0F5D0;
}

tr:hover td.infoC{
background-color: #E0F5D0;
}

tr:hover td.infoR{
background-color: #E0F5D0;
}

td.menuLe{
padding: 0.3rem;
border-radius: 0.3rem;
text-align:left;
background-color: var(--color_whitish);
box-shadow:inset 0 0 0.2rem rgba(0,0,0,0.5);
}

tr:hover td.menu{
background-color: #E0F5D0;
background-image:none;
/* box-shadow:inset 0 0 0.2rem rgba(0,0,0,0.5); */
}

tr:hover td.menu_darker{
background-color: #E0F5D0;
/* box-shadow:inset 0 0 0.2rem rgba(0,0,0,0.5); */
}

tr:hover td.menuLe{
background-color: #E0F5D0;
/* box-shadow:inset 0 0 0.2rem rgba(0,0,0,0.5); */
}

th.menu{
padding: 0.25rem;
border-radius: 0.3rem;
text-align:center;
/*background-color: #FFF;*/
color:var(--color_whitish);
text-shadow:0 0 0.9rem rgba(25,13,0,0.7);
background-color:rgba(0,0,0,0.3);
border:0.1rem solid rgba(0,170,213,0.3);	/* HSV: 128/240/100 */
}

th.menuClick{
padding: 0.25rem;
border-radius: 0.3rem;
text-align:center;
color:var(--color_whitish);
text-shadow:0 0 0.9rem rgba(25,13,0,0.7);
background-color:rgba(0,0,0,0.3);
border:0.1rem solid rgba(0,170,213,0.3);	/* HSV: 128/240/100 */
cursor: pointer;
user-select: none;
font-size:2rem;
}

th.menuAction{
padding: 0.25rem;
border-radius: 0.3rem;
text-align:center;
/*background-color: #FFF;*/
color:var(--color_whitish);
text-shadow:0 0 0.9rem rgba(25,13,0,1);
background-color:rgba(0,0,0,0.4);
border:0.1rem solid rgba(213,106,0,0.3);	/* HSV: 20/240/100 */
}

.thMenu_sub
{
font-size:0.5em;
font-weight:normal;
}

/*div.menu_head{
color:#FFF;
font-size: 2rem;
text-align:center;
font-weight:bold;
width:100%;
}*/


td.menu_trpa{
background-color:#D0E0FF;
}

td.neutr{
padding:0.25rem;
border-radius:0.3rem;
text-align:left;
background-color:var(--color_whitish);
font-size:1.3rem;
}


input.menu,textarea.menu{
/* padding: 0.1rem; */
background-color:var(--color_whitish);
/* text-align:center; */
border-radius:0.3rem;
width:100%;
color:var(--color_written);
}
input.menu::placeholder,textarea.menu::placeholder{
color:#999;
opacity:1;
}

input.menu_noW{
/* padding: 0.1rem; */
background-color:var(--color_whitish);
/* text-align:center; */
border-radius:0.3rem;
color:var(--color_written);
margin:0.2rem;
}

input.file_upload
{
background-color:var(--color_whitish);
border-radius:0.3rem;
width:100%;
color:var(--color_written);
font-size:1.3rem;
}

input.smaller
{
font-size:1.5rem;
}

td.centered{
text-align:center;
}

td.menu_transp{
color:var(--color_whitish);
/* text-shadow:0 0 0.3rem rgba(0,0,0,0.5),0.3rem 0.3rem 0.3rem rgba(0,0,0,0.5); */
text-shadow:0 0 0.3rem rgba(0,0,0,0.5);
}

.bgCAnsw
{
background-color:#EFE;

}

.bgWAnsw
{
background-color:#FEE;

}

.bgExp
{
background-color:#FFD;
}

.bgHighlGreen
{
background-color:#DFB !important;
}



table.simLeB{
margin:0.1rem;
border:0.1rem solid #AAA;
border-collapse:collapse;
color:black;
}

table.simLeB_wFull{
margin:0.1rem;
border:0.1rem solid #AAA;
border-collapse:collapse;
color:black;
width:calc(100% - 0.2rem);
}


td.simLeB, th.simLeB{
border:0.1rem solid #AAA;
text-align:left;
padding:0 0.2rem;
}

tr.simLeB:hover td.simLeB{
background-color:#E0F5D0;
}

td.simLeBC{
border:0.1rem solid #AAA;
text-align:center;
padding:0 0.2rem;
}

tr.simLeB:hover td.simLeBC{
background-color:#E0F5D0;
}

td.simLeBXTR1{
border:0.1rem solid #AAA;
text-align:left;
padding:0 0.6rem;
color:#090;
}

input.simLeB{
background-color:var(--color_whitish);
text-align:center;
border-radius:0.3rem;
font-size:2rem;
}


table.simLeBParent{
width:93%;
margin:0 auto;
/*border: 0.2rem solid #A0B0FF;*/
border:0.2rem solid #5DF;
border-radius:0.6rem;
/*background-color: #D0E0FF;*/
background:rgba(53, 87, 96, 0.4);	/*H:128, S:70, V:70, A:30% */ 
padding:0.5rem;
/*border-spacing: 1rem 1.5rem;*/
/*border-spacing: 0.5rem 0.5rem;*/
box-shadow:0 0 0.5rem 0.1rem #5DF, inset 0 0 0.7rem 0.1rem #5DF;
border-spacing:0.1rem 1rem;
}

/*tr.simLeBParent{
padding: 0.1rem;
border-radius: 0.3rem;
text-align:center;
background-color: #FFF;
}*/

td.simLeBParent{
padding:0.1rem;
border-radius:0.3rem;
/*text-align:center;*/
background-color:var(--color_whitish);
}

/*tr.simLeBParent:nth-child(odd){
padding: 0.1rem;
border-radius: 0.3rem;
text-align:center;
background-color: #FFFADD;
background-color: #EEF;
}*/


td.simLeBParentShadow{
padding: 0.1rem;
border-radius:0.3rem;
/*text-align:center;*/
background-color:var(--color_whitish);
box-shadow:-0.1rem 0.1rem 0.2rem 0.3rem rgb(16,16,16,0.3);

}
td.simLeBParentShadowFitCont{
padding:0.1rem 0.5rem;
border-radius:0.3rem;
/*text-align:center;*/
background-color:var(--color_whitish);
box-shadow:-0.1rem 0.1rem 0.2rem 0.3rem rgb(16,16,16,0.3);

width:fit-content;
display:block;
margin:0 auto;
}

tr:nth-child(odd) td.simLeBParent{
padding:0.1rem;
border-radius:0.3rem;
/*text-align:center;*/
/* background-color: #FBFCFD; */
background-color:var(--color_whitish_darker);
}
tr:nth-child(odd) td.simLeBParentShadow{
padding:0.1rem;
border-radius:0.3rem;
/*text-align:center;*/
/* background-color: #FBFCFD; */
background-color:var(--color_whitish_darker);
}
tr:nth-child(odd) td.simLeBParentShadowFitCont{
padding:0.1rem 0.5rem;
border-radius:0.3rem;
/*text-align:center;*/
/* background-color: #FBFCFD; */
background-color:var(--color_whitish_darker);
}



tr.bluered
{
/* box-shadow:inset 0 0.5rem 0.5rem #455, inset 0 -0.5rem 0.5rem #544, inset 0.5rem 0 0.5rem #454, inset -0.5rem 0 0.5rem #454; */
box-shadow:inset 0 0.5rem 0.5rem rgba(64,128,128,0.5), inset 0 -0.5rem 0.5rem rgba(128,64,64,0.5),
inset 0.5rem 0 0.5rem rgba(64,128,64,0.5), inset -0.5rem 0 0.5rem rgba(64,128,64,0.5), -0.2rem 0.3rem 0.3rem rgba(0,0,0,0.1), 0 0 0.5rem rgba(0,0,0,0.2),
0 0 0.1rem white;
border-radius:1rem;
}


div.simLeBParent_Scroll_outer{
width:93%;
margin:0 auto;
border:0.2rem solid #5DF;
border-radius:0.6rem;
background:rgba(53, 87, 96, 0.4);	/*H:128, S:70, V:70, A:30% */ 
/* padding: 0.5rem; */
padding:0.5rem;
box-shadow:0 0 0.5rem 0.1rem #5DF, inset 0 0 0.7rem 0.1rem #5DF;
}

div.simLeBParent_Scroll_head{
margin-top:1rem;
margin-left:0.1rem;
margin-right:0.1rem;
font-size:2rem;
font-weight:bold;

/* like th.menu: */
padding:0.25rem;
border-radius:0.3rem;
text-align:center;
color:var(--color_whitish);
text-shadow:0 0 0.9rem rgba(25,13,0,0.7);
background-color:rgba(0,0,0,0.3);
border:0.1rem solid rgba(0,170,213,0.3);	/* HSV: 128/240/100 */
}

div.simLeBParent_Scroll_inner{
max-height:15rem;
overflow-y:auto;
}

table.simLeBParent_Scroll{
border-spacing:0.1rem 1rem;
width:100%;
}




table.aQ{
text-align:center;
border-spacing:0.5vw;
width:93%;
margin:0 auto;
}

.aQ td, .aQ th{
border:1px solid;
padding:1vw;
font-size:2rem;
background-color: var(--color_whitish);
}

/* table.info{ */
/* background-color:#DEF; */
/* padding:0.5vw; */
/* border-radius:1vw; */
/* border: 0.2vw solid #9AF; */
/* } */

/* td.infoDetails{ */
/* padding:0.2vw; */
/* padding-right:2vw; */
/* font-size:2rem; */
/* border:1px solid #ABF; */
/* border-radius:0.5vw; */
/* } */

div.part
{
width:95%;
margin-left:auto;
margin-right:auto;
margin-bottom: 1vh;
border: 0.3vw solid #A0B0FF;
border-radius:2vw;
/*background-color: #FFFFFF;*/
text-align:center;
font-size:2rem;
padding: 1vw;
}
		


button.beta {
border: 0.1vw solid red;
color: red;
background:none;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1rem;
transition-duration: 0.9s;
border-radius:1vw;
transform: rotate(-15deg);
}

button.beta:hover {
background-color: #FDD;
transition-duration: 0.1s;
}

div.logo{
width:12rem;
background-color: rgba(245,255,200,0.3);


background-image:url('Logo_w800.png');
/* background-size:10rem auto; */
background-size:9.3rem auto;
background-repeat:no-repeat;
background-position:center;
height:5.7rem;

border-radius:3rem;
border:0.2rem #222 solid;
/* transition-duration: 0.7s; */
transition: border 0.7s;
}

div.logo_ex{
position:relative;
top:-0.7rem;
left:-0.7rem;
width:13rem;
height:6.7rem;
border-radius:3.5rem;
border:0.1rem rgba(85,85,85,0) solid;
transition: 0.3s;
}

div.logo:hover{
border:0.2rem #A22 solid;
box-shadow:0 0 0.8rem 0 rgba(255,100,0,0.2);
/* transition-duration: 0.0s; */
transition: border 0.0s;
}

div.logo_ex:hover{
top:-0.4rem;
left:-0.4rem;
width:12.4rem;
height:6.1rem;
border-radius:3.2rem;
border:0.1rem rgba(85,85,85,1.0) solid;
transition: 0.3s;
}


input.check {
width:1.5rem;
height:1.5rem;
}

label.check{
font-size:1.5rem;
line-height:1.4rem;
}

label
{
user-select: none;
}

img.coin{
height:0.9rem;
width:auto;
margin-bottom:-0.1rem;
}

img.treasure{
height:2.3rem;
width:auto;
margin-bottom:-0.5rem;
}

a{
font-family:Tahoma, sans-serif;
/* font-size:2rem; */
/* color: #0AF; */
color: #05A;
text-decoration: underline;
}

a:visited {
color: #05A;
}

a:hover {
color: red;
}

a:active {
color: #05A;
}

a.login{
font-family:Tahoma, sans-serif;
font-size:2rem;
color: #0AF;
text-decoration: underline;
padding:0 1rem;
letter-spacing:0.1rem;
}

a.login:visited {
color: #0AF;
}

a.login:hover {
color: red;
}

a.login:active {
color: #0AF;
}


a.button
{
text-decoration:none;
color:black;
}

a.footer{
font-family:Tahoma, sans-serif;
font-size:1.3rem;
/* font-weight:bold; */
color: #0AF;
text-decoration: underline;
padding:0 1rem;
/* letter-spacing:0.05rem; */
letter-spacing:0.1rem;
/* text-shadow:1px 1px 0 #000; */
}

a.footer:visited {
color: #0AF;
}

a.footer:hover {
color: red;
}

a.footer:active {
color: #0AF;
}


button.footer{
font-family:Tahoma, sans-serif;
font-size:1.3rem;
color: #0AF;
text-decoration: underline;
padding:0 1rem;
letter-spacing:0.1rem;
background:none;
border:none;
cursor:pointer;
}
button.footer:hover {
color: red;
}

.footerX
{
font-size:1.2em;
color: #0CF;
}

a:hover .footerX {
color: red;
}

button:hover .footerX {
color: red;
}

ul.FAQ_1
{
margin:0;
padding-left: 1.5rem;
line-height:150%;
list-style-type: disc;
}

ul.FAQ_1 > li
{
margin: 0.5rem 0.5rem 0.5rem 0;
padding:0.5rem;
box-shadow:0 0 0.5rem 0.1rem rgba(0,0,0,0.1);
border-radius:0.5rem;
}

ul.FAQ_1 > li::marker
{
/* content: '✝ '; */
color:#A00;
/* font-size: 1.5em; */
}

ul.FAQ_2
{
margin:0;
padding-left: 1.5rem;
line-height:150%;
list-style-type: disc;
}

ul.FAQ_2 > li::marker
{
/* content: '✝ '; */
color:#A70;
/* font-size: 1.5em; */
}



div.meter{
display:inline-block;
width:85%;
margin:auto;
background:#EEE;
border:0.1rem solid #555;
border-radius:1rem;
padding:0.2rem 0.5rem;
box-shadow: inset 0 -0.08rem 0.08rem rgba(0,0,0,0.5), inset 0 0.08rem 0.08rem rgba(255,255,255,0.5);
}

div.meterI{
height:0.6rem;
width:100%;
background-color:#CC0;
border-radius:1rem;
}

@keyframes updating_status_active_animation{
0%	{border:0.15rem solid rgba(50,50,50,0.5);}
4%	{border:0.15rem solid rgba(0,255,0,0.5);}
50%	{border:0.15rem solid rgba(0,255,0,0.5);}
100%	{border:0.15rem solid rgba(50,50,50,0.5);}
}

div.updating_status
{
font-size:1rem;
color:white;
background:rgba(0,0,0,0.8);
border-radius:0.2rem;
width:fit-content;
padding:0.2rem 0.7rem;
border:0.15rem solid rgba(200,200,200,0.5);
}

div.updating_status_active
{
animation:updating_status_active_animation 5.0s linear 0.0s both;
}

textarea.rev{
resize: none;
width:95%;
height:5rem;
margin:0.5rem;
font-size:1.3rem;
background-color: var(--color_whitish);
border:0.15rem solid #797;
border-radius:0.2rem;
box-shadow: -0.05rem 0.08rem 0.2rem 0.1rem rgba(0,0,0,0.3);
color:var(--color_written);
}

div.rev{
width:95%;
/* height:5rem; */
margin:0.5rem;
padding:0.25rem;
font-size:1.3rem;
background-color: var(--color_whitish);
border:0.15rem solid #797;
border-radius:0.2rem;
box-shadow: -0.05rem 0.08rem 0.2rem 0.1rem rgba(0,0,0,0.3);
color:var(--color_written);
}

textarea.small{
resize: none;
width:90%;
/* height:5rem; */
margin:0;
font-size:1.2rem;
background-color: var(--color_whitish);
border:0.15rem solid #555;
border-radius:0.2rem;
/* box-shadow: -0.05rem 0.08rem 0.2rem 0.1rem rgba(0,0,0,0.3); */
color:var(--color_written);
}

textarea.CRev_res	/* for result-symbols */
{
resize: none;
width:70%;
min-width:12rem;
height:3rem;
margin:0.5rem;
font-size:1.2rem;
background-color: var(--color_whitish);
border:0.15rem solid #555;
border-radius:0.2rem;
color:var(--color_written);
}

textarea.contact{
resize: none;
width:95%;
height:15rem;
margin:0.5rem;
font-size:1.3rem;
background-color: var(--color_whitish);
border:0.15rem solid #797;
border-radius:0.2rem;
box-shadow: -0.05rem 0.08rem 0.2rem 0.1rem rgba(0,0,0,0.3);
color:var(--color_written);
}

span.headline
{
margin-bottom:0.5rem;
display:inline-block;
/* border-bottom:0.2rem solid rgba(128,64,64,0.3); */
border-bottom:0.2rem solid rgba(64,64,64,0.3);
/* border-top:0.2rem solid rgba(64,128,128,0.3); */
/* box-shadow: inset 0 -0.4rem 0.4rem -0.3rem rgba(200,100,0,0.3), inset 0 0.4rem 0.4rem -0.3rem rgba(100,100,200,0.3); */
/* box-shadow: 0 0.4rem 0.4rem -0.3rem rgba(0,0,100,0.3); */
text-align:left;
}

span.headline_noMarg
{
/* margin-bottom:0.5rem; */
display:inline-block;
/* border-bottom:0.2rem solid rgba(128,64,64,0.3); */
border-bottom:0.2rem solid rgba(64,64,64,0.3);
/* border-top:0.2rem solid rgba(64,128,128,0.3); */
/* box-shadow: inset 0 -0.4rem 0.4rem -0.3rem rgba(200,100,0,0.3), inset 0 0.4rem 0.4rem -0.3rem rgba(100,100,200,0.3); */
/* box-shadow: 0 0.4rem 0.4rem -0.3rem rgba(0,0,100,0.3); */
text-align:left;
}

span.FAQ_headline
{
margin-bottom:0.5rem;
display:inline-block;
/* border-bottom:0.2rem solid rgba(64,64,64,0.3); */
border-bottom:0.2rem solid rgb(0,200,180);
text-align:left;
}

img.WelcPerson
{
width:6rem;
height:auto;
float:left;
margin-left:1rem;
}

@keyframes mes_welc_inner_animation_op{
0%	{opacity:0.3;}
100%	{opacity:1.0;}
}
@keyframes mes_welc_inner_animation_le{
0%	{left:-1rem;}
100%	{left:0rem;}
}


div.mes_welc
{
padding:0.4rem 1rem;
margin:auto;
margin-left:7rem;
margin-right:2rem;
margin-top:1rem;
font-size:2rem;
color:var(--color_whitish);
/* text-shadow:0.0rem 0.0rem 0.5rem rgba(50,100,0,0.99); */
background: rgba(34, 34, 34, 0.5);
border-left:0.5rem solid #EB0;
/* border-radius:0 0.5rem 0.5rem 0; */
border-radius:0.5rem;
text-decoration:underline #EB0 0.05rem;
user-select:none;
overflow:clip;
}

.mes_welc_inner{
position:relative;
animation:mes_welc_inner_animation_op 0.8s ease-in-out 0.0s both, mes_welc_inner_animation_le 0.6s ease-out 0.0s both;
}

select
{
font-size:2rem;
color:#000;
}

select.smaller
{
font-size:1.5rem;
}

select.mark
{
color:#FB0;
background-color:#333;
border-radius:0.5rem;
box-shadow: 0 0 0.5rem 0.0rem rgba(0,0,0,0.5);
}

select:disabled
{
/* background:var(--color_whitish); */
background:#DDD;
border-radius:0.2rem;
}

input[type="text"]:disabled
{
background:#DDD;
border-radius:0.2rem;	
}

.text_expl
{
color:var(--color_expl);
font-size:1.5rem;
font-weight:normal;
background:rgba(0,0,0,0.5);
border-radius:0.6rem;
text-align:center;
padding: 0.1rem 0.4rem;
}

div.text_expl
{
margin:auto;
margin-top:0.25rem;
width:fit-content;
border:0.1rem solid rgba(0,0,0,0.3);
}

td.text_expl
{
border:0.1rem solid rgba(0,0,0,0.3);
}

.text_note
{
color:var(--color_note);
text-shadow: 0 0 0.5rem #000;
font-size:1.5rem;
font-weight:normal;
background:rgba(0,0,0,0.5);
border-radius:0.6rem;
text-align:center;
padding: 0 0.25rem;
}

div.text_note
{
margin:auto;
margin-top:0.2rem;
width:fit-content;
border:0.1rem solid rgba(0,0,0,0.3);
}

td.text_note
{
border:0.1rem solid rgba(0,0,0,0.3);
}

.text_note_L
{
color:var(--color_note);
text-shadow: 0 0 0.5rem #000;
font-size:2rem;
line-height:1.5;
font-weight:normal;
background:rgba(0,0,0,0.5);
border-radius:0.6rem;
text-align:center;
padding: 0.5rem 0.25rem;
}

td.titaEmpty
{
border: 0.15rem solid #333;
border-radius: 0.3rem;
text-align:center;
background-color:rgba(150,150,150,0.6);
font-size: 1.3rem;
}

th.tita
{
padding:0.1rem;
/* border: 0.15rem solid #555; */
border-radius: 0.3rem;
text-align:right;
background-color:rgba(0,0,0,0.5);
font-size: 1.3rem;
color:var(--color_whitish);
}

tr.tita:hover th.tita
{
box-shadow: inset 0 0 0.2rem 0.2rem #D55;
}

button.tita
{
width:99%;
border: 0.15rem solid #333;
color: #000;
/* text-shadow: 0 0 0.2rem #AFA; */
/* background-color: var(--color_whitish); */
/* background-color: #DDD; */
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1.3rem;
margin: auto;
/* transition-duration: 0.9s; */
/* transition: background 1.2s; */
cursor: pointer;
border-radius:0.3rem;
padding:0.1rem;
}

div.tita_room
{
color:#444;
font-size:1rem;
}

div.tita_teach
{
color:#33A;
font-size:1rem;
}

.tita_0
{
background-color:rgb(255,244,234);
}
.tita_1
{
background-color:rgb(255,255,234);
}
.tita_2
{
background-color:rgb(244,255,234);
}
.tita_3
{
background-color:rgb(234,255,234);
}
.tita_4
{
background-color:rgb(234,255,244);
}
.tita_5
{
background-color:rgb(234,255,255);
}
.tita_6
{
background-color:rgb(234,244,255);
}
.tita_7
{
background-color:rgb(234,234,255);
}
.tita_8
{
background-color:rgb(244,234,255);
}
.tita_9
{
background-color:rgb(255,234,255);
}

table.printTable{
width:93%;
margin:0 auto;
/* border: 0.15rem solid #777; */
border-radius: 0.6rem;
padding: 0.5rem;
border-spacing: 0 0;
font-size: 1rem;
background-color:white;
}
tr.printTable{

}

th.printTable{
/* padding: 0 0.25rem; */
border-bottom: 0.15rem solid #777;
border-top: 0.15rem solid #777;
/* border-radius: 0.1rem; */
font-size: 2rem;
}
td.printTable{
padding: 0 0.25rem;
border: 0.1rem solid #777;
border-radius: 0.1rem;
font-size: 1rem;
}

div.printTable_Div_NoPageBreak
{
page-break-inside:avoid;
padding: 0 0.25rem;
border: 0.1rem solid #777;
border-radius: 0.2rem;
font-size: 1rem;
}


img.previewUpload
{
max-width:90%;
/* min-width:10rem; */
max-height:10rem;
/* display:block; */
margin:0.5rem;
/* margin-bottom:0; */
padding:0.3rem;
border-radius:0.3rem;
/* background:var(--color_whitish); */
background:#8D8;
box-shadow:0.1rem 0.1rem 0.5rem 0.2rem rgba(0,0,0,0.3);
user-drag:none;
user-select: none;
}

div.previewUpload
{
/* width:fit-content; */
/* margin:auto; */
/* margin-bottom:0.5rem; */
/* margin:0.5rem auto; */
margin:0.5rem;
border:0.15rem solid #888;
padding:0.5rem;
border-radius:0.3rem;
background:#DDD;
text-align:left;
/* box-shadow:inset -0.1rem -0.1rem 0.5rem 0 rgba(0,0,0,0.5),inset 0.1rem 0.1rem 0.5rem 0.2rem rgba(255,255,255,1.0); */
}

audio.previewUpload
{
max-width:90%;
min-width:10rem;
/* max-height:10rem; */
/* display:block; */
margin:0.5rem;
/* margin-bottom:0; */
padding:0.3rem;
border-radius:0.3rem;
background:#8D8;
box-shadow:0.1rem 0.1rem 0.5rem 0.2rem rgba(0,0,0,0.3);
}

img.previewMedia
{
/* max-width:90%; */
max-width:95%;
max-height:10rem;
/* display:block; */
/* margin:0.5rem auto; */
/* border:0.2rem dashed #AAA; */
border:0.1rem solid #555;
/* padding:0.3rem; */
/* border-radius:0.3rem; */
/* background:#FFF; */
/* float:left; */

cursor: pointer;
}

audio.previewMedia
{
/* max-width:90%; */
max-width:95%;
/* max-height:10rem; */
/* display:block; */
/* margin:0.5rem auto; */
/* border:0.2rem dashed #AAA; */
/* padding:0.3rem; */
/* border-radius:0.3rem; */
/* background:#FFF; */
/* float:left; */
}

div.previewMedia
{
max-width:90%;
width:fit-content;
/* max-height:10rem; */
display:block;
/* margin:0.5rem auto; */
border:0.2rem dashed #AAA;
padding:0.3rem;
border-radius:0.3rem;
background:var(--color_whitish);
line-height:1rem;
text-align:center;
}

span.previewMedia
{
color:#555;
font-size:1.3rem;
}

div.previewMedia_undef
{
max-width:90%;
display:block;
margin:0.5rem 1rem;
border:0.2rem dashed #AAA;
padding:0.3rem;
border-radius:0.3rem;
background:#FFB;
float:left;
color:#D20;

/* width:fit-content;  used in div.previewMedia ??? */
/* text-align:center;  used in div.previewMedia ??? */
}

div.previewMedia_unknown
{
max-width:90%;
display:block;
margin:0.5rem 1rem;
border:0.2rem dashed #C00;
padding:0.3rem;
border-radius:0.3rem;
background:#FFA;
float:left;
color:#D0C;

/* width:fit-content;  used in div.previewMedia ??? */
/* text-align:center;  used in div.previewMedia ??? */
}


img.ContentMedia
{
max-width:95%;
/* min-height:5rem; */
/* max-height:10rem; */
/* min-height:10rem; */
max-height:15rem;
/* height:12rem; */
display:block;
margin:0.5rem 1rem;
margin-left:0.5rem;
padding:0.2rem;
/* border:0.2rem solid #AAA; */
border-radius:0.3rem;
background:var(--color_whitish);
float:left;
box-shadow:0 0 0.2rem 0.1rem #888;
cursor: pointer;
}

audio.ContentMedia
{
/* max-width:95%; */
width:90%;
/* min-height:5rem; */
/* max-height:10rem; */
display:block;
margin:0.5rem auto;
padding:0.2rem;
/* border:0.2rem solid #AAA; */
border-radius:0.3rem;
background:var(--color_whitish);
/* float:left; */
box-shadow:0 0 0.2rem 0.1rem #888;
}

button.mediaAdd {
border:0.2rem dashed #AAA;
border-radius:0.3rem;
max-width:100%;
max-height:100%;
min-height:4rem;
min-width:60%;
font-size:2rem;
color:#A08;
cursor: pointer;
}






div.menuFlexDiv
{
max-width:95%;
display:flex;
align-items:center;
justify-content:space-around;
flex-flow:row wrap;
padding:0.3rem;
border-radius:0.3rem;
margin:1rem auto;
box-shadow: -0.05rem 0.08rem 0.2rem 0.1rem rgba(0,0,0,0.3);
/* background-color:#FFF; */
background-color:var(--color_whitish);
}

div.FlexDivSimpl
{
display:flex;
align-items:center;
justify-content:space-around;
flex-flow:row wrap;
}

div.FlexDivSimplLeft
{
display:flex;
align-items:center;
justify-content:left;
flex-flow:row wrap;
}

div.FlexDivSimplWrapRev
{
display:flex;
align-items:center;
justify-content:space-around;
flex-flow:row wrap-reverse;
}

div.FlexDivSimplSpaceBetween
{
display:flex;
align-items:center;
justify-content:space-between;
flex-flow:row wrap;
}



div.FlexDivNoSpace
{
/* max-width:95%; */
display:flex;
align-items:center;
justify-content:center;
flex-flow:row wrap;
/* padding:0.3rem; */
/* border-radius:0.3rem; */
/* margin:1rem auto; */
/* box-shadow: -0.05rem 0.08rem 0.2rem 0.1rem rgba(0,0,0,0.3); */
/* background-color:#FFF; */
/* background-color:var(--color_whitish); */
}

div.FlexDivCompact
{
display:flex;
align-items:center;
justify-content:center;
flex-flow:row wrap;
font-size:1rem;
text-align:left;
}

div.FlexCompChild
{
background:var(--color_whitish);
border-radius:0.5rem;
padding:0.5rem;
margin:0.5rem;
box-shadow:inset 0 0 0.3rem 0 rgba(0,0,0,0.4),0.1rem 0.1rem 0.4rem 0 rgba(0,0,0,0.3);
}

span.noLiBr
{
display:inline-block;
}

td.markAnsw
{
box-shadow:inset 0 0 0.1rem 0.1rem #444,0 0 0.2rem 0.4rem #AFA;
}

td.markAnswRed
{
box-shadow:inset 0 0 0.1rem 0.1rem #444,0 0 0.2rem 0.4rem #F85;
}

td.markAnswPurple
{
box-shadow:inset 0 0 0.1rem 0.1rem #444,0 0 0.2rem 0.4rem #80A;
}

button.markAnsw
{
box-shadow:0 0 0.3rem 0.2rem #AFA;
color:#FFF;
}

span.markAnsw
{
box-shadow:0 0 0.5rem 0.4rem #AFA;
}

span.markAnswRed
{
box-shadow:0 0 0.5rem 0.4rem #F85;
}

.QTag
{
background:#444;
color:var(--color_whitish);
padding:0.2rem 1rem;
font-size:1rem;
text-shadow:0 0 0.2rem #000;
float:right;
border-radius:0.2rem;
margin-left:0.8rem;
margin-top:0.15rem;
}

.FS1_5{
font-size:1.5rem !important;
}

.FS1_3{
font-size:1.3rem !important;
}
.FS1_2{
font-size:1.2rem !important;
}
.FS1_1{
font-size:1.1rem !important;
}
.FS1_0{
font-size:1.1rem !important;
}

.FSx0_9{
font-size:0.9em !important;
}
.FSx0_8{
font-size:0.8em !important;
}



div.bottomLine
{
text-align:center;
margin-top:0.2rem;
background-image:linear-gradient(90deg,rgba(200,200,200,0),rgba(200,200,200,0.5) 50%, rgba(200,200,200,0) 100%);
padding:0.2rem;
clear:both;
}

div.tableTopLine
{
text-align:center;
font-size:1.3rem;
color:#000;
background-image:linear-gradient(90deg,rgba(200,200,200,0),rgba(200,200,200,0.8) 20%,rgba(200,200,200,0.8) 80%, rgba(200,200,200,0) 100%);
padding:0.2rem 15%;
/* clear:both; */
}

span.markStat
{
/* border-left: 0.1rem solid #777; */
/* border-right: 0.1rem solid #777; */
border-radius:0.15rem;
background-color:var(--color_whitish);
margin:0.5rem 0.2rem;
padding:0.5rem;
}

span.mark
{
margin:0.15rem;
display:inline-block;
border:0.1rem solid #555;
padding: 0 0.3rem;
min-width:2rem;
text-align:center;
border-radius:0.5rem;
background:rgba(0,0,0,0.07);
}

span.result_list_points
{
font-size:0.8em;
color:#860;
/* border:solid 0.1rem #555; */
padding:0 0.2rem;
display:inline-block;
border-radius:0.15rem;
background:rgba(0,0,100,0.07);
box-shadow:inset 0 0 0.2rem rgba(0, 20, 100,0.5);
}

span.result_list_date
{
font-size:0.8em;
color:#777;
display:inline-block;
border:0.05rem dashed #555;
border-radius:0.15rem;
padding:0 0.2rem;
margin-bottom:0.1rem;
}

span.grade
{
background:rgba(0,100,255,0.2);
border-radius:0.2rem;
border:0.1rem solid rgba(0,100,255,0.3);
padding:0 0.1rem;
/* color:#000; */
}
span.grade::after
{
content:"△";
font-size:0.4em;
vertical-align:top;
color:rgb(0,100,255);
}

span.grade_light
{
background:rgba(0,100,255,0.1);
border-radius:0.2rem;
border:0.1rem solid rgba(0,100,255,0.2);
padding:0 0.1rem;
}

span.grade_light::after
{
/* content:"🎒︎"; */
content:"△";
font-size:0.4em;
/* position:relative; */
/* top:-0.4em; */
vertical-align:top;
/* color:#AAA; */
color:rgb(0,100,255);
}

span.grade_dark
{
background:rgba(0,100,255,0.1);
border-radius:0.2rem;
border:0.1rem solid rgba(0,100,255,0.2);
padding:0 0.1rem;
}

span.grade_dark::after
{
content:"🎒︎";
font-size:0.6em;
position:relative;
top:-0.4em;
color:#555;
}

span.list_sTy
{
font-size:0.8em;
color:#366;
border-top:0.1rem solid #366;
border-bottom:0.1rem solid #366;
display:inline-block;
line-height:1em;
position:relative;
top:-0.1rem;
}

span.list_mainLG
{
border-radius:0.2rem;
border:0.1rem solid rgba(255,180,0,0.3);
padding:0 0.1rem;
background:rgba(255,180,0,0.2);
color:#000;
}

span.list_aName
{
color:#555;
font-size:0.8em;
display:inline-block;
margin-left:0.5rem;
}

img.list_logo
{
height:2.0rem;
float:right;
margin:0.1rem;
}

span.list_sep
{
margin:0 0.2rem;
background:rgba(0,0,0,0.1);
}

span.list_sepL
{
margin:0 0.2rem;
background:rgba(0,0,0,0.1);
border-left:1px solid #777;
padding-left:0.1rem;
}

span.user_deactive
{
padding:0 0.3rem;
margin:0.1rem;
background:#FBB;
color:#000;
text-shadow:1px 1px 0.1rem #FFF;
}

span.role
{
color:var(--color_role);
text-decoration:underline;
}

span.coin1x{
display:inline-block;
width:1rem;
height:1rem;
position:relative;
top:0.1rem;
background-image:url('coin_001_1x.png');
background-size:auto 1rem;
background-repeat:no-repeat;
background-position:center;
}
span.coin2x{
display:inline-block;
width:1.5rem;
height:1rem;
position:relative;
top:0.1rem;
background-image:url('coin_001_2x.png');
background-size:auto 1rem;
background-repeat:no-repeat;
background-position:center;
}
span.coin3x{
display:inline-block;
width:1.9rem;
height:1rem;
position:relative;
top:0.1rem;
background-image:url('coin_001_3x.png');
background-size:auto 1rem;
background-repeat:no-repeat;
background-position:center;
}

span.QType
{
color:#222;
background:#788;
padding:0 0.3rem;
text-shadow:0.05rem 0.05rem 0.3rem #DEE;
border-radius:0.4rem;
font-size:1.5rem;
}

span.QTypeRev
{
float:right;
border:0.1rem solid #555;
border-radius:0.3rem;
margin-top:0.3rem;
margin-top:0.3rem;
margin-bottom:0.3rem;
padding:0.2rem;
background:rgba(0,0,0,0.05);
}

div.P_newV
{
color:#408;
background:rgba(0,0,0,0.05);
border-radius:0.1rem;
padding:0 0.2rem;
}



/*@keyframes KF_login_box_shadow
{
0%	{box-shadow:0 0 0.5rem 0.5rem #5DF6;}
10%	{box-shadow:0 0 0.5rem 0.7rem #5DF6;}
20%	{box-shadow:0 0 0.5rem 0.6rem #5DF6;}
30%	{box-shadow:0 0 0.5rem 0.5rem #5DF6;}
40%	{box-shadow:0 0 0.5rem 0.3rem #5DF6;}
50%	{box-shadow:0 0 0.5rem 0.4rem #5DF6;}
60%	{box-shadow:0 0 0.5rem 0.7rem #5DF6;}
70%	{box-shadow:0 0 0.5rem 0.6rem #5DF6;}
80%	{box-shadow:0 0 0.5rem 0.5rem #5DF6;}
90%	{box-shadow:0 0 0.5rem 0.4rem #5DF6;}
100%	{box-shadow:0 0 0.5rem 0.5rem #5DF6;}
}*/

@keyframes login_animation{
/* 0%		{mask-size: 100%;mask-position: 50% -12rem;} */
/* 100%	{mask-size: 300%;mask-position: center;} */
0%	{opacity:0.5;}
100%	{opacity:1.0;}
}


div.login
{
width:min(calc(100vh * 12 / 16),95vw);
/* margin:auto; */
border-radius:5rem;
padding:0.5rem;
/* box-shadow:0 0 0.5rem 0.5rem #5DF6; */
box-shadow:0 0 0.5rem 0.5rem #5DF6,0 0 2rem 0.2rem rgba(0,0,0,0.1) inset;
text-align:center;
background:#333;
/* background:url(pattern_004.png) */
/* animation:KF_login_box_shadow 6.3s linear infinite; */
}


table.login{
/* width:93%; */
margin:0 auto;
padding:0;
border-spacing: 1rem 1.5rem;

mask:radial-gradient(rgba(0,0,0,1) 40%,rgba(0, 0, 0,0.7) 75%);

/* filter:sepia(30%); */

/* background: rgba(53, 87, 96, 0.4);	H:128, S:70, V:70, A:30%   */

/* box-shadow: 0 0 0.5rem 0.1rem #5DF, inset 0 0 0.7rem 0.1rem #5DF;  */
}

button.loginButton
{
margin-top:2rem;
margin-bottom:2rem;
}
button.welcomeButton
{
margin-top:2rem;
margin-bottom:2rem;
}

div.loginHead
{
position:relative;
}

@keyframes loggingIn_animation_width{
0%	{width:0%;}
100%	{width:100%;}
}
/* @keyframes loggingIn_animation_bg{ */
/* 0%	{background:#5D5F;} */
/* 50%	{background:#5D5F;} */
/* 60%	{background:#5D50;} */
/* 100%	{background:#5D5F;} */
/* } */

div.loggingIn
{
position:absolute;
width:100%;
height:40%;
background:#5D5;
top:30%;
left:0;
display:none;
/* animation:loggingIn_animation_width 4s linear both,loggingIn_animation_bg 0.5s linear infinite both; */
animation:loggingIn_animation_width 4s linear both;
}

.login_animation
{
animation:login_animation 0.4s ease-in 0.0s both;
}

/*@keyframes KF_login_logo
{
0%	{filter:grayscale(0%);}
30%	{filter:grayscale(50%)}
100%	{filter:grayscale(0%)}
}*/

img.logo_login
{
width:50%;
height:auto;
margin:1rem;
user-select:none;
/* animation:KF_login_logo 2s infinite; */
}

@keyframes login_marketing1_animation{
/* 0%		{mask-size: 100%;mask-position: 50% -12rem;} */
/* 100%	{mask-size: 300%;mask-position: center;} */
0%	{opacity:0.0;}
100%	{opacity:1.0;}
}

@keyframes login_marketing2_animation{
/* 0%		{mask-size: 100%;mask-position: 50% -12rem;} */
/* 100%	{mask-size: 300%;mask-position: center;} */
0%	{opacity:0.0;top:1rem;}
100%	{opacity:1.0;top:0;}
}

/* @keyframes login_loggedOut_outer_animation{ */
/* 0%	{mask:linear-gradient(90deg,rgba(0,0,0,1) 0%, rgba(0,0,0,1) 33%, rgba(0,0,0,0.6) 66%, rgba(0,0,0,0.6) 100%);} */
/* 50%	{mask:linear-gradient(90deg,rgba(0,0,0,0.6) 0%, rgba(0,0,0,1) 33%, rgba(0,0,0,1) 66%, rgba(0,0,0,0.6) 100%);} */
/* 100%	{mask:linear-gradient(90deg,rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.6) 33%, rgba(0,0,0,1) 66%, rgba(0,0,0,1) 100%);} */
/* 0%	{mask-position:0% 0%;} */
/* 100%	{mask-position:100% 0%;} */
/* } */

div.login_marketing_outer
{
position:absolute;
width:100%;
margin:3rem 0;
text-align:center;

opacity:100%;
transition:opacity 1.5s cubic-bezier(.55,.06,.68,.19);

font-size:4rem;
color:#FFF;
z-index:2;
/* mask:radial-gradient(rgba(0,0,0,1) 40%,rgba(0,0,0,0.5) 80%); */
mask:linear-gradient(90deg,rgba(0,0,0,0.6), rgba(0,0,0,1) 30%, rgba(0,0,0,1) 70%, rgba(0,0,0,0.6) 100%);
/* mask-image:linear-gradient(90deg,rgba(0,0,0,0.6), rgba(0,0,0,1) 30%, rgba(0,0,0,1) 70%, rgba(0,0,0,0.6) 100%); */
/* animation:login_loggedOut_outer_animation 3.0s linear 0.0s both; */
/* mask-repeat: no-repeat; */
}

div.login_marketing1
{
margin:2rem 0;
animation:login_marketing1_animation 0.4s ease-in 0.0s both;
text-shadow:0 0 0.5rem #FD0;
}

div.login_marketing2
{
margin:2rem 0;
position:relative;
animation:login_marketing2_animation 0.6s ease-in-out 1.0s both;
text-shadow:0 0 0.5rem #0DF;
}

div.login_forgotPsw
{
margin:0 auto 1rem auto;
padding:0.2rem 1rem;
width:fit-content;
background:rgba(255,255,255,0.1);
border-radius:0.5rem;
}

div.dev_page_comment
{
color:#F33;
background:rgba(0,0,0,0.7);
padding:0.1rem 0.2rem;
margin:0.3rem 0;
font-size:1.1rem;
text-shadow:0 0 0.2rem black;
border-left: 0.5rem solid #0F0;
letter-spacing:0.03rem;
}

div.dev_todo_bottom
{
color:#777;
font-size:1rem;
text-align:center;
border-top:0.1rem dashed #777;
margin-top:0.5rem;
}

button.dev_todo_tag
{
color:#037;
font-size:1rem;
border:0.1rem solid #777;
background:#DDD;
margin:0.2rem 0.5rem;
padding:0 0.4rem;
border-radius:0.5rem;
cursor:pointer;
}

button.dev_todo_tag:hover
{
background:#EEA;
}

.dev_todo
{
color:red;
background:#DFA;
}

.markInvalidInput
{
box-shadow:0 0 0.5rem 0.2rem red !important;
}

.reviewInput
{
box-shadow:0 0 0.5rem 0.3rem #0AF !important;
}

.hasProblem
{
box-shadow:0 0 0.6rem 0.4rem #B5D inset;
}

.QMarkMissing
{
box-shadow:inset 0 0 0.3rem 0.2rem #D05;
}

.disNo
{
display:none !important;
}

.bold
{
font-weight:bold !important;
}

@keyframes login_message_inner_animation{
0% {left:-10rem;}
100% {left:0;}
}

.login_message_outer{
overflow:clip;
font-size:1.1rem;
}

.login_message_inner{
position:relative;
animation: login_message_inner_animation 0.5s ease-out 0.2s both;
color:var(--color_whitish);
letter-spacing:0.1rem;
}

.login_message_inner_delayed{
position:relative;
/* animation: login_message_inner_animation 0.5s ease-out 0.2s both; */
animation: login_message_inner_animation 0.5s ease-out 4.2s both;
color:var(--color_whitish);
letter-spacing:0.1rem;
}


.manMarkType
{
color:#A00;
text-shadow:0 0 0.1rem rgba(0,0,0,0.3);
border:0.15rem solid #A00;
border-radius:0.5rem;
padding:0 0.5rem;
}

.classPropsOnClassPage{
font-size:1.5rem;
font-weight:normal;
}

.ClassPage_ReadMode{
font-size:1.5rem;
font-weight:normal;
color:#BB8;
text-shadow:1px 1px 0 #222;
}

.ClassPage_ReadMode_dark{
font-size:1.5rem;
font-weight:normal;
color:#663;
text-shadow:1px 1px 0 #222;
}

@keyframes classNameOnClassPage_animation{
/* 0% {top:-1.8rem;} */
/* 100% {top:0;} */
0% {opacity:20%;transform:scale(0.98);}
30% {opacity:20%;}
100% {opacity:100%;transform:scale(1.0);}
}

div.classNameOnClassPage
{
text-shadow:0.05rem 0.05rem 0.2rem #000;
letter-spacing:0.02rem;
/* border-bottom:0.1rem solid #555; */
border-bottom:0.1rem solid rgba(0,170,213,0.3);
margin:0 auto;
width:80%;
padding-bottom:0.2rem;
}

div.classNameOnClassPage_animate
{
animation: classNameOnClassPage_animation 0.4s ease-in 0.1s both;
}



/* >>> replace by div.overlay_image_container >>> */
div.overlay_container
{
position: fixed;
display: none;
width: 100%;
height: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0,0,0,0.7);
z-index: 10;
cursor: pointer;
}

div.overlay_image_container
{
position: fixed;
display: none;
width: 100%;
height: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0,0,0,0.7);
z-index: 10;
cursor: pointer;
}

img.overlay_image
{
width:80%;
height:80%;
/* max-width:80%; */
/* max-height:80%; */
object-fit:contain;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
border:0.2rem solid #AAA;
background:#000;
border-radius:0.3rem;
}

div.overlay_image_info
{
position: fixed;
width:fit-content;
padding:1rem;
left: 0;
bottom: 0;
background-color:#444;
color:#7EE;
opacity:70%;
z-index: 11;
font-size:1rem;
}



/* might be not used in many good places... >>  */
img.publ_logo_small
{
height:2rem;
display:block;
margin:0.05rem 0 0.05rem 0.5rem;
box-shadow:0.05rem 0.05rem 0.2rem rgba(0,0,0,0.3);
border-radius:0.2rem;
}


button.fav
{
float:right;
font-size:2.5rem;
line-height:2.5rem;
padding:0 0.2rem;
border-radius:100%;
background:#CCC;
/* border:none; */
border:0.1rem solid #111;
color:#FC0;
text-shadow:0.05rem 0.05rem 0.1rem #333,0 0 1px black;
margin:0.2rem 0.1rem;
box-shadow:0.1rem 0.1rem 0.4rem 0.2rem rgba(0,0,0,0.4);
}

button.fav:hover
{
color:#FF0;
text-shadow:0.05rem 0.05rem 0.1rem #08F,0 0 1px black;
}


span.fav
{
position:relative;
top:-0.15rem;
}

span.fav::before
{
content:"★";
}


button.report
{
float:right;
font-size:2.5rem;
line-height:2.5rem;
padding:0 0.2rem;
border-radius:100%;
background:#CC9;
/* border:none; */
border:0.1rem solid #F80;
color:#F80;
text-shadow:0.1rem 0.1rem 0.1rem #333,0 0 1px black;
margin:0.2rem 0.1rem;
box-shadow:0.1rem 0.1rem 0.4rem 0.2rem rgba(0,0,0,0.4);
width:2.6rem;
height:2.6rem;
font-weight:bold;
}

button.report:hover
{
color:#FF0;
text-shadow:0.1rem 0.1rem 0.1rem #08F,0 0 1px black;
}


span.report
{
position:relative;
top:-0.15rem;
}

span.report::before
{
content:"!";
}


button.seen
{
float:right;
font-size:2.5rem;
line-height:2.5rem;
padding:0 0.3rem;
aspect-ratio:1;
border-radius:100%;
background:#CCC;
border:0.1rem solid #111;
color:#777;
text-shadow:0.05rem 0.05rem 0.1rem #333,0 0 1px black;
margin-left:auto;
margin-right:1rem;
margin-top:0.5rem;
margin-bottom:0.5rem;
box-shadow:0.1rem 0.1rem 0.4rem 0.2rem rgba(0,0,0,0.4);
}

button.seen:hover
{
color:#0C0;
text-shadow:0.05rem 0.05rem 0.1rem #555,0 0 1px black;
}




span.favFull
{
/* position:relative; */
/* top:-0.15rem; */
color:#FC0;
text-shadow:0.05rem 0.05rem 0.1rem #333,0 0 1px black;
font-size:1.2em;
line-height:1em;
}

span.favFull::before
{
content:"★";
}


span.byAI
{
color:#CAF;
font-weight:bold;
margin-left:1rem;
}

span.mediaLicEdited
{
color:#EA5;
font-weight:bold;
margin-left:1rem;
}


/* button.fav:hover span.fav::before */
/* { */
/* content:"✔"; */
/* } */


div.fav_overlay
{
position: fixed;
overflow-y:auto;
display: none;
width: 100%;
height: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
/* background-color: rgba(0,0,0,0.7); */
background-color: rgba(0,0,0,0.5);
z-index: 10;
cursor: pointer;
}

body.noscroll
{
overflow:hidden;
}

div.fav_overlay_headline
{
width:fit-content;
min-width:50vw;
max-width:95vw;
margin:auto;
margin-top:2rem;
padding:0.5rem;
font-size:2.5rem;
text-align:center;
color:var(--color_whitish);
background:#222;
border:0.15rem solid #CB0;
border-radius:0.3rem;
/* cursor:default; */
cursor:pointer;
}

div.fav_overlay_content
{
width:fit-content;
max-width:95vw;
min-width:45vw;
margin:auto;
margin-top:1rem;
margin-bottom:2rem;
padding:2rem;
text-align:center;
color:#000;
background:#222;
border:0.15rem solid #CB0;
border-radius:0.3rem;
cursor:default;
/* overflow-y:auto; */
/* max-height:calc(100vh - 8.5rem); */
}

span.FavP_my
{
color:#0AF;
border:0.15rem solid #0AF;
border-radius:0.5rem;
font-size:0.7em;
padding:0 0.2rem;
position:relative;
top:-0.4em;
}

table.fav
{
width:100%;
/* margin:1rem auto; */
/* margin:auto; */
margin:0;
/* border:0.2rem solid #7A7000;*/		/* #CB0 * 0.6 */
/* border-radius:0.3rem; */
/* background: var(--color_whitish_darker); */
/* padding:1rem; */
padding:0;
border-spacing:1rem 1rem;
/* box-shadow:-0.1rem 0.1rem 0.2rem 0.3rem rgb(16,16,16,0.3); */
font-size:1.5rem;
color:#000;
}

td.fav{
padding: 0 0.25rem;
border-radius: 0.3rem;
text-align:left;
background-color: var(--color_whitish);
}

tr:hover td.fav{
background-color: #E0F5D0;
background-image:none;
}


div.OLfav_inner
{
margin:auto;
border:0.2rem solid #7A7000;		/* #CB0 * 0.6 */
border-radius:0.3rem;
/* background: var(--color_whitish_darker); */
padding:1rem;
padding-top:0.5rem;
box-shadow:0.1rem 0.1rem 0.5rem 0.5rem rgb(0,0,0,0.3);
font-size: 2rem;
color: var(--color_whitish);
}

div.favOverlay_table_outer
{
overflow-y:scroll;
max-height:50vh;
}

input.OLfav_ListProp
{
background-color: var(--color_whitish);
border-radius: 0.3rem;
color:var(--color_written);
font-size:2rem;
width:100%;
}

table.OLfav_ListProp
{
text-align:left;
margin:0.5rem auto;
border:0.1rem solid var(--color_whitish);
border-spacing:0.5rem;
box-shadow:0.1rem 0.1rem 0.5rem 0.5rem rgb(0,0,0,0.3);
}

table.report_info
{
text-align:left;
font-size:1.5rem;
color:#7B8;
border-left:0.15rem solid #555;
padding-left:0.5rem;
}

select.OLfav
{
font-size:1.5rem;
}

.cursor_pointer
{
cursor: pointer !important;
}



.ClassRegComInvalid
{
text-decoration:line-through red 0.1rem;
color:#555;
}

div.new_message
{
background:#FF5;
color:#000;
float:left;
text-shadow:none;
border-radius:0.5rem;
padding:0 0.5rem;
font-size:0.8em;
margin:0.2em 0;
box-shadow:0 0 0.3rem 0.0rem #FF5;
}

div.directLinkO
{
background:rgba(20,20,20,0.3);
margin-top:1rem;
margin-left:auto;
border-radius:0.3rem;
width:fit-content;
padding:0.6rem;
}

div.directLinkI
{
border:0.3rem solid rgba(0,0,0,0.5);
border-radius:0.1rem;
padding:0.5rem;
}

input.directLink
{
font-size: 2rem;
/* color:var(--color_written); */
/* background-color: var(--color_whitish); */
color:#099;
background-color:#111;
border-radius: 0.3rem;
width:15rem;
font-family:"Lucida Console", monospace;
border-color:#033;
}
input.directLink::placeholder
{
color:#AAA;
opacity:1;
}
input.directLink:focus
{
outline:none;
border-color:#066;
}

div.MobileLOO
{
display:none;
background:rgba(20,20,20,0.3);
margin:auto;
margin-top:1rem;
border-radius:0.3rem;
width:fit-content;
padding:0.6rem;
}
div.MobileLOI
{
border:0.3rem solid rgba(0,0,0,0.5);
border-radius:0.1rem;
padding:0.5rem 2rem;
}

button.MobileButtonLO {
text-align:center;
text-decoration:none;
font-size:1.5rem;
/* margin:auto; */
cursor:pointer;
border-radius:2rem;
height:4rem;
width:3rem;
box-shadow:0.1rem 0.15rem 0.5rem 0.1rem rgba(0,0,0,0.8);

border: 0.15rem solid #D00;
color: #D00;
background-color:rgba(51,51,51,0.7);
}

.QHeadSym_q	/* Headline Question Symbol: question */
{
/* font-size:2rem; */
font-size:1em;
font-weight: bold;
color:#A80;
}
.QHeadSym_e	/* Headline Question Symbol: explanation */
{
/* font-size:1.7rem; */
font-size:0.85em;
}
.QHeadSymSmall_e	/* Headline Question Symbol: explanation */
{
font-size:1.35rem;
}
.QHeadSym_ca	/* Headline Question Symbol: correct answer */
{
/* font-size:1.8rem; */
font-size:0.9em;
color:#0A0;
}
.QHeadSymSmall_ca	/* Headline Question Symbol: correct answer */
{
/* font-size:1.35rem; */
line-height: 1em;
color:#0A0;
}
.QHeadSym_wa	/* Headline Question Symbol: wrong answer */
{
/* font-size:1.8rem; */
font-size:0.9em;
color:#D00;
}
.QHeadSymSmall_wa	/* Headline Question Symbol: wrong answer */
{
/* font-size:1.35rem; */
line-height: 1em;
color:#D00;
}

.QHeadSymSmall_Answered_ca	/* Headline Question Symbol: correctLY answerED */
{
/* font-size:1.35rem; */
line-height: 1em;
color:#08D;
}
.QHeadSymSmall_Answered_wa	/* Headline Question Symbol: wrongLY answerED */
{
/* font-size:1.35rem; */
line-height: 1em;
color:#80D;
}

.QIsCorrect
{
/* font-size:1.5rem; */
line-height: 1em;
color:#0A0;
}
.QIsWrong
{
/* font-size:1.5rem; */
line-height: 1em;
color:#D00;
}


.mediaUndefSymbolButton
{
/* font-size:2rem; */
font-size:1em;
color:#C50;
}

.CRev_partUser
{
font-size:1.3em;
background:rgba(0,0,0,0.05);
}

@keyframes animate_fade_in__animation_05{
/* 0% {top:-1.8rem;} */
/* 100% {top:0;} */
0% {opacity:5%;}
100% {opacity:100%;}
}

.animate_fade_in_05_0301
{
animation: animate_fade_in__animation_05 0.3s ease-in-out 0.1s both;
}
.animate_fade_in_05_0501
{
animation: animate_fade_in__animation_05 0.5s ease-in-out 0.1s both;
}


@keyframes animate_loop_scale__animation{
/* 0% {text-shadow:0 0 0.0rem rgba(255,230,0,1);} */
/* 100% {text-shadow:0 0 0.5rem rgba(255,230,0,1);} */
0% {transform:scale(1.0);}
50% {transform:scale(1.1);}
100% {transform:scale(1.0);}
}

.animate_loop_scale
{
animation: animate_loop_scale__animation 1s ease-in-out 0s infinite both;
display:inline-block;
}

@keyframes animate_TQRes__animation{
0% {transform:scale(1.0);}
30% {transform:scale(6.0);}
100% {transform:scale(1.0);}
}

.animate_TQRes
{
display:inline-block;
animation: animate_TQRes__animation 0.8s ease-in-out 0.2s both;
}


@keyframes animate_FlashCardRes__animation{
0% {transform:scale(1.0);}
30% {transform:scale(4.0);}
100% {transform:scale(1.0);}
}

.animate_FlashCardRes
{
display:inline-block;
animation: animate_FlashCardRes__animation 1.4s ease-in-out 0.45s both;
}


.MT025
{
margin: auto;
margin-top:0.25rem;
}

.MB02
{
margin: auto;
margin-bottom:0.2rem;
}

.MB05
{
margin: auto;
margin-bottom:0.5rem;
}

.MBT02
{
margin:0.2rem auto !important;
}

.MBT05
{
margin:0.5rem auto !important;
}

.M05
{
margin:0.5rem !important;
}
.M02
{
margin:0.2rem !important;
}

.M0220
{
margin:0.2rem 2rem !important;
}

.M0205
{
margin:0.2rem 0.5rem !important;
}

.M0005
{
margin:0.0rem 0.5rem !important;
}

.MR05
{
margin:0;
margin-right:0.5rem;
}

.ML05
{
margin:0;
margin-left:0.5rem;
}

.padding05
{
padding:0.5rem;
}

.margin05
{
margin:0.5rem !important;
}

span.IBAN span
{
margin-left:0.5rem;
}
span.IBAN span:first-child
{
margin-left:0;
}

textarea.M02
{
margin:0.2rem;
}

.MTB30
{
margin:3.0rem 0;
}

.MTB10
{
/* margin:1.0rem 0; */
margin-top:1.0rem;
margin-bottom:1.0rem;
}

.MT30
{
margin-top:3.0rem;
}

.MB30
{
margin-bottom:3.0rem;
}

.LiHi07
{
line-height:0.7rem;
}




.w0
{
width:0;
}

.w95
{
width:95% !important;
}

.mw50
{
min-width:50%;
}

.mw20
{
min-width:20%;
}

.hm97vh
{
min-height:97vh;
}

.BoTo_01_5
{
border-top:0.1rem solid #555;
}

table.bospa0310
{
border-spacing:0.3rem 1.0rem;
}

.bg10R03
{
background:rgba(0,0,0,0.1);
padding:0 0.2rem;
border-radius:0.3rem;
}


.bg20
{
background:rgba(0,0,0,0.2);
}






@media screen and (max-width: 900px) {

.mobile_not
{
display:none !important;
}
.mobile_only
{
display:block !important;
}


body {
margin:0;
/* overscroll-behavior:none; */
/* overscroll-behavior-y: contain; */
/* background-image:url(body-bg.jpg); */
background:#000;
}

div.frame
{
/* width:min(calc(100vh * 12 / 16),100vw); */
width:initial;
/* margin:auto; */
margin:0;
/* border:0.5rem solid rgb(26,22,15); */
border:none;
/* border-radius:1rem; */
border-radius:0;
padding:0.5rem;

/* position:relative; */
box-shadow:inset 0 -0.3rem 0.9rem 0 rgb(40, 30, 10);
overflow:clip;

}


}



/* change also in JS (trial) & start */
/* @media screen and (max-width: 900px) { */
@media screen and (max-width: 800px) {


.menu{
font-size: 1.2rem;
}

.menuAction{
font-size: 1.2rem;
}

.menu_noW{
font-size: 1.2rem;
}

.text_small
{
font-size:0.8rem;
}


td.header_logo
{
/* width:12rem; */
width:8rem;
}

div.logo{
/* width:12rem; */
width:8rem;
background-image:url('Logo_w800.png');
/* background-size:9.3rem auto; */
background-size:6.2rem auto;
/* height:5.7rem; */
height:3.8rem;
/* border-radius:3rem; */
border-radius:2rem;
}

div.logo_ex{
position:relative;
/* top:-0.7rem; */
top:-0.467rem;
/* left:-0.7rem; */
left:-0.467rem;
/* width:13rem; */
width:8.667rem;
/* height:6.7rem; */
height:4.467rem;
/* border-radius:3.5rem; */
border-radius:2.333rem;
}

div.logo_ex:hover{
/* top:-0.4rem; */
top:-0.267rem;
/* left:-0.4rem; */
left:-0.267rem;
/* width:12.4rem; */
width:8.267rem;
/* height:6.1rem; */
height:4.067rem;
/* border-radius:3.2rem; */
border-radius:2.133rem;
}

td.header_title
{
/* font-size:3rem; */
font-size:1.5rem;
}


img.WelcPerson
{
/* width:6rem; */
/* margin-left:1rem; */
margin:0;
}

div.mes_welc
{
/* padding:0.4rem 1rem; */
padding:0.4rem;
padding-left:1rem;
/* margin:auto; */
/* margin-left:7rem; */
margin-left:6rem;
/* margin-right:2rem; */
margin-right:0;
margin-top:1rem;
/* font-size:2rem; */
font-size:1.2rem;
}

div.user_info
{
font-size:0.6rem;
}



div.menu{
/* width:93%; */
width:100%;
/* padding: 0.5rem; */
padding: 0.3rem;
}



table.menu{
/* width:93%; */
width:100%;
/* padding: 0.5rem; */
padding: 0.3rem;
/* border-spacing: 1rem 1.5rem; */
border-spacing: 0.8rem 1.2rem;
}

table.menuAction{
/* width:93%; */
width:100%;
/* padding: 0.5rem; */
padding: 0.3rem;
/* border-spacing: 1rem 1.5rem; */
border-spacing: 0.8rem 1.2rem;
}

table.info{
/* width:93%; */
width:100%;
/* padding: 0.5rem; */
padding: 0.3rem;
border-spacing: 0.3rem 0.3rem;
/* font-size:1.5rem; */
font-size:1.0rem;
}

table.simLeBParent{
/* width:93%; */
width:100%;
padding: 0.3rem;
border-spacing: 0.1rem 1rem;
}



th.menuClick{
font-size:1.5rem;
}

div.menu_Scroll_outer
{
/* width:93%; */
width:100%;
/* padding: 0.5rem; */
padding: 0.3rem;
}

div.menu_Scroll_head
{
/* like table.menu (incl. border-spacing) */
/* margin-top:1.5rem; */
margin-top:1.2rem;
/* margin-left:1rem; */
margin-left:0.8rem;
/* margin-right:1rem; */
margin-right:0.8rem;
/* font-size:2rem; */
font-size:1.1rem;
font-weight:bold;

/* like th.menu: */
padding: 0.25rem;
border-radius: 0.3rem;
text-shadow:0 0 0.9rem rgba(25,13,0,0.7);
border:0.1rem solid rgba(0,170,213,0.3);	/* HSV: 128/240/100 */
}

div.simLeBParent_Scroll_outer{
/* width:93%; */
width:100%;
/* padding: 0.5rem; */
padding: 0.3rem;
}

div.simLeBParent_Scroll_head{
margin-top:1rem;
margin-left:0.1rem;
margin-right:0.1rem;
/* font-size:2rem; */
font-size:1.1rem;

/* like th.menu: */
padding: 0.25rem;
border-radius: 0.3rem;
text-shadow:0 0 0.9rem rgba(25,13,0,0.7);
border:0.1rem solid rgba(0,170,213,0.3);	/* HSV: 128/240/100 */
}

table.menu_Scroll{
/* border-spacing: 1rem 1.5rem; */
border-spacing: 0.8rem 1.2rem;
}


td.info{
/* font-size: 1.5rem; */
font-size: 1rem;
}

td.infoC{
/* font-size: 1.5rem; */
font-size: 1rem;
}

td.infoR{
/* font-size: 1.5rem; */
font-size: 1rem;
}

div.tableTopLine
{
/* font-size:1.3rem; */
font-size:0.8rem;
padding:0.2rem 15%;
}


.button {
/* padding: 0.7rem 1.4rem; */
padding: 0.525rem 1.05rem;
/* text-shadow: 0 1rem 1rem #CB7, 0 -1rem 1rem #FFE, 1rem 0 1rem #FEB, -1rem 0 1rem #FEB,0 0rem 1rem #FFE; */
text-shadow: 0 0.75rem 0.75rem #CB7, 0 -0.75rem 0.75rem #FFE, 0.75rem 0 0.75rem #FEB, -0.75rem 0 0.75rem #FEB,0 0rem 0.75rem #FFE;
/* box-shadow: -0.1rem 0.15rem 0.5rem 0.2rem rgba(0,0,0,0.2), inset 0 0 0.5rem 0.05rem rgba(10,5,0,0.9), inset 0 0 0.1rem 0.05rem rgba(10,5,0,0.9), 0 0 0.2rem 0.05rem #ADA; */
box-shadow: -0.1rem 0.15rem 0.375rem 0.15rem rgba(0,0,0,0.2), inset 0 0 0.375rem 0.0375rem rgba(10,5,0,0.9), inset 0 0 0.075rem 0.0375rem rgba(10,5,0,0.9), 0 0 0.2rem 0.05rem #ADA;
/* font-size: 2rem; */
font-size: 1.5rem;
/* border-radius:0.6rem; */
border-radius:0.45rem;
}


.buttonMid {
/* padding: 0.3rem 0.7rem; */
padding: 0.225rem 0.525rem;
/* text-shadow: 0 0.5rem 0.5rem #CB7, 0 -0.5rem 0.5rem #FFE, 0.5rem 0 0.5rem #FEB, -0.5rem 0 0.5rem #FEB,0 0rem 0.5rem #FFE; */
text-shadow: 0 0.375rem 0.375rem #CB7, 0 -0.375rem 0.375rem #FFE, 0.375rem 0 0.375rem #FEB, -0.375rem 0 0.375rem #FEB,0 0rem 0.375rem #FFE;
/* font-size: 1.5rem; */
font-size: 1.125rem;
/* border-radius:0.6rem; */
border-radius:0.45rem;

}

.buttonMidMT {	/*buttonMid + Margin Top*/
/* padding: 0.3rem 0.7rem; */
padding: 0.225rem 0.525rem;
/* text-shadow: 0 0.5rem 0.5rem #CB7, 0 -0.5rem 0.5rem #FFE, 0.5rem 0 0.5rem #FEB, -0.5rem 0 0.5rem #FEB,0 0rem 0.5rem #FFE; */
text-shadow: 0 0.375rem 0.375rem #CB7, 0 -0.375rem 0.375rem #FFE, 0.375rem 0 0.375rem #FEB, -0.375rem 0 0.375rem #FEB,0 0rem 0.375rem #FFE;
/* font-size: 1.5rem; */
font-size: 1.125rem;
margin: auto;
/* margin-top:0.25rem; */
margin-top:0.20rem;
/* border-radius:0.6rem; */
border-radius:0.45rem;
}

.buttonMidFlat {
/* padding: 0.1rem 0.7rem; */
padding: 0.075rem 0.525rem;
/* text-shadow: 0 0.5rem 0.5rem #CB7, 0 -0.5rem 0.5rem #FFE, 0.5rem 0 0.5rem #FEB, -0.5rem 0 0.5rem #FEB,0 0rem 0.5rem #FFE; */
text-shadow: 0 0.375rem 0.375rem #CB7, 0 -0.375rem 0.375rem #FFE, 0.375rem 0 0.375rem #FEB, -0.375rem 0 0.375rem #FEB,0 0rem 0.375rem #FFE;
/* font-size: 1.5rem; */
font-size: 1.125rem;
/* border-radius:0.6rem; */
border-radius:0.45rem;
}


span.previewMedia
{
/* font-size:1.3rem; */
font-size:1.0rem;
}




select
{
/* font-size:2rem; */
font-size:1.1rem;
}

select.smaller
{
/* font-size:1.5rem; */
font-size:1.0rem;
}

label.check{
/* font-size:1.5rem; */
font-size:1.1rem;
/* line-height:1.4rem; */
line-height:initial;
}


a.login{
font-size:1.2rem;
padding:0 1rem;
letter-spacing:0.1rem;
}

a.footer{
font-size:1rem;
padding:0 1rem;
letter-spacing:0.1rem;
}

button.footer{
/* font-size:1.3rem; */
font-size:1rem;
padding:0 1rem;
letter-spacing:0.1rem;
}

img.overlay_image
{
/* width:80%; */
width:95%;
/* height:80%; */
height:95%;
}

div.overlay_image_info
{
/* font-size:1rem; */
font-size:0.8rem;
}

button.loginButton
{
/* margin-top:2rem; */
margin-top:1rem;
/* margin-bottom:2rem; */
margin-bottom:1rem;
}

button.welcomeButton
{
/* margin-top:2rem; */
margin-top:1rem;
/* margin-bottom:2rem; */
margin-bottom:0;
}

button.mediaAdd {
border:0.2rem dashed #AAA;
max-width:100%;
max-height:100%;
/* min-height:4rem; */
min-height:3rem;
min-width:60%;
/* font-size:2rem; */
font-size:1.5rem;
}


input.check {
/* width:1.5rem; */
width:1.0rem;
/* height:1.5rem; */
height:1.0rem;
}


.text_expl
{
/* font-size:1.5rem; */
font-size:1.0rem;
border-radius:0.6rem;
padding: 0.1rem 0.4rem;
}

.text_note
{
/* font-size:1.5rem; */
font-size:1.0rem;
border-radius:0.6rem;
padding: 0 0.25rem;
}


/* .text_note_L */
/* { */
/* font-size:2rem; */
/* font-size:1.5rem; */
/* line-height:1.5; */
/* border-radius:0.6rem; */
/* padding: 0.5rem 0.25rem; */
/* } */

.QHeadSym_q	/* Headline Question Symbol: question */
{
/* font-size:2rem; */
font-size:1rem;
}
.QHeadSym_e	/* Headline Question Symbol: explanation */
{
/* font-size:1.7rem; */
font-size:1rem;
}
.QHeadSymSmall_e	/* Headline Question Symbol: explanation */
{
/* font-size:1.35rem; */
font-size:1.0rem;
}
.QHeadSym_ca	/* Headline Question Symbol: correct answer */
{
/* font-size:1.8rem; */
font-size:1rem;
}
/* .QHeadSymSmall_ca	/* Headline Question Symbol: correct answer */ */
/* { */
/* font-size:1.35rem; */
/* font-size:1.0rem; */
/* line-height: 1em; */
/* } */
.QHeadSym_wa	/* Headline Question Symbol: wrong answer */
{
/* font-size:1.8rem; */
font-size:1rem;
}
/* .QHeadSymSmall_wa	/* Headline Question Symbol: wrong answer */ */
/* { */
/* font-size:1.35rem; */
/* font-size:1.0rem; */
/* } */

/* .QHeadSymSmall_Answered_ca	/* Headline Question Symbol: correctLY answerED */ */
/* { */
/* font-size:1.35rem; */
/* font-size:1.0rem; */
/* } */
/* .QHeadSymSmall_Answered_wa	/* Headline Question Symbol: wrongLY answerED */ */
/* { */
/* font-size:1.35rem; */
/* font-size:1.0rem; */
/* } */

/* .QIsCorrect */
/* { */
/* font-size:1.5rem; */
/* font-size:1.1rem; */
/* } */
/* .QIsWrong */
/* { */
/* font-size:1.5rem; */
/* font-size:1.1rem; */
/* } */



textarea.rev{
height:5rem;
margin:0.5rem;
/* font-size:1.3rem; */
font-size:1.0rem;
}

div.rev{
margin:0.5rem;
padding:0.25rem;
/* font-size:1.3rem; */
font-size:1.0rem;
}

textarea.small{
/* width:90%; */
width:95%;
/* font-size:1.2rem; */
font-size:1.0rem;
}

textarea.CRev_res	/* for result-symbols */
{
width:70%;
min-width:12rem;
height:3rem;
margin:0.5rem;
/* font-size:1.2rem; */
font-size:1.0rem;
}

textarea.contact{
width:95%;
height:15rem;
margin:0.5rem;
/* font-size:1.3rem; */
font-size:1.0rem;
}

span.QType
{
padding:0 0.3rem;
text-shadow:0.05rem 0.05rem 0.3rem #DEE;
border-radius:0.4rem;
/* font-size:1.5rem; */
font-size:1.0rem;
}

span.QTypeRev
{
/* margin-top:0.3rem; */
margin-top:0.2rem;
/* margin-bottom:0.3rem; */
margin-bottom:0.2rem;
/* padding:0.2rem; */
padding:0.1rem;
}

img.ContentMedia
{
/* margin-left:0.5rem; */
margin-left:0.1rem;
}

.CRev_partUser
{
font-size:1.1em;
}

img.list_logo
{
/* height:2.0rem; */
height:1.7rem;
}

.classPropsOnClassPage{
/* font-size:1.5rem; */
font-size:1.1rem;
}


.QTag
{
/* padding:0.2rem 1rem; */
padding:0.1rem 0.7rem;
/* font-size:1rem; */
font-size:0.8rem;
}

.thMenu_sub
{
/* font-size:0.5em; */
font-size:0.8rem;
}


div.fav_overlay_content
{
/* padding:2rem; */
padding:0.5rem;
}

div.fav_overlay_headline
{
/* font-size:2.5rem; */
font-size:2rem;
}


div.OLfav_inner
{
/* padding:1rem; */
/* padding-top:0.5rem; */
padding:0.5rem;
/* font-size: 2rem; */
font-size: 1.5rem;

}

table.report_info
{
/* font-size:1.5rem; */
font-size:1rem;
}

select.OLfav
{
/* font-size:1.5rem; */
font-size:1rem;
}

td.neutr{
/* font-size: 1.5rem; */
font-size: 1.0rem;
}

input.directLink
{
/* font-size: 2rem; */
font-size: 1.2rem;
/* width:15rem; */
width:10rem;

}

input.OLfav_ListProp
{
/* font-size:2rem; */
font-size:1rem;
}

input.smaller
{
/* font-size:1.5rem; */
font-size:1rem;
}

div.MobileLOO
{
display:block;
}

div.login_marketing_outer
{
/* margin:3rem 0; */
margin:1.5rem 0;
/* font-size:4rem; */
font-size:3rem;
}

img.logo_login
{
/* margin:1rem; */
margin:auto;
margin-top:1rem;

}

}



