:root {
  --text: #666;
  --hintergrund: #414FBA;
  --datum: #c32e04;
  --linkfarbe: #09c;
  --listelem: #BAD2EB;
  --listelemhv: #FFF;
}


body 	{ background:var(--hintergrund); color:var(--text); padding:8px;
	font-size:14pt; font-family:verdana, sans-serif; }


input { font-size: 16pt; }

#ergebnis {
	width: 354px;
	background: var(--listelemhv);
	position: relative;
	border-radius: 5px;
	padding: 5px;
}
#refbutton { background: none; margin: 0 5px 0 0 ; padding: 0; 
		border-style: none; position: relative; top: 14px;}
#refbutton svg { width: 38px; height: 38px; color: white; }		
		
#callnum {
	width: 220px;
}
#nbst { width: 30px; }

button { background: none; margin: 0; padding: 0; 
		border-style: none; }
		
button.edinum { font-size: 14pt; color:var(--text); }	
button.edinum:hover { color:var(--linkfarbe); }
		
#callbutton { position: relative; top: 19px;}

#callbutton img {
	width: 50px;
	height: 50px;
}


button.call img { width: 25px; height: 25px; position: relative; top: 5px; }

#callbute { background: none; margin: 0; padding: 0; 
		border-style: none; position: absolute; top: -20px; right: -20px; }

#callbute img { width: 80px; height: 80px; }

.debug {font-size: 60%; }

@media (min-width:800px) {
	#ergebnis { position: fixed; left:400px; top:100px; }
	body { font-size: 12pt; }
}


ul { margin: 0; padding: 0; }
#liste {
	width: 370px;
	list-style: none;
}
#liste li { background:var(--listelem); margin: 5px; border-radius: 5px; padding: 0; }
#liste li:hover { background:var(--listelemhv); }

#liste div { display: inline-block;  }
#liste div.zeit { width: 40px; font-size: 70%; vertical-align: top; padding: 2px 10px 0 0;  text-align: right; }
#liste div.mitte {
	width: 266px;
	vertical-align: top;
	line-height: 15px;
	padding-top: 4px;
}
#liste div.symbole { width: 40px; position: relative; }
#liste div.symbole img { position: relative; top: 2px;}

.klein { font-size:70% }
#liste li.datum { color:white; background:var(--hintergrund); font-weight:bold; padding-top: 10px;}

#liste div.mittig { padding-top: 5px; }




/* Call: Zeile oben im Menue */
#callform { display:inline; font-size:70%; margin-left:50px; }
img.ico { width:24px; height:24px; border:none;}


#gespraeche { margin: 8px 0 10px 24px; list-style: none; }
#gespraeche li { font-size: 70%; position: relative; height: 16px; }
#gespraeche li .tag { display: inline-block; }
#gespraeche li .zeit { display: inline-block; position: absolute; left: 130px; }
#gespraeche li .dauer { display: inline-block; position: absolute; left: 165px; 
				width: 40px; text-align: right; }
				
	
#editnumberform div.num {font-size: 16pt; margin-bottom: 10px; }
#editnumberform input { width: 300px; font-size: 14pt; color:var(--text); }
#editnumberform textarea { width: 300px; height: 200px; }