@charset "utf-8";
/* CSS-Datei für den Redaktionsbereich 12.05.2013 FD */
@font-face {
	font-family: 'Open Sans';
	src: url("../fonts/Open_Sans/OpenSans-Light.ttf");
}
html, body {
	font: 100% Helvetica, Verdana, Arial, sans-serif;
	color: #333333;
	background: white; 
	margin:0;
	padding:0;
	border:0;
	box-sizing: border-box;
}
h1, h2 { 
	color: rgba(51,122,183,1.00);
	font-style: normal;
	font-weight: normal;
}
h1 { letter-spacing: .2rem;
	margin:1.5rem 0 2.5rem 0;
}
h2 { 
	margin:2.5rem 0 1.4rem 0;
}
dl:after {
  content: '';
  display: block;
  clear: both;
}
dt {
  float: left;
  clear: left;
  padding-top: .5rem;
  margin-right: 1rem;
  font-weight: bold;
}
dd {
  padding-top: .5rem;
  margin-left: 16rem;
  color: #555;
}
code {
	font: 100% "Courier New", monospace; 
	color:rgba(136,36,0,1.00);
	background-color:none;
}
a { color: rgba(51,122,183,1.00); }

table { 
	max-width:100%;
	border-collapse: collapse;
	border-spacing: 0; /* Lücken zwischen den Zellen */
	overflow-x: auto;
}
td, th {
	padding:.5rem 1rem;
	line-height:1.8rem;
	vertical-align: top;
	border-top: 1px solid rgba(200,200,200,1);
}
th { 
	background-color: rgba(0,0,0,.02); 
	color:rgba(51,122,183,1.00);
	font-weight:bold;
	text-align:left;
	cursor:pointer; /* anklickbar wegen der Sortierfunktion in main.js */
}
tr:nth-child(odd) { background-color: rgba(0,0,0,.02); }
tr:nth-child(even) { background-color: rgba(255,255,255,1.00); }
tr:hover { background:rgba(255,247,107,.3); }
.right { text-align:right; }

/* die Bootstrap-Icons */
.bi { display:inline-block; width:1.6rem; } /* für Bootstrap-Icons */
.my-btn {
	font-size:1.1rem; 
	padding:0.4rem; margin:.2rem;
	vertical-align:middle; color:white; border-radius:.2rem;
}
.my-gfx {
	font-size:1.1rem; 
	padding:0.4rem; margin:.2rem;
	vertical-align:middle; color:black; border-radius:.2rem;
}
/* die Hintergrundfarben der Icons */
.back-blue { background:rgba(51,122,183,.9); }
.back-red { background:rgba(220,53,69,.9); }
.back-green { background:rgba(25,135,84,.9); }
.back-yellow { background:rgba(231,173,0,.9); }

.red {color:rgba(251,82,67,1.00);}
.alert.alert-danger{
	padding:.5rem;
	border: 1px solid rgb(230,140,0);
	border-radius:.2rem;
}
.alert.alert-success{
	padding:.5rem;
	border: 1px solid rgb(20,180,20);
	border-radius:5px;
}
/* -------------- Navi -------------- */
.navbar {
	position:relative;
	padding:0 0 0 0;
}
.navbar.navbar-default {
	background-color: #F8F8F8;
	border-color: #E7E7E7;
}
.navbar-default .navbar-nav > li > a{
	background-color: #F8F8F8;
	color:#666;
	text-shadow: none;
}
.navbar-right, .navbar-text, nav li { background-color: #f8f8f8; }
.navbar-default .navbar-nav > li > a:hover{
	color:#036;
}
.navbar-brand img { width:100px; height:auto; margin-top:-6px; }

table.form td{ padding:0 16px 0 0; } /* Tabellen in add.php und edit.php */
span.form-oben{ vertical-align:top; } /* Label nach oben schieben */
/* textarea { width:40em; height:4em; } */
.popover { max-width: 640px !important; }
.well-xl {margin:6px 6px 6px 0 !important; }
.well-xl td{ padding:6px !important; }

.artikeltabelle img { max-width:100px; max-height:100px; }

option[disabled] { color:#09f; }
.menuetabelle { margin:0 auto; width:auto; }
form div.center { text-align:center; }
th.rightCell, td.rightCell { text-align: right; }
.MenueEbene0 { background-color:rgba(40,96,144,.25); font-weight: bold; width:100% !important;}
.MenueEbene1 { background-color:rgba(40,96,144,.15); width:100% !important;}
.MenueEbene2 { background-color:rgba(40,96,144,.03); width:100% !important;}
.MenueEbene3 { background-color:rgba(40,96,144,.01); width:100% !important;}

/* -------------- Formulare -------------- */
.formular {
	padding:.8rem;
	background:rgba(0,0,0,.05);
	border:1px solid rgba(0,0,0,.1);
	border-radius:.2rem;
}
.formular-zeile {
	display:flex; 
	flex-flow:row; 
	margin:0 0 .5rem 0; 
	padding:.4rem; 
	background:rgba(0,0,0,.05);
	border-radius:.2rem;
}
.formular-zeile > * {
	margin:0 0 0 1rem;
}
.formular-zeile *:first-child {
	margin:0;
}
.formular-zeile label {
	margin:.5rem 0 0 1rem;
}
input {
	padding:.3rem;
	border:1px solid rgba(0,0,0,.3);
	border-radius:.2rem;
	box-shadow: inset 0 2px 2px rgba(0,0,0,.1);
}
input:focus {
	border-color: rgba(200,0,0,.4);
	background-color: rgba(240,0,0,.02);
}
input[type="number"] { /* im Input-Feld für Zahlen sollen keine Pfeile erscheinen (in menue.php) */
  -webkit-appearance: textfield;
     -moz-appearance: textfield;
          appearance: textfield;
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none;
}

/* das textarea-Feld in 'editTemplates.php' zum Editieren der Templates */
#editTemplates {
	font-family:Courier;
	color:darkgreen;
	white-space: pre-wrap;
}
/* -------------- main ------------------ */
.content { margin:0 8%; }
/* -------------- Footer ------------------ */
footer {
	clear:both;
	color:#ccc;
	background:rgba(92,92,92,1.00);
	display:flex;
	flex-flow: row wrap;
	justify-content: space-around;
	padding:0 1rem;
	margin:1rem 0 0 0;
}
footer .item-footer {
	/*flex:1 1 0%;*/
	margin:0;
	padding:1rem;
	white-space:nowrap;
}
footer ul {
	list-style: none;
	padding:0;
	margin:0;
	text-transform:uppercase;
}
footer li{ margin:0 0 0 0; }
footer.copyright {
	display:block; /* display:flex aufheben */
	border-top:1px solid grey;
	font-size:80%;
	text-align:center;
	padding:.5rem;
	margin:0;
}
footer address { font-style:normal; } /* address wird sonst kursiv dargestellt */
footer a { color:#ccc; }
footer a:hover { color:#fff; }

@media only screen and (min-width: 800px) {
	footer section { border-top:none; }
}

/* --------------- Flaggen für die Mehrsprachigkeit in artikel.php --------------- */
.flagge {
	width:3rem;
}
/* --------------- Login-Seite --------------- */
body#full-site{
	display:flex;
	flex-direction:column;
	height:100vh;
}
header {
	background: rgb(247, 247, 247);
	border-bottom: 1px solid rgba(147, 184, 189,0.8);
	margin:0;
	padding:.4rem;
	box-shadow:	
		0pt 2px 5px rgba(105, 108, 109,  0.2),	
		0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
}
header h1{
	margin:0;
	color: rgb(128,128,128);
	font-size: 1.3rem;
}
main{
	flex:1;
	aligh-item:center;
	margin:5rem;
}
button {
    color: #fff;
    background-color: rgba(51,122,183,1.00);
    border: 1px solid rgba(138,138,138,1.00);
	padding:.5rem 2rem;
	border-radius: .3rem;
}
a {text-decoration: none;}
a:hover { text-decoration:underline; }
/* --------------- Login-Formular --------------- */
.formular-login {
	margin:0 auto;
	width:36rem;
	padding:2rem;
	background: rgb(247, 247, 247);
	border: 1px solid rgba(147, 184, 189,0.8);
	box-shadow:	
		0pt 2px 5px rgba(105, 108, 109,  0.3),	
		0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
	border-radius: 5px;
}
.formular-login i { /* das Passport-Icon */
	display:block;
	float:left;
	margin:0 2rem 0 0;
    color: rgba(51,122,183,1.00);
}
.formular-login form {
	display:block;
	overflow:hidden;
	padding:0; margin:0;
}
.formular-login p {
	margin:0 0 1rem 0;
}
.formular-login hr {
	color: rgba(238, 236, 240, 0.2);
	margin:1rem 0;
}
.formular-login label { 
	display:inline-block;
	width: 30%;
}
.formular-login label.long { width:45%; }

/* all the input except submit and checkbox */
.formular-login input:not([type="checkbox"]){
	width: 50%;
	margin:0;
	padding: 0.5rem;	
	border: 1px solid rgb(178, 178, 178);
	box-sizing : content-box;
	border-radius: 3px;
	box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset;
	transition: all 0.2s linear;
}
.formular-login input:not([type="checkbox"]):active,
.formular-login input:not([type="checkbox"]):focus{
	border: 1px solid rgba(91, 90, 90, 0.7);
	background: rgba(238, 236, 240, 0.2);	
	box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.9) inset;
}