@charset "UTF-8";
/* ========================================================================
 * bootstrap-tour - v0.12.0
 * http://bootstraptour.com
 * ========================================================================
 * Copyright 2012-2015 Ulrich Sossou
 *
 * ========================================================================
 * Licensed under the MIT License (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     https://opensource.org/licenses/MIT
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 * ========================================================================
 */
/*!
 * Bootstrap v3.1.0 (http://getbootstrap.com)
 * Copyright 2011-2014 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
.btn {
  display: inline-block;
  margin-bottom: 0;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  touch-action: manipulation;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  border-radius: 4px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

.btn:hover, .btn:focus, .btn.focus {
  color: #333;
  text-decoration: none;
}

.btn:active, .btn.active {
  outline: 0;
  background-image: none;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn.disabled, .btn[disabled], fieldset[disabled] .btn {
  cursor: not-allowed;
  opacity: 0.65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
  box-shadow: none;
}

a.btn.disabled, fieldset[disabled] a.btn {
  pointer-events: none;
}

.btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}

.btn-default:focus, .btn-default.focus {
  color: #333;
  background-color: #e6e6e6;
  border-color: #8c8c8c;
}

.btn-default:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}

.btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}

.btn-default:active:hover, .btn-default.active:hover, .open > .dropdown-toggle.btn-default:hover, .btn-default:active:focus, .btn-default.active:focus, .open > .dropdown-toggle.btn-default:focus, .btn-default:active.focus, .btn-default.active.focus, .open > .dropdown-toggle.btn-default.focus {
  color: #333;
  background-color: #d4d4d4;
  border-color: #8c8c8c;
}

.btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default {
  background-image: none;
}

.btn-default.disabled:hover, .btn-default[disabled]:hover, fieldset[disabled] .btn-default:hover, .btn-default.disabled:focus, .btn-default[disabled]:focus, fieldset[disabled] .btn-default:focus, .btn-default.disabled.focus, .btn-default[disabled].focus, fieldset[disabled] .btn-default.focus {
  background-color: #fff;
  border-color: #ccc;
}

.btn-default .badge {
  color: #fff;
  background-color: #333;
}

.btn-primary {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}

.btn-primary:focus, .btn-primary.focus {
  color: #fff;
  background-color: #286090;
  border-color: #122b40;
}

.btn-primary:hover {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}

.btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}

.btn-primary:active:hover, .btn-primary.active:hover, .open > .dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open > .dropdown-toggle.btn-primary:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open > .dropdown-toggle.btn-primary.focus {
  color: #fff;
  background-color: #204d74;
  border-color: #122b40;
}

.btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
  background-image: none;
}

.btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled.focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary.focus {
  background-color: #337ab7;
  border-color: #2e6da4;
}

.btn-primary .badge {
  color: #337ab7;
  background-color: #fff;
}

.btn-success {
  color: #fff;
  background-color: #5cb85c;
  border-color: #4cae4c;
}

.btn-success:focus, .btn-success.focus {
  color: #fff;
  background-color: #449d44;
  border-color: #255625;
}

.btn-success:hover {
  color: #fff;
  background-color: #449d44;
  border-color: #398439;
}

.btn-success:active, .btn-success.active, .open > .dropdown-toggle.btn-success {
  color: #fff;
  background-color: #449d44;
  border-color: #398439;
}

.btn-success:active:hover, .btn-success.active:hover, .open > .dropdown-toggle.btn-success:hover, .btn-success:active:focus, .btn-success.active:focus, .open > .dropdown-toggle.btn-success:focus, .btn-success:active.focus, .btn-success.active.focus, .open > .dropdown-toggle.btn-success.focus {
  color: #fff;
  background-color: #398439;
  border-color: #255625;
}

.btn-success:active, .btn-success.active, .open > .dropdown-toggle.btn-success {
  background-image: none;
}

.btn-success.disabled:hover, .btn-success[disabled]:hover, fieldset[disabled] .btn-success:hover, .btn-success.disabled:focus, .btn-success[disabled]:focus, fieldset[disabled] .btn-success:focus, .btn-success.disabled.focus, .btn-success[disabled].focus, fieldset[disabled] .btn-success.focus {
  background-color: #5cb85c;
  border-color: #4cae4c;
}

.btn-success .badge {
  color: #5cb85c;
  background-color: #fff;
}

.btn-info {
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da;
}

.btn-info:focus, .btn-info.focus {
  color: #fff;
  background-color: #31b0d5;
  border-color: #1b6d85;
}

.btn-info:hover {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}

.btn-info:active, .btn-info.active, .open > .dropdown-toggle.btn-info {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}

.btn-info:active:hover, .btn-info.active:hover, .open > .dropdown-toggle.btn-info:hover, .btn-info:active:focus, .btn-info.active:focus, .open > .dropdown-toggle.btn-info:focus, .btn-info:active.focus, .btn-info.active.focus, .open > .dropdown-toggle.btn-info.focus {
  color: #fff;
  background-color: #269abc;
  border-color: #1b6d85;
}

.btn-info:active, .btn-info.active, .open > .dropdown-toggle.btn-info {
  background-image: none;
}

.btn-info.disabled:hover, .btn-info[disabled]:hover, fieldset[disabled] .btn-info:hover, .btn-info.disabled:focus, .btn-info[disabled]:focus, fieldset[disabled] .btn-info:focus, .btn-info.disabled.focus, .btn-info[disabled].focus, fieldset[disabled] .btn-info.focus {
  background-color: #5bc0de;
  border-color: #46b8da;
}

.btn-info .badge {
  color: #5bc0de;
  background-color: #fff;
}

.btn-warning {
  color: #fff;
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-warning:focus, .btn-warning.focus {
  color: #fff;
  background-color: #ec971f;
  border-color: #985f0d;
}

.btn-warning:hover {
  color: #fff;
  background-color: #ec971f;
  border-color: #d58512;
}

.btn-warning:active, .btn-warning.active, .open > .dropdown-toggle.btn-warning {
  color: #fff;
  background-color: #ec971f;
  border-color: #d58512;
}

.btn-warning:active:hover, .btn-warning.active:hover, .open > .dropdown-toggle.btn-warning:hover, .btn-warning:active:focus, .btn-warning.active:focus, .open > .dropdown-toggle.btn-warning:focus, .btn-warning:active.focus, .btn-warning.active.focus, .open > .dropdown-toggle.btn-warning.focus {
  color: #fff;
  background-color: #d58512;
  border-color: #985f0d;
}

.btn-warning:active, .btn-warning.active, .open > .dropdown-toggle.btn-warning {
  background-image: none;
}

.btn-warning.disabled:hover, .btn-warning[disabled]:hover, fieldset[disabled] .btn-warning:hover, .btn-warning.disabled:focus, .btn-warning[disabled]:focus, fieldset[disabled] .btn-warning:focus, .btn-warning.disabled.focus, .btn-warning[disabled].focus, fieldset[disabled] .btn-warning.focus {
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-warning .badge {
  color: #f0ad4e;
  background-color: #fff;
}

.btn-danger {
  color: #fff;
  background-color: #d9534f;
  border-color: #d43f3a;
}

.btn-danger:focus, .btn-danger.focus {
  color: #fff;
  background-color: #c9302c;
  border-color: #761c19;
}

.btn-danger:hover {
  color: #fff;
  background-color: #c9302c;
  border-color: #ac2925;
}

.btn-danger:active, .btn-danger.active, .open > .dropdown-toggle.btn-danger {
  color: #fff;
  background-color: #c9302c;
  border-color: #ac2925;
}

.btn-danger:active:hover, .btn-danger.active:hover, .open > .dropdown-toggle.btn-danger:hover, .btn-danger:active:focus, .btn-danger.active:focus, .open > .dropdown-toggle.btn-danger:focus, .btn-danger:active.focus, .btn-danger.active.focus, .open > .dropdown-toggle.btn-danger.focus {
  color: #fff;
  background-color: #ac2925;
  border-color: #761c19;
}

.btn-danger:active, .btn-danger.active, .open > .dropdown-toggle.btn-danger {
  background-image: none;
}

.btn-danger.disabled:hover, .btn-danger[disabled]:hover, fieldset[disabled] .btn-danger:hover, .btn-danger.disabled:focus, .btn-danger[disabled]:focus, fieldset[disabled] .btn-danger:focus, .btn-danger.disabled.focus, .btn-danger[disabled].focus, fieldset[disabled] .btn-danger.focus {
  background-color: #d9534f;
  border-color: #d43f3a;
}

.btn-danger .badge {
  color: #d9534f;
  background-color: #fff;
}

.btn-link {
  color: #337ab7;
  font-weight: normal;
  border-radius: 0;
}

.btn-link, .btn-link:active, .btn-link.active, .btn-link[disabled], fieldset[disabled] .btn-link {
  background-color: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.btn-link, .btn-link:hover, .btn-link:focus, .btn-link:active {
  border-color: transparent;
}

.btn-link:hover, .btn-link:focus {
  color: #23527c;
  text-decoration: underline;
  background-color: transparent;
}

.btn-link[disabled]:hover, fieldset[disabled] .btn-link:hover, .btn-link[disabled]:focus, fieldset[disabled] .btn-link:focus {
  color: #777777;
  text-decoration: none;
}

.btn-lg, .btn-group-lg > .btn {
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 6px;
}

.btn-sm, .btn-group-sm > .btn {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

.btn-xs, .btn-group-xs > .btn {
  padding: 1px 5px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

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

.btn-block + .btn-block {
  margin-top: 5px;
}

input[type=submit].btn-block, input[type=reset].btn-block, input[type=button].btn-block {
  width: 100%;
}

.btn-group, .btn-group-vertical {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

.btn-group > .btn, .btn-group-vertical > .btn {
  position: relative;
  float: left;
}

.btn-group > .btn:hover, .btn-group-vertical > .btn:hover, .btn-group > .btn:focus, .btn-group-vertical > .btn:focus, .btn-group > .btn:active, .btn-group-vertical > .btn:active, .btn-group > .btn.active, .btn-group-vertical > .btn.active {
  z-index: 2;
}

.btn-group .btn + .btn, .btn-group .btn + .btn-group, .btn-group .btn-group + .btn, .btn-group .btn-group + .btn-group {
  margin-left: -1px;
}

.btn-toolbar {
  margin-left: -5px;
}

.btn-toolbar .btn, .btn-toolbar .btn-group, .btn-toolbar .input-group {
  float: left;
}

.btn-toolbar > .btn, .btn-toolbar > .btn-group, .btn-toolbar > .input-group {
  margin-left: 5px;
}

.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
  border-radius: 0;
}

.btn-group > .btn:first-child {
  margin-left: 0;
}

.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}

.btn-group > .btn:last-child:not(:first-child), .btn-group > .dropdown-toggle:not(:first-child) {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

.btn-group > .btn-group {
  float: left;
}

.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
  border-radius: 0;
}

.btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child, .btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}

.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

.btn-group .dropdown-toggle:active, .btn-group.open .dropdown-toggle {
  outline: 0;
}

.btn-group > .btn + .dropdown-toggle {
  padding-left: 8px;
  padding-right: 8px;
}

.btn-group > .btn-lg + .dropdown-toggle {
  padding-left: 12px;
  padding-right: 12px;
}

.btn-group.open .dropdown-toggle {
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn-group.open .dropdown-toggle.btn-link {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.btn .caret {
  margin-left: 0;
}

.btn-lg .caret {
  border-width: 5px 5px 0;
  border-bottom-width: 0;
}

.dropup .btn-lg .caret {
  border-width: 0 5px 5px;
}

.btn-group-vertical > .btn, .btn-group-vertical > .btn-group, .btn-group-vertical > .btn-group > .btn {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
}

.btn-group-vertical > .btn-group > .btn {
  float: none;
}

.btn-group-vertical > .btn + .btn, .btn-group-vertical > .btn + .btn-group, .btn-group-vertical > .btn-group + .btn, .btn-group-vertical > .btn-group + .btn-group {
  margin-top: -1px;
  margin-left: 0;
}

.btn-group-vertical > .btn:not(:first-child):not(:last-child) {
  border-radius: 0;
}

.btn-group-vertical > .btn:first-child:not(:last-child) {
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.btn-group-vertical > .btn:last-child:not(:first-child) {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}

.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
  border-radius: 0;
}

.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child, .btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}

.btn-group-justified {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
}

.btn-group-justified > .btn, .btn-group-justified > .btn-group {
  float: none;
  display: table-cell;
  width: 1%;
}

.btn-group-justified > .btn-group .btn {
  width: 100%;
}

.btn-group-justified > .btn-group .dropdown-menu {
  left: auto;
}

[data-toggle=buttons] > .btn input[type=radio], [data-toggle=buttons] > .btn-group > .btn input[type=radio], [data-toggle=buttons] > .btn input[type=checkbox], [data-toggle=buttons] > .btn-group > .btn input[type=checkbox] {
  position: absolute;
  clip: rect(0, 0, 0, 0);
  pointer-events: none;
}

.popover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1060;
  display: none;
  max-width: 276px;
  padding: 1px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: normal;
  line-break: auto;
  line-height: 1.42857143;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  white-space: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  font-size: 14px;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.popover.top {
  margin-top: -10px;
}

.popover.right {
  margin-left: 10px;
}

.popover.bottom {
  margin-top: 10px;
}

.popover.left {
  margin-left: -10px;
}

.popover-title {
  margin: 0;
  padding: 8px 14px;
  font-size: 14px;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
  border-radius: 5px 5px 0 0;
}

.popover-content {
  padding: 9px 14px;
}

.popover > .arrow, .popover > .arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}

.popover > .arrow {
  border-width: 11px;
}

.popover > .arrow:after {
  border-width: 10px;
  content: "";
}

.popover.top > .arrow {
  left: 50%;
  margin-left: -11px;
  border-bottom-width: 0;
  border-top-color: #999999;
  border-top-color: rgba(0, 0, 0, 0.25);
  bottom: -11px;
}

.popover.top > .arrow:after {
  content: " ";
  bottom: 1px;
  margin-left: -10px;
  border-bottom-width: 0;
  border-top-color: #fff;
}

.popover.right > .arrow {
  top: 50%;
  left: -11px;
  margin-top: -11px;
  border-left-width: 0;
  border-right-color: #999999;
  border-right-color: rgba(0, 0, 0, 0.25);
}

.popover.right > .arrow:after {
  content: " ";
  left: 1px;
  bottom: -10px;
  border-left-width: 0;
  border-right-color: #fff;
}

.popover.bottom > .arrow {
  left: 50%;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: #999999;
  border-bottom-color: rgba(0, 0, 0, 0.25);
  top: -11px;
}

.popover.bottom > .arrow:after {
  content: " ";
  top: 1px;
  margin-left: -10px;
  border-top-width: 0;
  border-bottom-color: #fff;
}

.popover.left > .arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-right-width: 0;
  border-left-color: #999999;
  border-left-color: rgba(0, 0, 0, 0.25);
}

.popover.left > .arrow:after {
  content: " ";
  right: 1px;
  border-right-width: 0;
  border-left-color: #fff;
  bottom: -10px;
}

.fade {
  opacity: 0;
  -webkit-transition: opacity 0.15s linear;
  -o-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear;
}

.fade.in {
  opacity: 1;
}

.collapse {
  display: none;
}

.collapse.in {
  display: block;
}

tr.collapse.in {
  display: table-row;
}

tbody.collapse.in {
  display: table-row-group;
}

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition-property: height, visibility;
  transition-property: height, visibility;
  -webkit-transition-duration: 0.35s;
  transition-duration: 0.35s;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
}

.tour-backdrop {
  position: absolute;
  z-index: 1100;
  background-color: #000;
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.popover[class*=tour-] {
  z-index: 1102;
}

.popover[class*=tour-] .popover-navigation {
  padding: 9px 14px;
  overflow: hidden;
}

.popover[class*=tour-] .popover-navigation *[data-role=end] {
  float: right;
}

.popover[class*=tour-] .popover-navigation *[data-role=prev], .popover[class*=tour-] .popover-navigation *[data-role=next], .popover[class*=tour-] .popover-navigation *[data-role=end] {
  cursor: pointer;
}

.popover[class*=tour-] .popover-navigation *[data-role=prev].disabled, .popover[class*=tour-] .popover-navigation *[data-role=next].disabled, .popover[class*=tour-] .popover-navigation *[data-role=end].disabled {
  cursor: default;
}

.popover[class*=tour-].orphan {
  position: fixed;
  margin-top: 0;
}

.popover[class*=tour-].orphan .arrow {
  display: none;
}

div.tagsinput {
  border: 1px solid #CCC;
  background: #FFF;
  padding: 5px;
  width: 300px;
  height: 100px;
  overflow-y: auto;
}

div.tagsinput span.tag {
  border: 1px solid #a5d24a;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  display: block;
  float: left;
  padding: 5px;
  text-decoration: none;
  background: #cde69c;
  color: #638421;
  margin-right: 5px;
  margin-bottom: 5px;
  font-family: helvetica;
  font-size: 13px;
}

div.tagsinput span.tag a {
  font-weight: 700;
  color: #82ad2b;
  text-decoration: none;
  font-size: 11px;
}

div.tagsinput input {
  width: 80px;
  margin: 0 5px 5px 0;
  font-family: helvetica;
  font-size: 13px;
  border: 1px solid transparent;
  padding: 5px;
  background: 0 0;
  color: #000;
  outline: 0;
}

div.tagsinput div {
  display: block;
  float: left;
}

.tags_clear {
  clear: both;
  width: 100%;
  height: 0;
}

.not_valid {
  background: #FBD8DB !important;
  color: #90111A !important;
}

/*
 * easy-autocomplete
 * jQuery plugin for autocompletion
 * 
 * @author Łukasz Pawełczak (http://github.com/pawelczak)
 * @version 1.3.5
 * Copyright  License: 
 */
.easy-autocomplete {
  position: relative;
}

.easy-autocomplete input {
  border-color: #ccc;
  border-radius: 4px;
  border-style: solid;
  border-width: 1px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
  color: #555;
  float: none;
  padding: 6px 12px;
}

.easy-autocomplete input:hover, .easy-autocomplete input:focus {
  box-shadow: none;
}

.easy-autocomplete a {
  display: block;
}

.easy-autocomplete.eac-blue-light input:hover, .easy-autocomplete.eac-blue-light input:focus {
  border-color: #66afe9;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
}

.easy-autocomplete.eac-blue-light ul {
  border-color: #66afe9;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
}

.easy-autocomplete.eac-blue-light ul li, .easy-autocomplete.eac-blue-light ul .eac-category {
  border-color: #66afe9;
}

.easy-autocomplete.eac-blue-light ul li.selected, .easy-autocomplete.eac-blue-light ul .eac-category.selected {
  background-color: #ecf5fc;
}

.easy-autocomplete.eac-green-light input:hover, .easy-autocomplete.eac-green-light input:focus {
  border-color: #41DB00;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(146, 237, 107, 0.6);
}

.easy-autocomplete.eac-green-light ul {
  border-color: #41DB00;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(146, 237, 107, 0.6);
}

.easy-autocomplete.eac-green-light ul li, .easy-autocomplete.eac-green-light ul .eac-category {
  border-color: #41DB00;
}

.easy-autocomplete.eac-green-light ul li.selected, .easy-autocomplete.eac-green-light ul .eac-category.selected {
  background-color: #9eff75;
}

.easy-autocomplete.eac-red-light input:hover, .easy-autocomplete.eac-red-light input:focus {
  border-color: #ff5b5b;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(255, 90, 90, 0.6);
}

.easy-autocomplete.eac-red-light ul {
  border-color: #ff5b5b;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(255, 90, 90, 0.6);
}

.easy-autocomplete.eac-red-light ul li, .easy-autocomplete.eac-red-light ul .eac-category {
  border-color: #ff5b5b;
}

.easy-autocomplete.eac-red-light ul li.selected, .easy-autocomplete.eac-red-light ul .eac-category.selected {
  background-color: #ff8e8e;
}

.easy-autocomplete.eac-yellow-light input:hover, .easy-autocomplete.eac-yellow-light input:focus {
  border-color: #ffdb00;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(255, 231, 84, 0.6);
}

.easy-autocomplete.eac-yellow-light ul {
  border-color: #ffdb00;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(255, 231, 84, 0.6);
}

.easy-autocomplete.eac-yellow-light ul li, .easy-autocomplete.eac-yellow-light ul .eac-category {
  border-color: #ffdb00;
}

.easy-autocomplete.eac-yellow-light ul li.selected, .easy-autocomplete.eac-yellow-light ul .eac-category.selected {
  background-color: #ffe233;
}

.easy-autocomplete.eac-dark-light input:hover, .easy-autocomplete.eac-dark-light input:focus {
  border-color: #333;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(55, 55, 55, 0.6);
}

.easy-autocomplete.eac-dark-light ul {
  border-color: #333;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(55, 55, 55, 0.6);
}

.easy-autocomplete.eac-dark-light ul li, .easy-autocomplete.eac-dark-light ul .eac-category {
  border-color: #333;
}

.easy-autocomplete.eac-dark-light ul li.selected, .easy-autocomplete.eac-dark-light ul .eac-category.selected {
  background-color: #4d4d4d;
  color: #fff;
}

.easy-autocomplete.eac-dark {
  color: #fff;
}

.easy-autocomplete.eac-dark input {
  background-color: #404040;
  border-radius: 4px;
  box-shadow: 0;
  color: #f6f6f6;
}

.easy-autocomplete.eac-dark input:hover, .easy-autocomplete.eac-dark input:focus {
  border-color: #333;
  box-shadow: 0;
}

.easy-autocomplete.eac-dark ul {
  border-color: #333;
}

.easy-autocomplete.eac-dark ul li, .easy-autocomplete.eac-dark ul .eac-category {
  background-color: #404040;
  border-color: #333;
}

.easy-autocomplete.eac-dark ul li.selected, .easy-autocomplete.eac-dark ul .eac-category.selected {
  background-color: #737373;
  color: #f6f6f6;
}

.easy-autocomplete.eac-dark-glass {
  color: #fff;
}

.easy-autocomplete.eac-dark-glass input {
  background-color: rgba(0, 0, 0, 0.8);
  border-radius: 4px;
  box-shadow: 0;
  color: #f6f6f6;
}

.easy-autocomplete.eac-dark-glass input:hover, .easy-autocomplete.eac-dark-glass input:focus {
  border-color: rgba(0, 0, 0, 0.8);
  box-shadow: 0;
}

.easy-autocomplete.eac-dark-glass ul {
  border-color: rgba(0, 0, 0, 0.8);
}

.easy-autocomplete.eac-dark-glass ul li, .easy-autocomplete.eac-dark-glass ul .eac-category {
  background-color: rgba(0, 0, 0, 0.8);
  border-color: rgba(0, 0, 0, 0.8);
}

.easy-autocomplete.eac-dark-glass ul li.selected, .easy-autocomplete.eac-dark-glass ul .eac-category.selected {
  background-color: rgba(64, 64, 64, 0.8);
  color: #f6f6f6;
}

.easy-autocomplete.eac-dark-glass ul li:last-child, .easy-autocomplete.eac-dark-glass ul .eac-category:last-child {
  border-radius: 0 0 4px 4px;
}

.easy-autocomplete.eac-blue {
  color: #fff;
}

.easy-autocomplete.eac-blue input {
  background-color: #6d9ed1;
  border-radius: 4px;
  box-shadow: 0;
  color: #f6f6f6;
}

.easy-autocomplete.eac-blue input::-webkit-input-placeholder {
  color: #f6f6f6;
}

.easy-autocomplete.eac-blue input:-moz-placeholder {
  color: #f6f6f6;
}

.easy-autocomplete.eac-blue input::-moz-placeholder {
  color: #f6f6f6;
}

.easy-autocomplete.eac-blue input:-ms-input-placeholder {
  color: #f6f6f6;
}

.easy-autocomplete.eac-blue input:hover, .easy-autocomplete.eac-blue input:focus {
  border-color: #5A91CB;
  box-shadow: 0;
}

.easy-autocomplete.eac-blue ul {
  border-color: #5A91CB;
}

.easy-autocomplete.eac-blue ul li, .easy-autocomplete.eac-blue ul .eac-category {
  background-color: #6d9ed1;
  border-color: #5A91CB;
}

.easy-autocomplete.eac-blue ul li.selected, .easy-autocomplete.eac-blue ul .eac-category.selected {
  background-color: #94b8dd;
  color: #f6f6f6;
}

.easy-autocomplete.eac-yellow {
  color: #333;
}

.easy-autocomplete.eac-yellow input {
  background-color: #ffdb7e;
  border-color: #333;
  border-radius: 4px;
  box-shadow: 0;
  color: #333;
}

.easy-autocomplete.eac-yellow input:hover, .easy-autocomplete.eac-yellow input:focus {
  border-color: #333;
  box-shadow: 0;
}

.easy-autocomplete.eac-yellow ul {
  border-color: #333;
}

.easy-autocomplete.eac-yellow ul li, .easy-autocomplete.eac-yellow ul .eac-category {
  background-color: #ffdb7e;
  border-color: #333;
}

.easy-autocomplete.eac-yellow ul li.selected, .easy-autocomplete.eac-yellow ul .eac-category.selected {
  background-color: #ffe9b1;
  color: #333;
}

.easy-autocomplete.eac-purple {
  color: #333;
}

.easy-autocomplete.eac-purple input {
  background-color: #d6d1e7;
  border-color: #b8afd5;
  box-shadow: 0;
  color: #333;
}

.easy-autocomplete.eac-purple input:hover, .easy-autocomplete.eac-purple input:focus {
  border-color: #333;
  box-shadow: 0;
}

.easy-autocomplete.eac-purple ul {
  border-color: #333;
}

.easy-autocomplete.eac-purple ul li, .easy-autocomplete.eac-purple ul .eac-category {
  background-color: #d6d1e7;
  border-color: #333;
}

.easy-autocomplete.eac-purple ul li.selected, .easy-autocomplete.eac-purple ul .eac-category.selected {
  background-color: #ebe8f3;
  color: #333;
}

.easy-autocomplete.eac-bootstrap input {
  border-color: #ccc;
  border-radius: 4px;
  border-style: solid;
  border-width: 1px;
  color: #555;
  padding: 6px 12px;
}

.easy-autocomplete-container {
  left: 0;
  position: absolute;
  width: 100%;
  z-index: 2;
}

.easy-autocomplete-container ul {
  background: none repeat scroll 0 0 #ffffff;
  border-top: 1px dotted #ccc;
  display: none;
  margin-top: 0;
  padding-bottom: 0;
  padding-left: 0;
  position: relative;
  top: -1px;
}

.easy-autocomplete-container ul li, .easy-autocomplete-container ul .eac-category {
  background: inherit;
  border-color: #ccc;
  border-image: none;
  border-style: solid;
  border-width: 0 1px;
  display: block;
  font-size: 14px;
  font-weight: normal;
  padding: 4px 12px;
}

.easy-autocomplete-container ul li:last-child {
  border-radius: 0 0 2px 2px;
  border-width: 0 1px 1px;
}

.easy-autocomplete-container ul li.selected {
  background: none repeat scroll 0 0 #ebebeb;
  cursor: pointer;
}

.easy-autocomplete-container ul li.selected div {
  font-weight: normal;
}

.easy-autocomplete-container ul li div {
  display: block;
  font-weight: normal;
  word-break: break-all;
}

.easy-autocomplete-container ul li b {
  font-weight: bold;
}

.easy-autocomplete-container ul .eac-category {
  font-color: #aaa;
  font-style: italic;
}

.eac-description .eac-item span {
  color: #aaa;
  font-style: italic;
  font-size: 0.9em;
}

.eac-icon-left .eac-item img {
  margin-right: 4px;
  max-height: 30px;
}

.eac-icon-right .eac-item {
  margin-top: 8px;
  min-height: 24px;
  position: relative;
}

.eac-icon-right .eac-item img {
  margin-left: 4px;
  max-height: 30px;
  position: absolute;
  right: -4px;
  top: -8px;
}


/*
    Created on : 26.06.2025, 15:25:25
    Author     : klaus
*/
/*
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/style.scss to edit this template
*/
/*
    Created on : 26.06.2025, 15:24:40
    Author     : klaus
*/
/* roboto-100 - latin */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 100;
  src: url("../fonts/roboto-v30-latin-100.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-100.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-100.woff2") format("woff2"), url("../fonts/roboto-v30-latin-100.woff") format("woff"), url("../fonts/roboto-v30-latin-100.ttf") format("truetype"), url("../fonts/roboto-v30-latin-100.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-100italic - latin */
@font-face {
  font-family: "Roboto";
  font-style: italic;
  font-weight: 100;
  src: url("../fonts/roboto-v30-latin-100italic.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-100italic.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-100italic.woff2") format("woff2"), url("../fonts/roboto-v30-latin-100italic.woff") format("woff"), url("../fonts/roboto-v30-latin-100italic.ttf") format("truetype"), url("../fonts/roboto-v30-latin-100italic.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-300 - latin */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/roboto-v30-latin-300.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-300.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-300.woff2") format("woff2"), url("../fonts/roboto-v30-latin-300.woff") format("woff"), url("../fonts/roboto-v30-latin-300.ttf") format("truetype"), url("../fonts/roboto-v30-latin-300.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-300italic - latin */
@font-face {
  font-family: "Roboto";
  font-style: italic;
  font-weight: 300;
  src: url("../fonts/roboto-v30-latin-300italic.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-300italic.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-300italic.woff2") format("woff2"), url("../fonts/roboto-v30-latin-300italic.woff") format("woff"), url("../fonts/roboto-v30-latin-300italic.ttf") format("truetype"), url("../fonts/roboto-v30-latin-300italic.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-regular - latin */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/roboto-v30-latin-regular.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-regular.woff2") format("woff2"), url("../fonts/roboto-v30-latin-regular.woff") format("woff"), url("../fonts/roboto-v30-latin-regular.ttf") format("truetype"), url("../fonts/roboto-v30-latin-regular.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-italic - latin */
@font-face {
  font-family: "Roboto";
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/roboto-v30-latin-italic.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-italic.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-italic.woff2") format("woff2"), url("../fonts/roboto-v30-latin-italic.woff") format("woff"), url("../fonts/roboto-v30-latin-italic.ttf") format("truetype"), url("../fonts/roboto-v30-latin-italic.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-500 - latin */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/roboto-v30-latin-500.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-500.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-500.woff2") format("woff2"), url("../fonts/roboto-v30-latin-500.woff") format("woff"), url("../fonts/roboto-v30-latin-500.ttf") format("truetype"), url("../fonts/roboto-v30-latin-500.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-500italic - latin */
@font-face {
  font-family: "Roboto";
  font-style: italic;
  font-weight: 500;
  src: url("../fonts/roboto-v30-latin-500italic.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-500italic.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-500italic.woff2") format("woff2"), url("../fonts/roboto-v30-latin-500italic.woff") format("woff"), url("../fonts/roboto-v30-latin-500italic.ttf") format("truetype"), url("../fonts/roboto-v30-latin-500italic.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-700 - latin */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/roboto-v30-latin-700.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-700.woff2") format("woff2"), url("../fonts/roboto-v30-latin-700.woff") format("woff"), url("../fonts/roboto-v30-latin-700.ttf") format("truetype"), url("../fonts/roboto-v30-latin-700.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-700italic - latin */
@font-face {
  font-family: "Roboto";
  font-style: italic;
  font-weight: 700;
  src: url("../fonts/roboto-v30-latin-700italic.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-700italic.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-700italic.woff2") format("woff2"), url("../fonts/roboto-v30-latin-700italic.woff") format("woff"), url("../fonts/roboto-v30-latin-700italic.ttf") format("truetype"), url("../fonts/roboto-v30-latin-700italic.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-900 - latin */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 900;
  src: url("../fonts/roboto-v30-latin-900.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-900.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-900.woff2") format("woff2"), url("../fonts/roboto-v30-latin-900.woff") format("woff"), url("../fonts/roboto-v30-latin-900.ttf") format("truetype"), url("../fonts/roboto-v30-latin-900.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-900italic - latin */
@font-face {
  font-family: "Roboto";
  font-style: italic;
  font-weight: 900;
  src: url("../fonts/roboto-v30-latin-900italic.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-v30-latin-900italic.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v30-latin-900italic.woff2") format("woff2"), url("../fonts/roboto-v30-latin-900italic.woff") format("woff"), url("../fonts/roboto-v30-latin-900italic.ttf") format("truetype"), url("../fonts/roboto-v30-latin-900italic.svg#Roboto") format("svg"); /* Legacy iOS */
}
/* roboto-slab-regular - latin */
@font-face {
  font-family: "Roboto Slab";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/roboto-slab-v24-latin-regular.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/roboto-slab-v24-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-slab-v24-latin-regular.woff2") format("woff2"), url("../fonts/roboto-slab-v24-latin-regular.woff") format("woff"), url("../fonts/roboto-slab-v24-latin-regular.ttf") format("truetype"), url("../fonts/roboto-slab-v24-latin-regular.svg#RobotoSlab") format("svg"); /* Legacy iOS */
}
/* dm-sans-regular - latin */
@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/dm-sans-v11-latin-regular.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/dm-sans-v11-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/dm-sans-v11-latin-regular.woff2") format("woff2"), url("../fonts/dm-sans-v11-latin-regular.woff") format("woff"), url("../fonts/dm-sans-v11-latin-regular.ttf") format("truetype"), url("../fonts/dm-sans-v11-latin-regular.svg#DMSans") format("svg"); /* Legacy iOS */
}
/* dm-sans-italic - latin */
@font-face {
  font-family: "DM Sans";
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/dm-sans-v11-latin-italic.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/dm-sans-v11-latin-italic.eot?#iefix") format("embedded-opentype"), url("../fonts/dm-sans-v11-latin-italic.woff2") format("woff2"), url("../fonts/dm-sans-v11-latin-italic.woff") format("woff"), url("../fonts/dm-sans-v11-latin-italic.ttf") format("truetype"), url("../fonts/dm-sans-v11-latin-italic.svg#DMSans") format("svg"); /* Legacy iOS */
}
/* dm-sans-500 - latin */
@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/dm-sans-v11-latin-500.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/dm-sans-v11-latin-500.eot?#iefix") format("embedded-opentype"), url("../fonts/dm-sans-v11-latin-500.woff2") format("woff2"), url("../fonts/dm-sans-v11-latin-500.woff") format("woff"), url("../fonts/dm-sans-v11-latin-500.ttf") format("truetype"), url("../fonts/dm-sans-v11-latin-500.svg#DMSans") format("svg"); /* Legacy iOS */
}
/* dm-sans-500italic - latin */
@font-face {
  font-family: "DM Sans";
  font-style: italic;
  font-weight: 500;
  src: url("../fonts/dm-sans-v11-latin-500italic.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/dm-sans-v11-latin-500italic.eot?#iefix") format("embedded-opentype"), url("../fonts/dm-sans-v11-latin-500italic.woff2") format("woff2"), url("../fonts/dm-sans-v11-latin-500italic.woff") format("woff"), url("../fonts/dm-sans-v11-latin-500italic.ttf") format("truetype"), url("../fonts/dm-sans-v11-latin-500italic.svg#DMSans") format("svg"); /* Legacy iOS */
}
/* dm-sans-700 - latin */
@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/dm-sans-v11-latin-700.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/dm-sans-v11-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/dm-sans-v11-latin-700.woff2") format("woff2"), url("../fonts/dm-sans-v11-latin-700.woff") format("woff"), url("../fonts/dm-sans-v11-latin-700.ttf") format("truetype"), url("../fonts/dm-sans-v11-latin-700.svg#DMSans") format("svg"); /* Legacy iOS */
}
/* dm-sans-700italic - latin */
@font-face {
  font-family: "DM Sans";
  font-style: italic;
  font-weight: 700;
  src: url("../fonts/dm-sans-v11-latin-700italic.eot"); /* IE9 Compat Modes */
  src: local(""), url("../fonts/dm-sans-v11-latin-700italic.eot?#iefix") format("embedded-opentype"), url("../fonts/dm-sans-v11-latin-700italic.woff2") format("woff2"), url("../fonts/dm-sans-v11-latin-700italic.woff") format("woff"), url("../fonts/dm-sans-v11-latin-700italic.ttf") format("truetype"), url("../fonts/dm-sans-v11-latin-700italic.svg#DMSans") format("svg"); /* Legacy iOS */
}
/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html, textarea {
  font-size: 1em;
  /* line-height: 1.4; */
}

/*
 * Preventing distracting color animations
 */
input:focus,
textarea:focus,
select:focus,
div:focus,
button:focus,
li:focus,
a:focus {
  outline: none !important;
  box-shadow: none !important;
  animation: none !important;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */
audio,
canvas,
img,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */
fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */
textarea {
  resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */
.browsehappy {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

/* CUSTOM GLOBAL RESETS */
* {
  box-sizing: border-box !important;
}

*[tabindex]:focus {
  outline: none;
}

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

p, h1, h2, h3, h4, h5, h6 {
  margin: 0;
}

img {
  vertical-align: top;
}

ul {
  margin: 0;
  padding: 0;
}

td {
  padding: 0;
}

p {
  word-wrap: break-word;
}

/* REUSABLES */
.left {
  float: left;
}

.right {
  float: right;
}

.h100 {
  height: 100%;
}

.w100 {
  width: 100%;
}

.w50 {
  width: 50%;
}

.mh100 {
  min-height: 100%;
}

.flex-container {
  display: flex;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clearfix:before,
.clearfix:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}

.clearfix:after {
  clear: both;
}

/* ==========================================================================
     EXAMPLE Media Queries for Responsive Design.
     These examples override the primary ('mobile first') styles.
     Modify as content requires.
     ========================================================================== */
@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}
@media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}
/* ==========================================================================
     Print styles.
     Inlined to avoid required HTTP connection: h5bp.com/r
     ========================================================================== */
@media print {
  * {
    background: transparent !important;
    color: #000 !important; /* Black prints faster: h5bp.com/s */
    box-shadow: none !important;
    text-shadow: none !important;
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  a[href]:after {
    content: " (" attr(href) ")";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  /*
   * Don't show links for images, or javascript/internal links
   */
  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: "";
  }
  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }
  thead {
    display: table-header-group; /* h5bp.com/t */
  }
  tr,
  img {
    page-break-inside: avoid;
  }
  img {
    max-width: 100% !important;
  }
  @page {
    margin: 0.5cm;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
}
html {
  position: relative;
  overflow-y: scroll;
  overflow-x: hidden;
}

body {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  position: relative;
  -ms-content-zooming: none;
}

/**
 * Responsive dynamic height sticky footer via flexbox
 * 1. Avoid the IE 10-11 `min-height` bug. --> main.scss
 * 2. Set `flex-shrink` to `0` to prevent Chrome, Opera, and Safari from
 *    letting these items shrink to smaller than their content's default
 *    minimum size.
 */
body {
  display: flex;
  flex-direction: column;
  min-height: 100%; /* 1 */
}

footer {
  font-size: 13px;
  padding: 13px 0 1px 0;
  flex-shrink: 0; /* 2 */
  background: #e9e9e9;
  color: #666;
  z-index: 1;
}

footer ul {
  list-style: none;
}

footer ul li {
  margin-right: 20px;
  position: relative;
  margin-bottom: 8px;
}

footer a {
  color: #666;
}

footer a:hover,
footer a:focus {
  color: #333;
}

/*	@media only screen and (min-width : 1024px) {
        footer {
            display: block;
        }
    }*/
.coupon-input .module-hl {
  margin-bottom: 6px;
}

.coupon-input .wrapper {
  display: flex;
}

.coupon-input input {
  padding: 0 10px;
  width: 310px;
}

input[type=text],
input[type=number],
input[type=password],
input[type=email] {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  border: none;
  padding: 10px 15px;
}

.embed-container {
  position: relative;
  overflow: hidden;
  max-width: 100%;
  margin-bottom: 50px;
}

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

@-ms-viewport {
  width: device-width;
}
.downtime-warning {
  position: absolute;
  top: 50px;
  left: 20px;
  background-color: yellow;
  width: 180px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  padding: 10px;
  z-index: 65536;
}

.blink {
  animation: blink-animation 1s steps(5, start) infinite;
  -webkit-animation: blink-animation 1s steps(5, start) infinite;
}

@keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
@-webkit-keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
.onoffswitch {
  position: relative;
  width: 35px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.onoffswitch-checkbox {
  display: none;
}

.onoffswitch-label {
  display: block;
  overflow: hidden;
  cursor: pointer;
  height: 13px;
  padding: 0;
  line-height: 13px;
  border: 0px solid #FFFFFF;
  border-radius: 21px;
  background-color: #9E9E9E;
}

.onoffswitch-label:before {
  content: "";
  display: block;
  width: 21px;
  margin: -4px;
  background: #FFFFFF;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 18px;
  border-radius: 21px;
  box-shadow: 0 6px 12px 0px #757575;
}

.onoffswitch-checkbox:checked + .onoffswitch-label {
  background-color: #00A279;
}

.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
  border-color: #00A279;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
  margin-left: 0;
}

.onoffswitch-checkbox:checked + .onoffswitch-label:before {
  right: 0px;
  background-color: #007356;
  box-shadow: 3px 6px 18px 0px rgba(0, 0, 0, 0.2);
}

#appleid-signin {
  margin-top: 20px;
}

#appleid-signin > div > div {
  height: 40px !important;
}

.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 200px;
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.9em;
  background-color: black;
  color: #fff;
  text-align: left;
  border-radius: 6px;
  padding: 5px;
  white-space: break-spaces;
  font-weight: normal;
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

.modal {
  display: none;
  background: #eee;
  padding: 25px;
  width: 100%;
  max-width: 100% !important;
  max-height: 100%;
  overflow-y: auto;
  bottom: auto !important;
  top: 0 !important;
  left: 50% !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  transform: translateX(-50%);
}

.modal input {
  font-size: 22px;
  margin: 4px 0;
}

.modal input[type=number] {
  width: 56px;
  margin: 0 4px;
  padding: 0px;
  font-size: 20px;
  text-align: right;
}

.modal .custom-checkbox > input {
  margin: 0;
  top: 0;
}

.modal .action-btn {
  margin-top: 28px;
}

.modal-action-btns {
  margin-top: 28px;
  display: flex;
}

.modal .cancel-btn {
  margin-left: auto;
}

.modal .intro-text {
  margin-bottom: 12px;
}

.modal .radio-list input {
  margin-bottom: 8px;
}

.modal .label-input-pair {
  position: relative;
  margin-bottom: 8px;
}

.modal .label-input-pair input[type=radio] {
  position: absolute;
}

.modal .label-input-pair label {
  padding-left: 18px;
  display: block;
}

.modal-hl {
  color: #666;
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  margin-bottom: 12px;
}

.modal-hl i {
  position: relative;
  top: -1px;
  margin-right: 3px;
}

.modal-close-btn {
  position: absolute;
  right: 15px;
  top: 12px;
  font-size: 20px;
}

.input-x {
  position: relative;
  padding-right: 26px;
}

.input-x .remove-btn {
  position: absolute;
  right: 0px;
  top: 12px;
  color: #aaa;
  font-size: 20px;
}

.modal-close-btn,
.input-x .remove-btn {
  color: #aaa;
}

.modal-close-btn:hover,
.input-x .remove-btn:hover {
  color: #666;
}

.flash-modal[data-type=success] {
  color: #08b474;
}

.flash-modal[data-type=error] {
  color: #DB4646;
}

.modal-flash-text {
  padding: 30px 20px 30px 20px;
  font-size: 18px;
}

.add-person-btn {
  margin: 8px 0 0 2px;
}

@media only screen and (min-width: 768px) {
  .modal {
    width: 400px;
    max-height: 70%;
    top: 15% !important;
  }
}
@media only screen and (min-width: 768px) {
  #login-modal {
    width: 320px;
  }
}
.log-in-form {
  position: relative;
}

.log-in-form input[type=text],
.log-in-form input[type=password] {
  display: block;
  width: 100%;
  border: none;
  padding: 10px 15px;
  margin-left: 2px;
  font-size: 22px;
  color: #777;
  margin: 0 auto 4px auto;
}

.log-in-form input[type=text]::placeholder,
.log-in-form input[type=password]::placeholder {
  color: #bbb;
}

.log-in-form .forgot-pw-link {
  display: block;
  font-size: 12px;
  color: #999;
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  margin-bottom: 10px;
}

.log-in-form .forgot-pw-link:hover {
  color: #bbb;
}

.log-in-form .stay-logged-in {
  display: block;
  font-size: 12px;
  color: #999;
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  margin-bottom: 10px;
}

.log-in-form .stay-logged-in input {
  position: relative;
  top: 2px;
}

.log-in-form .label-username,
.log-in-form .label-password {
  display: none;
  position: absolute;
  font-size: 12px;
  color: #999;
}

.log-in-form .label-username {
  top: -20px;
}

.log-in-form .label-password {
  top: 53px;
}

.iexplorer #loginusername {
  margin-top: 30px;
}

.iexplorer #loginuserpass {
  margin-top: 26px;
}

/* IE10+ specific styles */
/* show label under input, because placeholder is hidden on focussed input */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .log-in-form input:focus + label {
    display: block;
  }
}
#search-modal .input-wrapper {
  margin-bottom: 4px;
}

#search-modal .search-options label {
  margin-right: 15px;
  display: block;
  font-size: 18px;
}

@media only screen and (min-width: 768px) {
  #search-modal {
    width: 600px;
  }
  #search-modal .search-options label {
    display: inline;
  }
}
.add-person-btn {
  position: relative;
  left: 2px;
  top: 8px;
  margin-bottom: 30px;
}

#invite-friends-modal textarea {
  margin-top: 4px;
  padding: 8px 12px;
}

.invite-friend-btn {
  margin-top: 28px;
}

.add-studypal-btn {
  margin-top: 28px;
}

#private-message-modal {
  padding: 0;
}

#private-message-modal .user-column {
  height: 100%;
  background: #f0f0f0;
}

#private-message-modal .user-column .modal-hl {
  padding: 15px 15px 0;
}

#private-message-modal .user-list {
  font-size: 14px;
}

#private-message-modal .messagedUser {
  position: relative;
  padding: 15px 15px 15px 60px;
  border-bottom: 1px solid #ddd;
  cursor: pointer;
}

#private-message-modal .messagedUser .date {
  margin-top: 6px;
  color: rgba(0, 0, 0, 0.3);
}

#private-message-modal .messagedUser .userpic {
  position: absolute;
  left: 15px;
  top: 15px;
}

#private-message-modal .messagedUser:hover {
  background: #fff;
}

#private-message-modal .message-column {
  position: relative;
  height: 100%;
  overflow-y: auto;
  padding: 15px;
  display: none;
}

#private-message-modal .messages-container {
  overflow: auto;
  margin-top: 30px;
}

#private-message-modal .message {
  background: #fff;
  padding: 15px;
  position: relative;
}

#private-message-modal .message.other {
  background: #f0f0f0;
}

#private-message-modal .message .userpic {
  position: absolute;
  left: 15px;
  top: 15px;
}

#private-message-modal .message .username,
#private-message-modal .message .text {
  padding-left: 50px;
}

#private-message-modal .message .username {
  font-weight: bold;
}

#private-message-modal .message .date {
  position: absolute;
  right: 36px;
  top: 18px;
  color: rgba(0, 0, 0, 0.2);
  font-size: 14px;
}

#private-message-modal #deleteMessagesWithUserButton {
  float: right;
  right: 18px;
  margin-top: 18px;
}

#private-message-modal .message .deleteMessage {
  position: absolute;
  right: 18px;
  top: 18px;
  color: rgba(0, 0, 0, 0.2);
  font-size: 14px;
}

#private-message-modal .private-message-text {
  padding: 15px 18px;
}

#private-message-modal .more {
  margin: 18px 0 10px 2px;
}

.send-private-message-btn {
  margin-top: 6px;
  float: none;
}

@media only screen and (min-width: 768px) {
  #private-message-modal {
    width: 100%;
    height: 100%;
    max-height: 100%;
    top: 0 !important;
  }
  #private-message-modal > .wrapper {
    display: flex;
    height: 100%;
  }
  #private-message-modal .user-column {
    flex: 4;
    max-width: 260px;
  }
  #private-message-modal .message-column {
    flex: 6;
    display: block;
  }
}
@media only screen and (min-width: 1024px) {
  #private-message-modal {
    width: 984px;
    height: 70%;
    top: 15% !important;
  }
  #private-message-modal .user-column {
    width: 254px;
  }
  #private-message-modal .message-column {
    width: 730px;
  }
}
#activity-modal .modal-hl {
  margin-bottom: 20px;
}

#activity-modal .activity {
  padding: 0;
}

#activity-modal .activity .userpic {
  background: #999;
  margin-top: 3px;
}

#activity-modal .activity .activity-text {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.6);
}

#activity-modal .activity .activity-sub-info {
  font-size: 16px;
}

#activity-modal .activity .activity-text,
#activity-modal .activity .activity-sub-info {
  padding-left: 60px;
}

#activity-modal .activity .activity-icons {
  width: 60px;
  text-align: right;
}

#activity-modal .activity .activity-icons .fa {
  font-size: 42px;
  color: #bbb;
}

#activity-modal .activity .textarea-wrapper {
  margin-left: 60px;
}

#activity-modal .activity .comment-textarea {
  font-size: 16px;
  height: 38px;
  margin-bottom: 12px;
  min-height: 0;
}

#activity-modal .activity .comments {
  margin-top: 20px;
}

#activity-modal .activity .comments .userpic {
  left: 20px;
}

#activity-modal .activity .comments .activity-text {
  font-size: 16px;
}

#activity-modal .activity .comments .activity-sub-info {
  font-size: 16px;
}

#activity-modal .activity .comments .comment {
  margin-bottom: 12px;
}

#activity-modal .activity .comments .more-btn {
  margin-left: 60px;
}

#activity-modal .progress-bar {
  height: 6px;
  background: #aaa;
}

@media only screen and (min-width: 768px) {
  #activity-modal {
    width: 600px;
  }
}
#feedback-modal {
  padding-bottom: 24px;
}

.feedback-text {
  margin-top: 6px;
}

.send-feedback-btn {
  margin-top: 28px;
  float: none;
  margin-bottom: 30px;
}

.features-column {
  width: 50%;
  float: left;
  padding-right: 12px;
}

.updates-column {
  width: 100%;
  float: left;
}

.update-entry {
  margin-left: 22px;
  margin-bottom: 15px;
}

.update-date {
  font-size: 14px;
  color: #999;
}

.missing-features-hl {
  margin-bottom: 6px;
}

.missing-features-list {
  margin-left: 20px;
}

@media only screen and (min-width: 768px) {
  #feedback-modal, #ai-chat-modal {
    width: 700px;
  }
}
#course-system-offer-modal {
  width: 700px;
}

#support-modal {
  padding-bottom: 24px;
  color: #777;
}

#support-modal .modal-hl {
  margin-bottom: 20px;
}

#support-modal .name-input,
#support-modal .email-input {
  margin-bottom: 20px;
}

#support-modal .input-email,
#support-modal .input-name {
  border: none;
  padding: 0 6px;
  font-size: 16px;
  color: #666;
  width: 100%;
}

.support-text {
  margin-top: 6px;
}

#support-modal textarea {
  color: #666;
}

@media only screen and (min-width: 768px) {
  #support-modal {
    width: 700px;
  }
  #support-modal .name-input,
  #support-modal .email-input {
    width: 325px;
    display: inline-block;
  }
  #support-modal .name-input {
    margin-right: 20px;
  }
}
.card-modal {
  width: 800px;
  margin-left: -400px;
}

.modal textarea {
  padding: 8px 12px;
  min-height: 104px;
}

.ajax-loader {
  position: relative;
  left: 50%;
  display: block;
}

/* PRINT CARDS MODAL */
#print-cards-modal #withoutPictures {
  margin-top: 24px;
}

/* CREATE TEST MODAL */
#create-test-modal .max-question-wrapper {
  margin: 16px 0;
}

#create-test-modal .max-question-wrapper input {
  margin-left: 4px;
}

#move-card-modal .target-cardset,
#move-cards-modal .target-cardset {
  margin: 4px 0;
  position: relative;
}

.input-c {
  padding-left: 30px;
}

.input-c .custom-checkbox {
  left: 0;
  padding-top: 0;
  top: 13px;
}

#change-card-position-modal .current-position {
  margin-right: 15px;
  margin-bottom: 15px;
  display: inline-block;
}

#change-card-position-modal .select-style {
  display: inline-block;
}

#change-card-position-modal select {
  font-size: 16px;
  padding-right: 50px;
}

#change-card-position-modal .target-position {
  display: inline-block;
}

@media only screen and (min-width: 768px) {
  #change-card-position-modal {
    width: 430px;
  }
}
#recommend-cardbox-modal .intro-text {
  margin-bottom: 24px;
}

.recommend-all-friends-container {
  margin: 8px 0 20px 2px;
}

#recommend-cardbox-modal textarea {
  margin-top: 4px;
  background: #eee;
}

#recommend-cardbox-modal textarea:hover {
  background: #f5f5f5;
}

#recommend-cardbox-modal textarea:focus {
  background: #fff;
}

#learn-options-modal .action-btn {
  float: none;
  margin: 20px auto 0px auto;
  display: block;
  width: 100%;
  height: 60px;
  font-size: 20px;
}

#learn-options-modal .learn-option {
  margin-top: 24px;
}

#learn-options-modal .learn-option > label {
  display: block;
  margin-bottom: 4px;
  padding-left: 2px;
}

#learn-options-modal .learn-option > label i {
  font-size: 17px;
}

#learn-options-modal .categories-list p {
  padding: 3px 0px 3px 23px;
  position: relative;
  color: #aaa;
}

#learn-options-modal .categories-list p:hover {
  color: #888;
}

#learn-options-modal .categories-list p.selected {
  color: #555;
}

#learn-options-modal .categories-list .fa {
  position: absolute;
  left: 2px;
  top: 8px;
  font-size: 14px;
}

#learn-options-modal .show-categories-btn {
  margin-bottom: 8px;
  margin-right: 9px;
}

#learn-options-modal .categories-selection {
  display: none;
}

#learn-options-modal .extras-options label {
  display: block;
  margin-bottom: 8px;
  color: #aaa;
  position: relative;
  padding-left: 23px;
}

#learn-options-modal .extras-options label:hover {
  color: #888;
}

#learn-options-modal .extras-options input {
  position: absolute;
  left: 2px;
  top: 2px;
}

#learn-options-modal .extras-options input#tags_tag {
  position: inherit;
}

#learn-options-modal .extras-options input:checked,
#learn-options-modal .extras-options input:checked + span {
  color: #555;
}

#learn-options-modal .cards-to-learn {
  float: left;
  font-size: 40px;
  margin: -8px 0 0 -3px;
  font-weight: 300;
}

@media only screen and (min-width: 768px) {
  #learn-options-modal {
    width: 460px;
  }
  #learn-options-modal .learn-option > label {
    width: 30%;
    float: left;
    padding-right: 20px;
    margin-bottom: 0;
    padding-left: 0;
  }
  #learn-options-modal .select-style {
    width: 70%;
    float: left;
    position: relative;
    top: -5px;
  }
  #learn-options-modal .categories {
    width: 70%;
    float: left;
  }
  #learn-options-modal .extras-options {
    width: 70%;
    float: left;
  }
}
#learn-options-modal .action-btn.bottom {
  display: none;
}

@media screen and (min-height: 861px) {
  #learn-options-modal .action-btn.bottom {
    display: block;
  }
  #learn-options-modal .action-btn.top {
    display: none;
  }
}
#multiple-new-cards-modal section {
  margin: 20px 0;
}

#multiple-new-cards-modal .mc-options-amount {
  display: none;
  padding-left: 18px;
  margin-top: 6px;
}

#multiple-new-cards-modal #mc-question:checked + label + .mc-options-amount {
  display: block;
}

.hoverbox {
  background-clip: padding-box;
  background-color: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.3);
  box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  overflow: auto;
  position: fixed;
  z-index: 1050;
  padding: 20px;
  display: none;
  text-align: center;
  margin-top: -300px;
  width: 720px;
  height: 560px;
  left: 50%;
  top: 50%;
  margin-left: -340px;
  display: none;
}

.modal .days-learned-text, .new-level-text {
  margin: 8px 0 12px;
}

.modal .days-learned-number, .new-level-number {
  font-size: 40px;
  color: #555;
  margin: 0 4px;
}

.modal a.action-btn,
.modal-action-btns a {
  display: inline-block;
}

@media only screen and (min-width: 768px) {
  #manage-categories-modal, #poll-modal {
    width: 700px;
  }
}
.page-container {
  width: 99%;
}

.page-container-inner {
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
}

.page-container.small {
  width: 100%;
}

.page-container {
  position: relative;
  margin: 0 auto;
}

.page-container-inner {
  position: relative;
}

footer .page-container {
  padding-left: 15px;
}

@media only screen and (min-width: 768px) {
  .page-container.small {
    width: 700px;
  }
}
@media only screen and (min-width: 1024px) {
  .page-container {
    width: 984px;
  }
  .page-container-inner {
    width: 984px;
    padding: 0;
  }
  footer .page-container {
    padding-left: 0;
  }
}
@media only screen and (min-width: 1340px) {
  .page-container.wide {
    width: 1280px;
  }
}
/*
    Created on : 26.06.2025, 15:22:16
    Author     : klaus
*/
.company-profile {
  margin-bottom: 6px;
  text-align: justify;
}

.company-profile,
.management {
  background: white;
  padding: 15px;
}

.company-profile .content-hl {
  margin-bottom: 20px;
  text-align: center;
}

.management .content-hl {
  margin-bottom: 40px;
  text-align: center;
}

.people {
  display: flex;
  flex-direction: column;
}

.team-user-container {
  flex: 1 1 auto;
  text-align: center;
  position: relative;
  margin-bottom: 50px;
}

.team-user-container .userpic {
  margin: 0 auto 15px;
  opacity: 1;
}

.team-user-container .username {
  font-size: 20px;
  margin-bottom: 2px;
  color: #555;
}

.team-user-container .function {
  font-size: 14px;
  color: #999;
  letter-spacing: 2px;
}

.team-user-container .email {
  font-size: 14px;
}

@media only screen and (min-width: 768px) {
  .company-profile {
    margin-bottom: 20px;
  }
  .people {
    flex-direction: row;
  }
  .company-profile,
  .management {
    background: white;
    width: 640px;
    padding: 30px;
    margin-left: auto;
    margin-right: auto;
  }
  .team-user-container {
    margin-bottom: 0;
  }
}
/* ACTIVITY BAR */
.activity-bar-content-wrapper {
  height: 100%;
}

.activity-bar-content {
  height: 100%;
}

.activity-bar .intro-text {
  margin-top: 20px;
  padding: 0 15px;
}

.activity-bar .intro-text .open-invite-modal-btn {
  margin-top: 6px;
  margin-bottom: 6px;
  display: block;
}

.activity-bar .comments {
  display: none;
  background: #fff;
  position: relative;
  padding: 15px 15px 15px;
  margin: 10px -15px -15px;
}

.activity-bar .comments .comment-textarea {
  margin-left: 38px;
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  height: 20px;
  width: 193px;
  margin-bottom: 12px;
}

.activity-bar .comments .comment-textarea::placeholder {
  color: #aaa;
}

.activity-bar .comments .comment-textarea:hover::placeholder {
  color: #777;
}

.activity-bar .comments .activity-text {
  padding-right: 0;
  color: rgba(0, 0, 0, 0.7);
}

.activity-bar .comments .activity-sub-info {
  margin-top: 0;
}

.activity-bar .comments .username {
  margin-right: 4px;
}

.activity-bar .comments .userpic {
  position: absolute;
}

.activity-bar .comments .comment {
  margin-bottom: 10px;
}

.activity-bar .comments .more-btn {
  margin-bottom: 5px;
  margin-left: 38px;
}

.activity {
  position: relative;
  font-size: 12px;
  padding: 15px;
}

.activity .userpic {
  position: absolute;
}

.activity-sub-info {
  margin-top: 6px;
}

.activity-text, .activity-sub-info {
  padding-left: 38px;
  padding-right: 38px;
}

.activity-timeago {
  margin-right: 10px;
}

.activity-likes {
  margin-right: 6px;
}

.activity-likes i {
  margin-right: 2px;
}

.activity-comments i {
  margin-right: 3px;
}

.activity-icons {
  position: absolute;
  top: 0;
  right: 0;
  width: 30px;
  height: 100%;
  text-align: center;
}

.activity-icons .fa {
  font-size: 26px;
}

.nicescroll-rails-vr {
  display: block !important;
}

.admin table,
.admin td,
.admin th {
  border: 1px solid #999;
}

.ad-banner-top-container {
  width: 728px;
  margin: 0px auto 40px;
  text-align: right;
}

.ad-banner-top {
  width: 728px;
  height: 90px;
  /* background: white; */
}

.ad-banner-side {
  width: 160px;
  height: 600px;
  /* background: white; */
}

.ads-bar {
  display: none;
}

@media only screen and (min-width: 1366px) {
  .ads-bar {
    display: block;
    width: 160px;
    position: absolute;
    right: -180px;
  }
}
.hide-ad-link {
  display: inline-block;
  margin-bottom: 4px;
}

#ai-chat-modal {
  max-height: 100%;
}

#ai-chat {
  display: flex;
  flex-direction: column;
  /* height: 500px; */
  /* border: 1px solid #ddd; */
  border-radius: 8px;
  overflow: hidden;
  font-family: Roboto;
  min-height: 300px;
  max-height: 400px;
}

#ai-output {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  /* background: #f9f9f9; */
}

.ai-bubble {
  max-width: 80%;
  padding: 10px 14px;
  border-radius: 12px;
  line-height: 1.5;
  word-break: break-word;
}

/* Markdown-Elemente innerhalb der Bubbles */
.ai-bubble p {
  margin: 0 0 8px 0;
}

.ai-bubble p:last-child {
  margin-bottom: 0;
}

.ai-bubble ul,
.ai-bubble ol {
  margin: 4px 0 8px 16px;
  padding: 0;
}

.ai-bubble li {
  margin-bottom: 2px;
}

.ai-bubble code {
  background: rgba(0, 0, 0, 0.08);
  padding: 1px 5px;
  border-radius: 3px;
  font-size: 0.9em;
}

.ai-bubble pre {
  background: rgba(0, 0, 0, 0.08);
  padding: 10px;
  border-radius: 6px;
  overflow-x: auto;
}

.ai-bubble pre code {
  background: none;
  padding: 0;
}

.ai-bubble h1,
.ai-bubble h2,
.ai-bubble h3 {
  margin: 8px 0 4px 0;
  font-size: 1em;
  font-weight: bold;
}

.ai-bubble strong {
  font-weight: bold;
}

.ai-bubble em {
  font-style: italic;
}

/* User-Bubble: rechts */
.ai-bubble-user {
  align-self: flex-end;
  background: #08b474;
  color: white;
  border-bottom-right-radius: 3px;
}

/* LLM-Bubble: links */
.ai-bubble-assistant {
  align-self: flex-start;
  background: #ffffff;
  color: #222;
  border: 1px solid #e0e0e0;
  border-bottom-left-radius: 3px;
}

/* Tipp-Indikator */
.ai-typing {
  align-self: flex-start;
  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 12px;
  border-bottom-left-radius: 3px;
  padding: 10px 16px;
  color: #999;
  font-style: italic;
  font-size: 0.9em;
}

#ai-input-row {
  display: flex;
  gap: 8px;
  padding: 10px;
  /* background: #fff;
  border-top: 1px solid #ddd; */
}

#ai-input {
  flex: 1;
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 6px;
  resize: none;
  font-family: inherit;
  font-size: 0.95em;
  min-height: fit-content;
}

#ai-send {
  padding: 8px 16px;
  background: #08b474;
  color: white;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.95em;
}

#ai-send:disabled {
  background: #aaa;
  cursor: not-allowed;
}

#ai-stop {
  display: none;
  padding: 8px 16px;
  background: #e74c3c;
  color: white;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.95em;
}

.ai-feedback-buttons {
    display: flex;
    gap: 6px;
    margin: 4px 0 8px 4px;
}

.ai-feedback-btn {
    background: none;
    border: 1px solid #ddd;
    border-radius: 20px;
    padding: 2px 10px;
    font-size: 0.85em;
    cursor: pointer;
    transition: all 0.15s;
    color: #666;
	margin-right: 5px;
}

.ai-feedback-btn:hover:not(:disabled) {
    background: #f0f0f0;
    border-color: #aaa;
}

.ui-autocomplete {
  position: relative;
  z-index: 64001;
  background-color: #fff;
}

.ui-autocomplete-input {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.9em;
  width: 100px;
}

div.tagsinput span.tag {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.9em;
}

div.tagsinput span.tag {
  border: 0px;
  background: #00B688;
  color: white;
}

div.tagsinput span.tag a {
  color: white;
}

.keyword-suggestions .ui-menu-item {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.9em;
  background-color: #fff;
  color: #000;
  padding-left: 10px;
  margin-left: 20px;
  cursor: pointer;
}

#keyword-suggestions-multiplecards-modal {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.9em;
}

div.tagsinput {
  border: 0px;
}

.rz {
  font-size: 14px;
  font-weight: bold;
  float: left;
  margin-right: 10px;
  left: -30px;
  position: absolute;
}

@media only screen and (max-width: 1024px) {
  .rz {
    left: 5px;
  }
}
.oso-content {
  font-family: Times;
}

.footnote-content {
  font-family: Times;
}

.oso-content ul {
  margin-left: 20px;
}

.footnoteReference {
  vertical-align: super;
  font-size: 0.7em;
  cursor: pointer;
}

.footnotes {
  margin-top: 10px;
}

.caps {
  font-variant: small-caps;
}

.bookFootnote {
  font-size: 0.7em;
  font-family: Times;
  display: none;
}

.bookFootnote p {
  display: inline;
}

.oso-reference {
  color: #5757c1;
  font-weight: bold;
}

.oso-content .gesetz-titel {
  font-weight: bold;
  font-size: 1.1em;
  margin-bottom: 10px;
}

.oso-content .paragraph-titel {
  font-weight: bold;
  margin-top: 10px;
  margin-bottom: 10px;
}

.oso-content .paragraph-absatz {
  margin-top: 10px;
}

.oso-content .absatz\.text {
  font-weight: bold;
}

.oso-content .delivery {
  margin-top: 10px;
  font-style: italic;
  text-align: right;
}

.oso-content .copyright {
  margin-top: 10px;
  text-align: right;
}

.oso-content .ovs div {
  margin-top: 10px;
}

.oso-content reference {
  font-weight: bold;
  color: #5757c1;
  cursor: pointer;
}

.oso-content .normenkette, .oso-content .vorinstanz {
  font-weight: bold;
}

#toc {
  position: fixed;
  left: 0;
  top: 0;
  background-color: #fff;
  margin-top: 50px;
  padding: 10px;
  filter: drop-shadow(4px 5px 7px #808080);
  z-index: 10;
  max-height: 85%;
  max-width: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
}

#toc #full {
  display: none;
}

#toc:hover #full {
  display: block; /* Show it on hover */
}

.card-set-legend .donut-chart-wrapper {
  flex: none;
}

.card-set-legend .donut-chart-container {
  position: relative;
}

.card-set-legend .kartensatz-block-prozent {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  margin-left: 2px;
}

.card-set-legend .ring-text {
  padding-left: 15px;
  line-height: 150%;
}

.card-set-legend .ring-text span {
  color: rgba(0, 0, 0, 0.5);
  padding: 0 6px;
  white-space: no-wrap;
}

.card-set-legend {
  float: left;
  background: #fff;
  margin-right: 20px;
  margin-bottom: 20px;
  padding: 15px 20px;
  position: relative;
  font-size: 14px;
}

.card-set-legend .close-btn {
  position: absolute;
  font-size: 22px;
  right: 20px;
  top: 20px;
  color: #ccc;
}

.card-set-legend .close-btn:hover {
  color: #999;
}

.card-set-legend .content-hl {
  margin-bottom: 15px;
}

.card-set-legend .legend-learn-btn {
  color: #08b474;
}

.card-set-legend section {
  margin-bottom: 26px;
}

.card-set-legend .btn-text {
  position: relative;
  margin-top: 16px;
  padding-left: 38px;
  min-height: 30px;
}

.card-set-legend .right-btn {
  position: absolute;
  left: 0;
  width: 30px;
  height: 30px;
  border: 2px solid #ddd;
  background: #fff;
  color: #ccc;
  font-size: 16px;
}

.card-set-legend .btn-text-container {
  position: relative;
  margin-top: 16px;
  padding-left: 70px;
  min-height: 62px;
}

.card-set-legend .btn-stack {
  position: absolute;
  width: 62px;
  left: 0;
}

.card-set-legend .btn-stack .right-btn {
  position: static;
  float: left;
}

.card-set-legend .learn-plan,
.card-set-legend .learn-favs {
  margin-right: 2px;
  margin-bottom: 2px;
}

.card-set-legend .cards-amount-text {
  margin-bottom: 10px;
}

.card-set-legend .cards-amount-text,
.card-set-legend .study-pals-amount-text {
  position: relative;
  padding-left: 88px;
}

.card-set-legend .cards-amount-text .fa,
.card-set-legend .study-pals-amount-text .fa {
  position: absolute;
  left: 0;
  font-size: 16px;
  color: #aaa;
}

.card-set-legend .cards-amount-text .amount,
.card-set-legend .study-pals-amount-text .amount {
  position: absolute;
  left: 26px;
  top: -2px;
  font-size: 16px;
  color: #aaa;
}

.card-set-legend .understood-btn {
  margin: 20px 0;
}

.firefox .card-set-legend section {
  margin-bottom: 20px;
}

.iexplorer .card-set-legend section {
  margin-bottom: 20px;
}

@media only screen and (min-width: 1024px) {
  .card-set-legend {
    height: 564px;
  }
  .card-set-legend.compact {
    height: auto;
    font-size: 16px;
  }
}
.card img {
  max-width: 100% !important;
  height: auto !important;
}

.correct-answer img {
  max-width: 100% !important;
  height: auto !important;
}

.card-top-row {
  padding-bottom: 10px;
  display: flex;
  align-items: flex-end;
}

.card-top-row .button-container {
  margin-left: auto;
  flex: none;
  display: flex;
  padding-left: 6px;
  color: #ccc;
}

.card-top-row .button-container:hover {
  color: #aaa;
}

.card-top-row .button-container button {
  font-size: 20px;
  margin-left: 8px;
}

.card-top-row .button-container button:hover {
  color: #777;
}

.card-top-row .button-container .favorite-btn.favorite,
.card-top-row .button-container .favorite-btn.favorite:hover {
  color: #FFBE15;
}

.card-top-row .deactivated-text .fa,
.card-top-row .deleted-text {
  margin-right: 4px;
}

.card-top-row .learn-headline-container {
  flex: 1 1 auto;
}

.card-top-row .learn-headline + .deactivated-text {
  margin-top: 8px;
}

.card-top-row .settings-container {
  display: none;
  position: absolute;
  right: 36px;
  top: 6px;
  width: 150px;
  padding: 6px 12px;
  background: #fff;
  font-size: 16px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  color: #999;
}

.card-top-row .settings-container p {
  padding: 3px 0;
}

.card-top-row .settings-container p:hover {
  color: #555;
}

.card-top-row .settings-container .fa {
  font-size: 18px;
  margin-right: 2px;
}

.show-panel-btn {
  display: none;
}

.edit-mode .show-panel-btn {
  display: block;
  color: #007356;
}

.edit-mode .show-panel-btn:hover {
  color: #00A279;
}

.bin {
  position: absolute;
  border-radius: 50%;
  top: 22px;
  left: 11px;
  width: 8px;
  height: 8px;
  z-index: 1;
}

.question ul,
.answer ul,
.correct-answer ul {
  padding-left: 30px;
}

.answer ul.mc-option-list {
  padding-left: 0;
}

.card.deactivated .question,
.card.deactivated .answer {
  opacity: 0.5;
}

.select-category-btn {
  display: none;
  margin-right: 4px;
}

.small-layout-btn,
.medium-layout-btn,
.wide-layout-btn {
  display: none;
}

.edit-mode .select-category-btn {
  display: inline;
}

.edit-mode .edit-btns-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.card-bottom-row {
  padding-top: 6px;
  margin-top: 10px;
}

.question-container {
  position: relative;
}

.question-text {
  position: relative;
}

.question-text,
.answer-text {
  padding: 12px 24px 12px 26px;
  float: none;
  height: auto;
  overflow: hidden;
  min-height: 43px;
  font-weight: normal;
}

.question .input {
  padding: 12px 20px 10px 24px;
}

.answer .input {
  padding: 12px 30px 10px 24px;
}

.card-top-text {
  font-size: 14px;
  padding: 12px 20px 0 24px;
  text-align: right;
}

.card-categories {
  font-style: italic;
}

.normal-question-btn {
  display: none;
  margin-right: 16px;
}

.multiple-choice-btn {
  display: none;
}

.select-style.select-position {
  height: 36px;
  display: inline-block;
  margin-left: 4px;
}

.select-position select {
  font-size: 16px;
  padding-top: 5px;
}

.select-position .fa-caret-down {
  top: 2px;
}

.edit-btns-container {
  display: none;
}

.answer-label,
.question-label,
.option-label {
  display: none;
}

.answer-label {
  position: absolute;
  padding: 12px 30px 10px 24px;
  z-index: 0;
}

.question-label {
  position: absolute;
  padding: 12px 20px 10px 24px;
  z-index: 0;
}

.card {
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif, "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-break: normal;
  word-break: break-word;
  overflow-wrap: break-word;
}

.card.one-line {
  position: relative;
  margin-bottom: 6px;
}

.card-wrapper .card.one-line {
  margin-bottom: 0;
}

.card.one-line .question,
.card.one-line .answer {
  position: relative;
}

.card.one-line .bin {
  top: 17px;
  width: 6px;
  height: 6px;
}

.card.one-line .question-text {
  padding-right: 20px;
  padding-left: 24px;
  font-size: 14px;
}

.card.one-line .answer-text {
  font-size: 14px;
}

.card.one-line .answer .fa-star {
  position: absolute;
  font-size: 18px;
  z-index: 1;
  right: 7px;
  top: 13px;
}

.card.one-line .favorite-btn {
  display: none;
}

@media only screen and (min-width: 768px) {
  .card.one-line {
    display: flex;
  }
  .card.one-line .question,
  .card.one-line .answer {
    flex: 1 0 auto;
    width: 0;
  }
  .card.one-line .favorite-btn {
    display: block;
  }
}
@media only screen and (min-width: 100px) {
  /*    .sortable {
          counter-reset: cardcounter;
      }

      .sortable .card:before {
          counter-increment: cardcounter;
          content: counter(cardcounter);
          position: absolute;
          left: -40px;
          top: 12px;
          font-size: 12px;
          width: 30px;
          text-align: right;
          color: #999;
      }

      .sortable .edit-multiple .card:before {
          left: -78px;
      }*/
  .cardnumber {
    position: absolute;
    left: -40px;
    top: 12px;
    font-size: 12px;
    width: 30px;
    text-align: right;
    color: #999;
  }
  .edit-multiple .cardnumber {
    left: -78px;
  }
}
.question-container .deactivated-text {
  display: none;
  color: #DB4646;
  margin-right: 12px;
  padding: 2px 6px;
}

.question-container .deleted-text {
  color: #DB4646;
  margin-right: 12px;
  padding: 2px 6px;
}

.question-container.deactivated .deactivated-text {
  display: block;
}

.view-card .card-amount-known, .learn-card .card-amount-known {
  position: relative;
  top: -2px;
  float: left;
  padding: 2px 1px;
  color: rgba(255, 255, 255, 0.75);
  margin-right: 12px;
  border-radius: 10px;
}

.card-amount-known.study-level {
  padding-left: 7px;
  padding-right: 5px;
}

.card-amount-known.card-last-not-known {
  color: rgba(255, 255, 255, 0.75);
  background: #DB4646;
  padding-left: 5px;
  padding-right: 5px;
}

.card-amount-known.card-last-known {
  color: rgba(255, 255, 255, 0.75);
  background: #23B18E;
  padding-left: 5px;
  padding-right: 5px;
}

.card-amount-known.card-last-partially-known {
  color: rgba(255, 255, 255, 0.75);
  background: #e79e3d;
  padding-left: 5px;
  padding-right: 5px;
}

.view-card .card-known, .learn-card .card-known {
  color: #00A279;
}

.view-card .card-partially-known, .learn-card .card-partially-known {
  color: #e79e3d;
}

.view-card .card-not-known, .learn-card .card-not-known {
  color: #DB4646;
}

.view-card .card-amount-known .fa, .learn-card .card-amount-known .fa {
  font-size: 14px;
  margin-right: 3px;
  position: relative;
  top: -1px;
}

.question-container .previous-card-btn,
.question-container .next-card-btn {
  display: none;
}

html:not(.smaller-than-1024px) .question-container.layout-control.medium .previous-card-btn,
html:not(.smaller-than-1024px) .question-container.layout-control.medium .next-card-btn {
  display: block;
}

html:not(.smaller-than-1024px) .action-btns .next-card-btn.medium,
html:not(.smaller-than-1024px) .action-btns .previous-card-btn.medium {
  display: none;
}

.new-card {
  margin-top: 0px;
  margin-bottom: 32px;
  position: relative;
  display: none;
}

.multiple-new-cards-container {
  display: none;
  counter-reset: newcardscounter;
}

.multiple-new-cards-container .new-card {
  display: block;
}

.multiple-new-cards-container .card + .card {
  margin-top: 6px;
}

.multiple-new-cards-container .remove-card-btn,
.multiple-new-cards-container .insert-card-btn {
  position: absolute;
  color: #999;
  left: -20px;
}

.multiple-new-cards-container .remove-card-btn:hover,
.multiple-new-cards-container .remove-card-btn:focus {
  color: #E95757;
}

.multiple-new-cards-container .insert-card-btn:hover,
.multiple-new-cards-container .insert-card-btn:focus {
  color: #555;
}

.multiple-new-cards-container .insert-card-btn {
  bottom: 2px;
}

.multiple-new-cards-container .remove-card-btn {
  top: 22px;
}

.multiple-new-cards-container .card:before {
  counter-increment: newcardscounter;
  content: counter(newcardscounter);
  position: absolute;
  left: -40px;
  top: 4px;
  font-size: 12px;
  width: 30px;
  text-align: right;
  color: #999;
}

html:not(.smaller-than-tablet) .layout-control.small .medium-layout-btn.size-up {
  display: block;
}

html:not(.smaller-than-tablet) .layout-control.small .question,
html:not(.smaller-than-tablet) .layout-control.small .answer {
  position: relative;
  float: left;
  width: 50%;
  height: auto !important;
  min-height: 41px;
}

html:not(.smaller-than-tablet) .layout-control.small .question-bg,
html:not(.smaller-than-tablet) .layout-control.small .answer-bg {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50%;
  z-index: 0;
  cursor: text;
}

html:not(.smaller-than-tablet) .layout-control.small .question-bg {
  left: 0;
}

html:not(.smaller-than-tablet) .layout-control.small .answer-bg {
  left: 50%;
}

html:not(.smaller-than-tablet) .layout-control.medium .small-layout-btn,
html:not(.smaller-than-tablet) .layout-control.medium .wide-layout-btn {
  display: block;
}

html:not(.smaller-than-tablet) .layout-control.wide .medium-layout-btn.size-down {
  display: block;
}

.layout-control .question-bg,
.layout-control .answer-bg {
  position: static;
  width: 100%;
}

.layout-control .question,
.layout-control .answer {
  float: none;
  width: 100%;
}

.layout-control .mchoice-answer-container .custom-checkbox {
  left: 24px;
}

.mc-option-list {
  display: none;
  list-style: none;
}

.mc-option-list > li {
  padding-top: 2px;
}

.mc .mc-option-list {
  display: block;
}

.mchoice-answer-container {
  display: none;
}

.answer .input.editable.mc-option-text {
  padding-left: 56px;
}

.mc-option-text p {
  margin: 0 !important;
}

.mchoice-answer-container {
  position: relative;
}

.mchoice-answer-container .custom-checkbox {
  z-index: 1;
  position: absolute;
  top: 11px;
  left: 12px;
}

.custom-checkbox > .box > .fa-check {
  display: none;
}

.custom-checkbox > input {
  z-index: 2;
  cursor: pointer;
  visibility: visible;
}

.custom-checkbox {
  top: 10px;
  left: 24px;
}

.choice-container {
  position: relative;
}

.option-label {
  position: absolute;
  padding: 12px 24px 10px 60px;
  z-index: 0;
}

.mc-option-text {
  padding: 8px 24px 8px 60px;
  overflow: hidden;
  padding-top: 14px;
}

.add-mchoice-option-btn {
  display: none;
  margin: 12px 0 12px 24px;
}

.remove-mchoice-option-btn {
  display: none;
  position: absolute;
  right: 13px;
  top: 13px;
}

.edit-mode .multiple-choice-btn,
.edit-mode .normal-question-btn {
  display: block;
}

.edit-mode .remove-mchoice-option-btn {
  display: block;
}

.edit-mode .mc .add-mchoice-option-btn {
  display: block;
}

.edit-mode .mc .mchoice-answer-container {
  display: block;
}

.edit-mode .mc-option-text {
  padding-right: 38px;
}

.light .lernen .answer .choice-container {
  padding-bottom: 10px;
}

.answer.mc {
  padding: 0;
}

.answer.mc > ul {
  list-style: none;
}

.answer.mc > ul > li {
  padding-top: 2px;
}

.custom-checkbox {
  position: absolute;
  display: block;
  padding-top: 2px;
  z-index: 1;
}

.custom-checkbox > .box {
  position: relative;
  display: block;
  width: 22px;
  height: 22px;
  background: transparent;
}

.custom-checkbox > .box > .fa-check {
  position: absolute;
  top: 3px;
  left: 3px;
  z-index: 0;
  font-size: 14px;
}

.custom-checkbox > .box > .fa-check {
  display: none;
}

.custom-checkbox > input:checked + .box > .fa-check {
  display: block;
}

.custom-checkbox > input {
  z-index: 1;
  visibility: visible;
  vertical-align: middle;
}

.learn-headline {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 14px;
  float: left;
}

.learn-headline .fa {
  font-size: 15px;
}

.learn-card .answer:not(.mc) {
  display: none;
}

.correct-answer {
  display: none;
  min-height: 41px;
  background: #eee;
  color: #666;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.edit-mode .correct-answer {
  display: block;
}

.learn-card .my-answer {
  font-size: 20px;
  padding: 12px 24px 12px 26px;
  font-family: inherit;
  background: transparent;
}

.learn-card .wrong .my-answer::placeholder {
  color: #DB4646;
}

.learn-card .correct .my-answer::placeholder {
  color: #00A279;
}

.learn-card .mc .my-answer {
  display: none;
}

.learn-card .active .choice-container {
  cursor: pointer;
}

.learn-card.edit-mode .choice-container {
  cursor: inherit;
}

.learn-card .custom-checkbox > input {
  z-index: 0;
}

.learn-card.edit-mode .custom-checkbox > input {
  z-index: 1;
}

.show-answer-btn,
.check-answer-btn,
.next-question-btn,
.knew-it-btn,
.half-known-btn,
.didnt-knew-it-btn,
.next-question-keep-result-btn,
.next-question-changeright-btn {
  margin-right: 2px;
}

.create-card-btn,
.save-edit-card-btn,
.show-answer-btn,
.check-answer-btn,
.next-question-btn,
.next-question-change-right-btn,
.knew-it-btn,
.half-known-btn,
.didnt-knew-it-btn {
  flex: 1;
}

.edit-mode .progression-btns-container {
  display: none;
}

.question-container.deactivated .learn-headline {
  float: none;
  margin-bottom: 8px;
}

.progression-btns-container {
  display: flex;
}

.progression-btns-container .btn {
  display: flex;
  align-items: center;
  justify-content: center;
}

.stop-learning-btn {
  margin-left: auto;
}

.set-position {
  order: -1;
  width: 100%;
  margin-bottom: 6px;
}

.create-card-btn {
  flex: 1;
  margin-right: 2px;
}

.cancel-create-card-btn,
.cancel-edit-card-btn {
  margin-left: auto;
}

.check-answer-btn,
.next-question-btn {
  position: fixed;
  backface-visibility: hidden;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 50px;
  z-index: 1;
}

.show-answer-btn,
.show-question-btn {
  position: fixed;
  backface-visibility: hidden;
  left: 0;
  bottom: 50px;
  width: 100%;
  height: 50px;
  z-index: 1;
}

.show-answer-btn {
  background: #007356;
}

.knew-it-btn,
.half-known-btn,
.didnt-knew-it-btn {
  position: fixed;
  backface-visibility: hidden;
  bottom: 0;
  width: 50%;
  height: 50px;
  z-index: 1;
}

.knew-it-btn {
  left: 0;
}

.didnt-knew-it-btn {
  left: 50%;
}

.next-question-btn .wrong-text {
  display: none;
}

.next-question-btn.red .wrong-text {
  display: inline;
}

.next-question-btn.red .correct-text {
  display: none;
}

@media only screen and (min-width: 768px) {
  .learn-headline {
    font-size: 20px;
  }
  .learn-headline .fa {
    font-size: 21px;
  }
  .learn-card .answer:not(.mc) {
    display: block;
  }
  .create-card-btn,
  .save-edit-card-btn,
  .show-answer-btn,
  .check-answer-btn,
  .next-question-btn,
  .next-question-change-right-btn {
    flex: none;
  }
  .show-answer-btn {
    background: #08b474;
  }
  .progression-btns-container .knew-it-btn,
  .progression-btns-container .half-known-btn,
  .progression-btns-container .didnt-knew-it-btn {
    display: none;
    flex: none;
  }
  .progression-btns-container .knew-it-btn.flex,
  .progression-btns-container .half-known-btn.flex,
  .progression-btns-container .didnt-knew-it-btn.flex {
    display: flex;
  }
  .set-position {
    order: inherit;
    width: auto;
    margin-bottom: 0;
    margin-left: 20px;
    align-items: center;
    justify-content: center;
  }
  .check-answer-btn,
  .next-question-btn,
  .show-answer-btn,
  .show-question-btn,
  .knew-it-btn,
  .half-known-btn,
  .didnt-knew-it-btn {
    position: static;
    width: auto;
    height: auto;
  }
  .progression-btns-container .show-question-btn {
    display: none;
  }
  .correct-answer {
    margin-top: 30px;
  }
}
.question-container.blanks-input .question-text {
  line-height: 1.5;
}

.question-container.blanks-input .question-text .blank {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  min-width: 100px;
  background: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  color: #555;
  padding: 4px 5px 1px;
  display: inline-block;
  line-height: 1;
}

.question-container.blanks-input .question-text .blank.correct {
  background: rgba(0, 162, 121, 0.15);
}

.question-container.blanks-input .question-text .blank.wrong {
  background: rgba(219, 70, 70, 0.15);
}

.question-container.blanks-input .question-text .blank.correction {
  min-width: inherit;
  background: #ddd;
  border-bottom: 1px solid #ddd;
}

.firefox .question-container.blanks-input .question-text .blank {
  height: 25px;
  vertical-align: middle;
  position: relative;
  top: -2px;
  padding: 2px 5px;
}

.iexplorer .question-container.blanks-input .question-text .blank {
  padding: 3px 5px;
}

.question-container.blanks-select .question-text {
  line-height: 1.5;
}

.question-container.blanks-select .question-text .blank {
  position: relative;
  width: 150px;
  background: #fff;
  font-size: inherit;
  color: #555;
  display: inline-block;
  line-height: 1;
  border-color: rgba(0, 0, 0, 0.2);
  vertical-align: top;
}

.question-container.blanks-select .question-text .blank i {
  z-index: 0;
  top: 4px;
  color: rgba(0, 0, 0, 0.2);
}

.question-container.blanks-select .question-text .blank select {
  position: relative;
  font-size: 20px;
  padding: 0;
  color: #555;
  background: transparent;
}

.question-container.blanks-select .question-text .blank select option {
  background: #fff;
}

.question-container.blanks-select .question-text .blank.select-style:hover {
  border-color: rgba(0, 0, 0, 0.4);
}

.question-container.blanks-select .question-text .blank.select-style:hover i {
  color: rgba(0, 0, 0, 0.4);
}

.question-container.blanks-select .question-text .blank.correct select {
  background: rgba(0, 162, 121, 0.15);
}

.question-container.blanks-select .question-text .blank.wrong select {
  background: rgba(219, 70, 70, 0.15);
}

.question-container.blanks-select .question-text .blank.correction {
  width: auto;
  background: #ddd;
  border-bottom: 1px solid #ddd;
  padding: 5px 4px 2px;
}

.firefox .question-container.blanks-select .question-text .blank select {
  height: 24px;
}

.firefox .question-container.blanks-select .question-text .blank.correction {
  padding: 3px 4px 2px;
}

.iexplorer .question-container.blanks-select .question-text .blank.select-style {
  vertical-align: inherit;
}

.iexplorer .question-container.blanks-select .question-text .blank.correction {
  padding: 3px 4px;
  position: relative;
  top: 2px;
}

.keywords-show {
  margin-top: 15px;
  margin-left: 5px;
  margin-right: 5px;
}

.categoryNames {
  font-size: 0.7em;
  padding: 5px;
  margin-left: 24px;
  display: inline;
  top: 5px;
  position: relative;
  border-radius: 10px;
  background: #eee;
  font-style: italic;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: clip;
}

#cardset-cards-content.tiles {
  display: grid;
  column-gap: 10px;
  row-gap: 6px;
}

@media only screen and (min-width: 768px) {
  #cardset-cards-content.tiles {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media only screen and (max-width: 768px) {
  #cardset-cards-content.tiles {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 497px) {
  #cardset-cards-content.tiles {
    grid-template-columns: repeat(1, 1fr);
  }
}
#cardset-cards-content.tiles .cardnumber.show-for-1024-up-inline {
  display: none !important;
}

#cardset-cards-content.tiles .card.one-line .answer {
  display: none;
}

#cardset-cards-content.tiles .question-text.ellipsis {
  white-space: normal;
}

#cardset-cards-content.tiles .card-wrapper .card.one-line {
  margin-bottom: 0px !important;
}

/*#cardset-cards-content.tiles .sortable .card-wrapper::before, .sortable .card-wrapper::after {
    content: '' !important;
}*/
#cardset-cards-content.compact .question-text, #cardset-cards-content.compact .answer-text {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.rating-star {
  cursor: pointer;
}

#cardUpdateAnnotationText ul {
  margin-left: 20px;
}

button {
  color: inherit;
}

.topbar {
  background: #007356;
}

.main-menu-mobile {
  background: #eee;
}

.main-menu-mobile a,
.main-menu-mobile button {
  color: #999;
}

.main-menu-mobile a:hover,
.main-menu-mobile a:focus,
.main-menu-mobile button:hover,
.main-menu-mobile button:focus {
  color: #333;
}

.main-menu-mobile a.active {
  color: #333;
}

.main-menu a,
.main-menu button,
.main-menu span {
  color: rgba(255, 255, 255, 0.5);
}

.main-menu a:hover,
.main-menu a:focus,
.main-menu button:hover,
.main-menu button:focus {
  color: rgba(255, 255, 255, 0.75);
  border-bottom: 2px solid rgba(255, 255, 255, 0.9);
}

.main-menu a.active {
  color: rgba(255, 255, 255, 0.9);
}

.btn {
  color: rgba(255, 255, 255, 0.75);
}

.popover-navigation .btn {
  color: #777;
}

.popover-navigation .btn:hover {
  color: #000;
}

.btn:not(.no-touch-hover):hover,
.btn.hover,
.btn:focus {
  color: rgb(255, 255, 255);
}

.btn.primary-color-light {
  background: #08b474;
}

.btn.half-known {
  background: #e79e3d;
  color: lightyellow !important;
}

.btn.cta {
  background: #ffa500;
  color: #666;
}

.btn.cta:not(.no-touch-hover):hover,
.btn.cta.hover,
.btn.cta:focus {
  color: #555;
}

.btn.primary-color-light:not(.no-touch-hover):hover,
.btn.primary-color-light.hover,
.btn.primary-color-light:focus {
  background: #00B688;
}

.btn.primary-color-dark {
  background: #007356;
}

.btn.primary-color-dark:not(.no-touch-hover):hover,
.btn.primary-color-dark.hover,
.btn.primary-color-dark:focus {
  background: #00A279;
}

.btn.red {
  background: #DB4646;
}

.btn.red:focus,
.btn.red:hover {
  background: #E95757 !important;
}

.btn.grey-light,
.mce-container button,
.mce-panel.mce-menu {
  background: #eee;
  color: #999;
}

.btn.grey-light:focus,
.btn.grey-light:hover,
.mce-container button:focus,
.mce-container button:hover {
  background: #f5f5f5;
  color: #777;
}

.btn.grey-light.active {
  background: #fff;
  color: #666;
}

.lernen .answer .choice-container.correct {
  color: rgb(0, 100.8, 75.2888888889);
  background: #61D3B6;
}

.lernen .answer .choice-container.wrong {
  color: rgb(113.8461538462, 22.1538461538, 22.1538461538);
  background: #FA8383;
}

.answer .favorite-btn.favorite,
.answer .favorite-btn.favorite:hover {
  color: #FFBE15 !important;
}

.dark body {
  background: #1F1F1F;
  color: #666;
}
.dark .fa-check {
  color: #007356;
}
.dark .secondary-menu .icon-bg {
  background: #00503C;
}
.dark .secondary-menu .icon-bg .fa {
  color: #4D8476;
}
.dark select {
  color: #555;
}
.dark .select-style {
  border: 1px solid #555;
}
.dark .select-style .fa-caret-down {
  color: #444;
}
.dark .notifications .divider, .dark .new-discussion-posts .divider {
  background: #333;
}
.dark .lp-today .bg {
  background: #555;
}
.dark .lp-today .weekday {
  color: #fff;
}
.dark .lernplan .card-quantity {
  color: #ddd;
}
.dark .lp-today .card-quantity {
  color: #fff;
}
.dark .lp-day .fa-times {
  color: #CA4A4A;
}
.dark .module-hl {
  color: #555;
}
.dark .button-area a, .dark .button-area button {
  color: #666;
}
.dark .progress-bar {
  background: #666;
}
.dark h6 {
  color: #BABABA;
}
.dark .page-nav a,
.dark .page-nav button {
  background: #292929;
}
.dark .page-nav a.active,
.dark .page-nav button.active {
  background: #3F3F3F;
  color: #999;
}
.dark .page-nav span {
  color: #777;
}
.dark.page-kartensatz .big-number {
  color: #ccc;
}
.dark .bg {
  background: #333;
}

.light body {
  background: #f3f3f3;
  color: #777;
}
.light textarea {
  color: #666;
}
.light input {
  background: #eee;
  color: #777;
}
.light input:hover {
  background: #f5f5f5;
}
.light input:focus {
  background: #fff;
}
.light input::placeholder {
  color: #bbb;
}
.light select {
  color: #888;
}
.light select:hover,
.light select:focus {
  color: #555;
}
.light .select-style {
  border: 1px solid #aaa;
}
.light .select-style:hover,
.light .select-style:focus {
  border: 1px solid #777;
}
.light .select-style .fa-caret-down {
  color: #888;
}
.light .select-style:hover .fa-caret-down,
.light .select-style:focus .fa-caret-down {
  color: #555;
}
.light .top-part .search-box .card-box-search-btn {
  color: #aaa;
}
.light .top-part .search-box .card-box-search-btn:hover, .light .top-part .search-box .card-box-search-btn:focus {
  color: #777;
  outline: none;
}
.light .top-part .search-box input::placeholder {
  color: #aaa;
}
.light .bright-link {
  color: #007356;
}
.light .bright-link:hover,
.light .bright-link:focus {
  color: #08b474;
}
.light .red-link {
  color: #DB4646;
}
.light .red-link:hover,
.light .red-link:focus {
  color: #E95757;
}
.light .card-type button.active[disabled],
.light button.active[disabled] {
  font-weight: 700;
  color: #555;
}
.light .editable a {
  color: #007356;
}
.light .editable a:hover, .light .editable a:focus {
  color: #08b474;
}
.light .page-headline {
  color: #666;
}
.light .activity.mastered {
  background: rgba(0, 162, 121, 0.15);
}
.light .activity.mastered .activity-icons .fa {
  color: #08b474;
}
.light .activity.pro-user {
  background: rgba(233, 198, 58, 0.15);
}
.light .activity.pro-user .activity-icons .fa {
  color: #E9C63A;
}
.light .activity-text {
  color: #777;
}
.light .activity a {
  color: #007356;
}
.light .activity a:hover {
  color: #08b474;
}
.light .activity .progress-bar {
  background: #ccc;
}
.light .activity .like-btn, .light .activity .comment-btn {
  color: rgba(0, 0, 0, 0.3);
}
.light .activity .comment-btn .fa {
  color: rgba(0, 0, 0, 0.25);
}
.light .activity .like-btn:hover, .light .activity .comment-btn:hover, .light .activity .like-btn.liked, .light .activity .comment-btn.commented {
  color: rgba(0, 0, 0, 0.6);
}
.light .activity .comment-btn:hover .fa, .light .activity .comment-btn.commented .fa {
  color: rgba(0, 0, 0, 0.5);
}
.light .activity-icons .fa {
  color: #ccc;
}
.light .activity-sub-info {
  color: #aaa;
}
.light .notifications .divider, .light .new-discussion-posts .divider {
  background: #ddd;
}
.light .notification.bg-link:hover, .light .new-discussion-posts .entry.bg-link:hover {
  background: #f2f2f2;
}
.light .notification.bg-link:hover .fa, .light .new-discussion-posts .entry.bg-link:hover .fa {
  color: #999;
}
.light .notification.turquoise {
  background: rgba(0, 162, 121, 0.15);
}
.light .notification.turquoise .notification-icons .fa {
  color: rgba(0, 162, 121, 0.6);
}
.light .notification.turquoise.bg-link:hover {
  background: rgba(0, 162, 121, 0.3);
}
.light .notification.turquoise.bg-link:hover .notification-icons .fa {
  color: #00a279;
}
.light .notification.yellow {
  background: rgba(233, 198, 58, 0.15);
}
.light .notification.yellow .notification-icons .fa {
  color: rgba(233, 198, 58, 0.6);
}
.light .notification.yellow.bg-link:hover {
  background: rgba(233, 198, 58, 0.3);
}
.light .notification.yellow.bg-link:hover .notification-icons .fa {
  color: #e9c63a;
}
.light .notification.red {
  background: rgba(219, 70, 70, 0.15);
}
.light .notification.red .notification-icons .fa {
  color: rgba(219, 70, 70, 0.6);
}
.light .notification.red.bg-link:hover {
  background: rgba(219, 70, 70, 0.3);
}
.light .notification.red.bg-link:hover .notification-icons .fa {
  color: #db4646;
}
.light .notification a {
  color: #007356;
}
.light .notification a.red {
  color: #DB4646;
}
.light .notification a.red:hover {
  color: #E95757;
}
.light .notification-text, .light .new-discussion-posts .entry .text {
  color: rgba(0, 0, 0, 0.5);
}
.light .new-discussion-posts .entry .text strong {
  color: #555;
}
.light .notice a, .light .notification a, .light .new-discussion-posts .entry a {
  color: #007356;
}
.light .notification a:hover, .light .new-discussion-posts .entry a:hover {
  color: #08b474;
}
.light .notification-icons .fa {
  color: #ccc;
}
.light .notification-sub-info {
  color: rgba(0, 0, 0, 0.3);
}
.light .intro .lp-day.past .bg {
  background: #eee;
}
.light .lernplan .intro-text {
  color: #08b474;
}
.light .learnplan-elements {
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}
.light .lp-day.past .bg {
  background: #fff;
}
.light .lp-day.future .bg {
  background: #eee;
}
.light .lp-today .bg {
  background: #fff;
}
.light .lp-today.completed .bg {
  background: rgb(230.3, 247.5, 241.1);
}
.light .lp-day .weekday {
  color: #AAA;
}
.light .lp-day.lp-today .weekday {
  color: rgba(0, 0, 0, 0.55);
}
.light .lernplan .past .card-quantity {
  color: #666;
}
.light .lernplan .future .card-quantity {
  color: #aaa;
}
.light .lp-today .card-quantity {
  color: #aaa;
}
.light .lp-today .card-quantity.started-learning {
  color: #666;
}
.light .lp-today.completed .cards-remaining {
  color: #08b474;
}
.light .lp-day .fa-times {
  color: #E95757;
}
.light .lp-day .fa-check {
  color: #08b474;
}
.light .module-hl {
  color: #555;
}
.light .kartensatz-block .bg:hover {
  background: #f2f2f2;
}
.light .kartensatz-block.compact .bg:hover .progress-bar {
  background: #08b474;
}
.light .button-area a,
.light .button-area button {
  color: #ccc;
}
.light .button-area a:hover,
.light .button-area button:hover,
.light .button-area button.active {
  background: #f2f2f2;
  color: #bbb;
}
.light .sub-info {
  color: #aaa;
}
.light .progress-bar {
  background: #08b474;
}
.light .card-categories {
  color: #999;
}
.light .question-label,
.light .answer-label,
.light .option-label {
  color: #aaa;
}
.light .question-text,
.light .answer-text,
.light .mc-option-text {
  color: #666;
}
.light .question, .light .question-bg {
  background: #fff;
}
.light .answer, .light .answer-bg {
  background: #eee;
}
.light .answer .favorite-btn,
.light .add-mchoice-option-btn,
.light .remove-mchoice-option-btn {
  color: #999;
}
.light .answer .favorite-btn:hover,
.light .answer .favorite-btn:focus,
.light .add-mchoice-option-btn:hover,
.light .add-mchoice-option-btn:focus,
.light .remove-mchoice-option-btn:hover,
.light .remove-mchoice-option-btn:focus {
  color: #666;
}
.light .normal-question-btn,
.light .multiple-choice-btn {
  color: #aaa;
}
.light .new-card .card:hover .question {
  background: #fff;
}
.light .new-card .card:hover .answer {
  background: #eee;
}
.light .new-card .close-btn {
  color: #bbb;
}
.light .new-card .close-btn:hover {
  color: #666;
}
.light .card.one-line:hover .answer {
  background: #e6e6e6;
}
.light .card.one-line:hover .question {
  background: #f2f2f2;
}
.light .page-nav a,
.light .page-nav button {
  background: #E9E9E9;
  color: #999;
}
.light .page-nav a:hover,
.light .page-nav button:hover {
  background: #f2f2f2;
}
.light .page-nav a.active,
.light .page-nav button.active {
  background: #fff;
  color: #666;
}
.light .page-nav span {
  color: #888;
}
.light .page-nav a.active span,
.light .page-nav button.active span {
  color: #555;
}
.light.page-kartensatz .big-number {
  color: #666;
}
.light .discussion-block:hover .bg, .light .discussion-block:hover .question {
  background: #f2f2f2;
}
.light .discussion-block .title {
  color: #666;
}
.light .discussion-block .sub-title a {
  color: #007356;
}
.light .discussion-block .sub-title a:hover {
  color: #08b474;
}
.light .lernen .question,
.light .lernen .answer {
  color: #666;
}
.light .answer.correct {
  background: #61D3B6;
}
.light .answer:not(.mc).wrong {
  background: #FA8383;
}
.light .learn-card.edit-mode .answer.correct,
.light .learn-card.edit-mode .answer-wrong {
  background: #eee;
}
.light .answer.correct .custom-checkbox > .box {
  border-color: rgba(0, 0, 0, 0.25);
}
.light .answer .custom-checkbox .box {
  color: rgba(0, 0, 0, 0.6);
}
.light .choice-container.correct .box,
.light .choice-container.wrong .box {
  border: 1px solid rgba(0, 0, 0, 0.4);
}
.light .choice-container.correct .box i,
.light .choice-container.wrong .box i {
  color: rgba(0, 0, 0, 0.5);
}
.light .learn-progress {
  color: #777;
}
.light .learn-progress .progress-bar,
.light .learn-progress .divider {
  background: #aaa;
}
.light .learn-headline {
  color: #999;
}
.light .didnt-knew-it-btn i {
  color: rgba(0, 0, 0, 0.25);
}
.light .learn-card .active .choice-container.hover,
.light .learn-card .active .choice-container.checked {
  background: #fafafa;
}
.light .learn-card.edit-mode .choice-container.hover,
.light .learn-card.edit-mode .choice-container.checked {
  background: transparent;
}
.light .learn-card.edit-mode .choice-container.wrong,
.light .learn-card.edit-mode .choice-container.correct {
  background: transparent;
}
.light .custom-checkbox > .box {
  border: 1px solid #aaa;
}
.light .correct-cards {
  color: #00A279;
}
.light .wrong-cards {
  color: #CA4A4A;
}
.light .partially-known-cards {
  color: #e79e3d;
}
.light .correct-cards-btn {
  background: #53CEAF;
}
.light .correct-cards-btn:hover {
  background: #23B18E;
}
.light .wrong-cards-btn {
  background: #FA8383;
}
.light .wrong-cards-btn:hover {
  background: #E95757;
}
.light #private-message-modal .messagedUser.active {
  background: rgba(8, 180, 116, 0.3);
}
.light .bg {
  background: #fff !important;
}
.light .col-new {
  background: #ccc;
}
.light .col-0 {
  background: #DB4646;
}
.light .col-1 {
  background: #E77C3D;
}
.light .col-2 {
  background: #E79E3D;
}
.light .col-3 {
  background: #E9C63A;
}
.light .col-4 {
  background: #A9B935;
}
.light .col-5 {
  background: #23B18E;
}
.light .bin-new {
  background: #ccc;
}
.light .bin-0 {
  background: #DB4646;
}
.light .bin-1 {
  background: #E77C3D;
}
.light .bin-2 {
  background: #E79E3D;
}
.light .bin-3 {
  background: #E9C63A;
}
.light .bin-4 {
  background: #A9B935;
}
.light .bin-5 {
  background: #23B18E;
}

.linkToComment {
  border-bottom: 1px dashed black;
  cursor: pointer;
}

.toolbox {
  height: 50px;
  border: 1px solid lightgrey;
  border-radius: 10px;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  position: fixed;
  top: 60px;
  left: 50%;
  width: 420px;
  margin-left: -210px;
  background: white;
}

.unselectable {
  -khtml-user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.button {
  padding: 5px;
  cursor: pointer;
  border-radius: 20px;
  float: left;
  margin: 10px;
  min-width: 20px;
  min-height: 20px;
  border: 1px solid gray;
  text-align: center;
}

.commentBox {
  position: fixed;
  top: 100px;
  height: 300px;
  border-radius: 10px;
  border: 1px solid lightgrey;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  background-color: white;
  left: 50%;
  width: 300px;
  margin-left: -150px;
}

.commentBox button {
  border: 1px solid #d7d7d7;
  border-radius: 10px;
  padding: 5px;
}

#commentEditorContent {
  width: 100%;
  padding: 10px;
  height: 100%;
  border: none;
  outline: none;
  resize: none;
  font-family: Times;
}

.spaceForComments {
  display: block;
}

.myComment {
  background: white;
  padding: 5px;
  margin-top: 10px;
  border-radius: 10px;
  color: blue;
  font-family: Times;
  border: 2px solid white;
  cursor: pointer;
}

.highlightedCommentReference {
  border-bottom: 2px solid blue;
}

.highlightedComment {
  border: 2px solid blue !important;
}

.coupon-input .coupon-code-input {
  flex: 1 1 0%;
  max-width: 250px;
}

.coupon-input .redeem-coupon-code-btn {
  flex: none;
}

/*
.darkmode {
    background: rgb(30, 30, 30) !important;
    min-height: 100%;
    filter: invert(95%) hue-rotate(180deg) brightness(110%) contrast(90%) !important;
    overflow: auto;
}

.darkmode .userpic, .darkmode .jquery-modal.blocker, .darkmode img, .darkmode .tour-backdrop, .darkmode iframe {
    filter: invert(100%) hue-rotate(180deg);
}
*/
.darkmode body {
  background: #333;
  color: #bbb;
}
.darkmode .page-nav a, .darkmode .page-nav button, .darkmode .bg, .darkmode .shortInfo, .darkmode .categoryNames, .darkmode .settings-container {
  background: #222;
}
.darkmode .page-nav a.active, .darkmode .page-nav button.active {
  background: #999;
  color: #222;
}
.darkmode img[src*=latex-] {
  filter: invert(100%) hue-rotate(180deg);
}
.darkmode .module-hl,
.darkmode .modal-hl,
.darkmode .discussion-hl,
.darkmode .profile-user-container .username,
.darkmode .easy-autocomplete input,
.darkmode .fa.recommended-cardbox-icon,
.darkmode .user-display:hover .username,
.darkmode .learn-card .my-answer,
.darkmode .mce-container,
.darkmode .mce-container *,
.darkmode .mce-widget,
.darkmode .mce-widget *,
.darkmode .mce-reset,
.darkmode .mce-menu-item,
.darkmode .mce-menu-item .mce-ico,
.darkmode .mce-menu-item .mce-text,
.darkmode div.tagsinput input {
  color: #bbb !important;
}
.darkmode .new-discussion-posts-header,
.darkmode .new-discussion-posts-content,
.darkmode .modal,
.darkmode .notifications-header,
.darkmode .notifications-content,
.darkmode .mce-panel,
.darkmode .mce-btn,
.darkmode .learnplan-elements,
.darkmode .settings-block,
.darkmode .kartensatz-block,
.darkmode .btn.grey-light,
.darkmode .mce-container button,
.darkmode .mce-panel.mce-menu,
.darkmode .select-style select,
.darkmode .sidebar,
.darkmode .stats-container,
.darkmode .user-menu,
.darkmode footer a,
.darkmode footer,
.darkmode .notice,
.darkmode .repetico-feature-table .row,
.darkmode .cardset-info .description,
.darkmode .repetico-advantages,
.darkmode .correct-answer,
.darkmode .card,
.darkmode .popover,
.darkmode .popover-title,
.darkmode .general-infos,
.darkmode .top-info .rights,
.darkmode .content-box,
.darkmode div.tagsinput,
.darkmode .keyword-suggestions .ui-widget-content,
.darkmode .sub-info .settings-container,
.darkmode .lp-bar,
.darkmode .featurecontainer,
.darkmode .topics .topic,
.darkmode .news-module {
  background: #222;
  color: #bbb;
  border: none;
}
.darkmode input, .darkmode option {
  background: #333;
  color: #bbb;
}
.darkmode .select-style {
  border-radius: 0px;
}
.darkmode .select-style select {
  background: #333;
  color: #bbb;
  border: 1px solid #bbb;
  border-radius: 20px;
}
.darkmode .bright-link {
  color: #08b474;
}
.darkmode .question-bg, .darkmode .question {
  background: #2a2a2a;
}
.darkmode .answer-bg, .darkmode .answer, .darkmode .discussion-post .user-info-box {
  background: #333;
}
.darkmode .card.deactivated .question {
  background: #444;
}
.darkmode .card.deactivated .answer {
  background: #555;
}
.darkmode .mce-ico, .darkmode .info-value {
  color: #ccc;
}
.darkmode .btn.correct-cards-btn {
  background: #009570;
}
.darkmode .btn.wrong-cards-btn {
  background: #9f3b3b;
}
.darkmode .learnplan-elements,
.darkmode .page-nav,
.darkmode .page-nav button,
.darkmode .card-top-row .settings-container,
.darkmode .card,
.darkmode .correct-answer,
.darkmode .discussion-post,
.darkmode .card-set-legend,
.darkmode .kartensatz-block,
.darkmode .discussion-block,
.darkmode .recommendation-label,
.darkmode .sub-info .settings-container,
.darkmode .top-btn-box .container,
.darkmode .general-infos,
.darkmode .top-info .rights,
.darkmode .cardset-info .description,
.darkmode .repetico-advantages,
.darkmode .content-box,
.darkmode .new-discussion-posts-header,
.darkmode .new-discussion-posts-content,
.darkmode .settings-block,
.darkmode .publishers-topic-cardsets .cardset,
.darkmode .topics .topic,
.darkmode .publishers .publisher,
.darkmode .sidebar,
.darkmode #statistik-content-container .stats-container,
.darkmode .repetico-feature-table,
.darkmode .downtime-warning,
.darkmode .user-menu,
.darkmode .notifications-header,
.darkmode .notifications-content,
.darkmode .modal,
.darkmode .mce-window,
.darkmode .news-module {
  box-shadow: 0px 0px 13px rgba(128, 128, 128, 0.4);
}
.darkmode .progress-bar {
  background: #bbb;
}
.darkmode .calendar .day {
  background: #000;
}
.darkmode .col-new {
  background: #4A4A4A;
}
.darkmode .col-0 {
  background: #9F3B3B;
}
.darkmode .col-1 {
  background: #AB5E31;
}
.darkmode .col-2 {
  background: #C98F30;
}
.darkmode .col-3 {
  background: #E6BF28;
}
.darkmode .col-4 {
  background: #8F9B3E;
}
.darkmode .col-5 {
  background: #009570;
}
.darkmode .bin-new {
  background: #4A4A4A;
}
.darkmode .bin-0 {
  background: #9F3B3B;
}
.darkmode .bin-1 {
  background: #AB5E31;
}
.darkmode .bin-2 {
  background: #C98F30;
}
.darkmode .bin-3 {
  background: #E6BF28;
}
.darkmode .bin-4 {
  background: #8F9B3E;
}
.darkmode .bin-5 {
  background: #009570;
}

.discussion-block {
  height: 126px;
  margin-bottom: 20px;
  position: relative;
  cursor: pointer;
}

.discussion-block:nth-child(odd) {
  margin-right: 20px;
}

.discussion-block .stats-area i {
  font-size: 60px;
  color: #ddd;
  position: absolute;
  left: 22px;
  top: 32px;
}

.discussion-block .text-area,
.discussion-block .sub-info {
  padding-left: 15px;
}

.discussion-block .title {
  font-size: 20px;
  line-height: 1.2;
  margin: 0;
  max-height: 48px;
  overflow: hidden;
  width: 100%;
}

.discussion-block .sub-title a {
  position: relative;
  z-index: 2;
}

.discussion-block .author,
.discussion-block .last-post {
  float: left;
}

.discussion-block .author {
  padding-right: 4px;
}

.discussion-block .fa.fa-search {
  color: #777;
}

.discussion-block.card-discussion .card {
  margin-bottom: 1px;
}

.discussion-block.card-discussion .bg {
  height: 84px;
}

.discussion-block.card-discussion .stats-area i {
  top: 12px;
}

.discussion-block.cardset-discussion .bg {
  height: 100%;
}

.discussion-block .bin {
  top: 12px;
}

.discussion-block .question {
  padding: 11px 20px 11px 24px;
}

@media only screen and (min-width: 768px) {
  .discussion-block .text-area,
  .discussion-block .sub-info {
    padding-left: 105px;
  }
}
.question-container + .discussion {
  margin-top: 50px;
}

.discussion .top-part {
  margin-bottom: 20px;
}

.discussion-hl {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 26px;
  color: #666;
}

.new-post-btn.top {
  position: absolute;
  right: 0;
  bottom: 2px;
}

.card-discussion .new-post-btn.top {
  top: -8px;
  bottom: inherit;
}

.new-post-btn.bottom {
  margin-top: 20px;
}

.discussion-post {
  display: flex;
  min-height: 91px;
  margin-bottom: 6px;
  position: relative;
  flex-direction: column;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.discussion-post .bg {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: -1;
}

.discussion-post img {
  max-width: 100%;
  height: auto;
}

.discussion-post .user-info-box {
  flex: none;
  display: flex;
  padding: 15px;
  background: #e9e9e9;
}

.discussion-post .content-box {
  flex: 1 1 auto;
  padding: 15px 15px 36px;
  box-shadow: none !important;
}

.new-discussion-post {
  display: none;
  margin-top: 20px;
}

.new-discussion-post .content-bg {
  background: #fff;
}

.new-discussion-post .content-box {
  padding: 0;
}

.new-discussion-post .input {
  padding: 15px;
  min-height: 91px;
}

.new-discussion-post .button-row {
  margin-top: 6px;
}

.user-info-box .userpic-link {
  flex: none;
  margin-right: 10px;
}

.user-info-box .userpic {
  width: 30px;
  height: 30px;
}

.user-info-text .username {
  margin-top: 4px;
  display: block;
}

.user-info-text {
  flex: 1 1 auto;
  width: 100%;
}

.post-date,
.post-time {
  font-size: 14px;
  color: #888;
}

.post-icon-bar {
  position: absolute;
  bottom: 10px;
  right: 15px;
}

.post-icon-bar button {
  float: right;
}

.post-icon-bar .fa-reply {
  font-size: 16px;
  color: #ddd;
}

.post-icon-bar .fa-pencil-square-o {
  font-size: 20px;
  color: #ccc;
  margin-right: 6px;
}

.post-icon-bar button:hover .fa-reply,
.post-icon-bar button:hover .fa-pencil-square-o {
  color: #777;
}

.discussion-post .content-box {
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}

@media only screen and (min-width: 768px) {
  .discussion-post {
    flex-direction: row;
  }
  .discussion-post .user-info-box {
    width: 264px;
  }
  .user-info-box .userpic {
    width: 60px;
    height: 60px;
  }
  .user-info-text .username {
    margin-top: 0;
  }
}
.discussion-modules {
  position: relative;
}

.editor-discussion-text {
  padding: 10px 15px;
  background: #eee;
  color: #777;
}

.editor-discussion-text:hover {
  background: #f5f5f5;
}

.editor-discussion-text:focus {
  background: #fff;
}

.create-discussion-form-wrapper {
  display: none;
}

.create-new-discussion-btn {
  width: 100%;
  margin-bottom: 6px;
}

@media only screen and (min-width: 768px) {
  .create-new-discussion-btn {
    width: auto;
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 1024px) {
  .discussion-modules {
    margin-right: -20px;
  }
}
.page-freunde .button-row .open-invite-modal-btn {
  margin-right: 15px;
}

.page-freunde .search-box .search-input {
  width: 278px;
}

.no-friends {
  width: 600px;
  margin-left: 8px;
}

.no-friends .btn {
  float: none;
  display: inline-block;
  margin: 0 4px;
}

.no-friends .search-input {
  float: none;
  margin-left: 4px;
  position: relative;
}

.no-friends .friend-search-btn {
  margin-left: 0;
}

.no-friends .search-box {
  display: inline-block;
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
}

.intro-text .search-box {
  margin-top: 6px;
}

.intro-text .search-input {
  background: white;
}

.content-hl.cardsets-friends {
  margin-top: 20px;
  margin-bottom: 10px;
}

.page-kartensaetze .manage-folders-btn {
  float: left;
  position: relative;
  margin-top: 8px;
  margin-left: 12px;
}

.page-kartensaetze nav.folder-btns button {
  float: left;
  margin-right: 2px;
  margin-bottom: 2px;
}

@media only screen and (min-width: 1024px) {
  .card-set-modules {
    margin-right: -20px;
  }
}
.compact-cardsets-btn,
.expand-cardsets-btn {
  margin-right: 20px;
  font-size: 20px;
}

.compact-cardsets-btn:hover,
.expand-cardsets-btn:hover {
  color: #444;
}

@media only screen and (min-width: 768px) {
  .compact-cardsets-btn,
  .expand-cardsets-btn {
    font-size: 16px;
  }
}
.card-set-legend,
.kartensatz-block,
.discussion-block {
  width: 100%;
  margin-bottom: 6px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.kartensatz-block.kartensatz-block-mini {
  font-size: 0.9em;
  width: 364px;
  max-width: 85%;
}

.card-set-legend + .kartensatz-block.recommendation,
.kartensatz-block + .kartensatz-block.recommendation {
  margin-top: 20px;
}

.kartensatz-block {
  height: 126px;
  position: relative;
}

.kartensatz-block canvas {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -40px;
  margin-left: -41px;
}

.stats-area {
  width: 105px;
  position: absolute;
}

.text-area {
  width: 100%;
  overflow: hidden;
  padding: 15px 15px 15px 105px;
}

.sub-info .learn-btn {
  font-size: 20px;
  position: relative;
  z-index: 2;
  margin-left: auto;
}

.sub-info .settings-btn-container {
  margin-left: 10px;
}

.sub-info .settings-btn {
  position: relative;
  z-index: 2;
}

.sub-info .settings-btn:hover {
  color: #666;
}

.sub-info .shop-btn {
  font-size: 20px;
  margin-left: auto;
}

.sub-info .colearners {
  display: none;
}

.progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 4px;
}

.kartensatz-block .title {
  font-size: 20px;
  line-height: 1.2;
  margin: 0;
  max-height: 48px;
  overflow: hidden;
  width: 100%;
}

.sub-title {
  display: none;
}

.card-set-module-compact .sub-info {
  padding: 0 15px 0 20px;
}

.sub-info {
  display: flex;
  align-items: center;
  position: absolute;
  left: 0;
  bottom: 10px;
  padding: 0 15px 0 105px;
  width: 100%;
  height: 30px;
}

.sub-info i + span {
  margin-left: 6px;
}

.sub-info div + div {
  margin-left: 8px;
}

.sub-info .userpic {
  position: relative;
  vertical-align: middle;
  display: inline-block;
  top: -2px;
  z-index: 2;
}

.content-area > div {
  position: relative;
}

.bg-link-a {
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.recommendation .fa-user {
  display: none;
}

.recommendation .learner-quantity {
  display: none;
}

.recommendation-label {
  position: absolute;
  top: -10px;
  left: 8px;
  padding: 3px 8px 4px;
  background: #08b474;
  z-index: 2;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.8);
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.close-recommendation-btn {
  color: inherit;
  background: rgba(0, 0, 0, 0.1);
  padding: 3px 7px 4px;
  margin: -3px -8px -4px 4px;
}

.close-recommendation-btn:hover {
  color: rgb(255, 255, 255);
  background: rgba(0, 0, 0, 0.2);
  padding: 3px 7px 4px;
  margin: -3px -8px -4px 4px;
}

.fa.recommended-cardbox-icon {
  position: absolute;
  font-size: 70px;
  color: rgba(0, 0, 0, 0.2);
  left: 17px;
  top: 30px;
}

.fa.buy-repetico-courses-icon {
  position: absolute;
  font-size: 70px;
  left: 17px;
  top: 30px;
}

.kartensatz-block-prozent {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 18px;
  color: #aaa;
}

.kartensatz-block-prozent .percentsign {
  font-size: 14px;
}

.kartensatz-block-prozent:hover {
  color: #aaa;
}

.kartensatz-block.compact {
  height: 41px;
  width: 100%;
  margin-bottom: 6px;
}

.kartensatz-block.compact + .kartensatz-block.recommendation {
  margin-top: 24px;
}

.kartensatz-block.compact .stats-area {
  display: none;
}

.kartensatz-block.compact .text-area {
  width: 100%;
  padding: 11px 44px 11px 15px;
}

.kartensatz-block.compact .sub-info .learn-btn,
.kartensatz-block.compact .sub-info .shop-btn {
  top: 50%;
  transform: translateY(-50%);
}

.kartensatz-block.compact .sub-info .learn-btn {
  color: #ccc;
}

.kartensatz-block.compact .sub-info .learn-btn:hover {
  color: #08b474;
}

.kartensatz-block.compact .title {
  font-size: 16px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.kartensatz-block .progress-area {
  display: none;
}

.kartensatz-block.compact .progress-area {
  display: block;
}

.kartensatz-block.compact .progress-bar {
  height: 2px;
}

.kartensatz-block.compact .sub-title,
.kartensatz-block.compact .sub-info .wrapper,
.kartensatz-block.compact .sub-info .colearners,
.kartensatz-block.compact .sub-info .settings-btn-container {
  color: #999;
  display: none;
}

.kartensatz-block.compact .recommendation-label {
  top: -16px;
}

@media only screen and (min-width: 768px) {
  .sub-info .shop-btn,
  .sub-info .learn-btn {
    font-size: 16px;
  }
  .sub-info .learn-btn {
    top: -2px;
  }
  .sub-title {
    display: block;
    font-size: 12px;
    width: 100%;
    margin: 0;
  }
  .sub-info .colearners {
    display: block;
  }
  .colearners span + a {
    margin-left: 8px;
  }
}
@media only screen and (min-width: 1024px) {
  .card-set-legend,
  .kartensatz-block,
  .discussion-block {
    width: 482px;
    margin-right: 20px;
    margin-bottom: 20px;
  }
  .card-set-legend + .kartensatz-block.recommendation,
  .kartensatz-block + .kartensatz-block.recommendation {
    margin-top: 0;
  }
  .card-set-legend.compact,
  .kartensatz-block.compact {
    width: calc(100% - 20px);
  }
}
/*
.content-module .select-style {
    width: 28px;
}
*/
.content-module .select-style .fa {
  top: 50%;
  left: 50%;
  right: inherit;
  transform: translate(-50%, -50%);
  padding: 0;
  height: auto;
}

.content-module .select-style .fa-archive {
  margin-left: -1px;
}

.content-module .select-style .fa-sort {
  margin-left: 1px;
}

.sub-info .settings-container {
  position: absolute;
  right: 0;
  bottom: 35px;
  width: 280px;
  display: none;
  padding-top: 0;
  background: white;
  z-index: 3;
  padding: 8px 6px 6px 4px;
  min-height: 100%;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.sub-info .settings-container p {
  position: relative;
  line-height: 20px;
  padding: 6px 12px 6px 30px;
  color: #999;
}

.sub-info .settings-container p i {
  position: absolute;
  left: 9px;
  top: 8px;
  font-size: 14px;
}

.sub-info .settings-container p:hover {
  color: #777;
}

.sub-info .settings-container .fa-ban {
  left: 12px;
}

.sub-info .settings-container .fa-bolt {
  left: 15px;
}

.targetDate {
  background-color: #069f65;
  color: white;
  font-size: 0.8em;
  float: right;
  top: 0px;
  position: absolute;
  right: 0px;
  border-radius: 10px;
  padding-left: 5px;
  padding-right: 5px;
  font-weight: bold;
  border-top-left-radius: 0px;
  border-bottom-right-radius: 0px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 10px;
}

.page-headline-container .deactivated-text {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  margin-left: -30px;
  color: #DB4646;
}

.page-headline-container .more-cardsets-link {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  margin-left: -30px;
}

.top-btn-box .cardset-price {
  margin: 8px;
}

.learnplan-info {
  margin-top: 4px;
}

.learnplan-info .fa-calendar {
  position: relative;
  top: 7px;
  margin-right: 6px;
}

.learnplan-info .fa-list-alt {
  position: relative;
  top: 9px;
  margin-right: 6px;
}

.learnplan-info span {
  position: relative;
  top: 8px;
}

.learnplan-info .fa {
  margin-left: 10px;
}

.edit-cardset-title-btn {
  font-size: 16px;
  margin-left: -30px;
  margin-right: 16px;
}

.edit-cardset-title-btn .fa {
  position: static;
}

.recommend-cardbox-btn {
  font-size: 16px;
}

.recommend-cardbox-btn .fa {
  position: static;
}

.page-nav {
  display: flex;
  margin-bottom: 30px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  border-radius: 15px;
}

.page-nav a,
.page-nav button {
  flex: 1 0 auto;
  max-width: 16.66%;
  text-align: center;
  padding: 15px 0 10px;
}

.page-nav a:last-child,
.page-nav button:last-child {
  margin-right: 0;
}

.page-nav i {
  font-size: 24px;
}

.page-nav p {
  font-size: 14px;
}

.page-nav i + p {
  margin-top: 4px;
}

@media only screen and (min-width: 400px) {
  .page-nav i {
    font-size: 32px;
  }
}
.application-btns .retract-application-for-learning-btn {
  display: none;
}

.application-btns.applied .apply-for-learning-btn {
  display: none;
}

.application-btns.applied .retract-application-for-learning-btn {
  display: block;
}

.top-btn-box form {
  float: left;
}

.top-btn-box .btn + form {
  margin-left: 2px;
}

.top-btn-box .container {
  position: absolute;
  background: white;
  z-index: 3;
  padding: 8px 6px 6px 4px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  top: 100%;
  left: 0;
  margin-top: -4px;
}

.top-btn-box div p {
  position: relative;
  padding: 3px 12px 3px 30px;
  /* color: rgba(255, 255, 255, .6); */
}

.top-btn-box div p i {
  position: absolute;
}

.top-btn-box div p:hover {
  /* color: rgba(255, 255, 255, .8); */
}

.top-btn-box div p.active,
.top-btn-box div p.selected {
  /* color: rgba(255, 255, 255, 1); */
}

.learn-options-btn.active {
  /* color: white;
  background: $primaryColor-light !important; */
  position: relative;
  z-index: 4;
}

.learn-options-btn.active:after {
  content: "";
  /* background: $primaryColor-light !important; */
  position: absolute;
  width: 100%;
  height: 2px;
  top: 100%;
  left: 0;
  z-index: 4;
}

.top-btn-box .settings-container {
  width: 280px;
  display: none;
  overflow-y: auto;
}

.top-btn-box .settings-container .fa-circle {
  font-size: 10px;
  top: 10px;
  left: 12px;
  display: none;
}

.top-btn-box div.settings-container p {
  line-height: 20px;
  padding: 6px 12px 6px 30px;
}

.top-btn-box .settings-container p i {
  left: 9px;
  top: 8px;
  font-size: 14px;
}

.top-btn-box .button-row form button {
  margin-bottom: 0;
}

.top-btn-box a.btn {
  line-height: 19px;
}

.cardset-info ul, .cardset-info ol {
  margin: anchor-size;
}

.cardset-info .publisher-logo {
  min-height: 44px;
  margin: 30px 0 20px;
}

.cardset-info .start-info {
  margin-bottom: 20px;
}

.general-infos {
  background: white;
  padding: 20px;
  margin-bottom: 6px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.top-info .content-hl,
.description .content-hl {
  margin-bottom: 20px;
}

.top-info .rights {
  background: white;
  padding: 20px;
  margin-bottom: 6px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.info-row {
  margin-bottom: 10px;
}

.top-info .info-row .info-label,
.top-info .info-row .info-value {
  width: 100%;
}

.info-label {
  position: relative;
  padding-left: 24px;
}

.info-label .fa {
  position: absolute;
  left: 0;
  top: 2px;
  color: #888;
}

.info-label .fa-asterisk {
  left: 1px;
}

.info-label .fa-user {
  left: 2px;
}

.info-label .fa-calendar {
  left: 1px;
}

.info-value {
  font-weight: 700;
  color: #555;
  padding-left: 24px;
}

.info-value .fa {
  margin-right: 2px;
}

.info-value .open-invite-modal-btn {
  margin-left: 6px;
}

.top-info .rights .select-style {
  position: relative;
  overflow: hidden;
  display: none;
  margin-left: 24px;
}

.cardset-info .description {
  background: white;
  padding: 20px 20px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.cardset-info .description * {
  max-width: 100%;
  height: auto;
}

.cardset-info .description .wrapper {
  max-width: 660px;
}

.edit-cardset-description-btn {
  margin-top: 12px;
}

.cardset-info .description .btn-container {
  display: flex;
}

.save-edit-description-btn {
  display: none;
  margin-top: 12px;
}

.cancel-edit-description-btn {
  display: none;
  margin-top: 12px;
  margin-left: auto;
}

.page-headline.input:focus {
  outline: none;
}

.hide-cardset-rights-btn {
  display: none;
}

.cardset-info .description-text ul {
  margin-left: 20px;
}

.merchant-faq li {
  margin-top: 10px;
}

.repetico-advantages {
  display: none;
  padding: 20px;
  float: right;
  width: 300px;
  background: #e9e9e9;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.call-to-action-text {
  margin-top: 50px;
}

.call-to-action-text form {
  display: inline-block;
}

.call-to-action-text .btn {
  float: none;
  display: inline-block;
  margin: 0 6px 6px 0;
}

.call-to-action-text form .btn {
  display: inline-block;
}

.call-to-action-text .or {
  margin-right: 6px;
}

.cardset-price {
  margin-top: 12px;
}

@media only screen and (min-width: 550px) {
  .top-info .info-row .info-label,
  .top-info .info-row .info-value {
    width: 50%;
    float: left;
  }
  .info-value {
    padding-left: 18px;
  }
  .top-info .rights .select-style {
    width: calc(50% - 18px);
    margin-left: 18px;
    float: left;
  }
}
@media only screen and (min-width: 768px) {
  .top-info {
    display: flex;
  }
  .general-infos {
    width: 482px;
    margin-right: 20px;
    margin-bottom: 20px;
    padding: 20px 30px;
  }
  .top-info .rights {
    width: 482px;
    margin-bottom: 20px;
    padding: 20px 30px;
  }
  .top-info .info-row .info-label,
  .top-info .info-row .info-value {
    width: 100%;
  }
  .info-value {
    padding-left: 24px;
  }
  .top-info .rights .select-style {
    width: auto;
    float: none;
    margin-left: 24px;
  }
  .cardset-info .description {
    padding: 20px 30px;
  }
}
@media only screen and (min-width: 1024px) {
  .top-info .info-row .info-label,
  .top-info .info-row .info-value {
    width: 50%;
    float: left;
  }
  .info-value {
    padding-left: 18px;
  }
  .top-info .rights .select-style {
    width: calc(50% - 18px);
    margin-left: 18px;
    float: left;
  }
  .cardset-info .description.alt {
    width: 660px;
  }
  .repetico-advantages {
    display: block;
  }
}
.kartensatz-karte .top-part .action-btns {
  width: 100%;
}

.question-container .previous-card-btn,
.question-container .next-card-btn {
  position: absolute;
  font-size: 80px;
  top: 70px;
  color: #ccc;
}

.question-container .previous-card-btn:hover,
.question-container .next-card-btn:hover {
  color: #999;
}

.previous-card-btn.big {
  left: -142px;
}

.next-card-btn.big {
  right: -142px;
}

.card-navigation {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  margin-left: auto;
}

.card-navigation .previous-card-btn,
.card-navigation .next-card-btn {
  margin-right: 0;
}

.card-navigation .card-position {
  margin: 0 16px 10px 17px;
}

.card-navigation a {
  color: #bbb;
  font-size: 32px;
  position: relative;
  top: 1px;
}

.card-navigation a:focus,
.card-navigation a:hover {
  color: #777;
}

@media only screen and (min-width: 768px) {
  .kartensatz-karte .top-part .action-btns {
    margin-top: -8px;
  }
}
@media only screen and (min-width: 1024px) {
  .kartensatz-karte .top-part {
    margin-bottom: 10px;
  }
  .kartensatz-karte .top-part .action-btns {
    margin-top: 0;
  }
}
.card-tts-button {
  cursor: pointer;
  top: 10px;
  right: 10px;
  float: right;
  padding: 5px;
}

#select-category-modal {
  width: 700px;
}

.sample-cards-intro-text {
  margin: 30px 0;
}

.sample-cards-intro-text .btn {
  float: none;
  display: inline-block;
  margin: 0 6px;
}

.top-part {
  display: flex;
}

.top-part .select-container {
  margin-right: 8px;
}

.top-part label {
  margin-bottom: 4px;
  margin-left: 6px;
  font-size: 14px;
  color: #999;
}

.top-part label .fa {
  margin-right: 4px;
}

.top-part .select-style {
  position: relative;
  margin-top: 6px;
  width: 190px;
  overflow: hidden;
}

.top-part .search-box {
  position: relative;
  flex: 1 1 auto;
  max-width: 190px;
  margin-left: auto;
}

.top-part .search-box input {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 22px;
  width: 100%;
  height: auto;
  border: none;
  box-shadow: none;
  background-image: none;
  -webkit-appearance: none;
}

.edit-multiple-cards-btns-container {
  display: none;
}

.kartensatz-selected-cards-quantity {
  display: none;
}

.top-part .cardset-cards-select-form {
  display: none;
}

.menu-light-bg .cardset-cards-select-form {
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.menu-light-bg .cardset-cards-select-form .select-container {
  position: relative;
  margin-bottom: 15px;
  width: 100%;
  max-width: 300px;
  background: #f5f5f5;
}

.menu-light-bg .cardset-cards-select-form label {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
}

.menu-light-bg .cardset-cards-select-form .select-style {
  height: auto;
  border-color: #ccc;
}

.menu-light-bg .cardset-cards-select-form select {
  padding: 10px 20px 10px 32px;
  font-size: 16px;
}

.menu-light-bg .select-style .fa {
  top: 50%;
  right: 10px;
  padding: 0;
  height: auto;
  transform: translateY(-50%);
}

@media only screen and (max-height: 479px) {
  .menu-light-bg .cardset-cards-select-form {
    padding: 10px 20px;
  }
  .menu-light-bg .cardset-cards-select-form .select-container {
    margin-bottom: 8px;
  }
}
@media only screen and (min-width: 1024px) {
  .top-part .cardset-cards-select-form {
    display: flex;
  }
  .top-part .search-box {
    margin-left: 0;
  }
  .top-part .search-box input {
    height: 33px;
    font-size: 14px;
  }
  .page-kartensatz .top-part {
    margin-bottom: 20px;
  }
  .page-kartensatz .big-number {
    align-self: flex-end;
    line-height: 0.7;
  }
  .top-part .cardset-cards-select-form .select-container,
  .top-part .search-box {
    align-self: flex-end;
  }
}
.page-kartensatz .explanation {
  margin-top: 20px;
}

.page-kartensatz .explanation .btn {
  float: none;
  margin-left: 4px;
}

.card-wrapper {
  position: relative;
  padding: 3px 0;
}

.card-wrapper.edit-multiple-toolbar {
  display: none;
  height: 47px;
}

.card-wrapper.edit-multiple-toolbar .select-multiple {
  display: block;
}

.card-wrapper.edit-multiple-toolbar .custom-checkbox {
  width: auto;
  cursor: pointer;
  z-index: 10;
}

.card-wrapper.edit-multiple-toolbar .custom-checkbox:hover label {
  color: #444;
}

.card-wrapper.edit-multiple-toolbar .custom-checkbox:hover .fa-minus {
  color: #777;
}

.card-wrapper.edit-multiple-toolbar .box {
  float: left;
  left: 0 !important;
  margin: 0 10px;
}

.card-wrapper.edit-multiple-toolbar .fa-minus {
  display: none;
  position: absolute;
  top: 4px;
  left: 5px;
  z-index: 0;
  font-size: 13px;
}

.card-wrapper.edit-multiple-toolbar label {
  float: left;
  position: relative;
  top: 13px;
  cursor: pointer;
}

.card-wrapper .hover-layer {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.card-wrapper.edit-multiple .hover-layer {
  display: block;
}

.card-wrapper .hover-layer.selected {
  background: rgba(8, 180, 116, 0.15);
}

.card-wrapper .hover-layer.hover {
  background: rgba(8, 180, 116, 0.3);
}

.card-wrapper .select-multiple {
  display: none;
  padding-top: 0;
  left: 10px;
  top: 10px;
  width: 20px;
  height: 20px;
}

.card-wrapper .select-multiple input {
  top: 0;
  width: 100%;
  height: 100%;
}

.card-wrapper .select-multiple .box {
  top: 12px;
  left: 0px;
  margin-left: 0px;
}

.card-wrapper .select-multiple:hover .box {
  border-color: #777;
}

.custom-checkbox.select-all-checkbox {
  position: relative;
  left: 10px;
  top: 0;
  padding-top: 0;
  width: 22px;
  height: 22px;
  margin-bottom: 3px;
}

.custom-checkbox.select-all-checkbox input {
  top: 0;
  width: 100px;
  height: 100%;
}

.custom-checkbox.select-all-checkbox:hover .box {
  border-color: #777;
}

.layout-btns {
  position: absolute;
  top: -30px;
  right: 0;
}

.layout-btns button {
  float: left;
  margin-left: 18px;
}

.add-category-btn {
  position: relative;
  left: 2px;
  top: 8px;
}

.done-managing-categories-btn {
  margin-top: 28px;
}

.cancel-edit-multiple-cards-btn {
  position: absolute;
  right: 3px;
  bottom: 4px;
}

#multiple-cards-select-categories-modal {
  width: 430px;
  margin-left: -215px;
}

#multiple-cards-select-categories-modal .category-wrapper {
  position: relative;
  height: 41px;
  margin: 4px 0;
}

#multiple-cards-select-categories-modal .custom-checkbox {
  top: 13px;
  left: 0;
  padding-top: 0;
}

#multiple-cards-select-categories-modal .custom-checkbox > input {
  top: 0;
}

#multiple-cards-select-categories-modal .custom-checkbox > .box > .fa-check.scattered {
  display: none;
}

#multiple-cards-select-categories-modal .custom-checkbox > input.scattered + .box > .fa-check.scattered {
  display: block;
  opacity: 0.4;
}

#multiple-cards-select-categories-modal .no-category {
  font-size: 22px;
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  padding-left: 35px;
  position: relative;
  top: 10px;
}

#multiple-cards-select-categories-modal .input-x {
  padding-left: 30px;
}

.sortable .card-wrapper:before,
.sortable .card-wrapper:after {
  content: "......";
  position: absolute;
  top: 10px;
  transform: rotate(90deg);
  font-size: 20px;
  color: #bbb;
}

.sortable .card-wrapper:before {
  z-index: 1;
  left: -4px;
}

.sortable .card-wrapper:after {
  left: 1px;
}

.sortable .card.one-line .bin {
  left: 15px;
}

.sortable .card.one-line .question > p {
  padding-left: 35px;
}

.sortable-placeholder {
  background: rgba(0, 0, 0, 0.075);
}

#cardset-cards-content .bg-link-a {
  cursor: pointer;
}

@media only screen and (max-width: 768px) {
  .sortable .card.one-line .answer > p {
    padding-left: 35px;
  }
}
@media only screen and (min-width: 768px) {
  .card-wrapper.edit-multiple {
    padding-left: 42px;
    padding-right: 3px;
  }
  .card-wrapper.edit-multiple .select-multiple {
    display: block;
  }
  .sortable .card-wrapper.edit-multiple:before {
    left: 38px;
  }
  .sortable .card-wrapper.edit-multiple:after {
    left: 43px;
  }
}
@keyframes big-number-pulse {
  0% {
    transform: scale3d(1, 1, 1);
  }
  20% {
    transform: scale3d(1.4, 1.4, 1.4);
  }
  100% {
    transform: scale3d(1, 1, 1);
  }
}
.big-number.pulse {
  animation-name: big-number-pulse;
  animation: big-number-pulse 200ms;
  animation-timing-function: ease-out;
}

span.invited {
  font-style: italic;
  color: #999;
}

p.invited {
  color: #999 !important;
}

div.invited {
  opacity: 0.3;
}

.studypals-management-explanation {
  opacity: 0;
  margin-right: 16px;
  margin-bottom: 8px;
  margin-left: 20px;
  transition: opacity 0.2s ease-out, margin 0.2s ease-out;
}

.studypals-management-done-btn {
  position: fixed;
  width: 100%;
  bottom: 0;
  left: 0;
  display: none;
}

.user-display-container .userpic {
  position: relative;
}

.rank-badge {
  position: absolute;
  border-radius: 100px;
  color: #fff;
  bottom: -4px;
  left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  padding: 1px 4px;
  font-size: 10px;
}

.rank-badge.moderator {
  background: #a26900;
}

.rank-badge.creator {
  background: #0090a2;
}

.action-btns a,
.action-btns button {
  margin-bottom: 10px;
}

.action-btns {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
}

.action-btns .bright-link {
  margin-right: 16px;
}

.action-btns .bright-link.right {
  margin-right: 0;
  margin-left: 16px;
}

.action-btns .bright-link.right.card-position {
  margin-left: 20px;
}

.recipient {
  width: 100%;
  font-size: 16px !important;
}

@media only screen and (min-width: 1024px) {
  .action-btns {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 870px) {
  .top-btn-box .btn {
    margin: 5px;
  }
}
.lp-days-container {
  display: flex;
}

.lp-days-container.intro .lp-day {
  opacity: 0.5;
}

.lp-days-container.intro .lp-today {
  opacity: 1;
}

.lp-days-container.intro .card-quantity {
  display: none;
}

.lp-days-container.intro .cards-remaining {
  display: none;
}

.lp-days-container.intro .lp-day.past .fa {
  display: none;
}

.lp-days-container.intro .intro-text {
  display: block;
  position: absolute;
  top: 70px;
}

.lp-days-container .intro-text {
  display: none;
}

.lp-day {
  position: relative;
  height: 207px;
}

.lp-day.past {
  margin-right: 2px;
}

.lp-day.future {
  margin-left: 2px;
}

.lp-day div {
  text-align: center;
}

.lp-day tr {
  height: 33.333%;
}

.weekday {
  position: absolute;
  text-align: center;
  top: 20px;
}

.lp-today .weekday {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
}

.lp-today .cards-remaining {
  position: absolute;
  bottom: 37%;
  margin: 0 auto;
  width: 100%;
  color: #aaa;
  font-size: 13px;
}

.study-target-cards {
  position: absolute;
  bottom: 27%;
  margin: 0 auto;
  width: 100%;
  color: green;
  font-size: 0.8em;
}

.lp-day .fa-check,
.lp-day .fa-times {
  position: absolute;
  bottom: 16px;
  left: 0;
  font-size: 20px;
}

.lp-day .card-quantity {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 18px;
  text-align: center;
}

.lp-2d-ago .card-quantity,
.lp-2d-from-now .card-quantity {
  font-size: 22px;
}

.lp-1d-ago .card-quantity,
.lp-1d-from-now .card-quantity {
  font-size: 33px;
}

.lp-today .card-quantity {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  position: absolute;
  bottom: 46%;
  line-height: 100%;
}

.h75 {
  height: 75%;
}

.h25 {
  height: 25%;
}

.learn-btn-container {
  padding-top: 2px;
}

.learnplan .learn-btn {
  font-size: 24px;
  height: 100%;
}

@media only screen {
  .lp-6d-ago,
  .lp-5d-ago,
  .lp-4d-ago,
  .lp-3d-ago,
  .lp-2d-ago,
  .lp-2d-from-now,
  .lp-3d-from-now,
  .lp-4d-from-now,
  .lp-5d-from-now,
  .lp-6d-from-now {
    display: none;
  }
  .lp-day {
    flex: 3 0 0%;
  }
  .lp-today {
    flex: 4 0 0%;
  }
  .lp-day.lp-today .card-quantity {
    font-size: 55px;
  }
  .lp-today .learn-btn span {
    display: inline;
  }
  .lp-today .btn i {
    margin-left: 0;
    margin-right: 0;
  }
}
@media only screen and (min-width: 530px) {
  .lp-2d-ago,
  .lp-2d-from-now {
    display: block;
  }
  .lp-day {
    flex: 16.666 0 0%;
  }
  .lp-today {
    flex: 33.333 0 0%;
  }
  .lp-day.lp-today .card-quantity {
    font-size: 60px;
  }
  .lp-today .learn-btn span {
    display: inline;
  }
  .lp-today .btn i {
    margin-left: -4px;
    margin-right: 4px;
  }
}
@media only screen and (min-width: 720px) {
  .lp-3d-ago,
  .lp-2d-ago,
  .lp-2d-from-now,
  .lp-3d-from-now {
    display: block;
  }
  .lp-day {
    flex: 12.5 0 0%;
  }
  .lp-today {
    flex: 25 0 0%;
  }
}
@media only screen and (min-width: 900px) {
  .lp-4d-ago,
  .lp-3d-ago,
  .lp-2d-ago,
  .lp-2d-from-now,
  .lp-3d-from-now,
  .lp-4d-from-now {
    display: block;
  }
  .lp-day {
    flex: 10 0 0%;
  }
  .lp-today {
    flex: 20 0 0%;
  }
}
@media only screen and (min-width: 1024px) {
  .lp-6d-ago,
  .lp-5d-ago,
  .lp-4d-ago,
  .lp-3d-ago,
  .lp-2d-ago,
  .lp-2d-from-now,
  .lp-3d-from-now,
  .lp-4d-from-now,
  .lp-5d-from-now,
  .lp-6d-from-now {
    display: block;
  }
  .lp-day {
    flex: 6 0 0%;
  }
  .lp-3d-ago,
  .lp-3d-from-now {
    flex: 6.5 0 0%;
  }
  .lp-2d-ago,
  .lp-2d-from-now {
    flex: 8.25 0 0%;
  }
  .lp-1d-ago,
  .lp-1d-from-now {
    flex: 10 0 0%;
  }
  .lp-today {
    flex: 14.5 0 0%;
  }
}
@media only screen and (min-width: 768px) {
  .left-column {
    width: 50%;
    float: left;
    padding-right: 10px;
  }
  .right-column {
    width: 50%;
    float: left;
    padding-left: 10px;
  }
  .content-box {
    padding: 20px 24px;
  }
}
.content-box {
  background: #fff;
  padding: 20px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.lp-faq,
.top-learners,
.lp-winners {
  margin-bottom: 30px;
}

.ranking .row {
  line-height: 30px;
  display: flex;
}

.top-learners nav {
  margin-bottom: 20px;
}

.ranking .rank {
  margin-right: 10px;
}

.ranking .userpic {
  margin-right: 6px;
  flex: 0 0 auto;
}

.ranking .username {
  flex: 1 1 auto;
  margin-right: 10px;
}

.ranking .row + .row {
  margin-top: 6px;
}

.ranking .lp-number {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  margin-right: 4px;
  flex: 0 0 auto;
}

.ranking .lp-letters {
  flex: 0 0 auto;
}

.top-learners .rank {
  width: 20px;
  flex: 0 0 auto;
}

.lp-faq .content-hl {
  margin-bottom: 4px;
}

.lp-faq * + .content-hl {
  margin-top: 24px;
}

.first-place-users,
.second-place-users,
.third-place-users {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 15px;
}

.first-place-users,
.second-place-users {
  margin-bottom: 15px;
}

.first-place-users .user-display {
  margin: 0 10px 20px;
}

.second-place-users .user-display {
  margin: 0 8px 18px;
}

.third-place-users .user-display {
  margin: 0 6px 16px;
}

.lp-winners .user-display {
  float: none;
  flex-shrink: 0;
  height: auto;
}

.lp-winners .userpic.first-place {
  width: 80px;
  height: 80px;
}

.lp-winners .userpic.second-place {
  width: 65px;
  height: 65px;
}

.lp-winners .userpic.third-place {
  width: 55px;
  height: 55px;
}

.lp-winners .content-hl svg {
  margin-left: 4px;
}

.surroundings {
  margin-top: 50px;
}

.page-lernen .page-headline-container {
  margin-bottom: 0;
  position: relative;
  left: -4px;
}

.learn-progress {
  font-size: 14px;
  position: relative;
  margin-bottom: 40px;
  text-align: right;
  display: flex;
  align-items: flex-end;
  padding-bottom: 10px;
  padding-left: 4px;
}

.learn-progress p {
  margin-right: 12px;
}

.learn-progress .page-subheadline {
  font-size: 14px;
}

.learn-progress .cards-left-container {
  margin-left: auto;
  margin-right: 0;
}

.learn-progress .cards-left {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 100;
  font-size: 40px;
  line-height: 40px;
}

.learn-progress .progress-bar {
  height: 5px;
}

.learn-progress .divider {
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0;
}

.page-lernen footer {
  display: none;
}

.learning-top-bar {
  position: fixed;
  z-index: 100;
  backface-visibility: hidden;
  top: 0;
  left: 0;
  width: 100%;
  height: 40px;
  display: flex;
  background: #007356;
}

.learning-top-bar .learn-progress {
  flex: 1 1 auto;
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.6);
  padding-left: 20px;
}

.learning-top-bar .cards-left-container {
  margin-left: 0;
}

.learning-top-bar .cards-left {
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
}

.learning-top-bar .progress-bar {
  position: absolute;
  top: 40px;
  left: 0;
}

.shopping-cart-mobile .btn {
  color: rgba(255, 255, 255, 0.6);
}

.shopping-cart-mobile .fa-plus {
  font-size: 10px;
  position: relative;
  left: 4px;
  top: -1px;
}

.learning-top-bar .stop-learning-btn {
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
}

.learning-top-bar .stop-learning-btn:hover {
  background: transparent;
  color: white;
}

@media only screen and (min-width: 768px) {
  .page-lernen footer {
    display: block;
  }
}
.page-lernstatistik .top-btn-box form {
  float: right;
}

.learnstats-container {
  margin-bottom: 40px;
}

.learnstats-container .ring-container {
  position: relative;
  margin: 20px 0;
  text-align: center;
}

.learn-stats-text {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 40px;
  justify-content: center;
}

.learn-stats-text p {
  flex: none;
  margin: 0 9px 9px;
}

.learn-btns {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.learn-btns .btn {
  float: none;
  display: flex;
  height: auto;
  min-height: 36px;
  line-height: inherit;
  flex: none;
  align-items: center;
  justify-content: center;
  margin: 0 3px;
  width: 100%;
  margin-bottom: 6px;
}

.btn.correct-cards-btn,
.btn.partially-correct-cards-btn,
.btn.wrong-cards-btn {
  text-align: left;
  position: relative;
  padding-left: 10px;
  height: 41px;
  float: none;
}

.cards-correct-quantity,
.cards-partially-correct-quantity,
.cards-wrong-quantity {
  position: relative;
  top: 1px;
}

.cards-correct-text,
.cards-partially-correct-text,
.cards-wrong-text {
  position: relative;
  top: -2px;
}

.correct-cards-btn > i,
.partially-correct-cards-btn > i,
.wrong-cards-btn > i {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}

.cards-correct-quantity,
.cards-partially-correct-quantity,
.cards-wrong-quantity {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 26px;
  line-height: 16px;
  margin-right: 4px;
}

.correct-cards-btn, partially-correct-cards-btn {
  margin-bottom: 6px;
}

.correct-cards-container {
  margin-bottom: 30px;
  display: none;
}

.partially-correct-cards-container {
  margin-top: 6px;
  margin-bottom: 30px;
  display: none;
}

.wrong-cards-container {
  margin-top: 6px;
  display: none;
}

.page-lernstatistik .card {
  margin-bottom: 6px;
}

.page-lernstatistik .question > p {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.page-lernstatistik .question > p {
  padding: 12px 20px 0 24px;
}

.load-more-correct-cards-btn {
  display: none;
  float: right;
  margin-top: 0;
  margin-bottom: 20px;
}

.load-more-partially-correct-cards-btn {
  display: none;
  float: right;
  margin-top: 0;
  margin-bottom: 20px;
}

.load-more-wrong-cards-btn {
  display: none;
  float: right;
  margin-top: 0;
  margin-bottom: 20px;
}

@media only screen and (min-width: 768px) {
  .learnstats-container {
    display: flex;
    align-items: center;
  }
  .learnstats-container .ring-container {
    flex: 0 0 auto;
    margin: 0;
  }
  .learn-stats-text {
    align-items: center;
    flex-direction: column;
    padding-bottom: 0;
    padding: 0 20px;
    width: 340px;
  }
  .learn-stats-text p {
    flex: 0 0 auto;
    width: 100%;
    margin: 4px 0;
    line-height: 17px;
    display: flex;
  }
  .learn-stats-text i {
    width: 20px;
    text-align: center;
    margin-right: 4px;
    flex: 0 0 auto;
  }
  .learn-btns {
    width: 220px;
    padding-bottom: 0;
    margin-left: auto;
    flex: 0 0 auto;
  }
  .learn-btns .btn {
    margin: 3px 0;
  }
}
.lp-bar {
  background: #fff;
  padding: 8px 18px 32px;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  margin-top: 2px;
  max-height: 115px;
}

.lp-bar .first-block {
  flex: 1 0 auto;
}

.lp-bar .days-learned {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 36px;
  margin-right: 10px;
  margin-bottom: -8px;
}

.lp-bar .days-learned.learned {
  color: #08b474;
}

.lp-bar .learnpoints-btn {
  margin-right: 20px;
  margin-left: 6px;
}

.lp-bar .days-container {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 18px;
  padding: 0 10px;
}

.lp-bar .day-group {
  float: left;
  padding: 0 5px;
}

.lp-bar .day-container {
  height: 4px;
  padding: 0 1px;
  float: left;
}

.lp-bar .day {
  background: #ccc;
  width: 100%;
  height: 100%;
}

.lp-bar .day.learned {
  background: #08b474;
}

.lp-bar-switcher {
  position: relative;
}

.lp-bar-switcher button {
  position: absolute;
  right: 130px;
  top: 6px;
  z-index: 1;
}

.lp-bar-switcher.active .lp-bar-show-btn {
  display: none;
}

.lp-bar-switcher.active .lp-bar-hide-btn {
  display: block;
}

.lp-bar-hide-btn {
  font-size: 0.9em;
}

.lp-bar-show-btn {
  color: #aaa;
  font-size: 0.9em;
}

@media only screen and (min-width: 430px) {
  .lp-bar .day-group {
    padding: 0 10px;
  }
}
.bold {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
}

.light {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
}

.btn.right {
  float: right;
  margin-left: 5px;
}

.circle {
  border-radius: 50%;
}

.click {
  cursor: pointer;
}

.disable-select {
  user-select: none;
}

.disable-select [contenteditable=true] {
  user-select: text;
}

.vcenter-parent {
  transform-style: preserve-3d;
}

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

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

.pos-rel {
  position: relative;
}

.btn.mr {
  margin-right: 2px;
}

.inactiveflipperlink {
  border: 1px solid #bbb;
  padding: 2px;
  border-radius: 5px;
}

.activeflipperlink {
  border: 1px solid #08b474;
  padding: 2px;
  border-radius: 5px;
  background-color: #08b474;
  color: #fff !important;
}

body {
  padding: 60px 0 0;
}

#center {
  flex: 1 0 auto;
  padding-bottom: 100px;
}

textarea {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  border: none;
}

button {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  border: 0;
  background: transparent;
  padding: 0;
}

button:focus,
input:focus,
textarea:focus {
  outline: 0;
}

.btn {
  padding: 10px 15px;
  text-align: center;
}

.btn.bottom-btn {
  padding: 15px;
  z-index: 2;
}

.btn i + span {
  margin-left: 4px;
}

.btn span i {
  margin-right: 8px;
}

.page-top {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 38px;
}

.page-headline-container {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 24px;
  margin-left: 2px;
  width: 100%;
}

.page-headline {
  font-size: 24px;
}

.page-headline-container.icon {
  padding-left: 36px;
  position: relative;
}

.page-headline-container i {
  position: absolute;
  left: 4px;
  top: 3px;
}

.firefox .page-headline-container i {
  top: 4px;
}

.iexplorer .page-headline-container i {
  top: 5px;
}

.top-btn-box {
  margin-top: 10px;
}

.top-btn-box .button-row {
  display: flex;
  justify-content: flex-start;
  flex-flow: row wrap;
}

.top-btn-box .button-row button {
  margin-bottom: 6px;
}

.top-btn-box .button-row .btn {
  flex-shrink: 0;
}

.top-btn-box .btn + .btn {
  margin-left: 2px;
}

.learnplan-info {
  display: none;
}

@media only screen and (min-width: 768px) {
  body {
    padding-top: 60px;
  }
  .page-top {
    flex-wrap: nowrap;
  }
  .page-headline-container {
    width: auto;
  }
  .top-btn-box {
    margin-top: -3px;
    margin-left: auto;
    padding-left: 30px;
    flex-shrink: 0;
  }
  .top-btn-box .button-row {
    justify-content: flex-end;
  }
  .top-btn-box .container {
    right: 0;
    left: inherit;
  }
  .learnplan-info {
    display: block;
  }
  .top-btn-box .learnplan-info,
  .top-btn-box .cardset-price {
    float: right;
  }
}
.content-hl {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 24px;
}

.hl-thin {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
}

.backlink {
  margin-left: 3px;
  margin-right: 16px;
}

.big-number {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 36px;
  flex: 0 0 auto;
  margin-right: 20px;
  order: -1;
}

@media only screen and (min-width: 1024px) {
  .big-number {
    font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 100;
    font-size: 72px;
    margin-top: -16px;
    margin-left: auto;
    margin-right: 0;
    order: 0;
  }
}
.input.editable p {
  margin-bottom: 1em;
  margin-top: 1em;
}

/*.input.editable p:first-of-type {
    margin-top: 0em;
}

.input.editable p:last-of-type {
    margin-bottom: 0em;
}*/
.input.editable {
  outline: none;
}

select {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
}

select::-ms-expand {
  display: none;
}

.select-style {
  position: relative;
  height: 33px;
}

.select-style .fa {
  position: absolute;
  top: 0;
  right: 0;
  padding: 8px;
  height: 100%;
  pointer-events: none;
}

.select-style select {
  padding: 5px 20px 5px 8px;
  width: 100%;
  border: none;
  box-shadow: none;
  background: transparent;
  background-image: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.select-style select:focus {
  outline: none;
}

option {
  background: #ddd;
}

/*
// HOME styles!

.page-main body {
    padding-top: 40px;
}

@media only screen and (min-width: 1024px) {
    // same top padding for all pages, because of top ad banner
    .page-main body {
        padding-top: 80px;
    }
}
*/
.content-module {
  margin-top: 20px;
  margin-bottom: 60px;
}

.content-module-top {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}

.content-module-top .select-style {
  margin-left: auto;
  overflow: hidden;
  flex: none;
}

.module-hl {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  padding-left: 6px;
  flex: 1 1 auto;
}

.content-module-top .module-hl {
  margin-right: 15px;
}

.module-hl i {
  margin-right: 6px;
  font-size: 17px;
}

.userpic {
  background-position: center;
  background-size: cover;
}

.userpic.tiny {
  width: 25px;
  height: 25px;
}

.userpic.small {
  width: 30px;
  height: 30px;
}

.userpic.medium {
  width: 80px;
  height: 80px;
}

.userpic.big {
  width: 160px;
  height: 160px;
}

.user-display-container {
  margin-top: 20px;
}

.user-display-container {
  padding-right: -50px;
}

.user-display {
  display: flex;
  position: relative;
  width: 100%;
  margin-bottom: 20px;
  align-items: center;
}

.user-display .userpic {
  width: 60px;
  height: 60px;
  margin-right: 12px;
}

.user-display .username {
  flex: 1 0 0;
  color: #666;
  line-height: 1.2;
  max-height: 60px;
  overflow: hidden;
}

.user-display:hover .userpic {
  opacity: 1;
}

.user-display:hover .username {
  color: #333;
}

@media only screen and (min-width: 768px) {
  .user-display {
    display: block;
    float: left;
    text-align: center;
    width: 120px;
    margin-right: 20px;
    height: 135px;
  }
  .user-display .userpic {
    margin: 0 auto 12px;
    width: 80px;
    height: 80px;
  }
  .user-display .username {
    font-size: 13px;
    line-height: 16px;
    /* height: 32px; */
  }
}
.inactive-cardsets-hl {
  margin-top: 20px;
}

.pro-badge {
  position: absolute;
  background: #08b474;
  border-radius: 100px;
  color: #fff;
}

.pro-badge.big:hover {
  background: #00B688;
  color: #fff;
}

.pro-badge.big {
  right: -5px;
  top: 129px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
  padding: 4px 9px;
}

.pro-badge.small {
  left: 40px;
  top: 44px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  padding: 1px 4px;
  font-size: 10px;
}

@media only screen and (min-width: 768px) {
  .pro-badge.small {
    left: 74px;
    top: 64px;
  }
}
.search-box {
  position: relative;
}

.button-row .search-box {
  margin-bottom: 6px;
}

.search-box .search-input {
  background: #eee;
  color: #777;
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  padding: 10px 15px 10px 34px;
}

.search-box .search-input:hover {
  background: #f5f5f5;
}

.search-box .search-input:focus {
  background: #fff;
}

.search-box .fa-search {
  position: absolute;
  top: 50%;
  left: 13px;
  transform: translateY(-50%);
  color: #bbb;
  margin-top: -2px;
}

.userpic {
  opacity: 0.7;
  border-radius: 50%;
}

.userpic:hover {
  opacity: 1;
}

.firefox .secondary-menu button:hover .userpic {
  opacity: 1;
}

.userpic.active {
  opacity: 1;
}

.hidden {
  display: none !important;
  visibility: hidden;
}

.visible {
  display: block !important;
  visibility: visible;
}

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

.invisible {
  visibility: hidden;
}

.floating-action-btn {
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.35);
  border-radius: 50%;
  width: 50px;
  height: 50px;
  position: fixed;
  right: 20px;
  bottom: 24px;
  z-index: 3;
  padding: 0;
}

.floating-action-btn .fa {
  font-size: 25px;
}

.floating-action-btn .fa-ellipsis-v {
  font-size: 28px;
}

.floating-action-btn .fa-user-plus {
  font-size: 22px;
}

.shopping-cart-btn-counter {
  margin-left: 33px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background-color: #FFFFFF;
  z-index: 4;
  padding: 1px;
  color: black;
  font-size: 0.8em;
  position: fixed;
  margin-top: -5px;
}

.menu-light-bg {
  position: fixed;
  z-index: 101;
  background: rgba(255, 255, 255, 0.8);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
}

.overlay-action-btns {
  text-align: right;
  position: absolute;
  bottom: 24px;
  right: 20px;
}

.overlay-action-btns ul {
  list-style: none;
}

.overlay-action-btns .btn {
  margin-top: 15px;
}

@media only screen and (max-height: 479px) {
  .overlay-action-btns .btn {
    margin-top: 8px;
  }
}
.admin-btns a {
  display: inline-block;
}

@media only screen {
  .show-for-tablet-up-inline,
  .show-for-tablet-up-inline-block,
  .show-for-tablet-up-block,
  .show-for-tablet-up-flex,
  .show-for-1024-up-inline,
  .show-for-1024-up-inline-block,
  .show-for-1024-up-block,
  .show-for-1024-up-flex,
  .show-for-1280-up-block,
  .show-for-1400-up-block,
  .show-for-1450-up-block,
  .show-for-1500-up-block {
    display: none !important;
  }
}
@media only screen and (max-width: 768px) {
  .phone-flush {
    margin-left: -20px;
  }
  .hide-for-smaller-than-tablet {
    display: none !important;
  }
}
@media only screen and (min-width: 768px) {
  .show-for-tablet-up-inline {
    display: inline !important;
  }
  .show-for-tablet-up-inline-block {
    display: inline-block !important;
  }
  .show-for-tablet-up-block {
    display: block !important;
  }
  .show-for-tablet-up-flex {
    display: flex !important;
  }
  .hide-for-tablet-up {
    display: none !important;
  }
  .layout-control.medium {
    width: 700px;
    margin-right: auto;
    margin-left: auto;
  }
  .content-module .select-style {
    width: 220px;
  }
  .content-module .select-style .fa {
    top: 0;
    left: inherit;
    right: 0;
    transform: translate(0, 0);
    padding: 8px;
    height: 100%;
  }
}
@media only screen and (min-width: 1024px) {
  .show-for-1024-up-inline {
    display: inline !important;
  }
  .show-for-1024-up-inline-block {
    display: inline-block !important;
  }
  .show-for-1024-up-block {
    display: block !important;
  }
  .show-for-1024-up-flex {
    display: flex !important;
  }
  .hide-for-1024-up {
    display: none !important;
  }
}
@media only screen and (min-width: 1280px) {
  .show-for-1280-up-inline {
    display: inline !important;
  }
  .show-for-1280-up-inline-block {
    display: inline-block !important;
  }
  .show-for-1280-up-block {
    display: block !important;
  }
  .show-for-1280-up-flex {
    display: flex !important;
  }
  .hide-for-1280-up {
    display: none !important;
  }
}
@media only screen and (min-width: 1400px) {
  .show-for-1400-up-block {
    display: block !important;
  }
}
@media only screen and (min-width: 1450px) {
  .show-for-1450-up-block {
    display: block !important;
  }
}
@media only screen and (min-width: 1500px) {
  .show-for-1500-up-block {
    display: block !important;
  }
}
.feedback-btn {
  position: fixed;
  top: 50%;
  left: 0;
  margin-top: 65px;
  transform: translateZ(0) translateY(-50%) rotate(-90deg);
  transform-origin: 0 0;
  z-index: 2;
}

#cardsetsFilterText:not(:placeholder-shown) {
  background-color: lightyellow !important;
}

.backlink.top {
  display: block;
  margin-bottom: 10px;
}

.folder-list-column {
  width: 100%;
  margin-bottom: 60px;
  max-width: 500px;
}

.folder-list-column input {
  font-size: 22px;
  margin: 4px 0;
}

.folder-list-column .input-x {
  position: relative;
  padding-right: 26px;
}

.folder-list-column .input-x .remove-btn {
  position: absolute;
  right: 0;
  top: 16px;
  color: #aaa;
  font-size: 20px;
}

.folder-list-column .delete-info {
  margin-top: 20px;
  padding-left: 20px;
  position: relative;
}

.folder-list-column .delete-info i {
  position: absolute;
  left: 0;
  top: 2px;
}

.folder-list-column .add-folder-btn {
  position: relative;
  left: 2px;
  top: 8px;
}

.cardset-folder-list-column > p {
  margin-bottom: 10px;
}

.cardset-folder-list-column .cardset-folder-pair {
  display: flex;
  margin-bottom: 6px;
  align-items: center;
  background: white;
  padding: 15px 20px;
}

.cardset-folder-list-column .cardset-folder-pair p {
  flex: 1 1 auto;
  margin-right: 20px;
}

.cardset-folder-list-column .select-style {
  flex: none;
  width: 28px;
}

@media only screen and (min-width: 768px) {
  .cardset-folder-list-column .select-style {
    width: 200px;
  }
  .cardset-folder-list-column .cardset-folder-pair p {
    font-size: 20px;
  }
}
.medium body {
  background: #c8c6c2 !important;
  color: #777;
}

.new-cardset .page-headline-container {
  margin-left: 0;
}

.new-cardset .input-container {
  margin-bottom: 30px;
}

.new-cardset .cardset-input-label {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 22px;
  position: relative;
  padding: 6px 18px 0 34px;
  margin-bottom: 8px;
}

.new-cardset .cardset-input-label i {
  color: #999;
  position: absolute;
  left: 4px;
  top: 8px;
}

.new-cardset .cardset-input-label .optional {
  color: #aaa;
  font-size: 16px;
}

.new-cardset .cardset-name {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
}

.new-cardset .cardset-categories {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
}

.new-cardset .cardset-keywords {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
}

.new-cardset .input-container i.fa-info {
  left: 12px;
  top: 10px;
}

.new-cardset .editor-cardset-description {
  padding: 10px 15px;
  background: #eee;
  color: #777;
}

.new-cardset .editor-cardset-description:hover {
  background: #f5f5f5;
}

.new-cardset .editor-cardset-description:focus {
  background: #fff;
}

.coop-options-btn {
  font-size: 14px;
  color: #777;
}

.coop-options-btn:hover {
  color: #999;
}

.coop-options-btn i {
  position: relative;
  margin-left: 2px;
  top: 1px;
}

.coop-options {
  margin-top: 12px;
}

.coop-options .select-style {
  position: relative;
  width: 50%;
  overflow: hidden;
  float: left;
}

.coop-options .info-row .info-label,
.coop-options .info-row .info-value {
  width: 36%;
  float: left;
}

.coop-options .info-row {
  margin-bottom: 20px;
}

.coop-options .info-label {
  padding-left: 34px;
}

.coop-options .info-label .fa {
  left: 6px;
}

.coop-options .info-label .fa-user {
  left: 8px;
}

.new-discussion-posts {
  display: none;
  position: absolute;
  width: 316px;
  height: 100vh;
  overflow: hidden;
  top: 0;
  right: -6px;
  z-index: 98;
  padding-top: 100px;
  padding-bottom: 12px;
  pointer-events: none;
}

.new-discussion-posts .module-hl {
  padding-left: 14px;
}

.new-discussion-posts .close-btn {
  position: absolute;
  right: 10px;
  top: 21px;
  background: transparent;
  color: #ccc;
}

.new-discussion-posts .close-btn:hover {
  color: #777;
}

.new-discussion-posts .intro-text {
  padding: 15px;
}

.new-discussion-posts .divider {
  position: static;
  height: 1px;
}

.new-discussion-posts .entry {
  position: relative;
  font-size: 12px;
  padding: 15px;
}

.new-discussion-posts .entry .divider {
  position: absolute;
  bottom: 0;
  left: 0;
}

.new-discussion-posts .entry .text a {
  position: relative;
  z-index: 2;
}

.new-discussion-posts-header {
  position: absolute;
  top: 46px;
  left: 20px;
  padding-top: 20px;
  height: 54px;
  background: #fff;
  width: 276px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  z-index: -1;
  pointer-events: auto;
}

.new-discussion-posts-header .divider {
  position: absolute;
  bottom: 0;
  opacity: 0.7;
}

.new-discussion-posts-content-wrapper {
  height: 100%;
  width: 100%;
}

.new-discussion-posts-content {
  width: 276px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  background: #fff;
  margin: 0 auto;
  pointer-events: auto;
  max-height: 100%;
}

.new-discussion-post-icons {
  position: absolute;
  top: 0;
  right: 15px;
  width: 30px;
  height: 100%;
  text-align: center;
}

.new-discussion-post-icons .fa {
  font-size: 26px;
}

.news-module {
  background: #f0f0f0;
  padding: 10px;
}

.news-module ul {
  margin-left: 30px;
}

.news-module img {
  max-width: 100% !important;
  height: auto;
}

.no-card-sets .btn {
  float: none;
  display: inline-block;
  margin: 4px 4px 10px;
}

.page-main .no-card-sets {
  margin-left: 6px;
}

.page-kartensaetze .no-card-sets {
  margin-left: 8px;
}

.notice {
  position: relative;
  background: #fff;
  padding: 15px 20px;
  margin-bottom: 20px;
}

.notice .close-btn {
  position: absolute;
  font-size: 22px;
  right: 20px;
  top: 20px;
  color: #ccc;
}

.notice .close-btn:hover {
  color: #999;
}

.notice .hl {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 20px;
  margin-bottom: 6px;
}

.notice .strong {
  color: #555;
}

.notice .notice-icon {
  position: absolute;
  right: 70px;
  top: 100px;
  font-size: 140px;
  color: #eee;
}

.notice .fa-heart {
  position: relative;
  top: -2px;
  font-size: 11px;
  color: #555;
  margin-left: 6px;
}

.notice-iphone {
  position: absolute;
  right: 70px;
  top: 18px;
  width: 124px;
}

.notice + .notice {
  margin-top: -40px;
}

.app-notice {
  display: flex;
  flex-wrap: wrap;
}

.notice.app-notice .hl {
  margin-bottom: 0;
  margin-right: 20px;
}

.store-btns {
  margin-right: 34px;
  display: flex;
}

.store-btns img {
  height: 39px;
}

.store-btns a {
  flex: none;
}

.store-btns a:nth-child(even) {
  margin-left: 4px;
}

.content-module.notice {
  margin-top: 0;
}

@media only screen and (min-width: 768px) {
  .content-module.notice {
    margin-top: 20px;
  }
  .notice .hl {
    font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 300;
    font-size: 28px;
    margin-bottom: 10px;
  }
  .store-btns img {
    height: 39px;
    display: inline-block;
  }
}
.pons-notice .flex-container {
  flex-flow: column wrap;
}

.pons-logo {
  height: 70px;
  width: 138px;
  flex: 0 0 auto;
  margin-top: 10px;
}

@media only screen and (min-width: 768px) {
  .pons-notice .flex-container {
    flex-flow: row nowrap;
    align-items: flex-end;
  }
  .pons-notice .notice-text-wrapper {
    flex: 1 1 auto;
    padding-right: 20px;
  }
  .pons-logo {
    margin-right: 40px;
    margin-top: 0;
  }
}
.notifications {
  display: none;
  position: absolute;
  width: 316px;
  height: 100vh;
  overflow: hidden;
  top: 0;
  right: -6px;
  z-index: 98;
  padding-top: 100px;
  padding-bottom: 12px;
  pointer-events: none;
}

.notifications .module-hl {
  padding-left: 14px;
}

.notifications .close-btn {
  position: absolute;
  right: 10px;
  top: 21px;
  background: transparent;
  color: #ccc;
}

.notifications .close-btn:hover {
  color: #777;
}

.notifications .intro-text {
  padding: 15px;
}

.notifications .divider {
  position: static;
  height: 1px;
}

.notifications .notification {
  position: relative;
  font-size: 12px;
  padding: 15px;
}

.notifications .notification .profile-link {
  position: relative;
  z-index: 2;
}

.notifications .notification .userpic {
  position: absolute;
  left: 0;
  top: 16px;
}

.notifications .notification .divider {
  position: absolute;
  bottom: 0;
  left: 0;
}

.notifications-header {
  position: absolute;
  top: 46px;
  left: 20px;
  padding-top: 20px;
  height: 54px;
  background: #fff;
  width: 276px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  z-index: -1;
  pointer-events: auto;
}

.notifications-header .divider {
  position: absolute;
  bottom: 0;
  opacity: 0.7;
}

.notifications-content-wrapper {
  height: 100%;
  width: 100%;
}

.notifications-content {
  max-height: 100%;
  width: 276px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  background: #fff;
  margin: 0 auto;
  pointer-events: auto;
}

.notification-sub-info {
  margin-top: 6px;
}

.notification-text,
.notification-sub-info {
  padding-left: 38px;
  padding-right: 38px;
}

.notification-timeago {
  margin-right: 10px;
}

.notification-text a {
  position: relative;
  z-index: 2;
}

.notification-icons {
  position: absolute;
  top: 0;
  right: 15px;
  width: 30px;
  height: 100%;
  text-align: center;
}

.notification-icons .fa {
  font-size: 26px;
}

.notifications,
.new-discussion-posts {
  right: 0;
  margin-left: 0;
  margin-right: -14px;
}

@media only screen and (min-width: 1024px) {
  .notifications,
  .new-discussion-posts {
    right: -6px;
  }
}
.page-partner .partner {
  margin-bottom: 60px;
}

.page-partner .content-hl {
  margin-top: 0;
  margin-bottom: 10px;
}

.page-partner .logo-container {
  width: 364px;
  float: left;
  background: #fff;
  margin-right: 20px;
  height: 200px;
  text-align: center;
  transform-style: preserve-3d;
}

.page-partner .logo-container img {
  max-width: 324px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.page-partner .goethe-uni-logo {
  max-height: 60%;
  margin-top: -5px;
}

.page-partner .text-container {
  width: 600px;
  float: left;
}

.profile-user-container {
  margin: 0 auto;
  text-align: center;
  margin-bottom: 60px;
  position: relative;
}

.profile-user-container .userpic {
  margin: 0 auto 15px;
  opacity: 1;
  position: relative;
}

.profile-user-container .username {
  font-size: 20px;
  margin-bottom: 2px;
  color: #555;
}

.profile-user-container .institution {
  font-size: 14px;
  color: #999;
}

.profile-user-container .fa-edit {
  margin-right: 4px;
}

.friends {
  margin-top: 20px;
  margin-bottom: 60px;
}

.page-profile .learnpoints {
  margin-bottom: 5px;
}

.page-profile .learnpoints-btn {
  position: relative;
  top: -1px;
  left: 1px;
}

.page-profile .top-btn-box .button-row .open-private-message-modal-btn {
  margin-right: 16px;
}

.page-search #center .input-wrapper {
  margin-bottom: 8px;
}

.page-search #center .search-input {
  width: 100%;
  max-width: 400px;
  font-size: 22px;
}

.page-search #center .search-options {
  margin-bottom: 20px;
}

.page-search #center .search-options label {
  display: block;
  font-size: 18px;
}

.page-search #center .card-wrapper {
  margin-bottom: 6px;
}

@media only screen and (min-width: 768px) {
  .page-search #center .search-options label {
    display: inline;
    margin-right: 15px;
  }
}
span.red {
  color: #DB4646;
}

.settings-block {
  margin-bottom: 6px;
  background: white;
  padding: 20px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.settings-block .content-hl {
  margin-bottom: 12px;
}

.settings-text {
  margin-bottom: 10px;
}

input[type=number].move-learnplan-input, input[type=number].deactivate-card-level-input {
  width: 100px;
  margin: 0 4px;
  font-size: 20px;
  text-align: right;
}

.move-learnplan-btn {
  margin-right: 4px;
  margin-bottom: 10px;
}

.move-learnplan-btn .fa-arrow-right {
  margin-right: 2px;
}

.user-mail-input,
.save-mail-btn {
  margin-bottom: 10px;
}

.user-mail-input,
.user-name-input {
  width: 100%;
  max-width: 300px;
}

@media only screen and (min-width: 768px) {
  .settings-blocks {
    margin: 0 -10px;
    display: flex;
    flex-wrap: wrap;
  }
  .settings-block {
    margin: 0 10px 20px;
    width: calc(50% - 20px);
  }
}
.coloredInputWeekDayLimit, .coloredInputGlobalLimit {
  padding: 8px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-weight: bold !important;
}

.redfont {
  color: red !important;
}

.bluefont {
  color: blue !important;
}

.greenfont {
  color: green !important;
}

.publishers-topic-cardsets .cardset {
  background: white;
  padding: 20px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.publishers-topic-cardsets .cardset ul {
  margin-left: 20px;
}

.publishers-topic-cardsets .cardset + .cardset {
  margin-top: 6px;
}

.publishers-topic-cardsets .title {
  font-size: 1.2em;
  line-height: 1.2;
  display: block;
  margin-bottom: 8px;
}

.publishers-topic-cardsets .cards-amount {
  margin-right: 15px;
  flex: none;
}

.publishers-topic-cardsets .details {
  flex: none;
}

.publishers-topic-cardsets .price {
  margin-left: auto;
}

.publishers-topic-cardsets .add-to-cart-btn {
  flex: none;
  margin-left: 15px;
}

.publishers-topic-cardsets .add-to-cart-btn .fa-shopping-cart {
  font-size: 18px;
}

.publishers-topic-cardsets .add-to-cart-btn .fa-plus {
  font-size: 14px;
}

.publishers-topic-cardsets .details-container {
  display: none;
  margin-top: 20px;
}

.publishers-topic-cardsets .cardset > .publisher {
  display: block;
  margin-bottom: 20px;
}

@media only screen and (min-width: 768px) {
  .publishers-topic-cardsets .flex-container {
    align-items: center;
  }
  .publishers-topic-cardsets .cards-amount {
    line-height: 100%;
  }
  .publishers-topic-cardsets .publisher {
    line-height: 100%;
    margin-left: 15px;
  }
}
.top-btn-box .go-to-checkout-btn {
  display: block;
  position: relative;
  top: 10px;
}

@media only screen and (min-width: 768px) {
  .top-btn-box .go-to-checkout-btn {
    text-align: right;
  }
}
@media only screen and (max-width: 512px) {
  .btn .checkout-btn {
    display: block;
    margin-top: 5px;
    margin-bottom: 5px;
  }
  td.label-td {
    display: none;
  }
  table.checkout-table {
    width: 100%;
  }
}
@media only screen and (max-width: 900px) {
  .bestofelearning {
    display: none;
  }
}
@media only screen and (min-width: 1340px) {
  .top-btn-box .go-to-checkout-btn {
    display: none;
  }
}
.bestofelearning {
  margin: 20px;
}

table.checkout-table {
  width: 80%;
}

table.checkout-table td {
  padding-top: 5px;
  padding-right: 5px;
}

.page-shop .search-box .search-input {
  width: 250px;
}

.topics .topic {
  background: white;
  font-size: 20px;
  padding: 10px 20px;
  margin-bottom: 6px;
  display: block;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.topics .topic:hover {
  background: #f2f2f2;
}

.publishers .publisher {
  background: white;
  padding: 20px;
  margin-bottom: 6px;
  display: block;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.publishers .publisher:hover {
  background: #f2f2f2;
}

.publisher-logo-area {
  display: none;
}

.publisher-logo {
  width: 100%;
  max-height: 100%;
  flex: none;
}

.shop-info-box {
  display: flex;
  align-items: center;
}

.page-shop .notice.app-notice,
.page-shop-publisher .notice.app-notice,
.page-shop-topic .notice.app-notice,
.page-shop-user .notice.app-notice {
  margin: 0;
}

@media only screen and (min-width: 768px) {
  .page-shop .notice.app-notice,
  .page-shop-publisher .notice.app-notice,
  .page-shop-topic .notice.app-notice,
  .page-shop-user .notice.app-notice {
    margin-top: -20px;
  }
}
.page-shop-publisher .backlink,
.page-shop-topic .backlink,
.page-shop-user .backlink {
  margin-bottom: 20px;
}

@media only screen and (min-width: 768px) {
  .topics {
    margin-right: -20px;
  }
  .topics .topic {
    float: left;
    width: calc(50% - 20px);
    margin-right: 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .publishers .publisher {
    display: flex;
  }
  .publisher-logo-area {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
    width: 130px;
    height: 100%;
    text-align: center;
    flex: none;
  }
}
@media only screen and (min-width: 1024px) {
  .topics .topic {
    width: calc(33.33% - 20px);
    margin-bottom: 20px;
  }
  .publishers {
    margin-right: -20px;
  }
  .publishers .publisher {
    float: left;
    height: 155px;
    width: calc(50% - 20px);
    margin-right: 20px;
    margin-bottom: 20px;
  }
}
.logofile-mini {
  max-width: 16px;
  vertical-align: middle;
}

.shop-publisher-link {
  color: #00A279 !important;
  font-weight: bold;
}

.shop-publishers-and-tags {
  width: 20%;
  vertical-align: top;
}

@media only screen and (max-width: 622px) {
  .shop-publishers-and-tags {
    display: none;
  }
  #storeSearchInput {
    width: 97% !important;
  }
  .easy-autocomplete {
    width: 97% !important;
  }
  .shopSelectorsMobile {
    display: block;
  }
  .kartensatz-block-mini {
    width: 100% !important;
    max-width: 100% !important;
  }
}
@media only screen and (min-width: 622px) {
  .shopSelectorsMobile {
    display: none;
  }
}
/* SHOPPING CART BAR */
.shopping-cart-bar {
  display: none;
}

.shopping-cart-bar-content-wrapper {
  display: flex;
  flex-direction: column;
  max-height: 100%;
}

.shopping-cart-bar-content {
  flex: 1 1 auto;
}

.shopping-cart-item {
  position: relative;
  font-size: 14px;
  padding: 15px;
}

.shopping-cart-item .item {
  display: block;
}

.shopping-cart-item .bottom-row {
  margin-top: 10px;
  display: flex;
}

.shopping-cart-item .price {
  margin-left: auto;
}

.shopping-cart-total {
  flex: none;
  position: relative;
  font-size: 14px;
  padding: 15px;
}

.sidebar .shopping-cart-total .divider {
  top: -1px;
  bottom: auto;
}

.shopping-cart-total .subinfo {
  font-weight: 400;
  font-size: 12px;
}

.shopping-cart-total .amount {
  margin-left: auto;
}

.add-repetico-pro-btn {
  display: block;
  margin-top: 10px;
  font-size: 16px;
}

.shopping-cart-bar .go-to-checkout-btn {
  display: block;
  margin-top: 6px;
  font-size: 16px;
}

@media only screen and (min-width: 1340px) {
  .sidebar {
    display: block;
    right: auto;
    margin-left: 1004px;
    box-shadow: none;
    z-index: 1;
  }
  .shopping-cart-total {
    padding-bottom: 55px;
  }
  .show-shopping-cart-bar-btn {
    display: none;
  }
  .shopping-cart-bar .close-btn {
    display: none;
  }
}
@keyframes fab-pulse {
  from {
    transform: scale3d(1, 1, 1);
  }
  50% {
    transform: scale3d(1.2, 1.2, 1.2);
  }
  to {
    transform: scale3d(1, 1, 1);
  }
}
.show-shopping-cart-bar-btn.pulse {
  animation-name: fab-pulse;
  animation: fab-pulse 200ms;
  animation-timing-function: ease-out;
}

/* SIDEBAR */
.sidebar {
  position: fixed;
  width: 276px;
  top: 0;
  right: 0;
  margin-left: 0;
  padding-top: 94px;
  overflow: hidden;
  z-index: 98;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  background: #eee;
}

.sidebar-header {
  position: absolute;
  top: 40px;
  padding-left: 15px;
  padding-top: 20px;
  height: 74px;
}

.sidebar .module-hl {
  padding-left: 12px;
  margin-bottom: 0;
}

.sidebar .module-sub-hl {
  position: absolute;
  padding-left: 38px;
  font-size: 14px;
  width: 250px;
}

.sidebar .close-btn {
  position: absolute;
  right: 10px;
  top: 21px;
  background: transparent;
  color: #ccc;
}

.sidebar .close-btn:hover {
  color: #777;
}

.sidebar .divider {
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0;
  background: #ccc;
}

.sidebar-content-wrapper {
  position: absolute;
  padding-bottom: 114px;
  top: 114px;
}

.sidebar-content {
  position: relative;
}

@media only screen and (min-width: 1340px) {
  .sidebar {
    display: block;
    right: auto;
    margin-left: 1004px;
    box-shadow: none;
    z-index: 1;
  }
}
.nicescroll-rails > div {
  background: #ccc !important;
}

.static-content {
  line-height: 1.2;
}

.static-content ul {
  margin-left: 20px;
}

/*.static-content p {
    margin-top: 5px;
    margin-bottom: 5px;
}*/
.page-statistik .select-style {
  position: relative;
  overflow: hidden;
}

.page-statistik .select-cardset {
  font-size: 14px;
}

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

.long-term-stats-container {
  margin-top: 20px;
  background: white;
  padding: 20px;
}

.long-term-stats-container .content-hl {
  margin-bottom: 12px;
}

.long-term-stats-container .flex-container {
  flex-flow: row wrap;
}

.long-term-stats-container li {
  list-style: none;
  margin-bottom: 2px;
}

.stats-legend {
  margin-right: 30px;
  flex: 0 0 auto;
}

.stats-legend li {
  padding-left: 20px;
  position: relative;
}

.stats-legend .circle {
  position: absolute;
  left: 0;
  top: 5px;
  height: 11px;
  width: 11px;
}

.bar-chart-container {
  display: flex;
  flex: 1 0 auto;
  justify-content: flex-end;
}

.bar-chart-container ul {
  vertical-align: top;
}

.bar-chart-container .bar-chart {
  margin-right: 18px;
  flex: 1 1 auto;
}

.bar-chart-container .bar-chart .bar {
  height: 24px;
  width: 0%;
}

.bar-chart-container .card-amounts {
  margin-right: 18px;
}

.bar-chart-container .card-percentages {
  text-align: right;
}

#statistik-content-container .stats-container {
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

#statistik-content-container .ring-container {
  position: relative;
  flex-shrink: 0;
  width: 100%;
  text-align: center;
  margin-bottom: 30px;
  order: -1;
}

.overall-progress {
  position: absolute;
  top: 66px;
  margin: 0 auto;
  text-align: center;
  display: none;
}

.overall-progress-number {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 100;
  font-size: 58px;
  position: relative;
  left: 8px;
  top: -4px;
}

.overall-progress-percent {
  font-size: 28px;
  position: relative;
  left: 4px;
  top: -4px;
}

.overall-progress-subline {
  font-size: 13px;
  position: absolute;
  top: 148px;
  margin: auto;
  text-align: center;
  display: none;
}

.disabled-stats {
  opacity: 0.3;
}

.repetico-pro-badge {
  position: absolute;
  background: #08b474;
  border-radius: 100px;
  color: #fff;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  padding: 6px 15px;
  font-size: 20px;
  z-index: 1;
}

.repetico-pro-badge:hover {
  background: #00B688;
  color: #fff;
}

.repetico-pro-badge:focus {
  color: #fff;
}

.learn-effort-container .content-hl {
  margin-bottom: 12px;
}

.stats-hl {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  margin-bottom: 15px;
}

.learn-effort-container,
.known-cards-chart-container,
.cardset-ranking-stats-container {
  background: white;
  padding: 20px;
  position: relative;
}

.stats-subline {
  margin: 4px 0 26px;
  font-size: 14px;
}

.bottom-chart-container {
  width: 100%;
  height: 240px;
}

.statistic-chart.months {
  position: relative;
  left: -62px;
}

.statistic-chart-weeks {
  position: relative;
}

.statistic-chart.days {
  position: relative;
  left: -8px;
}

nav.timeframe-btns {
  margin-top: 20px;
}

nav.timeframe-btns button {
  margin-right: 2px;
}

@media only screen and (min-width: 768px) {
  .page-statistik .select-style {
    width: 400px;
  }
  .long-term-stats-container .flex-container {
    flex-flow: row nowrap;
  }
  .stats-legend {
    width: auto;
  }
  .bar-chart-container .card-percentages {
    text-align: left;
  }
  #statistik-content-container .ring-container {
    margin-left: 30px;
    margin-top: -40px;
    margin-bottom: 0;
    width: auto;
    order: 0;
  }
}
@media only screen and (min-width: 1024px) {
  #statistik-content-container .ring-container {
    margin-left: 80px;
    margin-right: 20px;
  }
}
.heatmap-container {
  background: white;
  padding: 20px;
  position: relative;
}

.heatmap {
  margin-top: 20px;
}

.heatmap-container h2 {
  margin-bottom: 20px;
}

.heatmap-container .month-row {
  display: flex;
  align-items: flex-start;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.heatmap-container .month-label {
  width: 90px;
  font-weight: bold;
  text-align: right;
  margin-right: 10px;
  flex-shrink: 0;
}

.heatmap-container .month-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16px, 1fr));
  grid-auto-rows: 16px;
  gap: 3px;
  flex-grow: 1;
  min-width: 180px;
}

.heatmap-container .day {
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 3px;
  cursor: pointer;
  position: relative;
}

.heatmap-container .day:hover::after {
  content: attr(data-date) " – " attr(data-total) " Karten";
  position: absolute;
  background: #333;
  color: #fff;
  padding: 3px 6px;
  border-radius: 3px;
  font-size: 12px;
  transform: translate(-50%, -130%);
  white-space: nowrap;
  z-index: 10;
}

/* === Responsive Anpassungen === */
@media (max-width: 800px) {
  .heatmap-container .month-label {
    width: 90px;
    font-size: 14px;
  }
  .heatmap-container .month-grid {
    grid-template-columns: repeat(auto-fit, minmax(14px, 1fr));
    gap: 2px;
  }
}
@media (max-width: 500px) {
  .heatmap-container .month-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .heatmap-container .month-label {
    text-align: left;
    margin-bottom: 6px;
  }
  .heatmap-container .month-grid {
    grid-template-columns: repeat(auto-fill, minmax(16px, 1fr));
    width: 100%;
    gap: 3px;
  }
}
.cards-status-development {
  margin-top: 50px;
  position: relative;
}

.learned-cards-average-container {
  margin-top: 50px;
}

.cards-average-pair-container {
  display: flex;
  flex-wrap: wrap;
}

.learned-cards-average-container .cards-average-pair {
  flex: 1 0 auto;
}

.learned-cards-average-container .cards-average-pair:first-of-type {
  margin-bottom: 30px;
}

.cards-average-block {
  display: inline-block;
  vertical-align: top;
  margin-right: 50px;
}

.cards-average-block > .wrapper {
  display: flex;
  align-items: flex-end;
}

.learned-cards-average-container .cards-average {
  font-size: 40px;
  line-height: 40px;
  font-weight: 300;
}

.cards-average-delta-container {
  padding-bottom: 4px;
  margin-left: 9px;
}

.cards-average-delta {
  font-size: 14px;
}

.cards-average-delta-container .fa {
  font-size: 30px;
  line-height: 10px;
  display: block;
}

.cards-average-delta.positive {
  color: #00A279;
}

.cards-average-delta.negative {
  color: #DB4646;
}

.cards-average-delta.nil {
  color: #ccc;
  position: relative;
  left: 4px;
}

.learned-cards-average-container .fa-caret-up {
  color: #00A279;
}

.learned-cards-average-container .fa-caret-down {
  color: #DB4646;
}

.learned-cards-average-container .fa-sort {
  color: #ccc;
  font-size: 24px;
  line-height: 24px;
}

.cards-average-block .time-period {
  margin-top: 4px;
}

@media only screen and (min-width: 1024px) {
  .learned-cards-average-container .cards-average {
    font-size: 72px;
    line-height: 72px;
    font-weight: 100;
  }
  .learned-cards-average-container .cards-average-pair:first-of-type {
    margin-bottom: 0;
  }
  .cards-average-delta {
    font-size: 16px;
  }
  .cards-average-delta-container .fa {
    font-size: 40px;
  }
  .cards-average-delta-container {
    padding-bottom: 10px;
  }
  .learned-cards-average-container .fa-sort {
    font-size: 30px;
    line-height: 30px;
  }
  .cards-average-block .time-period {
    margin-top: 0;
  }
}
/*

// overwrite tinymces styles to fit repetico

.mce-tab {
    height: 30px !important;
}

.mce-tabs {
    height: 30px !important;
}

.mce-edit-focus:focus {
    outline: none;
}

.mce-panel {
    border: none;
}

.mce-tinymce-inline .mce-flow-layout {
    white-space: normal;
}

.mce-panel {
    background: transparent;
}

.mce-container button {
    margin-right: 2px;
    margin-bottom: 2px;
}

.mce-flow-layout-item {
    margin: 2px 0;
}

.mce-menu {
    margin: 0;
}

.mce-tinymce.mce-floatpanel {
    margin-top: -32px;
    box-shadow: none;
    z-index: 1 !important;
    // box-shadow:0 3px 7px rgba(0,0,0,.3);
}

.mce-floatpanel {
    margin-top: 0 !important;
}

.mce-floatpanel.mce-fixed {
    top: 40px !important;
}

// button icon color
.mce-toolbar .mce-btn i {
    color: #777;
}

// remove textshadow from icons
.mce-btn i {
    text-shadow: none;
}

// active buttons background & color
.mce-btn.mce-active button,
.mce-btn.mce-active:focus button {
    background-color: #fff;
    // color: #555;
}

// active buttons icons color
.mce-btn.mce-active button i,
.mce-btn.mce-active:focus button i {
    // color: #555;
}

.mce-btn:not(.mce-disabled):active {
    // background-color: #d6d6d6;
}

.mce-tinymce.mce-tinymce-inline {
    border: none;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .25);
}

.mce-tinymce.mce-container-body,
.mce-container-body.mce-stack-layout {
    width: auto !important;
    height: auto !important;
    // padding: 2px 2px 2px 4px;
    background: #fff;
}

.mce-container,
.mce-container *,
.mce-widget,
.mce-widget *,
.mce-reset {
    white-space: normal;
}

.mce-btn {
    margin-bottom: 2px;
}

.mce-btn button {
    padding: 4px 9px;
}

// popup background
.mce-reset {
    background: #fff;
}

.mce-toolbar-grp {
    padding-bottom: 0;
}

.mce-btn:hover,
.mce-btn:focus {
    background: transparent !important;
}

.mce-btn.mce-active,
.mce-btn.mce-active:hover {
    background-color: transparent !important;
}

.mce-btn-group .mce-btn {
    border: none !important;
}



// responsive

    .smaller-than-tablet .mce-tinymce-inline {
        left: 20px !important;
        margin-left: -20px; // top floating tinymce gets "left: 20px" set automatically, so utilize margin-left to counter it and have default left of 20px
    }

    .mce-tinymce-inline,
    .mce-toolbar-grp {
        // width: 100% !important;
    }

    // for IE, or it won't wrap
    // .mce-btn-group {
    // 	display: flex;
    // }

    .mce-btn-group > div {
        display: flex;
        flex-flow: row wrap;
        max-width: 100%;
        padding: 2px 2px 0;
    }



.mce-close-panel-btn {
    margin-left: auto !important;
    cursor: pointer !important;
}

.mce-close-panel-btn i {
    display: none;
}

.mce-close-panel-btn button {
    background-color: transparent;
    height: 28px;
    padding: 0 6px;
    margin-right: 0;
}

.mce-close-panel-btn button:hover {
    background-color: transparent;
}

.mce-close-panel-btn button:after {
    content: '\00d7';
    // color: $primaryColor-dark;
    font-size: 20px;
}




    @media only screen and (min-width : 768px) {
        .mce-btn-group > div {
            max-width: 492px;
        }

        .mce-tinymce-inline,
        .mce-toolbar-grp {
            max-width: 492px !important;
        }
    }

    @media only screen and (max-width : 767px) {
        .mce-btn[aria-label="Insert/edit link"],
        .mce-btn[aria-label="Insert/edit image or MP3"],
        .mce-btn[aria-label="YouTube Video"],
        .mce-btn[aria-label="Special character"],
        .mce-btn[aria-label="LaTeX-Formel"],
        .mce-btn[aria-label="Table"],
        .mce-btn[aria-label="Source code"] {
            display: none;
        }
    }

*/
.mce-tinymce:not(.mce-floatpanel) {
  -webkit-box-shadow: 0px 4px 5px 4px rgba(102, 102, 102, 0.28);
  -moz-box-shadow: 0px 4px 5px 4px rgba(102, 102, 102, 0.28);
  box-shadow: 0px 4px 5px 4px rgba(102, 102, 102, 0.28);
  margin-top: 0px !important;
  position: fixed !important;
  z-index: 65534;
  left: 50% !important;
  margin-left: -233px !important;
}

.mce-close-panel-btn {
  margin-left: auto !important;
  cursor: pointer !important;
}

.mce-close-panel-btn i {
  display: none;
}

.mce-close-panel-btn {
  right: 0px;
  position: absolute;
}

.mce-close-panel-btn button {
  background-color: transparent;
  height: 28px;
  padding: 0 6px;
  margin-right: 0;
}

.mce-close-panel-btn button:hover {
  background-color: transparent;
}

.mce-close-panel-btn button:after {
  content: "×";
  font-size: 20px;
}

/*
#tinymceToolbarContainer {
    position: fixed;
    top: 30px;
    z-index: 65534;
    left: 50%;
    margin-left: -233px;
    // box-shadow: 0px 0px 10px 4px rgba(119, 119, 119, 0.75);
}
*/
.mce-tinymce.mce-tinymce-inline.mce-container.mce-panel {
  border-width: 0px !important;
}

.mce-toolbar-grp.mce-container.mce-panel, .mce-tinymce.mce-tinymce-inline.mce-container.mce-panel {
  border-radius: 10px;
}

.topbar {
  height: 40px;
  position: fixed;
  top: 0;
  z-index: 99;
}

.topbar-logo {
  margin-right: 8px;
  opacity: 0.5;
  max-height: 40px;
  max-width: 150px;
  filter: none !important;
}

.topbar-logo-link:hover .topbar-logo {
  opacity: 0.75;
}

.main-menu-mobile-toggle {
  margin: 7px 14px 0 12px;
  font-size: 20px;
  display: block;
}

.main-menu-mobile {
  position: absolute;
  top: 40px;
  font-size: 20px;
  padding: 10px 20px;
  margin: 0;
  height: calc(100vh - 40px);
  width: 300px;
  left: -420px;
  transition: left 200ms cubic-bezier(0, 0.5, 0, 1);
  overflow-y: auto;
}

.main-menu-mobile.active {
  left: 0;
}

.main-menu-mobile li {
  padding: 8px 0;
}

.main-menu-mobile a,
.main-menu-mobile button div {
  display: flex;
  align-items: center;
}

.main-menu-mobile i {
  width: 30px;
  margin-right: 6px;
  text-align: center;
  flex: 0 0 auto;
}

.main-menu-mobile span {
  flex: 0 1 auto;
}

.menu-imprint-li {
  position: absolute;
  bottom: 44px;
  left: 0;
}

.menu-more-li,
.menu-back-li {
  position: absolute;
  bottom: 0;
  left: 0;
}

.menu-dark-bg {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background: rgb(0, 0, 0);
  opacity: 0;
  z-index: 98;
  pointer-events: none;
  transition: opacity 200ms cubic-bezier(0, 0.5, 0, 1);
}

.menu-page-one {
  position: relative;
  padding-bottom: 108px;
}

.menu-page-two {
  position: relative;
  display: none;
  padding-left: 10px;
  padding-bottom: 64px;
}

.menu-dark-bg.active {
  opacity: 0.75;
}

@media only screen and (min-width: 1024px) {
  .menu-dark-bg {
    display: none;
  }
}
.main-menu {
  font-size: 16px;
  padding: 0;
}

.main-menu.left {
  display: none;
}

.main-menu li a,
.main-menu li button {
  display: block;
  padding: 10px 9px 0;
}

.main-menu i {
  font-size: 17px;
  margin-right: 6px;
}

.main-menu button i,
.main-menu button span {
  position: relative;
  top: -4px;
}

.main-menu-mobile-toggle {
  color: rgba(255, 255, 255, 0.5);
}

.main-menu-mobile-toggle.hover {
  color: rgba(255, 255, 255, 0.75);
}

.main-menu-mobile-toggle.active {
  color: rgba(255, 255, 255, 0.9);
}

.secondary-menu {
  margin: 5px 0 0;
  padding: 0;
}

.secondary-menu li {
  margin-right: 4px;
}

.secondary-menu i {
  font-size: 16px;
}

.firefox .secondary-menu i,
.iexplorer .secondary-menu i {
  position: relative;
  top: -1px;
}

.secondary-menu button {
  font-size: 0;
  vertical-align: top;
}

.secondary-menu .icon-bg {
  width: 30px;
  height: 30px;
  text-align: center;
  display: inline-block;
}

.pro-info-modal-btn span,
.free-info-modal-btn span {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.75);
}

.free-info-modal-btn.hover span {
  color: rgb(255, 255, 255);
}

.pro-info-modal-btn span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #007356;
}

.free-info-modal-btn {
  height: 30px;
}

.free-info-modal-btn span {
  padding: 10px 4px;
}

.user-menu-toggle.userpic {
  opacity: 0.7;
}

.user-menu-toggle.userpic.hover,
.user-menu-toggle.userpic.active {
  opacity: 1;
}

.secondary-menu .icon-bg {
  background: rgba(255, 255, 255, 0.4);
}

.secondary-menu button.icon-bg.hover,
.secondary-menu button.icon-bg.active {
  background: rgba(255, 255, 255, 0.7);
}

.secondary-menu .icon-bg .fa {
  color: #007356;
}

.secondary-menu .notifications-toggle.new.icon-bg,
.secondary-menu .new-discussion-posts-toggle.new.icon-bg,
.secondary-menu .activity-bar-toggle.new.icon-bg {
  background: #E95757;
}

.secondary-menu .notifications-toggle.new.icon-bg:hover,
.secondary-menu .new-discussion-posts-toggle.new.icon-bg:hover,
.secondary-menu .activity-bar-toggle.new.icon-bg:hover {
  background: #F59090;
}

.user-menu {
  display: none;
  position: absolute;
  right: 6px;
  top: 46px;
  background: white;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  font-size: 20px;
  max-height: calc(100vh - 52px);
  overflow-y: auto;
}

.user-menu ul li:first-child button div,
.user-menu ul li:first-child a {
  padding-top: 20px;
}

.user-menu ul li:last-child button div {
  padding-bottom: 20px;
}

.user-menu ul li:hover {
  color: white;
  background: #08b474;
}

.user-menu a,
.user-menu button div {
  display: flex;
  align-items: center;
  padding: 12px 20px 12px 15px;
}

.user-menu i {
  width: 30px;
  margin-right: 6px;
  text-align: center;
  flex: 0 0 auto;
}

.user-menu span {
  flex: 0 1 auto;
}

.user-menu .fa-mobile {
  font-size: 30px;
}

.user-menu .divider {
  height: 1px;
  background: rgba(0, 0, 0, 0.15);
  margin-top: 10px;
  margin-bottom: 10px;
}

@media only screen and (min-width: 1240px) {
  .main-menu.left {
    display: block;
  }
  .main-menu-mobile-toggle,
  .main-menu-mobile {
    display: none !important;
  }
}
@media only screen and (min-width: 1110px) {
  .user-menu {
    right: 0;
    font-size: 16px;
  }
  .user-menu ul li:first-child button div,
  .user-menu ul li:first-child a {
    padding-top: 15px;
  }
  .user-menu ul li:last-child button div,
  .user-menu ul li:last-child a {
    padding-bottom: 15px;
  }
  .user-menu a,
  .user-menu button div {
    padding: 8px 16px 8px 12px;
  }
  .user-menu .fa-mobile {
    font-size: 26px;
  }
}
.fa.new {
  color: #fff !important;
}

.shortInfo {
  background-color: #ffffe0;
  position: fixed;
  top: 40px;
  z-index: 65536;
  width: 100%;
  padding: 12px;
  text-align: center;
  display: none;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.upgrade-btns {
  display: flex;
  flex-direction: column;
  margin: 0 -3px;
}

.upgrade-btns.top {
  margin-bottom: 30px;
}

.upgrade-btns .btn {
  font-size: 24px;
  text-align: left;
  position: relative;
  margin: 0 3px 6px;
  flex: 1 1 auto;
}

.upgrade-btns .btn .time-period {
  float: left;
  margin-top: -4px;
}

.upgrade-btns .btn .monthly-cost {
  font-size: 14px;
  position: absolute;
  left: 15px;
  top: 36px;
}

.upgrade-btns .btn .price {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 100;
  font-size: 40px;
  float: right;
  margin-top: 10px;
}

.upgrade-btns .btn .euro-sign {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 24px;
  margin-left: 2px;
  position: relative;
  top: -1px;
}

@media only screen and (min-width: 768px) {
  .upgrade-btns {
    flex-direction: row;
  }
  .upgrade-btns .btn {
    margin: 0 3px;
  }
}
.repetico-feature-table {
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.repetico-feature-table .row {
  display: flex;
  align-items: center;
  background: white;
  margin-bottom: 1px;
  min-height: 60px;
  padding: 12px 0;
}

.repetico-feature-table .feature {
  margin-right: 30px;
  flex: 1;
}

.repetico-feature-table i {
  text-align: center;
  width: 80px;
  font-size: 28px;
  color: #ccc;
  flex: none;
}

.repetico-feature-table i.fa-mobile {
  font-size: 50px;
  top: 16px;
}

.repetico-feature-table i.fa-envelope,
.repetico-feature-table i.fa-archive {
  font-size: 32px;
  top: 25px;
}

.repetico-feature-table .check,
.repetico-feature-table .no-check {
  width: 20%;
  flex: 0 1 auto;
  text-align: center;
  margin-right: 15px;
}

.repetico-feature-table .check {
  color: #08b474;
  font-size: 20px;
}

.repetico-feature-table .check .fa-check {
  font-size: 28px;
  color: rgba(8, 180, 116, 0.8);
}

.repetico-feature-table.basic-features .feature,
.repetico-feature-table.pro-features .feature {
  margin-right: 15px;
}

.repetico-feature-table.basic-features {
  margin-bottom: 30px;
}

.upgrade-now-text {
  margin-top: 40px;
  margin-bottom: 12px;
  font-size: 20px;
}

.welcome {
  margin-top: 30px;
  margin-bottom: 40px;
  padding-left: 6px;
}

.welcome .big-hl {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 28px;
  color: #666;
}

.welcome .sub-hl {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 28px;
}

.welcome .explanation,
.old-repetico-text {
  margin-top: 50px;
}

.welcome .strong {
  font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
  color: #555;
  margin: 0 3px 0 5px;
}

.welcome .strong i {
  margin-right: 3px;
}

@media only screen and (min-width: 768px) {
  .welcome {
    margin-top: 40px;
    margin-bottom: 50px;
  }
  .welcome .big-hl {
    font-size: 40px;
  }
}
body {
  overflow-x: hidden;
}

html, textarea {
  font-size: 1em;
}

.card-set-legend {
  height: 564px !important;
}

.cardset-info a {
  color: #08b474;
}

.cardset-tools {
  min-width: 260px;
}

/*.mce-widget.mce-tooltip {
    display: none !important;
}*/
.btn.primary-color-light {
  color: rgb(255, 255, 255) !important;
}

.lp-days-container.intro .intro-text {
  color: #fff;
}

.btn.primary-color-light:not(.no-touch-hover):not(.red):hover, .btn.primary-color-light.hover, .btn.primary-color-light:focus {
  background: #079b64;
}

@media only screen and (min-width: 1240px) {
  .topbar-logo {
    opacity: 1 !important;
    left: 10px;
    position: fixed;
  }
}
@media only screen and (max-width: 1240px) {
  .topbar-logo {
    opacity: 1 !important;
    left: 0px;
    position: relative;
  }
}
@media only screen and (max-width: 330px) {
  .topbar-logo {
    display: none;
  }
}
@media only screen and (max-width: 512px) {
  .content-module-top {
    display: block !important;
  }
  .content-module-top .select-style {
    margin-bottom: 10px;
  }
  .content-module-top .module-hl {
    margin-bottom: 10px;
  }
}
/*@media only screen and (min-width: 512px) {
    .content-module-top {
        display: flex;
    }
}*/
.main-menu a, .main-menu button, .main-menu span {
  font-size: 0.95em;
  margin-right: 1em;
}

.main-menu-li a, .main-menu-li button, .main-menu-li span {
  color: rgba(255, 255, 255, 0.9) !important;
}

.main-menu-lo a, .main-menu-lo button, .main-menu-lo span {
  color: #08b474 !important;
  font-weight: 500;
}

.main-menu.left {
  margin-left: 19%;
}

@media only screen and (min-width: 1024px) {
  .notifications, .new-discussion-posts {
    right: 0px !important;
    position: fixed !important;
  }
}
.secondary-menu.right {
  right: 10px;
  position: fixed;
}

@media only screen and (min-width: 1024px) {
  .page-container-inner {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 1100px) {
  .page-container-inner {
    margin-top: 20px;
  }
  .page-container {
    margin: 0 10px;
  }
}
.main-menu a.active {
  border-bottom: 2px solid rgba(255, 255, 255, 0.9);
}

.pro-info-modal-btn span, .free-info-modal-btn span {
  color: rgba(255, 255, 255, 0.9) !important;
}

.secondary-menu .icon-bg .fa {
  color: rgba(255, 255, 255, 0.9) !important;
}

.secondary-menu .icon-bg {
  background: transparent !important;
}

.secondary-menu .notifications-toggle.new.icon-bg,
.secondary-menu .new-discussion-posts-toggle.new.icon-bg,
.secondary-menu .activity-bar-toggle.new.icon-bg {
  background: #E95757 !important;
}

#public-box-warning {
  padding-left: 30px !important;
}

input[type=text], input[type=number], input[type=password], input[type=email] {
  border-bottom: 2px solid #08b474 !important;
  background: transparent !important;
}

.easy-autocomplete input {
  border-top: 0px !important;
  border-left: 0px !important;
  border-right: 0px !important;
  box-shadow: none !important;
}

.light .intro .lp-day.past .bg {
  background-color: #fff;
}

.light .lp-day.future .bg {
  background-color: #fff;
}

.light .learnplan-elements {
  background-color: #fff;
}

.light body {
  background: #f9faff !important;
}

.lp-days-container.intro .lp-day {
  opacity: 1 !important;
}

.light .lp-day.lp-today .weekday {
  color: #fff !important;
}

.light .lp-today .card-quantity.started-learning {
  color: #fff !important;
}

.lp-today .cards-remaining {
  color: #fff !important;
}

#lernen {
  border: 0px;
}

@media only screen and (max-width: 767px) {
  .progression-btns-container .btn {
    border-radius: 0px;
  }
}
.bg.w100.h75 {
  background: #08b474 !important;
}

div.lp-day:nth-child(7) {
  background: #08b474 !important;
}

.user-menu,
.content-box,
.w100.h100.bg,
.card-set-legend,
.kartensatz-block,
.discussion-block,
.discussion-post,
.select-style,
.lp-bar,
.learnplan-elements,
.notice,
.btn,
#public-box-warning,
#cardsetsFilterText,
.stats-container,
.settings-block,
.modal,
.top-info .general-infos,
.top-info .rights,
.cardset-info .description,
.discussion-block.cardset-discussion .bg,
.repetico-advantages,
.topic,
.repetico-feature-table,
.news-module {
  border-radius: 10px;
  /* border: 1px solid #ebeef5; */
  border: 0px;
}

.darkmode .user-menu,
.darkmode .content-box,
.darkmode .w100.h100.bg,
.darkmode .card-set-legend,
.darkmode .kartensatz-block,
.darkmode .discussion-block,
.darkmode .discussion-post,
.darkmode .select-style,
.darkmode .lp-bar,
.darkmode .learnplan-elements,
.darkmode .notice,
.darkmode .btn,
.darkmode #public-box-warning,
.darkmode #cardsetsFilterText,
.darkmode .stats-container,
.darkmode .settings-block,
.darkmode .modal,
.darkmode .top-info .general-infos,
.darkmode .top-info .rights,
.darkmode .cardset-info .description,
.darkmode .discussion-block.cardset-discussion .bg,
.darkmode .repetico-advantages,
.darkmode .topic,
.darkmode .repetico-feature-table,
.darkmode .news-module {
  border: none;
}
.darkmode .lp-days-container {
  border: none;
}
.darkmode .darkmode .lp-days-container {
  border: none;
}
.darkmode #cardset-tools-block {
  background-color: #222;
}
.darkmode .sideblockBox {
  background: #222;
}
.darkmode .card-quantity.w100.started-learning {
  color: #fff;
}
.darkmode .weekday.w100 {
  color: #fff;
}
.darkmode .cardset-tab, .darkmode .light .page-nav a {
  background-color: #222 !important;
  color: #bbb !important;
}
.darkmode .page-nav.phone-flush {
  border: none;
}
.darkmode .day {
  border: 1px solid #222;
}
.darkmode .card-tag {
  background: inherit;
}
.darkmode .user-display .username {
  color: #bbb;
}
.darkmode .topics .topic:hover {
  background: #444242;
}
.darkmode .card.one-line,
.darkmode .page-nav {
  border: 1px solid #575757;
}

.page-container.wide {
  width: 1340px !important;
}

.kartensatz-block.kartensatz-block-mini {
  max-width: 360px !important;
}

.page-nav > :first-child, .discussion-post .user-info-box {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 0px !important;
}

.page-nav > :last-child, .discussion-post .content-box {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 0px !important;
}

.card.one-line,
.page-nav {
  border: 1px solid #ebeef5;
}

.card.one-line .mchoice-checkbox {
  float: left;
  margin: 1px 5px 1px 1px;
}

.page-nav {
  border-radius: 10px 10px 0px 0px !important;
  box-shadow: none !important;
}

.page-kartensatz .page-nav {
  margin-bottom: 0px !important;
}

@media only screen and (min-width: 1024px) {
  .light.page-kartensatz .top-part {
    padding: 10px;
    background: #f1f4fb;
    border-radius: 0px 0px 10px 10px !important;
  }
  .darkmode.page-kartensatz .top-part {
    padding: 10px;
    background: #222;
    border-radius: 0px 0px 10px 10px !important;
  }
}
.lp-days-container {
  border-top: 0px solid #ebeef5;
  border-left: 0px solid #ebeef5;
  border-right: 0px solid #ebeef5;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

.kartensatz-block,
.learnplan-elements,
.light .lp-day .bg {
  border: 0px;
}

.lp-bar {
  border-top: 0px;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
}

.notifications-header,
.new-discussion-posts-header,
.discussion-block.card-discussion .card,
.discussion-block .content-area .card.one-line .question,
.repetico-feature-table :first-child {
  border-radius: 10px 10px 0px 0px;
}

.notifications-content,
.new-discussion-posts-content,
.discussion-block.card-discussion .bg,
.repetico-feature-table :last-child {
  border-radius: 0px 0px 10px 10px;
}

.page-nav > :first-child,
.discussion-post .user-info-box {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

.page-nav > :last-child,
.discussion-post .content-box {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.topbar {
  height: 50px !important;
  padding-top: 5px;
}

.topbar-li {
  background: rgba(6, 159, 101, 0.8980392157) !important;
}

.topbar-lo {
  background: #f9faff !important;
  box-shadow: none !important;
}

.main-menu-mobile-toggle-lo {
  color: #08b474 !important;
}

.btn.folder-btn,
.btn.active,
.notice,
.topbar {
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.learnplan .learn-btn {
  height: 100%;
  background: #07aa6d !important;
}

.learnplan .learn-btn:hover {
  background: #038e5b !important;
}

.kartensatz-block.kartensatz-block-mini, .kartensatz-block-mini .w100.h100.bg {
  border-radius: 10px;
}

#cardset-tools-2 {
  max-width: 250px;
}

.js-activeCardsetsButton {
  border-radius: 10px 0px 0px 10px;
}

.js-inactiveCardsetsButton {
  border-radius: 0px 10px 10px 0px;
}

.light {
  /*    .jquery-modal.blocker {
          opacity: 0.5 !important;
      }*/
}
.light .correct-answer,
.light .categoryNames,
.light .main-menu-mobile,
.light .mce-container button,
.light .mce-panel.mce-menu,
.light input,
.light .answer, .light .answer-bg,
.light .learn-card.edit-mode .answer-wrong,
.light .editor-discussion-text,
.light .search-box .search-input,
.light .new-cardset .editor-cardset-description,
.light .sidebar,
.light #recommend-cardbox-modal textarea,
.light .page-nav button,
.light .modal,
.light footer {
  background: #ebeef5 !important;
}
.light .modal {
  box-shadow: rgba(0, 0, 0, 0.67) 0px 0px 40px 0px;
}

.darkmode .correct-answer,
.darkmode .categoryNames,
.darkmode .main-menu-mobile,
.darkmode .mce-container button,
.darkmode .mce-panel.mce-menu,
.darkmode input,
.darkmode .intro .lp-day.past .bg,
.darkmode .answer, .darkmode .answer-bg,
.darkmode .learn-card.edit-mode .answer-wrong,
.darkmode .editor-discussion-text,
.darkmode .search-box .search-input,
.darkmode .new-cardset .editor-cardset-description,
.darkmode .sidebar,
.darkmode #recommend-cardbox-modal textarea,
.darkmode .page-nav button,
.darkmode footer {
  background: #222 !important;
}
.darkmode .modal {
  background: #222 !important;
}
.darkmode .cardset-tab.active {
  color: #fff !important;
  background: #08b474 !important;
}

.bright-link.friends-block-action, .bright-link.study-target-block-action {
  font-size: 0.8em;
  margin-right: 10px;
}

.sideblock {
  width: 280px;
  float: right;
  right: auto;
  box-shadow: none;
  z-index: 1;
  position: relative;
  border-radius: 10px;
}

.sideblockBox {
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  width: 100%;
  background: white;
  padding: 20px;
  border-radius: 10px;
  margin-top: 50px;
}

#cardset-tools-block {
  background: #f1f4fb;
  height: 120px;
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 20px;
}

.card, .correct-answer {
  font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.cardset-tab:not(.active), .light .page-nav a:not(.active), .light .page-nav button:not(.active) {
  background-color: #fff !important;
}

.cardset-tab {
  color: #666 !important;
}

.cardset-tab.active, .light .page-nav a.active, .light .page-nav button.active {
  color: #fff !important;
  background: #08b474 !important;
}

.darkmode .page-nav a.active, .darkmode .page-nav button.active {
  color: #fff !important;
  background: #08b474 !important;
}

.darkmode .page-nav a, .darkmode .page-nav button, .darkmode .bg, .darkmode .shortInfo, .darkmode .categoryNames, .darkmode .settings-container {
  background: #222 !important;
}

.page-nav i {
  font-size: 1em !important;
}

.btn.grey-light, .mce-container button, .mce-panel.mce-menu {
  background: transparent !important;
  color: #009d75 !important;
  border: 0px !important;
}

.mce-toolbar-grp.mce-container.mce-panel {
  background: #f1f4fb !important;
}

.mce-btn-group .mce-btn {
  border-color: #ebeef5 !important;
  border-width: 0px !important;
}

.targetDate {
  background-color: #00B688 !important;
}

#intervalPresets {
  margin-bottom: 20px;
}

.light .bright-link {
  color: #009d75 !important;
}

.calendarhistory {
  font-size: 0.9em;
  color: green;
  background-color: lightgreen;
  border-radius: 10px;
}

#couponInfo {
  margin-top: 5px;
  color: green;
  background-color: lightyellow;
  padding: 10px;
  border-radius: 10px;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  display: block;
}

.sortable .card-wrapper::before, .sortable .card-wrapper::after {
  margin-left: 4px;
}

.tagsinput {
  height: 44px !important;
}

@media only screen and (min-width: 1340px) {
  .sidebar {
    right: 0px !important;
  }
}
@media only screen and (min-width: 1340px) {
  .sidebar {
    z-index: 97 !important;
  }
}
@media only screen and (min-width: 1340px) {
  .learnplan .lp-bar {
    display: none !important;
  }
  .learnplan .lp-bar-switcher {
    display: none !important;
  }
  .learnplan .lp-bar .day.learned {
    background: #08b474;
    background: #106a49;
  }
}
.card-tag {
  border: 1px solid #eaeaea;
  margin: 2px;
  border-radius: 20px;
  display: inline-block;
  padding: 10px;
  background: #fff;
  font-size: 0.9em;
}

.card-tag:hover {
  border: 1px solid transparent;
  color: #fff;
  background-color: #08b474;
}

.user-menu {
  position: fixed !important;
  top: 50px !important;
  background-color: rgba(255, 255, 255, 0.94);
}

.light .card-type button.active[disabled], .light button.active[disabled] {
  font-weight: 700;
  color: #555 !important;
}

@media only screen and (min-width: 1340px) {
  .page-container.alwaysWide {
    width: 1340px;
  }
}
@media only screen and (min-width: 1340px) and (max-width: 1740px) {
  .page-container.sometimesWide {
    width: 1340px;
  }
}
.shop-topic-area {
  padding: 15px;
  margin: 20px 5px 30px 5px;
  background: #f1f4fb !important;
  border-radius: 10px;
  color: #009d75 !important;
  font-size: 1.1em;
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
}

.main-statistics-part {
  height: 207px;
  position: relative;
  flex: 6 0 0%;
}

.main-statistics-part-more-link {
  position: absolute;
  bottom: 6px;
  right: 10px;
}

.main-statistics-block {
  box-shadow: rgba(100, 100, 111, 0.3) 0px 7px 29px 0px;
  border-radius: 10px;
}

.statistics-bar-switcher {
  position: relative;
}

.statistics-bar-switcher button {
  position: absolute;
  right: 10px;
  top: 6px;
  z-index: 1;
  font-size: 0.9em;
}

.statistics-bar-show-btn {
  color: #aaa;
}

@media only screen and (max-width: 866px) {
  .main-statistics-block {
    display: none;
  }
}
@media only screen and (min-width: 866px) {
  .main-statistics-block {
    display: flex;
  }
}
@media only screen and (max-width: 1340px) {
  .sideblock {
    display: none;
  }
}
/*
.cardsetsSubsetButton.active {
    background: white !important;
    border: 2px solid #00B688;
    color: #00B688 !important;
}
*/
/*
input[type="text"], input[type="number"], input[type="password"], input[type="email"] {
    border-bottom: 3px solid grey;
}
.light input {
    background: #f3f3f3;
    color: #777;
}
*/

/*# sourceMappingURL=repetico2021.css.map */