/*
 * Verrückte Turing-Maschinen — A turing complete game
 * Copyright (C) 2016 Christian Fraß <vidofnir@folksprak.org>
 * 
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 * 
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 * 
 * You should have received a copy of the GNU General Public License
 * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */

html
	{
		margin: 0;
		/*
		height: 100%;
		 */
		
		background-color: hsl(120, 0%, 0%);
		color: hsl(120, 0%, 100%);
		
		font-family: monospace;
		line-height: 200%;
	}

body
	{
		margin: 0;
		padding: 8px;
		height: 100%;
		
		background-color: hsl(120, 0%, 6.125%);
		color: hsl(120, 0%, 93.75%);
	}

a
	{
		color: hsl(120, 50%, 50%);
		text-decoration: none;
		cursor: pointer;
	}

a:hover
	{
		color: hsl(120, 50%, 75%);
	}

li
	{
		list-style-type: "» ";
	}

body > header
	{
		font-size: 200%;
		margin: 8px;
	}

#radio_hilfe,
#radio_spiel
	{
		display: none;
	}

#radio_hilfe:checked
	{
		& ~ #hilfe {}
		& ~ #spiel {display: none;}
	}

#radio_spiel:checked
	{
		& ~ #hilfe {display: none;}
		& ~ #spiel {}
	}

#spiel
	{
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
	}

.bereich
	{
		margin: 8px;
		padding: 8px;
		
		background-color: hsl(120, 0%, 12.5%);
		color: hsl(120, 0%, 87.5%);
	}

#bereich_links
	{
		flex-basis: 19%;
		flex-grow: 1;
		flex-shrink: 1;
	}

#bereich_mitte
	{
		flex-basis: 62%;
		flex-grow: 1;
		flex-shrink: 0;
		
		min-width: 800px;
		
		text-align: center;
	}

#bereich_rechts
	{
		flex-basis: 19%;
		flex-grow: 1;
		flex-shrink: 1;
	}

#hilfe section > header
	{
		font-size: 150%;
	}

#knoepfe
	{
		& > *
			{
				margin: 2px;
			}
		
		&.initial
			{
				& > #knopf_schritt {}
				& > #knopf_testen {}
				& > #knopf_anhalten {display: none;}
				& > #knopf_bearbeiten {display: none;}
				& > #knopf_leeren {}
			}
		
		&.ungewiss_laufend
			{
				& > #knopf_schritt {display: none;}
				& > #knopf_testen {display: none;}
				& > #knopf_anhalten {}
				& > #knopf_bearbeiten {display: none;}
				& > #knopf_leeren {display: none;}
			}
		
		&.ungewiss_stehend
			{
				& > #knopf_schritt {}
				& > #knopf_testen {}
				& > #knopf_anhalten {display: none;}
				& > #knopf_bearbeiten {}
				& > #knopf_leeren {display: none;}
			}
		
		&.fertig
			{
				& > #knopf_schritt {display: none;}
				& > #knopf_testen {display: none;}
				& > #knopf_anhalten {display: none;}
				& > #knopf_bearbeiten {}
				& > #knopf_leeren {display: none;}
			}
	}

#aufgabe_status
	{
		margin-bottom: 8px;
	}

.hilfe_aktoren_aktor
	{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		
		margin-bottom: 16px;

		& > .hilfe_aktoren_aktor_name
			{
				flex-basis: 100%;
				flex-shrink: 0;
				flex-grow: 1;
				
				text-transform: capitalize;
				font-weight: bold;
			}
		
		& > .hilfe_aktoren_aktor_bild
			{
				flex-basis: 10%;
				flex-shrink: 1;
				flex-grow: 0;
			}
		
		& > .hilfe_aktoren_aktor_text
			{
				flex-basis: 90%;
				flex-shrink: 1;
				flex-grow: 1;
			}
	}