/* style.css (c) 2015: Projektgruppe Pascal Faller, Björn Karp, Dennis Honsel, Milka Mitrovic */
/* etwas aufgehübscht, vereinheitlicht und (zusammen mit HTML) vereinfacht (c)Jürgen Wemheuer */

/* ---------- Diese Styles gelten auf allen Geräten: --------------- */
body			{background:#ddd; margin:0px; font-family:Arial,Helvetica,Sans-Serif; font-size:.95em;}
body.login		{margin:0px auto; text-align:center;}
div#navigation	{position:fixed; width:100%; top:0px; background:rgb(255,175,15); padding:2px;}
a	{text-decoration:none;}
h2	{margin:0px;}

/* --- dynamisch per Javascript drübergeladene Elemente --- */
div#content	{margin:5px;}
div#laden, div#popup	{position:fixed; top:0px; left:0px; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:98; display:none;}
div#ladetext	{position:absolute; top:50%; left:50%; width:400px; height:18px; margin-top:-10px; margin-left:-200px; color:white;
				 font-size:1.5em; text-align:center;}
div#popuptext	{position:absolute; top:50%; left:50%; width:400px; height:155px; margin-top:-77px; margin-left:-200px; color:black;
				 background:white; border-radius:9px; padding:10px; border:orange solid; text-align:center;}
div#popup input	{width:120px;}
div#dropdown	{background:#999; padding:1px 2px;}

/* --- Formulare und Formularelemente --- */
img.logo		{height:200px; width:200px;}
form.login		{position:absolute; top:340px; left:50%; height:350px; width:266px; margin-left:-143px;
				 background-color:rgb(255,175,15); padding:10px; border-radius:12px; text-align:left;}
form.login h1		{padding:0px; margin:0px; text-align:center;}
form.login button	{margin-top:14px;}

fieldset	{margin:20px 0px;}
legend		{font-weight:bold; color:#0044cc;}
label		{display:inline-block; width:150px;}
input[type="text"], input[type="email"], input[type="password"]	{width:260px;}
select		{width:266px;}
button[type="submit"]	{margin-left:-1px; width:268px;}

input#datei {position:fixed; top:100%; left:100%; margin-top:-25px; margin-left:-240px; border:1px dotted green;}

/* --- die Tabs im Dateimanager: --- */
span.filetab {background-color:#FFF; color:#226CE3; display:inline-block; padding:5px; border-radius:10px 10px 0px 0px; margin:0px 0px 0px 4px; cursor:pointer;}
span.first	{margin: 0px;}
span.filetab:hover {background-color:#DBE6FF; color:#000;}
span.tabselected	{background-color:#226CE3; color:#FFF;}

/* --- Darstellung aller Tabellen (Dateimanager, Verwaltung) --- */
table	{border-collapse:separate; border-spacing:0px 1px;}
thead	{margin:0px; padding:0px;}
tbody {background-color:#FFFFFF; margin:0px; min-width:400px;}
tbody td,th {padding:4px 10px;}
tbody td	{cursor:pointer;}
tbody tr.zurueck	{background-color:#DDEEFF; font-style:italic; font-size:90%;}
tbody tr:hover {background-color:#DBE6FF;}
tbody th {background-color:#226CE3; color:white; cursor:default;}

/* --- Styles für Monitor/RasPi-Infos --- */
div.monitormenu	{position:fixed; width:100%; top:42px; background:rgb(255,190,19); margin:-5px; padding:2px; text-align:center;}
div.monitorpage	{margin-top:68px;}
div.cm	{display:inline-block; vertical-align:top; border:1px solid #ccc; padding:2px; margin-right:8px;}
.cm td, .cm th	{border:1px solid black; padding:2px; min-width:160px;}

/* ------ Dieses Design wird nur auf Bildschirmen mit einer Breite von mindestens 600px angewendet ------ */
@media (min-width: 600px)
{
div#navigation {text-align:center; min-height:34px;}
div#navigation button {padding:5px; margin:0px;}
div#content	{margin-top:44px;}

div.teil1	{display:inline-block; width:440px; float:left;}
div.teil2	{display:inline-block; padding-left:12px;}

li#navi {display:inline-block;}

.filesize {text-align:right;}

input#datei {display:none;}
div#downloadlink {margin-top:20px;}	/* kommt wohl nur als Kommentar in fetch.php vor */
}

/* ------ Dieses Design wird nur auf Bildschirmen mit einer Breite kleiner als 600px angewendet ------ */
@media (max-width: 600px)
{
div#content	{margin-top:26px;}

.filesize {display:none;}
}