@charset 'utf-8';
@import url(reset.css);

@font-face {
font-family: 'Roboto Slab';
src: url('../fonts/robotoslab-light.woff') format('woff'),
     url('../fonts/robotoslab-light.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'Roboto Slab';
src: url('../fonts/robotoslab-bold.woff') format('woff'),
     url('../fonts/robotoslab-bold.ttf') format('truetype');
font-weight: bold;
font-style: normal;
}

body {
font-family: 'Roboto Slab';
font-size: 10pt;
line-height: 14pt;
}

header,
footer,
section.loginfo,
nav {
display: none;
}

article p {
margin: 0 0 7pt 0;
}

article h3 {
font-size: 14pt;
line-height: 18pt;
font-weight: bold;
margin: 0 0 7pt 0;
}

article h4 {
font-size: 12pt;
line-height: 16pt;
font-weight: bold;
margin: 7pt 0 7pt 0;
}

article.tagesliste div.klasse {
display: inline-block;
vertical-align: top;
width: 33%;
width: calc(100% / 3.1);
padding-right: 16pt;
box-sizing: border-box;
}

article hr {
background: black;
border: none;
height: 1pt;
margin: 16pt 0;
}

/* Monatsplan */
@media only screen {
  body.monatsplan {
  padding: 1cm;
  }
}

body.rechnung {
padding: 1cm;
}


body.monatsplan,
article.abbestellung {
font-size: 8.5pt;
line-height: 12pt;
}

.monatsplan a {
color: black;
}

.monatsplan header,
.monatsplan footer {
display: block;
padding: 0;
}

.monatsplan header,
.monatsplan article {
width: 100%;
margin: 0;
}

.monatsplan header img {
float: right;
height: 80pt;
}

.monatsplan header h2 {
padding: 20pt 0 0 0;
font-weight: bold;
}

article.tagesliste h2 {
font-size: 13pt;
line-height: 20pt;
padding: 20pt 0 5pt 0;
margin: 0 0 10pt 0;
font-weight: bold;
border-bottom: 1pt solid black;
}

article.tagesliste ul.dreier li {
margin: 0 0 10pt 0;
}

.monatsplan footer h2 {
padding: 8pt 0 0 0;
font-weight: bold;
}

.monatsplan footer ul {
padding: 12pt 0 0 0;
}

.monatsplan footer ul li {
display: inline-block;
vertical-align: top;
margin: 0 16pt 0 0;
}

.monatsplan article h1 {
font-weight: bold;
font-size: 16pt;
line-height: 20pt;
padding: 20pt 0 20pt 0;
}

.monatsplan.rechnung article h1 {
font-size: 12pt;
}

.monatsplan article h3 {
font-weight: bold;
font-size: 8.5pt;
line-height: 12pt;
margin: 0;
}

.monatsplan article > ul > li,
.abbestellung form > div,
.abbestellung form > fieldset {
display: inline-block;
vertical-align: top;
box-sizing: border-box;
width: 16%;
width: calc(20% - 8pt);
margin: 0 8pt 8pt 0;
padding: 8pt 0 0 0;
border-top: 1pt solid black;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}


.monatsplan article li.auswahl ul.a > li:first-child:before {
content: 'A. ';
font-weight: bold;
}

.monatsplan article li.auswahl ul.b > li:first-child:before {
content: 'B. ';
font-weight: bold;
}

.monatsplan article li.tagesmenu.weekday2:first-of-type {
margin-left: calc(100% / 5);
}
.monatsplan article li.tagesmenu.weekday3:first-of-type {
margin-left: calc(100% / 5 * 2);
}
.monatsplan article li.tagesmenu.weekday4:first-of-type {
margin-left: calc(100% / 5 * 3);
}
.monatsplan article li.tagesmenu.weekday5:first-of-type {
margin-left: calc(100% / 5 * 4);
}

.monatsplan article table {
margin: 0 0 8pt 0;
line-height: 16pt;
}

.monatsplan article tr.summe {
border-top: 1pt solid black;
}

.monatsplan article td {
padding: 0 32pt 0 0;
}

.monatsplan article td + td {
text-align: right;
padding: 0;
}

.monatsplan footer {
padding: 8pt 8pt 0 0;
border-top: 1pt solid black;
}

.monatsplan footer p {
font-size: 7pt;
line-height: 10pt;
}

.monatsplan footer p sup {
font-size: 5pt;
position: relative;
top: -3pt;
}

.dreier {
column-count: 3;
-webkit-column-count: 3;
-moz-column-count: 3;
column-gap: 8pt;
-webkit-column-gap: 8pt;
-moz-column-gap: 8pt;
}

.dreier li {
-webkit-column-break-inside: avoid;
-moz-column-break-inside: avoid;
-moz-page-break-inside: avoid;
page-break-inside: avoid;
column-break-inside: avoid;
}