@charset "UTF-8";
/* System Info */
/* input field colors */
/* button black colors */
/* button white colors */
/* button green colors */
/* button grey colors */
/* button default colors */
/* button positiv colors */
/* button negativ colors */
/* main menu colors */
/* status bar colors */
/* service colors */
@font-face {
  font-family: "Ubuntu-Regular";
  font-style: normal;
  font-weight: 400;
  src: url("../../fonts/UBUNTU-R.TTF") format("woff2");
}
@font-face {
  font-family: "Ubuntu-Medium";
  font-style: normal;
  font-weight: 500;
  src: url("../../fonts/UBUNTU-M.TTF") format("woff2");
}
* {
  box-sizing: border-box;
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}

.cleaner {
  clear: both;
  width: 0;
  height: 0;
  overflow: hidden;
}

.hl {
  color: #222222;
}

.date-info {
  color: #222222;
}

.exception-title {
  background-color: #f2f4ed;
  color: #222222;
}

.exception-body {
  color: #222222;
}
.exception-body .info {
  font-size: 1.2em;
}

.hidden {
  display: none;
}

.reason-loading {
  width: 100%;
  min-height: 400px;
  background-image: url("../../images/loading.gif");
  background-size: 120px;
  background-repeat: no-repeat;
  background-position: center;
}

.content-spacer-10 {
  margin-bottom: 10px;
}

.content-spacer-20 {
  margin-bottom: 20px;
}

.content-spacer-30 {
  margin-bottom: 30px;
}

.content-spacer-40 {
  margin-bottom: 40px;
}

.content-spacer-50 {
  margin-bottom: 50px;
}

.content-spacer-top-10 {
  margin-top: 10px;
}

.content-spacer-top-20 {
  margin-top: 20px;
}

.content-spacer-top-30 {
  margin-top: 30px;
}

.content-spacer-top-40 {
  margin-top: 40px;
}

.content-spacer-top-50 {
  margin-top: 50px;
}

.box-spacing-10 {
  padding: 10px;
}

.box-spacing-20 {
  padding: 20px;
}

.box-spacing-50 {
  padding: 50px;
}

.icon-service-done, .icon-service-pending, .icon-service-new {
  margin: 10px auto 0 auto;
  background-repeat: no-repeat;
  background-size: 40px 40px;
  width: 40px;
  height: 40px;
}

.icon-new-small {
  font-family: Ubuntu-Regular, Helvetica, sans-serif;
  position: absolute;
  top: 0;
  right: 0;
  padding: 1px 5px;
  font-size: 0.5em;
  min-width: fit-content;
  line-height: 10px;
  border-radius: 7px;
  color: #fefefe;
  background-color: #4e9f3a;
  border: 1px solid #4e9f3a;
}

.icon-service-new {
  background-image: url("../../images/service-new.png");
}

.icon-service-pending {
  background-image: url("../../images/service-pending.png");
}

.icon-service-done {
  background-image: url("../../images/service-done.png");
}

.icon-service-big-done, .icon-service-big-pending, .icon-service-big-new {
  margin: 3px auto;
  background-repeat: no-repeat;
  background-size: 80px 80px;
  width: 80px;
  height: 80px;
}

.icon-service-big-new {
  background-image: url("../../images/service-new.png");
}

.icon-service-big-pending {
  background-image: url("../../images/service-pending.png");
}

.icon-service-big-done {
  background-image: url("../../images/service-done.png");
}

/* START ui-elements */
#system-message {
  position: absolute;
  width: 450px;
  top: 50%;
  left: calc(50% - 225px);
}

.slide-left, .slide-right, #navigation * ul > li.has-children::after, .slide-up, .slide-down, #actor-menu .has-children::after, #navigation > ul > li.has-children::after {
  position: absolute;
  content: "";
  top: 50%;
  width: 0;
  height: 0;
  border-color: #222222;
}

.slide-left-inline, .slide-right-inline, .slide-up-inline, .slide-down-inline {
  position: relative;
  content: "";
  top: calc(50% - 0.3em);
  width: 0;
  height: 0;
  border-color: #222222;
}

.slide-down, #actor-menu .has-children::after, #navigation > ul > li.has-children::after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid;
}

.slide-up {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 4px solid;
}

.slide-right, #navigation * ul > li.has-children::after {
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 4px solid;
}

.slide-left {
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-right: 4px solid;
}

.slide-down-inline {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid;
}

.slide-up-inline {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 4px solid;
}

.slide-right-inline {
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 4px solid;
}

.slide-left-inline {
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-right: 4px solid;
}

/* END ui-elements */
/* START clickable */
a {
  color: #222222;
  text-decoration: none;
}
a:visited {
  color: #222222;
}
a:hover {
  color: #222222;
}
a.hinting {
  position: relative;
  margin: 0 10px;
}
a.hinting::before {
  position: absolute;
  top: -4px;
  left: -10px;
  width: 10px;
  content: "»";
}
a.hinting::after {
  position: absolute;
  top: -4px;
  right: -13px;
  width: 10px;
  content: "«";
}

.button-link {
  display: inline-block !important;
  color: #222222;
  text-align: left !important;
  padding: 0 !important;
  margin: 0 !important;
  background-color: transparent !important;
  border: 0 !important;
}
.button-link:hover {
  color: #555555;
}

.button-overlay {
  background-color: rgba(0, 0, 0, 0.4);
  padding: 15px 20px;
  margin-left: 0 !important;
  margin-right: 0 !important;
  border-radius: 8px;
  color: white;
}

.button-negativ-flat, .button-negativ, .button-positiv-flat, .button-positiv, .button-default-flat, .button-default {
  font-family: Ubuntu-Regular, Helvetica, sans-serif;
  display: inline-block;
  font-size: 0.9em;
  padding: 4px 15px;
  border-radius: 4px;
  cursor: pointer;
}

.button-gray, .button-white, .button-green, .button-black {
  display: inline-block;
  font-size: 0.9em !important;
  text-align: center !important;
  cursor: pointer !important;
  border-radius: 10px !important;
  padding: 10px 20px !important;
  line-height: 20px !important;
  min-width: 140px !important;
  font-family: Ubuntu-Regular, Helvetica, sans-serif;
}

.tab {
  background-color: white;
}
.tab:hover {
  color: white;
  cursor: pointer;
  background-color: #359104;
}

.tab-selected {
  color: white;
  cursor: pointer;
  background-color: #359104 !important;
}

.button-black {
  color: #fefefe;
  background-color: #222222;
  border: 1px solid #222222;
}
.button-black:visited {
  color: #fefefe;
}
.button-black:hover {
  color: #fefefe;
  background-color: #545454;
}

.button-green {
  color: #fefefe;
  background-color: #4e9f3a;
  border: 1px solid #4e9f3a;
}
.button-green:visited {
  color: #fefefe;
}
.button-green:hover {
  color: #fefefe;
  background-color: #447a35;
}

.button-white {
  color: #222222;
  background-color: #fefefe;
  border: 1px solid #222222;
}
.button-white:visited {
  color: #222222;
}
.button-white:hover {
  color: #222222;
  background-color: #e9e9e9;
}

.button-gray {
  color: #fefefe;
  background-color: #a2a2a2;
  border: 1px solid #a2a2a2;
}
.button-gray:visited {
  color: #fefefe;
}
.button-gray:hover {
  background-color: #929292;
}

.button-default {
  color: #222222 !important;
  border: 1px solid #555555;
  background: linear-gradient(to bottom, #eeeeee, #aaaaaa);
}
.button-default:hover {
  background: linear-gradient(to bottom, #aaaaaa, #eeeeee);
}
.button-default:disabled {
  color: #7d7d7d !important;
}

.button-default-flat {
  color: #222222 !important;
  border: 1px solid #555555;
  background-color: #dddddd;
}
.button-default-flat:hover {
  background-color: #eeeeee;
}
.button-default-flat:disabled {
  color: #7d7d7d !important;
  background-color: #666666 !important;
}

.button-positiv {
  color: #cccccc !important;
  border: 1px solid #555555;
  background: linear-gradient(to bottom, #47633d, #17330d);
}
.button-positiv:hover {
  background: linear-gradient(to bottom, #17330d, #47633d);
}
.button-positiv:disabled {
  color: #7d7d7d !important;
}

.button-positiv-flat {
  color: #cccccc !important;
  border: 1px solid #555555;
  background-color: #37532d;
}
.button-positiv-flat:hover {
  background-color: #47633d;
}
.button-positiv-flat:disabled {
  color: #7d7d7d !important;
  background-color: #17330d !important;
}

.button-negativ {
  color: #cccccc !important;
  border: 1px solid #555555;
  background: linear-gradient(to bottom, #642a2a, #340a0a);
}
.button-negativ:hover {
  background: linear-gradient(to bottom, #340a0a, #642a2a);
}
.button-negativ:disabled {
  color: #7d7d7d !important;
}

.button-negativ-flat {
  color: #cccccc !important;
  border: 1px solid #555555;
  background-color: #642a2a;
}
.button-negativ-flat:hover {
  background-color: #743a3a;
}
.button-negativ-flat:disabled {
  color: #7d7d7d !important;
  background-color: #420808 !important;
}

.button-expand {
  display: inline-block;
  font-size: 0.9em;
  text-align: center;
  cursor: pointer;
  border-radius: 10px;
  padding: 8px 20px;
  margin: 10px 0 10px 15px;
  line-height: 24px;
  font-family: Ubuntu-Regular, Helvetica, sans-serif;
  color: #fefefe;
  background-color: #222222;
  border: 1px solid #222222;
}

/* END clickable */
/* START dd-menu logic */
#navigation {
  min-width: 800px;
  position: relative;
  z-index: 100;
}
#navigation a {
  position: relative;
  display: inline-block;
  white-space: nowrap;
  margin-right: 10px;
}
#navigation button {
  padding: 10px 20px !important;
}
#navigation ul {
  width: 100%;
  min-width: fit-content;
  margin: 0;
  padding: 0;
}
#navigation li {
  position: relative;
  width: fit-content;
  list-style: none;
  margin: 0;
  padding: 0;
}
#navigation li:hover > ul {
  display: block;
}
#navigation li > ul {
  display: none;
  position: absolute;
}
#navigation li > ul > li > ul {
  top: -1px;
  left: 100%;
}
#navigation > ul > li {
  float: left;
  width: fit-content;
}
#navigation > ul > li.has-children::after {
  right: 10px !important;
}
#navigation > ul > li:last-child {
  float: right !important;
  margin-right: 50px !important;
}
#navigation > ul > li > ul {
  top: 100%;
  left: 0;
}
#navigation * ul > li {
  width: 100%;
}
#navigation * ul > li.has-children::after {
  right: 10px;
  top: calc(50% - 4px) !important;
}
#navigation * ul > li > a {
  display: block;
}

/* END dd-menu logic */
/* START dd-menu styling */
#navigation {
  background: linear-gradient(to bottom, #fefefe, #fefefe);
}
#navigation a {
  color: #222222;
  text-decoration: none;
}
#navigation a:hover {
  color: #555555;
}
#navigation li > ul {
  background-color: #fefefe;
  border: 1px solid #444444;
}
#navigation li > ul > li > a {
  font-size: 0.8em;
  padding: 8px 10px;
}
#navigation > ul > li {
  border-right: 1px solid #fefefe;
}
#navigation > ul > li:last-child {
  border-right: 0;
  border-left: 1px solid #fefefe;
}
#navigation > ul > li > a {
  font-size: 1em;
  padding: 10px 15px;
  margin: 0;
}
#navigation * ul > li {
  display: block;
  border-bottom: 1px solid #444444;
}
#navigation * ul > li:last-child {
  border-bottom: 0;
}

/* END dd-menu styling */
/* START actor menu and login */
#actor-menu {
  float: right;
  z-index: 100;
}
#actor-menu menu {
  padding: 0;
  margin: 0;
}
#actor-menu menu li {
  width: 100%;
  border-bottom: 1px solid #444444;
}
#actor-menu menu li:last-child {
  border-bottom: 0;
}
#actor-menu menu li a {
  padding: 5px 10px;
  width: 100%;
}
#actor-menu form {
  background-color: #cccccc;
  padding: 5px 10px;
  margin: 0;
}
#actor-menu .menu-item {
  position: relative;
  display: inline-block;
  text-decoration: none;
  padding: 10px 20px;
  margin-right: 10px;
}
#actor-menu .form-row {
  margin-top: 10px;
}
#actor-menu .has-children::after {
  right: 10px !important;
}

#actor-menu-dropdown {
  position: absolute;
  display: none;
  right: 10px;
  background-color: #cccccc;
  border: 1px solid #444444;
}

/* END actor menu and login */
/* START formular styles */
form {
  padding: 15px 0 5px 0;
  width: 100%;
  margin: 0 auto;
  border-radius: 10px;
}
form.minimized {
  display: inline-block;
  width: fit-content !important;
  height: fit-content;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
}
form.was-validated select, form.was-validated input {
  padding-right: calc(1.5em + 0.75rem);
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
form.was-validated select:invalid, form.was-validated input:invalid {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
  border-color: #dc3545;
}
form.was-validated select:valid, form.was-validated input:valid {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
  border-color: #198754;
}
form div.row {
  margin-bottom: 10px;
}
form div.row > div.table-col {
  padding: 4px 0;
}
form label {
  padding-left: 10px;
  display: block;
  font-size: 1.2em;
}
form input {
  color: #222222;
  background-color: #fefefe;
  border: 1px solid #555555;
  border-radius: 10px;
  padding: 8px 15px;
  width: 100%;
}
form input.is-invalid {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e") !important;
  border-color: #dc3545 !important;
}
form input[type=submit] {
  width: fit-content !important;
  padding: 6px 15px;
}
form input:disabled {
  color: #666666;
  background-color: #d3d3d3;
}
form input[type=checkbox] {
  color: #222222;
  background-color: #fefefe;
  border: 1px solid #555555;
  margin-right: 10px;
}
form select {
  color: #222222;
  background-color: #fefefe;
  border: 1px solid #555555;
  border-radius: 10px;
  padding: 9px 5px;
  width: 100%;
}
form select.is-invalid {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e") !important;
  border-color: #dc3545 !important;
}
form select:disabled {
  color: #666666;
  background-color: #d3d3d3;
}
form textarea {
  color: #222222;
  background-color: #fefefe;
  border: 1px solid #555555;
  border-radius: 10px;
  padding: 10px;
  width: 100%;
}
form textarea.is-invalid {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e") !important;
  border-color: #dc3545 !important;
}
form textarea:disabled {
  color: #666666;
  background-color: #d3d3d3;
}
form .form-row {
  margin-bottom: 10px;
}

/* END formular styles */
/* START table styles */
table {
  border-collapse: collapse !important;
}
table th.table-col:last-child, table td.table-col:last-child {
  padding: 10px 10px 10px 10px;
}
table tr.table-col {
  padding: 10px 10px;
}

/* END table styles */
/* START tree table styles */
.tree-table {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.tree-table ul {
  list-style: none;
  line-height: 46px;
  margin: 0;
}
.tree-table ul li {
  position: relative;
}
.tree-table ul li::before {
  position: absolute;
  top: -7px;
  left: -15px;
  border-left: 2px solid white;
  border-bottom: 2px solid white;
  height: 30px;
  width: 10px;
  content: "";
}
.tree-table ul li::after {
  position: absolute;
  bottom: 0;
  left: -15px;
  height: 100%;
  width: 10px;
  border-left: 2px solid white;
  content: "";
}
.tree-table ul li:last-child::after {
  display: none;
}

/* END tree table styles */
.pagination {
  width: fit-content;
  margin: 0 auto;
}

.list-group-item {
  color: #222222;
  background-color: #dedede;
  border-bottom-color: #555555;
}
.list-group-item.active {
  background: linear-gradient(to bottom, #eeeeee, #aaaaaa);
  border-color: #555555;
  text-transform: uppercase;
}

.modal-content {
  background-color: #dedede;
  border: 1px solid #555555;
}

.table-striped > tbody > tr:nth-of-type(2n+1) > th {
  background-color: rgba(65, 173, 73, 0.8) !important;
  color: #ffffff !important;
}

.table-striped > tbody > tr:nth-of-type(2n+1) > td {
  background-color: rgb(245, 245, 245) !important;
}

textarea.form-control {
  color: #222222;
  background-color: #fefefe;
  border: 1px solid #555555;
  border-radius: 10px;
  padding: 10px;
  width: 100%;
}

.icon-va, .icon-mo, .icon-ga, .icon-en {
  width: 60px;
  height: 60px;
  background-size: 60px 60px;
  background-position-x: left;
  background-position-y: top;
}

.icon-va-big, .icon-mo-big, .icon-ga-big, .icon-en-big {
  width: 80px;
  height: 80px;
  background-size: 80px 80px;
  background-position-x: left;
  background-position-y: top;
}

.box-75 {
  float: left;
  width: calc(75% - 30px);
  margin-right: 30px;
}
.box-75:last-child {
  margin-right: 0;
}

.box-66 {
  float: left;
  width: calc(66% - 30px);
  margin-right: 30px;
}
.box-66:last-child {
  margin-right: 0;
}

.box-50 {
  float: left;
  width: calc(50% - 30px);
  margin-right: 30px;
}
.box-50:last-child {
  margin-right: 0;
}

.box-33 {
  float: left;
  width: calc(33% - 30px);
  margin-right: 30px;
}
.box-33:last-child {
  margin-right: 0;
}

.box-25 {
  float: left;
  width: calc(25% - 30px);
  margin-right: 30px;
}
.box-25:last-child {
  margin-right: 0;
}

html {
  min-width: 758px !important;
  background-color: #f2f4ed;
}

body {
  margin-bottom: 40px;
  font-size: 1em;
  background-color: #f2f4ed;
  color: #222222;
  font-family: Ubuntu-Regular, sans-serif;
}

header {
  position: sticky;
  top: 0;
  left: 0;
  height: 120px;
  background-color: #ffffff;
  z-index: 1000;
}

main {
  padding: 20px 10px;
  min-width: 1300px;
}

.content-block {
  padding: 20px;
  border-radius: 8px;
  background-color: #cccccc;
}

h1 {
  font-size: 2.1em;
  color: #222222;
  font-weight: bold;
}

h2 {
  font-size: 1.8em;
  padding: 0;
  margin: 0;
  color: #222222;
}

.header-line {
  display: block;
  margin-top: 10px;
  width: 300px;
  height: 1px;
  border-top: 1px solid #555555;
}

.bold-text {
  font-weight: bold;
  font-size: 1.2em;
}

.icon-en {
  background-image: url("./images/icon-en.png");
  background-repeat: no-repeat;
}

.icon-en-big {
  background-image: url("./images/icon-en.png");
  background-repeat: no-repeat;
}

.icon-ga {
  background-image: url("./images/icon-ga.png");
  background-repeat: no-repeat;
}

.icon-ga-big {
  background-image: url("./images/icon-ga.png");
  background-repeat: no-repeat;
}

.icon-mo {
  background-image: url("./images/icon-mo.png");
  background-repeat: no-repeat;
}

.icon-mo-big {
  background-image: url("./images/icon-mo.png");
  background-repeat: no-repeat;
}

.icon-va {
  background-image: url("./images/icon-va.png");
  background-repeat: no-repeat;
}

.icon-va-big {
  background-image: url("./images/icon-va.png");
  background-repeat: no-repeat;
}

.icon-house {
  width: 30px;
  height: 30px;
  background-position-x: left;
  background-position-y: top;
  margin-right: 20px;
  background-image: url("./images/icon-house.png");
  background-repeat: no-repeat;
}

.icon-sepa {
  width: 30px;
  height: 30px;
  background-position-x: left;
  background-position-y: top;
  margin-right: 20px;
  background-image: url("./images/icon-sepa.png");
  background-repeat: no-repeat;
}

.icon-service {
  width: 35px;
  height: 35px;
  background-position-x: left;
  background-position-y: top;
  background-image: url("./images/icon-service.png");
  background-repeat: no-repeat;
  margin: 0 auto;
}

#banner {
  background-size: 100%;
  height: 120px;
  background-image: url("./images/nowenergy-logo.png");
  background-position-x: left;
  background-position-y: -10px;
  background-repeat: no-repeat;
  cursor: pointer;
}

#main-menu {
  padding: 15px;
  height: 120px;
}

#system-info {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #000000;
  z-index: 9999;
}
#system-info .body {
  text-align: center;
  padding: 5px 0;
  color: #ffffff;
}
#system-info .closer {
  position: absolute;
  top: 0;
  right: 0;
  width: 24px;
  height: 100%;
  font-size: 1.2em;
  line-height: 1.6em;
  color: #ffffff;
  cursor: pointer;
}

.container-fluid {
  padding: 30px 50px;
}

.body-container {
  border-radius: 20px;
  margin-bottom: 40px;
  background-color: #ffffff;
}
.body-container .full-size {
  padding: 50px;
}
.body-container .left-side {
  float: left;
  width: calc(100% - 650px);
  padding: 100px 30px 30px 90px;
}
.body-container .left-side .header {
  line-height: 48px;
  font-size: 3em;
  font-family: Ubuntu-Regular, Helvetica, sans-serif;
  font-weight: bold;
}
.body-container .right-side {
  float: left;
  width: 650px;
  min-height: 450px;
  padding: 60px 40px 30px 40px;
  border-radius: 0 20px 20px 0;
  background-color: #e5e5e5;
}
.body-container .right-side .header {
  font-size: 1.1em;
}
.body-container .right-side form {
  padding-right: 100px !important;
}
.body-container .login-bg {
  background: url("./images/bg-image.png") top right no-repeat;
}

.body-left {
  float: left;
  width: calc(50% - 15px);
  padding: 30px 50px;
  border-radius: 20px;
  background-color: #ffffff;
}

.body-right {
  float: right;
  width: calc(50% - 15px);
  padding: 30px 50px;
  border-radius: 20px;
  background-color: #ffffff;
}

.box-rounded {
  border-radius: 16px;
}

.info-box {
  position: relative;
}
.info-box .body {
  position: absolute;
  display: none;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
  border-radius: 10px;
  padding: 5px 10px 15px 10px;
}
.info-box .body .close {
  text-align: center;
  float: right;
  cursor: pointer;
  font-weight: bold;
}
.info-box .toggle {
  cursor: pointer;
  text-decoration: underline;
}

.date-info {
  font-size: 0.7em;
}

.exception-title {
  font-size: 1.5em;
  padding: 15px 50px;
}

.exception-body {
  font-size: 1em;
  padding: 15px 50px;
}
.exception-body .info {
  font-size: 1.2em;
}

.pass-hint-position {
  top: -60px;
  left: 30px;
  background-color: #ffffff;
}

.category-box {
  width: calc(50% - 15px);
  padding: 30px 50px;
  border-radius: 20px;
  cursor: pointer;
}
.category-box .category-box-icon {
  float: left;
  height: 80px;
  width: 80px;
  background-repeat: no-repeat;
}
.category-box .icon-active {
  background-image: url("./images/active.svg");
}
.category-box .icon-pending {
  background-image: url("./images/pending.svg");
}
.category-box .category-box-info {
  float: left;
  padding-left: 30px;
  line-height: 80px;
}
.category-box .category-box-indicator {
  float: right;
  font-size: 2.6em;
  line-height: 80px;
  font-weight: bold;
}

.box-finished {
  float: left;
  background-color: #41ad49;
}
.box-finished .category-box-info {
  color: #fefefe;
}

.box-pending {
  float: right;
  background-color: #f2f4ed;
}

#open-orders {
  display: none;
}

#contracts {
  display: none;
}

.no-entities {
  padding: 30px 0;
  font-size: 1.4em;
  text-align: center;
}

.box-contract {
  width: 100%;
  padding: 20px 30px;
  border-radius: 20px;
  height: fit-content;
  background-color: #f2f4ed;
}
.box-contract .contract-infos {
  float: left;
  width: calc(100% - 700px);
}
.box-contract .contract-infos .card-icon {
  float: left;
  width: 100px;
  padding-top: 90px;
}
.box-contract .contract-infos .contract-info {
  float: left;
  width: calc(100% - 100px);
  padding-left: 30px;
}
.box-contract .contract-infos .contract-info .title {
  color: #666666;
  font-size: 0.8em;
  font-style: italic;
}
.box-contract .contract-infos .contract-info .value {
  color: #333333;
  font-size: 1em;
}
.box-contract .contract-status {
  float: right;
  width: 400px;
  padding-left: 30px;
  margin-right: 150px;
}
.box-contract .contract-status > ul {
  border-left: 1px solid #000000;
  list-style: none;
  margin: 0;
}
.box-contract .contract-status > ul > li {
  position: relative;
  left: -47px;
  margin-bottom: 30px;
}
.box-contract .contract-status > ul > li:before {
  display: inline-block;
  width: 30px;
  height: 30px;
  border: 1px solid #000000;
  border-radius: 15px;
  background-color: #f2f4ed;
  margin-right: 10px;
  color: #f2f4ed;
  font-size: 1.2em;
  text-align: center;
  content: "✔";
}
.box-contract .contract-status > ul > li.checked::before {
  color: #333333;
}
.box-contract .contract-status > ul > li:last-child {
  margin-bottom: 0;
}
.box-contract .contract-status .storno-icon {
  height: 46px;
  width: 46px;
  margin: 88px auto 10px auto;
  border: 2px solid #555555;
  border-radius: 23px;
  background-image: url("./images/canceled.png");
  background-position: 6px 6px;
  background-repeat: no-repeat;
}
.box-contract .contract-status .storno-text {
  text-align: center;
  font-size: 1.2em;
  color: #f16868;
}
.box-contract .contract-status .delivery-icon {
  height: 46px;
  width: 46px;
  margin: 88px auto 10px auto;
  border: 2px solid #555555;
  border-radius: 23px;
  background-image: url("./images/ok.png");
  background-position: 7px 8px;
  background-repeat: no-repeat;
}
.box-contract .contract-status .delivery-text {
  text-align: center;
  font-size: 1.2em;
  color: #5fb965;
}
.box-contract .contract-options {
  float: right;
  width: 150px;
  padding-top: 105px;
}

.contract-header {
  background-color: #ffffff;
  height: 154px;
  border-radius: 20px;
}
.contract-header .header-icon {
  float: left;
  width: 120px;
  padding-top: 35px;
  padding-left: 30px;
}
.contract-header .header-infos {
  float: left;
  padding: 50px 10px;
  width: calc(100% - 530px);
  font-size: 2em;
}
.contract-header .header-image {
  float: left;
  width: 410px;
  height: 154px;
  background-image: url("./images/bg-title.png");
  background-position-x: right;
  background-position-y: top;
  background-repeat: no-repeat;
  background-size: auto 154px;
}

.invoice-container .invoice-entry {
  padding: 20px 0;
  border-bottom: 1px solid #555555;
}
.invoice-container .invoice-entry .col-infos {
  float: left;
  width: calc(100% - 280px);
  font-size: 0.8em;
}
.invoice-container .invoice-entry .col-infos .col-type {
  font-size: 1.2em;
  font-weight: bold;
}
.invoice-container .invoice-entry .col-infos .col-date {
  float: left;
  width: 100%;
}
.invoice-container .invoice-entry .col-status {
  float: left;
  width: 120px;
  padding-top: 10px;
}
.invoice-container .invoice-entry .col-options {
  float: left;
  width: 160px;
  padding-top: 1px;
}

.user-info-box {
  font-size: 0.9em;
}
.user-info-box .col-title {
  float: left;
  width: 160px;
}
.user-info-box .col-value {
  float: left;
  width: calc(100% - 160px);
}

.arrow-link {
  font-size: 2em;
  font-weight: bold;
  line-height: 0.9em;
  padding: 0 5px;
}

.service-container .service-info {
  width: calc(100% - 430px);
  float: left;
}
.service-container .services-box {
  width: 400px;
  margin-left: 30px;
  float: left;
}
.service-container .services-box .service-body {
  background-color: #f2f4ed;
  min-width: 340px;
}
.service-container .services-box .service-body .icon {
  float: left;
  margin-left: 30px;
}
.service-container .services-box .service-body .button {
  float: right;
}

.type-filter {
  color: white !important;
  background-color: #b7b7b7 !important;
}

.type-filter-selected {
  color: white !important;
  background-color: black !important;
}

#client-files {
  margin-top: 30px;
}
#client-files .row {
  padding: 15px 0;
  margin: 0;
  border-bottom: 1px solid black;
}
#client-files .file-title {
  font-weight: bold;
}
#client-files .file-infos {
  margin-top: 3px;
  font-size: 0.8em;
}