/* muli-regular - latin */
@font-face { font-family: 'Muli'; font-style: normal; font-weight: 400; src: url("../fonts/muli-v12-latin-regular.eot");
  /* IE9 Compat Modes */
src: local("Muli Regular"), local("Muli-Regular"), url("../fonts/muli-v12-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/muli-v12-latin-regular.woff2") format("woff2"), url("../fonts/muli-v12-latin-regular.woff") format("woff"), url("../fonts/muli-v12-latin-regular.ttf") format("truetype"), url("../fonts/muli-v12-latin-regular.svg#Muli") format("svg");
  /* Legacy iOS */ }
/* muli-italic - latin */
@font-face { font-family: 'Muli'; font-style: italic; font-weight: 400; src: url("../fonts/muli-v12-latin-italic.eot");
  /* IE9 Compat Modes */
src: local("Muli Italic"), local("Muli-Italic"), url("../fonts/muli-v12-latin-italic.eot?#iefix") format("embedded-opentype"), url("../fonts/muli-v12-latin-italic.woff2") format("woff2"), url("../fonts/muli-v12-latin-italic.woff") format("woff"), url("../fonts/muli-v12-latin-italic.ttf") format("truetype"), url("../fonts/muli-v12-latin-italic.svg#Muli") format("svg");
  /* Legacy iOS */ }
/* muli-700 - latin */
@font-face { font-family: 'Muli'; font-style: normal; font-weight: 700; src: url("../fonts/muli-v12-latin-700.eot");
  /* IE9 Compat Modes */
src: local("Muli Bold"), local("Muli-Bold"), url("../fonts/muli-v12-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/muli-v12-latin-700.woff2") format("woff2"), url("../fonts/muli-v12-latin-700.woff") format("woff"), url("../fonts/muli-v12-latin-700.ttf") format("truetype"), url("../fonts/muli-v12-latin-700.svg#Muli") format("svg");
  /* Legacy iOS */ }
/* muli-700italic - latin */
@font-face { font-family: 'Muli'; font-style: italic; font-weight: 700; src: url("../fonts/muli-v12-latin-700italic.eot");
  /* IE9 Compat Modes */
src: local("Muli Bold Italic"), local("Muli-BoldItalic"), url("../fonts/muli-v12-latin-700italic.eot?#iefix") format("embedded-opentype"), url("../fonts/muli-v12-latin-700italic.woff2") format("woff2"), url("../fonts/muli-v12-latin-700italic.woff") format("woff"), url("../fonts/muli-v12-latin-700italic.ttf") format("truetype"), url("../fonts/muli-v12-latin-700italic.svg#Muli") format("svg");
  /* Legacy iOS */ }
.md body { font-family: "Muli", Muli, sans-serif; background-color: #FFF; }
.md .bold { font-weight: bold; }
.md .button { background-color: #FFF; border: 1px solid #6B8E23; }
.md .button.color-gray { border: 1px solid #8E8E93; }
.md .button .f7-icons { position: absolute; left: 1px; top: 1px; }
.md .button .f7-icons.icon-right { right: 3px; left: auto; }
.md .button.button-big .f7-icons { font-size: 43px; line-height: 43px; }
.md .button.button-fill { background-color: #6B8E23; }
.md .block-strong { background-color: rgba(255, 255, 255, 0.7); }
.md .block-no-top-margin { margin-top: 0; }
.md .statusbar-overlay { background: #6B8E23; }
.md .navbar ~ .page-content { padding-top: 50px; }
.md .page-content { background: transparent url("../img/bg.jpg") no-repeat; background-position: top center; background-size: cover; }
.md .page-content.page-none-bg { background: #FFF; }
.md .small-text { font-size: 0.85em; }
.md .svg-container { display: none; }
.md h2 { color: #999; }
.md .list { font-size: 16px; margin: 0; }
.md .list ul { background: rgba(255, 255, 255, 0.5); }
.md .list .item-title.label { width: 38%; text-align: left; }
.md .list .item-input { width: 62%; text-align: right; }
.md .list .item-content { min-height: 42px; }
.md .list .item-content .item-inner { min-height: 42px; padding-top: 3px; padding-bottom: 3px; }
.md .list ul::before { height: 0; }
.md .progressbar { height: 4px; background: rgba(107, 142, 35, 0.5); }
.md .inprogress { margin-top: 0; }
.md .inprogress-text { text-align: center; }
.md .navbar { height: 50px; }
.md .navbar::after { background: none; }

.app-logo { position: relative; z-index: 1; padding-top: 10px; }
.app-logo > * { color: #FFF; position: relative; z-index: 1; text-align: center; font-weight: 100; }
.app-logo h1 { margin-bottom: 10px; }
.app-logo .svg-color { fill: #FFF; }
.app-logo::after { content: ''; position: absolute; z-index: 0; top: 0; width: 100%; left: 0; height: 140px; opacity: 0.5; background-color: #6B8E23; }
.app-logo::before { content: ''; position: absolute; z-index: 1; bottom: 0; width: 50px; border-radius: 50%; left: 50%; margin-left: -25px; height: 50px; background-color: #6B8E23; box-shadow: 0 -3px 8px rgba(255, 255, 255, 0.7); }

.link-back, .back { height: 44px; width: 44px; text-align: center; }
.link-back i, .back i { margin-left: 12px; }

.left { margin-right: 0; }

.center { left: 50%; top: 4px; position: absolute; }
.center svg { fill: #FFF; margin-left: -20px; }

.icon.icon-home { width: 30px; height: 30px; background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjUwIiB2aWV3Qm94PSIwIDAgNDkgNTAiIHdpZHRoPSI0OSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtIC4wNjc0OTY0NyA0NmgxOC4wMDAwMDAwM3YtMTdoMTB2MTdoMTh2LTIyLjVsLTIzLTIzLTIzLjAwMDAwMDAzIDIzeiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIgMikiLz48L3N2Zz4=); }

.icon.icon-menu { width: 22px; height: 30px; background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjUwIiB2aWV3Qm94PSIwIDAgNDIgNTAiIHdpZHRoPSI0MiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMTMpIj48cGF0aCBkPSJtMCAwaDQydjJoLTQyeiIvPjxwYXRoIGQ9Im0wIDExaDQydjJoLTQyeiIvPjxwYXRoIGQ9Im0wIDIyaDQydjJoLTQyeiIvPjwvZz48L3N2Zz4=); }

.auswertung a { color: #8E8E93; }
.auswertung .page-content svg { width: 30px; height: auto; }
.auswertung .yellow path { fill: #FC0; }
.auswertung .orange path { fill: #FF9500; }
.auswertung .black path { fill: #000; }
.auswertung .blue path { fill: #007AFF; }
.auswertung .theme path { fill: #6B8E23; }

.rounded { transition: background-color linear 0.2s; margin-top: 5px; border-radius: 50%; width: 30px; height: 30px; line-height: 30px; display: inline-block; position: relative; cursor: pointer; }
.rounded.green { background-color: #080; }
.rounded.greenlight { background-color: #80aa00; }
.rounded.yellow { background-color: #FC0; }
.rounded.orange { background-color: #ff6600; }
.rounded.red { background-color: #F00; }
.rounded svg { position: absolute; left: 2px; top: 2px; width: 27px; height: 27px; }
.rounded svg path { transition: fill linear 0.2s; fill: #FFF; }

input[type="radio"]:checked + label { background-color: #FFF; }
input[type="radio"]:checked + label svg path { fill: #000 !important; }

input[type="text"] { width: 100%; height: 43px; border-bottom: 1px solid #8E8E93; }

.c3 svg { -webkit-tap-highlight-color: transparent; }
.c3 path, .c3 line { fill: none; stroke: #6B8E23; }
.c3 text { -webkit-user-select: none; -moz-user-select: none; user-select: none; fill: #6B8E23; }

.c3-legend-item-tile, .c3-xgrid-focus, .c3-ygrid, .c3-event-rect, .c3-bars path { shape-rendering: crispEdges; }

.c3-chart-arc path { stroke: #FFF; }

.c3-chart-arc text { fill: #FFF; font-size: 13px; }

/*-- Axis --*/
/*-- Grid --*/
.c3-grid line { stroke: #EEE; }

.c3-grid text { fill: #AAA; }

.c3-xgrid, .c3-ygrid { stroke-dasharray: 1 1; }

/*-- Text on Chart --*/
.c3-text.c3-empty { fill: #808080; font-size: 2em; }

/*-- Line --*/
.c3-line { stroke-width: 1px; }

/*-- Point --*/
.c3-circle._expanded_ { stroke-width: 1px; stroke: #FFF; }

.c3-selected-circle { fill: #FFF; stroke-width: 2px; }

/*-- Bar --*/
.c3-bar { stroke-width: 0; }

.c3-bar._expanded_ { fill-opacity: 0.75; }

/*-- Focus --*/
.c3-target.c3-focused { opacity: 1; }

.c3-target.c3-focused path.c3-line, .c3-target.c3-focused path.c3-step { stroke-width: 2px; }

.c3-target.c3-defocused { opacity: 0.3 !important; }

/*-- Region --*/
.c3-region { fill: steelblue; fill-opacity: 0.1; }

/*-- Brush --*/
.c3-brush .extent { fill-opacity: 0.1; }

/*-- Select - Drag --*/
/*-- Legend --*/
.c3-legend-item { font-size: 12px; }

.c3-legend-item-hidden { opacity: 0.15; }

.c3-legend-background { opacity: 0.75; fill: #FFF; stroke: lightgray; stroke-width: 1; }

/*-- Title --*/
.c3-title { font: 14px sans-serif; }

/*-- Tooltip --*/
.c3-tooltip-container { z-index: 10; }

.c3-tooltip { border-collapse: collapse; border-spacing: 0; background-color: #FFF; empty-cells: show; -webkit-box-shadow: 7px 7px 12px -9px #777777; -moz-box-shadow: 7px 7px 12px -9px #777777; box-shadow: 7px 7px 12px -9px #777777; opacity: 0.9; }

.c3-tooltip tr { border: 1px solid #CCC; }

.c3-tooltip th { background-color: #aaa; font-size: 14px; padding: 2px 5px; text-align: left; color: #FFF; }

.c3-tooltip td { font-size: 13px; padding: 3px 6px; background-color: #FFF; border-left: 1px dotted #999; }

.c3-tooltip td > span { display: inline-block; width: 10px; height: 10px; margin-right: 6px; }

.c3-tooltip td.value { text-align: right; }

/*-- Area --*/
.c3-area { stroke-width: 0; opacity: 0.2; }

/*-- Arc --*/
.c3-chart-arcs-title { font-size: 1.3em; }

.c3-chart-arcs .c3-chart-arcs-background { fill: #E0E0E0; stroke: none; }

.c3-chart-arcs .c3-chart-arcs-gauge-unit { fill: #000; font-size: 16px; }

.c3-chart-arcs .c3-chart-arcs-gauge-max { fill: #777; }

.c3-chart-arcs .c3-chart-arcs-gauge-min { fill: #777; }

.c3-chart-arc .c3-gauge-value { fill: #000; }

.c3-chart-arc.c3-target g path { opacity: 1; }

.c3-chart-arc.c3-target.c3-focused g path { opacity: 1; }

.c3-axis-y .tick, .c3-axis-y2 .tick { opacity: 0 !important; }

.c3-axis-x .tick line { stroke: transparent; }
.c3-axis-x .tick text { display: block !important; }

.detail .x-axel { margin-left: 55px; margin-right: 5px; }
.detail .x-axel.first { margin-top: 15px; }
.detail .x-axel.second { margin-top: -15px; }
.detail .x-axel .col-20 { width: 20% !important; }
.detail .x-axel .rounded { margin: 0 auto; display: block; cursor: auto; }
.detail .button-bewertung { margin-top: 15px; }
.detail .detail-headline { border-bottom: 1px solid #CCC; margin: 0 15px; text-transform: uppercase; }

#timer-picker-date { text-align: center; font-weight: 700; font-size: 1.5rem; width: 90%; float: right; }

.icon-alarm { margin-top: 15px; }

.debug { border: 1px solid #F00; }

.no-margin-bottom { margin-bottom: 0 !important; }

/* Smartphones (portrait) ----------- */
@media only screen and (max-width: 320px) { .md .button.button-big { height: 32px; line-height: 32px; }
  .md .button.button-big .f7-icons { font-size: 27px; line-height: 27px; }
  .md .inprogress { margin: 24px 0; padding: 8px 16px; } }