/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

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

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

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

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

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

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

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

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

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

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

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

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

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

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

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

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

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

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

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

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

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

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

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

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

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

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

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

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

/**
 * Remove the inner border and padding in Firefox.
 */

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

/**
 * Restore the focus styles unset by the previous rule.
 */

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

/**
 * Correct the padding in Firefox.
 */

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

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

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

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

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

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

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

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

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

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

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

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}

/**
 * Manually forked from SUIT CSS Base: https://github.com/suitcss/base
 * A thin layer on top of normalize.css that provides a starting point more
 * suitable for web applications.
 */

/**
 * Removes the default spacing and border for appropriate elements.
 */


dl,
dd,
h1,
h2,
h3,
h4,
h5,
hr,
figure,
p,
pre {
  margin: 0;
}

button {
  background-color: transparent;
  background-image: none;
}

/**
 * Work around a Firefox/IE bug where the transparent `button` background
 * results in a loss of the default `button` focus styles.
 */

button:focus {
  outline: 1px dotted;
  outline: 5px auto -webkit-focus-ring-color;
}

fieldset {
  margin: 0;
  padding: 0;
}

ol,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/**
 * Tailwind custom reset styles
 */

/**
 * 1. Use the user's configured `sans` font-family (with Tailwind's default
 *    sans-serif font stack as a fallback) as a sane default.
 * 2. Use Tailwind's default "normal" line-height so the user isn't forced
 *    to override it to ensure consistency even when using the default theme.
 */

html {
  font-family: Roboto, sans-serif; /* 1 */
  line-height: 1.5; /* 2 */
}

/**
 * 1. Prevent padding and border from affecting element width.
 *
 *    We used to set this in the html element and inherit from
 *    the parent element for everything else. This caused issues
 *    in shadow-dom-enhanced elements like <details> where the content
 *    is wrapped by a div with box-sizing set to `content-box`.
 *
 *    https://github.com/mozdevs/cssremedy/issues/4
 *
 *
 * 2. Allow adding a border to an element by just adding a border-width.
 *
 *    By default, the way the browser specifies that an element should have no
 *    border is by setting it's border-style to `none` in the user-agent
 *    stylesheet.
 *
 *    In order to easily add borders to elements by just setting the `border-width`
 *    property, we change the default border-style for all elements to `solid`, and
 *    use border-width to hide them instead. This way our `border` utilities only
 *    need to set the `border-width` property instead of the entire `border`
 *    shorthand, making our border utilities much more straightforward to compose.
 *
 *    https://github.com/tailwindcss/tailwindcss/pull/116
 */

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: currentColor; /* 2 */
}

/*
 * Ensure horizontal rules are visible by default
 */

hr {
  border-top-width: 1px;
}

/**
 * Undo the `border-style: none` reset that Normalize applies to images so that
 * our `border-{width}` utilities have the expected effect.
 *
 * The Normalize reset is unnecessary for us since we default the border-width
 * to 0 on all elements.
 *
 * https://github.com/tailwindcss/tailwindcss/issues/362
 */

img {
  border-style: solid;
}

textarea {
  resize: vertical;
}

input::-moz-placeholder, textarea::-moz-placeholder {
  color: #a0aec0;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: #a0aec0;
}

input::placeholder,
textarea::placeholder {
  color: #a0aec0;
}

button,
[role="button"] {
  cursor: pointer;
}

table {
  border-collapse: collapse;
}

h1,
h2,
h3,
h4,
h5 {
  font-size: inherit;
  font-weight: inherit;
}

/**
 * Reset links to optimize for opt-in styling instead of
 * opt-out.
 */

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

/**
 * Reset form element properties that are easy to forget to
 * style explicitly so you don't inadvertently introduce
 * styles that deviate from your design system. These styles
 * supplement a partial reset that is already applied by
 * normalize.css.
 */

button,
input,
optgroup,
select,
textarea {
  padding: 0;
  line-height: inherit;
  color: inherit;
}

/**
 * Use the configured 'mono' font family for elements that
 * are expected to be rendered with a monospace font, falling
 * back to the system monospace stack if there is no configured
 * 'mono' font family.
 */

pre,
code,
kbd,
samp {
  font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

/**
 * Make replaced elements `display: block` by default as that's
 * the behavior you want almost all of the time. Inspired by
 * CSS Remedy, with `svg` added as well.
 *
 * https://github.com/mozdevs/cssremedy/issues/14
 */

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  vertical-align: middle;
}

/**
 * Constrain images and videos to the parent width and preserve
 * their instrinsic aspect ratio.
 *
 * https://github.com/mozdevs/cssremedy/issues/14
 */

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

.container {
  width: 100%;
}

@media (min-width: 640px) {
  .container {
    max-width: 640px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 768px;
  }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1024px;
  }
}

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

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

.bg-black {
  --bg-opacity: 1;
  background-color: #000000;
  background-color: rgba(0, 0, 0, var(--bg-opacity));
}

.bg-white {
  --bg-opacity: 1;
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, var(--bg-opacity));
}

.bg-red-500 {
  --bg-opacity: 1;
  background-color: #f56565;
  background-color: rgba(245, 101, 101, var(--bg-opacity));
}

.bg-green-500 {
  --bg-opacity: 1;
  background-color: #48bb78;
  background-color: rgba(72, 187, 120, var(--bg-opacity));
}

.bg-lionflence-blue {
  --bg-opacity: 1;
  background-color: #63bbce;
  background-color: rgba(99, 187, 206, var(--bg-opacity));
}

.bg-bg-1 {
  --bg-opacity: 1;
  background-color: #f8f8f8;
  background-color: rgba(248, 248, 248, var(--bg-opacity));
}

.bg-gray-100 {
  --bg-opacity: 1;
  background-color: #f8f8f8;
  background-color: rgba(248, 248, 248, var(--bg-opacity));
}

.bg-gray-400 {
  --bg-opacity: 1;
  background-color: #bebebe;
  background-color: rgba(190, 190, 190, var(--bg-opacity));
}

.bg-gray-800 {
  --bg-opacity: 1;
  background-color: #525252;
  background-color: rgba(82, 82, 82, var(--bg-opacity));
}

.bg-bg-2 {
  --bg-opacity: 1;
  background-color: #1d1d1d;
  background-color: rgba(29, 29, 29, var(--bg-opacity));
}

.bg-bg-3 {
  --bg-opacity: 1;
  background-color: #0f0f0f;
  background-color: rgba(15, 15, 15, var(--bg-opacity));
}

.bg-blue {
  --bg-opacity: 1;
  background-color: #4F83D0;
  background-color: rgba(79, 131, 208, var(--bg-opacity));
}

.bg-lionflence-black {
  --bg-opacity: 1;
  background-color: #1D1D1D;
  background-color: rgba(29, 29, 29, var(--bg-opacity));
}

.border-collapse {
  border-collapse: collapse;
}

.border-white {
  --border-opacity: 1;
  border-color: #ffffff;
  border-color: rgba(255, 255, 255, var(--border-opacity));
}

.border-red-500 {
  --border-opacity: 1;
  border-color: #f56565;
  border-color: rgba(245, 101, 101, var(--border-opacity));
}

.border-green-500 {
  --border-opacity: 1;
  border-color: #48bb78;
  border-color: rgba(72, 187, 120, var(--border-opacity));
}

.border-lionflence-blue {
  --border-opacity: 1;
  border-color: #63bbce;
  border-color: rgba(99, 187, 206, var(--border-opacity));
}

.border-gray-400 {
  --border-opacity: 1;
  border-color: #bebebe;
  border-color: rgba(190, 190, 190, var(--border-opacity));
}

.rounded-sm {
  border-radius: 0.125rem;
}

.rounded {
  border-radius: 0.25rem;
}

.rounded-full {
  border-radius: 9999px;
}

.border-solid {
  border-style: solid;
}

.border {
  border-width: 1px;
}

.border-l-2 {
  border-left-width: 2px;
}

.border-r {
  border-right-width: 1px;
}

.border-b {
  border-bottom-width: 1px;
}

.cursor-pointer {
  cursor: pointer;
}

.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.inline {
  display: inline;
}

.flex {
  display: flex;
}

.inline-flex {
  display: inline-flex;
}

.table {
  display: table;
}

.table-cell {
  display: table-cell;
}

.table-row-group {
  display: table-row-group;
}

.table-row {
  display: table-row;
}

.grid {
  display: grid;
}

.contents {
  display: contents;
}

.hidden {
  display: none;
}

.flex-row {
  flex-direction: row;
}

.flex-col {
  flex-direction: column;
}

.flex-wrap {
  flex-wrap: wrap;
}

.place-items-center {
  place-items: center;
}

.place-content-end {
  place-content: end;
}

.items-center {
  align-items: center;
}

.items-baseline {
  align-items: baseline;
}

.justify-items-auto {
  justify-items: auto;
}

.justify-items-center {
  justify-items: center;
}

.justify-end {
  justify-content: flex-end;
}

.justify-center {
  justify-content: center;
}

.flex-grow {
  flex-grow: 1;
}

.order-1 {
  order: 1;
}

.order-2 {
  order: 2;
}

.order-3 {
  order: 3;
}

.order-4 {
  order: 4;
}

.order-5 {
  order: 5;
}

.order-6 {
  order: 6;
}

.order-first {
  order: -9999;
}

.order-last {
  order: 9999;
}

.float-right {
  float: right;
}

.float-left {
  float: left;
}

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

.clear-both {
  clear: both;
}

.font-lionflence {
  font-family: Lionflence, sans-serif;
}

.font-normal {
  font-weight: 400;
}

.font-bold {
  font-weight: 700;
}

.h-3 {
  height: 0.75rem;
}

.h-4 {
  height: 1rem;
}

.h-6 {
  height: 1.5rem;
}

.h-8 {
  height: 2rem;
}

.h-10 {
  height: 2.5rem;
}

.h-20 {
  height: 5rem;
}

.h-96 {
  height: 24rem;
}

.h-full {
  height: 100%;
}

.text-xs {
  font-size: 0.75rem;
}

.text-sm {
  font-size: 0.875rem;
}

.text-lg {
  font-size: 1.125rem;
}

.text-xl {
  font-size: 1.25rem;
}

.text-2xl {
  font-size: 1.5rem;
}

.text-3xl {
  font-size: 1.875rem;
}

.text-4xl {
  font-size: 2.25rem;
}

.text-5xl {
  font-size: 3rem;
}

.leading-3 {
  line-height: .75rem;
}

.leading-6 {
  line-height: 1.5rem;
}

.leading-none {
  line-height: 1;
}

.m-6 {
  margin: 1.5rem;
}

.mx-1 {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}

.my-3 {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.my-5 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.my-8 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.-mx-1 {
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}

.-mx-2 {
  margin-left: -0.5rem;
  margin-right: -0.5rem;
}

.-mx-4 {
  margin-left: -1rem;
  margin-right: -1rem;
}

.mt-0 {
  margin-top: 0;
}

.ml-0 {
  margin-left: 0;
}

.mt-1 {
  margin-top: 0.25rem;
}

.mb-1 {
  margin-bottom: 0.25rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mr-2 {
  margin-right: 0.5rem;
}

.mb-2 {
  margin-bottom: 0.5rem;
}

.mt-3 {
  margin-top: 0.75rem;
}

.mr-3 {
  margin-right: 0.75rem;
}

.mb-3 {
  margin-bottom: 0.75rem;
}

.ml-3 {
  margin-left: 0.75rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mr-4 {
  margin-right: 1rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.ml-4 {
  margin-left: 1rem;
}

.mt-5 {
  margin-top: 1.25rem;
}

.mr-5 {
  margin-right: 1.25rem;
}

.mb-5 {
  margin-bottom: 1.25rem;
}

.mt-6 {
  margin-top: 1.5rem;
}

.mr-6 {
  margin-right: 1.5rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.mt-8 {
  margin-top: 2rem;
}

.mb-8 {
  margin-bottom: 2rem;
}

.mb-10 {
  margin-bottom: 2.5rem;
}

.mb-12 {
  margin-bottom: 3rem;
}

.mt-16 {
  margin-top: 4rem;
}

.mr-20 {
  margin-right: 5rem;
}

.mb-24 {
  margin-bottom: 6rem;
}

.ml-24 {
  margin-left: 6rem;
}

.-mt-16 {
  margin-top: -4rem;
}

.-mt-32 {
  margin-top: -8rem;
}

.min-h-screen {
  min-height: 100vh;
}

.overflow-hidden {
  overflow: hidden;
}

.p-0 {
  padding: 0;
}

.p-1 {
  padding: 0.25rem;
}

.p-2 {
  padding: 0.5rem;
}

.p-3 {
  padding: 0.75rem;
}

.p-4 {
  padding: 1rem;
}

.p-5 {
  padding: 1.25rem;
}

.p-6 {
  padding: 1.5rem;
}

.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.py-16 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.py-24 {
  padding-top: 6rem;
  padding-bottom: 6rem;
}

.py-32 {
  padding-top: 8rem;
  padding-bottom: 8rem;
}

.pl-0 {
  padding-left: 0;
}

.pt-1 {
  padding-top: 0.25rem;
}

.pb-1 {
  padding-bottom: 0.25rem;
}

.pt-2 {
  padding-top: 0.5rem;
}

.pr-2 {
  padding-right: 0.5rem;
}

.pb-2 {
  padding-bottom: 0.5rem;
}

.pl-2 {
  padding-left: 0.5rem;
}

.pt-3 {
  padding-top: 0.75rem;
}

.pb-3 {
  padding-bottom: 0.75rem;
}

.pt-4 {
  padding-top: 1rem;
}

.pr-4 {
  padding-right: 1rem;
}

.pb-4 {
  padding-bottom: 1rem;
}

.pl-4 {
  padding-left: 1rem;
}

.pt-5 {
  padding-top: 1.25rem;
}

.pr-5 {
  padding-right: 1.25rem;
}

.pb-5 {
  padding-bottom: 1.25rem;
}

.pt-6 {
  padding-top: 1.5rem;
}

.pb-6 {
  padding-bottom: 1.5rem;
}

.pt-8 {
  padding-top: 2rem;
}

.pr-8 {
  padding-right: 2rem;
}

.pb-8 {
  padding-bottom: 2rem;
}

.pl-8 {
  padding-left: 2rem;
}

.pt-10 {
  padding-top: 2.5rem;
}

.pr-10 {
  padding-right: 2.5rem;
}

.pb-10 {
  padding-bottom: 2.5rem;
}

.pl-10 {
  padding-left: 2.5rem;
}

.pt-12 {
  padding-top: 3rem;
}

.pr-12 {
  padding-right: 3rem;
}

.pl-12 {
  padding-left: 3rem;
}

.pt-16 {
  padding-top: 4rem;
}

.pb-16 {
  padding-bottom: 4rem;
}

.pl-16 {
  padding-left: 4rem;
}

.pb-20 {
  padding-bottom: 5rem;
}

.pt-32 {
  padding-top: 8rem;
}

.pr-32 {
  padding-right: 8rem;
}

.static {
  position: static;
}

.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.inset-0 {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.right-0 {
  right: 0;
}

.resize {
  resize: both;
}

.shadow-sm {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.shadow {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

.shadow-lg {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.fill-current {
  fill: currentColor;
}

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

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

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

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

.text-black {
  --text-opacity: 1;
  color: #000000;
  color: rgba(0, 0, 0, var(--text-opacity));
}

.text-white {
  --text-opacity: 1;
  color: #ffffff;
  color: rgba(255, 255, 255, var(--text-opacity));
}

.text-lionflence-blue {
  --text-opacity: 1;
  color: #63bbce;
  color: rgba(99, 187, 206, var(--text-opacity));
}

.text-gray-700 {
  --text-opacity: 1;
  color: #888;
  color: rgba(136, 136, 136, var(--text-opacity));
}

.text-gray-800 {
  --text-opacity: 1;
  color: #525252;
  color: rgba(82, 82, 82, var(--text-opacity));
}

.text-bg-2 {
  --text-opacity: 1;
  color: #1d1d1d;
  color: rgba(29, 29, 29, var(--text-opacity));
}

.text-pink {
  --text-opacity: 1;
  color: #F89DB3;
  color: rgba(248, 157, 179, var(--text-opacity));
}

.text-blue {
  --text-opacity: 1;
  color: #4F83D0;
  color: rgba(79, 131, 208, var(--text-opacity));
}

.text-lionflence-black {
  --text-opacity: 1;
  color: #1D1D1D;
  color: rgba(29, 29, 29, var(--text-opacity));
}

.uppercase {
  text-transform: uppercase;
}

.capitalize {
  text-transform: capitalize;
}

.underline {
  text-decoration: underline;
}

.subpixel-antialiased {
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}

.tracking-wider {
  letter-spacing: 0.05em;
}

.align-top {
  vertical-align: top;
}

.visible {
  visibility: visible;
}

.whitespace-normal {
  white-space: normal;
}

.break-all {
  word-break: break-all;
}

.w-4 {
  width: 1rem;
}

.w-6 {
  width: 1.5rem;
}

.w-20 {
  width: 5rem;
}

.w-24 {
  width: 6rem;
}

.w-32 {
  width: 8rem;
}

.w-64 {
  width: 16rem;
}

.w-auto {
  width: auto;
}

.w-1\/2 {
  width: 50%;
}

.w-1\/3 {
  width: 33.333333%;
}

.w-2\/3 {
  width: 66.666667%;
}

.w-1\/4 {
  width: 25%;
}

.w-3\/4 {
  width: 75%;
}

.w-1\/5 {
  width: 20%;
}

.w-2\/5 {
  width: 40%;
}

.w-4\/5 {
  width: 80%;
}

.w-5\/6 {
  width: 83.333333%;
}

.w-full {
  width: 100%;
}

.gap-0 {
  grid-gap: 0;
  gap: 0;
}

.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.col-auto {
  grid-column: auto;
}

.transform {
  --transform-translate-x: 0;
  --transform-translate-y: 0;
  --transform-rotate: 0;
  --transform-skew-x: 0;
  --transform-skew-y: 0;
  --transform-scale-x: 1;
  --transform-scale-y: 1;
  transform: translateX(var(--transform-translate-x)) translateY(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y));
}

.transition {
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
}

.ease-in {
  transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
}

.ease-out {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}

.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

@-webkit-keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes ping {
  75%, 100% {
    transform: scale(2);
    opacity: 0;
  }
}

@keyframes pulse {
  50% {
    opacity: .5;
  }
}

@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);
            animation-timing-function: cubic-bezier(0.8,0,1,1);
  }

  50% {
    transform: none;
    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);
            animation-timing-function: cubic-bezier(0,0,0.2,1);
  }
}

.glide__track{
  overflow:hidden
}

.glide__slides{
  position:relative;
  width:100%;
  list-style:none;
  -webkit-backface-visibility:hidden;
          backface-visibility:hidden;
  transform-style:preserve-3d;
  touch-action:pan-Y;
  overflow:hidden;
  padding:0;
  white-space:nowrap;
  display:flex;
  flex-wrap:nowrap;
  will-change:transform
}

.glide__slide{
  width:100%;
  height:100%;
  flex-shrink:0;
  white-space:normal;
  -webkit-user-select:none;
     -moz-user-select:none;
      -ms-user-select:none;
          user-select:none;
  -webkit-touch-callout:none;
  -webkit-tap-highlight-color:transparent
}

.glide__slide a{
  -webkit-user-select:none;
          user-select:none;
  -webkit-user-drag:none;
  -moz-user-select:none;
  -ms-user-select:none
}

.glide__arrows{
  -webkit-touch-callout:none;
  -webkit-user-select:none;
     -moz-user-select:none;
      -ms-user-select:none;
          user-select:none
}

.glide__bullets{
  -webkit-touch-callout:none;
  -webkit-user-select:none;
     -moz-user-select:none;
      -ms-user-select:none;
          user-select:none
}

html,body{
  width:100%;
  max-width:100%;
  overflow-x:hidden
}

body{
  font-size:16px;
  background:#fff
}

@font-face{
  font-family:Lionflence;

  font-display:swap;

  src:url(autofonts/LionflenceLogoFont-Regular.woff2!static),url(autofonts/LionflenceLogoFont-Regular.woff!static)
}

h1,.h1{
  font-size:3.5rem;
  font-weight:700
}

h2,.h2{
  font-size:2.125rem;
  font-weight:700
}

h3,.h3{
  font-size:1.875rem;
  font-weight:700
}

h4,.h4{
  font-size:1.375rem;
  font-weight:700
}

p{
  font-size:1rem
}

.container{
  width:1000px;
  max-width:100%;
  margin:0 auto
}

.container-small{
  width:800px;
  max-width:100%;
  margin:0 auto
}

a.link{
  --text-opacity: 1;
  color: #63bbce;
  color: rgba(99, 187, 206, var(--text-opacity))
}

.lists ul{
  list-style:disc;
  margin-left: 0.75rem
}

@media(max-width: 992px){
  h1,.h1{
    font-size:2rem
  }

  h2,.h2{
    font-size:1.5rem
  }

  h3,.h3{
    font-size:1.2rem
  }

  h4,.h4{
    font-size:1.05rem
  }
}

section:not(.below-footer) a{
  font-weight:bold;
  --text-opacity: 1;
  color: #63bbce;
  color: rgba(99, 187, 206, var(--text-opacity));
  text-decoration:underline
}

.darkmode--activated .isolate{
  mix-blend-mode:difference;
  -webkit-backface-visibility:visible;
  backface-visibility:visible;
  transform:translate3d(0, 0, 0)
}

.darkmode--activated img,.darkmode--activated video{
  filter:invert(1)
}

.darkmode--activated div:not(.expendable-cards) .bg-lionflence-blue{
  --bg-opacity: 1;
  background-color: #cf7763;
  background-color: rgba(207, 119, 99, var(--bg-opacity))
}

.darkmode--activated .text-lionflence-blue{
  --text-opacity: 1;
  color: #cf7763;
  color: rgba(207, 119, 99, var(--text-opacity))
}

.darkmode--activated .border-lionflence-blue{
  --border-opacity: 1;
  border-color: #cf7763;
  border-color: rgba(207, 119, 99, var(--border-opacity))
}

.darkmode--activated a.link{
  --text-opacity: 1;
  color: #cf7763;
  color: rgba(207, 119, 99, var(--text-opacity))
}

.darkmode--activated section:not(.below-footer) a{
  --text-opacity: 1;
  color: #cf7763;
  color: rgba(207, 119, 99, var(--text-opacity))
}

.darkmode-layer{
  z-index:1000
}

.text-0{
  font-size:0
}

.spin{
  -webkit-animation-name:spin;
          animation-name:spin;
  -webkit-animation-duration:2000ms;
          animation-duration:2000ms;
  -webkit-animation-iteration-count:infinite;
          animation-iteration-count:infinite;
  -webkit-animation-timing-function:linear;
          animation-timing-function:linear
}

@keyframes spin{
  from{
    transform:rotate(0deg)
  }

  to{
    transform:rotate(360deg)
  }
}

section:first-of-type{
  padding-top:0
}

section{
  position:relative;
  overflow:hidden;
  max-width:100%;
  width:100%;
  min-height:3.3rem
}

@media(min-width: 997px){
  section{
    min-height:6rem
  }
}

section[data-backdrop-text]{
  overflow:hidden
}

section *{
  position:relative;
  z-index:2
}

section .section-above-heading{
  font-size:1.2rem;
  font-weight:700;
  --text-opacity: 1;
  color: #63bbce;
  color: rgba(99, 187, 206, var(--text-opacity))
}

section[data-backdrop-text]::after{
  content:attr(data-backdrop-text);
  position:absolute;
  top:-3.5rem;
  left:0;
  width:120%;
  font-size:6rem;
  line-height:11rem;
  color:#fff;
  font-weight:700;
  z-index:1
}

section.backdrop-top[data-backdrop-text]::after{
  top:auto;
  bottom:-1.5rem;
  line-height:normal
}

@media(max-width: 992px){
  section.backdrop-top[data-backdrop-text]::after{
    bottom:1rem
  }
}

section.backdrop-color-bg-1[data-backdrop-text]::after{
  --text-opacity: 1;
  color: #f8f8f8;
  color: rgba(248, 248, 248, var(--text-opacity))
}

section.hero{
  padding:4rem 0 12rem 0
}

section.hero .about-us{
  padding:10px 0 50px 0
}

.darkmode--activated section .section-above-heading{
  --text-opacity: 1;
  color: #cf7763;
  color: rgba(207, 119, 99, var(--text-opacity))
}

.darkmode--activated section[data-backdrop-text]::after{
  color:#eaeaea
}

@media(max-width: 992px){
  section:first-of-type{
    padding-top:1rem
  }

  section[data-backdrop-text]::after{
    font-size:3.5rem;
    line-height:9rem
  }
}

section.kontakt-gray-bg-text[data-backdrop-text]::after{
  color:#f8f8f8
}

.media{
  position:relative
}

.media::after{
  display:block;
  content:"";
  width:100%
}

.media .overlay{
  position:absolute
}

.media .overlay.full{
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow:hidden
}

.media .overlay.top{
  top:0
}

.media .overlay.left{
  left:0
}

.media .overlay.right{
  right:0
}

.media .overlay.bottom{
  bottom:0
}

.media .overlay img,.media .overlay video{
  width:100%;
  height:100%;
  -o-object-fit:cover;
     object-fit:cover;
  -o-object-position:50% 50%;
     object-position:50% 50%;
  -webkit-border-radius:1px
}

.media .overlay img.contain,.media .overlay video.contain{
  -o-object-fit:contain;
     object-fit:contain;
  -webkit-border-radius:1px
}

.media.stylized::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:100%;
  height:100%;
  top:0;
  left:0;
  transform:translate(25px, 25px);
  --bg-opacity: 1;
  background-color: #63bbce;
  background-color: rgba(99, 187, 206, var(--bg-opacity))
}

.aspect-1-1::after{
  padding-top:100%
}

.aspect-10-14::after{
  padding-top:140%
}

.aspect-11-16::after{
  padding-top:145.4545454545%
}

.aspect-14-16::after{
  padding-top:114.2857142857%
}

.aspect-16-9::after{
  padding-top:56.25%
}

.aspect-16-10::after{
  padding-top:62.5%
}

.darkmode--activated .media.stylized::before{
  --bg-opacity: 1;
  background-color: #cf7763;
  background-color: rgba(207, 119, 99, var(--bg-opacity))
}

.more-info-block div.subcontent-accordion{
  width:88.2%
}

.more-info-block a{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:16px;
  line-height:19px;
  letter-spacing:.05em;
  font-variant:small-caps;
  color:#7d7d7d
}

.more-info-block .right-description p{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1rem;
  line-height:30px;
  color:#1d1d1d
}

.subcontent-accordion{
  border-bottom:1px solid #7d7d7d;
  position: relative;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  padding-left: 1rem;
  padding-right: 1rem;
  cursor: pointer
}

.subcontent-accordion .minus,.subcontent-accordion .plus{
  position: absolute;
  right: 0;
  margin-right: 1rem;
  top:50%;
  transform:translate(0, -50%)
}

.subcontent-accordion .minus{
  display:none
}

.subcontent-accordion.opened .plus{
  display:none
}

.subcontent-accordion.opened .minus{
  display:block
}

.mobile-accordion .label{
  display:block;
  position:relative;
  margin-bottom:0 !important;
  padding-left: 1rem;
  padding-right: 1rem;
  --bg-opacity: 1;
  background-color: #1D1D1D;
  background-color: rgba(29, 29, 29, var(--bg-opacity));
  --text-opacity: 1;
  color: #ffffff;
  color: rgba(255, 255, 255, var(--text-opacity))
}

.mobile-accordion .label span{
  padding-left:1rem;
  padding-right:1.3rem;
  padding-top: 2rem;
  padding-bottom: 2rem;
  display: block;
  border-bottom-width: 1px;
  --border-opacity: 1;
  border-color: #888;
  border-color: rgba(136, 136, 136, var(--border-opacity))
}

.mobile-accordion .label .toggler{
  --text-opacity: 1;
  color: #bebebe;
  color: rgba(190, 190, 190, var(--text-opacity));
  position: absolute;
  margin-right: 1.25rem;
  font-size: 1.125rem;
  top:50%;
  right:0;
  transform:translate(0, -50%) rotate(0deg);
  transition:transform .4s
}

.mobile-accordion.opened .label .toggler{
  transform:translate(0, -50%) rotate(180deg)
}

.mobile-accordion.opened .content{
  max-height:9999px
}

.mobile-accordion .content{
  max-height:0;
  overflow:hidden;
  transition:max-height .4s
}

@media(min-width: 992px){
  .mobile-accordion .label{
    display:none !important
  }

  .mobile-accordion .content{
    max-height:none !important
  }
}

nav.navbar{
  position:fixed;
  width:100%;
  top:0;
  left:0;
  z-index:99;
  padding-left: 2.5rem;
  padding-right: 2.5rem;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  display:flex;
  transition:.3s;
  max-height:11.4375rem;
  opacity:1
}

nav.navbar .nav-section{
  flex:1 1 0;
  height:3rem;
  line-height:1rem;
  margin-left:auto
}

nav.navbar .brand{
  font-size:2rem;
  line-height:3rem;
  padding:.25rem 0;
  font-family: Lionflence, sans-serif
}

nav.navbar ul.navigation-entries{
  list-style:none;
  padding:0;
  margin:0;
  text-align:right
}

nav.navbar ul.navigation-entries li{
  display:inline-block
}

nav.navbar ul.navigation-entries li a{
  display:block;
  font-size:1.05rem;
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:1rem
}

nav.navbar ul.navigation-entries li a:hover hr{
  display:block
}

nav.navbar ul.navigation-entries li a hr{
  border-color:#63bbce;
  background:#63bbce;
  border-style:solid;
  border-width:2px;
  display:none
}

nav.navbar .menu-toggle{
  vertical-align:top
}

nav.navbar .menu-toggle svg{
  display:inline-block;
  --bg-opacity: 1;
  background-color: #f8f8f8;
  background-color: rgba(248, 248, 248, var(--bg-opacity))
}

nav.navbar #burger-top,nav.navbar #burger-middle,nav.navbar #burger-bottom{
  transition:.4s
}

nav.navbar #burger-top{
  transform:rotate(0deg) translate(0, 0);
  transform-origin:50% 50%
}

nav.navbar #burger-middle{
  opacity:1;
  transform:translateX(0)
}

nav.navbar #burger-bottom{
  transform:rotate(0deg) translate(0, 0);
  transform-origin:50% 50%;
  transition:.4s
}

.offcanvas-menu .bottom-links{
  position:absolute;
  bottom:5vh;
  width:80vw;
  left:0;
  padding-left: 1.25rem;
  padding-right: 1.25rem
}

.offcanvas-menu .bottom-links a{
  display:block;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-weight:300;
  font-size:1.2rem
}

.offcanvas-menu .darkmode-toggler{
  bottom:1rem;
  right:1rem;
  position:absolute;
  font-size:2rem
}

.nav-offcanvas-content{
  width:100%;
  position:relative;
  z-index:10;
  padding-top:5rem
}

.nav-offcanvas-content[data-backdrop-text]{
  overflow:hidden
}

.nav-offcanvas-content[data-backdrop-text]::after{
  top:6%;
  left:6%;
  content:attr(data-backdrop-text);
  --text-opacity: 1;
  color: #f8f8f8;
  color: rgba(248, 248, 248, var(--text-opacity));
  font-size:5rem;
  font-weight:700;
  z-index:-1;
  position:absolute
}

.nav-offcanvas-content ul{
  position:absolute;
  top:50vh;
  left:0;
  width:80vw;
  transform:translate(0, -50%);
  list-style:none
}

.nav-offcanvas-content ul li:not(.unstyled){
  display:block
}

.nav-offcanvas-content ul li:not(.unstyled) a{
  position:relative;
  display:block;
  text-align:left;
  font-size:1.4rem;
  font-weight:700;
  padding-left: 1.25rem;
  padding-right: 2rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  margin-bottom: 0.25rem
}

.nav-offcanvas-content ul li:not(.unstyled) a .iconify{
  position:absolute;
  right:1rem;
  top:50%;
  transform:translate(0, -50%) !important;
  font-size:1.7rem
}

.nav-header-expandablecards{
  padding-bottom:.8vh;
  isolation:isolate
}

.nav-header-expandablecards .navigation{
  max-height:11.4375rem
}

.nav-header-expandablecards .brand{
  display:inline-flex
}

@media(max-width: 992px){
  .brand{
    font-size:2rem !important;
    font-style:normal;
    font-weight:normal;
    line-height:1.5625rem
  }

  .brand{
    display:inline-flex
  }

  nav.navbar{
    padding-top:.9375rem;
    padding-left:1.375rem;
    padding-right:1.375rem;
    background:#fff;
    box-shadow:0px 4px 4px rgba(51,51,51,.05)
  }

  nav.navbar .brand{
    padding:0px
  }

  nav.navbar .logo-brand{
    padding-left:25%
  }

  .mobile-login{
    position:absolute;
    right:2.5rem;
    top:50%;
    transform:translate(0, -50%);
    font-size:2rem
  }

  .mobile-darkmode-toggle{
    position:absolute;
    right:0px;
    top:50%;
    transform:translate(0, -50%);
    font-size:2rem;
    padding-top:.3125rem
  }

  .nav-section{
    position:relative
  }

  .nav-section .menu-toggle{
    position:absolute;
    top:50%;
    transform:translate(0, -50%)
  }

  .menu-open .navigation{
    transform:translate(80%, 0);
    position:relative;
    z-index:1
  }
}

@media(min-width: 993px){
  nav.navbar .logo-brand{
    padding-left:4rem
  }
}

.darkmode--activated nav.navbar ul.navigation-entries li a hr{
  --border-opacity: 1;
  border-color: #cf7763;
  border-color: rgba(207, 119, 99, var(--border-opacity))
}

.btn{
  padding:.5rem .75rem;
  text-transform:uppercase;
  font-weight:700;
  font-size:.85rem;
  display:inline-block;
  cursor:pointer;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)
}

.btn.btn-lg{
  padding:.65rem 1.85rem;
  font-size:1rem
}

.btn.btn-block{
  display:block;
  width:100%;
  text-align:center
}

.btn.btn-black{
  --bg-opacity: 1;
  background-color: #0f0f0f;
  background-color: rgba(15, 15, 15, var(--bg-opacity));
  --text-opacity: 1;
  color: #ffffff;
  color: rgba(255, 255, 255, var(--text-opacity))
}

.btn.btn-black.btn-outline{
  background:transparent;
  border-width: 1px;
  --border-opacity: 1;
  border-color: #0f0f0f;
  border-color: rgba(15, 15, 15, var(--border-opacity));
  --text-opacity: 1;
  color: #0f0f0f;
  color: rgba(15, 15, 15, var(--text-opacity))
}

.btn.btn-blue{
  --bg-opacity: 1;
  background-color: #63bbce;
  background-color: rgba(99, 187, 206, var(--bg-opacity));
  --text-opacity: 1;
  color: #ffffff;
  color: rgba(255, 255, 255, var(--text-opacity))
}

.btn.btn-blue.btn-outline{
  background:transparent;
  border-width: 1px;
  --border-opacity: 1;
  border-color: #63bbce;
  border-color: rgba(99, 187, 206, var(--border-opacity));
  --text-opacity: 1;
  color: #63bbce;
  color: rgba(99, 187, 206, var(--text-opacity))
}

.btn.btn-white{
  --bg-opacity: 1;
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, var(--bg-opacity));
  --text-opacity: 1;
  color: #0f0f0f;
  color: rgba(15, 15, 15, var(--text-opacity))
}

.btn.btn-white.btn-outline{
  background:transparent;
  border-width: 1px;
  --border-opacity: 1;
  border-color: #ffffff;
  border-color: rgba(255, 255, 255, var(--border-opacity));
  --text-opacity: 1;
  color: #ffffff;
  color: rgba(255, 255, 255, var(--text-opacity))
}

.btn.btn-red{
  --bg-opacity: 1;
  background-color: #f56565;
  background-color: rgba(245, 101, 101, var(--bg-opacity));
  --text-opacity: 1;
  color: #ffffff;
  color: rgba(255, 255, 255, var(--text-opacity))
}

.btn.btn-red.btn-outline{
  background:transparent;
  border-width: 1px;
  --border-opacity: 1;
  border-color: #f56565;
  border-color: rgba(245, 101, 101, var(--border-opacity));
  --text-opacity: 1;
  color: #f56565;
  color: rgba(245, 101, 101, var(--text-opacity))
}

.darkmode--activated .btn.btn-blue:not(.noinvert){
  --bg-opacity: 1;
  background-color: #cf7763;
  background-color: rgba(207, 119, 99, var(--bg-opacity));
  color:#000
}

.darkmode--activated .btn.btn-white:not(.noinvert).btn-white{
  --bg-opacity: 1;
  background-color: #000000;
  background-color: rgba(0, 0, 0, var(--bg-opacity));
  --text-opacity: 1;
  color: #f8f8f8;
  color: rgba(248, 248, 248, var(--text-opacity))
}

.darkmode--activated .btn.btn-white:not(.noinvert).btn-white.btn-outline{
  background:transparent;
  border-width: 1px;
  --border-opacity: 1;
  border-color: #000000;
  border-color: rgba(0, 0, 0, var(--border-opacity));
  --text-opacity: 1;
  color: #000000;
  color: rgba(0, 0, 0, var(--text-opacity))
}

.darkmode--activated.btn-black:not(.noinvert){
  --bg-opacity: 1;
  background-color: #f8f8f8;
  background-color: rgba(248, 248, 248, var(--bg-opacity));
  --text-opacity: 1;
  color: #000000;
  color: rgba(0, 0, 0, var(--text-opacity))
}

.darkmode--activated.btn-black:not(.noinvert).btn-outline{
  background:transparent;
  border-width: 1px;
  --border-opacity: 1;
  border-color: #f8f8f8;
  border-color: rgba(248, 248, 248, var(--border-opacity));
  --text-opacity: 1;
  color: #f8f8f8;
  color: rgba(248, 248, 248, var(--text-opacity))
}

@media(min-width: 993px){
  .expendable-cards{
    padding-top:23vh
  }

  .expendable-cards .card-description{
    display:none
  }

  .expendable-cards .card{
    min-width:28vh;
    min-height:47vh;
    transition:box-shadow .3s
  }

  .expendable-cards .card .card-title{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:2.25rem;
    line-height:1.875rem
  }

  .expendable-cards .card:hover{
    box-shadow:0 0 1100px #fff;
    border:12px solid inherit
  }

  .expendable-cards .card:hover .card-description{
    display:block;
    padding:0 2.0625rem 0 2.0625rem;
    margin-top:1.875rem
  }

  .expendable-cards .card:hover .card-description p{
    padding-bottom:1.875rem;
    font-family:Roboto;
    font-style:normal;
    font-weight:normal;
    font-size:1rem;
    line-height:1.3125rem
  }

  .expendable-cards .card:hover .card-description a{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:.875rem;
    line-height:1rem;
    text-align:center;
    letter-spacing:.2em
  }

  .expendable-cards .card:hover .card-description hr{
    border-width:2px;
    border-color:inherit;
    border-style:solid;
    margin-right:.1875rem;
    background:inherit
  }

  .expendable-cards .card:hover .card-description .btn{
    box-shadow:0 0 0;
    padding:0
  }

  .expendable-cards .card.card-blue{
    --bg-opacity: 1;
    background-color: #63bbce;
    background-color: rgba(99, 187, 206, var(--bg-opacity));
    --text-opacity: 1;
    color: #ffffff;
    color: rgba(255, 255, 255, var(--text-opacity))
  }

  .header-expandablecards{
    margin:0 6.5625rem 6.5625rem 6.5625rem
  }
}

@media(max-width: 992px){
  .expendable-cards{
    display:block
  }

  .expendable-cards .card{
    --w: 0;
    transition:.6s;
    width:25%;
    float:left;
    position:relative
  }

  .expendable-cards .card:nth-of-type(4){
    clear:both
  }

  .expendable-cards .card.card-blue{
    --bg-opacity: 1;
    background-color: #63bbce;
    background-color: rgba(99, 187, 206, var(--bg-opacity));
    --text-opacity: 1;
    color: #ffffff;
    color: rgba(255, 255, 255, var(--text-opacity))
  }

  .expendable-cards .card::after{
    content:"";
    display:block;
    width:100%;
    padding-top:25vw
  }

  .expendable-cards .card .card-content{
    position:absolute;
    top:10vw;
    left:50%;
    transform:translate(-50%, 0%);
    transition:.6s
  }

  .expendable-cards .card .card-content .card-title{
    display:block;
    font-size:2rem;
    font-weight:700;
    transition:.6s
  }

  .expendable-cards .card .card-content .card-description-wrapper{
    max-width:var(--w);
    max-height:0;
    overflow:hidden;
    transition:max-width .6s,opacity .6s;
    opacity:0
  }

  .expendable-cards .card .card-content .card-description-wrapper .card-description{
    width:45vw
  }

  .expendable-cards .card .card-content .card-description-wrapper .card-description{
    display:block;
    padding:0 2.0625rem 0 2.0625rem;
    margin-top:1.875rem
  }

  .expendable-cards .card .card-content .card-description-wrapper .card-description p{
    padding-bottom:1.875rem;
    font-family:Roboto;
    font-style:normal;
    font-weight:normal;
    font-size:1rem;
    line-height:1.3125rem
  }

  .expendable-cards .card .card-content .card-description-wrapper .card-description a{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:.875rem;
    line-height:1rem;
    text-align:center;
    letter-spacing:.2em
  }

  .expendable-cards .card .card-content .card-description-wrapper .card-description hr{
    border-width:2px;
    border-color:inherit;
    border-style:solid;
    margin-right:.1875rem;
    background:inherit
  }

  .expendable-cards .card .card-content .card-description-wrapper .card-description .btn{
    box-shadow:0 0 0;
    padding:0
  }

  .expendable-cards::after{
    content:"";
    display:block;
    clear:both
  }

  .expendable-cards .card{
    width:100%
  }

  .expendable-cards .card:nth-of-type(4){
    clear:none
  }

  .expendable-cards .card.selected{
    width:100%;
    min-height:300px
  }

  .expendable-cards .card.selected .card-content .card-description-wrapper{
    max-width:90vw;
    min-height:15.625rem;
    opacity:1
  }

  .expendable-cards .card .card-content{
    top:50%;
    left:50%;
    transform:translate(-50%, -50%)
  }

  .expendable-cards .card .card-content .card-description-wrapper .card-description{
    width:90vw
  }

  .expendable-cards .card .card-content .card-title{
    font-size:1.7rem;
    white-space:nowrap
  }

  .expendable-cards .card::after{
    padding-top:35vw;
    transition:padding-top .4s
  }

  .expendable-cards .card.selected::after{
    padding-top:70vw
  }
}

.darkmode--activated .card.card-blue{
  --bg-opacity: 1;
  background-color: #cf7763;
  background-color: rgba(207, 119, 99, var(--bg-opacity));
  --text-opacity: 1;
  color: #000000;
  color: rgba(0, 0, 0, var(--text-opacity))
}

.grid-sizer,.item{
  width:25%;
  padding:.5rem
}

.our-artists{
  padding:1rem 6.625rem 3rem 6.625rem
}

.our-artists .btn{
  text-decoration:none
}

.our-artists h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:1.875rem;
  line-height:1.875rem
}

.our-artists p{
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:1rem;
  line-height:1.5rem
}

.our-artists a{
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:1rem;
  line-height:1.1875rem;
  letter-spacing:.2em;
  text-transform:uppercase
}

.isotope{
  display:block;
  width:100%
}

.isotope .item .isotope-influencer{
  position:relative
}

.isotope .item .isotope-influencer .content-wrapper{
  position:absolute;
  left:0;
  right:0;
  top:50%;
  transform:translate(0, -50%)
}

.isotope .item .isotope-influencer::after{
  content:"";
  display:block;
  width:100%;
  padding-top:100%
}

.isotope .item .isotope-influencer img{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  -o-object-fit:cover;
     object-fit:cover
}

.isotope .item .isotope-influencer .influencer-name{
  padding:.75rem 1rem;
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:14px;
  line-height:30px;
  letter-spacing:.04em;
  color:#fff;
  font-weight:700;
  text-transform:uppercase;
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  background:rgba(99,187,206,.9)
}

.isotope .item .isotope-influencer .content{
  display:none;
  position:absolute;
  --bg-opacity: 1;
  background-color: #63bbce;
  background-color: rgba(99, 187, 206, var(--bg-opacity));
  color:#fff;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow:auto
}

.isotope .item .isotope-influencer .content .artist-1,.isotope .item .isotope-influencer .content .artist-3,.isotope .item .isotope-influencer .content .artist-7,.isotope .item .isotope-influencer .content .artist-8{
  height:auto
}

.isotope .item .isotope-influencer .content .btn{
  box-shadow:0 0 0
}

.isotope .item .isotope-influencer .content .btn.btn-white.btn-outline{
  border:none;
  color:#fff
}

.isotope .item .isotope-influencer .content hr{
  border-width:3px;
  border-style:solid;
  border-color:inherit;
  background:inherit
}

.isotope .item .isotope-influencer:hover .content{
  display:block
}

.isotope .item .isotope-influencer:hover .influencer-name{
  background:#63bbce
}

.isotope .item:nth-child(3) .isotope-influencer::after,.isotope .item:nth-child(5) .isotope-influencer::after,.isotope .item:nth-child(6) .isotope-influencer::after,.isotope .item:nth-child(7) .isotope-influencer::after{
  padding-top:200% !important
}

.darkmode--activated .isotope .item .isotope-influencer .influencer-name{
  background:rgba(207,119,99,.72) !important;
  color:#000 !important
}

.darkmode--activated .isotope .item .isotope-influencer .content{
  --bg-opacity: 1;
  background-color: #cf7763;
  background-color: rgba(207, 119, 99, var(--bg-opacity));
  color:#000
}

@media(max-width: 992px){
  .isotope{
    min-height:34.375rem
  }

  .isotope .artist-2,.isotope .artist-3{
    height:17.89125rem
  }

  .isotope .artist-1,.isotope .artist-4{
    height:13.398125rem
  }

  .isotope .grid-sizer,.isotope .item{
    width:50%;
    padding:.25rem
  }

  .our-artists{
    padding:0 4% 0 4%
  }
}

.testimonial{
  background:#fff;
  padding:1rem;
  width:80%;
  height:100%;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05)
}

@media(max-width: 992px){
  .testimonial{
    width:100%
  }
}

#testimonials{
  position:relative
}

.glide__slide{
  height:auto !important
}

.glide__bullets{
  width:70%;
  max-width:400px;
  margin:1.5rem auto;
  display:flex;
  background:#fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05)
}

.glide__bullets .glide__bullet{
  outline:none;
  flex:1 1 0;
  height:.75rem;
  isolation:isolate
}

.glide__arrows{
  position:absolute;
  width:100%;
  left:0;
  top:50%;
  transform:translate(0, -50%)
}

.glide__arrows .glide__arrow{
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  --bg-opacity: 1;
  background-color: #63bbce;
  background-color: rgba(99, 187, 206, var(--bg-opacity));
  color:#fff
}

.glide__arrows .glide__arrow.glide__arrow--left{
  float:left
}

.glide__arrows .glide__arrow.glide__arrow--right{
  float:right
}

.darkmode--activated .glide__arrows .glide__arrow{
  color:#000;
  --bg-opacity: 1;
  background-color: #cf7763;
  background-color: rgba(207, 119, 99, var(--bg-opacity))
}

.offcanvas-menu{
  position:fixed;
  top:0;
  bottom:0;
  width:80%;
  max-width:400px;
  min-height:100vh;
  overflow:hidden;
  transition:.4s;
  -webkit-overflow-scrolling:touch;
  z-index:999;
  transform:translate(-100%, 0);
  background-color:#fff;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)
}

.offcanvas-menu ul{
  position:fixed
}

.menu-open .offcanvas-menu{
  transform:translate(0, 0)
}

main{
  transition:.4s
}

.menu-open main{
  transform:translate(80%, 0)
}

footer{
  isolation:isolate;
  min-height:18.125rem
}

footer .main-footer{
  min-height:18.125rem;
  padding:0 7.875rem 0 7.875rem
}

footer .main-footer .lionflence-logo{
  width:4.875rem;
  height:4.6875rem;
  display:inline-block
}

footer .main-footer h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:.875rem;
  line-height:1.875rem;
  color:#fff
}

footer .main-footer p{
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:.875rem;
  line-height:1.5rem;
  color:#fff
}

section.below-footer a{
  font-weight:700;
  text-decoration:underline;
  display:inline-block;
  margin:.5rem .75rem
}

.darkmode--activated footer .lionflence-logo{
  filter:invert(1)
}

@media(min-width: 997px){
  .footer-block{
    position:absolute;
    display:inline-block;
    left:50%;
    transform:translate(-50%, 0);
    white-space:nowrap
  }

  footer .main-footer .logo{
    padding-top:6.25rem
  }

  footer .main-footer .logo a{
    font-style:normal;
    font-weight:normal;
    line-height:.875rem;
    font-size:1.375rem;
    font-family:Lionflence,sans-serif;
    color:#fff
  }
}

@media(max-width: 996px){
  footer .main-footer{
    padding:1.625rem 0 1.625rem 3rem
  }

  footer .main-footer .lionflence-logo{
    width:2.5rem;
    height:2.4375rem
  }

  footer .main-footer .envelop-icon,footer .main-footer call-icon{
    width:1rem;
    height:1.25rem
  }

  footer .main-footer .social a{
    padding:0 3% 0 0
  }

  footer .main-footer .logo{
    padding-right:15%
  }

  footer .main-footer .logo a{
    font-style:normal;
    font-weight:normal;
    line-height:.875rem;
    font-size:1.125rem;
    font-family:Lionflence,sans-serif;
    color:#fff
  }
}

.modal-wrapper{
  position:fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background:rgba(0,0,0,.4);
  z-index:999;
  display:none;
  background:#1d1d1d
}

.modal-wrapper.visible{
  display:block
}

.modal-wrapper .modal-container{
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  background:#fff;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  width:50%;
  max-width:640px
}

.modal-wrapper .modal-container[data-backdrop-text]::after{
  position:absolute;
  content:attr(data-backdrop-text);
  font-size:4rem;
  --text-opacity: 1;
  color: #f8f8f8;
  color: rgba(248, 248, 248, var(--text-opacity));
  top:60%;
  left:10%;
  z-index:-1;
  font-weight:700
}

.modal-wrapper .modal-container.modal-sm{
  max-width:25.5625rem;
  max-height:30.9375rem
}

.modal-wrapper .modal-container .modal-close{
  position:absolute;
  top:0rem;
  right:1rem;
  font-weight:300;
  font-size:2.5rem;
  line-height:2.2rem;
  cursor:pointer;
  z-index:2;
  color:#000
}

.modal-wrapper .modal-container .modal-close:hover{
  --text-opacity: 1;
  color: #63bbce;
  color: rgba(99, 187, 206, var(--text-opacity))
}

.modal-wrapper .modal-container .tabs a{
  border-bottom:4px solid #63bbce
}

.modal-wrapper .modal-container .tabs a:not(.active){
  border-bottom:4px solid #f8f8f8
}

.modal-wrapper .modal-container a.lost-password{
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:.875rem;
  line-height:1rem;
  letter-spacing:.05em;
  color:#63bbce
}

.modal-wrapper .modal-container .header{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1.5625rem;
  line-height:1.8125rem;
  color:#000
}

.modal-wrapper .modal-container .infuencer,.modal-wrapper .modal-container .unternehmen{
  font-family:Roboto;
  font-style:normal;
  font-weight:500;
  font-size:.875rem;
  line-height:1rem;
  letter-spacing:.05em;
  color:#000
}

.modal-wrapper .modal-container .form-container{
  width:inherit;
  padding:0 13% 5% 13%
}

.modal-wrapper .modal-container .form-container form .register,.modal-wrapper .modal-container .form-container form .custom-checkbox{
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:.75rem;
  line-height:.875rem;
  color:#000
}

.modal-wrapper .modal-container .form-container form button{
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:.875rem;
  line-height:1rem;
  text-align:center;
  color:#fff;
  height:3.5rem
}

.modal-wrapper .modal-container .form-container form button:hover{
  width:101%;
  height:4.125rem;
  background:#1d1d1d;
  box-shadow:0px 5.27742px 5.27742px rgba(0,0,0,.05)
}

.modal-wrapper .modal-container .form-container form input{
  border:1px solid #1d1d1d;
  box-sizing:border-box;
  height:3.5rem;
  background:#fff
}

.modal-wrapper .modal-container .form-container form input:focus{
  background-color:#fff
}

.modal-wrapper .modal-container .form-container form label:not(.custom-checkbox){
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:.875rem;
  line-height:1rem;
  letter-spacing:.05em;
  color:#1d1d1d;
  opacity:.5
}

@media(max-width: 992px){
  .modal-wrapper .modal-container{
    width:90%
  }
}

.darkmode--activated .modal-container{
  background:#fff;
  color:#fff
}

.darkmode--activated .modal-container label{
  color:#fff
}

.darkmode--activated .modal-container input{
  --bg-opacity: 1;
  background-color: #1d1d1d;
  background-color: rgba(29, 29, 29, var(--bg-opacity))
}

.darkmode--activated .modal-container[data-backdrop-text]::after{
  color:#fff
}

ul.tabs{
  display:block;
  list-style:none
}

ul.tabs li{
  display:inline-block;
  padding:0 .25rem;
  margin:0 1rem
}

ul.tabs li:first-of-type{
  margin-left:0;
  padding-left:0
}

ul.tabs li a{
  display:block;
  padding:.5rem 0 .25rem 0
}

ul.tabs li a.active{
  border-bottom:3px solid;
  font-weight:700;
  --border-opacity: 1;
  border-color: #63bbce;
  border-color: rgba(99, 187, 206, var(--border-opacity))
}

.tab-content{
  display:none
}

.tab-content.active{
  display:block
}

.darkmode--activated ul.tabs li a.active{
  --border-opacity: 1;
  border-color: #cf7763;
  border-color: rgba(207, 119, 99, var(--border-opacity))
}

.darkmode--activated a.link{
  padding-bottom:25%
}

input[type=text],input[type=password],input[type=number],input[type=email]{
  height:2.25rem;
  border:0;
  width:100%;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --bg-opacity: 1;
  background-color: #f8f8f8;
  background-color: rgba(248, 248, 248, var(--bg-opacity));
  padding:0 .5rem 0 1rem;
  outline:none;
  --text-opacity: 1;
  color: #1d1d1d;
  color: rgba(29, 29, 29, var(--text-opacity))
}

input[type=text]::-moz-placeholder, input[type=password]::-moz-placeholder, input[type=number]::-moz-placeholder, input[type=email]::-moz-placeholder{
  font-weight:300;
  color:#888
}

input[type=text]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder, input[type=number]:-ms-input-placeholder, input[type=email]:-ms-input-placeholder{
  font-weight:300;
  color:#888
}

input[type=text]::placeholder,input[type=password]::placeholder,input[type=number]::placeholder,input[type=email]::placeholder{
  font-weight:300;
  color:#888
}

textarea{
  border:0;
  width:100%;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --bg-opacity: 1;
  background-color: #f8f8f8;
  background-color: rgba(248, 248, 248, var(--bg-opacity));
  padding:.5rem .5rem 0 1rem;
  outline:none;
  --text-opacity: 1;
  color: #1d1d1d;
  color: rgba(29, 29, 29, var(--text-opacity));
  resize:vertical
}

textarea::-moz-placeholder{
  font-weight:300;
  color:#888
}

textarea:-ms-input-placeholder{
  font-weight:300;
  color:#888
}

textarea::placeholder{
  font-weight:300;
  color:#888
}

label,.label{
  font-weight:300;
  --text-opacity: 1;
  color: #0f0f0f;
  color: rgba(15, 15, 15, var(--text-opacity));
  font-size:.85rem;
  display:block;
  margin-bottom:.35rem
}

.custom-checkbox{
  display:inline-block;
  cursor:pointer
}

.custom-checkbox input[type=checkbox]{
  display:none
}

.custom-checkbox span{
  padding-left:1.5rem;
  display:block;
  position:relative
}

.custom-checkbox span::before{
  position:absolute;
  left:0;
  top:50%;
  width:1rem;
  height:1rem;
  content:"";
  transform:translate(0, -50%);
  border-width: 1px;
  --border-opacity: 1;
  border-color: #1d1d1d;
  border-color: rgba(29, 29, 29, var(--border-opacity))
}

.custom-checkbox span a{
  color:#0b58a2;
  text-decoration:underline
}

.custom-checkbox input[type=checkbox]:checked+span::before{
  --bg-opacity: 1;
  background-color: #48bb78;
  background-color: rgba(72, 187, 120, var(--bg-opacity))
}

.custom-checkbox input[type=checkbox]:checked+span::after{
  position:absolute;
  left:0;
  top:50%;
  width:1rem;
  height:1rem;
  content:"";
  transform:translate(0, -50%);
  z-index:2;
  background-image:url("data:image/gif;base64,R0lGODlhCwAKAIABAP////3cnSH5BAEKAAEALAAAAAALAAoAAAIUjH+AC73WHIsw0UCjglraO20PNhYAOw==");
  background-repeat:no-repeat;
  background-size:80%;
  background-position:center center;
  border-width: 1px;
  --border-opacity: 1;
  border-color: #48bb78;
  border-color: rgba(72, 187, 120, var(--border-opacity))
}

.inline-form label,.inline-form .label{
  height:2.25rem;
  line-height:2.25rem;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis
}

.darkmode--activated .custom-checkbox span a{
  color:#a1530b
}

.darkmode--activated input[type=text],.darkmode--activated input[type=password],.darkmode--activated input[type=number],.darkmode--activated input[type=email],.darkmode--activated textarea{
  background:#ddd;
  color:#000
}

.dropdown{
  display:block;
  width:100%
}

.dropdown button.current-value{
  outline:none;
  width:100%;
  --bg-opacity: 1;
  background-color: #ddd;
  background-color: rgba(221, 221, 221, var(--bg-opacity));
  --text-opacity: 1;
  color: #888;
  color: rgba(136, 136, 136, var(--text-opacity));
  font-weight: 700;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 1rem;
  padding-right: 1rem;
  border-radius: 0.25rem;
  display: flex;
  align-items: center
}

.dropdown button.current-value span{
  margin-right: 0.75rem
}

ul.dropdown-menu{
  position:absolute;
  display:none;
  z-index:100;
  --text-opacity: 1;
  color: #888;
  color: rgba(136, 136, 136, var(--text-opacity));
  padding-top: 0.25rem
}

ul.dropdown-menu.open{
  display:block
}

ul.dropdown-menu li:first-of-type a{
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem
}

ul.dropdown-menu li:last-of-type a{
  border-bottom-right-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem
}

ul.dropdown-menu li a{
  --bg-opacity: 1;
  background-color: #e1e1e1;
  background-color: rgba(225, 225, 225, var(--bg-opacity));
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 1rem;
  padding-right: 1rem;
  display:block;
  white-space:nowrap
}

ul.dropdown-menu li a:hover{
  --bg-opacity: 1;
  background-color: #bebebe;
  background-color: rgba(190, 190, 190, var(--bg-opacity))
}

.block-dropdown-container{
  display:block;
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem
}

.block-dropdown-container .block-dropdown{
  padding-right:3rem;
  position:relative;
  display:flex
}

.block-dropdown-container .block-dropdown .iconify{
  position:absolute;
  top:50%;
  right:1rem;
  transform:translate(0, -50%) !important
}

.block-dropdown-container .block-dropdown>:not(.iconify){
  flex:1 1 0;
  display:inline-block
}

.block-dropdown-container .dropdown-content{
  max-height:0;
  overflow:hidden;
  transition:.4s
}

.block-dropdown-container:hover .dropdown-content,.block-dropdown-container:focus .dropdown-content{
  max-height:100vh
}

#search-results{
  margin:0 90px 0 95px
}

#search-results .result-wrapper:nth-of-type(5n-1) .result-box::before{
  padding-top:200%
}

#search-results .result-wrapper hr{
  border:2px solid #fff;
  background:#fff
}

#search-results .result-wrapper .result-box{
  border:1px solid #f8f8f8
}

#search-results .result-wrapper .result-box{
  position:relative
}

#search-results .result-wrapper .result-box::before{
  content:"";
  display:block;
  padding-top:150%
}

#search-results .result-wrapper .result-box::after{
  content:"";
  position:absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background:rgba(99,187,206,0);
  -webkit-backdrop-filter:blur(0px);
          backdrop-filter:blur(0px);
  transition:.4s
}

#search-results .result-wrapper .result-box .social-link{
  display:inline-block;
  cursor:pointer;
  margin-left: 0.25rem;
  margin-right: 0.25rem;
  margin-top: 0.75rem
}

#search-results .result-wrapper .result-box .social-link:hover .iconify{
  color:#eaeaea
}

#search-results .result-wrapper .result-box img{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  -o-object-fit:cover;
     object-fit:cover
}

#search-results .result-wrapper .result-box .content{
  position:absolute;
  z-index:2;
  left:0;
  right:0;
  top:50%;
  transform:translate(0, -50%);
  padding: 1rem;
  display:none;
  color:#fff
}

#search-results .result-wrapper .result-box .result-name{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding: 0.75rem;
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:14px;
  line-height:30px;
  letter-spacing:.04em;
  color:#fff;
  text-transform:uppercase;
  background:#63bbce
}

#search-results .result-wrapper .result-box:hover::after{
  content:"";
  position:absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background:#63bbce;
  -webkit-backdrop-filter:blur(4px);
          backdrop-filter:blur(4px)
}

#search-results .result-wrapper .result-box:hover .content{
  display:block;
  opacity:1
}

section.filters{
  position:initial;
  z-index:30;
  overflow:visible !important
}

section.filters>*{
  position:initial
}

section.filters input[type=text]{
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 1rem;
  padding-right: 1rem;
  outline:none;
  border:0;
  --bg-opacity: 1;
  background-color: #ddd;
  background-color: rgba(221, 221, 221, var(--bg-opacity));
  --text-opacity: 1;
  color: #888;
  color: rgba(136, 136, 136, var(--text-opacity));
  font-weight: 700;
  box-sizing:border-box;
  background:#fff;
  width:164px;
  height:3rem
}

section.filters .search-input{
  border:1px solid #1d1d1d
}

section.filters #dropdown-filters{
  position:initial;
  max-height:0;
  transition:max-height .4s;
  overflow:hidden
}

section.filters #dropdown-filters.show{
  max-height:100vh
}

section.filters #dropdown-filters>*{
  position:initial
}

section.filters #dropdown-filters ul.dropdown-menu li a{
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:16px;
  line-height:19px;
  background-color:#fff;
  text-decoration:none;
  color:#1d1d1d
}

section.filters #dropdown-filters .dropdown-menu li a:hover{
  background-color:#1d1d1d;
  color:#63bbce
}

section.filters #dropdown-filters ul.dropdown-menu{
  border:1px solid #1d1d1d
}

section.filters #dropdown-filters .dropdown{
  border:1px solid #1d1d1d;
  box-sizing:border-box
}

section.filters #dropdown-filters .dropdown button.current-value{
  background-color:#fff;
  color:#1d1d1d;
  height:3rem
}

section.filters #dropdown-filters .dropdown button.current-value svg{
  float:right
}

section.filters #dropdown-filter-toggler{
  position:relative;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 0;
  padding-right: 1.5rem;
  --text-opacity: 1;
  color: #888;
  color: rgba(136, 136, 136, var(--text-opacity));
  font-weight: 700
}

section.filters #dropdown-filter-toggler .iconify{
  position:absolute;
  right:0;
  margin-right: 0.5rem;
  top:50%;
  transform:translate(0, -50%) !important;
  transition:transform .4s
}

section.filters #dropdown-filter-toggler.open .iconify{
  transform:translate(0, -50%) rotateX(180deg) !important
}

section.filters::after{
  content:"";
  display:block;
  clear:both
}

.darkmode--activated #search-results .result-box .result-name{
  background:rgba(206,119,99,.8)
}

.darkmode--activated #search-results .result-box:hover::after{
  background:#ce7763
}

.darkmode--activated #search-results .result-box .content{
  color:#000 !important
}

.darkmode--activated #search-results .result-box .result-name{
  color:#000
}

.darkmode--activated #search-results .result-box .btn-white{
  border-color:#000;
  color:#000
}

@media(max-width: 992px){
  section.filters #dropdown-filters .dropdown{
    width:45vw
  }

  section.filters #dropdown-filters .dropdown button.current-value{
    width:auto
  }

  #search-results .search-result-sizer,#search-results .result-wrapper{
    width:50%;
    padding:.5rem
  }
}

@media(min-width: 993px){
  #search-results .search-result-sizer,#search-results .result-wrapper{
    width:25%;
    padding:0 1.2rem 1.2rem 1.2rem
  }

  #search-results .dropdown button.current-value{
    width:164px
  }

  #dropdown-filters{
    max-height:none !important
  }
}

.kpi-box{
  height:220px;
  position:relative
}

.kpi-box .kpi-content{
  position:absolute;
  top:50%;
  left:1rem;
  right:1rem;
  transform:translate(0%, -50%);
  text-align:center
}

.kpi-box .kpi-content .kpi-title{
  font-size:1rem;
  line-height:.8rem
}

.kpi-box .kpi-content .kpi-value{
  font-size:3rem;
  font-weight:700
}

#artist-details{
  position:relative
}

#artist-detail-overlay{
  position:absolute;
  left:0;
  right:0;
  top:50%;
  transform:translate(0, -50%)
}

@media(min-width: 992px){
  .artist-video{
    top:50%;
    position:absolute;
    left:1rem;
    right:0;
    transform:translate(0, -50%)
  }
}

@media(max-width: 992px){
  .kpi-box .kpi-content .kpi-value{
    font-size:2.2rem
  }
}

.darkmode--activated .kpi-box.bg-lionflence-blue{
  --bg-opacity: 1;
  background-color: #cf7763;
  background-color: rgba(207, 119, 99, var(--bg-opacity));
  color:#000 !important
}

.event-calendar{
  width:100%;
  padding-left: 1rem;
  padding-right: 1rem;
  --bg-opacity: 1;
  background-color: #f8f8f8;
  background-color: rgba(248, 248, 248, var(--bg-opacity));
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)
}

.event-calendar .month-view{
  font-weight:700;
  position:relative;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  text-align:left
}

.event-calendar .month-view .prev,.event-calendar .month-view .next{
  position:absolute;
  top:50%;
  transform:translate(0, -50%);
  width:2rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  margin-left: 0.25rem;
  margin-right: 0.25rem;
  text-align:center;
  background:#fff;
  cursor:pointer
}

.event-calendar .month-view .prev{
  right:4rem
}

.event-calendar .month-view .next{
  right:1rem
}

.event-calendar table{
  width:100%
}

.event-calendar table tr.day-names th{
  text-align:left;
  padding-left: 0.25rem;
  padding-right: 0.25rem
}

.event-calendar table tr.days td{
  text-align:left;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  padding-left: 0.25rem;
  padding-right: 0.25rem
}

.event-calendar table tr.days td.event{
  --bg-opacity: 1;
  background-color: #63bbce;
  background-color: rgba(99, 187, 206, var(--bg-opacity));
  cursor:pointer
}

.event-calendar table tr.days td.vacation{
  --bg-opacity: 1;
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, var(--bg-opacity));
  cursor:pointer
}

table{
  width:100%
}

table.striped tr:hover{
  --bg-opacity: 1;
  background-color: #1d1d1d;
  background-color: rgba(29, 29, 29, var(--bg-opacity))
}

table.striped tr td{
  padding-top: 1rem;
  padding-bottom: 1rem
}

table.striped tr td:first-child{
  padding-left: 0.5rem
}

table.striped tr td:last-child{
  padding-right: 0.5rem
}

table.striped tr:nth-child(2n+1){
  --bg-opacity: 1;
  background-color: #f8f8f8;
  background-color: rgba(248, 248, 248, var(--bg-opacity))
}

table.striped tr:nth-child(2n){
  --bg-opacity: 1;
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, var(--bg-opacity))
}

figure.table table{
  width:100%;
  border-width: 1px
}

figure.table table tr{
  border-bottom-width: 1px
}

figure.table table tr:nth-child(2n){
  --bg-opacity: 1;
  background-color: #f8f8f8;
  background-color: rgba(248, 248, 248, var(--bg-opacity))
}

figure.table table tr:nth-child(2n+1){
  --bg-opacity: 1;
  background-color: #e1e1e1;
  background-color: rgba(225, 225, 225, var(--bg-opacity))
}

figure.table table tr td{
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem
}

.nav-block ul{
  list-style:none
}

.nav-block ul li{
  display:block
}

.nav-block ul li a{
  display:block;
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 2.5rem;
  padding-right: 1rem;
  font-weight:700;
  position:relative
}

.nav-block ul li a .iconify{
  position:absolute;
  top:50%;
  transform:translate(0, -50%) !important
}

.nav-block ul li a .iconify.right{
  right:1rem
}

.nav-block ul li a .iconify.left{
  left:1rem
}

.nav-block ul li:nth-child(2n){
  --bg-opacity: 1;
  background-color: #f8f8f8;
  background-color: rgba(248, 248, 248, var(--bg-opacity))
}

.nav-block ul li:nth-child(2n+1){
  --bg-opacity: 1;
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, var(--bg-opacity))
}

@-webkit-keyframes fpFadeInDown{
  from{
    opacity:0;
    transform:translate3d(0, -20px, 0)
  }

  to{
    opacity:1;
    transform:translate3d(0, 0, 0)
  }
}

@keyframes fpFadeInDown{
  from{
    opacity:0;
    transform:translate3d(0, -20px, 0)
  }

  to{
    opacity:1;
    transform:translate3d(0, 0, 0)
  }
}

label.switch{
  display:block;
  position:relative
}

label.switch input[type=checkbox]{
  display:none
}

label.switch span{
  display:block;
  padding-left:3rem
}

label.switch span::before{
  content:"";
  position:absolute;
  display:block;
  left:0;
  top:50%;
  transform:translate(0, -50%);
  height:1.275rem;
  width:2.25rem;
  border-radius:1.375rem;
  transition:.4s;
  cursor:pointer;
  --bg-opacity: 1;
  background-color: #ddd;
  background-color: rgba(221, 221, 221, var(--bg-opacity))
}

label.switch span::after{
  content:"";
  position:absolute;
  display:block;
  left:2px;
  top:50%;
  transform:translate(0, -50%);
  height:calc(1.275rem - 4px);
  width:calc(1.275rem - 4px);
  background:#fff;
  border-radius:50%;
  cursor:pointer;
  transition:.4s;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05)
}

label.switch input[type=checkbox]:checked+span::before{
  --bg-opacity: 1;
  background-color: #48bb78;
  background-color: rgba(72, 187, 120, var(--bg-opacity))
}

label.switch input[type=checkbox]:checked+span::after{
  left:calc(1.1375rem - 1px)
}

#cookies-eu-banner{
  background:#000;
  color:#fff;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  position:absolute;
  z-index:999999;
  left:0;
  right:0;
  top:0
}

#cookies-eu-banner button{
  display:inline-block;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  border:1px solid #fff;
  margin-left: 0.75rem
}

#cookies-eu-banner a{
  text-decoration:underline;
  margin-left: 0.75rem
}

.feed-wrapper{
  width:33%;
  display:inline-block;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  margin-top: 1.25rem
}

.feed-wrapper .feed-content{
  --bg-opacity: 1;
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, var(--bg-opacity));
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 0.125rem
}

.feed-wrapper .feed-content{
  --bg-opacity: 1;
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, var(--bg-opacity));
  --text-opacity: 1;
  color: #000000;
  color: rgba(0, 0, 0, var(--text-opacity))
}

.feed-wrapper .feed-content .feed-image{
  width:40%
}

.feed-wrapper .feed-content .feed-body{
  width:60%;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 1.5rem;
  text-align:left;
  position:relative
}

.feed-wrapper .feed-content .feed-body .footer{
  padding: 0.5rem;
  margin-top: 0.5rem;
  font-size:.8rem;
  color:#ddd
}

.feed-wrapper .feed-content .feed-body .footer a.original-post{
  display:block;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  --text-opacity: 1;
  color: #000000;
  color: rgba(0, 0, 0, var(--text-opacity));
  position:relative;
  border-top:1px solid #ddd
}

.feed-wrapper .feed-content .feed-body .footer a.original-post .iconify{
  position:absolute;
  right:0;
  margin-right: 0.5rem;
  top:50%;
  transform:translate(0, -50%) !important
}

@media(max-width: 992px){
  .feed-wrapper{
    width:100%
  }
}

.c100.p76 .slice,.c100.p66 .slice{
  clip:rect(auto, auto, auto, auto)
}

.c100.p76 .fill,.c100.p66 .fill,.c100 .bar{
  position:absolute;
  border:.18em solid #307bbb;
  width:.64em;
  height:.64em;
  clip:rect(0em, 0.5em, 1em, 0em);
  border-radius:50%;
  transform:rotate(0deg);
  -webkit-transform:rotate(0deg)
}

.c100.p76 .fill,.c100.p76 .bar:after,.c100.p66 .fill,.c100.p66 .bar:after{
  -webkit-transform:rotate(180deg)
}

.c100{
  position:relative;
  font-size:120px;
  width:1em;
  height:1em;
  border-radius:50%;
  float:left;
  margin:0 .1em .1em 0;
  background-color:#525252
}

.c100 *,.c100 *:before,.c100 *:after{
  box-sizing:content-box
}

.c100.center{
  float:none;
  margin:0 auto
}

.c100.small{
  font-size:80px
}

.c100>span{
  position:absolute;
  width:100%;
  z-index:1;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  -webkit-transform:translate(-50%, -50%);
  width:5em;
  line-height:5em;
  font-size:.16em;
  color:#525252;
  display:block;
  text-align:center;
  white-space:nowrap
}

.c100:after{
  position:absolute;
  top:.18em;
  left:.18em;
  display:block;
  content:" ";
  border-radius:50%;
  background-color:#fff;
  width:.64em;
  height:.64em
}

.c100 .slice{
  position:absolute;
  width:1em;
  height:1em;
  clip:rect(0em, 1em, 1em, 0.5em)
}

.c100.in-viewport.p24 .bar{
  transform:rotate(86.4deg);
  -webkit-transform:rotate(86.4deg)
}

.c100.in-viewport.p34 .bar{
  transform:rotate(122.4deg);
  -webkit-transform:rotate(122.4deg)
}

.c100.in-viewport.p66 .bar{
  transform:rotate(237.6deg);
  -webkit-transform:rotate(237.6deg)
}

.c100.in-viewport.p76 .bar{
  transform:rotate(273.6deg);
  -webkit-transform:rotate(273.6deg)
}

.c100.p24 .bar{
  transition:.6s
}

.c100.p34 .bar{
  transition:.6s
}

.c100.p66 .bar{
  transition:.6s
}

.c100.p76 .bar{
  transition:.6s
}

.c100.pink .bar,.c100.pink .fill{
  border-color:#f89db3 !important
}

.c100.pink>span{
  color:#f89db3
}

.c100.blue .bar,.c100.blue .fill{
  border-color:#4f83d0 !important
}

.c100.blue>span{
  color:#4f83d0
}

.c100.lionflence .bar,.c100.lionflence .fill{
  border-color:#63bbce !important
}

.c100.lionflence>span{
  color:#63bbce
}

@media print{

  .c100.p24 .bar{
    transform:rotate(86.4deg);
    -webkit-transform:rotate(86.4deg)
  }

  .c100.p34 .bar{
    transform:rotate(122.4deg);
    -webkit-transform:rotate(122.4deg)
  }

  .c100.p66 .bar{
    transform:rotate(237.6deg);
    -webkit-transform:rotate(237.6deg)
  }

  .c100.p76 .bar{
    transform:rotate(273.6deg);
    -webkit-transform:rotate(273.6deg)
  }
}

.btn.btn-lg{
  text-decoration:none
}

@media(min-width: 993px){
  .circle-of-marketing{
    adding-bottom:5rem;
    padding-bottom:10rem
  }

  .circle-of-marketing h1{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:3.125rem;
    line-height:1.875rem
  }

  .circle-of-marketing p{
    font-family:Roboto;
    font-style:normal;
    font-weight:normal;
    font-size:1.25rem;
    line-height:1.875rem
  }

  .circle-of-marketing a{
    text-decoration:none;
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:14px;
    line-height:16px;
    text-align:center;
    letter-spacing:.2em
  }
}

@media(max-width: 996px){
  .circle-of-marketing{
    padding:4rem 2.375rem 4rem 0
  }

  .circle-of-marketing h1{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:1.8rem;
    line-height:1.875rem;
    padding-top:22rem
  }

  .circle-of-marketing p{
    font-family:Roboto;
    font-style:normal;
    font-weight:normal;
    font-size:1rem;
    line-height:1.625rem
  }

  .circle-of-marketing a{
    width:14.875rem;
    height:3.5rem;
    text-align: center
  }

  .circle-of-marketing .btn.btn-lg{
    padding-top:1rem
  }

  .circle-of-marketing h1,.circle-of-marketing .link,.circle-of-marketing p{
    padding-left:2.375rem
  }
}

.work-together{
  background:#f8f8f8;
  padding-bottom:4rem
}

.work-together .work-together-icon h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:1.625rem;
  line-height:1.875rem;
  color:#1d1d1d
}

.work-together .work-together-icon p{
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:1rem;
  line-height:1.5rem;
  color:#1d1d1d
}

.work-together .work-together-text{
  padding-left:10%;
  padding-right:10%
}

.work-together .work-together-button a{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:.875rem;
  line-height:1rem;
  text-align:center;
  text-transform:uppercase
}

.work-together .work-together-button .btn.btn-black.btn-outline{
  background:#1d1d1d;
  border-width:1px;
  border-color:#1d1d1d;
  color:#fff
}

@media(max-width: 992px){
  .work-together .work-together-icon img{
    height:100%;
    padding:0 25% 0 25%;
    width:100%
  }
}

@media(min-width: 993px){
  .work-together .work-together-icon img{
    height:90%;
    padding:2% 25% 0 25%;
    width:80%
  }
}

.our-projects .projekte-slider{
  position:relative;
  height:inherit
}

.our-projects .projekte-slider img{
  -o-object-fit:cover;
     object-fit:cover
}

.our-projects .projekte-slider img:nth-child(1){
  width:100%;
  height:100%
}

.our-projects .projekte-slider img:nth-child(2){
  position:absolute;
  width:100%;
  height:100%
}

.our-projects .our-projects-content{
  height:auto;
  padding-bottom:5%
}

.our-projects .our-projects-content .projects-body{
  height:inherit;
  overflow:hidden
}

.our-projects .our-projects-content .projects-body .home-project-new-main{
  position:relative;
  width:inherit;
  max-height:inherit
}

.our-projects .our-projects-content .projects-body .home-project-new{
  width:100%;
  max-height:inherit
}

.our-projects .our-projects-content .projects-body .home-grid.project-grid.project-grid--max-3{
  transition:transform .5s ease 0s;
  white-space:nowrap;
  height:auto
}

.our-projects .our-projects-content .projects-body .item-container{
  display:inline-block;
  margin:0 3vw 0 0;
  vertical-align:top;
  width:32%;
  height:40vw
}

.our-projects .our-projects-content .projects-body .item-container .item-footer{
  max-width:inherit
}

.our-projects .our-projects-content .projects-body .item-container .item-footer p{
  max-width:inherit;
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.our-projects .our-projects-content .projects-body .item-container>a{
  text-decoration:none
}

.our-projects .our-projects-content .projects-body .project-grid .project{
  margin-left:0;
  background:inherit;
  height:33vw;
  background:#f8f8f8
}

.our-projects .our-projects-content .projects-body .project-grid .project>h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:2.25rem;
  line-height:1.875rem;
  color:#63bbce
}

@media(max-width: 992px){
  .our-projects .projekte-slider{
    position:relative;
    height:inherit
  }

  .our-projects .projekte-slider img:nth-child(1){
    width:100%;
    height:100%
  }

  .our-projects .projekte-slider img:nth-child(2){
    width:100%;
    height:100%
  }

  .our-projects .front-back{
    padding-right:4vw
  }

  .our-projects .our-projects-content .projects-body{
    padding:0 3% 0 3.4%
  }

  .our-projects .our-projects-content .projects-body .home-grid.project-grid.project-grid--max-3{
    margin-top:2%
  }

  .our-projects .our-projects-content .projects-body .home-project-new{
    overflow:auto;
    height:47vh;
    padding-right:1.2rem
  }

  .our-projects .our-projects-content .projects-body .item-container{
    width:50%
  }

  .our-projects .our-projects-content .projects-body .item-container .item-footer p{
    max-width:inherit;
    font-family:Roboto;
    font-style:normal;
    font-weight:normal;
    font-size:12px;
    line-height:16px;
    color:#1d1d1d
  }

  .our-projects .our-projects-content .projects-body .project-grid .project{
    height:35vh
  }

  .our-projects .our-projects-content .projects-body .project-grid .project>h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:1.25rem;
    line-height:1.5rem;
    color:#63bbce;
    background:#f8f8f8;
    padding-top:100%
  }
}

@media(min-width: 993px){
  .our-projects-content .projects-body{
    padding:0 5% 0 3%
  }

  .our-projects-content .front-back{
    padding-right:2.3%
  }
}

.news-letter h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:1.875rem;
  line-height:3rem;
  color:#1d1d1d
}

.news-letter p{
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:1rem;
  line-height:1.5rem;
  color:#1d1d1d
}

.news-letter .btn.btn-blue{
  background-color:#1d1d1d
}

.news-letter input{
  border:1px solid #1d1d1d;
  width:98%;
  box-sizing:border-box;
  box-shadow:inset 2px 2px 4px rgba(51,51,51,.14);
  background:#fff
}

.news-letter .desktop{
  padding:0 21.5% 0 21.5%
}

.news-letter .desktop>div{
  width:inherit
}

.news-letter .desktop button{
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:.875rem;
  line-height:1rem;
  text-align:center;
  text-transform:uppercase;
  color:#fff
}

.news-letter .desktop .news-letter-desktop-button{
  background:#1d1d1d
}

@media(max-width: 992px){
  .mobile-subscribe-newsletter{
    width:75%
  }
}

@media(min-width: 997px){
  .news-letter{
    text-align:left
  }

  .news-letter input{
    border:1px solid #1d1d1d;
    height:3.5rem
  }

  .news-letter .news-letter-desktop-button{
    width:30%
  }

  .news-letter .desktop{
    width:31.25rem;
    margin-left:12%
  }

  .news-letter .desktop .input-button{
    width:31.1875rem
  }

  .news-letter .desktop input{
    width:75%;
    margin-left:22%
  }

  .news-letter button{
    height:3.5rem
  }

  .news-letter .btn.btn-block{
    width:120%
  }
}

.history-bar-1{
  border-bottom:7px solid #63bbce;
  width:65%;
  color:#63bbce;
  margin-left:16%
}

.history-bar-2{
  border-bottom:7px solid #63bbce;
  width:65%;
  margin-left:19%;
  color:#63bbce
}

.history-bar-3{
  border-bottom:7px solid #63bbce;
  width:55%;
  margin-left:18%;
  color:#63bbce
}

.darkmode--activated .history-bar-1,.darkmode--activated .history-bar-2,.darkmode--activated .history-bar-3{
  --text-opacity: 1;
  color: #cf7763;
  color: rgba(207, 119, 99, var(--text-opacity));
  --border-opacity: 1;
  border-color: #cf7763;
  border-color: rgba(207, 119, 99, var(--border-opacity))
}

@media(max-width: 992px){
  .history h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:1.625rem;
    line-height:1.875rem;
    color:#1d1d1d
  }

  .history p{
    font-family:Roboto;
    font-style:normal;
    font-weight:normal;
    font-size:1.125rem;
    line-height:1.875rem;
    color:#1d1d1d
  }

  .history .history-bar-1{
    width:55%;
    margin-left:24%;
    color:#63bbce
  }

  .history .history-bar-2{
    width:51%;
    margin-left:26%;
    color:#63bbce
  }

  .history .history-bar-3{
    width:47%;
    margin-left:29%;
    color:#63bbce
  }
}

section.hero{
  padding:4rem 0 5rem 0
}

@media(min-width: 993px){
  .hero-section .about-us h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:1.875rem;
    line-height:1.875rem
  }

  .hero-section .about-us p{
    width:100%;
    padding:0 2.8125rem 0 2.8125rem
  }

  .hero-section .about-us a{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:.875rem;
    line-height:1rem;
    text-align:center;
    letter-spacing:.2em;
    text-decoration:none
  }

  .hero-section .about-us a hr{
    border:2px solid #1d1d1d;
    background:#1d1d1d
  }

  .hero-section .about-us a:hover hr{
    border:2px solid #63bbce;
    background:#63bbce
  }

  .hero-section .about-us .btn{
    box-shadow:none
  }

  .hero-section .about-us .btn-black{
    background-color:inherit;
    --text-opacity: 1;
    color: #1D1D1D;
    color: rgba(29, 29, 29, var(--text-opacity))
  }
}

@media(max-width: 992px){
  .hero-section .about-us h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:1.875rem;
    line-height:1.875rem
  }

  .hero-section .about-us p{
    width:100%;
    padding:0 2.8125rem 0 2.8125rem
  }

  .hero-section .about-us a{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:.875rem;
    line-height:1rem;
    text-align:center;
    letter-spacing:.2em;
    text-decoration:none
  }

  .hero-section .about-us a hr{
    border:2px solid #1d1d1d;
    background:#1d1d1d
  }

  .hero-section .about-us .btn{
    box-shadow:none
  }

  .hero-section .about-us .btn-black{
    background-color:inherit;
    --text-opacity: 1;
    color: #1D1D1D;
    color: rgba(29, 29, 29, var(--text-opacity))
  }

  section.hero[data-backdrop-text]::after{
    padding-top:.6rem
  }
}

.services h3{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.services p:not(.text-lionflence-blue){
  font-family:Roboto;
  font-style:normal;
  font-weight:normal
}

.services .all-services a{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:14px;
  line-height:16px
}

.services .all-services .btn{
  padding:1.1rem 1.85rem
}

@media(max-width: 992px){
  .services-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:29px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-services .artist-management .description{
    padding-bottom:10%
  }

  .all-services .online-marketing .description{
    padding-bottom:10%
  }

  .all-services .design-projekte .description{
    padding-bottom:10%
  }

  .all-services .events .description{
    padding-bottom:10%
  }

  .all-services .film-foto .description{
    padding-bottom:10%
  }
}

@media(min-width: 993px){
  .services-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:45px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-services>div{
    height:auto
  }

  .all-services>div img{
    height:36vh;
    width:100%;
    -o-object-fit:contain;
       object-fit:contain
  }

  .all-services .beratung-konzept img{
    width:60vw;
    height:10vw
  }

  .all-services .description{
    height:25vw
  }
}

.consulting a.btn{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:14px;
  line-height:16px
}

.consulting .btn{
  padding:1.1rem 1.85rem
}

.consulting .work-together{
  background:#fff
}

.consulting section[data-backdrop-text]::after{
  color:#f8f8f8
}

.consulting h3{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1.5rem;
  line-height:24px;
  color:#1d1d1d
}

.consulting hr{
  border:4px solid #63bbce;
  background:#63bbce;
  width:30%
}

.consulting .right-description{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1.1rem;
  line-height:2rem;
  color:#1d1d1d;
  text-decoration:none;
  cursor:pointer
}

@media(max-width: 992px){
  .consulting-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:29px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-consulting .projektmanagement .left-description{
    padding-bottom:10%
  }

  .all-consulting .left-description{
    padding-bottom:10%
  }

  .all-consulting .grundung .left-description{
    padding-bottom:10%
  }

  .all-consulting .markenbildung .left-description{
    padding-bottom:10%
  }
}

@media(min-width: 993px){
  .consulting-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:45px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-consulting>div{
    height:auto
  }

  .all-consulting .left-description{
    height:auto
  }
}

.online-marketing a.btn{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:14px;
  line-height:16px;
  letter-spacing:.2em
}

.online-marketing .btn{
  padding:1.1rem 1.85rem
}

.online-marketing .work-together{
  background:#fff
}

.online-marketing section[data-backdrop-text]::after{
  color:#f8f8f8
}

.online-marketing h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.online-marketing hr{
  border:4px solid #63bbce;
  background:#63bbce;
  width:30%
}

.online-marketing .right-description a:not(.btn){
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1rem;
  line-height:30px;
  color:#1d1d1d;
  text-decoration:none;
  cursor:pointer;
  pointer-events:none
}

@media(max-width: 992px){
  .online-marketing-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:29px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-online-marketing .social-media .left-description{
    padding-bottom:10%
  }

  .all-online-marketing .influencer-marketing .left-description{
    padding-bottom:10%
  }

  .all-online-marketing .content-marketing .left-description{
    padding-bottom:10%
  }

  .all-online-marketing .performance .left-description{
    padding-bottom:10%
  }

  .all-online-marketing .markenbildung .left-description{
    padding-bottom:10%
  }
}

@media(min-width: 993px){
  .online-marketing-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:45px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-online-marketing>div{
    height:auto
  }

  .all-online-marketing .left-description{
    height:auto
  }
}

.artist-management .isotope .item .isotope-influencer .content hr{
  width:inherit
}

.artist-management section.backdrop-color-bg-1[data-backdrop-text]::after{
  color:#fff
}

.artist-management .influencer-testimonial h2{
  font-family:Roboto;
  font-style:italic;
  font-weight:bold;
  font-size:36px;
  line-height:40px;
  color:#1d1d1d
}

.artist-management section.our-artists{
  padding:2.1rem 4.3rem 3rem 4.3rem;
  background:#fff
}

.artist-management section.our-artists .pt-32{
  padding-top:0%
}

.artist-management section.our-artists>div h2,.artist-management section.our-artists>div p{
  display:none
}

.artist-management a.btn{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:14px;
  line-height:16px
}

.artist-management .btn{
  padding:1.1rem 1.85rem
}

.artist-management .work-together{
  background:#fff
}

.artist-management section[data-backdrop-text]::after{
  color:#f8f8f8
}

.artist-management h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.artist-management hr{
  border:4px solid #63bbce;
  background:#63bbce;
  width:30%
}

.artist-management .right-description a:not(.btn){
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1.1rem;
  line-height:24px;
  color:#1d1d1d;
  text-decoration:none;
  cursor:pointer;
  pointer-events:none
}

@media(max-width: 992px){
  .artist-management section.our-artists{
    padding:1rem 1.3rem 0rem 1.3rem
  }

  .artist-management .artist-management-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:29px;
    line-height:30px;
    color:#1d1d1d
  }

  .artist-management .influencer-testimonial h2{
    font-family:Roboto;
    font-style:italic;
    font-weight:bold;
    font-size:14px;
    line-height:16px;
    color:#1d1d1d
  }

  .artist-management .all-artist-management .left-description,.artist-management .all-artist-management .right-description{
    padding-left:1.6rem
  }

  .artist-management .all-artist-management .left-description{
    padding-bottom:4%
  }
}

@media(min-width: 993px){
  .artist-management-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:45px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-artist-management>div:not(.artist-testi){
    height:auto
  }

  .all-artist-management .artist-testi{
    height:auto
  }
}

.darkmode--activated .artist-management hr{
  --border-opacity: 1;
  border-color: #cf7763;
  border-color: rgba(207, 119, 99, var(--border-opacity))
}

.artists #search-results .art-1,.artists #search-results .art-3,.artists #search-results .art-7,.artists #search-results .art-8,.artists #search-results .art-9,.artists #search-results .art-11,.artists #search-results .art-15,.artists #search-results .art-16{
  width:20.8vw;
  height:25vw
}

.artists #search-results .art-2,.artists #search-results .art-4,.artists #search-results .art-5,.artists #search-results .art-6,.artists #search-results .art-10,.artists #search-results .art-12,.artists #search-results .art-13,.artists #search-results .art-14{
  width:20.8vw;
  height:34vw
}

.artists #search-results a:not(.btn){
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:16px;
  line-height:24px
}

.artists #search-results a.btn{
  border:none;
  box-shadow:0 0 0
}

@media(max-width: 992px){
  .filters{
    padding-right:0
  }

  .artists #search-results{
    margin:0
  }

  .artists #search-results .result-box{
    margin-left:2%;
    border:1px solid #f8f8f8
  }

  .artists #search-results .result-wrapper{
    padding:0
  }

  .artists #search-results .art-1,.artists #search-results .art-4,.artists #search-results .art-5,.artists #search-results .art-8,.artists #search-results .art-9,.artists #search-results .art-12,.artists #search-results .art-13,.artists #search-results .art-16{
    width:47.8vw;
    height:89vw;
    margin-bottom:3%
  }

  .artists #search-results .art-2,.artists #search-results .art-3,.artists #search-results .art-6,.artists #search-results .art-7,.artists #search-results .art-10,.artists #search-results .art-11,.artists #search-results .art-14,.artists #search-results .art-15{
    width:47.8vw;
    height:98vw;
    margin-bottom:3%
  }

  section.filters input[type=text]{
    width:80%
  }

  section.filters #dropdown-filters{
    padding-top:10%
  }
}

.film-foto section.backdrop-color-bg-1[data-backdrop-text]::after{
  color:#fff
}

.film-foto a.btn{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:14px;
  line-height:16px
}

.film-foto .btn{
  padding:1.1rem 1.85rem
}

.film-foto .work-together{
  background:#fff
}

.film-foto section[data-backdrop-text]::after{
  color:#f8f8f8
}

.film-foto h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.film-foto hr{
  border:4px solid #63bbce;
  background:#63bbce;
  width:30%
}

.film-foto .right-description a:not(.btn){
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1rem;
  line-height:30px;
  color:#1d1d1d;
  cursor:pointer
}

@media(max-width: 992px){
  .film-foto a.btn{
    font-size:10px
  }

  .film-foto .ff-images .ff-image-1{
    height:25vh
  }

  .film-foto .ff-images .ff-image-1 img{
    height:35vh
  }

  .film-foto .ff-images .ff-image-2,.film-foto .ff-images .ff-image-3,.film-foto .ff-images .ff-image-4{
    height:25vh
  }

  .film-foto .ff-images .ff-image-2 img,.film-foto .ff-images .ff-image-3 img,.film-foto .ff-images .ff-image-4 img{
    height:24vh
  }

  .film-foto .film-foto-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:29px;
    line-height:30px;
    color:#1d1d1d
  }

  .film-foto .all-film-foto .left-description,.film-foto .all-film-foto .right-description{
    padding-left:1.6rem
  }

  .film-foto .all-film-foto .left-description{
    padding-bottom:4%
  }
}

@media(min-width: 993px){
  .film-foto-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:45px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-film-foto .ff-images .ff-image-1{
    height:41.5vw
  }

  .all-film-foto .ff-images .ff-image-1 img{
    height:46vw;
    width:90.5vw
  }

  .all-film-foto .ff-images .img-block{
    height:70vh;
    width:95.8%
  }

  .all-film-foto .ff-images .img-block .ff-image-2 img,.all-film-foto .ff-images .img-block .ff-image-3 img,.all-film-foto .ff-images .img-block .ff-image-4 img{
    height:65vh
  }

  .all-film-foto>div{
    height:auto
  }
}

.events section.backdrop-color-bg-1[data-backdrop-text]::after{
  color:#fff
}

.events .media .overlay video{
  height:100%
}

.events a.btn{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:14px;
  line-height:16px;
  letter-spacing:.2em
}

.events .btn{
  padding:1.1rem 1.85rem
}

.events .work-together{
  background:#fff
}

.events section[data-backdrop-text]::after{
  color:#f8f8f8
}

.events h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.events hr{
  border:4px solid #63bbce;
  width:15%
}

.events .right-description .block-text{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1rem;
  line-height:30px;
  color:#1d1d1d
}

@media(max-width: 992px){
  .events a.btn{
    font-size:10px
  }

  .events .events-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:34px;
    line-height:30px;
    color:#1d1d1d
  }

  .events .all-events .left-description,.events .all-events .right-description{
    padding-left:1.6rem
  }

  .events .all-events .left-description{
    padding-bottom:4%
  }
}

@media(min-width: 993px){
  .events-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:50px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-events>div{
    height:auto
  }
}

.design-projekte a.btn{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:14px;
  line-height:16px;
  letter-spacing:.2em
}

.design-projekte .btn{
  padding:1.1rem 1.85rem
}

.design-projekte section[data-backdrop-text]::after{
  color:#f8f8f8
}

.design-projekte h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.design-projekte hr{
  border:4px solid #63bbce;
  background:#63bbce;
  width:30%
}

.design-projekte .right-description a:not(.btn){
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1rem;
  line-height:30px;
  color:#1d1d1d;
  text-decoration:none;
  cursor:pointer;
  pointer-events:none
}

.design-projekte .project-cards a{
  font-weight:normal;
  color:#1d1d1d;
  text-decoration:none !important;
  cursor:pointer
}

.design-projekte .project-cards div:nth-child(1):not(.graphic-design){
  background:#9cf6fc
}

.design-projekte .project-cards div:nth-child(2){
  background:#1d1d1d
}

.design-projekte .project-cards div:nth-child(3):not(.packing-design-soon){
  background:#f8f8f8
}

.design-projekte .project-cards div:nth-child(3):not(.packing-design-soon) h2{
  padding-top:45%
}

.design-projekte .project-cards div:nth-child(3):not(.packing-design-soon) img{
  height:59%
}

.design-projekte .project-cards .coming-soon{
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:36px;
  line-height:30px;
  color:#63bbce
}

.design-projekte .project-cards .graphic-design{
  background:#ede7eb
}

.design-projekte .project-cards .graphic-design img{
  padding:35%
}

.design-projekte .project-cards .packing-design-soon{
  margin-right:0;
  background:#fff
}

.design-projekte .project-cards .packing-design-soon h2{
  padding-top:45%
}

.design-projekte .project-cards .packing-design-soon img{
  height:45%
}

.project-cards a{
  text-decoration:none !important
}

@media(max-width: 992px){
  .design-projekte-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:34px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-design-projekte .project-cards div{
    height:42vh;
    width:100%;
    margin:.667%;
    margin-bottom:10vh;
    border:solid 1px #f8f8f8;
    background:#f8f8f8
  }

  .all-design-projekte .project-cards div img{
    height:100%;
    width:100%
  }

  .all-design-projekte .project-cards div:nth-child(1){
    margin-left:0
  }

  .all-design-projekte .project-cards div:nth-child(3):not(.packing-design-soon){
    margin-right:0
  }

  .all-design-projekte .project-cards div:nth-child(3):not(.packing-design-soon) img{
    height:39%
  }

  .all-design-projekte .project-cards .coming-soon{
    font-size:24px;
    line-height:16px
  }

  .all-design-projekte .project-cards .packing-design-soon{
    margin-right:0;
    background:#fff
  }

  .all-design-projekte .project-cards .packing-design-soon h2{
    padding-top:45%
  }

  .all-design-projekte .project-cards .packing-design-soon img{
    height:45%
  }

  .all-design-projekte .left-description{
    padding-bottom:10%
  }
}

@media(min-width: 993px){
  .design-projekte-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:50px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-design-projekte .project-cards{
    height:40vw
  }

  .all-design-projekte .project-cards div{
    height:33vw;
    width:31.33%;
    margin:1.5%;
    border:solid 1px #f8f8f8;
    background:#f8f8f8
  }

  .all-design-projekte .project-cards div img{
    height:100%;
    width:100%
  }

  .all-design-projekte .project-cards div:nth-child(1){
    margin-left:0
  }

  .all-design-projekte .project-cards div:nth-child(3){
    margin-right:0
  }

  .all-design-projekte .project-cards .packing-design-soon{
    background:#fff
  }

  .all-design-projekte .project-cards .packing-design-soon h2{
    padding-top:45%
  }

  .all-design-projekte .project-cards .packing-design-soon img{
    height:57%
  }

  .all-design-projekte>div{
    height:auto
  }

  .all-design-projekte .left-description{
    height:auto
  }
}

.strategie .all-strategie .more-info-block div.strategie-subcontent-accordion{
  width:88.2%
}

.strategie .all-strategie .more-info-block a{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:16px;
  line-height:19px;
  letter-spacing:.05em;
  font-variant:small-caps;
  color:#7d7d7d
}

.strategie .all-strategie .more-info-block .right-description p{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1rem;
  line-height:30px;
  color:#1d1d1d
}

.strategie .all-strategie .strategie-subcontent-accordion{
  border-bottom:1px solid #7d7d7d
}

.strategie .all-strategie .strategie-image .img-1,.strategie .all-strategie .strategie-image .img-3{
  box-shadow:20px 40px 0 #63bbce
}

.strategie .all-strategie .strategie-image .img-2,.strategie .all-strategie .strategie-image .img-4{
  box-shadow:-20px 40px 0 #63bbce
}

.strategie a.btn{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:14px;
  line-height:16px
}

.strategie .btn{
  padding:1.1rem 1.85rem
}

.strategie .work-together{
  background:#fff
}

.strategie section[data-backdrop-text]::after{
  color:#f8f8f8
}

.strategie h2:not(.st-header){
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.strategie hr:not(.strategie-accordion-hr){
  border:4px solid #63bbce;
  background:#63bbce;
  width:30%
}

.strategie .right-description a:not(.btn){
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1rem;
  line-height:30px;
  color:#1d1d1d;
  text-decoration:none;
  cursor:pointer;
  pointer-events:none
}

@media(max-width: 992px){
  .strategie-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:29px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-strategie .jump-to img{
    height:50px
  }

  .all-strategie .mobile-accordion-content{
    background:#1d1d1d;
    height:66px
  }

  .all-strategie .mobile-accordion-content>div hr{
    border-bottom:1px solid #fff;
    background:#fff;
    width:100%
  }

  .all-strategie .left-description{
    padding-bottom:10%
  }
}

@media(min-width: 993px){
  .strategie-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:45px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-strategie>div{
    height:auto
  }

  .all-strategie .left-description{
    height:auto
  }

  .all-strategie .strategie-image{
    min-height:45vh
  }
}

.schokofilms section.work-together[data-backdrop-text]::after{
  color:#fff
}

.schokofilms section.our-projects{
  background:#fff
}

.schokofilms section.our-projects .our-projects-content{
  padding-bottom:0
}

.schokofilms section.our-projects .our-projects-content .projects-body{
  margin-bottom:0
}

.schokofilms a.btn{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:14px;
  line-height:16px;
  letter-spacing:.2em
}

.schokofilms .btn{
  padding:1.1rem 1.85rem
}

.schokofilms section[data-backdrop-text]::after{
  color:#f8f8f8
}

.schokofilms h2:not(.header):not(.our-projects-header-text):not(.about-header){
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.schokofilms hr:not(.bar){
  border:4px solid #63bbce;
  background:#63bbce;
  width:30%
}

.schokofilms .right-description a:not(.btn){
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1rem;
  line-height:30px;
  color:#1d1d1d;
  text-decoration:none;
  cursor:pointer;
  pointer-events:none
}

.schokofilms section.hero{
  padding:4rem 0 5rem 0
}

@media(min-width: 993px){
  .shockofilmspage-hero-section hr{
    border:4px solid #63bbce;
    background:#63bbce;
    width:55%;
    margin-left:23%
  }

  .shockofilmspage-hero-section .about>h2{
    ont-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:36px;
    line-height:36px;
    color:#000
  }

  .shockofilmspage-hero-section .about p{
    width:100%;
    padding:0 26% 0 26%
  }

  .shockofilmspage-hero-section .about a{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:.875rem;
    line-height:1rem;
    text-align:center;
    letter-spacing:.2em;
    text-decoration:none
  }

  .shockofilmspage-hero-section .about a hr{
    border:4px solid #1d1d1d;
    background:#1d1d1d;
    width:40%;
    margin-left:26%
  }

  .shockofilmspage-hero-section .about a:hover hr{
    border:2px solid #63bbce;
    background:#63bbce
  }

  .shockofilmspage-hero-section .about .btn{
    box-shadow:none
  }

  .shockofilmspage-hero-section .about .btn-black{
    background-color:inherit;
    --text-opacity: 1;
    color: #1D1D1D;
    color: rgba(29, 29, 29, var(--text-opacity))
  }
}

@media(max-width: 996px){
  .shockofilmspage-hero-section hr{
    border:4px solid #63bbce;
    background:#63bbce;
    width:15%;
    margin-left:41%
  }

  .shockofilmspage-hero-section .about h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:1.875rem;
    line-height:1.875rem
  }

  .shockofilmspage-hero-section .about p{
    width:100%;
    padding:0 7% 0 7%
  }

  .shockofilmspage-hero-section .about a{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:.875rem;
    line-height:1rem;
    text-align:center;
    letter-spacing:.2em;
    text-decoration:none
  }

  .shockofilmspage-hero-section .about .btn{
    box-shadow:none
  }

  .shockofilmspage-hero-section .about .btn-black{
    background-color:inherit;
    --text-opacity: 1;
    color: #1D1D1D;
    color: rgba(29, 29, 29, var(--text-opacity))
  }
}

@media(max-width: 992px){
  .schokofilms section.hero{
    padding:2rem 0 2rem 0
  }

  .schokofilms section.work-together{
    background:#fff
  }

  .schokofilms section.work-together[data-backdrop-text]::after{
    color:#f8f8f8
  }

  .schokofilms section.our-projects{
    background:#f8f8f8
  }

  .schokofilms section.our-projects[data-backdrop-text]::after{
    color:#fff
  }

  .schokofilms section.our-projects .our-projects-content{
    background:#fff;
    padding-bottom:0
  }

  .schokofilms section.our-projects .our-projects-content .projects-body{
    margin-bottom:0
  }

  .schokofilms .schokofilms-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:29px;
    line-height:30px;
    color:#1d1d1d
  }

  .schokofilms .image-boxes{
    height:120vh
  }

  .schokofilms .image-boxes div:nth-child(n){
    height:33.333333%;
    width:100%;
    margin:1.5% 3.5% 1.5% 3.5%;
    background:#f8f8f8
  }

  .schokofilms .image-boxes div:nth-child(1){
    positon:relative
  }

  .schokofilms .image-boxes div:nth-child(1) img:nth-child(n){
    width:100%;
    height:100%
  }

  .schokofilms .image-boxes div:nth-child(2){
    positon:relative
  }

  .schokofilms .image-boxes div:nth-child(2) img:nth-child(n){
    width:100%;
    height:100%
  }

  .schokofilms .image-boxes div:nth-child(3){
    positon:relative
  }

  .schokofilms .image-boxes div:nth-child(3) img:nth-child(n){
    width:100%;
    height:100%
  }

  .schokofilms .main-picture{
    height:30vh;
    background:#1d1d1d
  }

  .schokofilms .main-picture .mobile{
    height:auto;
    width:100%;
    position:relative
  }

  .schokofilms .main-picture .mobile img{
    height:100%;
    width:inherit;
    -o-object-fit:cover;
       object-fit:cover
  }

  .schokofilms .main-picture .mobile .mobile-2{
    position:absolute;
    left:62%;
    top:33%;
    -o-object-fit:contain;
       object-fit:contain
  }
}

@media(min-width: 993px){
  .schokofilms .image-boxes{
    height:30vw
  }

  .schokofilms .image-boxes div:nth-child(n){
    width:30%;
    margin:.5%;
    background:#1d1d1d
  }

  .schokofilms .image-boxes div:nth-child(1){
    positon:relative
  }

  .schokofilms .image-boxes div:nth-child(1) img:nth-child(n){
    width:100%;
    height:100%
  }

  .schokofilms .image-boxes div:nth-child(2){
    positon:relative
  }

  .schokofilms .image-boxes div:nth-child(2) img:nth-child(n){
    width:100%;
    height:100%
  }

  .schokofilms .image-boxes div:nth-child(3){
    positon:relative
  }

  .schokofilms .image-boxes div:nth-child(3) img:nth-child(n){
    width:100%;
    height:100%
  }

  .schokofilms .testi-text{
    padding-left:20%
  }

  .schokofilms .main-picture{
    height:40vw;
    background:#f8f8f8
  }

  .schokofilms .main-picture .desktop{
    height:auto;
    width:100%;
    position:relative
  }

  .schokofilms .main-picture .desktop .desktop-1{
    width:100%;
    height:100%
  }

  .schokofilms .main-picture .desktop .desktop-2{
    width:100%;
    height:100%
  }
}

.darkmode--activated .shockofilmspage-hero-section hr{
  --border-opacity: 1;
  border-color: #cf7763;
  border-color: rgba(207, 119, 99, var(--border-opacity))
}

.cta-section a.btn{
  text-decoration:none;
  font-family:Roboto;
  font-style:normal;
  font-weight:900;
  font-size:14px;
  line-height:16px
}

.cta-section .btn{
  padding:1.1rem 1.85rem
}

.cta-section .work-together{
  background:#fff
}

.cta-section section[data-backdrop-text]::after{
  color:#f8f8f8
}

.cta-section h2{
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.cta-section hr{
  border:4px solid #63bbce;
  background:#63bbce;
  width:30%
}

.cta-section .right-description a:not(.btn){
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1rem;
  line-height:30px;
  color:#1d1d1d;
  text-decoration:none;
  cursor:pointer;
  pointer-events:none
}

@media(max-width: 992px){
  .consulting-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:29px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-consulting .projektmanagement .left-description{
    padding-bottom:10%
  }

  .all-consulting .left-description{
    padding-bottom:10%
  }

  .all-consulting .grundung .left-description{
    padding-bottom:10%
  }

  .all-consulting .markenbildung .left-description{
    padding-bottom:10%
  }
}

@media(min-width: 993px){
  .description{
    padding-top:5.5rem
  }

  .consulting-header h2{
    font-family:Roboto;
    font-style:normal;
    font-weight:900;
    font-size:45px;
    line-height:30px;
    color:#1d1d1d
  }

  .all-consulting>div{
    height:33vh
  }

  .all-consulting .left-description{
    height:25vw
  }
}

.timeline{
  padding-left: 4rem;
  padding-right: 1rem;
  padding-top: 2rem;
  position:relative
}

.timeline .timeline-content{
  width:100%;
  position:relative
}

.timeline .timeline-entry{
  width:100%;
  position:relative;
  margin-bottom: 2rem
}

.timeline .timeline-entry h3{
  --text-opacity: 1;
  color: #63bbce;
  color: rgba(99, 187, 206, var(--text-opacity));
  font-size:2rem;
  font-weight:bold;
  transform:translate(0, -30%);
  padding-bottom:0
}

.timeline .timeline-entry::before{
  position:absolute;
  top:0;
  left:0;
  content:"";
  margin-left: -2rem;
  --bg-opacity: 1;
  background-color: #63bbce;
  background-color: rgba(99, 187, 206, var(--bg-opacity));
  width:1rem;
  height:1rem;
  border-radius:50%;
  transform:translate(-50%, 0)
}

.timeline .timeline-entry:first-child::before{
  width:1rem;
  height:1rem;
  border-width: 4px;
  --border-opacity: 1;
  border-color: #63bbce;
  border-color: rgba(99, 187, 206, var(--border-opacity));
  background-color:#63bbce
}

.timeline::after{
  position:absolute;
  width:1px;
  content:"";
  display:block;
  --bg-opacity: 1;
  background-color: #bebebe;
  background-color: rgba(190, 190, 190, var(--bg-opacity));
  margin-left: 2rem;
  left: 0;
  top: 0;
  bottom: 0
}

@media(min-width: 967px){
  .timeline::after{
    left:50%
  }

  .timeline .timeline-entry::before{
    margin-left:0;
    left:50%;
    transform:none
  }

  .timeline .timeline-entry .timeline-content{
    width:50%;
    text-align:left;
    display:inline-block;
    padding-right: 6rem
  }

  .timeline .timeline-entry:nth-child(2n){
    text-align:right;
    padding-right: 0;
    padding-left: 6rem
  }
}

.contact-form input[type=text],.contact-form input[type=email]{
  background:#fff;
  border:1px solid #1d1d1d;
  box-sizing:border-box;
  box-shadow:inset 2px 2px 4px rgba(51,51,51,.14)
}

.contact-form textarea{
  background:#fff;
  border:1px solid #1d1d1d;
  box-sizing:border-box;
  box-shadow:inset 2px 2px 4px rgba(51,51,51,.14)
}

.contact-form .btn.btn-lg{
  padding-top:1.2rem;
  padding-bottom:1.2rem;
  width:40%
}

@media(min-width: 993px){
  .contact-form textarea{
    width:120%;
    height:22vw
  }

  .contact-form input[type=text],.contact-form input[type=email]{
    width:120%;
    height:56px
  }

  .contact-form img{
    width:45vw
  }
}

@media(min-width: 768px){
  .contact-image{
    height:inherit
  }

  .contact-image div{
    height:74%
  }

  .contact-image div img{
    -o-object-fit:fill;
       object-fit:fill;
    max-height:40.5rem;
    min-height:100%
  }
}

.cards-items-slider .items-slider-content{
  height:auto
}

.cards-items-slider .items-slider-content .items-body{
  height:inherit;
  overflow:hidden
}

.cards-items-slider .items-slider-content .items-body .item-new-main{
  position:relative;
  width:inherit;
  max-height:inherit
}

.cards-items-slider .items-slider-content .items-body .item-new{
  width:100%;
  max-height:inherit
}

.cards-items-slider .items-slider-content .items-body .items-grid--max-3{
  transition:transform .5s ease 0s;
  white-space:nowrap;
  height:auto
}

.cards-items-slider .items-slider-content .items-body .item-container{
  display:inline-block;
  margin:0 3vw 0 0;
  vertical-align:top;
  width:32%;
  height:40vw
}

.cards-items-slider .items-slider-content .items-body .item-container .item-footer{
  max-width:inherit
}

.cards-items-slider .items-slider-content .items-body .item-container .item-footer p{
  max-width:inherit;
  font-family:Roboto;
  font-style:normal;
  font-weight:normal;
  font-size:20px;
  line-height:30px;
  color:#1d1d1d
}

.cards-items-slider .items-slider-content .items-body .item-container>a{
  text-decoration:none
}

@media(max-width: 992px){
  .cards-items-slider .front-back{
    padding-right:4vw
  }

  .cards-items-slider .items-slider-content .items-body{
    padding:0 3% 0 3.4%
  }

  .cards-items-slider .items-slider-content .items-body .items-grid--max-3{
    margin-top:2%
  }

  .cards-items-slider .items-slider-content .items-body .item-new{
    overflow:auto;
    height:47vh;
    padding-right:1.2rem
  }

  .cards-items-slider .items-slider-content .items-body .item-container{
    width:50%
  }

  .cards-items-slider .items-slider-content .items-body .item-container .item-footer p{
    max-width:inherit;
    font-family:Roboto;
    font-style:normal;
    font-weight:normal;
    font-size:12px;
    line-height:16px;
    color:#1d1d1d
  }
}

@media(min-width: 993px){
  .cards-items-slider .items-slider-content .items-body{
    padding:0 5% 0 0%
  }

  .cards-items-slider .items-slider-content .front-back{
    padding-right:2.3%
  }
}

*{
  -webkit-font-smoothing:subpixel-antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility !important
}

.logo-brand img{
  height:80px;
  isolation:isolate
}

.logo-brand svg{
  height:80px;
  isolation:isolate
}

[data-progress-bar]{
  transition:width .6s
}

@media(min-width: 992px){
  .two-col-text{
    -moz-column-count:2;
         column-count:2;
    -moz-column-gap:20px;
         column-gap:20px
  }
}

hr.blue-block{
  height: 0.5rem;
  --bg-opacity: 1;
  background-color: #63bbce;
  background-color: rgba(99, 187, 206, var(--bg-opacity));
  width:40%;
  border:0
}

@media(min-width: 992px){
  hr.blue-block{
    width:60%
  }
}

.darkmode--activated hr.blue-block{
  --bg-opacity: 1;
  background-color: #cf7763;
  background-color: rgba(207, 119, 99, var(--bg-opacity))
}

.image-holder{
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background-size:cover;
  background-position:center top;
  z-index:-1
}

@media(max-width: 992px){
  .image-holder{
    background-position:center top
  }
}

.darkmode--activated .image-holder{
  filter:invert(1)
}

.darkmode--activated .circle-of-marketing .text-section{
  filter:invert(1)
}

.darkmode--activated .navbar{
  filter:invert(1)
}

.home-background-image{
  background-repeat:no-repeat;
  -webkit-print-color-adjust:exact !important;
  color-adjust:exact !important
}

a.btn,button{
  letter-spacing:0px
}

.right-description{
  font-weight:bold;
  font-size:1.1rem;
  line-height:24px
}

section.our-artists a{
  color:#fff;
  text-decoration:none
}

h3{
  padding-bottom:1.1rem;
  font-family:Roboto;
  font-style:normal;
  font-weight:bold;
  font-size:1.5rem;
  line-height:2rem;
  color:#1d1d1d
}

.explaination{
  padding:3rem
}

@media(max-width: 992px){
  main{
    padding-top:5rem
  }
}

@media(min-width: 993px){
  main{
    padding-top:6rem
  }

  .container{
    width:100%;
    padding-left:1rem;
    padding-right:1rem;
    max-width:1200px;
    margin:0 auto
  }
}

@media (min-width: 768px) {

  .md\:bg-white {
    --bg-opacity: 1;
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, var(--bg-opacity));
  }

  .md\:bg-bg-1 {
    --bg-opacity: 1;
    background-color: #f8f8f8;
    background-color: rgba(248, 248, 248, var(--bg-opacity));
  }

  .md\:block {
    display: block;
  }

  .md\:inline-block {
    display: inline-block;
  }

  .md\:flex {
    display: flex;
  }

  .md\:grid {
    display: grid;
  }

  .md\:hidden {
    display: none;
  }

  .md\:flex-row {
    flex-direction: row;
  }

  .md\:justify-items-end {
    justify-items: end;
  }

  .md\:justify-start {
    justify-content: flex-start;
  }

  .md\:justify-end {
    justify-content: flex-end;
  }

  .md\:order-1 {
    order: 1;
  }

  .md\:order-2 {
    order: 2;
  }

  .md\:order-3 {
    order: 3;
  }

  .md\:order-4 {
    order: 4;
  }

  .md\:order-first {
    order: -9999;
  }

  .md\:order-last {
    order: 9999;
  }

  .md\:float-right {
    float: right;
  }

  .md\:float-none {
    float: none;
  }

  .md\:h-32 {
    height: 8rem;
  }

  .md\:text-lg {
    font-size: 1.125rem;
  }

  .md\:text-3xl {
    font-size: 1.875rem;
  }

  .md\:my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }

  .md\:mt-0 {
    margin-top: 0;
  }

  .md\:mb-0 {
    margin-bottom: 0;
  }

  .md\:mb-1 {
    margin-bottom: 0.25rem;
  }

  .md\:mt-3 {
    margin-top: 0.75rem;
  }

  .md\:ml-4 {
    margin-left: 1rem;
  }

  .md\:mb-5 {
    margin-bottom: 1.25rem;
  }

  .md\:ml-6 {
    margin-left: 1.5rem;
  }

  .md\:mt-8 {
    margin-top: 2rem;
  }

  .md\:mb-8 {
    margin-bottom: 2rem;
  }

  .md\:ml-8 {
    margin-left: 2rem;
  }

  .md\:mt-10 {
    margin-top: 2.5rem;
  }

  .md\:mr-10 {
    margin-right: 2.5rem;
  }

  .md\:mt-16 {
    margin-top: 4rem;
  }

  .md\:mr-16 {
    margin-right: 4rem;
  }

  .md\:ml-16 {
    margin-left: 4rem;
  }

  .md\:mr-20 {
    margin-right: 5rem;
  }

  .md\:ml-20 {
    margin-left: 5rem;
  }

  .md\:mb-24 {
    margin-bottom: 6rem;
  }

  .md\:p-0 {
    padding: 0;
  }

  .md\:p-4 {
    padding: 1rem;
  }

  .md\:p-5 {
    padding: 1.25rem;
  }

  .md\:px-0 {
    padding-left: 0;
    padding-right: 0;
  }

  .md\:py-1 {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
  }

  .md\:px-2 {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }

  .md\:py-8 {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .md\:px-12 {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .md\:pt-0 {
    padding-top: 0;
  }

  .md\:pr-0 {
    padding-right: 0;
  }

  .md\:pb-0 {
    padding-bottom: 0;
  }

  .md\:pl-0 {
    padding-left: 0;
  }

  .md\:pt-2 {
    padding-top: 0.5rem;
  }

  .md\:pr-2 {
    padding-right: 0.5rem;
  }

  .md\:pl-2 {
    padding-left: 0.5rem;
  }

  .md\:pl-3 {
    padding-left: 0.75rem;
  }

  .md\:pt-4 {
    padding-top: 1rem;
  }

  .md\:pr-4 {
    padding-right: 1rem;
  }

  .md\:pb-4 {
    padding-bottom: 1rem;
  }

  .md\:pl-4 {
    padding-left: 1rem;
  }

  .md\:pr-5 {
    padding-right: 1.25rem;
  }

  .md\:pl-5 {
    padding-left: 1.25rem;
  }

  .md\:pb-6 {
    padding-bottom: 1.5rem;
  }

  .md\:pt-8 {
    padding-top: 2rem;
  }

  .md\:pb-8 {
    padding-bottom: 2rem;
  }

  .md\:pl-8 {
    padding-left: 2rem;
  }

  .md\:pt-10 {
    padding-top: 2.5rem;
  }

  .md\:pr-10 {
    padding-right: 2.5rem;
  }

  .md\:pb-10 {
    padding-bottom: 2.5rem;
  }

  .md\:pl-10 {
    padding-left: 2.5rem;
  }

  .md\:pt-12 {
    padding-top: 3rem;
  }

  .md\:pb-12 {
    padding-bottom: 3rem;
  }

  .md\:pl-12 {
    padding-left: 3rem;
  }

  .md\:pt-16 {
    padding-top: 4rem;
  }

  .md\:pb-16 {
    padding-bottom: 4rem;
  }

  .md\:pt-20 {
    padding-top: 5rem;
  }

  .md\:pr-20 {
    padding-right: 5rem;
  }

  .md\:pl-20 {
    padding-left: 5rem;
  }

  .md\:pt-24 {
    padding-top: 6rem;
  }

  .md\:pr-24 {
    padding-right: 6rem;
  }

  .md\:pb-24 {
    padding-bottom: 6rem;
  }

  .md\:pl-24 {
    padding-left: 6rem;
  }

  .md\:pt-32 {
    padding-top: 8rem;
  }

  .md\:pr-32 {
    padding-right: 8rem;
  }

  .md\:pl-32 {
    padding-left: 8rem;
  }

  .md\:pr-40 {
    padding-right: 10rem;
  }

  .md\:pl-40 {
    padding-left: 10rem;
  }

  .md\:absolute {
    position: absolute;
  }

  .md\:relative {
    position: relative;
  }

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

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

  .md\:w-32 {
    width: 8rem;
  }

  .md\:w-48 {
    width: 12rem;
  }

  .md\:w-1\/2 {
    width: 50%;
  }

  .md\:w-1\/3 {
    width: 33.333333%;
  }

  .md\:w-2\/3 {
    width: 66.666667%;
  }

  .md\:w-1\/4 {
    width: 25%;
  }

  .md\:w-2\/4 {
    width: 50%;
  }

  .md\:w-3\/4 {
    width: 75%;
  }

  .md\:w-1\/5 {
    width: 20%;
  }

  .md\:w-2\/5 {
    width: 40%;
  }

  .md\:w-3\/5 {
    width: 60%;
  }

  .md\:w-1\/6 {
    width: 16.666667%;
  }

  .md\:w-full {
    width: 100%;
  }

  .md\:gap-64 {
    grid-gap: 16rem;
    gap: 16rem;
  }

  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media print {

  .print\:block {
    display: block;
  }

  .print\:hidden {
    display: none;
  }

  .print\:h-2 {
    height: 0.5rem;
  }

  .print\:h-64 {
    height: 16rem;
  }

  .print\:mb-2 {
    margin-bottom: 0.5rem;
  }

  .print\:mt-8 {
    margin-top: 2rem;
  }

  .print\:px-1 {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
  }

  .print\:px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .print\:px-16 {
    padding-left: 4rem;
    padding-right: 4rem;
  }

  .print\:pt-0 {
    padding-top: 0;
  }

  .print\:pb-0 {
    padding-bottom: 0;
  }

  .print\:pt-8 {
    padding-top: 2rem;
  }

  .print\:text-center {
    text-align: center;
  }

  .print\:w-1\/3 {
    width: 33.333333%;
  }

  .print\:w-1\/4 {
    width: 25%;
  }

  .print\:w-1\/5 {
    width: 20%;
  }

  .print\:w-2\/5 {
    width: 40%;
  }

  .print\:w-3\/5 {
    width: 60%;
  }

  .print\:w-full {
    width: 100%;
  }
}

/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/frontend/font/roboto/Roboto-Thin.ttf) format('truetype');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/frontend/font/roboto/Roboto-Thin.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/frontend/font/roboto/Roboto-Regular.ttf) format('truetype');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/frontend/font/roboto/Roboto-Regular.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/frontend/font/roboto/Roboto-Medium.ttf) format('truetype');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/frontend/font/roboto/Roboto-Medium.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/frontend/font/roboto/Roboto-Bold.ttf) format('truetype');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/frontend/font/roboto/Roboto-Bold.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/frontend/font/roboto/Roboto-Black.ttf) format('truetype');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/frontend/font/roboto/Roboto-Black.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}