/*!*************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/src/index.js??ruleSet[1].rules[0].use[3]!./node_modules/sass-loader/dist/cjs.js!./src/sass/index.scss ***!
  \*************************************************************************************************************************************************************************************/
.overlay {
  position: absolute;
  background-color: #b1b2b3;
  opacity: 1;
  /*  top: 0;
     left: 0;*/
  width: 100%;
  height: 100%;
  /*color: black;*/
  z-index: 100;
  max-width: 1200px !important;
  align-content: center;
  margin: 0 auto;
}

.cssload-loading {
  position: absolute;
  left: 50%;
  top: 50%;
  opacity: 1 !important;
  width: 23px;
  height: 23px;
  margin: -12px 0 0 -12px;
  z-index: 101; /* Just to keep it at the very top */
}

.cssload-loading i {
  position: absolute;
  top: 23px;
  left: 23px;
  display: block;
  width: 23px;
  height: 23px;
  background: rgb(60, 180, 152);
  border-radius: 23px;
  animation: cssload-spin2 1.73s ease-in-out infinite;
  -o-animation: cssload-spin2 1.73s ease-in-out infinite;
  -ms-animation: cssload-spin2 1.73s ease-in-out infinite;
  -webkit-animation: cssload-spin2 1.73s ease-in-out infinite;
  -moz-animation: cssload-spin2 1.73s ease-in-out infinite;
}

.cssload-loading i:first-child {
  top: -23px;
  left: 0;
  background: rgb(0, 0, 0);
  animation: cssload-spin 1.73s ease-in-out infinite;
  -o-animation: cssload-spin 1.73s ease-in-out infinite;
  -ms-animation: cssload-spin 1.73s ease-in-out infinite;
  -webkit-animation: cssload-spin 1.73s ease-in-out infinite;
  -moz-animation: cssload-spin 1.73s ease-in-out infinite;
}

.cssload-loading i:last-child {
  top: 23px;
  left: -23px;
  background: rgb(221, 0, 96);
  animation: cssload-spin3 1.73s ease-in-out infinite;
  -o-animation: cssload-spin3 1.73s ease-in-out infinite;
  -ms-animation: cssload-spin3 1.73s ease-in-out infinite;
  -webkit-animation: cssload-spin3 1.73s ease-in-out infinite;
  -moz-animation: cssload-spin3 1.73s ease-in-out infinite;
}

@keyframes cssload-spin {
  0% {
    top: -23px;
    left: 0;
    transform: scale(1);
  }
  17% {
    transform: scale(0.5);
  }
  33% {
    top: 23px;
    left: 23px;
    transform: scale(1);
  }
  50% {
    transform: scale(0.5);
  }
  66% {
    top: 23px;
    left: -23px;
    transform: scale(1);
  }
  83% {
    transform: scale(0.5);
  }
  100% {
    top: -23px;
    left: 0;
    transform: scale(1);
  }
}
@-o-keyframes cssload-spin {
  0% {
    top: -23px;
    left: 0;
    -o-transform: scale(1);
  }
  17% {
    -o-transform: scale(0.5);
  }
  33% {
    top: 23px;
    left: 23px;
    -o-transform: scale(1);
  }
  50% {
    -o-transform: scale(0.5);
  }
  66% {
    top: 23px;
    left: -23px;
    -o-transform: scale(1);
  }
  83% {
    -o-transform: scale(0.5);
  }
  100% {
    top: -23px;
    left: 0;
    -o-transform: scale(1);
  }
}
@-ms-keyframes cssload-spin {
  0% {
    top: -23px;
    left: 0;
    -ms-transform: scale(1);
  }
  17% {
    -ms-transform: scale(0.5);
  }
  33% {
    top: 23px;
    left: 23px;
    -ms-transform: scale(1);
  }
  50% {
    -ms-transform: scale(0.5);
  }
  66% {
    top: 23px;
    left: -23px;
    -ms-transform: scale(1);
  }
  83% {
    -ms-transform: scale(0.5);
  }
  100% {
    top: -23px;
    left: 0;
    -ms-transform: scale(1);
  }
}
@-webkit-keyframes cssload-spin {
  0% {
    top: -23px;
    left: 0;
    -webkit-transform: scale(1);
  }
  17% {
    -webkit-transform: scale(0.5);
  }
  33% {
    top: 23px;
    left: 23px;
    -webkit-transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.5);
  }
  66% {
    top: 23px;
    left: -23px;
    -webkit-transform: scale(1);
  }
  83% {
    -webkit-transform: scale(0.5);
  }
  100% {
    top: -23px;
    left: 0;
    -webkit-transform: scale(1);
  }
}
@-moz-keyframes cssload-spin {
  0% {
    top: -23px;
    left: 0;
    -moz-transform: scale(1);
  }
  17% {
    -moz-transform: scale(0.5);
  }
  33% {
    top: 23px;
    left: 23px;
    -moz-transform: scale(1);
  }
  50% {
    -moz-transform: scale(0.5);
  }
  66% {
    top: 23px;
    left: -23px;
    -moz-transform: scale(1);
  }
  83% {
    -moz-transform: scale(0.5);
  }
  100% {
    top: -23px;
    left: 0;
    -moz-transform: scale(1);
  }
}
@keyframes cssload-spin2 {
  0% {
    top: 23px;
    left: 23px;
    transform: scale(1);
  }
  17% {
    transform: scale(0.5);
  }
  33% {
    top: 23px;
    left: -23px;
    transform: scale(1);
  }
  50% {
    transform: scale(0.5);
  }
  66% {
    top: -23px;
    left: 0;
    transform: scale(1);
  }
  83% {
    transform: scale(0.5);
  }
  100% {
    top: 23px;
    left: 23px;
    transform: scale(1);
  }
}
@-o-keyframes cssload-spin2 {
  0% {
    top: 23px;
    left: 23px;
    -o-transform: scale(1);
  }
  17% {
    -o-transform: scale(0.5);
  }
  33% {
    top: 23px;
    left: -23px;
    -o-transform: scale(1);
  }
  50% {
    -o-transform: scale(0.5);
  }
  66% {
    top: -23px;
    left: 0;
    -o-transform: scale(1);
  }
  83% {
    -o-transform: scale(0.5);
  }
  100% {
    top: 23px;
    left: 23px;
    -o-transform: scale(1);
  }
}
@-ms-keyframes cssload-spin2 {
  0% {
    top: 23px;
    left: 23px;
    -ms-transform: scale(1);
  }
  17% {
    -ms-transform: scale(0.5);
  }
  33% {
    top: 23px;
    left: -23px;
    -ms-transform: scale(1);
  }
  50% {
    -ms-transform: scale(0.5);
  }
  66% {
    top: -23px;
    left: 0;
    -ms-transform: scale(1);
  }
  83% {
    -ms-transform: scale(0.5);
  }
  100% {
    top: 23px;
    left: 23px;
    -ms-transform: scale(1);
  }
}
@-webkit-keyframes cssload-spin2 {
  0% {
    top: 23px;
    left: 23px;
    -webkit-transform: scale(1);
  }
  17% {
    -webkit-transform: scale(0.5);
  }
  33% {
    top: 23px;
    left: -23px;
    -webkit-transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.5);
  }
  66% {
    top: -23px;
    left: 0;
    -webkit-transform: scale(1);
  }
  83% {
    -webkit-transform: scale(0.5);
  }
  100% {
    top: 23px;
    left: 23px;
    -webkit-transform: scale(1);
  }
}
@-moz-keyframes cssload-spin2 {
  0% {
    top: 23px;
    left: 23px;
    -moz-transform: scale(1);
  }
  17% {
    -moz-transform: scale(0.5);
  }
  33% {
    top: 23px;
    left: -23px;
    -moz-transform: scale(1);
  }
  50% {
    -moz-transform: scale(0.5);
  }
  66% {
    top: -23px;
    left: 0;
    -moz-transform: scale(1);
  }
  83% {
    -moz-transform: scale(0.5);
  }
  100% {
    top: 23px;
    left: 23px;
    -moz-transform: scale(1);
  }
}
@keyframes cssload-spin3 {
  0% {
    top: 23px;
    left: -23px;
    transform: scale(1);
  }
  17% {
    transform: scale(0.5);
  }
  33% {
    top: -23px;
    left: 0;
    transform: scale(1);
  }
  50% {
    transform: scale(0.5);
  }
  66% {
    top: 23px;
    left: 23px;
    transform: scale(1);
  }
  83% {
    transform: scale(0.5);
  }
  100% {
    top: 23px;
    left: -23px;
    transform: scale(1);
  }
}
@-o-keyframes cssload-spin3 {
  0% {
    top: 23px;
    left: -23px;
    -o-transform: scale(1);
  }
  17% {
    -o-transform: scale(0.5);
  }
  33% {
    top: -23px;
    left: 0;
    -o-transform: scale(1);
  }
  50% {
    -o-transform: scale(0.5);
  }
  66% {
    top: 23px;
    left: 23px;
    -o-transform: scale(1);
  }
  83% {
    -o-transform: scale(0.5);
  }
  100% {
    top: 23px;
    left: -23px;
    -o-transform: scale(1);
  }
}
@-ms-keyframes cssload-spin3 {
  0% {
    top: 23px;
    left: -23px;
    -ms-transform: scale(1);
  }
  17% {
    -ms-transform: scale(0.5);
  }
  33% {
    top: -23px;
    left: 0;
    -ms-transform: scale(1);
  }
  50% {
    -ms-transform: scale(0.5);
  }
  66% {
    top: 23px;
    left: 23px;
    -ms-transform: scale(1);
  }
  83% {
    -ms-transform: scale(0.5);
  }
  100% {
    top: 23px;
    left: -23px;
    -ms-transform: scale(1);
  }
}
@-webkit-keyframes cssload-spin3 {
  0% {
    top: 23px;
    left: -23px;
    -webkit-transform: scale(1);
  }
  17% {
    -webkit-transform: scale(0.5);
  }
  33% {
    top: -23px;
    left: 0;
    -webkit-transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.5);
  }
  66% {
    top: 23px;
    left: 23px;
    -webkit-transform: scale(1);
  }
  83% {
    -webkit-transform: scale(0.5);
  }
  100% {
    top: 23px;
    left: -23px;
    -webkit-transform: scale(1);
  }
}
@-moz-keyframes cssload-spin3 {
  0% {
    top: 23px;
    left: -23px;
    -moz-transform: scale(1);
  }
  17% {
    -moz-transform: scale(0.5);
  }
  33% {
    top: -23px;
    left: 0;
    -moz-transform: scale(1);
  }
  50% {
    -moz-transform: scale(0.5);
  }
  66% {
    top: 23px;
    left: 23px;
    -moz-transform: scale(1);
  }
  83% {
    -moz-transform: scale(0.5);
  }
  100% {
    top: 23px;
    left: -23px;
    -moz-transform: scale(1);
  }
}
.btn-focused {
  border-bottom: 2px solid #000000;
  color: #ffffff;
}

.a_btn {
  padding: 0; /* Remove default padding */
  width: auto;
  white-space: nowrap;
  min-width: 33px;
  min-height: 33px;
  display: inline-block; /* Keep it inline */
  text-align: center; /* Center text horizontally */
  vertical-align: middle; /* Align text vertically */
  font-weight: 400;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid #b1b2b3;
  padding: 0rem 0.3rem;
  border-radius: 5px !important;
}
.a_btn:hover {
  background-color: currentColor;
}
.a_btn:hover i,
.a_btn:hover b,
.a_btn:hover u {
  color: #fff !important;
}
.a_btn:focus {
  outline: 0;
}
.a_btn-small {
  margin: 0px 1px 1px 0px;
  padding: 0px;
  height: 30px;
  width: 30px;
}
.a_btn_tiny {
  margin: 0px;
  margin-left: 5px;
  padding: 0px;
  height: 15px;
  width: 15px;
}
.a_btn-clear {
  background-color: transparent;
  border: none;
  /*&:after {
  	color: $rehau-black !important;
  }*/
}
.a_btn-red {
  margin: 0;
  background-color: #dd0060 !important;
}
.a_btn-red i {
  color: #ffffff;
}
.a_btn-red:hover {
  color: #dd0060 !important;
  background-color: #ffffff !important;
  border: 1px solid #dd0060 !important;
}
.a_btn-red:hover i {
  color: #dd0060;
}
.a_btn-green {
  background-color: #37a58c !important;
}
.a_btn-green i {
  color: #ffffff;
}
.a_btn-green:hover {
  color: #37a58c !important;
  background-color: #ffffff !important;
  border: 1px solid #37a58c !important;
}
.a_btn-green:hover i {
  color: #37a58c;
}
.a_btn-black {
  border-radius: 0;
  margin: 0;
  background-color: #000000 !important;
  color: #ffffff !important;
}
.a_btn-black:hover {
  color: #000000 !important;
  background-color: #ffffff !important;
  border: 1px solid #000000 !important;
}
.a_btn-gray {
  border-radius: 0;
  margin: 0;
  background-color: #b1b2b3 !important;
  color: #ffffff !important;
}
.a_btn-gray:hover {
  color: #b1b2b3 !important;
  background-color: #ffffff !important;
  border: 1px solid #b1b2b3 !important;
}
.a_btn-graydark {
  border-radius: 0;
  margin: 0;
  background-color: #6f7c80 !important;
  color: #ffffff !important;
}
.a_btn-graydark:hover {
  color: #6f7c80 !important;
  background-color: #ffffff !important;
  border: 1px solid #6f7c80 !important;
}
.a_btn-datatable {
  height: 32px !important;
  margin: 0;
  padding: 5px;
}
.a_btn-disabled {
  background: #e5e5e5 !important;
  color: #555 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}
.a_btn:disabled {
  background-color: #e5e5e5 !important;
  color: #555; /* Gray text */
  cursor: not-allowed; /* Change cursor to 'not allowed' */
  opacity: 0.6; /* Slightly transparent */
  pointer-events: none !important;
}

.btn {
  display: inline-block;
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  margin: 0.375rem 0.75rem;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  margin: unset;
  border-radius: 5px;
  cursor: pointer;
}
.btn:hover {
  color: #ffffff;
}
.btn:hover::before {
  width: 100%;
}
.btn-logout {
  padding-right: unset !important;
}
.btn-accept-cookies {
  background-color: #37a58c !important;
  opacity: unset !important;
  padding: 0.375rem 0.75rem !important;
  margin-right: 2.3rem !important;
  font-weight: unset !important;
  text-shadow: unset;
}
.btn-project-doc {
  margin-right: unset !important;
}
.btn-reclamations {
  max-width: 80px !important;
  width: 80px !important;
  color: #fff;
  background-color: #dd0060;
  height: 32px;
  padding: 2px;
}
.btn-reclamations:hover {
  color: #fff;
  background-color: #000000;
}
.btn-reclamations::after {
  color: #fff;
  background-color: #dd0060;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  font-size: 16px !important;
  content: "\f054";
  display: block;
  height: 100%;
  position: absolute;
  left: 100%;
  top: 0;
}
.btn-secondary-nc {
  background-color: #7f7f7f;
  color: #ffffff;
  width: 100%;
  margin-bottom: 10px;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin: 2px;
}
.btn-secondary-nc:hover {
  background-color: #7f7f7f;
}
.btn-filter {
  max-width: 60px !important;
  width: 80px !important;
  color: #fff;
  background-color: #37a58c;
  height: 32px;
}
.btn-filter:hover {
  color: #fff;
  background-color: #000000;
}
.btn-filter::after {
  color: #fff;
  background-color: #37a58c;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  font-size: 16px !important;
  content: "\f054";
  display: block;
  height: 100%;
  position: absolute;
  left: 100%;
  top: 0;
  padding: inherit;
}
.btn-no-border {
  border-radius: 0 !important;
}

.editsave {
  width: 3rem;
}

.button-icon {
  max-height: 20px;
  max-width: 20px;
}

.pictureButtonsContainer {
  display: flex;
}

.pictureButton {
  width: 50px;
  height: auto;
  margin: 10px 15px 10px 0px;
}

/*.btn {
	&-reclamations {
		max-width: 80px !important;
		width: 80px !important;
		color: #fff;
		background-color: $rehau_red;
		height: 32px;
		padding: 2px;

		&:hover {
			color: #fff;
			background-color: $rehau_black;
		}

		&::after {
			color: #fff;
			background-color: $rehau_red;
			font-family: "Font Awesome 5 Free";
			font-weight: 600;
			font-size: 16px !important;
			content: "\f054";
			display: block;
			height: 100%;
			position: absolute;
			left: 100%;
			top: 0;
		}
	}

	&-secondary {
		&-nc {
			background-color: #7f7f7f;
			color: #ffffff;
			width: 100%;
			margin-bottom: 10px;
			white-space: nowrap !important;
			overflow: hidden !important;
			text-overflow: ellipsis !important;
			margin: 2px;

			&:hover {
				background-color: #7f7f7f;
			}
		}
	}

	&-filter {
		max-width: 60px !important;
		width: 80px !important;
		color: #fff;
		background-color: $rehau_green;
		height: 32px;

		&:hover {
			color: #fff;
			background-color: $rehau_black;
		}

		&::after {
			color: #fff;
			background-color: $rehau_green;
			font-family: "Font Awesome 5 Free";
			font-weight: 600;
			font-size: 16px !important;
			content: "\f054";
			display: block;
			height: 100%;
			position: absolute;
			left: 100%;
			top: 0;
			padding: inherit;
		}
	}
}
*/
/*.btn_custom_filter {
	height: 20px;
	width: 20px;
}*/
.cinput {
  width: 100%;
  height: 40px !important;
}
.cinput[type=number] {
  appearance: textfield;
}
.cinput[type=number]::-webkit-inner-spin-button, .cinput[type=number]::-webkit-outer-spin-button {
  margin: 0;
  appearance: none;
}
.cinput[type=date]::-webkit-inner-spin-button {
  display: none;
  appearance: none;
}
.cinput.-secure-field {
  position: absolute;
  left: -6666px;
}
.cinput .-w-auto {
  width: auto;
}
.cinput.-disabled {
  background: #e5e5e5;
}

.cinput--file-upload {
  display: flex;
  flex-wrap: nowrap;
  height: 2.2rem;
  max-height: 2.2rem;
  padding-left: 0;
  width: 100vw;
}
.cinput--file-upload + [type=file] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  white-space: nowrap;
  clip: rect(0, 0, 0, 0);
}

.cinput__file-info,
.cinput__file-btn {
  display: table-cell;
  width: 100%;
  padding: 0 1rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cinput__file-btn {
  height: 100%;
  border: 0 none;
  background: #000000;
  color: #ffffff;
}

.cinput__file-btn:hover {
  background: #7f7f7f;
  cursor: pointer;
}

.input-name-link {
  width: 100%;
  height: 100%;
  background-color: #e5e5e5;
  padding: 7px 0 7px 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.custom-input-class {
  height: 100%;
}

.custom-control-input:checked ~ .custom-control-label::before {
  border-color: #000000;
  background-color: #000000;
}

.flag {
  background-size: contain;
  background-position: 50%;
  background-repeat: no-repeat;
  position: relative;
  display: inline-block;
  width: 1.33333333em;
  line-height: 1em;
}

.flag:before {
  content: "";
  display: inline-block;
  width: 25px;
  height: 25px;
  vertical-align: middle;
  margin-right: 10px;
  background-size: contain;
  background-repeat: no-repeat;
}

.de {
  background-image: url(https://www.countryflags.io/de/flat/32.png);
}

.en {
  background-image: url(https://www.countryflags.io/eu/flat/32.png);
}

.landingpageLayout {
  max-width: 1200px !important;
  align-content: center;
  background-color: slategray;
  margin: 0 auto;
  overflow: auto;
}

.info-text {
  padding-top: 1rem;
  color: #808080;
  /*white-space: nowrap;*/
  /*overflow: hidden;*/
  /*text-overflow: ellipsis;*/
  /*word-wrap: break-word;*/
  text-wrap: pretty;
}

.menu-item {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 5rem;
  border-radius: 3px;
}
.menu-item:hover {
  background-color: #e5e5e5;
  color: #e5e5e5;
  text-decoration: none;
}
.menu-item a {
  justify-content: center;
  align-items: center;
  text-decoration: none;
  width: 100%;
}
.menu-item img {
  margin-left: 2rem;
  height: 60px;
  width: 60px;
}
.menu-item span {
  text-align: center;
  color: #808080;
  font-size: 18px;
  font-weight: 600;
  margin-right: 2rem;
}

.info-top {
  display: flex;
  align-items: center;
  /*	max-height: 20rem;
  height: calc(30vw);*/
  overflow: hidden !important;
  margin: 0;
  padding: 0;
  border-bottom: 2px solid #37a58c;
  z-index: 1;
  position: relative;
  /*min-height: 150px;*/
  width: 100%;
  max-width: 100%;
  height: auto;
  overflow: hidden;
}

.info-language {
  position: absolute;
  right: 1rem;
  margin: 0;
  padding: 0;
}

.info-logo-placeholder {
  position: absolute;
  right: 2rem;
  top: 2rem;
  border: 1px solid #808080;
  border-radius: 5px;
  width: 100px;
  height: 50px;
  margin: 0;
  padding: 0 2px;
}
.info-logo-placeholder > img {
  margin: 0 auto;
}

.info-logo {
  position: absolute;
  right: 2rem;
  top: 2rem;
  border: 1px solid #808080;
  border-radius: 5px;
  width: 100px;
  height: 100px;
  margin: 0;
  padding: 0 2px;
}
.info-logo > img {
  width: 100%;
  height: 100%;
}

.info-header {
  position: absolute;
  border-radius: 3px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 4rem;
}
.info-header > span {
  color: #ffffff;
  font-size: 36px;
  font-weight: 700;
}

.info-details {
  position: absolute;
  top: 70%;
  background-color: #ffffff;
  border-radius: 3px;
  width: 90%;
}
.info-details > span {
  margin-left: 2rem;
  font-size: 20px;
  font-weight: 500;
  color: #808080;
}

.menu-image {
  padding: 1rem 0 1rem 2rem;
  margin: 0;
}
.menu-image img {
  max-height: 48px !important;
  max-width: 48px !important;
}

.info-sidebar-text {
  z-index: 88888 !important;
  display: flex;
  align-items: center !important;
  color: #000000 !important;
  font-size: 15px;
  font-weight: 600;
  padding-top: 1rem;
}

.impressum-text {
  position: absolute;
  top: 0;
  visibility: hidden;
}

.landingpageMenu {
  box-shadow: 14px 0px 28px -14px rgba(0, 0, 0, 0.25), 10px 0px 10px -10px rgba(0, 0, 0, 0.22) !important;
  opacity: 0.9;
  z-index: 3;
}

.language_flag {
  width: 50px;
  height: 40px;
  padding-bottom: 1rem;
  padding: 0 0.1rem;
  margin: 0;
}

.selected {
  border: 2px solid #37a58c !important;
  border-radius: 5px;
}

#infoSidebar {
  /*height: calc(100vh + 5px) !important;*/
  height: 100vh;
}

#infoContent {
  /*height: 100vh;*/
}

#collapsebutton {
  position: sticky;
  top: 1rem;
  margin-left: 0.5rem;
  z-index: 2;
  opacity: 0.7;
}

#partialSidebar {
  position: sticky;
  z-index: 2;
  top: 3.5rem;
  width: 95vw;
  height: auto;
  margin-left: 1rem;
  background-color: #ffffff;
  opacity: 0.9;
  box-shadow: 0px 10px 11px 0px rgba(0, 0, 0, 0.25);
}
#partialSidebar > span {
  text-align: left;
  color: #000 !important;
}

#infoMenulist {
  width: 100%;
}

.element-image-placeholder {
  padding-left: 100px;
  padding-top: 100px;
}

.element-image {
  max-height: 400px;
  max-width: 400px;
  border: 1px solid #d7d7d7;
}

.position-nav-item {
  display: block;
}

.hidden-menu {
  display: none !important;
}

.lp-parent {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.row-item-custom {
  box-shadow: unset !important;
}
.row-item-custom div > div {
  height: 41px;
  max-height: 41px;
  display: flex !important;
  justify-content: center !important;
}

.delete-col-custom {
  display: flex !important;
  justify-content: flex-end !important;
}
.delete-col-custom .delete-button {
  position: relative;
  left: 5px;
}

.row-item-file {
  position: relative;
  left: -5px;
  width: 40px;
  height: 40px;
}

.col-name-custom div {
  white-space: normal !important;
  word-break: break-all !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background-color: rgba(229, 229, 229, 0.5) !important;
}

.top-menu-info {
  display: flex;
  height: 50px;
  max-height: 50px;
  background-color: #e5e5e5;
  border-bottom: 1px solid #7f7f7f;
}
.top-menu-info > div {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: unset !important;
  padding-bottom: unset !important;
  background-color: #e5e5e5;
  border-left: unset !important;
}
.top-menu-info > div:first-child {
  height: 50px;
  justify-content: unset;
  border-bottom: 1px solid #7f7f7f;
}
.top-menu-info div:nth-child(2) .navbar-nav {
  height: 100%;
}
.top-menu-info div:nth-child(2) .navbar-nav li {
  display: flex;
  align-items: center;
  justify-content: center;
}
.top-menu-info div:nth-child(2) .navbar-nav li a {
  margin-bottom: unset !important;
}
.top-menu-info div:nth-child(2) .custom-dropdown-class li {
  display: flex;
  justify-content: flex-start;
}
.top-menu-info div:nth-child(3) div:first-child {
  height: 100%;
}
.top-menu-info div:nth-child(3) div:first-child .company-logo-container {
  display: flex;
  align-items: center;
}
.top-menu-info div:nth-child(3) div:first-child .company-logo-container span {
  margin-left: 0.5rem;
}
.top-menu-info div:nth-child(3) div:first-child .language-logo-container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.custom-info-container {
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  white-space: normal !important;
  hyphens: auto !important;
}

/*.add-button {
    background-color: $rehau_green;
    color: $rehau_white !important;
    border-radius: 0 !important;
    text-align: center;
    transition: 0.3s;

    &:hover {
        background-color: $rehau_black;
    }
}

.delete-button {
    background-color: $rehau_red;
    color: $rehau_white !important;
    border-radius: 0 !important;
    text-align: center;
    transition: 0.3s;

    &:hover {
        background-color: $rehau_black;
    }
}

.remove-button {
    margin: 0px 5px;
    position: absolute;
    color: $rehau_gray;
    transition: 0.2s;

    &:hover {
        color: $rehau_red;
    }
}*/
/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0.2rem;
  left: 0;
  height: 20px;
  width: 20px;
  /*background-color: $white;*/
  border: 1px solid #000000;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ffffff;
}

/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #000000;
  /*background-color: $rehau_white;*/
  /*color: $rehau_white !important;*/
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

.container [type=checkbox] {
  display: none !important;
}

.container .checkmark:after {
  left: 6px;
  top: -1px;
  width: 6px;
  height: 16px;
  border: solid #ffffff;
  border-width: 0 1px 1px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(37deg);
}

/*.c-white {
	color: #FFF;
}

.c-black {
	color: $rehau_black;
}

.c-red {
	color: $rehau_red;
}

.c-yellow {
	color: #fff200;
}

.c-green {
	color: $rehau_green;
}

.c-gray {
	color: $rehau_gray;
}

.c-orange {
	color: #ffa500;
}
*/
.bc-green {
  background-color: #37a58c !important;
}

.myNavbar {
  z-index: 10;
  background-color: #ffffff;
  position: relative;
  float: left;
}
.myNavbar a {
  font-size: 1.1rem;
}

.card-transition {
  /*  transition: all 1s;
     transition-timing-function: ease-in;*/
  -webkit-transition: max-height 0.3s ease-in-out, box-shadow 0.1s linear;
  -moz-transition: max-height 0.3s ease-in-out, box-shadow 0.1s linear;
  -o-transition: max-height 0.3s ease-in-out, box-shadow 0.1s linear;
  -ms-transition: max-height 0.3s ease-in-out, box-shadow 0.1s linear;
  transition: max-height 0.3s ease-in-out, box-shadow 0.1s linear;
}

.border-shadow {
  border-radius: 0.25rem;
  border-color: none;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2);
}

.border-shadow-green {
  border-radius: 0.3rem;
  border: 1px solid #37a58c !important;
  box-shadow: 0 0 1px rgb(55, 165, 140), 0 1px 3px rgb(55, 165, 140);
}

.hideme {
  display: none !important;
}

.no-mp {
  margin: 0;
  padding: 0;
}
.no-mp-i {
  margin: 0 !important;
  padding: 0 !important;
}

.centerdiv {
  height: 30px;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  align-items: center;
}

.hidden {
  display: none !important;
}

.login-card {
  max-width: 350px;
  max-height: 700px;
  margin-left: auto;
  margin-right: auto;
  top: 25vh;
}

.background {
  background: rgba(78, 78, 78, 0.5);
}

.filter-invert {
  filter: invert(100%);
}

.wrap {
  word-wrap: break-word;
}

/*select {
	max-width: 200px;*/ /* Set your desired maximum width */
/*overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

option {
	display: block;
	width: 100%;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}*/
.hand-pointer {
  cursor: pointer !important;
}

.hover-border-red:hover {
  border: 2px solid red;
}

.menu-name {
  left: 15px;
  top: 50px;
  position: absolute;
  color: #b1b2b3;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
  max-width: 380px;
}

.deactivated {
  opacity: 0.5;
  pointer-events: none; /* Prevent interaction (clicks, hover, etc.) */
  background-color: #b1b2b3;
}

/*HEIGHT*/
@media screen and (max-height: 800px) {
  .content-wrapper {
    height: 100%;
  }
}
@media screen and (min-height: 801px) {
  .content-wrapper {
    height: 100%;
  }
}
/*HEIGHT*/
/*WIDTH*/
@media screen and (max-width: 800px) {
  .hide-on-w800 {
    display: none;
  }
}
@media screen and (max-width: 1000px) {
  .info-details {
    top: 80%;
  }
  #instructionvideo {
    width: 90%;
  }
  .hide-on-w1000 {
    display: none;
  }
}
@media screen and (min-width: 1199.98px) {
  .auftragDivShadow {
    box-shadow: inset -20px 0px 28px -20px rgba(0, 0, 0, 0.25), inset -9px 0 9px -9px rgba(0, 0, 0, 0.22);
  }
}
@media screen and (max-width: 1023px) {
  #collapsebutton {
    display: block !important;
  }
  #infoSidebar {
    display: none !important;
  }
  #project_additionals {
    top: 44px !important;
  }
}
@media screen and (max-width: 1200px) {
  .auftrag-info-card {
    margin-bottom: 1rem;
  }
}
@media screen and (min-width: 1280px) {
  #collapsebutton {
    display: none !important;
  }
  #partialSidebar {
    display: none !important;
  }
  #infoSidebar {
    display: block !important;
  }
  #project_additionals {
    top: 54px !important;
  }
  .myNavbar {
    display: block !important;
  }
  .top-menu-info {
    display: none !important;
  }
  .info-logo {
    top: 3rem !important;
  }
  .info-logo-placeholder {
    top: 3rem !important;
  }
  .info-language {
    position: absolute;
    bottom: 0; /* Position it at the bottom of the container */
    left: 50%;
    margin-left: 420px;
  }
}
@media screen and (max-width: 1280px) {
  .top-menu > div:first-child {
    padding: 0.8rem !important;
    border-bottom: 1px solid #7f7f7f !important;
    justify-content: center !important;
    display: unset !important;
  }
  .top-menu > div:first-child .logo {
    position: relative;
    bottom: 2px;
    left: 3px;
  }
  .top-menu > div:nth-child(2).show,
  .top-menu div:last-child.show {
    border-bottom: 1px solid #7f7f7f !important;
  }
  .top-menu > div:nth-child(2) ul {
    align-items: flex-start;
  }
  .top-menu > div:nth-child(2) ul li {
    padding: 0.3rem 0;
  }
  .custom-user-name-class {
    max-width: unset !important;
    overflow: unset !important;
    text-overflow: unset !important;
    white-space: unset !important;
  }
}
@media screen and (max-width: 1700px) {
  .custom-user-name-class {
    max-width: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
@media screen and (max-width: 1400px) {
  .custom-user-name-class {
    max-width: 55px;
  }
}
@media screen and (max-width: 1800px) {
  .project-doc-button {
    margin-right: 25px;
  }
}
@media screen and (max-width: 600px) {
  .row-item-file {
    position: relative;
    left: -5px;
    top: 3px;
    width: 30px;
    height: 30px;
  }
}
/*WIDTH*/
.selected-card {
  color: white !important;
  background-color: #3cb498 !important;
  border-radius: 0.25rem;
}

.element-buttons {
  display: inline;
  margin: 0;
  /*padding: 0;*/
}

.card-element {
  overflow: hidden;
  max-height: 1000px;
  transition: max-height 0.3s ease-in-out, box-shadow 0.1s linear;
  margin-top: 10px;
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0, 0, 0, 0.125);
}

.auftragAdminDetails {
  /*display: inline-flex;*/
  border: 1px solid #dd0060;
  /*width: 101%;*/
  padding-left: 1rem;
  margin-right: 1rem;
  border-radius: 0.25rem;
}
.auftragAdminDetails > p {
  text-align: center;
  margin: 0;
  padding: 0;
}

.cards thead {
  display: none;
}
.cards tbody td {
  display: block;
  /*box-shadow: 0 0 2px #37a58c, 0 1px 3px #37a58c;*/
}
.cards tbody tr {
  float: left;
  width: 21rem;
  margin: 0.3rem;
  margin-left: 0px;
  border-radius: 0.25rem;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
}
.cards td:after {
  font-family: "Font Awesome 5 Free";
  font-weight: 800;
  content: "\f054";
  display: block;
  /*height: 100%;*/
  /*position: absolute;*/
  /*left: 100%;*/
  margin-top: -4rem;
  /*padding: inherit;*/
  text-align: right;
  font-size: 30px;
}
.cards td > div {
  position: relative;
  top: -50px;
  text-align: left;
  font-weight: bold;
  padding-bottom: 18px;
  height: 46px;
  margin-top: 14px;
  /*background-color: attr(data-color);*/
  /*&:after {*/
  /*content: attr(data-color);*/
  /*color: attr(data-color);
               top: 50px;
               height: 100%;
               display: block;
               position: relative;
               font-weight: normal;
           }*/
}
.cards td > div:before {
  content: attr(data-details);
  /*color: attr(data-color);*/
  top: 50px;
  height: 100%;
  display: block;
  position: relative;
  font-weight: normal;
}

#detailsDiv {
  /*box-shadow: 0rem 0rem 0.5rem rgba(0, 0, 0, 0.25);*/
  border-radius: 0.25rem;
  background-color: #f8f9fb;
  /*box-shadow: 0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22);*/
}

.admin-info-fixed-details {
  position: fixed;
  width: 72.9%;
  /*width: 100%;*/
  border-bottom: 2px solid #b1b2b3;
  z-index: 15;
  background-color: #fff;
  padding: 1rem 1rem 0 1rem;
  margin: 0;
  /*   padding-left: 1rem;
     padding-right: 1rem;*/
}

#positionTable tbody tr {
  max-height: 50px; /* or whatever height you need to make them all consistent */
}

.modal-responsive {
  position: relative;
  display: table;
  overflow-y: auto;
  overflow-x: auto;
  width: auto;
  height: auto;
  max-width: 95%;
  max-height: 100%;
  /*margin: auto;*/
}
.modal-responsive-sm {
  max-width: 420px;
}
.modal-responsive-md {
  max-width: 500px;
}

.multiline-text {
  word-wrap: break-word;
  white-space: pre-wrap;
  font-size: large;
  font-weight: bold;
  width: 290px;
  padding: 5px 10px;
}

.pointer {
  cursor: pointer !important;
}

.datatable-bottom-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
}

.add-order-button {
  position: absolute;
  right: 15px;
  top: 15px;
}

.separator {
  display: flex;
  align-items: center;
  text-align: center;
}

.separator::before,
.separator::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid #000;
}

.separator:not(:empty)::before {
  margin-right: 0.25em;
}

.separator:not(:empty)::after {
  margin-left: 0.25em;
}

.positionCard {
  position: relative; /* Required for positioning the buttons */
  overflow: hidden; /* To ensure buttons appear within the bounds */
  cursor: pointer; /* To indicate the div is clickable */
  min-height: 80px;
}

.button-container {
  position: absolute;
  bottom: -100%; /* Start hidden below the parent div */
  left: 0;
  right: 0;
  display: flex;
  justify-content: flex-start;
  /*background: rgba(255, 255, 255, 0.9);*/ /* Semi-transparent background */
  transition: bottom 0.3s ease, opacity 0.3s ease;
  opacity: 0;
  pointer-events: none; /* Disable pointer events by default */
}

.button-container .e_btn {
  height: 25px;
  margin: 0px 1px 2px 1px;
  color: black;
  border: none;
  cursor: pointer;
  border-radius: 3px;
  border: 1px solid #dd0060;
  background-color: white;
}

.button-container .e_btn:hover {
  background-color: #b1b2b3;
  color: white;
}

.positionCard:hover .button-container {
  bottom: 0; /* Move into view */
  opacity: 1;
  pointer-events: auto; /* Enable pointer events when visible */
}

/*.datatable-bottom-row {
	display: flex;*/ /* Arrange children in a row */
/*align-items: center;*/ /* Center items vertically */
/*justify-content: flex-start;*/ /* Align items to the left */
/*margin-top: 10px;*/ /* Add some space at the top if needed */
/*}

.dataTables_length,
.pageSelectWrapper {
	margin-right: 10px;*/ /* Space between the two elements */
/*}*/
/* Additional styles to ensure alignment and prevent wrapping */
/*.dataTables_length label {
	margin-bottom: 0;*/ /* Remove margin from the label to prevent extra space */
/*}*/
.pageSelectWrapper {
  margin-left: 1rem;
  padding-left: 1rem;
  border-left: 2px solid;
  display: flex;
  align-items: center;
}

#pageSelect {
  margin-left: 1rem;
  border: 1px solid #ced4da;
  word-wrap: normal;
  width: 60px;
  height: 30px;
  border-radius: 5px;
  padding-left: 5px;
}

.bg-green {
  /*color: white !important;*/
  background-color: #37a58c !important;
}
.bg-green-dark {
  background-color: #2c806c !important;
}

.bg-red {
  /*color: black !important;*/
  background-color: #dd0060 !important;
}
.bg-red-dark {
  background-color: #9b0244 !important;
}

.bg-white {
  color: black !important;
  background-color: #fff !important;
}

.bg-gray {
  /*color: black !important;*/
  background-color: #e5e5e5 !important;
}

.border-clear {
  border: none !important;
}
.border-none {
  border: 1px solid #dee2e6 !important;
  box-shadow: none !important;
}
.border-1 {
  box-shadow: 0px 0px 5px 0px rgb(60, 180, 152);
}
.border-2 {
  box-shadow: 0px 0px 5px 0px rgb(255, 242, 0);
}
.border-3 {
  box-shadow: 0px 0px 5px 0px rgb(221, 0, 96);
}
.border-4 {
  box-shadow: 0px 0px 5px 0px rgb(0, 0, 0);
}
.border-bottom-black {
  border-bottom: 1px solid #000000;
}
.border-left-black {
  border-left: 1px solid #000;
}

.c-white {
  color: #fff !important;
}
.c-black {
  color: #000 !important;
}
.c-red {
  color: #dd0060 !important;
}
.c-yellow {
  color: #fff200 !important;
}
.c-green {
  color: #37a58c !important;
}
.c-gray {
  color: #b1b2b3 !important;
}
.c-darkgray {
  color: #6f7c80 !important;
}
.c-orange {
  color: #ffa500 !important;
}
.c-green {
  color: #3cb498 !important;
}
.c-1 {
  box-shadow: 0px 0px 5px 0px rgb(60, 180, 152);
}
.c-2 {
  box-shadow: 0px 0px 5px 0px rgb(255, 242, 0);
}
.c-3 {
  box-shadow: 0px 0px 5px 0px rgb(221, 0, 96);
}
.c-4 {
  box-shadow: 0px 0px 5px 0px rgb(0, 0, 0);
}

.ts-9 {
  font-size: 9px !important;
}
.ts-10 {
  font-size: 10px !important;
}
.ts-11 {
  font-size: 11px !important;
}
.ts-12 {
  font-size: 12px !important;
}
.ts-14 {
  font-size: 14px !important;
}
.ts-16 {
  font-size: 16px !important;
}
.ts-18 {
  font-size: 18px !important;
}
.ts-20 {
  font-size: 20px !important;
}
.ts-auto {
  /*font-size: 10px !important;*/
  font-size: 1vw !important;
}

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

.z-9 {
  z-index: 9 !important;
}
.z-15 {
  z-index: 15 !important;
}

.pt-5 {
  padding-top: 5rem;
}
.pt-6 {
  padding-top: 6rem;
}
.pt-7 {
  padding-top: 7rem;
}
.pt-8 {
  padding-top: 8rem;
}
.pt-9 {
  padding-top: 9rem;
}
.pt-10 {
  padding-top: 10rem;
}

.no-outline {
  outline: none !important;
}

.center {
  margin: auto;
  padding-top: 10%;
  /*width: 50%;*/
  text-align: center;
  align-items: center;
  /*margin-top: auto;*/
}

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

.custom-padding-unset {
  padding: unset;
}

.dim {
  display: flex;
}
.dim-30 {
  width: 20px !important;
  height: 20px !important;
}

.height-1 {
  height: 1rem;
}
.height-2 {
  height: 2rem;
}
.height-3 {
  height: 3rem;
}
.height-4 {
  height: 4rem;
}
.height-5 {
  height: 4rem;
}

.top-menu {
  display: flex;
  height: 50px;
  max-height: 50px;
  background-color: #e5e5e5;
  border-bottom: 1px solid #7f7f7f;
}
.top-menu > div {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: unset !important;
  padding-bottom: unset !important;
  background-color: #e5e5e5;
  border-left: unset !important;
}
.top-menu > div:first-child {
  height: 50px;
  justify-content: unset;
  border-bottom: 1px solid #7f7f7f;
}
.top-menu div:nth-child(2) .navbar-nav {
  height: 100%;
}
.top-menu div:nth-child(2) .navbar-nav li {
  display: flex;
  align-items: center;
  justify-content: center;
}
.top-menu div:nth-child(2) .navbar-nav li a {
  margin-bottom: unset !important;
}
.top-menu div:nth-child(2) .custom-dropdown-class li {
  display: flex;
  justify-content: flex-start;
}
.top-menu div:nth-child(3) div:first-child {
  height: 100%;
}
.top-menu div:nth-child(3) div:first-child .company-logo-container {
  display: flex;
  align-items: center;
}
.top-menu div:nth-child(3) div:first-child .company-logo-container span {
  margin-left: 0.5rem;
}
.top-menu div:nth-child(3) div:first-child .language-logo-container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.custom-fieldset-class {
  padding: 1rem;
  border: 1px solid #e5e5e5;
  border-radius: 5px;
}

.label-custom-class {
  padding-left: unset;
  margin-bottom: 1rem;
}

.custom-input-group-text {
  width: 42px;
}

.custom-documents-modal-class .modal-content .modal-body .row > div .dataTables_wrapper > div:first-child {
  padding-left: 1rem !important;
}

.custom-position-modal-class .modal-content .modal-body > div:last-child > div:first-child > div:first-child {
  padding-left: 0.5rem !important;
}

.custom-cookie-modal-class {
  display: block;
  background-color: rgba(0, 0, 0, 0.6);
}
.custom-cookie-modal-class .modal-body {
  overflow-y: hidden !important;
  height: 55vh;
}

.company-table tbody tr td,
.user-table tbody tr td {
  text-align: center;
  vertical-align: middle;
}

.dataTable tbody tr td {
  vertical-align: middle !important;
}

div.dataTables_wrapper div.dataTables_processing {
  z-index: 1;
}

.auftrag-table {
  overflow-x: hidden;
  overflow-y: auto;
  height: calc(100vh - 50px);
}

.auftrag-table div.dataTables_wrapper div.dataTables_paginate ul.pagination {
  margin: unset;
  margin-bottom: 1rem !important;
  margin-top: 0.35rem !important;
}

.auftrag-table #auftragTable_wrapper > .datatableheader {
  margin-top: 0.65rem;
  /*.btn-reclamations {
  	margin-left: unset !important;
  }*/
}
.auftrag-table #auftragTable_wrapper > .datatableheader .dt-buttons {
  margin-bottom: 0.3rem;
}

#auftragTable tbody tr {
  height: 60px;
}
#auftragTable tbody tr td {
  height: 36px;
}
#auftragTable tbody tr td div[data-details]::before {
  max-width: 215px;
  overflow: hidden;
  text-overflow: ellipsis;
}

#auftragTable_wrapper #auftragTable_filter {
  margin-right: 0.5rem;
}
#auftragTable_wrapper .datatableheader .btnfilter #filterbtn {
  /*margin-left: unset !important;*/
  /*margin-right: 0.5rem !important;*/
}

#filterbtn {
  margin-left: 0.5rem !important;
}

.dataTables_filter {
  margin-left: 0.5rem !important;
}

.dt-row-yellow {
  background: rgba(255, 255, 0, 0.2);
}
.dt-row-red {
  background: rgba(221, 0, 96, 0.2);
}
.dt-row-green {
  background: rgba(55, 165, 140, 0.2);
}

.highlight_table {
  border: #dd0060 solid !important;
}

.px {
  word-wrap: break-word;
}
.px-50 {
  width: 50px;
  max-width: 50px;
}
.px-100 {
  width: 100px;
  max-width: 100px;
}
.px-150 {
  width: 150px;
  max-width: 150px;
}
.px-200 {
  width: 200px;
  max-width: 200px;
}

.col-dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  border: 1px solid #ccc;
  z-index: 1000;
}

.dt-truncate {
  white-space: nowrap; /* Prevent text wrapping */
  overflow: hidden; /* Hide the overflowed text */
  text-overflow: ellipsis; /* Show ellipsis (...) for overflowed text */
  max-width: 200px; /* Set a max width for the cell */
}

.custom-menu-info {
  width: 100%;
  white-space: initial !important;
  word-break: break-all;
  overflow: hidden;
}
.custom-menu-info .additional-info {
  white-space: inherit;
}
.custom-menu-info > h6:first-child {
  padding-top: unset;
}

#dropdownlistparent {
  max-height: 100%;
}

.company_info_menu {
  /*padding: 3rem 0rem 3rem 4rem !important;*/
  /*border: 1px solid #000 !important;*/
  padding-left: 3rem !important;
  /*background-color: palevioletred;*/
  max-width: 350px;
}
.company_info_menu_row {
  /*margin-left: 1rem !important;*/
  /*align-items: center;*/
  display: flex;
  justify-content: space-between;
}

/*.meUsername {
    text-align: left;
    align-self: flex-end;
    color: #FFF;
    margin: 0px;
    padding: 0.4rem 0.8rem 0.4rem 0.8rem;
    border-radius: 8px 0 0 0;
    width: 50%
}

.friendUsername {
    text-align: left;
    align-self: flex-start;
    color: #FFF;
    margin: 0px;
    padding: 0.4rem 0.8rem 0.4rem 0.8rem;
    border-radius: 0 8px 0 0;
    width: 50%
}*/
/*
.mobileUsernameBackground {
    background-color: #9b0244;
}

.dashboardUsernameBackground {
    background-color: #2c806c;
}

.mobileMessageBackground {
    background-color: var(--red);
}

.dashboardMessageBackground {
    background-color: var(--green);
}

*/
.chatWrapper {
  /*height: calc(100vh - 12rem);*/
  /*   display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;*/
  height: 70vh;
  background-color: #e5e5e5;
}

.messageField {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  justify-content: space-between;
}

.messageField input {
  width: 100%;
  resize: none;
  border: none;
  outline: none;
  border-radius: 5px;
  font-weight: 500;
  padding: 5px;
}

.newMessageContainer {
  background-color: #37a58c !important;
  width: 100%;
  height: 50px;
  position: absolute;
  bottom: 0;
  /*    padding: 0.2rem 0.2rem 0.2rem 0.2rem;
     margin-top: auto;*/
}

.sendMessageButton {
  height: 100%;
  width: 100%;
}

.messagesList {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 0 0.5rem 0 0;
  margin: unset;
  overflow-y: auto;
}

.messageSeparator {
  border-bottom: 1px solid grey;
  margin-bottom: 5px !important;
  color: grey;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
  text-align: center;
}

.messageItem {
  margin-bottom: 3px;
  max-width: 70%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8rem;
}

.messageText {
  font-weight: 500;
  overflow-wrap: anywhere;
}

.messageTime {
  /*    position: absolute;
     bottom: -10px;
     left: 1rem;
     font-size: 0.6rem;
     font-weight: 500;
     color: rgba(#000, 0.7);*/
  position: relative;
  font-size: 0.6rem;
  left: 8px;
  top: 12px;
  font-weight: 500;
  width: max-content;
}

/*.byMeTime {
    color: #e5e5e5;
    position: relative;
    font-size: 0.6rem;
    left: 8px;
    top: 12px;
    font-weight: 500;
    width: max-content;
}

.byFriendTime {
    color: #e5e5e5;
    position: relative;
    font-size: 0.6rem;
    left: 8px;
    top: 12px;
    font-weight: 500;
    width: max-content;
}*/
.byMe {
  align-self: flex-end;
  color: #e5e5e5;
  /*background-color: #dd0060;*/
  border-radius: 8px 0 8px 8px;
  margin-left: auto;
}

.byFriend {
  align-self: flex-start;
  color: #e5e5e5;
  /*background-color: #37a58c;*/
  border-radius: 8px 8px 8px 0;
}

#messagesList {
  width: 100%;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}

.chat_username {
  margin-bottom: -5px;
  z-index: 99;
  background-color: #e5e5e5;
  color: #000;
  width: fit-content;
  border-radius: 8px;
  padding: 0px 10px;
}

#newMessageText {
  caret-color: #37a58c;
}

@keyframes placeHolderShimmer {
  0% {
    background-position: -468px 0;
  }
  100% {
    background-position: 468px 0;
  }
}
.linear-background {
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-name: placeHolderShimmer;
  animation-timing-function: linear;
  background: #f6f7f8;
  background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
  background-size: 1000px 104px;
  height: 200px;
  position: relative;
  overflow: hidden;
}

.inter-draw {
  background: #fff;
  width: 100%;
  height: 100px;
  position: absolute;
  top: 100px;
}

.inter-right--top {
  background: #fff;
  width: 100%;
  height: 20px;
  position: absolute;
  top: 20px;
  left: 100px;
}

.inter-right--bottom {
  background: #fff;
  width: 100%;
  height: 50px;
  position: absolute;
  top: 60px;
  left: 100px;
}

.inter-crop {
  background: #fff;
  width: 20px;
  height: 100%;
  position: absolute;
  top: 0;
  left: 100px;
}

body {
  overflow-x: hidden;
  caret-color: transparent;
}

input {
  caret-color: initial !important;
}

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

::-webkit-scrollbar-track {
  background-color: #b1b2b3;
  border-radius: 50px;
}

::-webkit-scrollbar-thumb {
  background-color: #e5e5e5;
  border-radius: 50px;
}

table.dataTable tbody > tr {
  width: 100%;
}

table.dataTable tbody > tr.selected,
table.dataTable tbody > tr > .selected {
  background-color: #7f7f7f;
  color: black;
}

td {
  border-top: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
}

th {
  border-right: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
}

#positionTableTooltip {
  position: absolute;
  z-index: 1001;
  display: none;
  border: 2px solid #ebebeb;
  border-radius: 5px;
  padding: 10px;
  background-color: #fff;
}

/*.admin-tab-items {
	.row {
		.small-box {
			height: 67px;
		}
	}
}
*/
.custom-pull-right {
  float: right !important;
}

.datatableheader {
  float: left !important;
  min-height: 30px !important;
}

thead,
th {
  text-align: center;
}

#example_filter input {
  background-color: red !important;
  border-radius: 5px;
}

.details {
  font-size: 0.7rem;
  line-height: 15%;
  line-height: normal;
  margin-bottom: 0.2rem;
}

/*.card .card-header {
	padding: 4px 0px 4px 10px;
}*/
.card .card-header {
  display: flex; /* Enables flexbox layout */
  justify-content: space-between; /* Spaces out the text and buttons */
  align-items: center; /* Vertically aligns items in the center */
  padding: 4px 10px; /* Adjust padding for better spacing */
}

.card .card-header .buttons {
  display: flex; /* Enables flexbox layout for the buttons */
  gap: 8px; /* Adds space between buttons */
}

.p-float-left {
  float: left !important;
}

#dropdownlistelements {
  padding-left: 1rem !important;
  display: none;
  overflow: visible !important;
  position: absolute !important;
  z-index: 999 !important;
  background-color: white;
  font-size: 15px !important;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important;
}

/*#additionalfieldedit {*/
/*display: none;*/
/*width: 20px !important;
	height: 20px !important;
	padding: 0 !important;
	position: absolute !important;
	left: 200px !important;*/
/*right: 0 !important;*/
/*top: -5px !important;
	color: $rehau_green;
	z-index: 999 !important;
}*/
#saveCompanyInfo {
  float: right;
  margin-right: 1.6rem;
}

.tablefilter {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-top: 1rem;
}

.nomargin {
  margin: 0 !important;
}

.cinput--file-upload {
  display: flex;
  flex-wrap: nowrap;
  height: 2.2rem;
  max-height: 2.2rem;
  padding-left: 0;
  width: 100vw;
}
.cinput--file-upload + [type=file] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  white-space: nowrap;
  clip: rect(0, 0, 0, 0);
}

/*.cinput__file-info,
.cinput__file-btn {
	display: table-cell;
	width: 100%;
	padding: 0 $base-padding;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cinput__file-btn {
	height: 100%;
	border: 0 none;
	background: $black;
	color: $white;
}

.cinput__file-btn:hover {
	background: $gray-darker;
	cursor: pointer;
}*/
.positionstatus:hover {
  color: red;
  cursor: pointer;
  font-weight: 800;
}

.elementmessage:hover {
  color: red;
  cursor: pointer;
  font-weight: 800;
}

#project_additionals {
  position: absolute;
  left: 360px;
  top: 54px;
  z-index: 13;
}

.popuptooltip {
  padding-top: 0.6rem;
  padding-left: 2rem;
}
.popuptooltip:hover {
  color: black !important;
}

.select2-container .select2-selection--single {
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  height: 38px;
  user-select: none;
  -webkit-user-select: none;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #444;
  line-height: 38px;
  margin-top: -1px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 38px;
  position: absolute;
  top: 1px;
  right: 1px;
  width: 20px;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  color: #37a58c;
  background-color: #ffffff;
  border-color: #dee2e6 #dee2e6 #ffffff;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
  border-color: #37a58c #e9ecef #ffffff;
  color: #37a58c;
}

.cssload-loading {
  position: fixed !important;
}

.overlay {
  position: fixed !important;
  top: 0 !important;
  max-width: unset !important;
}

.custom-breadcrumb-class {
  margin-top: 0.25rem;
  width: 100%;
  max-width: unset !important;
  display: none;
  padding: 0 1rem !important;
}
.custom-breadcrumb-class .breadcrumb {
  background-color: #e5e5e5;
  padding: 0.5rem 1rem;
}
.custom-breadcrumb-class .breadcrumb li {
  font-size: 1.1rem;
}

.details_element_edit {
  border-bottom: 1px solid #dd0060 !important;
}

.details_image_edit {
  border: 1px solid #dd0060 !important;
}

#energytext,
#emailbody {
  caret-color: #37a58c;
}

.caret-green {
  caret-color: #37a58c;
}

.top-right-text {
  position: fixed;
  top: 60px;
  right: 10px;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  padding: 10px;
  font-size: 16px;
  border-radius: 5px;
}

/*.elements-parent {
	max-height: 400px;
	overflow: scroll;
	overflow-x: hidden;
	padding-right: 5px;
}

.felds-parent {
	max-height: 300px;
	overflow: scroll;
	overflow-x: hidden;
	padding-right: 5px;
}*/
/*.parent-element {
	display: flex;
	flex-direction: column;*/ /* Stack children vertically */
/*justify-content: space-between;*/ /* Push elements apart, including one at the bottom */
/*height: 100%;
}*/
.bottom-element {
  max-height: 500px;
  overflow: scroll;
  overflow-x: hidden;
  padding-right: 5px;
}

.row-item-file:hover {
  border: 2px solid #dd0060;
}