@charset "UTF-8";
/*!
 * Theme Name: KML - DIGITALE JAHRESAUSTELLUNG V1.0
 * Theme URI: http://www.modularte.de/
 * Description: MODULARTE Skeleton v2.0.0 is a HTML Skeleton developed by MODULARTE for KML.
 *
 * Author: MODULARTE
 * Author URI: http://www.modularte.de/
 *
 * Copyright: © 2018 MODULARTE
 * License: GNU General Public License v3.0
 * License URI: http://www.gnu.org/licenses/gpl-3.0.html
 *
 * Version: 2.1.0
 * Last update: 15.03.2018
*/
/* ---------------------------------------------------
 *  LIBRARIES
 * --------------------------------------------------- */
/*
 * Eric Meyer's reset v2.0
 *
 * The goal of a reset stylesheet is to reduce browser inconsistencies in things
 * like default line heights, margins and font sizes of headings, etc.
 */
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* ---------------------------------------------------
 *  GLOBALS
 * --------------------------------------------------- */
/*
 * Defaults
 *
 * Defined styles that are used virtually every project and are therefor marked
 * as default styles.
 */
/*
 * Project Defaults
 */
/*
 * Mixins
 *
 * Set mixins intended for use in seperate elements with different, changing
 * factors.
 */
/*
 * Mixin for automatic rem font-sizes with px fallback
 *
 * Usage: @include font-size( $size );
 */
/*
 * Mixin for font-family
 *
 * Usage: @include font-family( $family, $weight, $style );
 */
/*
 * Mixin for input placeholder styles
 *
 * Usage: @include input-placeholder { color: $color; }
 */
/*
 * Mixin for vertical alignment of elements
 *
 * Usage: @include vertical-align;
 */
/*
 * Mixin for retina background images
 *
 * Usage: @include retina { background-image: ...; }
 */
/*
 * Mixin for grid
 *
 * Usage: @include container( 20px, 12, 1400px );
 */
/*
 * Mixin for CSS Grid
 *
 * Usage: @include css-grid( 20px, 12, 1400px );
 */
/*
 * Template for clearfixes
 *
 * Usage: @extend %clearfix;
 */
/*
 * Default styles
 */
* {
  box-sizing: border-box;
}

input,
select {
  border-radius: 0;
  outline: none;
}

html,
body {
  font-size: 16px;
  font-family: sans-serif;
  font-weight: "normal";
  font-style: "normal";
}

/*
 * Variables
 *
 * Variables intended for use in seperate elements while staying flexible.
 */
/* ---------------------------------------------------
 *  MODULES
 * --------------------------------------------------- */
.tml {
  margin: 0;
}
@media screen and (max-width: 700px) {
  .tml {
    margin-top: 30px;
  }
}

.tml input[type=submit] {
  border: none;
}

.tml .message {
  font-size: 12px;
  line-height: 1.4;
  border: none;
  background: #ffff69;
}

.tml .error {
  font-size: 12px;
  line-height: 1.4;
  color: white;
  border: none;
  background: #cc4240;
}

input  {
  min-height: 50px;
  border: 1px solid #333333;
}

/* ACF FIELDS */
body .acf-fields > .acf-tab-wrap {
  background: transparent;
}

.acf-fields > .acf-field[data-width="50"]:nth-child(2) {
  border-top: 0;
}

#logout {
  margin-top: 50px;
}
#logout a {
  color: inherit;
}
#logout a:hover {
  text-decoration: none;
}

@media screen and (max-width: 700px) {
  .acf-fields {
    margin-top: 30px;
  }
}
.acf-fields input {
  border: 1px solid #cccccc;
}
.acf-fields input[type=file] {
  border: none;
}

.acf-field .acf-label label,
.acf-field p.description,
.acf-field .acf-input {
  font-size: 14px;
  line-height: 1.4;
}

.acf-field .acf-input {
  font-style: italic;
}

.acf-field p.description {
  font-style: italic;
}

@media screen and (max-width: 700px) {
  .acf-fields > .acf-tab-wrap .acf-tab-group {
    padding: 0;
  }
}

body input:matches([type=button], [type=submit], [type=reset]) {
  margin: 25px 0 25px 0;
}

body.page-id-2 input:matches([type=button], [type=submit], [type=reset]) {
  margin: 25px 0 25px 12px !important;
}

input[type=submit],
input[type=reset],
input[type=button] {
  font-size: 14px;
  height: 35px;
  margin: 25px 0 25px 12px;
  padding: 0 20px;
  cursor: pointer;
  color: #ffffff;
  border: none;
  border-color: #000000;
  background-color: #000000;
}
input[type=submit]:hover,
input[type=reset]:hover,
input[type=button]:hover {
  background: #88888a;
}

.acf-fields > .acf-tab-wrap .acf-tab-group {
  border-top: none !important;
}

.message {
  line-height: 1.4;
  display: block;
  margin-top: -17px;
  padding-left: 25px;
}

#loginform label {
  line-height: 1.2;
}

#message {
  margin-bottom: 20px;
  padding: 20px 20px;
  color: white;
  background: #56a76d;
}

.message {
  line-height: 1.4;
  display: block;
  margin-top: -17px;
  padding-left: 25px;
}

#loginform label {
  line-height: 1.2;
}

#message {
  margin-bottom: 20px;
  padding: 20px 20px;
  color: white;
  background: #56a76d;
}

.tml-message,
.tml-error {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  margin-bottom: 30px !important;
  color: white;
  border: none !important;
  background: #dc3232;
  box-shadow: none !important;
}
.tml-message strong,
.tml-error strong {
  font-family: "averta-semibold";
}

.tml {
  max-width: 320px;
}
.tml * {
  box-sizing: border-box;
}

.tml .error,
.tml .message {
  padding: 0.5em;
  color: #333333;
}

.tml .error {
  border: 1px solid #cc0000;
  background-color: #ffebe8;
}

.tml .message {
  border: 1px solid #e6db55;
  background-color: #ffffe0;
}

.tml p {
  margin: 0 0 1.5em 0;
  padding: 0;
}

.tml label {
  display: block;
  text-align: left;
}

.tml .tml-rememberme-wrap label {
  display: inline;
}

.tml input,
.tml textarea {
  font-size: 14px;
  width: 100%;
  height: 35px;
  margin: 0.5em 0;
  padding: 10px;
  border: #ccd0d4 solid 1px;
}

input.tml-checkbox {
  border: none;
}

.tml input[type=checkbox],
.tml input[type=radio],
.tml .tml-rememberme-wrap input {
  width: auto;
  margin-right: 10px;
  vertical-align: middle;
}

.tml input[type=submit],
button.tml-button {
  font-size: 14px;
  height: 35px;
  padding: 0 20px;
  cursor: pointer;
  color: #ffffff;
  border: none;
  background-color: #000000;
}
.tml input[type=submit]:hover,
button.tml-button:hover {
  background: #88888a;
}

.tml-links {
  line-height: 1.6;
}

.tml .tml-rememberme-submit-wrap:after,
.tml .tml-action-links:after {
  clear: both;
}

.tml .tml-user-avatar {
  text-align: left;
}

.mu_register .hint {
  font-size: 12px;
  display: block;
  margin-bottom: 10px;
}

.mu_register label.checkbox {
  display: inline;
}

#pass-strength-result {
  font-family: "averta-semibold";
  font-size: 14px;
  font-weight: 600;
  width: 100%;
  margin: 0;
  padding: 0;
  text-align: left;
  opacity: 0;
  color: #23282d;
  border: none;
  background: none;
}

#pass-strength-result.short {
  margin: 0;
  padding: 0;
  opacity: 1;
  color: #e35b5b;
  background: none;
}

#pass1.short,
#pass1-text.short {
  color: #e35b5b;
}

#pass-strength-result.bad {
  margin: 0;
  padding: 0;
  opacity: 1;
  color: #f78b53;
  background: none;
}

#pass1.bad,
#pass1-text.bad {
  color: #f78b53;
}

#pass-strength-result.good {
  margin: 0;
  padding: 0;
  opacity: 1;
  color: #ffc733;
  background: none;
}

#pass1.good,
#pass1-text.good {
  color: #ffc733;
}

#pass-strength-result.strong {
  margin: 0;
  padding: 0;
  opacity: 1;
  color: #83c373;
  background: none;
}

#pass1.strong,
#pass1-text.strong {
  color: #83c373;
}

.indicator-hint {
  font-size: 14px;
  line-height: 1.4;
}

.tml .password-input-wrapper {
  display: table;
  width: 100%;
}

.tml .input.password-input {
  display: table-cell;
  margin: 0;
}

.tml .pw-weak {
  display: none;
  margin-bottom: 1.5em;
}

.tml .wp-hide-pw {
  display: table-cell;
  margin: 0;
  padding: 0 0.5em;
  cursor: pointer;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

#pass1,
#pass1-text {
  width: 100%;
}

#pass1-text,
.show-password #pass1 {
  display: none;
}

.show-password #pass1-text {
  display: inline-block;
}

a {
  color: inherit;
}
a:hover {
  text-decoration: none;
}

strong {
  font-weight: bold;
}

.ma_wrapper {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  display: grid;
  max-width: 1100px;
  margin: 40px auto 56px;
  color: #333333;
  grid-auto-flow: row;
  /* grid-template-rows: 200px 1fr 100px; */
  grid-template-columns: 33.333% 66.666%;
}
@media screen and (max-width: 700px) {
  .ma_wrapper {
    max-width: 400px;
    padding: 15px 10px 0;
    grid-template-columns: 100%;
  }
}

aside {
  padding-right: 50px;
  grid-column-start: 1;
  grid-column-end: 2;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-row-start: 1;
  grid-row-end: 2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
}
@media screen and (max-width: 700px) {
  aside {
    padding-right: 0;
  }
}

.main {
  grid-column-start: 2;
  grid-column-end: 4;
  -ms-grid-column: 2;
  -ms-grid-column-span: 2;
  grid-row-start: 1;
  grid-row-end: 2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
}

.ma_logo img {
  height: 200px;
}

.ma_subtitle {
  line-height: 1.2;
  display: block;
  margin-top: 20px;
}

.ma_intro,
.main {
  font-size: 14px;
  line-height: 1.4;
  display: block;
  margin-top: 50px;
}
.ma_intro h1,
.main h1 {
  font-size: 16px;
  font-weight: bold;
}
.ma_intro h2,
.main h2 {
  font-weight: bold;
  margin-top: 25px;
}
.ma_intro h3,
.main h3 {
  font-weight: bold;
  margin-top: 15px;
}
.ma_intro h4,
.main h4 {
  font-weight: bold;
  margin-top: 1em;
}
.ma_intro p,
.main p {
  margin-top: 1em;
}
.ma_intro p:first-child,
.main p:first-child {
  margin-top: 0;
}
.ma_intro a,
.main a {
  color: inherit;
}
.ma_intro ol,
.main ol {
  margin-top: 1em;
  counter-reset: intro-counter;
}
.ma_intro ol li,
.main ol li {
  position: relative;
  padding-left: 25px;
}
.ma_intro ol li:before,
.main ol li:before {
  position: absolute;
  left: 0;
  width: 25px;
  content: counter(intro-counter, upper-latin) ") ";
  counter-increment: intro-counter;
}