/* Seitenlayout: */

body {
    background-color: #444444;
    margin: 0px;
}

#header img {
    width:100%;
    max-height:200px;
} 

#content {
    margin-top: 20px;
    color: #dddddd;
    padding: 20px;
}

#foodcomment,#drinkscomment {
    padding:20px;
}

/* Horizontale Navigation: */

#navigation .legal {
    float:right;
}
#navigation {
    list-style-type: none;
    padding: 0;
    margin: 0;
    overflow: hidden;
    background-color: #333;
}

#navigation li {
    float: left;
    border-right:1px solid #bbb;
}

#navigation li:last-child {
    border-right: none;
}

#navigation li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

#navigation li a:hover:not(.active) {
    background-color: #222;
}

#navigation .active {
    background-color: #04AA7E;
}


/* Hier wird nun aus Aussehen der Speisen und Getränke beschrieben, wenn diese alte Cards dargestellt werden: */

.prodcard {
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3);
    transition: 0.3s;
    width: 600px;
    height: 400px;
    text-align: center;
    background-color: #666666;
    margin: 10px;
    overflow-y: auto;
}

.prodcard img {
    padding: 20px;
    min-width: 40%;
    max-width: 90%;
    height: 200px;
}
.prodcard:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.3);
}

.prodcontainer {
    padding: 2px 16px;
}

/* Hier wird nun aus Aussehen der Speisen und Getränke beschrieben, wenn diese in Tabellenform dargestellt werden: */

table.prodtable {
	font-family: verdana,arial,sans-serif;
	font-size:20px;
	color:#333333;
	border-width: 3px;
	border-color: #666666;
	border-collapse: collapse;
	width: 100%;
}
table.prodtable th {
	border-width: 4px;
	padding: 8px;
	border-style: solid;
	border-color: #666666;
	background-color: #dedede;
	font-weight:bold;
	text-align:center;
}
table.prodtable td {
	border-width: 2px;
	padding: 8px;
	border-style: solid;
	border-color: #666666;
	background-color: #ffffff;
	text-align:center;
}

table.prodtable td.rowname {
	font-weight:bold;
	text-align:left;
}