:root {
  --main_color: #f47721;
  --main_color_light: #ffa200;
  --main_color_dark: #de7704;
  --main_color_contrast_light: #0b88de;
  --main_color_contrast_dark: #1d398c;
  --main_color_contrast_ultra_dark: #28646a;
  --nav_background: #282630;
  --sidebar_background: #282630;
  --header_background: #282630;
  --bg1: #e9f0f099;
  --bg2: #dfe4e599;
  --bg3: #f0f4f4;
  --invalid: red;
  --valid: #d7fa96;
  --untouched: #fff;
  --midwhite: #fcfcfc;
  --darkwhite: #f0f0f0;
  --lightgrey: lightgray;
  --midgrey: grey;
  --grey: #545454;
  --darkgrey: #282630;
  --green: #20e620;
  --darkgreen: green;
  --blue: #0b88de;
  --darkblue: #1d398c;
  --red: #ff0202;
  --darkred: #a53f3f;
  --yellow: #f9ff00;
  --darkyellow: #d08d31;
}

/** mixin lib
 * mixins can be included to shorten scss
 * no need of prefixes like "-moz" or "-webkit"
 * examples over each mixin below show the usage in scss
 */
/* stylelint-disable */
/* stylelint-enable */
rf-dialog-about {
  padding: 20px;
}
rf-dialog-about rf-markdown {
  text-align: left;
  padding-left: 20px;
}
rf-dialog-about rf-markdown h1 {
  color: var(--main_color);
}
rf-dialog-about rf-markdown h2 {
  color: var(--midgrey);
}

rf-dialog-confirm button {
  width: 100%;
  height: 35px;
}
rf-dialog-confirm button:focus, rf-dialog-confirm button:hover {
  font-weight: bold;
  font-size: 17px;
}

rf-confirm .grey-layer {
  z-index: 9500 !important;
  position: fixed;
  z-index: 9100;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background-color: grey;
  opacity: 0;
  opacity: 0.8;
}
rf-confirm .box {
  z-index: 9600 !important;
  min-height: 200px;
  height: auto !important;
  position: fixed;
  z-index: 9300;
  display: block;
  text-align: center;
  margin: 0 auto;
  box-shadow: none;
  top: 15vh;
  position: fixed;
  z-index: 9300;
  display: block;
  text-align: center;
  margin: 0 auto;
  box-shadow: none;
  top: 15vh;
}
@media (min-width: 100px) and (max-width: 991px) {
  rf-confirm .box {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
  }
}
@media (max-width: 991px) {
  rf-confirm .box {
    width: 90%;
    left: 5%;
  }
}
@media (min-width: 992px) and (max-width: 1399px) {
  rf-confirm .box {
    width: 60%;
    left: 20%;
  }
}
@media (min-width: 1400px) {
  rf-confirm .box {
    width: 40%;
    left: 30%;
  }
}
rf-confirm .dialog-container {
  overflow-y: auto;
  width: 100%;
  margin: 0;
  padding-bottom: 30px;
  background: white;
  position: absolute;
  left: 0;
  right: 0;
  max-height: 80vh;
}
rf-confirm .header {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  background: var(--midwhite);
  height: 40px;
  padding-left: 10px;
  padding-right: 10px;
  text-align: left;
  color: var(--midgrey);
  font-weight: bold;
  font-size: 19px;
  line-height: 40px;
}
rf-confirm .header .actions {
  float: right;
}
rf-confirm .header .actions .rf-btn {
  line-height: 21px;
  font-size: 21px;
}

rf-dialog .rf-dialog .dialog-container {
  overflow-y: auto;
  width: 100%;
  margin: 0;
  padding-bottom: 30px;
  background: white;
  position: absolute;
  left: 0;
  right: 0;
  max-height: 80vh;
}
rf-dialog .rf-dialog .header {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  background: var(--midwhite);
  height: 40px;
  padding-left: 10px;
  padding-right: 10px;
  text-align: left;
  color: var(--midgrey);
  font-weight: bold;
  font-size: 19px;
  line-height: 40px;
}
rf-dialog .rf-dialog .header .actions {
  float: right;
}
rf-dialog .rf-dialog .header .actions .rf-btn {
  line-height: 21px;
  font-size: 21px;
}
rf-dialog .rf-dialog .grey-layer {
  position: fixed;
  z-index: 9100;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background-color: grey;
  opacity: 0;
  opacity: 0.8;
}
rf-dialog .rf-dialog .dialog-child .box {
  z-index: 9500;
}
rf-dialog .rf-dialog .dialog-child .grey-layer {
  z-index: 9400;
}
rf-dialog .rf-dialog .box {
  position: fixed;
  z-index: 9300;
  display: block;
  text-align: center;
  margin: 0 auto;
  box-shadow: none;
  top: 15vh;
}
@media (min-width: 768px) and (max-width: 991px) {
  rf-dialog .rf-dialog .box.small {
    width: 60%;
    left: 20%;
  }
}
@media (min-width: 992px) and (max-width: 1399px) {
  rf-dialog .rf-dialog .box.small {
    width: 40%;
    left: 30%;
  }
}
@media (min-width: 1400px) {
  rf-dialog .rf-dialog .box.small {
    width: 20%;
    left: 40%;
  }
}
@media (max-width: 991px) {
  rf-dialog .rf-dialog .box {
    width: 90%;
    left: 5%;
  }
}
@media (min-width: 992px) and (max-width: 1399px) {
  rf-dialog .rf-dialog .box {
    width: 60%;
    left: 20%;
  }
}
@media (min-width: 1400px) {
  rf-dialog .rf-dialog .box {
    width: 40%;
    left: 30%;
  }
}
rf-dialog .rf-dialog .box.medium {
  width: 60%;
  left: 20%;
  top: 5vh;
}
rf-dialog .rf-dialog .box.medium .dialog-container {
  max-height: 90vh;
}
@media (max-width: 1399px) {
  rf-dialog .rf-dialog .box.medium {
    width: 90%;
    left: 5%;
  }
}
@media (min-width: 1400px) {
  rf-dialog .rf-dialog .box.medium {
    width: 60%;
    left: 20%;
  }
}
rf-dialog .rf-dialog .box.large {
  width: 90%;
  left: 5%;
  top: 3vh;
}
rf-dialog .rf-dialog .box.large .dialog-container {
  max-height: 90vh;
}
rf-dialog .rf-dialog .box.max {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
rf-dialog .rf-dialog .box.max dialog-body {
  background: white;
  bottom: 0;
  position: fixed;
  top: 34px;
  left: 0;
  padding: 10px;
}
rf-dialog .rf-dialog .box.max.header-hidden dialog-body {
  top: 0;
  padding: 0;
}
rf-dialog .rf-dialog .box.maxheader {
  top: 0;
  bottom: 0;
}
@media (min-width: 100px) and (max-width: 768px) {
  rf-dialog .rf-dialog .active .box {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
  }
  rf-dialog .rf-dialog .active .box.small, rf-dialog .rf-dialog .active .box.medium, rf-dialog .rf-dialog .active .box.large {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
  }
}
rf-dialog .dialog-left-container {
  height: 100%;
  margin-top: 5px;
  padding-left: 30px;
}
rf-dialog .dialog-left-container.scroll {
  overflow-y: auto;
}
rf-dialog .dialog-right-col {
  border-left: 2px solid gray;
  height: 100%;
}
rf-dialog .dialog-right-col .upper-container {
  position: absolute;
  top: 0;
  bottom: 70px;
  overflow-y: auto;
  padding-right: 15px;
  right: 15px;
  left: 15px;
}
rf-dialog .dialog-right-col .lower-container {
  position: absolute;
  bottom: 0;
  left: 15px;
  right: 25px;
  height: 60px;
  padding-top: 5px;
  border-top: 1px solid var(--midgrey);
}
rf-dialog .dialog-right-col .lower-container .rf-btn {
  width: 100%;
}

rf-action-select {
  display: block;
  --height: 30px;
  font-size: 12px;
}
rf-action-select.dark .select-row {
  background: var(--main_color_contrast_ultra_dark);
  color: white;
}
rf-action-select.dark .select-row:hover {
  color: var(--main_color);
}
rf-action-select.dark .select-row.first {
  border-color: var(--main_color_contrast_ultra_dark);
}
rf-action-select.dark .select-btn {
  background: white;
  color: var(--main_color);
}
rf-action-select.inverted .select-row {
  background: var(--main_color);
  color: white;
}
rf-action-select.inverted .select-row:hover {
  color: var(--main_color);
}
rf-action-select.inverted .select-btn {
  background: white;
  color: var(--main_color);
}
rf-action-select.minimum-btn .select-row {
  min-height: 20px;
  padding: 1px 5px;
}
rf-action-select.small-btn .select-row {
  min-height: 20px;
  padding: 1px 5px;
}
rf-action-select.round-btn .select-row {
  min-height: 24px;
  padding: 2px 5px;
}
rf-action-select.round-btn .select-row.first {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  border-color: var(--lightgrey);
}
rf-action-select.round-btn .select-row.first.full {
  border-radius: 10px;
}
rf-action-select.round-btn .select-btn {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  border-color: var(--lightgrey);
}
rf-action-select.round-btn .lower-select-container {
  width: max-content;
}
rf-action-select .action-select-xs-handler.rf-btn.rf-btn-inverted {
  margin: 0;
}
rf-action-select .select-container.hidden {
  display: none;
}
rf-action-select .upper-select-container {
  width: 100%;
  position: relative;
  min-height: var(--height);
  min-width: 50px;
}
rf-action-select .select-row {
  min-height: 20px;
  padding: 5px 5px;
  background: white;
  color: var(--main_color);
  float: right;
  border-radius: 0;
}
rf-action-select .select-row:hover {
  background: var(--darkwhite);
}
rf-action-select .select-row.first {
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
  border: 1px solid var(--main_color);
  display: flex;
  justify-content: start;
  align-items: center;
  position: absolute;
  top: 0;
  left: var(--height);
  right: 0;
  bottom: 0;
  font-size: 100%;
  min-width: max-content;
}
rf-action-select .select-row.first.full {
  border-radius: 5px;
  left: 0;
}
rf-action-select .select-btn {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: var(--height);
  height: 100%;
  margin: 0 0 0 0;
  float: left;
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  background: white;
  color: var(--main_color);
  border: 1px solid var(--main_color);
}
rf-action-select .select-btn:hover {
  margin: 0 0 0 0 !important;
  border-color: var(--main_color) !important;
}
rf-action-select .select-btn .rf-bars {
  font-size: 65%;
}
rf-action-select .lower-select-container {
  width: 100%;
  z-index: 99;
  position: absolute;
  right: 0;
  top: var(--height);
  overflow: auto;
  background: white;
  border-radius: 10px;
  border: 1px solid var(--midgrey);
}
rf-action-select .lower-select-container.inverted {
  top: auto;
  bottom: 28px;
}
rf-action-select .lower-select-container .inner-select-container {
  width: 100%;
}
rf-action-select .lower-select-container .bold {
  font-weight: bold;
}
rf-action-select .lower-select-row {
  width: 100%;
  min-height: 20px;
  padding: 5px 15px;
  color: var(--grey);
  float: left;
  cursor: pointer;
}
rf-action-select .lower-select-row:hover {
  background: var(--darkwhite);
  color: var(--main_color);
}
rf-action-select .lower-select-row-icons {
  width: 100%;
  min-height: 20px;
  padding: 10px;
  float: left;
  border-bottom: 1px solid var(--lightgrey);
}
rf-action-select .lower-select-row-icons .rf-btn {
  font-size: 150%;
  width: min-content;
  float: left;
  margin: 0;
}
rf-action-select .lower-select-row-icons .rf-btn:hover {
  margin: 0;
}
rf-action-select .lower-select-row-icons .right {
  float: right;
}
rf-action-select .disabled {
  color: var(--lightgrey);
  cursor: default;
}
rf-action-select .disabled:hover {
  background: white;
}

rf-overlay {
  /* .small .box{ } this is the default */
}
rf-overlay .box {
  position: fixed;
  z-index: 9300;
  width: 40%;
  top: 0;
  display: block;
  text-align: center;
  background: white;
  margin: 0 auto;
  left: 35%;
  transition: all 0.15s ease-in-out;
  opacity: 0;
  padding: 5%;
}
rf-overlay .box.big {
  width: 80%;
  left: 10%;
}
rf-overlay .box.middle {
  width: 60%;
  left: 20%;
}
rf-overlay .box .message {
  font-size: 200%;
}
rf-overlay .grey-layer {
  position: fixed;
  z-index: 9100;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background-color: var(--midgrey);
  opacity: 0;
  transition: all 0.15s ease-in-out;
}
rf-overlay .active .box {
  transition: all 0.15s ease-in-out;
  opacity: 1;
  top: 15%;
}
rf-overlay .active .grey-layer {
  transition: all 0.15s ease-in-out;
  opacity: 0.8;
}

rf-policy-link .privacy-info {
  position: fixed;
  width: 100%;
  color: grey;
  bottom: 35px;
}
rf-policy-link .privacy-info i {
  position: absolute;
  left: 7px;
  top: 1.5px;
  font-size: 10px;
}
rf-policy-link .privacy-info a {
  color: grey;
  position: absolute;
  left: 20px;
  top: 0;
  font-size: 12px;
  line-height: 14px;
  text-decoration: none;
  cursor: pointer;
}

rf-upload-zone {
  display: block;
  position: relative;
  width: 100%;
}
rf-upload-zone input.hidden {
  display: none;
}
rf-upload-zone .hidden-drop-layer {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99999999999;
  background: var(--lightgrey);
  opacity: 0.4;
  display: none;
}
rf-upload-zone.default-style {
  border: dashed 2px var(--grey);
  border-radius: 15px;
}
rf-upload-zone.default-style .files-select {
  color: var(--main_color);
  cursor: pointer;
}

rf-login-menu {
  display: block;
  position: relative;
}
rf-login-menu .login-menu-top {
  float: right;
  background: #fff;
  height: 40px;
  display: block;
  color: var(--main_color_light);
  height: 40px;
  line-height: 40px;
}
rf-login-menu .fa.fa-power-off.switch-icon:hover {
  color: var(--main_color);
}
rf-login-menu .dropdown p {
  padding-left: 12.5px;
  padding-right: 12.5px;
  margin: 0;
}
rf-login-menu .dropdown:hover .dropdown-menu, rf-login-menu .dropdown:hover .login-menu-menu {
  display: block;
  left: auto;
  right: 0;
  top: 95%;
  margin-top: 2px;
}
rf-login-menu .dropdown:hover .dropdown-menu > li:hover, rf-login-menu .dropdown:hover .login-menu-menu > li:hover {
  background: #fff;
}
rf-login-menu .dropdown:hover .dropdown-menu > li:hover > a, rf-login-menu .dropdown:hover .login-menu-menu > li:hover > a {
  background: lightgrey;
}
rf-login-menu .dropdown:hover .dropdown-menu > li:hover > a.user-data, rf-login-menu .dropdown:hover .login-menu-menu > li:hover > a.user-data {
  background: #fff;
}
rf-login-menu .login-menu-menu {
  position: absolute;
  right: 0px;
  top: 34px;
  border: 1px solid gray;
  padding: 0;
  display: none;
  border-radius: 0;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  padding: 0 !important;
}
rf-login-menu .login-menu-menu > li {
  background: #fff;
  border-bottom: 1px solid #ccc;
}
rf-login-menu .login-menu-menu > li .user_data {
  color: grey;
}
rf-login-menu .login-menu-menu li {
  list-style: none;
  font-size: 14px;
  min-width: 200px;
  background: white;
  line-height: 35px;
  position: relative;
  border-bottom: 1px solid lightgray;
}
rf-login-menu .login-menu-menu li a {
  color: black;
  display: block;
  width: 100%;
  height: 100%;
  padding-left: 35px;
}
rf-login-menu .login-menu-menu li:hover {
  background: grey;
}
rf-login-menu .login-menu-menu li .fa {
  line-height: 24px;
  position: absolute;
  font-size: 18px;
  float: none;
  left: 5px;
  width: 24px;
  text-align: center;
  color: black;
  padding: 6px 0;
  margin: 0;
}

.alert {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px;
}

.alert h4 {
  margin-top: 0;
  color: inherit;
}

.alert .alert-link {
  font-weight: bold;
}

.alert p,
.alert ul {
  margin-bottom: 0;
}

.alert p + p {
  margin-top: 5px;
}

.alert-dismissable,
.alert-dismissible {
  padding-right: 35px;
}

.alert-dismissable .close,
.alert-dismissible .close {
  position: relative;
  top: -2px;
  right: -21px;
  color: inherit;
}

.alert-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}

.alert-success hr {
  border-top-color: #c9e2b3;
}

.alert-success .alert-link {
  color: #2b542c;
}

.alert-info {
  background-color: #d9edf7;
  border-color: #bce8f1;
  color: #31708f;
}

.alert-info hr {
  border-top-color: #a6e1ec;
}

.alert-info .alert-link {
  color: #245269;
}

.alert-warning {
  background-color: #fcf8e3;
  border-color: #faebcc;
  color: #8a6d3b;
}

.alert-warning hr {
  border-top-color: #f7e1b5;
}

.alert-warning .alert-link {
  color: #66512c;
}

.alert-danger {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}

.alert-danger hr {
  border-top-color: #e4b9c0;
}

.alert-danger .alert-link {
  color: #843534;
}

.row {
  margin-left: -15px;
  margin-right: -15px;
}

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

.row::after {
  clear: both;
}

.col-lg-1,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}

.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
  float: left;
}

.col-xs-1 {
  width: 8.3333333333%;
}

.col-xs-2 {
  width: 16.6666666667%;
}

.col-xs-3 {
  width: 25%;
}

.col-xs-4 {
  width: 33.3333333333%;
}

.col-xs-5 {
  width: 41.6666666667%;
}

.col-xs-6 {
  width: 50%;
}

.col-xs-7 {
  width: 58.3333333333%;
}

.col-xs-8 {
  width: 66.6666666667%;
}

.col-xs-9 {
  width: 75%;
}

.col-xs-10 {
  width: 83.3333333333%;
}

.col-xs-11 {
  width: 91.6666666667%;
}

.col-xs-12 {
  width: 100%;
}

.col-xs-pull-0 {
  right: auto;
}

.col-xs-pull-1 {
  right: 8.3333333333%;
}

.col-xs-pull-2 {
  right: 16.6666666667%;
}

.col-xs-pull-3 {
  right: 25%;
}

.col-xs-pull-4 {
  right: 33.3333333333%;
}

.col-xs-pull-5 {
  right: 41.6666666667%;
}

.col-xs-pull-6 {
  right: 50%;
}

.col-xs-pull-7 {
  right: 58.3333333333%;
}

.col-xs-pull-8 {
  right: 66.6666666667%;
}

.col-xs-pull-9 {
  right: 75%;
}

.col-xs-pull-10 {
  right: 83.3333333333%;
}

.col-xs-pull-11 {
  right: 91.6666666667%;
}

.col-xs-pull-12 {
  right: 100%;
}

.col-xs-push-0 {
  left: auto;
}

.col-xs-push-1 {
  left: 8.3333333333%;
}

.col-xs-push-2 {
  left: 16.6666666667%;
}

.col-xs-push-3 {
  left: 25%;
}

.col-xs-push-4 {
  left: 33.3333333333%;
}

.col-xs-push-5 {
  left: 41.6666666667%;
}

.col-xs-push-6 {
  left: 50%;
}

.col-xs-push-7 {
  left: 58.3333333333%;
}

.col-xs-push-8 {
  left: 66.6666666667%;
}

.col-xs-push-9 {
  left: 75%;
}

.col-xs-push-10 {
  left: 83.3333333333%;
}

.col-xs-push-11 {
  left: 91.6666666667%;
}

.col-xs-push-12 {
  left: 100%;
}

.col-xs-offset-0 {
  margin-left: 0;
}

.col-xs-offset-1 {
  margin-left: 8.3333333333%;
}

.col-xs-offset-2 {
  margin-left: 16.6666666667%;
}

.col-xs-offset-3 {
  margin-left: 25%;
}

.col-xs-offset-4 {
  margin-left: 33.3333333333%;
}

.col-xs-offset-5 {
  margin-left: 41.6666666667%;
}

.col-xs-offset-6 {
  margin-left: 50%;
}

.col-xs-offset-7 {
  margin-left: 58.3333333333%;
}

.col-xs-offset-8 {
  margin-left: 66.6666666667%;
}

.col-xs-offset-9 {
  margin-left: 75%;
}

.col-xs-offset-10 {
  margin-left: 83.3333333333%;
}

.col-xs-offset-11 {
  margin-left: 91.6666666667%;
}

.col-xs-offset-12 {
  margin-left: 100%;
}

@media (min-width: 768px) {
  .col-sm-1,
  .col-sm-10,
  .col-sm-11,
  .col-sm-12,
  .col-sm-2,
  .col-sm-3,
  .col-sm-4,
  .col-sm-5,
  .col-sm-6,
  .col-sm-7,
  .col-sm-8,
  .col-sm-9 {
    float: left;
  }
  .col-sm-1 {
    width: 8.3333333333%;
  }
  .col-sm-2 {
    width: 16.6666666667%;
  }
  .col-sm-3 {
    width: 25%;
  }
  .col-sm-4 {
    width: 33.3333333333%;
  }
  .col-sm-5 {
    width: 41.6666666667%;
  }
  .col-sm-6 {
    width: 50%;
  }
  .col-sm-7 {
    width: 58.3333333333%;
  }
  .col-sm-8 {
    width: 66.6666666667%;
  }
  .col-sm-9 {
    width: 75%;
  }
  .col-sm-10 {
    width: 83.3333333333%;
  }
  .col-sm-11 {
    width: 91.6666666667%;
  }
  .col-sm-12 {
    width: 100%;
  }
  .col-sm-pull-0 {
    right: auto;
  }
  .col-sm-pull-1 {
    right: 8.3333333333%;
  }
  .col-sm-pull-2 {
    right: 16.6666666667%;
  }
  .col-sm-pull-3 {
    right: 25%;
  }
  .col-sm-pull-4 {
    right: 33.3333333333%;
  }
  .col-sm-pull-5 {
    right: 41.6666666667%;
  }
  .col-sm-pull-6 {
    right: 50%;
  }
  .col-sm-pull-7 {
    right: 58.3333333333%;
  }
  .col-sm-pull-8 {
    right: 66.6666666667%;
  }
  .col-sm-pull-9 {
    right: 75%;
  }
  .col-sm-pull-10 {
    right: 83.3333333333%;
  }
  .col-sm-pull-11 {
    right: 91.6666666667%;
  }
  .col-sm-pull-12 {
    right: 100%;
  }
  .col-sm-push-0 {
    left: auto;
  }
  .col-sm-push-1 {
    left: 8.3333333333%;
  }
  .col-sm-push-2 {
    left: 16.6666666667%;
  }
  .col-sm-push-3 {
    left: 25%;
  }
  .col-sm-push-4 {
    left: 33.3333333333%;
  }
  .col-sm-push-5 {
    left: 41.6666666667%;
  }
  .col-sm-push-6 {
    left: 50%;
  }
  .col-sm-push-7 {
    left: 58.3333333333%;
  }
  .col-sm-push-8 {
    left: 66.6666666667%;
  }
  .col-sm-push-9 {
    left: 75%;
  }
  .col-sm-push-10 {
    left: 83.3333333333%;
  }
  .col-sm-push-11 {
    left: 91.6666666667%;
  }
  .col-sm-push-12 {
    left: 100%;
  }
  .col-sm-offset-0 {
    margin-left: 0;
  }
  .col-sm-offset-1 {
    margin-left: 8.3333333333%;
  }
  .col-sm-offset-2 {
    margin-left: 16.6666666667%;
  }
  .col-sm-offset-3 {
    margin-left: 25%;
  }
  .col-sm-offset-4 {
    margin-left: 33.3333333333%;
  }
  .col-sm-offset-5 {
    margin-left: 41.6666666667%;
  }
  .col-sm-offset-6 {
    margin-left: 50%;
  }
  .col-sm-offset-7 {
    margin-left: 58.3333333333%;
  }
  .col-sm-offset-8 {
    margin-left: 66.6666666667%;
  }
  .col-sm-offset-9 {
    margin-left: 75%;
  }
  .col-sm-offset-10 {
    margin-left: 83.3333333333%;
  }
  .col-sm-offset-11 {
    margin-left: 91.6666666667%;
  }
  .col-sm-offset-12 {
    margin-left: 100%;
  }
}
@media (min-width: 992px) {
  .col-md-1,
  .col-md-10,
  .col-md-11,
  .col-md-12,
  .col-md-2,
  .col-md-3,
  .col-md-4,
  .col-md-5,
  .col-md-6,
  .col-md-7,
  .col-md-8,
  .col-md-9 {
    float: left;
  }
  .col-md-1 {
    width: 8.3333333333%;
  }
  .col-md-2 {
    width: 16.6666666667%;
  }
  .col-md-3 {
    width: 25%;
  }
  .col-md-4 {
    width: 33.3333333333%;
  }
  .col-md-5 {
    width: 41.6666666667%;
  }
  .col-md-6 {
    width: 50%;
  }
  .col-md-7 {
    width: 58.3333333333%;
  }
  .col-md-8 {
    width: 66.6666666667%;
  }
  .col-md-9 {
    width: 75%;
  }
  .col-md-10 {
    width: 83.3333333333%;
  }
  .col-md-11 {
    width: 91.6666666667%;
  }
  .col-md-12 {
    width: 100%;
  }
  .col-md-pull-0 {
    right: auto;
  }
  .col-md-pull-1 {
    right: 8.3333333333%;
  }
  .col-md-pull-2 {
    right: 16.6666666667%;
  }
  .col-md-pull-3 {
    right: 25%;
  }
  .col-md-pull-4 {
    right: 33.3333333333%;
  }
  .col-md-pull-5 {
    right: 41.6666666667%;
  }
  .col-md-pull-6 {
    right: 50%;
  }
  .col-md-pull-7 {
    right: 58.3333333333%;
  }
  .col-md-pull-8 {
    right: 66.6666666667%;
  }
  .col-md-pull-9 {
    right: 75%;
  }
  .col-md-pull-10 {
    right: 83.3333333333%;
  }
  .col-md-pull-11 {
    right: 91.6666666667%;
  }
  .col-md-pull-12 {
    right: 100%;
  }
  .col-md-push-0 {
    left: auto;
  }
  .col-md-push-1 {
    left: 8.3333333333%;
  }
  .col-md-push-2 {
    left: 16.6666666667%;
  }
  .col-md-push-3 {
    left: 25%;
  }
  .col-md-push-4 {
    left: 33.3333333333%;
  }
  .col-md-push-5 {
    left: 41.6666666667%;
  }
  .col-md-push-6 {
    left: 50%;
  }
  .col-md-push-7 {
    left: 58.3333333333%;
  }
  .col-md-push-8 {
    left: 66.6666666667%;
  }
  .col-md-push-9 {
    left: 75%;
  }
  .col-md-push-10 {
    left: 83.3333333333%;
  }
  .col-md-push-11 {
    left: 91.6666666667%;
  }
  .col-md-push-12 {
    left: 100%;
  }
  .col-md-offset-0 {
    margin-left: 0;
  }
  .col-md-offset-1 {
    margin-left: 8.3333333333%;
  }
  .col-md-offset-2 {
    margin-left: 16.6666666667%;
  }
  .col-md-offset-3 {
    margin-left: 25%;
  }
  .col-md-offset-4 {
    margin-left: 33.3333333333%;
  }
  .col-md-offset-5 {
    margin-left: 41.6666666667%;
  }
  .col-md-offset-6 {
    margin-left: 50%;
  }
  .col-md-offset-7 {
    margin-left: 58.3333333333%;
  }
  .col-md-offset-8 {
    margin-left: 66.6666666667%;
  }
  .col-md-offset-9 {
    margin-left: 75%;
  }
  .col-md-offset-10 {
    margin-left: 83.3333333333%;
  }
  .col-md-offset-11 {
    margin-left: 91.6666666667%;
  }
  .col-md-offset-12 {
    margin-left: 100%;
  }
}
@media (min-width: 1400px) {
  .col-lg-1,
  .col-lg-10,
  .col-lg-11,
  .col-lg-12,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-5,
  .col-lg-6,
  .col-lg-7,
  .col-lg-8,
  .col-lg-9 {
    float: left;
  }
  .col-lg-1 {
    width: 8.3333333333%;
  }
  .col-lg-2 {
    width: 16.6666666667%;
  }
  .col-lg-3 {
    width: 25%;
  }
  .col-lg-4 {
    width: 33.3333333333%;
  }
  .col-lg-5 {
    width: 41.6666666667%;
  }
  .col-lg-6 {
    width: 50%;
  }
  .col-lg-7 {
    width: 58.3333333333%;
  }
  .col-lg-8 {
    width: 66.6666666667%;
  }
  .col-lg-9 {
    width: 75%;
  }
  .col-lg-10 {
    width: 83.3333333333%;
  }
  .col-lg-11 {
    width: 91.6666666667%;
  }
  .col-lg-12 {
    width: 100%;
  }
  .col-lg-pull-0 {
    right: auto;
  }
  .col-lg-pull-1 {
    right: 8.3333333333%;
  }
  .col-lg-pull-2 {
    right: 16.6666666667%;
  }
  .col-lg-pull-3 {
    right: 25%;
  }
  .col-lg-pull-4 {
    right: 33.3333333333%;
  }
  .col-lg-pull-5 {
    right: 41.6666666667%;
  }
  .col-lg-pull-6 {
    right: 50%;
  }
  .col-lg-pull-7 {
    right: 58.3333333333%;
  }
  .col-lg-pull-8 {
    right: 66.6666666667%;
  }
  .col-lg-pull-9 {
    right: 75%;
  }
  .col-lg-pull-10 {
    right: 83.3333333333%;
  }
  .col-lg-pull-11 {
    right: 91.6666666667%;
  }
  .col-lg-pull-12 {
    right: 100%;
  }
  .col-lg-push-0 {
    left: auto;
  }
  .col-lg-push-1 {
    left: 8.3333333333%;
  }
  .col-lg-push-2 {
    left: 16.6666666667%;
  }
  .col-lg-push-3 {
    left: 25%;
  }
  .col-lg-push-4 {
    left: 33.3333333333%;
  }
  .col-lg-push-5 {
    left: 41.6666666667%;
  }
  .col-lg-push-6 {
    left: 50%;
  }
  .col-lg-push-7 {
    left: 58.3333333333%;
  }
  .col-lg-push-8 {
    left: 66.6666666667%;
  }
  .col-lg-push-9 {
    left: 75%;
  }
  .col-lg-push-10 {
    left: 83.3333333333%;
  }
  .col-lg-push-11 {
    left: 91.6666666667%;
  }
  .col-lg-push-12 {
    left: 100%;
  }
  .col-lg-offset-0 {
    margin-left: 0;
  }
  .col-lg-offset-1 {
    margin-left: 8.3333333333%;
  }
  .col-lg-offset-2 {
    margin-left: 16.6666666667%;
  }
  .col-lg-offset-3 {
    margin-left: 25%;
  }
  .col-lg-offset-4 {
    margin-left: 33.3333333333%;
  }
  .col-lg-offset-5 {
    margin-left: 41.6666666667%;
  }
  .col-lg-offset-6 {
    margin-left: 50%;
  }
  .col-lg-offset-7 {
    margin-left: 58.3333333333%;
  }
  .col-lg-offset-8 {
    margin-left: 66.6666666667%;
  }
  .col-lg-offset-9 {
    margin-left: 75%;
  }
  .col-lg-offset-10 {
    margin-left: 83.3333333333%;
  }
  .col-lg-offset-11 {
    margin-left: 91.6666666667%;
  }
  .col-lg-offset-12 {
    margin-left: 100%;
  }
}
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1399px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1400px) {
  .hidden-lg {
    display: none !important;
  }
}
.nav {
  margin-bottom: 0;
  padding-left: 0;
  list-style: none;
}

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

.nav::after {
  clear: both;
}

.nav > li {
  position: relative;
  display: block;
}

.nav > li > a {
  position: relative;
  display: block;
  padding: 10px 15px;
}

.nav > li > a:focus,
.nav > li > a:hover {
  text-decoration: none;
  background-color: #eee;
}

.nav > li.disabled > a {
  color: #777;
}

.nav > li.disabled > a:focus,
.nav > li.disabled > a:hover {
  color: #777;
  text-decoration: none;
  background-color: transparent;
  cursor: not-allowed;
}

.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
  background-color: #eee;
  border-color: #337ab7;
}

.nav .nav-divider {
  height: 1px;
  margin: 9px 0;
  overflow: hidden;
  background-color: #e5e5e5;
}

.nav > li > a > img {
  max-width: none;
}

.nav-tabs {
  border-bottom: 1px solid #ddd;
}

.nav-tabs > li {
  float: left;
  margin-bottom: -1px;
}

.nav-tabs > li > a {
  margin-right: 2px;
  line-height: 1.428571429;
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
}

.nav-tabs > li > a:hover {
  border-color: #eee #eee #ddd;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
  color: #555;
  background-color: #fff;
  border: 1px solid #ddd;
  border-bottom-color: transparent;
  cursor: default;
}

.rf-btn, .rf-btn.rf-btn-inverted,
.rf-btn:hover {
  color: #fff;
  border: none;
  background: var(--main_color);
  padding: 5px;
  border-color: #fff;
  margin: 5px 0;
  cursor: pointer;
  user-select: none;
  user-select: none;
  text-align: center;
}
.rf-btn:hover {
  background: #fff;
}
.rf-btn.rf-btn-border {
  border-width: 1px;
  border-style: solid;
}
.rf-btn.rf-btn-green {
  color: #fff;
  background: var(--green);
  border-color: #fff;
}
.rf-btn.rf-btn-red {
  color: #fff;
  background: var(--darkred);
  border-color: #fff;
}
.rf-btn.rf-btn-grey {
  background: var(--lightgrey);
}
.rf-btn.rf-btn-disabled {
  color: white;
  background: var(--lightgrey);
  border-color: var(--grey);
  cursor: not-allowed;
}
.rf-btn.rf-btn-transparent {
  background: none;
}
.rf-btn.rf-btn-icon {
  text-align: left;
}
.rf-btn.rf-btn-icon > * {
  margin: 3px;
  float: right;
}

.rf-btn.rf-btn-inverted {
  background: none;
}

.rf-btn.rf-btn-inverted,
.rf-btn:hover {
  color: var(--main_color);
  border-color: var(--main_color);
  margin: 5px 0;
}
.rf-btn.rf-btn-inverted.rf-btn-green,
.rf-btn:hover.rf-btn-green {
  color: var(--darkgreen);
  background: #fff;
  border-color: var(--darkgreen);
}
.rf-btn.rf-btn-inverted.rf-btn-red,
.rf-btn:hover.rf-btn-red {
  color: var(--darkred);
  background: #fff;
  border-color: var(--darkred);
}
.rf-btn.rf-btn-inverted.rf-btn-grey,
.rf-btn:hover.rf-btn-grey {
  color: var(--grey);
  background: #fff;
}
.rf-btn.rf-btn-inverted.rf-btn-disabled,
.rf-btn:hover.rf-btn-disabled {
  color: white;
  background: var(--lightgrey);
  border-color: var(--grey);
}
.rf-btn.rf-btn-inverted.rf-btn-background,
.rf-btn:hover.rf-btn-background {
  background: #fff;
}

.rf-btn.rf-btn-inverted:hover {
  opacity: 0.65;
}

.rf-btn-round {
  border-radius: 20px;
}

.validate input.rf-form.ng-invalid,
.validate select.rf-form.ng-invalid,
.validate textarea.rf-form.ng-invalid {
  border: 1px solid var(--red);
  box-shadow: 0 0 10px 0 var(--red);
}

input:active.rf-form,
input:focus.rf-form,
input:hover.rf-form {
  outline: none;
}

textarea.rf-form {
  min-width: 100%;
  max-width: 100%;
}

input.rf-form,
select.rf-form,
textarea.rf-form {
  width: 100%;
  border: 1px solid var(--darkwhite);
  background: #fff;
  padding: 5px;
  margin: 4px 0;
}

rf-dialog-edit-action {
  text-align: left;
}

rf-dialog-edit-announcement {
  text-align: left;
}
rf-dialog-edit-announcement rf-text-editor {
  margin: 15px;
  padding: 15px;
  display: block;
}
rf-dialog-edit-announcement td {
  padding: 0 10px;
}

rf-dialog-edit-category {
  text-align: left;
}
rf-dialog-edit-category h3 {
  margin: 0;
  font-weight: bold;
}
rf-dialog-edit-category .tag-preview rf-tag {
  margin: 0;
}
rf-dialog-edit-category .archived {
  color: var(--grey) !important;
}
rf-dialog-edit-category .languages {
  display: flex;
  align-items: center;
}
rf-dialog-edit-category .lang-tag {
  background: var(--lightgrey);
  border-radius: 10px;
  padding: 2px 10px;
  width: 300px;
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
}
rf-dialog-edit-category .lang-tag input,
rf-dialog-edit-category .lang-tag textarea {
  background: var(--darkwhite);
  border: none;
}
rf-dialog-edit-category .lang-tag.add-btn {
  background: var(--main_color);
  width: 200px;
}
rf-dialog-edit-category .lang-tag textarea {
  height: 30px;
}
rf-dialog-edit-category h3 {
  font-size: 22px;
}
rf-dialog-edit-category rf-hashtag input,
rf-dialog-edit-category rf-hashtag .tag-box,
rf-dialog-edit-category rf-hashtag .rf-btn,
rf-dialog-edit-category rf-hashtag .rf-btn.rf-btn-inverted,
rf-dialog-edit-category rf-hashtag .rf-btn:hover {
  float: left;
}
rf-dialog-edit-category .tag-box {
  cursor: default;
  width: max-content;
}
rf-dialog-edit-category .form-row {
  padding-bottom: 10px;
  padding-top: 10px;
}
rf-dialog-edit-category .form-row.grey {
  background: var(--darkwhite);
}
rf-dialog-edit-category .color-input, rf-dialog-edit-category .color-group {
  width: calc(50% - 30px);
  display: block;
  float: left;
  margin: 0 15px;
}
rf-dialog-edit-category .color-input div {
  padding: 0;
}
rf-dialog-edit-category rf-icon-select {
  margin-top: 25px;
}
rf-dialog-edit-category rf-search-field {
  margin-top: 5px;
}
rf-dialog-edit-category .show-icon-dropdown {
  display: none;
}
rf-dialog-edit-category .icon-dropdown-select i {
  cursor: pointer;
}

rf-dialog-create-invoice-drafts thead th {
  font-weight: normal;
  cursor: pointer;
  color: var(--main_color);
}
rf-dialog-create-invoice-drafts thead th.selected-period {
  font-weight: bold;
}
rf-dialog-create-invoice-drafts tbody td {
  border: 1px solid var(--grey);
}
rf-dialog-create-invoice-drafts tbody tr {
  vertical-align: top;
}
rf-dialog-create-invoice-drafts tbody tr .invoiced {
  background-color: rgba(0, 255, 0, 0.3);
}
rf-dialog-create-invoice-drafts tbody tr .invoiced.selected-period {
  background-color: rgb(0, 255, 0);
}
rf-dialog-create-invoice-drafts tbody tr .to-invoice {
  background-color: rgba(255, 255, 0, 0.3);
}
rf-dialog-create-invoice-drafts tbody tr .to-invoice.selected-period {
  background-color: rgb(255, 255, 0);
}

rf-dialog-edit-cronjob {
  display: block;
  text-align: left;
}
rf-dialog-edit-cronjob .rf-btn, rf-dialog-edit-cronjob .rf-btn.rf-btn-inverted,
rf-dialog-edit-cronjob .rf-btn:hover {
  font-size: 12px;
}

rf-dialog-edit-customer {
  text-align: left;
}
rf-dialog-edit-customer .percent-input {
  width: calc(100% - 50px);
}
rf-dialog-edit-customer .price-input {
  width: calc(100% - 8px);
}
rf-dialog-edit-customer .rf-form, rf-dialog-edit-customer .right {
  text-align: right;
}
rf-dialog-edit-customer .float-right {
  float: right;
  width: unset;
}
rf-dialog-edit-customer .border-bottom {
  border-bottom: 1px solid var(--grey);
}
rf-dialog-edit-customer h4 {
  display: inline-block;
}
rf-dialog-edit-customer span {
  float: right;
}
rf-dialog-edit-customer rf-upload-zone {
  display: inline-block;
  width: unset;
}
rf-dialog-edit-customer .fa-upload {
  color: var(--main_color);
  width: 20px;
}

rf-dialog-date-time .actions .rf-btn {
  width: 100%;
}

rf-dialog-edit-machine {
  text-align: left;
}
rf-dialog-edit-machine h3 {
  position: relative;
  text-align: center;
  top: 40px;
  color: var(--grey);
}

rf-dialog-edit-news {
  text-align: left;
}
rf-dialog-edit-news h2 {
  font-size: 20px;
  color: var(--grey);
  margin-top: 0;
  line-height: 34px;
}
rf-dialog-edit-news h2 .rf-btn, rf-dialog-edit-news h2 .rf-btn.rf-btn-inverted,
rf-dialog-edit-news h2 .rf-btn:hover {
  float: right;
  height: 28px;
  width: 28px;
  line-height: 0;
  margin-top: 3px;
}
rf-dialog-edit-news .news-body-editor {
  margin-bottom: 40px;
}
rf-dialog-edit-news .rf-btn-background {
  text-align: center;
}
rf-dialog-edit-news textarea {
  min-height: 300px;
}

rf-dialog-edit-pdf-component {
  text-align: left;
}
rf-dialog-edit-pdf-component .text-editor-container {
  height: 500px;
  display: grid;
}
rf-dialog-edit-pdf-component .text-editor-container rf-text-editor {
  overflow-y: auto;
  overflow-x: hidden;
}
rf-dialog-edit-pdf-component .translations {
  border-bottom: 1px solid var(--lightgrey);
  color: grey;
  height: 40px;
}
rf-dialog-edit-pdf-component h4 {
  color: var(--darkgrey);
  display: inline-block;
}
rf-dialog-edit-pdf-component .fa-check {
  color: var(--green);
}
rf-dialog-edit-pdf-component rf-tags {
  width: 60%;
  display: inline-block;
}

rf-dialog-edit-task {
  text-align: left;
}
rf-dialog-edit-task .right-side {
  background: var(--darkwhite);
}

rf-dialog-edit-user {
  text-align: left;
}
rf-dialog-edit-user label {
  font-weight: normal;
  line-height: 17px;
  color: var(--midgrey);
}
rf-dialog-edit-user h2 {
  font-size: 20px;
  color: var(--grey);
  margin-top: 0;
  line-height: 34px;
}
rf-dialog-edit-user h2 .rf-btn, rf-dialog-edit-user h2 .rf-btn.rf-btn-inverted,
rf-dialog-edit-user h2 .rf-btn:hover {
  float: right;
  height: 28px;
  width: 28px;
  line-height: 0;
  margin-top: 3px;
}
rf-dialog-edit-user .active-address {
  margin-bottom: 40px;
}
rf-dialog-edit-user .rf-btn-background {
  text-align: center;
}
rf-dialog-edit-user .toggle-send-activation-mail {
  cursor: pointer;
}

rf-dialog-account-import .customer-message {
  width: 95%;
  margin-left: 5%;
}
rf-dialog-account-import .customer-message label {
  padding-top: 22px;
}
rf-dialog-account-import .customer-message textarea {
  height: 380px;
  box-shadow: none;
  border: 1px solid var(--lightgrey);
  padding: 10px;
}

rf-dialog-change-password {
  text-align: left;
}

rf-dialog-choose-standard-text {
  text-align: left;
}
rf-dialog-choose-standard-text h2 {
  font-size: 20px;
  color: var(--grey);
  margin-top: 0;
  line-height: 34px;
}
rf-dialog-choose-standard-text .all-standard-text {
  border: solid 1px var(--lightgrey);
  overflow-y: auto;
  overflow-x: hidden;
  height: 400px;
  margin-bottom: 50px;
}
rf-dialog-choose-standard-text .all-standard-text .standard-text-box {
  cursor: pointer;
  border-bottom: solid 1px var(--lightgrey);
  position: relative;
  overflow: auto;
  padding: 10px 5px;
}
rf-dialog-choose-standard-text .all-standard-text .standard-text-box.active {
  background-color: var(--lightgrey);
}

rf-dialog-error-details {
  text-align: left;
  float: left;
  width: 100%;
}
rf-dialog-error-details textarea {
  width: 100%;
  height: 200px;
}

rf-dialog-file-upload rf-upload-zone {
  color: var(--grey);
  padding: 20px;
}

rf-dialog-file-viewer {
  position: absolute;
  left: 0;
  right: 0;
  top: -4px;
  bottom: 0;
}

rf-dialog-select-header-options {
  text-align: left;
}
rf-dialog-select-header-options tbody {
  font: 11px;
}

rf-dialog-iframe {
  position: absolute;
  left: 0;
  right: 0;
  top: -4px;
  bottom: 0;
}
rf-dialog-iframe iframe {
  position: relative;
  width: 100%;
  height: 100%;
}

rf-dialog-mail {
  padding: 0 15px;
  display: block;
  background: var(--bg1);
  height: 100vh;
  overflow: auto;
  padding-top: 5px;
}
rf-dialog-mail label,
rf-dialog-mail .rf-btn,
rf-dialog-mail .rf-btn.rf-btn-inverted,
rf-dialog-mail .rf-btn:hover {
  float: left;
}
rf-dialog-mail label.last,
rf-dialog-mail .rf-btn.last {
  float: none;
}
rf-dialog-mail h4 {
  float: right;
  font-size: 16px;
  color: var(--main_color_contrast_ultra_dark);
}
@media (max-width: 720px) {
  rf-dialog-mail h4 {
    font-size: 10px;
  }
}
rf-dialog-mail .rf-form {
  background: white;
}
rf-dialog-mail .close-btn {
  position: absolute;
  right: 6px;
  top: -3px;
  z-index: 999;
}
rf-dialog-mail .label-text {
  text-align: right;
}
rf-dialog-mail .signature-container select {
  width: calc(100% - 35px);
  float: left;
  height: 33px;
}
rf-dialog-mail .signature-container .rf-btn {
  float: right;
}
rf-dialog-mail .attachment {
  word-break: break-all;
  text-align: left;
}
rf-dialog-mail .attachment .fa-trash {
  float: right;
  color: var(--darkred);
}
rf-dialog-mail .pointer {
  cursor: pointer;
}
rf-dialog-mail rf-upload-zone .upload-field {
  text-align: right;
  font-size: 12px;
  border: dashed 4px var(--lightgrey);
  color: var(--midgrey);
}
rf-dialog-mail rf-upload-zone .upload-field .file-select {
  margin-top: 20px;
  color: var(--main_color_contrast_ultra_dark);
}

rf-dialog-property-box {
  text-align: left;
}
rf-dialog-property-box .rf-btn, rf-dialog-property-box .rf-btn.rf-btn-inverted,
rf-dialog-property-box .rf-btn:hover {
  width: 100%;
}
rf-dialog-property-box .tag-label {
  padding: 1px 5px;
  border: 1px solid var(--lightgrey);
  border-radius: 5px;
  background: var(--midwhite);
  margin-left: 10px;
}

rf-dialog-run-script {
  display: block;
  text-align: left;
}
rf-dialog-run-script .rf-btn, rf-dialog-run-script .rf-btn.rf-btn-inverted,
rf-dialog-run-script .rf-btn:hover {
  width: 100%;
  border-radius: 7px;
  margin: 0;
  padding: 8px 0;
  border: none;
}

rf-dialog-table-columns .arrow-btn {
  height: 10px;
  margin-top: -13px !important;
}

rf-dialog-token-groups {
  text-align: left;
}
rf-dialog-token-groups label {
  font-weight: normal;
  line-height: 17px;
  color: var(--midgrey);
}
rf-dialog-token-groups h2 {
  font-size: 20px;
  color: var(--grey);
  margin-top: 0;
  line-height: 34px;
}
rf-dialog-token-groups h2 .rf-btn, rf-dialog-token-groups h2 .rf-btn.rf-btn-inverted,
rf-dialog-token-groups h2 .rf-btn:hover {
  float: right;
  height: 28px;
  width: 28px;
  line-height: 0;
  margin-top: 3px;
}
rf-dialog-token-groups .active-address {
  margin-bottom: 40px;
}
rf-dialog-token-groups .rf-btn-background {
  text-align: center;
}
rf-dialog-token-groups .toggle-send-activation-mail {
  cursor: pointer;
}

rf-dialog-db-tool {
  display: block;
  text-align: left;
}
rf-dialog-db-tool .inner-field {
  background: var(--grey);
  color: rgb(204, 240, 160);
  padding: 7px 10px;
  border-radius: 7px;
}
rf-dialog-db-tool .inner-field select {
  background: none;
  border: none;
  outline: none;
}
rf-dialog-db-tool .inner-field input {
  background: none;
  border: none;
  width: 350px;
}
rf-dialog-db-tool .inner-field .fa-times-circle {
  font-size: 24px;
  position: absolute;
  margin-left: 8px;
}
rf-dialog-db-tool .right-options .rf-btn {
  width: 100%;
  border-radius: 7px;
  margin: 0;
  padding: 8px 0;
  border: none;
}
rf-dialog-db-tool .right-options rf-upload-zone {
  padding: 20px;
}

rf-dialog-export-db {
  text-align: left;
}
rf-dialog-export-db hr {
  margin: 0;
}
rf-dialog-export-db .db-row {
  margin-bottom: 35px;
}

rf-dialog-export-transactions {
  text-align: left;
}
rf-dialog-export-transactions .name {
  float: left;
  line-height: 38px;
}
rf-dialog-export-transactions .save-settings a {
  float: right;
  line-height: 35px;
  cursor: pointer;
}
rf-dialog-export-transactions .md-box {
  white-space: pre;
  min-height: 120px;
}
rf-dialog-export-transactions .rf-btn, rf-dialog-export-transactions .rf-btn.rf-btn-inverted,
rf-dialog-export-transactions .rf-btn:hover {
  width: 100%;
}

rf-dialog-select-account {
  height: 100%;
  display: block;
}

rf-dialog-select-article {
  text-align: left;
}
rf-dialog-select-article .nav-tabs {
  margin-bottom: 10px;
}
rf-dialog-select-article .nav-tabs .close-btn {
  display: none;
}
rf-dialog-select-article .btn-list-on-top {
  position: absolute;
  right: 55px;
  z-index: 9999;
}
rf-dialog-select-article .close-btn {
  float: right;
  color: var(--main_color);
  font-size: 25px;
  margin-right: 5px;
}
rf-dialog-select-article .close-btn:hover {
  opacity: 0.6;
}
rf-dialog-select-article rf-upload-zone {
  position: initial;
}
rf-dialog-select-article .articles-container {
  position: absolute;
  right: 15px;
  left: 15px;
  bottom: 0;
  top: 170px;
  overflow-y: auto;
  padding-left: 15px;
}
rf-dialog-select-article .articles .article {
  position: relative;
  min-height: 280px;
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.75);
  border-radius: 4px;
  margin-bottom: 30px;
}
rf-dialog-select-article .articles .article .select-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
rf-dialog-select-article .articles .article .select-layer .text {
  position: absolute;
  left: 0;
  text-align: center;
  width: 100%;
  font-size: 150%;
  color: black;
  font-weight: bold;
  display: none;
}
rf-dialog-select-article .articles .article:hover {
  box-shadow: 0 0 5px 3px var(--main_color);
}
rf-dialog-select-article .articles .article.withprice {
  min-height: 330px;
}
rf-dialog-select-article .articles .article.selected {
  box-shadow: 0 0 5px 3px var(--main_color);
}
rf-dialog-select-article .articles .article.selected .text.add {
  display: block;
}
rf-dialog-select-article .articles .article.alreadyadded {
  background: rgba(0, 0, 0, 0.5);
}
rf-dialog-select-article .articles .article.alreadyadded .text.inorder {
  display: block;
}
rf-dialog-select-article .articles .article .img {
  min-height: 200px;
}
rf-dialog-select-article .articles .article .img img {
  width: 100%;
  max-height: 200px;
  max-width: 200px;
}
rf-dialog-select-article .articles .article .description {
  padding: 10px;
}
rf-dialog-select-article .added-article {
  border-bottom: 1px solid var(--lightgrey);
}
rf-dialog-select-article .tab-edit {
  width: 100%;
  padding: 20px;
  padding-bottom: 50px;
}
rf-dialog-select-article .tab-edit .header .row {
  margin: 0;
}
rf-dialog-select-article .pointer {
  cursor: pointer !important;
  word-break: break-all;
}
rf-dialog-select-article .archived-checkbox {
  position: absolute;
  right: 20px;
  top: 20px;
}

@media (min-width: 320px) and (max-width: 767px) {
  rf-dialog-article-choose .nav .close-btn {
    display: block;
  }
  rf-dialog-article-choose .added-articles {
    padding-left: 15px;
  }
  rf-dialog-article-choose .added-articles .close-btn {
    display: none;
  }
  rf-dialog-article-choose .added-articles .articles {
    left: 25px;
  }
  rf-dialog-article-choose .top-container {
    overflow: auto;
    margin-right: 0;
  }
  rf-dialog-article-choose .articles-container {
    top: 200px;
  }
}
@media (max-width: 320px) {
  rf-dialog-article-choose .nav .close-btn {
    display: block;
  }
  rf-dialog-article-choose .added-articles {
    padding-left: 15px;
  }
  rf-dialog-article-choose .added-articles .close-btn {
    display: none;
  }
  rf-dialog-article-choose .added-articles .articles {
    left: 25px;
  }
  rf-dialog-article-choose .top-container {
    overflow: auto;
    margin-right: 0;
  }
  rf-dialog-article-choose .articles-container {
    top: 200px;
  }
}
rf-dialog-select-category {
  color: var(--darkgrey);
  text-align: left;
}
rf-dialog-select-category .tag-container {
  display: table;
  width: 100%;
  height: 30px;
  cursor: pointer;
}
rf-dialog-select-category .tag-container:hover, rf-dialog-select-category .tag-container .selected {
  background: var(--darkwhite);
}
rf-dialog-select-category .tag-container.already {
  background: var(--lightgrey);
  cursor: disabled;
}
rf-dialog-select-category .tag-container div, rf-dialog-select-category .tag-container span, rf-dialog-select-category .tag-container i {
  display: table-cell;
}
rf-dialog-select-category .tag-container .tag-label {
  margin-top: 2px;
  height: calc(100% - 4px);
  width: 5px;
}
rf-dialog-select-category .tag-container .tag-icon {
  width: 40px;
  min-height: 1px;
  text-align: center;
}
rf-dialog-select-category .tag-container .arrow-icon {
  float: right;
  margin-top: 7px;
  margin-right: 20px;
}
rf-dialog-select-category .tag-container-large {
  width: 100%;
  padding: 20px;
}
rf-dialog-select-category .vertical-line {
  position: absolute;
  height: 100%;
  width: 2px;
  background: var(--lightgrey);
  top: 10px;
  left: 0;
  bottom: -10px;
}

rf-dialog-item-search {
  display: block;
}

rf-dialog-select-price {
  display: block;
  text-align: left;
}
rf-dialog-select-price .head-row {
  border-bottom: 1px solid var(--lightgrey);
}
rf-dialog-select-price .large {
  color: var(--grey);
  font-size: 28px;
}
rf-dialog-select-price small {
  color: var(--grey);
}
rf-dialog-select-price .bottom-box {
  background-color: var(--darkwhite);
}

rf-account-create .active {
  background-color: var(--lightgrey);
}
rf-account-create .nav-tabs li {
  cursor: pointer;
}
rf-account-create .address-box {
  min-height: 400px;
}
rf-account-create .rf-edit label {
  text-align: left;
}
rf-account-create input {
  width: 100%;
}
rf-account-create .rf-btn.inactive {
  background-color: var(--lightgrey);
}
rf-account-create .rf-btn.inactive:hover {
  color: white;
}
rf-account-create .btn-group {
  width: 100%;
}
rf-account-create .btn-group button {
  width: 50%;
}
rf-account-create .save-row .rf-btn {
  width: 100%;
}

rf-account-meta-data {
  display: block;
}
rf-account-meta-data a {
  color: var(--grey);
}
rf-account-meta-data a i {
  color: var(--main_color);
}

rf-account-select .active {
  background-color: var(--lightgrey) !important;
}
rf-account-select .nav-tabs li {
  cursor: pointer;
}
rf-account-select .address-box {
  min-height: 400px;
}
rf-account-select .rf-edit label {
  text-align: left;
}
rf-account-select input {
  width: 100%;
}
rf-account-select .accounts {
  width: 100%;
  height: 400px;
  overflow-y: auto;
  display: inline-block;
}
rf-account-select .accounts .account {
  cursor: pointer;
  width: 100%;
  text-align: left;
}
rf-account-select .accounts .account:hover {
  background: #ccc;
}
rf-account-select .rf-btn.inactive {
  background-color: var(--lightgrey);
}
rf-account-select .rf-btn.inactive:hover {
  color: white;
}
rf-account-select h4 {
  margin-top: 28px;
  text-align: left;
}
rf-account-select .save-row .rf-btn {
  width: 100%;
}
rf-account-select .filter-sort {
  float: left;
  margin-right: 20px;
  margin-top: -4px;
}
rf-account-select .table-padding td {
  padding-top: 5px;
  padding-bottom: 5px;
}

rf-actions .done {
  color: var(--lightgrey);
}
rf-actions .fa-check {
  color: var(--main_color);
  cursor: pointer;
  font-size: 20px;
  float: right;
}
rf-actions .fa-check.done {
  color: var(--main_color);
}

rf-address {
  float: left;
  width: 100%;
  padding-right: 15px;
}
rf-address:hover {
  color: var(--main_color);
}
rf-address.contact .phone-and-mail {
  display: block !important;
}
rf-address.only-contact .phone-and-mail {
  display: block !important;
}
rf-address.only-contact .postal-address {
  display: none !important;
}
rf-address .name {
  padding-bottom: 5px;
}
rf-address .phone-and-mail,
rf-address .fa {
  padding-bottom: 5px;
  display: none;
}
rf-address span {
  font-size: 13px;
  margin: 0;
  padding: 0;
}
rf-address .warning {
  color: var(--invalid);
}

rf-address-input {
  float: left;
  width: 100%;
  display: block;
}

rf-address-list {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
rf-address-list .address-list-item {
  margin-bottom: 25px;
}
rf-address-list .address-list-item.active {
  background-color: var(--lightgrey);
}
rf-address-list .address-field {
  position: relative;
  min-height: 250px;
}
rf-address-list .address-field .address-buttons {
  position: absolute;
  right: 25px;
  top: -11px;
}
rf-address-list .address-field .address-buttons .rf-btn {
  background: none;
}
rf-address-list .standard-address {
  margin-top: 5px;
}
rf-address-list .standard-address input {
  float: left;
}
rf-address-list .standard-address p {
  color: var(--grey);
  font-size: 14px;
  margin-left: 25px;
  margin-bottom: 0;
  line-height: 25px;
}

rf-change-password {
  min-height: 325px;
}
rf-change-password .small {
  width: calc(99% - 30px);
}
rf-change-password .rf-btn-pw {
  float: right;
  height: 30px;
  position: relative;
}
rf-change-password .rf-btn, rf-change-password .rf-btn.rf-btn-inverted,
rf-change-password .rf-btn:hover {
  font-size: 14px;
  padding: 8px;
}
rf-change-password label {
  color: var(--midgrey);
}
rf-change-password .warnings p {
  position: absolute;
  opacity: 0;
  left: 0;
  right: 0;
  top: 0;
  margin: 0 15px;
  min-height: 50px;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
rf-change-password .warnings p.visible {
  opacity: 1;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
rf-change-password .forgot-password {
  color: var(--midgrey);
  text-decoration: underline;
}
rf-change-password .forgot-password:hover {
  color: var(--main_color);
}
rf-change-password .alert {
  padding: 15px;
  border: 1px solid transparent;
  border-radius: 4px;
}

rf-csv-import rf-list-tabs {
  text-align: left;
}
rf-csv-import .fa-question {
  cursor: help;
  background: #f47721;
  color: white;
  width: 19px;
  height: 19px;
  text-align: center;
  border-radius: 14px;
  line-height: 20px;
  font-size: 19px;
  margin-left: 10px;
}
rf-csv-import .rf-edit.rf-label label {
  width: 50%;
}
rf-csv-import .rf-edit.rf-label input {
  width: 50%;
}
rf-csv-import .rf-edit.rf-label select {
  width: 50%;
}
rf-csv-import .warnings p {
  position: absolute;
  opacity: 0;
  left: 0;
  right: 0;
  margin: 0 15px;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
rf-csv-import .warnings p.visible {
  opacity: 1;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}

edit-document-files {
  border: 2px dashed var(--lightgrey);
  display: block;
  border-radius: 15px;
  padding: 10px 0;
}
edit-document-files table td {
  padding-left: 15px;
}
edit-document-files table td a {
  cursor: pointer;
}
edit-document-files thead {
  color: var(--midgrey);
}
edit-document-files .files {
  font-size: 90%;
}
edit-document-files .files:nth-child(even) {
  background: var(--bg1);
}
edit-document-files .fa {
  cursor: pointer;
  color: var(--main_color);
}
edit-document-files .fa.disabled {
  opacity: 0.25;
  color: gray;
}

rf-email .email-list {
  position: relative;
}
rf-email .list-h {
  margin: 5px;
}
rf-email .list-h button.rf-btn {
  margin: 0;
}

rf-email-transporter label {
  color: var(--midgrey);
}
rf-email-transporter .align-items {
  display: flex;
  align-items: center;
}

rf-group-rights {
  width: 100%;
  display: block;
}
rf-group-rights select.rf-form {
  width: 80%;
  float: left;
}
rf-group-rights .rf-btn, rf-group-rights .rf-btn.rf-btn-inverted,
rf-group-rights .rf-btn:hover {
  float: left;
  border-right: 1px solid;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  height: 28px;
  line-height: 18px;
}
rf-group-rights .rf-btn:hover {
  border-color: var(--main_color);
}
rf-group-rights .tag {
  display: inline-block;
  background: #7fff00;
  color: white;
  border-radius: 3px;
  padding: 0 10px;
  margin-right: 5px;
  line-height: 26px;
}

rf-history {
  display: block;
  font-size: 12px;
}
rf-history thead {
  color: var(--midgrey);
}
rf-history table thead td:first-child {
  padding-left: 0 !important;
}
rf-history.inner-space table td:first-child {
  padding-left: 15px !important;
}
rf-history.inner-space table td:last-child {
  padding-left: 15px !important;
}

rf-licenses .quantity-input {
  width: calc(100% - 70px);
}
rf-licenses .fa-plus, rf-licenses .fa-minus {
  color: var(--main_color);
  width: 30px;
  cursor: pointer;
}
rf-licenses .fa-money {
  color: var(--main_color);
}
rf-licenses .center {
  text-align: center;
}
rf-licenses th {
  text-align: left;
}

onboarding-list th {
  text-align: left;
}

rf-parameter i.fa-question {
  cursor: help;
  background: var(--main_color);
  color: white;
  width: 19px;
  height: 19px;
  text-align: center;
  border-radius: 14px;
  line-height: 20px;
  font-size: 19px;
  margin-left: 10px;
}
rf-parameter table input.rf-form, rf-parameter table select.rf-form {
  text-align: left;
}
rf-parameter .w20 {
  text-align: right;
  padding-right: 20px;
}

rf-search-item {
  display: block;
}
rf-search-item .num-of-docs {
  text-align: left;
  color: var(--grey);
}
rf-search-item .search-items {
  height: 300px;
  overflow-y: auto;
}
rf-search-item .search-item {
  cursor: pointer;
  width: 100%;
  text-align: left;
  overflow: auto;
}
rf-search-item .search-item:nth-child(odd) {
  background: var(--darkwhite);
}
rf-search-item .search-item:hover {
  background: #ccc;
}
rf-search-item .search-item b {
  margin-right: 10px;
}
rf-search-item .search-item.active {
  background: #ccc;
  color: var(--main_color);
}
rf-search-item .search-item .warning {
  color: var(--invalid);
}

standard-text span {
  white-space: pre-line;
}

static-text {
  margin: 5px 0;
  display: block;
}
static-text span {
  white-space: pre-line;
}
static-text textarea.rf-form {
  padding-left: 0;
}
static-text .iconbar.left {
  /* prevent collision with pdf footer below */
  margin-top: -15px;
}

rf-task-resource-settings {
  display: block;
}
rf-task-resource-settings .pointer {
  cursor: pointer;
}
rf-task-resource-settings i:hover {
  color: var(--main_color);
}

rf-time-light-settings table {
  width: 100%;
}
rf-time-light-settings .on-time {
  color: var(--green);
}
rf-time-light-settings .slight-delay {
  color: yellow;
}
rf-time-light-settings .strong-delay {
  color: red;
}
rf-time-light-settings td {
  padding: 0 5px;
}

rf-histogram svg {
  width: 1000px;
  height: 500px;
}
rf-histogram .axis line,
rf-histogram .axis path {
  fill: none;
  stroke: #777;
}
rf-histogram .axis text {
  font-family: Arial, sans-serif;
  font-size: 13px;
}
rf-histogram .bar {
  fill: firebrick;
}
rf-histogram .limit {
  stroke: var(--grey);
}
rf-histogram .area {
  fill: var(--main_color);
}
rf-histogram .selected {
  fill: blue;
}
rf-histogram .label {
  font-size: 100%;
}

.rf-pie-chart {
  overflow: visible !important;
}
.rf-pie-chart .arc text {
  font: 8px sans-serif;
  text-anchor: middle;
}
.rf-pie-chart .arc path {
  stroke: #fff;
}
.rf-pie-chart .title {
  fill: teal;
  font-weight: bold;
}

.rf-pie-chart-simple {
  overflow: visible !important;
}
.rf-pie-chart-simple .arc path {
  stroke: #fff;
}

rf-pie-data-legend span {
  text-transform: capitalize;
  float: left;
  min-width: 80px;
  display: block;
  margin-right: 10px;
}
rf-pie-data-legend span .legend-boxes {
  width: 30px;
  height: 15px;
  border: 1px solid;
  float: left;
  padding-right: 5px;
  margin: 2px;
}
rf-pie-data-legend .vertical {
  display: grid;
}
rf-pie-data-legend .vertical span {
  padding: 5px;
}
rf-pie-data-legend .vertical span div {
  margin-right: 5px;
}
rf-pie-data-legend a {
  color: unset;
}
rf-pie-data-legend a:hover {
  color: var(--main_color);
}

rf-pie-statistic {
  overflow: visible;
}
rf-pie-statistic .arc text {
  font: 8px sans-serif;
  text-anchor: middle;
}
rf-pie-statistic .arc path {
  stroke: #fff;
}
rf-pie-statistic .title {
  fill: teal;
  font-weight: bold;
}
rf-pie-statistic .center {
  text-align: center;
}
rf-pie-statistic .flex {
  display: flex;
}
rf-pie-statistic .flex-center {
  margin-left: auto;
  margin-right: auto;
}

rf-xy-comparison rf-xy-multi-diagram svg {
  width: 100%;
}
rf-xy-comparison .diagram-legend {
  line-height: 40px;
}
rf-xy-comparison .diagram-legend .year1 {
  color: var(--main_color);
}
rf-xy-comparison .diagram-legend .year2 {
  color: var(--darkgrey);
}
rf-xy-comparison .diagram-legend select.rf-form {
  border: none;
  padding: 0;
  margin-left: -4px;
}
rf-xy-comparison td {
  text-align: right;
}
rf-xy-comparison td b {
  text-align: left;
}
rf-xy-comparison .green {
  color: var(--darkgreen);
}
rf-xy-comparison .red {
  color: var(--red);
}

rf-xy-diagram svg {
  width: 1000px;
  height: 500px;
}
rf-xy-diagram .axis line,
rf-xy-diagram .axis path {
  fill: none;
  stroke: #777;
}
rf-xy-diagram .axis text {
  font-family: Arial, sans-serif;
  font-size: 13px;
}
rf-xy-diagram .bar {
  fill: firebrick;
}
rf-xy-diagram .limit {
  stroke: var(--grey);
}
rf-xy-diagram .area {
  fill: var(--main_color);
}
rf-xy-diagram .selected {
  fill: blue;
}
rf-xy-diagram .label {
  font-size: 100%;
}

rf-xy-multi-diagram svg {
  width: 1000px;
  height: 500px;
}
rf-xy-multi-diagram .axis line,
rf-xy-multi-diagram .axis path {
  fill: none;
  stroke: #777;
}
rf-xy-multi-diagram .axis text {
  font-family: Arial, sans-serif;
  font-size: 13px;
}
rf-xy-multi-diagram .bar {
  fill: firebrick;
}
rf-xy-multi-diagram .limit {
  stroke: var(--grey);
}
rf-xy-multi-diagram .area1 {
  fill: var(--main_color);
}
rf-xy-multi-diagram .area2 {
  fill: var(--grey);
}
rf-xy-multi-diagram .selected {
  fill: blue;
}
rf-xy-multi-diagram .label {
  font-size: 100%;
}

rf-xy-multi-diagram-legend span {
  text-transform: capitalize;
  float: left;
  min-width: 80px;
  display: block;
  padding-left: 2px;
}
rf-xy-multi-diagram-legend span .legend-boxes {
  width: 30px;
  height: 15px;
  border: 1px solid;
  float: left;
  padding-right: 5px;
  margin: 2px;
  margin-right: 5px;
}
rf-xy-multi-diagram-legend .vertical {
  display: grid;
}
rf-xy-multi-diagram-legend .vertical span {
  padding: 5px;
}
rf-xy-multi-diagram-legend .vertical span div {
  margin-right: 5px;
}

rf-bottom-actions .scroll-btn-container button.rf-btn {
  float: left;
  width: 60px;
  margin-right: 10px;
}
rf-bottom-actions rf-action-select {
  margin-top: 4px;
}
rf-bottom-actions rf-action-select .select-row.first, rf-bottom-actions rf-action-select .select-row.select-btn {
  border-radius: 0 !important;
}

rf-color-label {
  text-align: left;
  display: inline-block;
}
rf-color-label .color-label {
  padding: 3px 5px;
  border-radius: 11px;
}

rf-date-label .small-grey-tag {
  border-radius: 10px;
  background: white;
  color: var(--green);
  border: 1px solid;
  padding: 0 7px;
  margin: 0;
}
rf-date-label .small-grey-tag.alert {
  color: var(--red);
  background: white;
}

rf-delayed-light {
  display: block;
  float: left;
  margin: 0 5px 0 0;
}
rf-delayed-light .state-led {
  color: #0f0;
}
rf-delayed-light .state-led.today {
  color: var(--yellow);
}
rf-delayed-light .state-led.delayed {
  color: var(--red);
}

rf-files-manager.inisde-rf-panel .file-select {
  position: absolute;
  right: 0;
  top: -32px;
}
rf-files-manager ul {
  padding: 0;
}
rf-files-manager li {
  list-style: none;
  line-height: 16px;
}
rf-files-manager.view-mode .rf-btn.file-select,
rf-files-manager.view-mode .fa-trash {
  display: none;
}
rf-files-manager .rf-btn, rf-files-manager .rf-btn.rf-btn-inverted,
rf-files-manager .rf-btn:hover {
  float: right;
}
rf-files-manager .rf-upload-zone {
  display: block;
  overflow: auto;
}
rf-files-manager .pointer {
  cursor: pointer;
}

rf-file-viewer {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  min-width: 150px;
  min-height: 150px;
}
rf-file-viewer #the-svg {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: auto;
}
rf-file-viewer .full-screen {
  height: 100%;
  width: 100%;
  overflow: hidden;
}
rf-file-viewer .full-screen-text {
  width: 100%;
  padding: 20px;
}
rf-file-viewer iframe {
  border: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
rf-file-viewer iframe img {
  width: 100%;
}
rf-file-viewer .files {
  position: absolute;
  bottom: 0;
  width: 600px;
  text-align: left;
  background: rgba(0, 0, 0, 0.7019607843);
  color: white;
  padding: 30px;
  font-size: 12px;
  border-top-right-radius: 8px;
  max-height: 80%;
  overflow-y: auto;
  direction: rtl;
  left: -570px;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
rf-file-viewer .files .rf-btn {
  height: 25px;
  margin: 10px 0;
}
rf-file-viewer .files.active {
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  left: 0;
}
rf-file-viewer .files table {
  direction: ltr;
}
rf-file-viewer .files .sidebar-button {
  position: absolute;
  right: 0;
  top: 0;
  width: 30px;
  border-top-right-radius: 5px;
  margin: 0;
}
rf-file-viewer .compatibility-link {
  position: absolute;
  right: 10px;
  top: 40px;
}

rf-fold-btn {
  display: block;
  float: right;
  cursor: pointer;
}

rf-fold-btn-tri {
  display: block;
  float: right;
  cursor: pointer;
}

rf-hashtag {
  width: 100%;
}
rf-hashtag .tag-boxes {
  float: left;
}
rf-hashtag .tag-box {
  font-size: 12px;
  display: inline-block;
  border-left: 9px solid var(--main_color);
  font-weight: bold;
}
rf-hashtag .tag-box div {
  min-width: 150px;
}
rf-hashtag .tag-box i.fa.fa-remove {
  cursor: pointer;
}
rf-hashtag .fa-remove {
  display: none;
}
rf-hashtag.editmode .fa-remove {
  display: inline;
}
rf-hashtag.editmode .tag-edit {
  display: inline-block;
  position: relative;
  height: 100%;
}
rf-hashtag .hash-options-opened {
  z-index: 999;
  position: absolute;
  overflow-y: auto;
  max-height: 200px;
  border-radius: 0;
  transform: translateX(-100%);
}
rf-hashtag .hash-options-opened .hash-option {
  border-radius: 0;
  border-right: 1px solid var(--lightgrey);
}
rf-hashtag .hash-options {
  min-width: 140px;
  cursor: pointer;
  overflow-x: hidden;
}
rf-hashtag .tag-edit {
  float: right;
  display: none;
  height: 34px;
}
rf-hashtag .tag-edit input {
  border: none;
  height: 30px;
  margin-left: 2px;
  width: calc(100% - 5px) !important;
  padding-left: 4px;
  padding-right: 4px;
}
rf-hashtag .tag-edit .input-container {
  margin-bottom: 5px;
  margin-right: -5px;
  float: left;
  border-top: 1px solid var(--lightgrey);
  border-bottom: 1px solid var(--lightgrey);
  border-left: 1px solid var(--lightgrey);
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}
rf-hashtag .tag-edit .rf-btn {
  margin-top: 0;
  float: left;
  border-right: 1px solid;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}
rf-hashtag .tag-edit .rf-btn:hover {
  border-color: var(--main_color);
  margin-top: 0;
}
rf-hashtag .upper-box {
  overflow: auto;
}
rf-hashtag .hash-option-first {
  border-radius: 5px 0 0 5px;
  border-top: 1px solid var(--lightgrey);
}
rf-hashtag .hash-option {
  min-height: 29px;
  padding: 5px;
  min-width: 100px;
  background: white;
  border-bottom: 1px solid var(--lightgrey);
  border-left: 1px solid var(--lightgrey);
}
rf-hashtag .hash-option:hover {
  background: var(--midgrey);
}
rf-hashtag .expanded {
  margin-left: 140px;
}

rf-drawing-img img,
rf-drawing-img .nopreview {
  cursor: pointer;
  max-width: 100%;
}
rf-drawing-img img.disabled,
rf-drawing-img .nopreview.disabled {
  cursor: default;
}
rf-drawing-img.info .show-info {
  display: block !important;
}
rf-drawing-img .show-info {
  display: none;
  margin-top: 6px;
  word-break: break-all;
}
rf-drawing-img .nopreview {
  width: 90%;
  max-width: 500px;
  height: 90%;
  background: #ececec;
  text-align: center;
  color: var(--grey);
  padding-top: 3%;
  padding-bottom: 3%;
}
rf-drawing-img small {
  font-size: 8px;
}

rf-img-upload {
  display: block;
  min-height: 200px;
  position: relative;
}
rf-img-upload rf-upload-zone {
  width: 100%;
  height: 100%;
  border-color: var(--lightgrey) !important;
  color: var(--grey);
}
rf-img-upload .default-style .image-info-text {
  text-align: center;
  background: var(--darkwhite);
  border-radius: 15px;
}
rf-img-upload .default-style .image-container .controls-container {
  opacity: 0.8;
}
rf-img-upload .fa:hover {
  color: var(--main_color);
}
rf-img-upload .image-container {
  position: relative;
}
rf-img-upload .image-container img {
  width: 100%;
  border-radius: 10px;
}
rf-img-upload .image-container .fa {
  font-size: 30px;
  text-align: left;
  margin: 10px;
  color: white;
}
rf-img-upload .image-container .controls-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 50px;
  top: 0;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  opacity: 0;
  background: var(--grey);
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
rf-img-upload .image-container:hover .controls-container {
  opacity: 0.8;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}

rf-img-with-attachments {
  overflow: hidden;
  width: 300px;
  float: left;
  position: relative;
}
rf-img-with-attachments .show-drop {
  box-shadow: 0 0 1px -4px var(--main_color);
  float: left;
}
rf-img-with-attachments.info .show-info {
  display: block !important;
}
rf-img-with-attachments img {
  cursor: pointer;
}
rf-img-with-attachments .nopreview {
  width: 90%;
  height: 90%;
  background: #ececec;
  text-align: center;
  font-size: 150%;
  padding-top: 15%;
  padding-bottom: 15%;
}
rf-img-with-attachments.plain .thumbnail {
  background: none;
  border: none;
}
rf-img-with-attachments.plain .thumbnail ul {
  right: 10px;
}
rf-img-with-attachments .thumbnail {
  float: left;
  position: relative;
  min-height: 150px;
  background-color: whitesmoke;
  min-width: 250px;
  width: 80%;
  padding-right: 8px;
}
rf-img-with-attachments .thumbnail .show-info {
  display: none;
  margin-top: 6px;
}
rf-img-with-attachments .thumbnail .list-container {
  position: absolute;
  width: 28px;
  top: 0;
  right: 0;
  padding-left: 0;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
  background-color: none;
}
rf-img-with-attachments .thumbnail .list-container.offset {
  width: 42px;
}
rf-img-with-attachments .thumbnail .list-container:hover {
  background: var(--darkwhite);
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -ms-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
  width: 100%;
}
rf-img-with-attachments .thumbnail .list-container:hover .list-item:hover {
  opacity: 1;
}
rf-img-with-attachments .thumbnail .list-container:hover .list-item span {
  width: auto;
  opacity: 1;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
rf-img-with-attachments .thumbnail .list-container .list-item {
  display: inline-block;
  position: relative;
  text-align: center;
  color: var(--grey);
  cursor: pointer;
  font-size: 12px;
  height: 30px;
  width: 100%;
  border-bottom: 1px solid white;
}
rf-img-with-attachments .thumbnail .list-container .list-item span {
  color: var(--main_color);
  opacity: 0;
  display: block;
  line-height: 1;
  padding: 8px 0;
}
rf-img-with-attachments .thumbnail .list-container .list-item i {
  cursor: pointer;
  color: var(--grey);
  font-size: 13px;
  right: 7px;
  position: absolute;
  top: 7px;
}
rf-img-with-attachments .thumbnail .list-container .list-item i.download {
  font-size: 15px;
  top: 9px;
  right: 6px;
}
rf-img-with-attachments .thumbnail .list-container .list-item i.red {
  color: var(--darkred);
}
rf-img-with-attachments .thumbnail .list-container .list-item i.blue {
  color: var(--darkblue);
}
rf-img-with-attachments .thumbnail .list-container .list-item i.black {
  color: black;
}

rf-list-sidebar {
  position: fixed;
  display: block;
  top: 50px;
  right: 0;
  width: 0;
  bottom: 0;
  border-left: 1px solid var(--grey);
  background: white;
}
rf-list-sidebar .upper-container {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: calc(100% - 120px);
  overflow-y: auto;
}
rf-list-sidebar .upper-container h3 {
  color: var(--lightgrey);
}
rf-list-sidebar .upper-container table {
  width: 100%;
}
rf-list-sidebar .upper-container tr {
  font-size: 12px;
}
rf-list-sidebar .upper-container tr td:first-child {
  padding: 10px 0 10px 8px;
}
rf-list-sidebar .upper-container tr input {
  width: 90px;
  height: 18px;
  text-align: right;
}
rf-list-sidebar .lower-container {
  border-top: 1px solid var(--grey);
  position: absolute;
  height: 120px;
  right: 0;
  left: 0;
  bottom: 0;
  padding: 0 25px;
}
rf-list-sidebar .lower-container .list-name input {
  height: 30px;
  padding: 5px 2px;
}
rf-list-sidebar .position input {
  height: 16px;
  width: 40%;
}
rf-list-sidebar.active {
  width: 350px;
}

@media (max-width: 600px) {
  rf-list-tabs {
    font-size: 80%;
  }
}
rf-list-tabs .state-btn {
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
rf-list-tabs .state-btn:hover {
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  cursor: pointer;
  opacity: 0.8;
  color: var(--main_color);
  border-bottom: 5px solid var(--main_color);
}
rf-list-tabs .state-btn.active {
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
@media (max-width: 600px) {
  rf-list-tabs .state-btn.active {
    border-bottom: none;
    color: var(--main_color);
  }
}
rf-list-tabs.navtop {
  position: fixed;
  margin-left: 12px;
  top: 24px;
}
rf-list-tabs.navtop .state-btn {
  padding: 0 8px;
}
@media (max-width: 600px) {
  rf-list-tabs.navtop {
    margin-left: 40px;
  }
  rf-list-tabs.navtop .state-btn {
    padding: 0 11px;
    margin-right: 10px;
  }
}
rf-list-tabs.navtop .underline {
  border: none;
}

rf-loading-spinner .spin {
  font-size: 25px !important;
  position: absolute;
  left: 50%;
  top: 40%;
  z-index: 1000;
  animation: rotate 2s linear infinite;
}
@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

rf-notification {
  z-index: 999999;
  padding: 0;
  margin: 0;
  position: fixed;
  top: 40px;
}
rf-notification .notification {
  padding: 5px 15px;
  background: var(--lightgrey);
  font-weight: bold;
  margin-bottom: 0;
  border: none;
  border-radius: 0;
  transform: translate(50vw);
  margin-left: -250px;
  width: 500px;
}
rf-notification .notification i {
  font-style: normal;
}
rf-notification .notification.left {
  transform: none;
  margin-left: 20px;
}
rf-notification .notification.info {
  background: var(--blue);
}
rf-notification .notification.info i::before {
  content: "\f05a";
  color: var(--darkblue);
}
rf-notification .notification.success {
  background: var(--green);
}
rf-notification .notification.success i::before {
  content: "\f058";
  color: var(--darkgreen);
}
rf-notification .notification.alert {
  background: var(--yellow);
}
rf-notification .notification.alert i::before {
  content: "\f06a";
  color: var(--darkyellow);
}
rf-notification .notification.error {
  background: var(--red);
}
rf-notification .notification.error i::before {
  content: "\f05e";
  color: var(--darkred);
}
rf-notification .notification.light {
  color: var(--grey);
  opacity: 0.9;
  background: rgba(211, 211, 211, 0.0705882353);
}
rf-notification .notification.light i::before {
  content: "\f058";
  color: var(--midgrey);
}
rf-notification .notification i::before {
  font-family: FontAwesome;
  content: "\f05a";
  position: absolute;
}
rf-notification .notification .message {
  white-space: pre-line;
  margin-left: 20px;
  margin-right: 20px;
  margin-top: -20px;
}
rf-notification .notification .fa-times-circle {
  position: absolute;
  right: 11px;
  top: 4px;
  font-size: 20px;
}
@media print {
  rf-notification {
    display: none;
  }
}

rf-pdfjs {
  display: block;
  width: 100%;
  height: 100%;
}
rf-pdfjs #the-svg {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: auto;
}

rf-pdf-manager.simple-style .block-header,
rf-pdf-manager.simple-style .list {
  border: none;
  padding-left: 0;
}
rf-pdf-manager.simple-style .block-header span {
  font-weight: bold;
  padding: 0;
}
rf-pdf-manager li {
  list-style: none;
  line-height: 16px;
}
rf-pdf-manager .block-header {
  position: relative;
}
rf-pdf-manager .block-header span {
  line-height: 24px;
  padding: 0 10px;
}
rf-pdf-manager .block-header,
rf-pdf-manager .list {
  border: 1px solid #aaa;
  padding-left: 20px;
  margin: 0 1px;
}
rf-pdf-manager .list {
  padding: 15px 10% 0 20px;
  border-top: none;
}
rf-pdf-manager .list li {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
rf-pdf-manager .list i {
  margin: 0 4px;
}
rf-pdf-manager .list .fa {
  cursor: pointer;
  color: var(--main_color);
}
rf-pdf-manager .list .fa.disabled {
  opacity: 0.25;
  color: gray;
}
rf-pdf-manager .file-select {
  cursor: pointer;
  margin-top: 10px;
}
rf-pdf-manager .file-select:hover {
  color: var(--main_color);
}

rf-profile-pic {
  display: block;
}
rf-profile-pic.md .image-cropper {
  width: 36px;
  height: 36px;
}
rf-profile-pic.sm .image-cropper {
  width: 30px;
  height: 30px;
}
rf-profile-pic.xs .image-cropper {
  width: 24px;
  height: 24px;
}
rf-profile-pic .image-cropper {
  width: 48px;
  height: 48px;
  position: relative;
  overflow: hidden;
  float: left;
}
rf-profile-pic .image-cropper img {
  width: auto;
  height: 100%;
}
rf-profile-pic .image-cropper .image {
  padding: 1px;
}
rf-profile-pic .profile-window {
  position: absolute;
  top: 0;
  left: 0;
  width: auto;
  height: 100%;
}

rf-rating .grey-text {
  color: var(--midgrey);
  float: left;
}
rf-rating .info {
  color: var(--main_color);
}

rf-scope {
  position: relative;
  display: inline-block;
}

rf-show-standard-text .cover {
  display: flex;
  align-items: center;
  border: 1px solid;
  border-radius: 10px;
  border-color: var(--midgrey);
  color: var(--main_color);
  font-size: 11px;
  text-align: center;
  margin: 5px;
}
rf-show-standard-text .icon {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
rf-show-standard-text .cover p:hover,
rf-show-standard-text .cover .icon:hover {
  background-color: var(--lightgrey);
  cursor: pointer;
}
rf-show-standard-text .cover p {
  margin: 0px !important;
  padding: 0px 5px 0px 5px;
  border-right: 1px solid;
  min-width: 100px;
  width: auto;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  border-color: var(--midgrey);
  font-weight: bold;
  height: 100%;
}
rf-show-standard-text .cover .icon {
  padding: 0px 9px 0px 8px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  font-size: 10px;
}

rf-star .start-container {
  float: left;
  width: 20px;
  height: 20px;
  position: relative;
}
rf-star .start-container i {
  position: absolute;
  top: 2px;
  left: 2px;
  font-size: 16px;
  color: gold;
}
rf-star .start-container i.hover {
  opacity: 0.5;
}
rf-star .start-container .click-container {
  z-index: 10;
  float: left;
  width: 10px;
  height: 20px;
  position: relative;
  cursor: pointer;
}
rf-star .rating {
  color: var(--midgrey);
}

rf-status-icon .type-rf .status {
  transform: translate(65%, 72%);
}
rf-status-icon .type-fa div {
  padding-top: 0px !important;
  font-size: 24px;
}
rf-status-icon .type-fa .status {
  transform: translate(-20%, 85%);
}
rf-status-icon .status {
  border-radius: 50%;
  border: 2px solid white;
  padding: 4px;
  font-size: 12px;
  position: absolute;
}
rf-status-icon .check {
  background-color: var(--green);
  color: var(--darkgreen);
}
rf-status-icon .warning {
  background-color: var(--yellow);
  color: var(--red);
}
rf-status-icon .error {
  background-color: var(--red);
  color: var(--midwhite);
}

rf-stop-watch {
  display: block;
  overflow: auto;
  position: relative;
}
rf-stop-watch .outer-tracking-container {
  height: 40px;
  float: left;
}
rf-stop-watch .outer-tracking-container input {
  width: calc(100% - 40px);
  margin: 0;
  height: 100%;
  float: left;
}
rf-stop-watch .counting input {
  color: var(--main_color);
}
rf-stop-watch .btn-container {
  width: 40px;
  float: left;
  height: 100%;
}
rf-stop-watch .rf-btn, rf-stop-watch .rf-btn.rf-btn-inverted,
rf-stop-watch .rf-btn:hover {
  overflow: auto;
  cursor: pointer;
  height: 100%;
  width: 100%;
  margin: 0;
  border-radius: 4px;
  text-align: center;
  vertical-align: middle;
}
rf-stop-watch .rf-btn.btn-red {
  background: var(--red);
}
rf-stop-watch .rf-btn.btn-green {
  background: var(--green);
}
rf-stop-watch .rf-btn:hover {
  opacity: 0.6;
}
rf-stop-watch .rf-btn .fa {
  line-height: 27px;
  font-size: 20px;
  color: white;
}

rf-table td {
  font-size: 10px;
  padding: 0 5px;
  border-left: 1px solid var(--darkwhite);
  border-bottom: 1px solid var(--lightgrey);
}
rf-table thead td {
  height: 90px;
  padding: 0 10px;
  cursor: pointer;
}
rf-table thead td .rotated-text {
  transform: rotate(-90deg) translate(-15px, 0);
  width: 30px;
}
rf-table thead td:hover {
  color: var(--main_color);
}
rf-table table {
  width: 100%;
  display: block;
  overflow: auto;
}

.rf-table-header tr td {
  text-align: left;
  padding: 0 5px;
}
.rf-table-header tr td a {
  color: var(--midgrey);
  cursor: pointer;
}
.rf-table-header tr td span {
  color: var(--midgrey);
}
.rf-table-header tr td.active a {
  color: var(--main_color);
}

rf-tag {
  display: block;
  line-height: 100%;
}
rf-tag .tag-box,
rf-tag .tag-edit {
  display: inline-block;
}
rf-tag .tag-box .rf-btn,
rf-tag .tag-edit .rf-btn {
  margin: 0;
}
rf-tag .tag-edit {
  margin-left: 0;
}
rf-tag .tag-edit .rf-btn {
  padding: 3px 4px;
}
rf-tag .color-label {
  width: 11px;
  position: absolute;
  left: -1px;
  bottom: -1px;
  top: -1px;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

rf-tags {
  display: block;
  line-height: 100%;
}
rf-tags .tag-box {
  background: var(--midwhite);
  line-height: 20px;
  border-radius: 4px;
  cursor: default;
  display: inline-block;
}
rf-tags .tag-select {
  padding: 5px;
  margin: 0 5px 5px;
  background: var(--main_color);
  line-height: 20px;
  border-radius: 4px;
  cursor: pointer;
  color: white;
  float: left;
}
rf-tags .tag-select:hover {
  opacity: 0.7;
}
rf-tags.view-mode .tag-select {
  display: none;
}
rf-tags span {
  float: left;
}
rf-tags.small .tag-box {
  padding: 1px 5px;
  margin: 0 5px 2px 0;
  background: var(--midwhite);
  font-size: 10px;
  line-height: 20px;
  border-radius: 4px;
}
rf-tags.small .tag-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  flex-direction: row;
}
rf-tags.offset-left {
  display: inline-block;
  margin-left: -30px;
}

rf-task-list {
  display: block;
  text-align: left;
}
rf-task-list .fa {
  font-size: 20px;
}
rf-task-list .rf-btn, rf-task-list .rf-btn.rf-btn-inverted,
rf-task-list .rf-btn:hover {
  text-align: center;
}
rf-task-list .check {
  padding-top: 12px;
}
rf-task-list .task-list {
  margin: 15px;
}
rf-task-list .task {
  padding-top: 20px;
  padding-bottom: 20px;
  margin-bottom: -1px;
  border: 1px solid var(--lightgrey);
}
rf-task-list .task .text {
  white-space: pre-line;
  margin-top: -23px;
}
rf-task-list .task .fa-exclamation-triangle {
  color: var(--invalid);
}
rf-task-list .task .fa-check-color {
  color: var(--darkgreen);
}
rf-task-list .message {
  min-height: 80px;
}

rf-upload-progress {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
}
rf-upload-progress .bar {
  height: 5px;
  float: left;
  background: var(--main_color);
}

view-json pre {
  font-size: 9px;
  padding: 5px;
  margin: 5px;
}
view-json pre .string {
  color: var(--darkgreen);
}
view-json pre .number {
  color: darkorange;
}
view-json pre .boolean {
  color: var(--blue);
}
view-json pre .null {
  color: darkorange;
}
view-json pre .key {
  color: grey;
}

rf-erp-login-menu {
  display: block;
  position: relative;
}
rf-erp-login-menu .username {
  margin-right: 20px;
  float: right;
  position: absolute;
  right: 40px;
  width: max-content;
}
rf-erp-login-menu .dropdown-toggle {
  margin-top: 10px;
  margin-right: 17px;
}
rf-erp-login-menu .dropdown p {
  padding-left: 12.5px;
  padding-right: 12.5px;
  margin: 0;
}
rf-erp-login-menu .login-menu-menu {
  position: absolute;
  right: 0;
  top: 34px;
  border: 1px solid gray;
  display: none;
  border-radius: 0;
  box-shadow: 0 6px 12px var(--lightgrey);
  padding: 0 !important;
}
rf-erp-login-menu .login-menu-menu li {
  list-style: none;
  font-size: 14px;
  min-width: 200px;
  background: white;
  line-height: 35px;
  position: relative;
  border-bottom: 1px solid var(--lightgrey);
}
rf-erp-login-menu .login-menu-menu a {
  color: black;
  display: block;
  width: 100%;
  height: 100%;
  padding-left: 35px;
  cursor: pointer;
}
rf-erp-login-menu .login-menu-menu .fa {
  line-height: 24px;
  position: absolute;
  font-size: 18px;
  float: none;
  left: 5px;
  width: 24px;
  text-align: center;
  color: black;
  padding: 6px 0;
  margin: 0;
}
rf-erp-login-menu .active .dropdown .dropdown-menu,
rf-erp-login-menu .active .dropdown .login-menu-menu, rf-erp-login-menu .dropdown:hover .dropdown-menu,
rf-erp-login-menu .dropdown:hover .login-menu-menu {
  display: block;
  left: auto;
  right: 0;
  top: 95%;
  margin-top: 2px;
}
rf-erp-login-menu .active .dropdown .dropdown-menu li:hover,
rf-erp-login-menu .active .dropdown .login-menu-menu li:hover, rf-erp-login-menu .dropdown:hover .dropdown-menu li:hover,
rf-erp-login-menu .dropdown:hover .login-menu-menu li:hover {
  background: #fff;
}
rf-erp-login-menu .active .dropdown .dropdown-menu li:hover a,
rf-erp-login-menu .active .dropdown .login-menu-menu li:hover a, rf-erp-login-menu .dropdown:hover .dropdown-menu li:hover a,
rf-erp-login-menu .dropdown:hover .login-menu-menu li:hover a {
  background: lightgrey;
}
rf-erp-login-menu .active .dropdown .dropdown-menu li:hover .user-data,
rf-erp-login-menu .active .dropdown .login-menu-menu li:hover .user-data, rf-erp-login-menu .dropdown:hover .dropdown-menu li:hover .user-data,
rf-erp-login-menu .dropdown:hover .login-menu-menu li:hover .user-data {
  background: #fff;
}

rf-related-documents .main-document-number {
  background: var(--main_color);
  line-height: 30px;
  border-radius: 15px;
  padding-left: 10px;
}
rf-related-documents .no-margin {
  margin: 0px !important;
}
rf-related-documents .customer-options {
  border-left: 2px solid white;
  margin: 10px 0 0 15px;
  padding-left: 10px;
}
rf-related-documents .customer-options:hover {
  color: var(--main_color);
}
rf-related-documents .customer-options a {
  line-height: 15px !important;
  height: 15px !important;
  margin-left: 0 !important;
}
rf-related-documents .customer-spacer {
  border-bottom: 2px solid white;
}
rf-related-documents i {
  width: 10px !important;
}

rf-side-bar-navigation .sidebar {
  display: block;
  position: fixed;
  background: linear-gradient(var(--bg1), var(--bg2));
  text-transform: uppercase;
  font-size: 11px;
  color: white;
  left: 0;
  top: 0;
  bottom: 0;
  width: 50px;
  z-index: 200;
  user-select: none;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media print {
  rf-side-bar-navigation .sidebar {
    display: none;
  }
}
rf-side-bar-navigation .sidebar.closed {
  width: 0;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  background: white;
  height: 50px;
  bottom: auto;
  border-bottom: 1px solid var(--main_color);
}
rf-side-bar-navigation .sidebar.open {
  width: 200px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
rf-side-bar-navigation .sidebar.open .navigation-logo .logo {
  display: block;
}
rf-side-bar-navigation .sidebar.open .navigation-logo .logo-small {
  display: none;
}
rf-side-bar-navigation .sidebar.disabled {
  width: 0;
  left: 0;
  bottom: auto;
  -webkit-transition: all 0s ease-in-out;
  -moz-transition: all 0s ease-in-out;
  -ms-transition: all 0s ease-in-out;
  -o-transition: all 0s ease-in-out;
  transition: all 0s ease-in-out;
}
rf-side-bar-navigation .sidebar.disabled .navigation-logo .logo {
  display: none;
}
rf-side-bar-navigation .sidebar.disabled .navigation-logo .logo-small {
  display: none;
}
rf-side-bar-navigation .sidebar.mini i.arrow {
  display: none;
}
rf-side-bar-navigation .sidebar.mini .sidebar-spacer {
  margin-top: 0;
}
rf-side-bar-navigation .sidebar.mini .nav-sidebar-content .navigation-item.item-active {
  border-left: none;
}
rf-side-bar-navigation .sidebar .navigation-logo {
  cursor: pointer;
}
rf-side-bar-navigation .sidebar .navigation-logo .logo {
  display: none;
}
rf-side-bar-navigation .sidebar .navigation-logo .logo img {
  width: 161px;
  margin-top: 13px;
  margin-left: 22px;
}
rf-side-bar-navigation .sidebar .navigation-logo .logo-small {
  display: block;
}
rf-side-bar-navigation .sidebar .navigation-logo .logo-small img {
  width: 30px;
  margin-left: 8px;
  margin-top: 11px;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content {
  position: absolute;
  top: 49px;
  left: 0;
  right: 0;
  bottom: 50px;
  overflow-y: auto;
  overflow-x: hidden;
  direction: rtl;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content a {
  color: var(--grey);
  display: block;
  position: relative;
  height: 30px;
  line-height: 30px;
  margin: 5px 8px;
  border-radius: 15px;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content rf-related-documents {
  display: block;
  position: relative;
  margin: 5px 8px;
  direction: ltr;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content i.arrow {
  float: right;
  line-height: 32px;
  color: var(--grey);
}
rf-side-bar-navigation .sidebar .nav-sidebar-content i.unpinned {
  transform: rotate(45deg);
  opacity: 50%;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item {
  direction: ltr;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item a:hover {
  color: var(--main_color);
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item .dropdown-sidebar-menu {
  display: none;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item.item-active a {
  text-decoration: none;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item.item-active a:hover {
  color: var(--main_color_light);
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item.item-active .main-item.active {
  color: var(--main_color_light);
  background: white;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item.item-active .main-item.active i {
  color: var(--main_color_light);
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item.item-active .main-item.active:hover {
  color: var(--main_color_light);
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item.item-active .main-item:hover {
  color: var(--main_color);
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item.item-active .dropdown-sidebar-menu.extended {
  display: block;
  border-radius: 0;
  padding: 0 !important;
  z-index: 9999;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item.item-active .dropdown-sidebar-menu.extended a:hover {
  color: var(--main_color_light);
  background: var(--midwhite) !important;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item.item-active .dropdown-sidebar-menu.extended a.active {
  color: var(--main_color_light);
  background: var(--midwhite) !important;
}
rf-side-bar-navigation .sidebar .nav-sidebar-content .navigation-item.item-active .dropdown-sidebar-menu.extended span {
  font-size: 11px;
}
rf-side-bar-navigation .sidebar.open .nav-sidebar-content .navigation-item.item-inactive:hover .dropdown-sidebar-menu {
  display: block;
}
rf-side-bar-navigation .sidebar.open .nav-sidebar-content .navigation-item.item-inactive .dropdown-sidebar-menu {
  background: var(--bg1);
  border-radius: 10px;
  position: fixed;
  left: 199px;
  top: auto;
  margin-top: -40px;
  border: none;
  min-width: 220px;
  z-index: 999;
}
rf-side-bar-navigation .sidebar.open .nav-sidebar-content .navigation-item.item-inactive .dropdown-sidebar-menu:hover {
  background: var(--bg2);
}
@media (max-height: 700px) {
  rf-side-bar-navigation .sidebar.open .nav-sidebar-content .navigation-item.item-inactive .dropdown-sidebar-menu.lower-menu {
    bottom: 10px;
    height: auto;
    width: 250px;
  }
}
rf-side-bar-navigation .sidebar.open .nav-sidebar-content .navigation-item.item-inactive .dropdown-sidebar-menu a {
  background: var(--lightgrey);
  color: white;
}
rf-side-bar-navigation .sidebar.open .nav-sidebar-content .navigation-item.item-inactive .dropdown-sidebar-menu a:hover {
  color: var(--main_color_light);
  background: var(--midwhite) !important;
}
rf-side-bar-navigation .sidebar.open .nav-sidebar-content .navigation-item.item-inactive .dropdown-sidebar-menu span {
  display: inline;
}
rf-side-bar-navigation .sidebar .bottom {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 50px;
  overflow: hidden;
  background: var(--bg2);
  transition: width 0.3s ease-in-out;
}
rf-side-bar-navigation .sidebar .bottom button {
  background: var(--lightgrey);
  font-weight: bold;
  color: white;
  border: none;
  white-space: nowrap;
  width: 100%;
  height: 35px;
  text-align: left;
}
rf-side-bar-navigation .sidebar .bottom rf-policy-link {
  display: none;
}
rf-side-bar-navigation .sidebar .bottom rf-policy-link .privacy-info {
  position: absolute;
  white-space: nowrap;
  margin-left: 15px;
  bottom: 25px;
}
rf-side-bar-navigation .sidebar i {
  width: 20px;
  margin-left: 10px;
}
rf-side-bar-navigation .sidebar .sidebar-spacer {
  border-bottom: 2px solid white;
  margin: 0 15px;
}
rf-side-bar-navigation .sidebar .return {
  font-weight: bold;
  margin-top: 20px;
}

@media print {
  rf-top-nav {
    display: none !important;
  }
}
rf-top-nav nav {
  z-index: 999;
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
  background: linear-gradient(90deg, var(--bg1), var(--bg2));
  padding-bottom: 1px;
}
rf-top-nav .top-nav-upper-text {
  color: var(--midgrey);
  font-size: 10px;
  margin-top: 6px;
  float: left;
}
rf-top-nav .breadcrump-info {
  padding-left: 20px;
}
rf-top-nav rf-erp-login-menu {
  float: right;
  z-index: 999;
  padding: 0 0 0 10px;
}
rf-top-nav rf-erp-login-menu a.dropdown-toggle {
  float: right;
}
rf-top-nav rf-erp-login-menu .login-menu-list {
  z-index: 9999;
  top: 50px;
}
rf-top-nav rf-erp-login-menu .dropdown:hover .login-menu-menu {
  top: 25px !important;
}

rf-checkbox {
  position: relative;
}
rf-checkbox .checkbox-square {
  border: 0.05em solid black;
  border-radius: 2px;
  width: 16px;
  height: 16px;
  margin: 0;
  padding: 0;
  position: absolute;
  font-size: 25px;
  left: 0;
  top: 0;
}
rf-checkbox .checkbox-square.disabled {
  cursor: disabled;
  background: var(--lightgrey);
  border: 0.05em solid var(--midgrey);
}
rf-checkbox .checkbox-square.disabled input {
  display: none;
}
rf-checkbox .checkbox-square.disabled i {
  color: var(--grey) !important;
}
rf-checkbox .checkbox-check {
  color: var(--darkgreen);
  position: absolute;
  font-size: 16px;
  left: -1px;
  top: -4px;
  width: 16px;
  height: 16px;
  margin: 0;
  padding: 0;
}
rf-checkbox .checkbox-input {
  position: absolute;
  cursor: pointer;
  left: -1px;
  top: 1px;
  opacity: 0;
  width: 16px;
  height: 16px;
  margin: 0 !important;
  padding: 0;
}
rf-checkbox .checkfalse {
  color: var(--red);
  padding: 2px 0 0 1px;
}

rf-comment {
  width: 100%;
  max-width: 1000px;
  border: 1px solid var(--lightgrey);
  border-radius: 3px;
  background: white;
  margin-bottom: 10px;
  position: relative;
  padding: 10px;
  display: block;
}
rf-comment textarea {
  color: black;
  min-height: 220px;
}
rf-comment .upload .file {
  line-height: 21px;
}
rf-comment .upload .file a {
  cursor: pointer;
  white-space: nowrap;
}

rf-dynamic-input {
  width: 100%;
  position: relative;
  display: block;
}
rf-dynamic-input .input-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 35px;
}
rf-dynamic-input .input-container input {
  padding: 0 3px;
  text-align: right;
  margin: 0;
}
rf-dynamic-input .input-container.large {
  right: 0;
}
rf-dynamic-input label {
  position: absolute;
  top: 1px;
  right: 30px;
  width: 0;
  text-align: right;
  font-weight: normal;
}
rf-dynamic-input label select {
  appearance: none;
  margin: 0;
}
rf-dynamic-input .modified {
  color: var(--red);
}
rf-dynamic-input .reset-btn {
  position: absolute;
  top: 0;
}
rf-dynamic-input .reset-btn i {
  font-size: 11px;
  margin-top: 5px;
  margin-left: 5px;
  color: var(--red);
  float: right;
}
rf-dynamic-input .reset-btn i:hover {
  color: var(--main_color);
}

.input-wrap {
  float: left;
  height: 30px;
  position: relative;
  width: 100%;
}
.input-wrap input {
  width: 100%;
  height: 100%;
}
.input-wrap .input-spinner {
  position: absolute;
  right: 8px;
  top: -1px;
  height: 100%;
  width: 4px;
  z-index: 10;
}
.input-wrap .input-spinner .i.icon.arrow.up::before,
.input-wrap .input-spinner i.icon.arrow.down::before {
  width: 4px;
  height: 4px;
}
.input-wrap .input-spinner i {
  cursor: pointer;
  margin: 0;
  position: relative;
  float: right;
  color: var(--lightgrey);
  font-size: 1.2em;
}
.input-wrap .input-spinner i.fa-caret-up {
  top: -1px;
  right: -4px;
}
.input-wrap .input-spinner i.fa-caret-down {
  top: -5px;
  right: -4px;
}

rf-json-text-input {
  display: block;
  width: 100%;
  position: relative;
  overflow: auto;
  padding-bottom: 10px;
}
rf-json-text-input .label-item {
  width: 100%;
  float: left;
}
rf-json-text-input .label-item.error {
  background: #ffcece;
}
rf-json-text-input .fa-times-circle {
  margin-left: 5px;
  color: red;
}
rf-json-text-input .col-1 {
  width: 270px;
  text-align: right;
  float: left;
  line-height: 20px;
  height: 20px;
  color: var(--midgrey);
}
rf-json-text-input .col-1 .rf-btn {
  float: left;
  margin: 0;
  padding: 0 6px;
  color: var(--lightgrey);
}
rf-json-text-input .col-1 .rf-btn:hover {
  color: var(--main_color);
}
rf-json-text-input .col-1 span {
  padding-right: 5px;
}
rf-json-text-input .col-2 {
  position: absolute;
  left: 270px;
  width: calc(100% - 300px);
  min-width: calc(100% - 300px);
  max-width: calc(100% - 300px);
  border: 1px solid var(--midgrey);
  background: rgba(255, 255, 255, 0.6784313725);
}
rf-json-text-input .col-3 {
  width: 30px;
  float: right;
}

rf-labeled-checkbox {
  position: relative;
}
rf-labeled-checkbox span.checkbox-label i {
  position: relative;
  vertical-align: middle;
  bottom: 1px;
}
rf-labeled-checkbox .checkbox-square {
  border: 0.05em solid black;
  border-radius: 2px;
  width: max-content;
  height: max-content;
  cursor: pointer;
}
rf-labeled-checkbox .checked {
  color: var(--darkgreen);
}
rf-labeled-checkbox .unchecked {
  color: white;
}
rf-labeled-checkbox .checked-false {
  padding-left: 1px;
  color: var(--red);
}
rf-labeled-checkbox .disabled {
  cursor: text;
  background-color: var(--lightgrey);
}
rf-labeled-checkbox span {
  white-space: nowrap;
}

rf-markdown {
  display: flex;
  padding: 5px 30px;
}
rf-markdown .list-v {
  float: right;
  z-index: 100;
}
rf-markdown .md-container {
  position: relative;
  float: left;
  overflow: auto;
  width: calc(100% - 30px);
}
rf-markdown .md-container .md-box {
  width: 100%;
  display: block;
  max-width: 100%;
  min-width: 100%;
  border: none;
  word-break: break-all;
}
rf-markdown .md-container textarea.md-box {
  min-height: 85px;
}
rf-markdown textarea:hover {
  box-shadow: 0 0 3px 0 var(--main_color_light);
}
rf-markdown h1 {
  font-size: 26px;
}
rf-markdown h2 {
  font-size: 22px;
}
rf-markdown h3 {
  font-size: 18px;
}
rf-markdown h4 {
  font-size: 14px;
  font-weight: bold;
}
rf-markdown h5 {
  font-size: 10px;
  font-weight: bold;
}
rf-markdown h6 {
  font-size: 8px;
}
rf-markdown ul {
  padding-left: 20px;
}

multi-input {
  height: 100%;
}
multi-input input, multi-input select {
  height: 100%;
  width: 100%;
  border: 1px solid transparent;
  background: none;
}
multi-input input:hover, multi-input select:hover {
  border: 1px solid var(--lightgrey);
}
multi-input rf-checkbox .checkbox-square {
  top: 8px;
}
multi-input .clickable {
  cursor: pointer;
  text-decoration: underline;
}
multi-input .clickable:hover {
  color: var(--main_color);
}

rf-percentage-input input {
  width: 100%;
  text-align: right;
}

rf-textarea {
  position: relative;
}
rf-textarea .textfield {
  padding: 5px 0 0;
  position: relative;
  border-bottom: 1px solid #ddd;
  overflow: auto;
  top: -3px;
}
rf-textarea .textfield textarea {
  position: relative;
  border: 0;
  width: calc(100% - 20px);
  background: none;
  padding-top: 3px;
  margin-top: -3px;
}
rf-textarea .textfield textarea.no-resize {
  resize: none;
}
rf-textarea .textfield textarea.no-vertical {
  resize: vertical;
}
rf-textarea .textfield textarea.no-horizontal {
  resize: horizontal;
}
rf-textarea .textfield textarea.disabled.disabled {
  outline: 0;
  cursor: default;
}
rf-textarea .textfield ::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: #ececec;
}
rf-textarea .textfield :-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #ececec;
  opacity: 1;
}
rf-textarea .textfield ::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #ececec;
  opacity: 1;
}
rf-textarea .textfield :-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #ececec;
}
rf-textarea .textfield ::-ms-input-placeholder {
  /* Microsoft Edge */
  color: #ececec;
}
rf-textarea .textfield ::placeholder {
  /* Most modern browsers support this now. */
  color: #ececec;
}
rf-textarea .fa-pencil {
  position: absolute;
  top: 10px;
  right: 2px;
  font-size: 12px !important;
  color: lightgrey;
}
rf-textarea .edit-buttons {
  position: absolute;
  top: 5px;
  right: 2px;
  font-size: 16px;
}
.rf-edit rf-textarea .edit-buttons {
  z-index: 3;
}
rf-textarea .edit-buttons a {
  cursor: pointer;
  color: var(--main_color);
}
rf-textarea .edit-buttons a:hover {
  opacity: 0.8;
}

rf-text-editor {
  /* stylelint-disable-next-line */
}
rf-text-editor .CodeMirror-hscrollbar {
  visibility: hidden;
}
rf-text-editor .controls b {
  line-height: 36px;
}
rf-text-editor .controls input {
  padding: 5px;
  margin: 5px 0;
}
rf-text-editor .text-editor {
  overflow: auto;
  height: 540px;
}
rf-text-editor article {
  text-align: left;
  border-top: 1px solid lightgray;
}
rf-text-editor .rf-btn, rf-text-editor .rf-btn.rf-btn-inverted,
rf-text-editor .rf-btn:hover,
rf-text-editor select {
  width: 100%;
}

rf-time-input {
  width: 100%;
  position: relative;
  display: block;
}
rf-time-input .rf-time-input-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 31px;
}
rf-time-input .rf-time-input-container input.time-input {
  width: 100%;
  text-align: right;
  padding: 0 3px;
}
rf-time-input select.time-input {
  line-height: 18px;
  width: 32px;
  float: right;
  appearance: none;
}
rf-time-input input.time-input,
rf-time-input select.time-input {
  margin: 0;
}

rf-trash-icon .pointer {
  cursor: pointer;
}

rf-tree-input {
  display: block;
}
rf-tree-input .padded {
  padding-left: 20px;
  margin-bottom: 20px;
}
rf-tree-input .rf-edit.rf-label label {
  width: 70%;
}
rf-tree-input .rf-edit.rf-label input {
  width: 30%;
}
rf-tree-input.small .rf-edit {
  padding: 0;
  margin-bottom: 0;
  border-bottom: 1px solid var(--darkwhite);
}

rf-multi-checkbox {
  position: relative;
}
rf-multi-checkbox .filter-items {
  display: inline-block;
}

rf-opts-click .select-row {
  background: white;
  border: 1px solid var(--lightgrey);
  padding: 6px 11px;
  border-radius: 20px;
  width: max-content;
  cursor: pointer;
}
rf-opts-click .select-row i {
  float: right;
  margin-left: 8px;
  margin-top: 2px;
  color: var(--main_color);
}
rf-opts-click .select-row:hover {
  opacity: 0.8;
  color: var(--main_color);
}
rf-opts-click .lower-select-container {
  width: max-content;
  position: absolute;
}
rf-opts-click .lower-select-container .inner-select-container {
  z-index: 9999;
  position: relative;
  width: max-content;
  padding-right: 30px;
}
rf-opts-click .lower-select-row {
  min-height: 32px;
  padding: 5px 15px;
  background: white;
  border: 1px solid var(--lightgrey);
  width: 100%;
  cursor: pointer;
}
rf-opts-click .lower-select-row:hover {
  background: var(--midwhite);
}

rf-search-field {
  display: block;
  width: 100%;
  position: relative;
}
rf-search-field input {
  width: 100%;
  height: 30px;
  background: white;
  border: 1px solid var(--lightgrey);
  border-radius: 25px;
  padding-left: 16px !important;
  padding-right: 35px !important;
}
rf-search-field input:focus {
  box-shadow: 0 0 3px 0 var(--main_color_light);
}
rf-search-field .fa {
  color: var(--midgrey);
  position: absolute;
  top: 4px;
}
rf-search-field .fa-search {
  font-size: 12px;
  color: white;
  position: absolute;
  top: 1px;
  background: var(--main_color);
  height: 28px;
  width: 35px;
  padding: 7px 9px;
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
  right: 0;
  pointer-events: none;
}
rf-search-field .fa-times {
  right: 55px;
  font-size: 20px;
  cursor: pointer;
  top: 4px;
}
rf-search-field .fa-times:hover {
  opacity: 0.6;
}
rf-search-field.big input {
  height: 42px;
}
rf-search-field.big .fa-search {
  font-size: 20px;
  top: 1px;
  height: 40px;
  padding: 9px 6px;
}
rf-search-field.big .fa-times {
  top: 10px;
}

rf-search-sorting {
  display: block;
}
rf-search-sorting .padding-btn {
  padding: 6px;
}
rf-search-sorting select.search-sorting-border-btn {
  padding-right: 15px;
}
@media (max-width: 1024px) {
  rf-search-sorting select.search-sorting-border-btn {
    font-size: 85%;
    padding-left: 0;
  }
}
rf-search-sorting .fa,
rf-search-sorting select {
  cursor: pointer;
}
rf-search-sorting .select-container {
  position: relative;
  width: min-content;
  float: right;
  color: var(--grey);
}
rf-search-sorting .select-container select {
  float: left;
}
rf-search-sorting .select-container i {
  z-index: 1;
  display: block;
  color: var(--midgrey);
  position: absolute;
  right: 20px;
  top: 9px;
  pointer-events: none;
}

rf-search-toggle {
  display: block;
}

rf-tag-click .select-row {
  background: white;
  border: 1px solid var(--lightgrey);
  padding: 6px 11px;
  border-radius: 20px;
  width: max-content;
  cursor: pointer;
}
rf-tag-click .select-row i {
  float: right;
  margin-left: 8px;
  margin-top: 2px;
  color: var(--main_color);
}
rf-tag-click .select-row:hover {
  opacity: 0.8;
  color: var(--main_color);
}
rf-tag-click .lower-select-container {
  width: max-content;
  position: absolute;
  max-height: 300px;
  overflow-y: auto;
}
rf-tag-click .lower-select-container .inner-select-container {
  z-index: 9999;
  position: relative;
  width: max-content;
}
rf-tag-click .lower-select-row {
  min-height: 32px;
  padding: 5px 15px;
  background: white;
  border: 1px solid var(--lightgrey);
  width: 100%;
  cursor: pointer;
}
rf-tag-click .lower-select-row:hover {
  background: var(--midwhite);
}

rf-web-search .dropdown-menu.active {
  display: block;
}

rf-calendar {
  display: block;
}
rf-calendar .cal-header {
  overflow: auto;
}
rf-calendar .cal-header input {
  width: 100% !important;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  color: var(--main_color);
  padding: 0;
}
rf-calendar .cal-header .rf-btn {
  height: 35px;
  font-size: 15px;
  padding-top: 9px;
}
rf-calendar .time-select {
  margin-bottom: 5px;
  width: 100%;
  float: left;
}
rf-calendar .time-select .prev,
rf-calendar .time-select .next {
  margin: 0;
  width: 100%;
}
rf-calendar .time-select span {
  width: 100%;
  line-height: 30px;
  text-align: center;
}
rf-calendar .time-header {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  background: var(--grey);
  color: white;
  padding: 5px;
  min-height: 30px;
}
rf-calendar .time-header .day {
  background: var(--grey);
  width: 12.5%;
}
rf-calendar .no-padding {
  padding: 0;
}
rf-calendar .calendar {
  display: block;
  border-right: 1px solid var(--lightgrey);
  width: 100%;
  user-select: none;
  text-align: center;
}
rf-calendar .calendar .days {
  text-align: right;
  width: 12.5%;
}
rf-calendar .calendar .day.select-day {
  background: var(--lightgrey);
  cursor: pointer;
  width: 12.5%;
}
rf-calendar .calendar .day.select-day.cur {
  background: white;
}
rf-calendar .calendar .day.select-day.td {
  border: 1px solid var(--main_color_contrast_light);
  border-radius: 12px;
  background: var(--darkwhite);
}
rf-calendar .calendar .kw {
  text-align: left;
}
rf-calendar .calendar .kw-nr {
  width: 12.5%;
  background: var(--darkwhite);
}
rf-calendar .time .hours,
rf-calendar .time .minutes {
  padding-bottom: 10px;
  overflow: auto;
}
rf-calendar .day,
rf-calendar .hour,
rf-calendar .minute {
  width: 25px;
  height: 25px;
  line-height: 25px;
  float: left;
  text-align: center;
}
rf-calendar .day.sel,
rf-calendar .hour.sel,
rf-calendar .minute.sel {
  background: var(--main_color_light) !important;
  color: white;
  border-radius: 12px;
  font-weight: bold;
}

rf-color-picker {
  display: block;
}
rf-color-picker input[type=color] {
  position: absolute;
  height: 32px;
  margin: 4px 15px 0 -15px;
  right: 0;
  padding: 0;
  cursor: pointer;
}
rf-color-picker .color-selector .color {
  float: left;
  height: 32px;
  width: 40px;
  margin: 0 3px 3px 0;
  display: block;
  border: 1px solid var(--lightgrey);
  cursor: pointer;
}
rf-color-picker .color-selector .color:hover {
  opacity: 0.6;
}
rf-color-picker .color-input, rf-color-picker .color-group {
  overflow: hidden;
}

rf-color-toggle {
  display: block;
  cursor: pointer;
}
rf-color-toggle .color-bubble {
  width: 30px;
  height: 30px;
  border-radius: 50%;
}
rf-color-toggle.small .color-bubble {
  width: 16px;
  height: 16px;
}

rf-currency {
  display: inline-block;
  position: relative;
  width: 100%;
}
rf-currency.plain .rf-btn {
  border: 1px solid transparent;
}
rf-currency.plain .selected-currency {
  border: 1px solid transparent;
}
rf-currency.plain .selected-currency .selected-item {
  border: 1px solid transparent;
  color: var(--main_color);
}
rf-currency.brackets .selected-currency .edgy-bracket {
  display: inline;
}
rf-currency .selected-currency {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--lightgrey);
  border-radius: 3px;
  cursor: pointer;
}
rf-currency .selected-currency .rf-btn,
rf-currency .selected-currency .rf-btn:hover {
  margin: -1px -1px -1px 0;
  border-radius: 0 2px 2px 0;
}
rf-currency .selected-currency .selected-item {
  width: 100%;
  min-height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
}
rf-currency .selected-currency .edgy-bracket {
  display: none;
}
rf-currency .search-currency {
  position: absolute;
  width: 100%;
  min-width: 200px;
  background-color: var(--untouched);
  z-index: 9;
  padding: 6px;
  box-shadow: 0 3px 3px var(--grey);
  max-height: 300px;
  overflow: hidden auto;
}
rf-currency .search-currency .rf-form {
  width: 100%;
}
rf-currency .search-currency .currency:hover {
  background-color: var(--lightgrey);
}
rf-currency .search-currency .currency:hover a {
  display: block;
  cursor: pointer;
}

rf-date-time {
  display: inline-block;
}
rf-date-time input {
  border: 1px solid var(--darkwhite);
  width: 100%;
}
rf-date-time input.date-time-input {
  width: calc(100% - 30px) !important;
  float: left;
}
@media print {
  rf-date-time input.date-time-input {
    width: 100% !important;
  }
}
rf-date-time i {
  width: 30px;
  float: left;
  text-align: center;
  font-size: 14px;
  margin-top: 4px;
  cursor: pointer;
}
rf-date-time i:hover {
  color: var(--main_color);
}

rf-icon-select {
  display: block;
}
rf-icon-select .show-icon-dropdown {
  max-width: 300px;
}
rf-icon-select .show-icon-dropdown:hover {
  color: var(--main_color);
}
rf-icon-select .rf-icon {
  font-size: 20px;
  margin: 8px;
  float: left;
  width: 30px;
  height: 30px;
}
rf-icon-select .rf-icon.selected {
  color: var(--main_color);
}
rf-icon-select .rf-icon:hover {
  color: var(--main_color);
}
rf-icon-select .rf-icon.icon-big {
  font-size: 25px;
  color: var(--main_color);
}

rf-lang-change .country-flag {
  display: inline-block;
  cursor: pointer;
  margin-top: -10px;
  float: right;
  width: 50px;
}
rf-lang-change .country-flag img {
  display: inline-block;
  height: 32px;
  margin: 4px 0 3px 8px;
}
rf-lang-change .country-flag p {
  display: none;
}
rf-lang-change .country-flag.active img, rf-lang-change .country-flag:hover img {
  height: 40px;
  margin: 0 0 0 4px;
}
rf-lang-change.labels .country-flag p {
  display: block;
  font-size: 10px;
  color: white;
  text-align: center;
}
rf-lang-change.labels .country-flag.active p, rf-lang-change.labels .country-flag:hover p {
  color: var(--main_color);
  font-size: 12px;
  font-weight: bold;
  margin-top: -1px;
}

rf-month-switcher div {
  width: calc(8.3333333333% - 5px);
  min-width: 78px;
  display: inline-block;
  margin-bottom: 5px;
  margin-right: 5px;
}
rf-month-switcher div:last-child {
  margin-right: 0;
}
rf-month-switcher button {
  height: 32px;
  width: 100%;
  padding: 5px;
  border-radius: 15px;
  border: none;
  background-color: var(--lightgrey);
  color: white;
}
rf-month-switcher button.active, rf-month-switcher button.hover {
  background-color: var(--main_color);
}
rf-month-switcher button.hover {
  opacity: 0.5;
}

rf-priority-switch {
  display: block;
  position: relative;
}
rf-priority-switch span {
  margin-top: 8px;
  color: var(--grey);
  position: absolute;
  font-weight: bold;
}
rf-priority-switch .bar-container {
  height: 30px;
  cursor: pointer;
}
rf-priority-switch .bar-lines {
  cursor: pointer;
  width: 10px;
  float: left;
  height: 5px;
  background-color: var(--darkgreen);
  border: 1px solid;
  margin: 20px 5px 0 2px;
}
rf-priority-switch .prio2 {
  height: 10px;
  background-color: var(--green);
  margin-top: 15px;
}
rf-priority-switch .prio3 {
  height: 15px;
  background-color: var(--yellow);
  margin-top: 10px;
}
rf-priority-switch .prio4 {
  height: 20px;
  background-color: var(--darkyellow);
  margin-top: 5px;
}
rf-priority-switch .prio5 {
  height: 25px;
  background-color: var(--red);
  margin-top: 0;
}

.radiodirective .rf-btn {
  font-size: 12px;
  color: var(--grey);
  background: var(--darkwhite);
  border: 1px solid var(--darkwhite);
}
.radiodirective .rf-btn.active {
  border: 1px solid var(--main_color);
  background: var(--main_color);
  color: white;
}
.radiodirective.round .btn-group .btn:first-child {
  border-top-left-radius: 15px;
  border-bottom-left-radius: 15px;
}
.radiodirective.round .btn-group .btn:last-child {
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px;
}
@media (min-width: 100px) and (max-width: 800px) {
  .radiodirective .rf-btn {
    padding: 0 5px;
    margin: 0;
    border: 0;
    background: none;
    box-shadow: none;
    font-size: 80%;
  }
  .radiodirective .rf-btn.active {
    box-shadow: none;
    border: none;
    background: none;
  }
}

rf-select-custom {
  display: inline-block;
  height: 17px;
}
rf-select-custom .suggestions {
  display: block;
  position: absolute;
  border: 1px solid var(--lightgrey);
  z-index: 999;
  background-color: white;
  margin-top: 22px;
  cursor: pointer;
  min-width: 130px;
}
rf-select-custom input {
  height: 22px;
  display: block;
  position: relative;
  z-index: 2;
  float: left;
  width: 100%;
  margin-bottom: 0;
}
rf-select-custom input:focus {
  z-index: 3;
}
rf-select-custom ul {
  margin: 0;
  padding: 2px 5px;
  list-style: none;
  border: none;
  box-sizing: border-box;
  display: block;
  cursor: pointer;
}
rf-select-custom ul:hover {
  background: var(--midwhite);
  color: var(--main_color);
}
rf-select-custom li {
  width: 100%;
}

rf-select {
  display: inline-block;
  position: relative;
  width: 100%;
}
rf-select.plain .rf-btn {
  border: 1px solid transparent;
}
rf-select.plain .selected-data {
  border: 1px solid transparent;
}
rf-select.plain .selected-data .selected-item {
  border: 1px solid transparent;
  color: var(--main_color);
}
rf-select .selected-data {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--lightgrey);
  border-radius: 3px;
  cursor: pointer;
}
rf-select .selected-data .rf-btn,
rf-select .selected-data .rf-btn:hover {
  margin: -1px -1px -1px 0;
  border-radius: 0 2px 2px 0;
}
rf-select .selected-data .selected-item {
  width: 100%;
  min-height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
}
rf-select .search-data {
  position: absolute;
  width: 100%;
  background-color: var(--untouched);
  z-index: 9;
  padding: 6px;
  box-shadow: 0 3px 3px var(--grey);
}
rf-select .search-data .rf-form {
  width: 100%;
}
rf-select .search-data .data:hover {
  background-color: var(--lightgrey);
}
rf-select .search-data .data:hover a {
  display: block;
  cursor: pointer;
}

rf-select-properties {
  display: block;
  width: 100%;
  float: left;
}
rf-select-properties select {
  margin-bottom: 2px;
}
rf-select-properties span {
  position: absolute;
  right: 6px;
  top: 6px;
}
rf-select-properties input {
  text-align: center;
}
rf-select-properties input::placeholder {
  color: #ddd;
}
rf-select-properties input.invalid {
  border: 2px solid var(--red) !important;
}

rf-tag-select {
  position: relative;
  display: block;
}
rf-tag-select.plain .rf-btn {
  border: 1px solid transparent;
}
rf-tag-select.plain .rf-btn:hover {
  border: 1px solid transparent !important;
}
rf-tag-select.plain .select-wrap {
  background: none;
  border: 1px solid transparent;
  color: var(--main_color) !important;
}
rf-tag-select.plain .select-wrap .select-row {
  background: none;
  border: 1px solid transparent;
  color: var(--main_color) !important;
}
rf-tag-select .edgy-bracket {
  display: none;
}
rf-tag-select.brackets .edgy-bracket {
  display: inline;
}
rf-tag-select .select-wrap {
  position: relative;
}
rf-tag-select .select-wrap .select-row {
  padding: 5px 20px 5px 5px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
rf-tag-select.view-mode button,
rf-tag-select.view-mode .select-row {
  display: none;
}
rf-tag-select.view-mode .view-row {
  display: block;
}
rf-tag-select .view-row {
  display: none;
}
rf-tag-select .select-row {
  min-height: 32px;
  padding: 5px;
  background: white;
  width: 100%;
}
rf-tag-select .select-row.pointer:hover {
  background: var(--lightgrey);
}
rf-tag-select .select-row.first {
  border-radius: 3px;
}
rf-tag-select .rf-btn, rf-tag-select .rf-btn.rf-btn-inverted,
rf-tag-select .rf-btn:hover {
  margin: 0;
  float: right;
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 9;
}
rf-tag-select .rf-btn:hover {
  margin: 0 !important;
  border-color: var(--main_color) !important;
}
rf-tag-select .pointer .rf-btn {
  color: var(--main_color);
}
rf-tag-select .lower-select-container {
  z-index: 99;
  position: absolute;
  display: block;
  max-height: 300px;
  overflow: auto;
  background-color: var(--untouched);
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.3803921569);
  width: 100%;
}
rf-tag-select .lower-select-container .inner-select-container {
  width: 100%;
}
rf-tag-select .no-border {
  border: none;
}

rf-time-interval .time-interval-block {
  padding-bottom: 10px !important;
}
rf-time-interval .time-interval-block:nth-child(2) {
  padding-bottom: 5px !important;
}
rf-time-interval select {
  height: 32px !important;
  width: 100% !important;
  border-radius: 15px;
  padding-left: 5px;
  background-color: var(--darkwhite);
  border: none !important;
  border-right: 5px solid var(--darkwhite) !important;
}

rf-time-interval-input .time-switcher-table {
  height: 32px !important;
  width: 100% !important;
  margin: 0 !important;
  background-color: var(--darkwhite);
  border-radius: 15px;
}
rf-time-interval-input .time-switcher-table td {
  padding: 0 4px;
}
rf-time-interval-input .time-switcher-table td:first-child {
  padding-left: 10px;
}
rf-time-interval-input .time-switcher-table td:last-child {
  padding-right: 5px;
}
rf-time-interval-input .time-switcher-table td rf-date-time {
  width: 100%;
  margin-bottom: -6px;
}
rf-time-interval-input .time-switcher-table td rf-date-time input {
  padding: 0 !important;
  border: 1px solid var(--lightgrey);
  border-radius: 4px;
}

.table {
  width: 100%;
  max-width: 100%;
  margin-bottom: 20px;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th {
  padding: 8px;
  line-height: 1.428571429;
  vertical-align: top;
  border-top: 1px solid #ddd;
}

.table > thead > tr > th {
  vertical-align: bottom;
  border-bottom: 2px solid #ddd;
}

.table > caption + thead > tr:first-child > td,
.table > caption + thead > tr:first-child > th,
.table > colgroup + thead > tr:first-child > td,
.table > colgroup + thead > tr:first-child > th,
.table > thead:first-child > tr:first-child > td,
.table > thead:first-child > tr:first-child > th {
  border-top: 0;
}

.table > tbody + tbody {
  border-top: 2px solid #ddd;
}

.table .table {
  background-color: #fff;
}

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

td,
th {
  padding: 0;
}

.iconbar {
  position: absolute;
  width: 30px;
  text-align: left;
  z-index: 99;
}
.iconbar .fa {
  width: 15px;
}
.iconbar.left {
  left: -32px;
}
.iconbar.right {
  left: 605px;
}
.iconbar:hover {
  width: 200px;
}
.iconbar button .text {
  display: none;
}
.iconbar button:hover .text {
  display: inline;
}

.btn-light {
  border-radius: 5px;
  background-color: white;
  padding: 3px 5px;
  color: var(--main_color);
  margin-bottom: 2px;
  font-size: small;
}
.btn-light:hover {
  margin-bottom: 2px;
}

.pointer {
  cursor: pointer;
}

.three-check {
  padding-left: 22px;
  padding-right: 15px;
}

.validate input.ng-invalid,
.validate select.ng-invalid,
.validate textarea.ng-invalid {
  border: 1px solid red;
  box-shadow: none;
}

.no-padding {
  padding-left: 0;
  padding-right: 0;
}

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

.no-padding-right {
  padding-right: 0;
}

.no-margin {
  margin: 0;
}

.results-count {
  font-size: 140%;
  color: var(--midgrey);
}
@media (max-width: 800px) {
  .results-count {
    margin-left: 14px;
    margin-bottom: 10px;
    font-size: 120%;
  }
}

.result-count-sub {
  font-size: 90%;
  color: var(--midgrey);
}
@media (max-width: 800px) {
  .result-count-sub {
    display: none;
  }
}

.view-control-elements {
  float: right;
  width: 100%;
}
.view-control-elements .rf-btn {
  float: right;
}
.view-control-elements rf-action-select {
  max-width: 230px;
  float: right;
  width: 100%;
}

.editor-select {
  position: relative;
  margin-right: 10px;
}
.editor-select .editor-menu {
  position: absolute;
  top: 30px;
  right: 0;
  z-index: 999;
}
.editor-select .editor-menu a {
  cursor: pointer;
}
.editor-select .editor-menu .editor-list-item {
  padding: 5px 10px;
  min-width: 180px;
  background: var(--lightgrey);
}
.editor-select .editor-menu .editor-list-item:hover {
  font-weight: bold;
  color: var(--main_color);
  cursor: pointer;
}

.upload-field {
  border: dashed 2px var(--midgrey);
  color: var(--midgrey);
  border-radius: 15px;
  padding: 20px;
  font-size: 16px;
}
.upload-field:hover {
  border: dashed 2px var(--main_color);
}

/* tabs with colored underlines */
.underline {
  border-bottom: 1px solid var(--lightgrey);
  margin-bottom: 20px;
}

.state-btn {
  display: inline-block;
  margin: 0;
  padding: 0 20px 10px;
  border-bottom: 5px solid transparent;
  color: var(--grey);
  cursor: pointer;
}
.state-btn.active {
  border-bottom: 5px solid var(--main_color);
  color: black;
}
.state-btn.active span {
  color: var(--main_color);
}
.state-btn span {
  font-size: 16px;
  font-weight: bold;
  border-radius: 11px;
  display: block;
  float: right;
  margin: -4px 0 -2px 2px;
  padding: 2px 7px;
}

span.icon-counter {
  position: absolute;
  left: 0;
  top: 15px;
  color: white;
  font-weight: bold;
  font-size: 12px;
  background: var(--main_color);
  padding: 0 3px;
  height: 16px;
  border-radius: 9px;
  padding-left: 4px;
  line-height: 17px;
  opacity: 0.9;
}
span.icon-counter:hover {
  background: var(--midgrey);
}

.small-grey-tag {
  border-radius: 10px;
  background: white;
  color: var(--green);
  border: 1px solid;
  padding: 0 7px;
  margin: 0;
}
.small-grey-tag.alert {
  color: var(--red);
  background: white;
}

.tag-box {
  float: left;
  padding: 5px 15px;
  margin: 0 5px 5px 0;
  background: var(--midwhite);
  line-height: 20px;
  border-radius: 7px;
  cursor: default;
  border: 1px solid var(--lightgrey);
  position: relative;
}
.tag-box i {
  font-size: 14px !important;
  float: right !important;
  padding: 0 0 0 8px !important;
  margin-top: 3px !important;
}

.small .tag-box {
  padding: 1px 5px;
  margin: 0 5px 2px 0;
  background: var(--midwhite);
  font-size: 12px;
  line-height: 20px;
  border-radius: 4px;
}
.small .tag-box i {
  display: none !important;
}
.small .tag-box .color-label {
  width: 5px;
}

.rf-simple-tag-box {
  color: black;
  padding: 1px 5px;
  margin: 0 5px 2px 0;
  background: var(--midwhite);
  font-size: 12px;
  line-height: 20px;
  border-radius: 4px;
  border-left: 5px solid;
  border-top: 1px solid var(--lightgrey);
  border-bottom: 1px solid var(--lightgrey);
  border-right: 1px solid var(--lightgrey);
  width: max-content;
  float: left;
}
.rf-simple-tag-box.right {
  float: right;
}

.global-pdf-header {
  overflow: auto;
  float: left;
  margin-bottom: 15px;
}

.transparent-bg-layer {
  position: fixed;
  z-index: 9100;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background-color: black;
  opacity: 0.3;
  -webkit-transition: all 0.15s ease-in-out;
  -moz-transition: all 0.15s ease-in-out;
  -ms-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}

.diagram-bar {
  height: 10px;
  width: 100%;
  background-color: var(--green);
  border: 1px solid var(--grey);
  margin: 0 0 -10px;
}
.diagram-bar.warning {
  background-color: var(--yellow);
}
.diagram-bar.error {
  background-color: var(--red);
}
.diagram-bar.all {
  background-color: var(--lightgrey);
}

.striped-table-entry:nth-child(even) {
  background: var(--bg1);
}

.rf-list-action-btn .rf-btn {
  width: 100%;
  height: 42px;
  margin: 0;
  border-radius: 5px;
  padding-top: 15px;
}
.rf-list-action-btn rf-action-select .rf-btn {
  width: 30px;
}
.rf-list-action-btn rf-action-select .select-row {
  height: 42px;
  line-height: 40px;
  text-align: center;
}

.search-sorting-border-btn,
select.search-sorting-border-btn {
  border-radius: 5px;
  border: 1px solid transparent;
  display: inline-block;
  margin-right: 10px;
  background: white;
  appearance: none;
  width: max-content;
  cursor: pointer;
}
.search-sorting-border-btn i,
select.search-sorting-border-btn i {
  color: var(--midgrey);
}
.search-sorting-border-btn.active,
select.search-sorting-border-btn.active {
  background: var(--darkwhite);
  color: var(--main_color_light);
}
.search-sorting-border-btn:hover,
select.search-sorting-border-btn:hover {
  background: var(--darkwhite);
  color: var(--main_color);
}

select.rf-form {
  cursor: pointer;
}

.rf-btn.header-btn {
  margin-top: -5px;
  margin-bottom: -5px;
  margin-left: 0;
  margin-right: 0;
  background: none;
  float: left;
  color: var(--main_color);
}
.rf-btn.header-btn:hover {
  background: var(--main_color);
  color: white;
  margin-top: -5px;
  margin-bottom: -5px;
  margin-left: 0;
  margin-right: 0;
}
.rf-btn.header-btn.btn-right {
  float: right;
}

.sidebar-join-layer {
  position: absolute;
  cursor: pointer;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.15);
  z-index: 1;
  text-align: center;
  color: #fff;
  border-radius: 5px;
}
.sidebar-join-layer i {
  width: 90px;
  font-size: 75px;
  color: white;
  float: right;
  margin-top: 45px;
}
.sidebar-join-layer:hover {
  background: rgba(0, 0, 0, 0.5);
}

.list-item-icon {
  position: relative;
}
.list-item-icon .fa {
  font-size: 1.4em;
  color: var(--grey);
  margin-top: -6px;
  margin-bottom: -6px;
}
.list-item-icon .icon-counter {
  top: 9px;
  left: 12px;
  background: rgba(147, 147, 147, 0.8);
  color: white;
}

.weekday-btn {
  background: var(--main_color);
  color: white;
  text-align: center;
  cursor: pointer;
  width: 14.25%;
  float: left;
  padding: 0;
}
.weekday-btn:hover {
  background: var(--main_color_light);
}
.weekday-btn.inactive {
  background: var(--lightgrey);
  color: var(--midgrey);
}
.weekday-btn.inactive:hover {
  background: var(--midwhite);
}

.closed rf-list-tabs.navtop {
  margin-left: 48px;
}
.closed rf-top-nav .breadcrump-info {
  padding-left: 50px;
}

.admin-table {
  width: 100%;
}
.admin-table tr td {
  padding: 2px 20px;
}
.admin-table tr td.color-change-input {
  width: 100%;
  display: grid;
  grid-template-columns: 91% 5%;
  grid-column-gap: 4%;
  align-items: center;
}
.admin-table tr td .opts-label {
  float: left;
  width: 40%;
}
.admin-table tr td .opts-actions {
  float: left;
  width: 60%;
}
.admin-table tr td .opts-content {
  float: left;
  width: 100%;
}
.admin-table tr td:nth-child(odd) {
  width: 40%;
  color: var(--midgrey);
}
.admin-table tr td:nth-child(even) {
  width: 100%;
  text-align: center;
}
.admin-table tr:nth-child(even) {
  background-color: var(--bg1);
}
.admin-table select, .admin-table input, .admin-table rf-lang-select select {
  width: 100%;
  height: 24px;
  text-align: left;
  background-color: white;
  border-radius: 3px;
  border: 1px solid var(--lightgrey);
  padding: 0;
}
.admin-table textarea {
  height: 70px;
  width: 100%;
  max-width: 100%;
  min-width: 100%;
  min-height: 100%;
  max-height: 100%;
}
.admin-table input[type=checkbox] {
  width: 20px;
}
.admin-table input[type=color] {
  padding: 2px;
}

.main-actions {
  position: fixed;
  display: flex;
  bottom: 0;
  width: 100%;
  max-width: 1000px;
  transform: translateX(50px);
  border: 1px solid #888;
  border-bottom: none;
  box-shadow: 0 0 3px 0 #888;
  background: var(--darkgrey);
  color: white;
  z-index: 200;
}
.main-actions.dark {
  background: var(--darkgrey);
}
.main-actions h3 {
  line-height: 24px;
  font-size: 16px !important;
  margin-top: 10px;
  font-weight: bold;
  text-align: center;
  white-space: nowrap;
}
.main-actions .col-xs-2 {
  padding: 0 5px;
}
.main-actions button {
  width: 100%;
}

.list-view-dropdown-btn rf-fold-btn-tri {
  width: 40px;
  padding-left: 10px;
  height: 40px;
  padding-top: 7px;
  font-size: 18px;
  margin-right: -15px;
}

/**
 * Edit mode sidebar
 */
/* Don't get confused by all the absolutes!
This is a trick to get "sidebar" stuff positioned to the right of the position */
.order-sidebar-anchor {
  position: absolute;
  right: 0;
  width: 0;
  height: 100%;
}

.order-sidebar {
  position: absolute;
  left: 15px;
  font-size: 14px;
  /* border-top: 1px solid #545454; */
  padding-left: 20px;
  min-width: 600px;
  overflow-y: auto;
}
.order-sidebar.head {
  height: 300px !important;
}
.order-sidebar .rf-form,
.order-sidebar input {
  border: 1px solid #ececec !important;
}
.order-sidebar .rf-form:hover,
.order-sidebar input:hover {
  border: 1px solid lightgray !important;
}

.order-sidebar-content {
  display: block;
  width: 100%;
  height: 100%;
}

.position-sidebar-button-array {
  margin-top: -5px;
  margin-left: 3px;
  height: 26px;
}

.position-sidebar-button-array button {
  display: inline-block;
}

/**
 * Edit mode sidebar
 */
/* Don't get confused by all the absolutes!
This is a trick to get "sidebar" stuff positioned to the right of the position */
.position-sidebar-anchor {
  position: absolute;
  right: 0;
  width: 0;
  height: 100%;
}

.position-sidebar {
  position: absolute;
  left: 15px;
  font-size: 14px;
  border-top: dashed 2px var(--lightgrey);
  padding-left: 20px;
  min-width: 650px;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}

.position-sidebar-files {
  display: block;
  width: 100%;
  height: 100%;
  max-height: 175px;
  overflow-y: auto;
  font-size: 12px;
  position: relative;
  margin-top: 10px;
}
.position-sidebar-files .vertical-line {
  height: 100%;
  position: absolute;
  border-right: 1px solid black;
  right: 25px;
}
.position-sidebar-files .drawing-actions {
  position: relative;
}
.position-sidebar-files .drawing-actions button {
  position: absolute;
  top: 31px;
  right: -15px;
  height: 30px;
  width: 25px;
  margin: 0;
}
.position-sidebar-files .drawing-actions .no-hover:hover {
  background: var(--main_color);
  color: white;
}
.position-sidebar-files .drawing-actions .rf-icon {
  margin-left: -4px;
  font-size: 14px;
}
.position-sidebar-files .file-header-row {
  background: var(--darkwhite);
}
.position-sidebar-files .file-header-row b {
  line-height: 28px;
}
.position-sidebar-files .file-header-row .rf-btn {
  margin: 0;
}
.position-sidebar-files .add-standard-scale-price {
  width: 100%;
  padding-bottom: 7px;
  position: absolute;
  left: 100%;
  bottom: auto;
  text-align: center;
}
.position-sidebar-files .add-standard-scale-price button {
  padding: 5px 35px;
  margin-left: 50px;
  width: calc(100% - 50px);
}
.position-sidebar-files .country-of-origin {
  float: right;
  width: 60%;
}
.position-sidebar-files .country-of-origin select {
  padding: 0;
}

/*!
 * Bootstrap v3.3.7 (http://getbootstrap.com)
 * Copyright 2011-2016 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/* --------------------------------- global style -------------------------------------- */
html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  font-size: 10px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
  padding-top: 40px;
  margin: 0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.428571429;
  background-color: #fff;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

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

body::-webkit-scrollbar-track {
  background: var(--darkwhite);
  /* color of the tracking area */
}

body::-webkit-scrollbar-thumb {
  background-color: var(--grey);
  /* color of the scroll thumb */
}

/* --------------------------------- global font style -------------------------------------- */
b,
strong {
  font-weight: bold;
}

.small,
small {
  font-size: 85%;
}

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

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

h2,
h3,
p {
  orphans: 3;
  widows: 3;
}

h2,
h3 {
  page-break-after: avoid;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: inherit;
}

h1 .small,
h1 small,
h2 .small,
h2 small,
h3 .small,
h3 small,
h4 .small,
h4 small,
h5 .small,
h5 small,
h6 .small,
h6 small {
  font-weight: normal;
  line-height: 1;
}

h1,
h2,
h3 {
  margin-top: 20px;
  margin-bottom: 10px;
}

h1 .small,
h1 small,
h2 .small,
h2 small,
h3 .small,
h3 small {
  font-size: 65%;
}

h4,
h5,
h6 {
  margin-top: 10px;
  margin-bottom: 10px;
}

h4 .small,
h4 small,
h5 .small,
h5 small,
h6 .small,
h6 small {
  font-size: 75%;
}

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

h2 {
  font-size: 30px;
}

h3 {
  font-size: 24px;
}

h4 {
  font-size: 18px;
}

h5 {
  font-size: 14px;
}

h6 {
  font-size: 12px;
}

p {
  margin: 0 0 10px;
}

/* --------------------------------- global html element style -------------------------------------- */
ol,
ul {
  margin-top: 0;
  margin-bottom: 10px;
}

ol ol,
ol ul,
ul ol,
ul ul {
  margin-bottom: 0;
}

label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: bold;
}

a {
  color: var(--main_color);
  outline: none;
  text-decoration: none;
  background-color: transparent;
}

a:active,
a:hover {
  outline: 0;
  text-decoration: none;
}

a:focus,
a:hover {
  text-decoration: underline;
}

a:focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

img {
  border: 0;
  vertical-align: middle;
}

hr {
  box-sizing: content-box;
  height: 0;
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #eee;
}

/* --------------------------------- global input element style -------------------------------------- */
[role=button] {
  cursor: pointer;
}

button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

button {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
  cursor: pointer;
}

input {
  line-height: normal;
  outline: none;
}

input[type=checkbox],
input[type=radio] {
  box-sizing: border-box;
  padding: 0;
  margin: 1px \9 0 0;
  line-height: normal;
}

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

input[type=search] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

input[type=file] {
  display: block;
}

input[type=range] {
  display: block;
  width: 100%;
}

textarea {
  overflow: auto;
}

select[multiple],
select[size] {
  height: auto;
}

input[type=file]:focus,
input[type=radio]:focus,
input[type=checkbox]:focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
button.borderless,
input.borderless,
select.borderless,
textarea.borderless {
  border: 1px solid transparent;
}
button.borderless:hover,
button.borderless :active,
input.borderless:hover,
input.borderless :active,
select.borderless:hover,
select.borderless :active,
textarea.borderless:hover,
textarea.borderless :active {
  border: 1px solid var(--lightgrey);
}

select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

/* stylelint-disable selector-class-pattern */
.icon-raw-material-dim {
  background: url("../img/raw-material-dimensions.svg") no-repeat;
  width: 250px;
  height: 190px;
}
.icon-raw-material-dim.block {
  background-position: 0px -35px;
}
.icon-raw-material-dim.plate {
  background-position: -210px -35px;
}
.icon-raw-material-dim.flat {
  background-position: -420px -35px;
}
.icon-raw-material-dim.square {
  background-position: -630px -35px;
}
.icon-raw-material-dim.rectangularTube {
  background-position: -840px -35px;
}
.icon-raw-material-dim.hexagon {
  background-position: 0px -245px;
}
.icon-raw-material-dim.round {
  background-position: -210px -245px;
}
.icon-raw-material-dim.half-round {
  background-position: -420px -245px;
}
.icon-raw-material-dim.pipe {
  background-position: -630px -245px;
}
.icon-raw-material-dim.L-profile {
  background-position: -840px -245px;
}
.icon-raw-material-dim.T-profile {
  background-position: 0px -455px;
}
.icon-raw-material-dim.U-profile {
  background-position: -210px -455px;
}
.icon-raw-material-dim.I-profile {
  background-position: -420px -455px;
}
.icon-raw-material-dim.Z-profile {
  background-position: -630px -455px;
}

.rf-erp-icon {
  background: url("../img/icons.svg") no-repeat;
  width: 32px;
  height: 32px;
  display: block;
}
.rf-erp-icon.list-sm {
  background-position: -1px -86px;
}
.rf-erp-icon.list-md {
  background-position: -40px -86px;
}
.rf-erp-icon.list-lg {
  background-position: -74px -86px;
}
.rf-erp-icon.list-lg-single {
  background-position: -110px -86px;
}
.rf-erp-icon.list-calendar {
  background-position: -142px -86px;
}

.list-v {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.list-v.end {
  justify-content: flex-end;
}

.list-h {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.list-h.end {
  justify-content: flex-end;
}

.mainview-top-panel label {
  font-weight: normal;
  border: none;
  margin: 0;
  background: #efefef;
  padding: 3px 5px;
  white-space: nowrap;
}
.mainview-top-panel select {
  outline: none;
  width: 100%;
  border: 1px solid var(--lightgrey);
  cursor: pointer;
}
.mainview-top-panel select:hover {
  background: var(--darkwhite);
}
.mainview-top-panel input[type=text] {
  width: 100%;
  padding: 10px;
}
.mainview-top-panel input[type=checkbox] {
  margin: 13px 0 0 3px;
}
.mainview-top-panel h3 {
  margin-top: 10px;
}
.mainview-top-panel h4 {
  margin-top: 5px;
}
.mainview-top-panel .filter-search-term,
.mainview-top-panel .filter-sort {
  display: flex;
}
.mainview-top-panel .filter-search-term input:focus {
  box-shadow: 2px 2px 4px -2px var(--main_color);
}
.mainview-top-panel .filter-search-term input:focus:hover {
  box-shadow: 2px 2px 4px -2px var(--main_color);
}
.mainview-top-panel .filter-search-term input:hover {
  box-shadow: 2px 2px 4px -2px var(--main_color_contrast_dark);
}
.mainview-top-panel .filter-sort span {
  margin-top: 10px;
}
.mainview-top-panel .filter-sort .input-label {
  padding: 0;
}
.mainview-top-panel .filter-select {
  position: relative;
}
.mainview-top-panel .filter-select select {
  background: white;
  border-radius: 30px;
  appearance: none;
  padding: 0 12px;
  height: 42px;
}
.mainview-top-panel .filter-select::before {
  z-index: 1;
  display: block;
  content: "\f0d7";
  font-family: FontAwesome;
  position: absolute;
  pointer-events: none;
  color: white;
  right: 1px;
  top: 1px;
  background: var(--main_color);
  height: 40px;
  width: 30px;
  padding: 10px 6px;
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
}
.mainview-top-panel .filters {
  white-space: nowrap;
}
.mainview-top-panel .filters .rf-btn {
  min-width: 100px;
  width: auto;
}
.mainview-top-panel .stretch-to-width {
  width: 100%;
}
.mainview-top-panel .active-filter-tags {
  color: white;
  border: 1px solid var(--main_color);
  padding: 5px 10px;
  border-radius: 20px;
  width: max-content;
  float: left;
  margin-right: 10px;
  cursor: pointer;
  background: var(--main_color);
  border-color: var(--main_color);
}
.mainview-top-panel .active-filter-tags:hover {
  opacity: 0.7;
}
.mainview-top-panel .rf-filter-btn {
  background: white;
  border: 1px solid var(--lightgrey);
  padding: 6px 11px;
  border-radius: 20px;
  width: max-content;
  cursor: pointer;
}
.mainview-top-panel .rf-filter-btn i {
  color: var(--main_color);
}
.mainview-top-panel rf-tag-click,
.mainview-top-panel rf-opts-click,
.mainview-top-panel .rf-filter-btn {
  float: left;
  margin-right: 10px;
  margin-top: 5px;
}
.mainview-top-panel rf-fold-list-btn {
  float: right;
}
.mainview-top-panel .select-row:hover,
.mainview-top-panel .rf-filter-btn:hover {
  background: var(--darkwhite);
  color: var(--main_color);
}
.mainview-top-panel .time-switcher {
  background: var(--darkwhite);
  padding: 2px 5px;
  border-radius: 20px;
}
.mainview-top-panel .time-switcher label {
  background: none;
}
.mainview-top-panel .time-switcher input {
  border-radius: 5px;
  outline: none;
  padding: 3px;
  border: 1px solid var(--lightgrey);
}
.mainview-top-panel .time-switcher rf-date-time i {
  margin-top: 6px;
}

.mainview-white-box {
  background: white;
  padding: 15px;
  margin-bottom: 10px;
  border-top-left-radius: 15px;
  border-bottom-left-radius: 15px;
  display: inline-block;
  width: 100%;
}
.mainview-white-box.large {
  min-height: 90vh;
}
.mainview-white-box.lightgrey {
  background: #fcfcfc;
}
.mainview-white-box.transparent {
  background: none;
  padding: 0 15px 0 0;
}
.mainview-white-box.transparent .rf-panel-box {
  border: 1px solid var(--darkwhite);
}

@media (max-width: 720px) {
  .mainview-white-box {
    padding: 10px;
  }
  .mainview-white-box.transparent {
    padding: 0;
  }
}
.mainview {
  background: #fff;
  position: absolute;
  overflow-y: auto;
  overflow-x: hidden;
  top: 50px;
  bottom: 0;
  right: 0;
  left: 0;
  padding: 0;
}
.mainview.mainview-padding {
  padding: 30px;
}
.mainview.mainview-padding .mainview-top-panel {
  border-bottom: none;
  background: none;
}
.mainview.mainview-color {
  background: var(--bg3);
}
.mainview .manview-scroll-spacer {
  height: 600px;
}
.mainview .rf-mainview-action-btn {
  float: right;
  margin-top: 0;
  width: 190px;
  text-align: left;
  padding: 6px 12px;
  border-radius: 5px;
}
.mainview .rf-mainview-action-btn i {
  margin-top: 4px;
  float: right;
}
.mainview .tree-actions {
  position: relative;
}
.mainview .tree-actions .disable-layer {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: transparent;
}
.mainview .tree-actions a {
  cursor: pointer;
  color: var(--grey);
  margin-right: 15px;
  font-size: 13px;
  white-space: nowrap;
}
.mainview .tree-actions a i {
  color: var(--main_color);
}
.mainview .tree-actions.disabled .fa,
.mainview .tree-actions.disabled a {
  color: #545454;
}
.mainview .actions {
  text-align: right;
}
.mainview .actions .rf-btn .fa-trash.big {
  width: 40px;
  height: 40px;
  font-size: 20px;
  line-height: 38px;
}
.mainview .colm {
  float: left;
  min-height: 2px;
}

@media (max-width: 950px) {
  .mainview .main-actions {
    transform: none;
    width: 100%;
    left: 0;
  }
}
@media print {
  .mainview-top-panel,
  .mainview .main-actions,
  .mainview .tree-actions {
    display: none;
  }
}
#mainview-container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 50px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media print {
  #mainview-container {
    left: 0;
  }
}
#mainview-container.open {
  left: 200px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media print {
  #mainview-container.open {
    left: 0;
  }
}
#mainview-container.closed {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  left: 0;
}
#mainview-container.disabled {
  -webkit-transition: all 0s ease-in-out;
  -moz-transition: all 0s ease-in-out;
  -ms-transition: all 0s ease-in-out;
  -o-transition: all 0s ease-in-out;
  transition: all 0s ease-in-out;
  left: 0;
}

.primary-view {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  bottom: 0;
}
.primary-view.small-view {
  width: calc(100% - 350px);
  font-size: 90%;
  overflow: auto;
}

@media print {
  .no-print {
    display: none;
  }
}
@media screen {
  .print {
    display: none;
  }
}
@page {
  size: a4 portrait;
}
.blinker {
  animation: blinker 2s linear infinite;
}

.blinker-fast {
  animation: blinker03 1.5s linear infinite;
}

/* @example
* animation: blinker 2s linear infinite;
*/
@keyframes blinker {
  50% {
    opacity: 0.8;
  }
}
@keyframes blinker06 {
  50% {
    opacity: 0.6;
  }
}
@keyframes blinker03 {
  50% {
    opacity: 0.3;
  }
}
@media print {
  .page-print-layout {
    zoom: 70%;
    margin: 0;
    /* stylelint-disable-next-line */
    /* stylelint-disable-next-line */
  }
  .page-print-layout body {
    overflow: auto;
  }
  .page-print-layout .mainview-white-box {
    padding: 0;
    border-radius: 0;
  }
  .page-print-layout .sidebar-right {
    display: none;
  }
  .page-print-layout input,
  .page-print-layout select,
  .page-print-layout textarea {
    color: black;
    border: none;
    box-shadow: none;
  }
  .page-print-layout input[type=number] {
    appearance: textfield;
  }
  .page-print-layout ::-webkit-inner-spin-button {
    /* stylelint-disable-next-line */
    -webkit-appearance: none;
  }
  .page-print-layout ::-webkit-outer-spin-button {
    /* stylelint-disable-next-line */
    -webkit-appearance: none;
  }
  .page-print-layout select {
    /* stylelint-disable-next-line */
    -webkit-appearance: none;
    /* stylelint-disable-next-line */
    -moz-appearance: none;
    appearance: none;
  }
  .page-print-layout textarea {
    resize: none;
  }
  .page-print-layout a[href]::after {
    /* prevent links to be displayed in print view */
    content: none !important;
  }
  .page-print-layout a {
    color: black;
  }
  .page-print-layout svg.preview-svg {
    /* stylelint-disable-next-line */
    /* stylelint-disable-next-line */
  }
  .page-print-layout svg.preview-svg .outerContour path {
    fill: rgb(188, 194, 199);
  }
  .page-print-layout svg.preview-svg .innerContour path {
    fill: grey;
  }
  .page-print-layout .sidebar,
  .page-print-layout rf-btn {
    display: none;
  }
  .page-print-layout .mainview {
    top: 0;
    overflow: visible;
  }
  .page-print-layout .mainview .order {
    width: 100%;
    padding-bottom: 0;
  }
  .page-print-layout .mainview .order .print-layer {
    display: none;
  }
  .page-print-layout .mainview .iconbar {
    display: none;
  }
  .page-print-layout .rf-date-time {
    margin-top: -2px;
  }
  *,
  *::after,
  *::before {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
}
.rf-edit {
  padding: 5px 0 0;
  position: relative;
  border-bottom: 1px solid #ddd;
  overflow: auto;
  margin-bottom: 1px;
}
.rf-edit label {
  margin: 0 !important;
  font-weight: normal !important;
}
.rf-edit input,
.rf-edit select,
.rf-edit textarea {
  position: relative;
  z-index: 2;
  border: 0;
  width: 100%;
  background: var(--darkwhite);
}
.rf-edit input:hover,
.rf-edit select:hover,
.rf-edit textarea:hover {
  box-shadow: 0 0 3px 0px var(--main_color_light);
}
.rf-edit input:focus,
.rf-edit select:focus,
.rf-edit textarea:focus {
  box-shadow: 0 0 3px 0 var(--main_color_light);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.rf-edit textarea {
  min-width: 100%;
  max-width: 100%;
}
.rf-edit select {
  background: #fff;
}
.rf-edit .rf-edit-btn {
  cursor: pointer;
  float: right;
  color: var(--main_color);
}
.rf-edit .rf-edit-btn:hover {
  opacity: 0.6;
}
.rf-edit.no-edit-icon::before {
  display: none;
}
.rf-edit.rf-label.rf-disabled::before {
  display: none;
}
.rf-edit.rf-label.rf-disabled input:hover,
.rf-edit.rf-label.rf-disabled select:hover,
.rf-edit.rf-label.rf-disabled textarea:hover {
  box-shadow: 0 0 0 0 #fff;
}
.rf-edit.rf-label.rf-checkbox::before {
  display: none;
}
.rf-edit.rf-label.rf-checkbox input {
  width: 0;
  position: absolute;
  right: 0;
}
.rf-edit.rf-label.long label {
  width: 65%;
  float: left;
  color: var(--midgrey);
}
.rf-edit.rf-label.long input,
.rf-edit.rf-label.long select,
.rf-edit.rf-label.long textarea {
  width: 35%;
}
.rf-edit.rf-label label {
  width: 40%;
  float: left;
  color: grey;
}
.rf-edit.rf-label input,
.rf-edit.rf-label select,
.rf-edit.rf-label textarea {
  width: 60%;
}
.rf-edit.rf-label textarea {
  min-width: 60%;
  max-width: 60%;
}
.rf-edit.rf-label.extra-wide textarea {
  min-width: 100%;
  max-width: 100%;
}
.rf-edit.rf-label rf-textarea .textfield {
  border-bottom: none;
}
.rf-edit.rf-label rf-textarea .textfield textarea {
  width: 100%;
  min-width: 100%;
  max-width: 100%;
}
.rf-edit .content-container {
  width: 60%;
  float: left;
}
.rf-edit rf-date-time {
  width: 60%;
}
.rf-edit rf-date-time input {
  width: 100%;
}
.rf-edit::before {
  content: "";
}

.rf-edit-select-label {
  text-align: left;
  height: 31px;
  border-bottom: 1px solid var(--lightgrey);
}
.rf-edit-select-label label {
  width: 40%;
  float: left;
  color: var(--midgrey);
  margin-top: 4px;
  font-weight: normal;
}
.rf-edit-select-label rf-tag-select {
  width: 60%;
  float: right;
}
.rf-edit-select-label rf-tag-select .select-row {
  min-height: 30px;
}
.rf-edit-select-label rf-tag-select .select-row.first {
  border: none;
}
.rf-edit-select-label rf-tag-select .select-row button {
  border-radius: 0;
  margin-top: -8px;
}
.rf-edit-select-label rf-currency {
  width: 60%;
  top: -2px;
}
.rf-edit-select-label rf-currency .selected-currency {
  border: unset;
}

/*  @exampl regular
<table class="rf-list-table default">
   <tbody ng-repeat="doc in docs">
      <tr class="list-header" ng-class="{'expanded': showInfo}">
         <td></td>
      </tr>
      <tr>
         <td></td>
      </tr>
   </tbody>
</table>
*/
/* @exampl tabel content same color as head
<table class="rf-list-table default">
   <tbody ng-repeat="doc in docs" class="list-header">
      <tr>
         <td></td>
      </tr>
   </tbody>
</table>
*/
.rf-list-table.default {
  width: 100%;
}
.rf-list-table.default thead td:first-child {
  padding-left: 15px;
}
.rf-list-table.default .list-header td {
  height: 50px;
  font-size: 12px;
}
.rf-list-table.default .list-header a {
  color: black;
  cursor: pointer;
}
.rf-list-table.default .list-header a.main-link {
  color: var(--main_color);
}
.rf-list-table.default .list-header .list-h {
  float: right;
  align-items: center;
}
.rf-list-table.default .list-header .action-select-xs-handler {
  margin-top: -4px !important;
}
.rf-list-table.default .list-header .numbers {
  display: inline;
}
.rf-list-table .list-header.expanded {
  background: var(--darkgrey) !important;
  color: white;
}
.rf-list-table .list-header.expanded a {
  color: white;
}
.rf-list-table .list-header td {
  padding: 4px;
}
.rf-list-table .list-header td:first-child {
  padding-left: 15px;
}
.rf-list-table .list-header td:last-child {
  padding-right: 15px;
}
.rf-list-table tbody:nth-child(even) > .list-header {
  background: var(--bg1);
}
.rf-list-table tbody.list-header:nth-child(even) {
  background: var(--bg1);
}

.rf-panel-box {
  background: white;
  border-radius: 10px;
  width: 100%;
  float: left;
  margin-top: 5px;
  margin-bottom: 30px;
  margin-left: 0;
  padding: 15px;
  border: 1px solid var(--lightgrey);
}
.rf-panel-box.dashed {
  border: dashed 2px var(--lightgrey);
}
.rf-panel-box h3 {
  margin: 0 0 3px;
  font-weight: bold;
}
.rf-panel-box h4 {
  margin: 0 0 15px;
  font-size: 20px;
}
.rf-panel-box h5 {
  font-size: 14px;
  color: var(--grey);
  margin: 0 0 3px;
}
.rf-panel-box .input-column {
  padding-right: 0;
}
.rf-panel-box .input-column input {
  width: 100%;
  border: 1px solid var(--darkwhite);
}
.rf-panel-box .fa {
  font-size: 16px;
}
.rf-panel-box .textfield {
  background: white;
}
.rf-panel-box .actions .rf-btn {
  float: right;
  width: max-content;
}

.rf-panel-box-actions button {
  float: right;
}

.no-border .rf-panel-box {
  border: none;
  box-shadow: none;
}

.rf-panel-outer-frame {
  background-image: linear-gradient(var(--bg1), var(--bg2));
  padding: 10px 20px;
  border-bottom: 2px solid white;
}
.rf-panel-outer-frame .col-padding-sm {
  padding-right: 3px;
  padding-left: 3px;
}
.rf-panel-outer-frame .rf-edit::before {
  display: none;
}
.rf-panel-outer-frame.border-bottom {
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  border-bottom: 4px solid var(--midgrey);
}
.rf-panel-outer-frame.margin-bottom {
  margin-bottom: 60px;
}
.rf-panel-outer-frame .rf-panel-box {
  margin-bottom: 6px;
  margin-top: 0;
}

rf-text-editor.light-mode {
  /* stylelint-disable-next-line */
  /* stylelint-disable-next-line */
  /* stylelint-disable-next-line */
}
rf-text-editor.light-mode .CodeMirror-sizer {
  background: var(--midwhite);
}
rf-text-editor.light-mode .CodeMirror-cursor {
  border-left: 1px solid black;
}
rf-text-editor.light-mode .CodeMirror-line {
  color: blue;
}
rf-text-editor.html .cm-comment {
  color: magenta;
  font-weight: bold;
}
rf-text-editor.html .cm-s-default .cm-variable-2 {
  color: inherit;
}
rf-text-editor.html .cm-s-default .cm-keyword {
  font-weight: bold;
  color: darkgrey;
}
rf-text-editor.html .cm-s-default .cm-tag {
  color: orange;
  font-weight: bold;
}
rf-text-editor.html .cm-s-default .cm-property {
  color: lightgreen;
}
rf-text-editor.html .cm-s-default .cm-string {
  color: lightgreen;
  font-weight: bold;
}
rf-text-editor.html .cm-s-default .cm-def {
  color: inherit;
}
rf-text-editor.html .cm-s-default .cm-qualifier {
  color: orange;
}
rf-text-editor.js .cm-comment {
  color: magenta;
  font-weight: bold;
}
rf-text-editor.js .cm-s-default .cm-variable-2 {
  color: inherit;
}
rf-text-editor.js .cm-s-default .cm-keyword {
  font-weight: bold;
  color: orange;
}
rf-text-editor.js .cm-s-default .cm-atom {
  color: orange;
}
rf-text-editor.js .cm-s-default .cm-property {
  color: lightgray;
}
rf-text-editor.js .cm-s-default .cm-string {
  color: lightgreen;
  font-weight: bold;
}
rf-text-editor.js .cm-s-default .cm-def {
  color: inherit;
}

.text-editor-container {
  padding: 0 18px;
  /* stylelint-disable-next-line */
  /* stylelint-disable-next-line */
  /* stylelint-disable-next-line */
  /* stylelint-disable-next-line */
}
.text-editor-container .text-editor {
  height: auto;
  min-height: 350px;
  font-size: 11px;
  border-radius: 7px;
}
.text-editor-container .CodeMirror-lines {
  border-right: 1px solid var(--lightgrey);
  border-bottom: 1px solid var(--lightgrey);
}
.text-editor-container .CodeMirror-gutters {
  border-left: 1px solid var(--lightgrey);
}
.text-editor-container .CodeMirror-sizer {
  background: var(--grey);
  color: rgb(204, 240, 160);
}
.text-editor-container .CodeMirror-cursor {
  border-left: 1px solid white;
}

.left-w50 {
  width: 50%;
  float: left;
}

.left-w35 {
  width: 35%;
  float: left;
}

.w5 {
  width: 5%;
}

.w8 {
  width: 5%;
}

.w10 {
  width: 10%;
}

.w15 {
  width: 15%;
}

.w20 {
  width: 20%;
}

.w25 {
  width: 25%;
}

.w30 {
  width: 30%;
}

.w32 {
  width: 32%;
}

.w33 {
  width: 33%;
}

.w35 {
  width: 35%;
}

.w40 {
  width: 40%;
}

.w50 {
  width: 50%;
}

.w60 {
  width: 60%;
}

.w70 {
  width: 70%;
}

.w80 {
  width: 80%;
}

.w90 {
  width: 90%;
}

.w95 {
  width: 95%;
}

.w100 {
  width: 100%;
}

.min-h-10 {
  min-height: 10px;
}

.min-h-100 {
  min-height: 100px;
}

.min-h-110 {
  min-height: 110px;
}

.min-h-115 {
  min-height: 115px;
}

.min-h-50 {
  min-height: 50px;
}

.min-h-120 {
  min-height: 120px;
}

.min-h-125 {
  min-height: 125px;
}

.min-h-130 {
  min-height: 130px;
}

.min-h-135 {
  min-height: 135px;
}

.min-h-140 {
  min-height: 140px;
}

.min-h-150 {
  min-height: 150px;
}

.min-h-180 {
  min-height: 180px;
}

.min-h-200 {
  min-height: 200px;
}

.min-h-230 {
  min-height: 230px;
}

.min-h-250 {
  min-height: 250px;
}

.min-h-280 {
  min-height: 280px;
}

.min-h-300 {
  min-height: 300px;
}

.min-h-350 {
  min-height: 350px;
}

.min-h-370 {
  min-height: 370px;
}

.min-h-400 {
  min-height: 400px;
}

.page-actions-list .done {
  color: var(--lightgrey);
}

rf-settings-apps .app-settings {
  padding: 10px;
  padding-top: 17px;
  margin-top: 10px;
}
rf-settings-apps .app-settings:first-child {
  margin-top: initial;
}
rf-settings-apps .app-settings.disabled {
  background: var(--bg1);
}
rf-settings-apps .app-settings div:first-child {
  display: grid;
  grid-template-columns: 6fr 1fr;
  align-items: center;
}
rf-settings-apps .app-settings div:first-child * {
  display: inline-block;
}

.adm-settings-ctrl .section-header {
  width: 100%;
  border-bottom: 4px solid var(--bg1);
  margin-bottom: 40px;
}
.adm-settings-ctrl .section-header * {
  font-size: 36px;
  font-weight: bold;
  padding-right: 5px;
  color: var(--main_color);
}
.adm-settings-ctrl .sub-section-header {
  font-size: 32px;
  font-weight: bold;
  color: var(--midgrey);
  border: initial;
  margin-top: 30px;
}
.adm-settings-ctrl .sub-section-header button {
  float: right;
  width: 50px;
  padding: 12px;
  line-height: 12px;
}
.adm-settings-ctrl .alert {
  margin: 10px initial;
}

.page-tags-list label {
  padding: 9px;
  float: left;
  margin-right: 10px;
  border-radius: 10px;
  background: none;
}
.page-tags-list rf-select-tag-category select {
  padding: 10px;
  margin: 0;
}
.page-tags-list .tag-entry {
  border-bottom: 1px solid var(--lightgrey);
  margin-bottom: 15px;
}
.page-tags-list .tag-entry .color-bubble {
  height: 15px;
  margin-top: 2px;
  width: 30px;
  border: none;
  padding: 0;
  cursor: pointer;
}
.page-tags-list .tag-entry .borderless {
  background: none;
}
.page-tags-list .tag-entry .description {
  width: 30%;
}
.page-tags-list .parent-tags rf-tag .tag-box {
  cursor: pointer;
}
.page-tags-list .fa-archive {
  color: var(--main_color);
  cursor: pointer;
}

.admin-session-list {
  word-wrap: break-word;
}
.admin-session-list .table-row {
  padding: 7px;
  margin: 0;
  border-bottom: 1px solid var(--lightgrey);
  max-width: 85vw;
}
.admin-session-list .tag {
  display: inline-block;
  background: #7fff00;
  color: white;
  border-radius: 3px;
  padding: 0 10px;
  margin-right: 5px;
  line-height: 26px;
}
.admin-session-list .group-tags div {
  margin-bottom: 5px;
}

.page-admin-setting-edit .section-header {
  width: 100%;
  border-bottom: 4px solid var(--bg1);
  margin-bottom: 40px;
}
.page-admin-setting-edit .section-header * {
  font-size: 36px;
  font-weight: bold;
  padding-right: 5px;
  color: var(--main_color);
}
.page-admin-setting-edit .sub-section-header {
  font-size: 32px;
  font-weight: bold;
  color: var(--midgrey);
  border: initial;
  margin-top: 30px;
}
.page-admin-setting-edit .sub-section-header button {
  float: right;
  width: 50px;
  padding: 12px;
  line-height: 12px;
}
.page-admin-setting-edit .alert {
  margin: 10px initial;
}
.page-admin-setting-edit .rf-panel-box {
  margin: 0;
}

rf-settings-email label {
  color: var(--midgrey);
}
rf-settings-email img.language {
  width: 35px;
  margin-bottom: 10px;
}
rf-settings-email small {
  color: var(--lightgrey);
}

rf-settings-general .fa-question-circle {
  color: var(--main_color);
}

rf-settings-interfaces label {
  color: var(--midgrey);
}

rf-settings-licenses label {
  color: var(--midgrey);
}
rf-settings-licenses h4 {
  display: inline-block;
}
rf-settings-licenses .premium {
  float: right;
  display: inline-block;
  font-weight: bold;
  color: var(--main_color);
}

rf-settings-onboarding h4 {
  display: inline-block;
}
rf-settings-onboarding rf-upload-zone {
  display: inline-block;
  width: unset;
}
rf-settings-onboarding .fa-upload {
  color: var(--main_color);
  width: 20px;
}

rf-settings-pricing label {
  color: var(--midgrey);
}

rf-settings-sidebar {
  display: block;
  width: 100%;
  background-color: var(--untouched);
  border-radius: 8px;
  align-items: center;
  padding: 10px;
}
rf-settings-sidebar button {
  width: 100%;
  background-color: var(--untouched);
  padding: 12px 15px;
  border-radius: 5px;
  color: var(--midgrey);
  text-align: left;
  border: none;
}
rf-settings-sidebar button:hover {
  background-color: var(--lightgrey);
  color: var(--untouched);
}
rf-settings-sidebar button.selected {
  background-color: var(--main_color);
  color: var(--untouched);
}

rf-admin-backups {
  display: block;
}
rf-admin-backups .fold-btn {
  position: relative;
}
rf-admin-backups .fold-btn rf-fold-btn {
  position: absolute;
  top: 0;
  right: 20px;
}
rf-admin-backups .fold-btn h4 {
  font-size: 18px;
  line-height: 40px;
}
rf-admin-backups .file-dir {
  max-height: 500px;
  overflow-y: auto;
}
rf-admin-backups .file-dir i {
  color: var(--main_color);
  cursor: pointer;
  margin-right: 12px;
}
rf-admin-backups .file-dir i:hover {
  color: var(--main_color_light);
}
rf-admin-backups .file-container {
  border: 1px solid var(--lightgrey);
  margin: 0;
}
rf-admin-backups .file {
  font-size: 12px;
  margin: 0;
}
rf-admin-backups .file.directory:hover {
  color: var(--main_color);
}
rf-admin-backups .file:nth-child(even) {
  background: var(--darkwhite);
}
rf-admin-backups .file:hover {
  background: var(--lightgrey);
}

rf-cronjob {
  display: block;
}
rf-cronjob .grey {
  color: var(--grey);
}
rf-cronjob .green {
  color: var(--darkgreen);
}
rf-cronjob .rf-btn, rf-cronjob .rf-btn.rf-btn-inverted,
rf-cronjob .rf-btn:hover {
  height: 30px;
}
rf-cronjob .rf-btn .fa-plus {
  margin-top: 4px;
}
rf-cronjob .search-result {
  line-height: 30px;
  overflow: auto;
}
rf-cronjob .search-result:nth-child(even) {
  background: var(--darkwhite);
}
rf-cronjob .search-result .small-padding {
  padding: 0 5px;
}
rf-cronjob .search-result i {
  margin-top: 8px;
}
rf-cronjob .search-result i:hover {
  opacity: 0.7;
}
rf-cronjob .search-result .selected {
  color: var(--main_color);
}
rf-cronjob .search-result .description {
  font-size: 12px;
}
rf-cronjob .search-result .description:hover {
  color: var(--main_color);
}
rf-cronjob .search-result .actions i {
  margin: 0 5px;
}

rf-admin-monitor {
  display: block;
}
rf-admin-monitor .beam label {
  width: 100%;
  text-align: center;
  font-size: 12px;
}
rf-admin-monitor .beam .box-container {
  position: relative;
  width: 100%;
  height: 25px;
}
rf-admin-monitor .beam .box {
  position: absolute;
  width: 100%;
  background: var(--lightgrey);
  height: 10px;
}
rf-admin-monitor .beam .box.active {
  width: 0;
  background: var(--main_color);
}
rf-admin-monitor .beam.bright .box.active {
  background: var(--main_color_light);
}
rf-admin-monitor .beam.dark .box.active {
  background: var(--main_color_contrast_dark);
}
rf-admin-monitor .server-console-logs {
  border: 1px solid var(--lightgrey);
  background: black;
  width: 100%;
  max-height: 400px;
  overflow-y: auto;
  border-radius: 8px;
  padding: 0 15px;
  min-height: 250px;
}

.admin-system .rf-panel-box {
  margin-top: -2px;
}
.admin-system .underline {
  margin-bottom: 0;
}
.admin-system .fa-circle.green {
  color: var(--darkgreen);
}
.admin-system .fa-circle.red {
  color: var(--invalid);
}
.admin-system a.disabled {
  color: var(--lightgrey);
}
.admin-system rf-csv-import {
  width: 99%;
  display: inline-block;
  margin-left: 8px;
}
.admin-system td {
  padding: 0 5px;
}

rf-sysinfo {
  display: block;
}
rf-sysinfo h3:hover {
  color: var(--main_color);
}
rf-sysinfo i {
  float: right;
}
rf-sysinfo hr {
  margin: 0;
}

rf-admin-syslogs {
  display: block;
}
rf-admin-syslogs .log-search-results {
  max-height: 500px;
  overflow-y: auto;
}
rf-admin-syslogs .log-search-result {
  line-height: 30px;
  font-size: 12px;
  color: var(--grey);
}
rf-admin-syslogs .log-search-result i {
  margin-top: 6px;
}
rf-admin-syslogs .log-search-result:hover {
  color: var(--main_color);
}
rf-admin-syslogs .log-search-result:nth-child(even) {
  background: var(--darkwhite);
}
rf-admin-syslogs .log-search-result .selected {
  font-weight: bold;
}
rf-admin-syslogs .color-log.info i {
  color: var(--darkgreen);
}
rf-admin-syslogs .color-log.error i {
  color: var(--darkred);
}
rf-admin-syslogs .color-active-log.info {
  color: var(--darkgreen);
}
rf-admin-syslogs .color-active-log.error {
  color: var(--darkred);
}

rf-admin-update {
  display: block;
}

rf-public-files {
  text-align: left;
}
rf-public-files .results-count {
  font-weight: bold;
  font-size: 140%;
  color: var(--midgrey);
  margin-bottom: 10px;
}
rf-public-files .public-img {
  position: relative;
  padding: 10px;
  box-shadow: 0 0 5px 0 var(--lightgrey);
  border-radius: 4px;
  margin-bottom: 20px;
}
rf-public-files .choose-file .public-img:hover {
  cursor: pointer;
  background: var(--darkwhite);
}
rf-public-files .choose-file .public-img:hover rf-drawing-img {
  cursor: pointer;
  background: var(--darkwhite);
}

rf-settings-pdf-docs h4 {
  margin-top: 10px !important;
  margin-bottom: initial !important;
}
rf-settings-pdf-docs .section-header {
  width: 100%;
  border-bottom: 4px solid var(--bg1);
  margin-bottom: 40px;
}
rf-settings-pdf-docs .section-header * {
  font-size: 36px;
  font-weight: bold;
  padding-right: 5px;
  color: var(--main_color);
}
rf-settings-pdf-docs .sub-section-header {
  font-size: 32px;
  font-weight: bold;
  color: var(--midgrey);
  border: initial;
  margin-top: 30px;
}
rf-settings-pdf-docs .sub-section-header button {
  float: right;
  width: 50px;
  padding: 12px;
  line-height: 12px;
}
rf-settings-pdf-docs table.admin-table tr td:nth-child(odd) {
  text-align: center;
}
rf-settings-pdf-docs table.admin-table tr td:nth-child(even) {
  text-align: center;
}
rf-settings-pdf-docs table.admin-table tr td:first-child {
  text-align: left;
}

.admin-email .underline {
  margin-bottom: 0;
}

rf-templates .heading {
  color: var(--grey);
  margin-bottom: 10px;
  border-bottom: 1px solid var(--lightgrey);
}
rf-templates .heading i {
  font-size: 22px;
}
rf-templates .heading h3 {
  font-size: 22px;
  margin: 0;
  float: left;
}
rf-templates .heading small {
  font-size: 15px;
  line-height: 27px;
  margin-left: 10px;
}
rf-templates .left-navbar-container .template-list {
  height: calc(100vh - 130px);
  overflow: auto;
}
rf-templates .left-navbar-container .template-list .template-elem {
  cursor: pointer;
}
rf-templates .left-navbar-container .template-list .template-elem.active {
  background: var(--main_color);
}
rf-templates .left-navbar-container .template-list .template-elem.disabled {
  color: var(--lightgrey);
}
rf-templates .left-navbar-container .template-list small {
  float: right;
  padding: 1px 5px;
  margin-top: 2px;
  margin-right: 2px;
  border-radius: 7px;
  background: red;
  color: white;
  font-weight: bold;
  font-size: 10px;
}
rf-templates .margin-container small {
  width: 100%;
  float: left;
  color: var(--grey);
}
rf-templates .margin-container .label-container {
  width: 40%;
  float: left;
}
rf-templates .margin-container .label-container label {
  width: 100% !important;
}
rf-templates .margin-container .inputs {
  width: 60%;
  float: left;
}
rf-templates .margin-container .inputs div {
  width: 25%;
  float: left;
  text-align: center;
}
rf-templates .margin-container .inputs input {
  width: 100% !important;
  text-align: center;
  border-right: 1px solid white;
}
rf-templates .var-directory-container {
  min-height: 350px;
  word-break: break-word;
}

rf-translations .left-container {
  border-right: 4px solid lightgray;
}
rf-translations .left-container .language-list {
  min-height: 550px;
  max-height: 550px;
  overflow: auto;
}
rf-translations .left-container .language-list .language-elem {
  cursor: pointer;
}
rf-translations .left-container .language-list .language-elem.active {
  background: orange;
}
rf-translations .notifications {
  line-height: 35px;
}
rf-translations .rf-btn, rf-translations .rf-btn.rf-btn-inverted,
rf-translations .rf-btn:hover {
  border-radius: 4px;
}

.admin-profile-edit .viewmode {
  pointer-events: none;
}
.admin-profile-edit .user-row {
  margin-bottom: 15px;
}
.admin-profile-edit .user-row small {
  color: var(--midgrey);
  font-weight: bold;
}
.admin-profile-edit .signature-container {
  margin-bottom: 20px;
}
.admin-profile-edit .signature-container input {
  font-size: 20px;
  border: none;
  background: whitesmoke;
}
.admin-profile-edit .signature-container .rf-btn-inverted {
  float: right;
}
.admin-profile-edit rf-hashtag .tag-box {
  float: left;
}
.admin-profile-edit rf-hashtag .tag-edit {
  float: right;
}
.admin-profile-edit rf-hashtag .tag-edit .rf-btn {
  float: left;
}
.admin-profile-edit .tag {
  background: var(--main_color);
  border-radius: 4px;
  float: right;
  padding: 3px 8px;
  margin: 1px 3px;
  color: white;
}
.admin-profile-edit .select-btn.floatright {
  float: right;
}
.admin-profile-edit .rf-form.floatright {
  float: right;
}
.admin-profile-edit .rf-edit.no-overflow {
  overflow: hidden;
}

.user-list .tag {
  display: inline-block;
  background: #7fff00;
  color: white;
  border-radius: 3px;
  padding: 0 10px;
  margin-right: 5px;
  line-height: 26px;
}
.user-list .img-container {
  width: 40px;
  height: 1px;
  float: left;
}
.user-list .img-container rf-profile-pic {
  margin-top: -6px;
}
.user-list .add-button {
  width: 190px;
  float: right;
  border-radius: 5px;
}
.user-list.mainview {
  top: 0;
}

.page-files-list .red {
  color: var(--red);
}
.page-files-list .list-header .fa-check, .page-files-list .list-header .fa-warning {
  font-size: 24px;
  cursor: pointer;
}
.page-files-list .list-header .fa-check {
  color: var(--green);
}

.page-machines-list .machines-table, .page-machines-list .docs-table {
  text-align: left;
}
.page-machines-list .fa-plus {
  color: var(--main_color);
  cursor: pointer;
}

.page-onboardings-list .beam label {
  width: 100%;
  text-align: center;
  font-size: 12px;
}
.page-onboardings-list .beam .box-container {
  position: relative;
  width: 100%;
  height: 25px;
}
.page-onboardings-list .beam .box {
  position: absolute;
  width: 100%;
  background: var(--lightgrey);
  height: 10px;
}
.page-onboardings-list .beam .box.active {
  width: 0;
  background: var(--main_color);
}
.page-onboardings-list .beam.bright .box.active {
  background: var(--main_color_light);
}
.page-onboardings-list .beam.dark .box.active {
  background: var(--main_color_contrast_dark);
}

.page-promotions-list .beam label {
  width: 100%;
  text-align: center;
  font-size: 12px;
}
.page-promotions-list .beam .box-container {
  position: relative;
  width: 100%;
  height: 25px;
}
.page-promotions-list .beam .box {
  position: absolute;
  width: 100%;
  background: var(--lightgrey);
  height: 10px;
}
.page-promotions-list .beam .box.active {
  width: 0;
  background: var(--main_color);
}
.page-promotions-list .beam.bright .box.active {
  background: var(--main_color_light);
}
.page-promotions-list .beam.dark .box.active {
  background: var(--main_color_contrast_dark);
}

rf-box-value {
  margin-top: 3px;
  font-size: 20px;
  font-weight: bold;
  color: white;
  background: #c2d3d5;
  border: 1px solid var(--lighgrey);
  border-radius: 10px;
  width: 100%;
  min-width: 100px;
  height: 50px;
  display: inline-block;
  text-align: center;
  padding-top: 12px;
}
rf-box-value .small {
  font-size: 75%;
}

.page-dashboard .pane-box-height {
  min-height: 320px;
}
.page-dashboard b {
  font-size: large;
}
.page-dashboard .number {
  font-size: large;
  font-weight: bold;
  float: right;
}
.page-dashboard .number-line {
  height: 28px;
}
.page-dashboard hr {
  margin: 5px;
}
.page-dashboard .link {
  cursor: pointer;
}
.page-dashboard rf-simple-pie-chart {
  display: block;
  height: 300px;
}

.page-order-statistic {
  /* -----------------------  upper control elements  ----------------------------- */
  /* ----------------------- xy ----------------------------- */
  /* -----------------------  pie cahrt ----------------------------- */
}
.page-order-statistic .rf-panel-box {
  position: relative;
}
.page-order-statistic .rf-panel-box h4 {
  color: #839597;
  font-weight: bold;
  text-align: center;
  font-size: 24px;
}
.page-order-statistic .rf-panel-box.data-table h4 {
  text-align: left;
}
.page-order-statistic .time-switcher {
  margin-top: 6px;
}
.page-order-statistic rf-xy-multi-diagram svg,
.page-order-statistic rf-xy-diagram svg,
.page-order-statistic rf-histogram svg {
  width: 100%;
  height: 400px;
  z-index: 99;
  display: block;
  position: relative;
  overflow: visible;
}
.page-order-statistic .grey-box-label {
  text-align: center;
  width: 100%;
  font-size: 12px;
  text-transform: uppercase;
  color: #839597;
  font-weight: bold;
}
.page-order-statistic rf-action-select {
  float: right;
}
.page-order-statistic .rf-pie-chart-simple {
  margin: 0 auto;
  display: flex;
}
.page-order-statistic .chart-label {
  display: block;
  float: left;
  width: 100%;
  margin-bottom: 10px;
}
.page-order-statistic .chart-label .color-box {
  width: 60px;
  height: 25px;
  float: left;
  color: white;
  text-align: center;
  padding-top: 3px;
}
.page-order-statistic .chart-label .text-container {
  float: left;
  padding-left: 20px;
  width: calc(100% - 60px);
  line-height: 25px;
  color: #839597;
}
.page-order-statistic .top-pie-indicator {
  font-size: 18px;
  font-weight: bold;
  color: white;
  background: #c2d3d5;
  border-radius: 10px;
  padding: 5px 15px;
  position: absolute;
  bottom: 10px;
  left: 10px;
  right: 10px;
}
@media (max-width: 1080px) {
  .page-order-statistic .top-pie-indicator {
    font-size: 14px;
  }
}

rf-tasks .headline {
  color: var(--grey);
  cursor: pointer;
}
rf-tasks .headline:hover {
  color: var(--main_color);
}
rf-tasks .table-head-sticky {
  position: sticky;
  top: 0;
  background: white;
  z-index: 150;
}
rf-tasks table {
  width: 100%;
  font-size: 85%;
}
rf-tasks table td {
  padding: 0 3px;
}
rf-tasks .margin-class {
  margin-bottom: 10px;
}
rf-tasks .mainview-top-panel {
  padding: 0;
}

.page-machines-list .beam label {
  width: 100%;
  text-align: center;
  font-size: 12px;
}
.page-machines-list .beam .box-container {
  position: relative;
  width: 100%;
  height: 25px;
}
.page-machines-list .beam .box {
  position: absolute;
  width: 100%;
  background: var(--lightgrey);
  height: 10px;
}
.page-machines-list .beam .box.active {
  width: 0;
  background: var(--main_color);
}
.page-machines-list .beam.bright .box.active {
  background: var(--main_color_light);
}
.page-machines-list .beam.dark .box.active {
  background: var(--main_color_contrast_dark);
}
.page-machines-list h4 {
  display: inline-block;
}
.page-machines-list rf-status-icon .status {
  transform: translate(-20%, 60%);
}
.page-machines-list rf-status-icon.disabled .rf-icon {
  color: var(--lightgrey);
}
.page-machines-list small {
  float: right;
}
.page-machines-list small.error, .page-machines-list span.error {
  color: var(--red);
}

.public-login {
  overflow: hidden;
  height: 100%;
}
.public-login .left-action-box {
  height: 100vh;
  padding: 40px;
  background: rgba(166, 166, 166, 0.77);
  box-shadow: 0 0 19px 5px rgba(87, 65, 65, 0.6);
  text-align: right;
  display: flex;
  color: white;
}
.public-login .left-action-box .inner-container {
  margin: auto;
  align-items: end;
}
.public-login .left-action-box img {
  min-width: 200px;
  float: right;
  margin-bottom: 30px;
  width: 50%;
}
.public-login .left-action-box form {
  max-width: 500px;
  float: right;
  width: 100%;
}
.public-login .left-action-box .login-btn i {
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  opacity: 0;
}
.public-login .left-action-box .login-btn:hover i {
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  opacity: 1;
}
.public-login .left-action-box .spin {
  animation: rotate 3.5s linear infinite;
}
.public-login .row {
  padding: 10px 0;
  margin: 0;
}
.public-login .link-btn {
  cursor: pointer;
  font-size: 24px;
  font-weight: bold;
  float: left;
  padding: 0;
}
.public-login .link-btn span {
  width: 70%;
  display: block;
}
.public-login .link-btn.active span {
  border-bottom: 3px solid var(--main_color);
}
.public-login .link-btn:hover {
  color: var(--main_color_light);
}
.public-login .agreement {
  padding: 0;
  margin: 0 -15px;
}
.public-login .privacy-info {
  bottom: 35px;
  left: 15px;
}
.public-login .privacy-info i {
  top: 1.5px;
  font-size: 9px;
}
.public-login .privacy-info a {
  left: 17px;
}
.public-login ul {
  list-style-image: url("/img/checkmark.svg");
}
.public-login ul li {
  margin: 10px -15px;
}
.public-login .app-version {
  display: block;
  margin-top: 20px;
}

.public-logout .row {
  padding: 10px 0;
  margin: 0;
}

.public-reset .row {
  padding: 10px 0;
  margin: 0;
}
.public-reset .alert {
  text-align: center;
  font-weight: bold;
  font-size: 130%;
}

.public {
  position: absolute;
  left: 0;
  right: 0;
  padding-bottom: 100px;
  top: 0;
  min-height: 100%;
  background-color: #b9b9b9;
  z-index: 9999;
  background-image: url("../img/packages-bg.jpg");
  background-size: 100% 100%;
}
@media (max-width: 768px) {
  .public {
    background-image: none;
  }
}
.public .container {
  margin-right: auto;
  margin-left: auto;
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 768px) {
  .public .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .public .container {
    width: 970px;
  }
}
@media (min-width: 1400px) {
  .public .container {
    width: 1170px;
  }
}
.public .action-box {
  background: rgba(166, 166, 166, 0.77);
  box-shadow: 0 0 19px 5px rgba(87, 65, 65, 0.6);
  z-index: 9;
  color: white;
  padding: 40px;
  margin-top: 40px;
}
.public .header {
  width: 100%;
  background: var(--grey);
  padding: 5px;
}
.public .header .logo {
  width: 200px;
}
.public input, .public select {
  width: 100%;
  color: black;
}
.public .rf-btn {
  background: var(--main_color_contrast_ultra_dark);
  color: white;
  width: 100%;
  font-size: 16px;
  font-weight: 600;
  border-radius: 4px;
  display: inline-block;
  margin: 0;
  padding: 6px;
  border: 1px solid transparent;
}
.public a {
  color: var(--main_color_contrast_ultra_dark);
}
.public .warning {
  color: var(--invalid);
}
.public .agreement-box {
  margin: 20px 0 10px !important;
}
.public .agreement {
  position: relative;
  min-height: 25px;
}
.public .agreement input {
  height: 25px;
  width: 15px;
  position: absolute;
  left: 20px;
  top: 0;
}
.public .agreement p {
  position: relative;
  left: 45px;
  top: 2.5px;
  margin-right: 60px;
}