@charset "UTF-8";
:root {
  --logo-color:	#222;
  --font-color:	#404756;
  --font-color-muted: #999;
  --font-nav-color:	#777;
  --color-primary:	#3f8ee9;
  --border-color:	rgba(0, 0, 0, .09);
  --bg-color:	#fff;
  --bg-color-alpha:	rgba(255, 255, 255, .9);
}

/*
.site-header {
    z-index: z('site-header');
}
*/
i, em, .italic {
  font-style: italic;
}

b, strong, .bold {
  font-weight: 600;
}

::selection {
  color: rgba(0, 0, 0, 0.7);
  background: #ffe697;
}

p {
  font-size: 1.125rem;
  margin: 0 0 1rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 500;
  margin: 0;
}
h1.serif,
h2.serif,
h3.serif,
h4.serif,
h5.serif,
h6.serif {
  font-weight: 400;
}
h1 + p,
h2 + p,
h3 + p,
h4 + p,
h5 + p,
h6 + p {
  margin-top: 1rem;
}

h1, .h1 {
  font-size: 2.5rem;
  font-size: clamp(2.0rem, 5vw, 4.0rem);
  line-height: 1.125;
}

.hx {
  font-size: clamp(2.75rem, 5vw, 5rem);
}

h2, .h2 {
  font-size: 2rem;
  font-size: clamp(1.875rem, 5vw, 2.875rem);
  line-height: 1.125;
}

h3, .h3 {
  font-size: 1.5rem;
  font-size: clamp(1.5rem, 5vw, 2rem);
  line-height: 1.35;
}

h4, .h4 {
  font-size: 1.125rem;
  font-size: clamp(1.125rem, 5vw, 1.3125rem);
  line-height: 1.35;
}

h5, .h5 {
  font-size: 1.125rem;
}

h6, .h6 {
  font-size: 0.875rem;
}

.overline, .tagline {
  font-size: 0.875rem !important;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(64, 71, 86, 0.5) !important;
}

.title {
  font-family: -apple-system-ui-serif, "Vollkorn", "Georgia", serif;
  font-style: italic;
  font-weight: 400;
  line-height: 1.125;
  margin: 0;
}
.title + .button {
  margin: 1rem 0 0;
}
.title a {
  color: currentColor;
}
.title a:hover {
  color: #39a9e0;
}
.title mark::after {
  left: -8px;
  bottom: 0.325em;
  height: 0.325em;
  width: calc(100% + 16px);
  transform: rotate(-0.65deg);
}
.title em {
  color: #39a9e0;
}
@media screen and (min-width: 992px) {
  .title span {
    display: block;
  }
}

.subtitle {
  font-size: clamp(1rem, 5vw, 1.25rem);
  font-weight: 400;
  color: rgba(64, 71, 86, 0.5);
  margin: 0 0 1rem;
}
.subtitle a {
  display: inline-block;
  color: currentColor;
  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}
.subtitle mark {
  color: #404756;
}
.subtitle + p {
  margin-top: 4vmin;
}

.heading {
  display: block;
  font-family: system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-size: 1.25rem;
  font-weight: 500;
  font-style: normal;
  margin: 0;
}

.sans {
  font-family: system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-weight: 400;
}

.serif {
  font-family: -apple-system-ui-serif, "Vollkorn", "Georgia", serif;
  font-weight: 400;
}

.currency {
  display: inline-block;
  font-size: 35%;
  vertical-align: middle;
  margin-left: 3px;
}

mark, .mark {
  position: relative;
  font-weight: inherit;
  color: currentColor;
  white-space: nowrap;
  background: none;
  z-index: 10;
}
mark::after, .mark::after {
  content: "";
  display: inline-block;
  left: 0;
  bottom: 0;
  position: absolute;
  height: 0.6em;
  width: 100%;
  background-color: #ffe385;
  z-index: -1;
}

small, .small {
  font-size: 0.85rem;
}

blockquote {
  position: relative;
  padding: 0 0 0 1.5rem;
}
blockquote::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: auto;
  background: #ddd;
  border-radius: 8px;
  width: 8px;
}
blockquote *:last-child {
  margin-bottom: 0;
}
blockquote p {
  font-size: 1rem;
  font-style: italic;
  margin-bottom: 0;
}
blockquote footer {
  line-height: 1.5;
  color: rgba(64, 71, 86, 0.5);
}
blockquote footer::before {
  content: "";
  display: inline-block;
  font-family: "Font Awesome 5 Pro";
  font-size: 12px;
  font-weight: 900;
  margin: 2px 6px 0 0;
  opacity: 0.8;
}
blockquote + * {
  margin-top: 1.5rem;
}

.terms-ol {
  list-style: none;
  counter-reset: my-awesome-counter;
  margin: 20px 0 0 0;
  padding: 0;
  width: 100%;
  column-count: 2;
  column-gap: 10px;
}
.terms-ol li {
  counter-increment: my-awesome-counter;
  display: flex;
  width: 100%;
  font-size: 1.1rem;
  margin-bottom: 1rem;
  padding-right: 20px;
}
.terms-ol li::before {
  content: "" counter(my-awesome-counter);
  font-size: 3rem;
  font-family: -apple-system-ui-serif, "Vollkorn", "Georgia", serif;
  margin-right: 1rem;
  line-height: 1;
  color: #39a9e0;
  min-width: 50px;
}

.specialterms {
  margin-bottom: 30px;
}

@media screen and (max-width: 992px) {
  .terms-ol {
    column-count: 1;
    column-gap: 0px;
  }
  .terms-ol li {
    padding-right: 0px;
  }
  .terms-ol li::before {
    font-size: 2rem;
    min-width: 30px;
  }
}
*, *::before, *::after {
  box-sizing: border-box;
}

html, body {
  height: 100%;
}

html {
  font-size: 100%;
  box-sizing: border-box;
  background-color: #fff;
}

body {
  font-family: system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  color: #404756;
  line-height: 1.5;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  background: none;
  background-color: #222;
}

section,
article,
aside,
figure,
figcaption,
header,
footer,
hgroup,
main,
menu,
nav,
details,
summary {
  display: block;
}

a {
  color: #39a9e0;
  text-decoration: none;
  transition: color 0.3s ease;
}
a:hover {
  color: #4fb3e3;
}
a.currentColor {
  color: currentColor;
}
a.currentColor:hover {
  color: #39a9e0;
}

button {
  cursor: pointer;
  appearance: none;
  font-family: system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-size: 1rem;
  text-transform: inherit;
  padding: 0;
  border: 0;
  background: none;
  outline: none;
  transition: color 0.3s ease;
}

figure {
  position: relative;
  padding: 0;
  margin: 0;
}

figcaption {
  padding: 0;
}

img,
svg,
object,
video {
  display: inline-block;
  max-width: 100%;
  height: auto;
  border: 0;
  vertical-align: bottom;
}

address {
  font-family: system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-style: normal;
  margin: 0 0 1.5rem;
}

ul, ol {
  font-size: 1.125rem;
  line-height: 1.5;
  padding: 0 0 0 1.5rem;
  margin: 1.5rem 0;
}
ul li, ol li {
  padding: 0;
  margin: 0;
}
ul.list-none, ol.list-none {
  padding: 0;
  margin: 0;
  list-style: none;
}
ul.list-inline, ol.list-inline {
  padding: 0;
  margin-bottom: 0;
  list-style: none;
}
ul.list-inline-block, ol.list-inline-block {
  padding: 0;
  margin: 0;
}
ul.list-inline-block li, ol.list-inline-block li {
  display: inline-block;
  margin: 0 1.5rem 0 0;
}

ol {
  list-style: decimal;
}

dl {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  margin: 0 0 1.5rem;
}
dl dt, dl dd {
  flex: 1 1 50%;
  padding: 0.5rem 0;
}
dl dt:not(:last-of-type), dl dd:not(:last-of-type) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}
dl dt {
  font-weight: 500;
}
dl dd {
  text-align: right;
  margin: 0;
}

hr {
  padding: 0;
  margin: 1.5rem 0;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}

.row > div {
  position: relative;
}

a.logo {
  position: absolute;
  left: 50%;
  display: inline-block;
  color: var(--logo-color);
  text-align: center;
  height: auto;
  width: 100%;
  padding: 1.25rem 0;
  margin-left: -48px;
  max-width: 96px;
}
a.logo:hover {
  color: #39a9e0;
}
a.logo > svg {
  max-width: 96px;
}
a.logo > svg path {
  fill: currentColor;
}
@media screen and (min-width: 992px) {
  a.logo {
    position: relative;
    left: auto;
    text-align: left;
    margin-left: 0;
    margin-right: 0.75rem;
    max-width: 160px;
  }
  a.logo > svg {
    max-width: 110px;
  }
}

.nav__container {
  color: currentColor;
  line-height: 1;
  display: none;
  position: absolute;
  top: 60px;
  left: 0;
  width: 100%;
  height: calc(100vh - 60px);
  padding: 1.5rem 0;
  text-align: center;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(5px);
  z-index: 100;
}
@media screen and (min-width: 992px) {
  .nav__container {
    position: relative;
    display: block;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: auto;
    height: auto;
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0 0.75rem;
    backdrop-filter: none;
    background: none;
  }
}

body.js-nav-open {
  overflow: hidden;
}
body.js-nav-open .nav__container {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  body.js-nav-open .nav__container {
    display: flex;
    flex-direction: row;
  }
}

.nav__main {
  text-align: left;
  padding: 0;
  margin: 0;
  list-style: none;
}
.nav__main a, .nav__main button {
  display: block;
  font-size: 1.5rem;
  font-weight: 500;
  color: currentColor;
}
.nav__main a:hover, .nav__main a:focus, .nav__main button:hover, .nav__main button:focus {
  color: #39a9e0;
}
.nav__main > li {
  position: relative;
  padding: 0 1.5rem;
  margin-bottom: 2rem;
}
.nav__main > li > a {
  color: #222;
}
@media screen and (min-width: 768px) {
  .nav__main {
    flex: unset;
    text-align: center;
  }
  .nav__main > li {
    display: inline-block;
    padding: 0;
    margin: 0;
  }
  .nav__main > li > a {
    color: currentColor;
  }
  .nav__main a, .nav__main button {
    font-size: 0.875rem;
    padding: 1.25rem 1rem;
    border-radius: 0;
    border: 0;
  }
}
.nav__main ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
.nav__main ul li {
  padding: 0;
}
@media screen and (min-width: 768px) {
  .nav__main li.separator {
    padding-bottom: 0.35rem;
    margin-bottom: 0.35rem;
    border-bottom: 1px solid #444;
  }
  .nav__main li:hover ul {
    opacity: 1;
    pointer-events: all;
    transform: translate(-50%, 0);
  }
  .nav__main ul {
    display: block;
    position: absolute;
    top: 3.5rem;
    left: 50%;
    color: #fff;
    line-height: 1.875;
    padding: 0.75rem 0;
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.98);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.09);
    opacity: 0;
    transition: 0.35s ease;
    transform: translate(-50%, 5px);
    pointer-events: none;
  }
  .nav__main ul::before {
    content: "";
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    height: 0;
    width: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid rgba(0, 0, 0, 0.98);
  }
  .nav__main ul li {
    display: block;
  }
  .nav__main ul a {
    display: block;
    padding: 0 2rem;
  }
}

.nav__user {
  color: currentColor;
  text-align: right;
  line-height: 1;
  max-width: 160px;
}
.nav__user .userimg {
  display: inline-block;
  vertical-align: middle;
  margin-left: 0.35rem;
}
@media screen and (min-width: 992px) {
  .nav__user {
    margin-left: 0.75rem;
  }
}

.nav__button__container {
  display: block;
}
@media screen and (min-width: 992px) {
  .nav__button__container {
    display: none;
  }
}

button.nav__button {
  position: relative;
  top: -2px;
  color: currentColor;
  line-height: 1;
  padding: 0;
  margin: 0;
  text-align: center;
  transition: color 0.3s ease;
  background: none;
}
button.nav__button:hover, button.nav__button:active {
  color: currentColor;
}
button.nav__button.is-active .nav__button__icon {
  background: none;
}
button.nav__button.is-active .nav__button__icon::before, button.nav__button.is-active .nav__button__icon::after {
  top: 0;
  width: 100%;
  transform: rotate(45deg);
}
button.nav__button.is-active .nav__button__icon::after {
  transform: rotate(-45deg);
}

.nav__button__icon {
  position: relative;
  display: inline-block;
  color: currentColor;
  width: 22px;
  height: 2px;
  padding: 0;
  margin: 0;
  background: currentColor;
  vertical-align: middle;
  transition: background 0.3s ease;
  z-index: 100;
}
.nav__button__icon::before, .nav__button__icon::after {
  content: "";
  display: block;
  height: 2px;
  position: absolute;
  background: currentColor;
  transition: background-color 0.3s ease, transform 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.nav__button__icon::before {
  top: -8px;
  left: 0;
  width: 100%;
}
.nav__button__icon::after {
  top: 8px;
  left: 0;
  width: 80%;
}

.nav__search {
  display: block;
  flex: 1;
  justify-self: flex-end;
  padding: 0 1.5rem;
}
.nav__search .search__input {
  cursor: pointer;
  font-family: system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-size: 0.875rem;
  color: rgba(64, 71, 86, 0.5);
  text-transform: none;
  padding: 5px 10px;
  padding-left: 32px;
  width: 100%;
  border: 0;
  background-position: 10px 48%;
  background-color: transparent;
  transition: 0.35s ease;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.09);
}
.nav__search .search__input:focus {
  background-color: white;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.09);
}

.sub__search {
  display: inline-block;
  margin-right: 0.5rem;
  max-width: 14rem;
}
.sub__search .search__input {
  border-color: transparent;
  background-color: #f1f1f1;
}

.search__results {
  color: rgba(64, 71, 86, 0.5);
  font-weight: 500;
  padding: 0 0 1.5rem;
  margin: 0;
  list-style: none;
}
.search__results li {
  display: inline-block;
  margin-right: 1.5rem;
}

.nav__sub {
  display: flex;
  align-items: center;
  position: relative;
  list-style: none;
  text-transform: uppercase;
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0 1.5rem 1.5rem 0;
  margin: 0.5rem -1.5rem 0 0;
  white-space: nowrap;
  overflow-y: hidden;
  overflow-x: auto;
}
.nav__sub li {
  display: inline-block;
  text-align: center;
  color: rgba(64, 71, 86, 0.5);
  padding: 0;
  margin: 0 0.75rem 0 0;
}
.nav__sub li.nav__options {
  flex: 1;
  text-align: right;
  align-self: flex-start;
  margin-right: 1rem;
}
.nav__sub li.nav__options .sub__search {
  position: relative;
  top: 1px;
}
.nav__sub li:hover, .nav__sub li.active {
  color: #39a9e0;
}
.nav__sub a:not(.button) {
  display: block;
  color: currentColor;
  font-size: 0.875rem;
  line-height: 1.35;
  padding: 0.5rem 1.125rem;
  border-radius: 3px;
  border: 1px solid rgba(51, 51, 51, 0.15);
  background-color: #fff;
}
@media screen and (min-width: 768px) {
  .nav__sub {
    font-weight: 600;
    padding: 0;
    margin: 0.75rem -1rem 0;
  }
  .nav__sub li {
    padding: 0;
    margin: 0;
  }
  .nav__sub li:not(.nav__options)::after {
    content: "";
    display: block;
    margin: auto;
    height: 3px;
    width: 0;
    background: transparent;
    transition: width 0.5s ease, background-color 0.5s ease;
  }
  .nav__sub li:not(.nav__options):hover::after, .nav__sub li:not(.nav__options).active::after {
    width: 20px;
    background: #39a9e0;
  }
  .nav__sub li:not(.nav__options).active a {
    background: none;
  }
  .nav__sub li:not(.nav__options) a:not([class]) {
    line-height: 1.5;
    padding: 0.5rem 0.875rem;
    border: 0;
    background: none;
  }
}

.tabs {
  position: relative;
  display: flex;
  flex-wrap: wrap;
}
.tabs .button--save {
  top: 0.5rem;
}

.tabs__label {
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  color: #888;
  padding: 0.5rem 0;
  margin: 0;
  width: 100%;
  transition: color 0.1s;
}
@media (min-width: 768px) {
  .tabs__label {
    width: auto;
    padding: 0;
    margin: 0 1.5rem 0 0;
  }
  .tabs__label::after {
    content: "";
    display: block;
    margin: 10px auto 0;
    width: 0;
    height: 3px;
    background: transparent;
    transition: width 0.5s ease, background-color 0.5s ease;
  }
  .tabs__label:hover::after {
    width: 32px;
    background: #39a9e0;
  }
}

.tabs__input {
  position: absolute;
  opacity: 0;
}
.tabs__input:focus + .tabs__label {
  z-index: 1;
}
.tabs__input:checked + .tabs__label {
  color: #39a9e0;
}
.tabs__input:checked + .tabs__label::after {
  width: 32px;
  background: #39a9e0;
}

.tabs__panel {
  display: none;
  padding: 1.5rem 0;
  background-color: #fff;
}
@media (min-width: 768px) {
  .tabs__panel {
    order: 99;
  }
}

.tabs__input:checked + .tabs__label + .tabs__panel {
  display: block;
  width: 100%;
}

@media screen and (max-width: 768px) {
  .nav__sub {
    display: block;
    white-space: normal;
    padding: 0;
    margin: 0;
    margin-block-start: 0em;
    margin-block-end: 0em;
    align-items: center;
    justify-content: center;
  }
  .nav__sub a:not(.button) {
    width: 100%;
  }
  .nav__sub li {
    display: block;
    margin-bottom: 5px;
    width: 100%;
    text-align: center;
  }
}
/*
.menu {
	position: absolute;
	top: 1.5rem;
	left: 1.5rem;
	cursor: pointer;
	display: inline-block;
	width: 24px;
	height: 24px;
	margin-right: 1.5rem;
	z-index: 400;
	transition: opacity 0.3s ease;

	&:hover {
		.menu__bars {
			&::before,
			&::after {
				width: 24px;
			}
		}
	}

	&.active {
		.menu__bars {
			background: none;
			&::before,
			&:after {
				top: 0;
				width: 24px;
				transform: rotate(45deg);
				background: $color-text;
			}
			&::after {
				transform: rotate(-45deg);
			}
			&:hover {
				transform: scale(1.2);
			}
		}
	}

	@media screen and (min-width: $screen-md) {
		display: none;
	}
}

.menu__bars {
	display: block;
	position: relative;
	width: 24px;
	height: 4px;
	margin: 10px 0;
	border-radius: 4px;
	background: $color-primary;
	transition: all 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55);

	&::before,
	&::after {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		width: 24px;
		height: 4px;
		border-radius: 4px;
		background: $color-primary;
		transition: all 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
	}

	&::before {
		top: -8px;
		width: 20px;
	}

	&::after {
		top: 8px;
		width: 14px;
	}
}

// Panels
body {
	&.show-panel-nav,
	&.show-panel-notes {
		overflow: hidden;
		.shade {
			opacity: 1;
			transform: translate3d(0, 0, 0);
		}
	}
	&.show-panel-nav {
		.panel--nav {
			transform: translate3d(0, 0, 0);
		}
	}
	&.show-panel-notes {
		.menu {
			opacity: 0;
			pointer-events: none;
		}
		.panel--notes {
			transform: translate3d(0, 0, 0);
		}
	}
	&.show-search {
		overflow: hidden;
		.shade {
			opacity: 1;
			transform: translate3d(0, 0, 0);
			transition: opacity 0.15s ease;
		}
		.search {
			opacity: 1;
			transform: translate3d(0, 0, 0);
			transition: opacity 0.15s ease;
		}
	}
}

.panel {
	position: absolute;
	top: 0;
	height: 100vh;
	width: 85vw;
	background: #fff;
	transition: 0.3s ease;
	z-index: 200;
	&--nav {
		left: 0;
		transform: translate3d(-100vw, 0, 0);
		box-shadow: 10px 2px 17px rgba(0, 0, 0, 0.2);
	}
	&--notes {
		right: 0;
		transform: translate3d(100vw, 0, 0);
		box-shadow: -10px -2px 17px rgba(0, 0, 0, 0.2);
	}

	@media screen and (min-width: $screen-md) {
		width: 400px;
	}
}

.panel__header {
	padding: 1.25rem 1.5rem;
	min-height: 68px;
	max-height: 68px;
	border-bottom: 1px solid #eee;
}

.panel__content {
	padding: 1.5rem;
}

.panel__search {
	padding: 1.5rem 1rem 1rem;
	.search__input {
		border: 0;
		background-color: #f1f1f1;
		&:focus {
			background-color: #f1f1f1;
		}
	}
}

.panel__nav {
	padding: 0;
	margin: 0;
	list-style: none;
	li:not(:first-child) {
		border-top: 1px solid #eee;
	}
	a {
		display: block;
		font-size: 1.125rem;
		color: currentColor;
		padding: 0.75rem 1.5rem;
		&:hover {
			color: $color-primary;
		}
	}
}

// tint the screen while panel is active
.shade {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	background-color: rgba(0, 0, 0, 0.8);
	transform: translate3d(0, -100vh, 0);
	transition: opacity 0.3s ease;
	z-index: 150;
}

@media screen and (min-width: $screen-md) {
	.button.js-toggle-nav,
	.nav__mobile {
		display: none;
	}
}
*/
.site__header {
  position: relative;
  color: var(--font-nav-color);
  text-align: left;
  text-transform: uppercase;
  line-height: 1;
  padding: 1rem 0;
  width: 100%;
  background: var(--bg-color);
  box-shadow: 0 0 2px 1px var(--border-color);
  z-index: 100;
}
.site__header .inner, .site__header .banner__content {
  display: flex;
  align-items: center;
}
.site__header .inner > *, .site__header .banner__content > * {
  flex: 1;
}
@media screen and (min-width: 992px) {
  .site__header {
    position: fixed;
    top: 0;
    left: 0;
    padding: 0.5rem 0;
    background: var(--bg-color-alpha);
    backdrop-filter: blur(5px);
  }
}

.site__content {
  position: relative;
  text-align: left;
  min-height: 100vh;
  background-color: #fff;
}
@media screen and (min-width: 992px) {
  .site__content {
    padding-top: 77px;
  }
}

.site__footer {
  color: #5f626c;
  padding: 1.5rem 0 3rem;
  background-color: #222;
}
.site__footer [class*=col-] {
  margin-top: 1.5rem;
}
.site__footer .list-inline {
  padding: 0;
  margin: 0;
  line-height: 1.8;
}
.site__footer h6 {
  font-weight: 600;
  text-transform: uppercase;
  color: #9599a2;
  margin-bottom: 0.5rem;
}
.site__footer a {
  color: currentColor;
}
.site__footer a:hover {
  color: #39a9e0;
}
.site__footer a.brand:hover {
  color: #fff;
}
.site__footer hr {
  border-color: rgba(0, 0, 0, 0.25);
}

section, .section {
  padding-bottom: 8vmin;
}
section.bg + section, section.bg .section, .section.bg + section, .section.bg .section {
  padding-top: 8vmin;
}

.bg {
  position: relative;
  padding-top: 8vmin;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-color: #f2f9ff;
  background-image: linear-gradient(to bottom, #f2f9ff, #fff);
}

.bg--gradient {
  background-color: #e3f2ff;
  background-image: linear-gradient(to bottom, #f2f9ff 0%, #f9f9f9 100%);
}

.inner, .banner__content {
  margin: 0 auto;
  padding: 0 0.75rem;
  max-width: 1488px;
}
.inner--narrow {
  max-width: 52rem;
}
.inner--flex {
  display: flex;
  align-items: center;
}
.inner--flex > * {
  flex: 1;
}
.inner--center {
  position: relative;
  display: flex;
  height: 100%;
}
.inner--center > div {
  margin: auto;
}
@media screen and (min-width: 480px) {
  .inner, .banner__content {
    padding: 0 1.5rem;
  }
}

.article {
  padding: 8vmin 0;
}
.article .header {
  padding: 0 0 4vmin;
}
.article > h3 {
  margin-top: 4vmin;
}
.article--grid {
  column-gap: 3rem;
  row-gap: 4vmin;
  grid-template-columns: repeat(4, 1fr);
}
.article--grid .content {
  grid-column: 1/4;
  margin: 0 0 0 0;
}
.article--grid .content figure {
  margin-bottom: 1.5rem;
}
.article--grid .content figure:first-child {
  margin-bottom: 3rem;
}
.article--grid .content figure .contestimage {
  width: 100%;
  height: auto;
}
.article--grid .aside {
  grid-column: 4;
  min-width: 18rem;
}
.article--grid .aside .card {
  margin-bottom: 1.5rem;
}
@media screen and (min-width: 1280px) {
  .article--grid {
    display: grid;
  }
  .article--grid .header {
    grid-column: 1/-1;
    padding: 0;
  }
  .article--grid .content {
    margin: 0 40px 0 0;
  }
}

.contest-create .container-preview {
  width: 100% !important;
}

.container-preview .fcx-profile-info {
  max-width: 180px !important;
}

.header {
  padding: 8vmin 0 4vmin;
}
.header .icon {
  color: #39a9e0;
  margin-bottom: 1.5rem;
}

.header__group {
  display: flex;
  align-items: center;
}
.header__group .userimg {
  margin: 0 1.5rem 1rem -0.5rem;
}
.header__group .userimg + .title {
  margin: 0;
}

.flexi {
  display: flex;
}
.flexi > * {
  flex: 1 1 50%;
}
.flexi > *:last-child {
  margin-left: 2rem;
}
.flexi figure {
  flex-basis: 20%;
}

.flex {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: stretch;
  justify-content: center;
  margin: 0 -1rem;
}
.flex--start {
  justify-content: flex-start;
}
.flex .flex__item,
.flex .item {
  flex: 1;
  position: relative;
  margin: 0 1rem 1rem;
}

.row--list {
  margin-top: 8vmin;
}
@media screen and (max-width: 768px) {
  .row--list [class*=col-] {
    margin: 1.5rem 0;
  }
}
.row--flex [class*=col-] {
  display: flex;
}
.row--gap {
  margin: -1.5rem;
}
.row--gap [class*=col-] {
  padding: 1.5rem;
}

.col-flex {
  display: flex;
  justify-content: center;
}
.col-flex > .card {
  margin: auto;
  max-width: 22rem;
}
.col-flex > .card .card__content {
  padding: 2.25rem;
}

.fcx-profile-info {
  width: 200px !important;
}

.static_meta {
  bottom: 0 !important;
}
.static_meta .counter__visual {
  margin-right: 5px;
  margin-bottom: 2px;
}
.static_meta .counter__visual p {
  font-size: 0.8rem;
  margin: 0 0 5px;
  text-align: right;
}
.static_meta .counter__visual .counter__visual__bar span::after {
  display: none;
}

@media screen and (max-width: 480px) {
  .static_meta .fcx-gallery__meta__title {
    display: none;
  }

  #result-page {
    display: none;
  }
}
.my_votes {
  width: 100%;
  text-align: right;
  position: absolute;
  top: 15px;
  right: 15px;
}
.my_votes i {
  color: #fff;
  font-size: 1.5rem !important;
}

.final_votes {
  flex: 1;
  padding: 0;
  min-width: 115px;
}
.final_votes p {
  color: #fff;
  font-size: 0.8rem;
  margin: 5px 0 0;
  text-align: right;
}
.final_votes i {
  color: #fff;
}

.voting-backlink {
  text-align: left;
}
.voting-backlink p {
  font-size: 0.8rem;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.voting-backlink p a {
  color: #888;
}

.voting_user_proposalinfo {
  display: flex;
  flex-direction: row;
}
.voting_user_proposalinfo .voting-proposalinfo {
  text-align: right;
  margin-bottom: 10px;
  margin-top: 20px;
  width: 50%;
}
.voting_user_proposalinfo .voting-proposalinfo p {
  font-size: 0.85rem;
  margin: 0;
  color: #888;
  line-height: 1.1;
}
.voting_user_proposalinfo .userimg {
  width: 50%;
}

@media screen and (max-width: 992px) {
  .voting_user_proposalinfo {
    flex-direction: column;
  }
  .voting_user_proposalinfo .voting-proposalinfo {
    text-align: left;
    width: 100% !important;
  }
  .voting_user_proposalinfo .userimg {
    width: 100% !important;
  }
}
.voting_overlay {
  position: fixed;
  display: flex;
  justify-content: center;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  z-index: 101;
  background-color: rgba(0, 0, 0, 0.5);
}

.voting_overlay-content {
  position: absolute;
  top: 25%;
  bottom: 50%;
  background-color: #fff;
  width: 550px;
  height: fit-content;
  box-shadow: 0 0 3px 3px var(--border-color);
  text-align: center;
  padding: 50px 40px;
}
.voting_overlay-content .button--lg {
  width: 100%;
}
.voting_overlay-content .button + .button {
  margin-left: 0rem;
}

@media screen and (max-width: 992px) {
  .voting_overlay-content {
    width: 80%;
    margin-top: 100px;
  }
}
.padding_b_zero {
  padding-bottom: 0px !important;
}

.padding_t_zero {
  padding-top: 0px !important;
}

@media screen and (min-width: 640px) {
  .homepagebanner {
    padding-top: 120px !important;
    padding-bottom: 80px !important;
  }
  .homepagebanner .button {
    margin-top: 40px;
  }
}
form, fieldset {
  text-align: left;
  padding: 0;
  margin: 0;
  border: 0;
}

.field,
.form__item {
  width: 100%;
  margin-bottom: 1.5rem;
}
.field input, .field select, .field textarea,
.form__item input,
.form__item select,
.form__item textarea {
  width: 100%;
}

.form .row {
  margin-bottom: 1rem;
}
.form .row .field,
.form .row .form__item {
  margin: 0;
}

label {
  display: block;
  font-size: 0.875rem;
  font-weight: bold;
  color: rgba(64, 71, 86, 0.5);
  margin: 0 0 0.5em;
}
label .req {
  color: #E64A19;
}

::placeholder {
  color: rgba(64, 71, 86, 0.5);
}

input,
select,
textarea {
  appearance: none;
  white-space: nowrap;
  display: block;
  font-size: 1rem;
  color: #888;
  padding: 0.5rem 0.75rem;
  margin: 0;
  border: 1px solid rgba(0, 0, 0, 0.09);
  border-radius: 3px;
  background-color: #fff;
  outline: none;
  transition: background-color 0.35s ease;
}
input:focus,
select:focus,
textarea:focus {
  background-color: #f2f9ff;
}
input.disabled, input:disabled,
select.disabled,
select:disabled,
textarea.disabled,
textarea:disabled {
  cursor: default;
  opacity: 0.7;
  resize: none;
  pointer-events: none;
  user-select: none;
}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus {
  border-color: inherit !important;
  background: #f2f9ff !important;
  box-shadow: none;
}
input.no-label,
select.no-label,
textarea.no-label {
  margin-top: 1.25rem;
}

input[type=search] {
  font-family: system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-size: 0.875rem;
  line-height: 2.6;
  font-weight: 500;
  max-height: 38px;
  background-size: 14px;
  background-position: 14px center;
  background-repeat: no-repeat;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding-right: 3rem;
  min-height: 37px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="%23d1d1d1" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>') center right no-repeat;
}
select:focus {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="%23a1a5ac" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>');
}

textarea {
  font-family: system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  padding: 12px;
  min-height: 10rem;
  max-height: 50vh;
  resize: vertical;
  overflow-x: hidden;
  white-space: pre-line;
}
textarea:focus {
  background: #fff;
}

.form-checkboxes label {
  display: inline-block;
  margin-right: 1rem;
}

input[type=checkbox],
input[type=radio] {
  margin: 0 2px 0 0;
}

@supports (appearance: none) or (-webkit-appearance: none) or (-moz-appearance: none) {
  input[type=checkbox],
input[type=radio] {
    position: relative;
    top: 4px;
    appearance: none;
    overflow: hidden;
    outline: none;
    cursor: pointer;
  }
  input[type=checkbox].toggle,
input[type=radio].toggle {
    top: 0px;
    width: 2rem;
    height: 1.12rem;
    margin-right: 0.25rem;
    background: #bbbbbb;
    border-radius: 3rem;
    outline: none;
    border-color: #bbbbbb;
    transition: all 0.3s ease;
    vertical-align: middle;
  }
  input[type=checkbox].toggle::after,
input[type=radio].toggle::after {
    content: "";
    position: absolute;
    width: 1rem;
    height: 1rem;
    border-radius: 0.75rem;
    background: #fff;
    transform: scale(0.83);
    left: 1px;
    transition: all 0.2s ease-in-out;
    margin-bottom: 0.2rem;
  }
  input[type=checkbox].toggle:checked,
input[type=radio].toggle:checked {
    background: #39a9e0;
    border-color: #39a9e0;
  }
  input[type=checkbox].toggle:checked::after,
input[type=radio].toggle:checked::after {
    left: calc(100% - 1rem - 2px);
  }
  input[type=checkbox].toggle--red:checked, input[type=checkbox].toggle--contra:checked,
input[type=radio].toggle--red:checked,
input[type=radio].toggle--contra:checked {
    background: #E64A19;
  }
  input[type=checkbox].toggle--green:checked, input[type=checkbox].toggle--pro:checked,
input[type=radio].toggle--green:checked,
input[type=radio].toggle--pro:checked {
    background: #00C853;
  }

  input[type=checkbox]:not([class])::before,
input[type=radio]:not([class])::before {
    content: "";
    display: block;
    width: 1.125rem;
    height: 1.125rem;
    border-radius: 3px;
    border: 2px solid rgba(0, 0, 0, 0.145);
    transition: 0.3s ease;
  }
  input[type=checkbox]:not([class])::after,
input[type=radio]:not([class])::after {
    content: "";
    position: absolute;
    display: block;
    transition: 0.3s ease;
    opacity: 0;
  }
  input[type=checkbox]:not([class]):focus::before,
input[type=radio]:not([class]):focus::before {
    border-color: #aaa;
  }
  input[type=checkbox]:not([class]):checked::before,
input[type=radio]:not([class]):checked::before {
    border-color: #39a9e0;
  }
  input[type=checkbox]:not([class]):checked::after,
input[type=radio]:not([class]):checked::after {
    opacity: 1;
  }

  input[type=checkbox]:not([class])::after {
    top: -1px;
    left: 6px;
    width: 6px;
    height: 10px;
    transform: rotate(45deg);
    background-color: transparent;
    box-shadow: 3px 3px 0px 0px #39a9e0;
  }

  input[type=radio]:not([class])::before {
    border-radius: 50%;
  }
  input[type=radio]:not([class])::after {
    top: 5px;
    left: 5px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #39a9e0;
  }
}
.form--comment {
  display: flex;
  flex-direction: column;
  margin: 1.5rem 0;
}
.form--comment .comment--content {
  width: 100%;
  display: flex;
  align-items: flex-start;
}
.form--comment .comment--content .field {
  padding: 0.5rem;
  border-radius: 3px;
  border: 1px solid rgba(0, 0, 0, 0.09);
  margin-bottom: 1rem;
}
.form--comment .comment--content .userimg + .field--compose {
  margin-left: 1.5rem;
}
.form--comment .comment--content textarea {
  padding: 0;
  min-height: 40px;
  border-color: transparent;
}
.form--comment .foto-comment-button {
  width: 100%;
  display: flex;
  flex-direction: row-reverse;
}

.form__errors li {
  font-size: 0.875rem;
  color: #E64A19;
  margin: 0.35rem 0;
}

.field ul {
  list-style: none;
  padding: 0;
  margin: 0 0 0.35rem;
}
.field li {
  font-size: 0.875rem;
  color: #E64A19;
}

.contestformerror {
  color: #E64A19;
  border: 1px solid #E64A19;
}

.contestformerror-text {
  color: #E64A19;
  text-align: right;
  padding-bottom: 5px;
}

.button--dropdown {
  position: relative;
  display: inline-block;
}
.button--dropdown i {
  padding-left: 5px;
}

.button--dropdown-content {
  display: none;
  position: absolute;
  background-color: #fff;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  padding: 15px 16px 0px 0px;
  z-index: 5000;
  margin-top: 10px;
  margin-left: -20px;
}
.button--dropdown-content p {
  font-size: 0.875rem;
  padding: 0px 20px;
}
.button--dropdown-content p a {
  padding: 0px !important;
  border-radius: none !important;
  border: none !important;
  background-color: none !important;
}

.button--dropdown:hover .button--dropdown-content {
  display: block;
  position: fixed;
}

.galerie_dropdown_pagination {
  display: flex;
  justify-content: center;
}
.galerie_dropdown_pagination span {
  margin-top: 12px;
  padding: auto 0;
}

.dropdownmenu_galerie {
  margin-left: 10px;
}

.dd-dropdown a {
  text-decoration: none;
}

.dd-dropdown {
  list-style: none;
  padding-left: 0;
  margin: 0 0 10px 0;
  padding: 0.4rem;
}

.dd-dropdown .fas {
  padding-top: 2px !important;
  margin-left: 5px;
  font-size: 1rem;
  float: right;
}

.dd-dropdown li {
  font-size: 0.9rem;
  color: #888;
  padding: 0.3rem 0.5rem;
  margin: 0;
  border: 1px solid rgba(0, 0, 0, 0.09);
  border-radius: 3px;
  border-width: 1px 1px 1px 1px;
  background-color: #fff;
  display: block;
  float: left;
  position: relative;
  text-decoration: none;
  transition-duration: 0.5s;
  width: 240px;
}

.dd-dropdown li a {
  color: #404756;
}

.dd-dropdown li:hover, .dd-dropdown li:focus-within {
  background-color: #fff;
  color: #39a9e0;
  cursor: pointer;
}

.dd-dropdown li:focus-within a {
  outline: none;
  cursor: pointer;
}

.dd-dropdown li ul {
  visibility: hidden;
  opacity: 0;
  width: 113%;
  position: absolute;
  transition: all 0.5s ease;
  margin-top: 0.4rem;
  margin-left: -25px;
  left: 0;
  display: none;
}

.dd-dropdown li:hover > ul, .dd-dropdown li:focus-within > ul, .dd-dropdown li ul:hover, .dd-dropdown li ul:focus {
  visibility: visible;
  opacity: 1;
  display: block;
  z-index: 100;
}

.dd-dropdown li ul li {
  clear: both;
  border-width: 0px 1px 1px 1px !important;
  border-radius: 0px !important;
}

.dd-dropdown li ul li:last-child {
  border-radius-bottom: 3px;
}

.dd-dropdown li a:hover {
  color: #39a9e0 !important;
}

table.table {
  width: 100%;
  margin: 1.5rem 0;
  border-collapse: collapse;
  border: 0;
}
table.table tr {
  transition: background-color 0.3s ease;
}
table.table tr:hover {
  background-color: #f2f9ff;
}
table.table tr:not(:last-child) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.145);
}
table.table thead tr:hover {
  background-color: #fff;
}
table.table th, table.table td {
  padding: 0.75rem;
}
table.table th:last-child, table.table td:last-child {
  text-align: right;
}
table.table th {
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(64, 71, 86, 0.5);
  vertical-align: middle;
  border-bottom: 2px solid rgba(0, 0, 0, 0.145);
}
table.table td {
  font-size: 0.875rem;
  color: #404756;
  vertical-align: top;
}
@media (max-width: 767px) {
  table.table--responsive {
    border-collapse: separate;
    border: 1px solid #ddd;
    border-radius: 3px;
  }
  table.table--responsive, table.table--responsive tbody, table.table--responsive tr, table.table--responsive td {
    display: block;
    overflow: hidden;
  }
  table.table--responsive thead, table.table--responsive th {
    display: none;
  }
  table.table--responsive tr {
    margin: 0;
    border: 0;
    border-bottom: 1px solid #ddd;
    background: #fff;
  }
  table.table--responsive tr:first-child {
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
  }
  table.table--responsive tr:last-child {
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    border-bottom: 0;
  }
  table.table--responsive tr.open {
    background: #f8f8f8;
  }
  table.table--responsive tr.open td[data-label] {
    display: flex;
  }
  table.table--responsive tr.open td:not([data-label]):nth-child(2) {
    padding-bottom: 10px;
    margin-bottom: 0;
    border-bottom: 1px solid #ddd;
  }
  table.table--responsive td:not([data-label]) {
    cursor: pointer;
    color: #888;
    text-align: center;
    background: transparent;
    padding: 0 10px;
    margin: -10px 0 10px;
  }
  table.table--responsive td:not([data-label]):first-child {
    margin-top: 10px;
  }
  table.table--responsive td:not([data-label]):nth-child(2) {
    color: #555;
  }
  table.table--responsive td[data-label] {
    display: none;
    justify-content: flex-start;
    background-color: #fff;
  }
  table.table--responsive td[data-label]:not(:last-child) {
    border-bottom: 1px solid #ddd;
  }
  table.table--responsive td[data-label]::before {
    content: attr(data-label);
    min-width: 130px;
    font-weight: bold;
    white-space: normal;
    text-align: left;
    padding: 10px;
    margin: -10px 10px -10px -10px;
  }
}

.alert {
  position: fixed;
  left: 1.5rem;
  bottom: 1.5rem;
  color: #404756;
  text-align: center;
  font-weight: 500;
  padding: 1rem 6.5rem 1rem 4rem;
  margin-right: 1.5rem;
  max-width: 768px;
  border-radius: 3px;
  background-color: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  transition: 0.3s ease;
  z-index: 10000000;
}
.alert p {
  font-size: 1rem;
  margin: 0;
}
.alert a {
  color: currentColor;
  opacity: 0.7;
  transition: opacity 0.3s ease;
}
.alert a:hover {
  color: currentColor;
  opacity: 1;
}
.alert small {
  opacity: 0.7;
}
.alert--wide {
  left: 0;
  bottom: 0;
  padding: 1.5rem 15%;
  margin: 0;
  width: 100%;
  max-width: none;
  border-radius: 0;
}
.alert--wide-top {
  top: 0;
  left: 0;
  bottom: auto;
  padding: 1.5rem 15%;
  margin: 0;
  width: 100%;
  max-width: none;
  border-radius: 0;
}
.alert--pro .button, .alert--contra .button, .alert--warning .button {
  color: currentColor;
  border-color: #fff;
  background: none;
}
.alert--pro .button:hover, .alert--contra .button:hover, .alert--warning .button:hover {
  color: #404756;
  background: #fff;
}
.alert--pro {
  color: #fff;
  background-color: #00C853;
}
.alert--contra {
  color: #fff;
  background-color: #E64A19;
}
.alert--warning {
  color: #fff;
  background-color: #f8c82e;
}
.alert--hide {
  transform: translateY(100px);
  opacity: 0;
}
.alert--timeout {
  animation-name: alertOut;
  animation-delay: 5s;
  animation-duration: 0.2s;
  animation-fill-mode: forwards;
}
.alert .alert__icon,
.alert .js-close {
  position: absolute;
  top: 50%;
  left: 1rem;
  transform: translateY(-50%);
}
.alert .alert__icon {
  font-size: 26px;
}
.alert .js-close {
  left: auto;
  right: 1rem;
}
.alert .button--circle:hover {
  color: #404756;
  background: #fff;
}

@keyframes alertOut {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(100px);
    opacity: 0;
  }
}
.note {
  padding: 1rem;
  border-radius: 3px;
  border: 1px solid #eee;
  margin-bottom: 1rem;
}

.date[class*=pull-left] + .bodytext {
  overflow: hidden;
}

.banner {
  display: block;
  position: relative;
  padding: 4.5rem 0;
  background: #f1f1f1;
}

.banner__content {
  position: relative;
  z-index: 10;
}

.banner__image {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.1;
  filter: saturate(10%);
}
.banner__image img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.list.list--events {
  margin: 0 0 3rem;
}
.list.list--events .event {
  padding: 1rem;
  margin: 0 -1rem 0.5rem;
  border-radius: 3px;
  transition: 0.3s ease;
}
.list.list--events .event:hover {
  background: #f2f9ff;
}

.event {
  display: flex;
  flex-flow: row;
  align-items: center;
  color: currentColor;
}
.event small {
  color: rgba(64, 71, 86, 0.5);
}

.event__info {
  flex: 2;
}

.event__dates {
  flex: 1;
  border-left: 1px dashed #ddd;
  padding: 0 1.5rem;
}
.event__dates > div {
  display: inline-block;
  margin-right: 3rem;
}

.event__participants {
  flex: 1;
  text-align: end;
}
.event__participants .avatar {
  margin: 0 2px;
}

.frame {
  color: #ddd;
  text-align: center;
  padding: 4vmin;
  margin-bottom: 8vmin;
  background: #222;
}

figure.frame__image {
  display: block;
}
figure.frame__image > img {
  display: inline-block;
  max-height: 70vmin;
  object-fit: cover;
  object-position: center;
}
figure.frame__image figcaption {
  font-size: 1.125rem;
  color: currentColor;
  padding: 1.5rem 1.5rem 0;
}

.frame__options {
  display: flex;
  list-style: none;
  padding: 1.5rem 1.5rem 0;
  margin: 0 auto;
  max-width: 52rem;
}
.frame__options > li {
  flex: 1;
  padding: 0 0.25rem;
}
.frame__options .button {
  display: block;
  width: 100%;
}

.test-vote-contra:hover, .test-vote-contra:focus, .test-vote-contra:active, .test-vote-pro:hover, .test-vote-pro:focus, .test-vote-pro:active, .test-vote-skip:hover, .test-vote-skip:focus, .test-vote-skip:active {
  color: #fff;
  background-color: #39a9e0 !important;
}

.test-vote-contra::before {
  font-family: "Font Awesome 5 Pro";
  font-weight: 900;
  content: "";
  margin-right: 5px;
}

.test-vote-pro::before {
  font-family: "Font Awesome 5 Pro";
  font-weight: 900;
  content: "";
  margin-right: 5px;
}

.test-vote-skip::before {
  font-family: "Font Awesome 5 Pro";
  font-weight: 900;
  content: "";
  margin-right: 5px;
}

@media screen and (max-width: 480px) {
  .frame__options {
    margin: 0 !important;
    padding: 10px 0px !important;
  }

  .test-vote-contra::before, .test-vote-pro::before, .test-vote-skip::before {
    display: none;
  }
}
.scroller {
  display: flex;
  flex-wrap: nowrap;
  font-size: 0.875rem;
  font-weight: 500;
  text-align: start;
  padding: 0 0 1rem !important;
  margin: 0 0 3rem;
  list-style: none;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.scroller li {
  position: relative;
  flex-grow: 1;
  min-width: 250px;
  margin: 0 1.25rem 0 0;
  border-radius: 3px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.09);
  transition: transform 0.7s ease;
  padding-right: 0px;
}
.scroller li:hover {
  transform: translateY(5px);
}
.scroller li .active {
  border: 1px solid #39a9e0;
  color: #39a9e0;
}
.scroller img {
  margin-bottom: 4px;
}
.scroller a {
  display: block;
  color: currentColor;
  padding: 0.5rem;
}
.scroller a:hover {
  color: #39a9e0;
}

.content__title {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
  margin-bottom: 1.5rem;
}
.content__title .content__title_header {
  flex: 1;
  position: relative;
}
.content__title .content__title_header h3 {
  position: absolute;
  bottom: 0;
}

.content {
  margin-bottom: 4rem;
}

ul.images {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
  list-style: none;
}
ul.images li {
  flex-grow: 1;
  height: 240px;
  padding: 0;
  margin: 0 0 1.5rem;
}
ul.images img {
  max-height: 100%;
  min-width: 100%;
  object-fit: cover;
  vertical-align: bottom;
}
@media screen and (min-width: 480px) {
  ul.images {
    flex-direction: row;
    margin: 0 -0.75rem;
  }
  ul.images li {
    margin: 0 0.75rem 1.5rem;
  }
}

.counter {
  display: flex;
  align-items: center;
  margin: 3rem 0;
}

.counter__visual {
  flex: 1;
  padding: 0;
  margin-right: 1.5rem;
}
.counter__visual__bar {
  border-radius: 12px;
  background: #f9f9f9;
}
.counter__visual__bar span {
  position: relative;
  display: block;
  height: 6px;
  width: 85%;
  border-radius: 12px;
  background: #39a9e0;
}
.counter__visual__bar span::after {
  content: "";
  position: absolute;
  display: inline-block;
  top: -2px;
  right: -12px;
  width: 10px;
  height: 10px;
  border: 2px solid #fff;
  border-radius: 12px;
  background: #39a9e0;
}

.counter__numbers {
  font-size: 75%;
  color: #888;
}
.counter__numbers span {
  color: #39a9e0;
}

.box {
  padding: 1.5rem;
}

figure.image {
  color: #fff;
  border-radius: 3px;
  margin: 1rem 0;
  overflow: hidden;
}
@media screen and (min-width: 992px) {
  figure.image {
    margin: 0;
  }
}
figure.image.blur {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);
}
figure.image figcaption {
  position: absolute;
  display: flex;
  align-content: center;
  left: 0;
  bottom: 0;
  right: 0;
  padding: 12px;
  opacity: 0;
  background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.45) 100%);
  pointer-events: none;
  transition: opacity 0.65s ease;
  transition-delay: 200ms;
}
figure.image .button--primary {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 100;
}
figure.image .caption {
  flex: 1;
  text-align: left;
  line-height: 1;
  margin-left: 0.875rem;
}
figure.image h3 {
  font-size: 0.875rem;
  margin: 0;
}
figure.image a {
  color: currentColor;
  opacity: 0.8;
}
figure.image:hover figcaption, figure.image--featured figcaption {
  opacity: 1;
  pointer-events: all;
}

details {
  text-align: start;
  padding: 0;
}
details + details {
  border-top: 1px solid rgba(0, 0, 0, 0.09);
}
details:last-of-type {
  margin-bottom: 1.5rem;
}
details[open] summary::after {
  transform: translateY(-50%) rotate(180deg);
}
details[open] summary ~ * {
  animation: openDetails 0.7s ease;
}
details summary {
  cursor: pointer;
  display: block;
  position: relative;
  font-size: 1.125rem;
  line-height: 1.35;
  font-weight: 500;
  padding: 1rem 2rem;
  padding-left: 0;
  outline: none;
  transition: color 0.35s ease;
}
details summary::-webkit-details-marker {
  display: none;
}
details summary::before, details summary::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 1rem;
  height: 2px;
  background-color: currentColor;
  text-align: right;
  transform: translateY(-50%);
  transition: transform 0.3s ease-in-out;
}
details summary::after {
  transform: translateY(-50%) rotate(90deg);
}
details .details__content {
  padding: 0 0 1rem;
}

@keyframes openDetails {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.columns {
  margin-top: 1.5rem;
  columns: 2 300px;
  column-gap: 3rem;
}
.columns + * {
  margin-top: 1.5rem;
}
.columns p, .columns ul, .columns ol {
  break-inside: avoid-page;
  break-inside: avoid-column;
  -webkit-column-break-inside: avoid;
}

code, pre {
  font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
  border-radius: 3px;
  background: #ffe385;
}

code {
  display: inline-block;
  padding: 0 4px;
}

pre {
  position: relative;
  display: block;
  font-size: 1rem;
  text-align: start;
  white-space: pre-wrap;
  padding: 1rem;
  margin: 1.5rem 0;
  overflow-x: auto;
}
pre[data-lang]::before {
  position: absolute;
  top: 0.35rem;
  right: 0.5rem;
  content: attr(data-lang);
  display: block;
  font-size: 0.75rem;
  pointer-events: none;
}

.keywords {
  text-align: center;
  padding-top: 0;
}
.keywords .button {
  margin: 5px 2px !important;
}

.history-pro, .history-contra {
  margin: 0px 3px;
}

.history-result {
  font-size: 1rem;
}

@media screen and (max-width: 480px) {
  .votingtitle {
    padding-bottom: 10px;
  }
}
.content-vote {
  background: #222;
}
.content-vote .frame {
  margin-bottom: 0 !important;
  padding: 35px 25px;
  width: 100%;
}
.content-vote .frame img {
  width: auto;
  max-height: -webkit-calc(95vh - 210px);
  max-height: calc(95vh - 210px);
  image-orientation: none;
}
@media (min-width: 992px) {
  .content-vote .frame {
    min-height: -webkit-calc(100vh - 102px);
    min-height: calc(100vh - 102px);
  }
}
.content-vote .content-vote-details {
  padding-top: 8vmin;
  background: #fff;
}

.gridx__title {
  margin: 3rem 0 1.5rem;
}
.gridx__title:first-of-type {
  margin-top: 1.5rem;
}

.gridx {
  display: flex;
  flex-wrap: wrap;
  margin: 1.5rem -0.75rem 0;
}
.gridx > * {
  flex: 1;
  margin: 0 0.75rem 1.5rem;
  min-width: calc(25% - 1.5rem);
  max-width: calc(25% - 1.5rem);
}

@supports (display: grid) {
  .gridx {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    grid-auto-rows: auto;
    gap: 2.5rem;
    margin: 0;
  }
  .gridx > * {
    flex: none;
    margin: 0;
    max-width: unset;
    min-width: unset;
  }
}
.cover {
  padding: 1rem;
}
.cover img {
  width: 100%;
  margin-bottom: 0.75rem;
  filter: saturate(0.75);
  transition: filter 0.65s ease;
}
.cover:hover img {
  filter: saturate(1);
}
.cover figcaption {
  font-size: 0.875rem;
  color: #888;
}

.button {
  cursor: pointer;
  display: inline-block;
  font-family: system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  text-align: center;
  text-transform: uppercase;
  line-height: 1.35;
  text-shadow: none;
  padding: 0.5rem 1.125rem;
  margin: 0;
  white-space: nowrap;
  border: 1px solid transparent;
  border-radius: 3px !important;
  background: none;
  transition: color 0.3s ease, border-color 0.4s ease, background-color 0.3s ease;
  vertical-align: middle;
  -webkit-appearance: none;
  -moz-appearance: none;
  outline: none;
  color: #fff;
  background-color: #39a9e0;
}
.button + .button {
  margin-left: 0.35rem;
}
.button--block {
  display: block;
  width: 100%;
}
.button--xxs {
  font-size: 0.65rem;
  font-weight: 600;
  line-height: 2;
  padding: 0 8px;
}
.button--xs {
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 2.5;
  padding: 0 0.85em;
}
.button--xs span {
  display: none;
}
.button--sm {
  font-size: 0.75rem;
  font-weight: 700;
}
.button--md {
  font-size: 0.875rem;
}
.button--lg {
  font-size: 1rem;
  margin-top: 0.5rem;
  will-change: transform;
  box-shadow: 0 4px 12px rgba(212, 226, 239, 0.7), 0 0 0 1px rgba(0, 0, 0, 0.03);
}
.button--xlg {
  font-size: 1.7rem;
  margin-top: 0.5rem;
  will-change: transform;
  box-shadow: 0 4px 12px rgba(212, 226, 239, 0.7), 0 0 0 1px rgba(0, 0, 0, 0.03);
}
.button--p50 {
  padding: 0 50px !important;
}
.button[disabled],
.button .disabled {
  cursor: default;
  pointer-events: none;
  user-select: none;
}
.button:hover, .button:focus, .button:active {
  color: #fff;
  background-color: #4fb3e3;
  opacity: 1 !important;
}
.button--save {
  position: absolute;
  top: 0;
  right: 0;
}
.button--upload {
  color: #fff;
  min-width: 32px;
  border-radius: 25px;
  border-color: transparent;
}
@media screen and (min-width: 768px) {
  .button--upload {
    color: currentColor;
    background: none;
  }
}
.button--rounded {
  border-radius: 24px;
  border-color: transparent;
}
.button--outline {
  color: rgba(64, 71, 86, 0.5);
  border-color: rgba(0, 0, 0, 0.1);
  background: transparent;
}
.button--outline:hover {
  color: #4fb3e3;
  border-color: #4fb3e3;
  background: transparent;
}
.button--outline.button--inverted {
  color: currentColor;
  border-color: currentColor;
  opacity: 0.7;
  transition: 0.3s ease;
}
.button--outline.button--inverted:hover {
  opacity: 1;
}
.button--dark {
  background-color: rgba(0, 0, 0, 0.7);
}
.button--dark:hover {
  background-color: rgba(0, 0, 0, 0.9);
}
.button--light {
  color: #404756;
  background: #fff;
}
.button--light:hover {
  color: #39a9e0;
  background: #fff;
}
.button--muted {
  color: rgba(64, 71, 86, 0.5);
  background-color: #eae9ea;
}
.button--muted:hover {
  color: #404756;
  background-color: #eae9ea;
}
.button--clear {
  color: rgba(64, 71, 86, 0.5);
  background: none;
}
.button--clear:hover {
  color: #39a9e0;
  background: none;
}
@media screen and (min-width: 768px) {
  .button--xs span {
    display: inline;
  }
}

.button-cards-placeholder {
  height: 42px;
}

.button-cards-placeholder:hover {
  cursor: default;
}

.badge {
  cursor: default;
  position: relative;
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.85);
  text-transform: uppercase;
  line-height: 1.8;
  padding: 3px 0.5rem;
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.85);
  transition: 0.3s ease;
  z-index: 10;
}
a.badge {
  cursor: pointer;
}
a.badge:hover {
  color: #fff;
}

.badge i[class^=fa] {
  margin-right: 2px;
}
.badge + h1, .badge + h2, .badge + h3, .badge + h4 {
  margin-top: 1rem;
}
.badge.badge--blue, .badge.badge--primary {
  background: rgba(57, 169, 224, 0.75);
}
.badge.badge--blue:hover, .badge.badge--primary:hover {
  background: #39a9e0;
}
.badge.badge--green {
  background: rgba(0, 200, 83, 0.75);
}
.badge.badge--green:hover {
  background: #00C853;
}
.badge.badge--yellow {
  background: rgba(248, 200, 46, 0.75);
}
.badge.badge--yellow:hover {
  background: #f8c82e;
}
.badge.badge--red {
  background: rgba(230, 74, 25, 0.75);
}
.badge.badge--red:hover {
  background: #E64A19;
}

.avatar__outer {
  position: relative;
  text-align: center;
  width: 100%;
}

.avatar {
  appearance: none;
  position: relative;
  display: inline-block;
  font-size: 10px;
  text-align: center;
  max-width: 48px;
  vertical-align: middle;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background-color: #fff;
  outline: none;
}
.avatar.pull-left {
  margin-right: 0.75rem;
}
.avatar.pull-right {
  margin-left: 0.75rem;
}
.avatar__image {
  display: block;
  border-radius: 50%;
  object-fit: cover;
  vertical-align: bottom;
}
.avatar--xxs {
  max-width: 21px;
}
.avatar--xs {
  max-width: 28px;
}
.avatar--sm {
  max-width: 36px;
}
.avatar--md {
  max-width: 48px;
}
.avatar--lg {
  max-width: 100px;
}
.avatar--xl {
  max-width: 160px;
}
.avatar--notify::after {
  content: "";
  position: absolute;
  top: -2px;
  right: -6px;
  display: inline-block;
  height: 12px;
  width: 12px;
  border-radius: 50%;
  border: 2px solid #fff;
  background: #39a9e0;
}
.avatar--premium::after {
  display: inline-block;
  position: absolute;
  bottom: -4px;
  right: -4px;
  content: "";
  font-family: "Font Awesome 5 Pro";
  font-weight: 900;
  text-align: center;
  color: #39a9e0;
  padding-top: 3px;
  height: 18px;
  width: 18px;
  border-radius: 50%;
  background-color: #fff;
}
.avatar--premium.avatar--sm::after {
  bottom: -6px;
  right: -6px;
}
.avatar--premium.avatar--xl::after {
  bottom: 6%;
  right: 6%;
}

.userimg {
  display: flex;
  align-items: center;
}
.userimg .userimg__image {
  display: inline-block;
  font-size: 0.5rem;
  position: relative;
  border-radius: 50%;
  width: 32px;
  background: #fff;
}
.userimg .userimg__image > img {
  border-radius: 50%;
}
.userimg figcaption, .userimg .caption {
  font-weight: 500;
  line-height: 1;
  margin-left: 1rem;
}
figcaption.userimg {
  margin-bottom: 1.5rem;
}

.userimg small {
  color: #888;
  font-weight: normal;
}
@media screen and (min-width: 768px) {
  .userimg .userimg__image {
    width: 42px;
  }
  .userimg--small .userimg__image {
    width: 32px;
  }
  .userimg--big .userimg__image {
    font-size: 0.75rem;
    width: 72px;
  }
}
.userimg[data-premium] .userimg__image::after, .userimg[data-status] .userimg__image::after {
  content: "";
  display: inline-block;
  position: absolute;
  bottom: -2px;
  right: -2px;
  font-family: "Font Awesome 5 Pro";
  font-weight: 700;
  font-size: 1em;
  text-align: center;
  color: #39a9e0;
  padding-top: 4px;
  height: 1.875em;
  width: 1.875em;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #39a9e0;
}
.userimg[data-status=online] .userimg__image::after {
  background-color: #00C853;
}
.userimg[data-status=idle] .userimg__image::after {
  background-color: #f8c82e;
}
.userimg[data-premium="1"] .userimg__image::after {
  content: "";
  border: 0;
  background: #fff;
}
.userimg[data-premium="1"][data-status=online] .userimg__image::after {
  color: #00C853;
}
.userimg[data-premium="0"] .userimg__image::after {
  content: none !important;
  border: 0;
  background: none !important;
}
.userimg + h1.title {
  margin-top: 4vmin;
}

.list__faces {
  display: none;
  text-align: center;
  padding: 0;
  margin: 0;
}
.list__faces li {
  display: inline-block;
  margin: 0 0.75rem 1rem;
}
.list__faces figure {
  max-width: 148px;
}
.list__faces figure:hover img {
  transform: scale(1.1);
}
.list__faces img {
  max-width: 100%;
  border: 8px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.09);
  transform: translate3d(0);
  transition: transform 0.3s ease;
}
.list__faces figcaption {
  font-family: -apple-system-ui-serif, "Vollkorn", "Georgia", serif;
  font-style: italic;
  font-size: 1.25rem;
  color: #666;
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .list__faces {
    display: block;
  }
}

.gallery {
  position: relative;
  z-index: 10;
}
.gallery--simple {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: center;
  align-items: center;
  text-align: center;
  margin: 0 -0.5rem;
}
.gallery--simple .gallery__item {
  margin: 0.5rem;
}
.gallery--simple .gallery__image {
  position: absolute;
  vertical-align: bottom;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.gallery--simple .gallery__pusher {
  display: block;
}
.gallery--grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(3, 1fr);
  grid-auto-rows: 0;
  grid-auto-flow: dense;
  grid-gap: 1rem;
  overflow: hidden;
}
.gallery--grid .gallery__item {
  grid-column-start: auto;
  grid-row-start: auto;
}
.gallery--grid .gallery__item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 100%;
}
.gallery--grid .gallery__item.landscape.featured {
  grid-column: span 2;
  grid-row: span 2;
}
.gallery--grid .gallery__item.portrait {
  display: none;
  grid-row: span 2;
}
.gallery--grid .gallery__item.square.featured {
  grid-column: span 2;
  grid-row: span 3;
}
.gallery--grid .gallery__image {
  height: 100%;
  width: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: center;
  border-radius: 3px;
}
@media screen and (min-width: 768px) {
  .gallery--grid {
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-template-rows: auto;
    grid-auto-rows: minmax(150px, auto);
  }
  .gallery--grid .gallery__item.portrait {
    display: block;
  }
}
@media screen and (min-width: 992px) {
  .gallery--grid {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  }
}

.card {
  display: flex;
  position: relative;
  flex-direction: column;
  text-align: left;
  color: #404756;
  border-radius: 3px;
  background-color: #fff;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.09);
}

.card__title {
  text-align: center;
  padding: 1.5rem;
  padding-bottom: 0;
}

.card__preview {
  padding: 5px;
  width: 100%;
}
.card__preview img {
  width: 100%;
  max-height: 180px;
  object-fit: cover;
  border-radius: 3px;
}
.card__preview .static_meta {
  position: absolute;
  bottom: 43px !important;
  width: 97%;
}
.card__preview figcaption {
  margin-top: -1rem;
  padding: 0 1rem;
}
.card__preview .userimg__image {
  box-shadow: 0 0 0 2px white;
}
.card__preview + .card__content {
  padding-top: 0.75rem;
}
.card__preview + .card__content .date {
  margin: -2.125rem 0 1rem;
}

.card__image {
  position: relative;
  padding: 5px;
  padding-bottom: 0;
  margin: 0;
}
.card__image > img {
  border-radius: 3px;
}
.card__image figcaption {
  position: absolute;
  left: 5px;
  right: 5px;
  bottom: 0;
  text-align: left;
  color: #fff;
  padding: 1.5rem 14px 10px;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.25) 100%);
  transition: 0.7s ease;
}
.card__image figcaption a {
  color: currentColor;
}
.card__image .userimg {
  margin: 0 6px 0 0;
}

.card__content {
  position: relative;
  padding: 1.5rem;
}
.card__content .tagline {
  margin-bottom: 0.75rem;
}
.card__content small, .card__content .small {
  color: rgba(64, 71, 86, 0.5);
}
.card__content small strong, .card__content .small strong {
  color: #404756;
}
.card__content p:not[class], .card__content address {
  font-size: 1rem;
  line-height: 1.35;
  margin-top: 0.5rem;
}
.card__content p:not[class]:last-of-type, .card__content address:last-of-type {
  margin-bottom: 0;
}
.card__content dl {
  font-size: 0.875rem;
  margin: 0;
}
.card__content .cardinfo {
  color: #E64A19;
  font-size: 16px;
  font-weight: 200;
  padding: 10px;
  border: 1px solid #E64A19;
}

.card__section {
  padding: 1.5rem;
}
.card__section .tagline {
  margin: 0;
}
.card__section:first-child {
  padding: 0.75rem 1.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}
.card__section:last-child {
  padding: 0.75rem 1.5rem;
  margin-top: auto;
  border-top: 1px solid rgba(0, 0, 0, 0.09);
}

.card__buttons {
  display: flex;
  margin-top: auto;
  text-align: center;
  padding: 0;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  border-top: 1px solid rgba(0, 0, 0, 0.09);
  overflow: hidden;
}
.card__buttons .button {
  flex: 1;
  color: rgba(64, 71, 86, 0.5);
  padding: 0.75rem 0.5rem;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #fff;
}
.card__buttons .button + .button {
  border-left: 1px solid rgba(0, 0, 0, 0.09);
}
.card__buttons .button:hover {
  color: #39a9e0;
}
.card__buttons .button a {
  color: rgba(64, 71, 86, 0.5);
}

.card blockquote {
  padding: 1.5rem;
  margin: 0;
}
.card blockquote::before {
  display: none;
}

blockquote.card {
  flex: 1;
  display: flex;
  flex-direction: column;
  font-style: normal;
  min-width: 45%;
  max-width: none;
  padding: 1.5rem;
}
blockquote.card::before {
  display: none;
}
blockquote.card p {
  font-size: 1.125rem;
  font-style: normal;
  line-height: 1.35;
  margin-top: 0;
}
blockquote.card strong {
  font-weight: normal;
  color: #404756;
}
blockquote.card cite {
  display: block;
  font-size: 0.875rem;
  font-style: normal;
  color: #404756;
}
blockquote.card cite a {
  color: #404756;
}
blockquote.card cite a:hover {
  color: #39a9e0;
}
blockquote.card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  line-height: 1.2;
  padding-top: 0.5rem;
  margin-top: auto;
}
blockquote.card footer::before {
  display: none;
}
@media screen and (min-width: 992px) {
  blockquote.card {
    min-width: auto;
  }
}

.card.card--plan {
  display: flex;
  color: rgba(64, 71, 86, 0.5);
  text-align: center;
}
.card.card--plan .card__content {
  width: 100%;
  padding: 2rem 1.5rem 1rem;
}
.card.card--plan .heading {
  color: #404756;
}
.card.card--plan .price {
  color: #39a9e0;
}
.card.card--plan small {
  display: block;
  margin: 0.5rem 0 1.5rem;
}

.card.card--center {
  max-width: 340px;
}
.card.card--center .card__footer {
  padding-bottom: 3rem;
}

.card.card--flat {
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.09);
}

.card.card--float {
  box-shadow: 0 6px 21px rgba(0, 0, 0, 0.11), 0 0 0 1px rgba(0, 0, 0, 0.04);
}

.card.card--lift {
  transition: transform 0.65s ease, box-shadow 0.65s ease;
}
.card.card--lift:hover {
  transform: translateY(-0.25rem);
  box-shadow: 0 4px 17px 0 rgba(33, 33, 33, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.09);
}

.card__buttons_form {
  width: 100%;
  display: flex;
}

.card__voting-status {
  background-color: #bbbbbb;
  margin-top: -3px;
}
.card__voting-status p {
  text-align: right;
  text-transform: uppercase;
  color: #fff;
  font-size: 0.875rem;
  padding: 2px 10px 2px 0px;
}

.card__voting-status-current {
  background-color: #39a9e0;
}

.card__voting-status-finished {
  background-color: #000;
}

.date {
  display: inline-block;
  color: rgba(64, 71, 86, 0.5);
  text-align: center;
  padding: 2px;
  margin: 0 1.5rem 1.5rem 0;
  min-width: 3.25rem;
  background: #fff;
  border-radius: 3px;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.14), 0 0 0 1px rgba(0, 0, 0, 0.05);
}
.date span {
  display: block;
}
.date .date__month {
  font-size: 0.75rem;
  text-transform: uppercase;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.85);
  padding: 3px 0.65rem;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  background: #39a9e0;
}
.date .date__day {
  font-size: 1.25rem;
  font-weight: 500;
  color: #404756;
  padding: 2px 0;
}
.date--open .date__month, .date--green .date__month {
  background: #00C853;
}
.date--closed .date__month, .date--red .date__month {
  background: #E64A19;
}

/* calendar sheet */
.calendar-color-finished {
  background-color: #E64A19;
}

.calendar-color-active {
  background-color: #00C853;
}

.calendar-color-upcoming {
  background-color: #3f8ee9;
}

.calendar-sheet {
  position: relative;
  display: inline-block;
  border-radius: 3px;
  border: none !important;
  background: #fff;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
}

.calendar-sheet__month {
  font-size: 13px;
  width: 100%;
  color: #fff;
  padding: 6px 12px;
}

.calendar-sheet__day {
  font-size: 21px;
  width: 100%;
  padding: 4px;
  text-align: center;
}

body.body--display {
  overflow: hidden;
}
body.body--display .site__content {
  position: relative;
  padding: 0;
  background-color: #222;
}

.display__options {
  position: fixed;
  top: 0;
  right: 0;
  text-align: right;
  padding: 1.5rem;
  z-index: 200;
}

.display {
  display: flex;
  height: 100%;
  width: 100%;
  transform: translateX(0);
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  transition: 0.3s ease;
}
.display--sidebar {
  transform: translateX(-400px);
  transform: translate3d(-400px, 0, 0);
}

.display__canvas {
  flex: 1;
  display: flex;
  width: 100%;
  height: 100vh;
  padding: 2rem;
  overflow: auto;
}
.display__canvas--zoom {
  padding: 0;
}
.display__canvas--zoom .display__media {
  width: 100%;
  border-radius: 0;
  box-shadow: none;
  cursor: url(/assets/icons/zoom-minus.png) 20 20, auto;
}
.display__canvas--zoom .display__media img {
  height: auto;
  width: auto;
  max-height: unset;
  max-width: unset;
}

.display__media {
  display: block;
  margin: auto;
  border-radius: 3px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.5);
  cursor: url(/assets/icons/zoom-plus.png) 20 20, auto;
}
.display__media img {
  height: auto;
  width: auto;
  max-height: calc(100vh - 4rem);
  max-width: 100%;
}

.display__sidebar {
  display: block;
  position: absolute;
  top: 0;
  right: -400px;
  width: 400px;
  height: 100%;
  color: #fff;
  padding: 4rem 1.5rem 1.5rem;
  border-left: 1px solid #333;
  background: #222;
  overflow: hidden;
}
.display__sidebar hr {
  border-bottom-color: #333;
}
.display__sidebar .comment__list {
  margin-top: 3rem;
}

#section-list img {
  height: 150px;
  width: 100%;
  object-fit: cover;
  object-position: center;
}

.comment__list {
  padding: 0;
  margin: 0;
  list-style: none;
}

.comment {
  display: flex;
  align-items: flex-start;
}
.comment:not(:last-of-type) {
  margin-bottom: 1.5rem;
}

.userimg + .comment__content {
  margin-left: 1.5rem;
}

.comment__content p {
  font-size: 0.875rem;
}

.comment__meta {
  font-size: 0.875rem;
  color: var(--font-color-muted);
  margin-bottom: 0.25rem;
}

.comment__meta {
  display: flex;
  justify-content: space-between;
}
.comment__meta .comment__delete a {
  color: #888;
}
.comment__meta .comment__delete far {
  font-size: 0.8rem;
}

@media screen and (max-width: 768px) {
  body.body--index .gallery .gallery__item:not(.featured) {
    display: none;
  }
}

#section__learn__comments .poster__comments {
  display: none;
}
#section__learn__comments .poster__more {
  display: block !important;
}
#section__learn__comments .poster__more .poster__comments__list {
  padding: 0px;
}
#section__learn__comments .poster__more .comment__content {
  margin-left: 0rem;
}
@media screen and (min-width: 992px) {
  #section__learn__comments {
    margin: 6rem 0;
  }
  #section__learn__comments .poster__comments {
    display: block;
  }
  #section__learn__comments .poster__more {
    max-width: 800px;
  }
  #section__learn__comments .poster__more .poster__comments__list {
    padding: 0 2.5rem;
  }
  #section__learn__comments .poster__more .poster__comments__image {
    width: 800px !important;
    top: -4rem;
  }
}

.site__content section.outer {
  background-color: #fff;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  #section__testimonials {
    margin-top: -1rem;
  }
}
.outer {
  padding: 4rem 0;
}
.outer.outer--bg {
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-color: #f2f9ff;
  background-image: linear-gradient(to bottom, #f2f9ff, #fff);
}
.outer.gradient--new {
  background-color: #e3f2ff;
  background-image: linear-gradient(to top, #fff 60%, #ddd 100%) !important;
}
.outer.gradient--new > * {
  position: relative;
  z-index: 10;
}
.outer.gradient--new::before, .outer.gradient--new::after {
  content: "";
  display: block;
  position: absolute;
}
.outer.gradient--new::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.2) 50%);
}
.outer.gradient--new::after {
  left: 0;
  bottom: 0;
  width: 100%;
  height: 6rem;
  background-image: linear-gradient(-2deg, white 50%, rgba(255, 255, 255, 0) 50.1%);
}

@media screen and (min-width: 768px) {
  .poster__text.card-xl {
    max-width: 600px !important;
    width: 600px !important;
  }
}
.poster__text.card-xl {
  max-width: 100% !important;
}

#section__podcast h3 a {
  color: #404756;
}
#section__podcast p a {
  color: rgba(64, 71, 86, 0.5);
}
#section__podcast .poster {
  flex-direction: column-reverse;
}

.poster__text .button img {
  width: 20px;
  height: auto;
  vertical-align: none !important;
  margin-bottom: 8px;
}

.pull-left {
  float: left;
}

.pull-right {
  float: right;
}

@media screen and (min-width: 992px) {
  .pull-left-md {
    float: left;
  }

  .pull-right-md {
    float: right;
  }
}
.cf::after {
  content: "";
  display: table;
  clear: both;
}

.position-relative {
  position: relative;
}

.position-sticky {
  position: sticky;
  top: 0;
}

.position-absolute {
  position: absolute;
}

.position-fixed {
  position: fixed;
}

.display-inline {
  display: inline;
}

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

.display-block {
  display: block;
}

.align-v {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.align-h {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

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

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

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

@media screen and (min-width: 768px) {
  .text-left-sm {
    text-align: left;
  }

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

  .text-right-sm {
    text-align: right;
  }
}
@media screen and (min-width: 992px) {
  .text-left-md {
    text-align: left;
  }

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

  .text-right-md {
    text-align: right;
  }
}
.capitalize {
  text-transform: capitalize;
}

.upper {
  text-transform: uppercase;
}

.lower {
  text-transform: lowercase;
}

.color-default {
  color: #404756;
}

.color-primary {
  color: #39a9e0;
}

.color-light {
  color: #888;
}

.color-grey {
  color: #ddd;
}

.color-blue {
  color: #39a9e0;
}

.color-green {
  color: #00C853;
}

.color-yellow {
  color: #f8c82e;
}

.color-red {
  color: #E64A19;
}

.color-twitter {
  color: #5ea0ef;
}

.color-facebook {
  color: #475995;
}

.color-google {
  color: #cb4539;
}

.color-googleplus {
  color: #dd4b39;
}

.color-youtube {
  color: #db0000;
}

.color-pinterest {
  color: #bd091c;
}

.color-instagram {
  color: #405de6;
}

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

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

.ma {
  margin: auto;
}

.m0a {
  margin: 0 auto;
}

.p0 {
  padding: 0;
}

.pt0 {
  padding-top: 0;
}

.pb0 {
  padding-bottom: 0;
}

.pv0 {
  padding-top: 0;
  padding-bottom: 0;
}

.m0 {
  margin: 0;
}

.mt0 {
  margin-top: 0;
}

.mb0 {
  margin-bottom: 0;
}

.mv0 {
  margin-top: 0;
  margin-bottom: 0;
}

.p2 {
  padding: 3%;
}

.pt2 {
  padding-top: 3%;
}

.pb2 {
  padding-bottom: 3%;
}

.pv2 {
  padding-top: 3%;
  padding-bottom: 3%;
}

.m2 {
  margin: 3%;
}

.mt2 {
  margin-top: 3%;
}

.mb2 {
  margin-bottom: 3%;
}

.mv2 {
  margin-top: 3%;
  margin-bottom: 3%;
}

.p3 {
  padding: 2%;
}

.pt3 {
  padding-top: 2%;
}

.pb3 {
  padding-bottom: 2%;
}

.pv3 {
  padding-top: 2%;
  padding-bottom: 2%;
}

.m3 {
  margin: 2%;
}

.mt3 {
  margin-top: 2%;
}

.mb3 {
  margin-bottom: 2%;
}

.mv3 {
  margin-top: 2%;
  margin-bottom: 2%;
}

.pxs {
  padding: 1.5rem;
}

.ptxs {
  padding-top: 1.5rem;
}

.pbxs {
  padding-bottom: 1.5rem;
}

.pvxs {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.mxs {
  margin: 1.5rem;
}

.mtxs {
  margin-top: 1.5rem;
}

.mbxs {
  margin-bottom: 1.5rem;
}

.mvxs {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

.ps {
  padding: 3rem;
}

.pts {
  padding-top: 3rem;
}

.pbs {
  padding-bottom: 3rem;
}

.pvs {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.ms {
  margin: 3rem;
}

.mts {
  margin-top: 3rem;
}

.mbs {
  margin-bottom: 3rem;
}

.mvs {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

.pm {
  padding: 6%;
}

.ptm {
  padding-top: 6%;
}

.pbm {
  padding-bottom: 6%;
}

.pvm {
  padding-top: 6%;
  padding-bottom: 6%;
}

.mm {
  margin: 6%;
}

.mtm {
  margin-top: 6%;
}

.mbm {
  margin-bottom: 6%;
}

.mvm {
  margin-top: 6%;
  margin-bottom: 6%;
}

.pl {
  padding: 9%;
}

.ptl {
  padding-top: 9%;
}

.pbl {
  padding-bottom: 9%;
}

.pvl {
  padding-top: 9%;
  padding-bottom: 9%;
}

.ml {
  margin: 9%;
}

.mtl {
  margin-top: 9%;
}

.mbl {
  margin-bottom: 9%;
}

.mvl {
  margin-top: 9%;
  margin-bottom: 9%;
}

.ph {
  padding: 12%;
}

.pth {
  padding-top: 12%;
}

.pbh {
  padding-bottom: 12%;
}

.pvh {
  padding-top: 12%;
  padding-bottom: 12%;
}

.mh {
  margin: 12%;
}

.mth {
  margin-top: 12%;
}

.mbh {
  margin-bottom: 12%;
}

.mvh {
  margin-top: 12%;
  margin-bottom: 12%;
}

.img-circle {
  border-radius: 50%;
}

.group {
  display: flex;
}
.group > * {
  flex: 1;
}

.dev {
  padding: 1rem;
  border: 2px solid blue;
  background: #f1f1f1;
}

nav.navbar .fcx-mobile-message-icons {
  margin-top: 0px !important;
}

.nav > li > a > img {
  margin-bottom: 8px;
}

input[type=search]:focus {
  background-color: #3b3b3b;
}

.bootstrap-tagsinput input {
  padding: 0px;
  font-size: 0.85rem;
}

#myNavmenu .dropdown-toggle {
  font-size: 0.88rem;
}

.site__content {
  padding-top: 50px !important;
}
@media screen and (max-width: 768px) {
  .site__content {
    padding-top: 55px !important;
  }
}

.fcx-search-result-list .container-fluid {
  padding-left: 0px;
  padding-right: 0px;
}

.fcx-search-result-list {
  padding-top: 20px;
}

footer .footer-list a {
  font-size: 13px !important;
}

.footer-list h4 {
  font-size: 18px;
}

footer small, .small {
  font-size: 10px;
  line-height: 6px;
}

.fcx-dropdown-column {
  font-size: 0.9rem;
}

ul.list-inline, ol.list-inline {
  list-style: inside;
}

.list-inline {
  font-size: 1rem;
}

.list-inline > li {
  padding-left: 0px;
  display: block;
}

nav.navbar .badge-notification {
  padding: 0px 5px !important;
  line-height: 1.4 !important;
  font-weight: bold;
}

.overlay {
  display: flex;
  position: absolute;
  width: 100%;
  min-height: 100%;
  height: auto !important;
  height: 100%;
  background-color: #222 60%;
  backdrop-filter: blur(2px);
  backdrop-filter: brightness(60%);
  backdrop-filter: contrast(40%);
  justify-content: center;
  align-items: first;
  z-index: 10000 !important;
}

.uploadbox--contest {
  display: block;
  width: 800px;
  height: max-content;
  background-color: #222;
  color: #888;
  text-align: center;
}
.uploadbox--contest p {
  color: #888;
  margin: 0 0 0.5rem;
}
.uploadbox--contest .uploadbox--header {
  padding: 20px;
}
.uploadbox--contest .uploadbox--header .title, .uploadbox--contest .uploadbox--header p {
  text-align: center;
  padding-right: 20px;
}
.uploadbox--contest .uploadbox--header .userimg {
  text-align: center;
}
.uploadbox--contest .uploadbox--image {
  display: flex;
  margin: 10px 20px 0px 20px;
  background-color: #000;
  min-height: 400px;
  justify-content: center;
  align-items: center !important;
}
.uploadbox--contest .upload-image {
  justify-content: center;
  align-items: center !important;
}
.uploadbox--contest .upload-image i {
  padding-bottom: 15px;
  color: #888 !important;
  width: 100%;
  text-align: center;
}
.uploadbox--contest .uploadbox--content {
  padding: 20px;
}
.uploadbox--contest .uploadbox--content .row {
  padding-bottom: 10px;
}
.uploadbox--contest .uploadbox--content input {
  color: #888 !important;
  background-color: #000;
  width: 100%;
}
.uploadbox--contest .uploadbox--content .button--dark {
  line-height: 1.7;
}
.uploadbox--contest .uploadbox--footer {
  border-top: 1px solid #000;
}
.uploadbox--contest .uploadbox--footer .uploadbox--teilnahme {
  padding: 10px 20px;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uploadbox--contest .uploadbox--footer .uploadbox--teilnahme p {
  margin: 0px;
  padding: 0 0 0 5px;
  font-size: 0.98rem;
}
.uploadbox--contest .uploadbox--footer .uploadbox--teilnahme input[type=checkbox] {
  border: none !important;
  top: 0px;
  width: 15px !important;
  height: 15px !important;
  background-color: #000;
  color: #fff;
}
.uploadbox--contest .uploadbox--footer .uploadbox--teilnahme input[type=checkbox]:focus {
  outline: none !important;
}
.uploadbox--contest .uploadbox--footer .uploadbox--teilnahme input[type=checkbox]:checked {
  background-color: #fff;
}
.uploadbox--contest .uploadbox--footer .footnote {
  border-top: 1px solid #000;
  padding: 10px 0px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uploadbox--contest .uploadbox--footer .footnote p {
  font-size: 13px !important;
  text-align: center;
}

@media screen and (max-width: 768px) {
  #imagetags {
    margin-top: 10px;
  }
}

.uploadbox--contest .uploadbox--content input::placeholder {
  color: #888 !important;
  width: 100%;
}

.uploadbox--contest .uploadbox--header .userimg__image {
  width: 75px !important;
  height: auto;
}

@media screen and (max-width: 768px) {
  .uploadbox--contest .uploadbox--header .userimg__image {
    vertical-align: center;
    margin-bottom: 10px;
  }

  .uploadbox--contest .uploadbox--header .userimg {
    display: block;
  }

  .uploadbox--header {
    display: flex;
    flex-direction: column;
  }

  .uploadbox--header :nth-child(1) {
    order: 2;
  }

  .uploadbox--header :nth-child(2) {
    order: 3;
  }

  .uploadbox--header :nth-child(3) {
    order: 1;
  }
}
#js-contest-close-upload-modal i {
  float: right;
}

#js-contest-close-upload-modal i:hover {
  cursor: pointer;
}

.uploadbox--contest-finish .uploadbox--content {
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.uploadbox--contest-finish .uploadbox--content h3 {
  color: #fff !important;
}
.uploadbox--contest-finish .uploadbox--content p {
  padding-bottom: 20px;
}

.contest-create {
  background-color: #eeeeee;
  margin-bottom: -80px;
}
.contest-create p {
  font-size: 16px;
}
.contest-create p, .contest-create h1, .contest-create h2, .contest-create h3, .contest-create h4 {
  color: #404756;
}
.contest-create .card {
  max-width: 320px;
}

/* contest create */
.disabled_blur {
  -webkit-filter: blur(3px);
  filter: blur(3px);
}

.contest-create__date-row {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.contest-create__date-row .vdatetime:first-of-type {
  width: 100%;
}

.contest-create__date-row {
  margin: 12px 0 8px;
}

.contest-create__with-jury-voting {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

#contest-create {
  -webkit-transition: opacity 200ms;
  -o-transition: opacity 200ms;
  transition: opacity 200ms;
  color: #6d7278;
  margin: 0 0 -40px;
  padding-bottom: 50px;
}

#contest-create__head {
  margin: 0 50px 50px;
  padding-top: 50px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

#contest-create__body {
  margin: 0 50px;
}

button#contest_create_create {
  height: 45px;
  background-color: #39a9e0;
  color: #fff;
  border: 1px solid #39a9e0;
  border-radius: 3px;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  font-size: 20px;
  font-weight: 600;
  padding: 0 30px;
}

.contest_create__is-anonym,
.contest-create__with-jury-voting {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.contest_create__is-anonym label,
.contest-create__with-jury-voting label {
  margin: 2px 0 0 8px;
}

.contest-create__step--right input[type=text],
.contest-create__step--left input[type=text],
.contest-create__step--right textarea,
.contest-create__step--left textarea,
.contest-create__step--right select,
.contest-create__step--left select {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 3px;
  background-color: #fff;
  width: 100%;
  min-height: 30px;
  margin: 8px 0 16px;
  color: #404756;
  padding: 3px 10px;
}

.contest-create__step--right .vdatetime-input,
.contest-create__step--left .vdatetime-input {
  margin: 0 0 12px !important;
}

.contest-create__step--right textarea,
.contest-create__step--left textarea {
  min-height: 180px;
  color: #404756;
}

.contest-create__step--right label,
.contest-create__step--left label {
  display: block;
  color: #404756;
  font-size: 16px;
  font-weight: normal;
  letter-spacing: 0;
  line-height: 19px;
}

.contest-create__step--right input,
.contest-create__step--left input {
  color: #404756;
}

#contest-create__cat-ppu {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

#contest-create__cat-ppu select:first-of-type {
  width: 50%;
}

#contest-create__cat-ppu label {
  text-align: end;
  width: 30%;
  padding-top: 14px;
  margin-left: 16px;
  padding-right: 16px;
}

#contest-create__cat-ppu select:last-of-type {
  width: 20%;
}

.contest-create__step--left,
.contest-create__step--right {
  padding: 25px 25px 0 0;
}

.grid-container__contest-create {
  display: grid;
  grid-template-columns: 100px 1fr;
  grid-template-rows: 2fr 2fr 2fr 1fr;
  grid-gap: 1px 1px;
  grid-template-areas: "contest-create__step--one contest-create__step-one" "contest-create__step--two contest-create__step-two" "contest-create__step--three contest-create__step-three" "contest-create__step--four contest-create__step-four";
  grid-template-rows: max-content;
}

.contest-create__step--circle {
  width: 56px;
  height: 56px;
  margin: 15px 25px;
  background-color: #39a9e0;
  border-radius: 50%;
  color: #fff;
  font-size: 25px;
  line-height: 30px;
  padding: 13px;
  text-align: center;
}

.contest-create__step--vl {
  grid-area: contest-create__step--vl;
}

.contest-create__step--vl {
  border-left: 3px solid #39a9e0;
  height: inherit;
  margin-left: 50px;
  top: 0;
}

.contest-create__step--one {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "." "contest-create__step--vl";
  grid-area: contest-create__step--one;
  margin-bottom: 10px;
}

.contest-create__step--two {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "." "contest-create__step--vl";
  grid-area: contest-create__step--two;
}

.contest-create__step--three {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "." "contest-create__step--vl";
  grid-area: contest-create__step--three;
}

.contest-create__step--four {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "." ".";
  grid-area: contest-create__step--four;
}

.contest-create__step--one, .contest-create__step--two, .contest-create__step--three, .contest-create__step--four {
  margin-bottom: 20px;
}

.contest-create__step-one, .contest-create__step-two, .contest-create__step-three, .contest-create__step-four {
  margin-bottom: 20px;
  padding-bottom: 30px;
}

.contest-create__step-one {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "contest-create__step-one--headline contest-create__step-one--headline" "contest-create__step-one--left contest-create__step-one--right";
  grid-area: contest-create__step-one;
}

.contest-create__step--headline span,
.contest-create__step--headline p {
  color: #222;
  font-size: 16px;
  letter-spacing: 0;
  margin: 0px 0 10px 0 !important;
}

.contest-create__step-one--headline {
  grid-area: contest-create__step-one--headline;
}

.contest-create__step-one--left {
  grid-area: contest-create__step-one--left;
}

.contest-create__step-one--right {
  grid-area: contest-create__step-one--right;
}

.contest-create__step-two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "contest-create__step-two--headline contest-create__step-two--headline" "contest-create__step-two--left contest-create__step-two--right";
  grid-area: contest-create__step-two;
}

.contest-create__step-two--headline {
  grid-area: contest-create__step-two--headline;
}

.contest-create__step-two--left {
  grid-area: contest-create__step-two--left;
}

.contest-create__step-two--right {
  grid-area: contest-create__step-two--right;
}

.contest-create__step-three {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 100px 50px 1fr;
  grid-template-areas: "contest-create__step-three--headline contest-create__step-three--headline" "contest-create__step-three--slider contest-create__step-three--slider" "contest-create__step-three--left contest-create__step-three--right";
  grid-area: contest-create__step-three;
}

.contest-create__step-three--headline {
  grid-area: contest-create__step-three--headline;
}

.contest-create__step-three--slider {
  grid-area: contest-create__step-three--slider;
}

.contest-create__step-three--left {
  grid-area: contest-create__step-three--left;
}

.contest-create__step-three--right {
  grid-area: contest-create__step-three--right;
}

.contest-create__step-four {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr 1fr;
  grid-template-areas: "contest-create__step-four--headline" "contest-create__step-four--info" "contest-create__step-four--buttons";
  grid-area: contest-create__step-four;
}

.contest-create__step-four--headline {
  grid-area: contest-create__step-four--headline;
}

.contest-create__step-four--info {
  grid-area: contest-create__step-four--info;
  color: #222;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 22px;
  max-width: 800px;
}

.contest-create__step-four--buttons {
  grid-area: contest-create__step-four--buttons;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0 0 25px 0;
}

[v-cloak] {
  display: none;
}

#contest-create .btn-primary {
  color: #fff;
  background: #39a9e0;
  border: 1px solid #39a9e0;
}

.switch-container {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  height: 44px;
  width: 318px;
  border: 1px solid #39a9e0;
  border-radius: 22px;
  background-color: #fff;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  vertical-align: middle;
}

.switch {
  display: block;
  margin: 3px 3px 0 0;
  color: #6d7278;
  height: 36px;
  width: 154px;
  border-radius: 18px;
  font-family: -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 36px;
  text-align: center;
  -webkit-transition: margin 200ms;
  -o-transition: margin 200ms;
  transition: margin 200ms;
  cursor: pointer;
}

.switch__slider {
  background-color: #39a9e0;
  color: #fff;
  position: absolute;
  margin-left: -150px;
}

.switch__slider_active {
  margin-left: 156px;
}

#contest-preview {
  border: 8px solid #39a9e0;
  padding-bottom: 50px;
  background-color: #fff;
}

.contest-preview__images {
  display: grid;
  grid-template-columns: 10fr 4fr 6fr 8fr;
  grid-template-rows: 1fr;
  grid-gap: 0 18px;
  grid-template-areas: ". . . .";
}

.contest-view__photos {
  margin: 0 20px;
}

.contest-preview__img-placeholder {
  height: 185px;
  border-radius: 3px;
  background-color: #d8d8d8;
}

.contest-container h1 {
  font-family: "Vollkorn";
  font-size: 52px;
  line-height: 73px;
  color: #222;
  margin: 0;
}

.h2--contest {
  font-family: "Vollkorn";
  font-style: italic;
  font-size: 28px;
  line-height: 28px;
  letter-spacing: normal;
  color: #333;
  margin-top: 50px;
}

.contest-container h3 {
  font-family: "Vollkorn";
  font-style: italic;
  color: #333;
}

#contest-preview > h2 {
  background-color: #39a9e0;
  color: #fff;
  color: #fff;
  margin: 0;
  width: 100%;
  min-height: 75px;
  text-align: center;
  padding-top: 10px;
}

.contest-view__contest_info--grid-container {
  display: grid;
  grid-template-columns: 3fr 1fr;
  grid-template-rows: 1fr 4fr;
  grid-gap: 18px 50px;
  grid-template-areas: "contest-view__tab-header contest-view__tab-header" "contest-view__image contest-view__status-box" "contest-view__image contest-view__initiator-box";
}

.contest-view__tab-header {
  grid-area: contest-view__tab-header;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
}

.contest-view__image {
  grid-area: contest-view__image;
  border-radius: 3px;
  -webkit-box-shadow: 0 20px 32px 0 rgba(0, 0, 0, 0.25);
  box-shadow: 0 20px 32px 0 rgba(0, 0, 0, 0.25);
}

.contest-view__status-box {
  grid-area: contest-view__status-box;
}

.contest-view__initiator-box {
  grid-area: contest-view__initiator-box;
}

.fcx-gallery__item {
  border: 3px solid transparent;
  border-radius: 3px;
}

.fcx-gallery__item:hover {
  border: 3px solid #39a9e0;
}

.contest-placement {
  display: block;
  color: #fff;
  font-size: 21px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 25px;
  padding-top: 17px;
  text-align: center;
  vertical-align: center;
  background-color: rgba(0, 0, 0, 0.4);
  border: 2px solid #fff;
  height: 62px;
  width: 62px;
  border-radius: 31px;
  position: absolute;
  content: "1";
  margin-left: -webkit-calc(50% - 30px);
  margin-left: calc(50% - 30px);
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

/* initiator_box */
.initiator-box {
  padding: 0 24px 4px;
  width: 320px;
  border: 1px solid #e7e7e7;
  border-radius: 3px;
  border-bottom: none;
  -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
}

.initiator-box__header {
  width: 100%;
  padding-top: 25px;
}

.initiator-box__header h1 {
  width: 100%;
  margin: 8px 0 0;
}

.initiator-box__header img {
  width: 100%;
}

.initiator-box__header h3 {
  width: 100%;
  margin: 0;
}

.initiator-box__body {
  padding-top: 25px;
  color: #888;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 25px;
}

p.initiator-box__body--user-text {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
}

.initiator-box__footer {
  padding: 24px 0;
}

.initiator-box__footer a {
  width: 100px;
  padding: 9px 16px;
  border: 1px solid #dedede;
  border-radius: 3px;
  color: #888;
}

#fcx-info-photographer {
  display: none;
}

.fcx-section-header {
  margin-top: 24px;
  padding: 0 10px 0 0;
  background-color: unset;
  border-bottom: unset;
}

#fcx-main > div.content > div:nth-child(2) > div.initiator-box > div.initiator-box__header > div > div > div > div.col-xs-12.col-md-6.text-center.text-left-md {
  padding-left: unset;
}

/* status box */
.status-box {
  width: 320px;
  border: 1px solid #e7e7e7;
  border-radius: 3px;
  border-bottom: none;
  -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
  background: #fff;
}

.status-box__head {
  background-color: #fafafa;
  width: 100%;
  height: 58px;
  margin-bottom: 62px;
}

.status-box__head .calendar-sheet {
  margin-top: 20px;
  margin-left: 24px;
}

.status-box__body {
  padding: 0 24px 4px;
  font-size: 21px;
}

.status-box__status {
  list-style: none;
  padding: unset;
}

.status-box__status h3 {
  color: #333;
}

.status-box__status li {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  color: #888;
  font-weight: 200;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 36px;
  background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #ddd), color-stop(0%, rgba(255, 255, 255, 0)));
  background-image: -webkit-linear-gradient(left, #ddd 50%, rgba(255, 255, 255, 0) 0%);
  background-image: -o-linear-gradient(left, #ddd 50%, rgba(255, 255, 255, 0) 0%);
  background-image: linear-gradient(to right, #ddd 50%, rgba(255, 255, 255, 0) 0%);
  background-position: bottom;
  background-size: 10px 1px;
  background-repeat: repeat-x;
}

.status-box__status li:last-of-type {
  background-image: none;
}

.status-box__status li::after {
  margin-right: 8px;
}

li.status-box__status--done::after {
  content: "";
  font-family: "Font Awesome 5 Pro";
  font-weight: 500;
  color: #6dd400;
}

li.status-box__status--open::after {
  content: "";
  font-family: "Font Awesome 5 Pro";
  font-weight: 500;
  color: #39a9e0;
}

li.status-box__status--finished {
  font-weight: 500;
  color: #333;
}

/* winner photos */
.winner-cards {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.winner-card {
  position: relative;
  height: 420px;
  width: 400px;
  margin-right: 18px;
  border: 1px solid #e7e7e7;
  border-radius: 3px;
  border-bottom: none;
  -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
}

.winner-card__photo {
  display: block;
  height: 244px;
  margin: 18px;
  border-radius: 3px;
  background-color: #fafafa;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

.winner-card_user-photo {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border: 4px solid #fff;
  height: 82px;
  width: 82px;
  border-radius: 41px;
  display: block;
  position: absolute;
  margin-top: -59px;
  margin-left: 158px;
}

.winner-card__footer {
  position: absolute;
  width: 100%;
  text-align: center;
  bottom: 0;
  padding-bottom: 36px;
}

.winner-card__footer * {
  display: block;
}

/* calendar sheet */
.calendar-color-finished {
  background-color: #e64a19;
}

.calendar-color-active {
  background-color: #00c853;
}

.calendar-color-upcoming {
  background-color: #39a9e0;
}

.calendar-sheet {
  position: relative;
  display: inline-block;
  border-radius: 3px;
  border: 2px solid #fff;
  background: #fff;
  -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
}

.calendar-sheet__month {
  font-size: 13px;
  width: 100%;
  color: #fff;
  padding: 6px 12px;
}

.calendar-sheet__day {
  font-size: 21px;
  width: 100%;
  padding: 4px;
  text-align: center;
}

/* preview-card */
.contestcard__title {
  padding: 0 24px;
}

.contestcard__header {
  position: relative;
  text-align: left;
  margin: -16px -16px 0;
  margin: -1rem -1rem 0;
  overflow: hidden;
}

.contestcard__header .calendar-sheet {
  margin-top: 120px;
  margin-left: 24px;
}

.contestcard__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 160px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  border-bottom: 1px solid #eee;
  background-color: #fafafa;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 132%;
  overflow: hidden;
}

.card--contest {
  display: inline-block;
  width: 100%;
  padding: 16px 16px 64px;
  -webkit-transition: 0.3s -webkit-filter ease;
  -o-transition: 0.3s filter ease;
  transition: 0.3s filter ease, 0.3s -webkit-filter ease;
}

.contestcard__footer {
  position: absolute;
  text-align: center;
  left: 0;
  bottom: 0;
  width: 100%;
}

.contestcard__button {
  width: 50%;
  text-align: center;
  vertical-align: middle;
  color: #aaa;
  border-top: 1px solid #e7e7e7;
  padding: 1em;
}

.contestcard__button:first-of-type {
  border-right: 1px solid #e7e7e7;
}

/* calenadar-sheet */
.calendar-color-finished {
  background-color: #e64a19;
}

.calendar-color-active {
  background-color: #00c853;
}

.calendar-color-upcoming {
  background-color: #39a9e0;
}

.calendar-sheet {
  position: relative;
  display: inline-block;
  border-radius: 3px;
  border: 2px solid #fff;
  background: #fff;
  -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35);
}

.calendar-sheet__month {
  font-size: 13px;
  width: 100%;
  color: #fff;
  padding: 6px 12px;
}

.calendar-sheet__day {
  font-size: 21px;
  width: 100%;
  padding: 4px;
  text-align: center;
}

/* calendar-sheet-icon */
.calendar-sheet-icon {
  height: 30px;
  width: 36px;
  border: 1px solid #d8d8d8;
  border-radius: 2px;
  background-color: #fff;
  padding: 1px;
  text-align: center;
  margin: 0 16px 0 8px;
}

.calendar-sheet-icon > div {
  background-color: #39a9e0;
  border-radius: 2px 2px 0 0;
  width: 100%;
  height: 8px;
}

.calendar-sheet-icon span {
  height: 18px;
  width: 26px;
  color: #333;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 20px;
}

.calendar-sheet-icon--clock::after {
  content: "";
  font-family: "Font Awesome 5 Pro";
  font-weight: 500;
}

.spaceNone {
  margin-top: 0;
}

.spaceVeryTiny {
  margin-top: 3px;
}

.spaceTiny {
  margin-top: 6px;
}

.spaceSmall {
  margin-top: 10px;
}

.spaceMedium {
  margin-top: 20px;
}

.spaceBig {
  margin-top: 40px;
}

.spaceHuge {
  margin-top: 80px;
}

.spaceBottomNone {
  margin-bottom: 0;
}

.spaceBottomVeryTiny {
  margin-bottom: 3px;
}

.spaceBottomTiny {
  margin-bottom: 6px;
}

.spaceBottomSmall {
  margin-bottom: 10px;
}

.spaceBottomMedium {
  margin-bottom: 20px;
}

.spaceBottomBig {
  margin-bottom: 40px;
}

.spaceBottomHuge {
  margin-bottom: 80px;
}

/*!
 * Datepicker for Bootstrap v1.5.1 (https://github.com/eternicode/bootstrap-datepicker)
 *
 * Copyright 2012 Stefan Petre
 * Improvements by Andrew Rowls
 * Licensed under the Apache License v2.0 (http://www.apache.org/licenses/LICENSE-2.0)
 */
.datepicker-dropdown:after, .datepicker-dropdown:before {
  content: "";
  display: inline-block;
  border-top: 0;
  position: absolute;
}

.datepicker {
  border-radius: 4px;
  direction: ltr;
}

.datepicker-inline {
  width: 220px;
}

.datepicker.datepicker-rtl {
  direction: rtl;
}

.datepicker.datepicker-rtl table tr td span {
  float: right;
}

.datepicker-dropdown {
  top: 0;
  left: 0;
  padding: 4px;
}

.datepicker-dropdown:before {
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid rgba(0, 0, 0, 0.15);
  border-bottom-color: rgba(0, 0, 0, 0.2);
}

.datepicker-dropdown:after {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
}

.datepicker-dropdown.datepicker-orient-left:before {
  left: 6px;
}

.datepicker-dropdown.datepicker-orient-left:after {
  left: 7px;
}

.datepicker-dropdown.datepicker-orient-right:before {
  right: 6px;
}

.datepicker-dropdown.datepicker-orient-right:after {
  right: 7px;
}

.datepicker-dropdown.datepicker-orient-bottom:before {
  top: -7px;
}

.datepicker-dropdown.datepicker-orient-bottom:after {
  top: -6px;
}

.datepicker-dropdown.datepicker-orient-top:before {
  bottom: -7px;
  border-bottom: 0;
  border-top: 7px solid rgba(0, 0, 0, 0.15);
}

.datepicker-dropdown.datepicker-orient-top:after {
  bottom: -6px;
  border-bottom: 0;
  border-top: 6px solid #fff;
}

.datepicker > div {
  display: none;
}

.datepicker table {
  margin: 0;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.datepicker table tr td, .datepicker table tr th {
  text-align: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
  border: none;
}

.table-striped .datepicker table tr td, .table-striped .datepicker table tr th {
  background-color: transparent;
}

.datepicker table tr td.new, .datepicker table tr td.old {
  color: #999;
}

.datepicker table tr td.day:hover, .datepicker table tr td.focused {
  background: #eee;
  cursor: pointer;
}

.datepicker table tr td.disabled, .datepicker table tr td.disabled:hover {
  background: 0 0;
  color: #999;
  cursor: default;
}

.datepicker table tr td.highlighted {
  color: #000;
  background-color: #d9edf7;
  border-color: #85c5e5;
  border-radius: 0;
}

.datepicker table tr td.highlighted.focus, .datepicker table tr td.highlighted:focus {
  color: #000;
  background-color: #afd9ee;
  border-color: #298fc2;
}

.datepicker table tr td.highlighted.active, .datepicker table tr td.highlighted:active, .datepicker table tr td.highlighted:hover, .open > .dropdown-toggle.datepicker table tr td.highlighted {
  color: #000;
  background-color: #afd9ee;
  border-color: #52addb;
}

.datepicker table tr td.highlighted.active.focus, .datepicker table tr td.highlighted.active:focus, .datepicker table tr td.highlighted.active:hover, .datepicker table tr td.highlighted:active.focus, .datepicker table tr td.highlighted:active:focus, .datepicker table tr td.highlighted:active:hover, .open > .dropdown-toggle.datepicker table tr td.highlighted.focus, .open > .dropdown-toggle.datepicker table tr td.highlighted:focus, .open > .dropdown-toggle.datepicker table tr td.highlighted:hover {
  color: #000;
  background-color: #91cbe8;
  border-color: #298fc2;
}

.datepicker table tr td.highlighted.active, .datepicker table tr td.highlighted:active, .open > .dropdown-toggle.datepicker table tr td.highlighted {
  background-image: none;
}

.datepicker table tr td.highlighted.disabled.focus, .datepicker table tr td.highlighted.disabled:focus, .datepicker table tr td.highlighted.disabled:hover, .datepicker table tr td.highlighted[disabled].focus, .datepicker table tr td.highlighted[disabled]:focus, .datepicker table tr td.highlighted[disabled]:hover, fieldset[disabled] .datepicker table tr td.highlighted.focus, fieldset[disabled] .datepicker table tr td.highlighted:focus, fieldset[disabled] .datepicker table tr td.highlighted:hover {
  background-color: #d9edf7;
  border-color: #85c5e5;
}

.datepicker table tr td.highlighted.focused {
  background: #afd9ee;
}

.datepicker table tr td.highlighted.disabled, .datepicker table tr td.highlighted.disabled:active {
  background: #d9edf7;
  color: #999;
}

.datepicker table tr td.today {
  color: #000;
  background-color: #ffdb99;
  border-color: #ffb733;
}

.datepicker table tr td.today.focus, .datepicker table tr td.today:focus {
  color: #000;
  background-color: #ffc966;
  border-color: #b37400;
}

.datepicker table tr td.today.active, .datepicker table tr td.today:active, .datepicker table tr td.today:hover, .open > .dropdown-toggle.datepicker table tr td.today {
  color: #000;
  background-color: #ffc966;
  border-color: #f59e00;
}

.datepicker table tr td.today.active.focus, .datepicker table tr td.today.active:focus, .datepicker table tr td.today.active:hover, .datepicker table tr td.today:active.focus, .datepicker table tr td.today:active:focus, .datepicker table tr td.today:active:hover, .open > .dropdown-toggle.datepicker table tr td.today.focus, .open > .dropdown-toggle.datepicker table tr td.today:focus, .open > .dropdown-toggle.datepicker table tr td.today:hover {
  color: #000;
  background-color: #ffbc42;
  border-color: #b37400;
}

.datepicker table tr td.today.active, .datepicker table tr td.today:active, .open > .dropdown-toggle.datepicker table tr td.today {
  background-image: none;
}

.datepicker table tr td.today.disabled.focus, .datepicker table tr td.today.disabled:focus, .datepicker table tr td.today.disabled:hover, .datepicker table tr td.today[disabled].focus, .datepicker table tr td.today[disabled]:focus, .datepicker table tr td.today[disabled]:hover, fieldset[disabled] .datepicker table tr td.today.focus, fieldset[disabled] .datepicker table tr td.today:focus, fieldset[disabled] .datepicker table tr td.today:hover {
  background-color: #ffdb99;
  border-color: #ffb733;
}

.datepicker table tr td.today.focused {
  background: #ffc966;
}

.datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled:active {
  background: #ffdb99;
  color: #999;
}

.datepicker table tr td.range {
  color: #000;
  background-color: #eee;
  border-color: #bbb;
  border-radius: 0;
}

.datepicker table tr td.range.focus, .datepicker table tr td.range:focus {
  color: #000;
  background-color: #d5d5d5;
  border-color: #7c7c7c;
}

.datepicker table tr td.range.active, .datepicker table tr td.range:active, .datepicker table tr td.range:hover, .open > .dropdown-toggle.datepicker table tr td.range {
  color: #000;
  background-color: #d5d5d5;
  border-color: #9d9d9d;
}

.datepicker table tr td.range.active.focus, .datepicker table tr td.range.active:focus, .datepicker table tr td.range.active:hover, .datepicker table tr td.range:active.focus, .datepicker table tr td.range:active:focus, .datepicker table tr td.range:active:hover, .open > .dropdown-toggle.datepicker table tr td.range.focus, .open > .dropdown-toggle.datepicker table tr td.range:focus, .open > .dropdown-toggle.datepicker table tr td.range:hover {
  color: #000;
  background-color: #c3c3c3;
  border-color: #7c7c7c;
}

.datepicker table tr td.range.active, .datepicker table tr td.range:active, .open > .dropdown-toggle.datepicker table tr td.range {
  background-image: none;
}

.datepicker table tr td.range.disabled.focus, .datepicker table tr td.range.disabled:focus, .datepicker table tr td.range.disabled:hover, .datepicker table tr td.range[disabled].focus, .datepicker table tr td.range[disabled]:focus, .datepicker table tr td.range[disabled]:hover, fieldset[disabled] .datepicker table tr td.range.focus, fieldset[disabled] .datepicker table tr td.range:focus, fieldset[disabled] .datepicker table tr td.range:hover {
  background-color: #eee;
  border-color: #bbb;
}

.datepicker table tr td.range.focused {
  background: #d5d5d5;
}

.datepicker table tr td.range.disabled, .datepicker table tr td.range.disabled:active {
  background: #eee;
  color: #999;
}

.datepicker table tr td.range.highlighted {
  color: #000;
  background-color: #e4eef3;
  border-color: #9dc1d3;
}

.datepicker table tr td.range.highlighted.focus, .datepicker table tr td.range.highlighted:focus {
  color: #000;
  background-color: #c1d7e3;
  border-color: #4b88a6;
}

.datepicker table tr td.range.highlighted.active, .datepicker table tr td.range.highlighted:active, .datepicker table tr td.range.highlighted:hover, .open > .dropdown-toggle.datepicker table tr td.range.highlighted {
  color: #000;
  background-color: #c1d7e3;
  border-color: #73a6c0;
}

.datepicker table tr td.range.highlighted.active.focus, .datepicker table tr td.range.highlighted.active:focus, .datepicker table tr td.range.highlighted.active:hover, .datepicker table tr td.range.highlighted:active.focus, .datepicker table tr td.range.highlighted:active:focus, .datepicker table tr td.range.highlighted:active:hover, .open > .dropdown-toggle.datepicker table tr td.range.highlighted.focus, .open > .dropdown-toggle.datepicker table tr td.range.highlighted:focus, .open > .dropdown-toggle.datepicker table tr td.range.highlighted:hover {
  color: #000;
  background-color: #a8c8d8;
  border-color: #4b88a6;
}

.datepicker table tr td.range.highlighted.active, .datepicker table tr td.range.highlighted:active, .open > .dropdown-toggle.datepicker table tr td.range.highlighted {
  background-image: none;
}

.datepicker table tr td.range.highlighted.disabled.focus, .datepicker table tr td.range.highlighted.disabled:focus, .datepicker table tr td.range.highlighted.disabled:hover, .datepicker table tr td.range.highlighted[disabled].focus, .datepicker table tr td.range.highlighted[disabled]:focus, .datepicker table tr td.range.highlighted[disabled]:hover, fieldset[disabled] .datepicker table tr td.range.highlighted.focus, fieldset[disabled] .datepicker table tr td.range.highlighted:focus, fieldset[disabled] .datepicker table tr td.range.highlighted:hover {
  background-color: #e4eef3;
  border-color: #9dc1d3;
}

.datepicker table tr td.range.highlighted.focused {
  background: #c1d7e3;
}

.datepicker table tr td.range.highlighted.disabled, .datepicker table tr td.range.highlighted.disabled:active {
  background: #e4eef3;
  color: #999;
}

.datepicker table tr td.range.today {
  color: #000;
  background-color: #f7ca77;
  border-color: #f1a417;
}

.datepicker table tr td.range.today.focus, .datepicker table tr td.range.today:focus {
  color: #000;
  background-color: #f4b747;
  border-color: #815608;
}

.datepicker table tr td.range.today.active, .datepicker table tr td.range.today:active, .datepicker table tr td.range.today:hover, .open > .dropdown-toggle.datepicker table tr td.range.today {
  color: #000;
  background-color: #f4b747;
  border-color: #bf800c;
}

.datepicker table tr td.range.today.active.focus, .datepicker table tr td.range.today.active:focus, .datepicker table tr td.range.today.active:hover, .datepicker table tr td.range.today:active.focus, .datepicker table tr td.range.today:active:focus, .datepicker table tr td.range.today:active:hover, .open > .dropdown-toggle.datepicker table tr td.range.today.focus, .open > .dropdown-toggle.datepicker table tr td.range.today:focus, .open > .dropdown-toggle.datepicker table tr td.range.today:hover {
  color: #000;
  background-color: #f2aa25;
  border-color: #815608;
}

.datepicker table tr td.range.today.active, .datepicker table tr td.range.today:active, .open > .dropdown-toggle.datepicker table tr td.range.today {
  background-image: none;
}

.datepicker table tr td.range.today.disabled.focus, .datepicker table tr td.range.today.disabled:focus, .datepicker table tr td.range.today.disabled:hover, .datepicker table tr td.range.today[disabled].focus, .datepicker table tr td.range.today[disabled]:focus, .datepicker table tr td.range.today[disabled]:hover, fieldset[disabled] .datepicker table tr td.range.today.focus, fieldset[disabled] .datepicker table tr td.range.today:focus, fieldset[disabled] .datepicker table tr td.range.today:hover {
  background-color: #f7ca77;
  border-color: #f1a417;
}

.datepicker table tr td.range.today.disabled, .datepicker table tr td.range.today.disabled:active {
  background: #f7ca77;
  color: #999;
}

.datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active:active, .datepicker table tr td.selected.active, .datepicker table tr td.selected.highlighted.active, .datepicker table tr td.selected.highlighted:active, .datepicker table tr td.selected:active, .open > .dropdown-toggle.datepicker table tr td.active, .open > .dropdown-toggle.datepicker table tr td.active.highlighted, .open > .dropdown-toggle.datepicker table tr td.selected, .open > .dropdown-toggle.datepicker table tr td.selected.highlighted {
  background-image: none;
}

.datepicker table tr td.selected, .datepicker table tr td.selected.highlighted {
  color: #fff;
  background-color: #999;
  border-color: #555;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td.selected.focus, .datepicker table tr td.selected.highlighted.focus, .datepicker table tr td.selected.highlighted:focus, .datepicker table tr td.selected:focus {
  color: #fff;
  background-color: grey;
  border-color: #161616;
}

.datepicker table tr td.selected.active, .datepicker table tr td.selected.highlighted.active, .datepicker table tr td.selected.highlighted:active, .datepicker table tr td.selected.highlighted:hover, .datepicker table tr td.selected:active, .datepicker table tr td.selected:hover, .open > .dropdown-toggle.datepicker table tr td.selected, .open > .dropdown-toggle.datepicker table tr td.selected.highlighted {
  color: #fff;
  background-color: grey;
  border-color: #373737;
}

.datepicker table tr td.selected.active.focus, .datepicker table tr td.selected.active:focus, .datepicker table tr td.selected.active:hover, .datepicker table tr td.selected.highlighted.active.focus, .datepicker table tr td.selected.highlighted.active:focus, .datepicker table tr td.selected.highlighted.active:hover, .datepicker table tr td.selected.highlighted:active.focus, .datepicker table tr td.selected.highlighted:active:focus, .datepicker table tr td.selected.highlighted:active:hover, .datepicker table tr td.selected:active.focus, .datepicker table tr td.selected:active:focus, .datepicker table tr td.selected:active:hover, .open > .dropdown-toggle.datepicker table tr td.selected.focus, .open > .dropdown-toggle.datepicker table tr td.selected.highlighted.focus, .open > .dropdown-toggle.datepicker table tr td.selected.highlighted:focus, .open > .dropdown-toggle.datepicker table tr td.selected.highlighted:hover, .open > .dropdown-toggle.datepicker table tr td.selected:focus, .open > .dropdown-toggle.datepicker table tr td.selected:hover {
  color: #fff;
  background-color: #6e6e6e;
  border-color: #161616;
}

.datepicker table tr td.selected.disabled.focus, .datepicker table tr td.selected.disabled:focus, .datepicker table tr td.selected.disabled:hover, .datepicker table tr td.selected.highlighted.disabled.focus, .datepicker table tr td.selected.highlighted.disabled:focus, .datepicker table tr td.selected.highlighted.disabled:hover, .datepicker table tr td.selected.highlighted[disabled].focus, .datepicker table tr td.selected.highlighted[disabled]:focus, .datepicker table tr td.selected.highlighted[disabled]:hover, .datepicker table tr td.selected[disabled].focus, .datepicker table tr td.selected[disabled]:focus, .datepicker table tr td.selected[disabled]:hover, fieldset[disabled] .datepicker table tr td.selected.focus, fieldset[disabled] .datepicker table tr td.selected.highlighted.focus, fieldset[disabled] .datepicker table tr td.selected.highlighted:focus, fieldset[disabled] .datepicker table tr td.selected.highlighted:hover, fieldset[disabled] .datepicker table tr td.selected:focus, fieldset[disabled] .datepicker table tr td.selected:hover {
  background-color: #999;
  border-color: #555;
}

.datepicker table tr td.active, .datepicker table tr td.active.highlighted {
  color: #fff;
  background-color: #428bca;
  border-color: #357ebd;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td.active.focus, .datepicker table tr td.active.highlighted.focus, .datepicker table tr td.active.highlighted:focus, .datepicker table tr td.active:focus {
  color: #fff;
  background-color: #3071a9;
  border-color: #193c5a;
}

.datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active.highlighted:hover, .datepicker table tr td.active:active, .datepicker table tr td.active:hover, .open > .dropdown-toggle.datepicker table tr td.active, .open > .dropdown-toggle.datepicker table tr td.active.highlighted {
  color: #fff;
  background-color: #3071a9;
  border-color: #285e8e;
}

.datepicker table tr td.active.active.focus, .datepicker table tr td.active.active:focus, .datepicker table tr td.active.active:hover, .datepicker table tr td.active.highlighted.active.focus, .datepicker table tr td.active.highlighted.active:focus, .datepicker table tr td.active.highlighted.active:hover, .datepicker table tr td.active.highlighted:active.focus, .datepicker table tr td.active.highlighted:active:focus, .datepicker table tr td.active.highlighted:active:hover, .datepicker table tr td.active:active.focus, .datepicker table tr td.active:active:focus, .datepicker table tr td.active:active:hover, .open > .dropdown-toggle.datepicker table tr td.active.focus, .open > .dropdown-toggle.datepicker table tr td.active.highlighted.focus, .open > .dropdown-toggle.datepicker table tr td.active.highlighted:focus, .open > .dropdown-toggle.datepicker table tr td.active.highlighted:hover, .open > .dropdown-toggle.datepicker table tr td.active:focus, .open > .dropdown-toggle.datepicker table tr td.active:hover {
  color: #fff;
  background-color: #285e8e;
  border-color: #193c5a;
}

.datepicker table tr td.active.disabled.focus, .datepicker table tr td.active.disabled:focus, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active.highlighted.disabled.focus, .datepicker table tr td.active.highlighted.disabled:focus, .datepicker table tr td.active.highlighted.disabled:hover, .datepicker table tr td.active.highlighted[disabled].focus, .datepicker table tr td.active.highlighted[disabled]:focus, .datepicker table tr td.active.highlighted[disabled]:hover, .datepicker table tr td.active[disabled].focus, .datepicker table tr td.active[disabled]:focus, .datepicker table tr td.active[disabled]:hover, fieldset[disabled] .datepicker table tr td.active.focus, fieldset[disabled] .datepicker table tr td.active.highlighted.focus, fieldset[disabled] .datepicker table tr td.active.highlighted:focus, fieldset[disabled] .datepicker table tr td.active.highlighted:hover, fieldset[disabled] .datepicker table tr td.active:focus, fieldset[disabled] .datepicker table tr td.active:hover {
  background-color: #428bca;
  border-color: #357ebd;
}

.datepicker table tr td span {
  display: block;
  width: 23%;
  height: 54px;
  line-height: 54px;
  float: left;
  margin: 1%;
  cursor: pointer;
  border-radius: 4px;
}

.datepicker table tr td span:hover {
  background: #eee;
}

.datepicker table tr td span.disabled, .datepicker table tr td span.disabled:hover {
  background: 0 0;
  color: #999;
  cursor: default;
}

.datepicker .datepicker-switch, .datepicker .next, .datepicker .prev, .datepicker tfoot tr th, .input-group.date .input-group-addon {
  cursor: pointer;
}

.datepicker table tr td span.active, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active:hover {
  color: #fff;
  background-color: #428bca;
  border-color: #357ebd;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td span.active.disabled.focus, .datepicker table tr td span.active.disabled:focus, .datepicker table tr td span.active.disabled:hover.focus, .datepicker table tr td span.active.disabled:hover:focus, .datepicker table tr td span.active.focus, .datepicker table tr td span.active:focus, .datepicker table tr td span.active:hover.focus, .datepicker table tr td span.active:hover:focus {
  color: #fff;
  background-color: #3071a9;
  border-color: #193c5a;
}

.datepicker table tr td span.active.active, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active.disabled:hover.active, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active.disabled:hover:hover, .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active:hover:active, .datepicker table tr td span.active:hover:hover, .open > .dropdown-toggle.datepicker table tr td span.active, .open > .dropdown-toggle.datepicker table tr td span.active.disabled, .open > .dropdown-toggle.datepicker table tr td span.active.disabled:hover, .open > .dropdown-toggle.datepicker table tr td span.active:hover {
  color: #fff;
  background-color: #3071a9;
  border-color: #285e8e;
}

.datepicker table tr td span.active.active.focus, .datepicker table tr td span.active.active:focus, .datepicker table tr td span.active.active:hover, .datepicker table tr td span.active.disabled.active.focus, .datepicker table tr td span.active.disabled.active:focus, .datepicker table tr td span.active.disabled.active:hover, .datepicker table tr td span.active.disabled:active.focus, .datepicker table tr td span.active.disabled:active:focus, .datepicker table tr td span.active.disabled:active:hover, .datepicker table tr td span.active.disabled:hover.active.focus, .datepicker table tr td span.active.disabled:hover.active:focus, .datepicker table tr td span.active.disabled:hover.active:hover, .datepicker table tr td span.active.disabled:hover:active.focus, .datepicker table tr td span.active.disabled:hover:active:focus, .datepicker table tr td span.active.disabled:hover:active:hover, .datepicker table tr td span.active:active.focus, .datepicker table tr td span.active:active:focus, .datepicker table tr td span.active:active:hover, .datepicker table tr td span.active:hover.active.focus, .datepicker table tr td span.active:hover.active:focus, .datepicker table tr td span.active:hover.active:hover, .datepicker table tr td span.active:hover:active.focus, .datepicker table tr td span.active:hover:active:focus, .datepicker table tr td span.active:hover:active:hover, .open > .dropdown-toggle.datepicker table tr td span.active.disabled.focus, .open > .dropdown-toggle.datepicker table tr td span.active.disabled:focus, .open > .dropdown-toggle.datepicker table tr td span.active.disabled:hover, .open > .dropdown-toggle.datepicker table tr td span.active.disabled:hover.focus, .open > .dropdown-toggle.datepicker table tr td span.active.disabled:hover:focus, .open > .dropdown-toggle.datepicker table tr td span.active.disabled:hover:hover, .open > .dropdown-toggle.datepicker table tr td span.active.focus, .open > .dropdown-toggle.datepicker table tr td span.active:focus, .open > .dropdown-toggle.datepicker table tr td span.active:hover, .open > .dropdown-toggle.datepicker table tr td span.active:hover.focus, .open > .dropdown-toggle.datepicker table tr td span.active:hover:focus, .open > .dropdown-toggle.datepicker table tr td span.active:hover:hover {
  color: #fff;
  background-color: #285e8e;
  border-color: #193c5a;
}

.datepicker table tr td span.active.active, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover.active, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active:hover:active, .open > .dropdown-toggle.datepicker table tr td span.active, .open > .dropdown-toggle.datepicker table tr td span.active.disabled, .open > .dropdown-toggle.datepicker table tr td span.active.disabled:hover, .open > .dropdown-toggle.datepicker table tr td span.active:hover {
  background-image: none;
}

.datepicker table tr td span.active.disabled.disabled.focus, .datepicker table tr td span.active.disabled.disabled:focus, .datepicker table tr td span.active.disabled.disabled:hover, .datepicker table tr td span.active.disabled.focus, .datepicker table tr td span.active.disabled:focus, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active.disabled:hover.disabled.focus, .datepicker table tr td span.active.disabled:hover.disabled:focus, .datepicker table tr td span.active.disabled:hover.disabled:hover, .datepicker table tr td span.active.disabled:hover[disabled].focus, .datepicker table tr td span.active.disabled:hover[disabled]:focus, .datepicker table tr td span.active.disabled:hover[disabled]:hover, .datepicker table tr td span.active.disabled[disabled].focus, .datepicker table tr td span.active.disabled[disabled]:focus, .datepicker table tr td span.active.disabled[disabled]:hover, .datepicker table tr td span.active:hover.disabled.focus, .datepicker table tr td span.active:hover.disabled:focus, .datepicker table tr td span.active:hover.disabled:hover, .datepicker table tr td span.active:hover[disabled].focus, .datepicker table tr td span.active:hover[disabled]:focus, .datepicker table tr td span.active:hover[disabled]:hover, .datepicker table tr td span.active[disabled].focus, .datepicker table tr td span.active[disabled]:focus, .datepicker table tr td span.active[disabled]:hover, fieldset[disabled] .datepicker table tr td span.active.disabled.focus, fieldset[disabled] .datepicker table tr td span.active.disabled:focus, fieldset[disabled] .datepicker table tr td span.active.disabled:hover, fieldset[disabled] .datepicker table tr td span.active.disabled:hover.focus, fieldset[disabled] .datepicker table tr td span.active.disabled:hover:focus, fieldset[disabled] .datepicker table tr td span.active.disabled:hover:hover, fieldset[disabled] .datepicker table tr td span.active.focus, fieldset[disabled] .datepicker table tr td span.active:focus, fieldset[disabled] .datepicker table tr td span.active:hover, fieldset[disabled] .datepicker table tr td span.active:hover.focus, fieldset[disabled] .datepicker table tr td span.active:hover:focus, fieldset[disabled] .datepicker table tr td span.active:hover:hover {
  background-color: #428bca;
  border-color: #357ebd;
}

.datepicker table tr td span.new, .datepicker table tr td span.old {
  color: #999;
}

.datepicker .datepicker-switch {
  width: 145px;
}

.datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover, .datepicker tfoot tr th:hover {
  background: #eee;
}

.datepicker .cw {
  font-size: 10px;
  width: 12px;
  padding: 0 2px 0 5px;
  vertical-align: middle;
}

.input-daterange {
  width: 100%;
}

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

.input-daterange input:first-child {
  border-radius: 3px 0 0 3px;
}

.input-daterange input:last-child {
  border-radius: 0 3px 3px 0;
}

.input-daterange .input-group-addon {
  width: auto;
  min-width: 16px;
  padding: 4px 5px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  text-shadow: 0 1px 0 #fff;
  vertical-align: middle;
  background-color: #eee;
  border: solid #ccc;
  border-width: 1px 0;
  margin-left: -5px;
  margin-right: -5px;
}

.fcx-btn-filter {
  margin-top: 4px;
}

.fcx-btn-filter .btn-default {
  position: relative;
  background: none;
  border-color: transparent;
}

.fcx-btn-filter .btn-default:hover {
  border-color: #ccc;
}

.fcx-btn-filter .btn-default:focus,
.fcx-btn-filter .btn-default:active {
  border-color: #ccc;
  background: none;
  outline: none !important;
}

.fcx-btn-filter .btn-default[data-toggle=collapse]:not(.collapsed) {
  border-color: #ccc;
}

.fcx-btn-filter #fcx-filter-clear {
  border-color: #ccc;
}

.fcx-btn-filter .btn-dropdown,
.fcx-btn-filter .dropdown-toggle {
  padding-right: 25px;
}

.fcx-btn-filter .bs-caret .caret {
  position: absolute;
  top: 50%;
  right: 12px;
  margin-top: -2px;
  vertical-align: middle;
}

.fcx-btn-filter .btn-group.open .dropdown-toggle {
  -webkit-box-shadow: 0 0 0;
  box-shadow: 0 0 0;
  border-color: #ccc;
  background: none;
}

.fcx-btn-filter .sort .dropdown-menu {
  left: auto;
  right: 0;
}

#filter-container .form-control {
  margin-bottom: 6px;
}

#filter-container .checkbox,
#filter-container .radio {
  padding-left: 15px;
}

#filter h5 {
  padding-bottom: 12px;
  margin-bottom: 12px;
  border-bottom: 1px solid #ddd;
}

#filter .form-group:not(:first-of-type) {
  padding-top: 5px;
  border-top: 1px solid #ddd;
}

.fcx-datepicker {
  text-align: left;
  width: 100%;
  margin-bottom: 10px;
  overflow: hidden;
  background: #fff;
}

.fcx-datepicker .caption {
  display: inline;
}

.fcx-datepicker-spacer {
  display: none;
  text-align: center;
  padding-top: 4px;
}

.flexbox #fcx-datepicker {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 16px;
}

.flexbox #fcx-datepicker .fcx-datepicker {
  -webkit-box-flex: 2;
  -webkit-flex: 2;
  -ms-flex: 2;
  flex: 2;
  width: auto;
  margin-bottom: 0;
}

.flexbox #fcx-datepicker .fcx-datepicker-spacer {
  display: block;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.filter-select {
  margin-top: 20px;
}

.fcx-categories {
  margin: 0 0 10px;
  padding: 0;
  width: 100%;
}

.fcx-categories .col-xs-3 {
  padding-left: 0;
  padding-right: 0;
}

.fcx-categories label.btn-default {
  background: #eee;
  border: 1px solid #ccc;
  margin: 5px;
  padding: 3px;
  -webkit-transition: background 250ms ease, color 250ms ease, border 250ms ease;
  -o-transition: background 250ms ease, color 250ms ease, border 250ms ease;
  transition: background 250ms ease, color 250ms ease, border 250ms ease;
}

.fcx-categories label.btn-default:hover {
  background-color: #fff;
  border: 1px solid #39a9e0;
}

.fcx-categories label.btn-default.active {
  background-color: #39a9e0;
  color: #fff;
  border: 1px solid #1f90c7;
}

.fcx-categories label.btn-default.active.partial {
  background-color: #91cfee;
  border: 1px solid #65bce7;
}

.fcx-categories label h5 {
  margin: 6px 0 2px;
  font-size: 12px;
}

.personalfilter {
  width: 300px;
  padding: 0 10px;
}

.btn-personalfilter {
  display: block;
  position: fixed;
  right: -1px;
  top: 50%;
  z-index: 500;
  border-right: none;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  padding: 15px 2px;
}

.my-photos .badge-feature {
  margin-bottom: 0;
}

.btn-lg small {
  display: block;
  font-size: 11px;
  padding-bottom: 5px;
}

.search-profile {
  width: 100% !important;
}

.search-profile .input-group-btn {
  width: 1% !important;
}

.tags .btn-primary {
  background: none;
  color: #39a9e0;
  margin-bottom: 5px;
}

.tags .btn-primary.active {
  padding: 1px 20px 1px 8px;
  background: #39a9e0;
  color: #fff;
}

.tags .btn-primary.active::after {
  position: absolute;
  font-family: "fcx-icons";
  content: "";
  padding-left: 4px;
}

.tags .btn-primary.active:hover {
  border-color: #39a9e0;
}

.add-tag-filter .bootstrap-tagsinput {
  background: #fff;
  width: 100%;
  border: 1px solid #ccc;
}

.add-tag-filter .bootstrap-tagsinput:focus {
  border: 1px solid #39a9e0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.fcx-search-titles {
  font-size: 12px;
  color: #666;
  padding-top: 2px;
}

/*
 * jQuery File Upload Plugin CSS
 * https://github.com/blueimp/jQuery-File-Upload
 *
 * Copyright 2013, Sebastian Tschan
 * https://blueimp.net
 *
 * Licensed under the MIT license:
 * https://opensource.org/licenses/MIT
 */
.fileinput-button {
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.fileinput-button input {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  opacity: 0;
  -ms-filter: "alpha(opacity=0)";
  font-size: 200px !important;
  direction: ltr;
  cursor: pointer;
}

/* Fixes for IE < 8 */
@media screen\9  {
  .fileinput-button input {
    filter: alpha(opacity=0);
    font-size: 100%;
    height: 100%;
  }
}
.dropzone,
.dropzone * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.clearfix {
  *zoom: 1;
}

.clearfix::after {
  clear: both;
}

.clearfix::before,
.clearfix::after {
  content: " ";
  display: table;
}

#fcx-upload {
  padding-top: 96px;
  padding-top: 6rem;
  padding-bottom: 32px;
  padding-bottom: 2rem;
}

.fcx-dropzone-options {
  position: relative;
  margin: 0 0 32px;
  margin: 0 0 2rem;
}

.fcx-dropzone-options .btn:not(.pull-right),
.fcx-dropzone-options .fcx-settings-field:not(.pull-right) {
  margin-right: 4px;
}

.fcx-dropzone-options select[name=folder] + .bootstrap-select {
  margin-right: 4px;
}

.fcx-dropzone-options.fcx-dropzone-options-bottom {
  margin-top: 32px;
  margin-top: 2rem;
}

.fcx-dropzone-wrapper {
  padding: 6px;
  border-radius: 3px;
  border: 1px dashed #ddd;
  overflow: hidden;
}

.dz-preview {
  position: relative;
  display: block;
  margin: 0;
  border: none;
  vertical-align: top;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.dz-preview:hover {
  z-index: 1000;
}

.dz-preview.fcx-hidden {
  display: none !important;
}

.dz-preview .dz-image {
  float: left;
  position: relative;
  display: block;
  overflow: hidden;
  width: 80px;
  border-radius: 3px;
  border: 3px solid #fff;
  background: none;
  background-color: #fff;
  background-image: url(../images/photo/fallback/default-image.png);
  background-repeat: no-repeat;
  background-position: center;
  z-index: 10;
}

.dz-preview .dz-image::before {
  content: "";
  display: block;
  padding-top: 100%;
}

.dz-preview .dz-image canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
}

:root .dz-preview .dz-image {
  border-color: #ddd \0 ;
}

.dz-preview .dz-progress {
  opacity: 1;
  z-index: 1000;
  pointer-events: none;
  position: absolute;
  width: 100px;
  height: 20px;
  left: 50%;
  top: 50%;
  margin: -25px 0 0 -50px;
  background: rgba(255, 255, 255, 0.9);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  border-radius: 8px;
  overflow: hidden;
}

.dz-preview .dz-progress .progress {
  margin: 0;
}

.dz-preview .dz-progress .dz-upload {
  background: #333;
  background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#444));
  background: -webkit-linear-gradient(top, #666, #444);
  background: -o-linear-gradient(top, #666, #444);
  background: linear-gradient(to bottom, #666, #444);
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 0;
  -webkit-transition: width 300ms ease-in-out;
  -o-transition: width 300ms ease-in-out;
  transition: width 300ms ease-in-out;
}

.dz-preview.dz-processing .dz-progress {
  opacity: 1;
  -webkit-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.dz-preview.dz-complete .dz-progress {
  opacity: 0;
  -webkit-transition: opacity 0.4s ease-in;
  -o-transition: opacity 0.4s ease-in;
  transition: opacity 0.4s ease-in;
}

.dz-preview:not(.dz-processing) .dz-progress {
  -webkit-animation: pulse 6s ease infinite;
  animation: pulse 6s ease infinite;
}

.dz-preview .dz-remove {
  font-size: 14px;
  text-align: center;
  display: block;
  cursor: pointer;
  border: none;
}

.dz-preview .dz-remove:hover {
  text-decoration: underline;
}

.dz-preview.dz-error .dz-error-message {
  display: block;
}

.dz-preview.dz-error:hover .dz-error-message {
  opacity: 1;
  pointer-events: auto;
}

.dz-preview .dz-error-message {
  position: absolute;
  top: 130px;
  left: -10px;
  display: none;
  opacity: 0;
  font-size: 13px;
  color: white;
  padding: 0.5em 1.2em;
  width: 140px;
  border-radius: 8px;
  background: #be2626;
  background: -webkit-gradient(linear, left top, left bottom, from(#be2626), to(#a92222));
  background: -webkit-linear-gradient(top, #be2626, #a92222);
  background: -o-linear-gradient(top, #be2626, #a92222);
  background: linear-gradient(to bottom, #be2626, #a92222);
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  pointer-events: none;
  z-index: 1000;
}

.dz-preview .dz-error-message::after {
  content: "";
  position: absolute;
  top: -6px;
  left: 64px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #be2626;
}

.dz-preview .dz-success-mark,
.dz-preview .dz-error-mark {
  position: absolute;
  display: block;
  pointer-events: none;
  color: #fff;
  text-align: center;
  opacity: 0;
  z-index: 500;
  top: 60%;
  left: 21px;
  margin-top: -40px;
}

.dz-preview.dz-success .dz-success-mark {
  -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
  animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
}

.dz-preview.dz-error .dz-error-mark {
  opacity: 1;
  -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
  animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
}

@media screen and (min-width: 512px) {
  .dz-preview {
    float: left;
    width: 33.33333333%;
    margin: 0;
  }

  .dz-preview .dz-image {
    width: 100%;
  }

  .dz-preview .dz-success-mark,
.dz-preview .dz-error-mark {
    left: 50%;
    margin-top: -58px;
    margin-left: -29px;
  }
}
@media screen and (min-width: 992px) {
  .dz-preview {
    width: 25%;
  }
}
@media screen and (min-width: 1200px) {
  .dz-preview {
    min-width: 155px;
  }
}
.upload__info {
  text-align: center;
  padding: 24px;
  padding: 1.5rem;
  color: rgba(0, 0, 0, 0.5);
  background: #fafafa;
}

.upload__info p {
  margin: 24px 0 0;
  margin: 1.5rem 0 0;
}

.upload__info span {
  display: block;
}

.upload__info strong {
  color: #333;
}

.upload__info small {
  font-size: 12px;
}

.upload__info__quota .btn,
.upload__info__quota + .btn {
  margin-top: 24px;
  margin-top: 1.5rem;
}

.dz-preview.dz-upload-button {
  text-align: center;
  padding: 0;
  margin: 0;
}

.fileinput-button button {
  display: inline-block;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 0;
  background: none;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.fileinput-button button.upload-on {
  color: #39a9e0;
}

.fileinput-button button.upload-off {
  color: #ff8746;
}

.fileinput-button button.upload-off .fa-arrow-to-top {
  color: #333;
}

.fileinput-button input[type=file] {
  width: 100%;
  height: 100%;
}

.fileinput-button:hover button {
  opacity: 0.7;
}

.fileinput-button.disabled {
  pointer-events: none;
}

.fileinput-button.disabled button {
  cursor: default;
}

.fileinput-button.disabled input[type=file] {
  display: none;
  pointer-events: none;
  tab-index: -1;
}

.active .upload__info {
  display: none;
}

.active .fileinput-button {
  color: #777;
  padding: 5px 10px !important;
  width: 100%;
  border: 1px solid #ddd;
  background-color: #fff;
}

.active .fileinput-button:hover,
.active .fileinput-button:focus {
  background: #eee;
}

.active .fileinput-button.upload-is-empty,
.active .fileinput-button.disabled {
  display: none;
}

.active .dz-preview {
  *zoom: 1;
  padding: 10px;
}

.active .dz-preview::after {
  clear: both;
}

.active .dz-preview::before,
.active .dz-preview::after {
  content: " ";
  display: table;
}

.inactive .fcx-files {
  padding: 20vh 0;
  height: 100%;
}

.inactive .dz-preview.dz-upload-button {
  width: 100%;
  padding: 0 32px;
  padding: 0 2rem;
}

.inactive .fileinput-button {
  display: block;
  position: absolute;
  text-align: center;
  top: 50%;
  left: 50%;
  width: 160px;
  width: 10rem;
  height: 160px;
  height: 10rem;
  margin: -100px 0 0 -80px;
  margin: -100px 0 0 -5rem;
}

.inactive .fileinput-button button.upload-on {
  display: inline-block;
}

.inactive .fileinput-button button.upload-off {
  display: none;
}

.inactive .fileinput-button.disabled .upload-on {
  display: none;
}

.inactive .fileinput-button.disabled .upload-off {
  display: inline-block;
}

.dropzone {
  -webkit-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.dropzone.fcx-hidden {
  opacity: 0;
}

.dropzone.dz-clickable * {
  cursor: pointer;
}

.dropzone.dz-drag-hover {
  border: none;
}

.dz-preview.dz-message {
  text-align: center;
  padding: 0 32px;
  padding: 0 2rem;
  width: 100%;
}

.dz-preview.dz-message h3 {
  margin-top: 0;
}

.dz-preview.dz-message small {
  font-size: 13px;
  color: #777;
}

.dz-preview.dz-message #fcx-options-error-bar {
  margin: 0 auto;
}

.dz-preview.dz-message .progress.fcx-usage-bar {
  margin-bottom: 10px;
}

.dropzone .dz-data span:not(.title) {
  display: none;
}

.dropzone .dz-data span.title {
  cursor: pointer;
  padding: 2px 10px;
  margin-top: 4px;
  border-radius: 3px;
  display: inline-block;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.dropzone .dz-data span.title[contenteditable=true] {
  cursor: text;
}

.dropzone .dz-data span.title[contenteditable=true]:hover,
.dropzone .dz-data span.title[contenteditable=true]:focus {
  border: 1px dotted #39a9e0;
  outline: none !important;
}

@media screen and (min-width: 512px) {
  .dropzone .dz-data span.title {
    text-align: center;
    width: 100%;
  }
}
.dz-edit-mode {
  position: absolute;
  right: 13px;
  top: 13px;
  color: #333;
  border-bottom-left-radius: 3px;
  z-index: 20;
}

.dz-edit-mode .fa-square {
  display: inline-block;
}

.dz-edit-mode .fa-check-square {
  display: none;
  margin-right: -1px;
}

.dz-preview.selected .dz-edit-mode .fa-square {
  display: none;
}

.dz-preview.selected .dz-edit-mode .fa-check-square {
  display: inline-block;
}

@media screen and (min-width: 512px) {
  .dz-edit-mode {
    color: #fff;
    padding: 0 0 2px 5px;
    text-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
  }
}
.dz-publish-state {
  cursor: pointer;
  position: absolute;
  bottom: 46px;
  left: 21px;
  color: #fff;
  z-index: 20;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.dz-preview[data-publish="1"] .dz-publish-state {
  opacity: 1;
}

.fcx-files {
  *zoom: 1;
  margin: 0;
  padding: 0;
}

.fcx-files::after {
  clear: both;
}

.fcx-files::before,
.fcx-files::after {
  content: " ";
  display: table;
}

.fcx-files + .fcx-files {
  margin-top: 48px;
  margin-top: 3rem;
  min-height: 0;
}

#fcx-upload-images-btn {
  display: none;
}

#fcx-uploader.inactive .fcx-dropzone-options {
  display: none;
}

#fcx-uploader.inactive #fcx-images-wrapper {
  left: 0;
  width: 100%;
}

#fcx-uploader .dz-preview .dz-image {
  border: 3px solid #fff;
}

#fcx-uploader .dz-preview:hover .dz-image {
  cursor: pointer;
  border-color: #ccc;
}

#fcx-uploader .dz-preview.dz-success[data-has-meta-error="0"] .dz-image {
  border-color: #5cb85c;
}

#fcx-uploader .dz-preview.dz-success[data-has-meta-error="0"]:hover .dz-image {
  border-color: #80c780;
}

@media screen and (min-width: 512px) {
  #fcx-uploader .dz-preview.dz-success[data-has-meta-error="0"] .dz-edit-mode {
    background: #5cb85c;
  }

  #fcx-uploader .dz-preview.dz-success[data-has-meta-error="0"]:hover .dz-edit-mode {
    background: #80c780;
  }
}
#fcx-uploader .dz-preview.dz-meta-error .dz-image {
  border-color: #ff8746;
}

#fcx-uploader .dz-preview.dz-meta-error:hover .dz-image {
  border-color: #ffa879;
}

@media screen and (min-width: 512px) {
  #fcx-uploader .dz-preview.dz-meta-error .dz-edit-mode {
    background: #ff8746;
  }

  #fcx-uploader .dz-preview.dz-meta-error:hover .dz-edit-mode {
    background: #ffa879;
  }
}
#fcx-uploader .dz-preview.selected {
  background: #edf9ff;
}

#fcx-uploader .dz-preview.selected .dz-image {
  border-color: #ddd;
}

#fcx-uploader .dz-preview.selected.dz-success[data-has-meta-error="0"] .dz-image {
  border-color: #5cb85c;
}

#fcx-uploader .dz-preview.selected.dz-meta-error .dz-image {
  border-color: #ff8746;
}

@media screen and (min-width: 512px) {
  #fcx-uploader .dz-preview.selected {
    background: none;
  }

  #fcx-uploader .dz-preview.selected .title {
    background: #ddd;
  }

  #fcx-uploader .dz-preview.selected .dz-edit-mode {
    background-color: #ddd;
  }

  #fcx-uploader .dz-preview.selected.dz-success[data-has-meta-error="0"] .dz-edit-mode {
    background: #5cb85c;
  }

  #fcx-uploader .dz-preview.selected.dz-meta-error .dz-edit-mode {
    background: #ff8746;
  }
}
#fcx-uploader .dz-preview .error {
  pointer-events: none;
  position: absolute;
  display: none;
  opacity: 0;
  font-size: 13px;
  color: white;
  top: 130px;
  left: 20px;
  width: 140px;
  padding: 0.5em 1.2em;
  border-radius: 8px;
  background: #be2626;
  background: -webkit-gradient(linear, left top, left bottom, from(#be2626), to(#a92222));
  background: -webkit-linear-gradient(top, #be2626, #a92222);
  background: -o-linear-gradient(top, #be2626, #a92222);
  background: linear-gradient(to bottom, #be2626, #a92222);
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  z-index: 1000;
}

#fcx-uploader .dz-preview .error::after {
  content: "";
  position: absolute;
  top: -6px;
  left: 64px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #be2626;
}

#fcx-uploader .dz-preview.dz-error {
  opacity: 0.5;
}

#fcx-uploader .dz-preview.dz-error .error {
  display: block;
}

#fcx-uploader .dz-preview.dz-error:hover .dz-image {
  border: 3px solid #fff;
  cursor: default;
}

#fcx-uploader .dz-preview.dz-error:hover .error {
  opacity: 1;
  pointer-events: auto;
}

#fcx-uploader .dz-preview.dz-done {
  opacity: 0.5;
}

#fcx-uploader .dz-preview.dz-done:hover .dz-image {
  -webkit-filter: greyscale;
  filter: greyscale;
  cursor: default;
  border: 3px solid #fff;
}

#fcx-uploader .dz-preview.dz-done .dz-success-mark {
  opacity: 1;
}

#fcx-uploader .dz-preview.dz-done.dz-upload-success .dz-error-mark {
  opacity: 0;
}

#fcx-uploader .dz-preview.dz-done.dz-upload-success .dz-success-mark {
  opacity: 1;
}

#fcx-uploader .dz-preview.dz-done.dz-upload-success .dz-success-mark i {
  color: #5cb85c;
}

#fcx-uploader .dz-preview.dz-done.dz-upload-error .dz-success-mark {
  opacity: 0;
}

#fcx-uploader .dz-preview.dz-done.dz-upload-error .dz-error-mark {
  opacity: 1;
}

#fcx-uploader .dz-preview.dz-done.dz-upload-error .dz-error-mark i {
  color: #ff8746;
}

#fcx-uploader .dz-preview .dz-success-mark,
#fcx-uploader .dz-preview .dz-error-mark {
  width: 58px;
  height: 58px;
}

#fcx-uploader .dz-preview .dz-success-mark i,
#fcx-uploader .dz-preview .dz-error-mark i {
  font-size: 56px;
  color: #fff;
}

#fcx-uploader .dz-error .fcx-error-click-btn,
#fcx-uploader .dz-done .fcx-done-click-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 56px;
  width: 56px;
  border-radius: 50%;
  z-index: 1001;
  margin: -21px 0 0 -28px;
  cursor: pointer;
}

#fcx-options-bar,
#fcx-settings {
  display: none;
}

#fcx-options-bar .progress,
#fcx-settings .progress {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

#fcx-options-bar .progress .progress-bar,
#fcx-settings .progress .progress-bar {
  width: 0%;
  overflow: hidden;
}

#fcx-options-bar .progress .progress-bar .fcx-caption,
#fcx-settings .progress .progress-bar .fcx-caption {
  white-space: nowrap;
}

#fcx-options-bar .progress .progress-bar .fcx-caption-template,
#fcx-settings .progress .progress-bar .fcx-caption-template,
#fcx-options-bar .progress .progress-bar .fcx-tooltip-template,
#fcx-settings .progress .progress-bar .fcx-tooltip-template {
  display: none;
}

#fcx-settings {
  margin-top: 48px;
  margin-top: 3rem;
}

@media screen and (min-width: 992px) {
  #fcx-settings {
    margin-top: 0;
  }
}
#fcx-settings h5 {
  font-size: 13px;
  margin: 20px 0 5px;
}

#fcx-settings h6 {
  color: #999;
}

#fcx-settings hr {
  border-color: #999;
}

#fcx-settings a[data-toggle=collapse] {
  color: #333;
  font-size: 13px;
  margin-bottom: 5px;
  display: inline-block;
}

#fcx-settings a[data-toggle=collapse] i[class^=fa] {
  color: #999;
  font-size: 15px;
}

#fcx-settings a[data-toggle=collapse]:hover {
  color: #39a9e0;
}

#fcx-settings .container {
  padding-bottom: 6px;
  -webkit-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

#fcx-settings.inactive .container {
  opacity: 0.4;
}

#fcx-settings .bootstrap-select {
  display: block;
}

#fcx-settings .form-control,
#fcx-settings .progress {
  margin-bottom: 6px;
}

#fcx-settings .tag {
  color: #39a9e0;
  padding-right: 20px;
  background: #fff;
  max-width: 120px;
  display: inline-block;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

#fcx-settings .tag.partial {
  border-style: dashed;
}

#fcx-settings .tag:hover {
  color: #39a9e0;
  background: #fff;
}

#fcx-settings .fcx-add-tag-filter {
  padding-bottom: 6px;
}

#fcx-settings .fcx-add-tag-filter .bootstrap-tagsinput {
  width: 100%;
  border: 1px solid #ccc;
  background: #fff;
  overflow: hidden;
}

#fcx-settings .fcx-add-tag-filter:focus {
  border: 1px solid #39a9e0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

#fcx-settings .fcx-add-tag-filter input {
  margin: 0;
}

#fcx-settings .bootstrap-select {
  width: 100%;
}

#fcx-settings .bootstrap-select button {
  margin-bottom: 6px;
}

#fcx-settings .fcx-checkbox {
  font-size: 13px;
  font-weight: normal;
}

#fcx-settings .fcx-checkbox input {
  margin-right: 3px;
}

#fcx-settings .fcx-info-box {
  margin-top: 30px;
  padding: 10px;
  background-color: #ededed;
  border: 1px solid #e1e1e1;
}

#fcx-settings ul.fcx-galleries {
  list-style: none;
  padding-left: 0;
}

#fcx-settings ul.fcx-galleries li {
  border-bottom: 1px solid #e1e1e1;
  position: relative;
}

#fcx-settings ul.fcx-galleries li:first-of-type {
  border-top: 1px solid #e1e1e1;
}

#fcx-settings ul.fcx-galleries li.fcx-selected a,
#fcx-settings ul.fcx-galleries li.fcx-selected span {
  background-color: #39a9e0 !important;
  color: #fff !important;
}

#fcx-settings ul.fcx-galleries li.fcx-selected .icon {
  display: inline-block;
}

#fcx-settings ul.fcx-galleries li a {
  display: block;
  padding: 10px 6px;
}

#fcx-settings ul.fcx-galleries li a:hover {
  background-color: #fafafa;
}

#fcx-settings ul.fcx-galleries li a:hover .icon {
  display: inline-block;
}

#fcx-settings .fcx-hints {
  padding: 15px;
  margin-bottom: 32px;
  margin-bottom: 2rem;
  min-height: 100px;
  border-radius: 3px;
  border: 1px solid #ddd;
  background-color: #fafafa;
}

#fcx-settings .fcx-hints .upper {
  text-transform: uppercase;
}

#fcx-settings .fcx-hints-list {
  padding: 0;
  margin: 0 0 0 15px;
}

#fcx-settings .fcx-inner-settings {
  position: relative;
}

#fcx-settings .fcx-settings-overlay {
  display: block;
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

#fcx-settings .fcx-settings-overlay .list-group {
  border-radius: 3px;
  border: 1px solid #aeddf5;
}

#fcx-settings .fcx-settings-overlay .list-group-item {
  padding: 15px;
  vertical-align: top;
  border: 0;
}

#fcx-settings .fcx-settings-overlay .text {
  overflow: hidden;
}

#fcx-settings .keypad {
  display: inline-block;
  text-align: center;
  color: #fff;
  font-size: 32px;
  font-size: 2rem;
  line-height: 2.5;
  height: 80px;
  height: 5rem;
  width: 80px;
  width: 5rem;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.6);
  border-bottom: 1px solid rgba(0, 0, 0, 0.4);
}

#fcx-settings .keypad.key--ctrl {
  font-size: 16px;
  font-size: 1rem;
  line-height: 5;
}

#fcx-settings .fcx-settings-overlay .keypad {
  float: left;
  margin: 0 32px 32px 0;
  margin: 0 2rem 2rem 0;
}

.no-touchevents .no--touch {
  display: block;
}

.no-touchevents .is--touch {
  display: none;
}

.touchevents .no--touch {
  display: none;
}

.touchevents .is--touch {
  display: block;
}

#fcx-options-error-bar {
  width: 100%;
  max-width: 650px;
}

#fcx-options-bar .dropdown-menu a:hover span,
#fcx-options-error-bar .dropdown-menu a:hover span {
  color: #fff;
}

#fcx-options-bar button,
#fcx-options-error-bar button {
  -webkit-transition: color 0.2s ease;
  -o-transition: color 0.2s ease;
  transition: color 0.2s ease;
}

#fcx-options-bar button#fcx-delete-images-btn:hover,
#fcx-options-error-bar button#fcx-delete-images-btn:hover {
  color: #ff8746;
}

#fcx-options-bar button:hover,
#fcx-options-error-bar button:hover {
  color: #39a9e0;
}

#fcx-options-bar button.disabled,
#fcx-options-error-bar button.disabled {
  color: #ccc !important;
  opacity: 1;
}

#fcx-options-bar button.disabled:hover,
#fcx-options-error-bar button.disabled:hover {
  color: #ccc;
}

#fcx-options-bar .progress .progress-bar[data-keyname=no-more-uploads],
#fcx-options-error-bar .progress .progress-bar[data-keyname=no-more-uploads] {
  background: -webkit-gradient(linear, left top, left bottom, from(#ed4c33), to(#eb371c));
  background: -webkit-linear-gradient(top, #ed4c33 0%, #eb371c 100%);
  background: -o-linear-gradient(top, #ed4c33 0%, #eb371c 100%);
  background: linear-gradient(to bottom, #ed4c33 0%, #eb371c 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffED4C33", endColorstr="#deED4C33", GradientType=0);
}

#fcx-options-bar .progress .progress-bar[data-keyname=dropzone],
#fcx-options-error-bar .progress .progress-bar[data-keyname=dropzone],
#fcx-organizer #fcx-options-bar .progress .progress-bar.fcx-published-current-week,
#fcx-organizer #fcx-options-error-bar .progress .progress-bar.fcx-published-current-week {
  background: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#eea236));
  background: -webkit-linear-gradient(top, #f0ad4e 0%, #eea236 100%);
  background: -o-linear-gradient(top, #f0ad4e 0%, #eea236 100%);
  background: linear-gradient(to bottom, #f0ad4e 0%, #eea236 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffF0AD4E", endColorstr="#deF0AD4E", GradientType=0);
}

#fcx-options-bar .progress .progress-bar[data-keyname=published],
#fcx-options-error-bar .progress .progress-bar[data-keyname=published] {
  background: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#4cae4c));
  background: -webkit-linear-gradient(top, #5cb85c 0%, #4cae4c 100%);
  background: -o-linear-gradient(top, #5cb85c 0%, #4cae4c 100%);
  background: linear-gradient(to bottom, #5cb85c 0%, #4cae4c 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff5CB85C", endColorstr="#de5CB85C", GradientType=0);
}

#fcx-options-bar .progress .progress-bar[data-keyname=published].fcx-zero,
#fcx-options-error-bar .progress .progress-bar[data-keyname=published].fcx-zero {
  background: -webkit-gradient(linear, left top, left bottom, from(#ed4c33), to(#eb371c));
  background: -webkit-linear-gradient(top, #ed4c33 0%, #eb371c 100%);
  background: -o-linear-gradient(top, #ed4c33 0%, #eb371c 100%);
  background: linear-gradient(to bottom, #ed4c33 0%, #eb371c 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffED4C33", endColorstr="#deED4C33", GradientType=0);
}

#fcx-options-bar .progress .progress-bar[data-keyname=info],
#fcx-options-error-bar .progress .progress-bar[data-keyname=info] {
  background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#373737));
  background: -webkit-linear-gradient(top, #444 0%, #373737 100%);
  background: -o-linear-gradient(top, #444 0%, #373737 100%);
  background: linear-gradient(to bottom, #444 0%, #373737 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff444444", endColorstr="#de444444", GradientType=0);
}

#fcx-options-bar .progress .progress-bar[data-keyname=info] + .tooltip .tooltip-arrow[style],
#fcx-options-error-bar .progress .progress-bar[data-keyname=info] + .tooltip .tooltip-arrow[style] {
  left: 48px !important;
  left: 3rem !important;
}

#fcx-options-bar .progress .progress-bar[data-keyname=info] + .tooltip .tooltip-inner,
#fcx-options-error-bar .progress .progress-bar[data-keyname=info] + .tooltip .tooltip-inner {
  padding: 8px 12px;
}

#fcx-options-bar .progress .progress-bar[data-keyname=info] + .tooltip th,
#fcx-options-error-bar .progress .progress-bar[data-keyname=info] + .tooltip th,
#fcx-options-bar .progress .progress-bar[data-keyname=info] + .tooltip td,
#fcx-options-error-bar .progress .progress-bar[data-keyname=info] + .tooltip td {
  text-align: right;
  font-weight: normal;
  white-space: nowrap;
}

#fcx-options-bar .progress .progress-bar[data-keyname=info] + .tooltip td,
#fcx-options-error-bar .progress .progress-bar[data-keyname=info] + .tooltip td {
  padding: 2px 2px 2px 15px;
}

#fcx-images h4 span.label {
  font-size: 11px;
  vertical-align: 2px;
  font-weight: normal;
}

#fcx-images h4 span:first-of-type {
  margin-left: 6px;
}

#fcx-images .fcx-functions {
  padding-top: 6px;
}

#fcx-images .fcx-functions .icon {
  font-size: 18px;
  padding: 2px;
  cursor: pointer;
  -webkit-transition: color 0.25s ease;
  -o-transition: color 0.25s ease;
  transition: color 0.25s ease;
}

#fcx-images .fcx-functions .fa-folder {
  color: #39a9e0;
}

#fcx-images .fcx-functions .fa-folder:hover {
  color: #65bce7;
}

#fcx-images .fcx-functions .fa-trash-alt {
  color: #ff8746;
}

#fcx-images .fcx-functions .fa-trash-alt:hover {
  color: #ffa879;
}

#fcx-images .fcx-functions.inactive i[class^=fa] {
  color: #ccc;
  cursor: default;
}

#fcx-h-edit {
  display: none;
}

#fcx-h-selected {
  color: #39a9e0;
  font-size: 18px;
}

.fcx-no-upload {
  margin-bottom: -30px;
}

.fcx-no-upload .fcx-info {
  background-color: #fafafa;
  border-left: 1px solid #ededed;
  border-right: 1px solid #ededed;
  color: #39a9e0;
  font-size: 24px;
  line-height: 2;
  padding: 3em 15px 6em;
  text-align: center;
}

.fcx-no-upload .fcx-info small {
  color: #bbb;
  font-size: 85%;
}

.fcx-tags .btn-primary {
  color: #999;
  border: 1px solid #ddd;
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  max-width: 120px;
  display: inline-block;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.fcx-tags .btn-primary:hover {
  color: #39a9e0;
  border-color: #39a9e0;
  background: #fff;
}

.fcx-upload-publish-success {
  border-radius: 3px;
  padding: 8px 15px 1px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  background: #eaf6ea;
}

.fcx-limit-overall-exceeded a,
.fcx-remaining_current_week-exceeded a {
  margin: -3px 0 0 0;
}

.fcx-limit-overall-exceeded.fcx-hidden,
.fcx-remaining_current_week-exceeded.fcx-hidden {
  display: none;
}

#fcx-settings-form {
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

#fcx-settings-form .fcx-settings-errormessage {
  display: none;
}

#fcx-settings-form .fcx-settings-errormessage span {
  color: #ff8746;
}

#fcx-settings-form .fcx-settings-field.fcx-settings-error .fcx-settings-errormessage {
  display: block;
}

#fcx-settings-form .fcx-settings-field.fcx-settings-error select[name=category] + .bootstrap-select > button,
#fcx-settings-form .fcx-settings-field.fcx-settings-error select[name=license] + .bootstrap-select > button,
#fcx-settings-form .fcx-settings-field.fcx-settings-error select[name=sale] + .bootstrap-select > button,
#fcx-settings-form .fcx-settings-field.fcx-settings-error div.bootstrap-tagsinput,
#fcx-settings-form .fcx-settings-field.fcx-settings-error input[name=title],
#fcx-settings-form .fcx-settings-field.fcx-settings-error textarea[name=description] {
  border: 1px solid #ff8746;
}

.fcx-new-modal .modal-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 20px 40px;
  min-height: 300px;
  font-size: 16px;
}

.fcx-new-modal .modal-body {
  width: 100%;
}

.fcx-new-modal .modal-body i.icon {
  display: block;
  font-size: 64px;
  font-weight: bold;
  margin: 0;
  padding: 0;
}

.fcx-new-modal .modal-body i.icon::before {
  margin: 0 !important;
}

.fcx-new-modal .modal-body.fcx-done i {
  color: #5cb85c;
}

.fcx-new-modal .modal-body.fcx-fail i {
  color: #ff8746;
}

.fcx-new-modal .modal-body.fcx-confirm i {
  color: #f0ad4e;
}

.fcx-new-modal .fcx-spinner {
  margin-top: 20px;
  margin-bottom: 20px;
}

.fcx-new-modal.fcx-animated.in .modal-dialog {
  -webkit-animation: popup 0.5s ease;
  animation: popup 0.5s ease;
}

@-webkit-keyframes popup {
  0% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }
  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes popup {
  0% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }
  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.fcx-new-modal.fcx-animated.in .modal-dialog i.icon {
  -webkit-animation: spin 1s linear;
  animation: spin 1s linear;
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
  }
  100% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
  }
  100% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}
@-webkit-keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
  }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    transform: translateY(-40px);
  }
}
@keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
  }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    transform: translateY(-40px);
  }
}
@-webkit-keyframes slide-in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes slide-in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  20% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  20% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
#contest-create__cat-ppu label {
  text-align: left;
  padding-top: 4px !important;
}

@media screen and (max-width: 768px) {
  button#contest_create_create {
    width: 100%;
  }

  .contest-view__photos {
    margin: 0 10px;
  }

  .contest-preview__images {
    display: block;
  }
  .contest-preview__images .contest-preview__img-placeholder {
    height: 100px;
    margin-bottom: 10px;
  }

  .contest-container h1 {
    line-height: 46px;
    margin-bottom: 15px;
    text-align: center;
  }

  #contest-preview {
    border: 8px solid #39a9e0;
    padding-bottom: 50px;
    background-color: #fff;
    margin: 0 -20px;
  }
  #contest-preview .nav__sub {
    max-width: 300px;
    display: block;
    white-space: normal;
  }
  #contest-preview .nav__sub a:not(.button) {
    width: 100%;
  }
  #contest-preview .nav__sub li {
    display: block;
    margin-bottom: 5px;
    width: 100%;
    text-align: center;
  }

  #contest-create__head {
    margin: 0 20px 20px;
  }
  #contest-create__head h1, #contest-create__head h2 {
    text-align: center;
    margin-bottom: 10px;
  }

  #contest-create__body {
    margin: 0 20px;
  }
  #contest-create__body h2 {
    text-align: center;
    margin-bottom: 10px;
  }

  .contest-create__step--left, .contest-create__step--right {
    padding: 25px 0px 0 0;
  }

  .grid-container__contest-create {
    display: block;
    grid-template-columns: 100% 1fr;
    grid-template-rows: 1fr;
    grid-gap: 1px 1px;
  }

  #contest-create__head {
    display: block;
  }

  .contest-create__step--vl {
    display: none;
  }

  .contest-create__step--one, .contest-create__step--two, .contest-create__step--three, .contest-create__step--four {
    justify-content: center;
    align-items: center;
  }
  .contest-create__step--one .contest-create__step--circle, .contest-create__step--two .contest-create__step--circle, .contest-create__step--three .contest-create__step--circle, .contest-create__step--four .contest-create__step--circle {
    font-size: 30px;
    line-height: 41px;
    width: 70px;
    height: 70px;
    margin: 20px auto;
    justify-content: center;
    align-items: center;
  }

  .contest-create__step-one, .contest-create__step-two, .contest-create__step-three, .contest-create__step-four {
    display: block;
    grid-template-columns: 100% 1fr;
    grid-template-rows: 1fr;
  }

  .switch-container {
    margin-top: 20px;
  }

  .contest-create__step--four {
    display: block;
  }
}
.vdatetime-popup__header, .vdatetime-calendar__month__day--selected > span > span {
  background: #39a9e0 !important;
}

.vdatetime-time-picker__item--selected, .vdatetime-time-picker__item--selected, .vdatetime-popup__actions__button, .vdatetime-popup__actions__button--cancel {
  color: #39a9e0 !important;
}

.contest-slider-infos {
  padding: 0px !important;
}

.subinfo-staus {
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: 1px;
  margin: 0px 0px 10px 0px;
  color: rgba(64, 71, 86, 0.5) !important;
}

.contest-backlink {
  display: block;
  color: currentColor;
  font-size: 0.875rem;
  line-height: 1.35;
  padding: 20px 20px 0px 15px !important;
  border-radius: 3px;
  border: none !important;
  background-color: none;
}
.contest-backlink i {
  font-size: 1.6rem;
}

.contest-backlink-li::after, .contest-backlink-li:hover::after, .contest-backlink-li:active::after {
  display: none !important;
  height: 0px !important;
}

@media screen and (max-width: 480px) {
  .contest-backlink {
    display: block;
    color: currentColor;
    font-size: 0.875rem;
    line-height: 1.35;
    padding: 0.5rem 1.125rem !important;
    border-radius: 3px !important;
    border: 1px solid rgba(51, 51, 51, 0.15) !important;
    background-color: #fff;
  }
  .contest-backlink i {
    font-size: 1rem;
  }
}
.slider {
  overflow-x: hidden;
  padding-bottom: 20px;
  /* width: 1000px; bei Bedarf anpassen, da hier 100% gewünscht sind, kann man die Angabe einsparen */
}

.sliderElements {
  width: 300%;
  /* Summe der Einzelbreiten der Slides */
}

.sliderElements > li {
  float: left;
  width: calc(100% / 3);
  /* 100 durch Anzahl der Slides */
  height: 600px;
  display: block;
  position: relative;
}

@media screen and (max-width: 480px) {
  .sliderElements > li {
    height: auto;
  }
  .sliderElements > li p {
    font-size: 12px;
  }
}
@media screen and (max-width: 992px) {
  .sliderElements > li {
    height: auto;
  }
}
@keyframes banner {
  0%, 5% {
    left: 0;
  }
  15%, 65% {
    left: -33.33%;
  }
  100% {
    left: -66.66%;
  }
}
.sliderElements .fc-banner {
  animation-name: banner;
  animation-duration: 10s;
  animation-delay: 15s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

/* Clearfix für die Liste */
.sliderElements:after {
  content: ".";
  display: block;
  height: 0.1px;
  clear: both;
  visibility: hidden;
  font-size: 0;
  overflow: hidden;
}

.sliderElements {
  position: relative;
  left: 0;
}

.slider input:nth-of-type(2):checked ~ .sliderElements {
  left: -100%;
}

.slider input:nth-of-type(3):checked ~ .sliderElements {
  left: -200%;
}

.sliderElements,
.sliderElements figure,
.sliderControls {
  margin: 0;
}

.sliderElements:after {
  content: ".";
  display: block;
  height: 0.1px;
  clear: both;
  visibility: hidden;
  font-size: 0;
  overflow: hidden;
}

.cssSlider {
  overflow-x: hidden;
  padding-bottom: 20px;
}

.sliderElements {
  list-style: none;
  position: relative;
  left: 0;
  width: 300%;
  margin-bottom: 0.8em;
  padding: 0;
  -webkit-transition: left 0.8s ease-in-out;
  -moz-transition: left 0.8s ease-in-out;
  -o-transition: left 0.8s ease-in-out;
  transition: left 0.8s ease-in-out;
}

#slide02:checked ~ .sliderElements {
  left: -100%;
}

#slide03:checked ~ .sliderElements {
  left: -200%;
}

/* Bildunterschrift auf dem Bild positionieren */
.sliderElements figcaption {
  display: block;
  color: #fff;
  position: absolute;
  left: 0;
  bottom: 1em;
  padding: 0.4em;
  background: rgba(0, 0, 0, 0.5);
}

/* Bilder responsive */
.sliderElements img {
  width: 100%;
  height: auto;
}

/* inputs aus dem Blickfeld schieben */
.cssSlider input {
  position: absolute;
  left: -99999px;
}

/* mittige Ausrichtung der Controls - funktioniert im Zusammenspiel mit inline-block */
.sliderControls {
  text-align: center;
}

/* Controls nebeneinander bringen */
.sliderControls li {
  display: inline-block;
}

/* Controls auf einheitliche Maße bringen und die Ecken abrunden */
.sliderControls label {
  width: 10px;
  height: 10px;
  line-height: 10px;
  text-align: center;
  border-radius: 50%;
  display: block;
  cursor: pointer;
  background: #eeeeee;
  color: #eeeeee;
}

/* Attributselektor und indirekter Nachfahrkombinator zum ansteuern der labels */
.sliderControls label:hover,
#slide01:checked ~ .sliderControls label[for=slide01],
#slide02:checked ~ .sliderControls label[for=slide02],
#slide03:checked ~ .sliderControls label[for=slide03] {
  background: #39a9e0;
  color: #39a9e0;
}

#flowcircles__body {
  margin: 0px;
}

#flowcircles__cat-ppu {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

#flowcircles__cat-ppu select:first-of-type {
  width: 50%;
}

#flowcircles__cat-ppu label {
  text-align: end;
  width: 30%;
  padding-top: 14px;
  margin-left: 16px;
  padding-right: 16px;
}

#flowcircles__cat-ppu select:last-of-type {
  width: 20%;
}

.flowcircles__step--left,
.flowcircles__step--right {
  padding: 25px 25px 0 0;
}

.grid-container__flowcircles {
  display: grid;
  grid-template-columns: 100px 1fr;
  grid-template-rows: 2fr 2fr 2fr 1fr;
  grid-gap: 1px 1px;
  grid-template-areas: "flowcircles__step--one flowcircles__step-one" "flowcircles__step--two flowcircles__step-two" "flowcircles__step--three flowcircles__step-three" "flowcircles__step--four flowcircles__step-four";
  grid-template-rows: max-content;
}

.flowcircles__step--circle {
  width: 56px;
  height: 56px;
  margin: 15px 25px;
  background-color: #39a9e0;
  border-radius: 50%;
  color: #fff;
  font-size: 25px;
  line-height: 30px;
  padding: 13px;
  text-align: center;
}

.flowcircles__step--vl {
  grid-area: flowcircles__step--vl;
}

.flowcircles__step--vl {
  border-left: 3px solid #39a9e0;
  height: inherit;
  margin-left: 50px;
  top: 0;
}

.flowcircles__step--one {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "." "flowcircles__step--vl";
  grid-area: flowcircles__step--one;
  margin-bottom: 10px;
}

.flowcircles__step--two {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "." "flowcircles__step--vl";
  grid-area: flowcircles__step--two;
}

.flowcircles__step--three {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "." "flowcircles__step--vl";
  grid-area: flowcircles__step--three;
}

.flowcircles__step--four {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "." ".";
  grid-area: flowcircles__step--four;
}

.flowcircles__step--one, .flowcircles__step--two, .flowcircles__step--three, .flowcircles__step--four {
  margin-bottom: 20px;
}

.flowcircles__step-one, .flowcircles__step-two, .flowcircles__step-three, .flowcircles__step-four {
  margin-bottom: 20px;
  padding-bottom: 30px;
}

.flowcircles__step-one {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "flowcircles__step-one--headline flowcircles__step-one--headline" "flowcircles__step-one--left flowcircles__step-one--right";
  grid-area: flowcircles__step-one;
}

.flowcircles__step--headline span,
.flowcircles__step--headline p {
  color: #222;
  font-size: 16px;
  letter-spacing: 0;
  margin: 0px 0 10px 0 !important;
}

.flowcircles__step-one--headline {
  grid-area: flowcircles__step-one--headline;
}

.flowcircles__step-one--left {
  grid-area: flowcircles__step-one--left;
}

.flowcircles__step-one--right {
  grid-area: flowcircles__step-one--right;
}

.flowcircles__step-two {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "flowcircles__step-two--headline flowcircles__step-two--headline" "flowcircles__step-two--left flowcircles__step-two--right";
  grid-area: flowcircles__step-two;
}

.flowcircles__step-two--headline {
  grid-area: flowcircles__step-two--headline;
}

.flowcircles__step-two--left {
  grid-area: flowcircles__step-two--left;
}

.flowcircles__step-two--right {
  grid-area: flowcircles__step-two--right;
}

.flowcircles__step-three {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr;
  grid-template-areas: "flowcircles__step-three--headline flowcircles__step-three--headline" "flowcircles__step-three--left flowcircles__step-three--right";
  grid-area: flowcircles__step-three;
}

.flowcircles__step-three--headline {
  grid-area: flowcircles__step-three--headline;
}

.flowcircles__step-three--slider {
  grid-area: flowcircles__step-three--slider;
}

.flowcircles__step-three--left {
  grid-area: flowcircles__step-three--left;
}

.flowcircles__step-three--right {
  grid-area: flowcircles__step-three--right;
}

.flowcircles__step-four {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 100px 1fr 1fr;
  grid-template-areas: "flowcircles__step-four--headline" "flowcircles__step-four--info" "flowcircles__step-four--buttons";
  grid-area: flowcircles__step-four;
}

.flowcircles__step-four--headline {
  grid-area: flowcircles__step-four--headline;
}

.flowcircles__step-four--info {
  grid-area: flowcircles__step-four--info;
  color: #222;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 22px;
  max-width: 800px;
}

.flowcircles__step-four--buttons {
  grid-area: flowcircles__step-four--buttons;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0 0 25px 0;
}

@media screen and (max-width: 768px) {
  #flowcircles__body {
    margin: 0 20px;
  }
  #flowcircles__body h2 {
    text-align: center;
    margin-bottom: 10px;
  }

  .flowcircles__step--left, .flowcircles__step--right {
    padding: 25px 0px 0 0;
  }

  .grid-container__flowcircles {
    display: block;
    grid-template-columns: 100% 1fr;
    grid-template-rows: 1fr;
    grid-gap: 1px 1px;
  }

  #flowcircles__head {
    display: block;
  }

  .flowcircles__step--vl {
    display: none;
  }

  .flowcircles__step--one, .flowcircles__step--two, .flowcircles__step--three, .flowcircles__step--four {
    justify-content: center;
    align-items: center;
  }
  .flowcircles__step--one .flowcircles__step--circle, .flowcircles__step--two .flowcircles__step--circle, .flowcircles__step--three .flowcircles__step--circle, .flowcircles__step--four .flowcircles__step--circle {
    font-size: 30px;
    line-height: 41px;
    width: 70px;
    height: 70px;
    margin: 20px auto;
    justify-content: center;
    align-items: center;
  }

  .flowcircles__step-one, .flowcircles__step-two, .flowcircles__step-three, .flowcircles__step-four {
    display: block;
    grid-template-columns: 100% 1fr;
    grid-template-rows: 1fr;
  }

  .flowcircles__step--four {
    display: block;
  }
}
.flowcircles__step--left img {
  border: 1px solid #888;
}

.example-image-mobile {
  display: none;
}

@media screen and (max-width: 480px) {
  .example-image-web {
    display: none;
  }

  .example-image-mobile {
    display: block;
  }
}
.rect-auto, .c100.p51 .slice, .c100.p52 .slice, .c100.p53 .slice, .c100.p54 .slice, .c100.p55 .slice, .c100.p56 .slice, .c100.p57 .slice, .c100.p58 .slice, .c100.p59 .slice, .c100.p60 .slice, .c100.p61 .slice, .c100.p62 .slice, .c100.p63 .slice, .c100.p64 .slice, .c100.p65 .slice, .c100.p66 .slice, .c100.p67 .slice, .c100.p68 .slice, .c100.p69 .slice, .c100.p70 .slice, .c100.p71 .slice, .c100.p72 .slice, .c100.p73 .slice, .c100.p74 .slice, .c100.p75 .slice, .c100.p76 .slice, .c100.p77 .slice, .c100.p78 .slice, .c100.p79 .slice, .c100.p80 .slice, .c100.p81 .slice, .c100.p82 .slice, .c100.p83 .slice, .c100.p84 .slice, .c100.p85 .slice, .c100.p86 .slice, .c100.p87 .slice, .c100.p88 .slice, .c100.p89 .slice, .c100.p90 .slice, .c100.p91 .slice, .c100.p92 .slice, .c100.p93 .slice, .c100.p94 .slice, .c100.p95 .slice, .c100.p96 .slice, .c100.p97 .slice, .c100.p98 .slice, .c100.p99 .slice, .c100.p100 .slice {
  clip: rect(auto, auto, auto, auto);
}

.pie, .c100 .bar, .c100.p51 .fill, .c100.p52 .fill, .c100.p53 .fill, .c100.p54 .fill, .c100.p55 .fill, .c100.p56 .fill, .c100.p57 .fill, .c100.p58 .fill, .c100.p59 .fill, .c100.p60 .fill, .c100.p61 .fill, .c100.p62 .fill, .c100.p63 .fill, .c100.p64 .fill, .c100.p65 .fill, .c100.p66 .fill, .c100.p67 .fill, .c100.p68 .fill, .c100.p69 .fill, .c100.p70 .fill, .c100.p71 .fill, .c100.p72 .fill, .c100.p73 .fill, .c100.p74 .fill, .c100.p75 .fill, .c100.p76 .fill, .c100.p77 .fill, .c100.p78 .fill, .c100.p79 .fill, .c100.p80 .fill, .c100.p81 .fill, .c100.p82 .fill, .c100.p83 .fill, .c100.p84 .fill, .c100.p85 .fill, .c100.p86 .fill, .c100.p87 .fill, .c100.p88 .fill, .c100.p89 .fill, .c100.p90 .fill, .c100.p91 .fill, .c100.p92 .fill, .c100.p93 .fill, .c100.p94 .fill, .c100.p95 .fill, .c100.p96 .fill, .c100.p97 .fill, .c100.p98 .fill, .c100.p99 .fill, .c100.p100 .fill {
  position: absolute;
  border: 0.09em solid #39a9e0;
  width: 0.84em;
  height: 0.84em;
  clip: rect(0em, 0.5em, 1em, 0em);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}

.pie-fill, .c100.p51 .bar:after, .c100.p51 .fill, .c100.p52 .bar:after, .c100.p52 .fill, .c100.p53 .bar:after, .c100.p53 .fill, .c100.p54 .bar:after, .c100.p54 .fill, .c100.p55 .bar:after, .c100.p55 .fill, .c100.p56 .bar:after, .c100.p56 .fill, .c100.p57 .bar:after, .c100.p57 .fill, .c100.p58 .bar:after, .c100.p58 .fill, .c100.p59 .bar:after, .c100.p59 .fill, .c100.p60 .bar:after, .c100.p60 .fill, .c100.p61 .bar:after, .c100.p61 .fill, .c100.p62 .bar:after, .c100.p62 .fill, .c100.p63 .bar:after, .c100.p63 .fill, .c100.p64 .bar:after, .c100.p64 .fill, .c100.p65 .bar:after, .c100.p65 .fill, .c100.p66 .bar:after, .c100.p66 .fill, .c100.p67 .bar:after, .c100.p67 .fill, .c100.p68 .bar:after, .c100.p68 .fill, .c100.p69 .bar:after, .c100.p69 .fill, .c100.p70 .bar:after, .c100.p70 .fill, .c100.p71 .bar:after, .c100.p71 .fill, .c100.p72 .bar:after, .c100.p72 .fill, .c100.p73 .bar:after, .c100.p73 .fill, .c100.p74 .bar:after, .c100.p74 .fill, .c100.p75 .bar:after, .c100.p75 .fill, .c100.p76 .bar:after, .c100.p76 .fill, .c100.p77 .bar:after, .c100.p77 .fill, .c100.p78 .bar:after, .c100.p78 .fill, .c100.p79 .bar:after, .c100.p79 .fill, .c100.p80 .bar:after, .c100.p80 .fill, .c100.p81 .bar:after, .c100.p81 .fill, .c100.p82 .bar:after, .c100.p82 .fill, .c100.p83 .bar:after, .c100.p83 .fill, .c100.p84 .bar:after, .c100.p84 .fill, .c100.p85 .bar:after, .c100.p85 .fill, .c100.p86 .bar:after, .c100.p86 .fill, .c100.p87 .bar:after, .c100.p87 .fill, .c100.p88 .bar:after, .c100.p88 .fill, .c100.p89 .bar:after, .c100.p89 .fill, .c100.p90 .bar:after, .c100.p90 .fill, .c100.p91 .bar:after, .c100.p91 .fill, .c100.p92 .bar:after, .c100.p92 .fill, .c100.p93 .bar:after, .c100.p93 .fill, .c100.p94 .bar:after, .c100.p94 .fill, .c100.p95 .bar:after, .c100.p95 .fill, .c100.p96 .bar:after, .c100.p96 .fill, .c100.p97 .bar:after, .c100.p97 .fill, .c100.p98 .bar:after, .c100.p98 .fill, .c100.p99 .bar:after, .c100.p99 .fill, .c100.p100 .bar:after, .c100.p100 .fill {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

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

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

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

.c100.big {
  font-size: 240px;
}

.c100.small {
  font-size: 25px;
}

.c100 > span {
  position: absolute;
  width: 100%;
  z-index: 1;
  left: 0;
  top: 0;
  width: 5em;
  line-height: 5em;
  font-size: 0.2em;
  color: #39a9e0;
  display: block;
  text-align: center;
  white-space: nowrap;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.c100:after {
  position: absolute;
  top: 0.08em;
  left: 0.08em;
  display: block;
  content: " ";
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
  background-color: #fff;
  width: 0.84em;
  height: 0.84em;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease-in;
  -moz-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}

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

.c100.p1 .bar {
  -webkit-transform: rotate(3.6deg);
  -moz-transform: rotate(3.6deg);
  -ms-transform: rotate(3.6deg);
  -o-transform: rotate(3.6deg);
  transform: rotate(3.6deg);
}

.c100.p2 .bar {
  -webkit-transform: rotate(7.2deg);
  -moz-transform: rotate(7.2deg);
  -ms-transform: rotate(7.2deg);
  -o-transform: rotate(7.2deg);
  transform: rotate(7.2deg);
}

.c100.p3 .bar {
  -webkit-transform: rotate(10.8deg);
  -moz-transform: rotate(10.8deg);
  -ms-transform: rotate(10.8deg);
  -o-transform: rotate(10.8deg);
  transform: rotate(10.8deg);
}

.c100.p4 .bar {
  -webkit-transform: rotate(14.4deg);
  -moz-transform: rotate(14.4deg);
  -ms-transform: rotate(14.4deg);
  -o-transform: rotate(14.4deg);
  transform: rotate(14.4deg);
}

.c100.p5 .bar {
  -webkit-transform: rotate(18deg);
  -moz-transform: rotate(18deg);
  -ms-transform: rotate(18deg);
  -o-transform: rotate(18deg);
  transform: rotate(18deg);
}

.c100.p6 .bar {
  -webkit-transform: rotate(21.6deg);
  -moz-transform: rotate(21.6deg);
  -ms-transform: rotate(21.6deg);
  -o-transform: rotate(21.6deg);
  transform: rotate(21.6deg);
}

.c100.p7 .bar {
  -webkit-transform: rotate(25.2deg);
  -moz-transform: rotate(25.2deg);
  -ms-transform: rotate(25.2deg);
  -o-transform: rotate(25.2deg);
  transform: rotate(25.2deg);
}

.c100.p8 .bar {
  -webkit-transform: rotate(28.8deg);
  -moz-transform: rotate(28.8deg);
  -ms-transform: rotate(28.8deg);
  -o-transform: rotate(28.8deg);
  transform: rotate(28.8deg);
}

.c100.p9 .bar {
  -webkit-transform: rotate(32.4deg);
  -moz-transform: rotate(32.4deg);
  -ms-transform: rotate(32.4deg);
  -o-transform: rotate(32.4deg);
  transform: rotate(32.4deg);
}

.c100.p10 .bar {
  -webkit-transform: rotate(36deg);
  -moz-transform: rotate(36deg);
  -ms-transform: rotate(36deg);
  -o-transform: rotate(36deg);
  transform: rotate(36deg);
}

.c100.p11 .bar {
  -webkit-transform: rotate(39.6deg);
  -moz-transform: rotate(39.6deg);
  -ms-transform: rotate(39.6deg);
  -o-transform: rotate(39.6deg);
  transform: rotate(39.6deg);
}

.c100.p12 .bar {
  -webkit-transform: rotate(43.2deg);
  -moz-transform: rotate(43.2deg);
  -ms-transform: rotate(43.2deg);
  -o-transform: rotate(43.2deg);
  transform: rotate(43.2deg);
}

.c100.p13 .bar {
  -webkit-transform: rotate(46.8deg);
  -moz-transform: rotate(46.8deg);
  -ms-transform: rotate(46.8deg);
  -o-transform: rotate(46.8deg);
  transform: rotate(46.8deg);
}

.c100.p14 .bar {
  -webkit-transform: rotate(50.4deg);
  -moz-transform: rotate(50.4deg);
  -ms-transform: rotate(50.4deg);
  -o-transform: rotate(50.4deg);
  transform: rotate(50.4deg);
}

.c100.p15 .bar {
  -webkit-transform: rotate(54deg);
  -moz-transform: rotate(54deg);
  -ms-transform: rotate(54deg);
  -o-transform: rotate(54deg);
  transform: rotate(54deg);
}

.c100.p16 .bar {
  -webkit-transform: rotate(57.6deg);
  -moz-transform: rotate(57.6deg);
  -ms-transform: rotate(57.6deg);
  -o-transform: rotate(57.6deg);
  transform: rotate(57.6deg);
}

.c100.p17 .bar {
  -webkit-transform: rotate(61.2deg);
  -moz-transform: rotate(61.2deg);
  -ms-transform: rotate(61.2deg);
  -o-transform: rotate(61.2deg);
  transform: rotate(61.2deg);
}

.c100.p18 .bar {
  -webkit-transform: rotate(64.8deg);
  -moz-transform: rotate(64.8deg);
  -ms-transform: rotate(64.8deg);
  -o-transform: rotate(64.8deg);
  transform: rotate(64.8deg);
}

.c100.p19 .bar {
  -webkit-transform: rotate(68.4deg);
  -moz-transform: rotate(68.4deg);
  -ms-transform: rotate(68.4deg);
  -o-transform: rotate(68.4deg);
  transform: rotate(68.4deg);
}

.c100.p20 .bar {
  -webkit-transform: rotate(72deg);
  -moz-transform: rotate(72deg);
  -ms-transform: rotate(72deg);
  -o-transform: rotate(72deg);
  transform: rotate(72deg);
}

.c100.p21 .bar {
  -webkit-transform: rotate(75.6deg);
  -moz-transform: rotate(75.6deg);
  -ms-transform: rotate(75.6deg);
  -o-transform: rotate(75.6deg);
  transform: rotate(75.6deg);
}

.c100.p22 .bar {
  -webkit-transform: rotate(79.2deg);
  -moz-transform: rotate(79.2deg);
  -ms-transform: rotate(79.2deg);
  -o-transform: rotate(79.2deg);
  transform: rotate(79.2deg);
}

.c100.p23 .bar {
  -webkit-transform: rotate(82.8deg);
  -moz-transform: rotate(82.8deg);
  -ms-transform: rotate(82.8deg);
  -o-transform: rotate(82.8deg);
  transform: rotate(82.8deg);
}

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

.c100.p25 .bar {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.c100.p26 .bar {
  -webkit-transform: rotate(93.6deg);
  -moz-transform: rotate(93.6deg);
  -ms-transform: rotate(93.6deg);
  -o-transform: rotate(93.6deg);
  transform: rotate(93.6deg);
}

.c100.p27 .bar {
  -webkit-transform: rotate(97.2deg);
  -moz-transform: rotate(97.2deg);
  -ms-transform: rotate(97.2deg);
  -o-transform: rotate(97.2deg);
  transform: rotate(97.2deg);
}

.c100.p28 .bar {
  -webkit-transform: rotate(100.8deg);
  -moz-transform: rotate(100.8deg);
  -ms-transform: rotate(100.8deg);
  -o-transform: rotate(100.8deg);
  transform: rotate(100.8deg);
}

.c100.p29 .bar {
  -webkit-transform: rotate(104.4deg);
  -moz-transform: rotate(104.4deg);
  -ms-transform: rotate(104.4deg);
  -o-transform: rotate(104.4deg);
  transform: rotate(104.4deg);
}

.c100.p30 .bar {
  -webkit-transform: rotate(108deg);
  -moz-transform: rotate(108deg);
  -ms-transform: rotate(108deg);
  -o-transform: rotate(108deg);
  transform: rotate(108deg);
}

.c100.p31 .bar {
  -webkit-transform: rotate(111.6deg);
  -moz-transform: rotate(111.6deg);
  -ms-transform: rotate(111.6deg);
  -o-transform: rotate(111.6deg);
  transform: rotate(111.6deg);
}

.c100.p32 .bar {
  -webkit-transform: rotate(115.2deg);
  -moz-transform: rotate(115.2deg);
  -ms-transform: rotate(115.2deg);
  -o-transform: rotate(115.2deg);
  transform: rotate(115.2deg);
}

.c100.p33 .bar {
  -webkit-transform: rotate(118.8deg);
  -moz-transform: rotate(118.8deg);
  -ms-transform: rotate(118.8deg);
  -o-transform: rotate(118.8deg);
  transform: rotate(118.8deg);
}

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

.c100.p35 .bar {
  -webkit-transform: rotate(126deg);
  -moz-transform: rotate(126deg);
  -ms-transform: rotate(126deg);
  -o-transform: rotate(126deg);
  transform: rotate(126deg);
}

.c100.p36 .bar {
  -webkit-transform: rotate(129.6deg);
  -moz-transform: rotate(129.6deg);
  -ms-transform: rotate(129.6deg);
  -o-transform: rotate(129.6deg);
  transform: rotate(129.6deg);
}

.c100.p37 .bar {
  -webkit-transform: rotate(133.2deg);
  -moz-transform: rotate(133.2deg);
  -ms-transform: rotate(133.2deg);
  -o-transform: rotate(133.2deg);
  transform: rotate(133.2deg);
}

.c100.p38 .bar {
  -webkit-transform: rotate(136.8deg);
  -moz-transform: rotate(136.8deg);
  -ms-transform: rotate(136.8deg);
  -o-transform: rotate(136.8deg);
  transform: rotate(136.8deg);
}

.c100.p39 .bar {
  -webkit-transform: rotate(140.4deg);
  -moz-transform: rotate(140.4deg);
  -ms-transform: rotate(140.4deg);
  -o-transform: rotate(140.4deg);
  transform: rotate(140.4deg);
}

.c100.p40 .bar {
  -webkit-transform: rotate(144deg);
  -moz-transform: rotate(144deg);
  -ms-transform: rotate(144deg);
  -o-transform: rotate(144deg);
  transform: rotate(144deg);
}

.c100.p41 .bar {
  -webkit-transform: rotate(147.6deg);
  -moz-transform: rotate(147.6deg);
  -ms-transform: rotate(147.6deg);
  -o-transform: rotate(147.6deg);
  transform: rotate(147.6deg);
}

.c100.p42 .bar {
  -webkit-transform: rotate(151.2deg);
  -moz-transform: rotate(151.2deg);
  -ms-transform: rotate(151.2deg);
  -o-transform: rotate(151.2deg);
  transform: rotate(151.2deg);
}

.c100.p43 .bar {
  -webkit-transform: rotate(154.8deg);
  -moz-transform: rotate(154.8deg);
  -ms-transform: rotate(154.8deg);
  -o-transform: rotate(154.8deg);
  transform: rotate(154.8deg);
}

.c100.p44 .bar {
  -webkit-transform: rotate(158.4deg);
  -moz-transform: rotate(158.4deg);
  -ms-transform: rotate(158.4deg);
  -o-transform: rotate(158.4deg);
  transform: rotate(158.4deg);
}

.c100.p45 .bar {
  -webkit-transform: rotate(162deg);
  -moz-transform: rotate(162deg);
  -ms-transform: rotate(162deg);
  -o-transform: rotate(162deg);
  transform: rotate(162deg);
}

.c100.p46 .bar {
  -webkit-transform: rotate(165.6deg);
  -moz-transform: rotate(165.6deg);
  -ms-transform: rotate(165.6deg);
  -o-transform: rotate(165.6deg);
  transform: rotate(165.6deg);
}

.c100.p47 .bar {
  -webkit-transform: rotate(169.2deg);
  -moz-transform: rotate(169.2deg);
  -ms-transform: rotate(169.2deg);
  -o-transform: rotate(169.2deg);
  transform: rotate(169.2deg);
}

.c100.p48 .bar {
  -webkit-transform: rotate(172.8deg);
  -moz-transform: rotate(172.8deg);
  -ms-transform: rotate(172.8deg);
  -o-transform: rotate(172.8deg);
  transform: rotate(172.8deg);
}

.c100.p49 .bar {
  -webkit-transform: rotate(176.4deg);
  -moz-transform: rotate(176.4deg);
  -ms-transform: rotate(176.4deg);
  -o-transform: rotate(176.4deg);
  transform: rotate(176.4deg);
}

.c100.p50 .bar {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.c100.p51 .bar {
  -webkit-transform: rotate(183.6deg);
  -moz-transform: rotate(183.6deg);
  -ms-transform: rotate(183.6deg);
  -o-transform: rotate(183.6deg);
  transform: rotate(183.6deg);
}

.c100.p52 .bar {
  -webkit-transform: rotate(187.2deg);
  -moz-transform: rotate(187.2deg);
  -ms-transform: rotate(187.2deg);
  -o-transform: rotate(187.2deg);
  transform: rotate(187.2deg);
}

.c100.p53 .bar {
  -webkit-transform: rotate(190.8deg);
  -moz-transform: rotate(190.8deg);
  -ms-transform: rotate(190.8deg);
  -o-transform: rotate(190.8deg);
  transform: rotate(190.8deg);
}

.c100.p54 .bar {
  -webkit-transform: rotate(194.4deg);
  -moz-transform: rotate(194.4deg);
  -ms-transform: rotate(194.4deg);
  -o-transform: rotate(194.4deg);
  transform: rotate(194.4deg);
}

.c100.p55 .bar {
  -webkit-transform: rotate(198deg);
  -moz-transform: rotate(198deg);
  -ms-transform: rotate(198deg);
  -o-transform: rotate(198deg);
  transform: rotate(198deg);
}

.c100.p56 .bar {
  -webkit-transform: rotate(201.6deg);
  -moz-transform: rotate(201.6deg);
  -ms-transform: rotate(201.6deg);
  -o-transform: rotate(201.6deg);
  transform: rotate(201.6deg);
}

.c100.p57 .bar {
  -webkit-transform: rotate(205.2deg);
  -moz-transform: rotate(205.2deg);
  -ms-transform: rotate(205.2deg);
  -o-transform: rotate(205.2deg);
  transform: rotate(205.2deg);
}

.c100.p58 .bar {
  -webkit-transform: rotate(208.8deg);
  -moz-transform: rotate(208.8deg);
  -ms-transform: rotate(208.8deg);
  -o-transform: rotate(208.8deg);
  transform: rotate(208.8deg);
}

.c100.p59 .bar {
  -webkit-transform: rotate(212.4deg);
  -moz-transform: rotate(212.4deg);
  -ms-transform: rotate(212.4deg);
  -o-transform: rotate(212.4deg);
  transform: rotate(212.4deg);
}

.c100.p60 .bar {
  -webkit-transform: rotate(216deg);
  -moz-transform: rotate(216deg);
  -ms-transform: rotate(216deg);
  -o-transform: rotate(216deg);
  transform: rotate(216deg);
}

.c100.p61 .bar {
  -webkit-transform: rotate(219.6deg);
  -moz-transform: rotate(219.6deg);
  -ms-transform: rotate(219.6deg);
  -o-transform: rotate(219.6deg);
  transform: rotate(219.6deg);
}

.c100.p62 .bar {
  -webkit-transform: rotate(223.2deg);
  -moz-transform: rotate(223.2deg);
  -ms-transform: rotate(223.2deg);
  -o-transform: rotate(223.2deg);
  transform: rotate(223.2deg);
}

.c100.p63 .bar {
  -webkit-transform: rotate(226.8deg);
  -moz-transform: rotate(226.8deg);
  -ms-transform: rotate(226.8deg);
  -o-transform: rotate(226.8deg);
  transform: rotate(226.8deg);
}

.c100.p64 .bar {
  -webkit-transform: rotate(230.4deg);
  -moz-transform: rotate(230.4deg);
  -ms-transform: rotate(230.4deg);
  -o-transform: rotate(230.4deg);
  transform: rotate(230.4deg);
}

.c100.p65 .bar {
  -webkit-transform: rotate(234deg);
  -moz-transform: rotate(234deg);
  -ms-transform: rotate(234deg);
  -o-transform: rotate(234deg);
  transform: rotate(234deg);
}

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

.c100.p67 .bar {
  -webkit-transform: rotate(241.2deg);
  -moz-transform: rotate(241.2deg);
  -ms-transform: rotate(241.2deg);
  -o-transform: rotate(241.2deg);
  transform: rotate(241.2deg);
}

.c100.p68 .bar {
  -webkit-transform: rotate(244.8deg);
  -moz-transform: rotate(244.8deg);
  -ms-transform: rotate(244.8deg);
  -o-transform: rotate(244.8deg);
  transform: rotate(244.8deg);
}

.c100.p69 .bar {
  -webkit-transform: rotate(248.4deg);
  -moz-transform: rotate(248.4deg);
  -ms-transform: rotate(248.4deg);
  -o-transform: rotate(248.4deg);
  transform: rotate(248.4deg);
}

.c100.p70 .bar {
  -webkit-transform: rotate(252deg);
  -moz-transform: rotate(252deg);
  -ms-transform: rotate(252deg);
  -o-transform: rotate(252deg);
  transform: rotate(252deg);
}

.c100.p71 .bar {
  -webkit-transform: rotate(255.6deg);
  -moz-transform: rotate(255.6deg);
  -ms-transform: rotate(255.6deg);
  -o-transform: rotate(255.6deg);
  transform: rotate(255.6deg);
}

.c100.p72 .bar {
  -webkit-transform: rotate(259.2deg);
  -moz-transform: rotate(259.2deg);
  -ms-transform: rotate(259.2deg);
  -o-transform: rotate(259.2deg);
  transform: rotate(259.2deg);
}

.c100.p73 .bar {
  -webkit-transform: rotate(262.8deg);
  -moz-transform: rotate(262.8deg);
  -ms-transform: rotate(262.8deg);
  -o-transform: rotate(262.8deg);
  transform: rotate(262.8deg);
}

.c100.p74 .bar {
  -webkit-transform: rotate(266.4deg);
  -moz-transform: rotate(266.4deg);
  -ms-transform: rotate(266.4deg);
  -o-transform: rotate(266.4deg);
  transform: rotate(266.4deg);
}

.c100.p75 .bar {
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}

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

.c100.p77 .bar {
  -webkit-transform: rotate(277.2deg);
  -moz-transform: rotate(277.2deg);
  -ms-transform: rotate(277.2deg);
  -o-transform: rotate(277.2deg);
  transform: rotate(277.2deg);
}

.c100.p78 .bar {
  -webkit-transform: rotate(280.8deg);
  -moz-transform: rotate(280.8deg);
  -ms-transform: rotate(280.8deg);
  -o-transform: rotate(280.8deg);
  transform: rotate(280.8deg);
}

.c100.p79 .bar {
  -webkit-transform: rotate(284.4deg);
  -moz-transform: rotate(284.4deg);
  -ms-transform: rotate(284.4deg);
  -o-transform: rotate(284.4deg);
  transform: rotate(284.4deg);
}

.c100.p80 .bar {
  -webkit-transform: rotate(288deg);
  -moz-transform: rotate(288deg);
  -ms-transform: rotate(288deg);
  -o-transform: rotate(288deg);
  transform: rotate(288deg);
}

.c100.p81 .bar {
  -webkit-transform: rotate(291.6deg);
  -moz-transform: rotate(291.6deg);
  -ms-transform: rotate(291.6deg);
  -o-transform: rotate(291.6deg);
  transform: rotate(291.6deg);
}

.c100.p82 .bar {
  -webkit-transform: rotate(295.2deg);
  -moz-transform: rotate(295.2deg);
  -ms-transform: rotate(295.2deg);
  -o-transform: rotate(295.2deg);
  transform: rotate(295.2deg);
}

.c100.p83 .bar {
  -webkit-transform: rotate(298.8deg);
  -moz-transform: rotate(298.8deg);
  -ms-transform: rotate(298.8deg);
  -o-transform: rotate(298.8deg);
  transform: rotate(298.8deg);
}

.c100.p84 .bar {
  -webkit-transform: rotate(302.4deg);
  -moz-transform: rotate(302.4deg);
  -ms-transform: rotate(302.4deg);
  -o-transform: rotate(302.4deg);
  transform: rotate(302.4deg);
}

.c100.p85 .bar {
  -webkit-transform: rotate(306deg);
  -moz-transform: rotate(306deg);
  -ms-transform: rotate(306deg);
  -o-transform: rotate(306deg);
  transform: rotate(306deg);
}

.c100.p86 .bar {
  -webkit-transform: rotate(309.6deg);
  -moz-transform: rotate(309.6deg);
  -ms-transform: rotate(309.6deg);
  -o-transform: rotate(309.6deg);
  transform: rotate(309.6deg);
}

.c100.p87 .bar {
  -webkit-transform: rotate(313.2deg);
  -moz-transform: rotate(313.2deg);
  -ms-transform: rotate(313.2deg);
  -o-transform: rotate(313.2deg);
  transform: rotate(313.2deg);
}

.c100.p88 .bar {
  -webkit-transform: rotate(316.8deg);
  -moz-transform: rotate(316.8deg);
  -ms-transform: rotate(316.8deg);
  -o-transform: rotate(316.8deg);
  transform: rotate(316.8deg);
}

.c100.p89 .bar {
  -webkit-transform: rotate(320.4deg);
  -moz-transform: rotate(320.4deg);
  -ms-transform: rotate(320.4deg);
  -o-transform: rotate(320.4deg);
  transform: rotate(320.4deg);
}

.c100.p90 .bar {
  -webkit-transform: rotate(324deg);
  -moz-transform: rotate(324deg);
  -ms-transform: rotate(324deg);
  -o-transform: rotate(324deg);
  transform: rotate(324deg);
}

.c100.p91 .bar {
  -webkit-transform: rotate(327.6deg);
  -moz-transform: rotate(327.6deg);
  -ms-transform: rotate(327.6deg);
  -o-transform: rotate(327.6deg);
  transform: rotate(327.6deg);
}

.c100.p92 .bar {
  -webkit-transform: rotate(331.2deg);
  -moz-transform: rotate(331.2deg);
  -ms-transform: rotate(331.2deg);
  -o-transform: rotate(331.2deg);
  transform: rotate(331.2deg);
}

.c100.p93 .bar {
  -webkit-transform: rotate(334.8deg);
  -moz-transform: rotate(334.8deg);
  -ms-transform: rotate(334.8deg);
  -o-transform: rotate(334.8deg);
  transform: rotate(334.8deg);
}

.c100.p94 .bar {
  -webkit-transform: rotate(338.4deg);
  -moz-transform: rotate(338.4deg);
  -ms-transform: rotate(338.4deg);
  -o-transform: rotate(338.4deg);
  transform: rotate(338.4deg);
}

.c100.p95 .bar {
  -webkit-transform: rotate(342deg);
  -moz-transform: rotate(342deg);
  -ms-transform: rotate(342deg);
  -o-transform: rotate(342deg);
  transform: rotate(342deg);
}

.c100.p96 .bar {
  -webkit-transform: rotate(345.6deg);
  -moz-transform: rotate(345.6deg);
  -ms-transform: rotate(345.6deg);
  -o-transform: rotate(345.6deg);
  transform: rotate(345.6deg);
}

.c100.p97 .bar {
  -webkit-transform: rotate(349.2deg);
  -moz-transform: rotate(349.2deg);
  -ms-transform: rotate(349.2deg);
  -o-transform: rotate(349.2deg);
  transform: rotate(349.2deg);
}

.c100.p98 .bar {
  -webkit-transform: rotate(352.8deg);
  -moz-transform: rotate(352.8deg);
  -ms-transform: rotate(352.8deg);
  -o-transform: rotate(352.8deg);
  transform: rotate(352.8deg);
}

.c100.p99 .bar {
  -webkit-transform: rotate(356.4deg);
  -moz-transform: rotate(356.4deg);
  -ms-transform: rotate(356.4deg);
  -o-transform: rotate(356.4deg);
  transform: rotate(356.4deg);
}

.c100.p100 .bar {
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  transform: rotate(360deg);
}

.c100:hover {
  cursor: default;
}

.c100:hover:after {
  top: 0.04em;
  left: 0.04em;
  width: 0.92em;
  height: 0.92em;
}

.paywall {
  display: flex;
  justify-content: center;
  z-index: 6000;
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to bottom, transparent 0, #fff 500px);
}

.paywall_box {
  background-color: #fff;
  width: 550px;
  height: 450px;
  margin-top: 180px;
  box-shadow: 0 0 3px 3px var(--border-color);
  text-align: center;
  padding: 50px 40px;
}
.paywall_box .button--lg {
  width: 100%;
}
.paywall_box .button + .button {
  margin-left: 0rem;
}
.paywall_box .small {
  padding-top: 10px;
  margin: 0;
  text-align: right;
}
.paywall_box img {
  width: 60px;
}
.paywall_box .paywall_content {
  box-shadow: 0 0 3px 3px var(--border-color);
  padding: 15px 5px 5px 5px;
  margin: 20px;
}

.priceHighlight {
  font-size: 1.5rem;
  font-weight: bold;
}

@media screen and (max-width: 480px) {
  .paywall_box {
    width: 80%;
    margin-top: 0px;
    padding: 30px 15px;
  }
}
@media screen and (max-width: 992px) {
  .paywall_box {
    margin-top: 0px;
  }
}
.podcastsite {
  background-color: white;
}
.podcastsite progress,
.podcastsite progress::-webkit-progress-bar {
  background-color: transparent;
  height: 5px;
  margin-top: 1px;
}
.podcastsite progress::-webkit-progress-bar-value,
.podcastsite progress::-webkit-progress-value {
  background-color: transparent;
  height: 5px;
}
.podcastsite progress::-moz-progress-bar {
  background-color: #39a9e0;
  height: 5px;
}
.podcastsite progress[value]::-webkit-progress-bar {
  background-color: #eee;
  height: 5px;
  box-shadow: none;
}
.podcastsite progress[value]::-webkit-progress-value {
  background-color: #39a9e0;
  height: 5px;
  box-shadow: none;
}
.podcastsite input[type=range]::-webkit-slider-thumb {
  box-shadow: none;
  border: none;
  height: 12px;
  width: 12px;
  border-radius: 12px;
  background: #404756;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -3px;
}
.podcastsite input[type=range]::-moz-range-thumb {
  box-shadow: none;
  border: none;
  height: 12px;
  width: 12px;
  border-radius: 12px;
  background: #404756;
  cursor: pointer;
  margin-top: 3px;
}
.podcastsite input[type=range]::-ms-thumb {
  margin-top: 1px;
  box-shadow: none;
  border: none;
  height: 12px;
  width: 12px;
  border-radius: 12px;
  background: #404756;
  cursor: pointer;
}
.podcastsite .podcastsite-header {
  padding: 100px 0;
  min-height: 600px;
  background-image: url("../../assets/images/_pages/podcast/2I8A4221.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  margin-bottom: 50px;
  color: #fff;
}
.podcastsite .podcastsite-header .player-content {
  margin-bottom: 15px;
}
@media screen and (max-width: 992px) {
  .podcastsite .podcastsite-header {
    min-height: 100%;
  }
}
.podcastsite .podcastsite-content .nav__sub {
  margin-bottom: 50px;
}
.podcastsite .podcastsite-content p {
  font-size: 0.9rem;
}
.podcastsite .amplitude-song-container {
  display: flex;
  flex-direction: column;
  margin-bottom: 40px;
}
.podcastsite .amplitude-song-container img {
  margin-right: 20px;
  transition: color 0.3s ease;
  width: 100px;
  height: 100px;
}
.podcastsite .podcast-last-episode {
  width: 100%;
}
.podcastsite .podcast-last-episode h2 {
  text-shadow: 2px 2px 4px #222;
}
.podcastsite .podcast-last-episode p {
  font-size: 1rem;
}
@media screen and (min-width: 992px) {
  .podcastsite .podcast-last-episode {
    width: 800px;
  }
}

.podcasticons {
  margin-bottom: 10px;
}
.podcasticons img {
  width: auto;
  height: 13px;
  margin-right: 5px;
  color: #fff;
  margin-bottom: 2px;
}

@media screen and (max-width: 992px) {
  .podcasticons {
    width: 45% !important;
    margin-left: 0rem !important;
    margin-right: 3px !important;
  }

  .podcastsite .podcastsite-content .nav__sub {
    margin-bottom: 10px;
  }

  .amplitude-song-container {
    border-bottom: 1px solid #888;
    padding: 10px;
    margin-bottom: 10px !important;
  }
}
#audio-player {
  position: fixed;
  bottom: 0;
  width: 100%;
  background-color: #222;
  color: #fff;
  display: flex;
  justify-content: center;
  padding: 20px;
  flex-direction: column;
}
#audio-player #audio-player--left {
  width: 80%;
  padding-right: 0px;
}
@media screen and (min-width: 992px) {
  #audio-player #audio-player--left {
    width: 400px;
    padding-right: 15px;
  }
}
#audio-player input, #audio-player select, #audio-player textarea {
  padding: 0rem;
  background-color: rgba(64, 71, 86, 0.5);
}

@media screen and (min-width: 992px) {
  #audio-player {
    flex-direction: row;
  }

  .amplitude-song-container {
    flex-direction: row !important;
  }
  .amplitude-song-container img {
    width: 200px !important;
    height: 200px !important;
  }
}
.amplitude-song-slider {
  height: 3px;
  background-color: transparent;
  border: none;
  padding: 0rem 0rem;
  z-index: 3000;
  position: relative;
  margin-bottom: -8px;
}

.amplitude-play-pause {
  height: 20px;
  width: 20px;
  text-align: center;
  margin: 0px 10px 0px 10px;
  cursor: pointer !important;
}

.amplitude-play-pause:hover {
  color: #39a9e0;
}

.player-content {
  display: flex;
  flex-direction: row;
  width: 550px;
}
@media screen and (min-width: 992px) {
  .player-content {
    flex-direction: row;
  }
}
.player-content .audio-player-content {
  margin: 0px 10px 0px 5px;
  vertical-align: center;
  padding-top: 14px;
  width: 290px;
}
.player-content .audio-player-content .amplitude-song-played-progress, .player-content .audio-player-content .amplitude-buffered-progress {
  position: absolute;
  width: 290px;
}
.player-content .amplitude-time-remaining {
  vertical-align: center;
  padding-top: 3px;
  margin-left: 10px;
}

@media screen and (max-width: 500px) {
  .player-content {
    width: 350px !important;
  }
  .player-content span i {
    padding: 0.5rem 0rem;
  }
  .player-content .audio-player-content {
    width: 100px !important;
  }
  .player-content .audio-player-content .amplitude-song-played-progress, .player-content .audio-player-content .amplitude-buffered-progress {
    width: 100px !important;
  }
}
.about-episode {
  color: #888;
}
.about-episode p {
  font-size: 0.8rem !important;
  margin-top: 15px;
  margin-block-end: 0.8em;
}

.amplitude-active-song-container {
  background-color: #ddd;
}

.podcastcontent {
  display: flex;
  flex-direction: row;
}
.podcastcontent .podcastcontent-image {
  width: 120px;
  margin-right: 10px;
}
.podcastcontent .podcastcontent-image img {
  max-width: 100px;
}

.podcast-image {
  height: auto;
}
@media screen and (min-width: 992px) {
  .podcast-image {
    height: 320px !important;
    width: auto !important;
    max-width: 320px;
  }
}

.podcast-image-hp {
  height: auto;
  width: 100% !important;
}
@media screen and (min-width: 992px) {
  .podcast-image-hp {
    height: 320px;
    width: auto !important;
  }
}

.podcast-header {
  display: flex;
  flex-direction: column-reverse;
}
.podcast-header h2 {
  margin-bottom: 20px;
}
@media screen and (min-width: 992px) {
  .podcast-header {
    flex-direction: row;
    justify-content: space-between;
  }
}
.podcast-header input[type=range]::-webkit-slider-thumb {
  background: #fff !important;
}
.podcast-header input[type=range]::-moz-range-thumb {
  background: #fff !important;
}
.podcast-header .player-content-control .fifteensecondicons {
  width: 30px !important;
  color: #fff !important;
}
.podcast-header .player-content-control .js-skip-backwards, .podcast-header .player-content-control .js-skip-forwards {
  width: 15px !important;
  margin-bottom: 3px !important;
}
.podcast-header .player-content-control .amplitude-play-pause {
  margin: 0px 10px 0px 10px;
}

.podcast-header-logo {
  margin-left: 0px;
}
@media screen and (min-width: 992px) {
  .podcast-header-logo {
    margin-left: 100px;
  }
}

.podcast-play-show {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.podcast-play-show .button {
  width: 150px;
}
@media screen and (min-width: 992px) {
  .podcast-play-show {
    flex-direction: row;
    justify-content: space-between;
  }
  .podcast-play-show .player-content {
    margin-bottom: 0px;
  }
}

.player-content {
  display: flex;
  flex-direction: row;
  margin-bottom: 10px;
}
@media screen and (min-width: 992px) {
  .player-content {
    flex-direction: row;
  }
}
.player-content i:before {
  font-size: 1.5rem;
}

.episode-content {
  width: 100%;
  padding-right: 15px;
}
.episode-content h3 {
  font-size: 1.5rem;
  margin-bottom: 8px;
}

.podcast-shownotes {
  margin-bottom: 15px;
  margin-top: -25px;
  padding: 40px 20px;
  background-color: #ddd;
}
@media screen and (min-width: 992px) {
  .podcast-shownotes {
    margin-top: -40px;
  }
}
.podcast-shownotes h3 {
  font-family: -apple-system-ui-serif, "Vollkorn", "Georgia", serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.125rem, 5vw, 1.3125rem);
  line-height: 1.35;
}

.player-content-control {
  display: flex;
  flex-direction: row;
  justify-content: center;
  height: 20px;
  margin-right: 10px;
  margin-top: 2px;
  margin-bottom: 15px;
}
@media screen and (min-width: 992px) {
  .player-content-control {
    margin-bottom: 0px;
  }
}
.player-content-control .fifteensecondicons {
  width: 15px !important;
  height: 15px !important;
  color: #404756;
  margin-bottom: 3px;
  margin-right: 0px !important;
  cursor: pointer !important;
}

.player-content-beam {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.fa-pause-circle {
  color: #39a9e0;
}

.applepodcastbutton {
  min-width: 175px !important;
}

.episodeshare {
  margin-left: 0px;
  color: #404756;
  font-size: 0.65rem;
  margin-top: 5px;
  margin-bottom: 10px;
  cursor: default;
}
@media screen and (min-width: 992px) {
  .episodeshare {
    font-size: 0.8rem;
    margin-top: 0px;
    margin-bottom: 0px;
    cursor: default;
  }
}

.header-fullpage {
  background-image: url("../../assets/images/_pages/fullpages/unsplash.jpg") !important;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-color: #fff;
  color: #fff;
}
@media screen and (min-width: 992px) {
  .header-fullpage p, .header-fullpage ul {
    width: 80%;
  }
}

.section-fullpage-white {
  background: #fff;
}
.section-fullpage-white li {
  padding-bottom: 15px;
}
@media screen and (min-width: 992px) {
  .section-fullpage-white p, .section-fullpage-white ul {
    width: 80%;
  }
}

.section-fullpage-gradient {
  background: #fff;
  background: linear-gradient(-50deg, #eeeeee 0%, #fbfbfb 84%);
}
.section-fullpage-gradient li {
  padding-bottom: 10px;
}
@media screen and (min-width: 992px) {
  .section-fullpage-gradient p, .section-fullpage-gradient ul {
    width: 80%;
  }
}

.fullpage-navi {
  padding-bottom: 0vmin;
  border-bottom: 1px solid #eeeeee;
}

.fullpage-top {
  text-align: right;
  width: 100%;
  font-size: 2rem;
}

.unsere_stadards {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 992px) {
  .unsere_stadards {
    flex-direction: row;
  }
  .unsere_stadards p, .unsere_stadards ul {
    width: 100%;
  }
}
.unsere_stadards div {
  margin: 10px 10px 10px 0px;
  text-align: center;
  width: 100%;
}
@media screen and (min-width: 992px) {
  .unsere_stadards div {
    width: 33%;
  }
}
.unsere_stadards div img {
  margin-bottom: 15px;
}
@media screen and (min-width: 992px) {
  .unsere_stadards div img {
    margin-top: 20px;
  }
}

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

.nav__sub__full {
  justify-content: center;
}

body.theme--detail,
html.theme--dark {
  --logo-color:	#fff;
  --font-color:	#fff;
  --font-color-muted: #999;
  --font-nav-color:	#999;
  --color-primary:	#3f8ee9;
  --border-color:	rgba(255, 255, 255, .10);
  --bg-color:	#222;
  --bg-color-alpha:	rgba(0, 0, 0, .88);
}
body.theme--detail .site__header .button.button--outline,
html.theme--dark .site__header .button.button--outline {
  border-color: rgba(255, 255, 255, 0.1);
}

html.theme--dark {
  background: var(--bg-color);
}
html.theme--dark body {
  color: var(--font-color);
}
html.theme--dark .site__content {
  background: var(--bg-color);
}

.landingpagecomplete .inner, .landingpagecomplete .banner__content {
  max-width: 1200px;
}

.adobepartner {
  background-color: #39a9e0;
  height: 50px;
  padding-bottom: 0px;
}
.adobepartner .adobepartner-content {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  padding-top: 18px;
}
.adobepartner p {
  color: #fff;
  font-size: 0.6rem;
  padding: 18px 0px;
  margin-right: 10px;
  margin-bottom: 0px;
}

.fc-adobepartner, .adobebadge {
  width: 100px;
  margin-right: 10px;
  margin-left: 10px;
}

.lp-roundbutton {
  width: 150px;
  height: 150px;
  background-color: #39a9e0;
  border-radius: 50%;
  transform: rotate(-15deg);
  box-shadow: 0px 3px 10px #888;
  margin-right: 30px;
}
.lp-roundbutton p {
  text-align: center;
  color: #fff;
  padding-top: 45px;
  text-transform: uppercase;
  font-size: 1.2rem;
}
.lp-roundbutton .prozent {
  font-size: 3.2rem;
  font-family: -apple-system-ui-serif, "Vollkorn", "Georgia", serif;
  line-height: 0.2;
}

.abschnitt01 {
  padding-top: 60px;
}
.abschnitt01 .inner, .abschnitt01 .banner__content {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.abschnitt01 h1 {
  font-size: 3.8rem;
  color: #000;
  padding: 40px 0px 0px 0px;
}

.lp-srceens {
  width: 500px;
  margin-top: 50px;
  margin-right: 150px;
}

.lp-adobebox-mobile, .lp-adobeicons-mobile {
  display: none;
}

.lp-mobile {
  display: none;
}

@media screen and (max-width: 992px) {
  .adobeCloudIcon {
    display: none;
  }

  .abschnitt05 h1 {
    font-size: 3rem;
  }

  .lp-adobebox-mobile, .lp-adobeicons-mobile {
    display: block;
  }
  .lp-adobebox-mobile p, .lp-adobeicons-mobile p {
    font-size: 2rem;
    color: #000;
  }

  .lp-adobeicons-mobile {
    margin-top: 20px;
  }

  .lp-hauptboxen, .lp-adobeboxen {
    display: none !important;
  }

  .abschnitt01 .lp-roundbutton {
    display: none;
  }
  .abschnitt01 h1 {
    text-align: center;
  }

  .lp-srceens {
    display: none;
  }

  .lp-completeAbo {
    width: 100% !important;
    margin-top: 0px;
  }

  .lp-price {
    width: 100% !important;
  }

  .abschnitt02 h1 {
    text-align: center;
  }
  .abschnitt02 .lp-button {
    width: 100% !important;
  }
  .abschnitt02 .inner div, .abschnitt02 .banner__content div {
    width: 100%;
  }

  .abschnitt03 {
    padding: 0px 15px;
  }
  .abschnitt03 h1 {
    text-align: center;
    font-size: 3rem !important;
    width: 100%;
  }
  .abschnitt03 .lp-headline-logos {
    justify-content: center !important;
    margin-top: 20px;
  }
  .abschnitt03 .inner, .abschnitt03 .banner__content {
    flex-direction: column !important;
    align-items: center;
  }
  .abschnitt03 .inner .lp-circle, .abschnitt03 .banner__content .lp-circle {
    margin-bottom: 20px;
  }
  .abschnitt03 .inner .step-content-01, .abschnitt03 .banner__content .step-content-01, .abschnitt03 .inner .step-content-02, .abschnitt03 .banner__content .step-content-02, .abschnitt03 .inner .step-content-03, .abschnitt03 .banner__content .step-content-03 {
    width: 100% !important;
  }

  .abschnitt04 {
    padding: 0px 15px;
  }
  .abschnitt04 .lp-world-logo {
    width: 100% !important;
    margin: 20px 0px !important;
  }
  .abschnitt04 ul, .abschnitt04 p {
    font-size: 1.2rem !important;
  }

  .adobepartner2 {
    height: auto !important;
  }
  .adobepartner2 .adobepartner-content {
    flex-direction: column !important;
    align-items: center;
  }

  .adobepartner2 {
    display: none !important;
  }

  .lp-mobile {
    display: block;
  }

  .abschnitt02, .abschnitt05, .abschnitt06 {
    padding: 0px 15px;
  }

  .abschnitt06 .lp-button {
    width: 100% !important;
  }

  .abschnitt06 .lp-button .button--lg p {
    font-size: 1rem !important;
  }

  .abschnitt06 .lp-soldprice {
    font-size: 3.2rem;
  }
}
@media screen and (max-width: 480px) {
  .abschnitt01 h1 {
    font-size: 3rem;
    padding: 10px 0px 0px 0px;
  }

  .abschnitt02 .lp-soldprice {
    font-size: 3.2rem;
  }

  .lp-adobeicons img {
    width: 37px;
  }

  .abschnitt02 .lp-button .button--lg p {
    font-size: 1rem !important;
  }

  .lp-headline-logos {
    justify-content: center !important;
    margin-top: 20px;
    flex-direction: column !important;
    align-items: center !important;
  }

  .lp-roundbutton {
    width: 100px;
    height: 100px;
    margin-right: 0px;
    margin-left: 200px;
    margin-top: -100px;
  }
  .lp-roundbutton p {
    text-align: center;
    color: #fff;
    padding-top: 30px;
    text-transform: uppercase;
    font-size: 0.8rem;
  }
  .lp-roundbutton .prozent {
    font-size: 2rem;
    font-family: -apple-system-ui-serif, "Vollkorn", "Georgia", serif;
    line-height: 0.2;
  }
}
.lp-completeAbo {
  width: 500px;
  margin-top: 50px;
}
.lp-completeAbo .lp-complete-logo {
  width: 450px;
  padding-bottom: 20px;
}
.lp-completeAbo .lp-world-logo {
  width: 300px;
}
.lp-completeAbo .lp-AdobeAbo {
  color: #000;
}

.lp-box-shadow {
  box-shadow: 0px 3px 10px #888;
  padding: 25px;
}

.lp-plus {
  padding: 10px;
  font-size: 4.5rem;
  color: #39a9e0;
  text-align: center;
  width: 100%;
}

.color-primarynew {
  color: #39a9e0;
}

.abschnitt02 .inner, .abschnitt02 .banner__content {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.abschnitt02 .lp-button {
  width: 500px;
}
.abschnitt02 .lp-button p {
  text-align: right;
}
.abschnitt02 .lp-button .button--lg {
  width: 100%;
  height: 75px;
  background-color: #39a9e0;
  margin-bottom: 30px;
}
.abschnitt02 .lp-button .button--lg p {
  text-align: center;
  margin-top: 15px;
  font-size: 1.5rem;
}

.lp-price {
  width: 650px;
  display: flex;
  margin-bottom: -20px;
}

.lp-soldprice {
  font-size: 5rem;
  font-weight: bold;
  color: #39a9e0;
}

.lp-soldprice-before {
  font-weight: bold;
  color: #000;
}

.lp-soldprice-after {
  font-weight: bold;
  color: #000;
  margin-top: 65px;
}

.abschnitt03 {
  background-color: #222;
}
.abschnitt03 .lp-circle {
  width: 50px;
  height: 50px;
  background-color: #39a9e0;
  border-radius: 50%;
  margin-right: 15px;
}
.abschnitt03 .lp-circle p {
  color: #fff;
  text-align: center;
  margin-top: 10px;
}
.abschnitt03 .lp-soldprice {
  font-size: 2.5rem;
}
.abschnitt03 p, .abschnitt03 h3 {
  color: #fff;
}
.abschnitt03 h3 {
  padding-top: 100px;
}
.abschnitt03 .inner, .abschnitt03 .banner__content {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.abschnitt03 h1 {
  font-size: 4.7rem;
  color: #fff;
  padding: 100px 0px 0px 0px;
}

.logowhite {
  width: 250px;
  height: auto;
}

.lp-headline-logos {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  margin-top: -5px;
}
.lp-headline-logos i {
  width: 80px;
  font-size: 3rem;
}

.lp-steps {
  width: 100%;
  margin-top: 100px;
  display: flex;
}
.lp-steps .step-content-01, .lp-steps .step-content-02, .lp-steps .step-content-03 {
  display: flex;
  width: 300px;
}
.lp-steps .step-content-01 p, .lp-steps .step-content-02 p, .lp-steps .step-content-03 p {
  margin-top: 20px;
}
.lp-steps .step-content-01 i {
  color: #fff;
  font-size: 3rem;
}
.lp-steps .step-content-02 img {
  box-shadow: 0px 0px 10px #fff;
}

.abschnitt04 .lp-world-logo {
  width: 600px;
  margin: 100px 0px 50px 0px;
}
.abschnitt04 p {
  font-size: 1.8rem;
  color: #000;
}
.abschnitt04 ul {
  list-style-type: none;
  font-size: 1.8rem;
  color: #000;
}
.abschnitt04 ul li::before {
  font-family: "Font Awesome 5 Pro";
  content: "";
  color: #39a9e0;
  margin-right: 10px;
}

.adobepartner2 {
  background-color: #39a9e0;
  height: 150px;
  padding-bottom: 0px;
}
.adobepartner2 .adobepartner-content {
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.adobepartner2 p {
  color: #fff;
  font-size: 2rem;
  padding: 18px 0px;
  margin: 30px 30px 0px 30px;
}
.adobepartner2 .fc-adobepartner, .adobepartner2 .adobebadge {
  margin-top: 30px;
  width: 400px;
  margin-right: 10px;
}

.abschnitt05 h1 {
  text-align: center;
  color: #000;
  padding: 60px 0px 0px 0px;
}
.abschnitt05 .adobeCloudIcon {
  width: 68px;
  height: auto;
  padding-bottom: 20px;
  padding-right: 20px;
}
.abschnitt05 .lp-hauptboxen {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.abschnitt05 .lp-hauptboxen-content {
  margin: 50px 0px;
  max-width: 560px;
  box-shadow: 0px 3px 10px #888;
}
.abschnitt05 .lp-hauptboxen-content .lp-pic {
  width: 100%;
}
.abschnitt05 .lp-hauptboxen-content .lp-icons {
  margin-top: -50px;
  padding-left: 25px;
  width: 100px;
}
.abschnitt05 .lp-hauptboxen-content:first-child {
  margin-right: 30px;
}
.abschnitt05 ul {
  padding-left: 25px;
  list-style-type: none;
  color: #000;
}
.abschnitt05 ul li::before {
  font-family: "Font Awesome 5 Pro";
  content: "";
  color: #39a9e0;
  margin-right: 10px;
}

.lp-adobeboxen {
  display: flex;
  flex-flow: row wrap;
}

.lp-adobeboxen-content {
  display: flex;
  flex-direction: row;
  width: 45%;
  margin-right: 10px;
  margin-bottom: 10px;
}
.lp-adobeboxen-content img {
  margin-right: 25px;
  margin-top: 5px;
  width: 50px;
  height: 45px;
}
.lp-adobeboxen-content p {
  color: #000;
}

.abschnitt06 {
  padding-top: 60px;
  background-color: #222;
  margin-bottom: -65px;
}
.abschnitt06 .inner, .abschnitt06 .banner__content {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.abschnitt06 .inner p, .abschnitt06 .banner__content p {
  color: #fff;
}
.abschnitt06 .lp-button {
  width: 460px;
  box-shadow: none;
}
.abschnitt06 .lp-button p {
  text-align: right;
}
.abschnitt06 .lp-button .button--lg {
  width: 100%;
  height: 75px;
  background-color: #39a9e0;
  margin-bottom: 30px;
  box-shadow: none;
}
.abschnitt06 .lp-button .button--lg p {
  text-align: center;
  margin-top: 15px;
  font-size: 1.5rem;
}
.abschnitt06 .lp-price {
  width: 500px;
}
.abschnitt06 .lp-soldprice-before {
  color: #fff;
}
.abschnitt06 .lp-soldprice-after {
  color: #fff;
}
.abschnitt06 .lp-roundbutton {
  box-shadow: none;
}

/*# sourceMappingURL=app.css.map */