/*---------- mixins ---------- */
/*---------- base ---------- */
/*
 * basis css app file
 * subjects ->

 ---------- basis ----------
 ---------- message ----------
 ---------- navbar ----------

 */
/* ---------- basis ---------- */
:root {
  --dark-blue: #071430;
  --kobalt-blue: #0367a6;
  --light-blue: #27324A;
  --dark-grey: #707070;
  --light-grey: #C7C7C7;
  --light-orange: #ee8216;
  --dark-orange: #dd5905;
  --success: #a9c3eb;
}

[contenteditable=true]:empty:before {
  content: attr(placeholder);
  pointer-events: none;
  display: block;
  /* For Firefox */
}

* {
  margin: 0;
  padding: 0;
  letter-spacing: 1px;
  font-family: "Trebuchet MS", serif;
  font-style: normal;
  font-weight: normal;
  color: white;
}

[tooltip]:hover {
  position: relative;
  overflow: visible;
}

[tooltip]:hover::before {
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translate(-50%);
  content: attr(tooltip);
  position: absolute;
  font-size: 18px;
  color: white;
  background-color: #ee8216;
  padding: 2px 5px;
  border-radius: 5px;
  overflow: visible !important;
  width: fit-content;
}

.fold .nav__link[navtip]:hover {
  position: relative;
  overflow: visible;
}

.fold .nav__link[navtip]:hover::before {
  opacity: 1 !important;
}

.fold .nav__button[navtip]:hover {
  position: relative;
  overflow: visible;
}

.fold .nav__button[navtip]:hover::before {
  opacity: 1 !important;
  background-color: white;
  color: #27324A;
}

[navtip]:hover::before {
  top: 50%;
  transform: translate(calc(100% + 10px), -50%) scale(1);
  content: attr(navtip);
  height: auto;
  line-height: 20px;
  position: absolute;
  font-size: 20px;
  color: white;
  right: 0;
  background-color: #ee8216;
  padding: 10px;
  border-radius: 5px;
  overflow: hidden !important;
  opacity: 0;
  transition: all 1s 1s ease-in-out;
}

img {
  pointer-events: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* standard element styles */
input {
  height: 50px;
  padding-left: 10px;
  background-color: white;
  color: #071430;
  border: none;
  border-radius: 8px;
  font-size: 25px;
  width: calc(100% - 10px);
}

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

input:focus, textarea:focus {
  outline: none;
}

body {
  background-color: #071430;
  display: flex;
  /*  padding-left: 300px;*/
}

main {
  height: 100vh;
  width: 100%;
}

body.fold #work-window {
  margin-left: 60px;
}

main#work-window {
  margin-left: 300px;
}

.work-window--file {
  overflow: hidden;
}

a {
  text-decoration: none;
}

.float-right {
  float: right;
}

.display-none {
  display: none;
}

.hidden {
  display: none !important;
}

.checkbox-delete {
  padding-left: 40px;
  line-height: 40px;
  color: white;
}

.checkbox-delete {
  width: 40px;
  height: 40px;
  background: url(/media/trash.svg) no-repeat;
}

.checkbox-icon__input:checked ~ .checkbox-icon__icon {
  background: url(/media/trashed.svg) no-repeat;
}

button.btn--popup {
  min-width: 150px;
  float: right;
  font-size: 20px !important;
  height: 40px !important;
}

*::selection {
  background: #0367a6;
}

.notice {
  box-shadow: inset 0 0 0 10px red;
  border-radius: 8px 0 8px 8px !important;
  position: relative;
  /*  * {
      border-radius: inherit;
    }*/
}
.notice.notice-item {
  margin-top: 35px;
  border-radius: 0 8px 8px 8px !important;
}
.notice--warning {
  border-color: #ee8216;
}
.notice--warning:after {
  content: attr(warning) !important;
  background-color: #ee8216 !important;
}
.notice.notice-item::after {
  content: "Select at least 1 item!";
  left: -2px;
  right: initial;
}
.notice::after {
  color: white;
  content: attr(message);
  background-color: red;
  line-height: 23px;
  height: fit-content;
  box-sizing: border-box;
  font-size: 20px;
  position: absolute;
  top: -29px;
  right: 0;
  border-radius: 5px 5px 0 0;
  padding: 3px;
  z-index: 1;
  /* font-weight: bold;*/
}

.input__field.notice::after {
  top: initial;
  bottom: 40px !important;
}

.center-card__content {
  white-space: pre-line;
  line-height: 20px;
  height: 20px;
}

#loader .popup-card {
  height: 20px;
}

.hidden {
  display: none;
}

.switch .case {
  display: none;
}
.switch .case.active {
  display: flex;
  flex-direction: column;
}

input[disabled] {
  pointer-events: none;
}

#showMessage .popup-card {
  height: auto;
}

/* Chrome, Safari, Edge, Opera */
input[name=UnitPrice]::-webkit-outer-spin-button,
input[name=UnitPrice]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[name=UnitPrice] {
  -moz-appearance: textfield;
}

input[name=UnitCostPrice]::-webkit-outer-spin-button,
input[name=UnitCostPrice]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[name=UnitCostPrice] {
  -moz-appearance: textfield;
}

/*---------- components ---------- */
button {
  border: none;
}

button.btn {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 50px;
  background-color: #ee8216;
  color: #27324A;
  border: none;
  border-radius: 8px;
  font-size: 25px;
  font-weight: bold;
  position: relative;
  transition: all 0.2s ease-in-out;
  overflow: hidden;
  /*    border: 4px solid $dark-blue;*/
  padding: 0 20px;
  cursor: pointer;
}
button.btn--small {
  border-radius: 5px;
  padding: 7px 20px;
  font-size: 20px;
  font-weight: normal;
  height: inherit;
  float: right;
}

button.btn:hover {
  background-color: white;
  color: #27324A;
}

button.btn--dark-blue {
  background-color: #071430;
  color: white;
}

/*button .before {
  z-index: 1;
  content:'';
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 50%;
  background:white;
  transition: all 1s ease-in-out;
  background-repeat: repeat;

}

button .after {
  z-index: 1;
  content:'';
  position: absolute;
  top: 0px;
  right: 0px;
  height: 100%;
  width: 50%;
  background: white;
  transition: all 1s ease-in-out;
  background-repeat: repeat;

}*/
/*button .content{
  position: relative;
  z-index: 2;
  color: $dark-blue;
  text-shadow: 0 0 2px #fff; !* Firefox 3.5+, Opera 9+, Safari 1+, Chrome, IE10 *!
  filter: progid:DXImageTransform.Microsoft.Glow(Color=#ffffff,Strength=1);

}*/
/*
button:hover .before{
  transform: translate(-100%,0);
}

button:hover .after{
  transform: translate(100%,0);
}
*/
button:active {
  transform: scale(0.96);
}

button[disabled]::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.5;
  border-radius: inherit;
  background-color: #071430;
}

button[disabled]:hover {
  background-color: #ee8216 !important;
  color: #27324A !important;
}

/*
button:focus {
    animation: shrink-in-out 1s linear 1;
}

@keyframes shrink-in-out {
    0%   {transform: scale(1);}
    50%  {transform: scale(0.9);}
    100% {transform: scale(1);}
}
*/
/*
.btn {
    height: 50px;
    background-color: $dark-blue;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 25px;
    font-weight: bold;
    position: relative;
    transition: all 0.2s ease-in-out;
    text-align: left;
    padding: 10px;
    width: 50px
}

.btn svg{
    content:'';
    !*
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' id='Bold' viewBox='0 0 24 24' fill='white' %3E%3Cpath d='M19.122,18.394l3.919-3.919a3.585,3.585,0,0,0,0-4.95L19.122,5.606A1.5,1.5,0,0,0,17,7.727l2.78,2.781-18.25.023a1.5,1.5,0,0,0-1.5,1.5v0a1.5,1.5,0,0,0,1.5,1.5l18.231-.023L17,16.273a1.5,1.5,0,0,0,2.121,2.121Z'/%3E%3C/svg%3E%0A");
    *!

    height: 20px;
    width: 100%;
}

.btn:hover{
    width: 100%;
!*    transform: translate(-3px,-3px);*!
!*    background-color: white;
    color: $dark-blue;*!
!*    -webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.75);
    box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.75);*!
}
*/
.icon-button {
  position: relative;
  background-color: transparent;
  width: 40px;
  padding: 0;
  cursor: pointer;
  height: 40px;
  -webkit-transition: all 0.2s 0s ease-in-out;
  -moz-transition: all 0.2s 0s ease-in-out;
  -o-transition: all 0.2s 0s ease-in-out;
  transition: all 0.2s 0s ease-in-out;
  /*&:before {
      display: none;
    }*/
}
.icon-button:hover {
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  transform: scale(0.8);
}
.icon-button__icon {
  background: url(/media/edit-user.svg) no-repeat;
  position: absolute;
  width: 40px;
  height: 40px;
  top: 0;
  left: 0;
}
.icon-button__icon--close {
  background: url(/media/cross-circle.svg) no-repeat;
}

.actions__icon {
  background: url(/media/actions.svg) no-repeat;
}

.edit__icon {
  background: url(/media/edit.svg) no-repeat;
}

.accept__icon {
  background: url(/media/accept.svg) no-repeat;
}

.reject__icon {
  background: url(/media/reject.svg) no-repeat;
}

.configuration__icon {
  background: url(/media/mini-configuration.svg) no-repeat;
}

.details__icon {
  background: url(/media/details.svg) no-repeat;
}

.copy__icon {
  background: url(/media/copy.svg) no-repeat;
}

.redirect__icon {
  background: url(/media/share.svg) no-repeat;
}

.search__icon {
  background: url(/media/search--white.svg) no-repeat;
}

/*the dropdown*/
.dropdown {
  display: inline-block;
  position: relative;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* the text of the dropdown */
.dropdown__title {
  background: #ffffff;
  box-sizing: border-box;
  cursor: pointer;
  position: relative;
  text-align: left;
  width: 100%;
  color: #071430;
  height: 40px;
  border-radius: 8px;
  line-height: 20px;
  font-size: 25px;
  padding: 10px;
}
.dropdown__title.has-footer {
  font-size: 18px;
  display: flex;
  flex-direction: column;
  padding: 0 10px 0 10px;
}
.dropdown__title.has-footer .dropdown-title__footer {
  font-size: 16px;
  color: #dd5905;
}

/* the icon of the dropdown */
.dropdown__title:after {
  content: "";
  height: 30px;
  width: 30px;
  position: absolute;
  top: 5px;
  right: 10px;
  background: url(/media/caret-down.svg) no-repeat;
}

/* the content of the dropdown */
.dropdown__items {
  box-sizing: border-box;
  display: none;
  height: 0;
  list-style: none;
  margin: 0;
  opacity: 0;
  position: absolute;
  transition: 0.2s linear;
  width: 100%;
  background-color: white;
  border-radius: 8px;
  max-height: 500px;
  overflow-y: auto;
}
.dropdown__items .dropdown-item.has-footer {
  font-size: 18px;
}
.dropdown__items .dropdown-item__footer {
  font-size: 16px;
  color: #dd5905;
}

/* check if the content is visible */
.dropdown__items.is-open {
  display: block;
  height: auto;
  opacity: 1;
  z-index: 10;
}

/* the individual items of the dropdown */
.dropdown__items li {
  background-color: white;
  cursor: pointer;
  padding: 10px;
  font-size: 20px;
  color: #071430;
  display: flex;
  flex-direction: column;
}

/* when a individual item is hovered*/
.dropdown__items li:hover {
  background-color: #27324A;
  color: white;
}

/* when a individual item gets clicked */
.dropdown__items li.is-selected {
  background-color: #27324A;
  color: white;
}

/* a groep of items */
.dropdown__items-groep {
  border-bottom: 1px solid #a5a5a5;
  color: #a5a5a5;
  cursor: default;
  text-align: center;
}

.dropdown__items::-webkit-scrollbar {
  width: 15px;
}

.dropdown__items::-webkit-scrollbar-thumb {
  background-color: #27324A;
  background-clip: padding-box;
  border-radius: 8px;
  border: 2px solid transparent;
}

.toggle {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 40px;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.toggle__toggle:before {
  position: absolute;
  content: "";
  height: 30px;
  width: 30px;
  top: 5px;
  left: 5px;
  background-color: #27324A;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50px;
}
.toggle__toggle {
  position: absolute;
  cursor: pointer;
  width: 60px;
  height: 40px;
  background-color: #071430;
  border-radius: 50px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.toggle .toggle__input {
  opacity: 0;
  width: 0;
  height: 0;
}
.toggle__input:checked ~ .toggle__toggle:before {
  -webkit-transform: translateX(20px);
  -ms-transform: translateX(20px);
  transform: translateX(20px);
  background-color: white;
}
.toggle__input:checked ~ .toggle__toggle {
  background-color: #071430;
}

.checkbox-icon {
  display: block;
  position: relative;
  padding-left: 40px;
  cursor: pointer;
  line-height: 40px;
  color: white;
  margin-top: 30px;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.checkbox-icon__icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  display: block;
}
.checkbox-icon__actual {
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.checkbox-icon__input {
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.checkbox-icon__input:checked ~ .checkbox-icon__icon {
  background: url(/media/trashed.svg) no-repeat;
}
.checkbox-icon__actual:checked ~ .checkbox-icon__icon {
  background: url(/media/trashed.svg) no-repeat;
}

.checkbox-icon--delete .checkbox-icon__icon {
  background: url(/media/trash.svg);
}
.checkbox-icon--delete .checkbox-icon__input:checked ~ .checkbox-icon__icon {
  background: url(/media/trashed.svg) no-repeat;
}

.checkbox-icon--duplicate .checkbox-icon__icon {
  background: url(/media/duplicate.svg);
}
.checkbox-icon--duplicate .checkbox-icon__input:checked ~ .checkbox-icon__icon {
  background: url(/media/duplicate.svg) no-repeat;
}

.checkbox-icon--locked .checkbox-icon__icon {
  background: url(/media/unlock.svg);
}
.checkbox-icon--locked .checkbox-icon__input:checked ~ .checkbox-icon__icon {
  background: url(/media/padlock.svg) no-repeat;
}

.checkbox-icon--required .checkbox-icon__icon {
  background: url(/media/required.svg) no-repeat;
}
.checkbox-icon--required .dark-blue.checkbox-icon__icon {
  background: url(/media/required--dark-blue.svg) no-repeat;
}
.checkbox-icon--required .checkbox-icon__input:checked ~ .checkbox-icon__icon {
  background: url(/media/required--active.svg) no-repeat;
}

.checkbox-icon--validation .checkbox-icon__icon {
  background: url(/media/validation.svg) no-repeat;
}
.checkbox-icon--validation .dark-blue.checkbox-icon__icon {
  background: url(/media/validation--dark-blue.svg) no-repeat;
}
.checkbox-icon--validation .checkbox-icon__input:checked ~ .checkbox-icon__icon {
  background: url(/media/validation--active.svg) no-repeat;
}

.checkbox-icon--numeric .checkbox-icon__icon {
  background: url(/media/numeric.svg) no-repeat;
}
.checkbox-icon--numeric .dark-blue.checkbox-icon__icon {
  background: url(/media/numeric--dark-blue.svg) no-repeat;
}
.checkbox-icon--numeric .checkbox-icon__input:checked ~ .checkbox-icon__icon {
  background: url(/media/numeric--active.svg) no-repeat;
}

.popup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  z-index: 99;
}
.popup--hidden {
  display: none;
}
.popup--visible {
  display: flex;
}
.popup__close {
  width: 25px;
  height: 25px;
}
.popup__close .icon-button__icon {
  width: 25px;
  height: 25px;
}
.popup__layer {
  width: 100%;
  height: 100%;
  background-color: rgba(7, 20, 48, 0.8);
  position: absolute;
  cursor: pointer;
}
.popup .popup-card tbody.sortable__body {
  max-height: 350px;
}

.popup-card {
  cursor: initial;
  width: 450px;
  height: 450px;
  background-color: #27324A;
  border-radius: 15px;
  padding: 25px;
  position: relative;
  z-index: 2;
}
.popup-card__header {
  display: flex;
  justify-content: space-between;
}
.popup-card__title {
  font-size: 20px;
}
.popup-card__content {
  height: 100%;
  width: 100%;
}
.popup-card__footer {
  margin-top: 15px;
}

.checkbox {
  display: block;
  position: relative;
  padding: 0 40px 0 50px;
  height: 40px;
  line-height: 40px;
  cursor: pointer;
  font-size: 20px;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.checkbox--small {
  height: 30px;
  line-height: 30px;
}
.checkbox--small .checkbox__mark {
  height: 30px;
  width: 30px;
}
.checkbox--small span.checkbox__mark:after {
  width: 23px;
  height: 23px;
  margin: 4px;
}

.checkbox .checkbox__actual {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.checkbox__mark {
  position: absolute;
  top: 0;
  left: 0;
  height: 40px;
  width: 40px;
  border-radius: 8px;
  background-color: white;
}

.checkbox .checkbox__actual:checked ~ .checkbox__mark {
  background-color: white;
}

.checkbox__mark:after {
  content: "";
  position: absolute;
  display: none;
}

.checkbox__mark:before {
  content: "";
  position: absolute;
  display: block;
}

.checkbox .checkbox__actual:checked ~ .checkbox__mark:before {
  display: none;
}

.checkbox .checkbox__actual:checked ~ .checkbox__mark:after {
  display: block;
}

.checkbox .checkbox__mark:after {
  width: 30px;
  height: 30px;
  margin: 5px;
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' fill='%23071430' viewBox='0 0 352.62 352.62' style='enable-background:new 0 0 352.62 352.62;' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M337.222,22.952c-15.912-8.568-33.66,7.956-44.064,17.748c-23.867,23.256-44.063,50.184-66.708,74.664 c-25.092,26.928-48.348,53.856-74.052,80.173c-14.688,14.688-30.6,30.6-40.392,48.96c-22.032-21.421-41.004-44.677-65.484-63.648 c-17.748-13.464-47.124-23.256-46.512,9.18c1.224,42.229,38.556,87.517,66.096,116.28c11.628,12.24,26.928,25.092,44.676,25.704 c21.42,1.224,43.452-24.48,56.304-38.556c22.645-24.48,41.005-52.021,61.812-77.112c26.928-33.048,54.468-65.485,80.784-99.145 C326.206,96.392,378.226,44.983,337.222,22.952z M26.937,187.581c-0.612,0-1.224,0-2.448,0.611 c-2.448-0.611-4.284-1.224-6.732-2.448l0,0C19.593,184.52,22.653,185.132,26.937,187.581z'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.checkbox .checkbox__mark:before {
  width: 30px;
  height: 30px;
  margin: 5px;
}

/* scrolbar*/
.test-scrolbar {
  margin-top: 1200px;
}

::-webkit-scrollbar {
  width: 15px;
}

::-webkit-scrollbar-thumb {
  background-color: #ee8216;
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  /*  background-color: #913c11;*/
}

::-webkit-scrollbar-track {
  background-color: #27324A;
}

.thin-scrollbar *::-webkit-scrollbar {
  width: 15px;
}

.thin-scrollbar *::-webkit-scrollbar-thumb {
  background-color: #ee8216;
  background-clip: padding-box;
  border: 4px solid rgba(0, 0, 0, 0);
  border-radius: 999px;
  width: 5px;
}

.thin-scrollbar *::-webkit-scrollbar-track {
  background-color: transparent;
  width: 15px;
}

.thin-scrollbar::-webkit-scrollbar {
  width: 15px;
}

.thin-scrollbar::-webkit-scrollbar-thumb {
  background-color: #ee8216;
  background-clip: padding-box;
  border: 4px solid rgba(0, 0, 0, 0);
  border-radius: 999px;
  width: 5px;
}

.thin-scrollbar::-webkit-scrollbar-track {
  background-color: transparent;
  width: 15px;
}

/* Buttons */
/*::-webkit-scrollbar-button:single-button {
    height: 15px;
}*/
/* Up */
/*::-webkit-scrollbar-button:single-button:vertical:decrement {
    background-image: url(../img/up-arrow.svg);
    background-repeat: no-repeat;
}

::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
    background-image: url(../img/up-arrow-hover.svg);
    background-repeat: no-repeat;
}*/
/* Down */
/*
::-webkit-scrollbar-button:single-button:vertical:increment {
    background: url(../img/down-arrow.svg);
    background-repeat: no-repeat;
}

::-webkit-scrollbar-button:vertical:single-button:increment:hover {
    background: url(../img/down-arrow-hover.svg);
    background-repeat: no-repeat;
}*/
/* ---------- navbar ---------- */
.nav__profile .profile-foto {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background-color: white;
  margin: 0 10px;
  overflow: hidden;
}
.nav__profile .profile-foto img {
  width: auto;
  height: calc(100% + 2px);
}

.nav {
  min-height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  width: 300px;
  background-color: #27324A;
  z-index: 98;
}
.nav.fold {
  width: 60px;
}
.nav__logo {
  padding: 10px 50px;
  height: 130px;
  width: 300px;
  box-sizing: border-box;
}
.nav.fold .nav__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0 5px;
  width: 50px;
  height: 50px;
}
.nav.fold .nav__logo img {
  width: 40px;
  height: 40px;
}
.nav__logo img {
  height: 100px;
  width: 200px;
  object-fit: scale-down;
  object-position: 50% 50%;
}
.nav.fold .profile-name {
  display: none;
}
.nav.fold .nav__profile {
  height: 40px;
}
.nav.fold .group__list .nav__link {
  padding-left: 5px !important;
}
.nav__profile {
  width: 100%;
  height: 50px;
  padding: 10px 0;
  display: flex;
  flex-direction: row;
}
.nav__profile.current {
  background-color: #ee8216;
}
.nav__profile:hover {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  background-color: #ee8216;
  /*  box-shadow: inset 5px 5px 16px 0px #024169,
    inset -5px -5px 15px 0px #056fb1;*/
}
.nav__link {
  display: flex;
  font-size: 25px;
  line-height: 60px;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.nav__link:hover {
  background-color: #ee8216;
}
.nav__link.current {
  background-color: #ee8216;
}
.nav__button {
  background-color: #ee8216;
  color: #27324A;
  display: flex;
  gap: 5px;
  border: none;
  border-radius: 8px;
  width: calc(100% - 20px);
  height: 40px;
  margin: 10px;
  box-sizing: border-box;
  font-size: 25px;
  line-height: 40px;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: all 0.2s ease-in-out;
}
.nav__button:hover {
  background-color: white;
}
.nav__button:hover .button__text {
  color: #27324A;
}
.nav__button:active {
  transform: scale(0.96);
}
.nav__group .group__list .nav__link {
  padding-left: 20px;
  font-size: 22px;
  line-height: 50px;
}
.nav__group .group__list .link__icon {
  width: 30px;
  height: 30px;
  margin: 10px;
}
.nav.fold .link__text {
  display: none;
}
.nav.fold .button__text {
  display: none;
}
.nav__footer {
  position: absolute;
  bottom: 0;
  display: flex;
  font-size: 25px;
  line-height: 60px;
  width: 100%;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.nav__footer:hover {
  background-color: #ee8216;
}

.link__icon {
  width: 40px;
  height: 40px;
  margin: 10px;
}

.button__icon {
  width: 40px;
  height: 40px;
}

.profile-name {
  font-size: 20px;
}

.link__icon.users-icon {
  background: url(/media/people.svg) no-repeat;
}

.link__icon.projects-icon {
  background: url(/media/projects.svg) no-repeat;
}

.button__icon.config-icon {
  background: url(/media/configuration.svg) no-repeat;
}

.nav__button:hover .button__icon.config-icon {
  background: url(/media/configuration--blue.svg) no-repeat;
}

.link__icon.quotation-icon {
  background: url(/media/quote-request.svg) no-repeat;
}

.link__icon.archive-icon {
  background: url(/media/archive.svg) no-repeat;
}

.link__icon.double-arrow-left-icon {
  background-image: url("data:image/svg+xml,%0A%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 330 330' style='enable-background:new 0 0 330 330;' xml:space='preserve'%3E%3Cg id='XMLID_30_' fill='white'%3E%3Cpath id='XMLID_31_' d='M51.213,165.004L190.607,25.607c5.857-5.858,5.857-15.355-0.001-21.213 c-5.857-5.858-15.355-5.858-21.213,0.001l-150,150.004C16.58,157.211,15,161.026,15,165.004c0,3.979,1.581,7.794,4.394,10.607 l150,149.996C172.322,328.536,176.161,330,180,330s7.678-1.464,10.607-4.394c5.857-5.858,5.857-15.355-0.001-21.213L51.213,165.004 z'/%3E%3Cpath id='XMLID_71_' d='M171.213,165.004L310.607,25.607c5.858-5.858,5.858-15.355,0-21.213 c-5.857-5.858-15.355-5.858-21.213,0.001l-150,150.004c-2.813,2.813-4.393,6.628-4.393,10.606c0,3.979,1.581,7.794,4.394,10.607 l150,149.996C292.322,328.536,296.161,330,300,330c3.839,0,7.678-1.464,10.607-4.394c5.858-5.858,5.858-15.355,0-21.213 L171.213,165.004z'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.link__icon.double-arrow-right-icon {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 330 330' style='enable-background:new 0 0 330 330;' xml:space='preserve' fill='white'%3E%3Cg id='XMLID_27_'%3E%3Cpath id='XMLID_28_' d='M310.607,154.391l-150-149.997c-5.857-5.858-15.355-5.858-21.213,0.001c-5.857,5.858-5.857,15.355,0,21.213 l139.393,139.39L139.394,304.394c-5.857,5.858-5.857,15.355,0,21.213c2.929,2.929,6.768,4.393,10.606,4.393 s7.678-1.464,10.607-4.394l150-150.003c2.813-2.813,4.393-6.628,4.393-10.606C315,161.019,313.42,157.204,310.607,154.391z'/%3E%3Cpath id='XMLID_29_' d='M195.001,164.996c0-3.979-1.581-7.794-4.394-10.607L40.606,4.393c-5.858-5.858-15.355-5.858-21.213,0.001 c-5.857,5.858-5.857,15.355,0.001,21.213l139.394,139.39L19.393,304.394c-5.857,5.858-5.857,15.355,0.001,21.213 C22.322,328.536,26.161,330,30,330s7.678-1.464,10.607-4.394l150.001-150.004C193.42,172.79,195.001,168.974,195.001,164.996z'/%3E%3C/g%3E%3C/svg%3E ");
}

.link__icon.settings-icon {
  background: url(/media/settings.svg) no-repeat;
}

.link__icon.order-icon {
  background: url(/media/order.svg) no-repeat;
}

.link__icon.financial-icon {
  background: url(/media/budget.svg) no-repeat;
}

/* ---------- message ---------- */
.message {
  overflow: hidden;
  margin: 50px;
  position: fixed;
  border-radius: 8px;
  font-size: 25px;
}
.message.positive {
  background-color: #a9c3eb;
  color: #071430 !important;
}
.message.positive::before {
  content: "";
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 286.054 286.054' style='enable-background:new 0 0 286.054 286.054;' xml:space='preserve'%3E%3Cg%3E%3Cpath style='fill:%23071430;' d='M143.031,0C64.027,0,0.004,64.04,0.004,143.027c0,78.996,64.031,143.027,143.027,143.027 c78.987,0,143.018-64.031,143.018-143.027C286.049,64.049,222.018,0,143.031,0z M143.031,259.236 c-64.183,0-116.209-52.026-116.209-116.209S78.857,26.818,143.031,26.818s116.2,52.026,116.2,116.209 S207.206,259.236,143.031,259.236z M199.241,82.187c-6.079-3.629-13.847-1.475-17.342,4.827l-47.959,86.147l-26.71-32.512 c-4.836-5.569-11.263-8.456-17.333-4.827c-6.079,3.638-8.591,12.39-4.657,18.004l37.169,45.241c2.78,3.611,5.953,5.775,9.27,6.392 l0.027,0.054l0.34,0.018c0.751,0.116,11.979,2.19,16.815-6.463l55.048-98.876C207.402,93.879,205.32,85.825,199.241,82.187z'/%3E%3C/g%3E%3C/svg%3E%0A");
  width: 30px;
  height: 30px;
  position: absolute;
  top: 10px;
  left: 10px;
  line-height: 40px;
}
.message.negative {
  background-color: #ee8216;
  color: white;
}
.message.negative:before {
  content: "";
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 286.054 286.054' style='enable-background:new 0 0 286.054 286.054;' xml:space='preserve'%3E%3Cg%3E%3Cpath style='fill:%23fff;' d='M143.027,0C64.04,0,0,64.04,0,143.027c0,78.996,64.04,143.027,143.027,143.027 c78.996,0,143.027-64.022,143.027-143.027C286.054,64.04,222.022,0,143.027,0z M143.027,259.236 c-64.183,0-116.209-52.026-116.209-116.209S78.844,26.818,143.027,26.818s116.209,52.026,116.209,116.209 S207.21,259.236,143.027,259.236z M143.036,62.726c-10.244,0-17.995,5.346-17.995,13.981v79.201c0,8.644,7.75,13.972,17.995,13.972 c9.994,0,17.995-5.551,17.995-13.972V76.707C161.03,68.277,153.03,62.726,143.036,62.726z M143.036,187.723 c-9.842,0-17.852,8.01-17.852,17.86c0,9.833,8.01,17.843,17.852,17.843s17.843-8.01,17.843-17.843 C160.878,195.732,152.878,187.723,143.036,187.723z'/%3E%3C/g%3E%3C/svg%3E%0A");
  width: 30px;
  height: 30px;
  position: absolute;
  top: 10px;
  left: 10px;
  line-height: 40px;
}
.message--active {
  width: calc(100% - 100px);
  min-height: 50px;
  opacity: 1;
  font-size: 25px;
  line-height: 50px;
  box-sizing: border-box;
  padding: 0 10px 0 50px;
  z-index: 100;
  left: 0;
}
.message--hidden {
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}
.message--animation-add {
  animation: popup 2s normal 1;
}
.message--animation-remove {
  animation: remove 2s normal 1;
}
.message.slim {
  margin: 10px 0;
  line-height: 30px;
  padding-left: 30px;
  position: relative;
}
.message.slim:before {
  height: 20px;
  width: 20px;
  top: 5px;
  left: 5px;
}

@keyframes popup {
  0% {
    height: 0;
    width: 0;
    margin: 0 auto;
    padding: 0;
  }
  50% {
    height: 50px;
    width: 0;
    margin: 50px 50%;
    padding: 0;
  }
  100% {
    width: calc(100% - 100px);
    margin-left: 50px;
    padding: 10px;
  }
}
@keyframes remove {
  0% {
    width: calc(100% - 100px);
    height: 50px;
    margin: 50px;
  }
  50% {
    height: 50px;
    width: 0;
    margin: 50px 50%;
  }
  100% {
    width: 0;
    height: 0;
    margin: 0;
  }
}
/*.invalid-feedback{
  position: relative
}*/
/*.invalid-feedback::before {
  content: "";
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 286.054 286.054' style='enable-background:new 0 0 286.054 286.054;' xml:space='preserve'%3E%3Cg%3E%3Cpath style='fill:%23fff;' d='M143.027,0C64.04,0,0,64.04,0,143.027c0,78.996,64.04,143.027,143.027,143.027 c78.996,0,143.027-64.022,143.027-143.027C286.054,64.04,222.022,0,143.027,0z M143.027,259.236 c-64.183,0-116.209-52.026-116.209-116.209S78.844,26.818,143.027,26.818s116.209,52.026,116.209,116.209 S207.21,259.236,143.027,259.236z M143.036,62.726c-10.244,0-17.995,5.346-17.995,13.981v79.201c0,8.644,7.75,13.972,17.995,13.972 c9.994,0,17.995-5.551,17.995-13.972V76.707C161.03,68.277,153.03,62.726,143.036,62.726z M143.036,187.723 c-9.842,0-17.852,8.01-17.852,17.86c0,9.833,8.01,17.843,17.852,17.843s17.843-8.01,17.843-17.843 C160.878,195.732,152.878,187.723,143.036,187.723z'/%3E%3C/g%3E%3C/svg%3E%0A");
  width: 20px;
  height: 20px;
  position: absolute;
  top: 5px;
  left: 5px;
  line-height: 20px;
}

.success-message::before {
  content: "";
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 286.054 286.054' style='enable-background:new 0 0 286.054 286.054;' xml:space='preserve'%3E%3Cg%3E%3Cpath style='fill:white;' d='M143.031,0C64.027,0,0.004,64.04,0.004,143.027c0,78.996,64.031,143.027,143.027,143.027 c78.987,0,143.018-64.031,143.018-143.027C286.049,64.049,222.018,0,143.031,0z M143.031,259.236 c-64.183,0-116.209-52.026-116.209-116.209S78.857,26.818,143.031,26.818s116.2,52.026,116.2,116.209 S207.206,259.236,143.031,259.236z M199.241,82.187c-6.079-3.629-13.847-1.475-17.342,4.827l-47.959,86.147l-26.71-32.512 c-4.836-5.569-11.263-8.456-17.333-4.827c-6.079,3.638-8.591,12.39-4.657,18.004l37.169,45.241c2.78,3.611,5.953,5.775,9.27,6.392 l0.027,0.054l0.34,0.018c0.751,0.116,11.979,2.19,16.815-6.463l55.048-98.876C207.402,93.879,205.32,85.825,199.241,82.187z'/%3E%3C/g%3E%3C/svg%3E%0A");
  width: 20px;
  height: 20px;
  position: absolute;
  top: 5px;
  left: 5px;
  line-height: 20px;
}*/
.bread-crumbs {
  background-color: #27324A;
  height: 60px;
  width: 100%;
  display: flex;
}
.bread-crumbs__item {
  background-color: #071430;
  color: white;
  font-weight: bold;
  font-size: 20px;
  line-height: 30px;
  height: 40px;
  min-width: 40px;
  margin: 10px;
  border-radius: 5px;
  padding: 5px 10px;
  cursor: pointer;
}

.separator-dot {
  margin: 25px 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' width='100%' height='100%' viewBox='0 0 5 5'%3E%3Ccircle id='Ellipse_3' data-name='Ellipse 3' cx='2.5' cy='2.5' r='2.5'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  width: 5px;
  height: 10px;
}

.text__title {
  font-size: 20px;
  line-height: 30px;
}
.text__field input {
  height: 40px;
}

.section {
  padding: 50px 50px 0 50px;
  box-sizing: border-box;
}
.section__title {
  font-size: 25px;
  margin-bottom: 20px;
}
.section__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.section__body {
  padding: 10px;
  border-radius: 8px;
  background-color: #27324A;
  display: flex;
}
.section--hidden {
  display: none;
}

.item {
  padding: 10px;
  border-radius: 8px;
  background-color: #27324A;
  margin-bottom: 20px;
}
.item__header {
  display: flex;
}
.item__header input {
  width: 300px;
  height: 30px;
  margin-left: 20px;
  padding-left: 5px;
}
.item__header .input__field {
  width: 300px;
  height: 30px;
  margin-left: 20px;
  padding-left: 5px;
}
.item__header .input__field input {
  padding: 0;
  margin: 0;
}
.item__checkbox {
  line-height: 30px;
  font-size: 20px;
  font-weight: bold;
  width: 30px;
  height: 30px;
  padding: 0;
}
.item__checkbox .checkbox__mark {
  height: 30px;
  width: 30px;
}
.item__checkbox.checkbox .checkbox__mark:after {
  width: 23px;
  height: 23px;
  margin: 4px;
}
.item .remove-item {
  width: 30px;
  height: 30px;
}
.item .remove-item__icon {
  width: 30px;
  height: 30px;
  background: url(/media/cross-circle.svg) no-repeat;
}
.item__name {
  /*    line-height: 30px;
      font-size: 20px;
      font-weight: bold;*/
}
.item__body {
  margin-top: 10px;
  display: none;
  gap: 10px;
}
.item .select .dropdown {
  min-width: 260px;
  max-width: 400px;
}

.dynamic-item .item__body {
  display: flex;
}

.dimensions {
  font-size: 20px;
}
.dimensions__description {
  line-height: 30px;
}
.dimensions__field {
  display: flex;
  /* Chrome, Safari, Edge, Opera */
  /* Firefox */
}
.dimensions__field input {
  height: 40px;
  width: 60px;
  border-radius: 0;
  text-align: center;
}
.dimensions__field input::-webkit-outer-spin-button,
.dimensions__field input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.dimensions__field input[type=number] {
  -moz-appearance: textfield;
}
.dimensions__field input.first {
  border-radius: 8px 0 0 8px;
}
.dimensions__field .separator {
  line-height: 40px;
  background-color: white;
  color: #071430;
}
.dimensions__field .metric {
  padding-right: 10px;
  line-height: 40px;
  background-color: white;
  border-radius: 0 8px 8px 0;
  color: #071430;
}
.dimensions__field[data-required=true] {
  position: relative;
}
.dimensions__field[data-required=true]::before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg id='Capa_1' enable-background='new 0 0 512 512' fill='red' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='m461.231 322.529-115.232-66.529 115.232-66.529c21.523-12.426 28.897-39.947 16.471-61.471-12.426-21.522-39.946-28.899-61.471-16.471l-115.231 66.529v-133.058c0-24.853-20.147-45-45-45s-45 20.147-45 45v133.058l-115.231-66.529c-21.526-12.427-49.046-5.052-61.472 16.471s-5.052 49.045 16.471 61.471l115.233 66.529-115.232 66.529c-21.523 12.426-28.898 39.948-16.472 61.471 8.335 14.438 23.46 22.508 39.013 22.508 7.633 0 15.372-1.945 22.458-6.037l115.232-66.529v133.058c0 24.853 20.147 45 45 45s45-20.147 45-45v-133.058l115.231 66.529c7.087 4.092 14.823 6.037 22.458 6.037 15.552 0 30.679-8.072 39.013-22.508 12.427-21.523 5.052-49.045-16.471-61.471z'/%3E%3C/g%3E%3C/svg%3E");
  position: absolute;
  width: 10px;
  height: 10px;
  margin: 3px;
  color: red;
  top: 0;
  right: 0;
}

.number {
  font-size: 20px;
}
.number__title {
  line-height: 30px;
}
.number__field {
  display: flex;
  width: auto;
}
.number__field input {
  height: 40px;
  min-width: 60px;
  border-radius: 8px 0 0 8px;
}
.number__field .metric {
  font-size: 20px;
  padding-right: 10px;
  line-height: 40px;
  background-color: white;
  border-radius: 0 8px 8px 0;
  color: #071430;
}

.option {
  font-size: 20px;
  min-width: 100px;
}
.option__description {
  line-height: 30px;
}
.option .checkbox {
  padding: 0;
  margin: 0 auto;
}
.option .checkbox .checkbox__mark {
  max-width: 100%;
  min-width: 100px;
}
.option .checkbox .checkbox__mark:before {
  background-image: url("data:image/svg+xml,%3Csvg id='Laag_1' data-name='Laag 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 203.35 146.41'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%231d1d1b;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M1.86,144.83V0h23.8L69.9,124q-.39-5-.89-12.2c-.33-4.82-.59-9.92-.79-15.27s-.3-10.42-.3-15.18V0H85.18V144.83H61.37l-44-124q.39,4.77.79,12t.7,15.28q.3,8,.3,15.38v81.34Z' transform='translate(-1.86)'/%3E%3Cpath class='cls-1' d='M162.55,146.41q-19.85,0-31.25-11.21t-11.4-30.45v-29q0-19.46,11.4-30.56t31.25-11.11q19.83,0,31.25,11.11t11.4,30.36v29.16q0,19.25-11.4,30.45T162.55,146.41Zm0-15.87q11.7,0,18.25-6.55t6.55-19.24v-29q0-12.71-6.55-19.25T162.55,50Q151,50,144.4,56.54t-6.65,19.25v29q0,12.7,6.65,19.24T162.55,130.54Z' transform='translate(-1.86)'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  height: 20px;
  margin: 10px;
}
.option .checkbox:hover input ~ .checkbox__mark {
  background-image: url("data:image/svg+xml,%3Csvg id='svg10654' viewBox='0 0 6.3499999 6.3500002' fill='%23071430' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'%3E%3Cg id='layer1' transform='translate(0 -290.65)'%3E%3Cpath id='path9559' d='m1.5818147 290.91246a.26460982.26460982 0 0 0 -.1819011.0801l-1.05833327 1.05834a.26460982.26460982 0 0 0 0 .3731l1.05833327 1.05885a.2652852.2652852 0 0 0 .3751686-.37517l-.6051286-.60513h4.1227456v.81029a.26460982.26460982 0 1 0 .5270977 0v-.81029c0-.28858-.2385166-.52968-.5270977-.52968h-4.1253305l.6077135-.6072a.26460982.26460982 0 0 0 -.1932675-.4532zm3.1775824 3.17396a.26460982.26460982 0 0 0 -.1834515.45475l.6071976.60772h-4.124812v-.78703a.26460982.26460982 0 0 0 -.26768417-.26769.26460982.26460982 0 0 0 -.2614824.26769v.78703c0 .28858.2405856.5271.52916657.5271h4.124812l-.6071976.60771a.26460982.26460982 0 1 0 .3731049.37466l1.0583333-1.05834a.26460982.26460982 0 0 0 0-.37516l-1.0583333-1.05834a.26460982.26460982 0 0 0 -.1896534-.0801z' font-variant-ligatures='normal' font-variant-position='normal' font-variant-caps='normal' font-variant-numeric='normal' font-variant-alternates='normal' font-feature-settings='normal' text-indent='0' text-align='start' text-decoration-line='none' text-decoration-style='solid' text-decoration-color='rgb(0,0,0)' text-transform='none' text-orientation='mixed' white-space='normal' shape-padding='0' isolation='auto' mix-blend-mode='normal' solid-color='rgb(0,0,0)' solid-opacity='1' vector-effect='none'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center right 10px;
  background-size: 20px;
}
.option .checkbox .checkbox__mark:after {
  background-image: url("data:image/svg+xml,%3Csvg id='Laag_1' data-name='Laag 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 334.29 146.81'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%231d1d1b;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M43.65,144.83V90.67L0,0H18.45L47.22,59.52C48.8,62.82,50.06,65.64,51,68A44.43,44.43,0,0,1,52.77,73,38,38,0,0,1,54.66,68c1-2.31,2.28-5.13,3.87-8.43L86.7,0h18.45L61.5,90.67v54.16Z'/%3E%3Cpath class='cls-1' d='M171.61,146.81q-12.9,0-22.52-5.16a36.29,36.29,0,0,1-14.88-14.58A44.19,44.19,0,0,1,129,105.15V75.39q0-12.69,5.26-22a36.51,36.51,0,0,1,14.88-14.49q9.61-5.15,22.52-5.15t22.51,5.15A36.51,36.51,0,0,1,209,53.37q5.26,9.33,5.26,22V94.63H146.41v10.52q0,12.9,6.55,19.74t18.65,6.84q10.3,0,16.66-3.67a15.45,15.45,0,0,0,7.74-11h17.85a30.12,30.12,0,0,1-13.39,21.72Q188.88,146.81,171.61,146.81Zm-25.2-65.67H196.8V75.39q0-12.9-6.45-19.84t-18.74-6.94q-12.11,0-18.65,6.94t-6.55,19.84Z'/%3E%3Cpath class='cls-1' d='M287.27,146.41q-16.87,0-27.58-7.73T249,117.45h18.25q0,6.15,5.85,9.62t14.58,3.47H296q10.5,0,15.67-4.26a14.06,14.06,0,0,0,5.16-11.41,13.6,13.6,0,0,0-4.86-11q-4.87-4.06-14-5.46L283.3,96q-16.28-2.77-24-10.31t-7.73-20.84q0-14.88,9.62-22.81t27.67-7.94h7.54q16.67,0,26.69,7.44a23.42,23.42,0,0,1,10,19.74H314.84q0-5.14-5.06-8.23T296,50h-7.54q-9.33,0-14.39,3.87t-5.06,11q0,11.91,16.87,14.68l14.68,2.39q17.65,2.78,25.69,10.31t8,21.83q0,15.08-9.63,23.7t-29.06,8.63Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  width: 100%;
  height: 20px;
  margin: 10px;
}
.option .checkbox .checkbox__actual {
  position: static;
}

.select__description {
  font-size: 20px;
  line-height: 30px;
}

dev-packie-app {
  font-size: 20px;
}
dev-packie-app__title {
  line-height: 30px;
}
dev-packie-app__field input {
  background-color: white;
  color: #071430;
  border-radius: 8px;
  width: 100%;
  box-sizing: border-box;
  font-size: 25px;
  overflow: hidden;
  height: 40px;
  white-space: pre-line;
  padding-right: 10px;
}
dev-packie-app:focus {
  outline: none;
}

.pac-container {
  display: none;
  border-radius: 8px;
  background-color: #fff;
  position: absolute;
  z-index: 2;
  font-size: 20px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
}
.pac-container .pac-item {
  cursor: pointer;
  padding: 2px 5px 2px 25px;
  text-overflow: ellipsis;
  overflow: hidden;
  vertical-align: middle;
  text-align: left;
  border-bottom: 1px solid #e6e6e6;
  color: #071430;
  display: flex;
  white-space: nowrap;
  position: relative;
}
.pac-container .pac-item.query {
  border-top: none;
}
.pac-container .pac-item.selected {
  background-color: rgba(39, 50, 74, 0.5);
}
.pac-container .pac-item .pac-icon {
  width: 20px;
  height: 20px;
  margin-top: 2px;
  margin-right: 5px;
  position: absolute;
  display: inline-block;
  left: 2px;
  vertical-align: top;
  background-image: url(/public/media/location.svg);
  background-size: 20px;
  background-repeat: no-repeat;
}
.pac-container .pac-item .pac-icon.icon--company {
  background-image: url(/public/media/company.svg) !important;
}
.pac-container .pac-item .pac-icon-query {
  background-image: url("/public/media/loupe-orange.svg") !important;
}
.pac-container .pac-item .pac-item-query {
  display: flex;
  text-overflow: ellipsis;
  color: #071430;
}
.pac-container .pac-item .pac-item-query .pac-matched {
  font-weight: bold;
  color: #ee8216;
}
.pac-container .pac-item span {
  color: #27324A;
}
.pac-container .pac-item:hover {
  background-color: rgba(39, 50, 74, 0.5);
}

.pac-item-error {
  border-top: none !important;
}
.pac-item-error .pac-icon {
  background-image: url(/public/media/no-location.svg) !important;
}
.pac-item-error:hover {
  background-color: transparent !important;
}

.pac-logo:after {
  content: "";
  padding: 1px 1px 1px 0;
  height: 18px;
  box-sizing: border-box;
  text-align: right;
  display: block;
  background-position: right;
  background-repeat: no-repeat;
  background-size: 120px 14px;
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='a' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2172.81 303.93'%3E%3Cdefs%3E%3Cstyle%3E.b%7Bfill:%2327324a;%7D.c%7Bisolation:isolate;%7D.d%7Bfill:%234285f4;%7D.e%7Bfill:%23fbbc05;%7D.f%7Bfill:%2334a853;%7D.g%7Bfill:%23ea4335;%7D%3C/style%3E%3C/defs%3E%3Cg%3E%3Cpath class='g' d='M1644.67,159.93c0,43.71-34.19,75.93-76.17,75.93s-76.17-32.22-76.17-75.93,34.2-75.93,76.17-75.93,76.17,31.93,76.17,75.93Zm-33.34,0c0-27.32-19.82-46-42.83-46s-42.82,18.69-42.82,46,19.82,46,42.82,46,42.83-19,42.83-46Z'/%3E%3Cpath class='e' d='M1809,159.93c0,43.71-34.2,75.93-76.17,75.93s-76.17-32.24-76.17-75.93,34.2-75.93,76.17-75.93,76.17,31.93,76.17,75.93Zm-33.35,0c0-27.32-19.82-46-42.82-46s-42.83,18.69-42.83,46,19.82,46,42.83,46,42.82-19,42.82-46h0Z'/%3E%3Cpath class='d' d='M1966.46,88.56V224.93c0,56.08-33.07,79-72.16,79-36.8,0-58.95-24.61-67.31-44.74l29-12.09c5.17,12.36,17.84,26.94,38.24,26.94,25,0,40.53-15.44,40.53-44.5v-10.99h-1.16c-7.46,9.21-21.84,17.25-40,17.25-38,0-72.75-33.07-72.75-75.62s34.78-76.2,72.75-76.2c18.11,0,32.48,8,40,17h1.16v-12.38h31.7v-.04Zm-29.3,71.62c0-26.74-17.84-46.28-40.54-46.28s-42.27,19.54-42.27,46.28,19.27,45.74,42.27,45.74c22.71,0,40.55-19.28,40.55-45.74h-.01Z'/%3E%3Cpath class='f' d='M2018.68,8.66V231.18h-32.52V8.66h32.52Z'/%3E%3Cpath class='g' d='M2145.46,184.93l25.88,17.25c-8.35,12.36-28.48,33.65-63.26,33.65-43.14,0-75.35-33.34-75.35-75.93,0-45.15,32.49-75.93,71.62-75.93s58.67,31.36,65,48.31l3.46,8.62-101.5,42c7.77,15.24,19.85,23,36.8,23s28.75-8.36,37.38-21l-.03,.03Zm-79.66-27.32l67.85-28.18c-3.73-9.48-15-16.09-28.17-16.09-17.02-.03-40.59,14.93-39.73,44.24l.05,.03Z'/%3E%3Cpath class='d' d='M1369.23,140.15v-32.22h108.56c1.12,6.42,1.66,12.92,1.6,19.44,0,24.17-6.6,54.06-27.9,75.35-20.71,21.57-47.17,33.07-82.23,33.07-65,0-119.61-52.92-119.61-117.9S1304.29,0,1369.26,0c36,0,61.56,14.11,80.8,32.49l-22.74,22.73c-13.79-12.94-32.48-23-58.09-23-47.45,0-84.56,38.24-84.56,85.69s37.11,85.69,84.56,85.69c30.78,0,48.3-12.36,59.53-23.59,9.11-9.1,15.1-22.11,17.46-39.88l-76.99,.02Z'/%3E%3C/g%3E%3Cg class='c'%3E%3Cpath class='b' d='M0,205.2V63.89H45.49c13.16,0,23.65,3.77,31.46,11.32,7.81,7.55,11.71,17.65,11.71,30.3s-3.91,22.75-11.71,30.29c-7.81,7.55-18.29,11.32-31.46,11.32H17.42v58.07H0Zm17.42-73.75h28.07c7.61,0,13.71-2.35,18.29-7.07,4.58-4.71,6.87-11,6.87-18.87s-2.29-14.33-6.87-18.97c-4.58-4.65-10.68-6.97-18.29-6.97H17.42v51.88Z'/%3E%3Cpath class='b' d='M156.41,206.75c-12.91,0-23.07-3.64-30.49-10.94-7.42-7.29-11.13-17.2-11.13-29.71v-28.26c0-12.65,3.71-22.58,11.13-29.81,7.42-7.23,17.58-10.84,30.49-10.84s23.07,3.61,30.49,10.84c7.42,7.23,11.13,17.1,11.13,29.62v28.46c0,12.52-3.71,22.43-11.13,29.71-7.42,7.29-17.59,10.94-30.49,10.94Zm0-15.49c7.61,0,13.55-2.13,17.81-6.39s6.39-10.52,6.39-18.78v-28.26c0-8.26-2.13-14.52-6.39-18.78s-10.2-6.39-17.81-6.39-13.39,2.13-17.71,6.39c-4.33,4.26-6.48,10.52-6.48,18.78v28.26c0,8.26,2.16,14.52,6.48,18.78,4.32,4.26,10.23,6.39,17.71,6.39Z'/%3E%3Cpath class='b' d='M238.29,205.2l-17.04-106.47h15.1l10.65,75.5c.39,2.84,.77,5.9,1.16,9.2,.39,3.29,.64,6.03,.77,8.23h.77c.26-2.19,.58-4.94,.97-8.23,.39-3.29,.84-6.36,1.36-9.2l11.81-75.5h17.42l11.81,75.5c.51,2.84,1,5.9,1.45,9.2,.45,3.29,.74,6.03,.87,8.23h.77c.26-2.19,.61-4.94,1.06-8.23,.45-3.29,.87-6.36,1.26-9.2l11.03-75.5h14.32l-17.81,106.47h-19.16l-11.42-73.56c-.52-3.61-1.03-7.23-1.55-10.84-.52-3.61-.9-6.45-1.16-8.52h-.77c-.13,2.07-.42,4.91-.87,8.52-.45,3.61-1,7.23-1.65,10.84l-12,73.56h-19.16Z'/%3E%3Cpath class='b' d='M388.7,207.13c-8.39,0-15.71-1.68-21.97-5.03-6.26-3.35-11.1-8.1-14.52-14.23-3.42-6.13-5.13-13.26-5.13-21.39v-29.04c0-8.26,1.71-15.42,5.13-21.49,3.42-6.06,8.26-10.77,14.52-14.13,6.26-3.35,13.58-5.03,21.97-5.03s15.71,1.68,21.97,5.03c6.26,3.36,11.1,8.07,14.52,14.13,3.42,6.07,5.13,13.23,5.13,21.49v18.78h-66.2v10.26c0,8.39,2.13,14.81,6.39,19.26s10.32,6.68,18.2,6.68c6.71,0,12.13-1.19,16.26-3.58,4.13-2.39,6.65-5.97,7.55-10.74h17.42c-1.16,8.91-5.52,15.97-13.07,21.2-7.55,5.23-16.94,7.84-28.17,7.84Zm-24.58-64.08h49.17v-5.61c0-8.39-2.1-14.84-6.29-19.36-4.2-4.52-10.29-6.78-18.29-6.78s-13.94,2.26-18.2,6.78c-4.26,4.52-6.39,10.97-6.39,19.36v5.61Z'/%3E%3Cpath class='b' d='M467.88,205.2V98.73h17.42v20.33h.19c.9-7.1,3.81-12.58,8.71-16.45,4.9-3.87,11.42-5.81,19.55-5.81,11.1,0,19.94,3.52,26.52,10.55,6.58,7.04,9.87,16.55,9.87,28.55v7.36h-17.42v-5.81c0-8.13-2.07-14.42-6.19-18.87-4.13-4.45-10.13-6.68-18-6.68-15.49,0-23.23,8.52-23.23,25.55v67.75h-17.42Z'/%3E%3Cpath class='b' d='M621,207.13c-8.39,0-15.71-1.68-21.97-5.03-6.26-3.35-11.1-8.1-14.52-14.23-3.42-6.13-5.13-13.26-5.13-21.39v-29.04c0-8.26,1.71-15.42,5.13-21.49,3.42-6.06,8.26-10.77,14.52-14.13,6.26-3.35,13.58-5.03,21.97-5.03s15.71,1.68,21.97,5.03c6.26,3.36,11.1,8.07,14.52,14.13,3.42,6.07,5.13,13.23,5.13,21.49v18.78h-66.2v10.26c0,8.39,2.13,14.81,6.39,19.26s10.32,6.68,18.2,6.68c6.71,0,12.13-1.19,16.26-3.58,4.13-2.39,6.65-5.97,7.55-10.74h17.42c-1.16,8.91-5.52,15.97-13.07,21.2-7.55,5.23-16.94,7.84-28.17,7.84Zm-24.58-64.08h49.17v-5.61c0-8.39-2.1-14.84-6.29-19.36-4.2-4.52-10.29-6.78-18.29-6.78s-13.94,2.26-18.2,6.78c-4.26,4.52-6.39,10.97-6.39,19.36v5.61Z'/%3E%3Cpath class='b' d='M730.95,207.13c-10.58,0-19.13-3.55-25.65-10.65-6.52-7.1-9.78-16.71-9.78-28.84v-31.17c0-12.26,3.22-21.94,9.68-29.04,6.45-7.1,15.03-10.65,25.75-10.65,8,0,14.58,2,19.75,6,5.16,4,8.19,9.42,9.1,16.26h.58l-.39-24.2v-30.97h17.42V205.2h-17.42v-20.33h-.19c-.9,6.97-3.94,12.42-9.1,16.36-5.16,3.94-11.74,5.9-19.75,5.9Zm5.81-15.1c7.23,0,12.9-2.26,17.03-6.78,4.13-4.52,6.19-10.77,6.19-18.78v-29.04c0-8-2.07-14.26-6.19-18.78-4.13-4.52-9.81-6.78-17.03-6.78s-13.16,2.2-17.42,6.58c-4.26,4.39-6.39,10.71-6.39,18.97v29.04c0,8.26,2.13,14.58,6.39,18.97,4.26,4.39,10.07,6.58,17.42,6.58Z'/%3E%3Cpath class='b' d='M929.36,205.2V63.89h40.07c12.9,0,23,3.23,30.29,9.68,7.29,6.46,10.94,15.42,10.94,26.91,0,7.74-1.87,14.23-5.61,19.45-3.74,5.23-8.97,8.75-15.68,10.55,7.61,2.2,13.61,6.36,18,12.49,4.39,6.13,6.58,13.78,6.58,22.94,0,12.13-3.71,21.71-11.13,28.75-7.42,7.04-17.59,10.55-30.49,10.55h-42.97Zm17.04-81.11h22.84c7.48,0,13.39-2,17.71-6,4.32-4,6.49-9.42,6.49-16.26s-2.13-12.26-6.39-16.26c-4.26-4-10.13-6-17.62-6h-23.04v44.52Zm0,65.43h24c8.13,0,14.55-2.16,19.26-6.49,4.71-4.32,7.07-10.23,7.07-17.71s-2.36-14.03-7.07-18.87c-4.71-4.84-11.13-7.26-19.26-7.26h-24v50.33Z'/%3E%3Cpath class='b' d='M1062.16,240.04l15.68-41.43-40.65-99.89h18.97l25.94,65.82c.9,2.2,1.77,4.81,2.61,7.84,.84,3.03,1.51,5.58,2.03,7.65,.51-2.06,1.23-4.61,2.13-7.65,.9-3.03,1.81-5.64,2.71-7.84l24.2-65.82h18.2l-53.62,141.31h-18.2Z'/%3E%3C/g%3E%3C/svg%3E");
}

.date {
  font-size: 20px;
}
.date__title {
  line-height: 30px;
}
.date__field input {
  height: 40px;
}

.datepicker {
  width: min-content;
}
.datepicker:not(.active) {
  display: none;
}

.datepicker-dropdown {
  position: absolute;
  z-index: 20;
  padding-top: 4px;
}
.datepicker-dropdown.datepicker-orient-top {
  padding-top: 0;
  padding-bottom: 4px;
}

.datepicker-picker {
  display: flex;
  flex-direction: column;
  border-radius: 5px;
  background-color: #071430;
}
.datepicker-dropdown .datepicker-picker {
  box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
}

.datepicker-main {
  flex: auto;
  padding: 2px;
}

.datepicker-footer {
  box-shadow: inset 0 1px 1px rgba(10, 10, 10, 0.1);
  background-color: whitesmoke;
}

.datepicker-title {
  box-shadow: inset 0 -1px 1px rgba(10, 10, 10, 0.1);
  background-color: #071430;
  padding: 0.375rem 0.75rem;
  text-align: center;
  font-weight: 700;
}

.datepicker-controls {
  display: flex;
}
.datepicker-header .datepicker-controls {
  padding: 2px 2px 0;
}
.datepicker-controls .button {
  display: inline-flex;
  position: relative;
  align-items: center;
  justify-content: center;
  margin: 0;
  border: 1px solid gainsboro;
  border-radius: 5px;
  box-shadow: none;
  background-color: #27324A;
  cursor: pointer;
  padding: calc(0.375em - 1px) 0.75em;
  height: 2.25em;
  vertical-align: top;
  text-align: center;
  line-height: 1.5;
  white-space: nowrap;
  color: whitesmoke;
  font-size: 1rem;
}
.datepicker-controls .button:focus, .datepicker-controls .button:active {
  outline: none;
}
.datepicker-controls .button:hover {
  border-color: whitesmoke;
  color: whitesmoke;
}
.datepicker-controls .button:focus {
  border-color: #ee8216;
  color: #363636;
}
.datepicker-controls .button:focus:not(:active) {
  box-shadow: 0 0 0 0.125em rgba(238, 130, 22, 0.25);
}
.datepicker-controls .button:active {
  border-color: #474747;
  color: #363636;
}
.datepicker-controls .button[disabled] {
  cursor: not-allowed;
}
.datepicker-header .datepicker-controls .button {
  border-color: transparent;
  font-weight: bold;
}
.datepicker-header .datepicker-controls .button:hover {
  background-color: #ee8216;
}
.datepicker-header .datepicker-controls .button:active {
  background-color: #f2f2f2;
}
.datepicker-footer .datepicker-controls .button {
  flex: auto;
  margin: calc(0.375rem - 1px) 0.375rem;
  border-radius: 2px;
  font-size: 0.75rem;
}
.datepicker-controls .view-switch {
  flex: auto;
}
.datepicker-controls .prev-button,
.datepicker-controls .next-button {
  padding-right: 0.375rem;
  padding-left: 0.375rem;
  flex: 0 0 14.2857142857%;
}
.datepicker-controls .prev-button.disabled,
.datepicker-controls .next-button.disabled {
  visibility: hidden;
}

.datepicker-view,
.datepicker-grid {
  display: flex;
}

.datepicker-view {
  align-items: stretch;
  width: 21rem;
}

.datepicker-grid {
  flex-wrap: wrap;
  flex: auto;
  gap: 2px;
}

.datepicker .days {
  display: flex;
  flex-direction: column;
  flex: auto;
}
.datepicker .days-of-week {
  display: flex;
  gap: 2px;
}
.datepicker .week-numbers {
  display: flex;
  flex-direction: column;
  flex: 0 0 9.6774193548%;
}
.datepicker .weeks {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  flex: auto;
}
.datepicker span {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  cursor: default;
  -webkit-touch-callout: none;
  user-select: none;
}
.datepicker .dow {
  height: 1.5rem;
  font-size: 0.875rem;
  font-weight: 700;
}
.datepicker .week {
  flex: auto;
  color: #b8b8b8;
  font-size: 0.75rem;
}

.datepicker-cell, .datepicker .days .dow {
  flex-basis: calc((100% - 12px) / 7);
}

.datepicker-cell {
  height: 3rem;
  background-color: #27324A;
}
.datepicker-cell:not(.day) {
  flex-basis: 25%;
  height: 6rem;
}
.datepicker-cell:not(.disabled):hover {
  background-color: #ee8216;
  cursor: pointer;
}
.datepicker-cell.focused:not(.selected) {
  background-color: #27324a;
}
.datepicker-cell.selected, .datepicker-cell.selected:hover {
  background-color: #ee8216;
  color: #fff;
  font-weight: 600;
}
.datepicker-cell.disabled {
  color: gainsboro;
  opacity: 0.5;
}
.datepicker-cell.prev:not(.disabled), .datepicker-cell.next:not(.disabled) {
  color: white;
}
.datepicker-cell.prev.selected, .datepicker-cell.next.selected {
  color: #e6e6e6;
}
.datepicker-cell.highlighted:not(.selected):not(.range):not(.today) {
  border-radius: 0;
  background-color: whitesmoke;
}
.datepicker-cell.highlighted:not(.selected):not(.range):not(.today):not(.disabled):hover {
  background-color: #efefef;
}
.datepicker-cell.highlighted:not(.selected):not(.range):not(.today).focused {
  background-color: #27324a;
}
.datepicker-cell.today:not(.selected) {
  background-color: #00d1b2;
}
.datepicker-cell.today:not(.selected):not(.disabled) {
  color: #fff;
}
.datepicker-cell.today.focused:not(.selected) {
  background-color: #00ccad;
}
.datepicker-cell.range-end:not(.selected), .datepicker-cell.range-start:not(.selected) {
  background-color: #b8b8b8;
  color: #fff;
}
.datepicker-cell.range-end.focused:not(.selected), .datepicker-cell.range-start.focused:not(.selected) {
  background-color: #b3b3b3;
}
.datepicker-cell.range-start:not(.range-end) {
  border-radius: 5px 0 0 5px;
}
.datepicker-cell.range-end:not(.range-start) {
  border-radius: 0 5px 5px 0;
}
.datepicker-cell.range {
  border-radius: 0;
  background-color: gainsboro;
}
.datepicker-cell.range:not(.disabled):not(.focused):not(.today):hover {
  background-color: #d7d7d7;
}
.datepicker-cell.range.disabled {
  color: #c6c6c6;
}
.datepicker-cell.range.focused {
  background-color: #d1d1d1;
}

.datepicker-input.in-edit {
  border-color: #e67c11;
}
.datepicker-input.in-edit:focus, .datepicker-input.in-edit:active {
  box-shadow: 0 0 0.25em 0.25em rgba(230, 124, 17, 0.2);
}

.options {
  font-size: 20px;
}
.options__description {
  margin-bottom: 10px;
}
.options__field {
  gap: 10px;
  display: flex;
  width: 100%;
  justify-content: space-between;
}
.options .real-radio {
  display: none;
}
.options .real-radio:checked + label.options__option {
  background-color: #ee8216;
}
.options .options__option {
  cursor: pointer;
  background-color: #071430;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100%;
  border-radius: 8px;
}
.options .options__option:hover {
  background-color: #ee8216;
}
.options--hidden {
  display: none;
}

.selection-slider {
  width: 340px;
  position: relative;
  padding: 8px 0;
}
.selection-slider__option .task {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding: 0;
  height: 24px;
  line-height: 24px;
  font-size: 20px;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.selection-slider__option .task__content {
  min-width: 300px;
  width: 100%;
}
.selection-slider__option .task__actual {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.selection-slider__option .task__mark {
  position: absolute;
  top: 0;
  left: 0;
  height: 12px;
  width: 12px;
  margin: 6px;
  border-radius: 50%;
  background-color: #27324A;
  /*&:after {
    content: "";
    position: absolute;
    display: none;
    margin: 4px;
    width: 12px;
    height: 12px;
    //margin: 5px;
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve' fill='%2327324A'%3E%3Ccircle cx='256' cy='256' r='256'/%3E%3C/svg%3E");

  }

  &:before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    margin: 4px;
    width: 12px;
    height: 12px;

    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve' fill='%2327324A'%3E%3Ccircle cx='256' cy='256' r='256'/%3E%3C/svg%3E");
    //margin: 5px;
  }*/
}
.selection-slider__option .task__mark:hover {
  transform: scale(1.2);
  cursor: pointer;
}
.selection-slider__option .task .task__actual:checked ~ .task__mark {
  background-color: #ee8216;
}
.selection-slider__option .task__content {
  margin-left: 34px;
  white-space: nowrap;
}
.selection-slider__option .task__content .text {
  padding-left: 7px;
}
.selection-slider__option .task__content .notice {
  border: 2px solid red;
  box-shadow: inset 0 0 0 10px white;
  border-radius: 8px 0 8px 8px !important;
  position: relative;
  /*  * {
      border-radius: inherit;
    }*/
}
.selection-slider__option .task__content .notice.notice-item {
  margin-top: 35px;
  border-radius: 0 8px 8px 8px !important;
}
.selection-slider__option .task__content .notice--warning {
  border-color: #ee8216;
}
.selection-slider__option .task__content .notice--warning:after {
  content: attr(warning) !important;
  background-color: #ee8216 !important;
}
.selection-slider__option .task__content .notice.notice-item::after {
  content: "Select at least 1 item!";
  left: -2px;
  right: initial;
}
.selection-slider__option .task__content .notice::after {
  color: white;
  content: attr(message);
  background-color: red;
  line-height: 15px;
  height: 20px;
  box-sizing: border-box;
  font-size: 15px;
  position: absolute;
  top: -20px;
  right: -2px;
  border-radius: 5px 5px 0 0;
  padding: 3px;
  /* font-weight: bold;*/
}
.selection-slider__option .task__content div.address .input__field {
  height: 34px;
}
.selection-slider__option .task__content div.address .input__field input {
  font-size: 20px;
  font-weight: normal;
  background-color: transparent;
  padding: 0 0 0 5px;
  line-height: 30px;
  /* @include transition(background-color, 0.3s, ease-in-out, 0.3s);

   &::placeholder{
     color: white;
   }

   &:hover{
     background-color: $light-blue;
   }

   &:focus{
     background-color: $light-blue;
   }*/
}
.selection-slider__option .task__remove {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' id='Outline' viewBox='0 0 24 24' fill='red' %3E%3Cpath d='M16,8a1,1,0,0,0-1.414,0L12,10.586,9.414,8A1,1,0,0,0,8,9.414L10.586,12,8,14.586A1,1,0,0,0,9.414,16L12,13.414,14.586,16A1,1,0,0,0,16,14.586L13.414,12,16,9.414A1,1,0,0,0,16,8Z'/%3E%3Cpath d='M12,0A12,12,0,1,0,24,12,12.013,12.013,0,0,0,12,0Zm0,22A10,10,0,1,1,22,12,10.011,10.011,0,0,1,12,22Z'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-color: transparent;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-items: center;
  cursor: pointer;
  opacity: 0;
  position: absolute;
  right: 5px;
  -webkit-transition: opacity 0.3s ease-in-out 0s;
  -moz-transition: opacity 0.3s ease-in-out 0s;
  -o-transition: opacity 0.3s ease-in-out 0s;
  transition: opacity 0.3s ease-in-out 0s;
}
.selection-slider__option .task:hover .task__remove {
  opacity: 1;
}
.selection-slider__divider {
  height: 30px;
  width: 100%;
  display: flex;
  flex-direction: row;
}
.selection-slider__content {
  height: auto;
  width: 100%;
  padding: 8px;
  display: flex;
  justify-content: center;
}
.selection-slider__track {
  margin: -6px 10px 0 10px;
  width: 4px;
  height: calc(100% + 12px);
  background-color: #27324A;
}
.selection-slider__controls {
  position: absolute;
  top: 0;
  left: 0;
  width: 24px;
  height: fit-content;
}
.selection-slider__thumb {
  border: 2px solid #ee8216;
  width: 20px;
  height: 20px;
  z-index: 1;
  position: absolute;
  box-sizing: content-box;
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve' fill='%23EE8216FF'%3E%3Ccircle cx='256' cy='256' r='256'/%3E%3C/svg%3E");
  background-size: 12px;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 50%;
  cursor: pointer;
  background-color: #071430;
  -webkit-transition: transform 0.2s ease-in-out 0s;
  -moz-transition: transform 0.2s ease-in-out 0s;
  -o-transition: transform 0.2s ease-in-out 0s;
  transition: transform 0.2s ease-in-out 0s;
}
.selection-slider__thumb:hover {
  z-index: 2;
  transform: scale(1.2);
}
.selection-slider__thumb--active {
  z-index: 2;
  transform: scale(1.2) !important;
  cursor: ns-resize;
}
.selection-slider__thumb[data-thumb=first] {
  top: 0;
}
.selection-slider__thumb[data-thumb=last] {
  bottom: 0;
}
.selection-slider__overlay-track {
  margin: 2px 10px;
  width: 4px;
  height: calc(100% - 4px);
  background-color: #ee8216;
}

.cursor {
  cursor: ns-resize !important;
}

.horizontal-slider {
  width: 100%;
  position: relative;
  padding: 25px 0 0 0;
  height: 24px;
  display: flex;
}
.horizontal-slider__option {
  width: 24px;
}
.horizontal-slider__option.first .task__content {
  left: 0 !important;
  transform: translate(0) !important;
}
.horizontal-slider__option.last .task__content {
  right: 100%;
  transform: translate(-100%);
}
.horizontal-slider__option .task {
  display: flex;
  flex-direction: column;
  position: relative;
  padding: 0;
  height: 24px;
  line-height: 24px;
  font-size: 20px;
  width: 24px;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.horizontal-slider__option .task__actual {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.horizontal-slider__option .task__mark {
  position: absolute;
  left: 0;
  height: 12px;
  width: 12px;
  margin: 6px;
  border-radius: 50%;
  background-color: #27324A;
  /*&:after {
    content: "";
    position: absolute;
    display: none;
    margin: 4px;
    width: 12px;
    height: 12px;
    //margin: 5px;
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve' fill='%2327324A'%3E%3Ccircle cx='256' cy='256' r='256'/%3E%3C/svg%3E");

  }

  &:before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    margin: 4px;
    width: 12px;
    height: 12px;

    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve' fill='%2327324A'%3E%3Ccircle cx='256' cy='256' r='256'/%3E%3C/svg%3E");
    //margin: 5px;
  }*/
}
.horizontal-slider__option .task__mark:hover {
  transform: scale(1.2);
  cursor: pointer;
}
.horizontal-slider__option .task .task__actual:checked ~ .task__mark {
  background-color: #ee8216;
}
.horizontal-slider__option .task__content {
  white-space: nowrap;
  position: absolute;
  top: -24px;
  width: fit-content;
  left: 50%;
  transform: translate(-50%);
}
.horizontal-slider__option .task__content .notice {
  border: 2px solid red;
  box-shadow: inset 0 0 0 10px white;
  border-radius: 8px 0 8px 8px !important;
  position: relative;
  /*  * {
      border-radius: inherit;
    }*/
}
.horizontal-slider__option .task__content .notice.notice-item {
  margin-top: 35px;
  border-radius: 0 8px 8px 8px !important;
}
.horizontal-slider__option .task__content .notice--warning {
  border-color: #ee8216;
}
.horizontal-slider__option .task__content .notice--warning:after {
  content: attr(warning) !important;
  background-color: #ee8216 !important;
}
.horizontal-slider__option .task__content .notice.notice-item::after {
  content: "Select at least 1 item!";
  left: -2px;
  right: initial;
}
.horizontal-slider__option .task__content .notice::after {
  color: white;
  content: attr(message);
  background-color: red;
  line-height: 15px;
  height: 20px;
  box-sizing: border-box;
  font-size: 15px;
  position: absolute;
  top: -20px;
  right: -2px;
  border-radius: 5px 5px 0 0;
  padding: 3px;
  /* font-weight: bold;*/
}
.horizontal-slider__option .task__content div.address .input__field {
  height: 34px;
}
.horizontal-slider__option .task__content div.address .input__field input {
  font-size: 20px;
  font-weight: normal;
  background-color: transparent;
  padding: 0 0 0 5px;
  line-height: 30px;
  /* @include transition(background-color, 0.3s, ease-in-out, 0.3s);

   &::placeholder{
     color: white;
   }

   &:hover{
     background-color: $light-blue;
   }

   &:focus{
     background-color: $light-blue;
   }*/
}
.horizontal-slider__option .task__remove {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' id='Outline' viewBox='0 0 24 24' fill='red' %3E%3Cpath d='M16,8a1,1,0,0,0-1.414,0L12,10.586,9.414,8A1,1,0,0,0,8,9.414L10.586,12,8,14.586A1,1,0,0,0,9.414,16L12,13.414,14.586,16A1,1,0,0,0,16,14.586L13.414,12,16,9.414A1,1,0,0,0,16,8Z'/%3E%3Cpath d='M12,0A12,12,0,1,0,24,12,12.013,12.013,0,0,0,12,0Zm0,22A10,10,0,1,1,22,12,10.011,10.011,0,0,1,12,22Z'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-color: transparent;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-items: center;
  cursor: pointer;
  opacity: 0;
  position: absolute;
  right: 5px;
  -webkit-transition: opacity 0.3s ease-in-out 0s;
  -moz-transition: opacity 0.3s ease-in-out 0s;
  -o-transition: opacity 0.3s ease-in-out 0s;
  transition: opacity 0.3s ease-in-out 0s;
}
.horizontal-slider__option .task:hover .task__remove {
  opacity: 1;
}
.horizontal-slider__divider {
  width: 100%;
}
.horizontal-slider__content {
  width: 100%;
  display: flex;
  justify-content: center;
  position: relative;
}
.horizontal-slider__track {
  margin: 10px 0 10px -6px;
  height: 4px;
  width: calc(100% + 12px);
  background-color: #27324A;
}
.horizontal-slider__controls {
  position: absolute;
  top: 0;
  left: 0;
  width: 24px;
  height: 24px;
}
.horizontal-slider__thumb {
  border: 2px solid #ee8216;
  width: 20px;
  height: 20px;
  z-index: 1;
  position: absolute;
  box-sizing: content-box;
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve' fill='%23EE8216FF'%3E%3Ccircle cx='256' cy='256' r='256'/%3E%3C/svg%3E");
  background-size: 12px;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 50%;
  cursor: pointer;
  background-color: #071430;
  -webkit-transition: transform 0.2s ease-in-out 0s;
  -moz-transition: transform 0.2s ease-in-out 0s;
  -o-transition: transform 0.2s ease-in-out 0s;
  transition: transform 0.2s ease-in-out 0s;
}
.horizontal-slider__thumb:hover {
  z-index: 2;
  transform: scale(1.2);
}
.horizontal-slider__thumb--active {
  z-index: 2;
  transform: scale(1.2) !important;
  cursor: ew-resize;
}
.horizontal-slider__thumb[data-thumb=first] {
  top: 0;
}
.horizontal-slider__thumb[data-thumb=last] {
  right: 0;
  top: 0;
}
.horizontal-slider__overlay-track {
  width: calc(100% - 24px);
  height: 4px;
  margin: 10px 0 10px 12px;
  background-color: #ee8216;
}

.cursor {
  cursor: ew-resize !important;
}

.selector__description {
  font-size: 20px;
  line-height: 30px;
}
.selector__field {
  padding: 2px;
  background-color: white;
  border-radius: 8px;
  height: 40px;
  box-sizing: border-box;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.selector__field input {
  height: auto;
  border-radius: 0;
  padding: 0 10px;
  cursor: pointer;
}
.selector__field .before {
  font-size: 20px;
  padding-left: 10px;
  line-height: 40px;
  color: #071430;
}
.selector__field .after {
  font-size: 20px;
  padding-right: 10px;
  line-height: 40px;
  color: #071430;
}
.selector__field[data-required=true] {
  position: relative;
}
.selector__field[data-required=true]::before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg id='Capa_1' enable-background='new 0 0 512 512' fill='red' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='m461.231 322.529-115.232-66.529 115.232-66.529c21.523-12.426 28.897-39.947 16.471-61.471-12.426-21.522-39.946-28.899-61.471-16.471l-115.231 66.529v-133.058c0-24.853-20.147-45-45-45s-45 20.147-45 45v133.058l-115.231-66.529c-21.526-12.427-49.046-5.052-61.472 16.471s-5.052 49.045 16.471 61.471l115.233 66.529-115.232 66.529c-21.523 12.426-28.898 39.948-16.472 61.471 8.335 14.438 23.46 22.508 39.013 22.508 7.633 0 15.372-1.945 22.458-6.037l115.232-66.529v133.058c0 24.853 20.147 45 45 45s45-20.147 45-45v-133.058l115.231 66.529c7.087 4.092 14.823 6.037 22.458 6.037 15.552 0 30.679-8.072 39.013-22.508 12.427-21.523 5.052-49.045-16.471-61.471z'/%3E%3C/g%3E%3C/svg%3E");
  position: absolute;
  width: 10px;
  height: 10px;
  margin: 3px;
  color: red;
  top: 0;
  right: 0;
}
.selector__field-wrapper {
  display: flex;
  border-radius: 8px;
  overflow: hidden;
  background-color: white;
  height: 100%;
  cursor: pointer;
}

.sortable {
  width: calc(100% - 100px);
  margin: 0 50px;
  border-collapse: separate;
  border-spacing: 0 20px;
}
.sortable.tight {
  width: 100%;
  margin: 0;
  border-spacing: 0 10px;
}
.sortable.tight .sortable__header .sortable__header-row {
  transform: translatey(-20px);
  font-size: 15px;
  height: 40px;
}
.sortable.tight .sortable__header .sortable__column {
  line-height: 20px;
}
.sortable.tight .sortable__header .sortable__column:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after {
  top: 5px;
}
.sortable.tight .sortable__row, .sortable.tight .sortable__header-row {
  font-size: 15px;
  height: 40px;
}
.sortable.tight .sortable__row *, .sortable.tight .sortable__header-row * {
  line-height: 20px;
}
.sortable.tight #sorttable__caret-down {
  top: 5px;
}
.sortable.tight #sorttable__caret-up {
  top: 5px;
}
.sortable.scrollable {
  width: 100%;
}
.sortable.scrollable .sortable__header .sortable__row, .sortable.scrollable .sortable__header .sortable__header-row {
  transform: initial;
}
.sortable.scrollable .sortable__header, .sortable.scrollable .sortable__body .sortable__row, .sortable.scrollable .sortable__header-row {
  display: table;
  width: 100%;
  table-layout: fixed;
}
.sortable.scrollable .sortable__body {
  display: block;
  overflow-y: auto;
  table-layout: fixed;
  max-height: 800px;
  overflow-x: hidden;
}
.sortable.scrollable .sortable__row, .sortable.scrollable .sortable__header-row {
  margin: 10px 0;
  padding: 0;
  border-radius: 8px;
}
.sortable.color-reverse .sortable__row, .sortable.color-reverse .sortable__header-row {
  background-color: #071430;
}
.sortable__header {
  position: relative;
}
.sortable__header .sortable__row, .sortable__header .sortable__header-row {
  transform: translatey(-30px);
  font-size: 25px;
  text-align: left;
  height: 50px;
  position: relative;
}
.sortable__header .sortable__header-row {
  margin: 0 50px 20px 50px;
  background-color: #27324A;
  border: none;
  font-size: 25px;
  line-height: 40px;
  padding: 20px 0 0 20px;
  cursor: pointer;
  height: 50px;
  max-height: 50px;
}
.sortable__header .sortable__column * {
  display: inline;
}
.sortable__header .sortable__column:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after {
  content: "";
  height: 30px;
  width: 30px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M6.41,16H17.59a1,1,0,0,0,.7-1.71L12.71,8.71a1,1,0,0,0-1.42,0L5.71,14.29A1,1,0,0,0,6.41,16Z'/%3E%3C/svg%3E%0A");
  display: inline-block;
  position: absolute;
  top: 10px;
  transform: translatex(5px);
}
.sortable__header .sorttable_search {
  height: 35px;
}
.sortable__header .sorttable_search .search-sortable .input__field {
  height: 35px;
  width: 100%;
  background-color: #071430;
}
.sortable__header .sorttable_search .search-sortable .input__field input {
  height: 35px;
  width: 100%;
  color: white;
  font-size: 20px;
  line-height: 30px;
  background-color: #071430;
}
.sortable__header .sorttable_search .search-sortable .input__field input::placeholder {
  color: white;
}
.sortable__header button.icon-button.sortable-search {
  height: 30px;
  width: 30px;
  display: inline-block;
  position: absolute;
  margin: 0;
  top: 5px;
  right: 10px;
}
.sortable__header button.icon-button.sortable-search .search__icon {
  height: 30px;
  width: 30px;
}
.sortable__body .sortable__row:hover {
  background-color: #ee8216;
}
.sortable__row {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin: 0 50px 20px 50px;
  background-color: #27324A;
  border: none;
  font-size: 25px;
  line-height: 40px;
  padding: 20px 0 0 20px;
  cursor: pointer;
  height: 50px;
  max-height: 50px;
  /*    max-width: 100%;
      width: 100%;*/
}
.sortable__column {
  /*  height: 50px;
    max-height: 50px;
    text-overflow: ellipsis;*/
  padding: 0 20px;
}
.sortable__column.first.last {
  border-radius: 8px;
}
.sortable__column.first {
  border-radius: 8px 0 0 8px;
}
.sortable__column.last {
  border-radius: 0 8px 8px 0;
}

#sorttable__caret-down {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' id='Outline' viewBox='0 0 24 24' fill='white' %3E%3Cpath d='M6.41,9H17.59a1,1,0,0,1,.7,1.71l-5.58,5.58a1,1,0,0,1-1.42,0L5.71,10.71A1,1,0,0,1,6.41,9Z'/%3E%3C/svg%3E%0A");
  height: 30px;
  width: 30px;
  display: inline-block;
  position: absolute;
  top: 10px;
  transform: translatex(5px);
}

#sorttable__caret-up {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M6.41,16H17.59a1,1,0,0,0,.7-1.71L12.71,8.71a1,1,0,0,0-1.42,0L5.71,14.29A1,1,0,0,0,6.41,16Z'/%3E%3C/svg%3E%0A");
  height: 30px;
  width: 30px;
  display: inline-block;
  position: absolute;
  top: 10px;
  transform: translatex(5px);
}

.center-card {
  width: 450px;
  height: auto;
  margin: auto;
  background-color: #27324A;
  border-radius: 15px;
  padding: 25px;
  position: relative;
  z-index: 2;
}

.center-card__header {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.center-card__title {
  font-size: 20px;
}

.center-card__footer {
  margin-top: 15px;
}

.input__description {
  font-size: 20px;
  line-height: 30px;
}
.input__field {
  padding: 2px;
  background-color: white;
  border-radius: 8px;
  height: 40px;
  box-sizing: border-box;
}
.input__field input {
  height: auto;
  border-radius: 0;
  padding: 0 10px;
}
.input__field .before {
  font-size: 20px;
  padding-left: 10px;
  line-height: 40px;
  color: #071430;
}
.input__field .after {
  font-size: 20px;
  padding-right: 10px;
  line-height: 40px;
  color: #071430;
}
.input__field[data-required=true] {
  position: relative;
}
.input__field[data-required=true]::before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg id='Capa_1' enable-background='new 0 0 512 512' fill='red' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='m461.231 322.529-115.232-66.529 115.232-66.529c21.523-12.426 28.897-39.947 16.471-61.471-12.426-21.522-39.946-28.899-61.471-16.471l-115.231 66.529v-133.058c0-24.853-20.147-45-45-45s-45 20.147-45 45v133.058l-115.231-66.529c-21.526-12.427-49.046-5.052-61.472 16.471s-5.052 49.045 16.471 61.471l115.233 66.529-115.232 66.529c-21.523 12.426-28.898 39.948-16.472 61.471 8.335 14.438 23.46 22.508 39.013 22.508 7.633 0 15.372-1.945 22.458-6.037l115.232-66.529v133.058c0 24.853 20.147 45 45 45s45-20.147 45-45v-133.058l115.231 66.529c7.087 4.092 14.823 6.037 22.458 6.037 15.552 0 30.679-8.072 39.013-22.508 12.427-21.523 5.052-49.045-16.471-61.471z'/%3E%3C/g%3E%3C/svg%3E");
  position: absolute;
  width: 10px;
  height: 10px;
  margin: 3px;
  color: red;
  top: 0;
  right: 0;
}
.input__field-wrapper {
  display: flex;
  border-radius: 8px;
  overflow: hidden;
  background-color: white;
  height: 100%;
}

.move {
  position: absolute;
  left: -50px;
  top: 0;
  height: 100%;
  width: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.move:hover .move__controls {
  transform: scale(1);
}
.move__controls {
  height: 70px;
  width: 30px;
  border-radius: 8px;
  background-color: #27324A;
  display: flex;
  transform: scale(0);
  flex-direction: column;
  justify-content: space-evenly;
  -webkit-transition: all 0.3s ease-in 0.2s;
  -moz-transition: all 0.3s ease-in 0.2s;
  -o-transition: all 0.3s ease-in 0.2s;
  transition: all 0.3s ease-in 0.2s;
}
.move__up {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/up-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.move__up:hover {
  background-color: initial;
}
.move__down {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/down-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.move__down:hover {
  background-color: initial;
}

/* ---------- pages ---------- */
.categories {
  box-sizing: border-box;
}
.categories__title {
  font-size: 25px;
  margin: 20px 0 0 50px;
}
.categories__body {
  padding: 20px 50px 50px 50px;
  margin-bottom: 80px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.categories__body .category {
  position: relative;
  box-sizing: border-box;
  background-color: #27324A;
  padding: 20px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.categories__body .category__details {
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  gap: 10px;
}
.categories__body .category__details .delete {
  height: 100%;
  margin-top: 30px;
}
.categories__body .category__items {
  display: flex;
  flex-direction: column;
  gap: 15px;
  border-radius: 8px;
}
.categories__body .category__items .add-category-item {
  background-color: #071430;
  color: white;
}
.categories__body .category__items .add-category-item:hover {
  background-color: #ee8216;
  color: white;
}
.categories__body .category__item {
  box-sizing: border-box;
  background-color: #071430;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 10px;
  margin-left: 20px;
  border-radius: 8px;
  width: calc(100% - 20px);
  gap: 10px;
  position: relative;
}
.categories__body .category__item > div.move {
  width: 40px;
  left: -40px;
}
.categories__body .category__item > .move .move__controls {
  background-color: #071430;
}
.categories__body .category__item:hover > .move .move__controls {
  transform: scale(1);
}
.categories__body .category__item-name {
  font-size: 20px;
}
.categories__body .category__item-delete .checkbox-icon {
  margin-top: 0;
}
.categories__body .category:hover > .move .move__controls {
  transform: scale(1);
}
.categories__body .category .move {
  position: absolute;
  left: -50px;
  top: 0;
  height: 100%;
  width: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.categories__body .category .move:hover .move__controls {
  transform: scale(1);
}
.categories__body .category .move__controls {
  height: 70px;
  width: 30px;
  border-radius: 8px;
  background-color: #27324A;
  display: flex;
  transform: scale(0);
  flex-direction: column;
  justify-content: space-evenly;
  -webkit-transition: all 0.3s ease-in 0.2s;
  -moz-transition: all 0.3s ease-in 0.2s;
  -o-transition: all 0.3s ease-in 0.2s;
  transition: all 0.3s ease-in 0.2s;
}
.categories__body .category .move__up {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/up-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.categories__body .category .move__up:hover {
  background-color: initial;
}
.categories__body .category .move__down {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/down-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.categories__body .category .move__down:hover {
  background-color: initial;
}
.categories .save-categories .btn--save-categories {
  margin: 15px 20px;
}

.checkbox-icon--user-delete {
  padding-left: 40px;
  line-height: 40px;
  color: white;
}

.checkbox-icon__icon--user-delete {
  width: 40px;
  height: 40px;
  background: url(/media/trash.svg) no-repeat;
}

.checkbox-icon--user-delete .checkbox-icon__input:checked ~ .checkbox-icon__icon {
  background: url(/media/trashed.svg) no-repeat;
}

.user {
  z-index: 1;
  display: flex;
  flex-direction: row;
  background-color: #27324A;
  border-radius: 10px;
  padding: 10px;
  margin-bottom: 20px;
  justify-content: space-between;
}
.user__picture {
  height: 80px;
  width: 80px;
  border-radius: 50%;
  background-color: white;
  margin: 0 10px;
  overflow: hidden;
}
.user__picture img {
  width: auto;
  height: calc(100% + 2px);
}
.user__details {
  font-size: 30px;
  line-height: 30px;
  padding: 10px;
  width: 500px;
}
.user__delete {
  height: 40px;
  padding: 20px 0 20px 0;
  margin-right: 10px;
}
.user__company {
  position: relative;
  z-index: 1;
  height: 40px;
  padding: 20px 0 20px 0;
  width: 300px;
}
.user__rol {
  position: relative;
  z-index: 1;
  height: 40px;
  padding: 20px 0 20px 0;
  width: 180px;
}
.user__ban {
  height: 40px;
  padding: 20px 0 20px 0;
}
.user__edit {
  height: 40px;
  padding: 20px 0 20px 0;
  width: 40px;
}
.user.edited {
  -webkit-box-shadow: inset 0px 0px 0px 3px #ee8216;
  -moz-box-shadow: inset 0px 0px 0px 3px #ee8216;
  box-shadow: inset 0px 0px 0px 3px #ee8216;
}

#work-window {
  position: relative;
  height: 100%;
}

.new-users__heading, .users__heading {
  font-size: 30px;
  margin: 20px 0;
}

.users, .new-users, .search {
  margin: 0 50px;
}

.search {
  display: flex;
  position: relative;
  margin: 50px;
}

.search-button {
  position: absolute;
  top: 5px;
  left: 375px;
  height: 40px;
  width: 40px;
  cursor: pointer;
}

.search-button svg {
  height: 40px;
  width: 40px;
}

.search .search-input {
  width: 100%;
  padding-left: 70px;
}

.save {
  width: calc(100% - 300px);
  height: 80px;
  position: fixed;
  bottom: 0;
  z-index: 2;
  background-color: #27324A;
}

body.fold .save {
  width: calc(100% - 60px);
}

.btn--save {
  position: absolute !important;
  right: 20px;
  top: 15px;
  padding-left: 20px;
  padding-right: 20px;
}

.search--projects {
  margin-bottom: 60px;
}

.search .search-input.search-input--projects {
  width: calc(100% - 365px);
}

.btn__add-project {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 0;
  color: white;
  margin-right: 15px;
  width: 350px;
}

.work-window--add-project {
  min-height: 100vh;
  display: flex;
  align-items: center;
  vertical-align: center;
  flex-direction: column;
}

#account-selector {
  cursor: pointer;
}

.project-section {
  margin: 0 0 50px 350px;
}
.project-section .section {
  background-color: #27324A;
  border-radius: 8px;
  margin: 50px;
  padding: 20px;
}

.dossiers__title {
  font-size: 25px;
  margin-bottom: 20px;
}

.project_name {
  font-size: 30px;
  line-height: 50px;
  display: flex;
}
.project_name .separator-dot {
  margin: 20px;
}

.project__details {
  margin: 50px;
  display: flex;
  justify-content: space-between;
}
.project__details .edit-project-details.icon-button, .project__details .copy-project.icon-button {
  margin: auto 20px;
  float: right;
  width: 35px;
  height: 35px;
  background-color: #ee8216;
  padding: 2.5px;
  border-radius: 5px;
}
.project__details .edit-project-details .icon-button__icon, .project__details .copy-project .icon-button__icon {
  width: 25px;
  height: 25px;
  top: 5px;
  left: 5px;
  background-position: center center;
}
.project__details .project_status {
  width: 200px;
}
.project__details .project_status .dropdown__title {
  background-color: #ee8216;
}
.project__details .project_status .dropdown__items li {
  background-color: #ee8216;
}
.project__details .project_status .dropdown__items li:hover {
  background-color: #27324A;
}
.project__details .project_status.label {
  background-color: #ee8216;
  color: #071430;
  border-radius: 8px;
  padding: 0px 10px;
  line-height: 20px;
  font-size: 25px;
  margin: 5px 0;
}
.change-project-details .center-card__body {
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.change-project-details .center-card__body .btn {
  margin-top: 10px;
}

.copy-project .center-card__body {
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.copy-project .center-card__body .btn {
  margin-top: 10px;
}

.details, .notes {
  margin: 50px;
  width: 100%;
}
.details__title, .notes__title {
  font-size: 25px;
  margin-bottom: 20px;
}
.details__body, .notes__body {
  background-color: #27324A;
  border-radius: 8px;
  padding: 20px;
}
.details .project-detail, .notes .project-detail {
  display: flex;
  font-size: 20px;
  align-items: center;
}
.details .project-detail__description, .notes .project-detail__description {
  flex: 40%;
  font-size: 22px;
  font-weight: bold;
}
.details .project-detail__value, .notes .project-detail__value {
  flex: 60%;
}
.details .add-note-field, .notes .add-note-field {
  display: flex;
  margin-top: 20px;
  background-color: #27324A;
}
.details .notes__input, .notes .notes__input {
  color: #071430;
  border-radius: 8px;
  width: 100%;
  resize: none;
  margin-right: 20px;
  font-size: 20px;
  padding: 10px;
}
.details .note-container, .notes .note-container {
  width: 100%;
  display: block;
}
.details .notes-container, .notes .notes-container {
  display: flex;
  flex-direction: column;
  margin: 0;
  max-height: 200px;
  overflow: auto;
}
.details .note, .notes .note {
  background-color: #071430;
  padding: 5px;
  border-radius: 0 8px 8px 8px;
  display: inline-block;
  position: relative;
  margin-left: 8px;
  min-width: 300px;
  margin-bottom: 20px;
}
.details .note a, .notes .note a {
  text-decoration: underline;
}
.details .note a:hover, .notes .note a:hover {
  margin-bottom: 2px;
}
.details .note--owner, .notes .note--owner {
  border-radius: 8px 0 8px 8px;
  margin-right: 8px;
  float: right;
}
.details .note--owner__author, .notes .note--owner__author {
  display: none;
}
.details .note__delete, .notes .note__delete {
  padding-left: 40px;
  line-height: 40px;
  color: white;
}
.details .note .tail, .notes .note .tail {
  width: 8px;
  height: 13px;
}
.details .note .tail path, .notes .note .tail path {
  fill: #071430;
}
.details .note .tail-right, .notes .note .tail-right {
  position: absolute;
  right: -8px;
  top: -3px;
}
.details .note .tail-right svg, .notes .note .tail-right svg {
  fill: #071430;
}
.details .note .tail-left, .notes .note .tail-left {
  position: absolute;
  left: -8px;
  top: -3px;
}
.details .note .tail-left svg, .notes .note .tail-left svg {
  fill: #071430;
}
.details .note__author, .notes .note__author {
  color: #ee8216;
  font-size: 14px;
}
.details .note__content, .notes .note__content {
  font-size: 20px;
}
.details .add-note, .notes .add-note {
  padding: 0;
  width: 100px;
}

.open-folder {
  background-color: #27324A;
  border-radius: 15px;
  padding: 30px;
  margin-bottom: 40px;
}
.open-folder--invisible {
  background-color: transparent;
  padding: 0;
}
.open-folder__header {
  padding-bottom: 30px;
}
.open-folder__title {
  font-size: 25px;
}
.open-folder__items {
  display: grid;
  width: 100%;
  grid-template: 250px/repeat(auto-fill, 250px);
  grid-gap: 20px;
  height: 250px;
  overflow: hidden;
}
.open-folder--invisible .open-folder__items {
  grid-template: repeat(auto-fill, 250px)/repeat(auto-fill, 250px);
  height: auto;
}
.open-folder__message-text {
  font-size: 20px;
  text-align: center;
  line-height: 250px;
}
.open-folder__message {
  width: 100%;
  height: 250px;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.open-folder__footer {
  padding-top: 30px;
}
.open-folder__footer button, .open-folder label {
  font-size: 20px;
}
.open-folder__footer button:hover {
  background-color: #ee8216;
}

.file {
  background-color: #27324A;
  border-radius: 15px;
  height: 250px;
  width: 250px;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 20px;
}
.file__header {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  pointer-events: none;
  text-align: center;
}
.file__img {
  height: 160px;
  width: 100%;
  object-fit: scale-down;
  object-position: 50% 50%;
  margin: auto;
}
.file__body {
  height: 45px;
  width: 210px;
  display: flex;
  background-color: inherit;
}
.file__actions {
  width: 40px;
}
.file__name {
  height: 45px;
  width: 170px;
}
.file__name .actual {
  height: 45px;
  width: 170px;
  line-height: 22px;
  font-size: 17px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.file__name[data-title] {
  position: relative;
  background-color: inherit;
}
.file__name[data-title]:after {
  font-size: 17px;
  content: attr(data-title);
  background-color: inherit;
  color: white;
  border-radius: 5px;
  position: absolute;
  top: 0;
  z-index: 10;
  visibility: hidden;
}
.file__name[data-title]:hover:after {
  visibility: visible;
  -webkit-transition: all 1s ease-in-out 0.2s;
  -moz-transition: all 1s ease-in-out 0.2s;
  -o-transition: all 1s ease-in-out 0.2s;
  transition: all 1s ease-in-out 0.2s;
}

div.file--dark-blue {
  background-color: #071430;
}

.folder {
  background-color: #27324A;
  border-radius: 15px;
  height: 250px;
  width: 250px;
  box-sizing: border-box;
  padding: 20px;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.folder__header {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  pointer-events: none;
  text-align: center;
}
.folder__img {
  height: 160px;
  width: auto;
  margin: auto;
}
.folder__body {
  height: 45px;
  width: 210px;
  display: flex;
  overflow-y: hidden;
}
.folder__actions {
  width: 40px;
}
.folder__name {
  font-size: 17px;
  word-break: break-all;
  width: 170px;
}

.btn.add-quotation, .btn.add-load-plan {
  height: 40px;
  font-size: 18px;
}

.involved {
  margin: 0 50px 50px 50px;
}
.involved__title {
  font-size: 25px;
  margin-bottom: 20px;
}

.involved-user {
  z-index: 1;
  display: flex;
  flex-direction: row;
  background-color: #27324A;
  border-radius: 10px;
  padding: 10px;
  margin-bottom: 20px;
  justify-content: space-between;
}
.involved-user__details {
  font-size: 20px;
  line-height: 20px;
  padding: 10px;
  width: 500px;
}
.involved-user__actions {
  display: flex;
  width: 300px;
  justify-content: space-between;
}
.involved-user__rights {
  height: 40px;
  width: 200px;
  padding: 10px 0;
}
.involved-user__delete {
  height: 40px;
  padding: 10px 0;
  margin-right: 10px;
}
.involved-user__delete .checkbox-icon {
  margin: 0 !important;
}

button.btn__add-person {
  width: 100%;
  background-color: #27324A;
  color: white;
}

.add-involved-user .center-card {
  margin-top: 50px;
  width: calc(100vw - 100px);
  box-sizing: border-box;
  height: calc(100vh - 100px);
  overflow: auto;
}

.row {
  display: flex;
}

.tabs {
  background-color: #27324A;
  border-radius: 8px;
  margin: 50px;
}
.tabs__nav {
  padding: 20px;
  display: flex;
  gap: 20px;
  font-size: 20px;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.tabs__nav-item.selected {
  position: relative;
  overflow: visible;
}
.tabs__nav-item.selected::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  bottom: -4px;
  border-radius: 1px;
  background-color: #ee8216;
}
.tabs__content {
  padding: 10px 20px 20px 20px;
}
.tabs .tab {
  display: none;
}
.tabs .tab.show {
  display: initial;
}

.quotation .icon-button__icon, .order .icon-button__icon, .invoice .icon-button__icon, .load-plan .icon-button__icon {
  width: 25px;
  height: 25px;
  top: 5px;
  left: 5px;
  background-position: center center;
}
.quotation .icon-button, .order .icon-button, .invoice .icon-button, .load-plan .icon-button {
  margin-left: 10px;
  float: right;
  width: 35px;
  height: 35px;
  background-color: #ee8216;
  padding: 2.5px;
  border-radius: 5px;
}

.quotations .sortable__row:hover, .orders .sortable__row:hover, .invoices .sortable__row:hover, .load-plans .sortable__row:hover {
  background-color: #071430;
}
.quotations .sortable__column.first, .quotations .sortable__column.last, .orders .sortable__column.first, .orders .sortable__column.last, .invoices .sortable__column.first, .invoices .sortable__column.last, .load-plans .sortable__column.first, .load-plans .sortable__column.last {
  padding: 5px;
}

.quotation, .invoice {
  cursor: initial;
}
.quotation .btn--invoice, .quotation .btn--on-hold, .quotation .btn--order, .quotation .btn--confirm, .invoice .btn--invoice, .invoice .btn--on-hold, .invoice .btn--order, .invoice .btn--confirm {
  margin-left: 10px;
  height: 35px;
  float: right;
  font-size: 20px;
  border-radius: 5px;
  color: white;
  font-weight: normal;
}
.quotation .btn--invoice:hover, .quotation .btn--on-hold:hover, .quotation .btn--order:hover, .quotation .btn--confirm:hover, .invoice .btn--invoice:hover, .invoice .btn--on-hold:hover, .invoice .btn--order:hover, .invoice .btn--confirm:hover {
  background-color: #ee8216;
  color: white;
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  transform: scale(0.8);
}

.quotation .quotation_status {
  width: 200px;
}
.quotation .quotation_status .dropdown {
  height: 35px;
}
.quotation .quotation_status .dropdown__title {
  height: 35px;
  padding: 7.5px 10px;
  background-color: #ee8216;
}
.quotation .quotation_status .dropdown__title::after {
  top: 2.5px;
}
.quotation .quotation_status .dropdown__items li {
  background-color: #ee8216;
}
.quotation .quotation_status .dropdown__items li:hover {
  background-color: #27324A;
}

.inline-file {
  margin: 0;
  background-color: #27324A;
  display: flex;
  gap: 10px;
  padding: 5px;
  border-radius: 5px;
  width: max-content;
  width: -moz-max-content;
  transition: transform 0.2s ease-in-out;
  position: relative;
  /*  &:active::after{
      width: 45px;
    }*/
}
.inline-file.no-file {
  background-color: #071430;
}
.inline-file.no-file::after {
  content: "";
  right: 10px !important;
  width: 0 !important;
}
.inline-file.no-file:active {
  transform: scale(1);
}
.inline-file > * {
  z-index: 8;
  position: relative;
  background-color: #27324A;
}
.inline-file__icon {
  line-height: 25px !important;
  height: 25px;
  width: 25px;
}
.inline-file__text {
  line-height: 25px !important;
  font-size: 20px;
  background-color: inherit;
}
.inline-file:hover {
  overflow: initial;
}
.inline-file::after {
  content: "";
  position: absolute;
  height: 100%;
  width: 0;
  background-color: #27324A;
  right: 10px;
  top: 0;
  border-radius: 0 5px 5px 0;
  animation: in 1s normal 1;
  background-image: url(/public/media/share.svg);
  background-repeat: no-repeat;
  background-size: 25px 25px;
  background-position: 80% center;
}
.inline-file:hover::after {
  content: "";
  position: absolute;
  height: 100%;
  width: 45px;
  background-color: #27324A;
  right: -40px;
  top: 0;
  border-radius: 0 5px 5px 0;
  animation: out 1s normal 1;
  background-image: url(/public/media/share.svg);
  background-repeat: no-repeat;
  background-size: 25px 25px;
  background-position: 80% center;
}
.inline-file:active {
  transform: scale(0.96);
}

@keyframes out {
  0% {
    width: 0;
    right: 10px;
    background-size: 5px 5px;
  }
  50% {
    width: 45px;
    right: -40px;
    background-size: 25px 25px;
  }
  100% {
    width: 45px;
    right: -40px;
  }
}
@keyframes in {
  0% {
    width: 45px;
    right: -40px;
    background-size: 25px 25px;
  }
  50% {
    width: 0;
    right: 10px;
    background-size: 5px 5px;
  }
  100% {
    width: 0;
    right: 10px;
    display: none;
  }
}
.time-line {
  display: flex;
  width: 100%;
  height: 30px;
  margin-top: 20px;
}
.time-line__event {
  height: 10px;
  transform: translateY(10px);
  background-color: #071430;
  position: relative;
}
.time-line__event--active {
  background-color: #ee8216;
}
.time-line__event--active .pointer {
  background-color: #ee8216 !important;
}
.time-line__event .description {
  position: absolute;
  top: -25px;
  left: 5px;
}
.time-line__event .pointer {
  transform: translate(-1.5px, -10px);
  height: 30px;
  width: 3px;
  background-color: #071430;
}
.time-line__event .pointer--last {
  position: absolute;
  right: -1.5px;
  top: 0;
}

.load-plan-popup .options {
  margin-top: 20px;
}
.load-plan-popup .options .options__field {
  border-radius: 8px;
  gap: 0 !important;
  overflow: hidden;
}
.load-plan-popup .options .options__option {
  border-radius: 0;
  flex-basis: 50%;
  text-align: center;
  line-height: 40px;
  height: 40px;
  font-size: 20px;
  padding: 0;
}
.load-plan-popup .select {
  margin-top: 20px;
}
.load-plan-popup .create-load-plan {
  margin-top: 20px;
  width: 100%;
}

.label {
  height: 35px;
  width: fit-content;
  background-color: #ee8216;
  border-radius: 5px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  font-size: 20px;
  color: #071430;
  font-weight: normal;
}

.active-orders {
  padding: 0 50px 130px 50px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.active-orders__header {
  display: flex;
  background-color: #27324A;
  padding: 5px;
  border-radius: 8px;
  font-size: 25px;
  line-height: 40px;
  margin-bottom: 20px;
}
.active-orders__header > .account-name {
  flex-basis: 180%;
}
.active-orders__header > * {
  flex-basis: 100%;
}

.time-line {
  padding: 0 50px;
  box-sizing: border-box;
}

.active-order {
  background-color: #27324A;
  padding: 5px;
  border-radius: 8px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.active-order__details {
  display: flex;
  flex-direction: row;
  font-size: 25px;
  line-height: 40px;
}
.active-order__details > .first {
  flex-basis: 180%;
}
.active-order__details > * {
  flex-basis: 100%;
}
.active-order__timeline {
  border-radius: 8px;
  padding: 10px;
  background-color: #071430;
}

.footer-options {
  width: calc(100% - 300px);
  height: 80px;
  position: fixed;
  bottom: 0;
  z-index: 2;
  background-color: #27324A;
}
body.fold .footer-options {
  width: calc(100% - 60px);
}

#work-window.profile-section {
  margin-left: 300px;
  height: 100vh;
}

.center-card__form {
  display: flex;
  flex-direction: column;
  row-gap: 15px;
}

.profile__form#change-password-form {
  margin-bottom: 50px;
}

.center-card__line {
  height: 2px;
  width: 400px;
  margin: 25px auto;
  background-color: #ee8216;
  border-radius: 2px;
}

.profile-section {
  display: flex;
  align-items: center;
  vertical-align: center;
  flex-direction: column;
}

#change-password {
  margin-bottom: 20px;
}

.entry-logo {
  width: 500px;
  height: auto;
  margin: 25px auto;
}

.entry-section {
  display: flex;
  align-items: center;
  justify-content: center;
}

.entry-card {
  width: 450px;
  height: auto;
  margin: auto;
  background-color: #27324A;
  border-radius: 15px;
  padding: 25px;
  position: relative;
  z-index: 2;
}

.entry-card__line {
  height: 2px;
  width: 400px;
  margin: 25px auto;
  background-color: #ee8216;
}

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

.entry-card__form, .profile__form {
  display: flex;
  flex-direction: column;
  row-gap: 15px;
}

.entry-card__footer {
  margin-top: 15px;
}

.entry-card__link {
  color: #C7C7C7;
  font-size: 15px;
}

.entry-card--standout {
  background-color: #ee8216;
  /*
  background-image: url(/media/background.svg);
  */
  background-position: center;
  background-size: 100% auto;
  color: #071430;
  position: relative;
  top: -40px;
  z-index: 1;
  padding: 55px 25px 15px 25px;
  font-weight: bold;
}

.entry-card--standout a {
  color: #071430;
  font-weight: bold;
  z-index: 1;
}

.dossier-section {
  box-sizing: border-box;
  min-height: 100vh;
}
.dossier-section .dossier {
  min-height: calc(100vh - 140px);
  margin: 0;
  padding: 50px;
  box-sizing: border-box;
}

.project-section {
  box-sizing: border-box;
}

.folder_name {
  margin-bottom: 20px;
  font-size: 30px;
}

.upload-files .center-card {
  margin-top: 50px;
  width: calc(100vw - 100px);
  box-sizing: border-box;
  height: calc(100vh - 100px);
  overflow: auto;
}

.dossier {
  padding-bottom: 10px;
  margin: 50px;
}

.create-directory__body {
  height: auto;
  display: flex;
  gap: 10px;
}

/*
.upload-files{


  &__name{
    font-size: 25px;
    margin-bottom: 25px;
  }

  &__upload-box{
    box-sizing: border-box;
    width: 100%;
    border: 5px solid white;
    @include user-select();
    height: 300px;
    border-radius: 15px;
    border-style: dashed;

  }

  &__add-folder{
    margin: 20px 0;
    width: 100%;
    position: relative;
  }

  &__add-folder > input{
    width: 100%;
    position: absolute;
    display: block;
    z-index: 1;
    left: 0;
    top:0;
    box-sizing: border-box;
    background-color: $dark-blue;
    color: white;
    padding-left: 20px;
  }

  &__add-folder > input::placeholder{
    color: white;
  }

  &__input {
    visibility: hidden;
  }
}
*/
.upload-files__input, .files {
  display: none;
}

.upload-box__message-text {
  line-height: 300px;
  text-align: center;
  font-size: 20px;
}

.upload-files__uploaded {
  margin-top: 90px;
}

label.add-files, .add-folder, .to-directory {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #071430;
  color: white;
  padding: 10px !important;
  height: auto !important;
  border: none;
  border-radius: 8px;
  font-size: 20px;
  font-weight: bold;
  transition: all 0.2s ease-in-out;
  overflow: hidden;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  position: relative;
}
label.add-files:hover, .add-folder:hover, .to-directory:hover {
  background-color: #ee8216;
  color: #27324A;
}

label.add-files:active {
  transform: scale(0.96);
}

.extra-options {
  display: none;
  position: absolute;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  top: 0;
  bottom: 0;
  border-radius: 5px;
  color: #27324A;
  background-color: #ee8216;
  width: 150px;
  height: 60px;
  line-height: 30px;
  padding: 5px 0;
}
.extra-options__item {
  padding: 0 10px;
  position: relative;
}
.extra-options__item:hover {
  background-color: #071430;
}

.uploaded-file {
  margin-top: 20px;
  padding: 10px;
  background-color: #071430;
  height: 100px;
  border-radius: 15px;
  display: flex;
  gap: 20px;
  justify-content: space-between;
}
.uploaded-file__img {
  height: 100%;
  width: auto;
}
.uploaded-file__name {
  font-size: 20px;
  line-height: 50px;
}
.uploaded-file__uploaded-size {
  display: flex;
  flex-direction: column;
  text-align: center;
  line-height: 50px;
}
.uploaded-file__total-size {
  display: flex;
  height: 100%;
  flex-direction: column;
  text-align: center;
  line-height: 50px;
}

.progress-ring {
  width: 100px;
  height: 100px;
  float: right;
}
.progress-ring__circle-background {
  stroke: #071430;
  stroke-width: 15px;
  fill: transparent;
}
.progress-ring--dark-blue .progress-ring__circle-background {
  stroke: #27324A;
}
.progress-ring__circle {
  stroke: #ee8216;
  stroke-width: 15px;
  fill: transparent;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  stroke-linecap: round;
  transition: 2s stroke-dashoffset;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
}
.progress-ring__text {
  fill: white;
}
.progress-ring--small {
  width: 40px;
  height: 40px;
}
.progress-ring--small .progress-ring__circle {
  stroke-width: 20px;
  transition: 1s stroke-dashoffset;
}
.progress-ring--small .progress-ring__circle-background {
  stroke-width: 20px;
}

.current-folder-actions {
  width: 100%;
  height: 50px;
  position: fixed;
  bottom: 0;
  background-color: #27324A;
  z-index: 10;
  padding: 15px;
}
.current-folder-actions label, .current-folder-actions button {
  font-size: 20px;
  background-color: #ee8216;
  color: #071430;
}
.current-folder-actions label:hover {
  background-color: white;
}

/*.btn__current-folder-actions{
  position: absolute !important;
  left: 20px;
  top: 15px;
  padding-left: 20px;
  padding-right: 20px;
}*/
/*body.fold .current-folder-actions{
  width: calc(100% - 60px);
  margin-left: 60px;
}*/
button.btn__add-folder {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 3;
  background-color: transparent;
  color: white;
}

button.btn__add-folder:hover {
  background-color: transparent;
  color: white;
}

.file-viewer {
  border: none;
  width: 100%;
  height: calc(100vh - 65px);
}

.od-ImageTile {
  background-color: #071430;
}

.od-PdfViewer {
  background-color: #071430;
}

.standard-items {
  margin: 20px 50px 0 50px;
  box-sizing: border-box;
  height: 400px;
  overflow-y: auto;
  position: relative;
}
.standard-items__title {
  margin: 50px 50px 0 50px;
  font-size: 25px;
}

#work-window.configurator-selector {
  margin-left: 300px;
  height: 100vh;
  display: flex;
  align-items: center;
  vertical-align: center;
  flex-direction: column;
  position: relative;
}
#work-window.configurator-selector section.popup {
  position: absolute;
  z-index: 0;
}

.project-details {
  padding: 50px 50px 0 50px;
  box-sizing: border-box;
}
.project-details .section__body {
  padding: 10px;
  border-radius: 8px;
  background-color: #27324A;
  display: flex;
  gap: 10px;
}

/*.production-cost {
  padding: 0 50px 50px 50px;
  box-sizing: border-box;

  &__title{
    font-size: 25px;
    margin-bottom: 20px;
  }

  &__card {
    background-color: $light-blue;
    padding: 20px;
    border-radius: 8px;
  }

  &__body{
    max-height: 260px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    overflow-y: auto;
  }

  &__footer{
    margin-top: 20px;
    display: flex;
    justify-content: space-between;

  }


  &__total{
    line-height: 50px;
    font-size: 30px;
    margin-left: auto;
    order: 2;
  }

}*/
.item-production-cost {
  display: flex;
  font-size: 25px;
  height: 30px;
  justify-content: space-between;
  background-color: #071430;
  padding: 10px;
  border-radius: 8px;
  line-height: 30px;
}
.item-production-cost__name {
  font-weight: bold;
}

.item-logistics-cost {
  display: flex;
  font-size: 25px;
  height: 30px;
  justify-content: space-between;
  background-color: #071430;
  padding: 10px;
  border-radius: 8px;
  line-height: 30px;
}
.item-logistics-cost__name {
  font-weight: bold;
}

.packing-cost {
  padding: 0 50px 50px 50px;
  box-sizing: border-box;
}
.packing-cost__title {
  font-size: 25px;
  margin-bottom: 20px;
}
.packing-cost__card {
  background-color: #27324A;
  padding: 20px;
  border-radius: 8px;
}
.packing-cost__body {
  display: flex;
  gap: 20px;
}
.packing-cost__footer {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
}
.packing-cost__total {
  line-height: 50px;
  font-size: 30px;
  margin-left: auto;
  order: 2;
}

.item-packing-cost {
  font-size: 25px;
  text-align: center;
  background-color: #071430;
  border-radius: 8px;
  line-height: 30px;
  height: 225px;
}
.item-packing-cost__img > img {
  width: 225px;
  height: 125px;
  object-fit: cover;
  object-position: 50% 50%;
}
.item-packing-cost__img {
  height: 125px;
}
.item-packing-cost__name {
  font-weight: bold;
  margin: 10px 0;
}
.item-packing-cost__price {
  margin: 10px 0;
}

.cover-cost {
  padding: 0 50px 50px 50px;
  box-sizing: border-box;
}
.cover-cost__title {
  font-size: 25px;
  margin-bottom: 20px;
}
.cover-cost__card {
  background-color: #27324A;
  padding: 20px;
  border-radius: 8px;
}
.cover-cost__body {
  display: flex;
  gap: 20px;
}
.cover-cost__footer {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
}
.cover-cost__total {
  line-height: 50px;
  font-size: 30px;
  margin-left: auto;
  order: 2;
}

.logistics-cost {
  padding: 0 50px 50px 50px;
  box-sizing: border-box;
}
.logistics-cost__title {
  font-size: 25px;
  margin-bottom: 20px;
}
.logistics-cost__card {
  background-color: #27324A;
  padding: 20px;
  border-radius: 8px;
}
.logistics-cost__body {
  /* display: flex;
   gap: 20px;*/
  max-height: 260px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  overflow-y: auto;
  overflow-x: hidden;
}
.logistics-cost__footer {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
}
.logistics-cost__total {
  line-height: 50px;
  font-size: 30px;
  margin-left: auto;
  order: 2;
}

.item-cover-cost {
  font-size: 25px;
  text-align: center;
  background-color: #071430;
  border-radius: 8px;
  line-height: 30px;
  height: 225px;
}
.item-cover-cost__img > img {
  width: 225px;
  height: 125px;
  object-fit: cover;
  object-position: 50% 50%;
}
.item-cover-cost__img {
  height: 125px;
}
.item-cover-cost__name {
  font-weight: bold;
  margin: 10px 0;
}
.item-cover-cost__price {
  margin: 10px 0;
}

#map {
  width: 100%;
  min-height: 350px;
  border-radius: 8px;
}
#map.active {
  min-height: 350px;
  max-height: 500px;
}
#map .route {
  position: absolute;
}
#map .address {
  margin: 10px;
}
#map .address .before {
  display: flex;
  align-items: center;
  padding: 5px;
}
#map .address .icon {
  height: 30px;
  width: 30px;
}
#map .address .icon--company {
  background: url("/media/company.svg") no-repeat center;
}
#map .address .icon--origin {
  background: url("/media/origin.svg") no-repeat center;
}
#map .address .icon--destination {
  background: url("/media/destination.svg") no-repeat center;
}
#map .address .icon--warehouse {
  background: url("/media/warehouse.svg") no-repeat center;
}
#map .address input {
  font-size: 20px;
  font-weight: normal;
  background-color: transparent;
  -webkit-transition: background-color 0.3s ease-in-out 0.3s;
  -moz-transition: background-color 0.3s ease-in-out 0.3s;
  -o-transition: background-color 0.3s ease-in-out 0.3s;
  transition: background-color 0.3s ease-in-out 0.3s;
}
.work-window--configuration {
  padding-bottom: 130px;
}
.work-window--configuration .project-details {
  margin: 0;
  display: block;
}

.project-name, .project-number, .account-selector {
  margin-right: 20px;
}

.cargo {
  margin: 20px 50px 0 50px;
  padding: 0;
}
.cargo .section__body {
  overflow-y: auto;
  max-height: 400px;
  background-color: transparent;
  flex-direction: column;
  padding: 0;
}
.cargo .shadow-item__body {
  display: none;
}

.add-cargo {
  width: 100%;
}

.section--logistics .section__body {
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.section--logistics .simulation {
  padding: 0;
  width: 100%;
}
.section--logistics .simulation .section__body {
  height: 100%;
  background-color: #071430;
  gap: 15px;
}

.modality {
  flex-direction: column;
  width: 100%;
  justify-content: space-between;
}
.modality .options__field {
  gap: 20px;
}
.modality .options__option {
  display: flex;
  flex-direction: column;
  height: 130px;
  padding: 10px;
  box-sizing: border-box;
  gap: 10px;
}
.modality .options__option .icon {
  height: calc(100% - 30px);
  width: 100%;
  background-repeat: no-repeat;
  background-position: center;
}
.modality .options__option.highlight {
  background-color: #ee8216;
}
.modality .options__option .description {
  height: 30px;
  line-height: 30px;
  text-align: center;
}
.modality .road-icon {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 470 470' xmlns:xlink='http://www.w3.org/1999/xlink' enable-background='new 0 0 470 470'%3E%3Cg%3E%3Cpath d='m95.292,370.25c0,4.142 3.358,7.5 7.5,7.5h264.416c4.143,0 7.5-3.358 7.5-7.5s-3.357-7.5-7.5-7.5h-264.416c-4.142,0-7.5,3.358-7.5,7.5z'/%3E%3Cpath d='m102.792,310.711h17.718c13.697,0 25.248,9.372 28.575,22.039h-46.293c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5 7.5,7.5h54.757c4.142,0 7.5-3.358 7.5-7.5 0-24.559-19.98-44.539-44.54-44.539h-17.718c-4.142,0-7.5,3.358-7.5,7.5s3.359,7.5 7.501,7.5z'/%3E%3Cpath d='m312.451,347.75h54.757c4.143,0 7.5-3.358 7.5-7.5s-3.357-7.5-7.5-7.5h-46.292c3.327-12.667 14.877-22.039 28.574-22.039h17.718c4.143,0 7.5-3.358 7.5-7.5s-3.357-7.5-7.5-7.5h-17.718c-24.559,0-44.539,19.98-44.539,44.539 0,4.142 3.358,7.5 7.5,7.5z'/%3E%3Cpath d='M427.208,0H42.792c-4.142,0-7.5,3.358-7.5,7.5v332.75c0,4.142,3.358,7.5,7.5,7.5h22.5v62.5c0,4.142,3.358,7.5,7.5,7.5h2.5 v44.75c0,4.142,3.358,7.5,7.5,7.5h64.186c4.142,0,7.5-3.358,7.5-7.5v-22.25c0-4.142-3.358-7.5-7.5-7.5s-7.5,3.358-7.5,7.5V455 H90.292v-37.25h287.743V455H328.85v-14.75c0-4.142-3.357-7.5-7.5-7.5s-7.5,3.358-7.5,7.5v22.25c0,4.142,3.357,7.5,7.5,7.5h64.186 c4.143,0,7.5-3.358,7.5-7.5v-44.75h4.173c4.143,0,7.5-3.358,7.5-7.5v-62.5h22.5c4.143,0,7.5-3.358,7.5-7.5V7.5 C434.708,3.358,431.351,0,427.208,0z M102.792,232.625c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h264.416 c4.143,0,7.5-3.358,7.5-7.5s-3.357-7.5-7.5-7.5H242.5V117.5h119.708c15.164,0,27.5,12.336,27.5,27.5v257.75H80.292v-62.49 c0-0.019,0-195.26,0-195.26c0-15.164,12.336-27.5,27.5-27.5H227.5v115.125H102.792z M419.708,332.75h-15V145 c0-23.435-19.065-42.5-42.5-42.5H107.792c-23.435,0-42.5,19.065-42.5,42.5v187.75h-15V15h369.416V332.75z'/%3E%3Cpath d='m457.208,186.881c-4.143,0-7.5,3.358-7.5,7.5v45.744c0,4.142 3.357,7.5 7.5,7.5s7.5-3.358 7.5-7.5v-45.744c0-4.142-3.357-7.5-7.5-7.5z'/%3E%3Cpath d='m12.792,186.881c-4.142,0-7.5,3.358-7.5,7.5v45.744c0,4.142 3.358,7.5 7.5,7.5s7.5-3.358 7.5-7.5v-45.744c0-4.142-3.358-7.5-7.5-7.5z'/%3E%3C/g%3E%3C/svg%3E ");
}
.modality .sea-icon {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 470 470' xmlns:xlink='http://www.w3.org/1999/xlink' enable-background='new 0 0 470 470'%3E%3Cg%3E%3Cpath d='m326.735,113.647c0-4.143-3.357-7.5-7.5-7.5h-168.47c-4.142,0-7.5,3.357-7.5,7.5s3.358,7.5 7.5,7.5h168.471c4.142,0 7.499-3.357 7.499-7.5z'/%3E%3Cpath d='m71.548,372.984c0.532,3.743 3.742,6.445 7.416,6.445 0.351,0 0.708-0.024 1.065-0.075 4.101-0.584 6.953-4.381 6.369-8.481l-19.502-137.124 160.604-70.225v208.976c0,4.143 3.358,7.5 7.5,7.5 4.143,0 7.5-3.357 7.5-7.5v-208.976l109.484,47.873c0.043,0.02 0.087,0.038 0.13,0.057l50.99,22.296-19.501,137.11c-0.584,4.101 2.268,7.897 6.369,8.48 4.09,0.596 7.897-2.268 8.48-6.369l20.304-142.754c0.475-3.335-1.333-6.578-4.42-7.928l-51.993-22.734-6.322-98.186c-0.896-13.907-12.961-25.222-26.897-25.222h-47.101v-60.647c0-2.832-1.595-5.422-4.123-6.697-0.712-0.36-17.749-8.803-42.9-8.803-25.152,0-42.188,8.443-42.901,8.803-2.528,1.275-4.124,3.865-4.124,6.697v60.647h-47.101c-13.936,0-26.002,11.314-26.897,25.221l-6.322,98.187-51.992,22.734c-3.087,1.35-4.895,4.593-4.42,7.928l20.305,142.767zm131.427-352.5c5.757-2.129 17.187-5.484 32.025-5.484 14.711,0 26.228,3.375 32.024,5.503v55.645h-64.049v-55.664zm-74.029,81.848c0.391-6.063 5.853-11.185 11.928-11.185h188.25c6.075,0 11.538,5.122 11.929,11.185l5.824,90.46-108.873-47.605c-0.237-0.101-0.456-0.183-0.678-0.256-0.019-0.006-0.038-0.015-0.057-0.021-0.515-0.163-1.054-0.27-1.611-0.318-0.44-0.039-0.882-0.039-1.322,0-0.555,0.049-1.093,0.155-1.606,0.318-0.022,0.007-0.042,0.016-0.064,0.023-0.22,0.072-0.437,0.152-0.647,0.244-0.025,0.009-108.898,47.615-108.898,47.615l5.825-90.46z'/%3E%3Cpath d='m7.5,410c14.17,0 27.804-5.631 37.928-15.386 10.123,9.756 23.744,15.386 37.894,15.386 14.186,0 27.828-5.627 37.955-15.379 10.102,9.751 23.725,15.379 37.903,15.379 14.375,0 27.787-5.511 37.932-15.366 10.1,9.743 23.719,15.366 37.89,15.366 14.16,0 27.784-5.623 37.907-15.366 10.122,9.855 23.528,15.366 37.915,15.366 14.17,0 27.803-5.63 37.927-15.386 10.124,9.756 23.758,15.386 37.928,15.386 14.178,0 27.801-5.627 37.902-15.378 10.124,9.751 23.753,15.378 37.919,15.378 4.143,0 7.5-3.357 7.5-7.5s-3.357-7.5-7.5-7.5c-12.674,0-24.3-5.896-31.896-16.174-1.414-1.914-3.651-3.043-6.031-3.043-2.389,0.002-4.628,1.136-6.04,3.054-7.45,10.121-19.358,16.163-31.854,16.163-12.488,0-24.412-6.046-31.896-16.174-1.414-1.914-3.652-3.043-6.032-3.043s-4.618,1.129-6.032,3.043c-7.484,10.128-19.406,16.174-31.895,16.174-12.651,0-24.265-5.896-31.863-16.175-1.414-1.913-3.652-3.042-6.031-3.042-2.38,0-4.617,1.129-6.031,3.043-7.486,10.127-19.409,16.174-31.897,16.174-12.497,0-24.405-6.042-31.855-16.163-1.411-1.916-3.646-3.049-6.025-3.054-2.389,0-4.623,1.124-6.038,3.03-7.633,10.288-19.262,16.187-31.904,16.187-12.496,0-24.405-6.042-31.854-16.163-1.412-1.918-3.651-3.052-6.033-3.054-2.386,0-4.625,1.129-6.039,3.043-7.483,10.128-19.421,16.174-31.932,16.174-12.464,0-24.375-6.047-31.864-16.176-1.415-1.913-3.652-3.041-6.032-3.041s-4.617,1.13-6.031,3.043c-7.595,10.278-19.22,16.174-31.895,16.174-4.142,0-7.5,3.357-7.5,7.5s3.358,7.5 7.5,7.5z'/%3E%3Cpath d='m462.5,455c-12.674,0-24.3-5.896-31.896-16.174-1.414-1.914-3.651-3.043-6.031-3.043-2.389,0.002-4.628,1.136-6.04,3.054-7.45,10.121-19.358,16.163-31.854,16.163-12.488,0-24.412-6.046-31.896-16.174-1.414-1.914-3.652-3.043-6.032-3.043s-4.618,1.129-6.032,3.043c-7.484,10.128-19.406,16.174-31.895,16.174-12.651,0-24.265-5.896-31.863-16.175-1.414-1.913-3.652-3.042-6.031-3.042-2.38,0-4.617,1.129-6.031,3.043-7.486,10.127-19.409,16.174-31.897,16.174-12.497,0-24.405-6.042-31.855-16.163-1.411-1.916-3.646-3.049-6.025-3.054-2.389,0-4.623,1.124-6.038,3.03-7.633,10.288-19.262,16.187-31.904,16.187-12.496,0-24.405-6.042-31.854-16.163-1.412-1.918-3.651-3.052-6.033-3.054-2.386,0-4.625,1.129-6.039,3.043-7.483,10.128-19.421,16.174-31.932,16.174-12.464,0-24.375-6.047-31.864-16.176-1.415-1.913-3.652-3.041-6.032-3.041s-4.617,1.13-6.031,3.043c-7.595,10.278-19.22,16.174-31.895,16.174-4.142,0-7.5,3.357-7.5,7.5s3.358,7.5 7.5,7.5c14.17,0 27.804-5.631 37.928-15.386 10.123,9.756 23.744,15.386 37.894,15.386 14.186,0 27.828-5.627 37.955-15.379 10.102,9.751 23.725,15.379 37.903,15.379 14.375,0 27.787-5.511 37.932-15.366 10.1,9.743 23.719,15.366 37.89,15.366 14.16,0 27.784-5.623 37.907-15.366 10.122,9.855 23.528,15.366 37.915,15.366 14.17,0 27.803-5.63 37.927-15.386 10.124,9.756 23.758,15.386 37.928,15.386 14.178,0 27.801-5.627 37.902-15.378 10.124,9.751 23.753,15.378 37.919,15.378 4.143,0 7.5-3.357 7.5-7.5s-3.357-7.5-7.5-7.5z'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.modality .air-icon {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 470 470' fill='white' xmlns:xlink='http://www.w3.org/1999/xlink' enable-background='new 0 0 470 470'%3E%3Cg%3E%3Cpath d='m468.931,279.951c-1.355-2.26-3.797-3.642-6.431-3.642h-133.466c-4.142,0-7.5,3.357-7.5,7.5s3.358,7.5 7.5,7.5h120.966l-2.486,4.661c-2.951,5.531-14.614,11.719-25.808,11.719h-120.322c3.31-9.005 5.15-18.824 5.15-29.109 0-14.44-3.606-27.969-9.863-39.594h68.379c4.142,0 7.5-3.357 7.5-7.5s-3.358-7.5-7.5-7.5h-78.854c-7.905-8.875-17.712-15.701-28.696-19.695v-75.57c0-12.009-7.447-22.804-19.435-28.173-1.95-0.873-4.181-0.873-6.131,0-11.988,5.369-19.435,16.164-19.435,28.173v75.57c-10.984,3.994-20.791,10.82-28.696,19.695h-78.853c-4.142,0-7.5,3.357-7.5,7.5s3.358,7.5 7.5,7.5h68.379c-6.257,11.625-9.863,25.154-9.863,39.594 0,10.285 1.84,20.104 5.15,29.109h-120.323c-11.193,0-22.857-6.188-25.808-11.719l-2.485-4.661h121.14c4.142,0 7.5-3.357 7.5-7.5s-3.358-7.5-7.5-7.5h-133.64c-2.634,0-5.076,1.382-6.431,3.642-1.355,2.259-1.426,5.063-0.187,7.388l8.368,15.69c5.88,11.024 23.03,19.66 39.043,19.66h32.089c-2.885,4.727-4.549,10.277-4.549,16.209 0,17.208 14,31.208 31.208,31.208s31.209-14 31.209-31.208c0-5.932-1.664-11.482-4.549-16.209h42.241c12.898,20.612 34.555,34.168 59.057,34.168s46.16-13.556 59.057-34.168h42.241c-2.885,4.727-4.549,10.277-4.549,16.209 0,17.208 14,31.208 31.209,31.208s31.208-14 31.208-31.208c0-5.932-1.664-11.482-4.549-16.209h32.089c16.013,0 33.163-8.636 39.043-19.66l8.368-15.69c1.241-2.325 1.171-5.129-0.185-7.388zm-345.68,58.947c-2.84217e-14,8.938-7.271,16.208-16.209,16.208s-16.208-7.271-16.208-16.208 7.271-16.209 16.208-16.209 16.209,7.272 16.209,16.209zm104.249-210.177c0-5.005 2.803-9.688 7.5-12.802 4.697,3.113 7.5,7.797 7.5,12.802v72.012c-2.466-0.282-4.967-0.432-7.5-0.432s-5.034,0.15-7.5,0.432v-72.012zm7.5,213.136c-31.173,0-56.534-28.386-56.534-63.277s25.361-63.278 56.534-63.278 56.534,28.387 56.534,63.278-25.361,63.277-56.534,63.277zm144.167-2.959c0,8.938-7.271,16.208-16.208,16.208s-16.209-7.271-16.209-16.208 7.271-16.209 16.209-16.209 16.208,7.272 16.208,16.209z'/%3E%3Cpath d='m264.201,250.16h-58.402c-4.142,0-7.5,3.357-7.5,7.5 0,4.143 3.358,7.5 7.5,7.5h58.402c4.142,0 7.5-3.357 7.5-7.5 0-4.143-3.358-7.5-7.5-7.5z'/%3E%3C/g%3E%3C/svg%3E ");
}
.modality .packaging-icon {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='white'%3E%3Cg id='Crate'%3E%3Cpath d='M61,2H3A1,1,0,0,0,2,3V61a1,1,0,0,0,1,1H61a1,1,0,0,0,1-1V3A1,1,0,0,0,61,2ZM12,18.725l7,7V52H12Zm9,9,6,6V52H21Zm8,8,6,6V52H29Zm8,8L45.266,52H37ZM48.094,52,12,15.9V12h4.586L52,47.414V52ZM52,44.586l-7-7V12h7Zm-9-9-6-6V12h6Zm-8-8-6-6V12h6Zm-8-8L19.414,12H27ZM52.586,10H11.414l-6-6H58.586ZM10,11.414V52.586l-6,6V5.414ZM11.414,54H52.586l6,6H5.414ZM54,52.586V11.414l6-6V58.586Z'/%3E%3Crect x='11' y='6' width='2' height='2'/%3E%3Crect x='50' y='6' width='2' height='2'/%3E%3Crect x='11' y='56' width='2' height='2'/%3E%3Crect x='51' y='56' width='2' height='2'/%3E%3Crect x='6' y='11' width='2' height='2'/%3E%3Crect x='6' y='51' width='2' height='2'/%3E%3Crect x='56' y='11' width='2' height='2'/%3E%3Crect x='56' y='51' width='2' height='2'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.options.max-2 .options__field {
  border-radius: 8px;
  gap: 0 !important;
  overflow: hidden;
}
.options.max-2 .options__option {
  border-radius: 0;
  flex-basis: 50%;
  text-align: center;
  line-height: 40px;
  height: 40px;
  font-size: 20px;
  padding: 0;
}

.preset .options__field {
  justify-content: initial;
  gap: 10px;
}
.preset .options__option {
  width: 80px !important;
  text-align: center;
  line-height: 40px;
  border-radius: 8px;
  padding: 0;
}

.simulation {
  /*  .section__body{
      padding: 20px;
      flex-direction: row;
    }*/
  /*
  .row {
    display: flex;
    flex-direction: row;
    width: 100%;
    gap: 10px;
    margin-bottom: 20px;
  }
  */
}
.simulation .column {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 10px;
  margin-bottom: 20px;
}
.simulation .address {
  flex-basis: 40%;
}
.simulation .date {
  flex-basis: 20%;
}
.simulation .simulation {
  height: 30px;
  line-height: 30px;
  font-size: 25px;
}
.simulation .simulation .checkbox__mark {
  height: 30px;
  width: 30px;
}
.simulation .simulation .checkbox__mark:after {
  width: 23px;
  height: 23px;
  margin: 4px;
}
.simulation .checkbox {
  height: 30px;
  line-height: 30px;
}
.simulation .checkbox .checkbox__mark {
  height: 30px;
  width: 30px;
}
.simulation .checkbox .checkbox__mark:after {
  width: 23px;
  height: 23px;
  margin: 4px;
}
.simulation .extras {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-bottom: 20px;
}
.simulation .incoterm .options__field {
  justify-content: initial;
  gap: 10px;
}
.simulation .incoterm .options__option {
  width: 80px !important;
  text-align: center;
  line-height: 40px;
  border-radius: 8px;
  padding: 0;
}

.dedicated .options__field {
  border-radius: 8px;
  gap: 0 !important;
  overflow: hidden;
  width: 470px;
}
.dedicated .options__option {
  border-radius: 0;
  flex-basis: 50%;
  text-align: center;
  line-height: 40px;
  height: 40px;
  font-size: 20px;
  padding: 0;
  background-color: #27324A;
}

.containers .section__body {
  display: grid;
  grid-template: 1fr/repeat(auto-fit, minmax(min-content, 320px));
  grid-gap: 20px;
}
.containers .section__body .container {
  background-color: #071430;
  padding: 10px;
  border-radius: 8px;
}
.containers .section__body .container__head {
  width: 100%;
  margin-bottom: 10px;
  border-radius: 5px;
}
.containers .section__body .container__head canvas {
  border-radius: 5px;
}

.costs .section__body, .production-costs .section__body, .packing-costs .section__body, .cover-costs .section__body, .logistics-costs .section__body {
  display: flex;
  flex-direction: column;
}
.costs__lines, .production-costs__lines, .packing-costs__lines, .cover-costs__lines, .logistics-costs__lines {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.costs__line, .production-costs__line, .packing-costs__line, .cover-costs__line, .logistics-costs__line {
  font-size: 25px;
  background-color: #071430;
  border-radius: 8px;
  padding: 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.costs__total, .production-costs__total, .packing-costs__total, .cover-costs__total, .logistics-costs__total {
  font-size: 25px;
  margin-top: 10px;
  text-align: right;
}

.save-configuration {
  display: flex;
  justify-content: space-between;
}
.save-configuration .btn--save-configuration, .save-configuration .btn--order-configuration {
  margin-top: 15px;
  margin-left: 15px;
}
.save-configuration .total {
  height: 100%;
  margin: 10px 0;
}
.save-configuration .total__footer {
  line-height: 20px;
}
.save-configuration .total .total-configuration-price {
  font-size: 30px;
  line-height: 40px;
  font-weight: bold;
  margin-right: 70px;
  margin-right: 20px;
}
.save-configuration .summary {
  margin: 10px;
  min-width: 200px;
}
.save-configuration .summary__total {
  font-size: 25px;
}
.save-configuration .summary__margin {
  cursor: pointer;
  font-size: 20px;
  width: 100%;
  height: 30px;
}
.save-configuration .summary__margin .actual {
  width: 100%;
  height: 30px;
  font-size: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.save-configuration .summary__margin[data-title] {
  position: relative;
  background-color: #27324A;
}
.save-configuration .summary__margin[data-title]:after {
  font-size: 20px;
  content: attr(data-title);
  background-color: inherit;
  color: white;
  width: 100%;
  border-radius: 5px;
  position: absolute;
  top: 0;
  z-index: 10;
  visibility: hidden;
}
.save-configuration .summary__margin[data-title]:hover:after {
  visibility: visible;
  -webkit-transition: all 1s ease-in-out 0s;
  -moz-transition: all 1s ease-in-out 0s;
  -o-transition: all 1s ease-in-out 0s;
  transition: all 1s ease-in-out 0s;
}

.vertical-divider {
  width: 6px;
  border-radius: 2px;
  background-color: #27324A;
  margin: 14px 10px;
}

.config-date {
  display: flex;
  flex-direction: row;
  gap: 10px;
}
.config-date .input__description {
  line-height: 40px;
}

.simulation .services {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 300px;
}
.simulation .services .service {
  font-size: 18px;
  padding: 0 10px;
  background-color: #27324A;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 10px;
  height: 40px;
  color: white;
  line-height: 40px;
  font-weight: normal;
  min-width: 300px;
}
.simulation .services .service .icon {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve' fill='white' %3E%3Cg%3E%3Cg%3E%3Cpath d='M256,0C114.833,0,0,114.833,0,256s114.833,256,256,256s256-114.853,256-256S397.167,0,256,0z M256,472.341 c-119.275,0-216.341-97.046-216.341-216.341S136.725,39.659,256,39.659S472.341,136.705,472.341,256S375.295,472.341,256,472.341z '/%3E%3C/g%3E%3C/g%3E%3Cg%3E%3Cg%3E%3Cpath d='M355.148,234.386H275.83v-79.318c0-10.946-8.864-19.83-19.83-19.83s-19.83,8.884-19.83,19.83v79.318h-79.318 c-10.966,0-19.83,8.884-19.83,19.83s8.864,19.83,19.83,19.83h79.318v79.318c0,10.946,8.864,19.83,19.83,19.83 s19.83-8.884,19.83-19.83v-79.318h79.318c10.966,0,19.83-8.884,19.83-19.83S366.114,234.386,355.148,234.386z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  width: 25px;
  height: 25px;
  margin: auto 0;
}
.simulation .services .service:hover {
  background-color: #27324A;
  color: white;
}
.simulation .add-service {
  display: none;
  background-color: #ee8216;
  border-radius: 8px;
  padding: 5px;
  margin: 5px 0;
  height: 30px;
}
.simulation .add-service--active {
  display: initial;
}
.simulation .open-folder {
  width: 100%;
  padding: 10px;
  margin-bottom: 0;
  box-sizing: border-box;
}
.simulation .open-folder__header {
  padding: 0;
}
.simulation .open-folder__title {
  font-size: 20px;
}
.simulation .open-folder__message {
  font-size: 20px;
  height: 100px;
  grid-area: 1/1/1/span 5;
}
.simulation .open-folder__message-text {
  line-height: 100px;
}
.simulation .open-folder__message-text {
  font-size: 18px;
  font-weight: normal;
  cursor: pointer;
  display: initial;
}
.simulation .open-folder__body {
  display: grid;
  grid-template: repeat(auto-fit, minmax(min-content, 100px))/repeat(auto-fit, minmax(min-content, 100px));
  gap: 10px;
  min-height: 100px;
}
.simulation .open-folder__footer {
  padding: 0;
  height: 40px;
}
.simulation .open-folder .add-files {
  display: block;
  width: max-content;
  height: 30px;
  box-sizing: border-box;
  padding: 5px 20px !important;
  line-height: 30px;
  font-size: 20px;
  font-weight: normal;
  margin-top: 10px;
}

.import-cargo {
  background-color: #27324A;
  color: white;
  margin-bottom: 20px;
  padding: 5px;
  border-radius: 8px;
  line-height: 20px;
  font-weight: 500;
  font-size: 20px;
  height: auto;
}
.import-cargo__input {
  display: none;
}

#cargo-table-popup .popup-card {
  width: 1000px;
  height: 800px;
}

#cargo-table .sortable__header {
  display: none;
}
#cargo-table .sortable__body {
  overflow: auto;
  position: relative;
}
#cargo-table .sortable__row {
  text-align: center;
}
#cargo-table .sortable__row:hover {
  background-color: #071430;
  color: white;
}

#cargo-preview-popup .popup-card {
  width: 1300px;
  height: 800px;
}
#cargo-preview-popup .preview-section {
  padding: 0;
}
#cargo-preview-popup .preview-section .section__body {
  display: flex;
  flex-direction: column;
  overflow: auto;
  height: 675px;
}
#cargo-preview-popup .preview-section .item {
  background-color: #071430;
}
#cargo-preview-popup .preview-section .item__body {
  display: flex;
  flex-direction: row;
  gap: 10px;
  margin: 10px 0;
}
#cargo-preview-popup .preview-section .first-preview {
  display: none;
}
#cargo-preview-popup .preview-section .first-preview--active {
  display: initial;
}
#cargo-preview-popup .preview-section .import-items {
  width: 100%;
  margin: 25px 0 0 0;
}

.configurator_notes__label {
  font-size: 20px;
  line-height: 30px;
  font-weight: 500;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.configurator_notes__textarea {
  width: calc(100% - 20px);
  height: 100px;
  border-radius: 8px;
  background-color: #27324A;
  border: none;
  padding: 10px;
  font-size: 20px;
  line-height: 20px;
  font-weight: 500;
  resize: none;
}
.configurator_notes__textarea::placeholder {
  color: white;
}

.photo {
  width: 100px;
  height: auto;
  object-fit: cover;
  padding: 5px;
  border-radius: 8px;
  box-sizing: border-box;
  background-color: #071430;
}
.photo__header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  height: 30px;
  align-items: center;
}
.photo__close {
  width: 20px;
  height: 20px;
}
.photo__close .icon-button {
  width: 20px;
  height: 20px;
  top: -5px;
  margin-top: 0 !important;
}
.photo__close .icon-button__icon {
  width: 20px;
  height: 20px;
}
.photo__title {
  font-size: 18px;
  line-height: 18px;
  font-weight: 500;
  cursor: pointer;
  max-width: 80px;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -html-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.photo__thumbnail {
  height: 100px;
}
.photo__thumbnail img {
  width: 90px;
  height: 90px;
  object-fit: scale-down;
  object-position: 50% 50%;
  border-radius: 8px;
}

.lines {
  padding: 50px;
  display: flex;
  flex-direction: column;
}
.lines__body {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.lines .checkbox-icon--locked {
  margin-top: 3px !important;
  padding-left: 30px;
  line-height: 30px;
}
.lines .checkbox-icon--locked .checkbox-icon__icon {
  width: 30px;
  height: 30px;
}

.extra-configuration-details .section__body {
  gap: 10px;
}

.extra-info {
  padding-top: 0;
}
.extra-info .column {
  width: 50%;
}
.extra-info .info-item {
  display: flex;
  gap: 10px;
  font-size: 20px;
}
.extra-info .info-item--group {
  flex-direction: column;
  gap: 5px;
}
.extra-info .info-item__items .info-sub-item {
  display: flex;
  gap: 10px;
}
.extra-info .info-item__items .info-sub-item__value {
  word-break: break-all;
}

.work-window-quotation {
  padding-bottom: 130px;
}

.quotation-details {
  padding: 50px 50px 0 50px;
  display: flex;
  justify-content: space-between;
}
.quotation-details .quotation_status {
  width: 250px;
}
.quotation-details .quotation_status .dropdown__title {
  background-color: #ee8216;
}
.quotation-details .quotation_status .dropdown__items li {
  background-color: #ee8216;
}
.quotation-details .quotation_status .dropdown__items li:hover {
  background-color: #27324A;
}

.general-quotation-data {
  padding: 50px 50px 0 50px;
  gap: 50px;
}
.general-quotation-data .section {
  width: 100%;
  padding: 0;
}

.quotation-props .section__body {
  flex-direction: column;
  gap: 20px;
}
.quotation-props .section__body .row {
  gap: 20px;
}
.quotation-props .section__body .row .date, .quotation-props .section__body .row .select, .quotation-props .section__body .row .number {
  width: 100%;
}

.extra-details .section__body {
  flex-direction: column;
  gap: 10px;
}
.extra-details .extra-detail {
  width: 100%;
  display: flex;
  font-size: 20px;
  align-items: center;
}
.extra-details .extra-detail__description {
  flex: 40%;
  font-size: 22px;
  font-weight: bold;
}
.extra-details .extra-detail__value {
  flex: 60%;
}

.quotation-lines .section__body {
  background-color: transparent;
  flex-direction: column;
  padding: 0;
  gap: 10px;
}

.quotation-line {
  border-radius: 8px;
  padding: 10px;
  background-color: #27324A;
}
.quotation-line__body {
  display: flex;
  gap: 5px;
}
.quotation-line__body .number {
  width: 180px;
}
.quotation-line__body .description input {
  max-width: 500px;
}
.quotation-line__body .item-selector {
  width: 250px;
}
.quotation-line__body .total input {
  width: 200px;
}
.quotation-line__footer {
  display: flex;
  gap: 10px;
}
.quotation-line__footer .detail {
  border-radius: 5px;
  padding: 5px;
  display: flex;
  width: auto;
  background-color: #071430;
  gap: 10px;
  margin-top: 10px;
}

#choose-item .popup-card, #choose-vat-code .popup-card {
  width: 80%;
  height: 80vh;
}
#choose-item .popup-card__content .sortable__body, #choose-vat-code .popup-card__content .sortable__body {
  max-height: calc(80vh - 150px);
}

.vat-code .text__field {
  display: flex;
  width: 100px;
}
.vat-code .text__field input {
  border-radius: 8px 0 0 8px;
}
.vat-code .text__field .percentage {
  background-color: white;
  color: #071430;
  border-radius: 0 8px 8px 0;
  height: 40px;
  line-height: 40px;
  font-size: 20px;
  padding: 0 10px 0 5px;
}

.choose-item .center-card {
  width: 80%;
  height: 900px;
}

.choose-vat-code .center-card {
  width: 80%;
  height: 900px;
}

.save-quotation {
  display: flex;
  justify-content: space-between;
}
.save-quotation .btn--save-quotation {
  margin-top: 15px;
  margin-left: 15px;
}
.save-quotation .total-quotation-price {
  font-size: 30px;
  line-height: 80px;
  font-weight: bold;
  margin-right: 70px;
}
.save-quotation .summary {
  margin: 10px;
}
.save-quotation .summary__total {
  font-size: 25px;
}
.save-quotation .summary__margin {
  cursor: pointer;
  font-size: 20px;
  width: 100%;
  height: 30px;
}
.save-quotation .summary__margin .actual {
  width: 100%;
  height: 30px;
  font-size: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.save-quotation .summary__margin[data-title] {
  position: relative;
  background-color: #27324A;
}
.save-quotation .summary__margin[data-title]:after {
  font-size: 20px;
  content: attr(data-title);
  background-color: inherit;
  color: white;
  width: 100%;
  border-radius: 5px;
  position: absolute;
  top: 0;
  z-index: 10;
  visibility: hidden;
}
.save-quotation .summary__margin[data-title]:hover:after {
  visibility: visible;
  -webkit-transition: all 1s ease-in-out 0s;
  -moz-transition: all 1s ease-in-out 0s;
  -o-transition: all 1s ease-in-out 0s;
  transition: all 1s ease-in-out 0s;
}

.shadow-line__body {
  display: none;
}

.add-line {
  margin-top: 20px;
  width: 100%;
}

/*$width : 40px;
$height : 40px;
$delete_icon_url : url(/media/trash.svg);
$deleted_icon_url : url(/media/trashed.svg);
.remove-line{
  padding-top: 30px;

}

.checkbox-icon--delete{
  height: $height;
  padding-left: $width;
  line-height: $height;
  color: white;
}

.checkbox-icon__icon--delete {
  width: $width;
  height: $height;
  background: $delete_icon_url no-repeat;
}

.checkbox-icon--delete .checkbox-icon__input:checked~.checkbox-icon__icon {
  background: $deleted_icon_url no-repeat;
}*/
.quotation-section {
  margin-top: 50px;
}
.quotation-section .quotations .sortable__header .sortable__row:hover {
  background-color: #27324A;
}
.quotation-section .quotation:hover {
  background-color: #ee8216;
}

.auto-generated {
  height: 30px;
  line-height: 30px;
}
.auto-generated .checkbox__mark {
  height: 30px;
  width: 30px;
}
.auto-generated .checkbox__mark:after {
  width: 25px;
  height: 25px;
  margin: 2.5px;
}

.accounts-selector {
  height: 450px;
}
.accounts-selector .sortable__body {
  max-height: 320px !important;
  /*    overflow-y: auto;
      display: block;
      table-layout: fixed;
      overflow-x: hidden;

      .sortable__row{
        display: table;
        width: 100%;
        table-layout: fixed;
      }*/
}

.project-number.form-group {
  width: 100% !important;
}

#choose-account .popup-card {
  height: 500px;
}

.services {
  box-sizing: border-box;
}
.services__title {
  font-size: 25px;
  margin: 20px 0 0 50px;
}
.services__body {
  padding: 20px 50px 50px 50px;
  margin-bottom: 80px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.service {
  position: relative;
  box-sizing: border-box;
  background-color: #27324A;
  padding: 20px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  cursor: pointer;
}
.service:hover > .service__properties, .service:hover > .service__options {
  display: flex;
}
.service__details {
  box-sizing: border-box;
  display: flex;
  gap: 10px;
}
.service__details .delete {
  height: 100%;
  margin-top: 30px;
}
.service__properties {
  display: none;
  flex-direction: column;
  background-color: #071430;
  padding: 15px;
  border-radius: 8px;
  gap: 15px;
}
.service__properties .add-property {
  background-color: #27324A;
  color: white;
}
.service__properties .add-property:hover {
  background-color: #ee8216;
  color: white;
}
.service__property {
  box-sizing: border-box;
  background-color: #27324A;
  gap: 10px;
  display: flex;
  padding: 10px;
  border-radius: 8px;
  width: 100%;
  position: relative;
}
.service__property .delete {
  height: 100%;
  margin-top: 30px;
}
.service__property:hover > .move .move__controls {
  transform: scale(1);
}
.service__property-value {
  width: 100%;
}
.service__options {
  display: none;
  flex-direction: column;
  background-color: #071430;
  padding: 15px;
  gap: 15px;
  border-radius: 8px;
  -webkit-transition: all 1s ease-in 1s;
  -moz-transition: all 1s ease-in 1s;
  -o-transition: all 1s ease-in 1s;
  transition: all 1s ease-in 1s;
}
.service__options .add-option {
  background-color: #27324A;
  color: white;
}
.service__options .add-option:hover {
  background-color: #ee8216;
  color: white;
}
.service__option {
  box-sizing: border-box;
  background-color: #27324A;
  display: flex;
  padding: 10px;
  border-radius: 8px;
  width: 100%;
  gap: 10px;
  position: relative;
}
.service__option .delete {
  height: 100%;
  margin-top: 30px;
}
.service__option:hover > .move .move__controls {
  transform: scale(1);
}
.service:hover > .move .move__controls {
  transform: scale(1);
}
.service .move {
  position: absolute;
  left: -50px;
  top: 0;
  height: 100%;
  width: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.service .move:hover .move__controls {
  transform: scale(1);
}
.service .move__controls {
  height: 70px;
  width: 30px;
  border-radius: 8px;
  background-color: #27324A;
  display: flex;
  transform: scale(0);
  flex-direction: column;
  justify-content: space-evenly;
  -webkit-transition: all 0.3s ease-in 0.2s;
  -moz-transition: all 0.3s ease-in 0.2s;
  -o-transition: all 0.3s ease-in 0.2s;
  transition: all 0.3s ease-in 0.2s;
}
.service .move__up {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/up-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.service .move__up:hover {
  background-color: initial;
}
.service .move__down {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/down-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.service .move__down:hover {
  background-color: initial;
}

.removed {
  opacity: 0.5;
}
.removed .service__properties, .removed .service__options {
  height: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.blue-print {
  display: none;
}

.save-services .btn--save-services {
  margin: 15px 20px;
}

.simulations {
  box-sizing: border-box;
}
.simulations__title {
  font-size: 25px;
  margin: 20px 0 0 50px;
}
.simulations__body {
  padding: 20px 50px 50px 50px;
  margin-bottom: 80px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.simulation {
  position: relative;
  box-sizing: border-box;
  background-color: #27324A;
  padding: 20px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.simulation__details {
  box-sizing: border-box;
  display: flex;
  gap: 10px;
}
.simulation__details .delete {
  height: 100%;
  margin-top: 30px;
}
.simulation .icon-button {
  margin-top: 30px;
}
.simulation:hover > .move .move__controls {
  transform: scale(1);
}
.simulation .move {
  position: absolute;
  left: -50px;
  top: 0;
  height: 100%;
  width: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.simulation .move:hover .move__controls {
  transform: scale(1);
}
.simulation .move__controls {
  height: 70px;
  width: 30px;
  border-radius: 8px;
  background-color: #27324A;
  display: flex;
  transform: scale(0);
  flex-direction: column;
  justify-content: space-evenly;
  -webkit-transition: all 0.3s ease-in 0.2s;
  -moz-transition: all 0.3s ease-in 0.2s;
  -o-transition: all 0.3s ease-in 0.2s;
  transition: all 0.3s ease-in 0.2s;
}
.simulation .move__up {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/up-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.simulation .move__up:hover {
  background-color: initial;
}
.simulation .move__down {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/down-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.simulation .move__down:hover {
  background-color: initial;
}

.removed {
  opacity: 0.5;
}
.removed .simulation__properties, .removed .simulation__options {
  height: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.blue-print {
  display: none;
}

.save-simulations .btn--save-simulations {
  margin: 15px 20px;
}

.simulation-items {
  padding-bottom: 130px;
}
.simulation-items .section__body {
  flex-direction: column;
  background-color: #071430;
  padding: 0;
  gap: 20px;
}
.simulation-items .simulation-item {
  position: relative;
  box-sizing: border-box;
  background-color: #27324A;
  padding: 20px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.simulation-items .simulation-item__details {
  box-sizing: border-box;
  display: flex;
  gap: 10px;
}
.simulation-items .simulation-item__details .delete {
  height: 100%;
  margin-top: 30px;
}
.simulation-items .simulation-item__details .toggle {
  margin-top: 30px;
}
.simulation-items .simulation-item .icon-button {
  margin-top: 30px;
}
.simulation-items .simulation-item:hover > .move .move__controls {
  transform: scale(1);
}
.simulation-items .simulation-item .add-simulation-option {
  background-color: #071430;
  color: white;
  width: 100%;
}
.simulation-items .simulation-item .move {
  position: absolute;
  left: -50px;
  top: 0;
  height: 100%;
  width: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.simulation-items .simulation-item .move:hover .move__controls {
  transform: scale(1);
}
.simulation-items .simulation-item .move__controls {
  height: 70px;
  width: 30px;
  border-radius: 8px;
  background-color: #27324A;
  display: flex;
  transform: scale(0);
  flex-direction: column;
  justify-content: space-evenly;
  -webkit-transition: all 0.3s ease-in 0.2s;
  -moz-transition: all 0.3s ease-in 0.2s;
  -o-transition: all 0.3s ease-in 0.2s;
  transition: all 0.3s ease-in 0.2s;
}
.simulation-items .simulation-item .move__up {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/up-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.simulation-items .simulation-item .move__up:hover {
  background-color: initial;
}
.simulation-items .simulation-item .move__down {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/down-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.simulation-items .simulation-item .move__down:hover {
  background-color: initial;
}
.simulation-items .simulation__options {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.simulation-items .simulation-option {
  position: relative;
  box-sizing: border-box;
  background-color: #071430;
  padding: 20px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.simulation-items .simulation-option__details {
  box-sizing: border-box;
  display: flex;
  gap: 10px;
}
.simulation-items .simulation-option__details .delete {
  height: 100%;
  margin-top: 30px;
}
.simulation-items .simulation-option__details .toggle {
  margin-top: 30px;
}
.simulation-items .simulation-option__details .toggle__toggle {
  background-color: #27324A;
}
.simulation-items .simulation-option__details .toggle__toggle::before {
  background-color: #071430;
}
.simulation-items .simulation-option .icon-button {
  margin-top: 30px;
}
.simulation-items .simulation-option:hover > .move .move__controls {
  transform: scale(1);
}
.simulation-items .simulation-option .add-simulation-option {
  background-color: #071430;
  color: white;
  width: 100%;
}
.simulation-items .simulation-option .move {
  position: absolute;
  left: -50px;
  top: 0;
  height: 100%;
  width: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.simulation-items .simulation-option .move:hover .move__controls {
  transform: scale(1);
}
.simulation-items .simulation-option .move__controls {
  height: 70px;
  width: 30px;
  border-radius: 8px;
  background-color: #27324A;
  display: flex;
  transform: scale(0);
  flex-direction: column;
  justify-content: space-evenly;
  -webkit-transition: all 0.3s ease-in 0.2s;
  -moz-transition: all 0.3s ease-in 0.2s;
  -o-transition: all 0.3s ease-in 0.2s;
  transition: all 0.3s ease-in 0.2s;
}
.simulation-items .simulation-option .move__up {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/up-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.simulation-items .simulation-option .move__up:hover {
  background-color: initial;
}
.simulation-items .simulation-option .move__down {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/down-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.simulation-items .simulation-option .move__down:hover {
  background-color: initial;
}

.save-simulation-items .btn--save-simulation-items {
  margin: 15px 20px;
}

.presets .section__body, .sets .section__body {
  flex-direction: column;
  background-color: #071430;
  padding: 0;
  gap: 20px;
}
.presets .preset, .presets .set, .sets .preset, .sets .set {
  position: relative;
  box-sizing: border-box;
  background-color: #27324A;
  padding: 20px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.presets .preset__details, .presets .set__details, .sets .preset__details, .sets .set__details {
  box-sizing: border-box;
  display: flex;
  gap: 10px;
}
.presets .preset__details .delete, .presets .set__details .delete, .sets .preset__details .delete, .sets .set__details .delete {
  height: 100%;
  margin-top: 30px;
}
.presets .preset .icon-button, .presets .set .icon-button, .sets .preset .icon-button, .sets .set .icon-button {
  margin-top: 30px;
}
.presets .preset:hover > .move .move__controls, .presets .set:hover > .move .move__controls, .sets .preset:hover > .move .move__controls, .sets .set:hover > .move .move__controls {
  transform: scale(1);
}
.presets .preset .move, .presets .set .move, .sets .preset .move, .sets .set .move {
  position: absolute;
  left: -50px;
  top: 0;
  height: 100%;
  width: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.presets .preset .move:hover .move__controls, .presets .set .move:hover .move__controls, .sets .preset .move:hover .move__controls, .sets .set .move:hover .move__controls {
  transform: scale(1);
}
.presets .preset .move__controls, .presets .set .move__controls, .sets .preset .move__controls, .sets .set .move__controls {
  height: 70px;
  width: 30px;
  border-radius: 8px;
  background-color: #27324A;
  display: flex;
  transform: scale(0);
  flex-direction: column;
  justify-content: space-evenly;
  -webkit-transition: all 0.3s ease-in 0.2s;
  -moz-transition: all 0.3s ease-in 0.2s;
  -o-transition: all 0.3s ease-in 0.2s;
  transition: all 0.3s ease-in 0.2s;
}
.presets .preset .move__up, .presets .set .move__up, .sets .preset .move__up, .sets .set .move__up {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/up-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.presets .preset .move__up:hover, .presets .set .move__up:hover, .sets .preset .move__up:hover, .sets .set .move__up:hover {
  background-color: initial;
}
.presets .preset .move__down, .presets .set .move__down, .sets .preset .move__down, .sets .set .move__down {
  height: 30px;
  width: 30px;
  padding: 0;
  margin: 0;
  background-color: initial;
  background-image: url("/media/down-arrow.svg");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: center;
}
.presets .preset .move__down:hover, .presets .set .move__down:hover, .sets .preset .move__down:hover, .sets .set .move__down:hover {
  background-color: initial;
}
.presets .sets, .sets .sets {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.presets .set, .sets .set {
  background-color: #071430;
}

.save-presets .btn--save-presets {
  margin: 15px 20px;
}

#invoice-list.sortable {
  margin: 25px 0 0 0 !important;
}

/*# sourceMappingURL=bundle.css.map */