

/** * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) * http://cssreset.com */

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;
 }

input {
  -webkit-appearance: none;
  border-radius: 0;
}

textarea, input {
  outline: none;
}

:hover, :focus, :active {
  outline-color: transparent;
  outline-style: none;
}

h1, h2, h3, h4, h5, h6, a, p, span, ul, ol, li {
  margin: 0;
  padding: 0;
  font-size: 10px;
}

h1, h2, h3, h4, h5 {
  line-height: 100%;
}


@background-color: #FAF8F5; //#FAFAFA; //#EBEBEB;
@card-color: #ffffff;

@corporate-color: #114B43;
@dark-corporate-color: #114B43;

@attention-color: #FAAC1A;
@attention-text-color: #1A2421;

@whatsapp-corporate: #34b7f1;
@primary-red-color: #F44336;

@dark-gray: #474747;

@progress-color: #FDD835;
@error-color: #FF5252;

@font-family-roboto:      'Roboto', sans-serif;

@dividers-color:        rgba(0, 0, 0, 0.12);
@hint-text-color:       rgba(0, 0, 0, 0.26);
@secondary-text-color:  rgba(0, 0, 0, 0.54);
@icons-color:           rgba(0, 0, 0, 0.54);
@text-color:            rgb(0, 0, 0, 0.86);

@white-dividers-color:        rgba(255, 255, 255, 0.12);
@white-hint-text-color:       rgba(255, 255, 255, 0.26);
@white-secondary-text-color:  rgba(255, 255, 255, 0.54);
@white-icons-color:           rgba(255, 255, 255, 0.54);
@white-text-color:            rgba(255, 255, 255, 0.87);

@basic-border-radius: 8px;

// Responsive base
//---------------------
@xs:   ~"only screen and (max-width: 600px)";
@sm:   ~"only screen and (min-width: 601px) and (max-width: 1024px)";
@md:   ~"only screen and (min-width: 1025px) and (max-width: 1299px)";
@lg:   ~"only screen and (min-width: 1300px)";

/*!
 * Bootstrap v3.3.7 (http://getbootstrap.com)
 * Copyright 2011-2017 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */

/*!
 * Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=a561638298e4d6f7161e4867c8a2fe88)
 * Config saved to config.json and https://gist.github.com/a561638298e4d6f7161e4867c8a2fe88
 */
/*!
 * Bootstrap v3.3.7 (http://getbootstrap.com)
 * Copyright 2011-2016 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
[hidden],
template {
  display: none;
}
a {
  background-color: transparent;
}
a:active,
a:hover {
  outline: 0;
}
abbr[title] {
  border-bottom: 1px dotted;
}
b,
strong {
  font-weight: bold;
}
dfn {
  font-style: italic;
}
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
mark {
  background: #ff0;
  color: #000;
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
img {
  border: 0;
}
svg:not(:root) {
  overflow: hidden;
}
figure {
  margin: 1em 40px;
}
hr {
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
  height: 0;
}
pre {
  overflow: auto;
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}
button {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
input {
  line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
input[type="search"] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
legend {
  border: 0;
  padding: 0;
}
textarea {
  overflow: auto;
}
optgroup {
  font-weight: bold;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  padding: 0;
}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html {
  font-size: 10px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333333;
  background-color: #ffffff;
}
input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
a {
  color: #337ab7;
  text-decoration: none;
}
a:hover,
a:focus {
  color: #23527c;
  text-decoration: underline;
}
a:focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
figure {
  margin: 0;
}
img {
  vertical-align: middle;
}
.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}
.img-rounded {
  border-radius: 6px;
}
.img-thumbnail {
  padding: 4px;
  line-height: 1.42857143;
  background-color: #ffffff;
  border: 1px solid #dddddd;
  border-radius: 4px;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  display: inline-block;
  max-width: 100%;
  height: auto;
}
.img-circle {
  border-radius: 50%;
}
hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #eeeeee;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}
[role="button"] {
  cursor: pointer;
}
.container {
  margin-right: auto;
  margin-left: auto;
  padding-left: 8px;
  padding-right: 8px;
}
@media (min-width: 768px) {
  .container {
    width: 728px;
  }
}
@media (min-width: 1025px) {
  .container {
    width: 948px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1148px;
  }
}
.container-fluid {
  margin-right: auto;
  margin-left: auto;
  padding-left: 8px;
  padding-right: 8px;
}
.row {
  margin-left: -8px;
  margin-right: -8px;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-left: 8px;
  padding-right: 8px;
}
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
  float: left;
}
.col-xs-12 {
  width: 100%;
}
.col-xs-11 {
  width: 91.66666667%;
}
.col-xs-10 {
  width: 83.33333333%;
}
.col-xs-9 {
  width: 75%;
}
.col-xs-8 {
  width: 66.66666667%;
}
.col-xs-7 {
  width: 58.33333333%;
}
.col-xs-6 {
  width: 50%;
}
.col-xs-5 {
  width: 41.66666667%;
}
.col-xs-4 {
  width: 33.33333333%;
}
.col-xs-3 {
  width: 25%;
}
.col-xs-2 {
  width: 16.66666667%;
}
.col-xs-1 {
  width: 8.33333333%;
}
.col-xs-pull-12 {
  right: 100%;
}
.col-xs-pull-11 {
  right: 91.66666667%;
}
.col-xs-pull-10 {
  right: 83.33333333%;
}
.col-xs-pull-9 {
  right: 75%;
}
.col-xs-pull-8 {
  right: 66.66666667%;
}
.col-xs-pull-7 {
  right: 58.33333333%;
}
.col-xs-pull-6 {
  right: 50%;
}
.col-xs-pull-5 {
  right: 41.66666667%;
}
.col-xs-pull-4 {
  right: 33.33333333%;
}
.col-xs-pull-3 {
  right: 25%;
}
.col-xs-pull-2 {
  right: 16.66666667%;
}
.col-xs-pull-1 {
  right: 8.33333333%;
}
.col-xs-pull-0 {
  right: auto;
}
.col-xs-push-12 {
  left: 100%;
}
.col-xs-push-11 {
  left: 91.66666667%;
}
.col-xs-push-10 {
  left: 83.33333333%;
}
.col-xs-push-9 {
  left: 75%;
}
.col-xs-push-8 {
  left: 66.66666667%;
}
.col-xs-push-7 {
  left: 58.33333333%;
}
.col-xs-push-6 {
  left: 50%;
}
.col-xs-push-5 {
  left: 41.66666667%;
}
.col-xs-push-4 {
  left: 33.33333333%;
}
.col-xs-push-3 {
  left: 25%;
}
.col-xs-push-2 {
  left: 16.66666667%;
}
.col-xs-push-1 {
  left: 8.33333333%;
}
.col-xs-push-0 {
  left: auto;
}
.col-xs-offset-12 {
  margin-left: 100%;
}
.col-xs-offset-11 {
  margin-left: 91.66666667%;
}
.col-xs-offset-10 {
  margin-left: 83.33333333%;
}
.col-xs-offset-9 {
  margin-left: 75%;
}
.col-xs-offset-8 {
  margin-left: 66.66666667%;
}
.col-xs-offset-7 {
  margin-left: 58.33333333%;
}
.col-xs-offset-6 {
  margin-left: 50%;
}
.col-xs-offset-5 {
  margin-left: 41.66666667%;
}
.col-xs-offset-4 {
  margin-left: 33.33333333%;
}
.col-xs-offset-3 {
  margin-left: 25%;
}
.col-xs-offset-2 {
  margin-left: 16.66666667%;
}
.col-xs-offset-1 {
  margin-left: 8.33333333%;
}
.col-xs-offset-0 {
  margin-left: 0%;
}
@media (min-width: 768px) {
  .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
    float: left;
  }
  .col-sm-12 {
    width: 100%;
  }
  .col-sm-11 {
    width: 91.66666667%;
  }
  .col-sm-10 {
    width: 83.33333333%;
  }
  .col-sm-9 {
    width: 75%;
  }
  .col-sm-8 {
    width: 66.66666667%;
  }
  .col-sm-7 {
    width: 58.33333333%;
  }
  .col-sm-6 {
    width: 50%;
  }
  .col-sm-5 {
    width: 41.66666667%;
  }
  .col-sm-4 {
    width: 33.33333333%;
  }
  .col-sm-3 {
    width: 25%;
  }
  .col-sm-2 {
    width: 16.66666667%;
  }
  .col-sm-1 {
    width: 8.33333333%;
  }
  .col-sm-pull-12 {
    right: 100%;
  }
  .col-sm-pull-11 {
    right: 91.66666667%;
  }
  .col-sm-pull-10 {
    right: 83.33333333%;
  }
  .col-sm-pull-9 {
    right: 75%;
  }
  .col-sm-pull-8 {
    right: 66.66666667%;
  }
  .col-sm-pull-7 {
    right: 58.33333333%;
  }
  .col-sm-pull-6 {
    right: 50%;
  }
  .col-sm-pull-5 {
    right: 41.66666667%;
  }
  .col-sm-pull-4 {
    right: 33.33333333%;
  }
  .col-sm-pull-3 {
    right: 25%;
  }
  .col-sm-pull-2 {
    right: 16.66666667%;
  }
  .col-sm-pull-1 {
    right: 8.33333333%;
  }
  .col-sm-pull-0 {
    right: auto;
  }
  .col-sm-push-12 {
    left: 100%;
  }
  .col-sm-push-11 {
    left: 91.66666667%;
  }
  .col-sm-push-10 {
    left: 83.33333333%;
  }
  .col-sm-push-9 {
    left: 75%;
  }
  .col-sm-push-8 {
    left: 66.66666667%;
  }
  .col-sm-push-7 {
    left: 58.33333333%;
  }
  .col-sm-push-6 {
    left: 50%;
  }
  .col-sm-push-5 {
    left: 41.66666667%;
  }
  .col-sm-push-4 {
    left: 33.33333333%;
  }
  .col-sm-push-3 {
    left: 25%;
  }
  .col-sm-push-2 {
    left: 16.66666667%;
  }
  .col-sm-push-1 {
    left: 8.33333333%;
  }
  .col-sm-push-0 {
    left: auto;
  }
  .col-sm-offset-12 {
    margin-left: 100%;
  }
  .col-sm-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-sm-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-sm-offset-9 {
    margin-left: 75%;
  }
  .col-sm-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-sm-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-sm-offset-6 {
    margin-left: 50%;
  }
  .col-sm-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-sm-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-sm-offset-3 {
    margin-left: 25%;
  }
  .col-sm-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-sm-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-sm-offset-0 {
    margin-left: 0%;
  }
}
@media (min-width: 1025px) {
  .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
    float: left;
  }
  .col-md-12 {
    width: 100%;
  }
  .col-md-11 {
    width: 91.66666667%;
  }
  .col-md-10 {
    width: 83.33333333%;
  }
  .col-md-9 {
    width: 75%;
  }
  .col-md-8 {
    width: 66.66666667%;
  }
  .col-md-7 {
    width: 58.33333333%;
  }
  .col-md-6 {
    width: 50%;
  }
  .col-md-5 {
    width: 41.66666667%;
  }
  .col-md-4 {
    width: 33.33333333%;
  }
  .col-md-3 {
    width: 25%;
  }
  .col-md-2 {
    width: 16.66666667%;
  }
  .col-md-1 {
    width: 8.33333333%;
  }
  .col-md-pull-12 {
    right: 100%;
  }
  .col-md-pull-11 {
    right: 91.66666667%;
  }
  .col-md-pull-10 {
    right: 83.33333333%;
  }
  .col-md-pull-9 {
    right: 75%;
  }
  .col-md-pull-8 {
    right: 66.66666667%;
  }
  .col-md-pull-7 {
    right: 58.33333333%;
  }
  .col-md-pull-6 {
    right: 50%;
  }
  .col-md-pull-5 {
    right: 41.66666667%;
  }
  .col-md-pull-4 {
    right: 33.33333333%;
  }
  .col-md-pull-3 {
    right: 25%;
  }
  .col-md-pull-2 {
    right: 16.66666667%;
  }
  .col-md-pull-1 {
    right: 8.33333333%;
  }
  .col-md-pull-0 {
    right: auto;
  }
  .col-md-push-12 {
    left: 100%;
  }
  .col-md-push-11 {
    left: 91.66666667%;
  }
  .col-md-push-10 {
    left: 83.33333333%;
  }
  .col-md-push-9 {
    left: 75%;
  }
  .col-md-push-8 {
    left: 66.66666667%;
  }
  .col-md-push-7 {
    left: 58.33333333%;
  }
  .col-md-push-6 {
    left: 50%;
  }
  .col-md-push-5 {
    left: 41.66666667%;
  }
  .col-md-push-4 {
    left: 33.33333333%;
  }
  .col-md-push-3 {
    left: 25%;
  }
  .col-md-push-2 {
    left: 16.66666667%;
  }
  .col-md-push-1 {
    left: 8.33333333%;
  }
  .col-md-push-0 {
    left: auto;
  }
  .col-md-offset-12 {
    margin-left: 100%;
  }
  .col-md-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-md-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-md-offset-9 {
    margin-left: 75%;
  }
  .col-md-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-md-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-md-offset-6 {
    margin-left: 50%;
  }
  .col-md-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-md-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-md-offset-3 {
    margin-left: 25%;
  }
  .col-md-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-md-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-md-offset-0 {
    margin-left: 0%;
  }
}
@media (min-width: 1200px) {
  .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
    float: left;
  }
  .col-lg-12 {
    width: 100%;
  }
  .col-lg-11 {
    width: 91.66666667%;
  }
  .col-lg-10 {
    width: 83.33333333%;
  }
  .col-lg-9 {
    width: 75%;
  }
  .col-lg-8 {
    width: 66.66666667%;
  }
  .col-lg-7 {
    width: 58.33333333%;
  }
  .col-lg-6 {
    width: 50%;
  }
  .col-lg-5 {
    width: 41.66666667%;
  }
  .col-lg-4 {
    width: 33.33333333%;
  }
  .col-lg-3 {
    width: 25%;
  }
  .col-lg-2 {
    width: 16.66666667%;
  }
  .col-lg-1 {
    width: 8.33333333%;
  }
  .col-lg-pull-12 {
    right: 100%;
  }
  .col-lg-pull-11 {
    right: 91.66666667%;
  }
  .col-lg-pull-10 {
    right: 83.33333333%;
  }
  .col-lg-pull-9 {
    right: 75%;
  }
  .col-lg-pull-8 {
    right: 66.66666667%;
  }
  .col-lg-pull-7 {
    right: 58.33333333%;
  }
  .col-lg-pull-6 {
    right: 50%;
  }
  .col-lg-pull-5 {
    right: 41.66666667%;
  }
  .col-lg-pull-4 {
    right: 33.33333333%;
  }
  .col-lg-pull-3 {
    right: 25%;
  }
  .col-lg-pull-2 {
    right: 16.66666667%;
  }
  .col-lg-pull-1 {
    right: 8.33333333%;
  }
  .col-lg-pull-0 {
    right: auto;
  }
  .col-lg-push-12 {
    left: 100%;
  }
  .col-lg-push-11 {
    left: 91.66666667%;
  }
  .col-lg-push-10 {
    left: 83.33333333%;
  }
  .col-lg-push-9 {
    left: 75%;
  }
  .col-lg-push-8 {
    left: 66.66666667%;
  }
  .col-lg-push-7 {
    left: 58.33333333%;
  }
  .col-lg-push-6 {
    left: 50%;
  }
  .col-lg-push-5 {
    left: 41.66666667%;
  }
  .col-lg-push-4 {
    left: 33.33333333%;
  }
  .col-lg-push-3 {
    left: 25%;
  }
  .col-lg-push-2 {
    left: 16.66666667%;
  }
  .col-lg-push-1 {
    left: 8.33333333%;
  }
  .col-lg-push-0 {
    left: auto;
  }
  .col-lg-offset-12 {
    margin-left: 100%;
  }
  .col-lg-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-lg-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-lg-offset-9 {
    margin-left: 75%;
  }
  .col-lg-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-lg-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-lg-offset-6 {
    margin-left: 50%;
  }
  .col-lg-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-lg-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-lg-offset-3 {
    margin-left: 25%;
  }
  .col-lg-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-lg-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-lg-offset-0 {
    margin-left: 0%;
  }
}
.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  border: 0;
}
.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
.embed-responsive-4by3 {
  padding-bottom: 75%;
}
.clearfix:before,
.clearfix:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after {
  content: " ";
  display: table;
}
.clearfix:after,
.container:after,
.container-fluid:after,
.row:after {
  clear: both;
}
.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.pull-right {
  float: right !important;
}
.pull-left {
  float: left !important;
}
.hide {
  display: none !important;
}
.show {
  display: block !important;
}
.invisible {
  visibility: hidden;
}
.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.hidden {
  display: none !important;
}
.affix {
  position: fixed;
}
@-ms-viewport {
  width: device-width;
}
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
  display: none !important;
}
@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
  table.visible-xs {
    display: table !important;
  }
  tr.visible-xs {
    display: table-row !important;
  }
  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-block {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline {
    display: inline !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .visible-sm {
    display: block !important;
  }
  table.visible-sm {
    display: table !important;
  }
  tr.visible-sm {
    display: table-row !important;
  }
  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .visible-sm-block {
    display: block !important;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .visible-sm-inline {
    display: inline !important;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .visible-sm-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1025px) and (max-width: 1199px) {
  .visible-md {
    display: block !important;
  }
  table.visible-md {
    display: table !important;
  }
  tr.visible-md {
    display: table-row !important;
  }
  th.visible-md,
  td.visible-md {
    display: table-cell !important;
  }
}
@media (min-width: 1025px) and (max-width: 1199px) {
  .visible-md-block {
    display: block !important;
  }
}
@media (min-width: 1025px) and (max-width: 1199px) {
  .visible-md-inline {
    display: inline !important;
  }
}
@media (min-width: 1025px) and (max-width: 1199px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg {
    display: block !important;
  }
  table.visible-lg {
    display: table !important;
  }
  tr.visible-lg {
    display: table-row !important;
  }
  th.visible-lg,
  td.visible-lg {
    display: table-cell !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-block {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline {
    display: inline !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline-block {
    display: inline-block !important;
  }
}
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 1025px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}
.visible-print {
  display: none !important;
}
@media print {
  .visible-print {
    display: block !important;
  }
  table.visible-print {
    display: table !important;
  }
  tr.visible-print {
    display: table-row !important;
  }
  th.visible-print,
  td.visible-print {
    display: table-cell !important;
  }
}
.visible-print-block {
  display: none !important;
}
@media print {
  .visible-print-block {
    display: block !important;
  }
}
.visible-print-inline {
  display: none !important;
}
@media print {
  .visible-print-inline {
    display: inline !important;
  }
}
.visible-print-inline-block {
  display: none !important;
}
@media print {
  .visible-print-inline-block {
    display: inline-block !important;
  }
}
@media print {
  .hidden-print {
    display: none !important;
  }
}


/*!
 * Bootstrap v3.3.7 (http://getbootstrap.com)
 * Copyright 2011-2017 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */

/*!
 * Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=a561638298e4d6f7161e4867c8a2fe88)
 * Config saved to config.json and https://gist.github.com/a561638298e4d6f7161e4867c8a2fe88
 */
/*!
 * Bootstrap v3.3.7 (http://getbootstrap.com)
 * Copyright 2011-2016 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
.btn-default,
.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger {
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
}
.btn-default:active,
.btn-primary:active,
.btn-success:active,
.btn-info:active,
.btn-warning:active,
.btn-danger:active,
.btn-default.active,
.btn-primary.active,
.btn-success.active,
.btn-info.active,
.btn-warning.active,
.btn-danger.active {
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn-default.disabled,
.btn-primary.disabled,
.btn-success.disabled,
.btn-info.disabled,
.btn-warning.disabled,
.btn-danger.disabled,
.btn-default[disabled],
.btn-primary[disabled],
.btn-success[disabled],
.btn-info[disabled],
.btn-warning[disabled],
.btn-danger[disabled],
fieldset[disabled] .btn-default,
fieldset[disabled] .btn-primary,
fieldset[disabled] .btn-success,
fieldset[disabled] .btn-info,
fieldset[disabled] .btn-warning,
fieldset[disabled] .btn-danger {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.btn-default .badge,
.btn-primary .badge,
.btn-success .badge,
.btn-info .badge,
.btn-warning .badge,
.btn-danger .badge {
  text-shadow: none;
}
.btn:active,
.btn.active {
  background-image: none;
}
.btn-default {
  background-image: -webkit-linear-gradient(top, #ffffff 0%, #e0e0e0 100%);
  background-image: -o-linear-gradient(top, #ffffff 0%, #e0e0e0 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#e0e0e0));
  background-image: linear-gradient(to bottom, #ffffff 0%, #e0e0e0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  background-repeat: repeat-x;
  border-color: #dbdbdb;
  text-shadow: 0 1px 0 #fff;
  border-color: #ccc;
}
.btn-default:hover,
.btn-default:focus {
  background-color: #e0e0e0;
  background-position: 0 -15px;
}
.btn-default:active,
.btn-default.active {
  background-color: #e0e0e0;
  border-color: #dbdbdb;
}
.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
  background-color: #e0e0e0;
  background-image: none;
}
.btn-primary {
  background-image: -webkit-linear-gradient(top, #337ab7 0%, #265a88 100%);
  background-image: -o-linear-gradient(top, #337ab7 0%, #265a88 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#265a88));
  background-image: linear-gradient(to bottom, #337ab7 0%, #265a88 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff265a88', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  background-repeat: repeat-x;
  border-color: #245580;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: #265a88;
  background-position: 0 -15px;
}
.btn-primary:active,
.btn-primary.active {
  background-color: #265a88;
  border-color: #245580;
}
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
  background-color: #265a88;
  background-image: none;
}
.btn-success {
  background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%);
  background-image: -o-linear-gradient(top, #5cb85c 0%, #419641 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#419641));
  background-image: linear-gradient(to bottom, #5cb85c 0%, #419641 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  background-repeat: repeat-x;
  border-color: #3e8f3e;
}
.btn-success:hover,
.btn-success:focus {
  background-color: #419641;
  background-position: 0 -15px;
}
.btn-success:active,
.btn-success.active {
  background-color: #419641;
  border-color: #3e8f3e;
}
.btn-success.disabled,
.btn-success[disabled],
fieldset[disabled] .btn-success,
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled.focus,
.btn-success[disabled].focus,
fieldset[disabled] .btn-success.focus,
.btn-success.disabled:active,
.btn-success[disabled]:active,
fieldset[disabled] .btn-success:active,
.btn-success.disabled.active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active {
  background-color: #419641;
  background-image: none;
}
.btn-info {
  background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
  background-image: -o-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#2aabd2));
  background-image: linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  background-repeat: repeat-x;
  border-color: #28a4c9;
}
.btn-info:hover,
.btn-info:focus {
  background-color: #2aabd2;
  background-position: 0 -15px;
}
.btn-info:active,
.btn-info.active {
  background-color: #2aabd2;
  border-color: #28a4c9;
}
.btn-info.disabled,
.btn-info[disabled],
fieldset[disabled] .btn-info,
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled.focus,
.btn-info[disabled].focus,
fieldset[disabled] .btn-info.focus,
.btn-info.disabled:active,
.btn-info[disabled]:active,
fieldset[disabled] .btn-info:active,
.btn-info.disabled.active,
.btn-info[disabled].active,
fieldset[disabled] .btn-info.active {
  background-color: #2aabd2;
  background-image: none;
}
.btn-warning {
  background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
  background-image: -o-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#eb9316));
  background-image: linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  background-repeat: repeat-x;
  border-color: #e38d13;
}
.btn-warning:hover,
.btn-warning:focus {
  background-color: #eb9316;
  background-position: 0 -15px;
}
.btn-warning:active,
.btn-warning.active {
  background-color: #eb9316;
  border-color: #e38d13;
}
.btn-warning.disabled,
.btn-warning[disabled],
fieldset[disabled] .btn-warning,
.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled.focus,
.btn-warning[disabled].focus,
fieldset[disabled] .btn-warning.focus,
.btn-warning.disabled:active,
.btn-warning[disabled]:active,
fieldset[disabled] .btn-warning:active,
.btn-warning.disabled.active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning.active {
  background-color: #eb9316;
  background-image: none;
}
.btn-danger {
  background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
  background-image: -o-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c12e2a));
  background-image: linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  background-repeat: repeat-x;
  border-color: #b92c28;
}
.btn-danger:hover,
.btn-danger:focus {
  background-color: #c12e2a;
  background-position: 0 -15px;
}
.btn-danger:active,
.btn-danger.active {
  background-color: #c12e2a;
  border-color: #b92c28;
}
.btn-danger.disabled,
.btn-danger[disabled],
fieldset[disabled] .btn-danger,
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled.focus,
.btn-danger[disabled].focus,
fieldset[disabled] .btn-danger.focus,
.btn-danger.disabled:active,
.btn-danger[disabled]:active,
fieldset[disabled] .btn-danger:active,
.btn-danger.disabled.active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger.active {
  background-color: #c12e2a;
  background-image: none;
}
.thumbnail,
.img-thumbnail {
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
  background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
  background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
  background-color: #e8e8e8;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
  background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
  background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
  background-color: #2e6da4;
}
.navbar-default {
  background-image: -webkit-linear-gradient(top, #ffffff 0%, #f8f8f8 100%);
  background-image: -o-linear-gradient(top, #ffffff 0%, #f8f8f8 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f8f8f8));
  background-image: linear-gradient(to bottom, #ffffff 0%, #f8f8f8 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 5px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 5px rgba(0, 0, 0, 0.075);
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .active > a {
  background-image: -webkit-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%);
  background-image: -o-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#dbdbdb), to(#e2e2e2));
  background-image: linear-gradient(to bottom, #dbdbdb 0%, #e2e2e2 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdbdbdb', endColorstr='#ffe2e2e2', GradientType=0);
  -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.075);
}
.navbar-brand,
.navbar-nav > li > a {
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
}
.navbar-inverse {
  background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222222 100%);
  background-image: -o-linear-gradient(top, #3c3c3c 0%, #222222 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#3c3c3c), to(#222222));
  background-image: linear-gradient(to bottom, #3c3c3c 0%, #222222 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  border-radius: 4px;
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .active > a {
  background-image: -webkit-linear-gradient(top, #080808 0%, #0f0f0f 100%);
  background-image: -o-linear-gradient(top, #080808 0%, #0f0f0f 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#080808), to(#0f0f0f));
  background-image: linear-gradient(to bottom, #080808 0%, #0f0f0f 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff080808', endColorstr='#ff0f0f0f', GradientType=0);
  -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 3px 9px rgba(0, 0, 0, 0.25);
}
.navbar-inverse .navbar-brand,
.navbar-inverse .navbar-nav > li > a {
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.navbar-static-top,
.navbar-fixed-top,
.navbar-fixed-bottom {
  border-radius: 0;
}
@media (max-width: 767px) {
  .navbar .navbar-nav .open .dropdown-menu > .active > a,
  .navbar .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #fff;
    background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
    background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
    background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
  }
}
.alert {
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
}
.alert-success {
  background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
  background-image: -o-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc));
  background-image: linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);
  border-color: #b2dba1;
}
.alert-info {
  background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
  background-image: -o-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#b9def0));
  background-image: linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);
  border-color: #9acfea;
}
.alert-warning {
  background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
  background-image: -o-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#f8efc0));
  background-image: linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
  border-color: #f5e79e;
}
.alert-danger {
  background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
  background-image: -o-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#e7c3c3));
  background-image: linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);
  border-color: #dca7a7;
}
.progress {
  background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
  background-image: -o-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#f5f5f5));
  background-image: linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0);
}
.progress-bar {
  background-image: -webkit-linear-gradient(top, #337ab7 0%, #286090 100%);
  background-image: -o-linear-gradient(top, #337ab7 0%, #286090 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#286090));
  background-image: linear-gradient(to bottom, #337ab7 0%, #286090 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff286090', GradientType=0);
}
.progress-bar-success {
  background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%);
  background-image: -o-linear-gradient(top, #5cb85c 0%, #449d44 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#449d44));
  background-image: linear-gradient(to bottom, #5cb85c 0%, #449d44 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);
}
.progress-bar-info {
  background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
  background-image: -o-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#31b0d5));
  background-image: linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0);
}
.progress-bar-warning {
  background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
  background-image: -o-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#ec971f));
  background-image: linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0);
}
.progress-bar-danger {
  background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%);
  background-image: -o-linear-gradient(top, #d9534f 0%, #c9302c 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c9302c));
  background-image: linear-gradient(to bottom, #d9534f 0%, #c9302c 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0);
}
.progress-bar-striped {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.list-group {
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
}
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
  text-shadow: 0 -1px 0 #286090;
  background-image: -webkit-linear-gradient(top, #337ab7 0%, #2b669a 100%);
  background-image: -o-linear-gradient(top, #337ab7 0%, #2b669a 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2b669a));
  background-image: linear-gradient(to bottom, #337ab7 0%, #2b669a 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2b669a', GradientType=0);
  border-color: #2b669a;
}
.list-group-item.active .badge,
.list-group-item.active:hover .badge,
.list-group-item.active:focus .badge {
  text-shadow: none;
}
.panel {
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.panel-default > .panel-heading {
  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
  background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
  background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
}
.panel-primary > .panel-heading {
  background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
  background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
  background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
}
.panel-success > .panel-heading {
  background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
  background-image: -o-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#d0e9c6));
  background-image: linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0);
}
.panel-info > .panel-heading {
  background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
  background-image: -o-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#c4e3f3));
  background-image: linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0);
}
.panel-warning > .panel-heading {
  background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
  background-image: -o-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#faf2cc));
  background-image: linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0);
}
.panel-danger > .panel-heading {
  background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
  background-image: -o-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#ebcccc));
  background-image: linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0);
}
.well {
  background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
  background-image: -o-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#f5f5f5));
  background-image: linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0);
  border-color: #dcdcdc;
  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(255, 255, 255, 0.1);
}


/*!
 * Materialize v1.0.0 (http://materializecss.com)
 * Copyright 2014-2017 Materialize
 * MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
 */
.materialize-red {
  background-color: #e51c23 !important;
}

.materialize-red-text {
  color: #e51c23 !important;
}

.materialize-red.lighten-5 {
  background-color: #fdeaeb !important;
}

.materialize-red-text.text-lighten-5 {
  color: #fdeaeb !important;
}

.materialize-red.lighten-4 {
  background-color: #f8c1c3 !important;
}

.materialize-red-text.text-lighten-4 {
  color: #f8c1c3 !important;
}

.materialize-red.lighten-3 {
  background-color: #f3989b !important;
}

.materialize-red-text.text-lighten-3 {
  color: #f3989b !important;
}

.materialize-red.lighten-2 {
  background-color: #ee6e73 !important;
}

.materialize-red-text.text-lighten-2 {
  color: #ee6e73 !important;
}

.materialize-red.lighten-1 {
  background-color: #ea454b !important;
}

.materialize-red-text.text-lighten-1 {
  color: #ea454b !important;
}

.materialize-red.darken-1 {
  background-color: #d0181e !important;
}

.materialize-red-text.text-darken-1 {
  color: #d0181e !important;
}

.materialize-red.darken-2 {
  background-color: #b9151b !important;
}

.materialize-red-text.text-darken-2 {
  color: #b9151b !important;
}

.materialize-red.darken-3 {
  background-color: #a21318 !important;
}

.materialize-red-text.text-darken-3 {
  color: #a21318 !important;
}

.materialize-red.darken-4 {
  background-color: #8b1014 !important;
}

.materialize-red-text.text-darken-4 {
  color: #8b1014 !important;
}

.red {
  background-color: #FF5252 !important;
}

.red-text {
  color: #FF5252 !important;
}

.red.lighten-5 {
  background-color: #FFEBEE !important;
}

.red-text.text-lighten-5 {
  color: #FFEBEE !important;
}

.red.lighten-4 {
  background-color: #FFCDD2 !important;
}

.red-text.text-lighten-4 {
  color: #FFCDD2 !important;
}

.red.lighten-3 {
  background-color: #EF9A9A !important;
}

.red-text.text-lighten-3 {
  color: #EF9A9A !important;
}

.red.lighten-2 {
  background-color: #E57373 !important;
}

.red-text.text-lighten-2 {
  color: #E57373 !important;
}

.red.lighten-1 {
  background-color: #EF5350 !important;
}

.red-text.text-lighten-1 {
  color: #EF5350 !important;
}

.red.darken-1 {
  background-color: #E53935 !important;
}

.red-text.text-darken-1 {
  color: #E53935 !important;
}

.red.darken-2 {
  background-color: #D32F2F !important;
}

.red-text.text-darken-2 {
  color: #D32F2F !important;
}

.red.darken-3 {
  background-color: #C62828 !important;
}

.red-text.text-darken-3 {
  color: #C62828 !important;
}

.red.darken-4 {
  background-color: #B71C1C !important;
}

.red-text.text-darken-4 {
  color: #B71C1C !important;
}

.red.accent-1 {
  background-color: #FF8A80 !important;
}

.red-text.text-accent-1 {
  color: #FF8A80 !important;
}

.red.accent-2 {
  background-color: #FF5252 !important;
}

.red-text.text-accent-2 {
  color: #FF5252 !important;
}

.red.accent-3 {
  background-color: #FF1744 !important;
}

.red-text.text-accent-3 {
  color: #FF1744 !important;
}

.red.accent-4 {
  background-color: #D50000 !important;
}

.red-text.text-accent-4 {
  color: #D50000 !important;
}

.pink {
  background-color: #e91e63 !important;
}

.pink-text {
  color: #e91e63 !important;
}

.pink.lighten-5 {
  background-color: #fce4ec !important;
}

.pink-text.text-lighten-5 {
  color: #fce4ec !important;
}

.pink.lighten-4 {
  background-color: #f8bbd0 !important;
}

.pink-text.text-lighten-4 {
  color: #f8bbd0 !important;
}

.pink.lighten-3 {
  background-color: #f48fb1 !important;
}

.pink-text.text-lighten-3 {
  color: #f48fb1 !important;
}

.pink.lighten-2 {
  background-color: #f06292 !important;
}

.pink-text.text-lighten-2 {
  color: #f06292 !important;
}

.pink.lighten-1 {
  background-color: #ec407a !important;
}

.pink-text.text-lighten-1 {
  color: #ec407a !important;
}

.pink.darken-1 {
  background-color: #d81b60 !important;
}

.pink-text.text-darken-1 {
  color: #d81b60 !important;
}

.pink.darken-2 {
  background-color: #c2185b !important;
}

.pink-text.text-darken-2 {
  color: #c2185b !important;
}

.pink.darken-3 {
  background-color: #ad1457 !important;
}

.pink-text.text-darken-3 {
  color: #ad1457 !important;
}

.pink.darken-4 {
  background-color: #880e4f !important;
}

.pink-text.text-darken-4 {
  color: #880e4f !important;
}

.pink.accent-1 {
  background-color: #ff80ab !important;
}

.pink-text.text-accent-1 {
  color: #ff80ab !important;
}

.pink.accent-2 {
  background-color: #ff4081 !important;
}

.pink-text.text-accent-2 {
  color: #ff4081 !important;
}

.pink.accent-3 {
  background-color: #f50057 !important;
}

.pink-text.text-accent-3 {
  color: #f50057 !important;
}

.pink.accent-4 {
  background-color: #c51162 !important;
}

.pink-text.text-accent-4 {
  color: #c51162 !important;
}

.purple {
  background-color: #9c27b0 !important;
}

.purple-text {
  color: #9c27b0 !important;
}

.purple.lighten-5 {
  background-color: #f3e5f5 !important;
}

.purple-text.text-lighten-5 {
  color: #f3e5f5 !important;
}

.purple.lighten-4 {
  background-color: #e1bee7 !important;
}

.purple-text.text-lighten-4 {
  color: #e1bee7 !important;
}

.purple.lighten-3 {
  background-color: #ce93d8 !important;
}

.purple-text.text-lighten-3 {
  color: #ce93d8 !important;
}

.purple.lighten-2 {
  background-color: #ba68c8 !important;
}

.purple-text.text-lighten-2 {
  color: #ba68c8 !important;
}

.purple.lighten-1 {
  background-color: #ab47bc !important;
}

.purple-text.text-lighten-1 {
  color: #ab47bc !important;
}

.purple.darken-1 {
  background-color: #8e24aa !important;
}

.purple-text.text-darken-1 {
  color: #8e24aa !important;
}

.purple.darken-2 {
  background-color: #7b1fa2 !important;
}

.purple-text.text-darken-2 {
  color: #7b1fa2 !important;
}

.purple.darken-3 {
  background-color: #6a1b9a !important;
}

.purple-text.text-darken-3 {
  color: #6a1b9a !important;
}

.purple.darken-4 {
  background-color: #4a148c !important;
}

.purple-text.text-darken-4 {
  color: #4a148c !important;
}

.purple.accent-1 {
  background-color: #ea80fc !important;
}

.purple-text.text-accent-1 {
  color: #ea80fc !important;
}

.purple.accent-2 {
  background-color: #e040fb !important;
}

.purple-text.text-accent-2 {
  color: #e040fb !important;
}

.purple.accent-3 {
  background-color: #d500f9 !important;
}

.purple-text.text-accent-3 {
  color: #d500f9 !important;
}

.purple.accent-4 {
  background-color: #aa00ff !important;
}

.purple-text.text-accent-4 {
  color: #aa00ff !important;
}

.deep-purple {
  background-color: #673ab7 !important;
}

.deep-purple-text {
  color: #673ab7 !important;
}

.deep-purple.lighten-5 {
  background-color: #ede7f6 !important;
}

.deep-purple-text.text-lighten-5 {
  color: #ede7f6 !important;
}

.deep-purple.lighten-4 {
  background-color: #d1c4e9 !important;
}

.deep-purple-text.text-lighten-4 {
  color: #d1c4e9 !important;
}

.deep-purple.lighten-3 {
  background-color: #b39ddb !important;
}

.deep-purple-text.text-lighten-3 {
  color: #b39ddb !important;
}

.deep-purple.lighten-2 {
  background-color: #9575cd !important;
}

.deep-purple-text.text-lighten-2 {
  color: #9575cd !important;
}

.deep-purple.lighten-1 {
  background-color: #7e57c2 !important;
}

.deep-purple-text.text-lighten-1 {
  color: #7e57c2 !important;
}

.deep-purple.darken-1 {
  background-color: #5e35b1 !important;
}

.deep-purple-text.text-darken-1 {
  color: #5e35b1 !important;
}

.deep-purple.darken-2 {
  background-color: #512da8 !important;
}

.deep-purple-text.text-darken-2 {
  color: #512da8 !important;
}

.deep-purple.darken-3 {
  background-color: #4527a0 !important;
}

.deep-purple-text.text-darken-3 {
  color: #4527a0 !important;
}

.deep-purple.darken-4 {
  background-color: #311b92 !important;
}

.deep-purple-text.text-darken-4 {
  color: #311b92 !important;
}

.deep-purple.accent-1 {
  background-color: #b388ff !important;
}

.deep-purple-text.text-accent-1 {
  color: #b388ff !important;
}

.deep-purple.accent-2 {
  background-color: #7c4dff !important;
}

.deep-purple-text.text-accent-2 {
  color: #7c4dff !important;
}

.deep-purple.accent-3 {
  background-color: #651fff !important;
}

.deep-purple-text.text-accent-3 {
  color: #651fff !important;
}

.deep-purple.accent-4 {
  background-color: #6200ea !important;
}

.deep-purple-text.text-accent-4 {
  color: #6200ea !important;
}

.indigo {
  background-color: #3f51b5 !important;
}

.indigo-text {
  color: #3f51b5 !important;
}

.indigo.lighten-5 {
  background-color: #e8eaf6 !important;
}

.indigo-text.text-lighten-5 {
  color: #e8eaf6 !important;
}

.indigo.lighten-4 {
  background-color: #c5cae9 !important;
}

.indigo-text.text-lighten-4 {
  color: #c5cae9 !important;
}

.indigo.lighten-3 {
  background-color: #9fa8da !important;
}

.indigo-text.text-lighten-3 {
  color: #9fa8da !important;
}

.indigo.lighten-2 {
  background-color: #7986cb !important;
}

.indigo-text.text-lighten-2 {
  color: #7986cb !important;
}

.indigo.lighten-1 {
  background-color: #5c6bc0 !important;
}

.indigo-text.text-lighten-1 {
  color: #5c6bc0 !important;
}

.indigo.darken-1 {
  background-color: #3949ab !important;
}

.indigo-text.text-darken-1 {
  color: #3949ab !important;
}

.indigo.darken-2 {
  background-color: #303f9f !important;
}

.indigo-text.text-darken-2 {
  color: #303f9f !important;
}

.indigo.darken-3 {
  background-color: #283593 !important;
}

.indigo-text.text-darken-3 {
  color: #283593 !important;
}

.indigo.darken-4 {
  background-color: #1a237e !important;
}

.indigo-text.text-darken-4 {
  color: #1a237e !important;
}

.indigo.accent-1 {
  background-color: #8c9eff !important;
}

.indigo-text.text-accent-1 {
  color: #8c9eff !important;
}

.indigo.accent-2 {
  background-color: #536dfe !important;
}

.indigo-text.text-accent-2 {
  color: #536dfe !important;
}

.indigo.accent-3 {
  background-color: #3d5afe !important;
}

.indigo-text.text-accent-3 {
  color: #3d5afe !important;
}

.indigo.accent-4 {
  background-color: #304ffe !important;
}

.indigo-text.text-accent-4 {
  color: #304ffe !important;
}

.blue {
  background-color: #2196F3 !important;
}

.blue-text {
  color: #2196F3 !important;
}

.blue.lighten-5 {
  background-color: #E3F2FD !important;
}

.blue-text.text-lighten-5 {
  color: #E3F2FD !important;
}

.blue.lighten-4 {
  background-color: #BBDEFB !important;
}

.blue-text.text-lighten-4 {
  color: #BBDEFB !important;
}

.blue.lighten-3 {
  background-color: #90CAF9 !important;
}

.blue-text.text-lighten-3 {
  color: #90CAF9 !important;
}

.blue.lighten-2 {
  background-color: #64B5F6 !important;
}

.blue-text.text-lighten-2 {
  color: #64B5F6 !important;
}

.blue.lighten-1 {
  background-color: #42A5F5 !important;
}

.blue-text.text-lighten-1 {
  color: #42A5F5 !important;
}

.blue.darken-1 {
  background-color: #1E88E5 !important;
}

.blue-text.text-darken-1 {
  color: #1E88E5 !important;
}

.blue.darken-2 {
  background-color: #1976D2 !important;
}

.blue-text.text-darken-2 {
  color: #1976D2 !important;
}

.blue.darken-3 {
  background-color: #1565C0 !important;
}

.blue-text.text-darken-3 {
  color: #1565C0 !important;
}

.blue.darken-4 {
  background-color: #0D47A1 !important;
}

.blue-text.text-darken-4 {
  color: #0D47A1 !important;
}

.blue.accent-1 {
  background-color: #82B1FF !important;
}

.blue-text.text-accent-1 {
  color: #82B1FF !important;
}

.blue.accent-2 {
  background-color: #448AFF !important;
}

.blue-text.text-accent-2 {
  color: #448AFF !important;
}

.blue.accent-3 {
  background-color: #2979FF !important;
}

.blue-text.text-accent-3 {
  color: #2979FF !important;
}

.blue.accent-4 {
  background-color: #2962FF !important;
}

.blue-text.text-accent-4 {
  color: #2962FF !important;
}

.light-blue {
  background-color: #03a9f4 !important;
}

.light-blue-text {
  color: #03a9f4 !important;
}

.light-blue.lighten-5 {
  background-color: #e1f5fe !important;
}

.light-blue-text.text-lighten-5 {
  color: #e1f5fe !important;
}

.light-blue.lighten-4 {
  background-color: #b3e5fc !important;
}

.light-blue-text.text-lighten-4 {
  color: #b3e5fc !important;
}

.light-blue.lighten-3 {
  background-color: #81d4fa !important;
}

.light-blue-text.text-lighten-3 {
  color: #81d4fa !important;
}

.light-blue.lighten-2 {
  background-color: #4fc3f7 !important;
}

.light-blue-text.text-lighten-2 {
  color: #4fc3f7 !important;
}

.light-blue.lighten-1 {
  background-color: #29b6f6 !important;
}

.light-blue-text.text-lighten-1 {
  color: #29b6f6 !important;
}

.light-blue.darken-1 {
  background-color: #039be5 !important;
}

.light-blue-text.text-darken-1 {
  color: #039be5 !important;
}

.light-blue.darken-2 {
  background-color: #0288d1 !important;
}

.light-blue-text.text-darken-2 {
  color: #0288d1 !important;
}

.light-blue.darken-3 {
  background-color: #0277bd !important;
}

.light-blue-text.text-darken-3 {
  color: #0277bd !important;
}

.light-blue.darken-4 {
  background-color: #01579b !important;
}

.light-blue-text.text-darken-4 {
  color: #01579b !important;
}

.light-blue.accent-1 {
  background-color: #80d8ff !important;
}

.light-blue-text.text-accent-1 {
  color: #80d8ff !important;
}

.light-blue.accent-2 {
  background-color: #40c4ff !important;
}

.light-blue-text.text-accent-2 {
  color: #40c4ff !important;
}

.light-blue.accent-3 {
  background-color: #00b0ff !important;
}

.light-blue-text.text-accent-3 {
  color: #00b0ff !important;
}

.light-blue.accent-4 {
  background-color: #0091ea !important;
}

.light-blue-text.text-accent-4 {
  color: #0091ea !important;
}

.cyan {
  background-color: #00bcd4 !important;
}

.cyan-text {
  color: #00bcd4 !important;
}

.cyan.lighten-5 {
  background-color: #e0f7fa !important;
}

.cyan-text.text-lighten-5 {
  color: #e0f7fa !important;
}

.cyan.lighten-4 {
  background-color: #b2ebf2 !important;
}

.cyan-text.text-lighten-4 {
  color: #b2ebf2 !important;
}

.cyan.lighten-3 {
  background-color: #80deea !important;
}

.cyan-text.text-lighten-3 {
  color: #80deea !important;
}

.cyan.lighten-2 {
  background-color: #4dd0e1 !important;
}

.cyan-text.text-lighten-2 {
  color: #4dd0e1 !important;
}

.cyan.lighten-1 {
  background-color: #26c6da !important;
}

.cyan-text.text-lighten-1 {
  color: #26c6da !important;
}

.cyan.darken-1 {
  background-color: #00acc1 !important;
}

.cyan-text.text-darken-1 {
  color: #00acc1 !important;
}

.cyan.darken-2 {
  background-color: #0097a7 !important;
}

.cyan-text.text-darken-2 {
  color: #0097a7 !important;
}

.cyan.darken-3 {
  background-color: #00838f !important;
}

.cyan-text.text-darken-3 {
  color: #00838f !important;
}

.cyan.darken-4 {
  background-color: #006064 !important;
}

.cyan-text.text-darken-4 {
  color: #006064 !important;
}

.cyan.accent-1 {
  background-color: #84ffff !important;
}

.cyan-text.text-accent-1 {
  color: #84ffff !important;
}

.cyan.accent-2 {
  background-color: #18ffff !important;
}

.cyan-text.text-accent-2 {
  color: #18ffff !important;
}

.cyan.accent-3 {
  background-color: #00e5ff !important;
}

.cyan-text.text-accent-3 {
  color: #00e5ff !important;
}

.cyan.accent-4 {
  background-color: #00b8d4 !important;
}

.cyan-text.text-accent-4 {
  color: #00b8d4 !important;
}

.teal {
  background-color: #009688 !important;
}

.teal-text {
  color: #009688 !important;
}

.teal.lighten-5 {
  background-color: #e0f2f1 !important;
}

.teal-text.text-lighten-5 {
  color: #e0f2f1 !important;
}

.teal.lighten-4 {
  background-color: #b2dfdb !important;
}

.teal-text.text-lighten-4 {
  color: #b2dfdb !important;
}

.teal.lighten-3 {
  background-color: #80cbc4 !important;
}

.teal-text.text-lighten-3 {
  color: #80cbc4 !important;
}

.teal.lighten-2 {
  background-color: #4db6ac !important;
}

.teal-text.text-lighten-2 {
  color: #4db6ac !important;
}

.teal.lighten-1 {
  background-color: #114B43 !important;
}

.teal-text.text-lighten-1 {
  color: #114B43 !important;
}

.teal.darken-1 {
  background-color: #00897b !important;
}

.teal-text.text-darken-1 {
  color: #00897b !important;
}

.teal.darken-2 {
  background-color: #00796b !important;
}

.teal-text.text-darken-2 {
  color: #00796b !important;
}

.teal.darken-3 {
  background-color: #00695c !important;
}

.teal-text.text-darken-3 {
  color: #00695c !important;
}

.teal.darken-4 {
  background-color: #004d40 !important;
}

.teal-text.text-darken-4 {
  color: #004d40 !important;
}

.teal.accent-1 {
  background-color: #a7ffeb !important;
}

.teal-text.text-accent-1 {
  color: #a7ffeb !important;
}

.teal.accent-2 {
  background-color: #64ffda !important;
}

.teal-text.text-accent-2 {
  color: #64ffda !important;
}

.teal.accent-3 {
  background-color: #1de9b6 !important;
}

.teal-text.text-accent-3 {
  color: #1de9b6 !important;
}

.teal.accent-4 {
  background-color: #00bfa5 !important;
}

.teal-text.text-accent-4 {
  color: #00bfa5 !important;
}

.green {
  background-color: #FAAC1A !important;
  color: #1A2421 !important;
}

.green-text {
  color: #114B43 !important;
}

.green.lighten-5 {
  background-color: #E8F5E9 !important;
}

.green-text.text-lighten-5 {
  color: #E8F5E9 !important;
}

.green.lighten-4 {
  background-color: #C8E6C9 !important;
}

.green-text.text-lighten-4 {
  color: #C8E6C9 !important;
}

.green.lighten-3 {
  background-color: #A5D6A7 !important;
}

.green-text.text-lighten-3 {
  color: #A5D6A7 !important;
}

.green.lighten-2 {
  background-color: #81C784 !important;
}

.green-text.text-lighten-2 {
  color: #81C784 !important;
}

.green.lighten-1 {
  background-color: #66BB6A !important;
}

.green-text.text-lighten-1 {
  color: #66BB6A !important;
}

.green.darken-1 {
  background-color: #43A047 !important;
}

.green-text.text-darken-1 {
  color: #43A047 !important;
}

.green.darken-2 {
  background-color: #388E3C !important;
}

.green-text.text-darken-2 {
  color: #388E3C !important;
}

.green.darken-3 {
  background-color: #2E7D32 !important;
}

.green-text.text-darken-3 {
  color: #2E7D32 !important;
}

.green.darken-4 {
  background-color: #1B5E20 !important;
}

.green-text.text-darken-4 {
  color: #1B5E20 !important;
}

.green.accent-1 {
  background-color: #B9F6CA !important;
}

.green-text.text-accent-1 {
  color: #B9F6CA !important;
}

.green.accent-2 {
  background-color: #69F0AE !important;
}

.green-text.text-accent-2 {
  color: #69F0AE !important;
}

.green.accent-3 {
  background-color: #00E676 !important;
}

.green-text.text-accent-3 {
  color: #00E676 !important;
}

.green.accent-4 {
  background-color: #00C853 !important;
}

.green-text.text-accent-4 {
  color: #00C853 !important;
}

.light-green {
  background-color: #8bc34a !important;
}

.light-green-text {
  color: #8bc34a !important;
}

.light-green.lighten-5 {
  background-color: #f1f8e9 !important;
}

.light-green-text.text-lighten-5 {
  color: #f1f8e9 !important;
}

.light-green.lighten-4 {
  background-color: #dcedc8 !important;
}

.light-green-text.text-lighten-4 {
  color: #dcedc8 !important;
}

.light-green.lighten-3 {
  background-color: #c5e1a5 !important;
}

.light-green-text.text-lighten-3 {
  color: #c5e1a5 !important;
}

.light-green.lighten-2 {
  background-color: #aed581 !important;
}

.light-green-text.text-lighten-2 {
  color: #aed581 !important;
}

.light-green.lighten-1 {
  background-color: #9ccc65 !important;
}

.light-green-text.text-lighten-1 {
  color: #9ccc65 !important;
}

.light-green.darken-1 {
  background-color: #7cb342 !important;
}

.light-green-text.text-darken-1 {
  color: #7cb342 !important;
}

.light-green.darken-2 {
  background-color: #689f38 !important;
}

.light-green-text.text-darken-2 {
  color: #689f38 !important;
}

.light-green.darken-3 {
  background-color: #558b2f !important;
}

.light-green-text.text-darken-3 {
  color: #558b2f !important;
}

.light-green.darken-4 {
  background-color: #33691e !important;
}

.light-green-text.text-darken-4 {
  color: #33691e !important;
}

.light-green.accent-1 {
  background-color: #ccff90 !important;
}

.light-green-text.text-accent-1 {
  color: #ccff90 !important;
}

.light-green.accent-2 {
  background-color: #b2ff59 !important;
}

.light-green-text.text-accent-2 {
  color: #b2ff59 !important;
}

.light-green.accent-3 {
  background-color: #76ff03 !important;
}

.light-green-text.text-accent-3 {
  color: #76ff03 !important;
}

.light-green.accent-4 {
  background-color: #64dd17 !important;
}

.light-green-text.text-accent-4 {
  color: #64dd17 !important;
}

.lime {
  background-color: #cddc39 !important;
}

.lime-text {
  color: #cddc39 !important;
}

.lime.lighten-5 {
  background-color: #f9fbe7 !important;
}

.lime-text.text-lighten-5 {
  color: #f9fbe7 !important;
}

.lime.lighten-4 {
  background-color: #f0f4c3 !important;
}

.lime-text.text-lighten-4 {
  color: #f0f4c3 !important;
}

.lime.lighten-3 {
  background-color: #e6ee9c !important;
}

.lime-text.text-lighten-3 {
  color: #e6ee9c !important;
}

.lime.lighten-2 {
  background-color: #dce775 !important;
}

.lime-text.text-lighten-2 {
  color: #dce775 !important;
}

.lime.lighten-1 {
  background-color: #d4e157 !important;
}

.lime-text.text-lighten-1 {
  color: #d4e157 !important;
}

.lime.darken-1 {
  background-color: #c0ca33 !important;
}

.lime-text.text-darken-1 {
  color: #c0ca33 !important;
}

.lime.darken-2 {
  background-color: #afb42b !important;
}

.lime-text.text-darken-2 {
  color: #afb42b !important;
}

.lime.darken-3 {
  background-color: #9e9d24 !important;
}

.lime-text.text-darken-3 {
  color: #9e9d24 !important;
}

.lime.darken-4 {
  background-color: #827717 !important;
}

.lime-text.text-darken-4 {
  color: #827717 !important;
}

.lime.accent-1 {
  background-color: #f4ff81 !important;
}

.lime-text.text-accent-1 {
  color: #f4ff81 !important;
}

.lime.accent-2 {
  background-color: #eeff41 !important;
}

.lime-text.text-accent-2 {
  color: #eeff41 !important;
}

.lime.accent-3 {
  background-color: #c6ff00 !important;
}

.lime-text.text-accent-3 {
  color: #c6ff00 !important;
}

.lime.accent-4 {
  background-color: #aeea00 !important;
}

.lime-text.text-accent-4 {
  color: #aeea00 !important;
}

.yellow {
  background-color: #ffeb3b !important;
}

.yellow-text {
  color: #ffeb3b !important;
}

.yellow.lighten-5 {
  background-color: #fffde7 !important;
}

.yellow-text.text-lighten-5 {
  color: #fffde7 !important;
}

.yellow.lighten-4 {
  background-color: #fff9c4 !important;
}

.yellow-text.text-lighten-4 {
  color: #fff9c4 !important;
}

.yellow.lighten-3 {
  background-color: #fff59d !important;
}

.yellow-text.text-lighten-3 {
  color: #fff59d !important;
}

.yellow.lighten-2 {
  background-color: #fff176 !important;
}

.yellow-text.text-lighten-2 {
  color: #fff176 !important;
}

.yellow.lighten-1 {
  background-color: #ffee58 !important;
}

.yellow-text.text-lighten-1 {
  color: #ffee58 !important;
}

.yellow.darken-1 {
  background-color: #fdd835 !important;
}

.yellow-text.text-darken-1 {
  color: #fdd835 !important;
}

.yellow.darken-2 {
  background-color: #fbc02d !important;
}

.yellow-text.text-darken-2 {
  color: #fbc02d !important;
}

.yellow.darken-3 {
  background-color: #f9a825 !important;
}

.yellow-text.text-darken-3 {
  color: #f9a825 !important;
}

.yellow.darken-4 {
  background-color: #f57f17 !important;
}

.yellow-text.text-darken-4 {
  color: #f57f17 !important;
}

.yellow.accent-1 {
  background-color: #ffff8d !important;
}

.yellow-text.text-accent-1 {
  color: #ffff8d !important;
}

.yellow.accent-2 {
  background-color: #ffff00 !important;
}

.yellow-text.text-accent-2 {
  color: #ffff00 !important;
}

.yellow.accent-3 {
  background-color: #ffea00 !important;
}

.yellow-text.text-accent-3 {
  color: #ffea00 !important;
}

.yellow.accent-4 {
  background-color: #ffd600 !important;
}

.yellow-text.text-accent-4 {
  color: #ffd600 !important;
}

.amber {
  background-color: #ffc107 !important;
}

.amber-text {
  color: #ffc107 !important;
}

.amber.lighten-5 {
  background-color: #fff8e1 !important;
}

.amber-text.text-lighten-5 {
  color: #fff8e1 !important;
}

.amber.lighten-4 {
  background-color: #ffecb3 !important;
}

.amber-text.text-lighten-4 {
  color: #ffecb3 !important;
}

.amber.lighten-3 {
  background-color: #ffe082 !important;
}

.amber-text.text-lighten-3 {
  color: #ffe082 !important;
}

.amber.lighten-2 {
  background-color: #ffd54f !important;
}

.amber-text.text-lighten-2 {
  color: #ffd54f !important;
}

.amber.lighten-1 {
  background-color: #ffca28 !important;
}

.amber-text.text-lighten-1 {
  color: #ffca28 !important;
}

.amber.darken-1 {
  background-color: #ffb300 !important;
}

.amber-text.text-darken-1 {
  color: #ffb300 !important;
}

.amber.darken-2 {
  background-color: #ffa000 !important;
}

.amber-text.text-darken-2 {
  color: #ffa000 !important;
}

.amber.darken-3 {
  background-color: #ff8f00 !important;
}

.amber-text.text-darken-3 {
  color: #ff8f00 !important;
}

.amber.darken-4 {
  background-color: #ff6f00 !important;
}

.amber-text.text-darken-4 {
  color: #ff6f00 !important;
}

.amber.accent-1 {
  background-color: #ffe57f !important;
}

.amber-text.text-accent-1 {
  color: #ffe57f !important;
}

.amber.accent-2 {
  background-color: #ffd740 !important;
}

.amber-text.text-accent-2 {
  color: #ffd740 !important;
}

.amber.accent-3 {
  background-color: #ffc400 !important;
}

.amber-text.text-accent-3 {
  color: #ffc400 !important;
}

.amber.accent-4 {
  background-color: #ffab00 !important;
}

.amber-text.text-accent-4 {
  color: #ffab00 !important;
}

.orange {
  background-color: #ff9800 !important;
}

.orange-text {
  color: #ff9800 !important;
}

.orange.lighten-5 {
  background-color: #fff3e0 !important;
}

.orange-text.text-lighten-5 {
  color: #fff3e0 !important;
}

.orange.lighten-4 {
  background-color: #ffe0b2 !important;
}

.orange-text.text-lighten-4 {
  color: #ffe0b2 !important;
}

.orange.lighten-3 {
  background-color: #ffcc80 !important;
}

.orange-text.text-lighten-3 {
  color: #ffcc80 !important;
}

.orange.lighten-2 {
  background-color: #ffb74d !important;
}

.orange-text.text-lighten-2 {
  color: #ffb74d !important;
}

.orange.lighten-1 {
  background-color: #ffa726 !important;
}

.orange-text.text-lighten-1 {
  color: #ffa726 !important;
}

.orange.darken-1 {
  background-color: #fb8c00 !important;
}

.orange-text.text-darken-1 {
  color: #fb8c00 !important;
}

.orange.darken-2 {
  background-color: #f57c00 !important;
}

.orange-text.text-darken-2 {
  color: #f57c00 !important;
}

.orange.darken-3 {
  background-color: #ef6c00 !important;
}

.orange-text.text-darken-3 {
  color: #ef6c00 !important;
}

.orange.darken-4 {
  background-color: #e65100 !important;
}

.orange-text.text-darken-4 {
  color: #e65100 !important;
}

.orange.accent-1 {
  background-color: #ffd180 !important;
}

.orange-text.text-accent-1 {
  color: #ffd180 !important;
}

.orange.accent-2 {
  background-color: #ffab40 !important;
}

.orange-text.text-accent-2 {
  color: #ffab40 !important;
}

.orange.accent-3 {
  background-color: #ff9100 !important;
}

.orange-text.text-accent-3 {
  color: #ff9100 !important;
}

.orange.accent-4 {
  background-color: #ff6d00 !important;
}

.orange-text.text-accent-4 {
  color: #ff6d00 !important;
}

.deep-orange {
  background-color: #ff5722 !important;
}

.deep-orange-text {
  color: #ff5722 !important;
}

.deep-orange.lighten-5 {
  background-color: #fbe9e7 !important;
}

.deep-orange-text.text-lighten-5 {
  color: #fbe9e7 !important;
}

.deep-orange.lighten-4 {
  background-color: #ffccbc !important;
}

.deep-orange-text.text-lighten-4 {
  color: #ffccbc !important;
}

.deep-orange.lighten-3 {
  background-color: #ffab91 !important;
}

.deep-orange-text.text-lighten-3 {
  color: #ffab91 !important;
}

.deep-orange.lighten-2 {
  background-color: #ff8a65 !important;
}

.deep-orange-text.text-lighten-2 {
  color: #ff8a65 !important;
}

.deep-orange.lighten-1 {
  background-color: #ff7043 !important;
}

.deep-orange-text.text-lighten-1 {
  color: #ff7043 !important;
}

.deep-orange.darken-1 {
  background-color: #f4511e !important;
}

.deep-orange-text.text-darken-1 {
  color: #f4511e !important;
}

.deep-orange.darken-2 {
  background-color: #e64a19 !important;
}

.deep-orange-text.text-darken-2 {
  color: #e64a19 !important;
}

.deep-orange.darken-3 {
  background-color: #d84315 !important;
}

.deep-orange-text.text-darken-3 {
  color: #d84315 !important;
}

.deep-orange.darken-4 {
  background-color: #bf360c !important;
}

.deep-orange-text.text-darken-4 {
  color: #bf360c !important;
}

.deep-orange.accent-1 {
  background-color: #ff9e80 !important;
}

.deep-orange-text.text-accent-1 {
  color: #ff9e80 !important;
}

.deep-orange.accent-2 {
  background-color: #ff6e40 !important;
}

.deep-orange-text.text-accent-2 {
  color: #ff6e40 !important;
}

.deep-orange.accent-3 {
  background-color: #ff3d00 !important;
}

.deep-orange-text.text-accent-3 {
  color: #ff3d00 !important;
}

.deep-orange.accent-4 {
  background-color: #dd2c00 !important;
}

.deep-orange-text.text-accent-4 {
  color: #dd2c00 !important;
}

.brown {
  background-color: #795548 !important;
}

.brown-text {
  color: #795548 !important;
}

.brown.lighten-5 {
  background-color: #efebe9 !important;
}

.brown-text.text-lighten-5 {
  color: #efebe9 !important;
}

.brown.lighten-4 {
  background-color: #d7ccc8 !important;
}

.brown-text.text-lighten-4 {
  color: #d7ccc8 !important;
}

.brown.lighten-3 {
  background-color: #bcaaa4 !important;
}

.brown-text.text-lighten-3 {
  color: #bcaaa4 !important;
}

.brown.lighten-2 {
  background-color: #a1887f !important;
}

.brown-text.text-lighten-2 {
  color: #a1887f !important;
}

.brown.lighten-1 {
  background-color: #8d6e63 !important;
}

.brown-text.text-lighten-1 {
  color: #8d6e63 !important;
}

.brown.darken-1 {
  background-color: #6d4c41 !important;
}

.brown-text.text-darken-1 {
  color: #6d4c41 !important;
}

.brown.darken-2 {
  background-color: #5d4037 !important;
}

.brown-text.text-darken-2 {
  color: #5d4037 !important;
}

.brown.darken-3 {
  background-color: #4e342e !important;
}

.brown-text.text-darken-3 {
  color: #4e342e !important;
}

.brown.darken-4 {
  background-color: #3e2723 !important;
}

.brown-text.text-darken-4 {
  color: #3e2723 !important;
}

.blue-grey {
  background-color: #607d8b !important;
}

.blue-grey-text {
  color: #607d8b !important;
}

.blue-grey.lighten-5 {
  background-color: #eceff1 !important;
}

.blue-grey-text.text-lighten-5 {
  color: #eceff1 !important;
}

.blue-grey.lighten-4 {
  background-color: #cfd8dc !important;
}

.blue-grey-text.text-lighten-4 {
  color: #cfd8dc !important;
}

.blue-grey.lighten-3 {
  background-color: #b0bec5 !important;
}

.blue-grey-text.text-lighten-3 {
  color: #b0bec5 !important;
}

.blue-grey.lighten-2 {
  background-color: #90a4ae !important;
}

.blue-grey-text.text-lighten-2 {
  color: #90a4ae !important;
}

.blue-grey.lighten-1 {
  background-color: #78909c !important;
}

.blue-grey-text.text-lighten-1 {
  color: #78909c !important;
}

.blue-grey.darken-1 {
  background-color: #546e7a !important;
}

.blue-grey-text.text-darken-1 {
  color: #546e7a !important;
}

.blue-grey.darken-2 {
  background-color: #455a64 !important;
}

.blue-grey-text.text-darken-2 {
  color: #455a64 !important;
}

.blue-grey.darken-3 {
  background-color: #37474f !important;
}

.blue-grey-text.text-darken-3 {
  color: #37474f !important;
}

.blue-grey.darken-4 {
  background-color: #263238 !important;
}

.blue-grey-text.text-darken-4 {
  color: #263238 !important;
}

.grey {
  background-color: #9e9e9e !important;
}

.grey-text {
  color: #9e9e9e !important;
}

.grey.lighten-5 {
  background-color: #fafafa !important;
}

.grey-text.text-lighten-5 {
  color: #fafafa !important;
}

.grey.lighten-4 {
  background-color: #f5f5f5 !important;
}

.grey-text.text-lighten-4 {
  color: #f5f5f5 !important;
}

.grey.lighten-3 {
  background-color: #eeeeee !important;
}

.grey-text.text-lighten-3 {
  color: #eeeeee !important;
}

.grey.lighten-2 {
  background-color: #e0e0e0 !important;
}

.grey-text.text-lighten-2 {
  color: #e0e0e0 !important;
}

.grey.lighten-1 {
  background-color: #bdbdbd !important;
}

.grey-text.text-lighten-1 {
  color: #bdbdbd !important;
}

.grey.darken-1 {
  background-color: #757575 !important;
}

.grey-text.text-darken-1 {
  color: #757575 !important;
}

.grey.darken-2 {
  background-color: #616161 !important;
}

.grey-text.text-darken-2 {
  color: #616161 !important;
}

.grey.darken-3 {
  background-color: #424242 !important;
}

.grey-text.text-darken-3 {
  color: #424242 !important;
}

.grey.darken-4 {
  background-color: #212121 !important;
}

.grey-text.text-darken-4 {
  color: #212121 !important;
}

.black {
  background-color: #000000 !important;
}

.black-text {
  color: #000000 !important;
}

.white {
  background-color: #FFFFFF !important;
}

.white-text {
  color: #FFFFFF !important;
}

.transparent {
  background-color: transparent !important;
}

.transparent-text {
  color: transparent !important;
}

/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */

html {
  line-height: 1.15;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/* Sections
   ========================================================================== */

body {
  margin: 0;
}


article,
aside,
footer,
header,
nav,
section {
  display: block;
}


h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

figcaption,
figure,
main {
  /* 1 */
  display: block;
}


figure {
  margin: 1em 40px;
}


hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}


pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/* Text-level semantics
   ========================================================================== */

a {
  background-color: transparent;
  /* 1 */
  -webkit-text-decoration-skip: objects;
  /* 2 */
}


abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  -webkit-text-decoration: underline dotted;
     -moz-text-decoration: underline dotted;
          text-decoration: underline dotted;
  /* 2 */
}


b,
strong {
  font-weight: inherit;
}


b,
strong {
  font-weight: bolder;
}


code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}


dfn {
  font-style: italic;
}


mark {
  background-color: #ff0;
  color: #000;
}


small {
  font-size: 80%;
}


sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

audio,
video {
  display: inline-block;
}


audio:not([controls]) {
  display: none;
  height: 0;
}


img {
  border-style: none;
}


svg:not(:root) {
  overflow: hidden;
}

/* Forms
   ========================================================================== */

button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}


button,
input {
  /* 1 */
  overflow: visible;
}


button,
select {
  /* 1 */
  text-transform: none;
}


button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
}


button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}


button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}


fieldset {
  padding: 0.35em 0.75em 0.625em;
}


legend {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}


progress {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}


textarea {
  overflow: auto;
}


[type="checkbox"],
[type="radio"] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}


[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}


[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}


[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}


::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */
details,
menu {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Scripting
   ========================================================================== */

canvas {
  display: inline-block;
}


template {
  display: none;
}

/* Hidden
   ========================================================================== */

[hidden] {
  display: none;
}

html {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

*, *:before, *:after {
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
}

button,
input,
optgroup,
select,
textarea {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

ul:not(.browser-default) {
  padding-left: 0;
  list-style-type: none;
}

ul:not(.browser-default) > li {
  list-style-type: none;
}

a {
  color: #114B43;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}

.valign-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.clearfix {
  clear: both;
}

.z-depth-0 {
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
}

/* 2dp elevation modified*/
.z-depth-1, nav, .card-panel, .card, .toast, .btn, .btn-large, .btn-small, .btn-floating, .dropdown-content, .collapsible, .sidenav {
  -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}

.z-depth-1-half, .btn:hover, .btn-large:hover, .btn-small:hover, .btn-floating:hover {
  -webkit-box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
          box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
}

/* 6dp elevation modified*/
.z-depth-2 {
  -webkit-box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
          box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
}

/* 12dp elevation modified*/
.z-depth-3 {
  -webkit-box-shadow: 0 8px 17px 2px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
          box-shadow: 0 8px 17px 2px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
}

/* 16dp elevation */
.z-depth-4 {
  -webkit-box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -7px rgba(0, 0, 0, 0.2);
          box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -7px rgba(0, 0, 0, 0.2);
}

/* 24dp elevation */
.z-depth-5, .modal {
  -webkit-box-shadow: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
          box-shadow: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
}

.hoverable {
  -webkit-transition: -webkit-box-shadow .25s;
  transition: -webkit-box-shadow .25s;
  transition: box-shadow .25s;
  transition: box-shadow .25s, -webkit-box-shadow .25s;
}

.hoverable:hover {
  -webkit-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
          box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.divider {
  height: 1px;
  overflow: hidden;
  background-color: #e0e0e0;
}

blockquote {
  margin: 20px 0;
  padding-left: 1.5rem;
  border-left: 5px solid #ee6e73;
}

i {
  line-height: inherit;
}

i.left {
  float: left;
  margin-right: 15px;
}

i.right {
  float: right;
  margin-left: 15px;
}

i.tiny {
  font-size: 1rem;
}

i.small {
  font-size: 2rem;
}

i.medium {
  font-size: 4rem;
}

i.large {
  font-size: 6rem;
}

img.responsive-img,
video.responsive-video {
  max-width: 100%;
  height: auto;
}

.pagination li {
  display: inline-block;
  border-radius: 2px;
  text-align: center;
  vertical-align: top;
  height: 30px;
}

.pagination li a {
  color: #444;
  display: inline-block;
  font-size: 1.2rem;
  padding: 0 10px;
  line-height: 30px;
}

.pagination li.active a {
  color: #fff;
}

.pagination li.active {
  background-color: #ee6e73;
}

.pagination li.disabled a {
  cursor: default;
  color: #999;
}

.pagination li i {
  font-size: 2rem;
}

.pagination li.pages ul li {
  display: inline-block;
  float: none;
}

@media only screen and (max-width: 992px) {
  .pagination {
    width: 100%;
  }
  .pagination li.prev,
  .pagination li.next {
    width: 10%;
  }
  .pagination li.pages {
    width: 80%;
    overflow: hidden;
    white-space: nowrap;
  }
}

.breadcrumb {
  font-size: 18px;
  color: rgba(255, 255, 255, 0.7);
}

.breadcrumb i,
.breadcrumb [class^="mdi-"], .breadcrumb [class*="mdi-"],
.breadcrumb i.material-icons {
  display: inline-block;
  float: left;
  font-size: 24px;
}

.breadcrumb:before {
  content: '\E5CC';
  color: rgba(255, 255, 255, 0.7);
  vertical-align: top;
  display: inline-block;
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 25px;
  margin: 0 10px 0 8px;
  -webkit-font-smoothing: antialiased;
}

.breadcrumb:first-child:before {
  display: none;
}

.breadcrumb:last-child {
  color: #fff;
}

.parallax-container {
  position: relative;
  overflow: hidden;
  height: 500px;
}

.parallax-container .parallax {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
}

.parallax-container .parallax img {
  opacity: 0;
  position: absolute;
  left: 50%;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.pin-top, .pin-bottom {
  position: relative;
}

.pinned {
  position: fixed !important;
}


ul.staggered-list li {
  opacity: 0;
}

.fade-in {
  opacity: 0;
  -webkit-transform-origin: 0 50%;
          transform-origin: 0 50%;
}


@media only screen and (max-width: 600px) {
  .hide-on-small-only, .hide-on-small-and-down {
    display: none !important;
  }
}

@media only screen and (max-width: 992px) {
  .hide-on-med-and-down {
    display: none !important;
  }
}

@media only screen and (min-width: 601px) {
  .hide-on-med-and-up {
    display: none !important;
  }
}

@media only screen and (min-width: 600px) and (max-width: 992px) {
  .hide-on-med-only {
    display: none !important;
  }
}

@media only screen and (min-width: 993px) {
  .hide-on-large-only {
    display: none !important;
  }
}

@media only screen and (min-width: 1201px) {
  .hide-on-extra-large-only {
    display: none !important;
  }
}

@media only screen and (min-width: 1201px) {
  .show-on-extra-large {
    display: block !important;
  }
}

@media only screen and (min-width: 993px) {
  .show-on-large {
    display: block !important;
  }
}

@media only screen and (min-width: 600px) and (max-width: 992px) {
  .show-on-medium {
    display: block !important;
  }
}

@media only screen and (max-width: 600px) {
  .show-on-small {
    display: block !important;
  }
}

@media only screen and (min-width: 601px) {
  .show-on-medium-and-up {
    display: block !important;
  }
}

@media only screen and (max-width: 992px) {
  .show-on-medium-and-down {
    display: block !important;
  }
}

@media only screen and (max-width: 600px) {
  .center-on-small-only {
    text-align: center;
  }
}

.page-footer {
  padding-top: 20px;
  color: #fff;
  background-color: #ee6e73;
}

.page-footer .footer-copyright {
  overflow: hidden;
  min-height: 50px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 10px 0px;
  color: rgba(255, 255, 255, 0.8);
  background-color: rgba(51, 51, 51, 0.08);
}

table, th, td {
  border: none;
}

table {
  width: 100%;
  display: table;
  border-collapse: collapse;
  border-spacing: 0;
}

table.striped tr {
  border-bottom: none;
}

table.striped > tbody > tr:nth-child(odd) {
  background-color: rgba(242, 242, 242, 0.5);
}

table.striped > tbody > tr > td {
  border-radius: 0;
}

table.highlight > tbody > tr {
  -webkit-transition: background-color .25s ease;
  transition: background-color .25s ease;
}

table.highlight > tbody > tr:hover {
  background-color: rgba(242, 242, 242, 0.5);
}

table.centered thead tr th, table.centered tbody tr td {
  text-align: center;
}

tr {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

td, th {
  padding: 15px 5px;
  display: table-cell;
  text-align: left;
  vertical-align: middle;
  border-radius: 2px;
}

@media only screen and (max-width: 992px) {
  table.responsive-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    display: block;
    position: relative;
    /* sort out borders */
  }
  table.responsive-table td:empty:before {
    content: '\00a0';
  }
  table.responsive-table th,
  table.responsive-table td {
    margin: 0;
    vertical-align: top;
  }
  table.responsive-table th {
    text-align: left;
  }
  table.responsive-table thead {
    display: block;
    float: left;
  }
  table.responsive-table thead tr {
    display: block;
    padding: 0 10px 0 0;
  }
  table.responsive-table thead tr th::before {
    content: "\00a0";
  }
  table.responsive-table tbody {
    display: block;
    width: auto;
    position: relative;
    overflow-x: auto;
    white-space: nowrap;
  }
  table.responsive-table tbody tr {
    display: inline-block;
    vertical-align: top;
  }
  table.responsive-table th {
    display: block;
    text-align: right;
  }
  table.responsive-table td {
    display: block;
    min-height: 1.25em;
    text-align: left;
  }
  table.responsive-table tr {
    border-bottom: none;
    padding: 0 10px;
  }
  table.responsive-table thead {
    border: 0;
    border-right: 1px solid rgba(0, 0, 0, 0.12);
  }
}

.collection {
  margin: 0.5rem 0 1rem 0;
  border: 1px solid #e0e0e0;
  border-radius: 2px;
  overflow: hidden;
  position: relative;
}

.collection .collection-item {
  background-color: #fff;
  line-height: 1.5rem;
  padding: 10px 20px;
  margin: 0;
  border-bottom: 1px solid #e0e0e0;
}

.collection .collection-item.avatar {
  min-height: 84px;
  padding-left: 72px;
  position: relative;
}

.collection .collection-item.avatar:not(.circle-clipper) > .circle,
.collection .collection-item.avatar :not(.circle-clipper) > .circle {
  position: absolute;
  width: 42px;
  height: 42px;
  overflow: hidden;
  left: 15px;
  display: inline-block;
  vertical-align: middle;
}

.collection .collection-item.avatar i.circle {
  font-size: 18px;
  line-height: 42px;
  color: #fff;
  background-color: #999;
  text-align: center;
}

.collection .collection-item.avatar .title {
  font-size: 16px;
}

.collection .collection-item.avatar p {
  margin: 0;
}

.collection .collection-item.avatar .secondary-content {
  position: absolute;
  top: 16px;
  right: 16px;
}

.collection .collection-item:last-child {
  border-bottom: none;
}

.collection .collection-item.active {
  background-color: #114B43;
  color: #eafaf9;
}

.collection .collection-item.active .secondary-content {
  color: #fff;
}

.collection a.collection-item {
  display: block;
  -webkit-transition: .25s;
  transition: .25s;
  color: #114B43;
}

.collection a.collection-item:not(.active):hover {
  background-color: #ddd;
}

.collection.with-header .collection-header {
  background-color: #fff;
  border-bottom: 1px solid #e0e0e0;
  padding: 10px 20px;
}

.collection.with-header .collection-item {
  padding-left: 30px;
}

.collection.with-header .collection-item.avatar {
  padding-left: 72px;
}

.secondary-content {
  float: right;
  color: #114B43;
}

.collapsible .collection {
  margin: 0;
  border: none;
}

.video-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.video-container iframe, .video-container object, .video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.progress {
  position: relative;
  height: 4px;
  display: block;
  width: 100%;
  background-color: #82C55D;
  border-radius: 2px;
  margin: 0.5rem 0 1rem 0;
  overflow: hidden;
}

.progress .determinate {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  background-color: #114B43;
  -webkit-transition: width .3s linear;
  transition: width .3s linear;
}

.progress .indeterminate {
  background-color: #114B43;
}

.progress .indeterminate:before {
  content: '';
  position: absolute;
  background-color: inherit;
  top: 0;
  left: 0;
  bottom: 0;
  will-change: left, right;
  -webkit-animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
          animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
}

.progress .indeterminate:after {
  content: '';
  position: absolute;
  background-color: inherit;
  top: 0;
  left: 0;
  bottom: 0;
  will-change: left, right;
  -webkit-animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
          animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
  -webkit-animation-delay: 1.15s;
          animation-delay: 1.15s;
}

@-webkit-keyframes indeterminate {
  0% {
    left: -35%;
    right: 100%;
  }
  60% {
    left: 100%;
    right: -90%;
  }
  100% {
    left: 100%;
    right: -90%;
  }
}

@keyframes indeterminate {
  0% {
    left: -35%;
    right: 100%;
  }
  60% {
    left: 100%;
    right: -90%;
  }
  100% {
    left: 100%;
    right: -90%;
  }
}

@-webkit-keyframes indeterminate-short {
  0% {
    left: -200%;
    right: 100%;
  }
  60% {
    left: 107%;
    right: -8%;
  }
  100% {
    left: 107%;
    right: -8%;
  }
}

@keyframes indeterminate-short {
  0% {
    left: -200%;
    right: 100%;
  }
  60% {
    left: 107%;
    right: -8%;
  }
  100% {
    left: 107%;
    right: -8%;
  }
}


.hide {
  display: none !important;
}

.left-align {
  text-align: left;
}

.right-align {
  text-align: right;
}

.center, .center-align {
  text-align: center;
}

.left {
  float: left !important;
}

.right {
  float: right !important;
}

.no-select, input[type=range],
input[type=range] + .thumb {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.circle {
  border-radius: 50%;
}

.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.truncate {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.no-padding {
  padding: 0 !important;
}

span.badge {
  min-width: 3rem;
  padding: 0 6px;
  margin-left: 14px;
  text-align: center;
  font-size: 1rem;
  line-height: 22px;
  height: 22px;
  color: #757575;
  float: right;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

span.badge.new {
  font-weight: 300;
  font-size: 0.8rem;
  color: #fff;
  background-color: #114B43;
  border-radius: 2px;
}

span.badge.new:after {
  content: " new";
}

span.badge[data-badge-caption]::after {
  content: " " attr(data-badge-caption);
}

nav ul a span.badge {
  display: inline-block;
  float: none;
  margin-left: 4px;
  line-height: 22px;
  height: 22px;
  -webkit-font-smoothing: auto;
}

.collection-item span.badge {
  margin-top: calc(0.75rem - 11px);
}

.collapsible span.badge {
  margin-left: auto;
}

.sidenav span.badge {
  margin-top: calc(24px - 11px);
}

table span.badge {
  display: inline-block;
  float: none;
  margin-left: auto;
}

/* This is needed for some mobile phones to display the Google Icon font properly */
.material-icons {
  text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}

.container {
  margin: 0 auto;
  width: 100%;
}

@media only screen and (min-width: 601px) {
  .container {
    max-width: 580px;
  }
}

@media only screen and (min-width: 1025px) {
  .container {
    max-width: 1005px;
  }
}

@media only screen and (min-width: 1300px) {
  .container {
    max-width: 1280px;
  }
}

.col .row {
  margin-left: -0.75rem;
  margin-right: -0.75rem;
}

.section {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.section.no-pad {
  padding: 0;
}

.section.no-pad-bot {
  padding-bottom: 0;
}

.section.no-pad-top {
  padding-top: 0;
}

.row {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

.row .col {
  float: left;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0 0.75rem;
  min-height: 1px;
}

.row .col[class*="push-"], .row .col[class*="pull-"] {
  position: relative;
}

.row .col.s1 {
  width: 8.3333333333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s2 {
  width: 16.6666666667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s3 {
  width: 25%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s4 {
  width: 33.3333333333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s5 {
  width: 41.6666666667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s6 {
  width: 50%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s7 {
  width: 58.3333333333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s8 {
  width: 66.6666666667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s9 {
  width: 75%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s10 {
  width: 83.3333333333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s11 {
  width: 91.6666666667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s12 {
  width: 100%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.offset-s1 {
  margin-left: 8.3333333333%;
}

.row .col.pull-s1 {
  right: 8.3333333333%;
}

.row .col.push-s1 {
  left: 8.3333333333%;
}

.row .col.offset-s2 {
  margin-left: 16.6666666667%;
}

.row .col.pull-s2 {
  right: 16.6666666667%;
}

.row .col.push-s2 {
  left: 16.6666666667%;
}

.row .col.offset-s3 {
  margin-left: 25%;
}

.row .col.pull-s3 {
  right: 25%;
}

.row .col.push-s3 {
  left: 25%;
}

.row .col.offset-s4 {
  margin-left: 33.3333333333%;
}

.row .col.pull-s4 {
  right: 33.3333333333%;
}

.row .col.push-s4 {
  left: 33.3333333333%;
}

.row .col.offset-s5 {
  margin-left: 41.6666666667%;
}

.row .col.pull-s5 {
  right: 41.6666666667%;
}

.row .col.push-s5 {
  left: 41.6666666667%;
}

.row .col.offset-s6 {
  margin-left: 50%;
}

.row .col.pull-s6 {
  right: 50%;
}

.row .col.push-s6 {
  left: 50%;
}

.row .col.offset-s7 {
  margin-left: 58.3333333333%;
}

.row .col.pull-s7 {
  right: 58.3333333333%;
}

.row .col.push-s7 {
  left: 58.3333333333%;
}

.row .col.offset-s8 {
  margin-left: 66.6666666667%;
}

.row .col.pull-s8 {
  right: 66.6666666667%;
}

.row .col.push-s8 {
  left: 66.6666666667%;
}

.row .col.offset-s9 {
  margin-left: 75%;
}

.row .col.pull-s9 {
  right: 75%;
}

.row .col.push-s9 {
  left: 75%;
}

.row .col.offset-s10 {
  margin-left: 83.3333333333%;
}

.row .col.pull-s10 {
  right: 83.3333333333%;
}

.row .col.push-s10 {
  left: 83.3333333333%;
}

.row .col.offset-s11 {
  margin-left: 91.6666666667%;
}

.row .col.pull-s11 {
  right: 91.6666666667%;
}

.row .col.push-s11 {
  left: 91.6666666667%;
}

.row .col.offset-s12 {
  margin-left: 100%;
}

.row .col.pull-s12 {
  right: 100%;
}

.row .col.push-s12 {
  left: 100%;
}

@media only screen and (min-width: 601px) {
  .row .col.m1 {
    width: 8.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m2 {
    width: 16.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m3 {
    width: 25%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m4 {
    width: 33.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m5 {
    width: 41.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m6 {
    width: 50%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m7 {
    width: 58.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m8 {
    width: 66.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m9 {
    width: 75%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m10 {
    width: 83.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m11 {
    width: 91.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m12 {
    width: 100%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.offset-m1 {
    margin-left: 8.3333333333%;
  }
  .row .col.pull-m1 {
    right: 8.3333333333%;
  }
  .row .col.push-m1 {
    left: 8.3333333333%;
  }
  .row .col.offset-m2 {
    margin-left: 16.6666666667%;
  }
  .row .col.pull-m2 {
    right: 16.6666666667%;
  }
  .row .col.push-m2 {
    left: 16.6666666667%;
  }
  .row .col.offset-m3 {
    margin-left: 25%;
  }
  .row .col.pull-m3 {
    right: 25%;
  }
  .row .col.push-m3 {
    left: 25%;
  }
  .row .col.offset-m4 {
    margin-left: 33.3333333333%;
  }
  .row .col.pull-m4 {
    right: 33.3333333333%;
  }
  .row .col.push-m4 {
    left: 33.3333333333%;
  }
  .row .col.offset-m5 {
    margin-left: 41.6666666667%;
  }
  .row .col.pull-m5 {
    right: 41.6666666667%;
  }
  .row .col.push-m5 {
    left: 41.6666666667%;
  }
  .row .col.offset-m6 {
    margin-left: 50%;
  }
  .row .col.pull-m6 {
    right: 50%;
  }
  .row .col.push-m6 {
    left: 50%;
  }
  .row .col.offset-m7 {
    margin-left: 58.3333333333%;
  }
  .row .col.pull-m7 {
    right: 58.3333333333%;
  }
  .row .col.push-m7 {
    left: 58.3333333333%;
  }
  .row .col.offset-m8 {
    margin-left: 66.6666666667%;
  }
  .row .col.pull-m8 {
    right: 66.6666666667%;
  }
  .row .col.push-m8 {
    left: 66.6666666667%;
  }
  .row .col.offset-m9 {
    margin-left: 75%;
  }
  .row .col.pull-m9 {
    right: 75%;
  }
  .row .col.push-m9 {
    left: 75%;
  }
  .row .col.offset-m10 {
    margin-left: 83.3333333333%;
  }
  .row .col.pull-m10 {
    right: 83.3333333333%;
  }
  .row .col.push-m10 {
    left: 83.3333333333%;
  }
  .row .col.offset-m11 {
    margin-left: 91.6666666667%;
  }
  .row .col.pull-m11 {
    right: 91.6666666667%;
  }
  .row .col.push-m11 {
    left: 91.6666666667%;
  }
  .row .col.offset-m12 {
    margin-left: 100%;
  }
  .row .col.pull-m12 {
    right: 100%;
  }
  .row .col.push-m12 {
    left: 100%;
  }
}

@media only screen and (min-width: 993px) {
  .row .col.l1 {
    width: 8.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l2 {
    width: 16.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l3 {
    width: 25%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l4 {
    width: 33.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l5 {
    width: 41.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l6 {
    width: 50%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l7 {
    width: 58.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l8 {
    width: 66.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l9 {
    width: 75%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l10 {
    width: 83.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l11 {
    width: 91.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l12 {
    width: 100%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.offset-l1 {
    margin-left: 8.3333333333%;
  }
  .row .col.pull-l1 {
    right: 8.3333333333%;
  }
  .row .col.push-l1 {
    left: 8.3333333333%;
  }
  .row .col.offset-l2 {
    margin-left: 16.6666666667%;
  }
  .row .col.pull-l2 {
    right: 16.6666666667%;
  }
  .row .col.push-l2 {
    left: 16.6666666667%;
  }
  .row .col.offset-l3 {
    margin-left: 25%;
  }
  .row .col.pull-l3 {
    right: 25%;
  }
  .row .col.push-l3 {
    left: 25%;
  }
  .row .col.offset-l4 {
    margin-left: 33.3333333333%;
  }
  .row .col.pull-l4 {
    right: 33.3333333333%;
  }
  .row .col.push-l4 {
    left: 33.3333333333%;
  }
  .row .col.offset-l5 {
    margin-left: 41.6666666667%;
  }
  .row .col.pull-l5 {
    right: 41.6666666667%;
  }
  .row .col.push-l5 {
    left: 41.6666666667%;
  }
  .row .col.offset-l6 {
    margin-left: 50%;
  }
  .row .col.pull-l6 {
    right: 50%;
  }
  .row .col.push-l6 {
    left: 50%;
  }
  .row .col.offset-l7 {
    margin-left: 58.3333333333%;
  }
  .row .col.pull-l7 {
    right: 58.3333333333%;
  }
  .row .col.push-l7 {
    left: 58.3333333333%;
  }
  .row .col.offset-l8 {
    margin-left: 66.6666666667%;
  }
  .row .col.pull-l8 {
    right: 66.6666666667%;
  }
  .row .col.push-l8 {
    left: 66.6666666667%;
  }
  .row .col.offset-l9 {
    margin-left: 75%;
  }
  .row .col.pull-l9 {
    right: 75%;
  }
  .row .col.push-l9 {
    left: 75%;
  }
  .row .col.offset-l10 {
    margin-left: 83.3333333333%;
  }
  .row .col.pull-l10 {
    right: 83.3333333333%;
  }
  .row .col.push-l10 {
    left: 83.3333333333%;
  }
  .row .col.offset-l11 {
    margin-left: 91.6666666667%;
  }
  .row .col.pull-l11 {
    right: 91.6666666667%;
  }
  .row .col.push-l11 {
    left: 91.6666666667%;
  }
  .row .col.offset-l12 {
    margin-left: 100%;
  }
  .row .col.pull-l12 {
    right: 100%;
  }
  .row .col.push-l12 {
    left: 100%;
  }
}

@media only screen and (min-width: 1201px) {
  .row .col.xl1 {
    width: 8.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl2 {
    width: 16.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl3 {
    width: 25%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl4 {
    width: 33.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl5 {
    width: 41.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl6 {
    width: 50%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl7 {
    width: 58.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl8 {
    width: 66.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl9 {
    width: 75%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl10 {
    width: 83.3333333333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl11 {
    width: 91.6666666667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl12 {
    width: 100%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.offset-xl1 {
    margin-left: 8.3333333333%;
  }
  .row .col.pull-xl1 {
    right: 8.3333333333%;
  }
  .row .col.push-xl1 {
    left: 8.3333333333%;
  }
  .row .col.offset-xl2 {
    margin-left: 16.6666666667%;
  }
  .row .col.pull-xl2 {
    right: 16.6666666667%;
  }
  .row .col.push-xl2 {
    left: 16.6666666667%;
  }
  .row .col.offset-xl3 {
    margin-left: 25%;
  }
  .row .col.pull-xl3 {
    right: 25%;
  }
  .row .col.push-xl3 {
    left: 25%;
  }
  .row .col.offset-xl4 {
    margin-left: 33.3333333333%;
  }
  .row .col.pull-xl4 {
    right: 33.3333333333%;
  }
  .row .col.push-xl4 {
    left: 33.3333333333%;
  }
  .row .col.offset-xl5 {
    margin-left: 41.6666666667%;
  }
  .row .col.pull-xl5 {
    right: 41.6666666667%;
  }
  .row .col.push-xl5 {
    left: 41.6666666667%;
  }
  .row .col.offset-xl6 {
    margin-left: 50%;
  }
  .row .col.pull-xl6 {
    right: 50%;
  }
  .row .col.push-xl6 {
    left: 50%;
  }
  .row .col.offset-xl7 {
    margin-left: 58.3333333333%;
  }
  .row .col.pull-xl7 {
    right: 58.3333333333%;
  }
  .row .col.push-xl7 {
    left: 58.3333333333%;
  }
  .row .col.offset-xl8 {
    margin-left: 66.6666666667%;
  }
  .row .col.pull-xl8 {
    right: 66.6666666667%;
  }
  .row .col.push-xl8 {
    left: 66.6666666667%;
  }
  .row .col.offset-xl9 {
    margin-left: 75%;
  }
  .row .col.pull-xl9 {
    right: 75%;
  }
  .row .col.push-xl9 {
    left: 75%;
  }
  .row .col.offset-xl10 {
    margin-left: 83.3333333333%;
  }
  .row .col.pull-xl10 {
    right: 83.3333333333%;
  }
  .row .col.push-xl10 {
    left: 83.3333333333%;
  }
  .row .col.offset-xl11 {
    margin-left: 91.6666666667%;
  }
  .row .col.pull-xl11 {
    right: 91.6666666667%;
  }
  .row .col.push-xl11 {
    left: 91.6666666667%;
  }
  .row .col.offset-xl12 {
    margin-left: 100%;
  }
  .row .col.pull-xl12 {
    right: 100%;
  }
  .row .col.push-xl12 {
    left: 100%;
  }
}

nav {
  color: #fff;
  background-color: #ee6e73;
  width: 100%;
  height: 56px;
  line-height: 56px;
}

nav.nav-extended {
  height: auto;
}

nav.nav-extended .nav-wrapper {
  min-height: 56px;
  height: auto;
}

nav.nav-extended .nav-content {
  position: relative;
  line-height: normal;
}

nav a {
  color: #fff;
}

nav i,
nav [class^="mdi-"], nav [class*="mdi-"],
nav i.material-icons {
  display: block;
  font-size: 24px;
  height: 56px;
  line-height: 56px;
}

nav .nav-wrapper {
  position: relative;
  height: 100%;
}

@media only screen and (min-width: 993px) {
  nav a.sidenav-trigger {
    display: none;
  }
}

nav .sidenav-trigger {
  float: left;
  position: relative;
  z-index: 1;
  height: 56px;
  margin: 0 18px;
}

nav .sidenav-trigger i {
  height: 56px;
  line-height: 56px;
}

nav .brand-logo {
  position: absolute;
  color: #fff;
  display: inline-block;
  font-size: 2.1rem;
  padding: 0;
}

nav .brand-logo.center {
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

@media only screen and (max-width: 992px) {
  nav .brand-logo {
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  nav .brand-logo.left, nav .brand-logo.right {
    padding: 0;
    -webkit-transform: none;
            transform: none;
  }
  nav .brand-logo.left {
    left: 0.5rem;
  }
  nav .brand-logo.right {
    right: 0.5rem;
    left: auto;
  }
}

nav .brand-logo.right {
  right: 0.5rem;
  padding: 0;
}

nav .brand-logo i,
nav .brand-logo [class^="mdi-"], nav .brand-logo [class*="mdi-"],
nav .brand-logo i.material-icons {
  float: left;
  margin-right: 15px;
}

nav .nav-title {
  display: inline-block;
  font-size: 32px;
  padding: 28px 0;
}

nav ul {
  margin: 0;
}

nav ul li {
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
  float: left;
  padding: 0;
}

nav ul li.active {
  background-color: rgba(0, 0, 0, 0.1);
}

nav ul a {
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
  font-size: 1rem;
  color: #fff;
  display: block;
  padding: 0 15px;
  cursor: pointer;
}

nav ul a.btn, nav ul a.btn-large, nav ul a.btn-small, nav ul a.btn-large, nav ul a.btn-flat, nav ul a.btn-floating {
  margin-top: -2px;
  margin-left: 15px;
  margin-right: 15px;
}

nav ul a.btn > .material-icons, nav ul a.btn-large > .material-icons, nav ul a.btn-small > .material-icons, nav ul a.btn-large > .material-icons, nav ul a.btn-flat > .material-icons, nav ul a.btn-floating > .material-icons {
  height: inherit;
  line-height: inherit;
}

nav ul a:hover {
  background-color: rgba(0, 0, 0, 0.1);
}

nav ul.left {
  float: left;
}

nav form {
  height: 100%;
}

nav .input-field {
  margin: 0;
  height: 100%;
}

nav .input-field input {
  height: 100%;
  font-size: 1.2rem;
  border: none;
  padding-left: 2rem;
}

nav .input-field input:focus, nav .input-field input[type=text]:valid, nav .input-field input[type=password]:valid, nav .input-field input[type=email]:valid, nav .input-field input[type=url]:valid, nav .input-field input[type=date]:valid {
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}

nav .input-field label {
  top: 0;
  left: 0;
}

nav .input-field label i {
  color: rgba(255, 255, 255, 0.7);
  -webkit-transition: color .3s;
  transition: color .3s;
}

nav .input-field label.active i {
  color: #fff;
}

.navbar-fixed {
  position: relative;
  height: 56px;
  z-index: 997;
}

.navbar-fixed nav {
  position: fixed;
}

@media only screen and (min-width: 601px) {
  nav.nav-extended .nav-wrapper {
    min-height: 64px;
  }
  nav, nav .nav-wrapper i, nav a.sidenav-trigger, nav a.sidenav-trigger i {
    height: 64px;
    line-height: 64px;
  }
  .navbar-fixed {
    height: 64px;
  }
}

a {
  text-decoration: none;
}

html {
  line-height: 1.5;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  font-weight: normal;
  color: rgba(0, 0, 0, 0.87);
}

@media only screen and (min-width: 0) {
  html {
    font-size: 14px;
  }
}

@media only screen and (min-width: 992px) {
  html {
    font-size: 14.5px;
  }
}

@media only screen and (min-width: 1200px) {
  html {
    font-size: 15px;
  }
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  line-height: 1.3;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  font-weight: inherit;
}

h1 {
  font-size: 4.2rem;
  line-height: 110%;
  margin: 2.8rem 0 1.68rem 0;
}

h2 {
  font-size: 3.56rem;
  line-height: 110%;
  margin: 2.3733333333rem 0 1.424rem 0;
}

h3 {
  font-size: 2.92rem;
  line-height: 110%;
  margin: 1.9466666667rem 0 1.168rem 0;
}

h4 {
  font-size: 2.28rem;
  line-height: 110%;
  margin: 1.52rem 0 0.912rem 0;
}

h5 {
  font-size: 1.64rem;
  line-height: 110%;
  margin: 1.0933333333rem 0 0.656rem 0;
}

h6 {
  font-size: 1.15rem;
  line-height: 110%;
  margin: 0.7666666667rem 0 0.46rem 0;
}

em {
  font-style: italic;
}

strong {
  font-weight: 500;
}

small {
  font-size: 75%;
}

.light {
  font-weight: 300;
}

.thin {
  font-weight: 200;
}

@media only screen and (min-width: 360px) {
  .flow-text {
    font-size: 1.2rem;
  }
}

@media only screen and (min-width: 390px) {
  .flow-text {
    font-size: 1.224rem;
  }
}

@media only screen and (min-width: 420px) {
  .flow-text {
    font-size: 1.248rem;
  }
}

@media only screen and (min-width: 450px) {
  .flow-text {
    font-size: 1.272rem;
  }
}

@media only screen and (min-width: 480px) {
  .flow-text {
    font-size: 1.296rem;
  }
}

@media only screen and (min-width: 510px) {
  .flow-text {
    font-size: 1.32rem;
  }
}

@media only screen and (min-width: 540px) {
  .flow-text {
    font-size: 1.344rem;
  }
}

@media only screen and (min-width: 570px) {
  .flow-text {
    font-size: 1.368rem;
  }
}

@media only screen and (min-width: 600px) {
  .flow-text {
    font-size: 1.392rem;
  }
}

@media only screen and (min-width: 630px) {
  .flow-text {
    font-size: 1.416rem;
  }
}

@media only screen and (min-width: 660px) {
  .flow-text {
    font-size: 1.44rem;
  }
}

@media only screen and (min-width: 690px) {
  .flow-text {
    font-size: 1.464rem;
  }
}

@media only screen and (min-width: 720px) {
  .flow-text {
    font-size: 1.488rem;
  }
}

@media only screen and (min-width: 750px) {
  .flow-text {
    font-size: 1.512rem;
  }
}

@media only screen and (min-width: 780px) {
  .flow-text {
    font-size: 1.536rem;
  }
}

@media only screen and (min-width: 810px) {
  .flow-text {
    font-size: 1.56rem;
  }
}

@media only screen and (min-width: 840px) {
  .flow-text {
    font-size: 1.584rem;
  }
}

@media only screen and (min-width: 870px) {
  .flow-text {
    font-size: 1.608rem;
  }
}

@media only screen and (min-width: 900px) {
  .flow-text {
    font-size: 1.632rem;
  }
}

@media only screen and (min-width: 930px) {
  .flow-text {
    font-size: 1.656rem;
  }
}

@media only screen and (min-width: 960px) {
  .flow-text {
    font-size: 1.68rem;
  }
}

@media only screen and (max-width: 360px) {
  .flow-text {
    font-size: 1.2rem;
  }
}

.scale-transition {
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;
  transition: -webkit-transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;
  transition: transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;
  transition: transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63), -webkit-transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;
}

.scale-transition.scale-out {
  -webkit-transform: scale(0);
          transform: scale(0);
  -webkit-transition: -webkit-transform .2s !important;
  transition: -webkit-transform .2s !important;
  transition: transform .2s !important;
  transition: transform .2s, -webkit-transform .2s !important;
}

.scale-transition.scale-in {
  -webkit-transform: scale(1);
          transform: scale(1);
}

.card-panel {
  -webkit-transition: -webkit-box-shadow .25s;
  transition: -webkit-box-shadow .25s;
  transition: box-shadow .25s;
  transition: box-shadow .25s, -webkit-box-shadow .25s;
  padding: 24px;
  margin: 0.5rem 0 1rem 0;
  border-radius: 2px;
  background-color: #fff;
}

.card {
  position: relative;
  margin: 0.5rem 0 1rem 0;
  background-color: #fff;
  -webkit-transition: -webkit-box-shadow .25s;
  transition: -webkit-box-shadow .25s;
  transition: box-shadow .25s;
  transition: box-shadow .25s, -webkit-box-shadow .25s;
  border-radius: 2px;
}

.card .card-title {
  font-size: 24px;
  font-weight: 300;
}

.card .card-title.activator {
  cursor: pointer;
}

.card.small, .card.medium, .card.large {
  position: relative;
}

.card.small .card-image, .card.medium .card-image, .card.large .card-image {
  max-height: 60%;
  overflow: hidden;
}

.card.small .card-image + .card-content, .card.medium .card-image + .card-content, .card.large .card-image + .card-content {
  max-height: 40%;
}

.card.small .card-content, .card.medium .card-content, .card.large .card-content {
  max-height: 100%;
  overflow: hidden;
}

.card.small .card-action, .card.medium .card-action, .card.large .card-action {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.card.small {
  height: 300px;
}

.card.medium {
  height: 400px;
}

.card.large {
  height: 500px;
}

.card.horizontal {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.card.horizontal.small .card-image, .card.horizontal.medium .card-image, .card.horizontal.large .card-image {
  height: 100%;
  max-height: none;
  overflow: visible;
}

.card.horizontal.small .card-image img, .card.horizontal.medium .card-image img, .card.horizontal.large .card-image img {
  height: 100%;
}

.card.horizontal .card-image {
  max-width: 50%;
}

.card.horizontal .card-image img {
  border-radius: 2px 0 0 2px;
  max-width: 100%;
  width: auto;
}

.card.horizontal .card-stacked {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  position: relative;
}

.card.horizontal .card-stacked .card-content {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.card.sticky-action .card-action {
  z-index: 2;
}

.card.sticky-action .card-reveal {
  z-index: 1;
  padding-bottom: 64px;
}

.card .card-image {
  position: relative;
}

.card .card-image img {
  display: block;
  border-radius: 2px 2px 0 0;
  position: relative;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
}

.card .card-image .card-title {
  color: #fff;
  position: absolute;
  bottom: 0;
  left: 0;
  max-width: 100%;
  padding: 24px;
}

.card .card-content {
  padding: 24px;
  border-radius: 0 0 2px 2px;
}

.card .card-content p {
  margin: 0;
}

.card .card-content .card-title {
  display: block;
  line-height: 32px;
  margin-bottom: 8px;
}

.card .card-content .card-title i {
  line-height: 32px;
}

.card .card-action {
  background-color: inherit;
  border-top: 1px solid rgba(160, 160, 160, 0.2);
  position: relative;
  padding: 16px 24px;
}

.card .card-action:last-child {
  border-radius: 0 0 2px 2px;
}

.card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating) {
  color: #ffab40;
  margin-right: 24px;
  -webkit-transition: color .3s ease;
  transition: color .3s ease;
  text-transform: uppercase;
}

.card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating):hover {
  color: #ffd8a6;
}

.card .card-reveal {
  padding: 24px;
  position: absolute;
  background-color: #fff;
  width: 100%;
  overflow-y: auto;
  left: 0;
  top: 100%;
  height: 100%;
  z-index: 3;
  display: none;
}

.card .card-reveal .card-title {
  cursor: pointer;
  display: block;
}

#toast-container {
  display: block;
  position: fixed;
  z-index: 10000;
}

@media only screen and (max-width: 600px) {
  #toast-container {
    min-width: 100%;
    bottom: 0%;
  }
}

@media only screen and (min-width: 601px) and (max-width: 992px) {
  #toast-container {
    left: 5%;
    bottom: 7%;
    max-width: 90%;
  }
}

@media only screen and (min-width: 993px) {
  #toast-container {
    top: 10%;
    right: 7%;
    max-width: 86%;
  }
}

.toast {
  border-radius: 2px;
  top: 35px;
  width: auto;
  margin-top: 10px;
  position: relative;
  max-width: 100%;
  height: auto;
  min-height: 48px;
  line-height: 1.5em;
  background-color: #323232;
  padding: 10px 25px;
  font-size: 1.1rem;
  font-weight: 300;
  color: #fff;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  cursor: default;
}

.toast .toast-action {
  color: #eeff41;
  font-weight: 500;
  margin-right: -25px;
  margin-left: 3rem;
}

.toast.rounded {
  border-radius: 24px;
}

@media only screen and (max-width: 600px) {
  .toast {
    width: 100%;
    border-radius: 0;
  }
}

.tabs {
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  height: 48px;
  width: 100%;
  background-color: #fff;
  margin: 0 auto;
  white-space: nowrap;
}

.tabs.tabs-transparent {
  background-color: transparent;
}

.tabs.tabs-transparent .tab a,
.tabs.tabs-transparent .tab.disabled a,
.tabs.tabs-transparent .tab.disabled a:hover {
  color: rgba(255, 255, 255, 0.7);
}

.tabs.tabs-transparent .tab a:hover,
.tabs.tabs-transparent .tab a.active {
  color: #fff;
}

.tabs.tabs-transparent .indicator {
  background-color: #fff;
}

.tabs.tabs-fixed-width {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.tabs.tabs-fixed-width .tab {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.tabs .tab {
  display: inline-block;
  text-align: center;
  line-height: 48px;
  height: 48px;
  padding: 0;
  margin: 0;
  text-transform: uppercase;
}

.tabs .tab a {
  color: rgba(238, 110, 115, 0.7);
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 24px;
  font-size: 14px;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-transition: color .28s ease, background-color .28s ease;
  transition: color .28s ease, background-color .28s ease;
}

.tabs .tab a:focus, .tabs .tab a:focus.active {
  background-color: rgba(246, 178, 181, 0.2);
  outline: none;
}

.tabs .tab a:hover, .tabs .tab a.active {
  background-color: transparent;
  color: #ee6e73;
}

.tabs .tab.disabled a,
.tabs .tab.disabled a:hover {
  color: rgba(238, 110, 115, 0.4);
  cursor: default;
}

.tabs .indicator {
  position: absolute;
  bottom: 0;
  height: 2px;
  background-color: #f6b2b5;
  will-change: left, right;
}

@media only screen and (max-width: 992px) {
  .tabs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .tabs .tab {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
  }
  .tabs .tab a {
    padding: 0 12px;
  }
}

.material-tooltip {
  padding: 10px 8px;
  font-size: 1rem;
  z-index: 2000;
  background-color: transparent;
  border-radius: 2px;
  color: #fff;
  min-height: 36px;
  line-height: 120%;
  opacity: 0;
  position: absolute;
  text-align: center;
  max-width: calc(100% - 4px);
  overflow: hidden;
  left: 0;
  top: 0;
  pointer-events: none;
  visibility: hidden;
  background-color: #323232;
}

.backdrop {
  position: absolute;
  opacity: 0;
  height: 7px;
  width: 14px;
  border-radius: 0 0 50% 50%;
  background-color: #323232;
  z-index: -1;
  -webkit-transform-origin: 50% 0%;
          transform-origin: 50% 0%;
  visibility: hidden;
}

.btn, .btn-large, .btn-small,
.btn-flat {
  border: none;
  border-radius: 2px;
  display: inline-block;
  height: 36px;
  line-height: 36px;
  padding: 0 16px;
  text-transform: uppercase;
  vertical-align: middle;
  -webkit-tap-highlight-color: transparent;
}

.btn.disabled, .disabled.btn-large, .disabled.btn-small,
.btn-floating.disabled,
.btn-large.disabled,
.btn-small.disabled,
.btn-flat.disabled,
.btn:disabled,
.btn-large:disabled,
.btn-small:disabled,
.btn-floating:disabled,
.btn-large:disabled,
.btn-small:disabled,
.btn-flat:disabled,
.btn[disabled],
.btn-large[disabled],
.btn-small[disabled],
.btn-floating[disabled],
.btn-large[disabled],
.btn-small[disabled],
.btn-flat[disabled] {
  pointer-events: none;
  background-color: #DFDFDF !important;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #9F9F9F !important;
  cursor: default;
}

.btn.disabled:hover, .disabled.btn-large:hover, .disabled.btn-small:hover,
.btn-floating.disabled:hover,
.btn-large.disabled:hover,
.btn-small.disabled:hover,
.btn-flat.disabled:hover,
.btn:disabled:hover,
.btn-large:disabled:hover,
.btn-small:disabled:hover,
.btn-floating:disabled:hover,
.btn-large:disabled:hover,
.btn-small:disabled:hover,
.btn-flat:disabled:hover,
.btn[disabled]:hover,
.btn-large[disabled]:hover,
.btn-small[disabled]:hover,
.btn-floating[disabled]:hover,
.btn-large[disabled]:hover,
.btn-small[disabled]:hover,
.btn-flat[disabled]:hover {
  background-color: #DFDFDF !important;
  color: #9F9F9F !important;
}

.btn, .btn-large, .btn-small,
.btn-floating,
.btn-large,
.btn-small,
.btn-flat {
  font-size: 14px;
  outline: 0;
}

.btn i, .btn-large i, .btn-small i,
.btn-floating i,
.btn-large i,
.btn-small i,
.btn-flat i {
  font-size: 1.3rem;
  line-height: inherit;
}

.btn:focus, .btn-large:focus, .btn-small:focus,
.btn-floating:focus {
  background-color: #1d7d74;
}

.btn, .btn-large, .btn-small {
  text-decoration: none;
  color: #fff;
  background-color: #114B43;
  text-align: center;
  letter-spacing: .5px;
  -webkit-transition: background-color .2s ease-out;
  transition: background-color .2s ease-out;
  cursor: pointer;
}

.btn:hover, .btn-large:hover, .btn-small:hover {
  background-color: #82C55D;
}

.btn-floating {
  display: inline-block;
  color: #fff;
  position: relative;
  overflow: hidden;
  z-index: 1;
  width: 40px;
  height: 40px;
  line-height: 40px;
  padding: 0;
  background-color: #114B43;
  border-radius: 50%;
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
  cursor: pointer;
  vertical-align: middle;
}

.btn-floating:hover {
  background-color: #114B43;
}

.btn-floating:before {
  border-radius: 0;
}

.btn-floating.btn-large {
  width: 56px;
  height: 56px;
  padding: 0;
}

.btn-floating.btn-large.halfway-fab {
  bottom: -28px;
}

.btn-floating.btn-large i {
  line-height: 56px;
}

.btn-floating.btn-small {
  width: 32.4px;
  height: 32.4px;
}

.btn-floating.btn-small.halfway-fab {
  bottom: -16.2px;
}

.btn-floating.btn-small i {
  line-height: 32.4px;
}

.btn-floating.halfway-fab {
  position: absolute;
  right: 24px;
  bottom: -20px;
}

.btn-floating.halfway-fab.left {
  right: auto;
  left: 24px;
}

.btn-floating i {
  width: inherit;
  display: inline-block;
  text-align: center;
  color: #fff;
  font-size: 1.6rem;
  line-height: 40px;
}

button.btn-floating {
  border: none;
}

.fixed-action-btn {
  position: fixed;
  right: 23px;
  bottom: 23px;
  padding-top: 15px;
  margin-bottom: 0;
  z-index: 997;
}

.fixed-action-btn.active ul {
  visibility: visible;
}

.fixed-action-btn.direction-left, .fixed-action-btn.direction-right {
  padding: 0 0 0 15px;
}

.fixed-action-btn.direction-left ul, .fixed-action-btn.direction-right ul {
  text-align: right;
  right: 64px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  height: 100%;
  left: auto;
  /*width 100% only goes to width of button container */
  width: 500px;
}

.fixed-action-btn.direction-left ul li, .fixed-action-btn.direction-right ul li {
  display: inline-block;
  margin: 7.5px 15px 0 0;
}

.fixed-action-btn.direction-right {
  padding: 0 15px 0 0;
}

.fixed-action-btn.direction-right ul {
  text-align: left;
  direction: rtl;
  left: 64px;
  right: auto;
}

.fixed-action-btn.direction-right ul li {
  margin: 7.5px 0 0 15px;
}

.fixed-action-btn.direction-bottom {
  padding: 0 0 15px 0;
}

.fixed-action-btn.direction-bottom ul {
  top: 64px;
  bottom: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -webkit-flex-direction: column-reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
}

.fixed-action-btn.direction-bottom ul li {
  margin: 15px 0 0 0;
}

.fixed-action-btn.toolbar {
  padding: 0;
  height: 56px;
}

.fixed-action-btn.toolbar.active > a i {
  opacity: 0;
}

.fixed-action-btn.toolbar ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  top: 0;
  bottom: 0;
  z-index: 1;
}

.fixed-action-btn.toolbar ul li {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: inline-block;
  margin: 0;
  height: 100%;
  -webkit-transition: none;
  transition: none;
}

.fixed-action-btn.toolbar ul li a {
  display: block;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100%;
  background-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #fff;
  line-height: 56px;
  z-index: 1;
}

.fixed-action-btn.toolbar ul li a i {
  line-height: inherit;
}

.fixed-action-btn ul {
  left: 0;
  right: 0;
  text-align: center;
  position: absolute;
  bottom: 64px;
  margin: 0;
  visibility: hidden;
}

.fixed-action-btn ul li {
  margin-bottom: 15px;
}

.fixed-action-btn ul a.btn-floating {
  opacity: 0;
}

.fixed-action-btn .fab-backdrop {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 40px;
  height: 40px;
  background-color: #114B43;
  border-radius: 50%;
  -webkit-transform: scale(0);
          transform: scale(0);
}

.btn-flat {
  -webkit-box-shadow: none;
          box-shadow: none;
  background-color: transparent;
  color: #343434;
  cursor: pointer;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
}

.btn-flat:focus, .btn-flat:hover {
  -webkit-box-shadow: none;
          box-shadow: none;
}

.btn-flat:focus {
  background-color: rgba(0, 0, 0, 0.1);
}

.btn-flat.disabled, .btn-flat.btn-flat[disabled] {
  background-color: transparent !important;
  color: #b3b2b2 !important;
  cursor: default;
}

.btn-large {
  height: 54px;
  line-height: 54px;
  font-size: 15px;
  padding: 0 28px;
}

.btn-large i {
  font-size: 1.6rem;
}

.btn-small {
  height: 32.4px;
  line-height: 32.4px;
  font-size: 13px;
}

.btn-small i {
  font-size: 1.2rem;
}

.btn-block {
  display: block;
}

.dropdown-content {
  background-color: #fff;
  margin: 0;
  display: none;
  min-width: 100px;
  overflow-y: auto;
  opacity: 0;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 9999;
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
}

.dropdown-content:focus {
  outline: 0;
}

.dropdown-content li {
  clear: both;
  color: rgba(0, 0, 0, 0.87);
  cursor: pointer;
  min-height: 50px;
  line-height: 1.5rem;
  width: 100%;
  text-align: left;
}

.dropdown-content li:hover, .dropdown-content li.active {
  background-color: #eee;
}

.dropdown-content li:focus {
  outline: none;
}

.dropdown-content li.divider {
  min-height: 0;
  height: 1px;
}

.dropdown-content li > a, .dropdown-content li > span {
  font-size: 16px;
  color: #114B43;
  display: block;
  line-height: 22px;
  padding: 14px 16px;
}

.dropdown-content li > span > label {
  top: 1px;
  left: 0;
  height: 18px;
}

.dropdown-content li > a > i {
  height: inherit;
  line-height: inherit;
  float: left;
  margin: 0 24px 0 0;
  width: 24px;
}

body.keyboard-focused .dropdown-content li:focus {
  background-color: #dadada;
}

.input-field.col .dropdown-content [type="checkbox"] + label {
  top: 1px;
  left: 0;
  height: 18px;
  -webkit-transform: none;
          transform: none;
}

.dropdown-trigger {
  cursor: pointer;
}

/*!
 * Waves v0.6.0
 * http://fian.my.id/Waves
 *
 * Copyright 2014 Alfiana E. Sibuea and other contributors
 * Released under the MIT license
 * https://github.com/fians/Waves/blob/master/LICENSE
 */
.waves-effect {
  position: relative;
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-tap-highlight-color: transparent;
  vertical-align: middle;
  z-index: 1;
  -webkit-transition: .3s ease-out;
  transition: .3s ease-out;
}

.waves-effect .waves-ripple {
  position: absolute;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  margin-left: -10px;
  opacity: 0;
  background: rgba(0, 0, 0, 0.2);
  -webkit-transition: all 0.7s ease-out;
  transition: all 0.7s ease-out;
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: transform, opacity;
  transition-property: transform, opacity, -webkit-transform;
  -webkit-transform: scale(0);
          transform: scale(0);
  pointer-events: none;
}

.waves-effect.waves-light .waves-ripple {
  background-color: rgba(255, 255, 255, 0.45);
}

.waves-effect.waves-red .waves-ripple {
  background-color: rgba(244, 67, 54, 0.7);
}

.waves-effect.waves-yellow .waves-ripple {
  background-color: rgba(255, 235, 59, 0.7);
}

.waves-effect.waves-orange .waves-ripple {
  background-color: rgba(255, 152, 0, 0.7);
}

.waves-effect.waves-purple .waves-ripple {
  background-color: rgba(156, 39, 176, 0.7);
}

.waves-effect.waves-green .waves-ripple {
  background-color: rgba(76, 175, 80, 0.7);
}

.waves-effect.waves-teal .waves-ripple {
  background-color: rgba(0, 150, 136, 0.7);
}

.waves-effect input[type="button"], .waves-effect input[type="reset"], .waves-effect input[type="submit"] {
  border: 0;
  font-style: normal;
  font-size: inherit;
  text-transform: inherit;
  background: none;
}

.waves-effect img {
  position: relative;
  z-index: -1;
}

.waves-notransition {
  -webkit-transition: none !important;
  transition: none !important;
}

.waves-circle {
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
}

.waves-input-wrapper {
  border-radius: 0.2em;
  vertical-align: bottom;
}

.waves-input-wrapper .waves-button-input {
  position: relative;
  top: 0;
  left: 0;
  z-index: 1;
}

.waves-circle {
  text-align: center;
  width: 2.5em;
  height: 2.5em;
  line-height: 2.5em;
  border-radius: 50%;
  -webkit-mask-image: none;
}

.waves-block {
  display: block;
}

/* Firefox Bug: link not triggered */
.waves-effect .waves-ripple {
  z-index: -1;
}

.modal {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  background-color: #fafafa;
  padding: 0;
  max-height: 70%;
  width: 55%;
  margin: auto;
  overflow-y: auto;
  border-radius: 2px;
  will-change: top, opacity;
}

.modal:focus {
  outline: none;
}

@media only screen and (max-width: 992px) {
  .modal {
    width: 80%;
  }
}

.modal h1, .modal h2, .modal h3, .modal h4 {
  margin-top: 0;
}

.modal .modal-content {
  padding: 24px;
}

.modal .modal-close {
  cursor: pointer;
}

.modal .modal-footer {
  border-radius: 0 0 2px 2px;
  background-color: #fafafa;
  padding: 4px 6px;
  height: 56px;
  width: 100%;
  text-align: right;
}

.modal .modal-footer .btn, .modal .modal-footer .btn-large, .modal .modal-footer .btn-small, .modal .modal-footer .btn-flat {
  margin: 6px 0;
}

.modal-overlay {
  position: fixed;
  z-index: 999;
  top: -25%;
  left: 0;
  bottom: 0;
  right: 0;
  height: 125%;
  width: 100%;
  background: #000;
  display: none;
  will-change: opacity;
}

.modal.modal-fixed-footer {
  padding: 0;
  height: 70%;
}

.modal.modal-fixed-footer .modal-content {
  position: absolute;
  height: calc(100% - 56px);
  max-height: 100%;
  width: 100%;
  overflow-y: auto;
}

.modal.modal-fixed-footer .modal-footer {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  position: absolute;
  bottom: 0;
}

.modal.bottom-sheet {
  top: auto;
  bottom: -100%;
  margin: 0;
  width: 100%;
  max-height: 45%;
  border-radius: 0;
  will-change: bottom, opacity;
}

.collapsible {
  border-top: 1px solid #ddd;
  border-right: 1px solid #ddd;
  border-left: 1px solid #ddd;
  margin: 0.5rem 0 1rem 0;
}

.collapsible-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  line-height: 1.5;
  padding: 1rem;
  background-color: #fff;
  border-bottom: 1px solid #ddd;
}

.collapsible-header:focus {
  outline: 0;
}

.collapsible-header i {
  width: 2rem;
  font-size: 1.6rem;
  display: inline-block;
  text-align: center;
  margin-right: 1rem;
}

.keyboard-focused .collapsible-header:focus {
  background-color: #eee;
}

.collapsible-body {
  display: none;
  border-bottom: 1px solid #ddd;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 2rem;
}

.sidenav .collapsible,
.sidenav.fixed .collapsible {
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.sidenav .collapsible li,
.sidenav.fixed .collapsible li {
  padding: 0;
}

.sidenav .collapsible-header,
.sidenav.fixed .collapsible-header {
  background-color: transparent;
  border: none;
  line-height: inherit;
  height: inherit;
  padding: 0 16px;
}

.sidenav .collapsible-header:hover,
.sidenav.fixed .collapsible-header:hover {
  background-color: rgba(0, 0, 0, 0.05);
}

.sidenav .collapsible-header i,
.sidenav.fixed .collapsible-header i {
  line-height: inherit;
}

.sidenav .collapsible-body,
.sidenav.fixed .collapsible-body {
  border: 0;
  background-color: #fff;
}

.sidenav .collapsible-body li a,
.sidenav.fixed .collapsible-body li a {
  padding: 0 23.5px 0 31px;
}

.collapsible.popout {
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.collapsible.popout > li {
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
          box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  margin: 0 24px;
  -webkit-transition: margin 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: margin 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.collapsible.popout > li.active {
  -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
          box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
  margin: 16px 0;
}

.chip {
  display: inline-block;
  height: 32px;
  font-size: 13px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.6);
  line-height: 32px;
  padding: 0 12px;
  border-radius: 16px;
  background-color: #e4e4e4;
  margin-bottom: 5px;
  margin-right: 5px;
}

.chip:focus {
  outline: none;
  background-color: #114B43;
  color: #fff;
}

.chip > img {
  float: left;
  margin: 0 8px 0 -12px;
  height: 32px;
  width: 32px;
  border-radius: 50%;
}

.chip .close {
  cursor: pointer;
  float: right;
  font-size: 16px;
  line-height: 32px;
  padding-left: 8px;
}

.chips {
  border: none;
  border-bottom: 1px solid #9e9e9e;
  -webkit-box-shadow: none;
          box-shadow: none;
  margin: 0 0 8px 0;
  min-height: 45px;
  outline: none;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.chips.focus {
  border-bottom: 1px solid #114B43;
  -webkit-box-shadow: 0 1px 0 0 #114B43;
          box-shadow: 0 1px 0 0 #114B43;
}

.chips:hover {
  cursor: text;
}

.chips .input {
  background: none;
  border: 0;
  color: rgba(0, 0, 0, 0.6);
  display: inline-block;
  font-size: 16px;
  height: 3rem;
  line-height: 32px;
  outline: 0;
  margin: 0;
  padding: 0 !important;
  width: 120px !important;
}

.chips .input:focus {
  border: 0 !important;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
}

.chips .autocomplete-content {
  margin-top: 0;
  margin-bottom: 0;
}

.prefix ~ .chips {
  margin-left: 3rem;
  width: 92%;
  width: calc(100% - 3rem);
}

.chips:empty ~ label {
  font-size: 0.8rem;
  -webkit-transform: translateY(-140%);
          transform: translateY(-140%);
}

.materialboxed {
  display: block;
  cursor: -webkit-zoom-in;
  cursor: zoom-in;
  position: relative;
  -webkit-transition: opacity .4s;
  transition: opacity .4s;
  -webkit-backface-visibility: hidden;
}

.materialboxed:hover:not(.active) {
  opacity: .8;
}

.materialboxed.active {
  cursor: -webkit-zoom-out;
  cursor: zoom-out;
}

#materialbox-overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #292929;
  z-index: 1000;
  will-change: opacity;
}

.materialbox-caption {
  position: fixed;
  display: none;
  color: #fff;
  line-height: 50px;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  padding: 0% 15%;
  height: 50px;
  z-index: 1000;
  -webkit-font-smoothing: antialiased;
}

select:focus {
  outline: 1px solid #c9f3ef;
}

button:focus {
  outline: none;
  background-color: #2ab7a9;
}

label {
  font-size: 0.8rem;
  color: #9e9e9e;
}

/* Text Inputs + Textarea
   ========================================================================== */
/* Style Placeholders */
::-webkit-input-placeholder {
  color: #d1d1d1;
}
::-moz-placeholder {
  color: #d1d1d1;
}
:-ms-input-placeholder {
  color: #d1d1d1;
}
::-ms-input-placeholder {
  color: #d1d1d1;
}
::placeholder {
  color: #d1d1d1;
}

/* Text inputs */
input:not([type]),
input[type=text]:not(.browser-default),
input[type=password]:not(.browser-default),
input[type=email]:not(.browser-default),
input[type=url]:not(.browser-default),
input[type=time]:not(.browser-default),
input[type=date]:not(.browser-default),
input[type=datetime]:not(.browser-default),
input[type=datetime-local]:not(.browser-default),
input[type=tel]:not(.browser-default),
input[type=number]:not(.browser-default),
input[type=search]:not(.browser-default),
textarea.materialize-textarea {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #9e9e9e;
  border-radius: 0;
  outline: none;
  height: 3rem;
  width: 100%;
  font-size: 16px;
  margin: 0 0 8px 0;
  padding: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  -webkit-transition: border .3s, -webkit-box-shadow .3s;
  transition: border .3s, -webkit-box-shadow .3s;
  transition: box-shadow .3s, border .3s;
  transition: box-shadow .3s, border .3s, -webkit-box-shadow .3s;
}

input:not([type]):disabled, input:not([type])[readonly="readonly"],
input[type=text]:not(.browser-default):disabled,
input[type=text]:not(.browser-default)[readonly="readonly"],
input[type=password]:not(.browser-default):disabled,
input[type=password]:not(.browser-default)[readonly="readonly"],
input[type=email]:not(.browser-default):disabled,
input[type=email]:not(.browser-default)[readonly="readonly"],
input[type=url]:not(.browser-default):disabled,
input[type=url]:not(.browser-default)[readonly="readonly"],
input[type=time]:not(.browser-default):disabled,
input[type=time]:not(.browser-default)[readonly="readonly"],
input[type=date]:not(.browser-default):disabled,
input[type=date]:not(.browser-default)[readonly="readonly"],
input[type=datetime]:not(.browser-default):disabled,
input[type=datetime]:not(.browser-default)[readonly="readonly"],
input[type=datetime-local]:not(.browser-default):disabled,
input[type=datetime-local]:not(.browser-default)[readonly="readonly"],
input[type=tel]:not(.browser-default):disabled,
input[type=tel]:not(.browser-default)[readonly="readonly"],
input[type=number]:not(.browser-default):disabled,
input[type=number]:not(.browser-default)[readonly="readonly"],
input[type=search]:not(.browser-default):disabled,
input[type=search]:not(.browser-default)[readonly="readonly"],
textarea.materialize-textarea:disabled,
textarea.materialize-textarea[readonly="readonly"] {
  color: rgba(0, 0, 0, 0.42);
  border-bottom: 1px dotted rgba(0, 0, 0, 0.42);
}

input:not([type]):disabled + label,
input:not([type])[readonly="readonly"] + label,
input[type=text]:not(.browser-default):disabled + label,
input[type=text]:not(.browser-default)[readonly="readonly"] + label,
input[type=password]:not(.browser-default):disabled + label,
input[type=password]:not(.browser-default)[readonly="readonly"] + label,
input[type=email]:not(.browser-default):disabled + label,
input[type=email]:not(.browser-default)[readonly="readonly"] + label,
input[type=url]:not(.browser-default):disabled + label,
input[type=url]:not(.browser-default)[readonly="readonly"] + label,
input[type=time]:not(.browser-default):disabled + label,
input[type=time]:not(.browser-default)[readonly="readonly"] + label,
input[type=date]:not(.browser-default):disabled + label,
input[type=date]:not(.browser-default)[readonly="readonly"] + label,
input[type=datetime]:not(.browser-default):disabled + label,
input[type=datetime]:not(.browser-default)[readonly="readonly"] + label,
input[type=datetime-local]:not(.browser-default):disabled + label,
input[type=datetime-local]:not(.browser-default)[readonly="readonly"] + label,
input[type=tel]:not(.browser-default):disabled + label,
input[type=tel]:not(.browser-default)[readonly="readonly"] + label,
input[type=number]:not(.browser-default):disabled + label,
input[type=number]:not(.browser-default)[readonly="readonly"] + label,
input[type=search]:not(.browser-default):disabled + label,
input[type=search]:not(.browser-default)[readonly="readonly"] + label,
textarea.materialize-textarea:disabled + label,
textarea.materialize-textarea[readonly="readonly"] + label {
  color: rgba(0, 0, 0, 0.42);
}

input:not([type]):focus:not([readonly]),
input[type=text]:not(.browser-default):focus:not([readonly]),
input[type=password]:not(.browser-default):focus:not([readonly]),
input[type=email]:not(.browser-default):focus:not([readonly]),
input[type=url]:not(.browser-default):focus:not([readonly]),
input[type=time]:not(.browser-default):focus:not([readonly]),
input[type=date]:not(.browser-default):focus:not([readonly]),
input[type=datetime]:not(.browser-default):focus:not([readonly]),
input[type=datetime-local]:not(.browser-default):focus:not([readonly]),
input[type=tel]:not(.browser-default):focus:not([readonly]),
input[type=number]:not(.browser-default):focus:not([readonly]),
input[type=search]:not(.browser-default):focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
  border-bottom: 1px solid #114B43;
  -webkit-box-shadow: 0 1px 0 0 #114B43;
          box-shadow: 0 1px 0 0 #114B43;
}

input:not([type]):focus:not([readonly]) + label,
input[type=text]:not(.browser-default):focus:not([readonly]) + label,
input[type=password]:not(.browser-default):focus:not([readonly]) + label,
input[type=email]:not(.browser-default):focus:not([readonly]) + label,
input[type=url]:not(.browser-default):focus:not([readonly]) + label,
input[type=time]:not(.browser-default):focus:not([readonly]) + label,
input[type=date]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime-local]:not(.browser-default):focus:not([readonly]) + label,
input[type=tel]:not(.browser-default):focus:not([readonly]) + label,
input[type=number]:not(.browser-default):focus:not([readonly]) + label,
input[type=search]:not(.browser-default):focus:not([readonly]) + label,
textarea.materialize-textarea:focus:not([readonly]) + label {
  color: #114B43;
}

input:not([type]):focus.valid ~ label,
input[type=text]:not(.browser-default):focus.valid ~ label,
input[type=password]:not(.browser-default):focus.valid ~ label,
input[type=email]:not(.browser-default):focus.valid ~ label,
input[type=url]:not(.browser-default):focus.valid ~ label,
input[type=time]:not(.browser-default):focus.valid ~ label,
input[type=date]:not(.browser-default):focus.valid ~ label,
input[type=datetime]:not(.browser-default):focus.valid ~ label,
input[type=datetime-local]:not(.browser-default):focus.valid ~ label,
input[type=tel]:not(.browser-default):focus.valid ~ label,
input[type=number]:not(.browser-default):focus.valid ~ label,
input[type=search]:not(.browser-default):focus.valid ~ label,
textarea.materialize-textarea:focus.valid ~ label {
  color: #114B43;
}

input:not([type]):focus.invalid ~ label,
input[type=text]:not(.browser-default):focus.invalid ~ label,
input[type=password]:not(.browser-default):focus.invalid ~ label,
input[type=email]:not(.browser-default):focus.invalid ~ label,
input[type=url]:not(.browser-default):focus.invalid ~ label,
input[type=time]:not(.browser-default):focus.invalid ~ label,
input[type=date]:not(.browser-default):focus.invalid ~ label,
input[type=datetime]:not(.browser-default):focus.invalid ~ label,
input[type=datetime-local]:not(.browser-default):focus.invalid ~ label,
input[type=tel]:not(.browser-default):focus.invalid ~ label,
input[type=number]:not(.browser-default):focus.invalid ~ label,
input[type=search]:not(.browser-default):focus.invalid ~ label,
textarea.materialize-textarea:focus.invalid ~ label {
  color: #FF5252;
}

input:not([type]).validate + label,
input[type=text]:not(.browser-default).validate + label,
input[type=password]:not(.browser-default).validate + label,
input[type=email]:not(.browser-default).validate + label,
input[type=url]:not(.browser-default).validate + label,
input[type=time]:not(.browser-default).validate + label,
input[type=date]:not(.browser-default).validate + label,
input[type=datetime]:not(.browser-default).validate + label,
input[type=datetime-local]:not(.browser-default).validate + label,
input[type=tel]:not(.browser-default).validate + label,
input[type=number]:not(.browser-default).validate + label,
input[type=search]:not(.browser-default).validate + label,
textarea.materialize-textarea.validate + label {
  width: 100%;
}

/* Validation Sass Placeholders */
input.valid:not([type]), input.valid:not([type]):focus,
input.valid[type=text]:not(.browser-default),
input.valid[type=text]:not(.browser-default):focus,
input.valid[type=password]:not(.browser-default),
input.valid[type=password]:not(.browser-default):focus,
input.valid[type=email]:not(.browser-default),
input.valid[type=email]:not(.browser-default):focus,
input.valid[type=url]:not(.browser-default),
input.valid[type=url]:not(.browser-default):focus,
input.valid[type=time]:not(.browser-default),
input.valid[type=time]:not(.browser-default):focus,
input.valid[type=date]:not(.browser-default),
input.valid[type=date]:not(.browser-default):focus,
input.valid[type=datetime]:not(.browser-default),
input.valid[type=datetime]:not(.browser-default):focus,
input.valid[type=datetime-local]:not(.browser-default),
input.valid[type=datetime-local]:not(.browser-default):focus,
input.valid[type=tel]:not(.browser-default),
input.valid[type=tel]:not(.browser-default):focus,
input.valid[type=number]:not(.browser-default),
input.valid[type=number]:not(.browser-default):focus,
input.valid[type=search]:not(.browser-default),
input.valid[type=search]:not(.browser-default):focus,
textarea.materialize-textarea.valid,
textarea.materialize-textarea.valid:focus, .select-wrapper.valid > input.select-dropdown {
  border-bottom: 1px solid #114B43;
  -webkit-box-shadow: 0 1px 0 0 #114B43;
          box-shadow: 0 1px 0 0 #114B43;
}

input.invalid:not([type]), input.invalid:not([type]):focus,
input.invalid[type=text]:not(.browser-default),
input.invalid[type=text]:not(.browser-default):focus,
input.invalid[type=password]:not(.browser-default),
input.invalid[type=password]:not(.browser-default):focus,
input.invalid[type=email]:not(.browser-default),
input.invalid[type=email]:not(.browser-default):focus,
input.invalid[type=url]:not(.browser-default),
input.invalid[type=url]:not(.browser-default):focus,
input.invalid[type=time]:not(.browser-default),
input.invalid[type=time]:not(.browser-default):focus,
input.invalid[type=date]:not(.browser-default),
input.invalid[type=date]:not(.browser-default):focus,
input.invalid[type=datetime]:not(.browser-default),
input.invalid[type=datetime]:not(.browser-default):focus,
input.invalid[type=datetime-local]:not(.browser-default),
input.invalid[type=datetime-local]:not(.browser-default):focus,
input.invalid[type=tel]:not(.browser-default),
input.invalid[type=tel]:not(.browser-default):focus,
input.invalid[type=number]:not(.browser-default),
input.invalid[type=number]:not(.browser-default):focus,
input.invalid[type=search]:not(.browser-default),
input.invalid[type=search]:not(.browser-default):focus,
textarea.materialize-textarea.invalid,
textarea.materialize-textarea.invalid:focus, .select-wrapper.invalid > input.select-dropdown,
.select-wrapper.invalid > input.select-dropdown:focus {
  border-bottom: 1px solid #FF5252;
  -webkit-box-shadow: 0 1px 0 0 #FF5252;
          box-shadow: 0 1px 0 0 #FF5252;
}

input:not([type]).valid ~ .helper-text[data-success],
input:not([type]):focus.valid ~ .helper-text[data-success],
input:not([type]).invalid ~ .helper-text[data-error],
input:not([type]):focus.invalid ~ .helper-text[data-error],
input[type=text]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=text]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=text]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=text]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=password]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=password]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=password]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=password]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=email]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=email]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=email]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=email]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=url]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=url]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=url]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=url]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=time]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=time]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=time]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=time]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=date]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=date]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=date]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=date]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=datetime]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=datetime]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=datetime]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=datetime]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=datetime-local]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=datetime-local]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=datetime-local]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=datetime-local]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=tel]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=tel]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=tel]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=tel]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=number]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=number]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=number]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=number]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=search]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=search]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=search]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=search]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
textarea.materialize-textarea.valid ~ .helper-text[data-success],
textarea.materialize-textarea:focus.valid ~ .helper-text[data-success],
textarea.materialize-textarea.invalid ~ .helper-text[data-error],
textarea.materialize-textarea:focus.invalid ~ .helper-text[data-error], .select-wrapper.valid .helper-text[data-success],
.select-wrapper.invalid ~ .helper-text[data-error] {
  color: transparent;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none;
}

input:not([type]).valid ~ .helper-text:after,
input:not([type]):focus.valid ~ .helper-text:after,
input[type=text]:not(.browser-default).valid ~ .helper-text:after,
input[type=text]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=password]:not(.browser-default).valid ~ .helper-text:after,
input[type=password]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=email]:not(.browser-default).valid ~ .helper-text:after,
input[type=email]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=url]:not(.browser-default).valid ~ .helper-text:after,
input[type=url]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=time]:not(.browser-default).valid ~ .helper-text:after,
input[type=time]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=date]:not(.browser-default).valid ~ .helper-text:after,
input[type=date]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=datetime]:not(.browser-default).valid ~ .helper-text:after,
input[type=datetime]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=datetime-local]:not(.browser-default).valid ~ .helper-text:after,
input[type=datetime-local]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=tel]:not(.browser-default).valid ~ .helper-text:after,
input[type=tel]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=number]:not(.browser-default).valid ~ .helper-text:after,
input[type=number]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=search]:not(.browser-default).valid ~ .helper-text:after,
input[type=search]:not(.browser-default):focus.valid ~ .helper-text:after,
textarea.materialize-textarea.valid ~ .helper-text:after,
textarea.materialize-textarea:focus.valid ~ .helper-text:after, .select-wrapper.valid ~ .helper-text:after {
  content: attr(data-success);
  color: #114B43;
}

input:not([type]).invalid ~ .helper-text:after,
input:not([type]):focus.invalid ~ .helper-text:after,
input[type=text]:not(.browser-default).invalid ~ .helper-text:after,
input[type=text]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=password]:not(.browser-default).invalid ~ .helper-text:after,
input[type=password]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=email]:not(.browser-default).invalid ~ .helper-text:after,
input[type=email]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=url]:not(.browser-default).invalid ~ .helper-text:after,
input[type=url]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=time]:not(.browser-default).invalid ~ .helper-text:after,
input[type=time]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=date]:not(.browser-default).invalid ~ .helper-text:after,
input[type=date]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=datetime]:not(.browser-default).invalid ~ .helper-text:after,
input[type=datetime]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=datetime-local]:not(.browser-default).invalid ~ .helper-text:after,
input[type=datetime-local]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=tel]:not(.browser-default).invalid ~ .helper-text:after,
input[type=tel]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=number]:not(.browser-default).invalid ~ .helper-text:after,
input[type=number]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=search]:not(.browser-default).invalid ~ .helper-text:after,
input[type=search]:not(.browser-default):focus.invalid ~ .helper-text:after,
textarea.materialize-textarea.invalid ~ .helper-text:after,
textarea.materialize-textarea:focus.invalid ~ .helper-text:after, .select-wrapper.invalid ~ .helper-text:after {
  content: attr(data-error);
  color: #FF5252;
}

input:not([type]) + label:after,
input[type=text]:not(.browser-default) + label:after,
input[type=password]:not(.browser-default) + label:after,
input[type=email]:not(.browser-default) + label:after,
input[type=url]:not(.browser-default) + label:after,
input[type=time]:not(.browser-default) + label:after,
input[type=date]:not(.browser-default) + label:after,
input[type=datetime]:not(.browser-default) + label:after,
input[type=datetime-local]:not(.browser-default) + label:after,
input[type=tel]:not(.browser-default) + label:after,
input[type=number]:not(.browser-default) + label:after,
input[type=search]:not(.browser-default) + label:after,
textarea.materialize-textarea + label:after, .select-wrapper + label:after {
  display: block;
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  opacity: 0;
  -webkit-transition: .2s opacity ease-out, .2s color ease-out;
  transition: .2s opacity ease-out, .2s color ease-out;
}

.input-field {
  position: relative;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.input-field.inline {
  display: inline-block;
  vertical-align: middle;
  margin-left: 5px;
}

.input-field.inline input,
.input-field.inline .select-dropdown {
  margin-bottom: 1rem;
}

.input-field.col label {
  left: 0.75rem;
}

.input-field.col .prefix ~ label,
.input-field.col .prefix ~ .validate ~ label {
  width: calc(100% - 3rem - 1.5rem);
}

.input-field > label {
  color: #9e9e9e;
  position: absolute;
  top: 0;
  left: 0;
  font-size: 1rem;
  cursor: text;
  -webkit-transition: color .2s ease-out, -webkit-transform .2s ease-out;
  transition: color .2s ease-out, -webkit-transform .2s ease-out;
  transition: transform .2s ease-out, color .2s ease-out;
  transition: transform .2s ease-out, color .2s ease-out, -webkit-transform .2s ease-out;
  -webkit-transform-origin: 0% 100%;
          transform-origin: 0% 100%;
  text-align: initial;
  -webkit-transform: translateY(12px);
          transform: translateY(12px);
}

.input-field > label:not(.label-icon).active {
  -webkit-transform: translateY(-14px) scale(0.8);
          transform: translateY(-14px) scale(0.8);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
}

.input-field > input[type]:-webkit-autofill:not(.browser-default):not([type="search"]) + label,
.input-field > input[type=date]:not(.browser-default) + label,
.input-field > input[type=time]:not(.browser-default) + label {
  -webkit-transform: translateY(-14px) scale(0.8);
          transform: translateY(-14px) scale(0.8);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
}

.input-field .helper-text {
  position: relative;
  min-height: 18px;
  display: block;
  font-size: 12px;
  color: rgba(0, 0, 0, 0.54);
}

.input-field .helper-text::after {
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
}

.input-field .prefix {
  position: absolute;
  width: 3rem;
  font-size: 2rem;
  -webkit-transition: color .2s;
  transition: color .2s;
  top: 0.5rem;
}

.input-field .prefix.active {
  color: #114B43;
}

.input-field .prefix ~ input,
.input-field .prefix ~ textarea,
.input-field .prefix ~ label,
.input-field .prefix ~ .validate ~ label,
.input-field .prefix ~ .helper-text,
.input-field .prefix ~ .autocomplete-content {
  margin-left: 3rem;
  width: 92%;
  width: calc(100% - 3rem);
}

.input-field .prefix ~ label {
  margin-left: 3rem;
}

@media only screen and (max-width: 992px) {
  .input-field .prefix ~ input {
    width: 86%;
    width: calc(100% - 3rem);
  }
}

@media only screen and (max-width: 600px) {
  .input-field .prefix ~ input {
    width: 80%;
    width: calc(100% - 3rem);
  }
}

/* Search Field */
.input-field input[type=search] {
  display: block;
  line-height: inherit;
  -webkit-transition: .3s background-color;
  transition: .3s background-color;
}

.nav-wrapper .input-field input[type=search] {
  height: inherit;
  padding-left: 4rem;
  width: calc(100% - 4rem);
  border: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.input-field input[type=search]:focus:not(.browser-default) {
  background-color: #fff;
  border: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #444;
}

.input-field input[type=search]:focus:not(.browser-default) + label i,
.input-field input[type=search]:focus:not(.browser-default) ~ .mdi-navigation-close,
.input-field input[type=search]:focus:not(.browser-default) ~ .material-icons {
  color: #444;
}

.input-field input[type=search] + .label-icon {
  -webkit-transform: none;
          transform: none;
  left: 1rem;
}

.input-field input[type=search] ~ .mdi-navigation-close,
.input-field input[type=search] ~ .material-icons {
  position: absolute;
  top: 0;
  right: 1rem;
  color: transparent;
  cursor: pointer;
  font-size: 2rem;
  -webkit-transition: .3s color;
  transition: .3s color;
}

/* Textarea */
textarea {
  width: 100%;
  height: 3rem;
  background-color: transparent;
}

textarea.materialize-textarea {
  line-height: normal;
  overflow-y: hidden;
  /* prevents scroll bar flash */
  padding: .8rem 0 .8rem 0;
  /* prevents text jump on Enter keypress */
  resize: none;
  min-height: 3rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.hiddendiv {
  visibility: hidden;
  white-space: pre-wrap;
  word-wrap: break-word;
  overflow-wrap: break-word;
  /* future version of deprecated 'word-wrap' */
  padding-top: 1.2rem;
  /* prevents text jump on Enter keypress */
  position: absolute;
  top: 0;
  z-index: -1;
}

/* Autocomplete */
.autocomplete-content li .highlight {
  color: #444;
}

.autocomplete-content li img {
  height: 40px;
  width: 40px;
  margin: 5px 15px;
}

/* Character Counter */
.character-counter {
  min-height: 18px;
}

/* Radio Buttons
   ========================================================================== */
[type="radio"]:not(:checked),
[type="radio"]:checked {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

[type="radio"]:not(:checked) + span,
[type="radio"]:checked + span {
  position: relative;
  padding-left: 35px;
  cursor: pointer;
  display: inline-block;
  height: 25px;
  line-height: 25px;
  font-size: 1rem;
  -webkit-transition: .28s ease;
  transition: .28s ease;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

[type="radio"] + span:before,
[type="radio"] + span:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  margin: 4px;
  width: 16px;
  height: 16px;
  z-index: 0;
  -webkit-transition: .28s ease;
  transition: .28s ease;
}

/* Unchecked styles */
[type="radio"]:not(:checked) + span:before,
[type="radio"]:not(:checked) + span:after,
[type="radio"]:checked + span:before,
[type="radio"]:checked + span:after,
[type="radio"].with-gap:checked + span:before,
[type="radio"].with-gap:checked + span:after {
  border-radius: 50%;
}

[type="radio"]:not(:checked) + span:before,
[type="radio"]:not(:checked) + span:after {
  border: 2px solid #5a5a5a;
}

[type="radio"]:not(:checked) + span:after {
  -webkit-transform: scale(0);
          transform: scale(0);
}

/* Checked styles */
[type="radio"]:checked + span:before {
  border: 2px solid transparent;
}

[type="radio"]:checked + span:after,
[type="radio"].with-gap:checked + span:before,
[type="radio"].with-gap:checked + span:after {
  border: 2px solid #114B43;
}

[type="radio"]:checked + span:after,
[type="radio"].with-gap:checked + span:after {
  background-color: #114B43;
}

[type="radio"]:checked + span:after {
  -webkit-transform: scale(1.02);
          transform: scale(1.02);
}

/* Radio With gap */
[type="radio"].with-gap:checked + span:after {
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
}

/* Focused styles */
[type="radio"].tabbed:focus + span:before {
  -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
}

/* Disabled Radio With gap */
[type="radio"].with-gap:disabled:checked + span:before {
  border: 2px solid rgba(0, 0, 0, 0.42);
}

[type="radio"].with-gap:disabled:checked + span:after {
  border: none;
  background-color: rgba(0, 0, 0, 0.42);
}

/* Disabled style */
[type="radio"]:disabled:not(:checked) + span:before,
[type="radio"]:disabled:checked + span:before {
  background-color: transparent;
  border-color: rgba(0, 0, 0, 0.42);
}

[type="radio"]:disabled + span {
  color: rgba(0, 0, 0, 0.42);
}

[type="radio"]:disabled:not(:checked) + span:before {
  border-color: rgba(0, 0, 0, 0.42);
}

[type="radio"]:disabled:checked + span:after {
  background-color: rgba(0, 0, 0, 0.42);
  border-color: #949494;
}

/* Checkboxes
   ========================================================================== */
/* Remove default checkbox */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

[type="checkbox"] {
  /* checkbox aspect */
}

[type="checkbox"] + span:not(.lever) {
  position: relative;
  padding-left: 35px;
  cursor: pointer;
  display: inline-block;
  height: 25px;
  line-height: 25px;
  font-size: 1rem;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

[type="checkbox"] + span:not(.lever):before,
[type="checkbox"]:not(.filled-in) + span:not(.lever):after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 18px;
  height: 18px;
  z-index: 0;
  border: 2px solid #5a5a5a;
  border-radius: 1px;
  margin-top: 3px;
  -webkit-transition: .2s;
  transition: .2s;
}

[type="checkbox"]:not(.filled-in) + span:not(.lever):after {
  border: 0;
  -webkit-transform: scale(0);
          transform: scale(0);
}

[type="checkbox"]:not(:checked):disabled + span:not(.lever):before {
  border: none;
  background-color: rgba(0, 0, 0, 0.42);
}

[type="checkbox"].tabbed:focus + span:not(.lever):after {
  -webkit-transform: scale(1);
          transform: scale(1);
  border: 0;
  border-radius: 50%;
  -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
  background-color: rgba(0, 0, 0, 0.1);
}

[type="checkbox"]:checked + span:not(.lever):before {
  top: -4px;
  left: -5px;
  width: 12px;
  height: 22px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid #114B43;
  border-bottom: 2px solid #114B43;
  -webkit-transform: rotate(40deg);
          transform: rotate(40deg);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

[type="checkbox"]:checked:disabled + span:before {
  border-right: 2px solid rgba(0, 0, 0, 0.42);
  border-bottom: 2px solid rgba(0, 0, 0, 0.42);
}

/* Indeterminate checkbox */
[type="checkbox"]:indeterminate + span:not(.lever):before {
  top: -11px;
  left: -12px;
  width: 10px;
  height: 22px;
  border-top: none;
  border-left: none;
  border-right: 2px solid #114B43;
  border-bottom: none;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

[type="checkbox"]:indeterminate:disabled + span:not(.lever):before {
  border-right: 2px solid rgba(0, 0, 0, 0.42);
  background-color: transparent;
}

[type="checkbox"].filled-in + span:not(.lever):after {
  border-radius: 2px;
}

[type="checkbox"].filled-in + span:not(.lever):before,
[type="checkbox"].filled-in + span:not(.lever):after {
  content: '';
  left: 0;
  position: absolute;
  /* .1s delay is for check animation */
  -webkit-transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
  transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
  z-index: 1;
}

[type="checkbox"].filled-in:not(:checked) + span:not(.lever):before {
  width: 0;
  height: 0;
  border: 3px solid transparent;
  left: 6px;
  top: 10px;
  -webkit-transform: rotateZ(37deg);
          transform: rotateZ(37deg);
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

[type="checkbox"].filled-in:not(:checked) + span:not(.lever):after {
  height: 20px;
  width: 20px;
  background-color: transparent;
  border: 2px solid #5a5a5a;
  top: 0px;
  z-index: 0;
}

[type="checkbox"].filled-in:checked + span:not(.lever):before {
  top: 0;
  left: 1px;
  width: 8px;
  height: 13px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  -webkit-transform: rotateZ(37deg);
          transform: rotateZ(37deg);
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

[type="checkbox"].filled-in:checked + span:not(.lever):after {
  top: 0;
  width: 20px;
  height: 20px;
  border: 2px solid #114B43;
  background-color: #114B43;
  z-index: 0;
}

[type="checkbox"].filled-in.tabbed:focus + span:not(.lever):after {
  border-radius: 2px;
  border-color: #5a5a5a;
  background-color: rgba(0, 0, 0, 0.1);
}

[type="checkbox"].filled-in.tabbed:checked:focus + span:not(.lever):after {
  border-radius: 2px;
  background-color: #114B43;
  border-color: #114B43;
}

[type="checkbox"].filled-in:disabled:not(:checked) + span:not(.lever):before {
  background-color: transparent;
  border: 2px solid transparent;
}

[type="checkbox"].filled-in:disabled:not(:checked) + span:not(.lever):after {
  border-color: transparent;
  background-color: #949494;
}

[type="checkbox"].filled-in:disabled:checked + span:not(.lever):before {
  background-color: transparent;
}

[type="checkbox"].filled-in:disabled:checked + span:not(.lever):after {
  background-color: #949494;
  border-color: #949494;
}

/* Switch
   ========================================================================== */
.switch,
.switch * {
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.switch label {
  cursor: pointer;
}

.switch label input[type=checkbox] {
  opacity: 0;
  width: 0;
  height: 0;
}

.switch label input[type=checkbox]:checked + .lever {
  background-color: #84c7c1;
}

.switch label input[type=checkbox]:checked + .lever:before, .switch label input[type=checkbox]:checked + .lever:after {
  left: 18px;
}

.switch label input[type=checkbox]:checked + .lever:after {
  background-color: #114B43;
}

.switch label .lever {
  content: "";
  display: inline-block;
  position: relative;
  width: 36px;
  height: 14px;
  background-color: rgba(0, 0, 0, 0.38);
  border-radius: 15px;
  margin-right: 10px;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
  vertical-align: middle;
  margin: 0 16px;
}

.switch label .lever:before, .switch label .lever:after {
  content: "";
  position: absolute;
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  left: 0;
  top: -3px;
  -webkit-transition: left 0.3s ease, background .3s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
  transition: left 0.3s ease, background .3s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
  transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease;
  transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
}

.switch label .lever:before {
  background-color: rgba(60,118,58, 0.15);
}

.switch label .lever:after {
  background-color: #F1F1F1;
  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
          box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}

input[type=checkbox]:checked:not(:disabled) ~ .lever:active::before,
input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before {
  -webkit-transform: scale(2.4);
          transform: scale(2.4);
  background-color: rgba(60,118,58, 0.15);
}

input[type=checkbox]:not(:disabled) ~ .lever:active:before,
input[type=checkbox]:not(:disabled).tabbed:focus ~ .lever::before {
  -webkit-transform: scale(2.4);
          transform: scale(2.4);
  background-color: rgba(0, 0, 0, 0.08);
}

.switch input[type=checkbox][disabled] + .lever {
  cursor: default;
  background-color: rgba(0, 0, 0, 0.12);
}

.switch label input[type=checkbox][disabled] + .lever:after,
.switch label input[type=checkbox][disabled]:checked + .lever:after {
  background-color: #949494;
}

/* Select Field
   ========================================================================== */
select {
  display: none;
}

select.browser-default {
  display: block;
}

select {
  background-color: rgba(255, 255, 255, 0.9);
  width: 100%;
  padding: 5px;
  border: 1px solid #f2f2f2;
  border-radius: 2px;
  height: 3rem;
}

.select-label {
  position: absolute;
}

.select-wrapper {
  position: relative;
}

.select-wrapper.valid + label,
.select-wrapper.invalid + label {
  width: 100%;
  pointer-events: none;
}

.select-wrapper input.select-dropdown {
  position: relative;
  cursor: pointer;
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #9e9e9e;
  outline: none;
  height: 3rem;
  line-height: 3rem;
  width: 100%;
  font-size: 16px;
  margin: 0 0 8px 0;
  padding: 0;
  display: block;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  z-index: 1;
}

.select-wrapper input.select-dropdown:focus {
  border-bottom: 1px solid #114B43;
}

.select-wrapper .caret {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto 0;
  z-index: 0;
  fill: rgba(0, 0, 0, 0.87);
}

.select-wrapper + label {
  position: absolute;
  top: -26px;
  font-size: 0.8rem;
}

select:disabled {
  color: rgba(0, 0, 0, 0.42);
}

.select-wrapper.disabled + label {
  color: rgba(0, 0, 0, 0.42);
}

.select-wrapper.disabled .caret {
  fill: rgba(0, 0, 0, 0.42);
}

.select-wrapper input.select-dropdown:disabled {
  color: rgba(0, 0, 0, 0.42);
  cursor: default;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.select-wrapper i {
  color: rgba(0, 0, 0, 0.3);
}

.select-dropdown li.disabled,
.select-dropdown li.disabled > span,
.select-dropdown li.optgroup {
  color: rgba(0, 0, 0, 0.3);
  background-color: transparent;
}

body.keyboard-focused .select-dropdown.dropdown-content li:focus {
  background-color: rgba(0, 0, 0, 0.08);
}

.select-dropdown.dropdown-content li:hover {
  background-color: rgba(0, 0, 0, 0.08);
}

.select-dropdown.dropdown-content li.selected {
  background-color: rgba(0, 0, 0, 0.03);
}

.prefix ~ .select-wrapper {
  margin-left: 3rem;
  width: 92%;
  width: calc(100% - 3rem);
}

.prefix ~ label {
  margin-left: 3rem;
}

.select-dropdown li img {
  height: 40px;
  width: 40px;
  margin: 5px 15px;
  float: right;
}

.select-dropdown li.optgroup {
  border-top: 1px solid #eee;
}

.select-dropdown li.optgroup.selected > span {
  color: rgba(0, 0, 0, 0.7);
}

.select-dropdown li.optgroup > span {
  color: rgba(0, 0, 0, 0.4);
}

.select-dropdown li.optgroup ~ li.optgroup-option {
  padding-left: 1rem;
}

/* File Input
   ========================================================================== */
.file-field {
  position: relative;
}

.file-field .file-path-wrapper {
  overflow: hidden;
  padding-left: 10px;
}

.file-field input.file-path {
  width: 100%;
}

.file-field .btn, .file-field .btn-large, .file-field .btn-small {
  float: left;
  height: 3rem;
  line-height: 3rem;
}

.file-field span {
  cursor: pointer;
}

.file-field input[type=file] {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: 20px;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0);
}

.file-field input[type=file]::-webkit-file-upload-button {
  display: none;
}

/* Range
   ========================================================================== */
.range-field {
  position: relative;
}

input[type=range],
input[type=range] + .thumb {
  cursor: pointer;
}

input[type=range] {
  position: relative;
  background-color: transparent;
  border: none;
  outline: none;
  width: 100%;
  margin: 15px 0;
  padding: 0;
}

input[type=range]:focus {
  outline: none;
}

input[type=range] + .thumb {
  position: absolute;
  top: 10px;
  left: 0;
  border: none;
  height: 0;
  width: 0;
  border-radius: 50%;
  background-color: #114B43;
  margin-left: 7px;
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

input[type=range] + .thumb .value {
  display: block;
  width: 30px;
  text-align: center;
  color: #114B43;
  font-size: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

input[type=range] + .thumb.active {
  border-radius: 50% 50% 50% 0;
}

input[type=range] + .thumb.active .value {
  color: #fff;
  margin-left: -1px;
  margin-top: 8px;
  font-size: 10px;
}

input[type=range] {
  -webkit-appearance: none;
}

input[type=range]::-webkit-slider-runnable-track {
  height: 3px;
  background: #c2c0c2;
  border: none;
}

input[type=range]::-webkit-slider-thumb {
  border: none;
  height: 14px;
  width: 14px;
  border-radius: 50%;
  background: #114B43;
  -webkit-transition: -webkit-box-shadow .3s;
  transition: -webkit-box-shadow .3s;
  transition: box-shadow .3s;
  transition: box-shadow .3s, -webkit-box-shadow .3s;
  -webkit-appearance: none;
  background-color: #114B43;
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  margin: -5px 0 0 0;
}

.keyboard-focused input[type=range]:focus:not(.active)::-webkit-slider-thumb {
  -webkit-box-shadow: 0 0 0 10px rgba(60,118,58, 0.26);
          box-shadow: 0 0 0 10px rgba(60,118,58, 0.26);
}

input[type=range] {
  /* fix for FF unable to apply focus style bug  */
  border: 1px solid white;
  /*required for proper track sizing in FF*/
}

input[type=range]::-moz-range-track {
  height: 3px;
  background: #c2c0c2;
  border: none;
}

input[type=range]::-moz-focus-inner {
  border: 0;
}

input[type=range]::-moz-range-thumb {
  border: none;
  height: 14px;
  width: 14px;
  border-radius: 50%;
  background: #114B43;
  -webkit-transition: -webkit-box-shadow .3s;
  transition: -webkit-box-shadow .3s;
  transition: box-shadow .3s;
  transition: box-shadow .3s, -webkit-box-shadow .3s;
  margin-top: -5px;
}

input[type=range]:-moz-focusring {
  outline: 1px solid #fff;
  outline-offset: -1px;
}

.keyboard-focused input[type=range]:focus:not(.active)::-moz-range-thumb {
  box-shadow: 0 0 0 10px rgba(60,118,58, 0.26);
}

input[type=range]::-ms-track {
  height: 3px;
  background: transparent;
  border-color: transparent;
  border-width: 6px 0;
  /*remove default tick marks*/
  color: transparent;
}

input[type=range]::-ms-fill-lower {
  background: #777;
}

input[type=range]::-ms-fill-upper {
  background: #ddd;
}

input[type=range]::-ms-thumb {
  border: none;
  height: 14px;
  width: 14px;
  border-radius: 50%;
  background: #114B43;
  -webkit-transition: -webkit-box-shadow .3s;
  transition: -webkit-box-shadow .3s;
  transition: box-shadow .3s;
  transition: box-shadow .3s, -webkit-box-shadow .3s;
}

.keyboard-focused input[type=range]:focus:not(.active)::-ms-thumb {
  box-shadow: 0 0 0 10px rgba(60,118,58, 0.26);
}


.table-of-contents.fixed {
  position: fixed;
}

.table-of-contents li {
  padding: 2px 0;
}

.table-of-contents a {
  display: inline-block;
  font-weight: 300;
  color: #757575;
  padding-left: 16px;
  height: 1.5rem;
  line-height: 1.5rem;
  letter-spacing: .4;
  display: inline-block;
}

.table-of-contents a:hover {
  color: #a8a8a8;
  padding-left: 15px;
  border-left: 1px solid #ee6e73;
}

.table-of-contents a.active {
  font-weight: 500;
  padding-left: 14px;
  border-left: 2px solid #ee6e73;
}

.sidenav {
  position: fixed;
  width: 300px;
  left: 0;
  top: 0;
  margin: 0;
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
  height: 100%;
  height: calc(100% + 60px);
  height: -moz-calc(100%);
  padding-bottom: 60px;
  background-color: #fff;
  z-index: 999;
  overflow-y: auto;
  will-change: transform;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transform: translateX(-105%);
          transform: translateX(-105%);
}

.sidenav.right-aligned {
  right: 0;
  -webkit-transform: translateX(105%);
          transform: translateX(105%);
  left: auto;
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
}

.sidenav .collapsible {
  margin: 0;
}

.sidenav li {
  float: none;
  line-height: 48px;
}

.sidenav li.active {
  background-color: rgba(0, 0, 0, 0.05);
}

.sidenav li > a {
  color: rgba(0, 0, 0, 0.87);
  display: block;
  font-size: 14px;
  font-weight: 500;
  height: 48px;
  line-height: 48px;
  padding: 0 32px;
}

.sidenav li > a:hover {
  background-color: rgba(0, 0, 0, 0.05);
}

.sidenav li > a.btn, .sidenav li > a.btn-large, .sidenav li > a.btn-small, .sidenav li > a.btn-large, .sidenav li > a.btn-flat, .sidenav li > a.btn-floating {
  margin: 10px 15px;
}

.sidenav li > a.btn, .sidenav li > a.btn-large, .sidenav li > a.btn-small, .sidenav li > a.btn-large, .sidenav li > a.btn-floating {
  color: #fff;
}

.sidenav li > a.btn-flat {
  color: #343434;
}

.sidenav li > a.btn:hover, .sidenav li > a.btn-large:hover, .sidenav li > a.btn-small:hover, .sidenav li > a.btn-large:hover {
  background-color: #82C55D;
}

.sidenav li > a.btn-floating:hover {
  background-color: #114B43;
}

.sidenav li > a > i,
.sidenav li > a > [class^="mdi-"], .sidenav li > a li > a > [class*="mdi-"],
.sidenav li > a > i.material-icons {
  float: left;
  height: 48px;
  line-height: 48px;
  margin: 0 32px 0 0;
  width: 24px;
  color: rgba(0, 0, 0, 0.54);
}

.sidenav .divider {
  margin: 8px 0 0 0;
}

.sidenav .subheader {
  cursor: initial;
  pointer-events: none;
  color: rgba(0, 0, 0, 0.54);
  font-size: 14px;
  font-weight: 500;
  line-height: 48px;
}

.sidenav .subheader:hover {
  background-color: transparent;
}

.sidenav .user-view {
  position: relative;
  padding: 32px 32px 0;
  margin-bottom: 8px;
}

.sidenav .user-view > a {
  height: auto;
  padding: 0;
}

.sidenav .user-view > a:hover {
  background-color: transparent;
}

.sidenav .user-view .background {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
}

.sidenav .user-view .circle, .sidenav .user-view .name, .sidenav .user-view .email {
  display: block;
}

.sidenav .user-view .circle {
  height: 64px;
  width: 64px;
}

.sidenav .user-view .name,
.sidenav .user-view .email {
  font-size: 14px;
  line-height: 24px;
}

.sidenav .user-view .name {
  margin-top: 16px;
  font-weight: 500;
}

.sidenav .user-view .email {
  padding-bottom: 16px;
  font-weight: 400;
}

.drag-target {
  height: 100%;
  width: 10px;
  position: fixed;
  top: 0;
  z-index: 998;
}

.drag-target.right-aligned {
  right: 0;
}

.sidenav.sidenav-fixed {
  left: 0;
  -webkit-transform: translateX(0);
          transform: translateX(0);
  position: fixed;
}

.sidenav.sidenav-fixed.right-aligned {
  right: 0;
  left: auto;
}

@media only screen and (max-width: 992px) {
  .sidenav.sidenav-fixed {
    -webkit-transform: translateX(-105%);
            transform: translateX(-105%);
  }
  .sidenav.sidenav-fixed.right-aligned {
    -webkit-transform: translateX(105%);
            transform: translateX(105%);
  }
  .sidenav > a {
    padding: 0 16px;
  }
  .sidenav .user-view {
    padding: 16px 16px 0;
  }
}

.sidenav .collapsible-body > ul:not(.collapsible) > li.active,
.sidenav.sidenav-fixed .collapsible-body > ul:not(.collapsible) > li.active {
  background-color: #ee6e73;
}

.sidenav .collapsible-body > ul:not(.collapsible) > li.active a,
.sidenav.sidenav-fixed .collapsible-body > ul:not(.collapsible) > li.active a {
  color: #fff;
}

.sidenav .collapsible-body {
  padding: 0;
}

.sidenav-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  opacity: 0;
  height: 120vh;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 997;
  display: none;
}

/*
    @license
    Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
    This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
    The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
    The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
    Code distributed by Google as part of the polymer project is also
    subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
 */

/* STYLES FOR THE SPINNER */

/*
 * Constants:
 *      STROKEWIDTH = 3px
 *      ARCSIZE     = 270 degrees (amount of circle the arc takes up)
 *      ARCTIME     = 1333ms (time it takes to expand and contract arc)
 *      ARCSTARTROT = 216 degrees (how much the start location of the arc
 *                                should rotate each time, 216 gives us a
 *                                5 pointed star shape (it's 360/5 * 3).
 *                                For a 7 pointed star, we might do
 *                                360/7 * 3 = 154.286)
 *      CONTAINERWIDTH = 28px
 *      SHRINK_TIME = 400ms
 */
.preloader-wrapper {
  display: inline-block;
  position: relative;
  width: 50px;
  height: 50px;
}

.preloader-wrapper.small {
  width: 36px;
  height: 36px;
}

.preloader-wrapper.big {
  width: 64px;
  height: 64px;
}

.preloader-wrapper.active {
  /* duration: 360 * ARCTIME / (ARCSTARTROT + (360-ARCSIZE)) */
  -webkit-animation: container-rotate 1568ms linear infinite;
  animation: container-rotate 1568ms linear infinite;
}

@-webkit-keyframes container-rotate {
  to {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes container-rotate {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

.spinner-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  border-color: #114B43;
}

.spinner-blue,
.spinner-blue-only {
  border-color: #4285f4;
}

.spinner-red,
.spinner-red-only {
  border-color: #db4437;
}

.spinner-yellow,
.spinner-yellow-only {
  border-color: #f4b400;
}

.spinner-green,
.spinner-green-only {
  border-color: #0f9d58;
}

/**
 * IMPORTANT NOTE ABOUT CSS ANIMATION PROPERTIES (keanulee):
 *
 * iOS Safari (tested on iOS 8.1) does not handle animation-delay very well - it doesn't
 * guarantee that the animation will start _exactly_ after that value. So we avoid using
 * animation-delay and instead set custom keyframes for each color (as redundant as it
 * seems).
 *
 * We write out each animation in full (instead of separating animation-name,
 * animation-duration, etc.) because under the polyfill, Safari does not recognize those
 * specific properties properly, treats them as -webkit-animation, and overrides the
 * other animation rules. See https://github.com/Polymer/platform/issues/53.
 */
.active .spinner-layer.spinner-blue {
  /* durations: 4 * ARCTIME */
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}

.active .spinner-layer.spinner-red {
  /* durations: 4 * ARCTIME */
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}

.active .spinner-layer.spinner-yellow {
  /* durations: 4 * ARCTIME */
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}

.active .spinner-layer.spinner-green {
  /* durations: 4 * ARCTIME */
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}

.active .spinner-layer,
.active .spinner-layer.spinner-blue-only,
.active .spinner-layer.spinner-red-only,
.active .spinner-layer.spinner-yellow-only,
.active .spinner-layer.spinner-green-only {
  /* durations: 4 * ARCTIME */
  opacity: 1;
  -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}

@-webkit-keyframes fill-unfill-rotate {
  12.5% {
    -webkit-transform: rotate(135deg);
  }
  /* 0.5 * ARCSIZE */
  25% {
    -webkit-transform: rotate(270deg);
  }
  /* 1   * ARCSIZE */
  37.5% {
    -webkit-transform: rotate(405deg);
  }
  /* 1.5 * ARCSIZE */
  50% {
    -webkit-transform: rotate(540deg);
  }
  /* 2   * ARCSIZE */
  62.5% {
    -webkit-transform: rotate(675deg);
  }
  /* 2.5 * ARCSIZE */
  75% {
    -webkit-transform: rotate(810deg);
  }
  /* 3   * ARCSIZE */
  87.5% {
    -webkit-transform: rotate(945deg);
  }
  /* 3.5 * ARCSIZE */
  to {
    -webkit-transform: rotate(1080deg);
  }
  /* 4   * ARCSIZE */
}

@keyframes fill-unfill-rotate {
  12.5% {
    -webkit-transform: rotate(135deg);
            transform: rotate(135deg);
  }
  /* 0.5 * ARCSIZE */
  25% {
    -webkit-transform: rotate(270deg);
            transform: rotate(270deg);
  }
  /* 1   * ARCSIZE */
  37.5% {
    -webkit-transform: rotate(405deg);
            transform: rotate(405deg);
  }
  /* 1.5 * ARCSIZE */
  50% {
    -webkit-transform: rotate(540deg);
            transform: rotate(540deg);
  }
  /* 2   * ARCSIZE */
  62.5% {
    -webkit-transform: rotate(675deg);
            transform: rotate(675deg);
  }
  /* 2.5 * ARCSIZE */
  75% {
    -webkit-transform: rotate(810deg);
            transform: rotate(810deg);
  }
  /* 3   * ARCSIZE */
  87.5% {
    -webkit-transform: rotate(945deg);
            transform: rotate(945deg);
  }
  /* 3.5 * ARCSIZE */
  to {
    -webkit-transform: rotate(1080deg);
            transform: rotate(1080deg);
  }
  /* 4   * ARCSIZE */
}

@-webkit-keyframes blue-fade-in-out {
  from {
    opacity: 1;
  }
  25% {
    opacity: 1;
  }
  26% {
    opacity: 0;
  }
  89% {
    opacity: 0;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blue-fade-in-out {
  from {
    opacity: 1;
  }
  25% {
    opacity: 1;
  }
  26% {
    opacity: 0;
  }
  89% {
    opacity: 0;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes red-fade-in-out {
  from {
    opacity: 0;
  }
  15% {
    opacity: 0;
  }
  25% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  51% {
    opacity: 0;
  }
}

@keyframes red-fade-in-out {
  from {
    opacity: 0;
  }
  15% {
    opacity: 0;
  }
  25% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  51% {
    opacity: 0;
  }
}

@-webkit-keyframes yellow-fade-in-out {
  from {
    opacity: 0;
  }
  40% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  75% {
    opacity: 1;
  }
  76% {
    opacity: 0;
  }
}

@keyframes yellow-fade-in-out {
  from {
    opacity: 0;
  }
  40% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  75% {
    opacity: 1;
  }
  76% {
    opacity: 0;
  }
}

@-webkit-keyframes green-fade-in-out {
  from {
    opacity: 0;
  }
  65% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes green-fade-in-out {
  from {
    opacity: 0;
  }
  65% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}


.gap-patch {
  position: absolute;
  top: 0;
  left: 45%;
  width: 10%;
  height: 100%;
  overflow: hidden;
  border-color: inherit;
}

.gap-patch .circle {
  width: 1000%;
  left: -450%;
}

.circle-clipper {
  display: inline-block;
  position: relative;
  width: 50%;
  height: 100%;
  overflow: hidden;
  border-color: inherit;
}

.circle-clipper .circle {
  width: 200%;
  height: 100%;
  border-width: 3px;
  /* STROKEWIDTH */
  border-style: solid;
  border-color: inherit;
  border-bottom-color: transparent !important;
  border-radius: 50%;
  -webkit-animation: none;
  animation: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}

.circle-clipper.left .circle {
  left: 0;
  border-right-color: transparent !important;
  -webkit-transform: rotate(129deg);
  transform: rotate(129deg);
}

.circle-clipper.right .circle {
  left: -100%;
  border-left-color: transparent !important;
  -webkit-transform: rotate(-129deg);
  transform: rotate(-129deg);
}

.active .circle-clipper.left .circle {
  /* duration: ARCTIME */
  -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}

.active .circle-clipper.right .circle {
  /* duration: ARCTIME */
  -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}

@-webkit-keyframes left-spin {
  from {
    -webkit-transform: rotate(130deg);
  }
  50% {
    -webkit-transform: rotate(-5deg);
  }
  to {
    -webkit-transform: rotate(130deg);
  }
}

@keyframes left-spin {
  from {
    -webkit-transform: rotate(130deg);
            transform: rotate(130deg);
  }
  50% {
    -webkit-transform: rotate(-5deg);
            transform: rotate(-5deg);
  }
  to {
    -webkit-transform: rotate(130deg);
            transform: rotate(130deg);
  }
}

@-webkit-keyframes right-spin {
  from {
    -webkit-transform: rotate(-130deg);
  }
  50% {
    -webkit-transform: rotate(5deg);
  }
  to {
    -webkit-transform: rotate(-130deg);
  }
}

@keyframes right-spin {
  from {
    -webkit-transform: rotate(-130deg);
            transform: rotate(-130deg);
  }
  50% {
    -webkit-transform: rotate(5deg);
            transform: rotate(5deg);
  }
  to {
    -webkit-transform: rotate(-130deg);
            transform: rotate(-130deg);
  }
}

#spinnerContainer.cooldown {
  /* duration: SHRINK_TIME */
  -webkit-animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1);
  animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1);
}

@-webkit-keyframes fade-out {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes fade-out {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.slider {
  position: relative;
  height: 400px;
  width: 100%;
}

.slider.fullscreen {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.slider.fullscreen ul.slides {
  height: 100%;
}

.slider.fullscreen ul.indicators {
  z-index: 2;
  bottom: 30px;
}

.slider .slides {
  background-color: #9e9e9e;
  margin: 0;
  height: 400px;
}

.slider .slides li {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: inherit;
  overflow: hidden;
}

.slider .slides li img {
  height: 100%;
  width: 100%;
  background-size: cover;
  background-position: center;
}

.slider .slides li .caption {
  color: #fff;
  position: absolute;
  top: 15%;
  left: 15%;
  width: 70%;
  opacity: 0;
}

.slider .slides li .caption p {
  color: #e0e0e0;
}

.slider .slides li.active {
  z-index: 2;
}

.slider .indicators {
  position: absolute;
  text-align: center;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0;
}

.slider .indicators .indicator-item {
  display: inline-block;
  position: relative;
  cursor: pointer;
  height: 16px;
  width: 16px;
  margin: 0 12px;
  background-color: #e0e0e0;
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
  border-radius: 50%;
}

.slider .indicators .indicator-item.active {
  background-color: #FAAC1A;
  color: #1A2421;
}

.carousel {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 400px;
  -webkit-perspective: 500px;
          perspective: 500px;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-transform-origin: 0% 50%;
          transform-origin: 0% 50%;
}

.carousel.carousel-slider {
  top: 0;
  left: 0;
}

.carousel.carousel-slider .carousel-fixed-item {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 20px;
  z-index: 1;
}

.carousel.carousel-slider .carousel-fixed-item.with-indicators {
  bottom: 68px;
}

.carousel.carousel-slider .carousel-item {
  width: 100%;
  height: 100%;
  min-height: 400px;
  position: absolute;
  top: 0;
  left: 0;
}

.carousel.carousel-slider .carousel-item h2 {
  font-size: 24px;
  font-weight: 500;
  line-height: 32px;
}

.carousel.carousel-slider .carousel-item p {
  font-size: 15px;
}

.carousel .carousel-item {
  visibility: hidden;
  width: 200px;
  height: 200px;
  position: absolute;
  top: 0;
  left: 0;
}

.carousel .carousel-item > img {
  width: 100%;
}

.carousel .indicators {
  position: absolute;
  text-align: center;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0;
}

.carousel .indicators .indicator-item {
  display: inline-block;
  position: relative;
  cursor: pointer;
  height: 8px;
  width: 8px;
  margin: 24px 4px;
  background-color: rgba(255, 255, 255, 0.5);
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
  border-radius: 50%;
}

.carousel .indicators .indicator-item.active {
  background-color: #fff;
}

.carousel.scrolling .carousel-item .materialboxed,
.carousel .carousel-item:not(.active) .materialboxed {
  pointer-events: none;
}

.tap-target-wrapper {
  width: 800px;
  height: 800px;
  position: fixed;
  z-index: 1000;
  visibility: hidden;
  -webkit-transition: visibility 0s .3s;
  transition: visibility 0s .3s;
}

.tap-target-wrapper.open {
  visibility: visible;
  -webkit-transition: visibility 0s;
  transition: visibility 0s;
}

.tap-target-wrapper.open .tap-target {
  -webkit-transform: scale(1);
          transform: scale(1);
  opacity: .95;
  -webkit-transition: opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  transition: opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  transition: transform 0.3s cubic-bezier(0.42, 0, 0.58, 1), opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  transition: transform 0.3s cubic-bezier(0.42, 0, 0.58, 1), opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
}

.tap-target-wrapper.open .tap-target-wave::before {
  -webkit-transform: scale(1);
          transform: scale(1);
}

.tap-target-wrapper.open .tap-target-wave::after {
  visibility: visible;
  -webkit-animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
          animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
  -webkit-transition: opacity .3s,
 visibility 0s 1s,
 -webkit-transform .3s;
  transition: opacity .3s,
 visibility 0s 1s,
 -webkit-transform .3s;
  transition: opacity .3s,
 transform .3s,
 visibility 0s 1s;
  transition: opacity .3s,
 transform .3s,
 visibility 0s 1s,
 -webkit-transform .3s;
}

.tap-target {
  position: absolute;
  font-size: 1rem;
  border-radius: 50%;
  background-color: #ee6e73;
  -webkit-box-shadow: 0 20px 20px 0 rgba(0, 0, 0, 0.14), 0 10px 50px 0 rgba(0, 0, 0, 0.12), 0 30px 10px -20px rgba(0, 0, 0, 0.2);
          box-shadow: 0 20px 20px 0 rgba(0, 0, 0, 0.14), 0 10px 50px 0 rgba(0, 0, 0, 0.12), 0 30px 10px -20px rgba(0, 0, 0, 0.2);
  width: 100%;
  height: 100%;
  opacity: 0;
  -webkit-transform: scale(0);
          transform: scale(0);
  -webkit-transition: opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  transition: opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  transition: transform 0.3s cubic-bezier(0.42, 0, 0.58, 1), opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  transition: transform 0.3s cubic-bezier(0.42, 0, 0.58, 1), opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
}

.tap-target-content {
  position: relative;
  display: table-cell;
}

.tap-target-wave {
  position: absolute;
  border-radius: 50%;
  z-index: 10001;
}

.tap-target-wave::before, .tap-target-wave::after {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #ffffff;
}

.tap-target-wave::before {
  -webkit-transform: scale(0);
          transform: scale(0);
  -webkit-transition: -webkit-transform .3s;
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s;
}

.tap-target-wave::after {
  visibility: hidden;
  -webkit-transition: opacity .3s,
 visibility 0s,
 -webkit-transform .3s;
  transition: opacity .3s,
 visibility 0s,
 -webkit-transform .3s;
  transition: opacity .3s,
 transform .3s,
 visibility 0s;
  transition: opacity .3s,
 transform .3s,
 visibility 0s,
 -webkit-transform .3s;
  z-index: -1;
}

.tap-target-origin {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 10002;
  position: absolute !important;
}

.tap-target-origin:not(.btn):not(.btn-large):not(.btn-small), .tap-target-origin:not(.btn):not(.btn-large):not(.btn-small):hover {
  background: none;
}

@media only screen and (max-width: 600px) {
  .tap-target, .tap-target-wrapper {
    width: 600px;
    height: 600px;
  }
}

.pulse {
  overflow: visible;
  position: relative;
}

.pulse::before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: inherit;
  border-radius: inherit;
  -webkit-transition: opacity .3s, -webkit-transform .3s;
  transition: opacity .3s, -webkit-transform .3s;
  transition: opacity .3s, transform .3s;
  transition: opacity .3s, transform .3s, -webkit-transform .3s;
  -webkit-animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
          animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
  z-index: -1;
}

@-webkit-keyframes pulse-animation {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    opacity: 0;
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
  }
}

@keyframes pulse-animation {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    opacity: 0;
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
  }
}

/* Modal */
.datepicker-modal {
  max-width: 325px;
  min-width: 300px;
  max-height: none;
}

.datepicker-container.modal-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 0;
}

.datepicker-controls {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 280px;
  margin: 0 auto;
}

.datepicker-controls .selects-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.datepicker-controls .select-wrapper input {
  border-bottom: none;
  text-align: center;
  margin: 0;
}

.datepicker-controls .select-wrapper input:focus {
  border-bottom: none;
}

.datepicker-controls .select-wrapper .caret {
  display: none;
}

.datepicker-controls .select-year input {
  width: 50px;
}

.datepicker-controls .select-month input {
  width: 70px;
}

.month-prev, .month-next {
  margin-top: 4px;
  cursor: pointer;
  background-color: transparent;
  border: none;
}

/* Date Display */
.datepicker-date-display {
  -webkit-box-flex: 1;
  -webkit-flex: 1 auto;
      -ms-flex: 1 auto;
          flex: 1 auto;
  background-color: #114B43;
  color: #fff;
  padding: 20px 22px;
  font-weight: 500;
}

.datepicker-date-display .year-text {
  display: block;
  font-size: 1.5rem;
  line-height: 25px;
  color: rgba(255, 255, 255, 0.7);
}

.datepicker-date-display .date-text {
  display: block;
  font-size: 2.8rem;
  line-height: 47px;
  font-weight: 500;
}

/* Calendar */
.datepicker-calendar-container {
  -webkit-box-flex: 2.5;
  -webkit-flex: 2.5 auto;
      -ms-flex: 2.5 auto;
          flex: 2.5 auto;
}

.datepicker-table {
  width: 280px;
  font-size: 1rem;
  margin: 0 auto;
}

.datepicker-table thead {
  border-bottom: none;
}

.datepicker-table th {
  padding: 10px 5px;
  text-align: center;
}

.datepicker-table tr {
  border: none;
}

.datepicker-table abbr {
  text-decoration: none;
  color: #999;
}

.datepicker-table td {
  border-radius: 50%;
  padding: 0;
}

.datepicker-table td.is-today {
  color: #114B43;
}

.datepicker-table td.is-selected {
  background-color: #114B43;
  color: #fff;
}

.datepicker-table td.is-outside-current-month, .datepicker-table td.is-disabled {
  color: rgba(0, 0, 0, 0.3);
  pointer-events: none;
}

.datepicker-day-button {
  background-color: transparent;
  border: none;
  line-height: 38px;
  display: block;
  width: 100%;
  border-radius: 50%;
  padding: 0 5px;
  cursor: pointer;
  color: inherit;
}

.datepicker-day-button:focus {
  background-color: rgba(43, 161, 150, 0.25);
}

/* Footer */
.datepicker-footer {
  width: 280px;
  margin: 0 auto;
  padding-bottom: 5px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.datepicker-cancel,
.datepicker-clear,
.datepicker-today,
.datepicker-done {
  color: #114B43;
  padding: 0 1rem;
}

.datepicker-clear {
  color: #FF5252;
}

/* Media Queries */
@media only screen and (min-width: 601px) {
  .datepicker-modal {
    max-width: 625px;
  }
  .datepicker-container.modal-content {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
  }
  .datepicker-date-display {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 270px;
        -ms-flex: 0 1 270px;
            flex: 0 1 270px;
  }
  .datepicker-controls,
  .datepicker-table,
  .datepicker-footer {
    width: 320px;
  }
  .datepicker-day-button {
    line-height: 44px;
  }
}

/* Timepicker Containers */
.timepicker-modal {
  max-width: 325px;
  max-height: none;
}

.timepicker-container.modal-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 0;
}

.text-primary {
  color: white;
}

/* Clock Digital Display */
.timepicker-digital-display {
  -webkit-box-flex: 1;
  -webkit-flex: 1 auto;
      -ms-flex: 1 auto;
          flex: 1 auto;
  background-color: #114B43;
  padding: 10px;
  font-weight: 300;
}

.timepicker-text-container {
  font-size: 4rem;
  font-weight: bold;
  text-align: center;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 400;
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.timepicker-span-hours,
.timepicker-span-minutes,
.timepicker-span-am-pm div {
  cursor: pointer;
}

.timepicker-span-hours {
  margin-right: 3px;
}

.timepicker-span-minutes {
  margin-left: 3px;
}

.timepicker-display-am-pm {
  font-size: 1.3rem;
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  font-weight: 400;
}

/* Analog Clock Display */
.timepicker-analog-display {
  -webkit-box-flex: 2.5;
  -webkit-flex: 2.5 auto;
      -ms-flex: 2.5 auto;
          flex: 2.5 auto;
}

.timepicker-plate {
  background-color: #eee;
  border-radius: 50%;
  width: 270px;
  height: 270px;
  overflow: visible;
  position: relative;
  margin: auto;
  margin-top: 25px;
  margin-bottom: 5px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.timepicker-canvas,
.timepicker-dial {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.timepicker-minutes {
  visibility: hidden;
}

.timepicker-tick {
  border-radius: 50%;
  color: rgba(0, 0, 0, 0.87);
  line-height: 40px;
  text-align: center;
  width: 40px;
  height: 40px;
  position: absolute;
  cursor: pointer;
  font-size: 15px;
}

.timepicker-tick.active,
.timepicker-tick:hover {
  background-color: rgba(60,118,58, 0.25);
}

.timepicker-dial {
  -webkit-transition: opacity 350ms, -webkit-transform 350ms;
  transition: opacity 350ms, -webkit-transform 350ms;
  transition: transform 350ms, opacity 350ms;
  transition: transform 350ms, opacity 350ms, -webkit-transform 350ms;
}

.timepicker-dial-out {
  opacity: 0;
}

.timepicker-dial-out.timepicker-hours {
  -webkit-transform: scale(1.1, 1.1);
          transform: scale(1.1, 1.1);
}

.timepicker-dial-out.timepicker-minutes {
  -webkit-transform: scale(0.8, 0.8);
          transform: scale(0.8, 0.8);
}

.timepicker-canvas {
  -webkit-transition: opacity 175ms;
  transition: opacity 175ms;
}

.timepicker-canvas line {
  stroke: #114B43;
  stroke-width: 4;
  stroke-linecap: round;
}

.timepicker-canvas-out {
  opacity: 0.25;
}

.timepicker-canvas-bearing {
  stroke: none;
  fill: #114B43;
}

.timepicker-canvas-bg {
  stroke: none;
  fill: #114B43;
}

/* Footer */
.timepicker-footer {
  margin: 0 auto;
  padding: 5px 1rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.timepicker-clear {
  color: #FF5252;
}

.timepicker-close {
  color: #114B43;
}

.timepicker-clear,
.timepicker-close {
  padding: 0 20px;
}

/* Media Queries */
@media only screen and (min-width: 601px) {
  .timepicker-modal {
    max-width: 600px;
  }
  .timepicker-container.modal-content {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
  }
  .timepicker-text-container {
    top: 32%;
  }
  .timepicker-display-am-pm {
    position: relative;
    right: auto;
    bottom: auto;
    text-align: center;
    margin-top: 1.2rem;
  }
}


h1, h2, h3, h4, h5, h6, a, p, span, ul, ol, li, button, label {
  margin: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

h1, h2, h3, h4, h5, h6, a, p, span, ul, ol, li, button, label {
  color: @text-color;
  font-family: @font-family-roboto;
  font-size: 10px;
}

.row {
  margin-bottom: 0;
}

input, textarea {
  color: @text-color;
  font-family: @font-family-roboto;
  font-size: 10px;
  outline: none;
}

input {
  -webkit-appearance: none;
  border-radius: 0;
}

a:hover, a:focus, a:active {
  text-decoration: none;
  outline: none;
}

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.important {
  display: none;
}

.overflow-ellipsis {
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  white-space: nowrap;
}

::-webkit-input-placeholder {
  color:    rgba(0, 0, 0, 0.54);
}
:-moz-placeholder {
  color:    rgba(0, 0, 0, 0.54);
  opacity: 1;
}
::-moz-placeholder {
  color:    rgba(0, 0, 0, 0.54);
  opacity: 1;
}
:-ms-input-placeholder {
  color:    rgba(0, 0, 0, 0.54);
}

.visible-xs {
  display: none;
}

.hidden-xs {
  display: inherit;
}

.visible-sm {
  display: none;
}

.hidden-sm {
  display: inherit;
}

.dividers-color {
  color: @dividers-color;
}

.hint-text-color {
  color: @hint-text-color;
}

.secondary-text-color {
  color: @secondary-text-color;
}

.icons-color {
  color: @icons-color;
}

.text-color {
  color: @text-color;
}

@media @xs {
  .text-left-xs {
    text-align: left;
  }

  .text-center-xs {
    text-align: center;
  }

  .text-right-xs {
    text-align: right;
  }

  .text-left-sm {
    text-align: left;
  }

  .text-center-sm {
    text-align: center;
  }

  .text-right-sm {
    text-align: right;
  }

  .visible-xs {
    display: inherit;
  }

  .hidden-xs {
    display: none;
  }

  .hidden-sm {
    display: none;
  }
}

@media @sm {
  .text-left-sm {
    text-align: left;
  }

  .text-center-sm {
    text-align: center;
  }

  .text-right-sm {
    text-align: right;
  }

  .visible-sm {
    display: inherit;
  }

  .hidden-sm {
    display: none;
  }
}

@media @md {

}

@form-background-color: #EDEDED;

@font-face {
  font-family: 'futura';
  src: url('/assets/_files/styles/fonts/futura_bold.eot');
  src: url('/assets/_files/styles/fonts/futura_bold.eot?#iefix') format('embedded-opentype'),
  url('/assets/_files/styles/fonts/futura_bold.woff') format('woff'),
  url('/assets/_files/styles/fonts/futura_bold.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'expressa_serial';
  src: url('/assets/_files/styles/fonts/expressa_serial.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'expressa_serial_bold';
  src: url('/assets/_files/styles/fonts/expressa_serial_bold.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'expressa_serial_heavy';
  src: url('/assets/_files/styles/fonts/expressa_serial_heavy.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'expressa_serial_light';
  src: url('/assets/_files/styles/fonts/expressa_serial_light.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'expressa_serial_xbold';
  src: url('/assets/_files/styles/fonts/expressa_serial_xbold.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/*!
 * Font Awesome Free 5.12.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 */
.fa,
.fas,
.far,
.fal,
.fad,
.fab {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1; }

.fa-lg {
  font-size: 1.33333em;
  line-height: 0.75em;
  vertical-align: -.0667em; }

.fa-xs {
  font-size: .75em; }

.fa-sm {
  font-size: .875em; }

.fa-1x {
  font-size: 1em; }

.fa-2x {
  font-size: 2em; }

.fa-3x {
  font-size: 3em; }

.fa-4x {
  font-size: 4em; }

.fa-5x {
  font-size: 5em; }

.fa-6x {
  font-size: 6em; }

.fa-7x {
  font-size: 7em; }

.fa-8x {
  font-size: 8em; }

.fa-9x {
  font-size: 9em; }

.fa-10x {
  font-size: 10em; }

.fa-fw {
  text-align: center;
  width: 1.25em; }

.fa-ul {
  list-style-type: none;
  margin-left: 2.5em;
  padding-left: 0; }
  .fa-ul > li {
    position: relative; }

.fa-li {
  left: -2em;
  position: absolute;
  text-align: center;
  width: 2em;
  line-height: inherit; }

.fa-border {
  border: solid 0.08em #eee;
  border-radius: .1em;
  padding: .2em .25em .15em; }

.fa-pull-left {
  float: left; }

.fa-pull-right {
  float: right; }

.fa.fa-pull-left,
.fas.fa-pull-left,
.far.fa-pull-left,
.fal.fa-pull-left,
.fab.fa-pull-left {
  margin-right: .3em; }

.fa.fa-pull-right,
.fas.fa-pull-right,
.far.fa-pull-right,
.fal.fa-pull-right,
.fab.fa-pull-right {
  margin-left: .3em; }

.fa-spin {
  -webkit-animation: fa-spin 2s infinite linear;
          animation: fa-spin 2s infinite linear; }

.fa-pulse {
  -webkit-animation: fa-spin 1s infinite steps(8);
          animation: fa-spin 1s infinite steps(8); }

@-webkit-keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

.fa-rotate-90 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg); }

.fa-rotate-180 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg); }

.fa-rotate-270 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg); }

.fa-flip-horizontal {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1); }

.fa-flip-vertical {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  -webkit-transform: scale(1, -1);
          transform: scale(1, -1); }

.fa-flip-both, .fa-flip-horizontal.fa-flip-vertical {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  -webkit-transform: scale(-1, -1);
          transform: scale(-1, -1); }

:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical,
:root .fa-flip-both {
  -webkit-filter: none;
          filter: none; }

.fa-stack {
  display: inline-block;
  height: 2em;
  line-height: 2em;
  position: relative;
  vertical-align: middle;
  width: 2.5em; }

.fa-stack-1x,
.fa-stack-2x {
  left: 0;
  position: absolute;
  text-align: center;
  width: 100%; }

.fa-stack-1x {
  line-height: inherit; }

.fa-stack-2x {
  font-size: 2em; }

.fa-inverse {
  color: #fff; }

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
readers do not read off random characters that represent icons */
.fa-500px:before {
  content: "\f26e"; }

.fa-accessible-icon:before {
  content: "\f368"; }

.fa-accusoft:before {
  content: "\f369"; }

.fa-acquisitions-incorporated:before {
  content: "\f6af"; }

.fa-ad:before {
  content: "\f641"; }

.fa-address-book:before {
  content: "\f2b9"; }

.fa-address-card:before {
  content: "\f2bb"; }

.fa-adjust:before {
  content: "\f042"; }

.fa-adn:before {
  content: "\f170"; }

.fa-adobe:before {
  content: "\f778"; }

.fa-adversal:before {
  content: "\f36a"; }

.fa-affiliatetheme:before {
  content: "\f36b"; }

.fa-air-freshener:before {
  content: "\f5d0"; }

.fa-airbnb:before {
  content: "\f834"; }

.fa-algolia:before {
  content: "\f36c"; }

.fa-align-center:before {
  content: "\f037"; }

.fa-align-justify:before {
  content: "\f039"; }

.fa-align-left:before {
  content: "\f036"; }

.fa-align-right:before {
  content: "\f038"; }

.fa-alipay:before {
  content: "\f642"; }

.fa-allergies:before {
  content: "\f461"; }

.fa-amazon:before {
  content: "\f270"; }

.fa-amazon-pay:before {
  content: "\f42c"; }

.fa-ambulance:before {
  content: "\f0f9"; }

.fa-american-sign-language-interpreting:before {
  content: "\f2a3"; }

.fa-amilia:before {
  content: "\f36d"; }

.fa-anchor:before {
  content: "\f13d"; }

.fa-android:before {
  content: "\f17b"; }

.fa-angellist:before {
  content: "\f209"; }

.fa-angle-double-down:before {
  content: "\f103"; }

.fa-angle-double-left:before {
  content: "\f100"; }

.fa-angle-double-right:before {
  content: "\f101"; }

.fa-angle-double-up:before {
  content: "\f102"; }

.fa-angle-down:before {
  content: "\f107"; }

.fa-angle-left:before {
  content: "\f104"; }

.fa-angle-right:before {
  content: "\f105"; }

.fa-angle-up:before {
  content: "\f106"; }

.fa-angry:before {
  content: "\f556"; }

.fa-angrycreative:before {
  content: "\f36e"; }

.fa-angular:before {
  content: "\f420"; }

.fa-ankh:before {
  content: "\f644"; }

.fa-app-store:before {
  content: "\f36f"; }

.fa-app-store-ios:before {
  content: "\f370"; }

.fa-apper:before {
  content: "\f371"; }

.fa-apple:before {
  content: "\f179"; }

.fa-apple-alt:before {
  content: "\f5d1"; }

.fa-apple-pay:before {
  content: "\f415"; }

.fa-archive:before {
  content: "\f187"; }

.fa-archway:before {
  content: "\f557"; }

.fa-arrow-alt-circle-down:before {
  content: "\f358"; }

.fa-arrow-alt-circle-left:before {
  content: "\f359"; }

.fa-arrow-alt-circle-right:before {
  content: "\f35a"; }

.fa-arrow-alt-circle-up:before {
  content: "\f35b"; }

.fa-arrow-circle-down:before {
  content: "\f0ab"; }

.fa-arrow-circle-left:before {
  content: "\f0a8"; }

.fa-arrow-circle-right:before {
  content: "\f0a9"; }

.fa-arrow-circle-up:before {
  content: "\f0aa"; }

.fa-arrow-down:before {
  content: "\f063"; }

.fa-arrow-left:before {
  content: "\f060"; }

.fa-arrow-right:before {
  content: "\f061"; }

.fa-arrow-up:before {
  content: "\f062"; }

.fa-arrows-alt:before {
  content: "\f0b2"; }

.fa-arrows-alt-h:before {
  content: "\f337"; }

.fa-arrows-alt-v:before {
  content: "\f338"; }

.fa-artstation:before {
  content: "\f77a"; }

.fa-assistive-listening-systems:before {
  content: "\f2a2"; }

.fa-asterisk:before {
  content: "\f069"; }

.fa-asymmetrik:before {
  content: "\f372"; }

.fa-at:before {
  content: "\f1fa"; }

.fa-atlas:before {
  content: "\f558"; }

.fa-atlassian:before {
  content: "\f77b"; }

.fa-atom:before {
  content: "\f5d2"; }

.fa-audible:before {
  content: "\f373"; }

.fa-audio-description:before {
  content: "\f29e"; }

.fa-autoprefixer:before {
  content: "\f41c"; }

.fa-avianex:before {
  content: "\f374"; }

.fa-aviato:before {
  content: "\f421"; }

.fa-award:before {
  content: "\f559"; }

.fa-aws:before {
  content: "\f375"; }

.fa-baby:before {
  content: "\f77c"; }

.fa-baby-carriage:before {
  content: "\f77d"; }

.fa-backspace:before {
  content: "\f55a"; }

.fa-backward:before {
  content: "\f04a"; }

.fa-bacon:before {
  content: "\f7e5"; }

.fa-bahai:before {
  content: "\f666"; }

.fa-balance-scale:before {
  content: "\f24e"; }

.fa-balance-scale-left:before {
  content: "\f515"; }

.fa-balance-scale-right:before {
  content: "\f516"; }

.fa-ban:before {
  content: "\f05e"; }

.fa-band-aid:before {
  content: "\f462"; }

.fa-bandcamp:before {
  content: "\f2d5"; }

.fa-barcode:before {
  content: "\f02a"; }

.fa-bars:before {
  content: "\f0c9"; }

.fa-baseball-ball:before {
  content: "\f433"; }

.fa-basketball-ball:before {
  content: "\f434"; }

.fa-bath:before {
  content: "\f2cd"; }

.fa-battery-empty:before {
  content: "\f244"; }

.fa-battery-full:before {
  content: "\f240"; }

.fa-battery-half:before {
  content: "\f242"; }

.fa-battery-quarter:before {
  content: "\f243"; }

.fa-battery-three-quarters:before {
  content: "\f241"; }

.fa-battle-net:before {
  content: "\f835"; }

.fa-bed:before {
  content: "\f236"; }

.fa-beer:before {
  content: "\f0fc"; }

.fa-behance:before {
  content: "\f1b4"; }

.fa-behance-square:before {
  content: "\f1b5"; }

.fa-bell:before {
  content: "\f0f3"; }

.fa-bell-slash:before {
  content: "\f1f6"; }

.fa-bezier-curve:before {
  content: "\f55b"; }

.fa-bible:before {
  content: "\f647"; }

.fa-bicycle:before {
  content: "\f206"; }

.fa-biking:before {
  content: "\f84a"; }

.fa-bimobject:before {
  content: "\f378"; }

.fa-binoculars:before {
  content: "\f1e5"; }

.fa-biohazard:before {
  content: "\f780"; }

.fa-birthday-cake:before {
  content: "\f1fd"; }

.fa-bitbucket:before {
  content: "\f171"; }

.fa-bitcoin:before {
  content: "\f379"; }

.fa-bity:before {
  content: "\f37a"; }

.fa-black-tie:before {
  content: "\f27e"; }

.fa-blackberry:before {
  content: "\f37b"; }

.fa-blender:before {
  content: "\f517"; }

.fa-blender-phone:before {
  content: "\f6b6"; }

.fa-blind:before {
  content: "\f29d"; }

.fa-blog:before {
  content: "\f781"; }

.fa-blogger:before {
  content: "\f37c"; }

.fa-blogger-b:before {
  content: "\f37d"; }

.fa-bluetooth:before {
  content: "\f293"; }

.fa-bluetooth-b:before {
  content: "\f294"; }

.fa-bold:before {
  content: "\f032"; }

.fa-bolt:before {
  content: "\f0e7"; }

.fa-bomb:before {
  content: "\f1e2"; }

.fa-bone:before {
  content: "\f5d7"; }

.fa-bong:before {
  content: "\f55c"; }

.fa-book:before {
  content: "\f02d"; }

.fa-book-dead:before {
  content: "\f6b7"; }

.fa-book-medical:before {
  content: "\f7e6"; }

.fa-book-open:before {
  content: "\f518"; }

.fa-book-reader:before {
  content: "\f5da"; }

.fa-bookmark:before {
  content: "\f02e"; }

.fa-bootstrap:before {
  content: "\f836"; }

.fa-border-all:before {
  content: "\f84c"; }

.fa-border-none:before {
  content: "\f850"; }

.fa-border-style:before {
  content: "\f853"; }

.fa-bowling-ball:before {
  content: "\f436"; }

.fa-box:before {
  content: "\f466"; }

.fa-box-open:before {
  content: "\f49e"; }

.fa-boxes:before {
  content: "\f468"; }

.fa-braille:before {
  content: "\f2a1"; }

.fa-brain:before {
  content: "\f5dc"; }

.fa-bread-slice:before {
  content: "\f7ec"; }

.fa-briefcase:before {
  content: "\f0b1"; }

.fa-briefcase-medical:before {
  content: "\f469"; }

.fa-broadcast-tower:before {
  content: "\f519"; }

.fa-broom:before {
  content: "\f51a"; }

.fa-brush:before {
  content: "\f55d"; }

.fa-btc:before {
  content: "\f15a"; }

.fa-buffer:before {
  content: "\f837"; }

.fa-bug:before {
  content: "\f188"; }

.fa-building:before {
  content: "\f1ad"; }

.fa-bullhorn:before {
  content: "\f0a1"; }

.fa-bullseye:before {
  content: "\f140"; }

.fa-burn:before {
  content: "\f46a"; }

.fa-buromobelexperte:before {
  content: "\f37f"; }

.fa-bus:before {
  content: "\f207"; }

.fa-bus-alt:before {
  content: "\f55e"; }

.fa-business-time:before {
  content: "\f64a"; }

.fa-buy-n-large:before {
  content: "\f8a6"; }

.fa-buysellads:before {
  content: "\f20d"; }

.fa-calculator:before {
  content: "\f1ec"; }

.fa-calendar:before {
  content: "\f133"; }

.fa-calendar-alt:before {
  content: "\f073"; }

.fa-calendar-check:before {
  content: "\f274"; }

.fa-calendar-day:before {
  content: "\f783"; }

.fa-calendar-minus:before {
  content: "\f272"; }

.fa-calendar-plus:before {
  content: "\f271"; }

.fa-calendar-times:before {
  content: "\f273"; }

.fa-calendar-week:before {
  content: "\f784"; }

.fa-camera:before {
  content: "\f030"; }

.fa-camera-retro:before {
  content: "\f083"; }

.fa-campground:before {
  content: "\f6bb"; }

.fa-canadian-maple-leaf:before {
  content: "\f785"; }

.fa-candy-cane:before {
  content: "\f786"; }

.fa-cannabis:before {
  content: "\f55f"; }

.fa-capsules:before {
  content: "\f46b"; }

.fa-car:before {
  content: "\f1b9"; }

.fa-car-alt:before {
  content: "\f5de"; }

.fa-car-battery:before {
  content: "\f5df"; }

.fa-car-crash:before {
  content: "\f5e1"; }

.fa-car-side:before {
  content: "\f5e4"; }

.fa-caravan:before {
  content: "\f8ff"; }

.fa-caret-down:before {
  content: "\f0d7"; }

.fa-caret-left:before {
  content: "\f0d9"; }

.fa-caret-right:before {
  content: "\f0da"; }

.fa-caret-square-down:before {
  content: "\f150"; }

.fa-caret-square-left:before {
  content: "\f191"; }

.fa-caret-square-right:before {
  content: "\f152"; }

.fa-caret-square-up:before {
  content: "\f151"; }

.fa-caret-up:before {
  content: "\f0d8"; }

.fa-carrot:before {
  content: "\f787"; }

.fa-cart-arrow-down:before {
  content: "\f218"; }

.fa-cart-plus:before {
  content: "\f217"; }

.fa-cash-register:before {
  content: "\f788"; }

.fa-cat:before {
  content: "\f6be"; }

.fa-cc-amazon-pay:before {
  content: "\f42d"; }

.fa-cc-amex:before {
  content: "\f1f3"; }

.fa-cc-apple-pay:before {
  content: "\f416"; }

.fa-cc-diners-club:before {
  content: "\f24c"; }

.fa-cc-discover:before {
  content: "\f1f2"; }

.fa-cc-jcb:before {
  content: "\f24b"; }

.fa-cc-mastercard:before {
  content: "\f1f1"; }

.fa-cc-paypal:before {
  content: "\f1f4"; }

.fa-cc-stripe:before {
  content: "\f1f5"; }

.fa-cc-visa:before {
  content: "\f1f0"; }

.fa-centercode:before {
  content: "\f380"; }

.fa-centos:before {
  content: "\f789"; }

.fa-certificate:before {
  content: "\f0a3"; }

.fa-chair:before {
  content: "\f6c0"; }

.fa-chalkboard:before {
  content: "\f51b"; }

.fa-chalkboard-teacher:before {
  content: "\f51c"; }

.fa-charging-station:before {
  content: "\f5e7"; }

.fa-chart-area:before {
  content: "\f1fe"; }

.fa-chart-bar:before {
  content: "\f080"; }

.fa-chart-line:before {
  content: "\f201"; }

.fa-chart-pie:before {
  content: "\f200"; }

.fa-check:before {
  content: "\f00c"; }

.fa-check-circle:before {
  content: "\f058"; }

.fa-check-double:before {
  content: "\f560"; }

.fa-check-square:before {
  content: "\f14a"; }

.fa-cheese:before {
  content: "\f7ef"; }

.fa-chess:before {
  content: "\f439"; }

.fa-chess-bishop:before {
  content: "\f43a"; }

.fa-chess-board:before {
  content: "\f43c"; }

.fa-chess-king:before {
  content: "\f43f"; }

.fa-chess-knight:before {
  content: "\f441"; }

.fa-chess-pawn:before {
  content: "\f443"; }

.fa-chess-queen:before {
  content: "\f445"; }

.fa-chess-rook:before {
  content: "\f447"; }

.fa-chevron-circle-down:before {
  content: "\f13a"; }

.fa-chevron-circle-left:before {
  content: "\f137"; }

.fa-chevron-circle-right:before {
  content: "\f138"; }

.fa-chevron-circle-up:before {
  content: "\f139"; }

.fa-chevron-down:before {
  content: "\f078"; }

.fa-chevron-left:before {
  content: "\f053"; }

.fa-chevron-right:before {
  content: "\f054"; }

.fa-chevron-up:before {
  content: "\f077"; }

.fa-child:before {
  content: "\f1ae"; }

.fa-chrome:before {
  content: "\f268"; }

.fa-chromecast:before {
  content: "\f838"; }

.fa-church:before {
  content: "\f51d"; }

.fa-circle:before {
  content: "\f111"; }

.fa-circle-notch:before {
  content: "\f1ce"; }

.fa-city:before {
  content: "\f64f"; }

.fa-clinic-medical:before {
  content: "\f7f2"; }

.fa-clipboard:before {
  content: "\f328"; }

.fa-clipboard-check:before {
  content: "\f46c"; }

.fa-clipboard-list:before {
  content: "\f46d"; }

.fa-clock:before {
  content: "\f017"; }

.fa-clone:before {
  content: "\f24d"; }

.fa-closed-captioning:before {
  content: "\f20a"; }

.fa-cloud:before {
  content: "\f0c2"; }

.fa-cloud-download-alt:before {
  content: "\f381"; }

.fa-cloud-meatball:before {
  content: "\f73b"; }

.fa-cloud-moon:before {
  content: "\f6c3"; }

.fa-cloud-moon-rain:before {
  content: "\f73c"; }

.fa-cloud-rain:before {
  content: "\f73d"; }

.fa-cloud-showers-heavy:before {
  content: "\f740"; }

.fa-cloud-sun:before {
  content: "\f6c4"; }

.fa-cloud-sun-rain:before {
  content: "\f743"; }

.fa-cloud-upload-alt:before {
  content: "\f382"; }

.fa-cloudscale:before {
  content: "\f383"; }

.fa-cloudsmith:before {
  content: "\f384"; }

.fa-cloudversify:before {
  content: "\f385"; }

.fa-cocktail:before {
  content: "\f561"; }

.fa-code:before {
  content: "\f121"; }

.fa-code-branch:before {
  content: "\f126"; }

.fa-codepen:before {
  content: "\f1cb"; }

.fa-codiepie:before {
  content: "\f284"; }

.fa-coffee:before {
  content: "\f0f4"; }

.fa-cog:before {
  content: "\f013"; }

.fa-cogs:before {
  content: "\f085"; }

.fa-coins:before {
  content: "\f51e"; }

.fa-columns:before {
  content: "\f0db"; }

.fa-comment:before {
  content: "\f075"; }

.fa-comment-alt:before {
  content: "\f27a"; }

.fa-comment-dollar:before {
  content: "\f651"; }

.fa-comment-dots:before {
  content: "\f4ad"; }

.fa-comment-medical:before {
  content: "\f7f5"; }

.fa-comment-slash:before {
  content: "\f4b3"; }

.fa-comments:before {
  content: "\f086"; }

.fa-comments-dollar:before {
  content: "\f653"; }

.fa-compact-disc:before {
  content: "\f51f"; }

.fa-compass:before {
  content: "\f14e"; }

.fa-compress:before {
  content: "\f066"; }

.fa-compress-alt:before {
  content: "\f422"; }

.fa-compress-arrows-alt:before {
  content: "\f78c"; }

.fa-concierge-bell:before {
  content: "\f562"; }

.fa-confluence:before {
  content: "\f78d"; }

.fa-connectdevelop:before {
  content: "\f20e"; }

.fa-contao:before {
  content: "\f26d"; }

.fa-cookie:before {
  content: "\f563"; }

.fa-cookie-bite:before {
  content: "\f564"; }

.fa-copy:before {
  content: "\f0c5"; }

.fa-copyright:before {
  content: "\f1f9"; }

.fa-cotton-bureau:before {
  content: "\f89e"; }

.fa-couch:before {
  content: "\f4b8"; }

.fa-cpanel:before {
  content: "\f388"; }

.fa-creative-commons:before {
  content: "\f25e"; }

.fa-creative-commons-by:before {
  content: "\f4e7"; }

.fa-creative-commons-nc:before {
  content: "\f4e8"; }

.fa-creative-commons-nc-eu:before {
  content: "\f4e9"; }

.fa-creative-commons-nc-jp:before {
  content: "\f4ea"; }

.fa-creative-commons-nd:before {
  content: "\f4eb"; }

.fa-creative-commons-pd:before {
  content: "\f4ec"; }

.fa-creative-commons-pd-alt:before {
  content: "\f4ed"; }

.fa-creative-commons-remix:before {
  content: "\f4ee"; }

.fa-creative-commons-sa:before {
  content: "\f4ef"; }

.fa-creative-commons-sampling:before {
  content: "\f4f0"; }

.fa-creative-commons-sampling-plus:before {
  content: "\f4f1"; }

.fa-creative-commons-share:before {
  content: "\f4f2"; }

.fa-creative-commons-zero:before {
  content: "\f4f3"; }

.fa-credit-card:before {
  content: "\f09d"; }

.fa-critical-role:before {
  content: "\f6c9"; }

.fa-crop:before {
  content: "\f125"; }

.fa-crop-alt:before {
  content: "\f565"; }

.fa-cross:before {
  content: "\f654"; }

.fa-crosshairs:before {
  content: "\f05b"; }

.fa-crow:before {
  content: "\f520"; }

.fa-crown:before {
  content: "\f521"; }

.fa-crutch:before {
  content: "\f7f7"; }

.fa-css3:before {
  content: "\f13c"; }

.fa-css3-alt:before {
  content: "\f38b"; }

.fa-cube:before {
  content: "\f1b2"; }

.fa-cubes:before {
  content: "\f1b3"; }

.fa-cut:before {
  content: "\f0c4"; }

.fa-cuttlefish:before {
  content: "\f38c"; }

.fa-d-and-d:before {
  content: "\f38d"; }

.fa-d-and-d-beyond:before {
  content: "\f6ca"; }

.fa-dashcube:before {
  content: "\f210"; }

.fa-database:before {
  content: "\f1c0"; }

.fa-deaf:before {
  content: "\f2a4"; }

.fa-delicious:before {
  content: "\f1a5"; }

.fa-democrat:before {
  content: "\f747"; }

.fa-deploydog:before {
  content: "\f38e"; }

.fa-deskpro:before {
  content: "\f38f"; }

.fa-desktop:before {
  content: "\f108"; }

.fa-dev:before {
  content: "\f6cc"; }

.fa-deviantart:before {
  content: "\f1bd"; }

.fa-dharmachakra:before {
  content: "\f655"; }

.fa-dhl:before {
  content: "\f790"; }

.fa-diagnoses:before {
  content: "\f470"; }

.fa-diaspora:before {
  content: "\f791"; }

.fa-dice:before {
  content: "\f522"; }

.fa-dice-d20:before {
  content: "\f6cf"; }

.fa-dice-d6:before {
  content: "\f6d1"; }

.fa-dice-five:before {
  content: "\f523"; }

.fa-dice-four:before {
  content: "\f524"; }

.fa-dice-one:before {
  content: "\f525"; }

.fa-dice-six:before {
  content: "\f526"; }

.fa-dice-three:before {
  content: "\f527"; }

.fa-dice-two:before {
  content: "\f528"; }

.fa-digg:before {
  content: "\f1a6"; }

.fa-digital-ocean:before {
  content: "\f391"; }

.fa-digital-tachograph:before {
  content: "\f566"; }

.fa-directions:before {
  content: "\f5eb"; }

.fa-discord:before {
  content: "\f392"; }

.fa-discourse:before {
  content: "\f393"; }

.fa-divide:before {
  content: "\f529"; }

.fa-dizzy:before {
  content: "\f567"; }

.fa-dna:before {
  content: "\f471"; }

.fa-dochub:before {
  content: "\f394"; }

.fa-docker:before {
  content: "\f395"; }

.fa-dog:before {
  content: "\f6d3"; }

.fa-dollar-sign:before {
  content: "\f155"; }

.fa-dolly:before {
  content: "\f472"; }

.fa-dolly-flatbed:before {
  content: "\f474"; }

.fa-donate:before {
  content: "\f4b9"; }

.fa-door-closed:before {
  content: "\f52a"; }

.fa-door-open:before {
  content: "\f52b"; }

.fa-dot-circle:before {
  content: "\f192"; }

.fa-dove:before {
  content: "\f4ba"; }

.fa-download:before {
  content: "\f019"; }

.fa-draft2digital:before {
  content: "\f396"; }

.fa-drafting-compass:before {
  content: "\f568"; }

.fa-dragon:before {
  content: "\f6d5"; }

.fa-draw-polygon:before {
  content: "\f5ee"; }

.fa-dribbble:before {
  content: "\f17d"; }

.fa-dribbble-square:before {
  content: "\f397"; }

.fa-dropbox:before {
  content: "\f16b"; }

.fa-drum:before {
  content: "\f569"; }

.fa-drum-steelpan:before {
  content: "\f56a"; }

.fa-drumstick-bite:before {
  content: "\f6d7"; }

.fa-drupal:before {
  content: "\f1a9"; }

.fa-dumbbell:before {
  content: "\f44b"; }

.fa-dumpster:before {
  content: "\f793"; }

.fa-dumpster-fire:before {
  content: "\f794"; }

.fa-dungeon:before {
  content: "\f6d9"; }

.fa-dyalog:before {
  content: "\f399"; }

.fa-earlybirds:before {
  content: "\f39a"; }

.fa-ebay:before {
  content: "\f4f4"; }

.fa-edge:before {
  content: "\f282"; }

.fa-edit:before {
  content: "\f044"; }

.fa-egg:before {
  content: "\f7fb"; }

.fa-eject:before {
  content: "\f052"; }

.fa-elementor:before {
  content: "\f430"; }

.fa-ellipsis-h:before {
  content: "\f141"; }

.fa-ellipsis-v:before {
  content: "\f142"; }

.fa-ello:before {
  content: "\f5f1"; }

.fa-ember:before {
  content: "\f423"; }

.fa-empire:before {
  content: "\f1d1"; }

.fa-envelope:before {
  content: "\f0e0"; }

.fa-envelope-open:before {
  content: "\f2b6"; }

.fa-envelope-open-text:before {
  content: "\f658"; }

.fa-envelope-square:before {
  content: "\f199"; }

.fa-envira:before {
  content: "\f299"; }

.fa-equals:before {
  content: "\f52c"; }

.fa-eraser:before {
  content: "\f12d"; }

.fa-erlang:before {
  content: "\f39d"; }

.fa-ethereum:before {
  content: "\f42e"; }

.fa-ethernet:before {
  content: "\f796"; }

.fa-etsy:before {
  content: "\f2d7"; }

.fa-euro-sign:before {
  content: "\f153"; }

.fa-evernote:before {
  content: "\f839"; }

.fa-exchange-alt:before {
  content: "\f362"; }

.fa-exclamation:before {
  content: "\f12a"; }

.fa-exclamation-circle:before {
  content: "\f06a"; }

.fa-exclamation-triangle:before {
  content: "\f071"; }

.fa-expand:before {
  content: "\f065"; }

.fa-expand-alt:before {
  content: "\f424"; }

.fa-expand-arrows-alt:before {
  content: "\f31e"; }

.fa-expeditedssl:before {
  content: "\f23e"; }

.fa-external-link-alt:before {
  content: "\f35d"; }

.fa-external-link-square-alt:before {
  content: "\f360"; }

.fa-eye:before {
  content: "\f06e"; }

.fa-eye-dropper:before {
  content: "\f1fb"; }

.fa-eye-slash:before {
  content: "\f070"; }

.fa-facebook:before {
  content: "\f09a"; }

.fa-facebook-f:before {
  content: "\f39e"; }

.fa-facebook-messenger:before {
  content: "\f39f"; }

.fa-facebook-square:before {
  content: "\f082"; }

.fa-fan:before {
  content: "\f863"; }

.fa-fantasy-flight-games:before {
  content: "\f6dc"; }

.fa-fast-backward:before {
  content: "\f049"; }

.fa-fast-forward:before {
  content: "\f050"; }

.fa-fax:before {
  content: "\f1ac"; }

.fa-feather:before {
  content: "\f52d"; }

.fa-feather-alt:before {
  content: "\f56b"; }

.fa-fedex:before {
  content: "\f797"; }

.fa-fedora:before {
  content: "\f798"; }

.fa-female:before {
  content: "\f182"; }

.fa-fighter-jet:before {
  content: "\f0fb"; }

.fa-figma:before {
  content: "\f799"; }

.fa-file:before {
  content: "\f15b"; }

.fa-file-alt:before {
  content: "\f15c"; }

.fa-file-archive:before {
  content: "\f1c6"; }

.fa-file-audio:before {
  content: "\f1c7"; }

.fa-file-code:before {
  content: "\f1c9"; }

.fa-file-contract:before {
  content: "\f56c"; }

.fa-file-csv:before {
  content: "\f6dd"; }

.fa-file-download:before {
  content: "\f56d"; }

.fa-file-excel:before {
  content: "\f1c3"; }

.fa-file-export:before {
  content: "\f56e"; }

.fa-file-image:before {
  content: "\f1c5"; }

.fa-file-import:before {
  content: "\f56f"; }

.fa-file-invoice:before {
  content: "\f570"; }

.fa-file-invoice-dollar:before {
  content: "\f571"; }

.fa-file-medical:before {
  content: "\f477"; }

.fa-file-medical-alt:before {
  content: "\f478"; }

.fa-file-pdf:before {
  content: "\f1c1"; }

.fa-file-powerpoint:before {
  content: "\f1c4"; }

.fa-file-prescription:before {
  content: "\f572"; }

.fa-file-signature:before {
  content: "\f573"; }

.fa-file-upload:before {
  content: "\f574"; }

.fa-file-video:before {
  content: "\f1c8"; }

.fa-file-word:before {
  content: "\f1c2"; }

.fa-fill:before {
  content: "\f575"; }

.fa-fill-drip:before {
  content: "\f576"; }

.fa-film:before {
  content: "\f008"; }

.fa-filter:before {
  content: "\f0b0"; }

.fa-fingerprint:before {
  content: "\f577"; }

.fa-fire:before {
  content: "\f06d"; }

.fa-fire-alt:before {
  content: "\f7e4"; }

.fa-fire-extinguisher:before {
  content: "\f134"; }

.fa-firefox:before {
  content: "\f269"; }

.fa-firefox-browser:before {
  content: "\f907"; }

.fa-first-aid:before {
  content: "\f479"; }

.fa-first-order:before {
  content: "\f2b0"; }

.fa-first-order-alt:before {
  content: "\f50a"; }

.fa-firstdraft:before {
  content: "\f3a1"; }

.fa-fish:before {
  content: "\f578"; }

.fa-fist-raised:before {
  content: "\f6de"; }

.fa-flag:before {
  content: "\f024"; }

.fa-flag-checkered:before {
  content: "\f11e"; }

.fa-flag-usa:before {
  content: "\f74d"; }

.fa-flask:before {
  content: "\f0c3"; }

.fa-flickr:before {
  content: "\f16e"; }

.fa-flipboard:before {
  content: "\f44d"; }

.fa-flushed:before {
  content: "\f579"; }

.fa-fly:before {
  content: "\f417"; }

.fa-folder:before {
  content: "\f07b"; }

.fa-folder-minus:before {
  content: "\f65d"; }

.fa-folder-open:before {
  content: "\f07c"; }

.fa-folder-plus:before {
  content: "\f65e"; }

.fa-font:before {
  content: "\f031"; }

.fa-font-awesome:before {
  content: "\f2b4"; }

.fa-font-awesome-alt:before {
  content: "\f35c"; }

.fa-font-awesome-flag:before {
  content: "\f425"; }

.fa-font-awesome-logo-full:before {
  content: "\f4e6"; }

.fa-fonticons:before {
  content: "\f280"; }

.fa-fonticons-fi:before {
  content: "\f3a2"; }

.fa-football-ball:before {
  content: "\f44e"; }

.fa-fort-awesome:before {
  content: "\f286"; }

.fa-fort-awesome-alt:before {
  content: "\f3a3"; }

.fa-forumbee:before {
  content: "\f211"; }

.fa-forward:before {
  content: "\f04e"; }

.fa-foursquare:before {
  content: "\f180"; }

.fa-free-code-camp:before {
  content: "\f2c5"; }

.fa-freebsd:before {
  content: "\f3a4"; }

.fa-frog:before {
  content: "\f52e"; }

.fa-frown:before {
  content: "\f119"; }

.fa-frown-open:before {
  content: "\f57a"; }

.fa-fulcrum:before {
  content: "\f50b"; }

.fa-funnel-dollar:before {
  content: "\f662"; }

.fa-futbol:before {
  content: "\f1e3"; }

.fa-galactic-republic:before {
  content: "\f50c"; }

.fa-galactic-senate:before {
  content: "\f50d"; }

.fa-gamepad:before {
  content: "\f11b"; }

.fa-gas-pump:before {
  content: "\f52f"; }

.fa-gavel:before {
  content: "\f0e3"; }

.fa-gem:before {
  content: "\f3a5"; }

.fa-genderless:before {
  content: "\f22d"; }

.fa-get-pocket:before {
  content: "\f265"; }

.fa-gg:before {
  content: "\f260"; }

.fa-gg-circle:before {
  content: "\f261"; }

.fa-ghost:before {
  content: "\f6e2"; }

.fa-gift:before {
  content: "\f06b"; }

.fa-gifts:before {
  content: "\f79c"; }

.fa-git:before {
  content: "\f1d3"; }

.fa-git-alt:before {
  content: "\f841"; }

.fa-git-square:before {
  content: "\f1d2"; }

.fa-github:before {
  content: "\f09b"; }

.fa-github-alt:before {
  content: "\f113"; }

.fa-github-square:before {
  content: "\f092"; }

.fa-gitkraken:before {
  content: "\f3a6"; }

.fa-gitlab:before {
  content: "\f296"; }

.fa-gitter:before {
  content: "\f426"; }

.fa-glass-cheers:before {
  content: "\f79f"; }

.fa-glass-martini:before {
  content: "\f000"; }

.fa-glass-martini-alt:before {
  content: "\f57b"; }

.fa-glass-whiskey:before {
  content: "\f7a0"; }

.fa-glasses:before {
  content: "\f530"; }

.fa-glide:before {
  content: "\f2a5"; }

.fa-glide-g:before {
  content: "\f2a6"; }

.fa-globe:before {
  content: "\f0ac"; }

.fa-globe-africa:before {
  content: "\f57c"; }

.fa-globe-americas:before {
  content: "\f57d"; }

.fa-globe-asia:before {
  content: "\f57e"; }

.fa-globe-europe:before {
  content: "\f7a2"; }

.fa-gofore:before {
  content: "\f3a7"; }

.fa-golf-ball:before {
  content: "\f450"; }

.fa-goodreads:before {
  content: "\f3a8"; }

.fa-goodreads-g:before {
  content: "\f3a9"; }

.fa-google:before {
  content: "\f1a0"; }

.fa-google-drive:before {
  content: "\f3aa"; }

.fa-google-play:before {
  content: "\f3ab"; }

.fa-google-plus:before {
  content: "\f2b3"; }

.fa-google-plus-g:before {
  content: "\f0d5"; }

.fa-google-plus-square:before {
  content: "\f0d4"; }

.fa-google-wallet:before {
  content: "\f1ee"; }

.fa-gopuram:before {
  content: "\f664"; }

.fa-graduation-cap:before {
  content: "\f19d"; }

.fa-gratipay:before {
  content: "\f184"; }

.fa-grav:before {
  content: "\f2d6"; }

.fa-greater-than:before {
  content: "\f531"; }

.fa-greater-than-equal:before {
  content: "\f532"; }

.fa-grimace:before {
  content: "\f57f"; }

.fa-grin:before {
  content: "\f580"; }

.fa-grin-alt:before {
  content: "\f581"; }

.fa-grin-beam:before {
  content: "\f582"; }

.fa-grin-beam-sweat:before {
  content: "\f583"; }

.fa-grin-hearts:before {
  content: "\f584"; }

.fa-grin-squint:before {
  content: "\f585"; }

.fa-grin-squint-tears:before {
  content: "\f586"; }

.fa-grin-stars:before {
  content: "\f587"; }

.fa-grin-tears:before {
  content: "\f588"; }

.fa-grin-tongue:before {
  content: "\f589"; }

.fa-grin-tongue-squint:before {
  content: "\f58a"; }

.fa-grin-tongue-wink:before {
  content: "\f58b"; }

.fa-grin-wink:before {
  content: "\f58c"; }

.fa-grip-horizontal:before {
  content: "\f58d"; }

.fa-grip-lines:before {
  content: "\f7a4"; }

.fa-grip-lines-vertical:before {
  content: "\f7a5"; }

.fa-grip-vertical:before {
  content: "\f58e"; }

.fa-gripfire:before {
  content: "\f3ac"; }

.fa-grunt:before {
  content: "\f3ad"; }

.fa-guitar:before {
  content: "\f7a6"; }

.fa-gulp:before {
  content: "\f3ae"; }

.fa-h-square:before {
  content: "\f0fd"; }

.fa-hacker-news:before {
  content: "\f1d4"; }

.fa-hacker-news-square:before {
  content: "\f3af"; }

.fa-hackerrank:before {
  content: "\f5f7"; }

.fa-hamburger:before {
  content: "\f805"; }

.fa-hammer:before {
  content: "\f6e3"; }

.fa-hamsa:before {
  content: "\f665"; }

.fa-hand-holding:before {
  content: "\f4bd"; }

.fa-hand-holding-heart:before {
  content: "\f4be"; }

.fa-hand-holding-usd:before {
  content: "\f4c0"; }

.fa-hand-lizard:before {
  content: "\f258"; }

.fa-hand-middle-finger:before {
  content: "\f806"; }

.fa-hand-paper:before {
  content: "\f256"; }

.fa-hand-peace:before {
  content: "\f25b"; }

.fa-hand-point-down:before {
  content: "\f0a7"; }

.fa-hand-point-left:before {
  content: "\f0a5"; }

.fa-hand-point-right:before {
  content: "\f0a4"; }

.fa-hand-point-up:before {
  content: "\f0a6"; }

.fa-hand-pointer:before {
  content: "\f25a"; }

.fa-hand-rock:before {
  content: "\f255"; }

.fa-hand-scissors:before {
  content: "\f257"; }

.fa-hand-spock:before {
  content: "\f259"; }

.fa-hands:before {
  content: "\f4c2"; }

.fa-hands-helping:before {
  content: "\f4c4"; }

.fa-handshake:before {
  content: "\f2b5"; }

.fa-hanukiah:before {
  content: "\f6e6"; }

.fa-hard-hat:before {
  content: "\f807"; }

.fa-hashtag:before {
  content: "\f292"; }

.fa-hat-cowboy:before {
  content: "\f8c0"; }

.fa-hat-cowboy-side:before {
  content: "\f8c1"; }

.fa-hat-wizard:before {
  content: "\f6e8"; }

.fa-hdd:before {
  content: "\f0a0"; }

.fa-heading:before {
  content: "\f1dc"; }

.fa-headphones:before {
  content: "\f025"; }

.fa-headphones-alt:before {
  content: "\f58f"; }

.fa-headset:before {
  content: "\f590"; }

.fa-heart:before {
  content: "\f004"; }

.fa-heart-broken:before {
  content: "\f7a9"; }

.fa-heartbeat:before {
  content: "\f21e"; }

.fa-helicopter:before {
  content: "\f533"; }

.fa-highlighter:before {
  content: "\f591"; }

.fa-hiking:before {
  content: "\f6ec"; }

.fa-hippo:before {
  content: "\f6ed"; }

.fa-hips:before {
  content: "\f452"; }

.fa-hire-a-helper:before {
  content: "\f3b0"; }

.fa-history:before {
  content: "\f1da"; }

.fa-hockey-puck:before {
  content: "\f453"; }

.fa-holly-berry:before {
  content: "\f7aa"; }

.fa-home:before {
  content: "\f015"; }

.fa-hooli:before {
  content: "\f427"; }

.fa-hornbill:before {
  content: "\f592"; }

.fa-horse:before {
  content: "\f6f0"; }

.fa-horse-head:before {
  content: "\f7ab"; }

.fa-hospital:before {
  content: "\f0f8"; }

.fa-hospital-alt:before {
  content: "\f47d"; }

.fa-hospital-symbol:before {
  content: "\f47e"; }

.fa-hot-tub:before {
  content: "\f593"; }

.fa-hotdog:before {
  content: "\f80f"; }

.fa-hotel:before {
  content: "\f594"; }

.fa-hotjar:before {
  content: "\f3b1"; }

.fa-hourglass:before {
  content: "\f254"; }

.fa-hourglass-end:before {
  content: "\f253"; }

.fa-hourglass-half:before {
  content: "\f252"; }

.fa-hourglass-start:before {
  content: "\f251"; }

.fa-house-damage:before {
  content: "\f6f1"; }

.fa-houzz:before {
  content: "\f27c"; }

.fa-hryvnia:before {
  content: "\f6f2"; }

.fa-html5:before {
  content: "\f13b"; }

.fa-hubspot:before {
  content: "\f3b2"; }

.fa-i-cursor:before {
  content: "\f246"; }

.fa-ice-cream:before {
  content: "\f810"; }

.fa-icicles:before {
  content: "\f7ad"; }

.fa-icons:before {
  content: "\f86d"; }

.fa-id-badge:before {
  content: "\f2c1"; }

.fa-id-card:before {
  content: "\f2c2"; }

.fa-id-card-alt:before {
  content: "\f47f"; }

.fa-ideal:before {
  content: "\f913"; }

.fa-igloo:before {
  content: "\f7ae"; }

.fa-image:before {
  content: "\f03e"; }

.fa-images:before {
  content: "\f302"; }

.fa-imdb:before {
  content: "\f2d8"; }

.fa-inbox:before {
  content: "\f01c"; }

.fa-indent:before {
  content: "\f03c"; }

.fa-industry:before {
  content: "\f275"; }

.fa-infinity:before {
  content: "\f534"; }

.fa-info:before {
  content: "\f129"; }

.fa-info-circle:before {
  content: "\f05a"; }

.fa-instagram:before {
  content: "\f16d"; }

.fa-intercom:before {
  content: "\f7af"; }

.fa-internet-explorer:before {
  content: "\f26b"; }

.fa-invision:before {
  content: "\f7b0"; }

.fa-ioxhost:before {
  content: "\f208"; }

.fa-italic:before {
  content: "\f033"; }

.fa-itch-io:before {
  content: "\f83a"; }

.fa-itunes:before {
  content: "\f3b4"; }

.fa-itunes-note:before {
  content: "\f3b5"; }

.fa-java:before {
  content: "\f4e4"; }

.fa-jedi:before {
  content: "\f669"; }

.fa-jedi-order:before {
  content: "\f50e"; }

.fa-jenkins:before {
  content: "\f3b6"; }

.fa-jira:before {
  content: "\f7b1"; }

.fa-joget:before {
  content: "\f3b7"; }

.fa-joint:before {
  content: "\f595"; }

.fa-joomla:before {
  content: "\f1aa"; }

.fa-journal-whills:before {
  content: "\f66a"; }

.fa-js:before {
  content: "\f3b8"; }

.fa-js-square:before {
  content: "\f3b9"; }

.fa-jsfiddle:before {
  content: "\f1cc"; }

.fa-kaaba:before {
  content: "\f66b"; }

.fa-kaggle:before {
  content: "\f5fa"; }

.fa-key:before {
  content: "\f084"; }

.fa-keybase:before {
  content: "\f4f5"; }

.fa-keyboard:before {
  content: "\f11c"; }

.fa-keycdn:before {
  content: "\f3ba"; }

.fa-khanda:before {
  content: "\f66d"; }

.fa-kickstarter:before {
  content: "\f3bb"; }

.fa-kickstarter-k:before {
  content: "\f3bc"; }

.fa-kiss:before {
  content: "\f596"; }

.fa-kiss-beam:before {
  content: "\f597"; }

.fa-kiss-wink-heart:before {
  content: "\f598"; }

.fa-kiwi-bird:before {
  content: "\f535"; }

.fa-korvue:before {
  content: "\f42f"; }

.fa-landmark:before {
  content: "\f66f"; }

.fa-language:before {
  content: "\f1ab"; }

.fa-laptop:before {
  content: "\f109"; }

.fa-laptop-code:before {
  content: "\f5fc"; }

.fa-laptop-medical:before {
  content: "\f812"; }

.fa-laravel:before {
  content: "\f3bd"; }

.fa-lastfm:before {
  content: "\f202"; }

.fa-lastfm-square:before {
  content: "\f203"; }

.fa-laugh:before {
  content: "\f599"; }

.fa-laugh-beam:before {
  content: "\f59a"; }

.fa-laugh-squint:before {
  content: "\f59b"; }

.fa-laugh-wink:before {
  content: "\f59c"; }

.fa-layer-group:before {
  content: "\f5fd"; }

.fa-leaf:before {
  content: "\f06c"; }

.fa-leanpub:before {
  content: "\f212"; }

.fa-lemon:before {
  content: "\f094"; }

.fa-less:before {
  content: "\f41d"; }

.fa-less-than:before {
  content: "\f536"; }

.fa-less-than-equal:before {
  content: "\f537"; }

.fa-level-down-alt:before {
  content: "\f3be"; }

.fa-level-up-alt:before {
  content: "\f3bf"; }

.fa-life-ring:before {
  content: "\f1cd"; }

.fa-lightbulb:before {
  content: "\f0eb"; }

.fa-line:before {
  content: "\f3c0"; }

.fa-link:before {
  content: "\f0c1"; }

.fa-linkedin:before {
  content: "\f08c"; }

.fa-linkedin-in:before {
  content: "\f0e1"; }

.fa-linode:before {
  content: "\f2b8"; }

.fa-linux:before {
  content: "\f17c"; }

.fa-lira-sign:before {
  content: "\f195"; }

.fa-list:before {
  content: "\f03a"; }

.fa-list-alt:before {
  content: "\f022"; }

.fa-list-ol:before {
  content: "\f0cb"; }

.fa-list-ul:before {
  content: "\f0ca"; }

.fa-location-arrow:before {
  content: "\f124"; }

.fa-lock:before {
  content: "\f023"; }

.fa-lock-open:before {
  content: "\f3c1"; }

.fa-long-arrow-alt-down:before {
  content: "\f309"; }

.fa-long-arrow-alt-left:before {
  content: "\f30a"; }

.fa-long-arrow-alt-right:before {
  content: "\f30b"; }

.fa-long-arrow-alt-up:before {
  content: "\f30c"; }

.fa-low-vision:before {
  content: "\f2a8"; }

.fa-luggage-cart:before {
  content: "\f59d"; }

.fa-lyft:before {
  content: "\f3c3"; }

.fa-magento:before {
  content: "\f3c4"; }

.fa-magic:before {
  content: "\f0d0"; }

.fa-magnet:before {
  content: "\f076"; }

.fa-mail-bulk:before {
  content: "\f674"; }

.fa-mailchimp:before {
  content: "\f59e"; }

.fa-male:before {
  content: "\f183"; }

.fa-mandalorian:before {
  content: "\f50f"; }

.fa-map:before {
  content: "\f279"; }

.fa-map-marked:before {
  content: "\f59f"; }

.fa-map-marked-alt:before {
  content: "\f5a0"; }

.fa-map-marker:before {
  content: "\f041"; }

.fa-map-marker-alt:before {
  content: "\f3c5"; }

.fa-map-pin:before {
  content: "\f276"; }

.fa-map-signs:before {
  content: "\f277"; }

.fa-markdown:before {
  content: "\f60f"; }

.fa-marker:before {
  content: "\f5a1"; }

.fa-mars:before {
  content: "\f222"; }

.fa-mars-double:before {
  content: "\f227"; }

.fa-mars-stroke:before {
  content: "\f229"; }

.fa-mars-stroke-h:before {
  content: "\f22b"; }

.fa-mars-stroke-v:before {
  content: "\f22a"; }

.fa-mask:before {
  content: "\f6fa"; }

.fa-mastodon:before {
  content: "\f4f6"; }

.fa-maxcdn:before {
  content: "\f136"; }

.fa-mdb:before {
  content: "\f8ca"; }

.fa-medal:before {
  content: "\f5a2"; }

.fa-medapps:before {
  content: "\f3c6"; }

.fa-medium:before {
  content: "\f23a"; }

.fa-medium-m:before {
  content: "\f3c7"; }

.fa-medkit:before {
  content: "\f0fa"; }

.fa-medrt:before {
  content: "\f3c8"; }

.fa-meetup:before {
  content: "\f2e0"; }

.fa-megaport:before {
  content: "\f5a3"; }

.fa-meh:before {
  content: "\f11a"; }

.fa-meh-blank:before {
  content: "\f5a4"; }

.fa-meh-rolling-eyes:before {
  content: "\f5a5"; }

.fa-memory:before {
  content: "\f538"; }

.fa-mendeley:before {
  content: "\f7b3"; }

.fa-menorah:before {
  content: "\f676"; }

.fa-mercury:before {
  content: "\f223"; }

.fa-meteor:before {
  content: "\f753"; }

.fa-microblog:before {
  content: "\f91a"; }

.fa-microchip:before {
  content: "\f2db"; }

.fa-microphone:before {
  content: "\f130"; }

.fa-microphone-alt:before {
  content: "\f3c9"; }

.fa-microphone-alt-slash:before {
  content: "\f539"; }

.fa-microphone-slash:before {
  content: "\f131"; }

.fa-microscope:before {
  content: "\f610"; }

.fa-microsoft:before {
  content: "\f3ca"; }

.fa-minus:before {
  content: "\f068"; }

.fa-minus-circle:before {
  content: "\f056"; }

.fa-minus-square:before {
  content: "\f146"; }

.fa-mitten:before {
  content: "\f7b5"; }

.fa-mix:before {
  content: "\f3cb"; }

.fa-mixcloud:before {
  content: "\f289"; }

.fa-mizuni:before {
  content: "\f3cc"; }

.fa-mobile:before {
  content: "\f10b"; }

.fa-mobile-alt:before {
  content: "\f3cd"; }

.fa-modx:before {
  content: "\f285"; }

.fa-monero:before {
  content: "\f3d0"; }

.fa-money-bill:before {
  content: "\f0d6"; }

.fa-money-bill-alt:before {
  content: "\f3d1"; }

.fa-money-bill-wave:before {
  content: "\f53a"; }

.fa-money-bill-wave-alt:before {
  content: "\f53b"; }

.fa-money-check:before {
  content: "\f53c"; }

.fa-money-check-alt:before {
  content: "\f53d"; }

.fa-monument:before {
  content: "\f5a6"; }

.fa-moon:before {
  content: "\f186"; }

.fa-mortar-pestle:before {
  content: "\f5a7"; }

.fa-mosque:before {
  content: "\f678"; }

.fa-motorcycle:before {
  content: "\f21c"; }

.fa-mountain:before {
  content: "\f6fc"; }

.fa-mouse:before {
  content: "\f8cc"; }

.fa-mouse-pointer:before {
  content: "\f245"; }

.fa-mug-hot:before {
  content: "\f7b6"; }

.fa-music:before {
  content: "\f001"; }

.fa-napster:before {
  content: "\f3d2"; }

.fa-neos:before {
  content: "\f612"; }

.fa-network-wired:before {
  content: "\f6ff"; }

.fa-neuter:before {
  content: "\f22c"; }

.fa-newspaper:before {
  content: "\f1ea"; }

.fa-nimblr:before {
  content: "\f5a8"; }

.fa-node:before {
  content: "\f419"; }

.fa-node-js:before {
  content: "\f3d3"; }

.fa-not-equal:before {
  content: "\f53e"; }

.fa-notes-medical:before {
  content: "\f481"; }

.fa-npm:before {
  content: "\f3d4"; }

.fa-ns8:before {
  content: "\f3d5"; }

.fa-nutritionix:before {
  content: "\f3d6"; }

.fa-object-group:before {
  content: "\f247"; }

.fa-object-ungroup:before {
  content: "\f248"; }

.fa-odnoklassniki:before {
  content: "\f263"; }

.fa-odnoklassniki-square:before {
  content: "\f264"; }

.fa-oil-can:before {
  content: "\f613"; }

.fa-old-republic:before {
  content: "\f510"; }

.fa-om:before {
  content: "\f679"; }

.fa-opencart:before {
  content: "\f23d"; }

.fa-openid:before {
  content: "\f19b"; }

.fa-opera:before {
  content: "\f26a"; }

.fa-optin-monster:before {
  content: "\f23c"; }

.fa-orcid:before {
  content: "\f8d2"; }

.fa-osi:before {
  content: "\f41a"; }

.fa-otter:before {
  content: "\f700"; }

.fa-outdent:before {
  content: "\f03b"; }

.fa-page4:before {
  content: "\f3d7"; }

.fa-pagelines:before {
  content: "\f18c"; }

.fa-pager:before {
  content: "\f815"; }

.fa-paint-brush:before {
  content: "\f1fc"; }

.fa-paint-roller:before {
  content: "\f5aa"; }

.fa-palette:before {
  content: "\f53f"; }

.fa-palfed:before {
  content: "\f3d8"; }

.fa-pallet:before {
  content: "\f482"; }

.fa-paper-plane:before {
  content: "\f1d8"; }

.fa-paperclip:before {
  content: "\f0c6"; }

.fa-parachute-box:before {
  content: "\f4cd"; }

.fa-paragraph:before {
  content: "\f1dd"; }

.fa-parking:before {
  content: "\f540"; }

.fa-passport:before {
  content: "\f5ab"; }

.fa-pastafarianism:before {
  content: "\f67b"; }

.fa-paste:before {
  content: "\f0ea"; }

.fa-patreon:before {
  content: "\f3d9"; }

.fa-pause:before {
  content: "\f04c"; }

.fa-pause-circle:before {
  content: "\f28b"; }

.fa-paw:before {
  content: "\f1b0"; }

.fa-paypal:before {
  content: "\f1ed"; }

.fa-peace:before {
  content: "\f67c"; }

.fa-pen:before {
  content: "\f304"; }

.fa-pen-alt:before {
  content: "\f305"; }

.fa-pen-fancy:before {
  content: "\f5ac"; }

.fa-pen-nib:before {
  content: "\f5ad"; }

.fa-pen-square:before {
  content: "\f14b"; }

.fa-pencil-alt:before {
  content: "\f303"; }

.fa-pencil-ruler:before {
  content: "\f5ae"; }

.fa-penny-arcade:before {
  content: "\f704"; }

.fa-people-carry:before {
  content: "\f4ce"; }

.fa-pepper-hot:before {
  content: "\f816"; }

.fa-percent:before {
  content: "\f295"; }

.fa-percentage:before {
  content: "\f541"; }

.fa-periscope:before {
  content: "\f3da"; }

.fa-person-booth:before {
  content: "\f756"; }

.fa-phabricator:before {
  content: "\f3db"; }

.fa-phoenix-framework:before {
  content: "\f3dc"; }

.fa-phoenix-squadron:before {
  content: "\f511"; }

.fa-phone:before {
  content: "\f095"; }

.fa-phone-alt:before {
  content: "\f879"; }

.fa-phone-slash:before {
  content: "\f3dd"; }

.fa-phone-square:before {
  content: "\f098"; }

.fa-phone-square-alt:before {
  content: "\f87b"; }

.fa-phone-volume:before {
  content: "\f2a0"; }

.fa-photo-video:before {
  content: "\f87c"; }

.fa-php:before {
  content: "\f457"; }

.fa-pied-piper:before {
  content: "\f2ae"; }

.fa-pied-piper-alt:before {
  content: "\f1a8"; }

.fa-pied-piper-hat:before {
  content: "\f4e5"; }

.fa-pied-piper-pp:before {
  content: "\f1a7"; }

.fa-pied-piper-square:before {
  content: "\f91e"; }

.fa-piggy-bank:before {
  content: "\f4d3"; }

.fa-pills:before {
  content: "\f484"; }

.fa-pinterest:before {
  content: "\f0d2"; }

.fa-pinterest-p:before {
  content: "\f231"; }

.fa-pinterest-square:before {
  content: "\f0d3"; }

.fa-pizza-slice:before {
  content: "\f818"; }

.fa-place-of-worship:before {
  content: "\f67f"; }

.fa-plane:before {
  content: "\f072"; }

.fa-plane-arrival:before {
  content: "\f5af"; }

.fa-plane-departure:before {
  content: "\f5b0"; }

.fa-play:before {
  content: "\f04b"; }

.fa-play-circle:before {
  content: "\f144"; }

.fa-playstation:before {
  content: "\f3df"; }

.fa-plug:before {
  content: "\f1e6"; }

.fa-plus:before {
  content: "\f067"; }

.fa-plus-circle:before {
  content: "\f055"; }

.fa-plus-square:before {
  content: "\f0fe"; }

.fa-podcast:before {
  content: "\f2ce"; }

.fa-poll:before {
  content: "\f681"; }

.fa-poll-h:before {
  content: "\f682"; }

.fa-poo:before {
  content: "\f2fe"; }

.fa-poo-storm:before {
  content: "\f75a"; }

.fa-poop:before {
  content: "\f619"; }

.fa-portrait:before {
  content: "\f3e0"; }

.fa-pound-sign:before {
  content: "\f154"; }

.fa-power-off:before {
  content: "\f011"; }

.fa-pray:before {
  content: "\f683"; }

.fa-praying-hands:before {
  content: "\f684"; }

.fa-prescription:before {
  content: "\f5b1"; }

.fa-prescription-bottle:before {
  content: "\f485"; }

.fa-prescription-bottle-alt:before {
  content: "\f486"; }

.fa-print:before {
  content: "\f02f"; }

.fa-procedures:before {
  content: "\f487"; }

.fa-product-hunt:before {
  content: "\f288"; }

.fa-project-diagram:before {
  content: "\f542"; }

.fa-pushed:before {
  content: "\f3e1"; }

.fa-puzzle-piece:before {
  content: "\f12e"; }

.fa-python:before {
  content: "\f3e2"; }

.fa-qq:before {
  content: "\f1d6"; }

.fa-qrcode:before {
  content: "\f029"; }

.fa-question:before {
  content: "\f128"; }

.fa-question-circle:before {
  content: "\f059"; }

.fa-quidditch:before {
  content: "\f458"; }

.fa-quinscape:before {
  content: "\f459"; }

.fa-quora:before {
  content: "\f2c4"; }

.fa-quote-left:before {
  content: "\f10d"; }

.fa-quote-right:before {
  content: "\f10e"; }

.fa-quran:before {
  content: "\f687"; }

.fa-r-project:before {
  content: "\f4f7"; }

.fa-radiation:before {
  content: "\f7b9"; }

.fa-radiation-alt:before {
  content: "\f7ba"; }

.fa-rainbow:before {
  content: "\f75b"; }

.fa-random:before {
  content: "\f074"; }

.fa-raspberry-pi:before {
  content: "\f7bb"; }

.fa-ravelry:before {
  content: "\f2d9"; }

.fa-react:before {
  content: "\f41b"; }

.fa-reacteurope:before {
  content: "\f75d"; }

.fa-readme:before {
  content: "\f4d5"; }

.fa-rebel:before {
  content: "\f1d0"; }

.fa-receipt:before {
  content: "\f543"; }

.fa-record-vinyl:before {
  content: "\f8d9"; }

.fa-recycle:before {
  content: "\f1b8"; }

.fa-red-river:before {
  content: "\f3e3"; }

.fa-reddit:before {
  content: "\f1a1"; }

.fa-reddit-alien:before {
  content: "\f281"; }

.fa-reddit-square:before {
  content: "\f1a2"; }

.fa-redhat:before {
  content: "\f7bc"; }

.fa-redo:before {
  content: "\f01e"; }

.fa-redo-alt:before {
  content: "\f2f9"; }

.fa-registered:before {
  content: "\f25d"; }

.fa-remove-format:before {
  content: "\f87d"; }

.fa-renren:before {
  content: "\f18b"; }

.fa-reply:before {
  content: "\f3e5"; }

.fa-reply-all:before {
  content: "\f122"; }

.fa-replyd:before {
  content: "\f3e6"; }

.fa-republican:before {
  content: "\f75e"; }

.fa-researchgate:before {
  content: "\f4f8"; }

.fa-resolving:before {
  content: "\f3e7"; }

.fa-restroom:before {
  content: "\f7bd"; }

.fa-retweet:before {
  content: "\f079"; }

.fa-rev:before {
  content: "\f5b2"; }

.fa-ribbon:before {
  content: "\f4d6"; }

.fa-ring:before {
  content: "\f70b"; }

.fa-road:before {
  content: "\f018"; }

.fa-robot:before {
  content: "\f544"; }

.fa-rocket:before {
  content: "\f135"; }

.fa-rocketchat:before {
  content: "\f3e8"; }

.fa-rockrms:before {
  content: "\f3e9"; }

.fa-route:before {
  content: "\f4d7"; }

.fa-rss:before {
  content: "\f09e"; }

.fa-rss-square:before {
  content: "\f143"; }

.fa-ruble-sign:before {
  content: "\f158"; }

.fa-ruler:before {
  content: "\f545"; }

.fa-ruler-combined:before {
  content: "\f546"; }

.fa-ruler-horizontal:before {
  content: "\f547"; }

.fa-ruler-vertical:before {
  content: "\f548"; }

.fa-running:before {
  content: "\f70c"; }

.fa-rupee-sign:before {
  content: "\f156"; }

.fa-sad-cry:before {
  content: "\f5b3"; }

.fa-sad-tear:before {
  content: "\f5b4"; }

.fa-safari:before {
  content: "\f267"; }

.fa-salesforce:before {
  content: "\f83b"; }

.fa-sass:before {
  content: "\f41e"; }

.fa-satellite:before {
  content: "\f7bf"; }

.fa-satellite-dish:before {
  content: "\f7c0"; }

.fa-save:before {
  content: "\f0c7"; }

.fa-schlix:before {
  content: "\f3ea"; }

.fa-school:before {
  content: "\f549"; }

.fa-screwdriver:before {
  content: "\f54a"; }

.fa-scribd:before {
  content: "\f28a"; }

.fa-scroll:before {
  content: "\f70e"; }

.fa-sd-card:before {
  content: "\f7c2"; }

.fa-search:before {
  content: "\f002"; }

.fa-search-dollar:before {
  content: "\f688"; }

.fa-search-location:before {
  content: "\f689"; }

.fa-search-minus:before {
  content: "\f010"; }

.fa-search-plus:before {
  content: "\f00e"; }

.fa-searchengin:before {
  content: "\f3eb"; }

.fa-seedling:before {
  content: "\f4d8"; }

.fa-sellcast:before {
  content: "\f2da"; }

.fa-sellsy:before {
  content: "\f213"; }

.fa-server:before {
  content: "\f233"; }

.fa-servicestack:before {
  content: "\f3ec"; }

.fa-shapes:before {
  content: "\f61f"; }

.fa-share:before {
  content: "\f064"; }

.fa-share-alt:before {
  content: "\f1e0"; }

.fa-share-alt-square:before {
  content: "\f1e1"; }

.fa-share-square:before {
  content: "\f14d"; }

.fa-shekel-sign:before {
  content: "\f20b"; }

.fa-shield-alt:before {
  content: "\f3ed"; }

.fa-ship:before {
  content: "\f21a"; }

.fa-shipping-fast:before {
  content: "\f48b"; }

.fa-shirtsinbulk:before {
  content: "\f214"; }

.fa-shoe-prints:before {
  content: "\f54b"; }

.fa-shopping-bag:before {
  content: "\f290"; }

.fa-shopping-basket:before {
  content: "\f291"; }

.fa-shopping-cart:before {
  content: "\f07a"; }

.fa-shopware:before {
  content: "\f5b5"; }

.fa-shower:before {
  content: "\f2cc"; }

.fa-shuttle-van:before {
  content: "\f5b6"; }

.fa-sign:before {
  content: "\f4d9"; }

.fa-sign-in-alt:before {
  content: "\f2f6"; }

.fa-sign-language:before {
  content: "\f2a7"; }

.fa-sign-out-alt:before {
  content: "\f2f5"; }

.fa-signal:before {
  content: "\f012"; }

.fa-signature:before {
  content: "\f5b7"; }

.fa-sim-card:before {
  content: "\f7c4"; }

.fa-simplybuilt:before {
  content: "\f215"; }

.fa-sistrix:before {
  content: "\f3ee"; }

.fa-sitemap:before {
  content: "\f0e8"; }

.fa-sith:before {
  content: "\f512"; }

.fa-skating:before {
  content: "\f7c5"; }

.fa-sketch:before {
  content: "\f7c6"; }

.fa-skiing:before {
  content: "\f7c9"; }

.fa-skiing-nordic:before {
  content: "\f7ca"; }

.fa-skull:before {
  content: "\f54c"; }

.fa-skull-crossbones:before {
  content: "\f714"; }

.fa-skyatlas:before {
  content: "\f216"; }

.fa-skype:before {
  content: "\f17e"; }

.fa-slack:before {
  content: "\f198"; }

.fa-slack-hash:before {
  content: "\f3ef"; }

.fa-slash:before {
  content: "\f715"; }

.fa-sleigh:before {
  content: "\f7cc"; }

.fa-sliders-h:before {
  content: "\f1de"; }

.fa-slideshare:before {
  content: "\f1e7"; }

.fa-smile:before {
  content: "\f118"; }

.fa-smile-beam:before {
  content: "\f5b8"; }

.fa-smile-wink:before {
  content: "\f4da"; }

.fa-smog:before {
  content: "\f75f"; }

.fa-smoking:before {
  content: "\f48d"; }

.fa-smoking-ban:before {
  content: "\f54d"; }

.fa-sms:before {
  content: "\f7cd"; }

.fa-snapchat:before {
  content: "\f2ab"; }

.fa-snapchat-ghost:before {
  content: "\f2ac"; }

.fa-snapchat-square:before {
  content: "\f2ad"; }

.fa-snowboarding:before {
  content: "\f7ce"; }

.fa-snowflake:before {
  content: "\f2dc"; }

.fa-snowman:before {
  content: "\f7d0"; }

.fa-snowplow:before {
  content: "\f7d2"; }

.fa-socks:before {
  content: "\f696"; }

.fa-solar-panel:before {
  content: "\f5ba"; }

.fa-sort:before {
  content: "\f0dc"; }

.fa-sort-alpha-down:before {
  content: "\f15d"; }

.fa-sort-alpha-down-alt:before {
  content: "\f881"; }

.fa-sort-alpha-up:before {
  content: "\f15e"; }

.fa-sort-alpha-up-alt:before {
  content: "\f882"; }

.fa-sort-amount-down:before {
  content: "\f160"; }

.fa-sort-amount-down-alt:before {
  content: "\f884"; }

.fa-sort-amount-up:before {
  content: "\f161"; }

.fa-sort-amount-up-alt:before {
  content: "\f885"; }

.fa-sort-down:before {
  content: "\f0dd"; }

.fa-sort-numeric-down:before {
  content: "\f162"; }

.fa-sort-numeric-down-alt:before {
  content: "\f886"; }

.fa-sort-numeric-up:before {
  content: "\f163"; }

.fa-sort-numeric-up-alt:before {
  content: "\f887"; }

.fa-sort-up:before {
  content: "\f0de"; }

.fa-soundcloud:before {
  content: "\f1be"; }

.fa-sourcetree:before {
  content: "\f7d3"; }

.fa-spa:before {
  content: "\f5bb"; }

.fa-space-shuttle:before {
  content: "\f197"; }

.fa-speakap:before {
  content: "\f3f3"; }

.fa-speaker-deck:before {
  content: "\f83c"; }

.fa-spell-check:before {
  content: "\f891"; }

.fa-spider:before {
  content: "\f717"; }

.fa-spinner:before {
  content: "\f110"; }

.fa-splotch:before {
  content: "\f5bc"; }

.fa-spotify:before {
  content: "\f1bc"; }

.fa-spray-can:before {
  content: "\f5bd"; }

.fa-square:before {
  content: "\f0c8"; }

.fa-square-full:before {
  content: "\f45c"; }

.fa-square-root-alt:before {
  content: "\f698"; }

.fa-squarespace:before {
  content: "\f5be"; }

.fa-stack-exchange:before {
  content: "\f18d"; }

.fa-stack-overflow:before {
  content: "\f16c"; }

.fa-stackpath:before {
  content: "\f842"; }

.fa-stamp:before {
  content: "\f5bf"; }

.fa-star:before {
  content: "\f005"; }

.fa-star-and-crescent:before {
  content: "\f699"; }

.fa-star-half:before {
  content: "\f089"; }

.fa-star-half-alt:before {
  content: "\f5c0"; }

.fa-star-of-david:before {
  content: "\f69a"; }

.fa-star-of-life:before {
  content: "\f621"; }

.fa-staylinked:before {
  content: "\f3f5"; }

.fa-steam:before {
  content: "\f1b6"; }

.fa-steam-square:before {
  content: "\f1b7"; }

.fa-steam-symbol:before {
  content: "\f3f6"; }

.fa-step-backward:before {
  content: "\f048"; }

.fa-step-forward:before {
  content: "\f051"; }

.fa-stethoscope:before {
  content: "\f0f1"; }

.fa-sticker-mule:before {
  content: "\f3f7"; }

.fa-sticky-note:before {
  content: "\f249"; }

.fa-stop:before {
  content: "\f04d"; }

.fa-stop-circle:before {
  content: "\f28d"; }

.fa-stopwatch:before {
  content: "\f2f2"; }

.fa-store:before {
  content: "\f54e"; }

.fa-store-alt:before {
  content: "\f54f"; }

.fa-strava:before {
  content: "\f428"; }

.fa-stream:before {
  content: "\f550"; }

.fa-street-view:before {
  content: "\f21d"; }

.fa-strikethrough:before {
  content: "\f0cc"; }

.fa-stripe:before {
  content: "\f429"; }

.fa-stripe-s:before {
  content: "\f42a"; }

.fa-stroopwafel:before {
  content: "\f551"; }

.fa-studiovinari:before {
  content: "\f3f8"; }

.fa-stumbleupon:before {
  content: "\f1a4"; }

.fa-stumbleupon-circle:before {
  content: "\f1a3"; }

.fa-subscript:before {
  content: "\f12c"; }

.fa-subway:before {
  content: "\f239"; }

.fa-suitcase:before {
  content: "\f0f2"; }

.fa-suitcase-rolling:before {
  content: "\f5c1"; }

.fa-sun:before {
  content: "\f185"; }

.fa-superpowers:before {
  content: "\f2dd"; }

.fa-superscript:before {
  content: "\f12b"; }

.fa-supple:before {
  content: "\f3f9"; }

.fa-surprise:before {
  content: "\f5c2"; }

.fa-suse:before {
  content: "\f7d6"; }

.fa-swatchbook:before {
  content: "\f5c3"; }

.fa-swift:before {
  content: "\f8e1"; }

.fa-swimmer:before {
  content: "\f5c4"; }

.fa-swimming-pool:before {
  content: "\f5c5"; }

.fa-symfony:before {
  content: "\f83d"; }

.fa-synagogue:before {
  content: "\f69b"; }

.fa-sync:before {
  content: "\f021"; }

.fa-sync-alt:before {
  content: "\f2f1"; }

.fa-syringe:before {
  content: "\f48e"; }

.fa-table:before {
  content: "\f0ce"; }

.fa-table-tennis:before {
  content: "\f45d"; }

.fa-tablet:before {
  content: "\f10a"; }

.fa-tablet-alt:before {
  content: "\f3fa"; }

.fa-tablets:before {
  content: "\f490"; }

.fa-tachometer-alt:before {
  content: "\f3fd"; }

.fa-tag:before {
  content: "\f02b"; }

.fa-tags:before {
  content: "\f02c"; }

.fa-tape:before {
  content: "\f4db"; }

.fa-tasks:before {
  content: "\f0ae"; }

.fa-taxi:before {
  content: "\f1ba"; }

.fa-teamspeak:before {
  content: "\f4f9"; }

.fa-teeth:before {
  content: "\f62e"; }

.fa-teeth-open:before {
  content: "\f62f"; }

.fa-telegram:before {
  content: "\f2c6"; }

.fa-telegram-plane:before {
  content: "\f3fe"; }

.fa-temperature-high:before {
  content: "\f769"; }

.fa-temperature-low:before {
  content: "\f76b"; }

.fa-tencent-weibo:before {
  content: "\f1d5"; }

.fa-tenge:before {
  content: "\f7d7"; }

.fa-terminal:before {
  content: "\f120"; }

.fa-text-height:before {
  content: "\f034"; }

.fa-text-width:before {
  content: "\f035"; }

.fa-th:before {
  content: "\f00a"; }

.fa-th-large:before {
  content: "\f009"; }

.fa-th-list:before {
  content: "\f00b"; }

.fa-the-red-yeti:before {
  content: "\f69d"; }

.fa-theater-masks:before {
  content: "\f630"; }

.fa-themeco:before {
  content: "\f5c6"; }

.fa-themeisle:before {
  content: "\f2b2"; }

.fa-thermometer:before {
  content: "\f491"; }

.fa-thermometer-empty:before {
  content: "\f2cb"; }

.fa-thermometer-full:before {
  content: "\f2c7"; }

.fa-thermometer-half:before {
  content: "\f2c9"; }

.fa-thermometer-quarter:before {
  content: "\f2ca"; }

.fa-thermometer-three-quarters:before {
  content: "\f2c8"; }

.fa-think-peaks:before {
  content: "\f731"; }

.fa-thumbs-down:before {
  content: "\f165"; }

.fa-thumbs-up:before {
  content: "\f164"; }

.fa-thumbtack:before {
  content: "\f08d"; }

.fa-ticket-alt:before {
  content: "\f3ff"; }

.fa-times:before {
  content: "\f00d"; }

.fa-times-circle:before {
  content: "\f057"; }

.fa-tint:before {
  content: "\f043"; }

.fa-tint-slash:before {
  content: "\f5c7"; }

.fa-tired:before {
  content: "\f5c8"; }

.fa-toggle-off:before {
  content: "\f204"; }

.fa-toggle-on:before {
  content: "\f205"; }

.fa-toilet:before {
  content: "\f7d8"; }

.fa-toilet-paper:before {
  content: "\f71e"; }

.fa-toolbox:before {
  content: "\f552"; }

.fa-tools:before {
  content: "\f7d9"; }

.fa-tooth:before {
  content: "\f5c9"; }

.fa-torah:before {
  content: "\f6a0"; }

.fa-torii-gate:before {
  content: "\f6a1"; }

.fa-tractor:before {
  content: "\f722"; }

.fa-trade-federation:before {
  content: "\f513"; }

.fa-trademark:before {
  content: "\f25c"; }

.fa-traffic-light:before {
  content: "\f637"; }

.fa-trailer:before {
  content: "\f941"; }

.fa-train:before {
  content: "\f238"; }

.fa-tram:before {
  content: "\f7da"; }

.fa-transgender:before {
  content: "\f224"; }

.fa-transgender-alt:before {
  content: "\f225"; }

.fa-trash:before {
  content: "\f1f8"; }

.fa-trash-alt:before {
  content: "\f2ed"; }

.fa-trash-restore:before {
  content: "\f829"; }

.fa-trash-restore-alt:before {
  content: "\f82a"; }

.fa-tree:before {
  content: "\f1bb"; }

.fa-trello:before {
  content: "\f181"; }

.fa-tripadvisor:before {
  content: "\f262"; }

.fa-trophy:before {
  content: "\f091"; }

.fa-truck:before {
  content: "\f0d1"; }

.fa-truck-loading:before {
  content: "\f4de"; }

.fa-truck-monster:before {
  content: "\f63b"; }

.fa-truck-moving:before {
  content: "\f4df"; }

.fa-truck-pickup:before {
  content: "\f63c"; }

.fa-tshirt:before {
  content: "\f553"; }

.fa-tty:before {
  content: "\f1e4"; }

.fa-tumblr:before {
  content: "\f173"; }

.fa-tumblr-square:before {
  content: "\f174"; }

.fa-tv:before {
  content: "\f26c"; }

.fa-twitch:before {
  content: "\f1e8"; }

.fa-twitter:before {
  content: "\f099"; }

.fa-twitter-square:before {
  content: "\f081"; }

.fa-typo3:before {
  content: "\f42b"; }

.fa-uber:before {
  content: "\f402"; }

.fa-ubuntu:before {
  content: "\f7df"; }

.fa-uikit:before {
  content: "\f403"; }

.fa-umbraco:before {
  content: "\f8e8"; }

.fa-umbrella:before {
  content: "\f0e9"; }

.fa-umbrella-beach:before {
  content: "\f5ca"; }

.fa-underline:before {
  content: "\f0cd"; }

.fa-undo:before {
  content: "\f0e2"; }

.fa-undo-alt:before {
  content: "\f2ea"; }

.fa-uniregistry:before {
  content: "\f404"; }

.fa-unity:before {
  content: "\f949"; }

.fa-universal-access:before {
  content: "\f29a"; }

.fa-university:before {
  content: "\f19c"; }

.fa-unlink:before {
  content: "\f127"; }

.fa-unlock:before {
  content: "\f09c"; }

.fa-unlock-alt:before {
  content: "\f13e"; }

.fa-untappd:before {
  content: "\f405"; }

.fa-upload:before {
  content: "\f093"; }

.fa-ups:before {
  content: "\f7e0"; }

.fa-usb:before {
  content: "\f287"; }

.fa-user:before {
  content: "\f007"; }

.fa-user-alt:before {
  content: "\f406"; }

.fa-user-alt-slash:before {
  content: "\f4fa"; }

.fa-user-astronaut:before {
  content: "\f4fb"; }

.fa-user-check:before {
  content: "\f4fc"; }

.fa-user-circle:before {
  content: "\f2bd"; }

.fa-user-clock:before {
  content: "\f4fd"; }

.fa-user-cog:before {
  content: "\f4fe"; }

.fa-user-edit:before {
  content: "\f4ff"; }

.fa-user-friends:before {
  content: "\f500"; }

.fa-user-graduate:before {
  content: "\f501"; }

.fa-user-injured:before {
  content: "\f728"; }

.fa-user-lock:before {
  content: "\f502"; }

.fa-user-md:before {
  content: "\f0f0"; }

.fa-user-minus:before {
  content: "\f503"; }

.fa-user-ninja:before {
  content: "\f504"; }

.fa-user-nurse:before {
  content: "\f82f"; }

.fa-user-plus:before {
  content: "\f234"; }

.fa-user-secret:before {
  content: "\f21b"; }

.fa-user-shield:before {
  content: "\f505"; }

.fa-user-slash:before {
  content: "\f506"; }

.fa-user-tag:before {
  content: "\f507"; }

.fa-user-tie:before {
  content: "\f508"; }

.fa-user-times:before {
  content: "\f235"; }

.fa-users:before {
  content: "\f0c0"; }

.fa-users-cog:before {
  content: "\f509"; }

.fa-usps:before {
  content: "\f7e1"; }

.fa-ussunnah:before {
  content: "\f407"; }

.fa-utensil-spoon:before {
  content: "\f2e5"; }

.fa-utensils:before {
  content: "\f2e7"; }

.fa-vaadin:before {
  content: "\f408"; }

.fa-vector-square:before {
  content: "\f5cb"; }

.fa-venus:before {
  content: "\f221"; }

.fa-venus-double:before {
  content: "\f226"; }

.fa-venus-mars:before {
  content: "\f228"; }

.fa-viacoin:before {
  content: "\f237"; }

.fa-viadeo:before {
  content: "\f2a9"; }

.fa-viadeo-square:before {
  content: "\f2aa"; }

.fa-vial:before {
  content: "\f492"; }

.fa-vials:before {
  content: "\f493"; }

.fa-viber:before {
  content: "\f409"; }

.fa-video:before {
  content: "\f03d"; }

.fa-video-slash:before {
  content: "\f4e2"; }

.fa-vihara:before {
  content: "\f6a7"; }

.fa-vimeo:before {
  content: "\f40a"; }

.fa-vimeo-square:before {
  content: "\f194"; }

.fa-vimeo-v:before {
  content: "\f27d"; }

.fa-vine:before {
  content: "\f1ca"; }

.fa-vk:before {
  content: "\f189"; }

.fa-vnv:before {
  content: "\f40b"; }

.fa-voicemail:before {
  content: "\f897"; }

.fa-volleyball-ball:before {
  content: "\f45f"; }

.fa-volume-down:before {
  content: "\f027"; }

.fa-volume-mute:before {
  content: "\f6a9"; }

.fa-volume-off:before {
  content: "\f026"; }

.fa-volume-up:before {
  content: "\f028"; }

.fa-vote-yea:before {
  content: "\f772"; }

.fa-vr-cardboard:before {
  content: "\f729"; }

.fa-vuejs:before {
  content: "\f41f"; }

.fa-walking:before {
  content: "\f554"; }

.fa-wallet:before {
  content: "\f555"; }

.fa-warehouse:before {
  content: "\f494"; }

.fa-water:before {
  content: "\f773"; }

.fa-wave-square:before {
  content: "\f83e"; }

.fa-waze:before {
  content: "\f83f"; }

.fa-weebly:before {
  content: "\f5cc"; }

.fa-weibo:before {
  content: "\f18a"; }

.fa-weight:before {
  content: "\f496"; }

.fa-weight-hanging:before {
  content: "\f5cd"; }

.fa-weixin:before {
  content: "\f1d7"; }

.fa-whatsapp:before {
  content: "\f232"; }

.fa-whatsapp-square:before {
  content: "\f40c"; }

.fa-wheelchair:before {
  content: "\f193"; }

.fa-whmcs:before {
  content: "\f40d"; }

.fa-wifi:before {
  content: "\f1eb"; }

.fa-wikipedia-w:before {
  content: "\f266"; }

.fa-wind:before {
  content: "\f72e"; }

.fa-window-close:before {
  content: "\f410"; }

.fa-window-maximize:before {
  content: "\f2d0"; }

.fa-window-minimize:before {
  content: "\f2d1"; }

.fa-window-restore:before {
  content: "\f2d2"; }

.fa-windows:before {
  content: "\f17a"; }

.fa-wine-bottle:before {
  content: "\f72f"; }

.fa-wine-glass:before {
  content: "\f4e3"; }

.fa-wine-glass-alt:before {
  content: "\f5ce"; }

.fa-wix:before {
  content: "\f5cf"; }

.fa-wizards-of-the-coast:before {
  content: "\f730"; }

.fa-wolf-pack-battalion:before {
  content: "\f514"; }

.fa-won-sign:before {
  content: "\f159"; }

.fa-wordpress:before {
  content: "\f19a"; }

.fa-wordpress-simple:before {
  content: "\f411"; }

.fa-wpbeginner:before {
  content: "\f297"; }

.fa-wpexplorer:before {
  content: "\f2de"; }

.fa-wpforms:before {
  content: "\f298"; }

.fa-wpressr:before {
  content: "\f3e4"; }

.fa-wrench:before {
  content: "\f0ad"; }

.fa-x-ray:before {
  content: "\f497"; }

.fa-xbox:before {
  content: "\f412"; }

.fa-xing:before {
  content: "\f168"; }

.fa-xing-square:before {
  content: "\f169"; }

.fa-y-combinator:before {
  content: "\f23b"; }

.fa-yahoo:before {
  content: "\f19e"; }

.fa-yammer:before {
  content: "\f840"; }

.fa-yandex:before {
  content: "\f413"; }

.fa-yandex-international:before {
  content: "\f414"; }

.fa-yarn:before {
  content: "\f7e3"; }

.fa-yelp:before {
  content: "\f1e9"; }

.fa-yen-sign:before {
  content: "\f157"; }

.fa-yin-yang:before {
  content: "\f6ad"; }

.fa-yoast:before {
  content: "\f2b1"; }

.fa-youtube:before {
  content: "\f167"; }

.fa-youtube-square:before {
  content: "\f431"; }

.fa-zhihu:before {
  content: "\f63f"; }

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; }

.sr-only-focusable:active, .sr-only-focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }
@font-face {
  font-family: 'Font Awesome 5 Brands';
  font-style: normal;
  font-weight: normal;
  font-display: auto;
  src: url("/assets/_files/styles/webfonts/fa-brands-400.eot");
  src: url("/assets/_files/styles/webfonts/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("/assets/_files/styles/webfonts/fa-brands-400.woff2") format("woff2"), url("/assets/_files/styles/webfonts/fa-brands-400.woff") format("woff"), url("/assets/_files/styles/webfonts/fa-brands-400.ttf") format("truetype"), url("/assets/_files/styles/webfonts/fa-brands-400.svg#fontawesome") format("svg"); }

.fab {
  font-family: 'Font Awesome 5 Brands'; }
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: url("/assets/_files/styles/webfonts/fa-regular-400.eot");
  src: url("/assets/_files/styles/webfonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("/assets/_files/styles/webfonts/fa-regular-400.woff2") format("woff2"), url("/assets/_files/styles/webfonts/fa-regular-400.woff") format("woff"), url("/assets/_files/styles/webfonts/fa-regular-400.ttf") format("truetype"), url("/assets/_files/styles/webfonts/fa-regular-400.svg#fontawesome") format("svg"); }

.far {
  font-family: 'Font Awesome 5 Free';
  font-weight: 400; }
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: url("/assets/_files/styles/webfonts/fa-solid-900.eot");
  src: url("/assets/_files/styles/webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("/assets/_files/styles/webfonts/fa-solid-900.woff2") format("woff2"), url("/assets/_files/styles/webfonts/fa-solid-900.woff") format("woff"), url("/assets/_files/styles/webfonts/fa-solid-900.ttf") format("truetype"), url("/assets/_files/styles/webfonts/fa-solid-900.svg#fontawesome") format("svg"); }

.fa,
.fas {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900; }


@thin: 100;
@light: 300;
@regular: 400;
@medium: 500;
@bold: 700;
@black: 900;

.display4 {
  font-weight: @light;
  font-size: 114px;
}

.display3 {
  font-weight: @bold;
  font-size: 56px;
}

.display2 {
  font-weight: @regular;
  font-size: 47px;
}

.display1 {
  font-weight: @light;
  font-size: 36px;
  line-height: 42px;
}

.headline {
  font-weight: @bold;
  font-size: 24px;
  line-height: 26px;
}

.title {
  font-weight: @medium;
  font-size: 20px;
}

.subhead {
  font-weight: @bold;
  font-size: 16px;
}

.body2 {
  font-weight: @medium;
  font-size: 14px;
}

.body1 {
  font-weight: @regular;
  font-size: 14px;
}

.caption {
  font-weight: @regular;
  font-size: 12px;
}

.menu {
  font-weight: @medium;
  font-size: 14px;
}

.button {
  font-weight: @medium;
  font-size: 14px;
}

.navigation-font-size {
  font-weight: @regular;
  font-size: 20px;
}

.text-glow {
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6), 0 2px 6px rgba(0, 0, 0, 0.6), 0 2px 6px rgba(0, 0, 0, 0.6);
}

.thin {
  font-weight: @thin;
}

.light {
  font-weight: @light;
}

.regular {
  font-weight: @regular;
}

.medium {
  font-weight: @medium;
}

.bold {
  font-weight: @bold;
}

.black {
  font-weight: @black;
}

.font-text-color {
  color: @text-color;
}

.font-icon-color {
  color: @icons-color;
}

.font-secondary-text-color {
  color: @secondary-text-color;
}

.font-hint-text-color {
  color: @hint-text-color;
}

.font-dividers-color {
  color: @dividers-color;
}



.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.slick-list {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
    padding: 0;

    &:focus {
        outline: none;
    }

    &.dragging {
        cursor: pointer;
        cursor: hand;
    }
}
.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;

    &:before,
    &:after {
        content: "";
        display: table;
    }

    &:after {
        clear: both;
    }

    .slick-loading & {
        visibility: hidden;
    }
}
.slick-slide {
    float: left;
    height: 100%;
    min-height: 1px;
    [dir="rtl"] & {
        float: right;
    }
    img {
        display: block;
    }
    &.slick-loading img {
        display: none;
    }

    display: none;

    &.dragging img {
        pointer-events: none;
    }

    .slick-initialized & {
        display: block;
    }

    .slick-loading & {
        visibility: hidden;
    }

    .slick-vertical & {
        display: block;
        height: auto;
        border: 1px solid transparent;
    }
}
.slick-arrow.slick-hidden {
    display: none;
}


.croppie-container {
    width: 100%;
    height: 100%;
}

.croppie-container .cr-image {
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 0 0;
    max-height: none;
    max-width: none;
}

.croppie-container .cr-boundary {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.croppie-container .cr-viewport,
.croppie-container .cr-resizer {
    position: absolute;
    border: 2px solid #fff;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    box-shadow: 0 0 2000px 2000px rgba(0, 0, 0, 0.5);
    z-index: 0;
}

.croppie-container .cr-resizer {
    z-index: 2;
    box-shadow: none;
    pointer-events: none;
}

.croppie-container .cr-resizer-vertical,
.croppie-container .cr-resizer-horisontal {
    position: absolute;
    pointer-events: all;
}

.croppie-container .cr-resizer-vertical::after,
.croppie-container .cr-resizer-horisontal::after {
    display: block;
    position: absolute;
    box-sizing: border-box;
    border: 1px solid black;
    background: #fff;
    width: 10px;
    height: 10px;
    content: '';
}

.croppie-container .cr-resizer-vertical {
    bottom: -5px;
    cursor: row-resize;
    width: 100%;
    height: 10px;
}

.croppie-container .cr-resizer-vertical::after {
    left: 50%;
    margin-left: -5px;
}

.croppie-container .cr-resizer-horisontal {
    right: -5px;
    cursor: col-resize;
    width: 10px;
    height: 100%;
}

.croppie-container .cr-resizer-horisontal::after {
    top: 50%;
    margin-top: -5px;
}

.croppie-container .cr-original-image {
    display: none;
}

.croppie-container .cr-vp-circle {
    border-radius: 50%;
}

.croppie-container .cr-overlay {
    z-index: 1;
    position: absolute;
    cursor: move;
    touch-action: none;
}

.croppie-container .cr-slider-wrap {
    width: 75%;
    margin: 15px auto;
    text-align: center;
}

.croppie-result {
    position: relative;
    overflow: hidden;
}

.croppie-result img {
    position: absolute;
}

.croppie-container .cr-image,
.croppie-container .cr-overlay,
.croppie-container .cr-viewport {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}




/*http://brennaobrien.com/blog/2014/05/style-input-type-range-in-every-browser.html */


.cr-slider {
    -webkit-appearance: none;
    /*removes default webkit styles*/
    /*border: 1px solid white; *//*fix for FF unable to apply focus style bug */
    width: 300px;
    /*required for proper track sizing in FF*/
    max-width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    background-color: transparent;
}

.cr-slider::-webkit-slider-runnable-track {
    width: 100%;
    height: 3px;
    background: rgba(0, 0, 0, 0.5);
    border: 0;
    border-radius: 3px;
}

.cr-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top: -6px;
}

.cr-slider:focus {
    outline: none;
}
/*
.cr-slider:focus::-webkit-slider-runnable-track {
background: #ccc;
}
*/

.cr-slider::-moz-range-track {
    width: 100%;
    height: 3px;
    background: rgba(0, 0, 0, 0.5);
    border: 0;
    border-radius: 3px;
}

.cr-slider::-moz-range-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top: -6px;
}

/*hide the outline behind the border*/
.cr-slider:-moz-focusring {
    outline: 1px solid white;
    outline-offset: -1px;
}

.cr-slider::-ms-track {
    width: 100%;
    height: 5px;
    background: transparent;
    /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
    border-color: transparent;/*leave room for the larger thumb to overflow with a transparent border */
    border-width: 6px 0;
    color: transparent;/*remove default tick marks*/
}
.cr-slider::-ms-fill-lower {
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
}
.cr-slider::-ms-fill-upper {
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
}
.cr-slider::-ms-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top:1px;
}
.cr-slider:focus::-ms-fill-lower {
    background: rgba(0, 0, 0, 0.5);
}
.cr-slider:focus::-ms-fill-upper {
    background: rgba(0, 0, 0, 0.5);
}



/* Rotation Tools */

.cr-rotate-controls {
    position: absolute;
    bottom: 5px;
    left: 5px;
    z-index: 1;
}
.cr-rotate-controls button {
    border: 0;
    background: none;
}
.cr-rotate-controls i:before {
    display: inline-block;
    font-style: normal;
    font-weight: 900;
    font-size: 22px;
}
.cr-rotate-l i:before {
    content: '↺';
}
.cr-rotate-r i:before {
    content: '↻';
}

body.lb-disable-scrolling {
  overflow: hidden;
}

.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}

.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
  outline: none;
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  max-height: none;
  border-radius: 3px;

  /* Image border */
  border: 4px solid white;
}

.lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 4px;

  /* Background color behind image.
     This is visible during transitions. */
  background-color: white;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-loader {
  position: absolute;
  top: 43%;
  left: 0;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(https://friedhold.de/assets/_files/images/lightbox/loading.gif) no-repeat;
}

.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: none;
  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}

.lb-prev, .lb-next {
  height: 100%;
  cursor: pointer;
  display: block;
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(https://friedhold.de/assets/_files/images/lightbox/prev.png) left 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(https://friedhold.de/assets/_files/images/lightbox/next.png) right 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-data {
  padding: 0 4px;
  color: #ccc;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-caption a {
  color: #4ae;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(https://friedhold.de/assets/_files/images/lightbox/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
.elem-frontend-aitest-content {
  @transition: all 0.3s ease;

  .upload-section, .gallery-section {
    padding: 8px 0;
  }

  h2 {
    padding-bottom: 16px;
  }

  .file-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
  }

  .status {
    margin-top: 20px;
    padding: 15px;
    border-radius: @basic-border-radius;
    background-color: #FAFAFA;
    transition: @transition;

    &.success {
      color: @text-color;
      border-left: 4px solid @corporate-color;
    }

    &.info {
      color: @text-color;
      border-left: 4px solid @corporate-color;
    }

    &.error {
      color: @text-color;
      border-left: 4px solid @error-color;
    }
  }

  .progress-bar {
    width: 100%;
    height: 8px;
    background: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
    margin-top: 10px;

    .progress {
      height: 100%;
      background: linear-gradient(45deg, @error-color, @corporate-color);
      width: 0%;
      transition: width 0.3s ease;
    }
  }

  .image-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 15px;
  }

  .image-item {
    position: relative;
    border-radius: @basic-border-radius;
    padding-bottom: 34px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: @transition;

    img {
      width: 100%;
      height: auto;
      object-fit: cover;
      display: block;
    }

    .image-info {
      padding: 8px 16px;

      p {
        padding-bottom: 2px;
      }

      p:last-child {
        padding-bottom: 0;
      }
    }

    .delete-btn {
      position: absolute;
      top: 5px;
      right: 5px;
      background: @error-color;
      color: white;
      border: none;
      border-radius: 50%;
      width: 25px;
      height: 25px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transition: @transition;

      &:hover {
        background: @error-color;
      }
    }

    &:hover .delete-btn {
      opacity: 1;
    }
  }

  .empty-gallery {
    text-align: center;
    font-style: italic;
    padding: 40px;
    border: 2px dashed @dividers-color;
    border-radius: @basic-border-radius;
  }

  .edit-buttons {
    overflow: hidden;
    position: absolute;
    bottom: 0;
    left: 0;
    border-top: 1px solid @dividers-color;
    width: 100%;

    a, span {
      float: left;
      display: block;
      padding: 8px 16px;
      width: 50%;
      cursor: pointer;
      font-size: 18px;
    }

    .delete-image {
      border-right: 1px solid @dividers-color;
      color: @error-color;
    }

    .crop-image {
      color: @text-color;
    }
  }
}

.elem-frontend-aitest-content-image_list {
  .hide-section {
    display: none;
  }

  .error-message {
    color: @error-color;
  }

  .img-amount {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
  }
}

.elem-frontend-assistent-help {
  position: fixed;
  right: 24px;
  bottom: 120px;
  padding-right: 0;
  width: 300px;

  .card {
    padding: 0;
  }

  h3 {
    margin: 0;
  }

  .card {
    margin: 0;
  }

  .help-assistance-card {
    overflow: hidden;
    max-height: 800px;
    -webkit-transition: max-height 0.5s;
    -moz-transition: max-height 0.5s;
    -ms-transition: max-height 0.5s;
    -o-transition: max-height 0.5s;
    transition: max-height 0.5s;
  }

  .help-assistance-card.hide-help-assistance {
    max-height: 38px;
  }

  .card-inner {
    position: relative;
  }

  .card-head {
    position: relative;
    padding: 8px 16px;
    background-color: @dark-corporate-color;

    h3 {
      padding-right: 24px;
      color: #ffffff;
    }

    .unfold_less, .unfold_more {
      position: absolute;
      opacity: 0;
      z-index: 0;
      top: 0;
      right: 0;
      padding: 5px 8px;
      padding-left: 0;
      color: #ffffff;
      font-size: 28px;
      cursor: pointer;
      -webkit-transition: opacity 0.5s;
      -moz-transition: opacity 0.5s;
      -ms-transition: opacity 0.5s;
      -o-transition: opacity 0.5s;
      transition: opacity 0.5s;
    }

    .unfold_less.show-icon-control, .unfold_more.show-icon-control {
      opacity: 1;
      z-index: 1;
    }
  }

  .card {
    .card-body {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 16px 16px;
      min-height: 145px;
      -webkit-transition: min-height 0.3s;
      -moz-transition: min-height 0.3s;
      -ms-transition: min-height 0.3s;
      -o-transition: min-height 0.3s;
      transition: min-height 0.3s;

      p {
        padding-bottom: 16px;
        font-size: inherit;
        font-weight: inherit;

        a {
          font-size: inherit;
          font-weight: inherit;
          text-decoration: underline;
        }

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

      p:last-child {
        padding-bottom: 0;
      }
    }
  }

  .border-top {
    border-top: 1px solid @dividers-color;
  }
}

.elem-frontend-assistent-help.dont-show-help {


  .card-body {
    border-bottom: none;
    padding-top: 0;
    padding-bottom: 0;
    min-height: 0;
  }
}

.elem-frontend-assistent-contact-email {
  .contact-content {
    position: relative;
    padding: 8px 16px;
    padding-left: 88px;

    img.contact-image {
      position: absolute;
      top: 0;
      left: 0;
      height: 72px;
      width: 72px;
    }

    p {
      padding-top: 4px;
    }

    #support-button {
      display: block;
      padding: 8px 0;
      padding-bottom: 4px;
      cursor: pointer;
    }
  }
}

.elem-frontend-assistent-contact-popup {
  .card {
    border-radius: 0 !important;
    padding: 0;
    width: 328px !important;

    #map_description {
      padding: 0 16px;
    }

    .popup-head {
      padding-top: 8px;
      padding-bottom: 8px;
      background-color: @dark-corporate-color;

      h3 {
        padding: 8px 16px;
        color: #ffffff;
      }
    }

    .popup-body {
      padding: 16px 0;

      .input-field {
        margin-bottom: 0 !important;
      }
    }

    .popup-footer {
      padding: 8px 0;
      padding-bottom: 0;
    }
  }

  .loading-area {
    position: relative;
    height: 150px;
  }

  .input-area {
    padding-bottom: 8px;
  }

  .input-area, .loading-area , .finished-area {
    display: none;
    position: relative;
    z-index: 0;
    opacity: 0;
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }

  .finished-area {
    padding: 16px;
    span.material-icons {
      font-size: 60px;
      color: @corporate-color;
    }

    p {
      padding-top: 24px;
    }
  }

  .input-area.active-area, .loading-area.active-area , .finished-area.active-area {
    display: block;
    z-index: 1;
    opacity: 1;
  }

  #contact_confirmation.hide-button {
    display: none;
  }

  #cancel {
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }

  #cancel.highlight-button {
    color: @corporate-color;
  }

  #cancel.highlight-button:hover {
    color: @corporate-color;
  }

  .accordion {
    width: 100%;
    max-width: 680px;
  }

  .accordion-item {
    border-bottom: 1px solid @dividers-color;
    overflow: hidden;
  }

  .accordion-header {
    width: 100%;
    background: none;
    border: none;
    padding: 8px 16px;
    text-align: left;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background 0.2s;
  }

  .accordion-header:hover {
    background: @dividers-color;
  }

  .accordion-header.active {
    background: #eef4ff;
    color: #1a5cd7;
  }

  .accordion-icon {
    font-size: 20px;
    transition: transform 0.3s ease;
    line-height: 1;
  }

  .accordion-header.active .accordion-icon {
    transform: rotate(45deg);
  }

  .accordion-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease, padding 0.35s ease;
    padding: 0 20px;
  }

  .accordion-body.open {
    max-height: 500px;
    padding: 14px 20px 18px;
  }

  .accordion-body p {
    font-size: 14px;
    color: #555;
    line-height: 1.6;
  }

  button {
    padding: 0;
  }
}

.elem-frontend-assistent-contact-popup.active-popup {
  display: block;
}

.elem-frontend-assistent-help-loader {
  display: none;
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: white;
  -webkit-transition: background-color 0.5s;
  -moz-transition: background-color 0.5s;
  -ms-transition: background-color 0.5s;
  -o-transition: background-color 0.5s;
  transition: background-color 0.5s;


}

.elem-frontend-assistent-help-loader.active {
  display: block;
}

.elem-frontend-assistent-help-loader-active_loader {
  img {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -40px;
    margin-left: -40px;
    height: 80px;
    width: auto;
  }

  .outer-loader {
    position: absolute;
    top: 50%;
    right: 50%;
    margin-top: -50px;
    margin-right: -50px;
    height: 100px;
    width: 100px;
  }

  .preloader-wrapper {
    height: 100px;
    width: 100px;
  }

  .progress {
    display: none;
    margin-top: 2.5rem !important;
  }

  .progress.show-loader {
    display: block;
  }
}

.elem-frontend-assistent-quality-show {
  ul {
    padding-top: 16px;
    padding-bottom: 16px;
  }

  li {
    .inner-content {
      display: block;
      position: relative;
      padding: 4px 24px;
      padding-left: 62px;

      i {
        position: absolute;
        top: 50%;
        left: 24px;
        margin-top: -14px;
        font-size: 28px;
      }
    }
  }

  .check {
    color: @corporate-color;
  }

  .medium {
    color: #F89800;
  }

  .fail {
    color: #E53935;
  }
}

.elem-frontend-cms-butcher-overview {

  .card {
    padding: 8px 16px;

    h2 {
      position: relative;
      padding-top: 16px;
      padding-bottom: 8px;
      padding-right: 120px;

      .distance {
        position: absolute;
        top: 18px;
        right: 0;
      }
    }

    .address {
      padding-bottom: 8px;
    }

    .icon-text {
      position: relative;
      padding: 4px 0;
      padding-left: 40px;

      .material-icons {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -10px;
        font-size: 20px;
        color: inherit;
      }
    }

    a.btn-flat {
      margin-right: -16px;
    }

    .info-area {
      padding: 4px 0;
    }
  }

@media @xs {

}

@media @sm {

}

@media @md {

}
}

.elem-frontend-cms-butcher-overview-map {
  padding: 0 !important;

  #map {
    height: 249px;
    width: 100%;
  }

  .map-legend {
    overflow: hidden;
    padding-top: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
    padding-left: 16px;

    li {
      float: left;
      display: block;
      position: relative;
      padding: 8px 16px;
      padding-left: 56px;
      width: 50%;

      .svg-grafic {
        position: absolute;
        top: 50%;
        left: 8px;
        margin-top: -24px;
      }
    }
  }

  @media @xs {
    .map-legend {
      overflow: hidden;
      padding-top: 8px;

      li {
        float: left;
        display: block;
        position: relative;
        padding: 12px 16px;
        padding-left: 56px;
        width: 100%;

        .svg-grafic {
          position: absolute;
          top: 50%;
          left: 8px;
          margin-top: -24px;
        }
      }
    }
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-butcher-overview-services {
  overflow: hidden;
  padding: 8px 0;

  li.custom-badge {
    float: left;
    display: block;
    margin: 2px 0;
    margin-right: 8px;
    padding: 2px 8px;
    border-radius: 4px;
    background-color: @corporate-color;
    color: #FFFFFF;
  }

  li.custom-badge:first-child {
    margin-left: 0;
  }

  li.custom-badge:last-child {
    margin-right: 0;
  }
}

.elem-frontend-cms-community-answer {
  h2 {
    padding: 8px 0;
  }
}

.elem-frontend-cms-community-detail {

  .print-area {
    padding-bottom: 16px;
  }

  .card {
    padding: 0;
    padding-left: 16px;

    .citer {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 16px 0;
      padding-right: 48px;

      .edit-button {
        position: absolute;
        top: 50%;
        right: 16px;
        margin-top: -12px;
        color: @corporate-color;
      }
    }

    .community-content {
      padding: 16px;
      padding-left: 0;

      .community-date {
        padding-bottom: 16px;
      }

      h2 {
        padding-bottom: 8px;
      }
    }

    .cta-area {
      position: relative;
      border-top: 1px solid @dividers-color;
      padding: 8px 0;

      .like-counter {
        display: inline-block;
        position: absolute;
        bottom: 16px;
        left: 0;
      }
    }
  }

  .no-entrys-card {
    padding: 16px;
  }
}

.elem-frontend-cms-community-edit {

  .elem-frontend-cms-elements-form-radio {
    padding-bottom: 0;
  }
}

.elem-frontend-cms-community-new_post {
  h2 {
    padding: 8px 0;
  }
}

.elem-frontend-cms-community-overview {

  .toggle-outer {
    padding: 16px 0;

    .toggle {
      overflow: hidden;
      border-radius: @basic-border-radius;
      border: 1px solid @corporate-color;

      a {
        float: left;
        padding: 16px 8px;
        width: 33.33333333333333%;
        background-color: #ffffff;
        color: @secondary-text-color;
      }

      a.active {
        border: 1px solid @corporate-color;
        background-color: rgba(130, 197, 93, 0.2);
        color: @text-color;
        font-weight: @medium;
      }
    }
  }

  .print-area {
    padding-bottom: 8px;

    a {
      span {
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
      }
    }
  }

  .card {
    padding: 0;

    .sec-content {
      position: relative;
      padding: 16px;
      padding-bottom: 8px;

      .community_date {
        position: absolute;
        top: 16px;
        right: 16px;
      }
    }

    .overview-content {
      padding: 8px 16px;
    }

    .citer {
      padding: 8px 16px;
    }

    .numbers-content {
      overflow: hidden;
      padding: 8px 16px;

      .numbers-inner {
        float: left;
        width: 50%;

        span {
          display: block;
          color: @dark-corporate-color;
        }

        span.body1 {
          padding-top: 8px;
        }
      }
    }

    .action-area {
      position: relative;
      padding-top: 16px;
      padding-bottom: 8px;

      .status {
        position: absolute;
        bottom: 16px;
        left: 16px;
      }
    }
  }

  .no-entrys-card {
    padding: 16px;
  }
}

.elem-frontend-cms-customer-createCustomer {

  .suggestion-input {
    position: relative;
  }

  .input-outer {
    overflow: hidden;

    .elem-frontend-cms-elements-form-input, .elem-frontend-cms-elements-form-select {
      margin: 0;
    }

    .elem-frontend-cms-elements-form-select {
      padding-top: 11px;
    }

    .xs-input-3, .xs-input-9 {
      float: left;
      display: block;
    }

    .xs-input-3 {
      padding-right: 4px;
      width: 33.3333333%;
    }

    .xs-input-9 {
      padding-left: 4px;
      width: 66.6666666%;
    }
  }
}

.elem-frontend-cms-customer-detail {

  .mail-error {
    margin: 16px 0;
    border: 1px solid @error-color;
    border-radius: @basic-border-radius;
    padding: 16px;
    background-color: fade(@error-color, 5%);

    h2, p {
      color: @error-color;
    }

    h2 {
      padding-bottom: 8px;
    }

    ul.mail-error-reasons {
      padding-top: 8px;
      padding-left: 16px;

      li {
        padding: 2px 0;
        color: @error-color;
        list-style: disc;
      }
    }
  }

  .hidden-area {
    display: none;
  }

  .hidden-area.show {
    display: block;
  }

  .send-mail {
    padding-top: 8px;
  }
}

.elem-frontend-cms-customer-editCustomer {

  .suggestion-input {
    position: relative;
  }

  .input-outer {
    overflow: hidden;

    .elem-frontend-cms-elements-form-input, .elem-frontend-cms-elements-form-select {
      margin: 0;
    }

    .elem-frontend-cms-elements-form-select {
      padding-top: 11px;
    }

    .xs-input-3, .xs-input-9 {
      float: left;
      display: block;
    }

    .xs-input-3 {
      padding-right: 4px;
      width: 33.3333333%;
    }

    .xs-input-9 {
      padding-left: 4px;
      width: 66.6666666%;
    }
  }

  .delete-customer {
    margin-right: 4px;
  }

  .block-customer {
    margin-left: 4px;
    background-color: @error-color;
  }

  .block-customer:hover {
    background-color: @error-color;
  }

  .deblock-customer {
    background-color: @dividers-color;
    color: @text-color !important;
  }

  .deblock-customer:hover {
    background-color: @dividers-color;
    color: @text-color !important;
  }
}

.elem-frontend-cms-customer-filter {
  height: 100%;

  .hiding-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .hiding-area.active-area {
    max-height: 5000px;
  }

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-customer-note_edit {

  .suggestion-input {
    position: relative;
  }

  .input-outer {
    overflow: hidden;

    .elem-frontend-cms-elements-form-input, .elem-frontend-cms-elements-form-select {
      margin: 0;
    }

    .elem-frontend-cms-elements-form-select {
      padding-top: 11px;
    }

    .xs-input-3, .xs-input-9 {
      float: left;
      display: block;
    }

    .xs-input-3 {
      padding-right: 4px;
      width: 33.3333333%;
    }

    .xs-input-9 {
      padding-left: 4px;
      width: 66.6666666%;
    }
  }
}

.elem-frontend-cms-customer-overview {
  height: 100%;

  .add-content-area {
    padding-bottom: 24px;
  }

  .filter-area {
    padding: 16px 0;

    a.btn-flat {
      color: @corporate-color;

      span {
        display: inline-block;
        padding: 0;
        padding-right: 8px;
        vertical-align: middle;
        color: inherit;
      }
    }
  }

  .filter {

    p {
      padding-bottom: 8px;
    }

    .delete-filter {
      padding-top: 8px;
    }
  }

  .highlight-text {

    a {
      padding-right: 8px;
      padding-left: 8px;
      color: @error-color !important;
    }

    .delete-filter {
      padding-right: 8px;
      padding-left: 8px;

      .material-icons {
        padding-right: 0;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-customer-detail-discount_list {

}

.elem-frontend-cms-customer-detail-links {

  span.material-icons {
    padding: 7px 8px;
    vertical-align: middle;
    color: inherit;
  }

  .link-area:first-child {
    padding-bottom: 8px;
  }

  .link-area:last-child {
    padding-top: 8px;
  }
}

.elem-frontend-cms-customer-detail-note_list.no-side-padding {
  position: relative;
  padding: 8px 0;
  padding-left: 16px;

  h2.title {
    padding-top: 8px;
    padding-right: 52px;
    padding-bottom: 16px;
  }

  p {
    padding: 2px 0;
  }

  .add-button {
    position: absolute;
    top: 6px;
    right: 0;
    padding: 8px;
    padding-right: 16px;

    span {
      font-size: 24px;
    }
  }

  ul {
    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 12px 0;
      padding-right: 16px;

      p {
        padding: 0;
      }

      .discount-link {
        display: block;
      }

      h2.subhead {
        color: @corporate-color;
      }

      .additional-infos {
        position: absolute;
        top: 50%;
        right: 8px;
        margin-top: -20px;
        padding: 8px;
        cursor: pointer;

        span.material-icons {
          color: @secondary-text-color;
        }
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }
}


.elem-frontend-cms-customer-detail-open_delivery {
  .card {
    padding-top: 16px;
    padding-right: 0;
    padding-left: 0;

    .no-group-found {
      padding: 8px 16px;
    }

    h2 {
      padding: 0 16px;
      padding-bottom: 16px;
    }

    h2, h3, p {
      padding-right: 16px;
    }

    .toggle-outer {
      padding: 16px;

      .toggle {
        overflow: hidden;
        border-radius: @basic-border-radius;
        border: 1px solid @corporate-color;

        a {
          float: left;
          padding: 16px 8px;
          width: 50%;
          background-color: #ffffff;
          color: @secondary-text-color;
        }

        a.active {
          border: 1px solid @corporate-color;
          background-color: rgba(130, 197, 93, 0.2);
          color: @text-color;
          font-weight: @medium;
        }
      }
    }

    ul {
      padding-left: 16px;
      li {
        padding: 8px 0;
        padding-right: 16px;
        border-bottom: 1px solid @dividers-color;

        a {
          display: block;
          position: relative;

          span.material-icons {
            position: absolute;
            top: 50%;
            right: 0;
            margin-top: -10px;
            font-size: 20px;
          }
        }

        h3 {
          padding-bottom: 4px;
        }
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-customer-detail-reservations {
  .card {
    padding-top: 16px;
    padding-right: 0;
    padding-left: 0;

    .no-group-found {
      padding: 8px 16px;
    }

    h2 {
      padding: 0 16px;
      padding-bottom: 16px;
    }

    h2, h3, p {
      padding-right: 16px;
    }

    .toggle-outer {
      padding: 16px;

      .toggle {
        overflow: hidden;
        border-radius: @basic-border-radius;
        border: 1px solid @corporate-color;

        a {
          float: left;
          padding: 16px 8px;
          width: 50%;
          background-color: #ffffff;
          color: @secondary-text-color;
        }

        a.active {
          border: 1px solid @corporate-color;
          background-color: rgba(130, 197, 93, 0.2);
          color: @text-color;
          font-weight: @medium;
        }
      }
    }

    ul {
      padding-left: 16px;
      li {
        padding: 8px 0;
        padding-right: 16px;
        border-bottom: 1px solid @dividers-color;

        a {
          display: block;
          position: relative;

          span.material-icons {
            position: absolute;
            top: 50%;
            right: 0;
            margin-top: -10px;
            font-size: 20px;
          }
        }

        h3 {
          padding-bottom: 4px;
        }
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-customer-detail-statistics.card {
  padding: 0;

  .complete-amount {
    padding: 16px;
  }

  .detailed-stats {
    overflow: hidden;

    .detail-section {
      float: left;
      border-top: 1px solid @dividers-color;
      padding: 16px;
      width: 50%;
    }

    .detail-section:nth-child(even) {
      border-left: 1px solid @dividers-color;
    }
  }
}

.elem-frontend-cms-customer-edit-detail {

  .cus-company-name {
    overflow: hidden;
    margin-bottom: 8px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    .elem-frontend-cms-elements-form-input {
      margin-top: 0;
    }
  }

  .cus-company-name.active-area {
    max-height: 500px;
  }

  p.caption {
    padding-top: 8px;
  }

  .already-exists {
    display: none;
    margin-top: 4px;
    margin-bottom: 8px;
  }

  .already-exists.exists {
    display: block;

    span {
      color: @error-color;
    }

    a {
      color: @corporate-color;
    }
  }
}

.elem-frontend-cms-customer-edit-tax_account_number {


}

.elem-frontend-cms-customer-edit-suggestion-city.card {
  position: absolute;
  top: 50px;
  left: 0;
  margin: 0;
  border-radius: 0;
  padding: 0 16px;
  padding-right: 0;
  width: 100%;
  z-index: 20;

  ul {
    li {
      cursor: pointer;
      padding: 8px 16px;
      border-bottom: 1px solid @dividers-color;
    }

    li:hover, li:focus {
      background-color: @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-customer-edit-suggestion-email.card {
  position: absolute;
  top: 50px;
  left: 0;
  margin: 0;
  border-radius: 0;
  padding: 0 16px;
  padding-right: 0;
  width: 100%;
  z-index: 20;

  ul {
    li {
      cursor: pointer;
      padding: 8px 16px;
      border-bottom: 1px solid @dividers-color;
    }

    li:hover, li:focus {
      background-color: @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-customer-edit-suggestion-firstname.card {
  position: absolute;
  top: 50px;
  left: 0;
  margin: 0;
  border-radius: 0;
  padding: 0 16px;
  padding-right: 0;
  width: 100%;
  z-index: 20;

  ul {
    li {
      cursor: pointer;
      padding: 8px 16px;
      border-bottom: 1px solid @dividers-color;
    }

    li:hover, li:focus {
      background-color: @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-customer-edit-suggestion-surname.card {
  position: absolute;
  top: 50px;
  left: 0;
  margin: 0;
  border-radius: 0;
  padding: 0 16px;
  padding-right: 0;
  width: 100%;
  z-index: 20;

  ul {
    li {
      padding: 8px 16px;
      border-bottom: 1px solid @dividers-color;
      cursor: pointer;
    }

    li:hover, li:focus {
      background-color: @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-customer-elements-menu {
  position: relative;

  .card {
    position: fixed;
    z-index: 50;
    bottom: 0;
    left: -300px;
    margin: 0;
    border-radius: 0;
    padding: 0;
    height: 100%;
    width: 300px;
    background-color: @dark-corporate-color;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;

    .action-list {
      padding-bottom: 110px;
      height: 100%;
      width: 300px;
      background-color: @dark-corporate-color;

      ul {
        overflow-y: auto;
        height: 100%;
        padding-left: 24px;

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .action-list.show-list {
      height: 100%;
      width: 300px;
    }
  }

  .card.main-nav-active {
    left: 0;
    width: 300px;
  }

  @media @xs {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 30%;
    }
  }

  @media @sm {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 30%;
    }
  }

  @media @md {

  }
}


.elem-frontend-cms-customer-overview-customer_list {
  .add-customer-card {
    display: block;
    padding: 24px 16px;

    span.material-icons {
      display: inline-block;
      padding-bottom: 12px;
      color: @corporate-color;
      font-size: 54px;
    }

    color: @corporate-color;
  }

  .action-area.first {
    padding-top: 16px;
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding: 3px 16px;
      vertical-align: bottom;
    }

    .elem-frontend-cms-elements-form-checkbox {
      display: inline-block !important;
      vertical-align: middle !important;
    }
  }

  .action-area.first {
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding-top: 7px;
      padding-right: 8px;
      vertical-align: middle;
    }
  }
}

.elem-frontend-cms-customer-overview-google_people {

  div.has-error {
    .title {
      padding-top: 8px;
      padding-bottom: 16px;
      color: @error-color;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-customer-overview-customer_list-customer {
  position: relative;
  padding: 0 !important;

  .action-area {
    display: inline-block;
    position: absolute;
    top: 8px;
    right: 0;
  }

  .blocked-customer {
    border: 1px solid @error-color;
    padding: 2px;
    color: @error-color;
  }

  .pill-list {
    overflow: hidden;
    display: block;
    padding: 4px 0;

    .pill {
      float: left;
      margin-right: 8px;
      border-radius: 50px;
      padding: 4px 10px;
      background-color: @corporate-color;
      color: #FFFFFF;
    }

    .pill:last-child {
      margin-right: 0;
    }

    .pill.syf {
      background-color: #74B49B;
    }

    .pill.canceled {
      background-color: @error-color;
    }
  }

  .collapsible-head {
    padding: 8px 16px;
    padding-bottom: 16px;
  }

  .customer-name {
    display: block;

    h2 {
      padding-right: 48px;
    }

    .customer_id {
      padding-top: 4px;
    }
  }

  .address {
    padding-bottom: 8px;
  }

  .this-action-icons {
    overflow: hidden;
    padding-top: 16px;

    .icon-button {
      float: left;
      display: inline-block;
      padding: 8px 13px;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }

    .icon-button:first-child {
      padding-left: 0;
    }

    .icon-button:last-child {
      padding-right: 0;
    }

    .icon-button.right-align {
      float: right;
    }
  }

  ul {
    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 24px;
      padding-left: 40px;

      span.material-icons {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 48px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .collabsable-area {
    overflow: hidden;
    border-bottom: 1px solid @dividers-color;
    max-height: 1000px;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    .collabsable-area-inner {
      padding: 8px 16px;
      padding-top: 0;
    }
  }

  .collabsable-area.is-closed {
    max-height: 0;
  }

  .expand-toggle {
    display: block;
    padding: 8px 16px;
    cursor: pointer;
  }

  .expand-toggle.open-toggle {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  .no-real-customer {
    padding-bottom: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-customer-popups-email_error {
  .hidden-area {
    display: none;
  }

  .hidden-area.show {
    display: block;
  }

  .popup-footer {
    overflow: hidden;
  }
}

.elem-frontend-cms-customer-popups-print_documents {
  .popup-footer {
    overflow: hidden;

    .btn-flat {
      display: block;
      width: 50%;
      float: left;
    }
  }
}

.elem-frontend-cms-customer-popups-email_error-content {

  .popup-head {
    padding-right: 0 !important;
    padding-bottom: 16px !important;
    padding-left: 0 !important;
  }

  .hidden-area {
    display: none;
  }

  .hidden-area.show {
    display: block;
  }

  .send-mail {
    padding-top: 8px;
  }

  .corporate-color {
    padding: 6px 0;
    padding-top: 12px;
    color: @corporate-color;
  }

  ul {
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 16px;

    li {
      padding: 2px 0;
      list-style: disc;
    }
  }

  .status-message {
    padding-top: 16px;
    padding-bottom: 16px;
  }

  .error-message {
    color: @error-color;
  }
}

.elem-frontend-cms-customer-popups-email_error-content.popup-content {
  padding-right: 16px !important;
}

.elem-frontend-cms-delivery-day_overview {
  padding-left: 0;
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  form {
    height: 100%;
  }

  .print-area {
    padding-bottom: 8px;

    a {
      span {
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
      }
    }
  }

  .print-area:last-child {
    padding-bottom: 0;
  }

  .filter {

    p {
      padding-bottom: 8px;
    }

    .delete-filter {
      padding-top: 8px;
    }
  }

  .payment-filter {
    strong:after {
      content: ", ";
    }

    strong:last-child:after {
      content: "";
    }
  }

  .action-area.first {
    padding-top: 16px;
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding: 3px 16px;
      vertical-align: bottom;
    }

    .elem-frontend-cms-elements-form-checkbox {
      display: inline-block !important;
      vertical-align: middle !important;
    }
  }

  .button-group {
    overflow: hidden;
    padding-top: 24px;

    .edit-button-area {
      a {
        display: inline-block;

        span {
          color: inherit;
          font-size: 20px;
          vertical-align: inherit;
        }
      }
    }
  }

  .checkbox-area {
    position: relative;
    margin-right: -16px;
    padding-bottom: 8px;

    .company_customer_id {
      position: absolute;
      top: 0;
      left: 0;
      padding: 8px 0;
    }
  }

  .no-reservations {
    padding-left: 16px;
  }

  ul {

    li {
      padding-left: 16px;

      h2 {
        padding-bottom: 8px;
      }

      .delivery-details {
        position: relative;
        padding-top: 8px;

        .reservations {
          padding-right: 140px;
        }

        .delivery_status {
          position: absolute;
          bottom: 0;
          right: 0;
          color: @primary-red-color;
        }

        .delivery_status.is_delivered {
          color: @corporate-color;
        }
      }
    }
  }
}

.elem-frontend-cms-delivery-day_overview.space_for_sidenav {
  padding-left: 350px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}

.elem-frontend-cms-delivery-detail {
  overflow: hidden;
  height: 100%;

  form {
    height: 100%;
  }

  .product-card {
    padding: 8px 0;
  }

  .product-title {
    padding: 8px 16px;
    padding-bottom: 16px;
  }

  .reservation-overview {
    padding: 16px 0;
  }
}

.elem-frontend-cms-delivery-overview {

  .print-area {
    padding-bottom: 16px;

    a {

      span {
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
      }
    }
  }

  .error-message {
    padding-bottom: 8px;
    color: @error-color;
  }

  .toggle-outer {
    padding: 16px 8px;

    .toggle {
      overflow: hidden;
      border-radius: @basic-border-radius;
      border: 1px solid @corporate-color;

      a {
        float: left;
        padding: 16px 8px;
        width: 50%;
        background-color: #ffffff;
        color: @secondary-text-color;
      }

      a.active {
        border: 1px solid @corporate-color;
        background-color: rgba(130, 197, 93, 0.2);
        color: @text-color;
        font-weight: @medium;
      }
    }
  }

  .delivery-date-list {
    .delivery-day {
      overflow: hidden;
      padding: 8px;

      .day-description {
        float: left;
        width: 20%;

        p.body1 {

        }

        p.title {
          display: inline-block;
        }
      }

      .day-description.active-date {

        p.body1 {
          color: @dark-corporate-color !important;
          font-weight: @medium !important;
        }

        p.title {
          padding: 5px 0;
          border-radius: 100%;
          height: 34px;
          width: 34px;
          background-color: @dark-corporate-color;
          color: #ffffff !important;
          font-weight: @medium !important;
          vertical-align: top;
          line-height: 22px;
        }
      }

      .delivery-types {
        float: left;
        width: 80%;

        .card {
          margin: 8px 0;
          padding: 0;

          .delivery-card {
            display: block;
            padding: 12px 16px;
          }

          .today-no-delivery {
            padding-bottom: 16px;
          }

          .customer {
            padding-bottom: 4px;
          }

          .delivered {
            padding-top: 8px;
          }
        }

        .card:first-child {
          margin-top: 0;
        }

        .card:last-child {
          margin-bottom: 0;
        }
      }
    }
  }
}

.elem-frontend-cms-delivery-add-add_reservation {
  height: 100%;

  .reservation_count {
    padding-top: 16px;
    padding-bottom: 8px;
  }

  .action-area.first {
    padding-top: 16px;
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding: 3px 16px;
      vertical-align: bottom;
    }

    .elem-frontend-cms-elements-form-checkbox {
      display: inline-block;
      vertical-align: middle;
    }
  }
}

.elem-frontend-cms-delivery-add-edit_template {
  height: 100%;

  .elem-frontend-cms-elements-form-radio:last-child {
    padding-bottom: 0;
  }
}

.elem-frontend-cms-delivery-add-filter {
  height: 100%;

  .hiding-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .hiding-area.active-area {
    max-height: 20000px;
  }

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-delivery-add-groups {
  height: 100%;

  .elem-frontend-cms-elements-form-radio:last-child {
    padding-bottom: 0;
  }
}

.elem-frontend-cms-delivery-add-prepare_group {
  height: 100%;

  .text-description-text {
    padding-top: 8px;
  }
}

.elem-frontend-cms-delivery-add-ready {
  height: 100%;

  .ct-action {
    padding: 8px 0;
  }

  .print-area {
    padding-bottom: 16px;

    a {

      span {
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
      }
    }
  }
}

.elem-frontend-cms-delivery-add-send_email {
  height: 100%;

  .elem-frontend-cms-elements-form-radio:last-child {
    padding-bottom: 0;
  }

  .ct-action {
    padding-bottom: 8px;
  }
}

.elem-frontend-cms-delivery-add-customer-customer_list-item.card {
  padding: 0;

  .customer_id {
    padding-top: 10px;
  }

  .customer-detail-inner {
    overflow: hidden;
    border-bottom: 1px solid @dividers-color;
    padding-bottom: 8px;

  }

  .has-error {
    color: @error-color;
  }

  .charge-description, .reservation-detail, .customer-details {
    float: left;
    display: block;
    padding: 6px 0;
    width: 80%;
  }

  .customer-details {
    padding-left: 16px;

    h2 {
      padding-bottom: 4px;
    }
  }

  .action-area {
    float: left;
    display: block;
    width: 20%;

    label {
      text-align: right;
    }
  }

  .customer-checkbox {
    padding-top: 8px;
  }

  li {
    padding: 0;

    .card-head {
      overflow: hidden;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 16px;
      padding-right: 0;
    }

    .charge-detail {
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      padding-left: 16px;

      h4 {
        padding-top: 4px;
        padding-bottom: 8px;
      }

      .charge-head {
        overflow: hidden;
      }

      ol {
        li {
          border-bottom: 1px solid @dividers-color;
          padding: 4px 0;
          padding-right: 16px;
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .expand-toggle {
      display: block;
      padding: 8px 16px;
      cursor: pointer;
    }
  }

  ol {
    li:first-child {
      margin-top: 0;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-delivery-add-customer-customer_list-item-reservation {
  .card-head {
    .elem-frontend-cms-elements-form-checkbox {
      padding-top: 4px;
    }
  }

  .wishes {
    padding-top: 8px;
  }

  div.reservation-card.card-head {
    border-bottom: none;
  }

  .deliverytype {
    padding-top: 8px;
  }

  .charge-detail-outer {
    overflow: hidden;
    border-bottom: 1px solid @dividers-color;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .charge-detail-outer.active-list {
    max-height: 1000px;
  }

  .expand-toggle {

  }

  .expand-toggle.open-toggle {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
  }
}

.elem-frontend-cms-delivery-add-customer-customer_list-item-reservation-charge.charge-detail {
  margin-left: 16px !important;
  border-top: 1px solid @dividers-color;
  border-bottom: none !important;
  padding-left: 0 !important;

  ol {
    li {
      border-bottom: none !important;
    }
  }
}

.elem-frontend-cms-delivery-day_overview-confirmation {
  .card {
    border-radius: 0 !important;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-bottom: 16px;
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  #cancel {
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-delivery-day_overview-confirmation.active-popup {
  display: block;
}

.elem-frontend-cms-delivery-day_overview-customer.card {
  padding: 8px 0;

  .detail-area {
    padding: 8px 16px;
  }

  .action-area {
    border-top: 1px solid @dividers-color;
    padding: 8px 0;
    padding-bottom: 0;
  }

  ul.task-list {
    overflow: hidden;
    padding-top: 8px;
    max-height: 48px;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    li.task {
      position: relative;
      padding: 8px 24px;
      padding-left: 36px;

      span {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -14px;
        color: @progress-color;
        font-size: 28px;
      }

      span.is_finished {
        color: @dark-corporate-color;
      }

      span.has-error {
        color: @error-color;
      }
    }
  }

  .new-appointment-inquery.has-error {
    padding: 8px 0;
    color: @error-color;
  }

  ul.task-list.active-area {
    max-height: 500px;
  }

  .open-toggle {
    padding: 8px 16px;
    cursor: pointer;

    span {
      vertical-align: middle;
    }
  }

  .open-toggle.turn-around {
    span {
      -webkit-transform: rotate(180deg);
      -moz-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
      -o-transform: rotate(180deg);
      transform: rotate(180deg);
    }
  }
}



.elem-frontend-cms-delivery-day_overview-filter {

  .hiding-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .hiding-area.active-area {
    max-height: 5000px;
  }

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-delivery-day_overview-order {
  padding-left: 0;
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  .sort-list-card {
    padding: 8px 0;
  }

  ul {
    padding-left: 16px;

    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  ul {
    li {
      position: relative;
      padding-right: 40px;

      .edit-article {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -22px;
        padding: 8px 0;
        padding-left: 16px;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-delivery-day_overview-order.space_for_sidenav {
  padding-left: 350px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}

.elem-frontend-cms-delivery-day_overview-suchen {

  .hiding-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .hiding-area.active-area {
    max-height: 5000px;
  }

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-delivery-day_overview-order-item {
  position: relative;
  cursor: grab;

  p.body1 {
    padding-top: 4px;
  }

  p.radio {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -18px;
    padding-bottom: 14px;

    label {
      display: block;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      height: auto;

      span {
        height: auto !important;
      }

      [type="radio"] + span:before, [type="radio"] + span:after {
        top: 50% !important;
        margin-top: -8px;
      }
    }

    label:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-delivery-day_overview-order-item:active, .elem-frontend-cms-delivery-day_overview-order-item:focus {
  cursor: grabbing;
}

.elem-frontend-cms-delivery-day_overview-suchen-customer_list {

  .card {
    padding-right: 0;

    ul {
      li {
        padding: 0;

        a {
          display: block;
          position: relative;
          padding: 12px 0;
          padding-right: 42px;
          -webkit-transition: background-color 0.3s;
          -moz-transition: background-color 0.3s;
          -ms-transition: background-color 0.3s;
          -o-transition: background-color 0.3s;
          transition: background-color 0.3s;

          .material-icons {
            position: absolute;
            top: 50%;
            right: 10px;
            margin-top: -12px;
          }
        }

        a:hover {
          background-color: rgba(0,0,0,0.1);
        }
      }
    }
  }
}

.elem-frontend-cms-delivery-detail-article_list {

  h3 {
    padding: 8px 16px;
    background-color: @secondary-text-color;
    color: #ffffff;
  }

  span {
    float: left;
    width: 65%;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    font-family: inherit;
  }

  span.price-col {
    width: 35%;
  }

  ul {
    padding: 8px 0;
    padding-left: 16px;

    li {
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      padding-right: 16px;

      h4 {
        overflow: hidden;
        padding-bottom: 8px;
      }

      .article {
        overflow: hidden;
        padding: 4px 0;

        .body1 {
          .full-width {
            width: 100%;
          }
        }
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .complete-price {
    overflow: hidden;
    padding: 16px;
    padding-top: 8px;
  }

  .no-article-area {
    padding: 16px;
  }
}

.elem-frontend-cms-delivery-detail-invoice.invoice-card {
  padding-top: 16px;
  padding-right: 0;

  h2 {
    padding-bottom: 16px;
  }

  h2, p {
    padding-right: 16px;
  }

  .get-invoice-area {
    padding-top: 8px;

    span {
      display: inline-block;
      padding: 8px;
    }
  }

  .invoice-list {
    .invoice-item {
      position: relative;
      padding: 8px 0;
      padding-right: 90px;

      .this-action-icons {
        overflow: hidden;
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -22px;
        padding-right: 8px;

        .icon-button {
          float: left;
          display: inline-block;
          padding: 8px 6px;

          span {
            font-size: 28px;
            color: @dark-corporate-color;
          }
        }
      }
    }
  }
}

.elem-frontend-cms-delivery-detail-payment.card {
  padding: 0;

  .payment-head {
    padding: 16px;
    padding-bottom: 0;
  }

  ul {

    li.payment-item {
      position: relative;
      padding-right: 140px;
      padding-bottom: 8px;

      .payment-amount {
        position: absolute;
        top: 50%;
        right: 48px;
        margin-top: -10px;
      }

      .edit-payment {
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -12px;

        span {
          font-size: 24px;
          color: @corporate-color;
          cursor: pointer;
        }
      }
    }

    li.payment-item:last-child {
      padding-bottom: 0;
    }
  }

  .payment-list {
    padding: 16px;

  }

  .payment-balance {
    border-top: 1px solid @dividers-color;
    padding: 16px;
    padding-right: 0;
    padding-bottom: 8px;

    ul {
      padding-right: 16px;
    }

    .add-payment {
      padding-top: 16px;
    }
  }
}

.elem-frontend-cms-delivery-detail-reservation {

}

.elem-frontend-cms-delivery-detail-status.status-card {
  padding-top: 16px;

  h2 {
    padding-bottom: 16px;
  }

  .check-area {
    padding-bottom: 16px;
  }

  .check-area:last-child {
    padding-bottom: 8px;
  }

  .new-appointment-inquery.has-error {
    overflow: hidden;
    padding: 0;
    max-height: 0;
    color: @error-color;
    -webkit-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -moz-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -ms-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -o-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
  }

  .new-appointment-inquery.has-error.is-active {
    padding: 8px 0;
    max-height: 500px;
  }
}

.elem-frontend-cms-delivery-detail-wishes.wish-card {
  padding: 16px !important;

  h2 {
    padding-bottom: 16px;
  }

  .wish-detail {
    padding: 16px 0;
    padding-top: 0;

    .no-date {
      padding-bottom: 4px;
    }
  }

  .wish-detail:last-child {
    padding-bottom: 0;
  }
}

.elem-frontend-cms-delivery-detail-invoice-button {

  .disabled-button {
    display: inline-block;
    padding: 8px 16px !important;
  }
}

.elem-frontend-cms-delivery-detail-invoice-confirmation {
  .card {
    border-radius: 0 !important;
    padding: 8px 0;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-right: 16px;
      padding-bottom: 16px;
      padding-left: 16px;
    }

    .popup-body {
      padding: 0 16px;

      .check-form {
        padding: 8px 0;
      }
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  .first-check {
    display: none;
  }

  .first-check.active-form-element {
    display: block;
  }

  .second-check {
    display: none;
  }

  .second-check.active-box {
    display: block;
  }

  #cancel {
    float: left;
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-delivery-detail-invoice-confirmation.active-popup {
  display: block;
}

.elem-frontend-cms-delivery-detail-payment-popup {
  .card {
    border-radius: 0 !important;
    padding: 8px 0;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-right: 16px;
      padding-bottom: 16px;
      padding-left: 16px;
    }

    .popup-body {
      padding: 0 16px;

      .toggle-outer {
        padding-bottom: 8px;

        div {
          height: 50px;

          label {
            padding-top: 6px;
            padding-bottom: 6px;
          }
        }
      }

      .check-form {
        padding: 8px 0;
      }

      label {
        border-bottom: none;
      }

      .elem-frontend-cms-elements-form-radio {
        padding-bottom: 0;
      }

      .decision-area {
        padding-bottom: 16px;
      }
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  .check-form {
    display: none;
  }

  .check-form.active-form-element {
    display: block;
  }

  #cancel {
    float: left;
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-delivery-detail-payment-popup.active-popup {
  display: block;
}

.elem-frontend-cms-delivery-detail-reservation-bought_list {

  .card {
    padding-right: 0;
  }

  ul {
    li:last-child {
      border-bottom: none;
    }
  }

  .complete-price {
    position: relative;
    padding: 16px 16px;
    padding-left: 0;

    .price {
      position: absolute;
      top: 16px;
      right: 16px;
    }
  }

  .delivery-date {
    padding: 16px 0;
    padding-right: 16px;

    .body1 {
      padding-bottom: 8px;
      color: #1D3C1B;
    }

    .no-delivery {
      color: @error-color;
    }

    .inactive-btn {
      color: @text-color !important;
      background-color: @background-color;
    }
  }

  .not-delivered {
    color: @error-color;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-delivery-elements-confirmation {
  .card {
    border-radius: 0 !important;
    padding: 8px 0;
    width: 328px !important;

    .popup-head {
      padding: 8px 16px;
      padding-bottom: 16px;
    }

    .popup-body {
      padding: 0 16px;
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  .check-area {
    display: none;
    padding: 8px 0;
  }

  .check-area.show-area {
    display: block;
  }

  .first_confirm_title {
    display: none;
    padding-bottom: 8px;
  }

  .first_confirm_title.show-area {
    display: block;
  }

  .second-check {
    display: none;
  }

  .second-check.active-box {
    display: block;
  }

  #first_confirmation_description {
    span {
      display: block;
      padding-top: 8px;
      font-size: inherit;
      font-weight: inherit;
      font-family: inherit;
      color: inherit;
    }
  }

  #confirmation_description {
    display: none;
  }

  #confirmation_description.show-area {
    display: block;
  }

  #confirmation {
    display: none;
  }

  #confirmation.show-area {
    display: inline-block;
  }

  #cancel {
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-delivery-elements-confirmation.active-popup {
  display: block;
}

.elem-frontend-cms-delivery-elements-delivery_menu {
  position: relative;

  .card {
    position: fixed;
    z-index: 9;
    bottom: 0;
    left: -350px;
    margin: 0;
    border-radius: 0;
    padding: 0;
    height: 100%;
    width: 350px;
    background-color: @dark-corporate-color;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;

    .action-list {
      padding-bottom: 110px;
      height: 100%;
      width: 350px;
      background-color: @dark-corporate-color;

      ul {
        overflow-y: auto;
        height: 100%;
        padding-left: 24px;

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .action-list.show-list {
      height: 100%;
      width: 350px;
    }
  }

  .card.main-nav-active {
    left: 0;
    width: 350px;
  }

  @media @xs {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @sm {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @md {

  }
}


.elem-frontend-cms-delivery-elements-payment_confirmation {
  .card {
    border-radius: 0 !important;
    padding: 8px 0;
    width: 328px !important;

    .popup-head {
      padding: 8px 16px;
      padding-bottom: 16px;
    }

    .popup-body {
      padding: 0 16px;
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  .check-area {
    display: none;
    padding: 8px 0;
  }

  .check-area.show-area {
    display: block;
  }

  .first_confirm_title {
    display: none;
    padding-bottom: 8px;
  }

  .first_confirm_title.show-area {
    display: block;
  }

  #confirmation_description {
    span {
      display: block;
      padding-top: 8px;
      font-size: inherit;
      font-weight: inherit;
      font-family: inherit;
      color: inherit;
    }

    strong {
      color: @text-color;
    }
  }

  #confirmation_payment {
    display: none;
  }

  #confirmation_payment.show-area {
    display: inline-block;
  }

  #cancel {
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-delivery-elements-payment_confirmation.active-popup {
  display: block;
}

.elem-frontend-cms-delivery-elements-payment_popup {
  .card {
    border-radius: 0 !important;
    padding: 8px 0;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-right: 16px;
      padding-bottom: 16px;
      padding-left: 16px;
    }

    .popup-body {
      padding: 0 16px;

      .toggle-outer {
        padding-bottom: 8px;

        div {
          height: 50px;

          label {
            padding-top: 6px;
            padding-bottom: 6px;
          }
        }
      }

      .check-form {
        padding: 8px 0;
      }

      label {
        border-bottom: none;
      }

      .elem-frontend-cms-elements-form-radio {
        padding-bottom: 0;
      }

      .decision-area {
        padding-bottom: 16px;
      }
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  .check-form {
    display: none;
  }

  .check-form.active-form-element {
    display: block;
  }

  #cancel {
    float: left;
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-delivery-elements-payment_popup.active-popup {
  display: block;
}

.elem-frontend-cms-delivery-elements-delivery_menu-button {
  border-bottom: 1px solid #ffffff;
  padding-right: 24px;
  padding-left: 0 !important;

  button {
    display: block;
    border: none;
    padding: 16px 0;
    width: 100%;
    background-color: transparent;
    color: #ffffff;
    text-align: left;
    cursor: pointer;

    span {
      display: inline-block;
      color: #ffffff;
      vertical-align: middle;
      cursor: pointer;
    }

    span.material-icons {
      padding-right: 16px;
    }
  }
}

.elem-frontend-cms-delivery-elements-delivery_menu-link {
  border-bottom: 1px solid #ffffff;
  padding-right: 24px;
  padding-left: 0 !important;

  a {
    display: block;
    border: none;
    padding: 16px 0;
    width: 100%;
    background-color: transparent;
    color: #ffffff;
    text-align: left;
    cursor: pointer;

    span {
      display: inline-block;
      color: #ffffff;
      vertical-align: middle;
      cursor: pointer;
    }

    span.material-icons {
      padding-right: 16px;
    }
  }
}

.elem-frontend-cms-delivery-elements-delivery_menu-menu.menu-area {
  position: relative;
  padding: 0 24px;
  height: auto;
  width: 100%;
  cursor: default;

  p {
    padding: 14px 0;
    color: #ffffff;
  }

  span.material-icons.close {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    padding: 0 16px;
    font-size: 28px;
    color: rgba(255, 255, 255, 0.72) !important;
    line-height: 54px;
    vertical-align: center;
    -webkit-transition: transform 0.3s;
    -moz-transition: transform 0.3s;
    -ms-transition: transform 0.3s;
    -o-transition: transform 0.3s;
    transition: transform 0.3s;
  }

  span.material-icons.close.menu-is-open {
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  @media @xs {
    span.material-icons.close {
      display: inline-block;
    }
  }

  @media @sm {
    span.material-icons.close {
      display: inline-block;
    }
  }
}

.elem-frontend-cms-delivery-pack-customer {
  height: 100%;

  .action-area.first {
    padding-top: 16px;
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding: 3px 16px;
      vertical-align: bottom;
    }

    .elem-frontend-cms-elements-form-checkbox {
      display: inline-block !important;
      vertical-align: middle !important;
    }
  }

  .description-head.headroom--pinned {
    transform: translateY(0);
  }

  .description-head.headroom--unpinned {
    transform: translateY(0);
  }

  .description-head.headroom--top {
    transform: translateY(-100%);
  }

  .cancel-process {
    padding-top: 16px;
  }

  .delivery-details {
    padding-top: 8px;

    .delivery-title {
      padding-bottom: 8px;
    }
  }

  .delivery-counter {
    padding-top: 16px;
  }

  .info-button {
    display: none !important;
  }

  .invoice-is-already-printed {
    padding: 16px 0;
    color: @error-color;
  }

  .card {
    padding: 0;

    ul.article-list {
      padding-left: 16px;

      li.article {
        border-bottom: 1px solid @dividers-color;
        padding: 16px 0;
      }

      li.article:last-child {
        border-bottom: none;
      }
    }
  }

  .description-head {
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    border-radius: 0;
    padding: 0;
    padding-bottom: 16px;
    will-change: transform;
    transition: transform 200ms linear;
    transform: translateY(-100%);
    width: 100%;

    h2 {
      padding: 16px 24px;
      padding-bottom: 0;
    }
  }
}

.elem-frontend-cms-delivery-pack-customer-article_list-article_input {
  padding: 8px 0;

  .article-head-outer {
    position: relative;

    .delete-article {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -12px;
      font-size: 24px;
      color: @secondary-text-color;
      cursor: pointer;
    }
  }

  .article-head {
    overflow: hidden;
    padding-left: 40px;

    .article-head-big {
      float: left;
      width: 80%;
    }

    .article-head-check {
      float: left;
      width: 20%;

      .elem-frontend-cms-elements-form-checkbox {
        padding-top: 0;
      }
    }
  }

  .article-head.deletable-item {
    padding-left: 40px;
  }

  .collapsible-input {
    overflow: hidden;
    padding-right: 16px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .end-weight {
    padding-top: 16px;
  }

  .collapsible-input.is-open {
    max-height: 2000px;
  }
}

.elem-frontend-cms-elements-bottom_back_filter_nav {
  position: absolute;
  z-index: 10;
  bottom: 0;
  left: 0;
  width: 100%;

  .open_main_nav {
    display: none !important;
  }

  .main-nav-bar {
    overflow: hidden;
    position: relative;
    height: 54px;
    background-color: @dark-corporate-color;

    .main-nav {
      span {
        display: inline-block;
        padding: 12px 16px;
        font-size: 28px;
        color: #ffffff;
        cursor: pointer;
      }
    }

    .main-nav-circle {
      display: block;
      position: absolute;
      top: -38px;
      right: 8px;
      border-radius: 100%;
      height: 76px;
      width: 76px;
      background-color: @background-color;
    }
  }

  .main-fab {
    overflow: hidden;
    display: block;
    position: absolute;
    top: -30px;
    right: 16px;
    border-radius: 100%;
    height: 60px;
    width: 60px;
    background-color: #82C55D;
    cursor: pointer;
    -webkit-transition: height 0.3s, width 0.3s;
    -moz-transition: height 0.3s, width 0.3s;
    -ms-transition: height 0.3s, width 0.3s;
    -o-transition: height 0.3s, width 0.3s;
    transition: height 0.3s, width 0.3s;

    span {
      vertical-align: center;
      line-height: 60px;
      font-size: 28px;
    }
  }

  .main-fab.hide-fab {
    height: 0;
    width: 0;
  }

  @media @xs {
    .open_main_nav {
      display: inline-block !important;
    }
  }

  @media @sm {
    .open_main_nav {
      display: inline-block !important;
    }
  }

  @media @md {

  }
}

.elem-frontend-cms-elements-bottom_back_nav {
  position: absolute;
  z-index: 10;
  bottom: 0;
  left: 0;
  padding-left: 66px;
  height: 54px;
  width: 100%;
  background-color: @dark-corporate-color;

  a {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    padding: 0 16px;
    color: #ffffff;

    span {
      font-size: 32px;
      line-height: 54px;
      vertical-align: center;
      color: #ffffff;
    }
  }

  .subhead {
    padding: 16px 0;
    color: #ffffff;
  }

  button.go-button {

  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-bottom_back_search_nav {
  overflow: hidden;
  position: absolute;
  z-index: 10;
  bottom: 0;
  left: 0;
  height: 54px;
  width: 100%;

  open-search-button {
    border: none;
    line-height: inherit;
  }

  a, .open-search-button {
    float: left;
    display: block;
    padding: 16px 24px;
    width: 50%;
    background-color: @dark-corporate-color;
    color: #ffffff;
    cursor: pointer;

    span {
      color: inherit;
    }
  }

  a.back-button {
    border-right: 1px solid @white-dividers-color;
  }

  button.go-button {

  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-bottom_link_nav {
  overflow: hidden;
  position: absolute;
  z-index: 10;
  bottom: 0;
  left: 0;
  height: 54px;
  width: 100%;

  button {
    border: none;
    line-height: inherit;
  }

  a, button {
    float: left;
    display: block;
    padding: 16px 24px;
    width: 50%;
    background-color: @dark-corporate-color;
    color: #ffffff;
  }

  a.back-button {
    border-right: 1px solid @white-dividers-color;
  }

  button.go-button {

  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-bottom_main_nav {
  position: absolute;
  z-index: 10;
  bottom: 0;
  left: 0;
  width: 100%;

  .open_main_nav {
    display: none !important;
  }

  .main-nav-bar {
    overflow: hidden;
    position: relative;
    height: 54px;
    background-color: @dark-corporate-color;

    .main-nav {
      span {
        display: inline-block;
        padding: 12px 16px;
        font-size: 28px;
        color: #ffffff;
        cursor: pointer;
      }
    }

    .main-nav-circle {
      display: block;
      position: absolute;
      top: -38px;
      right: 8px;
      border-radius: 0 0 100% 100%;
      height: 76px;
      width: 76px;
      background-color: @background-color;
      -webkit-transition: height 0.3s, width 0.3s;
      -moz-transition: height 0.3s, width 0.3s;
      -ms-transition: height 0.3s, width 0.3s;
      -o-transition: height 0.3s, width 0.3s;
      transition: height 0.3s, width 0.3s;
    }

    .main-nav-circle.hide-fab {
      height: 0;
      width: 0;
    }
  }

  .main-fab {
    overflow: hidden;
    display: block;
    position: absolute;
    top: -30px;
    right: 16px;
    border-radius: 100%;
    height: 60px;
    width: 60px;
    background-color: #82C55D;
    cursor: pointer;
    -webkit-transition: height 0.3s, width 0.3s;
    -moz-transition: height 0.3s, width 0.3s;
    -ms-transition: height 0.3s, width 0.3s;
    -o-transition: height 0.3s, width 0.3s;
    transition: height 0.3s, width 0.3s;

    span {
      vertical-align: center;
      line-height: 60px;
      font-size: 28px;
    }
  }

  .main-fab.hide-fab {
    height: 0;
    width: 0;
  }

  @media @xs {
    .open_main_nav {
      display: inline-block !important;
    }
  }

  @media @sm {
    .open_main_nav {
      display: inline-block !important;
    }
  }

  @media @md {

  }
}

.elem-frontend-cms-elements-bottom_nav {
  overflow: hidden;
  position: absolute;
  z-index: 10;
  bottom: 0;
  left: 0;
  height: 54px;
  width: 100%;

  a {
    float: left;
    display: block;
    padding: 16px 24px;
    width: 50%;
    background-color: @dark-corporate-color;
    color: #ffffff;
  }

  a.back-button {
    border-right: 1px solid @white-dividers-color;
  }

  a.go-button {

  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-bottom_submit_nav {
  overflow: hidden;
  position: absolute;
  z-index: 10;
  bottom: 0;
  left: 0;
  height: 54px;
  width: 100%;
  background-color: @dark-corporate-color;

  button {
    border: none;
    line-height: inherit;
  }

  a, button {
    float: right;
    display: block;
    padding: 16px 24px;
    width: 50%;
    background-color: @dark-corporate-color;
    color: #ffffff;
  }

  a.back-button {
    border-right: 1px solid @white-dividers-color;
  }

  button.go-button {

  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-edit_button {
  padding-top: 8px;

  .edit-button {
    padding: 8px;

    span {
      color: @dark-corporate-color;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-elements_per_page {
  .card-limit {
    display: block;
    padding: 8px 16px;
  }

  p {
    display: inline-block;
  }

  p.description {
    display: block;
  }

  a.chev-button, .inactive-pagination {
    display: block;
    border-right: 1px solid @dividers-color;

    .material-icons {
      padding: 4px 0;
      font-size: 28px;
    }
  }

  a.subhead {
    float: right;
    display: inline-block;
    padding: 0 8px;
  }

  a.subhead.inactive {
    color: @hint-text-color;
  }

  a.subhead.inactive:hover {
    color: @text-color;
  }

  a.chev-button:last-child, .inactive-pagination.last {
    float: right;
    border-right: none;
    border-left: 1px solid @dividers-color;
  }

  .inactive-pagination {
    span {
      color: @hint-text-color;
    }
  }
}



.elem-frontend-cms-elements-main_filter {
  .card {
    overflow: hidden;
    position: fixed;
    z-index: 40;
    bottom: 0;
    left: 0;
    margin: 0;
    padding: 0;
    height: 54px;
    width: 0;
    background-color: @dark-corporate-color;
    -webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    -ms-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;

    .search-area {
      position: relative;
      padding: 0 16px;
      padding-left: 60px;

      span.material-icons.search {
        position: absolute;
        top: 0;
        left: 0;
        padding: 0 16px;
        font-size: 28px;
        color: #ffffff;
        line-height: 54px;
        vertical-align: center;
      }

      span.material-icons.close {
        position: absolute;
        top: 0;
        right: 0;
        padding: 0 16px;
        font-size: 28px;
        color: #ffffff;
        line-height: 54px;
        vertical-align: center;
      }

      input {
        display: block;
        border: none;
        padding: 20px 0;
        outline: none;
        width: 100%;
        background-color: transparent;
        color: rgba(255, 255, 255, 0.72) !important;
      }

      ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #ffffff;
        opacity: 1; /* Firefox */
      }

      :-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: #ffffff;
      }

      ::-ms-input-placeholder { /* Microsoft Edge */
        color: #ffffff;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-main_filter {

  .clickable-layover.active-layover {
    display: block;
  }

  .card.main-nav-active {
    width: 100%;
  }
}



.elem-frontend-cms-elements-main_navigation {
  .clickable-layover {
    display: none;
    position: fixed;
    z-index: 35;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: auto;
    overflow-y: scroll;
  }

  .card {
    position: fixed;
    z-index: 40;
    bottom: 0;
    left: 0;
    margin: 0;
    padding: 0;
    height: 100%;
    width: 300px;
    border-radius: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    .nav-head {
      position: relative;
      padding: 8px 24px;
      padding-right: 62px;
      border-bottom: 1px solid @dividers-color;

      h2 {
        padding-top: 4px;
        padding-bottom: 8px;
      }

      .logout-button {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -20px;
        padding: 8px 24px;
      }
    }

    .nav-item-list {
      padding-bottom: 70px;
      height: 100%;

      ul {
        overflow-y: auto;
        height: 100%;
      }
    }
  }

  @media @xs {
    .clickable-layover {
      display: none;
      position: fixed;
      z-index: 35;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      overflow: auto;
      overflow-y: scroll;
    }

    .card {
      position: fixed;
      z-index: 40;
      bottom: 0;
      left: 0;
      margin: 0;
      padding: 0;
      height: auto;
      max-height: 0;
      width: 100%;

      .nav-head {
        position: relative;
        padding: 8px 24px;
        padding-right: 62px;
        border-bottom: 1px solid @dividers-color;

        h2 {
          padding-top: 4px;
          padding-bottom: 8px;
        }

        .logout-button {
          display: inline-block;
          position: absolute;
          top: 50%;
          right: 0;
          margin-top: -20px;
          padding: 8px 24px;
        }
      }

      .nav-item-list {
        padding-bottom: 70px;
        height: 100%;

        ul {
          overflow-y: auto;
          height: 100%;
        }
      }
    }
  }

  @media @sm {
    .clickable-layover {
      display: none;
      position: fixed;
      z-index: 35;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      overflow: auto;
      overflow-y: scroll;
    }

    .card {
      position: fixed;
      z-index: 40;
      bottom: 0;
      left: 0;
      margin: 0;
      padding: 0;
      height: auto;
      max-height: 0;
      width: 100%;

      .nav-head {
        position: relative;
        padding: 8px 24px;
        padding-right: 62px;
        border-bottom: 1px solid @dividers-color;

        h2 {
          padding-top: 4px;
          padding-bottom: 8px;
        }

        .logout-button {
          display: inline-block;
          position: absolute;
          top: 50%;
          right: 0;
          margin-top: -20px;
          padding: 8px 24px;
        }
      }
    }
  }

  @media @md {

  }
}

.elem-frontend-cms-elements-main_navigation {

  .clickable-layover.active-layover {
    display: block;
  }

  .card.main-nav-active {
    z-index: 41;
    height: 100%;
  }

  @media @xs {
    .clickable-layover.active-layover {
      display: block;
    }

    .card.main-nav-active {
      z-index: 41;
      height: 100%;
      max-height: 90%;
    }
  }

  @media @sm {
    .clickable-layover.active-layover {
      display: block;
    }

    .card.main-nav-active {
      z-index: 41;
      height: 100%;
      max-height: 90%;
    }
  }
}

.elem-frontend-cms-elements-main_navigation.hide-main-navigation {
  display: none;
}



.elem-frontend-cms-elements-main_search {
  .card {
    overflow: hidden;
    position: fixed;
    z-index: 15;
    bottom: 0;
    left: 0;
    margin: 0;
    border-radius: 0;
    padding: 0;
    padding-left: 300px;
    height: 54px;
    width: 0;
    background-color: @dark-corporate-color;
    -webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    -ms-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;

    .search-area {
      position: relative;
      padding: 0 60px;

      span.material-icons.search {
        position: absolute;
        top: 0;
        left: 0;
        padding: 0 16px;
        font-size: 28px;
        color: #ffffff;
        line-height: 54px;
        vertical-align: center;
      }

      span.material-icons.close {
        position: absolute;
        top: 0;
        right: 0;
        padding: 0 16px;
        font-size: 28px;
        color: rgba(255, 255, 255, 0.72) !important;
        line-height: 54px;
        vertical-align: center;
      }

      input {
        display: block;
        border: none;
        padding: 20px 0;
        outline: none;
        width: 100%;
        background-color: transparent;
        color: #ffffff !important;
      }

      ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #ffffff;
        opacity: 1; /* Firefox */
      }

      :-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: #ffffff;
      }

      ::-ms-input-placeholder { /* Microsoft Edge */
        color: #ffffff;
      }
    }
  }

  .card.fixfixed {
    position: absolute;
  }

  @media @xs {
    .card {
      overflow: hidden;
      position: fixed;
      z-index: 40;
      bottom: 0;
      left: 0;
      margin: 0;
      border-radius: 0;
      padding: 0;
      height: 54px;
      width: 0;
      background-color: @dark-corporate-color;
      -webkit-transition: width 0.3s;
      -moz-transition: width 0.3s;
      -ms-transition: width 0.3s;
      -o-transition: width 0.3s;
      transition: width 0.3s;

      .search-area {
        position: relative;
        padding: 0 60px;

        span.material-icons.search {
          position: absolute;
          top: 0;
          left: 0;
          padding: 0 16px;
          font-size: 28px;
          color: #ffffff;
          line-height: 54px;
          vertical-align: center;
        }

        span.material-icons.close {
          position: absolute;
          top: 0;
          right: 0;
          padding: 0 16px;
          font-size: 28px;
          color: rgba(255, 255, 255, 0.72) !important;
          line-height: 54px;
          vertical-align: center;
        }

        input {
          display: block;
          border: none;
          padding: 20px 0;
          outline: none;
          width: 100%;
          background-color: transparent;
          color: #ffffff !important;
        }

        ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
          color: #ffffff;
          opacity: 1; /* Firefox */
        }

        :-ms-input-placeholder { /* Internet Explorer 10-11 */
          color: #ffffff;
        }

        ::-ms-input-placeholder { /* Microsoft Edge */
          color: #ffffff;
        }
      }
    }
  }

  @media @sm {
    .card {
      overflow: hidden;
      position: fixed;
      z-index: 40;
      bottom: 0;
      left: 0;
      margin: 0;
      border-radius: 0;
      padding: 0;
      height: 54px;
      width: 0;
      background-color: @dark-corporate-color;
      -webkit-transition: width 0.3s;
      -moz-transition: width 0.3s;
      -ms-transition: width 0.3s;
      -o-transition: width 0.3s;
      transition: width 0.3s;

      .search-area {
        position: relative;
        padding: 0 60px;

        span.material-icons.search {
          position: absolute;
          top: 0;
          left: 0;
          padding: 0 16px;
          font-size: 28px;
          color: #ffffff;
          line-height: 54px;
          vertical-align: center;
        }

        span.material-icons.close {
          position: absolute;
          top: 0;
          right: 0;
          padding: 0 16px;
          font-size: 28px;
          color: rgba(255, 255, 255, 0.72) !important;
          line-height: 54px;
          vertical-align: center;
        }

        input {
          display: block;
          border: none;
          padding: 20px 0;
          outline: none;
          width: 100%;
          background-color: transparent;
          color: #ffffff !important;
        }

        ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
          color: #ffffff;
          opacity: 1; /* Firefox */
        }

        :-ms-input-placeholder { /* Internet Explorer 10-11 */
          color: #ffffff;
        }

        ::-ms-input-placeholder { /* Microsoft Edge */
          color: #ffffff;
        }
      }
    }
  }

  @media @md {

  }
}

.elem-frontend-cms-elements-main_search {

  .clickable-layover.active-layover {
    display: block;
  }

  .card.main-nav-active {
    width: 100%;
  }
}

.elem-frontend-cms-elements-main_search.no-main-navigation {

  .card {
    padding-left: 0;
  }
}



.elem-frontend-cms-elements-pagination {
  .card {
    display: block;
    padding: 0;
  }

  a.chev-button, .inactive-pagination {
    float: left;
    display: block;
    border-right: 1px solid @dividers-color;

    .material-icons {
      padding: 4px 0;
      font-size: 28px;
    }
  }

  a.subhead, span.subhead {
    display: inline-block;
    padding: 7px 8px;
  }

  a.subhead.inactive, span.subhead.inactive {
    color: @hint-text-color;
  }

  a.subhead.inactive:hover {
    color: @text-color;
  }

  a.chev-button:last-child, .inactive-pagination.last {
    float: right;
    border-right: none;
    border-left: 1px solid @dividers-color;
  }

  .inactive-pagination {
    span {
      color: @hint-text-color;
    }
  }
}



.elem-frontend-cms-elements-site_head {
  padding: 16px 24px;

  h1 {

  }

  p {
    line-height: 20px;
  }

  p.has_top-padding {
    padding-top: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-top_app_bar {
  .card {
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    border-radius: 0;
    padding: 0;
    width: 100%;
    background-color: @dark-corporate-color;
    will-change: transform;
    transition: transform 200ms linear;
    transform: translateY(-100%);

    p {
      padding: 16px 24px;
      color: #ffffff;
    }
  }

  .card.active_nav {
    transform: translateY(0%);
  }
}

.elem-frontend-cms-elements-card-footer {
  a {
    display: inline-block;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 8px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-card-head {
  padding-top: 8px;
  padding-bottom: 16px;
  background-color: transparent;

  p {
    padding-top: 8px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-form-checkbox {
  padding: 8px 0;

  span {
    height: auto !important;
    line-height: initial !important;
  }

  span.checkboxtitle {
    font-size: 14px !important;
  }

  span:before {
    top: 50% !important;
    margin-top: -8px !important;
  }

  span:after {
    top: 50% !important;
    margin-top: -10px !important;
  }
}

.elem-frontend-cms-elements-form-datepicker {
  margin: 8px 0;
  border-top-right-radius: @basic-border-radius;
  border-top-left-radius: @basic-border-radius;
  padding-top: 12px;
  background-color: #ECECEC;

  .input-field {
    margin: 0;
    background-color: #ECECEC;

    input {
      box-sizing: border-box !important;
      margin: 0 !important;
      padding: 0 16px;
    }

    label {
      top: -8px !important;
      left: 16px !important;
    }

    label.active {
      transform: translateY(0) scale(0.8) !important;
    }
  }

  .input-field > input[type]:-webkit-autofill:not(.browser-default):not([type="search"]) + label, .input-field > input[type=date]:not(.browser-default) + label, .input-field > input[type=time]:not(.browser-default) + label {
    transform: translateY(0) scale(0.8) !important;
  }
}

.elem-frontend-cms-elements-form-gender_toggle {
  overflow: hidden;
  margin: 8px 0;
  border: 1px solid @corporate-color;
  border-radius: @basic-border-radius;

  .gender-select {
    float: left;
    display: block;
    padding: 10px 8px;
    width: 50%;
    cursor: pointer;
    color: @secondary-text-color;

    input {
      display: none;
    }
  }

  .gender-select.active {
    background-color: rgba(130, 197, 93, 0.2);
    color: @text-color;
  }

  .gender-select:first-child {
    border-right: 1px solid @corporate-color;
  }
}

.elem-frontend-cms-elements-form-input {
  margin: 8px 0;
  border-top-right-radius: @basic-border-radius;
  border-top-left-radius: @basic-border-radius;
  padding-top: 12px;
  background-color: #ECECEC;

  .input-field {
    margin: 0;
    background-color: #ECECEC;

    input {
      box-sizing: border-box !important;
      margin: 0 !important;
      padding: 0 16px;
    }

    label {
      top: -8px !important;
      left: 16px !important;
    }

    label.active {
      transform: translateY(0) scale(0.8) !important;
    }

    label.invalid {
      color: @error-color !important;
    }
  }

  .input-field > input[type]:-webkit-autofill:not(.browser-default):not([type="search"]) + label, .input-field > input[type=date]:not(.browser-default) + label, .input-field > input[type=time]:not(.browser-default) + label {
    transform: translateY(0) scale(0.8) !important;
  }

  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  input[type=number] {
    -moz-appearance: textfield;
  }

  .input-field input[type=number].invalid {
    border-bottom: 1px solid @error-color;
    box-shadow: 0 1px 0 0 @error-color;
  }

  input[type=number]::-webkit-inner-spin-button,
  input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-form-input_text {
  margin: 8px 0;
  border-top-right-radius: @basic-border-radius;
  border-top-left-radius: @basic-border-radius;
  padding-top: 24px;
  background-color: #ECECEC;

  .input-field {
    margin: 0;
    background-color: #ECECEC;

    textarea {
      box-sizing: border-box !important;
      display: block;
      margin: 0 !important;
      padding: 0 16px;
      min-height: 160px !important;
    }

    label {
      top: -14px !important;
      left: 16px !important;
    }

    label.active {
      top: -18px !important;
      transform: translateY(0) scale(0.8) !important;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-form-limited_input {

  .elem-frontend-cms-elements-form-input_text {
    margin-bottom: 4px;
  }

  .text-counter-hint {
    padding-bottom: 8px;
    padding-left: 24px;

    span {
      color: inherit;
      font-weight: inherit;
      font-size: inherit;
      font-family: inherit;
    }

    span.error {
      color: @error-color;
    }
  }

  .text-counter-hint.error {
    color: @error-color;
  }
}

.elem-frontend-cms-elements-form-radio {
  padding-bottom: 14px;

  label {
    display: block;
    border-bottom: 1px solid @dividers-color;
    padding: 8px 0;
    height: auto;

    span {
      height: auto !important;
    }

    [type="radio"] + span:before, [type="radio"] + span:after {
      top: 50% !important;
      margin-top: -8px;
    }
  }

  label:last-child {
    border-bottom: none;
  }
}

.elem-frontend-cms-elements-form-select {
  margin: 8px 0;
  border-top-right-radius: @basic-border-radius;
  border-top-left-radius: @basic-border-radius;
  padding-top: 11px;
  background-color: #ECECEC;

  .input-field {
    display: block;
    margin: 0;
    border-bottom: 1px solid #9e9e9e;
    padding-right: 0;
    background-color: #ECECEC;

    input {
      box-sizing: border-box !important;
      margin: 0 !important;
      padding: 0 16px;
    }

    .label {
      color: @secondary-text-color;
      font-weight: 400;
      position: absolute;
      top: 0;
      left: 0;
      font-size: 1rem;
      cursor: text;
      -webkit-transition: color .2s ease-out, -webkit-transform .2s ease-out;
      transition: color .2s ease-out, -webkit-transform .2s ease-out;
      transition: transform .2s ease-out, color .2s ease-out;
      transition: transform .2s ease-out, color .2s ease-out, -webkit-transform .2s ease-out;
      -webkit-transform-origin: 0% 100%;
      transform-origin: 0% 100%;
      text-align: initial;
      -webkit-transform: translateY(12px);
      transform: translateY(12px);
    }

    .label {
      top: -12px !important;
      left: 16px !important;
      transform: translateY(0) scale(0.8) !important;
    }

    .label.active {
      transform: translateY(0) scale(0.8) !important;
    }
  }

  select {
    outline: none;
    border: none;
    padding: 0 16px;
    background-color: #ECECEC !important;
    font-size: 16px;
    -webkit-appearance: none;

    option {
      font-size: 14px;
      padding: 4px 0;
    }
  }

  select:active, select:focus, select:hover {
    outline: none;
    background-color: #ECECEC !important;
  }

  .input-field > input[type]:-webkit-autofill:not(.browser-default):not([type="search"]) + label, .input-field > input[type=date]:not(.browser-default) + label, .input-field > input[type=time]:not(.browser-default) + label {
    transform: translateY(0) scale(0.8) !important;
  }

  .material-icons {
    position: absolute;
    top: 50%;
    right: 8px;
    margin-top: -14px;
    font-size: 28px;
    pointer-events: none;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-form-select_multi {
  padding: 8px 0;

  .input-field {
    margin: 0;
    background-color: #ECECEC;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-form-timepicker.form-input-content {
  margin: 8px 0;
  border-top-right-radius: @basic-border-radius;
  border-top-left-radius: @basic-border-radius;
  padding-top: 12px;
  background-color: #ECECEC;

  .input-field {
    margin: 0;
    background-color: #ECECEC;

    input {
      box-sizing: border-box !important;
      margin: 0 !important;
      padding: 0 16px;
    }

    label {
      top: -8px !important;
      left: 16px !important;
    }

    label.active {
      transform: translateY(0) scale(0.8) !important;
    }
  }

  .input-field > input[type]:-webkit-autofill:not(.browser-default):not([type="search"]) + label, .input-field > input[type=date]:not(.browser-default) + label, .input-field > input[type=time]:not(.browser-default) + label {
    transform: translateY(0) scale(0.8) !important;
  }
}

.elem-frontend-cms-elements-form-toggle {
  overflow: hidden;
  margin: 8px 0;
  border: 1px solid @corporate-color;
  border-radius: @basic-border-radius;

  .toggle-select {
    float: left;
    display: block;
    padding: 10px 8px;
    width: 50%;
    cursor: pointer;
    color: @secondary-text-color;

    input {
      display: none;
    }
  }

  .toggle-select.active {
    background-color: rgba(130, 197, 93, 0.2);
    color: @text-color;
  }

  .toggle-select:first-child {
    border-right: 1px solid @corporate-color;
  }
}

.elem-frontend-cms-elements-main_navigation-button {
  position: relative;
  padding: 0 24px;
  padding-right: 0;

  .counter {
    display: block;
    position: absolute;
    top: 50%;
    right: 16px;
    margin-top: -14px;
    border-radius: 100%;
    padding: 5px 0;
    height: 28px;
    width: 28px;
    background-color: @error-color;
    color: #FFFFFF;
  }

  .nav-item {
    display: block;
    position: relative;
    border-bottom: 1px solid @dividers-color;
    padding: 16px 0;
    padding-left: 44px;

    .material-icons {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      line-height: 54px;
      width: 26px;
      color: @secondary-text-color;
      vertical-align: middle;
    }

    p {
      color: @secondary-text-color;
    }
  }

  .nav-item.active-navigation, .nav-item:hover {
    .material-icons {
      color: @corporate-color;
    }

    p {
      color: @corporate-color;
      font-weight: @medium;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-elements-main_navigation-button:last-child {
  .nav-item {
    border-bottom: none;
  }
}

.elem-frontend-cms-elements-smallstuff-preloader {
  position: absolute;
  top: -1px;
  right: -1px;
  height: 34px;
  width: 34px;

  .spinner-green-only {
    border-color: #FFFFFF !important;
  }
}

.elem-frontend-cms-evaluation-filter {

  .hiding-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .hiding-area.active-area {
    max-height: 5000px;
  }

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-evaluation-overview {

  .card {
    ul.sales-table {
      padding-top: 16px;

      li {
        overflow: hidden;
        padding: 6px 0;

        .half-column, .x-big-column, .big-column, .small-column, .medium-column, .x-small-column {
          float: left;
          display: block;
        }

        .half-column {
          width: 50%;
        }

        .x-big-column {
          width: 60%;
        }

        .big-column {
          width: 67%;
        }

        .medium-column {
          width: 40%;
        }

        .small-column {
          width: 33%;
        }

        .x-small-column {
          width: 20%;
        }
      }
    }
  }

  .date-overview {
    position: relative;
    padding: 16px;
    padding-left: 56px;

    .material-icons {
      position: absolute;
      top: 50%;
      left: 16px;
      margin-top: -12px;
      font-size: 24px;
      color: @corporate-color;
    }
  }

@media @xs {

}

@media @sm {

}

@media @md {

}
}

.elem-frontend-cms-evaluation-chart-new_customer {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-evaluation-chart-payment {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-evaluation-chart-performance {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-evaluation-chart-recommendation {

  .cta-content {
    padding-top: 8px;

    .icon-button {
      display: inline-block;
      padding: 8px 13px;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-evaluation-chart-reservations {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-evaluation-chart-visitors {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-evaluation-recommendation-recommendation_of_customers {
  height: 100%;
  overflow: hidden;

  .recommendation-card {
    padding-top: 16px;
  }

  .order-area {
    padding: 16px 0;
  }

  .decision-text {
    position: relative;
    padding: 16px 0;
    padding-left: 48px;

    .material-icons {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -16px;
      font-size: 32px;
    }

    .material-icons.error-color {
      color: #f44336;
    }

    .material-icons.success-color {
      color: @corporate-color;
    }
  }

  .customer-info {
    position: relative;
    padding: 8px 0;
    padding-left: 72px;
    min-height: 64px;
  }

  .categories {
    padding: 8px 0;
  }

  .feedback {
    padding: 8px 0;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-evaluation-recommendation-sort {
  padding-left: 0;
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  .sort-list-card {
    padding: 8px 0;
  }

  ul {
    padding-left: 16px;

    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  ul {
    li {
      position: relative;
      padding-right: 40px;

      .edit-article {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -22px;
        padding: 8px 0;
        padding-left: 16px;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-evaluation-recommendation-sort.space_for_sidenav {
  padding-left: 350px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}

.elem-frontend-cms-evaluation-recommendation-common-average_stars {
  .star {
    font-size: 18px;
    color: @secondary-text-color;
  }

  .star.active-star {
    color: #FBBC04;
  }

  span {
    display: inline-block;
    vertical-align: middle;
  }

  span.date {
    padding-left: 16px;
  }
}

img.elem-frontend-cms-evaluation-recommendation-common-profile_img, .default-img.elem-frontend-cms-evaluation-recommendation-common-profile_img {
  overflow: hidden;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -28px;
  border-radius: 100%;
  height: 56px;
  width: 56px;
  background-color: #DEDEDE;

  .material-icons {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -16px;
    margin-left: -16px;
    font-size: 32px;
    color: @secondary-text-color;
  }
}

.elem-frontend-cms-evaluation-recommendation-common-stars {
  overflow: hidden;
  padding: 8px 0;

  .half-space {
    float: left;
    width: 50%;

    .star {
      font-size: 24px;
      color: @secondary-text-color;
    }

    .star.active-star {
      color: #FBBC04;
    }
  }

  .half-space:first-child {
    padding: 4px 0;
  }
}

.elem-frontend-cms-evaluation-recommendation-sort-item {
  position: relative;
  border-bottom: 1px solid @dividers-color;
  padding-right: 60px;
  cursor: grab;

  .customer-info {
    position: relative;
    padding: 8px 0;
    padding-left: 72px;
    min-height: 64px;
  }

  p.radio {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -18px;
    padding-bottom: 14px;

    label {
      display: block;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      height: auto;

      span {
        height: auto !important;
      }

      [type="radio"] + span:before, [type="radio"] + span:after {
        top: 50% !important;
        margin-top: -8px;
      }
    }

    label:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-evaluation-recommendation-sort-item:active, .elem-frontend-cms-evaluation-recommendation-sort-item:focus {
  cursor: grabbing;
}

.elem-frontend-cms-evaluation-recommendation-sort-item:last-child {
  border-bottom: none;
}

.elem-frontend-cms-farmshops-cockpit {

  .select-card {
    overflow: hidden;
    border-radius: @basic-border-radius;
    background-color: #FFFFFF;
  }

  .elem-frontend-cms-elements-form-select {
    margin: 0;
    padding-top: 0 !important;
    background-color: #FFFFFF !important;

    label {
      overflow: hidden;
      border-bottom: none;
      border-top-left-radius: @basic-border-radius;
      border-top-right-radius: @basic-border-radius;
      background-color: #FFFFFF !important;
    }

    select {
      height: 42px !important;
      background-color: #FFFFFF !important;
    }
  }

  .btn {
    .material-icons {
      color: inherit;
    }
  }

  .cockpit-topbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 8px;
    margin-bottom: 12px;
  }

  .cockpit-select-wrap {
    flex: 1 1 auto;
    min-width: 0;
  }

  .cockpit-settings {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    color: @corporate-color;

    .material-icons {
      font-size: 24px;
      color: inherit;
    }
  }

  .cockpit-daterow {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
  }

  .cockpit-daterow > .elem-frontend-cms-elements-form-datepicker {
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    padding-top: 0 !important;
    background-color: #FFFFFF !important;

    .input-field {
      position: relative;
      margin: 0;

      label {
        display: none;
      }

      input.datepicker {
        height: 42px;
        margin: 0;
        padding: 0 38px 0 14px;
        border-bottom: none !important;
        box-shadow: none !important;
        background-color: #FFFFFF !important;
        font-size: 15px;
        color: @text-color;
      }

      &::after {
        content: "\e935";
        font-family: 'Material Icons';
        font-size: 20px;
        font-weight: normal;
        font-style: normal;
        line-height: 1;
        -webkit-font-feature-settings: 'liga';
        -webkit-font-smoothing: antialiased;
        position: absolute;
        top: 50%;
        right: 12px;
        transform: translateY(-50%);
        color: @secondary-text-color;
        pointer-events: none;
      }
    }
  }

  .date-sep {
    flex: 0 0 auto;
    padding: 0 4px;
    color: @secondary-text-color;
    font-size: 16px;
  }

  .cockpit-empty {
    padding: 16px;
    margin-bottom: 16px;

    p {
      padding-bottom: 12px;
    }

    .btn {
      .material-icons {
        vertical-align: middle;
        margin-right: 6px;
      }
    }
  }
}


.elem-frontend-cms-farmshops-detail {
  overflow: hidden;
  height: 100%;

  .small-space-top {
    padding-top: 8px;
  }

  .this-card {
    padding: 8px 16px;

    .card-head {
      padding: 8px 0;

      h2 {
        position: relative;
        padding-top: 16px;
        padding-bottom: 8px;
        padding-right: 120px;
      }
    }
  }

  .first-password {
    display: none;
  }

  .split-input {
    overflow: hidden;

    .split-item {
      float: left;
      display: block;
      width: 50%;

      div {
        margin: 0;
      }
    }

    .split-item:nth-child(odd) {
      padding-right: 4px;
    }

    .split-item:nth-child(even) {
      padding-left: 4px;
    }
  }

  .shelly-list {
    margin-right: -16px;

    .shelly-item {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 12px 0;
      padding-right: 56px;
      padding-left: 40px;
      cursor: pointer;

      .text-begin-icon {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -12px;
        font-size: 24px;
      }

      .switch-on {
        position: absolute;
        top: 50%;
        right: 16px;
        margin-top: -12px;
        font-size: 24px;
        color: @secondary-text-color;
      }
    }

    .shelly-item:last-child {
      border: none;
    }
  }

  .terminal-list {
    margin-right: -16px;

    .terminal {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 12px 0;
      padding-right: 40px;
      cursor: pointer;
      
      .edit-terminal {
        position: absolute;
        top: 50%;
        right: 16px;
        margin-top: -12px;
        font-size: 24px;
      }
    }

    .terminal:last-child {
      border-bottom: none;
    }
  }

  .remove-shop, .add-shelly {
    padding-top: 24px;

    a, span {
      .material-icons {
        display: inline-block;
        margin-top: -4px;
        padding-right: 2px;
        color: inherit;
        vertical-align: middle;
      }
    }
  }

  .add-shelly, .add-terminal {
    padding-top: 16px;

    a, span {
      margin-right: 4px;
      color: @corporate-color;
      vertical-align: middle;
    }
  }

  .fiskal-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 4px;
    padding-bottom: 4px;
  }

  .fiskal-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 44px;
    border: 1px solid @dividers-color;
    border-radius: @basic-border-radius;
    color: @corporate-color;
    font-size: 14px;
    font-weight: 500;
    text-transform: none;

    .material-icons {
      font-size: 20px;
      color: inherit;
      margin: 0;
      padding: 0;
      vertical-align: middle;
    }
  }

  .checkout-url-card {
    .checkout-url {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: @corporate-color;
      word-break: break-all;
      padding-bottom: 8px;

      .material-icons {
        font-size: 20px;
        color: inherit;
        margin: 0;
        padding: 0;
      }
    }
  }

  .datev-export-hint {
    padding-top: 12px;
    padding-bottom: 4px;
  }

  .datev-dates {
    display: flex;
    gap: 16px;

    > div {
      flex: 1;
    }
  }

  .remove-shop {
    a {
      color: @error-color;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-farmshops-overview {

  .card {
    padding: 8px 16px;

    h2 {
      position: relative;
      padding-top: 16px;
      padding-bottom: 8px;
      padding-right: 120px;
    }
  }

  .farmshop-list {
    padding: 24px 0;
  }

  .add-shop {
    padding-top: 24px;

    a {
      .material-icons {
        display: inline-block;
        margin-top: -4px;
        padding-right: 2px;
        color: inherit;
        vertical-align: middle;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-farmshops-cockpit-add_farmshop {

  .add-farmshop-content {
    padding: 16px 16px 0;
  }

  .small-space-top {
    margin-top: 12px;
  }

  .split-input {
    display: flex;
    gap: 12px;
  }

  .split-item {
    flex: 1 1 0;
    min-width: 0;
  }
}


.elem-frontend-cms-farmshops-cockpit-dashboard_body {

  .material-icons {
    color: inherit;
  }

  .card {
    margin-bottom: 14px;
  }

  .kpi-cards {
    padding: 16px 0;
    padding-bottom: 8px;

    .card {
      margin: 0;
    }

    .card:first-child {
      margin-bottom: 8px;
    }

    .kpi-mini-grid {
      margin-bottom: 0;

      .card:first-child {
        margin-bottom: 0;
      }
    }
  }

  .cockpit-alert {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
  }

  .cockpit-alert-text {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
  }

  .cockpit-alert-arrow {
    flex: 0 0 auto;
  }

  .dayclose-open {
    padding: 14px 16px;
    border-left: 4px solid @error-color;

    .dayclose-open-head {
      display: flex;
      align-items: center;
      gap: 10px;

      .material-icons {
        color: @error-color;
      }

      .subhead {
        color: @error-color;
      }
    }

    .dayclose-open-hint {
      margin: 8px 0 14px;
    }

    .dayclose-open-list {
      list-style: none;
      margin: 0;
      padding: 0;
    }

    .dayclose-open-item {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 8px;
      padding: 14px 0;
      border-top: 1px solid @dividers-color;
    }

    .dayclose-open-item:first-child {
      border-top: 0;
      padding-top: 0;
    }

    .dayclose-open-info {
      display: flex;
      flex-direction: column;
      min-width: 0;

      .subhead {
        line-height: 1.3;
      }
    }

    .dayclose-open-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      width: 100%;

      .material-icons {
        font-size: 18px;
      }
    }
  }

  .cockpit-alert-signatures {
    border-left: 4px solid @corporate-color;

    .material-icons {
      color: @corporate-color;
    }

    .cockpit-alert-arrow {
      color: @icons-color;
    }
  }

  .kpi-hero {
    padding: 16px 18px;
    background: @corporate-color;

    .kpi-hero-label {
      display: block;
      margin: 0;
      color: #fff;
      opacity: 0.85;
    }

    .kpi-hero-value {
      display: block;
      margin: 2px 0 0;
      color: #fff;
    }
  }

  .kpi-mini-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }

  .kpi-mini {
    padding: 12px;
    margin-bottom: 0;

    p {
      margin: 0;
    }

    .kpi-mini-value {
      display: block;
      padding-top: 2px;
    }
  }

  .paymix {
    padding: 14px 16px;

    .paymix-label {
      margin: 0 0 10px;
    }

    .paymix-bar {
      display: flex;
      height: 12px;
      border-radius: 999px;
      overflow: hidden;
      background: @dividers-color;
      margin-bottom: 10px;
    }

    .paymix-seg {
      display: block;
      height: 100%;
    }

    .paymix-seg-cash {
      background: @corporate-color;
    }

    .paymix-seg-card {
      background: #82C55D;
    }

    .paymix-legend {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      font-size: 13px;
    }

    .paymix-dot {
      display: inline-block;
      width: 9px;
      height: 9px;
      border-radius: 50%;
      margin-right: 6px;
    }

    .paymix-dot-cash {
      background: @corporate-color;
    }

    .paymix-dot-card {
      background: #82C55D;
    }
  }

  .list-card {
    padding: 0;
  }

  .list-card-head {
    padding: 14px 16px 6px;
    border-bottom: 1px solid @dividers-color;

    h2 {
      margin: 0;
    }
  }

  .kassen-list,
  .tx-list {
    list-style: none;
    margin: 0;
    padding: 0;
    padding-left: 16px;
  }

  .kassen-item {
    padding: 14px 16px;
    padding-left: 0;
    border-bottom: 1px solid @dividers-color;
  }

  .kassen-item:last-child {
    border-bottom: none;
  }

  .kassen-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  .kassen-turnover {
    margin: 2px 0 4px;
  }

  .kassen-cash {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    color: @text-color;
  }

  .kassen-cash-value {
    font-weight: 500;
    color: @corporate-color;
  }

  .kassen-cash-arrow {
    flex: 0 0 auto;
    font-size: 20px;
    color: @secondary-text-color;
  }

  .kassen-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }

  .kassen-btn {
    flex: 1 1 calc(50% - 5px);
    min-width: 0;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border: 1px solid @dividers-color;
    border-radius: @basic-border-radius;
    color: @corporate-color;
    font-size: 13px;
    font-weight: 500;
    text-transform: none;
  }

  .status-pill {
    font-size: 12px;
    line-height: 1.6;
    padding: 2px 10px;
    border-radius: 999px;
    white-space: nowrap;
  }

  .status-pill.is-open {
    background: fade(@error-color, 12%);
    color: @error-color;
  }

  .status-pill.is-done {
    background: fade(@corporate-color, 10%);
    color: @corporate-color;
  }

  .tx-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 16px;
    padding-left: 0;
    border-bottom: 1px solid @dividers-color;
  }

  .tx-item:last-child {
    border-bottom: none;
  }

  .tx-empty {
    padding: 16px;
    margin: 0;
  }

  .tx-all {
    text-align: center;
    padding: 8px 0 6px;
  }

}


.elem-frontend-cms-farmshops-detail-add_shelly {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }
}

.elem-frontend-cms-farmshops-detail-add_terminal {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }
}


.elem-frontend-cms-farmshops-detail-charge_check {
  padding: 0;
}

.elem-frontend-cms-farmshops-detail-map.card {
  padding: 0 !important;

  #map {
    height: 249px;
    width: 100%;
  }

  .map-legend {
    overflow: hidden;
    padding: 16px;

    li {
      float: left;
      display: block;
      position: relative;
      padding: 8px 16px;
      padding-left: 56px;
      width: 50%;

      .svg-grafic {
        position: absolute;
        top: 50%;
        left: 8px;
        margin-top: -24px;
      }
    }
  }

  .this-action-area {
    padding: 16px 0;

    .get-coordinates {
      span {
        vertical-align: middle;
      }

      .material-icons {
        margin-right: 4px;
        font-size: 20px;
        color: @corporate-color;
      }
    }
  }

  .map-card-inner {
    padding: 0 16px;
  }

  @media @xs {
    .map-legend {
      overflow: hidden;
      padding-top: 8px;

      li {
        float: left;
        display: block;
        position: relative;
        padding: 12px 16px;
        padding-left: 56px;
        width: 100%;

        .svg-grafic {
          position: absolute;
          top: 50%;
          left: 8px;
          margin-top: -24px;
        }
      }
    }
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-farmshops-detail-shelly {

  .switch-on, .text-begin-icon {
    color: @error-color !important;
  }

  .switch-on.shelly-on, .text-begin-icon.shelly-on {
    color: @corporate-color !important;
  }
}

.elem-frontend-cms-farmshops-detail-terminal_devices {

  .device-kasse {
    padding-top: 4px;

    .kasse-name {
      padding-bottom: 2px;
    }
  }

  .device-list {
    margin-right: -16px;

    .device {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 12px 0;
      padding-right: 56px;
      cursor: pointer;

      .device-meta {
        padding-top: 2px;
        line-height: 18px;
      }

      .edit-device {
        position: absolute;
        top: 50%;
        right: 16px;
        margin-top: -12px;
        font-size: 24px;
      }
    }

    .device:last-child {
      border-bottom: none;
    }

    .device-inactive {
      p {
        color: @secondary-text-color;
      }
    }
  }

  .add-device {
    padding-top: 16px;

    span {
      margin-right: 4px;
      color: @corporate-color;
      vertical-align: middle;

      .material-icons {
        display: inline-block;
        margin-top: -4px;
        padding-right: 2px;
        color: inherit;
        vertical-align: middle;
      }
    }
  }
}


.elem-frontend-cms-farmshops-detail-add_shelly-content {

  .popup-head {
    position: relative;

    h3 {
      padding-right: 32px;
    }

    .delete-note {
      position: absolute;
      top: 8px;
      right: 8px;
      padding: 8px;
      font-size: 24px;
      color: @secondary-text-color;
      cursor: pointer;
    }
  }

  .delete-shelley {
    padding: 16px 0;

    a {
      color: @error-color;
    }
  }

  .shelly-type-list {
    display: grid;
    padding: 24px 0;
    gap: 0;
    grid-template-columns: repeat(2,minmax(0,1fr));

    .shelly-type {
      border-bottom: 1px solid @dividers-color;
      padding: 24px 16px;
    }

    .shelly-type:nth-child(even) {
      border-right: 1px solid @dividers-color;
    }
  }

  .popup-content {
    padding-right: 16px !important;
  }
}

.elem-frontend-cms-farmshops-detail-add_terminal-content {

  .popup-head {
    position: relative;

    h3 {
      padding-right: 32px;
    }
  }

  .delete-terminal {
    padding: 16px 0;

    a {
      color: @error-color;
    }
  }

  .popup-content {
    padding-right: 16px !important;

    .reader-info-toggle {
      display: inline-flex;
      align-items: center;
      cursor: pointer;
      color: @corporate-color;

      .material-icons {
        font-size: 18px;
        margin-right: 4px;
      }
    }

    .reader-hint {
      margin-top: 4px;
    }
  }

  .toggle-label {
    margin-top: 8px;
  }
}


.elem-frontend-cms-farmshops-detail-add_terminal_device-content {

  .popup-head {
    padding-bottom: 8px;

    p {
      padding-top: 4px;
    }

    .kasse-hint {
      color: @corporate-color;
    }
  }

  .popup-content {
    // Gleiche Loesung wie im Kassen-Popup: ohne das Padding klebt das
    // Name-Input am rechten Kartenrand.
    padding-right: 16px !important;

    .toggle-label {
      padding-top: 12px;
      padding-bottom: 4px;
    }

    .reader-info-toggle {
      display: inline-flex;
      align-items: center;
      cursor: pointer;
      color: @corporate-color;

      .material-icons {
        font-size: 18px;
        margin-right: 4px;
      }
    }

    .reader-hint {
      margin-top: 4px;
    }

    .modus-radio {
      padding: 4px 0;
    }

    .device-info {
      margin-top: 16px;
      border-top: 1px solid @dividers-color;
      padding-top: 12px;

      .device-code {
        padding-top: 8px;
      }

      .device-action-link {
        padding-top: 4px;

        a {
          color: @corporate-color;
          padding-left: 0;
        }
      }
    }

    .deactivate-device {
      padding-top: 16px;

      a {
        color: @corporate-color;
      }

      .error-action {
        color: @error-color;
      }
    }
  }
}


.elem-frontend-cms-finance-filter {
  .card {
    padding-right: 0;

    .card-head {
      padding-right: 16px;
      padding-left: 0;
    }
  }

  .hiding-area, .hiding-area-inner {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .hiding-area-inner.padding-right {
    padding-right: 16px;
  }

  .hiding-area.active-area, .hiding-area-inner.active-area {
    max-height: 5000px;
  }

  .hiding-area-inner {
    padding-right: 0;
  }

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-finance-overview {
  height: 100%;

  .filter {
    padding: 0;

    .filter-content {
      padding: 8px 16px;
    }
    p {
      padding-bottom: 8px;
    }

    .delete-filter {
      padding: 8px 0;
      padding-top: 0;
    }
  }

  .action-area.first {
    padding-top: 16px;
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding: 3px 16px;
      vertical-align: bottom;
    }

    .elem-frontend-cms-elements-form-checkbox {
      display: inline-block !important;
      vertical-align: middle !important;
    }
  }

  .login-button {
    padding-bottom: 16px;
  }

  ul {
    li.card {
      padding: 8px 0;
      padding-top: 16px;

      h2 {
        padding-bottom: 4px;
      }

      .finance-head {
        padding: 0 16px;
      }

      .finance-details {
        padding: 8px 16px;
      }
    }
  }
}

.elem-frontend-cms-finance-elements-menu {
  position: relative;
  z-index: 50;

  .card {
    position: fixed;
    z-index: 9;
    bottom: 0;
    left: -300px;
    margin: 0;
    border-radius: 0;
    padding: 0;
    height: 100%;
    width: 300px;
    background-color: @dark-corporate-color;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;

    .action-list {
      padding-bottom: 110px;
      height: 100%;
      width: 300px;
      background-color: @dark-corporate-color;

      ul {
        overflow-y: auto;
        height: 100%;
        padding-left: 24px;

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .action-list.show-list {
      height: 100%;
      width: 300px;
    }
  }

  .card.main-nav-active {
    left: 0;
    width: 300px;
  }

  @media @xs {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @sm {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 30%;
    }
  }

  @media @md {

  }
}


.elem-frontend-cms-finance-overview-invoice.card {
  position: relative;
  overflow: hidden;

  .payed, .storno {
    display: block;
    position: absolute;
    top: -8px;
    left: -8px;
    padding: 4px 24px;
    width: 210px;
    background-color: @corporate-color;
    -webkit-transform: rotate(-14deg);
    -moz-transform: rotate(-14deg);
    -o-transform: rotate(-14deg);
    -ms-transform: rotate(-14deg);
    transform: rotate(-14deg);
    color: #FFFFFF;
  }

  .storno {
    background-color: @error-color;
  }

  h2.subhead {

    span {
      font-size: inherit;
      font-weight: inherit;
      font-style: inherit;
    }
  }

  .pill-list {
    overflow: hidden;
    padding-left: 16px;
    padding-bottom: 8px;

    .pill {
      float: left;
      margin: 2px 0;
      border-radius: 50px;
      padding: 2px 8px;
      background-color: @corporate-color;
      color: #FFFFFF;
    }

    .pill:last-child {
      margin-right: 0;
    }

    .pill.success {
      background-color: @corporate-color;
    }

    .pill.syf {
      background-color: #74B49B;
    }

    .pill.not-in-delivery {
      background-color: @error-color;
    }
  }
}

.elem-frontend-cms-finance-overview-invoice_list {

  .action-area {
    position: relative;

    #import-payment {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -8px;
      padding: 0;
    }
  }
}

.elem-frontend-cms-finance-popups-payment_import {
  .popup-footer {
    overflow: hidden;
  }

  .card {
    .alert {
      padding: 8px 16px;

      ul {
        li {
          padding: 4px 0;
        }

        li:first-child {
          padding-top: 0;
        }

        li:last-child {
          padding-bottom: 0;
        }
      }
    }
  }

  @media @xs {
  }
}

body {
  .new-popup {
    div.card {
      width: 420px !important;
    }
  }
}

@media @xs {
  body {
    .new-popup {
      div.card {
        width: 95% !important;
      }
    }
  }
}

.elem-frontend-cms-finance-popups-print_documents {
  .popup-footer {
    overflow: hidden;

    .btn-flat {
      display: block;
      width: 50%;
      float: left;
    }
  }
}

.elem-frontend-cms-finance-popups-send_datev_csv {
  .popup-content {
    padding-right: 16px !important;
  }

  .popup-footer {
    overflow: hidden;

    .btn-flat {
      display: block;
      width: 50%;
      float: left;
    }
  }
}

.elem-frontend-cms-finance-popups-payment_import-content {

  .description-part {
    padding-right: 16px;
  }

  p.body1 {
    a {
      color: inherit;
      font-size: inherit;
      font-weight: inherit;
      text-decoration: underline;
    }
  }

  .status-area {
    padding: 8px 0;
  }

  .csv_file_info {
    padding-bottom: 16px;
  }

  .action-area {
    padding-right: 16px;
    padding-bottom: 8px;
  }

  .select-file {
    padding: 8px 0;

    label {
      color: @corporate-color;
    }

    input {
      display: none;
    }
  }

  tbody {

    tr.error {

      td {
        color: @error-color;
      }
    }

    tr:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-finance-popups-send_datev_csv-content {

  .hide-input {
    display: none;
  }
}

.elem-frontend-cms-goods-availability {

  .this-time-content {
    padding-top: 16px;
  }

  .elem-frontend-cms-elements-form-radio {
    padding-bottom: 0;
  }

  .availability-area-now {
    padding: 0 8px;
  }

  .availability-area {
    overflow: hidden;
    padding: 0 8px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .availability-area.active-area {
    max-height: 1000px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-charge_article_edit {

  .text-counter-hint {
    padding-bottom: 8px;
    padding-left: 24px;
  }

  .card {

    .this-hint-text {
      padding: 0 8px;
      padding-bottom: 8px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-charge_images {
  position: relative;

  .card {
    padding: 0;
  }

  .img-outer {
    padding: 0;

    img {
      height: auto;
      width: 100%;
    }
  }

  .this-cta-area {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 80px;
    width: 100%;
    background: rgb(255,255,255);
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);

    a {
      display: inline-block;
      position: absolute;
      right: 0;
      bottom: 0;
      padding: 16px;

      span {
        color: #ffffff;
      }
    }

    a.delete {
      left: 0;
    }
  }

  .has-images {
    padding: 0 16px;
  }

  .description-area {
    overflow: hidden;
    padding: 0 16px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .description-area.active-area {
    max-height: 10000px;
  }

  .add-image {
    padding-top: 24px;

    label {
      input {
        display: none;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-detail {
  height: 100%;
  overflow: hidden;

  form {
    height: 100%;
  }

  .article-list-card {
    padding-right: 0;

    .list-card-footer {
      padding-right: 16px;
    }
  }

  .elem-frontend-cms-goods-detail-images {
    .card {
      padding-top: 8px;
      padding-bottom: 8px;
    }
  }

  .card {
    position: relative;

    .elem-frontend-cms-elements-card-head {
      padding-right: 54px;
    }

    .list-card-footer, .this-action-icons, .elem-frontend-cms-elements-card-footer {
      display: inline-block;
      position: absolute;
      top: 4px;
      right: 0;
      padding-right: 16px;

      .material-icons {
        font-size: 24px;
      }
    }
  }

  .article-list {
    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      padding-right: 16px;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .export-card {
    padding: 0;

    .content-card {
      padding: 0 16px;
      padding-top: 8px;
    }

    ul.download-list {
      padding-bottom: 8px;
      padding-left: 16px;

      li {
        position: relative;
        border-bottom: 1px solid @dividers-color;
        padding: 16px 0;
        padding-right: 54px;

        .download-button {
          position: absolute;
          top: 50%;
          right: 0;
          margin-top: -16px;
          font-size: 32px;

          span {
            color: @corporate-color;
          }
        }
      }

      li:last-child {
        border-bottom: 0;
      }
    }
  }

  .bottom-card-buttons {
    padding-top: 24px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-item_amount {
  height: 100%;

  form {
    height: auto;
  }

  @media @xs {
    .scrollspy-nav {
      display: none;
    }
  }

  @media @sm {
    .scrollspy-nav {
      display: none;
    }
  }

  @media @md {

  }
}

.elem-frontend-cms-goods-item_description {

  .product-title {
    padding-bottom: 24px;
  }

  .first-hint {
    padding: 0 24px;
    padding-bottom: 16px;
  }

  .description-area {
    overflow: hidden;
    margin: 0 -16px;
    padding: 0 16px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .description-area.active-area {
    max-height: 1000px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-item_edit {
  height: 100%;

  .nutrition-input {
    padding-right: 16px;
  }

  .error {
    color: @error-color;
  }

  .toggle-question {
    padding: 8px 0 4px;
  }

  .nutrition-input-list, .ean-id-list, .barcode-intern-list, .barcode-extern-list {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .nutrition-input-list.show-inputs, .ean-id-list.show-inputs, .barcode-intern-list.show-inputs, .barcode-extern-list.show-inputs {
    max-height: 10000px;
  }

  .text-counter-hint {
    padding-bottom: 8px;
    padding-left: 24px;
  }

  .card {
    padding-right: 0;

    .content-body {
      padding-right: 16px;
      background-color: transparent;
    }

    .this-hint-text {
      padding: 0 8px;
      padding-bottom: 8px;
    }
  }

  .error-message {
    display: none;

    p {
      color: @error-color;
    }
  }

  .error-message.show-error {
    display: block;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-item_order {
  padding-left: 0;
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  .sort-list-card {
    padding: 8px 0;
  }

  ul {
    padding-left: 16px;

    li {
      padding: 8px 0;
      padding-right: 40px;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-item_order.space_for_sidenav {
  padding-left: 350px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}

.elem-frontend-cms-goods-items {

  .toggle-outer {
    padding: 16px 0;

    .toggle {
      overflow: hidden;
      border-radius: @basic-border-radius;
      border: 1px solid @corporate-color;

      a {
        float: left;
        padding: 16px 32px;
        width: 50%;
        background-color: #ffffff;
        color: @secondary-text-color;
      }

      a.active {
        border: 1px solid @corporate-color;
        background-color: rgba(130, 197, 93, 0.2);
        color: @text-color;
        font-weight: @medium;
      }
    }
  }

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  ul {
    li {
      position: relative;
      padding-right: 32px;

      .edit-article {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -22px;
        padding: 8px 0;
        padding-left: 16px;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-order {
  padding-left: 0;
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  .sort-list-card {
    padding: 8px 0;
  }

  ul {
    padding-left: 16px;

    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  ul {
    li {
      position: relative;
      padding-right: 40px;

      .edit-article {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -22px;
        padding: 8px 0;
        padding-left: 16px;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-order.space_for_sidenav {
  padding-left: 350px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}

.elem-frontend-cms-goods-overview {

  .this-hint-text {
    padding-top: 8px;
  }

  .toggle-outer {
    padding: 16px 0;

    .toggle {
      overflow: hidden;
      border-radius: @basic-border-radius;
      border: 1px solid @corporate-color;

      a {
        float: left;
        padding: 16px 32px;
        width: 50%;
        background-color: #ffffff;
        color: @secondary-text-color;
      }

      a.active {
        border: 1px solid @corporate-color;
        background-color: rgba(130, 197, 93, 0.2);
        color: @text-color;
        font-weight: @medium;
      }
    }
  }

  .checkbox {
    display: inline-block;
  }

  .action-area {
    position: relative;
    min-height: 30px;

    .sort-list-button {
      position: absolute;
      top: 0;
      left: 0;
      width: 60%;
      vertical-align: inherit;

      span {
        padding-right: 8px;
        vertical-align: middle;
        color: inherit;
      }
    }
  }

  .action-area.first {
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding-top: 7px;
      padding-right: 8px;
      vertical-align: middle;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-products {

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .elem-frontend-cms-elements-form-radio {
    padding-bottom: 0;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-products_apply {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-products_edit {

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-ready {

  .this-hint-text {
    display: none;
    padding-top: 16px;
  }

  .this-hint-text.active-text {
    display: block;
  }

  .card {
    div:first-child {
      padding-bottom: 0;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-ready_hints {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-status {

  .this-hint-text {
    display: none;
    padding-top: 16px;
  }

  .this-hint-text.active-text {
    display: block;
  }

  .card {
    div:first-child {
      padding-bottom: 0;
    }
  }

  .status-card {
    padding-right: 0;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-charge_images-item {

  .img-outer {
    position: relative;
    min-height: 220px;
  }
}

.elem-frontend-cms-goods-copy-availability {

  .this-time-content {
    padding-top: 16px;
  }

  .elem-frontend-cms-elements-form-radio {
    padding-bottom: 0;
  }

  .availability-area-now {
    padding: 0 8px;
  }

  .availability-area {
    overflow: hidden;
    padding: 0 8px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .availability-area.active-area {
    max-height: 1000px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-copy-status {

  .this-hint-text {
    display: none;
    padding-top: 16px;
  }

  .this-hint-text.active-text {
    display: block;
  }

  .card {
    div:first-child {
      padding-bottom: 0;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-detail-article {
  padding-top: 8px;
  padding-bottom: 8px;

  .percentage-scala {
    position: relative;
    padding-top: 8px;

    .elem-frontend-cms-reservation-overview-item-bar {
      padding-bottom: 4px;
    }
  }

  p.article-legend {
    position: relative;
    padding-right: 56px;

    .interested-article {
      color: @attention-color;
      font-size: inherit;
      font-weight: inherit;
    }

    .reserved-article {
      color: @corporate-color;
      font-size: inherit;
      font-weight: inherit;
    }

    .delivered-article {
      color: @error-color;
      font-size: inherit;
      font-weight: inherit;
    }

    .open-article {
      position: absolute;
      bottom: 0;
      right: 0;
      color: inherit;
      font-size: inherit;
      font-weight: inherit;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-detail-images {

  .card {
    padding: 0;
  }

  .img-outer {
    padding: 8px 0;
    padding-top: 0;

    .logo-image {
      height: auto;
      width: 100%;
    }
  }

  .card-content {
    padding: 0 16px;
    padding-bottom: 8px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-detail-links {
  .link-area:first-child {
    padding-bottom: 8px;
  }

  .link-area:last-child {
    padding-top: 8px;
  }
}

.elem-frontend-cms-goods-detail-article-bar {
  position: relative;
  padding: 8px 0;

  .status-slider {
    overflow: hidden;
    display: inline-block;
    position: relative;
    margin-top: 3px;
    border: 1px solid @dividers-color;
    border-radius: 7px;
    height: 14px;
    width: 100%;

    .status-slider-inner {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      border-radius: 7px;
      height: 12px;
      background-color: @corporate-color;
      -webkit-transition: width 0.5s, background-color 0.5s;
      -moz-transition: width 0.5s, background-color 0.5s;
      -ms-transition: width 0.5s, background-color 0.5s;
      -o-transition: width 0.5s, background-color 0.5s;
      transition: width 0.5s, background-color 0.5s;
    }

    .sold-bar {
      background-color: @error-color;
    }

    .interested {
      background-color: @attention-color;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-elements-order_menu {
  position: relative;

  .card {
    position: fixed;
    z-index: 9;
    bottom: 0;
    left: -350px;
    margin: 0;
    border-radius: 0;
    padding: 0;
    height: 100%;
    width: 350px;
    background-color: @dark-corporate-color;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;

    .action-list {
      padding-bottom: 110px;
      height: 100%;
      width: 350px;
      background-color: @dark-corporate-color;

      ul {
        overflow-y: auto;
        height: 100%;
        padding-left: 24px;

        li {
          padding-right: 0 !important;
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .action-list.show-list {
      height: 100%;
      width: 350px;
    }
  }

  .card.main-nav-active {
    left: 0;
    width: 350px;
  }

  @media @xs {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 16px;

          li {
            padding-top: 0;
            padding-bottom: 0;
          }

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @sm {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 16px;

          li {
            padding-top: 0;
            padding-bottom: 0;
          }

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @md {

  }
}


.elem-frontend-cms-goods-elements-order_menu-menu {
  overflow: hidden;

  .menu-buttons {
    width: 100%;

    span.menu-item {
      display: block;
      padding: 16px;
      padding-left: 0;
      border-bottom: 1px solid #ffffff;
      cursor: pointer;

      span {
        display: inline-block;
        color: #ffffff;
        vertical-align: middle;
      }

      span.material-icons {
        padding-right: 8px;
      }
    }
  }

  .menu-finish {
    width: 100%;

    span.menu-item {
      display: block;
      padding: 16px;
      padding-left: 0;
      cursor: pointer;

      span {
        display: inline-block;
        color: #ffffff;
        vertical-align: middle;
      }

      span.material-icons {
        padding-right: 8px;
      }
    }
  }

  .material-icons.rotate-up {
    padding-top: 8px;
    padding-right: 0 !important;
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
  }

  .material-icons.rotate-down {
    padding-top: 8px;
    padding-right: 0 !important;
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
  }

  @media @xs {
    .menu-buttons {
      float: left;
      width: 80%;

      span.menu-item {
        display: inline-block;
        border-bottom: none;
        padding: 11px 16px;
        color: #ffffff;
      }
    }

    .menu-finish {
      float: left;
      width: 20%;
      text-align: right;

      span.menu-item {
        display: inline-block;
        padding: 15px 16px;
        color: #ffffff;
      }
    }
  }

  @media @sm {
    .menu-buttons {
      float: left;
      width: 80%;

      span.menu-item {
        display: inline-block;
        border-bottom: none;
        padding: 11px 16px;
        color: #ffffff;
      }
    }

    .menu-finish {
      float: left;
      width: 20%;
      text-align: right;

      span.menu-item {
        display: inline-block;
        padding: 15px 16px;
        color: #ffffff;
      }
    }
  }

  @media @md {

  }
}

.elem-frontend-cms-goods-image-edit {
  height: 100%;

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-item_amount-article.card {
  padding-top: 16px;
  padding-bottom: 16px;

  span.article-type {
    color: @corporate-color;
  }

  .price-hint-text {
    padding-top: 8px;
  }

  .elem-frontend-cms-elements-form-select .input-field label {
    left: 14px !important;
  }

  .head-content {
    position: relative;
    padding-right: 48px;

    .checkbox {
      position: absolute;
      top: 0;
      right: -14px;
    }
  }

  .max-price-area {
    overflow: hidden;
    display: block;
    max-height: 40px;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .reservation-amount, .normal-price-hint {
    margin-top: -4px;
    padding-left: 16px;
    color: @secondary-text-color;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    -ms-transition: color 0.3s;
    -o-transition: color 0.3s;
    transition: color 0.3s;
  }

  .reservation-amount.error-count, .normal-price-hint.error-count {
    color: @error-color;
  }

  .max-price-area.inactive-price {
    max-height: 0;
  }

  .complete-price, .vat-price {
    padding-top: 2px;
  }

  .min-max-price {
    padding-top: 8px;
  }

  .weight-hint-text {
    display: none;
  }

  .weight-hint-text.show-hint {
    display: block;
    color: @error-color;
  }

  .this-hint-text {
    padding: 0 8px;
    padding-bottom: 8px;
  }

  .this-amount {
    padding-bottom: 8px;
  }

  .this-price, .this-normal_price {
    position: relative;
    padding-bottom: 8px;
  }

  .this-weight {
    overflow: hidden;
    padding-bottom: 8px;

    .weights {
      float: left;
      display: block;
      width: 50%;

      .elem-frontend-cms-elements-form-input {
        margin-bottom: 4px;
      }
    }

    .this-min {
      padding-right: 8px;
    }

    .this-max {
      padding-left: 8px;
    }
  }

  .is-error {
    .this-text {
      color: @error-color;
    }

    input {
      color: @error-color !important;
    }
  }

  .complete-price, .vat-price {

    span {
      font-weight: inherit;
      font-size: inherit;
      line-height: inherit;
      color: inherit;
    }
  }

  .input-section {
    position: relative;

    .currency {
      position: absolute;
      right: 16px;
      bottom: 10px;
    }
  }

  .this-normal_price {
    overflow: hidden;
    padding-bottom: 0;
    max-height: 0;
    -webkit-transition: max-height 0.3s, padding-bottom 0.3s;
    -moz-transition: max-height 0.3s, padding-bottom 0.3s;
    -ms-transition: max-height 0.3s, padding-bottom 0.3s;
    -o-transition: max-height 0.3s, padding-bottom 0.3s;
    transition: max-height 0.3s, padding-bottom 0.3s;
  }

  .this-normal_price.is-active-area {
    padding-bottom: 16px;
    max-height: 150px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-item_amount-article_list {

  .action-area {
    position: relative;
    min-height: 30px;

    .checkbox {
      display: inline-block;
    }

    label {
      padding-right: 2px;
    }

    .sort-list-button {
      position: absolute;
      top: 0;
      left: 0;
      width: 60%;
      vertical-align: inherit;

      span {
        padding-right: 8px;
        vertical-align: middle;
        color: inherit;
      }
    }
  }

  .action-area.first {
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding-top: 5px;
      padding-right: 8px;
      vertical-align: middle;
    }
  }
}

.elem-frontend-cms-goods-item_amount-article_list-scrollspy.card {
  padding-top: 39px !important;
  padding-bottom: 0 !important;

  h3 {
    position: absolute;
    top: 0;
    left: 0;
    border-bottom: 1px solid @dividers-color;
    padding: 8px 16px;
    width: 100%;
    background-color: @dark-corporate-color;
    color: #FFFFFF;
  }

  .scrollspy-container {
    position: relative;
    overflow-y: auto;
    padding: 8px 0;
    height: 100%;
  }
}

.elem-frontend-cms-goods-item_amount-article_list-scrollspy.scrollspy-nav {
  position: fixed;
  top: 16px;
  right: 24px;
  padding: 8px 0;
  z-index: 1000;
  height: 40%;
  min-width: 300px;
  max-width: 300px;
}

.elem-frontend-cms-goods-item_amount-article_list-scrollspy.scrollspy-nav {
  ul {
    list-style: none;
  }
}

.elem-frontend-cms-goods-item_amount-article_list-scrollspy.scrollspy-nav {
  li {
    margin-bottom: 8px;
  }
}

.elem-frontend-cms-goods-item_amount-article_list-scrollspy.scrollspy-nav {
  li:last-child {
    margin-bottom: 0;
  }
}

.elem-frontend-cms-goods-item_amount-article_list-scrollspy.scrollspy-nav {

  a {
    display: block;
    text-decoration: none;
    color: @secondary-text-color;
    padding: 8px 16px;
    transition: all 0.3s ease;
    font-size: 14px;
    font-weight: @regular;
  }
}

.elem-frontend-cms-goods-item_amount-article_list-scrollspy.scrollspy-nav {
  a:hover {
    background-color: @dark-corporate-color;
    color: #FFFFFF;
  }
}

.elem-frontend-cms-goods-item_amount-article_list-scrollspy.scrollspy-nav {
  a.active {
    background-color: @dark-corporate-color;
    color: #FFFFFF;
    font-weight: @medium;
  }
}

.elem-frontend-cms-goods-item_edit-crop {
  height: 100%;

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-item_edit-images {

  .card {
    padding: 8px 16px;
    padding-right: 0;
    padding-bottom: 0;
  }

  ul {

    li {
      position: relative;
      padding: 28px 0;
      padding-right: 120px;
      padding-left: 80px;
      border-bottom: 1px solid @dividers-color;

      .img-outer {
        overflow: hidden;
        position: absolute;
        top: 8px;
        left: 0;
        border-radius: 4px;
        height: 60px;
        width: 60px;
        background-color: @corporate-color;

        .logo-image {
          height: auto;
          width: 100%;
        }
      }

      p {
        min-height: 20px;
      }

      .this-cta-area {
        position: absolute;
        top: 8px;
        right: 0;

        a {
          display: inline-block;
          padding: 16px 20px;
        }
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .card-content {
    padding: 0 16px;
    padding-bottom: 8px;
  }

  .add-image {
    padding-top: 24px;

    label {
      input {
        display: none;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-item_edit-link {

  .input-area {
    position: relative;
    padding-right: 16px;

    #input-extra {
      display: inline-block;
      position: absolute;
      top: 50%;
      right: 0;
      margin-top: -4px;
    }
  }

  .domain-example-text {
    padding-top: 16px;
  }

  .hint-text {
    display: none;
  }

  .form-hint-text {
    display: none;
  }

  .form-hint-text.correct, #domain-example.correct {
    display: block;
    color: @corporate-color;
  }

  .form-hint-text.incorrect, #domain-example.incorrect {
    display: block;
    color: @error-color;
  }
}

.elem-frontend-cms-goods-item_edit-nutrition {
  overflow: hidden;

  .left-content {
    float: left;
    padding-right: 8px;
    width: 70%;
  }

  .right-content {
    float: left;
    padding-left: 8px;
    width: 30%;
  }
}

.elem-frontend-cms-goods-item_order-item {
  position: relative;
  cursor: grab;

  p.body1 {
    padding-top: 4px;
  }

  p.radio {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -18px;
    padding-bottom: 14px;

    label {
      display: block;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      height: auto;

      span {
        height: auto !important;
      }

      [type="radio"] + span:before, [type="radio"] + span:after {
        top: 50% !important;
        margin-top: -8px;
      }
    }

    label:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-goods-item_order-item:active, .elem-frontend-cms-goods-item_order-item:focus {
  cursor: grabbing;
}

.elem-frontend-cms-goods-items-article {

  span.caption {
    color: @corporate-color;
  }
}

.elem-frontend-cms-goods-order-item {
  position: relative;
  cursor: grab;

  p.body1 {
    padding-top: 4px;
  }

  p.radio {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -18px;
    padding-bottom: 14px;

    label {
      display: block;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      height: auto;

      span {
        height: auto !important;
      }

      [type="radio"] + span:before, [type="radio"] + span:after {
        top: 50% !important;
        margin-top: -8px;
      }
    }

    label:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-goods-order-item:active, .elem-frontend-cms-goods-order-item:focus {
  cursor: grabbing;
}

.elem-frontend-cms-goods-overview-charge {

  .status-area {
    position: relative;

    .radio {
      position: absolute;
      top: 7px;
      right: -16px;
    }
  }

  .charge-details {
    padding: 8px 0;
  }

  .status-area {
    padding: 8px 0;
    padding-right: 30px;
  }

  .online {
    color: @corporate-color;
  }

  .offline {
    color: @error-color;
  }

  .this-action-icons {
    overflow: hidden;
    padding-top: 8px;

    .icon-button {
      display: inline-block;
      padding: 8px 0;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }
  }

  span.inherit-text-format {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
  }

  span.inherit-text-format.interested {
    color: @attention-color;
  }

  span.inherit-text-format.reserved {
    color: @corporate-color;
  }

  span.inherit-text-format.is_delivered {
    color: @error-color;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-overview-charge_list {

}

.elem-frontend-cms-goods-overview-charge-bar {
  position: relative;
  padding: 8px 0;

  .status-slider {
    overflow: hidden;
    display: inline-block;
    position: relative;
    margin-top: 3px;
    border: 1px solid @dividers-color;
    border-radius: 7px;
    height: 14px;
    width: 100%;

    .status-slider-inner {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      border-radius: 7px;
      height: 12px;
      background-color: @corporate-color;
      -webkit-transition: width 0.5s, background-color 0.5s;
      -moz-transition: width 0.5s, background-color 0.5s;
      -ms-transition: width 0.5s, background-color 0.5s;
      -o-transition: width 0.5s, background-color 0.5s;
      transition: width 0.5s, background-color 0.5s;
    }

    .status-slider-inner.delivered {
      background-color: @error-color;
    }

    .interested {
      background-color: @attention-color;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-goods-overview-element-goods_menu {
  position: relative;

  .card {
    position: fixed;
    z-index: 50;
    bottom: 0;
    left: -300px;
    margin: 0;
    border-radius: 0;
    padding: 0;
    height: 100%;
    width: 300px;
    background-color: @dark-corporate-color;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;

    .action-list {
      padding-bottom: 110px;
      height: 100%;
      width: 300px;
      background-color: @dark-corporate-color;

      ul {
        overflow-y: auto;
        height: 100%;
        padding-left: 24px;

        li {

          a.inactive-button {
            cursor: inherit !important;

            span {
              color: @secondary-text-color !important;
              cursor: inherit !important;
            }
          }
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .action-list.show-list {
      height: 100%;
      width: 300px;
    }
  }

  .card.main-nav-active {
    left: 0;
    width: 300px;
  }

  @media @xs {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 30%;
    }
  }

  @media @sm {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 30%;
    }
  }

  @media @md {

  }
}


.elem-frontend-cms-goods-overview-element-item_amount_menu {
  position: relative;

  .card {
    position: fixed;
    z-index: 50;
    bottom: 0;
    left: -300px;
    margin: 0;
    border-radius: 0;
    padding: 0;
    height: 100%;
    width: 300px;
    background-color: @dark-corporate-color;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;

    .action-list {
      padding-bottom: 110px;
      height: 100%;
      width: 300px;
      background-color: @dark-corporate-color;

      ul {
        overflow-y: auto;
        height: 100%;
        padding-left: 24px;

        li {

          a.inactive-button {
            cursor: inherit !important;

            span {
              color: @secondary-text-color !important;
              cursor: inherit !important;
            }
          }
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .action-list.show-list {
      height: 100%;
      width: 300px;
    }
  }

  .card.main-nav-active {
    left: 0;
    width: 300px;
  }

  @media @xs {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 30%;
    }
  }

  @media @sm {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 30%;
    }
  }

  @media @md {

  }
}


.elem-frontend-cms-goods-popups-change_status {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }
}

.elem-frontend-cms-goods-popups-change_storage {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }
}

.elem-frontend-cms-goods-popups-change_status-content {

  .popup-head {
    position: relative;

    h3 {
      padding-right: 32px;
    }

    .delete-note {
      position: absolute;
      top: 8px;
      right: 8px;
      padding: 8px;
      font-size: 24px;
      color: @secondary-text-color;
      cursor: pointer;
    }
  }
}

.elem-frontend-cms-goods-popups-change_storage-content {

  .popup-head {
    position: relative;

    h3 {
      padding-right: 32px;
    }

    .delete-note {
      position: absolute;
      top: 8px;
      right: 8px;
      padding: 8px;
      font-size: 24px;
      color: @secondary-text-color;
      cursor: pointer;
    }
  }
}

.elem-frontend-cms-goods-status-radio {
  padding-bottom: 14px;

  label {
    display: block;
    border-bottom: 1px solid @dividers-color;
    padding: 8px 0;
    padding-right: 16px;
    height: auto;

    span {
      height: auto !important;
    }

    [type="radio"] + span:before, [type="radio"] + span:after {
      top: 50% !important;
      margin-top: -8px;
    }
  }

  .start-date {
    overflow: hidden;
  }

  .space-top {
    padding-top: 8px;
  }

  .elem-frontend-cms-elements-form-toggle {
    margin-bottom: 0;
  }

  .charge-end-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .charge-end-area.active-area {
    max-height: 500px;
  }

  label:last-child {
    border-bottom: none;
  }

  .additional-input-area {
    display: none;
    padding-top: 16px;
    overflow: hidden;

    .half-width-input {
      float: left;
      display: block;
      width: 50%;
    }

    .half-width-input:first-child {
      padding-right: 4px;
    }

    .half-width-input:last-child {
      padding-left: 4px;
    }
  }

  .additional-input-area.show-area {
    display: block;
  }
}

.elem-frontend-cms-marketing-overview {

  .card {
    padding: 0;

    .colorful-top-area {
      padding: 24px 48px;
      background-color: @dark-corporate-color;

      span {
        font-size: 48px;
        color: #ffffff;
      }
    }

    .card-inner-content {
      padding: 16px;
    }
  }

}

.elem-frontend-cms-marketing-additional_service-overview {

  .card {
    padding: 8px 0;

    .booked {
      overflow: hidden;
      padding: 4px 0;

      span {
        float: left;
        display: block;
        width: 50%;
      }
    }

    .status-area {
      position: relative;
      padding: 8px 0;
      padding-left: 32px;

      .open, .storno, .finished {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -12px;
        font-size: 24px;
      }

      .open {
        color: #96C9DC;
      }

      .storno {
        color: @error-color;
      }

      .finished {
        color: @corporate-color;
      }
    }

    section {
      padding: 16px;
    }

    ul {
      padding-left: 16px;

      li {
        position: relative;
        border-bottom: 1px solid @dividers-color;
        padding: 12px 0;
        padding-right: 16px;

        span.info {
          position: absolute;
          top: 50%;
          right: 8px;
          margin-top: -20px;
          padding: 8px;
          font-size: 24px;
          color: @corporate-color;
          cursor: pointer;
        }
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }

}

.elem-frontend-cms-marketing-additional_service-overview-additional_service {

}

.elem-frontend-cms-marketing-additional_service-popup-service_overview {


  .cancel {
    float: left;
    color: @hint-text-color;
  }

  .single-cancel {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-marketing-additional_service-popup-service_overview-content {

  .delivery-overview {
    padding-right: 16px;
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
  }

  .subhead {
    padding: 8px 0;
    padding-top: 16px;
  }

  .just-price {
    padding-top: 0;
  }

  .elem-frontend-cms-elements-form-select {
    margin: 0;
    margin-right: 16px;
  }

  a.inline-link {
    font-family: inherit;
    font-size: inherit;
    font-weight: @bold;
    color: @corporate-color;
  }
}

.elem-frontend-cms-marketing-discount-detail {

  .card {

  }

  .discount-info {
    p {
      padding-bottom: 8px;
    }
  }

  .card.no-entry {
    padding: 8px 16px;
  }

  .edit-button {

    span.material-icons {
      color: @corporate-color;
    }
  }
}

.elem-frontend-cms-marketing-discount-edit {

  .card {
    padding-bottom: 16px;

    .code-text {
      position: relative;
      border-bottom: 1px solid #9e9e9e;
      border-top-right-radius: 8px;
      border-top-left-radius: 8px;
      padding: 24px 16px;
      padding-bottom: 10px;
      padding-right: 48px;
      background-color: #ECECEC;

      span.input-title {
        position: absolute;
        top: 4px;
        left: 16px;
        color: @secondary-text-color;
      }

      span.material-icons {
        position: absolute;
        top: 50%;
        right: 16px;
        margin-top: -12px;
        font-size: 24px;
        color: @hint-text-color;
      }
    }

    .code-value-area {
      overflow: hidden;
      max-height: 0;
      -webkit-transition: max-height 0.3ms;
      -moz-transition: max-height 0.3ms;
      -ms-transition: max-height 0.3ms;
      -o-transition: max-height 0.3ms;
      transition: max-height 0.3ms;
    }

    .code-value-area.active-area {
      max-height: 500px;
    }

    .datepicker-area {
      overflow: hidden;
      max-height: 0;
      -webkit-transition: max-height 0.3ms;
      -moz-transition: max-height 0.3ms;
      -ms-transition: max-height 0.3ms;
      -o-transition: max-height 0.3ms;
      transition: max-height 0.3ms;

      .datepicker-half {
        float: left;
        width: 50%;
      }

      .datepicker-half:first-child {
        padding-right: 8px;
      }

      .datepicker-half:last-child {
        padding-left: 8px;
      }
    }

    .datepicker-area.active-area {
      max-height: 500px;
    }

    .input-area {
      .caption {
        padding-left: 16px;
      }
    }
  }

  .status-message {
    display: none;
  }

  .status-message.error {
    display: block;
    color: @error-color;
  }

  .status-message.available {
    display: block;
    color: @corporate-color;
  }

  .card.no-side-padding {
    padding: 8px 0;
    padding-left: 16px;

    .card-content-area {
      border-bottom: 1px solid @dividers-color;
      padding-right: 16px;
      padding-bottom: 16px;
    }

    .card-content-area:last-child {
      border-bottom: none;
      padding-bottom: 0;
    }
  }

  .radio {
    padding: 4px 0;

    [type="radio"]:not(:checked) + span, [type="radio"]:checked + span {
      height: 24px!important;
      line-height: 15px;
    }
  }

  .code-value-area-outer {
    padding: 8px 0;

    .radio {
      padding: 0;
    }
  }

  .card.no-entry {
    padding: 8px 16px;
    padding-bottom: 12px;
  }
}

.elem-frontend-cms-marketing-discount-overview {

  .toggle-outer {
    padding: 16px 0;

    .toggle {
      overflow: hidden;
      border-radius: @basic-border-radius;
      border: 1px solid @corporate-color;

      a {
        float: left;
        padding: 16px 8px;
        width: 50%;
        background-color: #ffffff;
        color: @secondary-text-color;
      }

      a.active {
        border: 1px solid @corporate-color;
        border-top: none;
        border-bottom: none;
        background-color: rgba(130, 197, 93, 0.2);
        color: @text-color;
        font-weight: @medium;
      }
    }
  }

  .print-area {
    padding-bottom: 8px;

    a {
      span {
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
      }
    }
  }

  .card {
    padding: 8px 0;

    ul {
      padding-left: 16px;

      li {
        position: relative;
        border-bottom: 1px solid @dividers-color;
        padding: 12px 0;
        padding-right: 16px;

        .discount-link {
          display: block;
        }

        h2.subhead {
          color: @corporate-color;
        }

        .additional-infos {
          position: absolute;
          top: 8px;
          right: 16px;

          .status {
            padding-bottom: 4px;
            color: @corporate-color;
          }
        }

        .max-usage {
          position: relative;
          padding-right: 80px;

          .amount {
            position: absolute;
            top: 0;
            right: 0;
          }
        }

        .valid-date {
          padding-top: 8px;
        }

        .additional-infos {
          .status.inactive {
            color: @error-color;
          }
        }
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }

  .card.no-entry {
    padding: 8px 16px;
  }
}

.elem-frontend-cms-marketing-discount-detail-discount_list.no-side-padding {
  padding: 8px 0;
  padding-left: 16px;

  h2.title {
    padding-top: 8px;
    padding-bottom: 16px;
  }

  p {
    padding: 2px 0;
  }

  ul {
    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 12px 0;
      padding-right: 16px;

      p {
        padding: 0;
      }

      .discount-link {
        display: block;
      }

      h2.subhead {
        color: @corporate-color;
      }

      .additional-infos {
        position: absolute;
        top: 50%;
        right: 8px;
        margin-top: -20px;
        padding: 8px;
        cursor: pointer;

        span.material-icons {
          color: @secondary-text-color;
        }
      }
    }

    li:first-child {
      padding-top: 0;
    }

    li:last-child {
      border-bottom: none;
    }
  }
}


.elem-frontend-cms-marketing-facebook_groups-manual {

  .card {

    .content-step {
      padding: 8px 0;

      p.caption {
        padding-bottom: 4px;
      }
    }
  }
}

.elem-frontend-cms-marketing-facebook_groups-overview {

  .print-area {
    padding-bottom: 16px;

    a {

      span {
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
      }
    }
  }

  .toggle-outer {
    padding: 16px 8px;

    .toggle {
      overflow: hidden;
      border-radius: @basic-border-radius;
      border: 1px solid @corporate-color;

      a {
        float: left;
        padding: 16px 8px;
        width: 50%;
        background-color: #ffffff;
        color: @secondary-text-color;
      }

      a.active {
        border: 1px solid @corporate-color;
        background-color: rgba(130, 197, 93, 0.2);
        color: @text-color;
        font-weight: @medium;
      }
    }
  }

  .open-popup-area {
    padding-top: 16px;
  }

  .card {
    padding: 0;

    section {
      padding: 16px;
    }

    ul {
      padding-left: 16px;

      li {
        border-bottom: 1px solid @dividers-color;

        a {
          overflow: hidden;
          display: block;
          padding: 8px 0;
          padding-right: 16px;

          span {
            float: left;
            display: block;
            width: 70%;
          }

          span:last-child {
            width: 30%;
          }
        }
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }

}

.elem-frontend-cms-marketing-facebook_groups-overview-group_card.card {
  position: relative;
  padding: 0;

  .group-head {
    position: relative;
    padding: 16px;
    padding-right: 120px;

    .members {
      position: absolute;
      top: 50%;
      right: 16px;
      margin-top: -12px;
      vertical-align: middle;

      span {
        display: inline-block;
        padding-right: 8px;
        vertical-align: middle;
        color: inherit;
      }
    }
  }

  .info-button {
    cursor: pointer;
  }

  .group-content {

    .group_name, .note-area {
      position: relative;

      .group-link  {
        display: block;
        padding: 8px 16px;
        padding-right: 0;
        color: @corporate-color;
      }

      p.secondary-text-color {
        padding-right: 32px;
      }

      .copy-area, .note-area-edit {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 8px;
        margin-top: -20px;
        padding: 8px;
        color: @corporate-color;
        cursor: pointer;
        font-size: 24px;
      }
    }

    .note-area, .distance {
      padding: 8px 16px;
    }

    .distance {
      vertical-align: middle;

      .info-button {
        display: inline-block;
        padding: 0 8px;
        color: @secondary-text-color;
        vertical-align: middle;
      }
    }
  }

  .group-footer {
    position: relative;
    padding: 16px;
    padding-right: 160px;

    .send-date {
      cursor: pointer;
    }

    p {
      span {
        font-size: inherit;
        font-weight: inherit;
        color: inherit;
      }
    }

    .add-area {
      display: inline-block;
      position: absolute;
      top: 50%;
      right: 0;
      margin-top: -16px;
      vertical-align: middle;

      p {
        display: inline-block;
        vertical-align: middle;
        color: @corporate-color;
      }

      a {
        display: inline-block;
        padding: 8px 16px;
        vertical-align: middle;

        span {
          margin-top: -8px;
          font-size: 32px;
          color: @corporate-color;
        }
      }
    }
  }
}

.elem-frontend-cms-marketing-facebook_groups-overview-note_popup {
  .card {
    border-radius: 0 !important;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-bottom: 16px;
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  #confirmation.hide-button {
    display: none;
  }

  #cancel {
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }

  #cancel.highlight-button {
    color: @corporate-color;
  }

  #cancel.highlight-button:hover {
    color: @corporate-color;
  }
}

.elem-frontend-cms-marketing-facebook_groups-overview-note_popup.active-popup {
  display: block;
}

.elem-frontend-cms-marketing-facebook_groups-overview-post_popup {
  .card {
    border-radius: 0 !important;
    padding: 0;
    width: 328px !important;

    .popup-head {
      padding: 16px;
    }

    .popup-footer {
      padding: 16px 0;
    }
  }

  #group-post-list {
    padding: 0 16px;
    padding-right: 0;

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      padding-right: 54px;

      .delete-post {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 8px;
        margin-top: -20px;
        padding: 10px;

        span {
          font-size: 26px;
        }
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-marketing-facebook_groups-overview-post_popup.active-popup {
  display: block;
}

.elem-frontend-cms-marketing-facebook_groups-overview-zip_popup {
  .card {
    border-radius: 0 !important;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-bottom: 16px;
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  #confirmation.hide-button {
    display: none;
  }

  #cancel {
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }

  #cancel.highlight-button {
    color: @corporate-color;
  }

  #cancel.highlight-button:hover {
    color: @corporate-color;
  }
}

.elem-frontend-cms-marketing-facebook_groups-overview-zip_popup.active-popup {
  display: block;
}

.elem-frontend-cms-marketing-facebook_groups-overview-group_card-loader_overlay {
  display: none;
  position: absolute;
  z-index: 80;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
  background-color: rgba(255, 255, 255, 0.7);

  img {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -35px;
    margin-left: -35px;
    height: 70px;
    width: auto;
  }

  .outer-loader {
    position: absolute;
    top: 50%;
    right: 50%;
    margin-top: -60px;
    margin-right: -60px;
    height: 120px;
    width: 120px;
  }

  .preloader-wrapper {
    height: 120px;
    width: 120px;
  }

  .progress {
    display: none;
    margin-top: 2.5rem !important;
  }

  .progress.show-loader {
    display: block;
  }
}

.elem-frontend-cms-marketing-facebook_groups-overview-group_card-loader_overlay.active-loader {
  display: block;
}

.elem-frontend-cms-marketing-facebook_groups-overview-group_card-status {
  display: block;
  position: relative;

  .select {
    display: none;
    position: relative;
    border: 1px solid @dividers-color;
    border-radius: 8px;
    padding: 12px 48px;
    min-width: 200px;
    cursor: pointer;

    span {
      position: absolute;
      top: 50%;
      margin-top: -16px;
      font-size: 32px;
      color: inherit;
    }

    .status-icon {
      left: 8px;
    }

    .drop-down-icon {
      right: 8px;
    }
  }

  .select.is-active-status {
    display: inline-block;
  }

  .select-options-outer {
    overflow: hidden;
    display: block;
    position: absolute;
    z-index: 20;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0 16px;
    padding-right: 0;
    max-height: 0;
    width: 200px;
    -webkit-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -moz-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -ms-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -o-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;

    .elem-frontend-cms-elements-form-radio {
      padding-bottom: 0 !important;
    }
  }

  .select-options-outer.select-is-open {
    padding-top: 4px;
    padding-bottom: 4px;
    max-height: 500px;
  }
}

.elem-frontend-cms-marketing-form-limited_input {

  .elem-frontend-cms-elements-form-input_text {
    margin-bottom: 4px;
  }

  .text-counter-hint {
    padding-bottom: 8px;
    padding-left: 24px;

    span {
      color: inherit;
      font-weight: inherit;
      font-size: inherit;
      font-family: inherit;
    }

    span.error {
      color: @error-color;
    }
  }

  .text-counter-hint.error {
    color: @error-color;
  }
}

.elem-frontend-cms-marketing-form-limited_simple_input {

  .elem-frontend-cms-elements-form-input_text {
    margin-bottom: 4px;
  }

  .text-counter-hint {
    padding-bottom: 8px;
    padding-left: 24px;

    span {
      color: inherit;
      font-weight: inherit;
      font-size: inherit;
      font-family: inherit;
    }

    span.error {
      color: @error-color;
    }
  }

  .text-counter-hint.error {
    color: @error-color;
  }
}

.elem-frontend-cms-marketing-friedhold_coaching-overview {
  padding-bottom: 40px;

  .card {
    overflow: hidden;
    position: relative;
    padding: 0;

    .play-img {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      height: auto;
      width: 100%;
      cursor: pointer;
    }

    .play-img.is-active {
      display: none;
    }

    video {
      height: auto;
      width: 100%;
    }

    .inner-content {
      padding: 8px 16px;

      h2 {
        padding: 8px 0;
      }

      p {
        padding: 8px 0;

        a {
          color: @corporate-color;
          font-size: inherit;
          font-weight: inherit;
          text-decoration: underline;
        }

        a:hover {
          text-decoration: none;
        }

        span.ul {
          display: block;
          padding: 8px 24px;
          font-size: inherit;
          font-weight: inherit;
          color: inherit;
          line-height: inherit;

          span.li {
            display: list-item;
            padding: 4px 0;
            list-style: disc;
            font-size: inherit;
            font-weight: inherit;
            color: inherit;
            line-height: inherit;
          }
        }
      }

      .check-area {
        padding: 12px 0;
      }
    }
  }

  .show-all-outer {
    padding: 16px 0;

    span.show-all-btn {
      span {
        display: inline-block;
        padding-right: 8px;
        color: inherit;
        font-size: 26px;
        vertical-align: inherit;
      }
    }
  }

  .video-navigation {
    overflow: hidden;

    a, span.disabled-btn {
      float: left;
      display: block;
      width: 50%;
      vertical-align: middle;

      span {
        display: inline-block;
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
        line-height: inherit;
        text-align: center;
      }

      span.material-icons.icon-right {
        padding-left: 4px;
      }
    }
  }

  .card {
    padding: 0;

    ul {
      padding-left: 16px;
    }
  }

}

.elem-frontend-cms-marketing-friedhold_coaching-overview-list_popup {
  .card {
    border-radius: 0 !important;
    padding: 0;
    width: 328px !important;

    .popup-body {
      padding: 8px 0;

      h3 {
        padding: 8px 16px;
      }

      ul {
        padding: 8px 0;
        padding-left: 16px;

        li {
          position: relative;
          border-bottom: 1px solid @dividers-color;
          padding: 8px 0;
          padding-right: 46px;

          .page-link {
            display: inline-block;
            position: absolute;
            top: 50%;
            right: 16px;
            margin-top: -18px;
            font-size: 28px;
            color: @corporate-color;
          }
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .popup-footer {
      padding: 8px 0;
    }
  }
}

.elem-frontend-cms-marketing-friedhold_coaching-overview-list_popup.active-popup {
  display: block;
}

.elem-frontend-cms-marketing-hashtags-overview {

}

.elem-frontend-cms-marketing-hashtags-overview-generator {

  .action-area.first {
    padding-top: 16px;
    padding-left: 16px;
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding: 3px 16px;
      padding-left: 0;
      vertical-align: bottom;
    }

    .elem-frontend-cms-elements-form-checkbox {
      display: inline-block;
      vertical-align: middle;
    }
  }

  .card {
    padding: 0;

    .add-surrounding-space {
      padding: 8px 16px;
    }

    .more-space-top-bottom {
      padding: 8px 0;
    }

    .add-side-space {
      overflow: hidden;
      padding: 0 16px;

      .half-width {
        float: left;
        width: 50%;
      }
    }

    ul {
      padding-left: 16px;
    }
  }

  .hashtag-info {
    padding-bottom: 4px;
    p {
      span {
        color: inherit;
        font-size: inherit;
        font-family: inherit;
        font-weight: inherit;
      }
    }
  }

  .hashtag-info.error {
    p {
      color: @error-color;
      font-weight: 500;
    }
  }

  .copy-area {
    padding-top: 8px;

    span {
      display: inline-block;
      padding: 8px;
      color: @corporate-color;
      cursor: pointer;
    }
  }
}

.elem-frontend-cms-marketing-newsletter-customer {
  height: 100%;

  .card.info-table {
    padding: 0;

    h1 {
      padding-bottom: 24px;
    }

    .subhead.medium {
      padding-top: 8px;
    }

    .info-table-head {
      padding: 0 16px;
      padding-top: 24px;
    }

    .info-table-content {
      overflow: hidden;
      margin-top: -22px;
      padding: 0 16px;
      padding-bottom: 24px;

      .info-table-content-column {
        float: left;
        width: 50%;

        .material-icons {
          display: inline-block;
          padding: 8px;
          padding-bottom: 16px;
          font-size: 24px;
        }

        .material-icons.rotate-45 {
          padding-right: 16px;
          padding-bottom: 8px;
          -webkit-transform: rotate(90deg);
          -moz-transform: rotate(90deg);
          -ms-transform: rotate(90deg);
          -o-transform: rotate(90deg);
          transform: rotate(90deg);
        }

        .material-icons.neg-rotate-45 {
          padding-bottom: 8px;
          padding-left: 16px;
          -webkit-transform: rotate(-90deg);
          -moz-transform: rotate(-90deg);
          -ms-transform: rotate(-90deg);
          -o-transform: rotate(-90deg);
          transform: rotate(-90deg);
        }

        .checkbox {
          label {
            margin-right: -14px;
          }
        }
      }

      .info-table-content-column:first-child {
        padding-right: 24px;
      }

      .info-table-content-column:last-child {
        padding-left: 24px;
      }
    }

    .info-table-new-customers {
      border-top: 1px solid @dividers-color;
      padding: 24px 16px;

      p.caption {
        padding-top: 4px;
      }

      .checkbox-area {
        padding-top: 24px;
      }
      .checkboxtitle  {
        font-weight: 500;
      }
    }
  }

  article {
    padding: 16px 24px;

    h1 {

    }

    p {
      line-height: 20px;
    }

    p.has_top-padding {
      padding-top: 16px;
      padding-bottom: 16px;
    }
  }
}

.elem-frontend-cms-marketing-newsletter-design {

  .print-area {
    padding-bottom: 8px;

    a {

      span {
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
      }
    }
  }

  .card {
    padding: 0;

    .corporate-head {
      padding: 32px 16px;

      h1, p {
        color: #ffffff;
      }

      h1 {
        padding-bottom: 8px;
      }
    }

    .newsletter-content {
      padding: 32px 16px;

      h2 {
        padding-bottom: 24px;
      }

      p {
        padding-bottom: 16px;
      }
    }

    .newsletter-footer-outer {
      padding: 0 16px;

      .newsletter-footer {
        border-top: 2px solid @dividers-color;
        padding: 32px 0;
        background-color: #FFFFFF;

        .app-images {
          padding: 24px 16px;

          img:first-child {
            display: inline-block;
            margin-right: 24px;
          }

          img:last-child {
            display: inline-block;
            margin-left: 24px;
          }
        }

        p.title {
          padding-bottom: 8px;
          color: @text-color;
        }

        p.body1, p.caption {
          color: @secondary-text-color;
        }

        p.body1 {
          padding: 4px 0;
        }

        a.body1, span.body1 {
          display: block;
          padding: 8px 16px;
          color: @secondary-text-color;
        }

        .link-area {
          padding-top: 24px;
        }

        .link-area:first-child {
          padding-top: 0;
        }

        .disclaimer {
          padding-top: 24px;
        }
      }
    }

    .finish {
      padding-top: 24px;

      a {
        font-size: inherit;
        font-weight: inherit;
        color: inherit;
        text-decoration: underline;
      }

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

  .logo-image {
    display: inline-block;
    height: auto;
    width: 60%;
  }

  @media @xs {
    .newsletter-footer-outer {
      padding: 0 16px;

      .newsletter-footer {
        border-top: 2px solid @dividers-color;
        padding: 32px 0;
        background-color: #FFFFFF;

        .app-images {
          padding: 24px 16px;

          img:first-child {
            display: inline-block;
            margin: 0 24px;
            margin-bottom: 16px;
          }

          img:last-child {
            display: inline-block;
            margin: 0 24px;
            margin-top: 16px;
          }
        }
      }
    }
  }
}

.elem-frontend-cms-marketing-newsletter-detail {

  .status-card {
    position: relative;
    padding: 16px 16px;

    p.subhead {
      padding-left: 48px;
    }

    span {
      position: absolute;
      top: 11px;
      left: 16px;
      font-size: 32px;
    }

    .link-area {
      padding-top: 16px;
    }
  }

  .has-send {
    border: 2px solid @corporate-color;

    span {
      color: @corporate-color;
    }
  }

  .info-card {
    padding-right: 0;

    ul {
      li {
        position: relative;
        border-bottom: 1px solid @dividers-color;
        padding: 8px 16px;
        padding-left: 48px;

        span {
          position: absolute;
          top: 50%;
          left: 0;
          margin-top: -16px;
          font-size: 32px;
        }
      }

      li.dismiss-area {
        span.material-icons {
          color: @hint-text-color;
        }

        p.subhead {
          color: @hint-text-color;
        }
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }
  .not-send {
    border: 2px solid @primary-red-color;

    span {
      color: @primary-red-color;
    }
  }

  .is-planned {
    border: 2px solid @progress-color;

    span {
      color: @progress-color;
    }
  }

  .is-special {
    color: @corporate-color;
  }

  .card-footer {
    padding: 4px 16px;
  }

  .design-area {
    padding: 16px 0;

    .subhead {
      padding-bottom: 16px;
    }
  }
}

.elem-frontend-cms-marketing-newsletter-manual {

  .card {

    .content-step {
      padding: 8px 0;

      p.caption {
        padding-bottom: 4px;
      }
    }
  }
}

.elem-frontend-cms-marketing-newsletter-overview {

  .print-area {
    padding-bottom: 16px;

    a {

      span {
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
      }
    }
  }

  .card {
    padding: 0;

    ul {
      padding-left: 16px;
    }
  }

}

.elem-frontend-cms-marketing-newsletter-ready {

  .deliverydate {
    padding-bottom: 16px;

    .datefrom {
      overflow: hidden;

      .from {
        float: left;
        padding-right: 8px;
        width: 50%;

        .elem-frontend-cms-elements-form-datepicker {
          margin: 0;
        }
      }

      .to {
        float: left;
        padding-left: 8px;
        width: 50%;

        .elem-frontend-cms-elements-form-timepicker {
          margin: 0;
        }
      }
    }
  }

  .do-it-later {
    padding-top: 16px;
  }
}

.elem-frontend-cms-marketing-newsletter-syf_app {
  .further-content {
    overflow: hidden;
    padding: 0;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    .card-padding {
      padding: 8px 16px;
    }
  }

  .further-content.active-content {
    max-height: 2000px;
  }

  .add-content {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    .add-content-inner {
      overflow: hidden;
      padding: 16px 0;
      padding-bottom: 8px;
    }

    .add-image {
      float: left;
      width: 50%;

      label {
        input {
          display: none;
        }
      }
    }
  }

  .image.card {
    overflow: hidden;
    padding: 0;

    video {
      width: 100%;
    }

    .img-outer {
      position: relative;
      padding-bottom: 60px;
      min-height: 220px;

      img {
        height: auto;
        width: 100%;
      }

      .this-cta-area {
        position: absolute;
        bottom: 0;
        left: 0;
        height: 60px;
        width: 100%;

        a {
          display: inline-block;
          position: absolute;
          right: 0;
          bottom: 0;
          padding: 16px;

          span {
            color: @secondary-text-color;
          }
        }

        a.delete {
          left: 0;
        }
      }
    }
  }

  .error-message {
    display: none;

    p {
      color: @error-color;
    }
  }

  .error-message.show-error {
    display: block;
  }

  .add-content.active-content {
    max-height: 2000px;
  }
}

.elem-frontend-cms-marketing-newsletter-text {
  height: 100%;
}

.elem-frontend-cms-marketing-newsletter-customer-customer_list-item {

  .customer_id {
    padding-top: 8px;
  }

  h2 {
    padding-bottom: 16px;
  }

  .address {
    padding-bottom: 8px;
  }

  .this-action-icons {
    overflow: hidden;
    padding-top: 16px;

    .icon-button {
      float: left;
      display: inline-block;
      padding: 8px 13px;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }

    .icon-button:first-child {
      padding-left: 0;
    }

    .icon-button:last-child {
      padding-right: 0;
    }

    .icon-button.right-align {
      float: right;
    }
  }

  .action-area {
    position: relative;
    padding-top: 16px;

    .edit-icon-button {
      position: absolute;
      bottom: 0;
      left: 0;
    }

    .elem-frontend-cms-elements-form-checkbox {
      float: right;
      display: inline-block;
      padding: 2px 0;
      width: 20px;
    }
  }

  .checkbox-row {
    padding: 4px 0;

    span.body1 {
      display: inline-block;
      padding-top: 3px;
      padding-right: 16px;
    }
  }

  .app-user-info {
    p {
      position: relative;
      padding: 8px 16px;
      padding-left: 36px;

      .app-user {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -12px;
        font-size: 24px;
        color: @corporate-color;
      }

      .no-app-user {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -12px;
        font-size: 24px;
        color: @error-color;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-marketing-newsletter-detail-image {
  img {
    height: auto;
    width: 100%;
  }
}

.elem-frontend-cms-marketing-newsletter-detail-video {
  video {
    width: 100%;
  }
}

.elem-frontend-cms-marketing-newsletter-overview-item {
  border-bottom: 1px solid @dividers-color;
  padding: 16px;
  padding-left: 0;

  .delivery-status {
    padding-top: 16px;
  }

  .is-delivered {
    color: @corporate-color;
  }

  .not-delivered {
    color: @primary-red-color;
  }
}

.elem-frontend-cms-marketing-newsletter-overview-item:last-child {
  border-bottom: none;
}

.elem-frontend-cms-marketing-newsletter-syf_app-edit {
  height: 100%;

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-marketing-overview-item.card {
  overflow: hidden;

  .colorful-top-area {
    position: relative;

    .premium {
      display: block;
      position: absolute;
      top: 22px;
      left: -50px;
      padding: 4px 24px;
      width: 240px;
      background-color: #FFFFFF;
      -webkit-transform: rotate(-24deg);
      -moz-transform: rotate(-24deg);
      -o-transform: rotate(-24deg);
      -ms-transform: rotate(-24deg);
      transform: rotate(-24deg);
      font-size: 12px;
      font-weight: 700;
      color: @corporate-color;
    }
  }
}

.elem-frontend-cms-marketing-social_media-change_subtitle {

  .template-heading {
    padding-top: 24px;
  }

  .scene.card {
    padding: 0;

    .this-card-head {
      padding: 16px;
    }

    .this-card-body {
      padding: 0 16px;
      padding-right: 0;

      ul {

        li {
          border-bottom: 1px solid @dividers-color;
          padding: 8px 0;
          padding-right: 16px;
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .this-card-footer {
      padding: 0;
      padding-bottom: 16px;
    }
  }
}

.elem-frontend-cms-marketing-social_media-media_detail {
  .print-area {
    padding-bottom: 16px;

    p.title {
      padding-bottom: 16px;
    }

    a {

      span {
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
      }
    }
  }
}

.elem-frontend-cms-marketing-social_media-media_detail_video {

  .template-heading {
    padding-top: 24px;
  }

  .card {
    padding: 8px 0;

    .this-card-content {
      padding: 8px 16px;
      padding-top: 16px;
    }

    section {
      padding-bottom: 8px;
    }

    .this-side-padding-content {
      padding: 0 16px;
    }

    .card-content-bottom-border {
      border-bottom: 1px solid @dividers-color;
    }

    .not-ready-outer {
      padding: 8px 0;
      padding-bottom: 16px;

      .in-progress {
        border-radius: 8px;
        padding: 6px 24px;
        background-color: @corporate-color;
        color: #FFFFFF;
      }
    }
  }

  .video-card {
    overflow: hidden;
    padding-top: 0;
  }

  .download-links {
    padding-top: 8px;
    padding-left: 16px;

    li {
      position: relative;
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;

      p {
        padding-right: 70px;
      }

      a {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 8px;
        margin-top: -20px;
        padding: 8px;
        font-size: 24px;
        color: @corporate-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  video {
    height: auto;
    width: 100%;
  }

  .video-not-ready {
    border-bottom: 1px solid @dividers-color;

    img {
      width: 100%;
    }
  }

  .scene.card {
    padding: 0;

    .this-card-head {
      padding: 16px;
    }

    .this-card-body {
      padding: 0 16px;
      padding-right: 0;

      ul {

        li {
          border-bottom: 1px solid @dividers-color;
          padding: 8px 0;
          padding-right: 16px;
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .this-card-footer {
      padding: 0;
      padding-bottom: 16px;
    }
  }

  .delete-video-area {
    padding-top: 16px;

    a.btn {
      background-color: @dividers-color;
      color: @secondary-text-color !important;
    }

    a.btn:hover {
      background-color: @dividers-color;
      color: @secondary-text-color !important;
    }
  }
}

.elem-frontend-cms-marketing-social_media-media_edit {

  .source-description {
    display: none;
  }

  .source-description.active-description {
    display: block;
  }

  .media-card {
    overflow: hidden;
    padding: 0;
  }

  .add-image {
    padding: 8px 0;
    padding-top: 16px;

    label {
      input {
        display: none;
      }
    }
  }

  .input-card {
    p {
      padding-top: 8px;

      a {
        font-size: inherit;
        font-weight: inherit;
        font-family: inherit;
        font-style: inherit;
        color: @corporate-color;
      }
    }

    p:first-child {
      padding-top: 0;
    }
  }

  .error-message {
    display: none;

    p {
      color: @error-color;
    }
  }

  .error-message.show-error {
    display: block;
  }

  .delete-area {
    padding-top: 16px;

    a.btn {
      background-color: @dividers-color;
      color: @secondary-text-color !important;
    }

    a.btn:hover {
      background-color: @dividers-color;
      color: @secondary-text-color !important;
    }
  }
}



.elem-frontend-cms-marketing-social_media-overview {

  .print-area {
    padding-bottom: 16px;

    a {

      span {
        color: inherit;
        font-size: 20px;
        vertical-align: inherit;
      }
    }
  }

  .toggle-outer {
    padding: 16px 8px;

    .toggle {
      overflow: hidden;
      border-radius: @basic-border-radius;
      border: 1px solid @corporate-color;

      a {
        float: left;
        padding: 16px 8px;
        width: 50%;
        background-color: #ffffff;
        color: @secondary-text-color;
      }

      a.active {
        border: 1px solid @corporate-color;
        background-color: rgba(130, 197, 93, 0.2);
        color: @text-color;
        font-weight: @medium;
      }
    }
  }

  .card {
    padding: 0;

    section {
      padding: 16px;
    }

    ul {
      padding-left: 16px;

      li {
        border-bottom: 1px solid @dividers-color;

        a {
          overflow: hidden;
          display: block;
          padding: 8px 0;
          padding-right: 16px;

          span {
            float: left;
            display: block;
            width: 70%;
          }

          span:last-child {
            width: 30%;
          }
        }
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }

}

.elem-frontend-cms-marketing-social_media-select_media {

  .template-heading {
    padding-top: 24px;
  }

  .scene.card {
    padding: 0;

    .this-card-head {
      padding: 16px;
    }

    .this-card-body {
      padding: 0 16px;
      padding-right: 0;

      ul {

        li {
          border-bottom: 1px solid @dividers-color;
          padding: 8px 0;
          padding-right: 16px;
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .this-card-footer {
      padding: 0;
      padding-bottom: 16px;
    }
  }
}

.elem-frontend-cms-marketing-social_media-select_product {
  .template-heading {
    padding-top: 24px;
  }

  .card {
    padding: 8px 0;
    padding-left: 16px;

    .this-card-head {
      padding: 16px;
    }

    .this-card-body {
      padding: 0 16px;
      padding-right: 0;
    }

    .this-card-footer {
      padding: 0;
      padding-bottom: 16px;
    }
  }
}

.elem-frontend-cms-marketing-social_media-select_recommendation {

  .template-heading {
    padding-top: 24px;
  }

  .scene.card {
    padding: 0;

    .this-card-head {
      padding: 16px;
    }

    .this-card-body {
      padding: 0 16px;
      padding-right: 0;

      ul {

        li {
          border-bottom: 1px solid @dividers-color;
          padding: 8px 0;
          padding-right: 16px;
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .this-card-footer {
      padding: 0;
      padding-bottom: 16px;
    }
  }
}

.elem-frontend-cms-marketing-social_media-select_template {
  .card {
    padding: 0;

    .video-not-ready {
      border-bottom: 1px solid @dividers-color;

      img {
        width: 100%;
      }
    }

    .this-card-content {
      padding: 8px 16px;
      padding-top: 16px;

      h2 {
        padding-bottom: 4px;
      }

      p.description {
        padding-top: 8px;
      }
    }

    .img-outer {
      overflow: hidden;

      img {
        width: 100%;
      }
    }
  }

  .card.no-entry {
    padding: 8px 16px;
  }

  .this-action-icons {
    overflow: hidden;
    padding: 16px;
  }
}

.elem-frontend-cms-marketing-social_media-write_article {

  .template-heading {
    padding-top: 24px;
  }

  .scene.card {
    padding: 0;

    .this-card-head {
      padding: 16px;
    }

    .this-card-body {
      padding: 0 16px;
      padding-right: 0;

      ul {

        li {
          border-bottom: 1px solid @dividers-color;
          padding: 8px 0;
          padding-right: 16px;
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .this-card-footer {
      padding: 0;
      padding-bottom: 16px;
    }
  }
}

.elem-frontend-cms-marketing-social_media-media_detail-media_card.card {
  overflow: hidden;
  padding: 0;
  padding-bottom: 8px;

  .this-content {
    padding: 8px 16px;
    padding-top: 16px;

    h2 {
      padding-bottom: 4px;
    }

    p.description {
      padding-top: 8px;
    }
  }

  .img-outer {
    overflow: hidden;

    img {
      width: 100%;
    }
  }

  .this-action-icons {
    overflow: hidden;
    padding-top: 8px;

    .icon-button {
      float: right;
      display: inline-block;
      padding: 8px 13px;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }
  }
}

.elem-frontend-cms-marketing-social_media-media_detail-sources-video {
  video {
    height: auto;
    width: 100%;
  }
}

.elem-frontend-cms-marketing-social_media-media_detail_video-description {

  .copy-area {
    padding-top: 8px;

    span {
      display: inline-block;
      margin-left: 16px;
      padding: 8px;
      cursor: pointer;
    }
  }
}

.elem-frontend-cms-marketing-social_media-media_detail_video-radio {
  padding-bottom: 14px;

  ol {
    padding-left: 16px;

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;

      .play-icon {
        position: absolute;
        top: 50%;
        right: 16px;
        margin-top: -15px;
        height: 32px;
        width: 32px;
        cursor: pointer;
      }

      .play-icon:hover {
        color: @corporate-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  label {
    display: block;
    padding: 8px 0;
    padding-right: 48px;
    height: auto;

    span {
      height: auto !important;
    }

    [type="radio"] + span:before, [type="radio"] + span:after {
      top: 50% !important;
      margin-top: -8px;
    }
  }
}

.elem-frontend-cms-marketing-social_media-media_edit-item {

  .img-outer {
    position: relative;
    min-height: 220px;

    img {
      width: 100%;
    }
  }

  .this-action-icons {
    overflow: hidden;
    padding-top: 8px;

    .icon-button {
      float: right;
      display: inline-block;
      padding: 8px 13px;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }
  }
}

.elem-frontend-cms-marketing-social_media-media_edit-video {

  video {
    position: relative;
    height: auto;
    width: 100%;
  }

  .this-action-icons {
    overflow: hidden;
    position: relative;
    padding: 8px 16px;

    .icon-button {
      display: inline-block;
      position: absolute;
      top: 0;
      right: 0;
      padding: 8px 13px;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }
  }
}

.elem-frontend-cms-marketing-social_media-overview-company_video_list {
  padding-top: 16px;

  .card {
    overflow: hidden;
    padding: 0;

    .this-card-content {
      padding: 8px 16px;
      padding-top: 16px;

      h2 {
        padding-bottom: 4px;
      }

      p.description {
        padding-top: 8px;
      }
    }

    .img-outer {
      overflow: hidden;

      img {
        width: 100%;
      }
    }
  }

  video {
    height: auto;
    width: 100%;
  }

  .video-not-ready {
    border-bottom: 1px solid @dividers-color;

    img {
      width: 100%;
    }
  }

  .card.no-entry {
    padding: 8px 16px;
  }

  .this-action-icons {
    overflow: hidden;
    padding-top: 8px;

    .icon-button {
      float: right;
      display: inline-block;
      padding: 8px 13px;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }
  }
}

.elem-frontend-cms-marketing-social_media-select_media-audio {
  position: relative;

  h2 {
    padding: 0 26px;
    padding-bottom: 8px;
  }

  .scene-type {
    position: absolute;
    top: 16px;
    right: 16px;
  }

  .this-action-icons {

    a {
      vertical-align: middle;
      span {
        display: inline-block;
        color: inherit;
        vertical-align: middle;
      }
    }
  }
}

.elem-frontend-cms-marketing-social_media-select_media-media_popup {
  .card {
    border-radius: 0 !important;
    padding: 0;
    width: 328px !important;

    .popup-body {
      padding: 0;
    }

    .popup-footer {
      padding: 8px 0;
    }
  }
}

.elem-frontend-cms-marketing-social_media-select_media-media_popup.active-popup {
  display: block;
}

.elem-frontend-cms-marketing-social_media-select_media-radio {
  padding-bottom: 14px;

  ol {
    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;

      .play-icon {
        position: absolute;
        top: 50%;
        right: 16px;
        margin-top: -12px;
        font-size: 24px;
        cursor: pointer;
        -webkit-transition: color 0.3s;
        -moz-transition: color 0.3s;
        -ms-transition: color 0.3s;
        -o-transition: color 0.3s;
        transition: color 0.3s;
      }

      .play-icon:hover {
        color: @corporate-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  label {
    display: block;
    padding: 8px 0;
    padding-right: 48px;
    height: auto;

    span {
      height: auto !important;
    }

    [type="radio"] + span:before, [type="radio"] + span:after {
      top: 50% !important;
      margin-top: -8px;
    }
  }
}

.elem-frontend-cms-marketing-social_media-select_media-scene {
  position: relative;

  h2 {
    padding: 0 26px;
    padding-bottom: 8px;
  }

  .scene-type {
    position: absolute;
    top: 16px;
    right: 16px;
  }

  .this-action-icons {

    a {
      vertical-align: middle;
      span {
        display: inline-block;
        color: inherit;
        vertical-align: middle;
      }
    }
  }
}

.elem-frontend-cms-marketing-social_media-select_media-media_popup-audio {
  border-bottom: 1px solid @dividers-color;

  audio {
    width: 100%;
  }

  audio::-webkit-media-controls-play-button, audio::-webkit-media-controls-panel {
    background-color: #ffffff;
    color: @text-color;
  }
}

.elem-frontend-cms-marketing-social_media-select_media-media_popup-image {
  .img-outer {
    position: relative;
    min-height: 220px;

    img {
      width: 100%;
    }
  }
}

.elem-frontend-cms-marketing-social_media-select_media-media_popup-video {

  video {
    position: relative;
    height: auto;
    width: 100%;
  }
}

.elem-frontend-cms-marketing-social_media-select_product-article {
  position: relative;
  border-bottom: 1px solid @dividers-color;
  padding: 12px 0;
  padding-right: 16px;

  h2 {
    padding-bottom: 8px;
  }

  p.radio {
    position: absolute;
    top: 2px;
    right: 2px;
    padding-bottom: 14px;

    label {
      display: block;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      height: auto;

      span {
        height: auto !important;
      }

      [type="radio"] + span:before, [type="radio"] + span:after {
        top: 50% !important;
        margin-top: -8px;
      }
    }

    label:last-child {
      border-bottom: none;
    }
  }

  .article-detail {
    position: relative;
    padding-left: 104px;

    img {
      overflow: hidden;
      position: absolute;
      top: 8px;
      left: 0;
      border-radius: 8px;
      height: 80px;
      width: 80px;
    }

    .article-summery {
      overflow: hidden;

      p {
        display: block;
        width: 50%;
        float: left;
      }
    }
  }
}

.elem-frontend-cms-marketing-social_media-select_product-article:last-child {
  border-bottom: none;
}

.elem-frontend-cms-marketing-social_media-select_template-template {

  video {
    height: auto;
    width: 100%;
  }
}

.elem-frontend-cms-marketing-suyofaapp-image {

}

.elem-frontend-cms-marketing-suyofaapp-manual {

  p.title {
    padding: 16px 0;
  }

  .card {
    .content-step {
      padding: 8px 0;

      p.caption {
        padding-bottom: 4px;
      }
    }
  }
}

.elem-frontend-cms-marketing-suyofaapp-overview {

  .description-status-text {
    display: none;
    padding-top: 16px;
  }

  .description-status-text.active {
    display: block;
  }

  .is-online {

  }

  .is-offline {
    color: @error-color;
  }

  .delete-image {
    color: @secondary-text-color;
  }

  .card {
    .app-download {
      overflow: hidden;
      padding: 8px 0;
      padding-top: 16px;

      p {
        padding-bottom: 8px;
      }

      a {
        float: left;
        display: block;
        width: 50%;

        img {
          height: 50px;
          width: auto;
        }
      }
    }

    .customer-count {
      padding: 16px 0;
      font-size: 60px;
    }

    .add-image {
      padding-bottom: 16px;

      label {
        input {
          display: none;
        }
      }
    }

    .img-outer {
      padding: 16px 0;

      .app-image {
        display: inline-block;
        position: relative;
        border-radius: 100%;
        background-color: #D9D9D9;
        height: 237px;
        width: 237px;
      }

      .default-img {
        display: inline-block;
        position: relative;
        border-radius: 100%;
        background-color: #D9D9D9;
        height: 237px;
        width: 237px;

        .material-icons {
          position: absolute;
          top: 50%;
          left: 50%;
          margin-top: -60px;
          margin-left: -60px;
          font-size: 120px;
          color: @secondary-text-color;
        }
      }
    }
  }

  .all-user {
    padding-bottom: 16px;
  }

  .content-outer {
    padding: 0 16px;
  }

  .extra-content {
    overflow: hidden;
    padding: 0 16px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    .card {
      margin: 1px 0;
      margin-bottom: 8px;

      .subhead {
        padding-bottom: 8px;
      }
    }
  }

  .extra-content.extra-active {
    max-height: 1500px;
  }

  @media @xs {

    .card {
      .app-download {
        overflow: hidden;
        padding: 8px 0;
        padding-top: 16px;

        p {
          padding-bottom: 8px;
        }

        a {
          float: none;
          display: block;
          margin-bottom: 8px;
          width: 100%;

          img {
            height: 50px;
            width: auto;
          }
        }

        a:last-child {
          margin-top: 8px;
          margin-bottom: 0;
        }
      }
    }
  }
}

.elem-frontend-cms-news-overview {

  .card {
    overflow: hidden;
    padding: 0;

    .card-head {
      position: relative;
      padding: 0 16px;
      padding-top: 16px;

      p:first-child {
        padding-right: 36px;
        padding-bottom: 2px;
      }

      .material-icons {
        position: absolute;
        top: 16px;
        right: 16px;
      }
    }

    img {
      height: auto;
      width: 100%;
    }

    .welcome-card {
      padding: 0 16px;
      padding-bottom: 24px;

      p.title {
        padding-bottom: 16px;
      }
    }

    .card-body {
      padding: 16px;

      p {

        a {
          font-size: inherit;
          font-weight: inherit;
          color: @corporate-color;
          line-height: inherit;
          text-decoration: underline;
        }

        a:hover {
          text-decoration: none;
        }

        span.ul {
          display: block;
          padding: 8px 24px;
          font-size: inherit;
          font-weight: inherit;
          color: inherit;
          line-height: inherit;

          span.li {
            display: list-item;
            padding: 4px 0;
            list-style: disc;
            font-size: inherit;
            font-weight: inherit;
            color: inherit;
            line-height: inherit;
          }
        }
      }
    }

    .check-website {
      padding-top: 16px;
    }

    .card-footer {
      padding: 0;
      padding-bottom: 8px;
    }
  }

  .your-website-link {
    padding-top: 24px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}


.elem-frontend-cms-news-overview-entry {

  .not-seen {
    color: @error-color;
  }

  .news-card-content {
    padding-left: 16px;
  }

  .card-head {
    border-bottom: 1px solid @dividers-color;
    padding-bottom: 8px !important;
    padding-left: 0 !important;

    .title {
      padding-bottom: 8px !important;
    }

    .company-link {
      color: @corporate-color !important;
    }
  }

  .news-title {
    padding-bottom: 8px;
  }

  .card-body {
    padding-top: 8px !important;
    padding-left: 0 !important;
  }

  .company-area {
    position: relative;
    padding: 16px 0;
    padding-left: 64px;

    .company-image {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -24px;
      border-radius: 100%;
      height: 48px;
      width: 48px;
    }
  }

  .default-img {
    overflow: hidden;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -24px;
    border-radius: 100%;
    height: 48px;
    width: 48px;
    background-color: #DEDEDE;

    .material-icons {
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -16px;
      margin-left: -16px;
      font-size: 32px;
      color: rgba(0, 0, 0, 0.54);
    }
  }
}

.elem-frontend-cms-online_hofladen-about {
  .img-outer {
    padding: 0;

    .logo-image {
      height: auto;
      width: 100%;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-design {

  p {
    a {
      color: @corporate-color;
      font-size: inherit;
      font-weight: inherit;
      font-family: inherit;
      text-decoration: underline;
    }

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

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-detail {

  .this-content-form {
    padding-top: 16px;
  }

  .coordinates-sample {
    padding-bottom: 8px;
  }

  .map-card {
    padding: 0;

    .map-card-inner {
      padding: 8px 16px;
    }
  }

  #map {
    height: 249px;
    width: 100%;
  }

  .this-action-area {
    padding-top: 16px;
  }

  .whatsapp-error {
    display: none;
    color: @error-color;
  }

  .whatsapp-error.active-error {
    display: block;
  }

  .suggestion-input {
    position: relative;
  }

  .input-row {
    position: relative;
    overflow: hidden;

    .elem-frontend-cms-elements-form-input {
      margin: 0;
    }

    div.two-col:first-child {
      padding-right: 4px;
    }

    div.two-col:last-child {
      padding-left: 4px;
    }

    .big-column {
      float: left;
      width: 70%;
    }

    .small-column {
      float: left;
      width: 30%;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-eu {
  height: 100%;

  .card {
    padding-right: 0;
  }

  ul {
    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 24px;
      padding-left: 0;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .toggle-outer {
    padding-right: 16px;
  }

  .input_area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    .elem-frontend-cms-elements-form-input {
      margin-right: 16px;
    }
  }

  .input_area.active-area {
    max-height: 1000px;
  }
}

.elem-frontend-cms-online_hofladen-hero {

  .slogan-text-area {
    overflow: hidden;
    padding-right: 16px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .slogan-text-area.active-input {
    max-height: 500px;
  }

  .card {
    padding-right: 0;
  }

  .image-card {
    padding: 0;

    .header-outer, .footer-outer {
      padding: 8px 16px;
    }
  }

  .elem-frontend-cms-elements-form-radio {
    padding-bottom: 0;
  }

  .elem-frontend-cms-elements-form-input_text {
    margin-bottom: 4px;
  }

  .text-counter-hint {
    padding-bottom: 8px;
    padding-left: 24px;

    span {
      color: inherit;
      font-weight: inherit;
      font-size: inherit;
      font-family: inherit;
    }

    span.error {
      color: @error-color;
    }
  }

  .text-counter-hint.error {
    color: @error-color;
  }

  .img-outer {
    overflow: hidden;
    display: table;
    position: relative;
    min-height: 218px;
    width: 100%;
    background-color: @dividers-color;

    img {
      position: absolute;
      top: 0;
      left: 0;
      height: auto;
      width: 100%;
    }

    p {
      display: table-cell;
      position: relative;
      z-index: 5;
      padding: 24px;
      color: #ffffff;
      vertical-align: middle;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-layout {
  height: 100%;

  .this-card.card {
    padding: 8px 0;

    .card-head {
      padding: 0 16px;
    }

    .card-content {
      padding: 0 16px;
    }

    .card-footer {
      padding: 0;

      .add-subsite {

        display: block;
        font-size: 16px;

        span {
          display: inline-block;
          margin-top: -4px;
          color: inherit;
          vertical-align: middle;
        }
      }
    }

    .add-subsite-area {
      margin-top: 16px;
      border-top: 1px solid @dividers-color;
    }
  }

  .add-subsite-card {
    padding-bottom: 0 !important;
  }

  .collapsible-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .collapsible-area.expand-area {
    max-height: 20000px;
  }

  .input-area {
    padding-top: 8px;
  }

  .img-outer {
    img {
      height: auto;
      width: 100%;
    }
  }

  .image-input {
    padding: 8px 0;

    .add-image {
      label {
        input {
          display: none;
        }
      }
    }
  }

  .edit-content-content {
    padding-right: 0;

    .edit-content-navigation {

      li {

        a {
          display: block;
          position: relative;
          border-bottom: 1px solid @dividers-color;
          padding: 12px 32px;
          padding-left: 0;

          .material-icons {
            position: absolute;
            top: 50%;
            right: 0;
            margin-top: -12px;
            font-size: 24px;
            color: @corporate-color;
          }
        }
      }

      li:last-child {

        a {
          border-bottom: none;
        }
      }
    }
  }

  .charge-list {
    padding: 8px 0;

    .charge {
      position: relative;
      padding: 8px 0;

      p {
        padding: 0 34px;
      }

      .charge-status {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -8px;
        border-radius: 100%;
        height: 16px;
        width: 16px;
        background-color: @error-color;
      }

      .charge-status.is-online {
        background-color: @corporate-color;
      }

      .charge-link {
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -17px;
        font-size: 28px;
      }
    }
  }
}

.elem-frontend-cms-online_hofladen-seo {
  height: 100%;

  .prefill-hint {
    padding: 16px;

    p {
      position: relative;
      padding-left: 32px;

      .material-icons {
        position: absolute;
        top: -2px;
        left: 0;
        font-size: 24px;
        color: @corporate-color;
      }
    }

    .caption {
      padding-top: 4px;
    }
  }
}


.elem-frontend-cms-online_hofladen-social {
  height: 100%;

  .toggle-outer {
    padding-right: 8px;
    padding-left: 8px;
  }

  .input_area {
    overflow: hidden;
    padding-right: 8px;
    padding-left: 8px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .input_area.active-area {
    max-height: 1000px;
  }

  p.caption {
    padding-bottom: 8px;
  }
}

.elem-frontend-cms-online_hofladen-video {
  height: 100%;

  .toggle-outer {
    padding-right: 8px;
    padding-left: 8px;
  }

  .input_area {
    overflow: hidden;
    padding-right: 8px;
    padding-left: 8px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .input_area.active-area {
    max-height: 1000px;
  }
}

.elem-frontend-cms-online_hofladen-design-colorpicker {
  padding-top: 20px;
  padding-bottom: 8px;

  li {
    position: relative;
    padding: 8px 0;
    padding-left: 54px;

    .radio-element {
      position: absolute;
      top: 50%;
      left: 8px;
      margin-top: -15px;
    }

    .colors {
      overflow: hidden;

      span {
        float: left;
        display: block;
        height: 64px;
        width: 50%;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-detail-map {

  .map-legend {
    overflow: hidden;
    padding-top: 12px;

    li {
      float: left;
      display: block;
      position: relative;
      padding: 8px 16px;
      padding-left: 56px;
      width: 50%;

      .svg-grafic {
        position: absolute;
        top: 50%;
        left: 8px;
        margin-top: -24px;
      }
    }
  }

  @media @xs {
    .map-legend {
      overflow: hidden;
      padding-top: 8px;

      li {
        float: left;
        display: block;
        position: relative;
        padding: 12px 16px;
        padding-left: 56px;
        width: 100%;

        .svg-grafic {
          position: absolute;
          top: 50%;
          left: 8px;
          margin-top: -24px;
        }
      }
    }
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-eu-detail {
  p {
    padding-right: 16px;

    a {
      font-size: inherit;
      font-weight: inherit;
      color: @corporate-color;
    }
  }

  .inactive-toggle {
    overflow: hidden;
    margin: 8px 0;
    border: 1px solid @secondary-text-color;
    border-radius: @basic-border-radius;

    .toggle-select {
      float: left;
      display: block;
      padding: 10px 8px;
      width: 50%;
      color: @secondary-text-color;

      input {
        display: none;
      }
    }

    .toggle-select.active {
      background-color: @dividers-color;
      color: @text-color;
    }

    .toggle-select:first-child {
      border-right: 1px solid @secondary-text-color;
    }
  }
}

.elem-frontend-cms-online_hofladen-hero-image {
  position: relative;
  padding-left: 0;
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  .card {
    padding: 0;
  }

  .img-outer {

    img {
      height: auto;
      width: 100%;
    }
  }

  .this-cta-area {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 80px;
    width: 100%;
    background: rgb(255,255,255);
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);

    a {
      display: inline-block;
      position: absolute;
      right: 0;
      bottom: 0;
      padding: 16px;

      span {
        color: #ffffff;
      }
    }

    a.delete {
      left: 0;
    }
  }

  .add-image {
    label {
      input {
        display: none;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-hero-image.space_for_sidenav {
  padding-left: 350px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}

.elem-frontend-cms-online_hofladen-hero-image-edit {
  height: 100%;

  .hint-box {
    margin-top: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-hero-image-item {
  .card {
    overflow: hidden;

    .radio {
      padding: 8px;
      padding-top: 12px;
    }
  }

  .img-outer {
    position: relative;
    min-height: 220px;
  }
}

.elem-frontend-cms-online_hofladen-layout-article_selector {
  overflow: hidden;
  height: 100%;

  .this-card.card {
    padding: 8px 0;

    .card-head {
      padding: 0 16px;
    }

    .card-content {
      padding: 0 16px;
    }

    .card-footer {
      padding: 0;
    }
  }

  .article-list-content {
    overflow: hidden;
  }

  ul.article-list {
    padding-left: 16px ;

    li {
      border-bottom: 1px solid @dividers-color;
      padding: 8px 16px;
      padding-left: 0;
    }

    li:last-child {
      border-bottom: none;
    }
  }
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(-360deg); }
}

.elem-frontend-cms-online_hofladen-layout-article_selector_card {

  .selected-amount {
    padding-top: 16px;
  }

  ul {
    padding: 8px 0;
    padding-left: 16px;

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 16px;
      padding-left: 0;
      padding-right: 56px;
      cursor: grab;
      transition: background 0.15s ease, opacity 0.15s ease;

      &:last-child {
        border-bottom: none;
      }

      &.dragging {
        opacity: 0.35;
      }

      &.drag-over {
        background: rgba(0, 0, 0, 0.04);
      }

      .sort-loader {
        display: inline-flex;
        vertical-align: middle;
        margin-left: 6px;

        .material-icons {
          font-size: 16px;
          color: @secondary-text-color;
          display: inline-block;
          animation: spin 0.8s linear infinite;
          color: @error-color;
        }
      }

      .card-sort-controls {
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -16px;

        .btn-sort {
          padding: 4px;
          font-size: 24px;
          cursor: pointer;
          color: @secondary-text-color;
          line-height: 1;
          transition: color 0.15s ease;

          &:hover {
            color: @corporate-color;
          }

          &.disabled {
            opacity: 0.25;
            pointer-events: none;
          }
        }
      }
    }
  }

  .spinning {
    display: inline-block;
    animation: spin 0.8s linear infinite;
  }
}

.elem-frontend-cms-online_hofladen-layout-sub_site {
  overflow: hidden;
  height: 100%;

  .subsite-head {
    position: relative;

    span {
      position: absolute;
      top: 4px;
      right: 0;
      font-size: 28px;
      color: @secondary-text-color;
      cursor: pointer;
    }

    .inactive-nav {
      color: @hint-text-color;
    }

    span.move-up {
      right: 36px;
    }
  }

  .card-content {
    padding: 8px 0;

    .hint-text {
      display: none;
    }
  }

  .form-hint-text {
    display: none;
  }

  .form-hint-text.correct, #domain-example.correct {
    display: block;
    color: @corporate-color;
  }

  .form-hint-text.incorrect, #domain-example.incorrect {
    display: block;
    color: @error-color;
  }

  .card-footer {
    padding: 8px 0;

    .delete-section {
      color: @error-color;
      cursor: pointer;
    }
  }

  .add-subsite-navigation {
    padding-bottom: 24px;

    a {
      display: block;

      span {
        display: inline-block;
        margin-top: -4px;
        color: inherit;
        vertical-align: middle;
        cursor: pointer;
      }
    }
  }
}


.elem-frontend-cms-online_hofladen-layout-subsite_list {

  .subsite-title {
    display: block;
    padding-left: 22px !important;

    .status-hint {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -7px;
      border-radius: 100%;
      height: 14px;
      width: 14px;
    }

    .online {
      background-color: @corporate-color;
    }

    .offline {
      background-color: @error-color;
    }
  }
}

.elem-frontend-cms-online_hofladen-layout-article_selector-article.card {
  position: relative;

  .card-head {
    position: relative;

    .checkbox {
      display: inline-block;
      position: absolute;
      top: 50%;
      right: 0;
      margin-top: -22px;
    }
  }
}

.elem-frontend-cms-online_hofladen-layout-article_selector-article_list {

}

.elem-frontend-cms-online_hofladen-layout-sub_site-about {

}

.elem-frontend-cms-online_hofladen-layout-sub_site-additional_banner {

  .hideable-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .hideable-area.show-input {
    max-height: 10000px;
  }
}

.elem-frontend-cms-online_hofladen-layout-sub_site-article_slider {

}

.elem-frontend-cms-online_hofladen-layout-sub_site-chargen {

  .charge-list {
    padding: 8px 0;

    .charge {
      position: relative;
      padding: 8px 0;

      p {
        padding: 0 34px;
      }

      .charge-status {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -8px;
        border-radius: 100%;
        height: 16px;
        width: 16px;
        background-color: @error-color;
      }

      .charge-status.is-online {
        background-color: @corporate-color;
      }

      .charge-link {
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -17px;
        font-size: 28px;
      }
    }
  }
}

.elem-frontend-cms-online_hofladen-layout-sub_site-contact {

}

.elem-frontend-cms-online_hofladen-layout-sub_site-family_tree {

  .add-family-tree {
    display: block;

    span {
      display: inline-block;
      margin-top: -4px;
      color: inherit;
      vertical-align: middle;
      cursor: pointer;
    }
  }

  ul.family-tree {
    padding: 4px 0;
    padding-left: 0;

    li {
      padding: 4px 0;

      .gen-content {
        position: relative;
        padding-right: 48px;
        padding-left: 40px;

        .sex-font {
          position: absolute;
          top: 50%;
          left: 8px;
          margin-top: -12px;
          font-size: 24px;
        }

        .sex-font.male {
          color: #89CFF0;
        }

        .sex-font.female {
          color: #F4C2C2;
        }

        .edit-button {
          position: absolute;
          top: 50%;
          right: 8px;
          margin-top: -20px;
          padding: 8px;
          font-size: 24px;
          cursor: pointer;
        }
      }
    }

    .gen-content {
      padding: 8px 16px;
      border: 1px solid @dividers-color;
      border-left: 3px solid @dividers-color;
      border-radius: @basic-border-radius;
      background-color: rgba(0,0,0,0.1);
    }

    ul.family-tree {
      border-left: 1px solid @dividers-color;
      padding-left: 16px;
    }
  }
}

.elem-frontend-cms-online_hofladen-layout-sub_site-image {

  .add-image {
    label {
      input {
        display: none;
      }
    }
  }
}

.elem-frontend-cms-online_hofladen-layout-sub_site-image_slider {

  .hint-box {
    margin-bottom: 8px;
  }
}

.elem-frontend-cms-online_hofladen-layout-sub_site-recommendation {

}

.elem-frontend-cms-online_hofladen-layout-sub_site-text {

  .hideable-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .hideable-area.show-input {
    max-height: 10000px;
  }
}

.elem-frontend-cms-online_hofladen-layout-sub_site-video {

}

.elem-frontend-cms-online_hofladen-layout-sub_site-popup-body {


  .cancel {
    float: left;
    color: @hint-text-color;
  }

  .single-cancel {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-online_hofladen-layout-sub_site-popup-content-add_family_branch {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
    padding-right: 16px;
  }

  .popup-head {
    padding-right: 16px!important;
  }

  .popup-content {
    padding-right: 16px !important;

    .creatable-hint {
      position: relative;
      padding: 8px;

      .material-icons.check {
        color: @corporate-color;
      }
    }
  }
}

.elem-frontend-cms-online_hofladen-layout-sub_site-popup-content-add_section {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
    padding-right: 16px;
  }

  .popup-content {
    .creatable-hint {
      position: relative;
      padding: 8px;

      .material-icons.check {
        color: @corporate-color;
      }
    }

    ul {
      li {
        border-bottom: 1px solid @dividers-color;
        padding: 8px 0;
        padding-right: 16px;
        background-color: #FFFFFF;
        color: @corporate-color;
        -webkit-transition: background-color 0.3s, color 0.3s;
        -moz-transition: background-color 0.3s, color 0.3s;
        -ms-transition: background-color 0.3s, color 0.3s;
        -o-transition: background-color 0.3s, color 0.3s;
        transition: background-color 0.3s, color 0.3s;

        button {
          position: relative;
          padding-left: 44px;
          width: 100%;
          cursor: pointer;
          text-align: left;
          background-color: transparent;
          color: inherit;

          .material-icons {
            position: absolute;
            top: 50%;
            left: 0;
            margin-top: -14px;
            font-size: 28px;
            color: inherit;
          }
        }
      }

      li:hover {
        background-color: @attention-color;
        color: #FFFFFF;
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }

  .popup-footer {
    .cancel {
      float: none;
    }
  }
}

.elem-frontend-cms-online_hofladen-layout-sub_site-popup-content_layout-add_subsite {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
    padding-right: 16px;
  }

  .popup-content {
    padding-right: 16px !important;

    .creatable-hint {
      position: relative;
    }

    ul {

      li {
        padding: 4px 0;

        .radio {
          position: relative;

          .radio-value {
            position: absolute;
            top: 50%;
            right: 0;
            margin-top: -10px;
          }
        }

        .input-area {
          overflow: hidden;
          max-height: 0;
          -webkit-transition: max-height 0.3s;
          -moz-transition: max-height 0.3s;
          -ms-transition: max-height 0.3s;
          -o-transition: max-height 0.3s;
          transition: max-height 0.3s;

          .half-input {
            float: left;
            width: 25%;

            .elem-frontend-cms-elements-form-toggle {
              border-top-right-radius: 0 !important;
              border-bottom-right-radius: 0 !important;
              border-bottom-left-radius: 0 !important;
            }

            .elem-frontend-cms-elements-form-input {
              border-top-left-radius: 0 !important;
            }

            .toggle-select {
              padding-top: 17px;
              padding-bottom: 18px;
            }
          }

          .half-input:last-child {
            width: 75%;
          }
        }

        .input-area.active-input {
          max-height: 100px;
        }
      }
    }
  }
}

.elem-frontend-cms-online_hofladen-logo-image {
  position: relative;

  .card {
    padding: 0;
  }

  .img-outer {
    padding: 0;

    img {
      height: auto;
      width: 100%;
    }
  }

  .this-cta-area {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 80px;
    width: 100%;
    background: rgb(255,255,255);
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);

    a {
      display: inline-block;
      position: absolute;
      right: 0;
      bottom: 0;
      padding: 16px;

      span {
        color: #ffffff;
      }
    }

    a.delete {
      left: 0;
    }
  }

  .add-image {
    label {
      input {
        display: none;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-logo-image-edit {
  height: 100%;

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-logo-image-item {

  .img-outer {
    position: relative;
    min-height: 220px;
  }
}

.elem-frontend-cms-online_hofladen-overview-about {

  .img-outer {
    padding: 24px 0;

    .logo-image {
      height: auto;
      width: 100%;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-bio {

  .this-card-content {

    a {
      display: inline-block;
      padding-top: 8px;
    }
  }

  .this-action-area {
    padding-top: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-currency {

  .this-card-content {

    a {
      display: inline-block;
      padding-top: 8px;
    }
  }

  .this-action-area {
    padding-top: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-design {


  .colors {
    overflow: hidden;
    padding-bottom: 40px;

    span.color {
      float: left;
      display: block;
      position: relative;
      height: 64px;
      width: 50%;

      span {
        position: absolute;
        bottom: 0;
        left: 0;
        margin-bottom: -28px;
        width: 100%;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-detail {

  .company-id {
    display: inline-block;
    padding-top: 8px;
  }

  .address {
    padding-bottom: 8px;
  }

  p.body1 {
    padding-bottom: 4px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-eu {

  ul {

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 24px;
      padding-left: 40px;

      span.material-icons {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 48px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-hero {

  .card {
    padding: 0;
  }

  .img-outer {
    overflow: hidden;
    display: table;
    position: relative;
    height: 250px;
    width: 100%;
    background-color: @dividers-color;

    img {
      position: absolute;
      top: 0;
      left: 0;
      height: auto;
      width: 100%;
    }

    p {
      display: table-cell;
      position: relative;
      z-index: 5;
      padding: 24px;
      color: #ffffff;
      vertical-align: middle;
    }
  }

  .footer-outer {
    padding: 8px 16px;
  }

  @media @xs {
    .img-outer {
      overflow: hidden;
      display: table;
      position: relative;
      height: 188px;
      width: 100%;
      background-color: @dividers-color;
    }
  }

  @media @sm {
    .card {
      padding: 0;
    }

    .img-outer {
      height: 210px;
      background-color: @dividers-color;

      p {
        padding: 24px;
      }
    }

    .footer-outer {
      padding: 8px 16px;
    }
  }

  @media @md {
    .card {
      padding: 0;
    }

    .img-outer {
      height: 210px;
      background-color: @dividers-color;

      p {
        padding: 24px;
      }
    }

    .footer-outer {
      padding: 8px 16px;
    }
  }
}

.elem-frontend-cms-online_hofladen-overview-layout {

  .this-action-area {
    display: none;
  }

  .this-action-area.show-button {
    display: block;
  }
}

.elem-frontend-cms-online_hofladen-overview-online {

  .this-card-content {

    a {
      display: inline-block;
      padding-top: 8px;
    }
  }

  .this-action-area {
    padding-top: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-salutation {

  .this-card-content {

    a {
      display: inline-block;
      padding-top: 8px;
    }
  }

  .this-action-area {
    padding-top: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-seo {

  ul {

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 24px;
      padding-left: 40px;

      span.material-icons {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 48px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-show_article {

  .this-card-content {

    a {
      display: inline-block;
      padding-top: 8px;
    }
  }

  .this-action-area {
    padding-top: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-social {

  ul {

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 24px;
      padding-left: 40px;

      span.material-icons {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 48px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-video {

  p {

    a {
      font-size: inherit;
      font-weight: @bold;
      font-family: inherit;
      color: @corporate-color;
    }

    a:hover {
      color: @corporate-color;
      text-decoration: underline;
    }
  }

  ul {

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 24px;
      padding-left: 40px;

      span.material-icons {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 48px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-online_hofladen-overview-salutation-toggle {
  overflow: hidden;
  margin: 8px 0;
  border: 1px solid @corporate-color;
  border-radius: @basic-border-radius;

  .toggle-select {
    float: left;
    display: block;
    padding: 10px 8px;
    width: 50%;
    cursor: pointer;
    color: @secondary-text-color;

    input {
      display: none;
    }
  }

  .toggle-select.active {
    background-color: rgba(130, 197, 93, 0.2);
    color: @text-color;
  }

  .toggle-select:first-child {
    border-right: 1px solid @corporate-color;
  }
}

.elem-frontend-cms-purchases-add_cash_count {

  input[type=number] {
    -moz-appearance: textfield;
  }

  input[type=number]::-webkit-outer-spin-button,
  input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }

  .hidden {
    display: none;
  }

  .count-mode-toggle {
    padding: 16px 0;
  }

  .denom-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 16px;
    padding: 8px 0;

    @media @xs {
      grid-template-columns: 1fr;
    }
  }

  .popup-content {
    padding-right: 16px !important;
  }

  .cc-summary {
    padding: 12px 0;
    margin-top: 8px;
    border-top: 1px solid @dividers-color;

    .cc-summary-row {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 4px 0;
    }

    .cc-diff-row {
      border-top: 1px solid @dividers-color;
      margin-top: 4px;
      padding-top: 8px;
    }

    #cc-diff.diff-neg {
      color: @error-color;
    }

    #cc-diff.diff-pos {
      color: @corporate-color;
    }
  }

  .cc-hint {
    padding: 24px 0;
  }
}


.elem-frontend-cms-purchases-add_cash_movement {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }

  .direction-choice {
    display: flex;
    gap: 24px;
    padding: 16px 0;
  }

  .popup-content {
    padding-right: 16px !important;
  }
}


.elem-frontend-cms-purchases-add_daily_closing {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }

  .dc-section {
    padding: 12px 0;
    border-top: 1px solid @dividers-color;
    margin-top: 8px;

    .dc-section-title {
      display: block;
      padding-bottom: 4px;
    }

    .dc-row {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 3px 0;
    }

    .dc-row.dc-total {
      font-weight: @medium;
      border-top: 1px solid @dividers-color;
      margin-top: 4px;
      padding-top: 6px;
    }

    .dc-diff.is-negative {
      color: @error-color;
    }

    .dc-diff.is-positive {
      color: @corporate-color;
    }
  }

  .popup-content {
    padding-right: 16px !important;
  }

  .material-icons {
    color: inherit;
  }

  .dc-vat-table {
    width: 100%;

    th, td {
      padding: 3px 8px;
      text-align: right;
    }

    th:first-child, td:first-child {
      text-align: left;
    }
  }

  .dc-hint {
    padding: 24px 0;
  }
}


.elem-frontend-cms-purchases-add_dsfinvk_export {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }

  .dx-date-row {
    display: flex;
    gap: 16px;

    > div {
      flex: 1 1 0;
      min-width: 0;
    }

    @media @xs {
      display: block;
    }
  }

  .dx-hint {
    padding-top: 8px;
  }

  .popup-content {
    padding-right: 16px !important;
  }
}


.elem-frontend-cms-purchases-add_tse_archive {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }

  .ta-date-row {
    display: flex;
    gap: 16px;

    > div {
      flex: 1 1 0;
      min-width: 0;
    }

    @media @xs {
      display: block;
    }
  }

  .ta-hint {
    padding-top: 8px;
  }

  .popup-content {
    padding-right: 16px !important;
  }
}


.elem-frontend-cms-purchases-cash_count {
  height: 100%;

  .filter-form {
    padding: 16px;

    .filter-row {
      display: flex;
      gap: 16px;

      > div {
        flex: 1 1 0;
        min-width: 0;
      }

      @media @xs {
        display: block;
      }
    }

    .filter-actions {
      padding-top: 8px;

      button {
        color: @corporate-color;

        span {
          vertical-align: middle;
          padding-right: 8px;
          color: inherit;
        }
      }
    }
  }

  .material-icons {
    color: inherit;
  }

  .add-count {
    padding: 16px 0;

    .btn span {
      vertical-align: middle;
      padding-right: 8px;
    }
  }

  .count-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .no-data {
    padding: 24px 16px;
  }
}


.elem-frontend-cms-purchases-cash_movements {
  height: 100%;

  .filter-form {
    padding: 16px;

    .filter-row {
      display: flex;
      gap: 16px;

      > div {
        flex: 1 1 0;
        min-width: 0;
      }

      @media @xs {
        display: block;
      }
    }

    .filter-actions {
      padding-top: 8px;

      button {
        color: @corporate-color;

        span {
          vertical-align: middle;
          padding-right: 8px;
          color: inherit;
        }
      }
    }
  }

  .material-icons {
    color: inherit;
  }

  .add-movement {
    padding: 16px 0;

    .btn span {
      vertical-align: middle;
      padding-right: 8px;
    }
  }

  .movement-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .no-data {
    padding: 24px 16px;
  }
}


.elem-frontend-cms-purchases-daily_closing {
  height: 100%;

  .filter-form {
    padding: 16px;

    .filter-row {
      display: flex;
      gap: 16px;

      > div {
        flex: 1 1 0;
        min-width: 0;
      }

      @media @xs {
        display: block;
      }
    }

    .filter-actions {
      padding-top: 8px;

      button {
        color: @corporate-color;

        span {
          vertical-align: middle;
          padding-right: 8px;
          color: inherit;
        }
      }
    }
  }

  .material-icons {
    color: inherit;
  }

  .add-closing {
    padding: 16px 0;

    .btn span {
      vertical-align: middle;
      padding-right: 8px;
    }
  }

  .closing-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .no-data {
    padding: 24px 16px;
  }
}


.elem-frontend-cms-purchases-dashboard {
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  .day-close {
    padding: 16px;
    margin: 16px 0;

    .day-close-head {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 12px;

      > .material-icons {
        font-size: 28px;
        color: @corporate-color;
      }

      h2 {
        margin: 0;
      }
    }

    .day-close-list {
      margin: 0;

      li {
        margin-bottom: 8px;
      }
    }

    .day-close-btn {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 12px 14px;
      border: 1px solid @dividers-color;
      border-left: 4px solid @corporate-color;
      border-radius: 8px;
      transition: background 0.2s;

      &:hover {
        background: fade(@corporate-color, 8%);
      }

      .day-close-btn-main {
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;
        min-width: 0;
      }

      .day-close-meta {
        color: @corporate-color;
      }

      > .material-icons {
        color: @corporate-color;
      }
    }

    .day-close-empty {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 16px;
      color: @corporate-color;
    }

    .day-close-manual {
      margin-top: 8px;
    }
  }

  .filter-form {
    padding: 16px 0;

    .filter-row {
      display: flex;
      gap: 16px;

      > div {
        flex: 1 1 0;
        min-width: 0;
      }

      @media @xs {
        display: block;
      }
    }

    .filter-actions {
      padding-top: 8px;

      button {
        color: @corporate-color;

        span {
          vertical-align: middle;
          padding-right: 8px;
          color: inherit;
        }
      }
    }
  }

  .material-icons {
    color: inherit;
  }

  .transactions-link {
    a {
      span {
        color: inherit;
      }
    }
  }

  .filter-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    margin-bottom: 16px;

    .filter-summary-text {
      p {
        margin: 0;
      }
    }

    a {
      color: @corporate-color;

      span {
        vertical-align: middle;
        padding-right: 4px;
      }
    }
  }

  .kpi-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;

    @media @xs {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .kpi-card {
      padding: 16px;
      margin: 0;

      .kpi-label {
        display: block;
        padding-bottom: 4px;
      }

      .kpi-value {
        display: block;
        margin: 0;
      }
    }

    .kpi-card.is-warning {
      border: 1px solid @error-color;

      .kpi-value {
        color: @error-color;
      }
    }
  }

  .transactions-link {
    padding: 24px 0;

    a span {
      vertical-align: middle;
      padding-right: 8px;
    }
  }

  .admin-actions {
    padding: 16px;

    .action-tiles {
      list-style: none;
      margin: 0;
      padding: 0;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;

      @media @xs {
        grid-template-columns: 1fr;
      }

      .action-tile {
        position: relative;
        padding: 16px;
        border: 1px solid @dividers-color;
        border-radius: @basic-border-radius;
        text-align: center;
        cursor: pointer;

        a {
          display: block;
          color: @text-color;
        }

        .material-icons {
          display: block;
          color: @corporate-color;
        }

        .badge {
          display: block;
          padding-top: 4px;
          color: @secondary-text-color;
        }
      }

      .action-tile.is-coming-soon {
        opacity: 0.55;
        cursor: not-allowed;
      }
    }
  }
}


.elem-frontend-cms-purchases-day_close {
  height: 100%;
  font-size: 14px;

  .material-icons {
    vertical-align: middle;
    color: inherit;
  }

  input[type=number] {
    -moz-appearance: textfield;
  }

  input[type=number]::-webkit-outer-spin-button,
  input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .dc-progress {
    padding: 12px 16px;

    .dc-bar {
      margin-top: 8px;
      height: 6px;
      border-radius: 3px;
      background: @dividers-color;
      overflow: hidden;
    }

    .dc-bar-fill {
      display: block;
      height: 100%;
      background: @corporate-color;
      transition: width .3s ease;
    }

    .dc-step-1 { width: 20%; }
    .dc-step-2 { width: 40%; }
    .dc-step-3 { width: 60%; }
    .dc-step-4 { width: 80%; }
    .dc-step-5 { width: 100%; }
  }

  .filter-form {
    padding: 16px;

    .filter-row {
      padding-top: 4px;
    }
  }

  .dc-intro {
    margin-bottom: 8px;
  }

  .dc-card {
    padding: 16px;
    margin-bottom: 16px;

    h2 {
      margin: 0 0 12px;
    }
  }

  .dc-row {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 5px 0;
  }

  .dc-warn,
  .dc-ok {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 8px;
    margin-bottom: 12px;
  }

  .dc-warn {
    background: fade(@error-color, 12%);
    color: @error-color;
    flex-wrap: wrap;

    .dc-warn-link {
      margin-left: auto;
      color: @error-color;
      font-weight: bold;
      text-decoration: underline;
    }
  }

  .dc-ok {
    background: fade(@corporate-color, 12%);
    color: @corporate-color;
  }

  .dc-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 8px 0 4px;

    .btn span,
    .btn-flat span {
      padding: 0 6px;
    }
  }

  .dc-fwd {
    margin-left: auto;
  }

  .direction-choice {
    display: flex;
    gap: 24px;
    padding: 12px 0;
  }

  .count-mode-toggle {
    padding: 8px 0;
  }

  .denom-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 16px;

    @media @xs {
      grid-template-columns: 1fr;
    }
  }

  .cc-summary {
    padding: 12px 0;
    margin-top: 8px;
    border-top: 1px solid @dividers-color;

    .cc-summary-row {
      display: flex;
      justify-content: space-between;
      padding: 3px 0;
    }

    .diff-neg { color: @error-color; }
    .diff-pos { color: @corporate-color; }
  }

  .hidden {
    display: none;
  }

  .dc-done {
    text-align: center;

    .dc-done-icon {
      font-size: 48px;
      color: @corporate-color;
    }

    .dc-row {
      text-align: left;
    }
  }
}


.elem-frontend-cms-purchases-dsfinvk_export {
  height: 100%;

  .filter-form {
    padding: 16px;

    .filter-row {
      display: flex;
      gap: 16px;

      > div {
        flex: 1 1 0;
        min-width: 0;
      }

      @media @xs {
        display: block;
      }
    }

    .filter-actions {
      padding-top: 8px;

      button {
        color: @corporate-color;

        span {
          vertical-align: middle;
          padding-right: 8px;
          color: inherit;
        }
      }
    }
  }

  .material-icons {
    color: inherit;
  }

  .add-export {
    padding: 16px 0;

    .btn span {
      vertical-align: middle;
      padding-right: 8px;
    }
  }

  .export-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .no-data {
    padding: 24px 16px;
  }
}


.elem-frontend-cms-purchases-filter {
  height: 100%;

  .filter-form {
    padding: 16px;

    .filter-row {
      display: flex;
      gap: 16px;

      > div {
        flex: 1 1 0;
        min-width: 0;
      }

      @media @xs {
        display: block;
      }
    }

    .filter-actions {
      padding-top: 16px;

      a {
        float: left;
      }
    }
  }
}


.elem-frontend-cms-purchases-kassenbuch {

  .kb-filter {
    padding: 16px;
    margin-bottom: 16px;
  }

  .kb-balance {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 16px;
    margin-bottom: 16px;

    .kb-balance-value {
      margin: 0;
      color: @corporate-color;
    }
  }

  .kb-card {
    padding: 0;
  }

  .kb-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .kb-item {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border-top: 1px solid @dividers-color;
  }

  .kb-item:first-child {
    border-top: 0;
  }

  .kb-info {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1 1 auto;
    padding-right: 12px;
  }

  .kb-amount {
    white-space: nowrap;
    color: @corporate-color;
    flex: 0 0 auto;
    text-align: right;
  }

  .kb-neg {
    color: @error-color;
  }

  .kb-receipt {
    flex: 0 0 auto;
    margin-left: 16px;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;

    .material-icons {
      font-size: 20px;
      line-height: 1;
      color: @corporate-color;
    }
  }

  .kb-receipt-off {
    cursor: default;

    .material-icons {
      color: rgba(0, 0, 0, 0.26);
    }
  }
}


.elem-frontend-cms-purchases-open_signatures {
  height: 100%;

  .filter-form {
    padding: 16px;

    .filter-actions {
      padding-top: 8px;

      button {
        color: @corporate-color;

        span {
          vertical-align: middle;
          padding-right: 8px;
          color: inherit;
        }
      }
    }
  }

  .resign-all {
    padding: 16px 0;

    .btn span {
      vertical-align: middle;
      padding-right: 8px;
    }
  }

  .signature-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .no-data {
    padding: 24px 16px;
  }
}


.elem-frontend-cms-purchases-overview {
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  .filter-form {
    padding: 16px 0;

    .filter-row {
      display: flex;
      gap: 16px;

      > div {
        flex: 1 1 0;
        min-width: 0;
      }

      @media @xs {
        display: block;
      }
    }

    .filter-select {
      .input-field {
        position: relative;
      }
    }

    button .material-icons {
      display: inline-block;
      padding-right: 8px;
      vertical-align: middle;
      color: inherit;
    }

    .filter-actions {
      padding-top: 8px;

      a.delete-filter,
      button {
        color: @corporate-color;

        span {
          display: inline-block;
          padding-right: 8px;
          vertical-align: middle;
          color: inherit;
        }
      }
    }
  }

  .filter-area {
    padding: 16px 0;

    a.btn-flat {
      color: @corporate-color;

      span {
        display: inline-block;
        padding: 0;
        padding-right: 8px;
        vertical-align: middle;
        color: inherit;
      }
    }
  }

  .filter {

    p {
      padding-bottom: 8px;
    }

    .delete-filter {
      padding-top: 8px;
    }
  }

  .toggle-outer {
    padding: 16px 0;

    .toggle {
      overflow: hidden;
      border-radius: @basic-border-radius;
      border: 1px solid @corporate-color;

      a {
        float: left;
        padding: 16px 8px;
        width: 33.33333333333333%;
        background-color: #ffffff;
        color: @secondary-text-color;
      }

      a.active {
        border: 1px solid @corporate-color;
        background-color: rgba(130, 197, 93, 0.2);
        color: @text-color;
        font-weight: @medium;
      }
    }
  }

  .material-icons {
    color: inherit;
  }

  .highlight-text {

    a {
      padding-right: 8px;
      padding-left: 8px;
      color: @error-color !important;
    }

    .delete-filter {
      padding-right: 8px;
      padding-left: 8px;

      .material-icons {
        padding-right: 0;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.content-body.side-action-nav-is-open {
  padding-left: 300px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-purchases-storno {

  h3 {
    padding-bottom: 16px;
  }

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }

  .error-color {
    color: @error-color !important;
  }

  .popup-content {
    padding-right: 16px !important;
  }

  .storno-payment-hint {
    display: none;
    padding-top: 16px;
  }

  button[disabled] {
    opacity: .45;
    cursor: not-allowed;
  }
}


.elem-frontend-cms-purchases-tse_archive {
  height: 100%;

  .filter-form {
    padding: 16px;

    .filter-row {
      display: flex;
      gap: 16px;

      > div {
        flex: 1 1 0;
        min-width: 0;
      }

      @media @xs {
        display: block;
      }
    }

    .filter-actions {
      padding-top: 8px;

      button {
        color: @corporate-color;

        span {
          vertical-align: middle;
          padding-right: 8px;
          color: inherit;
        }
      }
    }
  }

  .material-icons {
    color: inherit;
  }

  .add-archive {
    padding: 16px 0;

    .btn span {
      vertical-align: middle;
      padding-right: 8px;
    }
  }

  .archive-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .no-data {
    padding: 24px 16px;
  }
}


.elem-frontend-cms-purchases-cash_count-item {
  display: block;
  list-style: none;

  .count-card {
    padding: 16px;
    margin-bottom: 16px;
    border-left: 4px solid @dividers-color;
  }

  .count-card.is-negative {
    border-left-color: @error-color;
  }

  .count-card.is-positive {
    border-left-color: @corporate-color;
  }

  .count-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid @dividers-color;
    margin-bottom: 8px;

    h2 {
      margin: 0;
    }

    .count-diff {
      white-space: nowrap;
    }
  }

  .count-card.is-negative .count-diff {
    color: @error-color;
  }

  .count-card.is-positive .count-diff {
    color: @corporate-color;
  }

  .count-body {

    .count-row {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 4px 0;
    }
  }
}


.elem-frontend-cms-purchases-cash_movements-item {
  display: block;
  list-style: none;

  .movement-card {
    padding: 16px;
    margin-bottom: 16px;
    border-left: 4px solid @dividers-color;
  }

  .movement-card.is-in {
    border-left-color: @corporate-color;
  }

  .movement-card.is-out {
    border-left-color: @error-color;
  }

  .movement-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid @dividers-color;
    margin-bottom: 8px;

    h2 {
      margin: 0;
    }

    .movement-amount {
      white-space: nowrap;
    }
  }

  .movement-card.is-out .movement-amount {
    color: @error-color;
  }

  .movement-card.is-in .movement-amount {
    color: @corporate-color;
  }

  .movement-body {

    .movement-row {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 4px 0;
    }

    .movement-row.error-row span:last-child {
      color: @error-color;
    }
  }

  .movement-foot {
    padding-top: 8px;
    border-top: 1px solid @dividers-color;
    margin-top: 8px;

    a {
      color: @corporate-color;

      span {
        vertical-align: middle;
        padding-right: 4px;
      }
    }
  }
}


.elem-frontend-cms-purchases-daily_closing-item {
  display: block;
  list-style: none;

  .closing-card {
    padding: 16px;
    margin-bottom: 16px;
  }

  .closing-head {
    padding-bottom: 8px;
    border-bottom: 1px solid @dividers-color;
    margin-bottom: 8px;

    h2 {
      margin: 0;
    }
  }

  .closing-body {

    .closing-row {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 4px 0;
    }

    .closing-diff.is-negative {
      color: @error-color;
    }

    .closing-diff.is-positive {
      color: @corporate-color;
    }
  }

  .closing-foot {
    padding-top: 8px;
    border-top: 1px solid @dividers-color;
    margin-top: 8px;

    a {
      color: @corporate-color;

      span {
        vertical-align: middle;
        padding-right: 4px;
      }
    }
  }
}


.elem-frontend-cms-purchases-dsfinvk_export-item {
  display: block;
  list-style: none;

  .export-card {
    padding: 16px;
    margin-bottom: 16px;
  }

  .export-card.is-error {
    border-left: 4px solid @error-color;
  }

  .export-head {
    padding-bottom: 8px;
    border-bottom: 1px solid @dividers-color;
    margin-bottom: 8px;

    h2 {
      margin: 0;
    }
  }

  .export-body {

    .export-row {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 4px 0;
    }

    .export-row.error-row span:last-child {
      color: @error-color;
    }
  }

  .export-foot {
    padding-top: 8px;
    border-top: 1px solid @dividers-color;
    margin-top: 8px;

    a {
      color: @corporate-color;
    }

    span {
      vertical-align: middle;
      padding-right: 4px;
    }
  }
}


.elem-frontend-cms-purchases-open_signatures-item {
  display: block;
  list-style: none;

  .signature-card {
    padding: 16px;
    margin-bottom: 16px;
    border-left: 4px solid @error-color;
  }

  .signature-head {
    padding-bottom: 8px;
    border-bottom: 1px solid @dividers-color;
    margin-bottom: 8px;

    h2 {
      margin: 0;
    }
  }

  .signature-body {

    .signature-row {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 4px 0;
    }

    .signature-row.error-row span:last-child {
      color: @error-color;
    }
  }

  .signature-foot {
    padding-top: 8px;
    border-top: 1px solid @dividers-color;
    margin-top: 8px;

    a {
      color: @corporate-color;

      span {
        vertical-align: middle;
        padding-right: 4px;
      }
    }
  }
}


.elem-frontend-cms-purchases-overview-item {
  display: block;
  list-style: none;

  .transaction-card {
    position: relative;
    padding: 16px;
    margin-bottom: 16px;
  }

  .transaction-card.is-canceled {
    opacity: 0.7;
  }

  .transaction-head {
    padding-bottom: 8px;
    border-bottom: 1px solid @dividers-color;
    margin-bottom: 8px;

    h2 {
      margin: 0;
    }
  }

  .storno-label {
    position: absolute;
    top: 16px;
    right: 16px;
    padding: 2px 8px;
    border-radius: @basic-border-radius;
    background-color: @error-color;
    color: #ffffff;

    span {
      color: inherit;
    }
  }

  .storno-label.success {
    background-color: @corporate-color;
    color: #FFFFFF;
  }

  .storno-hint {
    color: @error-color;
  }

  .storno-btn {
    color: @error-color !important;

    span {
      vertical-align: middle;
      padding-right: 4px;
    }
  }

  .transaction-body {

    .transaction-row {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 4px 0;

      span:last-child {
        text-align: right;
      }

      .tx-id {
        word-break: break-all;
      }
    }

    .transaction-row.error-row span:last-child {
      color: @error-color;

      span {
        color: inherit;
      }
    }
  }

  .transaction-foot {
    overflow: hidden;
    padding-top: 8px;
    border-top: 1px solid @dividers-color;
    margin-top: 8px;

    a {
      float: left;
      display: block;
      width: 50%;
      color: @corporate-color;

      span {
        vertical-align: middle;
        padding-right: 4px;
      }

      span {
        color: inherit;
      }
    }
  }
}


.elem-frontend-cms-purchases-overview-transaction_list {

  .description {
    padding: 8px 0;
  }

  .transaction-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .no-data {
    padding: 24px 16px;
  }

  .pagination-bar {
    margin-top: 16px;
    padding: 8px;

    a {
      padding: 0 12px;
      color: @corporate-color;
      vertical-align: middle;
    }

    .page-info {
      vertical-align: middle;
    }
  }
}


.elem-frontend-cms-purchases-tse_archive-item {
  display: block;
  list-style: none;

  .archive-card {
    padding: 16px;
    margin-bottom: 16px;
  }

  .archive-card.is-error {
    border-left: 4px solid @error-color;
  }

  .archive-card.is-pending {
    border-left: 4px solid @dividers-color;
  }

  .archive-head {
    padding-bottom: 8px;
    border-bottom: 1px solid @dividers-color;
    margin-bottom: 8px;

    h2 {
      margin: 0;
    }
  }

  .archive-body {

    .archive-row {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      padding: 4px 0;
    }

    .archive-row.error-row span:last-child {
      color: @error-color;
    }

    .archive-hash {
      word-break: break-all;
      color: @secondary-text-color;
      max-width: 60%;
    }

    .verify-badge {
      display: inline-block;
      margin-left: 6px;
      padding: 1px 8px;
      border-radius: 10px;
      font-size: 11px;
      vertical-align: middle;
    }

    .verify-badge.is-ok {
      background: fade(@corporate-color, 15%);
      color: @corporate-color;
    }

    .verify-badge.is-bad {
      background: fade(@error-color, 15%);
      color: @error-color;
    }
  }

  .archive-foot {
    padding-top: 8px;
    border-top: 1px solid @dividers-color;
    margin-top: 8px;

    a {
      color: @corporate-color;
    }

    span {
      vertical-align: middle;
      padding-right: 4px;
    }
  }
}


.elem-frontend-cms-reservation-article {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-articleselect {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-customerselect {
  .cta-add-customer {
    padding-bottom: 24px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-customerselect-search-input {
  .elem-frontend-cms-elements-main_search {
    .card {
      padding-left: 0;
    }
  }
}

.elem-frontend-cms-reservation-delivery_payment {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-detail {

  .delivery-card {
    padding-right: 0;
  }

  .delivery-action-area {
    padding-right: 16px;
  }

  .delivery-payment {

    li.delivery-payment-item {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 16px;
      padding-left: 40px;

      .material-icons {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -12px;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  ol {
    li {
      display: inline;
    }

    li:not(:last-child)::after {
      content:', ';
    }
  }

  .has-already-invoice {
    display: inline-block;
    border-radius: @basic-border-radius;
    padding: 8px 24px;
    background-color: @dividers-color;
    color: @secondary-text-color;
    cursor: pointer;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-filter {

  .hiding-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .hiding-area.active-area {
    max-height: 20000px;
  }

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-overview {
  .filter {

    p {
      padding-bottom: 8px;
    }

    .delete-filter {
      padding-top: 8px;
    }
  }

  .toggle-outer {
    padding: 16px 0;

    .toggle {
      overflow: hidden;
      border-radius: @basic-border-radius;
      border: 1px solid @corporate-color;

      a {
        float: left;
        padding: 16px 8px;
        width: 33.33333333333333%;
        background-color: #ffffff;
        color: @secondary-text-color;
      }

      a.active {
        border: 1px solid @corporate-color;
        background-color: rgba(130, 197, 93, 0.2);
        color: @text-color;
        font-weight: @medium;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-wishes {

  .description-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .description-area.active-area {
    max-height: 500px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-articleselect-available_list {
  .card {
    padding-right: 0;

    .padding-right-area {
      padding-right: 8px;
    }
  }

  .available-item-list {
    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      padding-right: 16px;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-articleselect-bought_list {

  .card {
    padding-right: 0;

    .padding-right-area {
      padding-right: 8px;
    }
  }

  .charge-result {
    overflow: hidden;
    padding: 16px 0;
    padding-right: 16px;
    padding-bottom: 8px;

    .this-description {
      float: left;
      width: 55%;
    }

    .this-numbers {
      float: left;
      width: 45%;
    }

    .subhead{
      padding-bottom: 8px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-articleselect-packed_list {

  .card {
    padding-right: 0;

    .padding-right-area {
      padding-right: 8px;
    }
  }

  .charge-result {
    overflow: hidden;
    padding: 16px 0;
    padding-right: 16px;
    padding-bottom: 8px;

    .this-description {
      float: left;
      width: 55%;
    }

    .this-numbers {
      float: left;
      width: 45%;
    }

    .subhead{
      padding-bottom: 8px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-articleselect-available_list-item {
  padding-top: 8px;
  padding-bottom: 8px;

  .percentage-scala {
    position: relative;
    padding-top: 8px;
    padding-right: 36px;

    .add-item-outer {
      position: absolute;
      top: 50%;
      right: 0;
      margin-top: -30px;
      height: 36px;

      .preloader-wrapper {
        top: 6px;
        right: -6px!important;
      }

      .material-icons {
        position: absolute;
        top: 0;
        right: 0;
        padding: 14px 8px;
        padding-right: 0;
        color: @corporate-color;
        cursor: pointer;
      }

      .inactive-button {
        color: @hint-text-color;
        cursor: default;
      }
    }

    .elem-frontend-cms-reservation-overview-item-bar {
      padding-bottom: 4px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-articleselect-available_list-item-overview {
  overflow: hidden;
  padding: 0;

  .article-title {
    position: relative;
    padding-left: 22px;

    .article-status {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -8px;
      border-radius: 100%;
      background-color: @error-color;
      height: 12px;
      width: 12px;
    }

    .article-status.online {
      background-color: @corporate-color;
    }
  }

  .line-through {
    font-size: inherit;
    color: inherit;
    font-weight: inherit;
    text-decoration: line-through;
  }

  .this-description {
    position: relative;
    padding-right: 110px;
  }

  .this-numbers {
    position: relative;
    padding-right: 110px;
    min-height: 20px;
  }

  .this-text-right {
    position: absolute;
    top: 0;
    right: 0;
  }
}

.elem-frontend-cms-reservation-articleselect-bought_list-item {
  overflow: hidden;
  position: relative;
  border-bottom: 1px solid @dividers-color;
  max-height: 70px;
  -webkit-transition: max-height 0.3s;
  -moz-transition: max-height 0.3s;
  -ms-transition: max-height 0.3s;
  -o-transition: max-height 0.3s;
  transition: max-height 0.3s;

  .item-inner {
    position: relative;
    padding: 8px 0;
    padding-right: 48px;

    .remove-item-outer {
      position: absolute;
      top: 50%;
      right: 0;
      margin-top: -23px;
      height: 36px;

      .preloader-wrapper {
        top: 8px;
        right: 10px!important;
      }

      .remove-item {
        display: inline-block;
        position: absolute;
        top: 0;
        right: 0;
        padding: 14px 8px;
        padding-right: 16px;
        color: @error-color;
        cursor: pointer;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-articleselect-bought_list-item.bought-item-inactive {
  max-height: 0;
  border-bottom: none;
}

.elem-frontend-cms-reservation-articleselect-bought_list-result {


  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-articleselect-packed_list-item {
  overflow: hidden;
  position: relative;
  border-bottom: 1px solid @dividers-color;
  max-height: 70px;
  -webkit-transition: max-height 0.3s;
  -moz-transition: max-height 0.3s;
  -ms-transition: max-height 0.3s;
  -o-transition: max-height 0.3s;
  transition: max-height 0.3s;

  .item-inner {
    position: relative;
    padding: 8px 0;
    padding-right: 48px;

    .remove-item-outer {
      position: absolute;
      top: 50%;
      right: 0;
      margin-top: -23px;
      height: 36px;

      .preloader-wrapper {
        top: 8px;
        right: 10px!important;
      }

      .remove-item {
        display: inline-block;
        position: absolute;
        top: 0;
        right: 0;
        padding: 14px 8px;
        padding-right: 16px;
        color: @error-color;
        cursor: pointer;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-articleselect-packed_list-item.bought-item-inactive {
  max-height: 0;
  border-bottom: none;
}

.elem-frontend-cms-reservation-articleselect-packed_list-result {


  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-customerselect-customer_list {
  .add-customer-card {
    display: block;
    padding: 24px 16px;

    span.material-icons {
      display: inline-block;
      padding-bottom: 12px;
      color: @corporate-color;
      font-size: 54px;
    }

    color: @corporate-color;
  }
}

.elem-frontend-cms-reservation-customerselect-search {
  padding-bottom: 16px;

  .search-area {
    display: inline-block;
    position: relative;
    max-width: 450px;

    span.material-icons.search {
      position: absolute;
      top: 10px;
      left: 0;
      z-index: 1;
      padding: 0;
      padding-left: 8px;
      font-size: 24px;
      line-height: 54px;
      vertical-align: center;
    }

    .elem-frontend-cms-elements-form-input {
      display: block;
      min-width: 350px;

      .input-field {
        display: block;

        input {
          padding-left: 46px;
        }

        label {
          left: 46px !important;
        }
      }
    }
  }
}



.elem-frontend-cms-reservation-customerselect-customer_list-customer {

  .customer_id {
    padding-top: 8px;
  }

  h2 {
    padding-bottom: 16px;
  }

  .address {
    padding-bottom: 8px;
  }

  .blocked-customer {
    border: 1px solid @error-color;
    padding: 2px;
    color: @error-color;
  }

  .this-action-icons {
    overflow: hidden;
    padding-top: 16px;

    .icon-button {
      float: left;
      display: inline-block;
      padding: 8px 13px;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }

    .icon-button:first-child {
      padding-left: 0;
    }

    .icon-button:last-child {
      padding-right: 0;
    }

    .icon-button.right-align {
      float: right;
    }
  }

  .btn-flat {
    padding-right: 0;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-detail-bought_list {
  .card {
    padding-right: 0;
  }

  .delivery-date {
    padding: 16px 0;
    padding-right: 16px;

    .body1 {
      padding-bottom: 8px;
      color: #1D3C1B;
    }

    .no-delivery {
      color: @error-color;
    }

    .inactive-btn {
      color: @text-color !important;
      background-color: @background-color;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-detail-bought_list-item {
  overflow: hidden;
  position: relative;
  border-bottom: 1px solid @dividers-color;
  max-height: 70px;
  -webkit-transition: max-height 0.3s;
  -moz-transition: max-height 0.3s;
  -ms-transition: max-height 0.3s;
  -o-transition: max-height 0.3s;
  transition: max-height 0.3s;

  .item-inner {
    position: relative;
    padding: 8px 0;
    padding-right: 48px;

    .remove-item-outer {
      position: absolute;
      top: 50%;
      right: 0;
      margin-top: -23px;
      height: 36px;

      .preloader-wrapper {
        top: 8px;
        right: 10px!important;
      }

      .remove-item {
        display: inline-block;
        position: absolute;
        top: 0;
        right: 0;
        padding: 14px 8px;
        padding-right: 16px;
        color: @error-color;
        cursor: pointer;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-detail-bought_list-item.bought-item-inactive {
  max-height: 0;
  border-bottom: none;
}

.elem-frontend-cms-reservation-detail-bought_list-result {
  overflow: hidden;
  padding: 16px 0;
  padding-right: 16px;
  padding-bottom: 8px;

  .this-description {
    float: left;
    width: 55%;
  }

  .this-numbers {
    float: left;
    width: 45%;
  }

  .subhead{
    padding-bottom: 8px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-filter-item {
  position: relative;
  cursor: pointer;

  section {
    padding-bottom: 8px;
  }

  span.toggle-button {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    opacity: 0;
    padding: 4px 0;
    font-size: 32px;

    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }

  span.toggle-button.active-button {
    opacity: 1;
    z-index: 1;
  }



  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-overview-filter_text {
  span {
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    color: inherit;
  }

  span:after {
    content:  ", ";
  }

  span:last-child:after {
    content: "";
  }
}

.elem-frontend-cms-reservation-overview-filtered_customer {
  span {
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    color: inherit;
  }

  span:after {
    content:  ", ";
  }

  span:last-child:after {
    content: "";
  }
}

.elem-frontend-cms-reservation-overview-item {

  .card {
    section {
      padding-bottom: 8px;
    }
  }

  .quick-view {
    overflow: hidden;
    padding-top: 8px;

    .number-date, .price-range {
      float: left;
      width: 50%;
    }
  }

  .cus-company-name {
    padding-bottom: 8px;
  }

  .is-error {
    color: @error-color;
  }

  .this-action-icons {
    overflow: hidden;
    padding-top: 8px;

    .icon-button {
      display: inline-block;
      padding: 8px 0;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }
  }

  .date-list {
    span {
      font-size: inherit;
      font-weight: inherit;
      color: inherit;
    }

    span:after {
      content: ", ";
    }

    span:last-child:after {
      content: "";
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-overview-item-bar {
  position: relative;
  padding: 8px 0;

  .status-slider {
    overflow: hidden;
    display: inline-block;
    position: relative;
    margin-top: 3px;
    border: 1px solid @corporate-color;
    border-radius: 7px;
    height: 14px;
    width: 100%;

    .status-slider-inner {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      border-radius: 7px;
      height: 12px;
      background-color: @corporate-color;
      -webkit-transition: width 0.5s, background-color 0.5s;
      -moz-transition: width 0.5s, background-color 0.5s;
      -ms-transition: width 0.5s, background-color 0.5s;
      -o-transition: width 0.5s, background-color 0.5s;
      transition: width 0.5s, background-color 0.5s;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation-overview-item-item_head {

}

.elem-frontend-cms-reservation_new-close_delivery {
  .card {
    padding: 0;

    .this-card-head {
      padding: 8px 16px;
      padding-bottom: 0;
    }

    .this-card-body {
      padding-left: 16px;
      padding-bottom: 16px;
    }
  }

  .radio, .elem-frontend-cms-elements-form-radio {
    padding-bottom: 0 !important;
  }

  .extendable-area {
    overflow: hidden;
    padding-right: 16px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .extendable-area.extend {
    max-height: 10000px;
  }

  .choose-template-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .choose-template-area.show-select {
    padding-right: 16px;
    max-height: 700px;
  }
}

.elem-frontend-cms-reservation_new-delivery_detail {
  overflow: hidden;
  height: 100%;

  .toggle-outer {
    padding-top: 16px;
  }

  .action-button {
    padding-top: 16px;

    span.material-icons {
      display: inline-block;
      padding-right: 8px;
      color: inherit;
      vertical-align: middle;
    }
  }

  .reservation-action-area {
    padding: 16px;
    padding-bottom: 0;
    border-top: 1px solid @dividers-color;

    .toggle-outer {
      padding-top: 0;
    }
  }

  .action-buttons {
    padding-top: 8px;

    a {
      display: block;
      margin: 8px 0;
      text-align: right;
    }

    span.btn-disabled {
      color: @hint-text-color;
      cursor: inherit;
    }
  }

  form {
    height: 100%;
  }

  .product-card {
    padding: 8px 0;
  }

  .product-title {
    padding: 8px 16px;
    padding-bottom: 16px;
  }

  .reservation-overview {
    padding: 16px 0;
  }
}

.elem-frontend-cms-reservation_new-delivery_list_order {
  padding-left: 0;
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  .sort-list-card {
    padding: 8px 0;
  }

  ul {
    padding-left: 16px;

    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  ul {
    li {
      position: relative;
      padding-right: 40px;

      .edit-article {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -22px;
        padding: 8px 0;
        padding-left: 16px;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-delivery_list_order.space_for_sidenav {
  padding-left: 350px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}

.elem-frontend-cms-reservation_new-edit_template {
  height: 100%;

  .elem-frontend-cms-elements-form-radio:last-child {
    padding-bottom: 0;
  }
}

.elem-frontend-cms-reservation_new-overview {
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  .filter-area {
    padding: 16px 0;

    a.btn-flat {
      color: @corporate-color;

      span {
        display: inline-block;
        padding: 0;
        padding-right: 8px;
        vertical-align: middle;
        color: inherit;
      }
    }
  }

  .filter {

    p {
      padding-bottom: 8px;
    }

    .delete-filter {
      padding-top: 8px;
    }
  }

  .toggle-outer {
    padding: 16px 0;

    .toggle {
      overflow: hidden;
      border-radius: @basic-border-radius;
      border: 1px solid @corporate-color;

      a {
        float: left;
        padding: 16px 8px;
        width: 33.33333333333333%;
        background-color: #ffffff;
        color: @secondary-text-color;
      }

      a.active {
        border: 1px solid @corporate-color;
        background-color: rgba(130, 197, 93, 0.2);
        color: @text-color;
        font-weight: @medium;
      }
    }
  }

  .highlight-text {

    a {
      padding-right: 8px;
      padding-left: 8px;
      color: @error-color !important;
    }

    .delete-filter {
      padding-right: 8px;
      padding-left: 8px;

      .material-icons {
        padding-right: 0;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.content-body.side-action-nav-is-open {
  padding-left: 300px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-pack {
  height: 100%;

  .hidden-submit {
    display: none;
  }
}

.elem-frontend-cms-reservation_new-reserved_article {
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  .article-content {
    overflow: hidden;
  }
}

.elem-frontend-cms-reservation_new-reserved_article.space_for_sidenav {
  padding-left: 350px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}

.elem-frontend-cms-reservation_new-send_email {
  height: 100%;

  .elem-frontend-cms-elements-form-radio:last-child {
    padding-bottom: 0;
  }

  .subject {
    padding-bottom: 16px;
  }

  .ct-action {
    padding-bottom: 8px;
  }
}

.elem-frontend-cms-reservation_new-change_edit-choose_charge {
  overflow: hidden;
  height: 100%;

  .filter-area {
    padding: 16px 0;

    a.btn-flat, span.btn-flat {
      color: @corporate-color;

      span {
        display: inline-block;
        padding: 0;
        padding-right: 8px;
        vertical-align: middle;
        color: inherit;
      }
    }
  }

  .highlight-text {

    a.hightlight-button, span.hightlight-button {
      padding-right: 8px;
      padding-left: 8px;
      color: @error-color !important;
    }

    .delete-filter {
      padding-right: 8px;
      padding-left: 8px;

      .material-icons {
        padding-right: 0;
        color: @error-color !important;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-choose_charge-popup {
  .cancel {
    color: @hint-text-color;
    float: left;
  }
}

.elem-frontend-cms-reservation_new-choose_charge-popup-filter {
  padding: 16px;
  padding-right: 0;

  .hiding-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .hiding-area.active-area {
    max-height: 20000px;
  }

  .toggle-button {
    right: 8px !important;
  }

  ul {
    li {
      padding: 8px 0;
      padding-right: 16px;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .link-area {
    margin-bottom: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-deliver_now-choose_charge {
  overflow: hidden;
  height: 100%;

  .filter-area {
    padding: 16px 0;

    a.btn-flat, span.btn-flat {
      color: @corporate-color;

      span {
        display: inline-block;
        padding: 0;
        padding-right: 8px;
        vertical-align: middle;
        color: inherit;
      }
    }
  }

  .highlight-text {

    a.hightlight-button, span.hightlight-button {
      padding-right: 8px;
      padding-left: 8px;
      color: @error-color !important;
    }

    .delete-filter {
      padding-right: 8px;
      padding-left: 8px;

      .material-icons {
        padding-right: 0;
        color: @error-color !important;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-deliver_now-finish {
  overflow: hidden;
  height: 100%;

  .this-card {
    padding-top: 16px;
    padding-right: 0;

    h2 {
      padding-bottom: 16px;
    }

    .input-area {
      padding-right: 16px;
    }

    .hidden-area {
      overflow: hidden;
      max-height: 0;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;
    }

    .hidden-area.visible {
      max-height: 20000px;
    }

    .collapsible-area {
      overflow: hidden;
      max-height: 0;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;
    }

    .collapsible-area.active-area {
      max-height: 20000px;
    }

    .choose-template-area {
      overflow: hidden;
      max-height: 0;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;
    }

    .choose-template-area.show-select {
      padding-right: 16px;
      max-height: 700px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-deliver_now-overview {
  height: 100%;

  .product-card {
    padding: 8px 0;
  }

  .product-title {
    padding: 8px 16px;
    padding-bottom: 16px;
  }

  .reservation-overview {
    padding: 16px 0;
  }

  .add-discount {
    padding-top: 16px;
    padding-bottom: 8px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-deliver_now-pack {
  height: 100%;

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-deliver_now-choose_charge-select_charge {
  height: 100%;

  .reservation_count {
    padding-top: 16px;
    padding-bottom: 8px;
  }

  .action-area.first {
    padding-top: 16px;
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding: 3px 16px;
      vertical-align: bottom;
    }

    .elem-frontend-cms-elements-form-checkbox {
      display: inline-block;
      vertical-align: middle;
    }
  }
}

.elem-frontend-cms-reservation_new-deliver_now-choose_charge-customer_list-item.card {
  padding: 0;

  .no-entry {
    padding: 8px 16px;
  }

  .customer_id {
    padding-top: 10px;
  }

  .customer-detail-inner {
    overflow: hidden;
    border-bottom: 1px solid @dividers-color;
    padding-bottom: 8px;

  }

  .has-error {
    color: @error-color;
  }

  .charge-description, .reservation-detail, .customer-details {
    float: left;
    display: block;
    padding: 6px 0;
    width: 80%;
  }

  .customer-details {
    padding-left: 16px;

    h2 {
      padding-bottom: 4px;
    }
  }

  .action-area {
    float: left;
    display: block;
    width: 20%;

    label {
      text-align: right;
    }
  }

  .customer-checkbox {
    padding-top: 8px;
  }

  li {
    padding: 0;

    .card-head {
      overflow: hidden;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 16px;
      padding-right: 0;
    }

    .charge-detail {
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      padding-left: 16px;

      h4 {
        padding-top: 4px;
        padding-bottom: 8px;
      }

      .charge-head {
        overflow: hidden;
      }

      ol {
        li {
          border-bottom: 1px solid @dividers-color;
          padding: 4px 0;
          padding-right: 16px;
        }

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .expand-toggle {
      display: block;
      padding: 8px 16px;
      cursor: pointer;
    }
  }

  ol {
    li:first-child {
      margin-top: 0;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-deliver_now-choose_charge-customer_list-item-reservation {
  .card-head {
    .elem-frontend-cms-elements-form-checkbox {
      padding-top: 4px;
    }
  }

  .wishes {
    padding-top: 8px;
  }

  div.reservation-card.card-head {
    border-bottom: none;
  }

  .deliverytype {
    padding-top: 8px;
  }

  .charge-detail-outer {
    overflow: hidden;
    border-bottom: 1px solid @dividers-color;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .charge-detail-outer.active-list {
    max-height: 1000px;
  }

  .expand-toggle {

  }

  .expand-toggle.open-toggle {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
  }
}

.elem-frontend-cms-reservation_new-deliver_now-choose_charge-customer_list-item-reservation-charge.charge-detail {
  margin-left: 16px !important;
  border-top: 1px solid @dividers-color;
  border-bottom: none !important;
  padding-left: 0 !important;

  ol {
    li {
      border-bottom: none !important;
    }
  }
}

.elem-frontend-cms-reservation_new-delivery_list_order-item {
  position: relative;
  cursor: grab;

  p.body1 {
    padding-top: 4px;
  }

  p.radio {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -18px;
    padding-bottom: 14px;

    label {
      display: block;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      height: auto;

      span {
        height: auto !important;
      }

      [type="radio"] + span:before, [type="radio"] + span:after {
        top: 50% !important;
        margin-top: -8px;
      }
    }

    label:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-reservation_new-delivery_list_order-item:active, .elem-frontend-cms-reservation_new-delivery_list_order-item:focus {
  cursor: grabbing;
}

.elem-frontend-cms-reservation_new-detail-appointment.card {
  padding: 16px 0;

  h2 {
    padding: 0 16px;
    padding-bottom: 16px;
  }

  ul {
    padding-left: 16px;

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      padding-right: 16px;
      padding-left: 42px;

      span.material-icons {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -14px;
        font-size: 28px;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .action-buttons {
    span {
      display: block;
    }
  }

  .new-appointment-inquery.has-error {
    overflow: hidden;
    padding: 0;
    max-height: 0;
    color: @error-color;
    -webkit-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -moz-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -ms-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -o-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
  }

  .new-appointment-inquery.has-error.is-active {
    padding: 8px 0;
    max-height: 500px;
  }
}

.elem-frontend-cms-reservation_new-detail-article_list {

  h3 {
    padding: 8px 16px;
    background-color: @secondary-text-color;
    color: #ffffff;
  }

  ul {
    padding: 8px 0;
    padding-left: 16px;

    li {
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      padding-right: 16px;

      h4 {
        overflow: hidden;
        position: relative;
        padding-top: 4px;
        padding-right: 38px;
        padding-bottom: 4px;
        cursor: pointer;

        span.arrow_drop {
          position: absolute;
          top: 50%;
          right: -4px;
          margin-top: -16px;
          font-size: 30px;
        }
      }

      .article-list {
        overflow: hidden;
        padding-top: 0;
        max-height: 0;
        -webkit-transition: max-height 0.3s, padding-top 0.3s;
        -moz-transition: max-height 0.3s, padding-top 0.3s;
        -ms-transition: max-height 0.3s, padding-top 0.3s;
        -o-transition: max-height 0.3s, padding-top 0.3s;
        transition: max-height 0.3s, padding-top 0.3s;

        .article {
          overflow: hidden;
          padding: 4px 0;

          .body1 {
            overflow: hidden;
            padding-right: 38px;

            .full-width {
              width: 100%;
            }
          }
        }
      }
    }

    li.expanded-area {
      h4 {
        span.arrow_drop {
          -webkit-transform: rotate(180deg);
          -moz-transform: rotate(180deg);
          -ms-transform: rotate(180deg);
          -o-transform: rotate(180deg);
          transform: rotate(180deg);
        }
      }

      .article-list {
        padding-top: 4px;
        max-height: 5000px;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .complete-price-outer {
    padding: 16px;
    padding-top: 0;
    padding-right: 0;
  }

  .no-article-area {
    padding: 16px;
  }
}

.elem-frontend-cms-reservation_new-detail-invoice.invoice-card {
  padding-top: 16px;
  padding-right: 0;

  h2 {
    padding-bottom: 16px;
  }

  h2, p {
    padding-right: 16px;
  }

  .get-invoice-area {
    padding-top: 8px;

    span {
      display: inline-block;
      padding: 8px;
    }
  }

  .pill-list {
    overflow: hidden;

    .pill {
      float: left;
      margin: 2px 0;
      border-radius: 50px;
      padding: 2px 8px;
      background-color: @corporate-color;
      color: #FFFFFF;
    }

    .pill:last-child {
      margin-right: 0;
    }

    .pill.success {
      background-color: @corporate-color;
    }

    .pill.syf {
      background-color: #74B49B;
    }

    .pill.not-in-delivery {
      background-color: @error-color;
    }
  }

  .invoice-list {
    .invoice-item {
      position: relative;
      padding: 8px 0;
      padding-right: 90px;

      .this-action-icons {
        overflow: hidden;
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -22px;
        padding-right: 8px;

        .icon-button {
          float: left;
          display: inline-block;
          padding: 8px 6px;

          span {
            font-size: 28px;
            color: @dark-corporate-color;
          }
        }
      }
    }
  }
}

.elem-frontend-cms-reservation_new-detail-payment.card {
  padding: 0;

  .stripe-status {
    display: inline-block;
    border-radius: 8px;
    padding: 2px 8px;
    color: #ffffff;
  }

  .stripe-status.succeeded {
    background-color: @corporate-color;
  }

  .stripe-status.canceled, .stripe-status.payment_failed, .stripe-status.requires_action, .stripe-status.requires_payment_method {
    background-color: @error-color;
  }

  .stripe-status.started, .stripe-status.processing {
    background-color: @progress-color;
    color: @secondary-text-color;
  }

  .payment-head {
    padding: 16px;
    padding-bottom: 0;
  }

  ul.payment-list {

    li.payment-item {
      position: relative;
      padding-right: 140px;
      padding-bottom: 8px;

      p.payment-title {
        color: @corporate-color;
      }

      .payment-amount {
        position: absolute;
        top: 50%;
        right: 48px;
        margin-top: -10px;
      }

      .edit-payment {
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -12px;

        span {
          font-size: 24px;
          color: @corporate-color;
          cursor: pointer;
        }
      }
    }

    li.payment-item:last-child {
      padding-bottom: 0;
    }
  }

  .action-button {
    padding: 4px 0;
  }

  div.payment-list {
    padding: 16px;

  }

  .payment-balance {
    border-top: 1px solid @dividers-color;
    padding: 16px;
    padding-right: 0;
    padding-bottom: 8px;

    ul.payment-list  {
      padding-right: 16px;
    }

    .add-payment {
      padding-top: 16px;
    }
  }
}

.elem-frontend-cms-reservation_new-detail-wishes.wish-card {
  padding: 16px !important;

  h2 {
    padding-bottom: 16px;
  }

  .wish-detail {
    padding: 16px 0;
    padding-top: 0;

    .no-date {
      padding-bottom: 4px;
    }
  }

  .wish-detail:last-child {
    padding-bottom: 0;
  }
}

.elem-frontend-cms-reservation_new-detail-article_list-details {
  span.opzimized-span {
    float: left;
    display: block;
    width: 65%;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    font-family: inherit;
  }

  span.price-col {
    display: block;
    width: 35%;
  }
}

.elem-frontend-cms-reservation_new-detail-article_list-price.complete-price {
  overflow: hidden;
  padding-top: 8px;

  span.opzimized-span {
    float: left;
    display: block;
    width: 65%;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    font-family: inherit;
  }

  span.price-col {
    display: block;
    width: 35%;
  }

  p {
    overflow: hidden;
    padding: 4px 0;
  }

  .discount {
    position: relative;

    .edit {
      position: absolute;
      top: 50%;
      right: 8px;
      margin-top: -20px;
      padding: 8px;
      font-size: 24px;
      color: @corporate-color;
      cursor: pointer;
    }

    .edit-disabled {
      position: absolute;
      top: 50%;
      right: 8px;
      margin-top: -20px;
      padding: 8px;
      font-size: 24px;
    }
  }
}

.elem-frontend-cms-reservation_new-detail-article_list-price.complete-price.edit-button {
  p {
    padding-right: 54px;
  }
}

.elem-frontend-cms-reservation_new-detail-invoice-button {

  .disabled-button {
    display: inline-block;
    padding: 8px 16px !important;
  }
}

.elem-frontend-cms-reservation_new-detail-invoice-confirmation {
  .card {
    border-radius: 0 !important;
    padding: 8px 0;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-right: 16px;
      padding-bottom: 16px;
      padding-left: 16px;
    }

    .popup-body {
      padding: 0 16px;

      .check-form {
        padding: 8px 0;
      }
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  .first-check {
    display: none;
  }

  .first-check.active-form-element {
    display: block;
  }

  .second-check {
    display: none;
  }

  .second-check.active-box {
    display: block;
  }

  #cancel {
    float: left;
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }

  .choose-template-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .choose-template-area.show-select {
    max-height: 700px;
  }
}

.elem-frontend-cms-reservation_new-detail-invoice-confirmation.active-popup {
  display: block;
}

.elem-frontend-cms-reservation_new-detail-payment-down_mail_list {
  ul.mail-log-list {
    li {
      padding: 4px 0;
    }

    li:first-child {
      padding-top: 20px;
    }

    li:last-child {
      padding-bottom: 8px;
    }
  }
}

.elem-frontend-cms-reservation_new-detail-payment-popup {
  .card {
    border-radius: 0 !important;
    padding: 8px 0;
    width: 328px !important;

    .popup-head {
      position: relative;
      padding-top: 8px;
      padding-right: 48px;
      padding-bottom: 16px;
      padding-left: 16px;

      .delete-payment-button {
        position: absolute;
        top: 50%;
        right: 8px;
        margin-top: -20px;
        padding: 8px;

        span {
          font-size: 24px;
          color: @hint-text-color;
        }
      }
    }

    .popup-body {
      padding: 0 16px;

      .toggle-outer {
        padding-bottom: 8px;

        div {
          height: 50px;

          label {
            padding-top: 6px;
            padding-bottom: 6px;
          }
        }
      }

      .check-form {
        padding: 8px 0;
      }

      label {
        border-bottom: none;
      }

      .elem-frontend-cms-elements-form-radio {
        padding-bottom: 0;
      }

      .decision-area {
        padding-bottom: 16px;
      }
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  .check-form {
    display: none;
  }

  .check-form.active-form-element {
    display: block;
  }

  #cancel {
    float: left;
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-reservation_new-detail-payment-popup.active-popup {
  display: block;
}

.elem-frontend-cms-reservation_new-elements-delivery_menu {
  position: relative;
  z-index: 50;

  .card {
    position: fixed;
    z-index: 9;
    bottom: 0;
    left: -302px;
    margin: 0;
    border-radius: 0;
    padding: 0;
    height: 100%;
    width: 302px;
    background-color: @dark-corporate-color;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;

    form {
      height: 100%;
    }

    .action-list {
      padding-bottom: 110px;
      height: 100%;
      width: 302px;
      background-color: @dark-corporate-color;

      ul {
        overflow-y: auto;
        height: 100%;
        padding-left: 24px;

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .action-list.show-list {
      height: 100%;
      width: 302px;
    }
  }

  .card.main-nav-active {
    left: 0;
    width: 302px;
  }

  @media @xs {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @sm {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 56px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 24px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: auto;
      max-height: 54px;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @md {

  }
}


.elem-frontend-cms-reservation_new-elements-delivery_menu-button {
  border-bottom: 1px solid #ffffff;
  padding-right: 24px;
  padding-left: 0 !important;

  button {
    display: block;
    border: none;
    padding: 16px 0;
    width: 100%;
    background-color: transparent;
    color: #ffffff;
    text-align: left;
    cursor: pointer;

    span {
      display: inline-block;
      color: #ffffff;
      vertical-align: middle;
      cursor: pointer;
      -webkit-transition: color 0.3s;
      -moz-transition: color 0.3s;
      -ms-transition: color 0.3s;
      -o-transition: color 0.3s;
      transition: color 0.3s;
    }

    span.material-icons {
      padding-right: 16px;
    }
  }

  button.inactive-button {
    cursor: inherit;

    span {
      color: @secondary-text-color;
      cursor: inherit;
    }
  }
}

.elem-frontend-cms-reservation_new-elements-delivery_menu-link {
  border-bottom: 1px solid #ffffff;
  padding-right: 24px;
  padding-left: 0 !important;

  a {
    display: block;
    border: none;
    padding: 16px 0;
    width: 100%;
    background-color: transparent;
    color: #ffffff;
    text-align: left;
    cursor: pointer;

    span {
      display: inline-block;
      color: #ffffff;
      vertical-align: middle;
      cursor: pointer;
    }

    span.material-icons {
      padding-right: 16px;
    }
  }
}

.elem-frontend-cms-reservation_new-elements-delivery_menu-menu.menu-area {
  position: relative;
  padding: 0 24px;
  height: auto;
  width: 100%;
  cursor: default;

  p {
    padding: 14px 0;
    color: #ffffff;
  }

  span.material-icons.close {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    padding: 0 16px;
    font-size: 28px;
    color: rgba(255, 255, 255, 0.72) !important;
    line-height: 54px;
    vertical-align: center;
    -webkit-transition: transform 0.3s;
    -moz-transition: transform 0.3s;
    -ms-transition: transform 0.3s;
    -o-transition: transform 0.3s;
    transition: transform 0.3s;
  }

  span.material-icons.close.menu-is-open {
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  @media @xs {
    span.material-icons.close {
      display: inline-block;
    }
  }

  @media @sm {
    span.material-icons.close {
      display: inline-block;
    }
  }
}

.elem-frontend-cms-reservation_new-overview-delivery_item {
  .card {
    padding: 8px 16px;

    .mail-error {
      overflow: hidden;
      padding: 2px 0;

      .pill {
        float: left;
        margin: 4px 0;
        margin-right: 8px;
        border-radius: 50px;
        padding: 4px 10px;
        background-color: @error-color;
        color: #FFFFFF;
      }
    }

    .info {
      display: inline-block;
      padding-right: 4px;
      cursor: pointer;
      vertical-align: middle;
    }

    .card-title {
      position: relative;
      padding: 8px 100px;
      padding-left: 0;
    }

    .delivery-payment {
      padding: 8px 0;
    }

    .wishes {
      padding: 8px 0;
      cursor: pointer;

      p {
        color: @secondary-text-color;

        span.material-icons {
          display: none;
          color: @secondary-text-color;
        }
      }
    }

    .wishes.show-important {
      p {
        color: @error-color;

        span.material-icons {
          color: @error-color;
        }
      }
    }

    .delivery-actions {
      overflow: hidden;
      padding: 0 16px;
      padding-top: 16px;

      a {
        display: block;
        float: right;
        width: 50%;
        color: @corporate-color !important;
      }
    }

    .invoice-payment {
      padding-top: 8px;
      padding-bottom: 8px;

      span.corporate-color {
        color: @corporate-color;
        font-size: inherit;
        font-weight: inherit;
        cursor: pointer;
      }
    }
  }

  .customer-summery {
    overflow: hidden;
    display: block;
    padding: 8px 0;
    cursor: pointer;

    span {
      float: left;
      display: block;
    }

    span:first-child {
      width: 70%;
    }

    span:last-child {
      width: 30%;
    }

    .corporate-color {
      color: @corporate-color;
    }
  }

  .card.customer-detail {
    position: relative;

    .customer-detail-inner {
      position: relative;
      padding-top: 8px;
      padding-bottom: 8px;
      padding-right: 48px;

      .customer-select {
        display: inline-block;
        position: absolute;
        top: 0;
        right: -16px;
      }
    }
  }

  .pill-list {
    overflow: hidden;

    .pill {
      float: left;
      margin: 4px 0;
      margin-right: 8px;
      border-radius: 50px;
      padding: 4px 10px;
      background-color: @corporate-color;
      color: #FFFFFF;
    }

    .pill:last-child {
      margin-right: 0;
    }

    .pill.syf {
      background-color: #74B49B;
    }

    .pill.not-in-delivery {
      background-color: @error-color;
    }
  }

  .delivery-date {
    padding: 8px 0;
    padding-bottom: 16px;
    vertical-align: middle;

    .date-info {
      display: block;
      position: relative;
      padding-left: 30px;

      span.material-icons {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -11px;
        margin-right: 8px;
        font-size: 22px;
      }

      span.medium, span.bold {
        display: block;
      }

      .no-appointment {
        color: @secondary-text-color !important;
      }

      .pending {
        color: #96C9DC !important;
      }

      .denied {
        color: @error-color !important;
      }

      .accepted {
        color: @corporate-color !important;
      }
    }

    p.cancel-message {
      display: block;
      padding-top: 4px;
      color: @error-color;
    }
  }
}

.elem-frontend-cms-reservation_new-overview-item {
  .card {
    position: relative;
    padding: 8px 16px;

    .storno-label {
      position: absolute;
      top: 50%;
      right: 50%;
      margin-top: -14px;
      margin-right: -158px;
      -webkit-transform: rotate(15deg);
      -moz-transform: rotate(15deg);
      -ms-transform: rotate(15deg);
      -o-transform: rotate(15deg);
      transform: rotate(15deg);

      .headline {
        border: 1px solid fade(@error-color, 54%);
        padding: 8px 16px;
        color: fade(@error-color, 54%);
      }
    }

    .info {
      display: inline-block;
      padding-right: 4px;
      cursor: pointer;
      vertical-align: middle;
    }

    .card-title {
      position: relative;
      padding: 8px 100px;
      padding-left: 0;
    }

    .delivery-payment {
      padding: 8px 0;
      cursor: pointer;
    }

    .future-appointment {
      padding: 8px 0;
      cursor: pointer;

      p {
        color: @error-color;

        span.material-icons {
          color: @error-color;
        }
      }
    }

    .wishes {
      padding: 8px 0;
      cursor: pointer;

      p {
        color: @secondary-text-color;

        span.material-icons {
          color: @secondary-text-color;
        }
      }
    }

    .wishes.show-important {
      p {
        color: @error-color;

        span.material-icons {
          color: @error-color;
        }
      }
    }

    .delivery-actions {
      overflow: hidden;
      padding: 0 16px;
      padding-top: 16px;

      a.btn-flat {
        display: block;
        float: left;
        width: 50%;
        color: @corporate-color !important;
      }
    }
  }

  .pill-list {
    overflow: hidden;

    .pill {
      float: left;
      margin: 4px 0;
      margin-right: 8px;
      border-radius: 50px;
      padding: 4px 10px;
      background-color: @corporate-color;
      color: #FFFFFF;
    }

    .pill:last-child {
      margin-right: 0;
    }

    .pill.syf {
      background-color: #74B49B;
    }

    .pill.not-in-delivery {
      background-color: @error-color;
    }
  }

  .customer-summery {
    overflow: hidden;
    display: block;
    padding: 8px 0;
    cursor: pointer;

    span {
      float: left;
      display: block;
    }

    span:first-child {
      width: 70%;
    }

    span:last-child {
      width: 30%;
    }
  }

  .corporate-color {
    color: @corporate-color;
  }

  .card.customer-detail {
    position: relative;

    .customer-detail-inner {
      position: relative;
      padding-top: 8px;
      padding-bottom: 8px;
      padding-right: 48px;

      .customer-select {
        display: inline-block;
        position: absolute;
        top: 0;
        right: -16px;
      }
    }
  }
}

.elem-frontend-cms-reservation_new-overview-list_filter_title {
  padding-top: 24px;
}

.elem-frontend-cms-reservation_new-overview-navigation.card {
  position: relative;
  z-index: 1;
  margin: 0;
  border-radius: 0;
  padding: 8px 40px;

  span.material-icons {
    position: absolute;
    top: 0;
    left: 0;
    padding: 14px 8px;
    background-color: #ffffff;
    color: @hint-text-color;
  }

  span.material-icons.active-chev {
    color: @text-color;
  }

  span.material-icons.prev-button {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  span.material-icons.next-button {
    right: 0;
    left: inherit;
  }

  ul {
    overflow: hidden;
    width: 20000px;
    -webkit-transition: margin-left 0.3s, margin-right 0.3s;
    -moz-transition: margin-left 0.3s, margin-right 0.3s;
    -ms-transition: margin-left 0.3s, margin-right 0.3s;
    -o-transition: margin-left 0.3s, margin-right 0.3s;
    transition: margin-left 0.3s, margin-right 0.3s;

    .nav-item {
      float: left;
      display: inline-block;
      margin: 0 8px;
      border-radius: @basic-border-radius;
      -webkit-transition: background-color 0.3s;
      -moz-transition: background-color 0.3s;
      -ms-transition: background-color 0.3s;
      -o-transition: background-color 0.3s;
      transition: background-color 0.3s;

      a {
        display: block;
        padding: 8px;
        -webkit-transition: color 0.3s;
        -moz-transition: color 0.3s;
        -ms-transition: color 0.3s;
        -o-transition: color 0.3s;
        transition: color 0.3s;
      }

      a.not-assignt {
        color: @error-color;
      }
    }

    .nav-item.active-nav, .nav-item:hover {
      background-color: @corporate-color;

      a {
        color: #FFFFFF;
      }
    }
  }
}

.elem-frontend-cms-reservation_new-overview-reservation_list {
  padding-bottom: 24px;

  .print-area {
    padding-bottom: 16px;

    .button-area {
      padding-bottom: 8px;
    }
  }

  .checkbox {
    display: inline-block;
  }

  .action-area {
    position: relative;
    min-height: 30px;

    .sort-list-button {
      position: absolute;
      top: 0;
      left: 0;
      width: 60%;
      vertical-align: inherit;

      span {
        padding-right: 8px;
        vertical-align: middle;
        color: inherit;
      }
    }
  }

  .action-area.first {
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding-top: 7px;
      padding-right: 8px;
      vertical-align: middle;
    }
  }

  .add-customer-card {
    display: block;
    padding: 24px 16px;

    span.material-icons {
      display: inline-block;
      padding-bottom: 12px;
      color: @corporate-color;
      font-size: 54px;
    }

    color: @corporate-color;
  }
}

.elem-frontend-cms-reservation_new-overview-delivery_item-appointment {
  cursor: pointer;
}

.elem-frontend-cms-reservation_new-overview-filter_list-popover {
  position: relative;
  height: 0;

  .clickable-layover {
    display: none;
    position: fixed;
    z-index: 35;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    overflow: hidden;
  }

  .article-popover-content {
    height: 100%;
  }

  .card {
    position: fixed;
    z-index: 41;
    bottom: 0;
    left: -300px;
    margin: 0;
    border-radius: 0;
    padding: 0;
    height: 100%;
    width: 300px;
    background-color: @dark-corporate-color;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;

    .action-list {
      padding-bottom: 45px;
      height: 100%;
      width: 300px;

      ul {
        overflow-y: auto;
        height: 100%;
        padding-left: 16px;

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .action-list.show-list {
      height: 100%;
      width: 300px;
    }

    .action-area {
      display: none;
    }
  }

  .card.main-nav-active {
    left: 0;
    width: 300px;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;

    .action-area {
      display: block;
    }
  }

  @media @xs {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 45px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 16px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: 100%;
      max-height: 90%;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @sm {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 45px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 16px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: 100%;
      max-height: 90%;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-overview-filter_list-popover.active-popup {
  height: 100%;

  .clickable-layover {
    display: block;
  }
}


.elem-frontend-cms-reservation_new-overview-filter_list-popover-content {
  position: relative;

  .filter-list {
    padding-left: 16px;
    .filter-item {
      overflow: hidden;
      position: relative;
      border-bottom: 1px solid rgba(255, 255, 255, 0.86);
      padding-right: 94px;

      button {
        padding: 14px 0;
      }

      .action-icons {
        position: absolute;
        top: 2px;
        right: 8px;

        span {
          padding: 8px;
          cursor: pointer;
        }
      }
    }

    .filter-item:last-child {
      border-bottom: none;
    }
  }

  p, span {
    color: #ffffff;
  }

  button {
    border: none;
    -webkit-box-shadow: none;
    color: #ffffff;
    background-color: transparent;
    text-align: left;
    vertical-align: middle;

    span.material-icons {
      font-size: 20px;
      vertical-align: middle;
    }
  }

  .action-area {
    position: absolute;
    bottom: 0;
    left: 0;
    border-top: 1px solid @dividers-color;
    padding: 0 8px;
    width: 100%;
    background-color: #ffffff;

    p {
      padding: 12px 8px;
      padding-right: 46px;
      color: @corporate-color;
    }

    span {
      color: @dark-corporate-color;
    }

    .close-popover {
      display: inline-block;
      position: absolute;
      top: 0;
      right: 0;
      padding: 8px;
      cursor: pointer;

      span {
        color: @corporate-color;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-overview-filter_list-popover-edit_list.card {
  padding: 16px 0;
  background-color:#ffffff;

  .this-card-content {
    padding: 0 16px;
  }

  .cta-area {
    padding-top: 16px;
    padding-bottom: 8px;

    span {
      cursor: pointer;
      color: @secondary-text-color;
    }
  }

  .cta-area:last-child {
    padding-top: 0;
    padding-bottom: 0;

    span {
      color: @corporate-color;
    }
  }
}

.elem-frontend-cms-reservation_new-overview-item-article_list {

}

.elem-frontend-cms-reservation_new-overview-item-bar {
  position: relative;
  padding: 8px 0;
  padding-bottom: 2px;

  .status-slider {
    overflow: hidden;
    display: inline-block;
    position: relative;
    margin-top: 3px;
    border: 1px solid @corporate-color;
    border-radius: 7px;
    height: 14px;
    width: 100%;

    .status-slider-inner {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      border-radius: 7px;
      height: 12px;
      background-color: @corporate-color;
      -webkit-transition: width 0.5s, background-color 0.5s;
      -moz-transition: width 0.5s, background-color 0.5s;
      -ms-transition: width 0.5s, background-color 0.5s;
      -o-transition: width 0.5s, background-color 0.5s;
      transition: width 0.5s, background-color 0.5s;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-overview-item-customer_detail {
  h2 {
    color: @corporate-color;
    cursor: pointer;
  }

  label.checkbox {
    padding: 8px 0;

    span {
      height: auto !important;
      line-height: initial !important;
    }

    span.checkboxtitle {
      font-size: 14px !important;
    }

    span:before {
      top: 50% !important;
      margin-top: -8px !important;
    }

    span:after {
      top: 50% !important;
      margin-top: -10px !important;
    }
  }

  .not-clickable {
    cursor: inherit;
  }
}

.elem-frontend-cms-reservation_new-overview-item-delivery_check.delivery-check {
  overflow: hidden;
  padding-top: 8px;

  .checkboxtitle {
    font-weight: 400;
  }

  .half-area {
    float: left;
    width: 50%;
    padding: 8px 0;

    span {
      color: inherit;
      vertical-align: middle;
    }
  }

  .half-area.corporate-color {
    padding: 10px 0;
    color: @corporate-color;
    cursor: pointer;

    span.material-icons-outlined {
      display: inline-block;
      padding-right: 12px;
      font-size: 28px;
      color: inherit;
    }
  }

  label.checkbox {
    padding: 8px 0;

    span {
      height: auto !important;
      line-height: initial !important;
    }

    span.checkboxtitle {
      font-size: 14px !important;
    }

    span:before {
      top: 50% !important;
      margin-top: -8px !important;
    }

    span:after {
      top: 50% !important;
      margin-top: -10px !important;
    }
  }
}

.elem-frontend-cms-reservation_new-pack-formular {
  height: 100%;

  .add-article-area {
    padding: 8px 0;
    padding-bottom: 24px;
  }

  .action-area.first {
    padding-top: 16px;
    vertical-align: middle;

    .check-description {
      display: inline-block;
      padding: 3px 16px;
      vertical-align: bottom;
    }

    .elem-frontend-cms-elements-form-checkbox {
      display: inline-block !important;
      vertical-align: middle !important;
    }
  }

  .description-head.headroom--pinned {
    transform: translateY(0);
  }

  .description-head.headroom--unpinned {
    transform: translateY(0);
  }

  .description-head.headroom--top {
    transform: translateY(-100%);
  }

  .cancel-process {
    padding-top: 16px;
  }

  .delivery-details {
    padding-top: 8px;

    .delivery-title {
      padding-bottom: 8px;
    }
  }

  .delivery-counter {
    padding-top: 16px;
  }

  .info-button {
    display: none !important;
  }

  .invoice-is-already-printed {
    padding: 16px 0;
    color: @error-color;
  }

  .card {
    padding: 0;

    ul.article-list {
      padding-left: 16px;

      li.article {
        border-bottom: 1px solid @dividers-color;
        padding: 16px 0;
      }

      li.article:last-child {
        border-bottom: none;
      }
    }
  }

  .description-head {
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    border-radius: 0;
    padding: 0;
    padding-bottom: 16px;
    will-change: transform;
    transition: transform 200ms linear;
    transform: translateY(-100%);
    width: 100%;

    h2 {
      padding: 16px 24px;
      padding-bottom: 0;
    }
  }

  .important-note, .delivery-overview {
    padding-left: 16px;

    .popup-head {
      padding: 16px;
      padding-left: 0;
      padding-bottom: 8px;
    }

    .actions {
      padding-top: 8px;
      padding-right: 16px;
      padding-bottom: 16px;
    }

    .no-notes {
      padding: 8px 16px;
      padding-left: 0;
      padding-bottom: 16px;
    }
  }

  .delivery-overview {
    padding-bottom: 16px;

    p.body1 {
      padding-top: 8px;
    }
  }
}

.elem-frontend-cms-reservation_new-pack-scan_input {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }
}

.elem-frontend-cms-reservation_new-pack-scan_input_popup {

}

.elem-frontend-cms-reservation_new-pack-formular-article_list {

  .packable-list-data-selector {
    display: none;
  }

  .empty-list-content {
    padding: 24px 0;

    h3 {
      padding-bottom: 16px;
    }
  }
}

.elem-frontend-cms-reservation_new-pack-formular-confirmation {
  .card {
    border-radius: 0 !important;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-bottom: 16px;
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  #confirmation.hide-button {
    display: none;
  }

  #cancel {
    float: left;
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }

  #cancel.highlight-button {
    color: @corporate-color;
  }

  #cancel.highlight-button:hover {
    color: @corporate-color;
  }

  #confirmation_description {

    a {
      font-size: inherit;
      font-family: inherit;
      font-weight: inherit;
      color: @corporate-color;
      text-decoration: underline;
    }

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

.elem-frontend-cms-reservation_new-pack-formular-confirmation.active-popup {
  display: block;
}

.elem-frontend-cms-reservation_new-pack-scan_input-content {

  .popup-head {
    position: relative;

    h3 {
      padding-right: 32px;
    }

    p {
      padding-top: 8px;
    }
  }

  .popup-content {
    padding-right: 0;

    .action-content-description {
      padding-top: 8px;
    }

    .packable-list, .available-article-list {
      padding: 4px 0;

      li {
        position: relative;
        border-bottom: 1px solid @dividers-color;
        padding: 4px 0;
        padding-right: 120px;

        .list-button {
          display: inline-block;
          position: absolute;
          top: 50%;
          right: 0;
          margin-top: -20px;
          height: 40px;

          span.material-icons {
            color: @corporate-color;
            font-size: 40px;
          }
        }

        p {

        }
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }
}

.elem-frontend-cms-reservation_new-pack-scan_input-content-add_article {

  .weight {
    vertical-align: middle;

    span.material-icons {
      font-size: 16px;
      color: inherit;
      vertical-align: middle;
    }
  }

  .not-available {
    .material-icons {
      color: @hint-text-color !important;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-add_note {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }
}

.elem-frontend-cms-reservation_new-popups-add_reservation {
  .content-block {
    padding: 16px 0;
    padding-right: 16px;
    padding-bottom: 8px;

    p {
      padding-top: 16px;
    }
  }

  .content-block:last-child {
    padding-bottom: 16px;
  }
}

.elem-frontend-cms-reservation_new-popups-confirmation {


  .cancel {
    float: left;
    color: @hint-text-color;
  }

  .single-cancel {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-reservation_new-popups-customer {

}

.elem-frontend-cms-reservation_new-popups-delivery_article {

}

.elem-frontend-cms-reservation_new-popups-delivery_detail {

}

.elem-frontend-cms-reservation_new-popups-discount {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }
}

.elem-frontend-cms-reservation_new-popups-down_payment {
  .cancel {
    color: @hint-text-color;
  }

  .popup-footer {
    overflow: hidden;

    .btn-flat {
      display: block;
      width: 50%;
      float: left;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-edit_appointment {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }
}

.elem-frontend-cms-reservation_new-popups-edit_appointment_select {
  .popup-footer {
    overflow: hidden;

    .btn-flat {
      display: block;
      width: 50%;
      float: left;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-edit_wish {

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }
}

.elem-frontend-cms-reservation_new-popups-invoice_send {

}

.elem-frontend-cms-reservation_new-popups-invoices {

}

.elem-frontend-cms-reservation_new-popups-notes {

}

.elem-frontend-cms-reservation_new-popups-payment {

}

.elem-frontend-cms-reservation_new-popups-print_documents {
  .popup-footer {
    overflow: hidden;

    .btn-flat {
      display: block;
      width: 50%;
      float: left;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-reservation_article {

}

.elem-frontend-cms-reservation_new-popups-reservation_delivery {
  .popup-footer {
    overflow: hidden;

    .btn-flat {
      display: block;
      width: 50%;
      float: left;
    }
  }

  .cancel {
    color: @secondary-text-color !important;
    float: left;
  }
}

.elem-frontend-cms-reservation_new-popups-send_mail {

  .popup-footer {
    overflow: hidden;

    .btn-flat {
      display: block;
      width: 50%;
      float: left;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-sort_selection {

  .card {
    padding: 0;
  }

  ul {
    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 44px;
      padding-left: 0;

      .edit-own-sort {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 12px;
        margin-top: -17px;
        padding: 4px;

        span {
          color: @secondary-text-color;
          font-size: 24px;
        }
      }

      a.selection-link {
        vertical-align: middle;

        span.material-icons {
          display: none;
          vertical-align: middle;
          color: inherit;
        }
      }

      a.selection-link:hover {
        color: @corporate-color;
      }

      a.selection-link.active-sort {
        color: @corporate-color;
        font-weight: @medium;

        span.material-icons {
          display: inline-block;
          padding-right: 8px;
        }
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-storno {
  .cancel {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-reservation_new-popups-tasks_overview {

}

.elem-frontend-cms-reservation_new-popups-wishes {

}

.elem-frontend-cms-reservation_new-popups-add_note-content {

  .popup-head {
    position: relative;

    h3 {
      padding-right: 32px;
    }

    .delete-note {
      position: absolute;
      top: 8px;
      right: 8px;
      padding: 8px;
      font-size: 24px;
      color: @secondary-text-color;
      cursor: pointer;
    }
  }

  .popup-content {
    padding-right: 16px !important;
  }
}

.elem-frontend-cms-reservation_new-popups-confirmation-add_discount {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
    padding-right: 16px;
  }

  .popup-content {
    padding-right: 16px !important;

    .creatable-hint {
      position: relative;
      padding: 8px;
      padding-left: 32px;

      .material-icons {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -12px;
        font-size: 24px;
      }

      .material-icons.check {
        color: @corporate-color;
      }
    }

    ul {

      li {
        padding: 4px 0;

        .radio {
          position: relative;

          .radio-value {
            position: absolute;
            top: 50%;
            right: 0;
            margin-top: -10px;
          }
        }

        .input-area {
          overflow: hidden;
          max-height: 0;
          -webkit-transition: max-height 0.3s;
          -moz-transition: max-height 0.3s;
          -ms-transition: max-height 0.3s;
          -o-transition: max-height 0.3s;
          transition: max-height 0.3s;

          .half-input {
            float: left;
            width: 25%;

            .elem-frontend-cms-elements-form-toggle {
              border-top-right-radius: 0 !important;
              border-bottom-right-radius: 0 !important;
              border-bottom-left-radius: 0 !important;
            }

            .elem-frontend-cms-elements-form-input {
              border-top-left-radius: 0 !important;
            }

            .toggle-select {
              padding-top: 17px;
              padding-bottom: 18px;
            }
          }

          .half-input:last-child {
            width: 75%;
          }
        }

        .input-area.active-input {
          max-height: 100px;
        }
      }
    }
  }
}

.elem-frontend-cms-reservation_new-popups-confirmation-add_payment {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
    padding-right: 16px;
  }
}

.elem-frontend-cms-reservation_new-popups-confirmation-add_to_list {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
  }

  ul {
    li {
      border-bottom: 1px solid @dividers-color;
      padding: 4px 0;
      padding-right: 16px;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .new-title-input {
    position: relative;
    padding-left: 35px;

    .input-error-text {
      display: none;
      padding-top: 4px;
      color: @error-color;
    }

    .input-error-text.active-error {
      display: block;
    }

    label.new-title-radio {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -12px;
      height: 26px;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-confirmation-add_to_list_finished {

  h3 {
    position: relative;
    padding-left: 41px;

    .material-icons {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -14px;
      color: @corporate-color;
      font-size: 28px;
    }
  }

  .delivery-overview {
    p {
      padding-bottom: 8px;
    }

    p:last-child {
      padding-bottom: 0;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-confirmation-confirm_delivery {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
  }
}

.elem-frontend-cms-reservation_new-popups-confirmation-create_invoice {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
  }

  .choose-template-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .choose-template-area.show-select {
    padding-right: 16px;
    max-height: 700px;
  }
}

.elem-frontend-cms-reservation_new-popups-confirmation-merge_delivery {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
  }

  ul {
    li {
      border-bottom: 1px solid @dividers-color;
      padding: 4px 0;
      padding-right: 16px;

      .deliverymethod {
        line-height: 15px;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .new-title-input {
    position: relative;
    padding-left: 35px;

    .input-error-text {
      display: none;
      padding-top: 4px;
      color: @error-color;
    }

    .input-error-text.active-error {
      display: block;
    }

    label.new-title-radio {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -12px;
      height: 26px;
    }
  }

  .popup-footer {
    min-height: 44px;
  }

  .no-entry {
    padding-top: 16px;
  }
}

.elem-frontend-cms-reservation_new-popups-confirmation-remove_from_list {

  .delivery-overview {
    padding-right: 16px;
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
  }
}

.elem-frontend-cms-reservation_new-popups-confirmation-add_payment-form_content.popup-content {
  padding: 0 16px !important;

  .toggle-outer {
    padding-bottom: 8px;

    div {
      height: 50px;

      label {
        padding-top: 6px;
        padding-bottom: 6px;
      }
    }
  }

  .check-form {
    padding: 8px 0;
  }

  label {
    border-bottom: none;
  }

  .elem-frontend-cms-elements-form-radio {
    padding-bottom: 0;
  }

  .decision-area {
    padding-bottom: 16px;
  }
}

.elem-frontend-cms-reservation_new-popups-customer-content {
  .customer-id {
    position: absolute;
    top: 19px;
    right: 16px;
  }

  .customer-detail {
    .customer-name {
      padding-bottom: 8px;
    }

    .customer-contact {
      padding-top: 8px;

      a {
        display: block;
      }

      a.phone {
        color: @corporate-color;
      }
    }
  }
}

.elem-frontend-cms-reservation_new-popups-delivery_article-content {

  .seperated-content {
    border-bottom: 1px solid @dividers-color;
    padding: 8px 0;
    padding-right: 16px;

    .seperated-line {
      overflow: hidden;
      padding-bottom: 8px;

      span {
        float: left;
        width: 50%;
      }
    }

    .seperated-line:last-child {
      padding-bottom: 0;
    }
  }

  .seperated-content:last-child {
    border-bottom: none;
  }

  .seperated-content:first-child {
    padding-top: 0;
  }

  .article-overview {
    padding: 8px 0;
    padding-top: 12px;
  }
}

.elem-frontend-cms-reservation_new-popups-delivery_article-content-article_list {

  .article-title {
    position: relative;
    padding: 4px 0;

    .article-title-inner {
      display: block;
    }

    .price-col {
      position: absolute;
      bottom: 3px;
      right: 0;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-delivery_article-content-article_list-price.complete-price {
  overflow: hidden;
  padding-top: 8px;

  span.opzimized-span {
    float: left;
    display: block;
    width: 65%;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    font-family: inherit;
  }

  span.price-col {
    display: block;
    width: 35%;
  }

  p {
    overflow: hidden;
    padding: 4px 0;
  }

  .discount {
    position: relative;

    .edit {
      position: absolute;
      top: 50%;
      right: 8px;
      margin-top: -20px;
      padding: 8px;
      font-size: 24px;
      color: @corporate-color;
      cursor: pointer;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-delivery_article-content-article_list-price.complete-price.edit-button {
  p {
    padding-right: 54px;
  }
}

.elem-frontend-cms-reservation_new-popups-delivery_detail-content-detail {

  p.caption {
    margin-top: -2px;
  }

  .appointment_date {
    padding-top: 4px;
  }

  .appointment-status {
    padding: 8px 0;

    p {
      position: relative;

      padding: 4px 0;
      padding-left: 38px;

      span {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -12px;
        font-size: 24px;
        color: @corporate-color;
      }

      span.error-color {
        color: @error-color;
      }

      .no-appointment {
        color: @secondary-text-color;
      }

      .pending {
        color: #96C9DC;
      }

      .denied {
        color: @error-color;
      }

      .accepted {
        color: @corporate-color;
      }
    }
  }
}

.elem-frontend-cms-reservation_new-popups-discount-content {

  .popup-head {
    position: relative;

    h3 {
      padding-right: 32px;
    }

    .delete-note {
      position: absolute;
      top: 8px;
      right: 8px;
      padding: 8px;
      font-size: 24px;
      color: @secondary-text-color;
      cursor: pointer;
    }
  }

  .popup-content {
    padding-right: 16px !important;

    ul {

      li {
        padding: 4px 0;

        .radio {
          position: relative;

          .radio-value {
            position: absolute;
            top: 50%;
            right: 0;
            margin-top: -10px;
          }
        }

        .input-area {
          overflow: hidden;
          max-height: 0;
          -webkit-transition: max-height 0.3s;
          -moz-transition: max-height 0.3s;
          -ms-transition: max-height 0.3s;
          -o-transition: max-height 0.3s;
          transition: max-height 0.3s;

          .half-input {
            float: left;
            width: 25%;

            .elem-frontend-cms-elements-form-toggle {
              border-top-right-radius: 0 !important;
              border-bottom-right-radius: 0 !important;
              border-bottom-left-radius: 0 !important;
            }

            .elem-frontend-cms-elements-form-input {
              border-top-left-radius: 0 !important;
            }

            .toggle-select {
              padding-top: 17px;
              padding-bottom: 18px;
            }
          }

          .half-input:last-child {
            width: 75%;
          }
        }

        .input-area.active-input {
          max-height: 100px;
        }
      }
    }
  }
}

.elem-frontend-cms-reservation_new-popups-down_payment-content {

  p {
    padding-right: 16px;
  }

  p.confirmation-text {
    padding-top: 16px;
  }

  .input-area {
    padding: 0 16px;
    padding-left: 0;
  }
}

.elem-frontend-cms-reservation_new-popups-edit_appointment-content {

  h2 {
    padding-bottom: 16px;
  }

  .deliverymethod {
    border-bottom: 1px solid @dividers-color;

    label {
      border-bottom: none !important;
    }
  }

  .deliverydate {
    padding-top: 16px;
    padding-right: 16px;

    .datefrom, .dateto {
      overflow: hidden;

      .from {
        float: left;
        padding-right: 8px;
        width: 50%;
      }

      .to {
        float: left;
        padding-left: 8px;
        width: 50%;
      }
    }
  }
}

.elem-frontend-cms-reservation_new-popups-edit_wish-content {

  .popup-head {
    position: relative;

    h3 {
      padding-right: 32px;
    }

    .delete-note {
      position: absolute;
      top: 8px;
      right: 8px;
      padding: 8px;
      font-size: 24px;
      color: @secondary-text-color;
      cursor: pointer;
    }
  }

  .popup-content {
    padding-right: 16px !important;
  }
}

.elem-frontend-cms-reservation_new-popups-element-icon_button {
  display: block;
  position: relative;
  margin: 4px 0;
  padding-left: 40px;
  cursor: pointer;

  span {
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -10px;
    color: inherit;
    font-size: 20px;
    cursor: pointer;
  }
}

.elem-frontend-cms-reservation_new-popups-element-icon_button.link_disabled {
  color: @secondary-text-color !important;
  cursor: inherit;

  span {
    color: @secondary-text-color !important;
    cursor: inherit;
  }
}

.elem-frontend-cms-reservation_new-popups-invoice_send-content {
  .select-input-outer {
    padding-right: 16px;
  }
}

.elem-frontend-cms-reservation_new-popups-invoices-content {

  .invoice-list {
    .invoice-item {
      position: relative;
      padding: 8px 0;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-notes-content {

}

.elem-frontend-cms-reservation_new-popups-notes-content-overview {
  .customer-note-head {
    padding-top: 16px;
    padding-bottom: 8px;
  }

  .seperated-content {
    border-bottom: 1px solid @dividers-color;
    padding: 8px 0;
    padding-right: 16px;
  }

  li {
    position: relative;

    span.edit-button {
      position: absolute;
      right: 8px;
      bottom: 5px;
      padding: 8px;
      font-size: 24px;
      color: @corporate-color;
      cursor: pointer;
    }
  }

  .seperated-content:last-child {
    border-bottom: none;
    padding-bottom: 8px;
  }

  .note-text {
    padding-top: 8px;
  }

  .no-notes {
    padding-bottom: 16px;
  }

  .checkboxtitle {
    font-weight: 400;
  }

  .actions {
    padding-top: 16px;
  }

  label.checkbox {
    display: block;
    padding: 8px 0;

    span {
      height: auto !important;
      line-height: initial !important;
    }

    span.checkboxtitle {
      font-size: 14px !important;
    }

    span:before {
      top: 50% !important;
      margin-top: -8px !important;
    }

    span:after {
      top: 50% !important;
      margin-top: -10px !important;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-payment-content {
  padding: 0;

  ul {

    li.payment-item {
      position: relative;
      padding-bottom: 8px;

      .payment-amount {
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -10px;
      }
    }

    li.payment-item:last-child {
      padding-bottom: 0;
    }
  }

  .payment-list {
    padding: 0 16px;
    padding-left: 0;
  }

  .payment-balance {
    padding: 8px 16px;
    padding-left: 0;
  }
}

.elem-frontend-cms-reservation_new-popups-reservation_article-content {

  .seperated-content {
    border-bottom: 1px solid @dividers-color;
    padding: 8px 0;
    padding-right: 16px;

    .seperated-line {
      overflow: hidden;
      padding-bottom: 8px;

      span {
        float: left;
        width: 50%;
      }
    }

    .seperated-line:last-child {
      padding-bottom: 0;
    }
  }

  .seperated-content:last-child {
    border-bottom: none;
  }

  .seperated-content:first-child {
    padding-top: 0;
  }

  .article-overview {
    padding: 8px 0;
  }
}

.elem-frontend-cms-reservation_new-popups-reservation_article-content-article_list {

  .article-title {
    position: relative;
    padding: 4px 0;

    .article-title-inner {
      display: block;
    }

    .price-col {
      position: absolute;
      bottom: 3px;
      right: 0;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-reservation_delivery-content {

  h2 {
    padding-bottom: 16px;
  }

  .deliverymethod {
    label {
      border-bottom: none !important;
    }
  }

  .deliverydate {
    padding-top: 16px;
    padding-right: 16px;

    .datefrom, .dateto {
      overflow: hidden;

      .from {
        float: left;
        padding-right: 8px;
        width: 50%;
      }

      .to {
        float: left;
        padding-left: 8px;
        width: 50%;
      }
    }
  }
}

.elem-frontend-cms-reservation_new-popups-send_mail-content {
  .choose-template-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .choose-template-area.show-select {
    padding-right: 16px;
    max-height: 700px;
  }
}

.elem-frontend-cms-reservation_new-popups-storno-confirmation {

  p {
    padding-right: 16px;
  }

  p.confirmation-text {
    padding-top: 16px;
  }
}

@keyframes tilt-shaking {
  0% { transform: rotate(0deg); }
  25% { transform: rotate(5deg); }
  50% { transform: rotate(0eg); }
  75% { transform: rotate(-5deg); }
  100% { transform: rotate(0deg); }
}

.elem-frontend-cms-reservation_new-popups-storno-content {
  ul {
    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      padding-right: 16px;

      .delete-reservation {
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -26px;
        padding: 8px;
        font-size: 24px;
        color: @primary-red-color;
        cursor: pointer;

        span {
          color: inherit;
          vertical-align: middle;
        }

        span.storno-warning {
          overflow: hidden;
          display: inline-block;
          width: 0;
          -webkit-transition: width 0.3s;
          -moz-transition: width 0.3s;
          -ms-transition: width 0.3s;
          -o-transition: width 0.3s;
          transition: width 0.3s;
        }
      }

      .delete-reservation.active {

        span.material-icons {
          animation: tilt-shaking 0.25s infinite;
        }

        span.storno-warning {
          width: 100px;
        }
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-tasks_overview-content {

}

.elem-frontend-cms-reservation_new-popups-tasks_overview-content-detail.task-list {
  overflow: hidden;
  -webkit-transition: max-height 0.3s;
  -moz-transition: max-height 0.3s;
  -ms-transition: max-height 0.3s;
  -o-transition: max-height 0.3s;
  transition: max-height 0.3s;

  li.task {
    position: relative;
    padding: 8px 24px;
    padding-left: 36px;

    span {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -14px;
      color: @progress-color;
      font-size: 28px;
    }

    span.is_finished {
      color: @dark-corporate-color;
    }

    span.has-error {
      color: @error-color;
    }
  }
}

.elem-frontend-cms-reservation_new-popups-wishes-content {

}

.elem-frontend-cms-reservation_new-popups-wishes-content-overview {
  .customer-note-head {
    padding-top: 16px;
    padding-bottom: 8px;
  }

  .seperated-content {
    border-bottom: 1px solid @dividers-color;
    padding: 8px 0;
    padding-right: 16px;
  }

  li {
    position: relative;

    span.edit-button {
      position: absolute;
      right: 8px;
      bottom: 5px;
      padding: 8px;
      font-size: 24px;
      color: @corporate-color;
      cursor: pointer;
    }
  }

  .seperated-content:last-child {
    border-bottom: none;
    padding-bottom: 8px;
  }

  .note-text {
    padding-top: 8px;
  }

  .no-notes {
    padding-bottom: 16px;
  }

  .checkboxtitle {
    font-weight: 400;
  }

  .actions {
    padding-top: 16px;
  }

  label.checkbox {
    display: block;
    padding: 8px 0;

    span {
      height: auto !important;
      line-height: initial !important;
    }

    span.checkboxtitle {
      font-size: 14px !important;
    }

    span:before {
      top: 50% !important;
      margin-top: -8px !important;
    }

    span:after {
      top: 50% !important;
      margin-top: -10px !important;
    }
  }
}

.elem-frontend-cms-reservation_new-reserved_article-article_list.card {
  padding: 8px 0;

  ul {
    padding-left: 16px;

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 8px 0;
      padding-right: 56px;
      cursor: pointer;

      p.sold {
        color: @primary-red-color;
      }

      img {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -24px;
        border-radius: @basic-border-radius;
        height: 48px;
        width: 48px;
      }

      .reserved-article {
        display: inline-block;
        position: absolute;
        top: 50%;
        right: 16px;
        margin-top: -16px;
        border-radius: 100%;
        padding: 2px 4px;
        height: 32px;
        width: 32px;
        background-color: @corporate-color;
        color: #ffffff;
      }
    }

    li.has-image {
      padding-left: 64px;
    }

    li:last-child {
      border-bottom: 0;
    }
  }
}

.elem-frontend-cms-reservation_new-reserved_article-article_popover {
  position: relative;
  height: 0;

  .clickable-layover {
    display: none;
    position: fixed;
    z-index: 35;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    overflow: hidden;
  }

  .article-popover-content {
    height: 100%;
  }

  .card {
    position: fixed;
    z-index: 41;
    bottom: 0;
    left: -350px;
    margin: 0;
    border-radius: 0;
    padding: 0;
    height: 100%;
    width: 350px;
    background-color: #ffffff;
    -webkit-transition: left 0.3s;
    -moz-transition: left 0.3s;
    -ms-transition: left 0.3s;
    -o-transition: left 0.3s;
    transition: left 0.3s;

    .action-list {
      padding-bottom: 96px;
      height: 100%;
      width: 350px;

      ul {
        overflow-y: auto;
        height: 100%;
        padding-left: 16px;

        li:last-child {
          border-bottom: none;
        }
      }
    }

    .action-list.show-list {
      height: 100%;
      width: 350px;
    }

    .action-area {
      display: none;
    }
  }

  .card.main-nav-active {
    left: 0;
    width: 350px;

    .action-area {
      display: block;
    }
  }

  @media @xs {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 96px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 16px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: 100%;
      max-height: 90%;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @sm {
    position: relative;

    .card {
      z-index: 41;
      bottom: 0;
      left: 0;
      height: auto;
      max-height: 0;
      width: 100%;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      .action-list {
        padding-bottom: 96px;
        height: 100%;
        width: 100%;
        -webkit-transition: height 0.3s;
        -moz-transition: height 0.3s;
        -ms-transition: height 0.3s;
        -o-transition: height 0.3s;
        transition: height 0.3s;

        ul {
          overflow-y: auto;
          height: 100%;
          padding-left: 16px;

          li:last-child {
            border-bottom: none;
          }
        }
      }

      .action-list.show-list {
        height: 100%;
        width: 100%;
      }
    }

    .card.main-nav-active {
      left: 0;
      height: 100%;
      max-height: 90%;
      width: 100%;
    }

    .card.main-nav-active.all-menu-open {
      height: 100%;
      max-height: 90%;
    }
  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-reserved_article-article_popover.active-popup {
  height: 100%;

  .clickable-layover {
    display: block;
  }
}


.elem-frontend-cms-reservation_new-reserved_article-navigation {

  .nav-navigation {
    overflow: hidden;

    .charge-nav-chev {
      padding: 4px 8px;
      color: @corporate-color;
      cursor: pointer;
      user-select: none;
      -webkit-user-select: none;
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
    }

    .charge-nav-chev.inactive-nav {
      color: @hint-text-color;
      cursor: inherit;
    }

    .charge-nav-chev:first-child {
      float: left;
    }

    .charge-nav-chev:last-child {
      float: right;
    }
  }

  ul {
    overflow: hidden;
    margin-left: -16px;
    padding-top: 16px;
    padding-bottom: 16px;
    padding-left: 16px;
    width: 20000px;
    -webkit-transition: margin-left 0.3s, margin-right 0.3s;
    -moz-transition: margin-left 0.3s, margin-right 0.3s;
    -ms-transition: margin-left 0.3s, margin-right 0.3s;
    -o-transition: margin-left 0.3s, margin-right 0.3s;
    transition: margin-left 0.3s, margin-right 0.3s;

    li.card {
      float: left;
      display: inline-block;
      position: relative;
      margin: 0 4px;
      border-radius: 0;
      padding-top: 16px;
      padding-bottom: 16px;
      width: 160px;
      cursor: pointer;

      .reserved-article {
        display: none;
        position: absolute;
        top: 8px;
        right: 8px;
        border-radius: 100%;
        padding: 2px 4px;
        height: 32px;
        width: 32px;
        background-color: @corporate-color;
        color: #ffffff;
      }

      .reserved-article.show-amount {
        display: inline-block;
      }

      img {
        width: 100%;
        height: auto;
      }

      p {
        padding-top: 16px;
      }
    }

    li.card.active-card, li.card:hover {
      border: 1px solid @corporate-color;
      -webkit-box-shadow: 0 4px 5px 0 rgba(60, 118, 58, 0.30), 0 1px 10px 0 rgba(60, 118, 58, 0.30), 0 2px 4px -1px rgba(60, 118, 58, 0.30);
      box-shadow: 0 4px 5px 0 rgba(60, 118, 58, 0.30), 0 1px 10px 0 rgba(60, 118, 58, 0.30), 0 2px 4px -1px rgba(60, 118, 58, 0.30);
    }
  }
}

.elem-frontend-cms-reservation_new-reserved_article-article_popover-content {
  position: relative;

  .popover-head {
    position: relative;
    border-bottom: 1px solid @dividers-color;
    padding: 16px;
    padding-right: 112px;

    .article-amount-outer {
      display: inline-block;
      position: absolute;
      top: 50%;
      right: 16px;
      margin-top: -16px;

      .article-amount {
        display: none;
        position: relative;
        padding-left: 8px;

        .reserved-article {
          display: inline-block;
          border-radius: 100%;
          padding: 2px 4px;
          height: 32px;
          width: 32px;
          background-color: @corporate-color;
          color: #ffffff;
        }

        .packed-article {
          display: inline-block;
          border-radius: 100%;
          padding: 2px 4px;
          height: 32px;
          width: 32px;
          background-color: rgba(0,0,0,0.36);
          color: @text-color;
        }

        span.material-icons {
          position: absolute;
          bottom: -2px;
          left: -2px;
          color: @corporate-color;
          font-size: 18px;
        }
      }

      .article-amount.show-amount {
        display: inline-block;
      }
    }
  }

  .action-list {

    ul {
      padding-left: 16px;

      li {
        position: relative;
        border-bottom: 1px solid @dividers-color;
        padding: 4px 0;
        padding-right: 108px;

        .weight {
          vertical-align: middle;

          span.material-icons {
            font-size: 16px;
            color: inherit;
            vertical-align: middle;
          }
        }

        .manage-article-area {
          display: inline-block;
          position: absolute;
          top: 50%;
          right: 16px;
          margin-top: -16px;

          .article-button {
            display: inline-block;
            position: relative;
            border-radius: 100%;
            padding: 4px;
            height: 32px;
            width: 32px;
            background-color: @attention-color;
            color: @attention-text-color;
            cursor: pointer;

            span {
              color: @attention-text-color;
            }
          }

          .article-button.inactive {
            background-color: rgba(0,0,0,0.36);
            cursor: inherit;

            span {
              color: @secondary-text-color;
            }
          }
        }
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }

  .action-area {
    position: absolute;
    bottom: 0;
    left: 0;
    border-top: 1px solid @dividers-color;
    padding: 0 8px;
    width: 100%;

    .close-popover {
      display: inline-block;
      padding: 8px;
      cursor: pointer;

      span {
        color: @corporate-color;
      }
    }
  }
}

.elem-frontend-cms-reservation_new-reserved_article-article_popover-content-article {

  .remove-article-outer, .add-article-outer {
    display: inline-block;
    position: relative;
    padding-left: 8px;
    cursor: pointer;
  }

  .percentage-scala {

    .caption {
      padding-bottom: 4px;

      span {
        font-size: inherit;
        font-weight: inherit;
        font-family: inherit;
        color: inherit;
      }
    }
  }
}

.elem-frontend-cms-reservation_new-terminate-add_date {
  overflow: hidden;
  height: 100%;

  .open-delivery-card {
    margin-bottom: 0;
  }

  .individual-wrapper {
    overflow: hidden;
    margin-right: -16px;
    margin-left: -16px;
    padding: 0 16px;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .individual-wrapper.active-area {
    max-height: 20000px;
  }

  .deliverydate {
    padding-top: 16px;
    padding-right: 16px;

    .datefrom, .dateto {
      overflow: hidden;

      .from {
        float: left;
        padding-right: 8px;
        width: 50%;
      }

      .to {
        float: left;
        padding-left: 8px;
        width: 50%;
      }
    }
  }

  .card {
    padding-right: 0;
  }

  // Klickbare Termin-Uebersichten (verschickte Ersatztermine in der
  // Ersatztermin-Karte UND Kunden-Ersatztermine in der Liefertermin-Karte).
  .sent-alternatives {
    margin-top: 12px;
    margin-right: 16px;
    border: 1px solid @dividers-color;
    border-radius: @basic-border-radius;
    padding: 8px 12px;

    ul {
      padding-top: 0;

      li {
        border-bottom: none;
        padding: 4px 0;
      }
    }

    .apply-sent-alternative, .apply-customer-alternative {
      color: @corporate-color;

      .material-icons {
        display: inline-block;
        margin-top: -3px;
        padding-right: 6px;
        font-size: 18px;
        color: inherit;
        vertical-align: middle;
      }
    }
  }

  .alternative-dates-card {
    padding-right: 16px;

    .alternative-hint {
      padding-top: 8px;
    }

    // Karte hat selbst padding-right: 16px - kein zusaetzlicher Rand noetig.
    .sent-alternatives {
      margin-right: 0;
    }

    .alternative-date-row {
      display: none;
      position: relative;
      padding-right: 40px;

      .alt-date {
        float: left;
        padding-right: 8px;
        width: 40%;
      }

      .alt-time {
        float: left;
        padding-left: 8px;
        width: 30%;
      }

      .remove-alternative-date {
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -12px;
        color: @secondary-text-color;

        .material-icons {
          font-size: 24px;
        }
      }
    }

    .alternative-date-row:after {
      content: '';
      display: block;
      clear: both;
    }

    .alternative-date-row.active-row {
      display: block;
    }

    .add-alternative-date-area {
      padding-top: 16px;

      a {
        color: @corporate-color;

        .material-icons {
          display: inline-block;
          margin-top: -4px;
          padding-right: 2px;
          color: inherit;
          vertical-align: middle;
        }

        span {
          vertical-align: middle;
        }
      }
    }

    .add-alternative-date-area.all-rows-active {
      display: none;
    }
  }

  ul {
    padding-top: 16px;

    li {
      border-bottom: 1px solid @dividers-color;
      padding: 4px 0;
      padding-right: 16px;

      .deliverymethod {
        line-height: 15px;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .new-title-input {
    position: relative;
    padding-left: 35px;

    .input-error-text {
      display: none;
      padding-top: 4px;
      color: @error-color;
    }

    .input-error-text.active-error {
      display: block;
    }

    label.new-title-radio {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -12px;
      height: 26px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-terminate-choose_charge {
  overflow: hidden;
  height: 100%;

  .filter-area {
    padding: 16px 0;

    a.btn-flat, span.btn-flat {
      color: @corporate-color;

      span {
        display: inline-block;
        padding: 0;
        padding-right: 8px;
        vertical-align: middle;
        color: inherit;
      }
    }
  }

  .highlight-text {

    a.hightlight-button, span.hightlight-button {
      padding-right: 8px;
      padding-left: 8px;
      color: @error-color !important;
    }

    .delete-filter {
      padding-right: 8px;
      padding-left: 8px;

      .material-icons {
        padding-right: 0;
        color: @error-color !important;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-reservation_new-terminate-send_mail {
  overflow: hidden;
  height: 100%;

  .subject {
    padding-bottom: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-datev {
  .suggestion-input {
    position: relative;
    margin-top: 8px;
  }

  .card.no-padding {
    padding: 0;

    .elem-frontend-cms-elements-card-head {
      padding: 16px;
    }

    .copyable-text {
      padding-right: 16px;

      .copyable-text-inner {
        border-top: 1px solid @dividers-color;
        padding: 16px 0;
        padding-left: 16px;

        ul {
          padding: 8px 0;
          padding-left: 26px;

          li {
            list-style: disc;
          }
        }
      }

      .copyable-button {
        padding: 8px 0;
        padding-bottom: 16px;

        span.material-icons {
          color: @corporate-color;
          cursor: pointer;
        }
      }
    }
  }

  .tax-content {
    padding-top: 16px;
  }

  .number-input {
    display: none;
  }

  .number-input.show-input {
    display: block;
  }

  .error.hint-text {
    display: none;
    color: @error-color;
  }

  .error.hint-text.show-error {
    display: block;
  }

  #email-template-list {
    display: none;
    background-color: #ffffff;
    color: #000000;
  }

  .input-row {
    position: relative;
    overflow: hidden;

    .elem-frontend-cms-elements-form-input {
      margin: 0;
    }

    div.two-col:first-child {
      padding-right: 4px;
    }

    div.two-col:last-child {
      padding-left: 4px;
    }

    .big-column {
      float: left;
      width: 70%;
    }

    .small-column {
      float: left;
      width: 30%;
    }
  }

  .tax-number-input {
    display: none;
  }

  .tax-number-input.show-input {
    display: block;
  }
}

.elem-frontend-cms-settings-delivery {
  overflow: hidden;
  position: relative;
  padding-left: 0;
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  form {
    height: 100%;
  }

  .new-deliverymethod {
    display: inline-block;
  }
}

.elem-frontend-cms-settings-delivery.space_for_sidenav {
  padding-left: 350px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}

.elem-frontend-cms-settings-delivery_new {
  .new-deliverymethod {
    display: inline-block;
  }
}

.elem-frontend-cms-settings-ean_interpreter {

  .example-img-outer {
    padding-bottom: 16px;

    .example-img {
      display: inline-block;
      height: auto;
      width: 70%;
    }
  }
}

.elem-frontend-cms-settings-friedhold_payment {
  .settings-card {
    padding: 8px 0;

    .this-card-head {
      padding: 8px 16px;
      padding-bottom: 0;
    }

    .this-card-footer {
      padding: 8px;
      padding-left: 16px;
    }
  }

  .error-message {
    padding-top: 8px;
    color: @error-color;

    a {
      color: inherit;
      font-size: inherit;
      font-weight: inherit;
      text-decoration: underline;
    }

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

  ul {
    padding-left: 16px;

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 0;
      padding-right: 54px;

      .radio {
        position: absolute;
        top: 50%;
        right: 1px;
        margin-top: -12px;
      }

      .download-button {
        position: absolute;
        top: 50%;
        right: 16px;
        margin-top: -14px;

        span.material-icons {
        }
      }

      p.caption {
        padding-bottom: 4px;
        color: @corporate-color;
      }
    }

    li.has-icon {
      padding-left: 40px;

      span.status-icon {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -24px;
        line-height: 48px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .error-font-color {
    display: block;
    padding-top: 4px;
    color: @error-color;
  }

  .radio-area {
    padding-left: 16px;
  }

  .input-area {
    padding: 8px 16px;
  }

  .sepa-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    .sepa-area-inner {
      padding: 0 16px;

      h2 {
        padding-bottom: 24px;
      }
    }
  }

  .sepa-area.is-active-area {
    max-height: 1000px;
  }
}

.elem-frontend-cms-settings-invoice {
  .suggestion-input {
    position: relative;
    margin-top: 8px;
  }

  .input-row {
    position: relative;
    overflow: hidden;

    .elem-frontend-cms-elements-form-input {
      margin: 0;
    }

    div.two-col:first-child {
      padding-right: 4px;
    }

    div.two-col:last-child {
      padding-left: 4px;
    }

    .big-column {
      float: left;
      width: 70%;
    }

    .small-column {
      float: left;
      width: 30%;
    }
  }

  .banking {
    padding: 16px 0;
    padding-bottom: 8px;
  }
}

.elem-frontend-cms-settings-mail_templates {

  .template-card {
    .card {
      position: relative;
      padding-right: 48px;

      .material-icons {
        position: absolute;
        top: 50%;
        right: 16px;
        margin-top: -12px;
        font-size: 24px;
        color: @corporate-color;
      }
    }
  }
}

.elem-frontend-cms-settings-payment {
  .friedhold-payment {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    p.body1.secondary-text-color {
      padding: 8px 0;
    }

    .info-button {
      padding: 8px 0;
      padding-bottom: 16px;
    }

    .btn {
      background-color: @corporate-color;
    }

    .body1.regular {
      padding: 8px 0;
    }
  }

  .friedhold-payment.active-payment {
    max-height: 100000px;
  }

  .icon-text {
    position: relative;
    padding-left: 32px;
    margin-bottom: 8px;

    .material-icons {
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -12px;
      font-size: 24px;
      color: @corporate-color;
    }

    .material-icons.error-icon {
      color: @error-color;
    }
  }

  .error-message {
    color: @error-color;
  }

  .login-button {
    padding-top: 8px;
  }

  .stripe-payment-methods {
    padding: 4px 0;

    li {
      display: block;
      position: relative;
      padding: 4px 0;
      padding-left: 32px;

      i {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -12px;
        font-size: 24px;
        color: @corporate-color;
      }
    }
  }

  .fake-toggle {
    overflow: hidden;
    margin: 8px 0;
    border: 1px solid @corporate-color;
    border-radius: @basic-border-radius;

    .toggle-select {
      float: left;
      display: block;
      padding: 10px 8px;
      width: 50%;
      cursor: pointer !important;
      color: @secondary-text-color;

      input {
        display: none;
      }
    }

    .toggle-select.active {
      background-color: rgba(130, 197, 93, 0.2);
      color: @text-color;
    }

    .toggle-select:first-child {
      border-right: 1px solid @corporate-color;
    }
  }
}

.elem-frontend-cms-settings-tax {
  height: 100%;

  .input_area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .input_area.active-area {
    max-height: 1000px;
  }

  .additional-information {

    p {
      padding-bottom: 16px;
    }

    p:last-child {
      padding-bottom: 0;
    }
  }

  .this-hint-text-invoice {
    display: none;
    padding: 0 24px;
  }

  .this-hint-text-invoice.show-hint {
    display: block;
  }
}

.elem-frontend-cms-settings-delivery-detail {

  .content-head {
    position: relative;
    padding-right: 48px;

    .radio {
      position: absolute;
      top: 50%;
      right: -14px;
      margin-top: -16px;
    }
  }

  .action-content {
    position: relative;
    height: 40px;

    .edit-delivery-method {
      display: inline-block;
      padding: 8px;
      padding-right: 0;
      cursor: pointer;
    }
  }

  .content-bundle {
    padding: 4px 0;
  }

  .add-description {
    padding-top: 12px;
    padding-bottom: 4px;
    color: @text-color;
  }

  .is-online-available {
    color: #82C55D;
  }
}

.elem-frontend-cms-settings-delivery-input {

  .card {
    padding-right: 0;

    .card-inner-content {
      padding-right: 16px;
    }
  }

  .show-select {
    padding-bottom: 8px;
  }

  .add-description {
    display: block;
    padding-top: 8px;
    color: @text-color;
  }

  .add-description.hide-description {
    display: none;
  }

  .currency-input {
    position: relative;

    .material-icons {
      position: absolute;
      top: 50%;
      right: 16px;
      margin-top: -8px;
      font-size: 24px;
    }
  }

  .zip-list {
    padding-top: 16px;

    ul {
      li {
        border-bottom: 1px solid @dividers-color;
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }

  .non-editable-input {
    position: relative;
    border-bottom: 1px solid @hint-text-color;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    padding: 2px 16px;
    padding-bottom: 8px;
    background-color: #ECECEC;

    p.caption {
      padding-bottom: 4px;
    }

    .material-icons {
      position: absolute;
      top: 50%;
      right: 12px;
      margin-top: -12px;
    }
  }

  .catch-up-content, .package-send-content {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;

    .zip-button {
      padding: 16px 0;
    }
  }

  .catch-up-content.show-input, .package-send-content.show-input {
    max-height: 10000px;
  }

  .extra-input-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .extra-input-area.show-all-input {
    max-height: 500px;
  }

  .extra-input-area.show-one-input {
    max-height: 100px;
  }

  .delete-deliverymethod {
    padding: 8px 0;
    a {
      vertical-align: middle;
      color: @corporate-color;

      span {
        display: inline-block;
        vertical-align: middle;
        color: inherit;
      }

      .material-icons {
        padding-right: 4px;
      }
    }
  }
}

.elem-frontend-cms-settings-delivery-input-address {

  #map {
    height: 249px;
    width: 100%;
  }

  .card-outer {
    padding: 16px 0;

    p:first-child {
      padding-bottom: 8px;
    }

    p:last-child {
      padding-top: 8px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-delivery-input-zip_city {
  position: relative;
  padding: 4px 0;
  padding-right: 90px;

  .distance {
    position: absolute;
    top: 12px;
    right: 16px;
  }

  .distance.in-range {
    color: @corporate-color;
  }
}

.elem-frontend-cms-settings-delivery_new-zip {
  height: 100%;

  .suggestion-input {
    position: relative;
  }

  .input-outer {
    overflow: hidden;

    .xs-input-3, .xs-input-9 {
      float: left;
      display: block;

      .elem-frontend-cms-elements-form-input {
        margin: 0;
      }
    }

    .xs-input-3 {
      padding-right: 8px;
      width: 33.3333333%;
    }

    .xs-input-9 {
      padding-left: 8px;
      width: 66.6666666%;
    }
  }

  form {
    height: 100%;
  }

  .map.card {
    overflow: hidden;
  }

  .card.map {
    padding: 0;

    #map {
      height: 300px;
      width: 100%;
    }
  }
}

.elem-frontend-cms-settings-ean_interpreter-edit_article {

  .card {
    padding-right: 0;
  }

  ul {

    li {
      border-bottom: 1px solid @dividers-color;
      padding-right: 16px;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  .example-img-outer {
    padding-bottom: 16px;

    .example-img {
      display: inline-block;
      height: auto;
      width: 70%;
    }
  }
}

.elem-frontend-cms-settings-ean_interpreter-edit_article-article {
  padding-top: 8px;
  padding-bottom: 8px;
}

.elem-frontend-cms-settings-friedhold_payment-create_sepa {
  .form-error-text {
    display: none;
  }

  .form-error-text.show-error {
    display: block;
  }

  .error-font-color {
    color: @error-color;
  }
}

.elem-frontend-cms-settings-login-popup {


  .cancel {
    float: left;
    color: @hint-text-color;
  }

  .single-cancel {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-settings-login-user {

  .inactive-input {
    padding: 8px 16px;
  }

  .action-area {
    padding: 8px 0;

    .material-icons {
      display: inline-block;
      padding: 8px;
      cursor: pointer;
    }

    .delete {
      padding-right: 24px;
      color: @error-color;
    }
  }
}

.elem-frontend-cms-settings-login-popups-change_password {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
    padding-right: 16px;
  }

  .popup-content {
    padding-right: 16px !important;

    .creatable-hint {
      position: relative;
      padding: 8px;
      padding-left: 32px;

      .material-icons {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -12px;
        font-size: 24px;
      }

      .material-icons.check {
        color: @corporate-color;
      }
    }

    ul {

      li {
        padding: 4px 0;

        .radio {
          position: relative;

          .radio-value {
            position: absolute;
            top: 50%;
            right: 0;
            margin-top: -10px;
          }
        }

        .input-area {
          overflow: hidden;
          max-height: 0;
          -webkit-transition: max-height 0.3s;
          -moz-transition: max-height 0.3s;
          -ms-transition: max-height 0.3s;
          -o-transition: max-height 0.3s;
          transition: max-height 0.3s;

          .half-input {
            float: left;
            width: 25%;

            .elem-frontend-cms-elements-form-toggle {
              border-top-right-radius: 0 !important;
              border-bottom-right-radius: 0 !important;
              border-bottom-left-radius: 0 !important;
            }

            .elem-frontend-cms-elements-form-input {
              border-top-left-radius: 0 !important;
            }

            .toggle-select {
              padding-top: 17px;
              padding-bottom: 18px;
            }
          }

          .half-input:last-child {
            width: 75%;
          }
        }

        .input-area.active-input {
          max-height: 100px;
        }
      }
    }
  }
}

.elem-frontend-cms-settings-login-popups-change_pin {

  .popup-content {
    padding-right: 16px !important;

    .pin-description {
      padding-bottom: 8px;
    }

    .pin-status {
      padding-bottom: 8px;
    }
  }
}


.elem-frontend-cms-settings-login-popups-create_user {

  .delivery-overview {
    padding-bottom: 16px;

    p {
      padding: 2px 0;
    }
  }

  .alternative-text {
    padding: 8px 0;
    padding-right: 16px;
  }

  .popup-content {
    padding-right: 16px !important;

    .creatable-hint {
      position: relative;
      padding: 8px;
      padding-left: 32px;

      .material-icons {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -12px;
        font-size: 24px;
      }

      .material-icons.check {
        color: @corporate-color;
      }
    }

    ul {

      li {
        padding: 4px 0;

        .radio {
          position: relative;

          .radio-value {
            position: absolute;
            top: 50%;
            right: 0;
            margin-top: -10px;
          }
        }

        .input-area {
          overflow: hidden;
          max-height: 0;
          -webkit-transition: max-height 0.3s;
          -moz-transition: max-height 0.3s;
          -ms-transition: max-height 0.3s;
          -o-transition: max-height 0.3s;
          transition: max-height 0.3s;

          .half-input {
            float: left;
            width: 25%;

            .elem-frontend-cms-elements-form-toggle {
              border-top-right-radius: 0 !important;
              border-bottom-right-radius: 0 !important;
              border-bottom-left-radius: 0 !important;
            }

            .elem-frontend-cms-elements-form-input {
              border-top-left-radius: 0 !important;
            }

            .toggle-select {
              padding-top: 17px;
              padding-bottom: 18px;
            }
          }

          .half-input:last-child {
            width: 75%;
          }
        }

        .input-area.active-input {
          max-height: 100px;
        }
      }
    }
  }
}

.elem-frontend-cms-settings-mail_templates-detail {

  .print-area {
    padding-bottom: 24px;
  }

  .subject {
    padding-bottom: 16px;
  }

  .delete-button {
    background-color: @error-color !important;
  }
}

.elem-frontend-cms-settings-mail_templates-overview {

  .card {
    padding: 0;

    ul {
      padding: 8px 0;
      padding-left: 16px;

      li {
        position: relative;
        border-bottom: 1px solid @dividers-color;
        padding: 8px 48px;
        padding-left: 0;

        p.subhead {
          padding-bottom: 2px;
        }

        .material-icons {
          position: absolute;
          top: 50%;
          right: 16px;
          margin-top: -12px;
          font-size: 24px;
          color: @corporate-color;
        }
      }

      li:last-child {
        border-bottom: none;
      }
    }

    .with-padding {

      padding: 24px 16px;
    }
  }

  .recommendation-card.card, .recommendation-additional-link-card.card {
    padding: 8px 16px;

    p {

      a {
        text-decoration: underline;
        font-family: inherit;
        font-size: inherit;
        font-weight: inherit;
        color: @corporate-color;
      }

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

  .extra-hint {
    padding-top: 16px;
  }

  .recommendation-additional-link-card {
    overflow: hidden;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    max-height: 0;
    -webkit-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -moz-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -ms-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    -o-transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;
    transition: max-height 0.3s, padding-top 0.3s, padding-bottom 0.3s;

    .input-error {
      display: none;
      color: @error-color;
    }

    .input-error.active-error {
      display: block;
      padding-top: 4px;
    }
  }

  .recommendation-additional-link-card.active-card {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    max-height: 1000px;
  }
}

.elem-frontend-cms-settings-mail_templates-detail-preview {

  .card-inner {
    overflow: hidden;
    padding: 0;

    .logo-image {
      display: inline-block;
      height: auto;
      width: 60%;
    }

    .template-body {
      padding: 32px 16px;

      h2 {
        padding-bottom: 24px;
      }

      p {
        padding-bottom: 16px;
      }
    }

    .newsletter-footer-outer {
      padding: 0 16px;

      .newsletter-footer {
        border-top: 2px solid @dividers-color;
        padding: 32px 0;
        background-color: #FFFFFF;

        .app-images {
          padding: 24px 16px;

          img:first-child {
            display: inline-block;
            margin-right: 24px;
          }

          img:last-child {
            display: inline-block;
            margin-left: 24px;
          }
        }

        p.title {
          padding-bottom: 8px;
          color: @text-color;
        }

        p.body1, p.caption {
          color: @secondary-text-color;
        }

        p.body1 {
          padding: 4px 0;
        }

        a.body1, span.body1 {
          display: block;
          padding: 8px 16px;
          color: @secondary-text-color;
        }

        .link-area {
          padding-top: 24px;
        }

        .link-area:first-child {
          padding-top: 0;
        }

        .disclaimer {
          padding-top: 24px;
        }
      }
    }
  }

  .send-mail-area {
    display: block;
  }

  .send-mail-area.hide-action-area {
    display: none;
  }

  @media @xs {
    .newsletter-footer-outer {
      padding: 0 16px;

      .newsletter-footer {
        border-top: 2px solid @dividers-color;
        padding: 32px 0;
        background-color: #FFFFFF;

        .app-images {
          padding: 24px 16px;

          img:first-child {
            display: inline-block;
            margin: 0 24px;
            margin-bottom: 16px;
          }

          img:last-child {
            display: inline-block;
            margin: 0 24px;
            margin-top: 16px;
          }
        }
      }
    }
  }
}

.elem-frontend-cms-settings-mail_templates-edit-rich_text_editor {

  .action-buttons {
    span {
      margin: 4px;
    }

    span:first-child {
      margin-left: 0;
    }
  }
}

.elem-frontend-cms-settings-overview-datev {

  .card {
    padding-right: 0;

    .content-wrapper {
      border-top: 1px solid @dividers-color;

      .address {
        padding-top: 8px;
        padding-right: 16px;
        padding-bottom: 8px;
      }
    }

    .content-wrapper:first-child {
      border-top: none;

      .address {
        padding-top: 8px;
        padding-right: 16px;
        padding-bottom: 8px;
      }
    }
  }

  p.body1 {
    padding-bottom: 4px;
  }

  .elem-frontend-cms-elements-card-footer {
    padding-right: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-overview-delivery {

  .delivery-list {

    .delivery-item {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 24px;
      padding-left: 40px;

      span.material-icons {
        position: absolute;
        top: 50%;
        left: 0;
        margin-top: -13px;
        line-height: 26px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }

      ol {
        li {
          display: inline;
        }

        li:not(:last-child)::after {
          content:', ';
        }
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-overview-delivery_note {

}

.elem-frontend-cms-settings-overview-ean_interpreter {
  .address {
    padding-bottom: 16px;
  }

  p.body1 {
    padding-bottom: 4px;
  }

  .elem-frontend-cms-elements-card-footer {
    padding-right: 16px;
  }
}

.elem-frontend-cms-settings-overview-friedhold_payment {
  .card {
    padding: 8px 0;

    .this-card-head {
      padding: 8px 16px;
    }

    .this-card-footer {
      padding: 8px 16px;
      padding-bottom: 0;
    }
  }

  ul {
    padding-left: 16px;

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 54px;
      padding-left: 0;
    }

    li.has-icon {
      padding-left: 40px;

      span.material-icons {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 48px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  p.caption {
    padding-bottom: 4px;
    color: @corporate-color;
  }
}

.elem-frontend-cms-settings-overview-invoice {

  .company-id {
    display: inline-block;
    padding-top: 8px;
  }

  .address {
    padding-bottom: 16px;
  }

  p.body1 {
    padding-bottom: 4px;
  }

  .banking {
    padding: 16px 0;
    padding-bottom: 8px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-overview-legal {

  ul {

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 24px;
      padding-left: 40px;

      span.material-icons {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 48px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-overview-login {

  .this-card-content {

    .this-content {

    }

    .this-content {
      padding-bottom: 16px;
    }

    .this-content:last-child {
      padding-bottom: 0;
    }
  }

  ul {

    li.user {
      position: relative;
      padding: 8px 0;

      .role {
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -10px;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-overview-mail_templates {
  p.body1 {
    padding-bottom: 4px;
  }

  .this-card-content {
    padding-bottom: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-overview-messages {

  ul {

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 24px;
      padding-left: 40px;

      span.material-icons {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 48px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-overview-payment {

  ul {

    li {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 14px 24px;
      padding-left: 40px;

      span.material-icons {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 48px;
        vertical-align: middle;
        color: @corporate-color;
      }

      span.material-icons.error {
        color: @error-color;
      }
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-overview-payment_delivery_text {

  .icon-area {
    padding: 24px 0;

    svg {
      display: inline-block;
      height: 70px;
      width: auto;
    }

    .material-icons {
      font-size: 68px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-overview-tax {

  strong {
    color: inherit;
    font-size: inherit;
    font-weight: @bold;
  }

  .this-content {

    p:first-child {
      padding-bottom: 4px;
    }
  }

  .this-content {
    padding-bottom: 16px;
  }

  .this-content:last-child {
    padding-bottom: 0;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-payment-input {

  .input-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .input-area.active-input {
    max-height: 500px;
  }
}

.elem-frontend-cms-settings-payment-input-paypal {
  p.caption {
    padding-bottom: 8px;
  }
}

.elem-frontend-cms-settings-tax-confirmation {
  .card {
    border-radius: 0 !important;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-bottom: 16px;
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  #cancel {
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }
}

.elem-frontend-cms-settings-tax-confirmation.active-popup {
  display: block;
}

.elem-frontend-cms-settings-tax-eigene_artikel {
  height: 100%;

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-settings-tax-toggle {
  overflow: hidden;
  margin: 8px 0;
  margin-bottom: 16px;
  border: 1px solid @corporate-color;
  border-radius: @basic-border-radius;

  .toggle-select {
    float: left;
    display: block;
    padding: 10px 8px;
    width: 50%;
    cursor: pointer;
    color: @secondary-text-color;

    input {
      display: none;
    }
  }

  .toggle-select.active {
    background-color: rgba(130, 197, 93, 0.2);
    color: @text-color;
  }

  .toggle-select:first-child {
    border-right: 1px solid @corporate-color;
  }
}

.elem-frontend-cms-verwaltung-bestellungen-bearbeiten {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-verwaltung-bestellungen-detail {
  .text-with-icon {
    position: relative;
    padding: 8px 0;
    padding-left: 32px;
    color: @secondary-text-color;

    span.material-icons {
      position: absolute;
      top: 0;
      left: 0;
      color: @secondary-text-color;
      line-height: 38px;
      vertical-align: center;
    }
  }

  .storno-button {
    padding-bottom: 24px;
  }

  .is-ready-area {
    padding-bottom: 24px;

    .card.this-ready {
      padding: 12px 16px;
      background-color: @dividers-color;

      p {
        color: #ffffff;

        span {
          color: inherit;
        }
      }
    }
  }

  .is-ready-area.is_ready {

    .card.this-ready {
      background-color: @dark-corporate-color;
    }

    a.btn {
      background-color: @dividers-color;
      color: @secondary-text-color !important;

      i {
        color: @secondary-text-color;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-verwaltung-bestellungen-lieferung_zahlung {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-verwaltung-bestellungen-neu_waren {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}



.elem-frontend-cms-verwaltung-bestellungen-bearbeiten-item_list.card {
  padding-right: 0;
  padding-left: 0;

  .card-head {
    padding: 8px 24px;
  }

  .card-body {
    padding: 0;

    .status-bar-area {
      position: relative;
      padding-top: 8px;
    }

    ul {
      padding-left: 24px;

      li {
        padding: 8px 24px;
        padding-left: 0;
        border-bottom: 1px solid @dividers-color;

        .this-content {
          overflow: hidden;

          .this-content-left {
            float: left;
            width: 60%;
          }

          .this-content-right {
            float: left;
            width: 40%;
          }
        }

        .dark-corporate-color {
          color: @dark-corporate-color;
        }
      }

      li:last-child {
        border-bottom: none;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-verwaltung-bestellungen-bearbeiten-item_list-bar.wl-status-bar {
  position: relative;
  padding-top: 8px;
  padding-right: 40px;

  .status-slider {
    overflow: hidden;
    display: inline-block;
    position: relative;
    margin-top: 3px;
    border-radius: 7px;
    height: 14px;
    width: 100%;

    .status-slider-inner {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      border-radius: 7px;
      height: 12px;
      -webkit-transition: width 0.5s, background-color 0.5s;
      -moz-transition: width 0.5s, background-color 0.5s;
      -ms-transition: width 0.5s, background-color 0.5s;
      -o-transition: width 0.5s, background-color 0.5s;
      transition: width 0.5s, background-color 0.5s;
    }
  }

  .add-to-bag {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    padding: 6px 16px;
    padding-right: 0;
    padding-bottom: 15px;
    cursor: pointer;

    i {
      color: @corporate-color;
    }

    .active-card {
      display: inline-block;
    }

    .inactive-card {
      display: none;
    }
  }

  .add-to-bag.active-one {
    display: inline-block;
  }

  .add-to-bag.disabled {
    cursor: inherit;

    i {
      color: @hint-text-color;
    }
  }

  .status-title {
    display: inline-block;
    padding: 0 4px;
    vertical-align: top;
    font-weight: 700;
    -webkit-transition: color 0.5s;
    -moz-transition: color 0.5s;
    -ms-transition: color 0.5s;
    -o-transition: color 0.5s;
    transition: color 0.5s;
  }
}

.elem-frontend-cms-verwaltung-bestellungen-bearbeiten-item_list-preloader {
  position: absolute;
  top: -4px;
  right: -8px;
  height: 42px;
  width: 42px;
}

.elem-frontend-cms-verwaltung-bestellungen-detail-customer {

  .address {
    padding-bottom: 16px;
  }

  .contact {
    padding: 4px 0;
  }

  .contact:last-child {
    padding-bottom: 0;
  }

  .this-action-icons {
    overflow: hidden;
    padding-top: 24px;

    .icon-button {
      float: left;
      display: inline-block;
      padding: 8px 16px;

      span {
        font-size: 28px;
        color: @dark-corporate-color;
      }
    }

    .icon-button.right-align {
      float: right;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-verwaltung-bestellungen-detail-order {
  .section_title {
    padding: 16px 24px;
    padding-bottom: 0;
  }

  ul {
    padding-left: 24px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-verwaltung-bestellungen-detail-order_list.card {
  padding-right: 0;
  padding-left: 0;

  .card-body {
    padding-right: 0;
    padding-left: 0;
  }

  .order-summery {
    border-top: 1px solid @dividers-color;
    padding: 12px 24px;

    .summery-item {
      overflow: hidden;
      padding-bottom: 8px;

      p {
        float: left;
        width: 60%;
      }

      .summery-price {
        width: 40%;
      }
    }

    .summery-item:last-child {
      padding-bottom: 0;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-verwaltung-bestellungen-detail-order_list-item {
  position: relative;
  padding: 12px 48px;
  padding-left: 0;
  border-bottom: 1px solid @dividers-color;

  .remove-order-item {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -22px;
    padding: 8px 16px;

    span {
      color: @secondary-text-color;
      font-size: 28px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-cms-verwaltung-bestellungen-detail-order_list-item:last-child {
  border-bottom: 0;
}

.elem-frontend-common-confirmation {
  .card {
    border-radius: 0 !important;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-bottom: 16px;
    }

    .popup-footer {
      padding-top: 8px;
    }
  }

  #confirmation.hide-button {
    display: none;
  }

  #cancel {
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }

  #cancel.highlight-button {
    color: @corporate-color;
  }

  #cancel.highlight-button:hover {
    color: @corporate-color;
  }

  #confirmation_description {

    a {
      font-size: inherit;
      font-family: inherit;
      font-weight: inherit;
      color: @corporate-color;
      text-decoration: underline;
    }

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

.elem-frontend-common-confirmation.active-popup {
  display: block;
}

.elem-frontend-common-loader_overlay {
  display: none;
  position: fixed;
  z-index: 80;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;

  img {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -75px;
    margin-left: -75px;
    height: 150px;
    width: auto;
  }

  .outer-loader {
    position: absolute;
    top: 50%;
    right: 50%;
    margin-top: -100px;
    margin-right: -100px;
    height: 200px;
    width: 200px;
  }

  .preloader-wrapper {
    height: 200px;
    width: 200px;
  }

  .progress {
    display: none;
    margin-top: 2.5rem !important;
  }

  .progress.show-loader {
    display: block;
  }
}

.elem-frontend-common-loader_overlay.active-loader {
  display: block;
}

.elem-frontend-common-success_messages {
  z-index: 11;
  position: fixed;
  top: 8px;
  right: 16px;

  @media @xs {
    z-index: 11;
    position: fixed;
    top: 0;
    right: auto;
    left: 0;
    width: 100%;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-common-edit_image-image {
  .card {
    padding: 0 !important;
  }

  h3.subhead {
    position: relative;
    border-bottom: 1px solid @dividers-color;
    padding: 16px 24px;
    min-height: 51px;
  }

  .img-outer {
    overflow: hidden;
    width: 100%;

    img {
      display: inline-block;
      height: auto;
      width: 100%;
    }
  }

  .img-outer.circle {
    display: inline-block;
    border-radius: 100%;
    padding-top: 8px;
    width: 100%;

    img {
      display: inline-block;
      height: auto;
      width: 100%;
    }
  }

  .img-outer.fourthree {
    height: 261px;
  }

  .img-outer.teaser {
    height: 294px;
  }

  div.card-footer {
    position: relative;
    padding: 8px 16px;
    height: 52px;

    .crop-image-button {
      display: inline-block;
      padding: 6px 8px;
      color: @secondary-text-color;
    }

    .edit_image_button {
      color: @secondary-text-color;
      padding: 0 8px;
    }

    .delete-slide {
      display: inline-block;
      position: absolute;
      bottom: 0;
      left: 0;
      padding: 8px;
      color: @hint-text-color;
    }

    .delete-slide:hover, .delete-slide:active, .delete-slide:focus {
      color: @secondary-text-color;
    }
  }
}

.elem-frontend-common-image-image_loader {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 100%;
  overflow: auto;
  background-color: rgba(255, 255, 255, 0.25);

  .outer-loader {
    position: absolute;
    top: 50%;
    right: 50%;
    margin-top: -40px;
    margin-right: -40px;
    height: 80px;
    width: 80px;
  }

  .preloader-wrapper {
    height: 80px;
    width: 80px;
  }
}

.elem-frontend-common-image-image_loader.active-loader {
  display: block;
}

@keyframes fh-image-shimmer {
  0% { background-position: 100% 50%; }
  100% { background-position: 0 50%; }
}

.elem-frontend-common-image-smart_image {
  display: block;
  position: relative;
  width: 100%;

  /*
   * Solange nichts da ist, haelt ein Pseudo-Element die Hoehe frei. Damit springt
   * das Layout beim Nachladen nicht und es blitzt kein kaputtes Bild auf.
   * Ist das Bild da, faellt der Platzhalter weg und das img fliesst wie vorher.
   */
  &.is-loading:before,
  &.is-failed:before {
    content: '';
    display: block;
    padding-top: 75%;
  }

  &.ratio-16-9.is-loading:before,
  &.ratio-16-9.is-failed:before {
    padding-top: 56.25%;
  }

  &.ratio-1-1.is-loading:before,
  &.ratio-1-1.is-failed:before {
    padding-top: 100%;
  }

  .fh-image-img {
    display: block;
    height: auto;
    width: 100%;
  }

  &.is-loading .fh-image-img,
  &.is-failed .fh-image-img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    opacity: 0;
  }

  &.is-loaded .fh-image-img {
    opacity: 1;
    transition: opacity 0.2s ease-in;
  }

  .fh-image-state {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    text-align: center;
    background-color: #f4f4f4;
    background-image: linear-gradient(100deg, #f4f4f4 30%, #ececec 50%, #f4f4f4 70%);
    background-size: 400% 100%;
  }

  &.is-loading .fh-image-loading,
  &.is-failed .fh-image-error {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  &.is-loading .fh-image-loading {
    animation: fh-image-shimmer 1.4s ease-in-out infinite;
  }

  .preloader-wrapper {
    height: 48px;
    width: 48px;
  }

  .fh-image-error {
    padding: 8px;
    cursor: pointer;

    .material-icons {
      color: rgba(0, 0, 0, 0.32);
      font-size: 32px;
    }

    p {
      margin: 4px 0 0;
    }

    .fh-image-reload {
      margin-top: 4px;
    }
  }

  /* Thumbnail-Groesse: nur das Icon, Text und Button passen nicht rein. */
  &.ratio-1-1 .fh-image-error {
    padding: 0;

    p,
    .fh-image-reload {
      display: none;
    }

    .material-icons {
      font-size: 24px;
    }
  }
}


.elem-frontend-common-success_messages-message {
  opacity: 0;
  margin-bottom: 8px;
  padding: 12px 16px;
  width: 100%;
  color: #ffffff;
  font-weight: 600;
  background-color: @dark-corporate-color;

  @media @xs {
    min-width: 100%;
    width: 100%;
  }

  @media @sm {

  }
}

.elem-frontend-common-success_messages-message.error-message {
  background-color: @error-color;
}

.elem-frontend-croppie-croppie {
  .crop-conti {
    height: 300px;
    width: 100%;
  }

  .card-footer {
    margin-top: 46px;
    padding: 0;
  }

  .card {
    border-radius: 8px;
    padding: 0;
    width: 100%;

    .card-head {
      position: relative;
      border-bottom: 1px solid @dividers-color;
      padding: 16px;

      h3 {
        padding: 2px 0;
        line-height: 100%;
      }

      a.close {
        display: inline-block;
        position: absolute;
        right: 16px;
        top: 16px;
        height: 24px;
        width: 24px;
        color: @secondary-text-color;
      }
    }

    .card-body {
      padding: 16px 24px;
    }

    .card-footer {
      border-top: 1px solid @dividers-color;
      padding: 0;
    }
  }
}

.elem-frontend-croppie-croppie.active-popup {
    display: block;
}

.elem-frontend-form-checkbox {

}

.elem-frontend-form-input {

}

.elem-frontend-form-submit {
  padding-top: 24px;

  button {
    color: @dark-corporate-color;
    background-color: @corporate-color;
  }

  button:hover, button:active, button:focus {
    color: @dark-corporate-color;
    background-color: @corporate-color;
  }

  @media @xs {
    padding-top: 16px;
  }

  @media @sm {
    padding-top: 24px;
  }

  @media @md {
    padding-top: 24px;
  }
}

.elem-frontend-form-textarea {
  label {
    left: 0 !important;
  }
}

.elem-frontend-landingpages-appointment-content {
  h1 {
    padding-bottom: 16px;
  }

  .appointment-select {
    padding-top: 24px;
  }

  .detail-input-area {
    padding-bottom: 8px;

    span.caption {
      display: block;
      margin-top: -16px;
      padding-left: 16px;
    }
  }

  .elem-frontend-cms-elements-form-radio {
    label {
      border-bottom: none;
    }
  }

  .finished-area {
    padding: 80px 0;

    h2 {
      padding-bottom: 40px;
    }

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 48px;
      line-height: 56px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 48px;
      line-height: 56px;
    }

    span.material-icons {
      font-size: 60px;
      color: @corporate-color;
    }

    p {
      padding-top: 24px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-blog-content {
  padding-top: 80px;

  section {
    padding: 16px 0;
  }

  .action-area {
    padding-top: 80px;
  }

  h1 {
    padding-top: 24px;
    padding-bottom: 24px;
  }

  h2 {
    padding-bottom: 16px;
  }

  p, li {
    padding-bottom: 8px;

    a {
      font-size: inherit;
      font-weight: inherit;
      color: inherit;
    }
  }

  ul {
    padding-left: 32px;
    list-style: disc;

    li {
      list-style: disc;
    }
  }

  .image-card-outer {
    padding-bottom: 24px;

    .image-card {
      overflow: hidden;
      display: inline-block;
      border-radius: 8px;
      padding: 0;
      max-width: 450px;

      img {
        height: auto;
        width: 100%;
      }
    }
  }

  .more-blogs {
    padding-top: 24px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-blog-hero {
  overflow: hidden;
  padding: 80px 0;
  background-color: @corporate-color;

  h1 {
    padding-top: 54px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 80px;
    line-height: 90px;
  }

  .presented {
    padding-top: 40px;
    padding-bottom: 40px;
    font-weight: 500;
    letter-spacing: 3px;
  }

  .description {
    padding-top: 30px;
    font-size: 32px;
    font-weight: 900;
    line-height: 34px;
  }

  .time-saving {
    padding-top: 16px;
    color: #ffffff;
    font-weight: 500;
    line-height: 26px;
  }

  .sub-content {
    padding: 0 100px;
  }

  .text-black {
    display: block;
    color: @dark-corporate-color;
  }

  span.text-white {
    display: block;
    color: #ffffff;
    font-size: 80px;
    line-height: 90px;
  }

  .declare-video {
    padding: 32px 0;
    width: 100%;

    .card {
      overflow: hidden;
      display: block;
      margin: 0;
      padding: 0;
      width: 100%;

      img {
        display: block;
        height: auto;
        width: 100%;
      }

      iframe {
        display: block;
        height: 348px;
        width: 100%;
      }
    }
  }

  .action-buttons {
    overflow: hidden;

    div {
      float: left;
      width: 50%;

      .presented {
        padding-bottom: 24px;
      }

      a {
        background-color: @dark-corporate-color;
        color: #ffffff !important;
      }
    }
  }

  @media @xs {
    padding: 40px 0;

    span.text-white, span.text-black {
      font-size: 30px !important;
      line-height: 40px !important;
    }

    span.text-black {
      font-size: 50px;
      line-height: 60px;
    }

    .presented {
      padding-top: 0;
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 32px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 16px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0;
    }

    span.text-white {
      font-size: 50px;
      line-height: 60px;
    }

    .declare-video {
      padding: 40px 0;
      height: auto;
      width: 100%;
      text-align: center;

      .card {
        display: inline-block;
        margin: 0;
        height: auto;
        width: 310px;

        iframe {
          display: block;
          height: 180px;
          width: 100%;
        }
      }
    }

    .action-buttons {
      overflow: hidden;

      div {
        float: left;
        padding-top: 32px;
        width: 100%;

        .presented {
          padding-bottom: 12px;
        }
      }

      div:first-child {
        padding-top: 0;
      }
    }
  }

  @media @sm {
    padding: 40px 0;

    span.text-black {
      font-size: 100px;
      line-height: 100px;
    }

    .presented {
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 32px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 16px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0 100px;
    }

    span.text-white {
      font-size: 100px;
      line-height: 100px;
    }

    .declare-video {
      padding: 40px 0;
      height: 350px;
      width: 100%;

      .card {
        margin: 0;
        height: 305px;
        width: 100%;

        iframe {
          height: 308px;
          width: 100%;
        }
      }
    }
  }

  @media @md {
    padding: 80px 0;

    span.text-black {
      font-size: 120px;
      line-height: 100px;
    }

    .presented {
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 32px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 16px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0 50px;
    }

    span.text-white {
      font-size: 120px;
      line-height: 100px;
    }

    .declare-video {
      padding: 68px 0;
      height: 350px;
      width: 100%;

      .card {
        margin: 0;
        height: 266px;
        width: 100%;

        a {
          display: block;
        }

        iframe {
          height: 268px;
          width: 100%;
        }
      }
    }
  }
}

.elem-frontend-landingpages-fakuh-content {
  padding: 40px 0;

  .page-head {
    h1 {
      padding: 48px 0;
      padding-bottom: 24px;
      font-weight: 500;
    }

    p {
      padding-bottom: 24px;
    }
  }

  article {
    padding: 40px 0;

    h3 {
      padding-bottom: 8px;
    }

    p.subhead, li.subhead {
      padding-bottom: 24px;
      color: rgba(0, 0, 0, 0.86);
      font-weight: 400;

      a {
        color: inherit;
        font-size: inherit;
        font-weight: inherit;
        text-decoration: underline;
      }
    }

    .on-corporate-color {
      padding-bottom: 16px;
      color: @corporate-color;
      font-weight: 700;
    }
  }

  ul.collapsible {

    p {
      padding-bottom: 16px;
    }

    p.body1.regular, li.body1.regular {
      a {
        font-size: inherit;
        font-weight: inherit;
        color: @corporate-color;
        text-decoration: underline;
      }

      a.in-text:hover {
        text-decoration: none;
      }
    }

    ul {
      padding-bottom: 16px;
      padding-left: 32px;

      li {
        padding: 4px 0;
        padding-right: 24px;
        list-style: disc;
      }
    }

    ol {
      padding-bottom: 16px;
      padding-left: 32px;
      li {
        padding: 4px 0;
        list-style: decimal;
        padding-right: 24px;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-home-about_us {
  overflow: hidden;
  padding: 80px 0;

  .image-card-outer {
    padding-bottom: 24px;

    .image-card {
      overflow: hidden;
      display: inline-block;
      border-radius: 8px;
      padding: 0;
      max-width: 450px;

      img {
        height: auto;
        width: 100%;
      }
    }
  }

  h2 {
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  p.title {
    padding-bottom: 16px;
  }

  p.body1 {
    padding-bottom: 16px;
  }

  p.body1:last-child {
    padding-bottom: 0;
  }

  .action-area {
    padding-top: 40px;

    p {
      font-weight: 400;
    }

    .this-button {
      padding-top: 24px;
    }
  }

  @media @xs {
    padding: 60px 0;

  }

  @media @sm {
    padding: 80px 0;

  }

  @media @md {
    padding: 80px 0;

  }
}

.elem-frontend-landingpages-home-blog {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 24px;
    color: @dark-corporate-color;
    font-weight: 700;
  }

  .card {
    overflow: hidden;
    padding: 0;

    .img-outer {
      img {
        height: auto;
        width: 100%;
      }

      iframe {
        display: block;
        height: 224px;
        width: 100%;
      }
    }

    .content-text {
      padding: 30px;
      padding-bottom: 20px;

      .example-head {
        padding: 30px 0;
        padding-top: 0;

        h3 {
          padding-bottom: 4px;
          color: @dark-corporate-color;
        }
      }

      .example-text {
        padding: 0;

        p {
          padding-bottom: 20px;
        }

        a {
          padding: 0;
        }
      }
    }
  }

  .action-area {
    padding-top: 40px;

    p {
      font-weight: 400;
    }

    .this-button {
      padding-top: 24px;
    }
  }


  @media @xs {
    padding: 60px 0;

    h2 {
      padding-bottom: 24px;
    }

    .card {
      padding: 0;

      .img-outer {
        iframe {
          height: 224px;
        }
      }

      .content-text {
        padding: 30px;
        padding-bottom: 20px;

        .example-head {
          padding: 30px 0;
          padding-top: 0;

          h3 {
            padding-bottom: 4px;
          }
        }

        .example-text {
          padding: 0;

          p {
            padding-bottom: 20px;
          }

          a {
            padding: 0;
          }
        }
      }
    }

    .action-area {
      padding-top: 40px;

      .this-button {
        padding-top: 24px;
      }
    }
  }

  @media @sm {
    padding: 80px 0;

    h2 {
      padding-bottom: 24px;
    }

    .card {
      padding: 0;

      .img-outer {
        iframe {
          height: 224px;
        }
      }

      .content-text {
        padding: 16px;
        padding-bottom: 10px;

        .example-head {
          padding: 16px 0;
          padding-top: 0;

          h3 {
            padding-bottom: 4px;
          }
        }

        .example-text {
          padding: 0;

          p {
            padding-bottom: 16px;
          }

          a {
            padding: 0;
          }
        }
      }
    }

    .action-area {
      padding-top: 40px;

      .this-button {
        padding-top: 24px;
      }
    }
  }

  @media @md {
    padding: 80px 0;

    h2 {
      padding-bottom: 24px;
    }

    .card {
      padding: 0;

      .img-outer {
        iframe {
          height: 224px;
        }
      }

      .content-text {
        padding: 30px;
        padding-bottom: 20px;

        .example-head {
          padding: 30px 0;
          padding-top: 0;

          h3 {
            padding-bottom: 4px;
          }
        }

        .example-text {
          padding: 0;

          p {
            padding-bottom: 20px;
          }

          a {
            padding: 0;
          }
        }
      }
    }

    .action-area {
      padding-top: 40px;

      .this-button {
        padding-top: 24px;
      }
    }
  }
}

.elem-frontend-landingpages-home-contact {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 40px;
  }

  .image-card-outer {
    padding-bottom: 24px;

    .image-card {
      overflow: hidden;
      display: inline-block;
      border-radius: 8px;
      padding: 0;
      max-width: 290px;

      img {
        height: auto;
        width: 100%;
      }
    }
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  .form-input-area {
    padding-top: 40px;
  }

  .formular, .loading-area , .finished-area {
    display: none;
    position: relative;
    z-index: 0;
    opacity: 0;
    padding: 0 165px;
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }

  .finished-area {
    span.material-icons {
      font-size: 60px;
      color: @corporate-color;
    }

    p {
      padding-top: 24px;
    }
  }

  .formular.active-area, .loading-area.active-area , .finished-area.active-area {
    display: block;
    z-index: 1;
    opacity: 1;
  }

  @media @xs {
    padding: 60px 0;
    padding-bottom: 80px;

    h2.futura {
      font-size: 40px;
      line-height: 40px;
    }

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 42px;
      line-height: 52px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 42px;
      line-height: 52px;
    }

    .form-input-area {
      padding-top: 20px;
    }

    .formular, .loading-area , .finished-area {
      padding: 0;
    }
  }

  @media @sm {
    padding: 80px 0;

    h2.futura {
      font-size: 80px;
      line-height: 80px;
    }

    .form-input-area {
      padding-top: 40px;
    }

    .formular, .loading-area , .finished-area {
      padding: 0 80px;
    }
  }

  @media @md {
    padding: 80px 0;

    h2.futura {
      font-size: 80px;
      line-height: 80px;
    }

    .form-input-area {
      padding-top: 40px;
    }

    .formular, .loading-area , .finished-area {
      padding: 0 120px;
    }
  }
}

.elem-frontend-landingpages-home-example {
  overflow: hidden;
  padding-top: 80px;

  p.title {
    padding-bottom: 24px;
    color: rgba(0, 0, 0, 0.86);
    font-weight: 400;
  }

  p.on-corporate-color {
    padding-bottom: 16px;
    color: @corporate-color;
    font-weight: 700;
  }

  .acrion-area {
    padding-top: 40px;

    .button-outer {
      display: inline-block;
      padding-left: 16px;
      vertical-align: top;

      .zugangsdaten {
        display: block;
        padding-top: 8px;
      }
    }

    .button-outer:first-child {
      padding-left: 0;
    }

    a {
      color: @dark-corporate-color;
      font-size: 16px;
      background-color: @corporate-color;
      min-width: 220px;
    }

    a:hover, a:focus, a:active {
      color: @dark-corporate-color;
      background-color: @corporate-color;
    }
  }

  img {
    display: inline-block;
    height: 350px;
    width: auto;
  }

  @media @xs {
    .acrion-area {
      text-align: left;

      .button-outer {
        padding-bottom: 24px;
        padding-left: 0;
      }
    }

    .example-image {
      text-align: right;
    }
  }

  @media @sm {
    .acrion-area {
      text-align: left;
    }

    .example-image {
      text-align: right;
    }
  }

  @media @md {

  }
}

.elem-frontend-landingpages-home-examples {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 24px;
    color: @dark-corporate-color;
    font-weight: 700;
  }

  .card {
    overflow: hidden;
    padding: 0;

    .img-outer {
      img {
        height: auto;
        width: 100%;
      }

      iframe {
        display: block;
        height: 224px;
        width: 100%;
      }
    }

    .content-text {
      padding: 30px;
      padding-bottom: 20px;

      .example-head {
        padding: 30px 0;
        padding-top: 0;

        h3 {
          padding-bottom: 4px;
          color: @dark-corporate-color;
        }
      }

      .example-text {
        padding: 0;

        p {
          padding-bottom: 20px;
        }

        a {
          padding: 0;
        }
      }
    }
  }

  .action-area {
    padding-top: 40px;

    p {
      font-weight: 400;
    }

    .this-button {
      padding-top: 24px;
    }
  }


  @media @xs {
    padding: 60px 0;

    h2 {
      padding-bottom: 24px;
    }

    .card {
      padding: 0;

      .img-outer {
        iframe {
          height: 224px;
        }
      }

      .content-text {
        padding: 30px;
        padding-bottom: 20px;

        .example-head {
          padding: 30px 0;
          padding-top: 0;

          h3 {
            padding-bottom: 4px;
          }
        }

        .example-text {
          padding: 0;

          p {
            padding-bottom: 20px;
          }

          a {
            padding: 0;
          }
        }
      }
    }

    .action-area {
      padding-top: 40px;

      .this-button {
        padding-top: 24px;
      }
    }
  }

  @media @sm {
    padding: 80px 0;

    h2 {
      padding-bottom: 24px;
    }

    .card {
      padding: 0;

      .img-outer {
        iframe {
          height: 148px;
        }
      }

      .content-text {
        padding: 16px;
        padding-bottom: 10px;

        .example-head {
          padding: 16px 0;
          padding-top: 0;

          h3 {
            padding-bottom: 4px;
          }
        }

        .example-text {
          padding: 0;

          p {
            padding-bottom: 10px;
          }

          a {
            padding: 0;
          }
        }
      }
    }

    .action-area {
      padding-top: 40px;

      .this-button {
        padding-top: 24px;
      }
    }
  }

  @media @md {
    padding: 80px 0;

    h2 {
      padding-bottom: 24px;
    }

    .card {
      padding: 0;

      .img-outer {
        iframe {
          height: 172px;
        }
      }

      .content-text {
        padding: 30px;
        padding-bottom: 20px;

        .example-head {
          padding: 30px 0;
          padding-top: 0;

          h3 {
            padding-bottom: 4px;
          }
        }

        .example-text {
          padding: 0;

          p {
            padding-bottom: 20px;
          }

          a {
            padding: 0;
          }
        }
      }
    }

    .action-area {
      padding-top: 40px;

      .this-button {
        padding-top: 24px;
      }
    }
  }
}

.elem-frontend-landingpages-home-hero {
  overflow: hidden;
  padding: 80px 0;
  background-color: @corporate-color;

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 80px;
    line-height: 90px;
  }

  .presented {
    padding-top: 40px;
    padding-bottom: 40px;
    font-weight: 500;
    letter-spacing: 3px;
  }

  .description {
    padding-top: 30px;
    font-size: 32px;
    font-weight: 900;
    line-height: 34px;
  }

  .time-saving {
    padding-top: 16px;
    color: #ffffff;
    font-weight: 500;
    line-height: 26px;
  }

  .sub-content {
    padding: 0 100px;
  }

  .text-black {
    display: block;
    color: @dark-corporate-color;
  }

  span.text-white {
    display: block;
    color: #ffffff;
    font-size: 80px;
    line-height: 90px;
  }

  .declare-video {
    padding: 32px 0;
    height: 412px;
    width: 100%;

    .card {
      display: block;
      overflow: hidden;
      margin: 0;
      padding: 0;
      height: 336px;
      width: 100%;

      iframe {
        display: block;
        height: 343px;
        width: 100%;
      }
    }
  }

  .action-buttons {
    overflow: hidden;

    div {
      float: left;
      width: 50%;

      .presented {
        padding-bottom: 24px;
      }

      a {
        background-color: @dark-corporate-color;
        color: #ffffff !important;
      }
    }
  }

  @media @xs {
    padding: 40px 0;

    span.text-black {
      font-size: 50px;
      line-height: 60px;
    }

    .presented {
      padding-top: 0;
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 32px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 16px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0;
    }

    span.text-white {
      font-size: 50px;
      line-height: 60px;
    }

    .declare-video {
      padding: 40px 0;
      height: auto;
      width: 100%;
      text-align: center;

      .card {
        display: inline-block;
        overflow: hidden;
        margin: 0;
        height: 170px;
        width: 310px;

        iframe {
          height: 170px;
          width: 100%;
        }
      }
    }

    .action-buttons {
      overflow: hidden;

      div {
        float: left;
        padding-top: 32px;
        width: 100%;

        .presented {
          padding-bottom: 12px;
        }
      }

      div:first-child {
        padding-top: 0;
      }
    }
  }

  @media @sm {
    padding: 40px 0;

    span.text-black {
      font-size: 100px;
      line-height: 100px;
    }

    .presented {
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 32px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 16px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0 100px;
    }

    span.text-white {
      font-size: 100px;
      line-height: 100px;
    }

    .declare-video {
      padding: 40px 0;
      padding-bottom: 0;
      height: 350px;
      width: 100%;

      .card {
        margin: 0;
        height: 308px;
        width: 100%;

        iframe {
          height: 308px;
          width: 100%;
        }
      }
    }
  }

  @media @md {
    padding: 80px 0;

    span.text-black {
      font-size: 80px;
      line-height: 90px;
    }

    .presented {
      padding-top: 20px;
      padding-bottom: 20px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 20px;
      font-size: 28px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 16px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0 50px;
    }

    span.text-white {
      font-size: 80px;
      line-height: 90px;
    }

    .declare-video {
      padding: 20px 0;
      height: 310px;
      width: 100%;

      .card {
        margin: 0;
        height: 268px;
        width: 100%;

        iframe {
          height: 268px;
          width: 100%;
        }
      }
    }
  }
}

.elem-frontend-landingpages-home-known {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  p {
    a {
      font-size: inherit;
      font-weight: inherit;
      font-family: inherit;
      color: inherit;
    }
  }

  .partner-image {
    padding: 16px 0;

    .card {
      overflow: hidden;
      padding: 0;

      img {
        height: auto;
        width: 100%;
      }

      h3, p {
        padding: 8px 24px;
      }

      h3 {
        border-top: 1px solid @dividers-color;
      }

      p {
        padding-top: 0;

        a {
          font-weight: @medium;
          color: @dark-corporate-color;
        }
      }
    }
  }

  @media @xs {
    padding: 40px 0;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-home-map {
  overflow: hidden;
  padding: 80px 0;
  padding-bottom: 0;

  h2 {
    padding-bottom: 24px;
    color: @dark-corporate-color;
    font-weight: 700;
  }

  .headline {
    padding-top: 16px;
    padding-bottom: 8px;
  }

  .legende {
    padding-top: 16px;

    span {
      display: inline-block;
      vertical-align: middle;

      img {
        display: inline-block;
        margin-right: 8px;
        height: 30px;
        width: auto;
        vertical-align: middle;
      }
    }

    span.legend-item {
      padding: 8px 16px;
    }
  }

  #map {
    margin-top: 24px;
    height: 650px;
    width: 100%;
  }

  @media @xs {
    padding: 60px 0;

    h2 {
      padding-bottom: 24px;
    }

    #map {
      height: 400px;
      width: 100%;
    }

    .legende {
      span.legend-item {
        display: block;
        padding: 8px 16px;
      }
    }
  }

  @media @sm {
    padding: 80px 0;
    padding-bottom: 0;

    h2 {
      padding-bottom: 24px;
    }

    #map {
      height: 450px;
      width: 100%;
    }

    .legende {
      span.legend-item {
        display: block;
        padding: 8px 16px;
      }
    }
  }

  @media @md {
    padding: 80px 0;
    padding-bottom: 0;

    h2 {
      padding-bottom: 24px;
    }

    #map {
      height: 625px;
      width: 100%;
    }
  }
}

.elem-frontend-landingpages-home-partner {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  .partner-image {
    padding: 16px 0;
    img {
      height: auto;
      width: 100%;
    }
  }

  @media @xs {
    padding: 40px 0;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-home-points {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  .item-list {
    padding: 16px 0;
    padding-bottom: 40px;
  }

  .this-button {
    padding-top: 24px;
  }

  h3 {
    padding-bottom: 16px;
  }

  @media @xs {
    padding: 40px 0;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-home-price {
  overflow: hidden;
  padding: 80px 0;
  background-color: @corporate-color;

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: #ffffff;
    font-size: 48px;
    line-height: 56px;
  }

  p.headline {
    padding-top: 40px;
    padding-bottom: 24px;
    color: #ffffff;
  }

  .price-point {
    display: inline-block;
    position: relative;
    padding: 21px 0;
    padding-left: 64px;
    width: 300px;

    .icon-outer {
      display: inline-block;
      position: absolute;
      top: 50%;
      left: 0;
      margin-top: -22px;
      padding: 0 8px;
      border-radius: 100%;
      background-color: #ffffff;
      height: 44px;
      width: 44px;
      vertical-align: middle;
      line-height: 44px;

      span {
        font-size: 32px;
        color: @corporate-color;
        line-height: 44px;
      }
    }

    p.subhead {
      color: #ffffff;
    }
  }

  .action-buttons {
    overflow: hidden;
    padding-top: 24px;

    div {
      float: left;
      width: 100%;

      .presented {
        padding-bottom: 24px;
      }

      a {
        background-color: @dark-corporate-color;
        color: #ffffff !important;
      }
    }
  }

  @media @xs {
    padding: 60px 0;

  }

  @media @sm {
    padding: 80px 0;

  }

  @media @md {
    padding: 80px 0;

  }
}

.elem-frontend-landingpages-home-research_project {
  overflow: hidden;
  padding: 80px 0;

  .image-card-outer {
    padding-bottom: 24px;

    .image-card {
      overflow: hidden;
      display: inline-block;
      border-radius: 8px;
      padding: 0;
      max-width: 450px;

      img {
        height: auto;
        width: 100%;
      }
    }
  }

  h2 {
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  p.title {
    padding-bottom: 16px;
  }

  p.body1 {
    padding-bottom: 16px;
  }

  p.body1:last-child {
    padding-bottom: 0;
  }

  .action-area {
    padding-top: 40px;

    p {
      font-weight: 400;
    }

    .this-button {
      padding-top: 24px;
    }
  }

  @media @xs {
    padding: 60px 0;

  }

  @media @sm {
    padding: 80px 0;

  }

  @media @md {
    padding: 80px 0;

  }
}

.elem-frontend-landingpages-home-why {
  overflow: hidden;
  padding: 80px 0;
  background-color: @corporate-color;

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: #ffffff;
    font-size: 48px;
    line-height: 56px;
  }

  p.headline {
    padding-top: 40px;
    padding-bottom: 24px;
    color: #ffffff;
  }

  .card {
    padding: 0;

    .img-outer {
      padding: 30px;
      background-color: rgba(0,0,0,0.05);

      img {
        height: 120px;
        width: auto;
      }
    }

    .content-text {
      padding: 30px;
      padding-bottom: 20px;

      .example-head {
        padding: 0;
        padding-bottom: 16px;

        h3 {
          padding-bottom: 4px;
          color: @dark-corporate-color;
        }
      }

      .example-text {
        padding: 0;

        p {
          padding: 0;
          padding-bottom: 20px;
        }

        a {
          padding: 0;
        }
      }
    }
  }

  .action-area {
    padding-top: 40px;

    p {
      font-weight: 400;
    }

    .this-button {
      padding-top: 24px;
    }
  }

  @media @xs {
    padding: 60px 0;

  }

  @media @sm {
    padding: 80px 0;

  }

  @media @md {
    padding: 80px 0;

  }
}

.elem-frontend-landingpages-home-map-popup {
  .card {
    border-radius: 0 !important;
    padding: 0;
    width: 328px !important;

    .popup-head {
      padding-top: 8px;
      padding-bottom: 8px;
      background-color: @dark-corporate-color;

      h3 {
        padding: 8px 16px;
        color: #ffffff;
      }
    }

    .popup-body {
      padding: 8px 16px;
      padding-top: 16px;
    }

    .popup-footer {
      padding: 8px 0;
    }
  }

  #map_confirmation.hide-button {
    display: none;
  }

  #cancel {
    float: left;
    color: @hint-text-color;
  }

  #cancel:hover {
    color: @hint-text-color;
  }

  #cancel.highlight-button {
    color: @corporate-color;
  }

  #cancel.highlight-button:hover {
    color: @corporate-color;
  }
}

.elem-frontend-landingpages-home-map-popup.active-popup {
  display: block;
}

.elem-frontend-landingpages-home-points-item {
  margin: 16px 0;
  padding: 24px 16px;

  p.body1 {
    padding: 0 24px;
    padding-bottom: 8px;
  }

  .icon-outer {
    padding-bottom: 20px;

    .icon-background {
      display: inline-block;
      position: relative;
      padding: 0 8px;
      border-radius: 100%;
      background-color: rgba(0, 0, 0, 0.05);
      height: 88px;
      width: 88px;
      vertical-align: middle;
      line-height: 88px;

      span {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -29px;
        margin-left: -29px;
        font-size: 58px;
        color: @dark-corporate-color;
      }
    }
  }

  @media @xs {
    margin: 0;

    p.body1 {
      padding: 0;
      padding-bottom: 8px;
    }
  }

  @media @sm {
    p.body1 {
      padding: 0;
      padding-bottom: 8px;
    }
  }
}

.elem-frontend-landingpages-home-points-video {
  .card {
    border-radius: 0 !important;
    padding: 0;
    width: 600px !important;

    .popup-head {
      padding: 16px;
      padding-top: 16px;
      background-color: @corporate-color;

      h3 {
        color: #ffffff;
      }
    }

    .popup-footer {
      padding-top: 8px;
      padding-bottom: 8px;
      background-color: @corporate-color;
    }
  }

  iframe {
    display: block;
    height: 400px;
    width: 100%;
  }

  #cancel {
    color: #ffffff;
  }

  #cancel:hover {
    color: #ffffff;
  }

  @media @xs {
    .card {
      width: 328px !important;
    }

    iframe {
      height: 169px;
      width: 100%;
    }
  }

  @media @sm {
    .card {
      width: 450px !important;
    }

    iframe {
      height: 302px;
      width: 100%;
    }
  }
}

.elem-frontend-landingpages-home-points-video.active-popup {
  display: block;
}

.elem-frontend-landingpages-landingpage-content {
  padding-top: 80px !important;

  h1 {
    padding-top: 24px;
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  p.subhead {
    padding-bottom: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-legal-agb-content {
  padding: 40px 0;

  h1 {
    font-weight: 500;
  }

  article {
    padding: 40px 0;

    h3 {
      padding-bottom: 8px;
    }

    p.subhead, li.subhead {
      padding-bottom: 24px;
      color: rgba(0, 0, 0, 0.86);
      font-weight: 400;

      a {
        color: inherit;
        font-size: inherit;
        font-weight: inherit;
        text-decoration: underline;
      }
    }

    .on-corporate-color {
      padding-bottom: 16px;
      color: @corporate-color;
      font-weight: 700;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-legal-datenschutz-content {
  padding: 40px 0;

  h1 {
    font-weight: 500;
  }

  article {
    padding: 40px 0;

    h3 {
      padding-bottom: 8px;
    }

    p.subhead, li.subhead {
      padding-bottom: 24px;
      color: rgba(0, 0, 0, 0.86);
      font-weight: 400;

      a {
        color: inherit;
        font-size: inherit;
        font-weight: inherit;
        text-decoration: underline;
      }
    }

    .on-corporate-color {
      padding-bottom: 16px;
      color: @corporate-color;
      font-weight: 700;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-legal-impressum-content {
  padding: 40px 0;

  article {
    padding: 40px 0;

    p.title {
      padding-bottom: 24px;
      color: rgba(0, 0, 0, 0.86);
      font-weight: 400;
    }

    .on-corporate-color {
      padding-bottom: 16px;
      color: @corporate-color;
      font-weight: 700;
    }

    a {
      font-weight: inherit;
      font-size: inherit;
      font-family: inherit;
      color: @dark-corporate-color;
      text-decoration: underline;
    }

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

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-navigation-footer {
  padding: 50px 0;
  padding-bottom: 0;
  background-color: @corporate-color;

  .logo-outer {
    padding: 8px 0;
    padding-bottom: 30px;

    img {
      height: 60px;
      width: auto;
    }
  }

  p.headline {
    padding-bottom: 24px;
  }

  p {
    color: #ffffff;
  }

  ul {
    li {

      a {
        display: inline-block;
        padding: 12px 24px;
        color: #ffffff;
      }
    }
  }

  .social_icons {
    margin-top: 34px;
    padding: 24px 0;
    padding-bottom: 16px;
    background-color: #ffffff;

    a {
      display: inline-block;
      padding: 0 12px;

      img {
        height: 40px;
        width: auto;
      }
    }
  }

  .copyright {
    padding-top: 16px;
    padding-bottom: 24px;
    background-color: #ffffff;
    color: @dark-corporate-color;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-navigation-header {
  height: 80px;
  background-color: @corporate-color;

  .card {
    margin: 0;
    padding: 0;
    border-radius: 0;
  }

  .fixed-part {
    overflow: hidden;
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    height: 80px;
    width: 100%;
    background-color: @corporate-color;
    -webkit-transition: height 0.3s, transform 200ms linear;
    -moz-transition: height 0.3s, transform 200ms linear;
    -ms-transition: height 0.3s, transform 200ms linear;
    -o-transition: height 0.3s, transform 200ms linear;
    transition: height 0.3s, transform 200ms linear;
    will-change: transform;
    transform: translateY(0%);
    -webkit-box-shadow: none;
    box-shadow: none;

    .img-outer {
      padding: 20px 0;
      height: 80px;

      img {
        height: 100%;
        width: auto;
      }
    }

    ul {
      padding: 10px 0;

      li {
        display: inline-block;
        padding-top: 11px;

        .btn-flat {
          padding-right: 40px;
          padding-left: 40px;
          color: #ffffff;
        }

        .btn-flat:hover {
          color: @dark-corporate-color;
        }

        .register_now {
          background-color: @dark-corporate-color;
          color: #ffffff !important;
        }

        .register_now:hover, .register_now:active, .register_now:focus {
          background-color: @dark-corporate-color;
          color: #ffffff;
        }
      }
    }
  }

  @media @xs {
    height: 56px;

    .container {
      width: 100%;
    }

    h1 {
      padding-top: 24px;
    }

    .fixed-part {
      height: 56px;

      .img-outer {
        padding: 8px;
        height: 56px;
      }
      img {
        height: 100%;
      }
    }

    ul {
      padding: 0;

      li {
        padding-top: 2px !important;
      }
    }
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-navigation-header {
  .headroom--pinned {
    z-index: 14;
    -webkit-box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);

    .card.logo-area {
      transform: translateY(0%);
    }
  }

  .headroom--unpinned {
    transform: translateY(-100%);
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  .headroom--top {
    z-index: 10;
    -webkit-box-shadow: none;
    box-shadow: none;

  }
}

.elem-frontend-landingpages-online_seminar-content {

}

.elem-frontend-landingpages-online_seminar-content-contact {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 24px;
  }

  h3 {
    padding-bottom: 24px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  .form-input-area {
    padding-top: 40px;
  }

  .formular, .loading-area , .finished-area {
    display: none;
    position: relative;
    z-index: 0;
    opacity: 0;
    padding: 0 165px;
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }

  .finished-area {
    span.material-icons {
      font-size: 60px;
      color: @corporate-color;
    }

    p {
      padding-top: 24px;
    }
  }

  .formular.active-area, .loading-area.active-area , .finished-area.active-area {
    display: block;
    z-index: 1;
    opacity: 1;
  }

  @media @xs {
    padding: 60px 0;
    padding-bottom: 80px;

    h2.futura {
      font-size: 40px;
      line-height: 40px;
    }

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    .form-input-area {
      padding-top: 20px;
    }

    .formular, .loading-area , .finished-area {
      padding: 0;
    }
  }

  @media @sm {
    padding: 80px 0;

    h2.futura {
      font-size: 80px;
      line-height: 80px;
    }

    .form-input-area {
      padding-top: 40px;
    }

    .formular, .loading-area , .finished-area {
      padding: 0 80px;
    }
  }

  @media @md {
    padding: 80px 0;

    h2.futura {
      font-size: 80px;
      line-height: 80px;
    }

    .form-input-area {
      padding-top: 40px;
    }

    .formular, .loading-area , .finished-area {
      padding: 0 120px;
    }
  }
}

.elem-frontend-landingpages-online_seminar-content-dmpl {
  overflow: hidden;
  padding: 80px 0;

  p {
    a {
      font-size: inherit;
      color: @corporate-color !important;
      font-family: inherit;
    }
  }

  h2 {
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  .image-outer {
    padding-bottom: 24px;

    img {
      display: inline-block;
      height: 100%;
      width: auto;
    }
  }

  .subhead.medium {
    color: @dark-corporate-color;
  }

  .this-button {
    padding-top: 24px;
  }

  .img-card.card {
    display: inline-block;
    padding: 0;
    height: 320px;
    width: auto;
  }

  @media @xs {
    padding: 40px 0;

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    .image-outer {
      padding-bottom: 24px;

      .img-card.card {
        height: auto;
        width: 80%;
      }

      img {
        height: auto;
        width: 100%;
      }
    }
  }

  @media @sm {
    .image-outer {
      padding-bottom: 24px;

      .img-card.card {
        height: auto;
        width: 60%;
      }

      img {
        height: auto;
        width: 100%;
      }
    }
  }

  @media @md {

  }
}

.elem-frontend-landingpages-online_seminar-content-farmer {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  .item-list {
    padding: 16px 0;
    padding-bottom: 40px;

    .row {
      display: flex;
      flex-wrap: wrap;
    }

    .col {
      display: flex;
    }

    .card {
      overflow: hidden;
      padding: 0;
      width: 100%;
      display: flex;
      flex-direction: column;

      .img-outer {
        img {
          height: auto;
          width: 100%;
        }

        iframe {
          display: block;
          height: 224px;
          width: 100%;
        }
      }

      .content-text {
        padding: 30px;
        padding-bottom: 20px;

        .example-head {
          padding: 30px 0;
          padding-top: 0;

          h3 {
            padding-bottom: 4px;
            color: @dark-corporate-color;
          }
        }

        .example-text {
          padding: 0;

          p {
            padding-bottom: 20px;
          }

          a {
            padding: 0;
          }
        }
      }
    }
  }

  .subhead.medium {
    color: @dark-corporate-color;
  }

  .this-button {
    padding-top: 24px;
  }

  @media @xs {
    padding: 40px 0;

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 36px;
      line-height: 44px;
    }
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-online_seminar-content-hero {
  overflow: hidden;
  padding: 80px 0;
  background-color: @corporate-color;

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 80px;
    line-height: 90px;
  }

  .presented {
    padding-top: 40px;
    padding-bottom: 40px;
    font-weight: 500;
    letter-spacing: 3px;
  }

  .description {
    padding-top: 30px;
    font-size: 24px;
    font-weight: 900;
    line-height: 34px;
  }

  .time-saving {
    padding-top: 16px;
    color: #ffffff;
    font-weight: 500;
    line-height: 26px;
  }

  .sub-content {
    padding: 0 100px;
    padding-top: 40px;
  }

  .text-black {
    display: block;
    color: @dark-corporate-color;
  }

  span.text-white {
    display: block;
    color: #ffffff;
    font-size: 60px;
    line-height: 90px;
  }

  .declare-video {
    padding: 32px 0;
    padding-bottom: 24px;
    width: 100%;

    .material-icons {
      display: inline-block;
      height: 148px;
      color: @dark-corporate-color;
      font-size: 160px;
      line-height: 158px;
    }
  }

  .time-saving {
    padding-top: 0;
  }

  .action-buttons {
    overflow: hidden;
    padding-top: 24px;

    .action-button {
      float: left;
      width: 50%;

      a {
        margin: 0 8px;
      }

      a, a:hover, a:focus, a:active {
        background-color: @dark-corporate-color;
        color: #ffffff !important;
      }
    }
  }

  .time-saving.subhead {
    padding-top: 16px;
  }

  .card.attention-shadow {
    display: inline-block;
    padding: 16px 24px;
    max-width: 350px;
    background-color: #D1637B;
  }

  @media @xs {
    padding: 40px 0;

    span.text-black {
      font-size: 42px;
      line-height: 50px;
    }

    .presented {
      padding-top: 0;
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 24px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 16px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0;
    }

    span.text-white {
      font-size: 42px;
      line-height: 50px;
    }

    .declare-video {
      padding: 40px 0;
      padding-bottom: 24px;
      width: 100%;
      text-align: center;

      .material-icons {
        font-size: 160px;
      }
    }

    .time-saving {
      padding-top: 0;
      font-size: 20px;
    }

    .action-buttons {
      overflow: hidden;

      .action-button {
        width: 100%;
        padding-top: 16px;
        text-align: center;
      }

      .action-button:last-child {
        padding-top: 16px;
      }
    }
  }

  @media @sm {
    padding: 40px 0;

    span.text-black {
      font-size: 100px;
      line-height: 100px;
    }

    .presented {
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 24px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 16px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0 100px;
    }

    span.text-white {
      font-size: 100px;
      line-height: 100px;
    }

    .declare-video {
      padding: 40px 0;
      padding-bottom: 0;
      width: 100%;

      .material-icons {
        font-size: 160px;
      }
    }

    span.text-black {
      font-size: 60px;
      line-height: 68px;
    }

    span.text-white {
      font-size: 60px;
      line-height: 68px;
    }

  }

  @media @md {
    padding: 80px 0;

    span.text-black {
      font-size: 80px;
      line-height: 90px;
    }

    .presented {
      padding-top: 20px;
      padding-bottom: 20px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 20px;
      font-size: 24px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 16px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0 50px;
    }

    span.text-white {
      font-size: 80px;
      line-height: 90px;
    }

    .declare-video {
      padding: 20px 0;
      width: 100%;

      .material-icons {
        font-size: 160px;
      }
    }
  }
}

.elem-frontend-landingpages-online_seminar-content-mission {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  .declare-video {
    padding: 24px 0;

    .card {
      overflow: hidden;
      padding: 0;

      iframe {
        display: block;
        height: 340px;
        width: 100%;
      }
    }
  }

  .subhead.medium {
    color: @dark-corporate-color;
  }

  .this-button {
    padding-top: 24px;
  }

  @media @xs {
    padding: 40px 0;

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    .declare-video {
      .card {
        iframe {
          height: 192px;
        }
      }
    }
  }

  @media @sm {
    .declare-video {
      .card {
        iframe {
          height: 202px;
        }
      }
    }
  }

  @media @md {
    .declare-video {
      .card {
        iframe {
          height: 268px;
        }
      }
    }
  }
}

.elem-frontend-landingpages-online_seminar-content-next {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 24px;
    color: @dark-corporate-color;
    font-weight: 700;

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 48px;
      line-height: 56px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 48px;
      line-height: 56px;
    }
  }

  .teaser {
    position: relative;
    padding: 40px 0;
    padding-bottom: 102px;

    h3 {
      padding-bottom: 40px;
    }

    p.futura {
      padding-bottom: 8px;
      color: @corporate-color;
    }

    .spinner {
      position: relative;
      padding: 0 50px;

      .paginator-center {
        ul {
          li {
            position: absolute;
            top: 50%;
            margin-top: -20px;
            cursor: pointer;

            span {
              font-size: 40px;
            }
          }

          li:first-child {
            left: 0;
          }

          li:last-child {
            right: 0;
          }
        }
      }
    }
  }

  .card {
    overflow: hidden;
    padding: 0;

    .img-outer {
      img {
        height: auto;
        width: 100%;
      }

      iframe {
        display: block;
        height: 224px;
        width: 100%;
      }
    }

    .content-text {
      padding: 30px;
      padding-bottom: 20px;

      .example-head {
        padding: 30px 0;
        padding-top: 0;

        h3 {
          padding-bottom: 4px;
          color: @dark-corporate-color;
        }
      }

      .example-text {
        padding: 0;

        p {
          padding-bottom: 20px;
        }

        a {
          padding: 0;
        }
      }
    }
  }

  .action-area {
    padding-top: 40px;

    p {
      font-weight: 400;
    }

    .this-button {
      padding-top: 24px;
    }
  }


  @media @xs {
    padding: 60px 0;

    h2 {
      padding-bottom: 24px;

      span.text-black {
        display: block;
        color: @dark-corporate-color;
        font-size: 36px;
        line-height: 44px;
      }

      span.text-white {
        display: block;
        color: @corporate-color;
        font-size: 36px;
        line-height: 44px;
      }
    }

    .card {
      padding: 0;

      .img-outer {
        iframe {
          height: 224px;
        }
      }

      .content-text {
        padding: 30px;
        padding-bottom: 20px;

        .example-head {
          padding: 30px 0;
          padding-top: 0;

          h3 {
            padding-bottom: 4px;
          }
        }

        .example-text {
          padding: 0;

          p {
            padding-bottom: 20px;
          }

          a {
            padding: 0;
          }
        }
      }
    }

    .action-area {
      padding-top: 40px;

      .this-button {
        padding-top: 24px;
      }
    }
  }

  @media @sm {
    padding: 80px 0;

    h2 {
      padding-bottom: 24px;
    }

    .card {
      padding: 0;

      .img-outer {
        iframe {
          height: 224px;
        }
      }

      .content-text {
        padding: 16px;
        padding-bottom: 10px;

        .example-head {
          padding: 16px 0;
          padding-top: 0;

          h3 {
            padding-bottom: 4px;
          }
        }

        .example-text {
          padding: 0;

          p {
            padding-bottom: 16px;
          }

          a {
            padding: 0;
          }
        }
      }
    }

    .action-area {
      padding-top: 40px;

      .this-button {
        padding-top: 24px;
      }
    }
  }

  @media @md {
    padding: 80px 0;

    h2 {
      padding-bottom: 24px;
    }

    .card {
      padding: 0;

      .img-outer {
        iframe {
          height: 224px;
        }
      }

      .content-text {
        padding: 30px;
        padding-bottom: 20px;

        .example-head {
          padding: 30px 0;
          padding-top: 0;

          h3 {
            padding-bottom: 4px;
          }
        }

        .example-text {
          padding: 0;

          p {
            padding-bottom: 20px;
          }

          a {
            padding: 0;
          }
        }
      }
    }

    .action-area {
      padding-top: 40px;

      .this-button {
        padding-top: 24px;
      }
    }
  }
}

.elem-frontend-landingpages-online_seminar-content-quote {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  .item-list {
    padding: 16px 0;
    padding-bottom: 40px;

    .row {
      display: flex;
      flex-wrap: wrap;
    }

    .col {
      display: flex;
    }

    .card {
      overflow: hidden;
      padding: 0;
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;

      .img-outer {
        img {
          height: auto;
          width: 100%;
        }
      }

      .content-text {
        padding: 30px;
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;

        .example-text {
          margin-top: auto;
          padding-top: 16px;

          a {
            margin-top: 16px;
            padding: 0;
          }
        }

        .material-icons {
          color: @corporate-color;
          font-size: 40px;
        }

        .subhead.medium {
          padding-top: 16px;
          color: @dark-corporate-color;
        }
      }
    }
  }

  .this-button {
    padding-top: 24px;
  }

  @media @xs {
    padding: 40px 0;

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 36px;
      line-height: 44px;
    }
  }
}


.elem-frontend-landingpages-online_seminar-content-speaker {
  overflow: hidden;
  padding: 80px 0;

  h2 {
    padding-bottom: 40px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  .item-list {
    padding: 16px 0;
    padding-bottom: 40px;

    .speaker {

      .card {
        overflow: hidden;
        display: inline-block;
        padding: 0;
        border-radius: 100%;

        img {
          height: 240px;
          width: 240px;
        }
      }

      h3 {
        padding-top: 24px;
        padding-bottom: 8px;
        color: @dark-corporate-color;
      }

      p.subhead {
        padding-bottom: 8px;
      }

      p.body1.regular {
        padding: 0 24px;
      }
    }
  }

  .subhead.medium {
    color: @dark-corporate-color;
  }

  .this-button {
    padding-top: 24px;
  }

  @media @xs {
    padding: 40px 0;

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    .item-list {
      .speaker {
        padding-top: 16px;
        padding-bottom: 16px;

        .card {
          padding: 0;

          img {
            height: 240px;
            width: 240px;
          }
        }

        h3 {
          padding-top: 24px;
          padding-bottom: 8px;
        }

        p.subhead {
          padding-bottom: 8px;
        }

        p.body1.regular {
          padding: 0 24px;
        }
      }
    }

    h2 {
      padding-bottom: 0;
    }
  }

  @media @sm {
    .item-list {
      .speaker {

        .card {
          overflow: hidden;
          display: inline-block;
          padding: 0;
          border-radius: 100%;

          img {
            height: 240px;
            width: 240px;
          }
        }

        h3 {
          padding-top: 24px;
          padding-bottom: 8px;
          color: @dark-corporate-color;
        }

        p.subhead {
          padding-bottom: 8px;
        }

        p.body1.regular {
          padding: 0 20px;
        }
      }
    }
  }

  @media @md {
    .item-list {
      .speaker {

        .card {
          overflow: hidden;
          display: inline-block;
          padding: 0;
          border-radius: 100%;

          img {
            height: 240px;
            width: 240px;
          }
        }

        h3 {
          padding-top: 24px;
          padding-bottom: 8px;
          color: @dark-corporate-color;
        }

        p.subhead {
          padding-bottom: 8px;
        }

        p.body1.regular {
          padding: 0 20px;
        }
      }
    }
  }
}

.elem-frontend-landingpages-online_seminar-content-topic {
  overflow: hidden;
  padding: 80px 0;
  background-color: @corporate-color;

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: #ffffff;
    font-size: 48px;
    line-height: 56px;
  }

  p.description {
    padding: 24px 0;
    color: #ffffff;
  }

  .content-area {

    h3 {
      padding-bottom: 16px;
      color: #ffffff;
    }

    p {

    }

    .collabsable {
      overflow: hidden;
      max-height: 0;
      -webkit-transition: max-height 0.3s;
      -moz-transition: max-height 0.3s;
      -ms-transition: max-height 0.3s;
      -o-transition: max-height 0.3s;
      transition: max-height 0.3s;

      p {
        padding: 16px 80px;
        padding-bottom: 24px;
        color: #ffffff;
      }
    }

    .collabsable.active-collabsable {
      max-height: 1000px;
    }

    .collabsale-action {
      p {
        padding: 8px 24px;
        color: #ffffff;
        cursor: pointer;

        span {
          display: inline-block;
          color: #ffffff;
          vertical-align: middle;
        }

        span.material-icons {
          display: inline-block;
          color: #ffffff;
          font-size: 32px;
        }
      }
    }

    .collabsale-action.active-collabsable {
      p {
        span.material-icons {
          -webkit-transform: rotate(180deg);
          -moz-transform: rotate(180deg);
          -ms-transform: rotate(180deg);
          -o-transform: rotate(180deg);
          transform: rotate(180deg);
        }
      }
    }

    .undeline-seperator {
      display: inline-block;
      border-bottom: 1px solid #ffffff;
      width: 160px;
    }
  }

  .subhead.text-white {
    color: #ffffff;
  }

  p.subhead.text-white {
    padding-right: 24px;
    padding-left: 24px;
  }

  .action-area {
    padding-top: 24px;

    p {
      padding-bottom: 24px;
      font-weight: 400;
    }

    a, a:hover, a:active, a:focus {
      background-color: @dark-corporate-color;
    }
  }

  @media @xs {
    padding: 60px 0;

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 36px;
      line-height: 44px;
    }
  }

  @media @sm {
    padding: 80px 0;

  }

  @media @md {
    padding: 80px 0;

  }
}

.elem-frontend-landingpages-online_seminar-content-why {
  overflow: hidden;
  padding: 80px 0;
  background-color: @corporate-color;

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: #ffffff;
    font-size: 48px;
    line-height: 56px;
  }

  p.description {
    padding: 40px 0;
    padding-top: 24px;
    color: #ffffff;
  }

  .subhead.text-white {
    color: #ffffff;
  }

  p.subhead.text-white {
    padding-right: 24px;
    padding-left: 24px;
  }

  .why-text {
    padding-top: 16px;
    color: #FFFFFF;
  }

  .action-area {
    padding-top: 80px;

    p {
      padding-bottom: 24px;
      font-weight: 400;
    }

    a, a:hover, a:active, a:focus {
      background-color: @dark-corporate-color;
    }
  }

  .icon-text {
    p.subhead {
      padding-top: 16px;
    }
  }

  .material-icons {
    color: @dark-corporate-color;
    font-size: 80px;
  }

  @media @xs {
    padding: 60px 0;

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 36px;
      line-height: 44px;
    }

    .icon-text {
      padding: 12px 0;
    }
  }

  @media @sm {
    padding: 80px 0;

    .icon-text {
      padding: 12px 0;
    }
  }

  @media @md {
    padding: 80px 0;
  }
}

.elem-frontend-landingpages-online_seminar-content-common-attendee_counter {
  .card.attention-shadow {
    display: inline-block;
    padding: 16px 24px;
    max-width: 350px;
    background-color: #D1637B;

    p {
      padding-bottom: 0;
    }
  }
}

.elem-frontend-landingpages-online_seminar-content-topic-item {
  padding: 12px 0;

  @media @xs {
  }

  @media @sm {
  }

  @media @md {
  }
}

.elem-frontend-landingpages-referral-content {

  .action-area {
    padding: 24px 0;
  }

  h2 {
    padding-top: 80px;
    padding-bottom: 24px;
  }

  .image-card-outer {
    padding-bottom: 24px;

    .image-card {
      overflow: hidden;
      display: inline-block;
      border-radius: 8px;
      padding: 0;
      max-width: 450px;

      img {
        height: auto;
        width: 100%;
      }
    }
  }

  p.headline {
    padding-bottom: 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-research_project-content {
  h2 {
    padding-bottom: 16px;
    font-weight: 700;
  }

  .corporate-color {
    color: @corporate-color;
  }

  p {
    padding: 16px;
  }

  .text-area {
    position: relative;
    padding: 24px 100px;

    .borderline {
      position: absolute;
      bottom: 0;
      left: 50%;
      margin-left: -94px;
      border: 1px solid rgba(0,0,0,0.54);
      width: 188px;
    }
  }

  .text-area:last-child {
    .borderline {
      display: none;
    }
  }

  @media @xs {
    .text-area {
      position: relative;
      padding: 16px;
    }
  }

  @media @sm {
    .text-area {
      position: relative;
      padding: 24px;
    }
  }

  @media @md {
    .text-area {
      position: relative;
      padding: 24px 40px;
    }
  }
}

.elem-frontend-landingpages-research_project-content-contact {
  overflow: hidden;
  padding: 80px 0;
  padding-top: 16px;

  h2 {
    padding-bottom: 24px;
  }

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  span.text-white {
    display: block;
    color: @corporate-color;
    font-size: 48px;
    line-height: 56px;
  }

  .form-input-area {
    padding-top: 40px;
  }

  .formular, .loading-area , .finished-area {
    display: none;
    position: relative;
    z-index: 0;
    opacity: 0;
    padding: 0 165px;
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }

  .finished-area {
    span.material-icons {
      font-size: 60px;
      color: @corporate-color;
    }

    p {
      padding-top: 24px;
    }
  }

  .formular.active-area, .loading-area.active-area , .finished-area.active-area {
    display: block;
    z-index: 1;
    opacity: 1;
  }

  @media @xs {
    padding: 16px 0;
    padding-bottom: 80px;

    h2.futura {
      font-size: 40px;
      line-height: 40px;
    }

    span.text-black {
      display: block;
      color: @dark-corporate-color;
      font-size: 42px;
      line-height: 52px;
    }

    span.text-white {
      display: block;
      color: @corporate-color;
      font-size: 42px;
      line-height: 52px;
    }

    .form-input-area {
      padding-top: 20px;
    }

    .formular, .loading-area , .finished-area {
      padding: 0;
    }
  }

  @media @sm {
    padding: 80px 0;
    padding-top: 16px;

    h2.futura {
      font-size: 80px;
      line-height: 80px;
    }

    .form-input-area {
      padding-top: 40px;
    }

    .formular, .loading-area , .finished-area {
      padding: 0 80px;
    }
  }

  @media @md {
    padding: 80px 0;
    padding-top: 16px;

    h2.futura {
      font-size: 80px;
      line-height: 80px;
    }

    .form-input-area {
      padding-top: 40px;
    }

    .formular, .loading-area , .finished-area {
      padding: 0 120px;
    }
  }
}

.elem-frontend-landingpages-research_project-content-criteria {
  overflow: hidden;
  padding: 80px 0;
  padding-bottom: 16px;

  p {
    a {
      font-weight: @medium;
      font-size: inherit;
      color: @corporate-color;
      font-family: inherit;
      text-decoration: underline;
    }

    a:hover {
      color: @corporate-color;
      text-decoration: none;
    }
  }

  @media @xs {
    padding: 40px 0;
    padding-bottom: 16px;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-research_project-content-hero {
  overflow: hidden;
  padding: 80px 0;
  background-color: @corporate-color;

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 80px;
    line-height: 90px;
  }

  .icon-line {
    padding: 16px 0;

    p {
      padding: 16px 0;
      color: #ffffff;
      font-size: 28px;
    }

    span, img {
      display: inline-block;
      margin: 0 16px;
      vertical-align: middle;
    }

    img {
      height: 64px;
      width: auto;
    }

    span {
      font-size: 48px;
      padding: 8px;
      border-radius: 100%;
      color: #ffffff;
    }

    span.white {
      background-color: #ffffff;
      color: @corporate-color;
    }
  }

  .presented {
    padding-top: 40px;
    padding-bottom: 40px;
    font-weight: 500;
    letter-spacing: 3px;
  }

  .description {
    padding-top: 30px;
    font-size: 32px;
    font-weight: 900;
    line-height: 34px;
  }

  .time-saving {
    padding-top: 40px;
    color: #ffffff;
    font-weight: 500;
    line-height: 26px;
  }

  .sub-content {
    padding: 0 24px;
  }

  .text-black {
    display: block;
    color: @dark-corporate-color;
  }

  span.text-white {
    display: block;
    color: #ffffff;
    font-size: 80px;
    line-height: 90px;
  }

  .declare-video {
    padding: 32px 0;
    height: 412px;
    width: 100%;

    .card {
      display: block;
      overflow: hidden;
      margin: 0;
      padding: 0;
      height: 336px;
      width: 100%;

      iframe {
        display: block;
        height: 343px;
        width: 100%;
      }
    }
  }

  .action-buttons {
    overflow: hidden;

    div {
      float: left;
      width: 100%;

      .presented {
        padding-bottom: 24px;
      }

      a {
        background-color: @dark-corporate-color;
        color: #ffffff !important;
      }
    }
  }

  @media @xs {
    padding: 40px 0;

    span.text-black {
      font-size: 50px;
      line-height: 60px;
    }

    .presented {
      padding-top: 0;
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 32px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 40px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0;
    }

    span.text-white {
      font-size: 50px;
      line-height: 60px;
    }

    .declare-video {
      padding: 40px 0;
      height: auto;
      width: 100%;
      text-align: center;

      .card {
        display: inline-block;
        overflow: hidden;
        margin: 0;
        height: 170px;
        width: 310px;

        iframe {
          height: 170px;
          width: 100%;
        }
      }
    }

    .action-buttons {
      overflow: hidden;

      div {
        float: left;
        padding-top: 32px;
        width: 100%;

        .presented {
          padding-bottom: 12px;
        }
      }

      div:first-child {
        padding-top: 0;
      }
    }
  }

  @media @sm {
    padding: 40px 0;

    span.text-black {
      font-size: 100px;
      line-height: 100px;
    }

    .presented {
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 32px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 40px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0 24px;
    }

    span.text-white {
      font-size: 100px;
      line-height: 100px;
    }

    .declare-video {
      padding: 40px 0;
      padding-bottom: 0;
      height: 350px;
      width: 100%;

      .card {
        margin: 0;
        height: 308px;
        width: 100%;

        iframe {
          height: 308px;
          width: 100%;
        }
      }
    }
  }

  @media @md {
    padding: 80px 0;

    span.text-black {
      font-size: 80px;
      line-height: 90px;
    }

    .presented {
      padding-top: 20px;
      padding-bottom: 20px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 20px;
      font-size: 28px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 40px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0 24px;
    }

    span.text-white {
      font-size: 80px;
      line-height: 90px;
    }

    .declare-video {
      padding: 20px 0;
      height: 310px;
      width: 100%;

      .card {
        margin: 0;
        height: 268px;
        width: 100%;

        iframe {
          height: 268px;
          width: 100%;
        }
      }
    }
  }
}

.elem-frontend-landingpages-research_project-content-plan {
  overflow: hidden;
  padding: 80px 0;

  .plan-overview {
    overflow: hidden;
    padding: 16px;

    .step {
      float: left;
      border: 1px solid #fafafa;

      p {
        padding-bottom: 8px;
      }

      .progress-bar {
        display: block;
        border: 5px solid @corporate-color;
      }
    }

    .quarter {
      width: 25%;
    }

    .half {
      width: 50%;
    }
  }

  ul {
    padding: 8px 16px;
    padding-top: 0;

    li {
      padding: 8px 0;
    }
  }

  .goals {
    padding-bottom: 16px;

    img {
      margin-top: 24px;
      margin-bottom: 8px;
    }

    p.title {
      padding: 16px 40px;
    }

    p.subhead {
      padding: 8px 40px;
    }
  }

  .phase {
    padding: 24px 0;

    p.title {
      padding-bottom: 0;
    }
  }

  ol {
    padding: 16px;
    padding-bottom: 8px;

    li {
      overflow: hidden;
      display: table;
      padding: 12px 0;
      vertical-align: middle;
      width: 100%;

      span.entry {
        display: table-cell;
        position: relative;
        border-left: 1px solid rgba(0,0,0,0.54);
        width: 20%;
        vertical-align: middle;

        span.border {
          position: absolute;
          right: 0;
          bottom: -12px;
          border-bottom: 1px solid rgba(0,0,0,0.54);
          width: 200%;
        }
      }

      span.entry:first-child {
        border-left: 0;
        width: 80%;
      }
    }
  }

  .total-amount {
    overflow: hidden;
    padding: 8px 16px;

    span {
      float: left;
      display: block;
      width: 20%;
    }

    span:first-child {
      width: 80%;
    }
  }

  @media @xs {
    padding: 40px 0;


  }

  @media @sm {


  }

  @media @md {


  }
}

.elem-frontend-landingpages-research_project-content-point_row {
  overflow: hidden;
  padding: 80px 0;
  padding-top: 40px;

  .point {
    position: relative;
    padding: 16px 48px;

    img {
      height: 200px;
      width: auto;
    }
  }

  @media @xs {
    padding: 40px 0;
    padding-top: 0;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-single_help-content {
  h2 {
    padding-bottom: 16px;
    font-weight: 700;
  }

  .corporate-color {
    color: @corporate-color;
  }

  p {
    padding: 16px;
  }

  .text-area {
    position: relative;
    padding: 24px 100px;

    .borderline {
      position: absolute;
      bottom: 0;
      left: 50%;
      margin-left: -94px;
      border: 1px solid rgba(0,0,0,0.54);
      width: 188px;
    }
  }

  .text-area:last-child {
    .borderline {
      display: none;
    }
  }

  @media @xs {
    .text-area {
      position: relative;
      padding: 16px;
    }
  }

  @media @sm {
    .text-area {
      position: relative;
      padding: 24px;
    }
  }

  @media @md {
    .text-area {
      position: relative;
      padding: 24px 40px;
    }
  }
}

.elem-frontend-landingpages-single_help-content-contact {
  overflow: hidden;
  padding: 80px 0;
  padding-bottom: 0;

  p {
    padding-bottom: 0;
  }

  @media @xs {
    padding: 40px 0;
    padding-bottom: 16px;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-single_help-content-hero {
  overflow: hidden;
  padding: 80px 0;
  background-color: @corporate-color;

  span.text-black {
    display: block;
    color: @dark-corporate-color;
    font-size: 80px;
    line-height: 90px;
  }

  .icon-line {
    padding: 16px 0;

    p {
      padding: 16px 0;
      color: #ffffff;
      font-size: 28px;
    }

    span, img {
      display: inline-block;
      margin: 0 16px;
      vertical-align: middle;
    }

    img {
      height: 64px;
      width: auto;
    }

    span {
      font-size: 48px;
      padding: 8px;
      border-radius: 100%;
      color: #ffffff;
    }

    span.white {
      background-color: #ffffff;
      color: @corporate-color;
    }
  }

  .presented {
    padding-top: 40px;
    padding-bottom: 40px;
    font-weight: 500;
    letter-spacing: 3px;
  }

  .description {
    padding-top: 30px;
    font-size: 32px;
    font-weight: 900;
    line-height: 34px;
  }

  .time-saving {
    padding-top: 40px;
    color: #ffffff;
    font-weight: 500;
    line-height: 26px;
  }

  .sub-content {
    padding: 0 24px;
  }

  .text-black {
    display: block;
    color: @dark-corporate-color;
  }

  span.text-white {
    display: block;
    color: #ffffff;
    font-size: 40px;
    line-height: 50px;
  }

  .declare-video {
    padding: 32px 0;
    height: 412px;
    width: 100%;

    .card {
      display: block;
      overflow: hidden;
      margin: 0;
      padding: 0;
      height: 336px;
      width: 100%;

      iframe {
        display: block;
        height: 343px;
        width: 100%;
      }
    }
  }

  a {
    margin: 16px 0;
    background-color: @dark-corporate-color !important;
    color: #ffffff !important;
  }

  p.subhead {
    color: #ffffff;
  }

  @media @xs {
    padding: 40px 0;

    span.text-black {
      font-size: 50px;
      line-height: 60px;
    }

    .presented {
      padding-top: 0;
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 32px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 40px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0;
    }

    span.text-white {
      font-size: 40px;
      line-height: 50px;
    }

    .declare-video {
      padding: 40px 0;
      height: auto;
      width: 100%;
      text-align: center;

      .card {
        display: inline-block;
        overflow: hidden;
        margin: 0;
        height: 170px;
        width: 310px;

        iframe {
          height: 170px;
          width: 100%;
        }
      }
    }

    .action-buttons {
      overflow: hidden;

      div {
        float: left;
        padding-top: 32px;
        width: 100%;

        .presented {
          padding-bottom: 12px;
        }
      }

      div:first-child {
        padding-top: 0;
      }
    }
  }

  @media @sm {
    padding: 40px 0;

    span.text-black {
      font-size: 100px;
      line-height: 100px;
    }

    .presented {
      padding-bottom: 40px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 30px;
      font-size: 32px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 40px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0 24px;
    }

    span.text-white {
      font-size: 40px;
      line-height: 50px;
    }

    .declare-video {
      padding: 40px 0;
      padding-bottom: 0;
      height: 350px;
      width: 100%;

      .card {
        margin: 0;
        height: 308px;
        width: 100%;

        iframe {
          height: 308px;
          width: 100%;
        }
      }
    }
  }

  @media @md {
    padding: 80px 0;

    span.text-black {
      font-size: 80px;
      line-height: 90px;
    }

    .presented {
      padding-top: 20px;
      padding-bottom: 20px;
      letter-spacing: 3px;
    }

    .description {
      padding-top: 20px;
      font-size: 28px;
      line-height: 34px;
    }

    .time-saving {
      padding-top: 40px;
      line-height: 26px;
    }

    .sub-content {
      padding: 0 24px;
    }

    span.text-white {
      font-size: 40px;
      line-height: 50px;
    }

    .declare-video {
      padding: 20px 0;
      height: 310px;
      width: 100%;

      .card {
        margin: 0;
        height: 268px;
        width: 100%;

        iframe {
          height: 268px;
          width: 100%;
        }
      }
    }
  }
}

.elem-frontend-landingpages-single_help-content-procedure {
  overflow: hidden;
  padding: 80px 0;
  padding-bottom: 16px;

  @media @xs {
    padding: 40px 0;
    padding-bottom: 16px;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-landingpages-single_help-content-specification {
  overflow: hidden;
  padding: 80px 0;
  padding-bottom: 16px;

  @media @xs {
    padding: 40px 0;
    padding-bottom: 16px;
  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-recommendation-content {
  .important-input  {
    display: none;
  }

  h1 {
    padding: 60px 0;
  }

  .formular {
    padding-top: 24px;

    .title {
      padding-bottom: 8px;
    }
  }

  .content-outer {
    margin-top: -40px;
    margin-bottom: -40px;
  }

  .card {
    padding: 16px;
    padding-top: 24px;
    background-color: #ffffff;

    img {
      height: auto;
      width: 60%;
    }

    .cta-area {
      padding: 16px 0;
    }
  }

  .content-end {
    padding: 60px 0;
  }

  .input-area {
    padding-top: 16px;
  }

  .step {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .step.show-area {
    max-height: 1000px;
  }

  .referral-outer {
    padding: 16px 0;

    .referral-area {

      label {
        border-bottom: none !important;
      }
    }
  }

  @media @xs {
    .card {
      img {
        width: 100%;
      }
    }
  }

  @media @sm {
    .card {
      img {
        width: 80%;
      }
    }
  }

  @media @md {

  }
}

.elem-frontend-recommendation-finish {
  .important-input  {
    display: none;
  }

  h1 {
    padding: 60px 0;
  }

  p {
    padding-top: 24px;
  }

  .formular {
    padding-top: 24px;

    .title {
      padding-bottom: 8px;
    }
  }

  .content-outer {
    margin-top: -40px;
    margin-bottom: -40px;
  }

  .card {
    padding: 8px 16px;
    padding-top: 24px;
    background-color: #ffffff;

    img {
      height: auto;
      width: 60%;
    }

    .cta-area {
      padding: 16px 0;
    }
  }

  .content-end {
    padding: 60px 0;
  }

  .input-area {
    padding-top: 16px;
  }

  @media @xs {
    .card {
      img {
        width: 100%;
      }
    }
  }

  @media @sm {
    .card {
      img {
        width: 80%;
      }
    }
  }

  @media @md {

  }
}

.elem-frontend-recommendation-image {
  .important-input  {
    display: none;
  }

  h1 {
    padding: 60px 0;
  }

  .formular {
    padding-top: 24px;

    .title {
      padding-bottom: 8px;
    }
  }

  .content-outer {
    margin-top: -40px;
    margin-bottom: -40px;
  }

  .card {
    padding: 8px 16px;
    padding-top: 24px;
    background-color: #ffffff;

    img {
      height: auto;
      width: 60%;
    }

    .cta-area {
      padding: 16px 0;
    }
  }

  .content-end {
    padding: 60px 0;
  }

  .input-area {
    padding-top: 16px;
  }

  #cancel-process {
    color: @secondary-text-color;
  }

  .space-for-croppie {
    padding-top: 72px !important;
  }

  @media @xs {
    .card {
      img {
        width: 100%;
      }
    }
  }

  @media @sm {
    .card {
      img {
        width: 80%;
      }
    }
  }

  @media @md {

  }
}

.elem-frontend-recommendation-image_upload {
  .important-input  {
    display: none;
  }

  h1 {
    padding: 60px 0;
  }

  .formular {
    padding-top: 24px;

    .title {
      padding-bottom: 8px;
    }
  }

  .content-outer {
    margin-top: -40px;
    margin-bottom: -40px;
  }

  .card {
    padding: 8px 16px;
    padding-top: 24px;
    background-color: #ffffff;

    .image-frame {
      margin: 16px 0;
      padding: 24px 0;
      background-color: rgba(0,0,0,0.5);
      text-align: center;

      .image-selector {
        display: inline-block;
        position: relative;
        border-radius: 100%;
        height: 228px;
        width: 228px;
        background-color: @background-color;

        p {
          position: absolute;
          top: 50%;
          margin-top: -11px;
          width: 100%;
          text-align: center;
        }
      }
    }

    .cta-area {
      padding: 16px 0;
    }
  }

  .add-image {
    padding-top: 24px;

    label {
      input {
        display: none;
      }
    }
  }

  .content-end {
    padding: 60px 0;
  }

  .input-area {
    padding-top: 16px;
  }

  #cancel-process {
    color: @secondary-text-color;
  }

  @media @xs {
    .card {
      img {
        width: 100%;
      }
    }
  }

  @media @sm {
    .card {
      img {
        width: 80%;
      }
    }
  }

  @media @md {

  }
}

.elem-frontend-recommendation-content-star_input {
  p {
    padding-top: 16px;
  }

  .input-star-row {
    position: relative;
    padding-top: 4px;

    .star {
      display: inline-block;
      position: relative;
      height: 48px;
      width: 48px;

      .material-icons {
        opacity: 1;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -21px;
        margin-left: -21px;
        font-size: 42px;
        color: @secondary-text-color;
        cursor: pointer;
        -webkit-transition: opacity 0.3s;
        -moz-transition: opacity 0.3s;
        -ms-transition: opacity 0.3s;
        -o-transition: opacity 0.3s;
        transition: opacity 0.3s;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }

      .material-icons.filled-star {
        opacity: 0;
        color: #FBBC04;
      }
    }

    .star:hover, .star.hover-star, .star.active-star {
      .material-icons {
        opacity: 0;
      }

      .material-icons.filled-star {
        opacity: 1;
      }
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-color {

  .color-picker {
    padding-top: 8px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-company {
  height: 100%;

  .suggestion-input {
    position: relative;
    margin-top: 8px;
  }

  .input-line {
    overflow: hidden;

    .elem-frontend-cms-elements-form-input {
      margin: 0;
    }

    .bigger-input {
      float: left;
      width: 65%;
    }

    .smaller-input {
      float: left;
      width: 35%;
    }

    .padding-right {
      padding-right: 4px;
    }

    .padding-left {
      padding-left: 4px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-congratulation {
  padding: 40px 0 !important;

  .card {
    position: relative;
    padding: 4px;

    .team-pic {
      border-radius: @basic-border-radius;
      height: auto;
      width: 100%;
    }

    .team-friedhold-badge {
      position: absolute;
      right: -16px;
      bottom: -8px;
      border-radius: 16px;
      padding: 4px 16px;
      background-color: @corporate-color;
      color: #FFFFFF;
    }
  }

  .highlighted-area {
    position: relative;
    margin-bottom: 16px;
    border-radius: @basic-border-radius;
    border: 1px solid @corporate-color;
    background-color: fade(@corporate-color, 15%);
    padding: 20px 16px;
    padding-left: 48px;

    span.material-icons {
      position: absolute;
      top: 20px;
      left: 16px;
      color: @corporate-color;
    }

    p {
      color: @corporate-color;
    }
  }

  .next-steps {
    padding: 16px 0;

    h2 {
      padding-bottom: 16px;
    }

    ul {

      .step {
        position: relative;
        padding: 8px 0;
        padding-left: 54px;

        span.step-icon {
          display: inline-block;
          position: absolute;
          top: 8px;
          left: 0;
          border-radius: 100%;
          padding: 8px;
          color: @corporate-color;
          background-color: fade(@corporate-color, 10%);
        }

        .download-button {
          padding: 16px 0;

          a {
            span {
              vertical-align: middle;
              color: inherit;
            }
          }
        }
      }
    }
  }

  .action-area {
    padding: 16px;

    p {
      padding-bottom: 16px;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-contact {
  height: 100%;

  section {
    height: 100%;
  }

  .action-area {
    padding-bottom: 40px;
  }

  .login-hint {
    padding-top: 24px;
    padding-bottom: 8px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-delivery {
  overflow: hidden;
  position: relative;
  padding-left: 0;
  height: 100%;
  -webkit-transition: padding-left 0.3s;
  -moz-transition: padding-left 0.3s;
  -ms-transition: padding-left 0.3s;
  -o-transition: padding-left 0.3s;
  transition: padding-left 0.3s;

  section {
    height: 100%;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-delivery.space_for_sidenav {
  padding-left: 350px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}

.elem-frontend-registration-image {

  .image-card {
    padding: 0;
  }

  .add-image-description {
    padding: 8px 0;
  }

  .add-image-outer {
    padding: 8px 0;

    .add-image {
      input {
        display: none;
      }
    }
  }

  .img-outer {
    img {
      height: auto;
      width: 100%;
    }
  }

  .footer-outer {
    padding: 0 16px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-imagecut {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-payment {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-person {

  .whatsapp-error {
    display: none;
    color: @error-color;
  }

  .whatsapp-error.active-error {
    display: block;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-products {

  ul {
    li {
      padding: 8px 0;
      border-bottom: 1px solid @dividers-color;
    }

    li:last-child {
      border-bottom: none;
    }
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-slogan {

  .slogan-text-area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .slogan-text-area.active-input {
    max-height: 500px;
  }

  .elem-frontend-cms-elements-form-radio {
    padding-bottom: 0;
  }

  .elem-frontend-cms-elements-form-input_text {
    margin-bottom: 4px;
  }

  .text-counter-hint {
    padding-bottom: 8px;
    padding-left: 24px;

    span {
      color: inherit;
      font-weight: inherit;
      font-size: inherit;
      font-family: inherit;
    }

    span.error {
      color: @error-color;
    }
  }

  .text-counter-hint.error {
    color: @error-color;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-start {

  .login-hint {
    padding-top: 24px;
    padding-bottom: 8px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-tax {

  .input_area {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 0.3s;
    -moz-transition: max-height 0.3s;
    -ms-transition: max-height 0.3s;
    -o-transition: max-height 0.3s;
    transition: max-height 0.3s;
  }

  .input_area.active-area {
    max-height: 1000px;
  }

  .this-hint-text-invoice {
    display: none;
    padding: 0 24px;
  }

  .this-hint-text-invoice.show-hint {
    display: block;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-common-image {

  img {
    height: auto;
    width: 90%;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-registration-company-url {

  .input-area {
    position: relative;
    padding-right: 88px;

    #input-extra {
      display: inline-block;
      position: absolute;
      top: 50%;
      right: 0;
      margin-top: -4px;
    }
  }

  .domain-example-text {
    padding-top: 16px;
  }

  .hint-text {
    display: none;
  }

  .form-hint-text.correct, #domain-example.correct {
    color: @corporate-color;
  }

  .form-hint-text.incorrect, #domain-example.incorrect {
    color: @error-color;
  }
}

.elem-frontend-registration-delivery-delivery_new {
  .new-deliverymethod {
    display: inline-block;
  }
}

.elem-frontend-registration-image-item.card {
  overflow: hidden;

  .img-outer {
    position: relative;
    min-height: 220px;
  }
}

.elem-frontend-user_management-e_mail_bestaetigung-content {

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-user_management-forgot_password-content {
  .login-hint {
    padding-top: 24px;
    padding-bottom: 8px;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

.elem-frontend-user_management-login-content {

  .login-hint {
    padding-top: 24px;
    padding-bottom: 8px;
  }

  p {

    a {
      color: @corporate-color;
      text-decoration: underline;
    }

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

  p.error-message {
    padding-bottom: 16px;
    color: @error-color;
  }

  @media @xs {

  }

  @media @sm {

  }

  @media @md {

  }
}

html {
  height: 100%;
}

body {
  overflow-x: hidden;
  background-color: @background-color;
  height: 100%;
  width: 100%;
  font-size: 10px;
  font-family: @font-family-roboto;

  .corporate-font-light {
    font-family: expressa_serial_light;
    letter-spacing: 0.24em;
  }

  .corporate-font {
    font-family: expressa_serial;
    letter-spacing: 0.24em;
  }

  .corporate-font-heavy {
    font-family: expressa_serial_heavy;
    letter-spacing: 0.24em;
  }

  .futura, .corporate-font-bold {
    font-family: expressa_serial_bold;
    letter-spacing: 0.24em;
  }

  .corporate-font-xbold {
    font-family: expressa_serial_xbold;
    letter-spacing: 0.24em;
  }

  .content-body {
    position: relative;
    height: 100%;
    background-color: @background-color;
    transition: 0.5s filter;
    -webkit-transition: 0.3s -webkit-filter;
    -moz-transition: 0.3s -moz-filter;
    -ms-transition: 0.3s -ms-filter;
    -o-transition: 0.3s -o-filter;
  }

  .content-body.blur-background {
    -webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    -ms-filter: blur(4px);
    -o-filter: blur(4px);
    filter: blur(4px);
  }

  .date-text {
    color: #ffffff;
  }

  .timepicker-span-hours, .timepicker-span-minutes {
    font-size: 46px;
    color: #ffffff;
  }

  .timepicker-digital-display, .datepicker-date-display {
    background-color: @corporate-color;
  }

  .td.is-selected {
    background-color: @corporate-color;
  }

  .td.is-today {
    color: @corporate-color;
  }

  .cms-content {
    overflow: hidden;
    padding: 0;
    padding-bottom: 56px;
  }

  .card {
    margin: 16px 0;
    padding: 8px 16px;
    border-radius: @basic-border-radius;

    .card-head {
      padding: 8px 16px;

      .card-h {
        padding-bottom: 8px;
      }
    }

    .card-body {
      padding: 8px 16px;
    }

    .card-footer {

    }
  }

  .hint-box {
    border-radius: @basic-border-radius;
    padding: 8px 16px;
    background-color: #82C55D;
    color: #ffffff;
  }

  .content-has-main-nav {
    overflow: auto;
    padding: 0;
    padding-bottom: 34px;
    height: 100%;
    -webkit-transition: padding-top 0.3s;
    -moz-transition: padding-top 0.3s;
    -ms-transition: padding-top 0.3s;
    -o-transition: padding-top 0.3s;
    transition: padding-top 0.3s;
  }

  .content-has-main-nav.has-top-app-bar {
    padding-top: 54px;
  }

  .main-fab {
    display: block;
    position: fixed;
    bottom: 72px;
    right: 16px;
    border-radius: 100%;
    height: 60px;
    width: 60px;
    background-color: @attention-color;
    color: @attention-text-color;
    cursor: pointer;

    span {
      vertical-align: center;
      line-height: 60px;
      font-size: 28px;
      color: #ffffff;
    }

    input {
      display: none;
    }
  }

  form {
    height: 100%;
  }

  .spinner-green-only {
    border-color: @corporate-color !important;
  }

  .status-cow-slider {
    background-color: @corporate-color;
  }

  .order-area {
    padding-top: 16px;

    a {
      display: inline-block;

      span {
        display: inline-block;
        vertical-align: middle;
        color: @dark-corporate-color;
      }

      span.material-icons {
        font-size: 30px;
      }

      span.subhead {
        padding-left: 8px;
      }
    }
  }

  .status-slider-outer-corporate {

    .status-slider {
      border: 1px solid @corporate-color !important;

      .status-slider-inner {
        border: 1px solid @corporate-color !important;
        background-color: @corporate-color !important;
      }
    }

    .status-slider.available {
      border-color: @corporate-color !important;
    }

    .status-slider.loved {
      border-color: @corporate-color !important;
    }

    .status-slider.almost {
      border-color: #f44336 !important;
    }

    .status-slider.sold {
      border-color: #f44336 !important;
    }

    .status-slider-inner.available {
      background-color: @corporate-color !important;
      border-color: @corporate-color !important;
    }

    .status-slider-inner.loved {
      background-color: @corporate-color !important;
      border-color: @corporate-color !important;
    }

    .status-slider-inner.almost {
      background-color: #f44336 !important;
      border-color: #f44336 !important;
    }

    .status-slider-inner.sold {
      background-color: #f44336 !important;
      border-color: #f44336 !important;
    }

    .available {
      color: @corporate-color !important;
    }

    .loved {
      color: @dark-corporate-color !important;
    }

    .almost {
      color: #f44336 !important;
    }

    .sold {
      color: #f44336 !important;
    }
  }

  .is-empty-card {
    padding: 24px 16px;

    p {
      .small-fab-example {
        display: inline-block;
        border-radius: 100%;
        padding: 1px;
        height: 18px;
        width: 18px;
        background-color: @corporate-color;
        font-size: 16px;
        vertical-align: text-bottom;
      }
    }
  }

  @media @xs {
    .cms-content {
      padding: 0;
      padding-bottom: 56px;
    }
  }

  @media @sm {
    .cms-content {
      padding: 0;
      padding-bottom: 56px;
    }
  }

  @media @md {
    .cms-content {
      padding: 0;
      padding-bottom: 56px;
    }
  }
}

body {
  .system-popup {
    display: none;

    .clickable-layover {
      position: fixed;
      z-index: 35;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      overflow: auto;
      overflow-y: scroll;
    }

    .card {
      margin: 60px auto;
      border-radius: @basic-border-radius;
      width: 650px;

      .card-head {
        position: relative;
        border-bottom: 1px solid @dividers-color;
        padding: 16px;

        h3 {
          padding: 2px 0;
          line-height: 100%;
        }

        a.close {
          display: inline-block;
          position: absolute;
          right: 16px;
          top: 16px;
          height: 24px;
          width: 24px;
          color: @secondary-text-color;
        }
      }

      .card-body {
        padding: 16px 24px;
      }

      .card-footer {
        border-top: 1px solid @dividers-color;
        padding: 8px 8px;
      }
    }
  }

  .this-hint-text {
    padding: 0 24px;
    padding-bottom: 16px;
  }

  .this-hint-text.no-bottom-padding {
    padding-bottom: 0;
  }

  strong {
    color: inherit;
    font-size: inherit;
    font-weight: @bold;
  }

  .system-popup.active-popup {
    display: block;
  }

  .new-popup {
    .card {
      border-radius: @basic-border-radius !important;
      padding: 0;
      width: 350px !important;

      .popup-head {
        padding: 16px;
        padding-bottom: 8px;
      }

      .popup-content {
        padding: 8px 16px;
        padding-right: 0;

        .actions {
          padding-top: 8px;
          padding-right: 16px;
        }
      }

      .popup-footer {
        border-top: 1px solid @dividers-color;
        padding: 4px 0;
      }
    }
  }

  .active-nav-description {
    background-color: @corporate-color;
    color: #ffffff !important;
  }

  .nav-group-description:hover, .nav-group-description:focus, .nav-group-description:active {
    background-color: @corporate-color;
    color: #ffffff !important;
  }

  .input-field label {
    color: @secondary-text-color;
  }
  .input-field input[type=text]:focus + label {
    color: @corporate-color;
  }
  .input-field input[type=text]:focus {
    border-bottom: 1px solid @corporate-color;
    box-shadow: 0 1px 0 0 @corporate-color;
  }

  .input-field .prefix.active {
    color: @corporate-color;
  }

  .btn {
    background-color: @attention-color;
    color: @attention-text-color !important;
    font-weight: @medium !important;
    border-radius: @basic-border-radius;

    input {
      color: @white-text-color !important;
    }
  }

  .btn:hover {
    background-color: @attention-color;
    color: @attention-text-color !important;

    input {
      background-color: @attention-color;
      color: @attention-text-color !important;
    }
  }

  .btn-flat {
    color: @corporate-color;
  }

  .btn-flat:hover {

  }
}

body.has_bottom-navigation {
  padding-bottom: 80px;
}

body.modal-is-open {
  overflow: hidden;
}

body.has-main-navigation {
  padding-left: 300px;

  @media @xs {
    padding-left: 0;
  }

  @media @sm {
    padding-left: 0;
  }
}