:root {
  color-scheme: light dark;
}

body {
	font-family: sans-serif;
	background-color: light-dark(rgb(240,240,240), rgb(10,10,10,));
	color: light-dark(rgb(50,50,50), rgb(230,230,230));
	text-align: center
}

h1,h2,h3 {
	color: rgb(4, 129, 210);
	font-weight: 300;
}

h1 {
	margin-top: 3rem;
	font-size: 2.5rem;
}

h2 {
	margin-top: 1rem;
	font-size: 1.8rem;
}

h3 {
	margin-top: 0.5rem;
	font-size: 1.5rem;
}

a {
	text-decoration: none;
	color: rgb(4, 129, 210);
}

a:hover {
	text-decoration: none;
}

p.appIcon {
	font-size: 8rem;
	margin: 0;
}
p.teaser {
	font-style: italic;
	font-size: 1.5rem;
}
div.content {
	width: 80%;
	max-width: 30rem;
	margin: auto;
}
p.text-bubble,
p.text-bubble {
	font-size: 1.5rem;
	width: 50%;
	max-width: 400px;
	text-align: right;
	margin: auto;
	margin-top: 1rem;
	border: 1px solid light-dark(rgb(200,200,200), rgb(75,75,75));
	border-radius: 1rem;
	padding: 1rem;
	background-color: light-dark(rgb(255,255,255), rgb(50,50,50));
	box-shadow: light-dark(rgba(0,0,0,0.1), rgba(0,0,0,0.5)) 0rem 0.25rem 0.5rem;  
}
p.text-bubble.right {
	margin-right: 1rem;
}
p.text-bubble.left {
	margin-left: 1rem;
}
span.emoji {
	position: relative;
}
span.emoji span.tool-tip {
	display: none;
}
span.emoji span.tool-tip.visible,
span.emoji:hover span.tool-tip {
	display: inline-block;
	position: absolute;
	border: 1px solid light-dark(rgb(200,200,200), rgb(75,75,75));
	border-radius: 10rem;
	padding: 0.5rem;
	font-size: 5rem;	
	background-color: light-dark(rgb(255,255,255), rgb(50,50,50));
	box-shadow: light-dark(rgba(0,0,0,0.1), rgba(0,0,0,0.5)) 0rem 0.25rem 0.75rem;  
}
span.mouse {
	display: inline-block;
	position: absolute;
	font-size: 2rem;
	transform: rotate(-135deg);
	left: 1rem;
	top: -0rem;
	outline: black;
	color: light-dark(rgb(100, 100, 100), rgb(200,200,200));
	//box-shadow: rgba(0,0,0,0.1) 0rem 0.25rem 0.75rem;  
}
hr {
	margin: 2rem 0rem 1rem 0rem;
	border-left: none;
	border-right: none;
	border-top: none;
	border-bottom: 1px solid light-dark(rgb(200,200,200), rgb(50,50,50));	
}

footer {
	color: light-dark(rgb(200,200,200), rgb(50,50,50));
}

.clear {
	clear: both;
}