@import url(https://fonts.googleapis.com/css2?family=Commissioner:wght@100;200;300;400;500;600;700;800;900&display=swap);

#sec_r3{
  overflow-y: clip;
}

.admin {
  background: #fafbff;
  height: 100vh;
  overflow: hidden;
  width: 100vw;
}

.admin,
.admin * {
  cursor: auto;
  pointer-events: all;
}

.admin .bar {
  background-color: #f3f4f8;
  height: calc(100vh - 50px);
  overflow-x: hidden;
  overflow-y: scroll;
  transition: width 0.4s ease-out;
  width: 50px;
}

.admin .bar.fixate,
.admin .bar:hover {
  transition: width 0.2s ease-in;
  width: 330px;
}

.admin .bar .head {
  display: flex;
  flex-direction: column;
  height: -webkit-max-content;
  height: max-content;
  padding: 10px 20px;
  width: 100%;
}

.admin label,
.admin p {
  font-family: sans-serif;
}

.admin .admin-tabs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 50px;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

.admin .admin-tabs .admin-tab {
  height: calc(100vh - 50px);
  overflow-y: scroll;
  width: 100vw;
}

.admin .admin-tabs .posts-editor {
  padding: 12px;
}

.admin::-webkit-scrollbar,
.bar::-webkit-scrollbar,
.body-box::-webkit-scrollbar,
.body::-webkit-scrollbar {
  display: none;
}

.body {
  max-height: 100%;
}

.body,
.body-box {
  padding: 10px;
  width: 100%;
}

.body-box {
  max-height: calc(100vh - 50px);
  overflow-y: scroll;
}

.section-drag {
  background: #3e3e3e;
  border-radius: 15px;
  padding: 7px 12px;
  position: fixed;
}

.form-container {
  margin: auto;
  padding: 5px 0;
}

.form-container .window {
  background: #3e3e3e;
  border-radius: 15px;
  position: relative;
  transition: -webkit-transform 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
}

.form-container .window .header {
  align-items: center;
  background: #4d4d4f;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  display: flex;
  justify-content: space-between;
  padding: 6px 12px;
}

.form-container .window .header .mini-max {
  display: flex;
  flex-direction: row;
}

.form-container .window .header .virgin {
  text-decoration: line-through;
}

.form-container .window .button {
  align-items: center;
  background: #fff;
  border-radius: 10px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  margin-right: 6px;
  min-width: 16px;
  padding: 4px 10px;
}

.form-container .window .button p {
  color: inherit;
  font-size: 12px;
  font-weight: 600;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
}

.form-container .window .button.svg-icon {
  padding: 2px 8px;
}

.form-container .window .button.svg-icon svg {
  width: 16px;
}

.form-container .window .button.svg-icon svg path {
  fill: #666;
}

.form-container .window .button.svg-icon.matt {
  background-color: #3d3d3d;
}

.form-container .window .maximize {
  background: #f4be4f;
  color: #8f591d;
}

.form-container .window .minimize {
  background: #62c554;
  color: #296017;
}

.form-container .window .other {
  background: #d8d8d8;
  color: #666767;
}

.form-container .window .close {
  background: #ed6a5d;
  color: #6a1109;
}

.form-container .window .body .item {
  flex: 1 1;
}

.form-container .window .body .item .row {
  display: flex;
  flex-direction: row;
}

.form-container .window.is-dragging {
  opacity: 50%;
}

.form-container .window.is-dragging.move-up {
  -webkit-transform: translateY(-44px);
  transform: translateY(-44px);
}

.form-container .window.is-dragging.move-down {
  -webkit-transform: translateY(44px);
  transform: translateY(44px);
}

.form-container .window.is-dragging.move-back {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

.form-container .window.is-dragging.selected {
  opacity: 0;
}

.form-container .hidden .body {
  display: none;
}

.form-container .hidden .header {
  border-radius: 15px;
}

.section-form-group {
  flex: 1 1;
  margin: 0 5px 15px;
}

.section-form-group .form-area-control,
.section-form-group .form-control {
  background: none;
  border: none;
  border-bottom: 1px solid #666;
  color: #fff;
  font-size: 1rem;
  outline: none;
  padding: 10px 0;
  transition: border-color 0.2s;
  width: 100%;
  z-index: 1;
}

.section-form-group .form-area-control {
  min-height: 100px;
  overflow: auto;
  resize: vertical;
}

.section-form-group.tiny {
  flex: 0.5 1;
}

.section-form-group:focus {
  border-bottom-color: #ddd;
}

.section-form-group p {
  color: #b9b9b9;
  font-size: 0.9rem;
}

.section-title {
  align-items: center;
  color: #e7e1c6;
  display: flex;
  flex-direction: row;
  font-size: 1.1rem;
  font-weight: 500;
  margin: 8px 0;
}

.variant {
  color: #ffb592;
  font-size: 1rem;
  font-weight: 400;
}

.gallery-container .input {
  align-items: center;
  display: flex;
  flex-direction: row;
}

.gallery-container .add {
  align-items: center;
  background-color: #fff;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  height: 30px;
  justify-content: center;
  width: 30px;
}

.gallery-container .selected-img {
  margin: 0 5px 15px;
  position: relative;
}

.gallery-container .selected-img .img,
.gallery-container .selected-img .img-placeholder {
  background-color: #eee;
  border: 1px solid #eee;
}

.gallery-container .selected-img .img-placeholder,
.gallery-container .selected-img img {
  aspect-ratio: 1/1;
  object-fit: scale-down;
  width: 38px;
}

.gallery-container .selected-img p {
  color: #b9b9b9;
  font-size: 0.9rem;
}

.gallery-container .selected-img:hover .remove {
  background-color: red;
  border-radius: 8px;
  height: 16px;
  position: absolute;
  right: -4px;
  top: 12px;
  width: 16px;
  z-index: 99;
}

.gallery-container .selected-img:hover .remove:after,
.gallery-container .selected-img:hover .remove:before {
  background-color: #fff;
  content: "";
  height: 2px;
  left: 3px;
  position: absolute;
  top: 7px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 10px;
}

.gallery-container .selected-img:hover .remove:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.upload-file {
  align-items: center;
  background-color: #3e3e3e;
  display: flex;
  height: 150px;
  justify-content: center;
  width: 150px;
}

.upload-file label {
  border-radius: 2%;
  color: #fff;
  cursor: pointer;
  font-size: 30px;
  margin-right: 10px;
  text-align: center;
}

.gallery-modal {
  background-color: rgba(0, 0, 0, 0.6);
  bottom: 0;
  left: 0;
  max-height: 100vh;
  max-width: 100vw;
  position: fixed;
  right: 0;
  top: 0;
}

.gallery-modal .close {
  align-items: center;
  background-color: #ed6a5d;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  height: 30px;
  justify-content: center;
  position: absolute;
  right: 75px;
  top: 115px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 30px;
  z-index: 999;
}

.gallery-modal .close:hover {
  -webkit-filter: brightness(125%);
  filter: brightness(125%);
}

.gallery {
  background-color: #fff;
  border-radius: 16px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
  margin: 100px 50px 50px;
  max-height: calc(100vh - 150px);
  overflow-y: scroll;
  padding: 20px;
}

.gallery .card-selected {
  border: 1px solid #004d35;
}

.gallery .img-box {
  background-color: #eee;
  border: 2px solid #eee;
  border-radius: 12px;
  padding: 2px;
  position: relative;
  width: 150px;
}

.gallery .img-box .img-name {
  background-color: hsla(0, 0%, 100%, 0.8);
  left: 10px;
  position: absolute;
  right: 10px;
  top: 10px;
  transition: opacity 0.2s ease-out;
  word-break: break-all;
  z-index: 2;
}

.gallery .img-box .del {
  background-color: red;
  border-radius: 8px;
  height: 16px;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: all 0.3s ease-out 0.3s;
  width: 16px;
  z-index: 99;
}

.gallery .img-box .del:after,
.gallery .img-box .del:before {
  background-color: #fff;
  content: "";
  height: 2px;
  left: 3px;
  position: absolute;
  top: 7px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 10px;
}

.gallery .img-box .del:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.gallery .img-box:hover {
  border-color: #ccc;
}

.gallery .img-box:hover .img-name {
  opacity: 0;
  z-index: -2;
}

.gallery .img-box:hover .del {
  opacity: 1;
  right: 6px;
  top: 6px;
}

.gallery .img-box:hover .gallery-card {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
}

.gallery .gallery-card {
  align-items: center;
  aspect-ratio: 1/1;
  display: flex;
  justify-content: center;
  object-fit: contain;
  -webkit-transform: scale(1);
  transform: scale(1);
  transition: -webkit-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
  width: 100%;
}

.entity-box {
  flex-wrap: wrap;
  gap: 8px;
}

.entity-box .entity {
  background-color: #fff;
  border: 1px dashed #d4ebf7;
  border-radius: 4px;
  padding: 4px 12px;
  -webkit-user-select: none;
  user-select: none;
}

.entity-box .entity.selected,
.entity-box .entity:hover {
  background-color: #a8d8f0;
}

.variant-editor {
  display: flex;
  flex-direction: column;
  height: 50px;
  justify-content: space-evenly;
  max-width: 100px;
}

.collapse-list {
  border-radius: 4px;
  overflow: hidden;
  width: 100%;
}

.collapse-list .item-box {
  background-color: #fff;
  flex: 1 1;
  height: calc(100% - 80px);
  max-height: calc(100vh - 190px);
  overflow-y: auto;
}

.collapse-list .remove {
  background-color: red;
  color: #fff;
  cursor: pointer;
  display: none;
  height: 40px;
  position: relative;
  text-align: center;
  vertical-align: middle;
  width: 16px;
}

.collapse-list .remove:after {
  background-color: #fff;
  color: #fff;
  content: "";
  display: block;
  height: 2px;
  left: 20%;
  position: absolute;
  top: calc(50% - 1px);
  width: 60%;
}

.collapse-list .remove:hover {
  background-color: #bd0000;
}

.collapse-list .item {
  background-color: #fff;
  border-radius: 2px;
  box-shadow: 0 2px 0 #fff;
  cursor: pointer;
  height: 40px;
  padding: 10px;
  width: calc(100% - 16px);
}

.collapse-list .item p {
  cursor: pointer;
  font-size: 0.9rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.collapse-list .snippet:hover:after {
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  background-color: #f7f7f9;
  border-radius: 4px;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.067);
  content: attr(data-content);
  display: -webkit-box;
  height: -webkit-max-content;
  height: max-content;
  left: calc(var(--x) + var(--offset) - 150px);
  overflow: hidden;
  padding: 5px 5px 0;
  position: fixed;
  top: calc(var(--y) - 40px);
  width: 150px;
  z-index: 1000;
}

.collapse-list .item-container {
  align-items: center;
  display: flex;
  flex: 1 1;
  flex-direction: row;
  justify-content: space-between;
}

.collapse-list .item-container:hover .item {
  background-color: #f7f7f9;
}

.collapse-list .item-container:hover .remove {
  display: block;
}

.collapse-list .input {
  align-items: center;
  background-color: #f7f7f9;
  display: flex;
  flex-direction: row;
  height: 40px;
  justify-content: space-between;
}

.collapse-list .input input {
  border: none;
  height: 100%;
  outline: none;
  padding: 10px;
  width: 100%;
}

.collapse-list .input .add {
  align-items: center;
  background-color: #82c3af;
  border-radius: 12px 12px 0 12px;
  color: #fff;
  cursor: pointer;
  display: flex;
  font-weight: 700;
  height: 100%;
  padding: 0 12px;
}

.collapse-list .input .add span {
  cursor: pointer;
}

.collapse-list .input .add:hover {
  background-color: #39856e;
}

.collapse-list .input .filter-tab {
  background-color: #fff;
  height: 100%;
}

.collapse-list .input .filter-tab:hover {
  background-color: #f2f2f2;
}

.collapse-list .input .filter-tab.active {
  background-color: #82c3af;
}

.collapse-list .hidden {
  display: none;
}

.collapse-list .selected {
  display: block;
}

.collapse-list .selected p {
  color: #004d35;
  font-weight: 600;
}

.login-form {
  margin: 50px auto 100px;
  position: relative;
  width: 500px;
}

.login-form input {
  background: transparent;
  border: 1px solid #004d35;
  color: #004d35;
  font-family: sans-serif;
  font-size: 0.875em;
  height: 50px;
  outline: none;
  padding: 0 15px;
  transition: all 0.3s ease-in-out;
  width: 100%;
}

.login-form input::-webkit-input-placeholder {
  color: #004d35;
}

.login-form input::placeholder {
  color: #004d35;
}

.login-form input[name="username"] {
  border-bottom: none;
}

.login-form input:focus {
  background: #eaf5f9;
  color: #0a2129;
}

.login-form button {
  background: transparent;
  border: 1px solid #004d35;
  color: #004d35;
  font-family: sans-serif;
  font-size: 0.875em;
  height: 50px;
  outline: none;
  padding: 0 15px;
  transition: all 0.3s ease-in-out;
  width: 100%;
}

.login-form button:hover {
  background: #004d35;
  color: #fff;
}

.login-form .submit {
  border: 1px solid #004d35;
  color: #004d35;
  cursor: pointer;
  font-family: sans-serif;
  font-size: 0.875em;
  margin-top: 12px;
  outline: none;
  padding: 0;
  text-align: center;
  width: 100%;
}

.login-form .submit:hover {
  color: #fff;
}

.login-form .submit.disabled {
  border: 1px solid #afbcba;
  color: #afbcba;
  cursor: not-allowed;
}

.login-form .submit.disabled:hover {
  background-color: initial;
  color: #afbcba;
}

.login-form .login-error-container {
  height: 14px;
  margin-top: 16px;
}

.login-form .login-error-container .login-error {
  color: #d22128;
  font-size: 10px;
  font-weight: 400;
  line-height: 14px;
}

.dropdown {
  display: inline-block;
  flex: 1 1;
  margin: 0 5px 15px;
  max-width: 210px;
  position: relative;
}

.dropdown .selected {
  border-radius: 5px;
  margin: 4px 0;
  padding: 6px 2px;
  width: 100%;
}

.dropdown .label {
  color: #b9b9b9;
  font-size: 0.9rem;
}

.dropdown:hover .dropdown-content {
  display: grid;
  grid-template-columns: 1fr;
}

.dropdown:hover .dropdown-content.color-picker {
  background: transparent;
  display: flex;
  flex-wrap: wrap;
}

.dropdown .dropdown-content {
  background-color: var(--white);
  bottom: -42px;
  box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.4);
  display: none;
  min-width: 180px;
  overflow: auto;
  position: absolute;
  width: 100%;
  z-index: 999;
}

.dropdown .dropdown-content .dropdown-item {
  cursor: pointer;
  font-size: 1rem;
  font-weight: 900;
  text-align: center;
}

.dropdown p {
  line-height: 1;
}

.dropdown .color-picker li {
  display: flex;
  height: 30px;
  width: 30px;
}

.dropdown .color-picker li:hover {
  border: 3px inset red;
}

.dropdown .size-picker {
  max-height: 300px;
  overflow: auto;
}

.dropdown .size-picker li {
  min-height: 42px;
  min-width: 42px;
  padding: 4px;
}

.dropdown .size-picker li:hover {
  border: 2px solid red;
}

.dropdown .picker-error {
  color: #b9b9b9;
  font-size: 0.9rem;
  line-height: 2;
}

.dropdown .selected-value {
  background-color: rgba(189, 0, 0, 0.2);
}

.point-out {
  background-color: transparent !important;
  position: absolute;
  right: 0;
  top: 4px;
}

.point-out:hover svg path {
  fill: #fff !important;
}

.point-out.active svg path {
  fill: orange !important;
}

.section-id {
  color: #666;
  font-size: 11px;
  left: 6px;
  position: absolute;
  top: 4px;
}

.section-id.green {
  color: green;
}

.section-divider {
  padding: 20px;
  position: relative;
}

.section-divider:nth-child(2n) {
  background-color: hsla(0, 0%, 100%, 0.05);
  border-bottom: 1px solid hsla(0, 0%, 100%, 0.1);
  border-top: 1px solid hsla(0, 0%, 100%, 0.1);
}

.innerHtml {
  margin: 16px;
}

.innerHtml,
.vacancy-form {
  border: 1px solid hsla(0, 0%, 100%, 0.2);
  border-radius: 16px;
  overflow: hidden;
}

.vacancy-form {
  margin-bottom: 8px;
  padding: 16px;
}

.top-bar {
  background-color: #3e3e3e;
  height: 50px;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  width: 100vw;
  z-index: 999;
}

.top-bar .tabs {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: center;
}

.top-bar .admin-logo {
  position: static;
  -webkit-transform: scale(0.7);
  transform: scale(0.7);
}

.bar-button {
  background-color: #fff;
  border-radius: 4px;
  padding: 6px 12px;
}

.bar-button:hover {
  background-color: #e0e0eb;
}

.bar-button.active {
  background-color: #cbcbdb;
}

.pointy,
.pointy * {
  cursor: pointer;
}

.hand,
.hand * {
  cursor: grab;
}

.inserter {
  gap: 10px;
}

.inserter .insert-button {
  align-items: center;
  background-color: #3c80f6;
  border-radius: 8px;
  color: #fff;
  display: flex;
  height: 32px;
  justify-content: center;
  min-width: 32px;
  padding: 0 8px;
}

.inserter .insert-button:hover {
  background-color: #156bff;
}

.inserter .insert-button.rem {
  background-color: #f63c3c;
}

.inserter .insert-button.rem:hover {
  background-color: #ff1515;
}

.toggler {
  flex: 1 1;
  margin: 0 5px 15px;
}

.toggler .label {
  color: #b9b9b9;
  font-size: 0.9rem;
}

.toggler .toggler-control {
  display: flex;
  flex-direction: row;
  padding-top: 10px;
  width: 100%;
  z-index: 1;
}

.toggler .toggler-control .toggler-button {
  min-width: 80px;
  padding: 8px 16px;
}

.toggler .toggler-control .toggler-button p {
  font-size: 1rem;
}

.toggler .toggler-control .toggler-button.selected {
  background-color: #f4be4f;
}

.toggler .toggler-control .toggler-button:hover {
  background-color: #e0e0eb;
}

.icon-button {
  border-radius: 50%;
  height: 24px;
  margin: 2px;
  padding: 4px;
  width: 24px;
}

.icon-button:hover {
  background-color: hsla(0, 0%, 100%, 0.2);
}

.icon-button svg path {
  fill: #fff;
}

.svg-button {
  border-radius: 50%;
  height: 24px;
  padding: 4px;
  width: 24px;
}

.svg-button:hover {
  background-color: hsla(0, 0%, 100%, 0.2);
}

.inserter-parent .icon-button,
.inserter-parent .inserter {
  display: none;
}

.inserter-parent:hover {
  padding: 4px 20px;
}

.inserter-parent:hover .inserter {
  display: flex;
}

.inserter-parent:hover .icon-button {
  align-self: center;
  display: block;
}

.posts-tab {
  height: 100%;
}

.posts-tab .hidden {
  display: none;
}

.on-off {
  height: 40px;
  padding: 8px;
  width: 40px;
}

.on-off.active,
.on-off:hover {
  background-color: #f4be4f;
}

.on-off img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}

.mail-divider {
  background-color: hsla(0, 0%, 100%, 0.2);
  border-radius: 5px;
  color: #f0f0f0;
  display: flex;
  flex-direction: row;
  font-family: sans-serif;
  margin-bottom: 10px;
  padding: 10px;
  position: relative;
}

.mail-divider p {
  color: #000;
  -webkit-hyphens: manual;
  hyphens: manual;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  word-break: break-all;
}

.mail-divider p span {
  color: inherit;
  font-family: inherit;
  font-size: inherit;
}

.mail-divider p.pointy:hover {
  color: blue;
}

.mail-divider .f6 {
  background-color: #ccc;
  border-radius: 6px;
}

.mail-divider .f1 {
  display: flex;
  flex-direction: row;
  gap: 10px;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  justify-content: flex-end;
}

.mail-divider:nth-child(2n) {
  background-color: hsla(0, 0%, 100%, 0.5);
  border-bottom: 1px solid hsla(0, 0%, 100%, 0.1);
  border-top: 1px solid hsla(0, 0%, 100%, 0.1);
}

.mail-divider .mail-message {
  background-color: #eee;
  border-radius: 4px;
  padding: 10px;
}

.mail-divider .mail-btn {
  border-radius: 6px;
  color: #fff;
  padding: 5px 12px;
  -webkit-user-select: none;
  user-select: none;
}

.mail-divider .mail-new {
  background-color: #f4be4f;
}

.mail-divider .mail-delete {
  background-color: red;
  cursor: pointer;
}

.hidden-widget {
  display: none;
}

.three-col-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.two-col-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.cant-touch {
  pointer-events: none;
}

.cant-select,
.cant-touch {
  -webkit-user-select: none;
  user-select: none;
}

.tooltip {
  position: relative;
}

.tooltip div:nth-child(2) {
  background-color: #1a2027;
  border-radius: 4px;
  bottom: 120%;
  display: none;
  left: 0;
  padding: 4px;
  position: absolute;
  -webkit-transform: translateZ(10);
  transform: translateZ(10);
  width: -webkit-max-content;
  width: max-content;
  z-index: 999;
}

.tooltip div:nth-child(2) p {
  color: #fff;
  font-size: 11px;
}

.tooltip.right-side div:nth-child(2) {
  left: auto;
  right: 0;
}

.tooltip div:first-child:hover ~ div {
  display: block;
}

.language-picker {
  align-items: center;
  border: 1px solid gray;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  margin: 0 8px;
  padding: 0 8px;
}

.language-picker .language-tab {
  border-radius: 4px;
  padding: 2px 8px;
}

.language-picker .language-tab span {
  color: #fff;
}

.language-picker .language-tab.active {
  background-color: #fff;
}

.language-picker .language-tab.active span {
  color: #000;
}

.admin-logo {
  left: 32px;
  position: fixed;
  top: 32px;
}

.file-delete {
  background-color: red;
  border-radius: 8px;
  height: 16px;
  position: relative;
  transition: all 0.3s ease-out 0.3s;
  width: 16px;
  z-index: 99;
}

.file-delete:after,
.file-delete:before {
  background-color: #fff;
  content: "";
  height: 2px;
  left: 3px;
  position: absolute;
  top: 7px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 10px;
}

.file-delete:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.upload-error {
  background-color: red;
  border-radius: 10px;
  height: 20px;
  position: relative;
  width: 20px;
}

.upload-error:after {
  color: #fff;
  content: "!";
  left: 7px;
  position: absolute;
}

.progress-bar {
  border-radius: 10px;
  height: 18px;
  position: relative;
  width: 100px;
}

.progress-bar div {
  background: linear-gradient(90deg, #12c2e9, #c471ed, #f64f59);
  border-radius: 10px;
  color: var(--white);
  font-size: 12px;
  height: 18px;
  padding: 2px;
  position: absolute;
  text-align: center;
  width: var(--p);
}

.analytics {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
}

.analytics .analytics-box {
  border: 1px solid hsla(0, 0%, 100%, 0.067);
  display: flex;
  margin-bottom: 4px;
  min-width: 34px;
  padding: 4px;
}

.analytics .analytics-box p {
  text-align: center;
  -webkit-user-select: none;
  user-select: none;
}

.analytics .date-box:hover {
  background-color: #000;
}

.fl-table {
  border: none;
  border-collapse: collapse;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 400;
  max-width: 100%;
  white-space: nowrap;
  width: 100%;
}

.fl-table td,
.fl-table th {
  padding: 8px;
  text-align: center;
}

.fl-table td {
  border-right: 1px solid #000;
  font-size: 12px;
}

.fl-table thead th {
  background: #82c3af;
  color: #fff;
}

.fl-table thead th:nth-child(odd) {
  color: #fff;
}

.fl-table tr:nth-child(2n) {
  background: #636363;
}

:root {
  --navy-green: #004d35;
  --blend-a: #f9f3df;
  --blend-b: #c1f8cf;
  --blend-c: #4fd3c4;
  --dark-blend-a: #03a65a;
  --dark-blend-b: #488fb1;
  --dark-blend-c: #533e85;
  --bright-green: #00ffaf;
  --light-green: #d4ffef;
  --navy-blue: #0100e4;
  --bright-blue: #004ce1;
  --light-blue: #85d2fe;
  --soft-blue: #eaf5f9;
  --midnight-blue: #0a0d29;
  --grey-blue: #0a2129;
  --just-grey: #333;
  --light-grey: #afbcba;
  --yellow: #f9d401;
  --orange: #e47447;
  --white: #fff;
  --black: #000;
  --smoothy: smooth;
  --font: "Commissioner", sans-serif;
  --x: 0px;
  --y: 0px;
  --offset: 0px;
  --p: 0px;
}

body {
  max-width: 100%;
  min-height: 100%;
}

@media (-webkit-device-pixel-ratio: 1.25) {
  footer,
  header,
  section {
    zoom: 0.8;
  }
}

body,
html,
main {
  overscroll-behavior-x: none;
}

.animated-link .title {
  display: inline-block;
  overflow-y: hidden;
}

.animated-link .title span {
  color: transparent;
  display: inline-block;
  position: relative;
  transition: -webkit-transform 1.2s cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 1.2s cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 1.2s cubic-bezier(0.19, 1, 0.22, 1),
    -webkit-transform 1.2s cubic-bezier(0.19, 1, 0.22, 1);
  width: -webkit-max-content;
  width: max-content;
}

.animated-link .title span:after,
.animated-link .title span:before {
  content: attr(data-text);
  display: block;
  position: absolute;
  width: -webkit-max-content;
  width: max-content;
}

.animated-link .title span:before {
  top: 0;
  -webkit-transform: skewY(0);
  transform: skewY(0);
  -webkit-transform-origin: right bottom;
  transform-origin: right bottom;
}

.animated-link .title span:after,
.animated-link .title span:before {
  transition: -webkit-transform 2s cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 2s cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 2s cubic-bezier(0.19, 1, 0.22, 1),
    -webkit-transform 2s cubic-bezier(0.19, 1, 0.22, 1);
}

.animated-link .title span:after {
  top: 105%;
  -webkit-transform: skewY(7deg);
  transform: skewY(7deg);
  -webkit-transform-origin: left top;
  transform-origin: left top;
}

.animated-link .title:hover span {
  -webkit-transform: translateY(-105%);
  transform: translateY(-105%);
}

.animated-link .title:hover span:before {
  -webkit-transform: skewY(7deg);
  transform: skewY(7deg);
}

.animated-link .title:hover span:after {
  -webkit-transform: skewY(0);
  transform: skewY(0);
}

.m0 {
  margin: 0;
}

.m2 {
  margin: 2px;
}

.m4 {
  margin: 4px;
}

.m6 {
  margin: 6px;
}

.m8 {
  margin: 8px;
}

.m12 {
  margin: 12px;
}

.m16 {
  margin: 16px;
}

.m24 {
  margin: 24px;
}

.m32 {
  margin: 32px;
}

.mb0 {
  margin-bottom: 0;
}

.mb2 {
  margin-bottom: 2px;
}

.mb4 {
  margin-bottom: 4px;
}

.mb6 {
  margin-bottom: 6px;
}

.mb8 {
  margin-bottom: 8px;
}

.mb12 {
  margin-bottom: 12px;
}

.mb16 {
  margin-bottom: 16px;
}

.mb24 {
  margin-bottom: 24px;
}

.mb32 {
  margin-bottom: 32px;
}

.ml0 {
  margin-left: 0;
}

.ml2 {
  margin-left: 2px;
}

.ml4 {
  margin-left: 4px;
}

.ml6 {
  margin-left: 6px;
}

.ml8 {
  margin-left: 8px;
}

.ml12 {
  margin-left: 12px;
}

.ml16 {
  margin-left: 16px;
}

.ml24 {
  margin-left: 24px;
}

.ml32 {
  margin-left: 32px;
}

.mv0 {
  margin-bottom: 0;
  margin-top: 0;
}

.mv2 {
  margin-bottom: 2px;
  margin-top: 2px;
}

.mv4 {
  margin-bottom: 4px;
  margin-top: 4px;
}

.mv6 {
  margin-bottom: 6px;
  margin-top: 6px;
}

.mv8 {
  margin-bottom: 8px;
  margin-top: 8px;
}

.mv12 {
  margin-bottom: 12px;
  margin-top: 12px;
}

.mv16 {
  margin-bottom: 16px;
  margin-top: 16px;
}

.mv24 {
  margin-bottom: 24px;
  margin-top: 24px;
}

.mv32 {
  margin-bottom: 32px;
  margin-top: 32px;
}

.p0 {
  padding: 0;
}

.p2 {
  padding: 2px;
}

.p4 {
  padding: 4px;
}

.p6 {
  padding: 6px;
}

.p8 {
  padding: 8px;
}

.p12 {
  padding: 12px;
}

.p16 {
  padding: 16px;
}

.p24 {
  padding: 24px;
}

.p32 {
  padding: 32px;
}

.pr0 {
  padding-right: 0;
}

.pr2 {
  padding-right: 2px;
}

.pr4 {
  padding-right: 4px;
}

.pr6 {
  padding-right: 6px;
}

.pr8 {
  padding-right: 8px;
}

.pr12 {
  padding-right: 12px;
}

.pr16 {
  padding-right: 16px;
}

.pr24 {
  padding-right: 24px;
}

.pr32 {
  padding-right: 32px;
}

.gap0 {
  gap: 0;
}

.gap2 {
  gap: 2px;
}

.gap4 {
  gap: 4px;
}

.gap6 {
  gap: 6px;
}

.gap8 {
  gap: 8px;
}

.gap12 {
  gap: 12px;
}

.gap16 {
  gap: 16px;
}

.gap24 {
  gap: 24px;
}

.gap32 {
  gap: 32px;
}

.up-0 {
  z-index: 0;
}

.up-1 {
  z-index: 1;
}

.up-2 {
  z-index: 2;
}

.up-3 {
  z-index: 3;
}

.up-4 {
  z-index: 4;
}

.up-5 {
  z-index: 5;
}

.up-6 {
  z-index: 6;
}

.up-7 {
  z-index: 7;
}

.up-8 {
  z-index: 8;
}

.up-9 {
  z-index: 9;
}

.up-10 {
  z-index: 10;
}

.floor-0 {
  z-index: 0;
}

.floor-1 {
  z-index: -1;
}

.floor-2 {
  z-index: -2;
}

.floor-3 {
  z-index: -3;
}

.floor-4 {
  z-index: -4;
}

.floor-5 {
  z-index: -5;
}

.floor-6 {
  z-index: -6;
}

.floor-7 {
  z-index: -7;
}

.floor-8 {
  z-index: -8;
}

.floor-9 {
  z-index: -9;
}

.floor-10 {
  z-index: -10;
}

.bw1 {
  border-width: 1px;
}

.bw2 {
  border-width: 2px;
}

.bw3 {
  border-width: 3px;
}

.bw4 {
  border-width: 4px;
}

.bw5 {
  border-width: 5px;
}

.transition-container .transition-layer {
  background: var(--navy-green);
  bottom: 0;
  height: 0;
  left: 0;
  position: fixed;
  right: 0;
  transition: height 0.3s cubic-bezier(0.6, 0.05, 0.4, 1);
  width: 100%;
  z-index: 9999;
}

.transition-container .transition-layer .main-line {
  clear: both;
  float: left;
  height: 12rem;
  white-space: nowrap;
}

.transition-container .transition-layer .main-line .letter-box {
  display: inline-block;
  font-size: 10rem;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  position: relative;
  text-transform: left center;
  -webkit-transform: translate3d(0.1em, 0, 0) rotate(5deg);
  transform: translate3d(0.1em, 0, 0) rotate(5deg);
  transition: -webkit-transform 1.2s cubic-bezier(0.52, 0.175, 0.04, 0.98);
  transition: transform 1.2s cubic-bezier(0.52, 0.175, 0.04, 0.98);
  transition: transform 1.2s cubic-bezier(0.52, 0.175, 0.04, 0.98),
    -webkit-transform 1.2s cubic-bezier(0.52, 0.175, 0.04, 0.98);
}

.transition-container .transition-layer .main-line .letter-box .letter-inner {
  color: var(--white);
  display: inline-block;
  position: relative;
  text-transform: uppercase;
  -webkit-transform: translate3d(105%, 0, 0);
  transform: translate3d(105%, 0, 0);
  -webkit-transform-origin: top;
  transform-origin: top;
  transition: -webkit-transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1),
    -webkit-transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.transition-container .transition-layer.active {
  bottom: auto;
  height: 100vh;
  top: 0;
}

.transition-container .transition-layer.active .main-line {
  display: flex;
}

.transition-container .transition-layer.active .main-line .letter-box {
  -webkit-transform: translateZ(0) rotate(0);
  transform: translateZ(0) rotate(0);
  transition: -webkit-transform 1.2s cubic-bezier(0.52, 0.175, 0.04, 0.98);
  transition: transform 1.2s cubic-bezier(0.52, 0.175, 0.04, 0.98);
  transition: transform 1.2s cubic-bezier(0.52, 0.175, 0.04, 0.98),
    -webkit-transform 1.2s cubic-bezier(0.52, 0.175, 0.04, 0.98);
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box
  .letter-inner {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  transition: -webkit-transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1),
    -webkit-transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:first-child {
  transition-delay: 1.15s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:first-child
  .letter-inner {
  transition-delay: 1.1s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(2) {
  transition-delay: 1.212s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(2)
  .letter-inner {
  transition-delay: 1.141s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(3) {
  transition-delay: 1.259s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(3)
  .letter-inner {
  transition-delay: 1.173s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(4) {
  transition-delay: 1.3s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(4)
  .letter-inner {
  transition-delay: 1.2s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(5) {
  transition-delay: 1.335s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(5)
  .letter-inner {
  transition-delay: 1.223s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(6) {
  transition-delay: 1.367s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(6)
  .letter-inner {
  transition-delay: 1.244s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(7) {
  transition-delay: 1.396s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(7)
  .letter-inner {
  transition-delay: 1.264s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(8) {
  transition-delay: 1.424s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(8)
  .letter-inner {
  transition-delay: 1.282s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(9) {
  transition-delay: 1.45s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(9)
  .letter-inner {
  transition-delay: 1.3s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(10) {
  transition-delay: 1.474s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(10)
  .letter-inner {
  transition-delay: 1.316s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(11) {
  transition-delay: 1.497s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(11)
  .letter-inner {
  transition-delay: 1.331s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(12) {
  transition-delay: 1.519s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(12)
  .letter-inner {
  transition-delay: 1.346s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(13) {
  transition-delay: 1.54s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(13)
  .letter-inner {
  transition-delay: 1.36s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(14) {
  transition-delay: 1.561s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(14)
  .letter-inner {
  transition-delay: 1.374s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(15) {
  transition-delay: 1.58s;
}

.transition-container
  .transition-layer.active
  .main-line
  .letter-box:nth-child(15)
  .letter-inner {
  transition-delay: 1.387s;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

@media screen and (min-width: 1200px) {
  a,
  body,
  html,
  input,
  textarea {
    cursor: none;
  }
}

ul {
  list-style: none;
}

a,
h1,
h2,
h3,
h4,
h5,
h6,
input,
li,
p,
span {
  font-family: var(--font);
}

p,
span {
  white-space: pre-line;
}

a {
  text-decoration: none !important;
}

.width-wrapper {
  max-width: 100%;
  overflow-x: hidden;
}

.overflow-hidden {
  overflow: hidden;
  height: 0px;
}

.hsh::-webkit-scrollbar {
  display: none;
}

.inh {
  color: inherit;
  font-size: inherit;
}

.italic {
  font-style: italic !important;
}

.underlined {
  text-decoration: underline !important;
}

.thin {
  font-weight: 100 !important;
}

.extra-light {
  font-weight: 200 !important;
}

.light {
  font-weight: 300 !important;
}

.regular {
  font-weight: 400 !important;
}

.medium {
  font-weight: 500 !important;
}

.semi-bold {
  font-weight: 600 !important;
}

.bold {
  font-weight: 700 !important;
}

.extra-bold {
  font-weight: 800 !important;
}

.black {
  font-weight: 900 !important;
}

.H1 {
  font-size: 120px;
  font-weight: 300;
  letter-spacing: 0;
  line-height: 108px;
}

.H2 {
  font-size: 104px;
  font-style: normal;
  font-weight: 700;
  line-height: 122px;
}

.H3 {
  font-size: 60px;
  font-weight: 400;
  line-height: 70px;
}

.H3,
.H4 {
  letter-spacing: 0;
}

.H4 {
  font-size: 36px;
  font-weight: 700;
  line-height: 42px;
}

.H5 {
  font-size: 32px;
  font-weight: 300;
  line-height: 38px;
}

.H6 {
  font-size: 20px;
  font-weight: 400;
  line-height: 23px;
}

.H6,
.Sub {
  letter-spacing: 0;
}

.Sub {
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
}

.Sub2 {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 21px;
}

.Body {
  font-size: 16px;
  letter-spacing: 0.015em;
  line-height: 22px;
  white-space: pre-line;
}

.Body,
.Body2 {
  font-weight: 400;
}

.Body2 {
  font-size: 13px;
  line-height: 17px;
}

.Button {
  font-size: 14px;
}

.Cap {
  font-size: 12px;
}

.Small-11 {
  font-size: 11px;
  font-weight: 400;
  line-height: 140%;
}

.None {
  font-size: 12px;
}

.H-mob {
  font-size: 40px;
  font-style: italic;
  font-weight: 400;
  line-height: 47px;
}

.Link {
  color: var(--navy-green);
  font-style: italic !important;
  pointer-events: all !important;
  text-decoration: underline !important;
}

.Overline {
  font-size: 10px;
}

.color-text-primary {
  color: var(--just-grey);
}

.container {
  display: flex;
  flex: 1 1;
  max-width: 1280px;
}

.mini-container {
  display: flex;
  flex: 1 1;
  max-width: 820px;
}

.full-width {
  width: 100%;
}

.screen-width {
  width: 100vw;
}

@media screen and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .screen-width {
    width: 125vw;
  }
}

.flex {
  display: flex;
}

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

.align-right {
  align-items: flex-end;
}

.align-left {
  align-items: flex-start;
}

.justify-center {
  justify-content: center;
}

.justify-right {
  justify-content: flex-end;
}

.justify-left {
  justify-content: flex-start;
}

.justify-between {
  justify-content: space-between;
}

.justify-around {
  justify-content: space-around;
}

.justify-evenly {
  justify-content: space-evenly;
}

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

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

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

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

.block {
  display: block;
}

.f1 {
  flex: 1 1;
}

.f2 {
  flex: 2 1;
}

.f3 {
  flex: 3 1;
}

.f4 {
  flex: 4 1;
}

.f5 {
  flex: 5 1;
}

.f6 {
  flex: 6 1;
}

.f7 {
  flex: 7 1;
}

.f8 {
  flex: 8 1;
}

.f9 {
  flex: 9 1;
}

.f10 {
  flex: 10 1;
}

.f11 {
  flex: 11 1;
}

.f12 {
  flex: 12 1;
}

.row {
  flex-direction: row;
}

.column {
  flex-direction: column;
}

.frc {
  align-items: center;
  justify-content: center;
}

.frc,
.frr {
  display: flex;
  flex-direction: row;
}

.frr {
  flex-wrap: wrap;
}

.fcc {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.flex-row {
  display: flex;
  flex-direction: row;
}

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

.relative {
  position: relative;
}

.fade {
  -webkit-animation: fade 1s ease-out 10ms forwards;
  animation: fade 1s ease-out 10ms forwards;
  height: 100%;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
}

.pulse {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

@media screen and (min-width: 1200px) and (orientation: portrait) {
  .pulse:hover {
    animation: pulse 0.5s ease infinite alternate-reverse;
    -webkit-transform-origin: center;
    transform-origin: center;
  }
}

.non-selectable {
  -webkit-user-select: none;
  user-select: none;
}

@-webkit-keyframes fade {
  99% {
    height: 100%;
    opacity: 0;
    width: 100%;
  }

  to {
    height: 0;
    opacity: 0;
    width: 0;
  }
}

@keyframes fade {
  99% {
    height: 100%;
    opacity: 0;
    width: 100%;
  }

  to {
    height: 0;
    opacity: 0;
    width: 0;
  }
}

@-webkit-keyframes show {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes show {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@-webkit-keyframes pulse {
  to {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-transform-origin: center;
    transform-origin: center;
  }
}

@keyframes pulse {
  to {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-transform-origin: center;
    transform-origin: center;
  }
}

@media screen and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  a,
  body,
  html,
  input,
  textarea {
    cursor: none;
  }
}

.color-after-transparent:after,
.color-before-transparent:before,
.color-transparent {
  color: transparent;
}

.bg-after-transparent:after,
.bg-before-transparent:before,
.bg-transparent,
.hover-bg-transparent:hover {
  background-color: transparent;
}

.fill-transparent,
.fill-transparent * {
  fill: transparent;
}

.bg-gu-transparent {
  background: linear-gradient(180deg, transparent 0, var(--white) 100%);
}

.bg-gd-transparent {
  background: linear-gradient(0deg, transparent 0, var(--white) 100%);
}

.scroll-transparent {
  border-color: transparent !important;
}

.scroll-transparent:before {
  background-color: transparent !important;
}

.fade-down-transparent {
  position: relative;
}

.fade-down-transparent:after {
  background: transparent;
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-transparent {
  border-color: transparent;
}

.hover-border-color-transparent:hover ~ div.labels:after,
.hover-border-color-transparent:hover ~ div.labels:before {
  border: 1px solid transparent;
}

.color-after-black:after,
.color-before-black:before,
.color-black {
  color: var(--black);
}

.bg-black,
.hover-bg-black:hover {
  background-color: var(--black);
}

.fill-black,
.fill-black * {
  fill: var(--black);
}

.bg-gu-black {
  background: linear-gradient(180deg, var(--black) 0, var(--white) 100%);
}

.bg-gd-black {
  background: linear-gradient(0deg, var(--black) 0, var(--white) 100%);
}

.scroll-black {
  border-color: var(--black) !important;
}

.scroll-black:before {
  background-color: var(--black) !important;
}

.fade-down-black {
  position: relative;
}

.fade-down-black:after {
  background: linear-gradient(0deg, var(--black) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-black {
  border-color: var(--black);
}

.hover-border-color-black:hover ~ div.labels:after,
.hover-border-color-black:hover ~ div.labels:before {
  border: 1px solid var(--black);
}

.color-after-white:after,
.color-before-white:before,
.color-white {
  color: var(--white);
}

.bg-after-white:after,
.bg-before-white:before,
.bg-gd-white,
.bg-gu-white,
.bg-white,
.hover-bg-white:hover {
  background-color: var(--white);
}

.fill-white,
.fill-white * {
  fill: var(--white);
}

.scroll-white {
  border-color: var(--white) !important;
}

.scroll-white:before {
  background-color: var(--white) !important;
}

.fade-down-white {
  position: relative;
}

.fade-down-white:after {
  background: linear-gradient(0deg, var(--white) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-white {
  border-color: var(--white);
}

.hover-border-color-white:hover ~ div.labels:after,
.hover-border-color-white:hover ~ div.labels:before {
  border: 1px solid var(--white);
}

.color-after-navy-green:after,
.color-before-navy-green:before,
.color-navy-green {
  color: var(--navy-green);
}

.color-after-navy-black:after,
.color-before-navy-black:before,
.color-navy-black {
  color: #000;
}

.bg-after-navy-green:after,
.bg-before-navy-green:before,
.bg-navy-green,
.hover-bg-navy-green:hover {
  background-color: var(--navy-green);
}

.fill-navy-green,
.fill-navy-green * {
  fill: var(--navy-green);
}

.bg-gu-navy-green {
  background: linear-gradient(180deg, var(--navy-green) 0, var(--white) 100%);
}

.bg-gd-navy-green {
  background: linear-gradient(0deg, var(--navy-green) 0, var(--white) 100%);
}

.scroll-navy-green {
  border-color: var(--navy-green) !important;
}

.scroll-navy-green:before {
  background-color: var(--navy-green) !important;
}

.fade-down-navy-green {
  position: relative;
}

.fade-down-navy-green:after {
  background: linear-gradient(0deg, var(--navy-green) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-navy-green {
  border-color: var(--navy-green);
}

.hover-border-color-navy-green:hover ~ div.labels:after,
.hover-border-color-navy-green:hover ~ div.labels:before {
  border: 1px solid var(--navy-green);
}

.color-after-bright-green:after,
.color-before-bright-green:before,
.color-bright-green {
  color: var(--bright-green);
}

.bg-after-bright-green:after,
.bg-before-bright-green:before,
.bg-bright-green,
.hover-bg-bright-green:hover {
  background-color: var(--bright-green);
}

.fill-bright-green,
.fill-bright-green * {
  fill: var(--bright-green);
}

.bg-gu-bright-green {
  background: linear-gradient(180deg, var(--bright-green) 0, var(--white) 100%);
}

.bg-gd-bright-green {
  background: linear-gradient(0deg, var(--bright-green) 0, var(--white) 100%);
}

.scroll-bright-green {
  border-color: var(--bright-green) !important;
}

.scroll-bright-green:before {
  background-color: var(--bright-green) !important;
}

.fade-down-green {
  position: relative;
}

.fade-down-green:after {
  background: linear-gradient(0deg, var(--bright-green) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-green {
  border-color: var(--bright-green);
}

.hover-border-color-green:hover ~ div.labels:after,
.hover-border-color-green:hover ~ div.labels:before {
  border: 1px solid var(--bright-green);
}

.color-after-light-green:after,
.color-before-light-green:before,
.color-light-green {
  color: var(--light-green);
}

.bg-after-light-green:after,
.bg-before-light-green:before,
.bg-light-green,
.hover-bg-light-green:hover {
  background-color: var(--light-green);
}

.fill-light-green,
.fill-light-green * {
  fill: var(--light-green);
}

.bg-gu-light-green {
  background: linear-gradient(180deg, var(--light-green) 0, var(--white) 100%);
}

.bg-gd-light-green {
  background: linear-gradient(0deg, var(--light-green) 0, var(--white) 100%);
}

.scroll-light-green {
  border-color: var(--light-green) !important;
}

.scroll-light-green:before {
  background-color: var(--light-green) !important;
}

.fade-down-light-green {
  position: relative;
}

.fade-down-light-green:after {
  background: linear-gradient(0deg, var(--light-green) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-light-green {
  border-color: var(--light-green);
}

.hover-border-color-light-green:hover ~ div.labels:after,
.hover-border-color-light-green:hover ~ div.labels:before {
  border: 1px solid var(--light-green);
}

.color-after-navy-blue:after,
.color-before-navy-blue:before,
.color-navy-blue {
  color: var(--navy-blue);
}

.bg-after-navy-blue:after,
.bg-before-navy-blue:before,
.bg-navy-blue,
.hover-bg-navy-blue:hover {
  background-color: var(--navy-blue);
}

.fill-navy-blue,
.fill-navy-blue * {
  fill: var(--navy-blue);
}

.bg-gu-navy-blue {
  background: linear-gradient(180deg, var(--navy-blue) 0, var(--white) 100%);
}

.bg-gd-navy-blue {
  background: linear-gradient(0deg, var(--navy-blue) 0, var(--white) 100%);
}

.scroll-navy-blue {
  border-color: var(--navy-blue) !important;
}

.scroll-navy-blue:before {
  background-color: var(--navy-blue) !important;
}

.fade-down-navy-blue {
  position: relative;
}

.fade-down-navy-blue:after {
  background: linear-gradient(0deg, var(--navy-blue) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-navy-blue {
  border-color: var(--navy-blue);
}

.hover-border-color-navy-blue:hover ~ div.labels:after,
.hover-border-color-navy-blue:hover ~ div.labels:before {
  border: 1px solid var(--navy-blue);
}

.color-after-bright-blue:after,
.color-before-bright-blue:before,
.color-bright-blue {
  color: var(--bright-blue);
}

.bg-after-bright-blue:after,
.bg-before-bright-blue:before,
.bg-bright-blue,
.hover-bg-bright-blue:hover {
  background-color: var(--bright-blue);
}

.fill-bright-blue,
.fill-bright-blue * {
  fill: var(--bright-blue);
}

.bg-gu-bright-blue {
  background: linear-gradient(180deg, var(--bright-blue) 0, var(--white) 100%);
}

.bg-gd-bright-blue {
  background: linear-gradient(0deg, var(--bright-blue) 0, var(--white) 100%);
}

.scroll-bright-blue {
  border-color: var(--bright-blue) !important;
}

.scroll-bright-blue:before {
  background-color: var(--bright-blue) !important;
}

.fade-down-bright-blue {
  position: relative;
}

.fade-down-bright-blue:after {
  background: linear-gradient(0deg, var(--bright-blue) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color- {
  border-color: var(--bright-blue);
}

.hover-border-color-bright-blue:hover ~ div.labels:after,
.hover-border-color-bright-blue:hover ~ div.labels:before {
  border: 1px solid var(--bright-blue);
}

.color-after-light-blue:after,
.color-before-light-blue:before,
.color-light-blue {
  color: var(--light-blue);
}

.bg-after-light-blue:after,
.bg-before-light-blue:before,
.bg-light-blue,
.hover-bg-light-blue:hover {
  background-color: var(--light-blue);
}

.fill-light-blue,
.fill-light-blue * {
  fill: var(--light-blue);
}

.bg-gu-light-blue {
  background: linear-gradient(180deg, var(--light-blue) 0, var(--white) 100%);
}

.bg-gd-light-blue {
  background: linear-gradient(0deg, var(--light-blue) 0, var(--white) 100%);
}

.scroll-light-blue {
  border-color: var(--light-blue) !important;
}

.scroll-light-blue:before {
  background-color: var(--light-blue) !important;
}

.fade-down-light-blue {
  position: relative;
}

.fade-down-light-blue:after {
  background: linear-gradient(0deg, var(--light-blue) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-light-blue {
  border-color: var(--light-blue);
}

.hover-border-color-light-blue:hover ~ div.labels:after,
.hover-border-color-light-blue:hover ~ div.labels:before {
  border: 1px solid var(--light-blue);
}

.color-after-soft-blue:after,
.color-before-soft-blue:before,
.color-soft-blue {
  color: var(--soft-blue);
}

.bg-after-soft-blue:after,
.bg-before-soft-blue:before,
.bg-soft-blue,
.hover-bg-soft-blue:hover {
  background-color: var(--soft-blue);
}

.fill-soft-blue,
.fill-soft-blue * {
  fill: var(--soft-blue);
}

.bg-gu-soft-blue {
  background: linear-gradient(180deg, var(--soft-blue) 0, var(--white) 100%);
}

.bg-gd-soft-blue {
  background: linear-gradient(0deg, var(--soft-blue) 0, var(--white) 100%);
}

.scroll-soft-blue {
  border-color: var(--soft-blue) !important;
}

.scroll-soft-blue:before {
  background-color: var(--soft-blue) !important;
}

.fade-down-soft-blue {
  position: relative;
}

.fade-down-soft-blue:after {
  background: linear-gradient(0deg, var(--soft-blue) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-soft-blue {
  border-color: var(--soft-blue);
}

.hover-border-color-soft-blue:hover ~ div.labels:after,
.hover-border-color-soft-blue:hover ~ div.labels:before {
  border: 1px solid var(--soft-blue);
}

.color-after-midnight-blue:after,
.color-before-midnight-blue:before,
.color-midnight-blue {
  color: var(--midnight-blue);
}

.bg-after-midnight-blue:after,
.bg-before-midnight-blue:before,
.bg-midnight-blue,
.hover-bg-midnight-blue:hover {
  background-color: var(--midnight-blue);
}

.fill-midnight-blue,
.fill-midnight-blue * {
  fill: var(--midnight-blue);
}

.bg-gu-midnight-blue {
  background: linear-gradient(
    180deg,
    var(--midnight-blue) 0,
    var(--white) 100%
  );
}

.bg-gd-midnight-blue {
  background: linear-gradient(0deg, var(--midnight-blue) 0, var(--white) 100%);
}

.scroll-midnight-blue {
  border-color: var(--midnight-blue) !important;
}

.scroll-midnight-blue:before {
  background-color: var(--midnight-blue) !important;
}

.fade-down-midnight-blue {
  position: relative;
}

.fade-down-midnight-blue:after {
  background: linear-gradient(0deg, var(--midnight-blue) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-midnight-blue {
  border-color: var(--midnight-blue);
}

.hover-border-color-midnight-blue:hover ~ div.labels:after,
.hover-border-color-midnight-blue:hover ~ div.labels:before {
  border: 1px solid var(--midnight-blue);
}

.color-after-grey-blue:after,
.color-before-grey-blue:before,
.color-grey-blue {
  color: var(--grey-blue);
}

.bg-after-grey-blue:after,
.bg-before-grey-blue:before,
.bg-grey-blue,
.hover-bg-grey-blue:hover {
  background-color: var(--grey-blue);
}

.fill-grey-blue,
.fill-grey-blue * {
  fill: var(--grey-blue);
}

.bg-gu-grey-blue {
  background: linear-gradient(180deg, var(--grey-blue) 0, var(--white) 100%);
}

.bg-gd-grey-blue {
  background: linear-gradient(0deg, var(--grey-blue) 0, var(--white) 100%);
}

.scroll-grey-blue {
  border-color: var(--grey-blue) !important;
}

.scroll-grey-blue:before {
  background-color: var(--grey-blue) !important;
}

.fade-down-grey-blue {
  position: relative;
}

.fade-down-grey-blue:after {
  background: linear-gradient(0deg, var(--grey-blue) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-grey-blue {
  border-color: var(--grey-blue);
}

.hover-border-color-grey-blue:hover ~ div.labels:after,
.hover-border-color-grey-blue:hover ~ div.labels:before {
  border: 1px solid var(--grey-blue);
}

.color-after-grey:after,
.color-before-grey:before,
.color-grey {
  color: var(--just-grey) !important;
}

.bg-after-grey:after,
.bg-before-grey:before,
.bg-grey,
.hover-bg-grey:hover {
  background-color: var(--just-grey);
}

.fill-grey,
.fill-grey * {
  fill: var(--just-grey);
}

.bg-gu-grey {
  background: linear-gradient(180deg, var(--just-grey) 0, var(--white) 100%);
}

.bg-gd-grey {
  background: linear-gradient(0deg, var(--just-grey) 0, var(--white) 100%);
}

.scroll-grey {
  border-color: var(--just-grey) !important;
}

.scroll-grey:before {
  background-color: var(--just-grey) !important;
}

.fade-down-grey {
  position: relative;
}

.fade-down-grey:after {
  background: linear-gradient(0deg, var(--just-grey) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-grey {
  border-color: var(--just-grey);
}

.hover-border-color-grey:hover ~ div.labels:after,
.hover-border-color-grey:hover ~ div.labels:before {
  border: 1px solid var(--just-grey);
}

.color-after-light-grey:after,
.color-before-light-grey:before,
.color-light-grey {
  color: var(--light-grey);
}

.bg-after-light-grey:after,
.bg-before-light-grey:before,
.bg-light-grey,
.hover-bg-light-grey:hover {
  background-color: var(--light-grey);
}

.fill-light-grey,
.fill-light-grey * {
  fill: var(--light-grey);
}

.bg-gu-light-grey {
  background: linear-gradient(180deg, var(--light-grey) 0, var(--white) 100%);
}

.bg-gd-light-grey {
  background: linear-gradient(0deg, var(--light-grey) 0, var(--white) 100%);
}

.scroll-light-grey {
  border-color: var(--light-grey) !important;
}

.scroll-light-grey:before {
  background-color: var(--light-grey) !important;
}

.fade-down-light-grey {
  position: relative;
}

.fade-down-light-grey:after {
  background: linear-gradient(0deg, var(--light-grey) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-light-grey {
  border-color: var(--light-grey);
}

.hover-border-color-light-grey:hover ~ div.labels:after,
.hover-border-color-light-grey:hover ~ div.labels:before {
  border: 1px solid var(--light-grey);
}

.color-after-yellow:after,
.color-before-yellow:before,
.color-yellow {
  color: var(--yellow);
}

.bg-after-yellow:after,
.bg-before-yellow:before,
.bg-yellow,
.hover-bg-yellow:hover {
  background-color: var(--yellow);
}

.fill-yellow,
.fill-yellow * {
  fill: var(--yellow);
}

.bg-gu-yellow {
  background: linear-gradient(180deg, var(--yellow) 0, var(--white) 100%);
}

.bg-gd-yellow {
  background: linear-gradient(0deg, var(--yellow) 0, var(--white) 100%);
}

.scroll-yellow {
  border-color: var(--yellow) !important;
}

.scroll-yellow:before {
  background-color: var(--yellow) !important;
}

.fade-down-yellow {
  position: relative;
}

.fade-down-yellow:after {
  background: linear-gradient(0deg, var(--yellow) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-yellow {
  border-color: var(--yellow);
}

.hover-border-color-yellow:hover ~ div.labels:after,
.hover-border-color-yellow:hover ~ div.labels:before {
  border: 1px solid var(--yellow);
}

.color-after-orange:after,
.color-before-orange:before,
.color-orange {
  color: var(--orange);
}

.bg-after-orange:after,
.bg-before-orange:before,
.bg-orange,
.hover-bg-orange:hover {
  background-color: var(--orange);
}

.fill-orange,
.fill-orange * {
  fill: var(--orange);
}

.bg-gu-orange {
  background: linear-gradient(180deg, var(--orange) 0, var(--white) 100%);
}

.bg-gd-orange {
  background: linear-gradient(0deg, var(--orange) 0, var(--white) 100%);
}

.scroll-orange {
  border-color: var(--orange) !important;
}

.scroll-orange:before {
  background-color: var(--orange) !important;
}

.fade-down-orange {
  position: relative;
}

.fade-down-orange:after {
  background: linear-gradient(0deg, var(--orange) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-orange {
  border-color: var(--orange);
}

.hover-border-color-orange:hover ~ div.labels:after,
.hover-border-color-orange:hover ~ div.labels:before {
  border: 1px solid var(--orange);
}

.color-after-blend-a:after,
.color-before-blend-a:before,
.color-blend-a {
  color: var(--blend-a);
}

.bg-after-blend-a:after,
.bg-before-blend-a:before,
.bg-blend-a,
.hover-bg-blend-a:hover {
  background-color: var(--blend-a);
}

.fill-blend-a,
.fill-blend-a * {
  fill: var(--blend-a);
}

.bg-gu-blend-a {
  background: linear-gradient(180deg, var(--blend-a) 0, var(--white) 100%);
}

.bg-gd-blend-a {
  background: linear-gradient(0deg, var(--blend-a) 0, var(--white) 100%);
}

.scroll-blend-a {
  border-color: var(--blend-a) !important;
}

.scroll-blend-a:before {
  background-color: var(--blend-a) !important;
}

.fade-down-blend-a {
  position: relative;
}

.fade-down-blend-a:after {
  background: linear-gradient(0deg, var(--blend-a) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-blend-a {
  border-color: var(--blend-a);
}

.hover-border-color-blend-a:hover ~ div.labels:after,
.hover-border-color-blend-a:hover ~ div.labels:before {
  border: 1px solid var(--blend-a);
}

.color-after-blend-b:after,
.color-before-blend-b:before,
.color-blend-b {
  color: var(--blend-b);
}

.bg-after-blend-b:after,
.bg-before-blend-b:before,
.bg-blend-b,
.hover-bg-blend-b:hover {
  background-color: var(--blend-b);
}

.fill-blend-b,
.fill-blend-b * {
  fill: var(--blend-b);
}

.bg-gu-blend-b {
  background: linear-gradient(180deg, var(--blend-b) 0, var(--white) 100%);
}

.bg-gd-blend-b {
  background: linear-gradient(0deg, var(--blend-b) 0, var(--white) 100%);
}

.scroll-blend-b {
  border-color: var(--blend-b) !important;
}

.scroll-blend-b:before {
  background-color: var(--blend-b) !important;
}

.fade-down-blend-b {
  position: relative;
}

.fade-down-blend-b:after {
  background: linear-gradient(0deg, var(--blend-b) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-blend-b {
  border-color: var(--blend-b);
}

.hover-border-color-blend-b:hover ~ div.labels:after,
.hover-border-color-blend-b:hover ~ div.labels:before {
  border: 1px solid var(--blend-b);
}

.color-after-blend-c:after,
.color-before-blend-c:before,
.color-blend-c {
  color: var(--blend-c);
}

.bg-after-blend-c:after,
.bg-before-blend-c:before,
.bg-blend-c,
.hover-bg-blend-c:hover {
  background-color: var(--blend-c);
}

.fill-blend-c,
.fill-blend-c * {
  fill: var(--blend-c);
}

.bg-gu-blend-c {
  background: linear-gradient(180deg, var(--blend-c) 0, var(--white) 100%);
}

.bg-gd-blend-c {
  background: linear-gradient(0deg, var(--blend-c) 0, var(--white) 100%);
}

.scroll-blend-c {
  border-color: var(--blend-c) !important;
}

.scroll-blend-c:before {
  background-color: var(--blend-c) !important;
}

.fade-down-blend-c {
  position: relative;
}

.fade-down-blend-c:after {
  background: linear-gradient(0deg, var(--blend-c) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-blend-c {
  border-color: var(--blend-c);
}

.hover-border-color-blend-c:hover ~ div.labels:after,
.hover-border-color-blend-c:hover ~ div.labels:before {
  border: 1px solid var(--blend-c);
}

.color-after-dark-blend-a:after,
.color-before-dark-blend-a:before,
.color-dark-blend-a {
  color: var(--dark-blend-a);
}

.bg-after-dark-blend-a:after,
.bg-before-dark-blend-a:before,
.bg-dark-blend-a,
.hover-bg-dark-blend-a:hover {
  background-color: var(--dark-blend-a);
}

.fill-dark-blend-a,
.fill-dark-blend-a * {
  fill: var(--dark-blend-a);
}

.bg-gu-dark-blend-a {
  background: linear-gradient(180deg, var(--dark-blend-a) 0, var(--white) 100%);
}

.bg-gd-dark-blend-a {
  background: linear-gradient(0deg, var(--dark-blend-a) 0, var(--white) 100%);
}

.scroll-dark-blend-a {
  border-color: var(--dark-blend-a) !important;
}

.scroll-dark-blend-a:before {
  background-color: var(--dark-blend-a) !important;
}

.fade-down-dark-blend-a {
  position: relative;
}

.fade-down-dark-blend-a:after {
  background: linear-gradient(0deg, var(--dark-blend-a) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-dark-blend-a {
  border-color: var(--dark-blend-a);
}

.hover-border-color-dark-blend-a:hover ~ div.labels:after,
.hover-border-color-dark-blend-a:hover ~ div.labels:before {
  border: 1px solid var(--dark-blend-a);
}

.color-after-dark-blend-b:after,
.color-before-dark-blend-b:before,
.color-dark-blend-b {
  color: var(--dark-blend-b);
}

.bg-dark-blend-b,
.color-after-dark-blend-b:after,
.color-before-dark-blend-b:before,
.hover-bg-dark-blend-b:hover {
  background-color: var(--dark-blend-b);
}

.fill-dark-blend-b,
.fill-dark-blend-b * {
  fill: var(--dark-blend-b);
}

.bg-gu-dark-blend-b {
  background: linear-gradient(180deg, var(--dark-blend-b) 0, var(--white) 100%);
}

.bg-gd-dark-blend-b {
  background: linear-gradient(0deg, var(--dark-blend-b) 0, var(--white) 100%);
}

.scroll-dark-blend-b {
  border-color: var(--dark-blend-b) !important;
}

.scroll-dark-blend-b:before {
  background-color: var(--dark-blend-b) !important;
}

.fade-down-dark-blend-b {
  position: relative;
}

.fade-down-dark-blend-b:after {
  background: linear-gradient(0deg, var(--dark-blend-b) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-dark-blend-b {
  border-color: var(--dark-blend-b);
}

.hover-border-color-dark-blend-b:hover ~ div.labels:after,
.hover-border-color-dark-blend-b:hover ~ div.labels:before {
  border: 1px solid var(--dark-blend-b);
}

.color-after-dark-blend-c:after,
.color-before-dark-blend-c:before,
.color-dark-blend-c {
  color: var(--dark-blend-c);
}

.bg-after-dark-blend-c:after,
.bg-before-dark-blend-c:before,
.bg-dark-blend-c,
.hover-bg-dark-blend-c:hover {
  background-color: var(--dark-blend-c);
}

.fill-dark-blend-c,
.fill-dark-blend-c * {
  fill: var(--dark-blend-c);
}

.bg-gu-dark-blend-c {
  background: linear-gradient(180deg, var(--dark-blend-c) 0, var(--white) 100%);
}

.bg-gd-dark-blend-c {
  background: linear-gradient(0deg, var(--dark-blend-c) 0, var(--white) 100%);
}

.scroll-dark-blend-c {
  border-color: var(--dark-blend-c) !important;
}

.scroll-dark-blend-c:before {
  background-color: var(--dark-blend-c) !important;
}

.fade-down-dark-blend-c {
  position: relative;
}

.fade-down-dark-blend-c:after {
  background: linear-gradient(0deg, var(--dark-blend-c) 0, transparent 100%);
  bottom: 0;
  content: "";
  display: block;
  height: 32px;
  position: absolute;
  width: 100%;
}

.border-color-dark-blend-c {
  border-color: var(--dark-blend-c);
}

.hover-border-color-dark-blend-c:hover ~ div.labels:after,
.hover-border-color-dark-blend-c:hover ~ div.labels:before {
  border: 1px solid var(--dark-blend-c);
}

.contrast-ab-blend-a:after,
.contrast-ab-blend-a:before,
.contrast-ab-blend-b:after,
.contrast-ab-blend-b:before,
.contrast-ab-blend-c:after,
.contrast-ab-blend-c:before,
.contrast-ab-bright-green:after,
.contrast-ab-bright-green:before,
.contrast-ab-light-blue:after,
.contrast-ab-light-blue:before,
.contrast-ab-light-green:after,
.contrast-ab-light-green:before,
.contrast-ab-light-grey:after,
.contrast-ab-light-grey:before,
.contrast-ab-orange:after,
.contrast-ab-orange:before,
.contrast-ab-soft-blue:after,
.contrast-ab-soft-blue:before,
.contrast-ab-white:after,
.contrast-ab-white:before,
.contrast-ab-yellow:after,
.contrast-ab-yellow:before {
  color: var(--black);
}

.contrast-ab-black:after,
.contrast-ab-black:before,
.contrast-ab-bright-blue:after,
.contrast-ab-bright-blue:before,
.contrast-ab-dark-blend-a:after,
.contrast-ab-dark-blend-a:before,
.contrast-ab-dark-blend-b:after,
.contrast-ab-dark-blend-b:before,
.contrast-ab-dark-blend-c:after,
.contrast-ab-dark-blend-c:before,
.contrast-ab-grey-blue:after,
.contrast-ab-grey-blue:before,
.contrast-ab-grey:after,
.contrast-ab-grey:before,
.contrast-ab-midnight-blue:after,
.contrast-ab-midnight-blue:before,
.contrast-ab-navy-blue:after,
.contrast-ab-navy-blue:before,
.contrast-ab-navy-green:after,
.contrast-ab-navy-green:before {
  color: var(--white);
}

.contrast-color-blend-a,
.contrast-color-blend-b,
.contrast-color-blend-c,
.contrast-color-bright-green,
.contrast-color-light-blue,
.contrast-color-light-green,
.contrast-color-light-grey,
.contrast-color-soft-blue,
.contrast-color-white,
.contrast-color-yellow {
  color: var(--black) !important;
}

.contrast-color-black,
.contrast-color-bright-blue,
.contrast-color-dark-blend-a,
.contrast-color-dark-blend-b,
.contrast-color-dark-blend-c,
.contrast-color-grey,
.contrast-color-grey-blue,
.contrast-color-midnight-blue,
.contrast-color-navy-blue,
.contrast-color-navy-green,
.contrast-color-orange,
.contrast-color-transparent {
  color: var(--white) !important;
}

.contrast-bg-blend-a,
.contrast-bg-blend-b,
.contrast-bg-blend-c,
.contrast-bg-bright-green,
.contrast-bg-light-blue,
.contrast-bg-light-green,
.contrast-bg-light-grey,
.contrast-bg-soft-blue,
.contrast-bg-white,
.contrast-bg-yellow {
  background-color: var(--black);
}

.contrast-bg-black,
.contrast-bg-bright-blue,
.contrast-bg-dark-blend-a,
.contrast-bg-dark-blend-b,
.contrast-bg-dark-blend-c,
.contrast-bg-grey,
.contrast-bg-grey-blue,
.contrast-bg-midnight-blue,
.contrast-bg-navy-blue,
.contrast-bg-navy-green,
.contrast-bg-orange {
  background-color: var(--white);
}

.contact-us {
  padding: 60px 0;
}

.subscribe-form {
  padding-bottom: 60px;
}

.vacancy-application {
  display: none;
  padding: 0 0 60px;
}

.vacancy-application.apply {
  display: block;
}

.contact-form-root {
  grid-gap: 20px;
  display: grid;
  gap: 20px;
  grid-template-areas: "fn ln" "pn ea" "mc mc" "cv cv" "cb cb" "sn sn" "sb sb";
  grid-template-columns: 1fr 1fr;
  margin: 0 auto;
  max-width: 820px;
}

.contact-form-root.subscribe {
  grid-template-areas: "fn ln" "pn pn" "ea ea" "sn sn";
}

.contact-form-root > div:first-child {
  grid-area: fn;
}

.contact-form-root > div:nth-child(2) {
  grid-area: ln;
}

.contact-form-root > div:nth-child(3) {
  grid-area: pn;
}

.contact-form-root > div:nth-child(4) {
  grid-area: ea;
}

.contact-form-root > div:nth-child(5) {
  grid-area: mc;
}

.contact-form-root > div:nth-child(6) {
  grid-area: cv;
}

.contact-form-root > div:nth-child(7) {
  grid-area: cb;
}

.contact-form-root > div:nth-child(8) {
  grid-area: sn;
}

.contact-form-root.subscribe > div:nth-child(5) {
  grid-area: sn;
}

.contact-form-root .submission .svg-btn {
  aspect-ratio: 1/1;
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.contact-form-root .submission .clutch {
  margin-left: -10px;
}

.contact-form-root .submission .clutch .clutch-btn {
  background-image: url(/wp-content/themes/twentytwentyfour/assets/images/clutchButton.8364dc8f70edc3e1f366.svg);
  width: 100px;
}

.contact-form-root .submission .send-btn {
  background-image: url(/wp-content/themes/twentytwentyfour/assets/images/send-button.e2cf8035e07ec0371722.svg);
  width: 180px;
}

form [type="file"] {
  display: none;
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  .contact-us {
    padding: 60px 64px 60px 32px;
  }

  .subscribe-form {
    padding: 0 64px 60px 32px;
  }

  .contact-form-root {
    grid-template-areas: unset;
    grid-template-columns: 1fr;
  }

  .contact-form-root.subscribe {
    grid-template-areas: unset;
    max-width: none;
  }

  .contact-form-root > div {
    grid-area: unset !important;
    place-self: end;
    width: 70%;
  }

  .contact-form-root .submission .clutch {
    margin-left: -5px;
  }

  .contact-form-root .submission .clutch .clutch-btn {
    width: 60px;
  }

  .contact-form-root .submission .send-btn {
    width: 100px;
  }

  .contact-form-root .Sub2 {
    font-size: 15px;
  }

  .contact-form-root .checkbox-root {
    margin-bottom: 10px;
  }

  .contact-form-root .checkbox-root .Link {
    font-size: 14px;
  }

  .vacancy-application .contact-form-root > div {
    place-self: unset;
    width: auto;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .contact-us {
    padding: 60px 0;
  }

  .subscribe-form {
    padding-bottom: 60px;
  }

  .contact-form-root {
    grid-template-areas: "fn ln" "pn ea" "mc mc" "cv cv" "cb cb" "sn sn" "sb sb";
    grid-template-columns: 1fr 1fr;
  }

  .contact-form-root.subscribe {
    grid-template-areas: "fn ln" "pn pn" "ea ea" "sn sn";
    max-width: 820px;
  }

  .contact-form-root > div {
    place-self: unset;
    width: auto;
  }

  .contact-form-root > div:first-child {
    grid-area: fn !important;
  }

  .contact-form-root > div:nth-child(2) {
    grid-area: ln !important;
  }

  .contact-form-root > div:nth-child(3) {
    grid-area: pn !important;
  }

  .contact-form-root > div:nth-child(4) {
    grid-area: ea !important;
  }

  .contact-form-root > div:nth-child(5) {
    grid-area: mc !important;
  }

  .contact-form-root > div:nth-child(6) {
    grid-area: cv !important;
  }

  .contact-form-root > div:nth-child(7) {
    grid-area: cb !important;
  }

  .contact-form-root > div:nth-child(8) {
    grid-area: sn !important;
  }

  .contact-form-root > div:nth-child(9) {
    grid-area: sb !important;
  }

  .contact-form-root.subscribe > div:nth-child(5) {
    grid-area: sn !important;
  }

  .contact-form-root .submission .clutch {
    margin-left: -10px;
  }

  .contact-form-root .submission .clutch .clutch-btn {
    width: 100px;
  }

  .contact-form-root .submission .send-btn {
    width: 180px;
  }

  .contact-form-root .Sub2 {
    font-size: 18px;
  }

  .contact-form-root .checkbox-root {
    margin-bottom: 20px;
  }

  .contact-form-root .checkbox-root .Link {
    font-size: 16px;
  }

  .vacancy-application .contact-form-root > div {
    place-self: unset;
    width: auto;
  }
}

@media screen and (max-width: 480px) {
  .vacancy-application {
    padding: 60px 0 20px;
  }

  .contact-us,
  .subscribe-form {
    padding: 0 32px 60px;
  }

  .contact-form-root {
    grid-template-columns: 1fr;
  }

  .contact-form-root,
  .contact-form-root.subscribe {
    grid-template-areas: unset;
  }

  .contact-form-root > div {
    grid-area: unset !important;
  }

  .contact-form-root .submission .clutch {
    margin-left: -5px;
  }

  .contact-form-root .submission .clutch .clutch-btn {
    width: 60px;
  }

  .contact-form-root .submission .send-btn {
    width: 100px;
  }

  .vacancies-separator {
    display: none;
  }
}

.slider-container {
  display: flex;
  flex-direction: row;
  max-width: 100%;
  overflow: hidden;
  padding-left: 360px;
  position: relative;
}

.slider-container .slider-side-bar {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: flex-end;
  left: 0;
  position: absolute;
  top: 0;
  width: 360px;
  z-index: 1;
}

.slider-container .slider-side-bar p {
  margin: 16px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
}

@media screen and (max-width: 1536px) and (min-width: 1201px) {
  .slider-container {
    padding-left: 120px;
  }

  .slider-container .slider-side-bar {
    width: 120px;
  }
}

@media (-webkit-device-pixel-ratio: 1.25) and (min-width: 960px) {

  .slider-container .slider-side-bar {
    width: 360px;
  }
}

@media screen and (max-width: 700px) {
  .slider-side-bar {
    display: none !important;
  }
}
@media screen and (min-width: 481px) and (max-width: 1200px) {
  .slider-container .slider-side-bar {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    top: 40px;
    width: 100vw;
    padding-inline: 60px;
  }
  .slider-container {
    padding-left: 0;
  }

  .slider-container .slider-side-bar p {
    font-size: 16px;
    font-weight: 600 !important;
    margin: 0 auto;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-writing-mode: horizontal-tb;
    writing-mode: horizontal-tb;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .shelf-content {
    padding-right: calc(40vw - 120px);
  }

  .shelf-content,
  .slider-container {
    padding-left: 120px;
  }

  .slider-container .slider-side-bar {
    height: 100%;
    top: 0;
    width: 120px;
  }

  .slider-container .slider-side-bar p {
    font-size: 24px;
    font-weight: 700 !important;
    margin: 16px;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
  }
}

@media (max-width: 480px) {
  .slider-container {
    padding-left: 0;
  }
}

.single-counter {
  padding: 92px 0;
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  .counter {
    height: 405px;
  }

  .counter .container {
    justify-content: flex-start;
  }

  .counter .container :first-child div {
    padding-right: 50px;
  }

  .counter .container :last-child div {
    padding-right: 20px;
  }

  .counter .container .single-counter {
    display: flex;
    flex: initial;
    height: 30px;
    padding: 0;
    position: relative;
    width: 30vw;
  }

  .counter .container .single-counter div {
    align-items: flex-start;
    display: flex;
    justify-content: flex-end;
    position: absolute;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    width: 350px;
  }

  .counter .container .single-counter .H1 {
    font-size: 120px;
    line-height: 120px;
    text-align: right;
  }

  .counter .container .single-counter .H1 span {
    font-weight: 300 !important;
  }

  .counter .container .single-counter .H6 {
    margin-left: 10px;
    margin-top: 15px;
    max-width: 100px;
    text-align: initial;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .counter {
    height: auto;
  }

  .counter .container {
    justify-content: normal;
  }

  .counter .container :first-child div,
  .counter .container :last-child div {
    padding-right: 0;
  }

  .counter .container .single-counter {
    flex: 1 1;
    height: auto;
    padding: 92px 0;
    position: static;
    width: auto;
  }

  .counter .container .single-counter div {
    align-items: normal;
    display: initial;
    justify-content: normal;
    position: static;
    -webkit-transform: initial;
    transform: none;
    width: auto;
  }

  .counter .container .single-counter .H1 {
    font-size: 96px;
    line-height: 113px;
    text-align: center;
  }

  .counter .container .single-counter .H1 span {
    font-weight: 400 !important;
  }

  .counter .container .single-counter .H6 {
    margin-left: 0;
    margin-top: 0;
    max-width: none;
    text-align: inherit;
  }
}

@media (max-width: 480px) {
  .counter {
    height: 810px;
  }

  .counter .container {
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
  }

  .counter .container :first-child div {
    padding-right: 60px;
  }

  .counter .container :last-child div {
    padding-right: 30px;
  }

  .counter .container .single-counter {
    display: flex;
    flex: initial;
    height: 60vw;
    padding: 0;
    position: relative;
    width: 100vw;
  }

  .counter .container .single-counter div {
    align-items: flex-start;
    display: flex;
    justify-content: flex-end;
    position: absolute;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    width: 350px;
  }

  .counter .container .single-counter .H1 {
    font-size: 120px;
    line-height: 120px;
    text-align: right;
    width: 250px;
  }

  .counter .container .single-counter .H1 span {
    font-weight: 300 !important;
  }

  .counter .container .single-counter .H6 {
    margin-left: 10px;
    margin-top: 15px;
    text-align: initial;
    width: 100px;
  }
}

.page_products-services header,
.page_products-services-en header {
  padding-bottom: 60px;
}
.hero-root {
  align-items: center;
  display: flex;
  height: calc(100vh - 144px);
  justify-content: center;
  min-height: 600px;
}

.hero-root .hero-desc {
  display: flex;
  flex-direction: column-reverse;
  margin-top: 20px;
}

.hero-root .hero-desc .hero-button {
  margin-top: -20px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.hero-root .hero-desc .hero-button a div {
  aspect-ratio: 1/1;
  background-image: url(/static/media/in-touch.5d367d47634a9f456e35.svg);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 200px;
}

.hero-root .hero-desc .description {
  align-self: end;
  max-width: 400px;
}

.hero-root .scroll-down {
  border: 1px solid var(--white);
  border-radius: 25px;
  bottom: 40px;
  height: 34px;
  left: 50%;
  margin-left: -20px;
  margin-top: -35px;
  position: absolute;
  width: 20px;
}

.hero-root .scroll-down:before {
  -webkit-animation: scroll 1.5s infinite;
  animation: scroll 1.5s infinite;
  background: var(--white);
  border-radius: 4px;
  content: "";
  height: 8px;
  left: 50%;
  margin-left: -4px;
  position: absolute;
  top: 8px;
  width: 8px;
}

.hero-root .scroll-text {
  display: none;
}

.hero-root .block .motto {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.hero-root .block .motto .line {
  display: flex;
  flex-direction: row;
}

.hero-root .block .motto .line .box .H2 {
  overflow: hidden;
  transition: all ease-in-out;
}

.full-size {
  height: 100vh;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.background-img {
  background-size: contain;
  object-fit: contain;
}

.parallax-background-img {
  background-image: url(/wp-content/themes/twentytwentyfour/assets/images/texture-bg.bbef3745b1be130266a7.svg);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 2800px;
  -webkit-filter: contrast(200%);
  filter: contrast(200%);
  opacity: 0.2;
  background-size: 120% 120%;
}

.char {
  -webkit-animation: insert 1s ease-out 1 both;
  animation: insert 1s ease-out 1 both;
  display: inline-block;
}

#floating-pointer {
  -webkit-animation: wiggle 3s ease-in-out infinite alternate;
  animation: wiggle 3s ease-in-out infinite alternate;
}

@media screen and (min-width: 1201px) and (-webkit-device-pixel-ratio: 1.25) {
  .hero-root {
    height: calc(125vh - 144px);
  }

  .full-size {
    height: 125vh;
    min-height: 800px;
  }
}

@media screen and (max-width: 1200px) and (min-width: 555px) {
  .background-img {
    display: none;
  }

  .hero-root {
    height: -webkit-max-content;
    height: max-content;
    position: relative;
  }

  .hero-root .hero-desc {
    align-items: center;
    margin-top: 64px;
  }

  .hero-root .hero-desc .hero-button {
    align-items: center;
    display: flex;
    flex: 1 1;
    justify-content: center;
    margin: 0 30px 0 10px;
  }

  .hero-root .hero-desc .hero-button a div {
    aspect-ratio: 1/1;
    background-image: url(/static/media/in-touch.5d367d47634a9f456e35.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    width: 100px;
  }

  .hero-root .hero-desc .description {
    max-width: 300px;
  }

  .hero-root .scroll-down {
    display: none;
  }

  .hero-root .scroll-text {
    display: flex;
    gap: 6px;
    position: absolute;
    right: 32px;
    top: 40vh;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
  }
}

@media screen and (max-width: 1200px) and (min-width: 555px) and (orientation: portrait) {
  .hero-root .scroll-text {
    display: flex;
    gap: 6px;
    position: absolute;
    right: 32px;
    top: 25vh;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
  }
}

@media screen and (max-width: 1200px) and (min-width: 555px) {
  .hero-root .block {
    padding: 60px 32px;
    position: relative;
  }

  .hero-root .block .motto {
    align-items: normal;
  }

  .hero-root .block .motto .H2 {
    font-size: 72px;
    line-height: 84px;
    max-width: 600px;
  }

  .hero-root .Body {
    font-size: 14px;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .background-img {
    display: initial;
  }

  .hero-root {
    height: calc(125vh - 144px);
    position: static;
  }

  .hero-root .hero-desc {
    align-items: normal;
    margin-top: 20px;
  }

  .hero-root .hero-desc .hero-button {
    align-items: normal;
    display: initial;
    flex: initial;
    justify-content: normal;
    margin: initial;
    margin-top: -20px;
  }

  .hero-root .hero-desc .hero-button a div {
    aspect-ratio: 1/1;
    background-image: url(/static/media/in-touch.5d367d47634a9f456e35.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    width: 200px;
  }

  .hero-root .hero-desc .description {
    max-width: 400px;
  }

  .hero-root .scroll-down {
    display: initial;
  }

  .hero-root .scroll-text {
    display: none;
  }

  .hero-root .block {
    padding: initial;
    position: static;
  }

  .hero-root .block .motto {
    align-items: center;
  }

  .hero-root .block .motto .H2 {
    font-size: 104px;
    line-height: 122px;
    max-width: none;
  }

  .hero-root .Body {
    font-size: 16px;
  }

  .full-size {
    height: 125vh;
    min-height: 800px;
  }
}

@media screen and (max-width: 554px) {
  .background-img {
    display: none;
  }

  .hero-root {
    height: -webkit-max-content;
    height: max-content;
    position: relative;
  }

  .hero-root .hero-desc {
    flex-direction: column-reverse;
    gap: 30px;
    margin-top: 0;
    padding: 32px 16px 0;
  }

  .hero-root .hero-desc .description {
    align-self: auto;
    max-width: 300px;
  }

  .hero-root .hero-desc .hero-button {
    align-self: center;
    display: flex;
    flex: 1 1;
    justify-content: center;
    margin-top: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
  }

  .hero-root .hero-desc .Body {
    font-size: 14px;
  }

  .hero-root .scroll-down {
    display: none;
  }

  .hero-root .scroll-text {
    display: flex;
    gap: 6px;
    position: absolute;
    right: 16px;
    top: 55%;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
  }

  .hero-root .block .motto {
    align-items: flex-start;
    margin-top: 15vh;
  }

  .hero-root .block .motto .H2 {
    font-size: 40px;
    font-style: italic;
    font-weight: 400;
    line-height: 49px;
    margin-left: 16px;
    max-width: 342px;
    -webkit-text-orientation: mixed;
    text-orientation: mixed;
  }
}

@-webkit-keyframes insert {
  0% {
    opacity: 0;
    -webkit-transform: perspective(500px) translate3d(-35px, -40px, -150px)
      rotate3d(1, -1, 0, 35deg);
    transform: perspective(500px) translate3d(-35px, -40px, -150px)
      rotate3d(1, -1, 0, 35deg);
  }

  to {
    opacity: 1;
    -webkit-transform: perspective(500px) translateZ(0);
    transform: perspective(500px) translateZ(0);
  }
}

@keyframes insert {
  0% {
    opacity: 0;
    -webkit-transform: perspective(500px) translate3d(-35px, -40px, -150px)
      rotate3d(1, -1, 0, 35deg);
    transform: perspective(500px) translate3d(-35px, -40px, -150px)
      rotate3d(1, -1, 0, 35deg);
  }

  to {
    opacity: 1;
    -webkit-transform: perspective(500px) translateZ(0);
    transform: perspective(500px) translateZ(0);
  }
}

@-webkit-keyframes wiggle {
  0% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }

  to {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }
}

@keyframes wiggle {
  0% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }

  to {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }
}

@-webkit-keyframes scroll {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translateY(16px);
    transform: translateY(16px);
  }
}

@keyframes scroll {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translateY(16px);
    transform: translateY(16px);
  }
}

.shelf-content .H3 {
  padding-top: 60px;
}

.services-slider .product-card {
  align-items: center;
  display: inline-flex;
  position: relative;
}

.services-slider .product-card .product-desc .product-image {
  /* background-color: #c4c4c4; */
  margin-bottom: 30px;
  overflow: hidden;
  -webkit-transform-origin: bottom left;
  transform-origin: bottom left;
  position: relative;
  z-index: 12;
}

.services-slider .product-card .product-desc .product-image img {
  height: 100%;
}

.services-slider .product-card .product-title .H2 {
  font-size: 94px;
  line-height: 84.6px;
}
.services-slider .product-card .product-title {
  position: absolute;
  z-index: 15;
  bottom: 94px;
  left: 40px;
  height: 0px;
}

.services-slider .product-desc .animated-link {
  position: relative;
  z-index: 12;
}

.services-slider .product-card .pager {
  height: 100%;
  width: 100%;
  z-index: 11;
  position: absolute;
}

.services-slider .services-card {
  padding: 60px 30px;
  position: relative;
  width: 420px;
}

.services-slider .services-card p {
  transition: color 0.5s ease-out;
}

.services-slider .services-card.navy-green:after,
.services-slider .services-card.navy-green:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--navy-green) 0,
    transparent 100%
  );
}

.services-slider .services-card.navy-green.selected:after {
  background: linear-gradient(0deg, var(--navy-green) 0, transparent 100%);
}

.services-slider .services-card.bright-green:after,
.services-slider .services-card.bright-green:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--bright-green) 0,
    transparent 100%
  );
}

.services-slider .services-card.bright-green.selected:after {
  background: linear-gradient(0deg, var(--bright-green) 0, transparent 100%);
}

.services-slider .services-card.light-green:after,
.services-slider .services-card.light-green:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--light-green) 0,
    transparent 100%
  );
}

.services-slider .services-card.light-green.selected:after {
  background: linear-gradient(0deg, var(--light-green) 0, transparent 100%);
}

.services-slider .services-card.navy-blue:after,
.services-slider .services-card.navy-blue:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--navy-blue) 0,
    transparent 100%
  );
}

.services-slider .services-card.navy-blue.selected:after {
  background: linear-gradient(0deg, var(--navy-blue) 0, transparent 100%);
}

.services-slider .services-card.bright-blue:after,
.services-slider .services-card.bright-blue:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--bright-blue) 0,
    transparent 100%
  );
}

.services-slider .services-card.bright-blue.selected:after {
  background: linear-gradient(0deg, var(--bright-blue) 0, transparent 100%);
}

.services-slider .services-card.light-blue:after,
.services-slider .services-card.light-blue:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--light-blue) 0,
    transparent 100%
  );
}

.services-slider .services-card.light-blue.selected:after {
  background: linear-gradient(0deg, var(--light-blue) 0, transparent 100%);
}

.services-slider .services-card.grey-blue:after,
.services-slider .services-card.grey-blue:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--grey-blue) 0,
    transparent 100%
  );
}

.services-slider .services-card.grey-blue.selected:after {
  background: linear-gradient(0deg, var(--grey-blue) 0, transparent 100%);
}

.services-slider .services-card.midnight-blue:after,
.services-slider .services-card.midnight-blue:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--midnight-blue) 0,
    transparent 100%
  );
}

.services-slider .services-card.midnight-blue.selected:after {
  background: linear-gradient(0deg, var(--midnight-blue) 0, transparent 100%);
}

.services-slider .services-card.light-grey:after,
.services-slider .services-card.light-grey:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--light-grey) 0,
    transparent 100%
  );
}

.services-slider .services-card.light-grey.selected:after {
  background: linear-gradient(0deg, var(--light-grey) 0, transparent 100%);
}

.services-slider .services-card.grey:after,
.services-slider .services-card.grey:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--just-grey) 0,
    transparent 100%
  );
}

.services-slider .services-card.grey.selected:after {
  background: linear-gradient(0deg, var(--just-grey) 0, transparent 100%);
}

.services-slider .services-card.yellow:after,
.services-slider .services-card.yellow:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--yellow) 0,
    transparent 100%
  );
}

.services-slider .services-card.yellow.selected:after {
  background: linear-gradient(0deg, var(--yellow) 0, transparent 100%);
}

.services-slider .services-card.black:after,
.services-slider .services-card.black:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--black) 0,
    transparent 100%
  );
}

.services-slider .services-card.black.selected:after {
  background: linear-gradient(0deg, var(--black) 0, transparent 100%);
}

.services-slider .services-card.orange:after,
.services-slider .services-card.orange:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--orange) 0,
    transparent 100%
  );
}

.services-slider .services-card.orange.selected:after {
  background: linear-gradient(0deg, var(--orange) 0, transparent 100%);
}

.services-slider .services-card.white:after,
.services-slider .services-card.white:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--white) 0,
    transparent 100%
  );
}

.services-slider .services-card.white.selected:after {
  background: linear-gradient(0deg, var(--white) 0, transparent 100%);
}

.services-slider .services-card.ending:after,
.services-slider .services-card.ending:hover:after,
.services-slider .services-card.soft-blue:after,
.services-slider .services-card.soft-blue:hover:after {
  background: radial-gradient(
    50.12% 100% at 49.88% 100%,
    var(--soft-blue) 0,
    transparent 100%
  );
}

.services-slider .services-card.ending.selected:after,
.services-slider .services-card.soft-blue.selected:after {
  background: linear-gradient(0deg, var(--soft-blue) 0, transparent 100%);
}

.services-slider .services-card:after {
  bottom: 0;
  content: "";
  height: 0;
  left: 50%;
  position: absolute;
  right: 50%;
  transition: all 0.5s ease;
  z-index: -1;
}

.services-slider .services-card:hover:after {
  border-radius: 1000px 1000px 0 0;
  height: 210px;
  left: 0;
  right: 0;
  transition: all 1s ease;
}

.services-slider .services-card.selected:after,
.services-slider .services-card.selected:hover:after {
  border-radius: 0;
  height: 50%;
  left: 0;
  right: 0;
  transition: all 1s ease;
}

.services-slider .services-card .image {
  height: 532px;
  margin-bottom: 30px;
  overflow: hidden;
  width: 355px;
}

.services-slider .services-card .image img {
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
  width: 100%;
}

.services-slider .services-card .desc {
  width: 100%;
}

.services-slider .services-card.square .image {
  height: 355px;
}

.services-mob {
  display: flex;
  flex-direction: column;
}

.services-mob .shelf-content-mob {
  padding: 32px;
}

.services-mob .services-tree-mob {
  flex-direction: row;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  width: 100vw;
}

.services-mob .services-tree-mob .services-card {
  padding: 20px 16px 32px;
  position: relative;
  scroll-snap-align: start;
  width: 342px;
}

.services-mob .services-tree-mob .services-card > div {
  z-index: 2;
}

.services-mob .services-tree-mob .services-card:after {
  bottom: 0;
  content: "";
  height: 0;
  left: 0;
  position: absolute;
  right: 0;
  transition: all 0.5s ease;
}

.services-mob .services-tree-mob .services-card.navy-green:after {
  background: linear-gradient(0deg, var(--navy-green) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.bright-green:after {
  background: linear-gradient(0deg, var(--bright-green) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.light-green:after {
  background: linear-gradient(0deg, var(--light-green) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.navy-blue:after {
  background: linear-gradient(0deg, var(--navy-blue) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.bright-blue:after {
  background: linear-gradient(0deg, var(--bright-blue) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.light-blue:after {
  background: linear-gradient(0deg, var(--light-blue) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.grey-blue:after {
  background: linear-gradient(0deg, var(--grey-blue) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.midnight-blue:after {
  background: linear-gradient(0deg, var(--midnight-blue) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.light-grey:after {
  background: linear-gradient(0deg, var(--light-grey) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.grey:after {
  background: linear-gradient(0deg, var(--just-grey) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.black:after {
  background: linear-gradient(0deg, var(--black) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.orange:after {
  background: linear-gradient(0deg, var(--orange) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.yellow:after {
  background: linear-gradient(0deg, var(--yellow) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.white:after {
  background: linear-gradient(0deg, var(--white) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.ending:after,
.services-mob .services-tree-mob .services-card.soft-blue:after {
  background: linear-gradient(0deg, var(--soft-blue) 0, transparent 100%);
}

.services-mob .services-tree-mob .services-card.selected:after {
  height: 50%;
}

.services-mob .services-tree-mob .services-card .image {
  height: 526px;
  overflow: visible;
  position: relative;
  width: 310px;
}

.services-mob .services-tree-mob .services-card .image img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.services-mob .services-tree-mob .services-card .image .mob-card-arrow {
  background-color: var(--white);
  border-radius: 50%;
  bottom: -32px;
  height: 66px;
  position: absolute;
  right: 16px;
  -webkit-transform: rotate(-30deg);
  transform: rotate(-30deg);
  width: 66px;
}

.services-mob
  .services-tree-mob
  .services-card
  .image
  .mob-card-arrow
  .arrow-svg
  .point {
  fill: var(--navy-green);
}

.services-mob .services-tree-mob .services-card .desc {
  padding-top: 20px;
  position: relative;
  width: 70%;
}

.services-mob .services-tree-mob .services-card .desc p {
  transition: color 0.5s ease-out;
}

.services-mob .services-tree-mob .services-card .desc .bold {
  font-size: 16px;
  font-weight: 600 !important;
  line-height: 22px;
}

.services-mob .services-tree-mob .services-card .desc .medium {
  font-size: 14px;
  font-weight: 400 !important;
  line-height: 140%;
}

.services-mob .services-tree-mob .services-card.square .image {
  height: 310px;
}

.services-tree .flex-col .services-card.selected.bright-green p,
.services-tree .flex-col .services-card.selected.light-blue p,
.services-tree .flex-col .services-card.selected.light-green p,
.services-tree .flex-col .services-card.selected.light-grey p,
.services-tree .flex-col .services-card.selected.navy-green p,
.services-tree .flex-col .services-card.selected.soft-blue p,
.services-tree .flex-col .services-card.selected.white p,
.services-tree .flex-col .services-card.selected.yellow p,
.services-tree .services-mob .services-card.selected.bright-green p,
.services-tree .services-mob .services-card.selected.light-blue p,
.services-tree .services-mob .services-card.selected.light-green p,
.services-tree .services-mob .services-card.selected.light-grey p,
.services-tree .services-mob .services-card.selected.navy-green p,
.services-tree .services-mob .services-card.selected.soft-blue p,
.services-tree .services-mob .services-card.selected.white p,
.services-tree .services-mob .services-card.selected.yellow p {
  color: var(--black);
}

.services-tree .flex-col .services-card.selected.black p,
.services-tree .flex-col .services-card.selected.bright-blue p,
.services-tree .flex-col .services-card.selected.grey p,
.services-tree .flex-col .services-card.selected.grey-blue p,
.services-tree .flex-col .services-card.selected.midnight-blue p,
.services-tree .flex-col .services-card.selected.navy-blue p,
.services-tree .flex-col .services-card.selected.orange p,
.services-tree .services-mob .services-card.selected.black p,
.services-tree .services-mob .services-card.selected.bright-blue p,
.services-tree .services-mob .services-card.selected.grey p,
.services-tree .services-mob .services-card.selected.grey-blue p,
.services-tree .services-mob .services-card.selected.midnight-blue p,
.services-tree .services-mob .services-card.selected.navy-blue p,
.services-tree .services-mob .services-card.selected.orange p {
  color: var(--white);
}

.services-tree .flex-col:first-child .services-card.selected:after,
.services-tree .services-mob:first-child .services-card.selected:after {
  height: 100%;
}

.services-tree .flex-col:first-child .services-card.selected.navy-green:after,
.services-tree
  .services-mob:first-child
  .services-card.selected.navy-green:after {
  background: var(--navy-green);
}

.services-tree .flex-col:first-child .services-card.selected.bright-green:after,
.services-tree
  .services-mob:first-child
  .services-card.selected.bright-green:after {
  background: var(--bright-green);
}

.services-tree .flex-col:first-child .services-card.selected.light-green:after,
.services-tree
  .services-mob:first-child
  .services-card.selected.light-green:after {
  background: var(--light-green);
}

.services-tree .flex-col:first-child .services-card.selected.navy-blue:after,
.services-tree
  .services-mob:first-child
  .services-card.selected.navy-blue:after {
  background: var(--navy-blue);
}

.services-tree .flex-col:first-child .services-card.selected.bright-blue:after,
.services-tree
  .services-mob:first-child
  .services-card.selected.bright-blue:after {
  background: var(--bright-blue);
}

.services-tree .flex-col:first-child .services-card.selected.light-blue:after,
.services-tree
  .services-mob:first-child
  .services-card.selected.light-blue:after {
  background: var(--light-blue);
}

.services-tree .flex-col:first-child .services-card.selected.soft-blue:after,
.services-tree
  .services-mob:first-child
  .services-card.selected.soft-blue:after {
  background: var(--soft-blue);
}

.services-tree .flex-col:first-child .services-card.selected.grey-blue:after,
.services-tree
  .services-mob:first-child
  .services-card.selected.grey-blue:after {
  background: var(--grey-blue);
}

.services-tree
  .flex-col:first-child
  .services-card.selected.midnight-blue:after,
.services-tree
  .services-mob:first-child
  .services-card.selected.midnight-blue:after {
  background: var(--midnight-blue);
}

.services-tree .flex-col:first-child .services-card.selected.light-grey:after,
.services-tree
  .services-mob:first-child
  .services-card.selected.light-grey:after {
  background: var(--light-grey);
}

.services-tree .flex-col:first-child .services-card.selected.grey:after,
.services-tree .services-mob:first-child .services-card.selected.grey:after {
  background: var(--just-grey);
}

.services-tree .flex-col:first-child .services-card.selected.yellow:after,
.services-tree .services-mob:first-child .services-card.selected.yellow:after {
  background: var(--yellow);
}

.services-tree .flex-col:first-child .services-card.selected.white:after,
.services-tree .services-mob:first-child .services-card.selected.white:after {
  background: var(--white);
}

.services-tree .flex-col:first-child .services-card.selected.black:after,
.services-tree .services-mob:first-child .services-card.selected.black:after {
  background: var(--black);
}

.services-tree .flex-col:first-child .services-card.selected.orange:after,
.services-tree .services-mob:first-child .services-card.selected.orange:after {
  background: var(--orange);
}

.services-tree .flex-col:first-child #cards-tree {
  text-align: center;
}
.slider-container .slider-side-bar .side-text {
  font-weight: 700;
}

@media screen and (max-width: 1536px) and (min-width: 1201px) {
  .services-slider .product-card .pager {
    width: 515px;
  }
}

@media screen and (max-width: 1536px) and (min-width: 1201px) and (-webkit-device-pixel-ratio: 1) {
  .services-slider .product-card .product-title .H2 {
    font-size: 70px;
    font-weight: 700;
    line-height: 63px;
  }
}

@media screen and (min-width: 1201px) and (-webkit-device-pixel-ratio: 1.25) {
  .services-slider .product-card .pager {
    width: 643.75px;
  }
}

@media screen and (max-width: 1200px) and (min-width: 769px) {
  /* .services-slider .product-card {
        margin: 192px 0 92px 16px
    } */
}
@media screen and (min-width: 701px) and (max-width: 999px) {
  .services-slider .product-card .product-desc .product-image {
    height: 304px;
    width: 304px;
  }
}
@media screen and (min-width: 1000px) and (max-width: 1000px) {
  .services-slider .product-card .product-desc .product-image {
    height: 454px;
    width: 454px;
  }
  .services-slider .product-card .product-title {
    bottom: 0px !important;
    left: 16px;
  }
  .services-slider .product-card:nth-child(2) .product-title {
    left: 30px;
  }
  .services-slider .product-card .product-desc {
    width: 100%;
  }
  .services-slider .product-card {
    margin: 182px 0 171px 0;
    width: 49.8%;
    padding-left: 16px;
    padding-right: 30px;
  }
  .services-slider .product-card:nth-child(2) {
    margin: 182px 0 0px 0;
    padding-left: 30px;
    padding-right: 16px;
  }
}
@media screen and (min-width: 1001px) and (max-width: 1200px) {
  .services-slider .product-card .product-title {
    left: 56px;
  }
}
@media screen and (min-width: 1001px) and (max-width: 1200px) {
  .services-slider .product-card:nth-child(2) .product-title {
    left: 70px;
  }
  .services-slider .product-card .product-desc .product-image {
    height: 612px;
    /* width: 454px */
  }
}
@media screen and (min-width: 1201px) and (max-width: 1536px) {
  .services-slider .product-card .product-desc .product-image img {
    height: auto;
    width: 100%;
  }
  .services-slider .product-card .product-desc .product-image {
    height: 612px;
    /* width: 390px */
  }
}
@media screen and (min-width: 1536px) {
  .services-slider .product-card .product-title .H2 {
    font-size: 94px !important;
  }
  .services-slider .product-card .product-desc {
    width: 100%;
  }
  .services-slider .product-card .product-desc .product-image {
    /* width: 558px; */
    height: 612px;
  }
  .services-slider .product-card .product-desc .product-image img {
    height: auto;
    width: 100%;
  }
  .services-slider .product-card .product-title {
    left: 140px;
  }
  .services-slider .product-card:nth-child(2) .product-title {
    left: 90px;
  }
}
@media screen and (min-width: 701px) and (max-width: 1200px) {
  .slider-container .slider-side-bar {
    display: block !important;
    margin-top: 60px;
  }

  .services-slider .product-card .product-desc .product-image img {
    height: 100%;
    object-fit: cover;
    width: 100%;
  }

  .services-mob-slider {
    display: flex;
    flex-direction: row;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
  }

  .services-mob-slider > div {
    scroll-snap-align: start;
  }

  .services-mob-slider > div:last-child {
    padding-right: 32px;
  }

  .services-mob-slider .services-mob-card {
    background-color: var(--just-grey);
    margin: 40px 0 92px 32px;
    position: relative;
  }

  .services-mob-slider .services-mob-card .mob-card-arrow {
    background-color: var(--white);
    border-radius: 50%;
    bottom: -32px;
    height: 66px;
    position: absolute;
    right: 16px;
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg);
    width: 66px;
  }

  .services-mob-slider .services-mob-card .mob-card-arrow .arrow-svg .point {
    fill: var(--navy-green);
  }

  .services-mob-slider .services-mob-card:before {
    bottom: -32px;
    color: var(--white);
    content: attr(data-title);
    font-family: var(--font);
    font-size: 60px;
    font-weight: 700;
    left: 0;
    line-height: 70px;
    position: absolute;
    text-align: right;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
  }

  .services-mob-slider .services-mob-card img {
    height: 530px;
    object-fit: cover;
    width: 310px;
  }

  .services-tree .shelf-content-mob {
    padding: 60px 32px 120px;
    text-align: center;
  }

  .services-mob .services-tree-mob .ending-spacer {
    padding: 20px 16px 32px;
    scroll-snap-align: start;
    width: calc(100vw - 342px);
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .services-slider .product-card {
    margin: 100px 0 100px 85px;
  }

  .services-slider .product-card .product-desc .product-image {
    height: 612px;
    width: 480px;
  }

  .services-slider .product-card .product-desc .product-image img {
    height: auto;
    object-fit: fill;
    width: auto;
  }

  .services-slider .product-card .product-title .H2 {
    font-size: 70px;
    font-weight: 700;
    line-height: 63px;
  }

  .services-slider .product-card .pager {
    width: 515px;
  }
}

@media screen and (max-width: 480px) {
  .services-slider .product-card {
    margin: 192px 0 92px 16px;
  }

  .services-slider .product-card .product-desc .product-image {
    height: 200px;
    width: 310px;
  }

  .services-slider .product-card .product-desc .product-image img {
    height: 100%;
    object-fit: cover;
    width: 100%;
  }

  .services-title p {
    font-weight: 600;
  }

  .services-mob-slider {
    display: flex;
    flex-direction: row;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
  }

  .services-mob-slider .services-mob-card {
    margin: 40px 16px 92px;
    position: relative;
    scroll-snap-align: center;
  }

  .services-mob-slider .services-mob-card .mob-card-arrow {
    background-color: var(--white);
    border-radius: 50%;
    bottom: -32px;
    height: 66px;
    position: absolute;
    right: 16px;
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg);
    width: 66px;
  }

  .services-mob-slider .services-mob-card .mob-card-arrow .arrow-svg .point {
    fill: var(--navy-green);
  }

  .services-mob-slider .services-mob-card:before {
    bottom: -32px;
    color: var(--white);
    content: attr(data-title);
    font-family: var(--font);
    font-size: 60px;
    font-weight: 700;
    left: 0;
    line-height: 70px;
    position: absolute;
    text-align: right;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
  }

  .services-mob-slider .services-mob-card img {
    height: 530px;
    object-fit: cover;
    width: 310px;
  }
}

.root-values {
  align-items: center;
  display: flex;
  flex-direction: column;
  padding: 60px 0;
  overflow-x: clip;
}

.root-values .spacer {
  height: 365px;
  width: 100%;
}

.root-values .values-header {
  display: flex;
  margin-bottom: 435px;
  top: 60px;
  width: 100%;
}

.single-card {
  width: 295px;
}

.single-card .value-card {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  margin: 0 10px;
  min-height: 375px;
  padding: 45px 30px;
  position: relative;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  z-index: 99;
}

.single-card .value-card,
.single-card .value-card .card-content {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.single-card .value-card .card-content .value-circle {
  border-radius: 50%;
  height: 125px;
  margin: 0 auto 35px;
  -webkit-transform: translateZ(50px);
  transform: translateZ(50px);
  width: 125px;
}

.single-card .value-card .card-content p {
  -webkit-transform: translateZ(30px);
  transform: translateZ(30px);
}

.blog-container {
  align-items: center;
  background-color: var(--navy-green);
  display: flex;
  height: 100px;
  justify-content: center;
  transition: margin-bottom 1s ease-out 15s;
  width: 100%;
}

.sticky {
  position: -webkit-sticky;
  position: sticky;
}

.value-title {
  margin-bottom: 10px;
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  .root-values {
    padding: 20px 32px 52px;
  }

  .root-values .values-header {
    margin-bottom: 0;
  }

  .root-values .card-spacer,
  .root-values .spacer {
    display: none;
  }

  .root-values .sticky {
    position: static;
  }

  .root-values .sticky .H3 {
    font-size: 40px;
    line-height: 47px;
  }

  .root-values .sticky .f1 {
    max-width: 174px;
  }

  .root-values .container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 26px;
    justify-content: center;
    margin-top: 40px;
    width: 616px;
  }

  .root-values .container .single-card {
    margin-bottom: 8px;
  }

  .root-values .container .single-card:nth-child(2) {
    margin-top: 200px;
  }

  .root-values .container .single-card:nth-child(3) {
    margin-top: -200px;
  }

  .root-values .container .single-card .value-card {
    margin: initial;
    padding: 30px 30px 45px;
  }

  .root-values .container .single-card .value-card .Body2 {
    font-size: 14px;
  }

  .root-values .container .single-card .value-card .card-content > * {
    -webkit-transform: initial;
    transform: none;
  }
}

@media screen and (max-width: 556px) and (min-width: 481px) {
  .root-values .container .single-card:nth-child(odd) .value-card .card-content {
    padding-left: 40px;
  }
  .root-values .container .single-card:nth-child(even) .value-card .card-content {
    padding-right: 40px;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .root-values {
    padding: 60px 0;
  }

  .root-values .values-header {
    margin-bottom: 435px;
  }

  .root-values .card-spacer,
  .root-values .spacer {
    display: block;
  }

  .root-values .sticky {
    position: -webkit-sticky;
    position: sticky;
  }

  .root-values .sticky .H3 {
    font-size: 60px;
    line-height: 70px;
  }

  .root-values .container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: initial;
    justify-content: normal;
    margin-top: 0;
    width: auto;
  }

  .root-values .container .single-card {
    margin-bottom: 0;
  }

  .root-values .container .single-card:nth-child(2),
  .root-values .container .single-card:nth-child(3) {
    margin-top: 0;
  }

  .root-values .container .single-card .value-card {
    margin: 0 10px;
    padding: 45px 30px;
  }

  .root-values .container .single-card .value-card .Body2 {
    font-size: 13px;
  }

  .root-values .container .single-card .value-card .card-content {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  }

  .root-values .container .single-card .value-card .card-content .value-circle {
    -webkit-transform: translateZ(50px);
    transform: translateZ(50px);
  }

  .root-values .container .single-card .value-card .card-content p {
    -webkit-transform: translateZ(30px);
    transform: translateZ(30px);
  }
}

@media (max-width: 480px) {
  .root-values {
    padding: 20px 0;
  }

  .root-values .values-header {
    margin-bottom: 0;
  }

  .root-values .card-spacer,
  .root-values .spacer {
    display: none;
  }

  .root-values .sticky {
    position: static;
  }

  .root-values .container {
    flex-direction: column;
    width: 100vw;
  }

  .root-values .container .single-card {
    margin-bottom: 40px;
  }

  .root-values .container .single-card:nth-child(2n) {
    align-self: flex-end;
  }

  .root-values .container .single-card:nth-child(2n) .value-card {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    padding: 30px 15px 45px 30px;
  }

  .root-values .container .single-card:nth-child(odd) .value-card {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    padding: 30px 30px 45px 15px;
  }

  .root-values .container .single-card .value-card {
    margin: initial;
  }

  .root-values .container .single-card .value-card .card-content > * {
    -webkit-transform: initial;
    transform: none;
  }
}

.banner {
  overflow: hidden;
  padding: 140px 0 85px;
  width: 100%;
}

.banner,
.banner .banner-container {
  box-sizing: initial;
  display: flex;
  flex-direction: row;
}

.banner .banner-container {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-name: ticker;
  animation-name: ticker;
  -webkit-animation-play-state: running;
  animation-play-state: running;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}

.banner .banner-container .H1 {
  white-space: nowrap;
}

.contact-form {
  display: flex;
  flex-direction: column;
}

.contact-form .side-by-side {
  display: flex;
  flex-direction: row;
  gap: 20px;
  margin-bottom: 20px;
}

.contact-form .input {
  height: 50px;
}

.contact-form .multi {
  min-height: 94px;
  overflow: hidden;
  padding-bottom: 40px;
}

.contact-form .checkbox input,
.contact-form .checkbox svg {
  height: 16px;
  width: 16px;
}

.contact-form .input:focus {
  border: 2px solid var(--just-grey);
}

.contact-form .submission {
  margin-bottom: 60px;
  margin-top: 20px;
}

.contact-form .submission .clutch {
  margin-left: -10px;
}

.contact-form .submission .send-btn {
  aspect-ratio: 1/1;
  background-image: url(/static/media/send-button.e2cf8035e07ec0371722.svg);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 200px;
}

.hide-vertical {
  height: 0;
  transition: height 1s ease;
}

.separator {
  display: flex;
  flex-direction: column;
  margin: 0 30px;
  padding: 8px;
}

.separator span {
  color: var(--white);
  font-size: 22px;
  font-weight: 700;
  line-height: 20px;
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  .banner {
    padding: 60px 0;
    width: 100%;
  }

  .banner .banner-container .ticker {
    padding-left: 32px;
  }

  .banner .banner-container .H1 {
    font-size: 72px;
    line-break: loose;
    line-height: 90%;
    white-space: normal;
    width: 500px;
  }

  .banner .banner-container .separator {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 12px;
  }

  .banner .banner-container .separator span {
    color: var(--white);
    font-size: 40px;
    font-weight: 700;
    line-height: 36px;
  }

  .contact-us {
    height: auto;
    padding-top: 0;
  }

  .contact-us .contact-form {
    padding: 32px;
  }

  .contact-us .contact-form .side-by-side {
    flex-direction: column;
    gap: 20px;
  }

  .contact-us .contact-form .side-by-side div + div {
    margin-left: 0;
  }

  .contact-us .contact-form .input:focus {
    border: 2px solid var(--navy-green);
    color: var(--navy-green);
  }

  .contact-us .contact-form .submission {
    margin: 20px 0 60px;
  }

  .contact-us .contact-form .submission .send-button {
    -webkit-transform: scale(0.555) translate(-70px, -70px);
    transform: scale(0.555) translate(-70px, -70px);
  }

  .contact-us .contact-form .submission .clutch-button {
    -webkit-transform: scale(0.6) translate(-30px, -30px);
    transform: scale(0.6) translate(-30px, -30px);
  }

  .contact-us .contact-form .submission .send-btn {
    width: 100px;
  }

  .contact-us .contact-form .submission .clutch {
    height: 60px;
    margin-left: -10px;
    width: 60px;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .banner {
    padding: 140px 0 85px;
    width: 100%;
  }

  .banner .banner-container .ticker {
    padding-left: 0;
  }

  .banner .banner-container .H1 {
    font-size: 120px;
    font-weight: 300;
    line-break: inherit;
    white-space: nowrap;
    width: auto;
  }

  .banner .banner-container .separator {
    display: flex;
    flex-direction: column;
    margin: 0 30px;
    padding: 8px;
  }

  .banner .banner-container .separator span {
    color: var(--white);
    font-size: 22px;
    font-weight: 700;
    line-height: 20px;
  }

  .contact-us {
    height: auto;
    padding: 60px 0;
  }
}

@media screen and (max-width: 480px) {
  .banner {
    padding: 80px 0 60px;
  }

  .banner .banner-container {
    -webkit-animation-name: tickerMobile;
    animation-name: tickerMobile;
  }

  .banner .banner-container .ticker {
    flex-direction: column;
    justify-content: space-between;
    padding: 0 16px;
    width: 100vw;
  }

  .banner .banner-container .ticker .H1 {
    font-size: 72px;
    font-style: italic;
    line-height: 90%;
    white-space: normal;
    width: calc(100vw - 32px);
  }

  .banner .banner-container .reverse {
    flex-direction: column-reverse;
    gap: 40px;
  }

  .banner .banner-container .separator {
    margin: initial;
  }

  .banner .banner-container .separator span {
    font-size: 38px;
    line-height: 90%;
  }

  .contact-form {
    padding: 0 32px 60px;
  }

  .contact-form .Sub2 {
    font-size: 15px;
  }

  .contact-form .checkbox-root .Body {
    font-size: 14px;
  }

  .contact-form .submission {
    margin: 16px 0 0;
  }
}

@-webkit-keyframes ticker {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  to {
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}

@keyframes ticker {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  to {
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}

@-webkit-keyframes tickerMobile {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  to {
    -webkit-transform: translateX(-200vw);
    transform: translateX(-200vw);
  }
}

@keyframes tickerMobile {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  to {
    -webkit-transform: translateX(-200vw);
    transform: translateX(-200vw);
  }
}

footer {
  display: flex;
  justify-content: center;
  padding: 100px 40px 80px;
}

footer .top-footer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

footer .top-footer .follow,
footer .top-footer .pages {
  flex: 1 1;
}

footer .top-footer .pages .Sub {
  font-style: italic;
}

footer .top-footer .contacts {
  flex: 2 1;
}

footer .label {
  margin-bottom: 20px;
}

footer .contact-title:not(:first-child) {
  margin-top: 60px;
}

footer ul {
  list-style: none;
}

footer .bottom-footer {
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-top: 100px;
}

footer a {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

footer a:hover {
  color: var(--bright-green);
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  footer {
    display: flex;
    justify-content: center;
    padding: 122px 64px 70px;
  }

  footer .top-footer {
    display: flex;
    flex-direction: row;
  }

  footer .top-footer .pages {
    flex: initial;
  }

  footer .top-footer .pages .label {
    margin-bottom: 20px;
  }

  footer .top-footer .contacts .link-label .Body {
    font-size: 14px;
  }

  footer .top-footer .contacts,
  footer .top-footer .follow {
    flex: initial;
  }

  footer .top-footer .contacts .Sub,
  footer .top-footer .follow .Sub {
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
  }

  footer .label {
    margin-bottom: 10px;
  }

  footer .contact-title:not(:first-child) {
    margin-top: 30px;
  }

  footer ul {
    list-style: none;
  }

  footer .bottom-footer {
    margin-top: 40px;
  }

  footer .bottom-footer .Body {
    font-size: 12px;
  }

  footer .bottom-footer svg {
    width: 100px;
  }

  footer .animated-link .title:hover span,
  footer .animated-link .title:hover span:after,
  footer .animated-link .title:hover span:before {
    -webkit-transform: none;
    transform: none;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  footer {
    padding: 100px 40px 80px;
  }

  footer .top-footer .follow,
  footer .top-footer .pages {
    flex: 1 1;
  }

  footer .top-footer .contacts .link-label .Body {
    font-size: 16px;
  }

  footer .top-footer .contacts {
    flex: 2 1;
  }

  footer .top-footer .contacts .Sub,
  footer .top-footer .follow .Sub {
    font-size: 24px;
    font-weight: 700;
    line-height: 28px;
  }

  footer .label {
    margin-bottom: 20px;
  }

  footer .contact-title:not(:first-child) {
    margin-top: 60px;
  }

  footer .bottom-footer {
    margin-top: 100px;
  }

  footer .bottom-footer .Body {
    font-size: 16px;
  }

  footer .bottom-footer svg {
    width: auto;
  }

  footer .animated-link .title:hover span {
    -webkit-transform: translateY(-105%);
    transform: translateY(-105%);
  }

  footer .animated-link .title:hover span:before {
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
  }

  footer .animated-link .title:hover span:after {
    -webkit-transform: skewY(0);
    transform: skewY(0);
  }
}

@media (max-width: 480px) {
  footer {
    padding: 160px 32px 60px;
  }

  footer .top-footer {
    flex-direction: column;
  }

  footer .top-footer .pages li .Sub {
    font-style: italic;
  }

  footer .top-footer .contacts {
    margin: 40px 0 60px;
  }

  footer .top-footer .contacts .contact-title:not(:first-child) {
    margin-top: 30px;
  }

  footer .top-footer .contacts .label {
    margin-bottom: 10px;
  }

  footer .top-footer .contacts .label .Sub {
    font-size: 16px;
    font-weight: 600;
    line-height: 140%;
  }

  footer .top-footer .contacts .link-label .Body {
    font-size: 14px;
    line-height: 140%;
  }

  footer .top-footer .follow .label .Sub {
    font-size: 16px;
    font-weight: 600;
    line-height: 140%;
  }

  footer .top-footer .follow .link-label {
    margin-bottom: 4px;
  }

  footer .top-footer .follow .link-label .Body {
    line-height: 140%;
  }

  footer .bottom-footer {
    display: block;
    margin-top: 60px;
  }
  footer .bottom-footer .bottom_block {
    text-align: center;
  }

  footer .bottom-footer svg {
    align-self: flex-start;
    margin-bottom: 36px;
    -webkit-transform: scale(0.65) translateX(-26px);
    transform: scale(0.65) translateX(-26px);
  }

  footer .bottom-footer .Body {
    font-size: 12px;
    line-height: 140%;
  }

  footer .animated-link .title:hover span,
  footer .animated-link .title:hover span:after,
  footer .animated-link .title:hover span:before {
    -webkit-transform: none;
    transform: none;
  }
}

.techno-container {
  display: flex;
  flex-direction: row;
  max-width: 100%;
  padding-left: 360px;
  position: relative;
}

.techno-container .slider-side-bar {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: flex-end;
  left: 0;
  position: absolute;
  top: 0;
  width: 360px;
  z-index: 1;
}

.techno-container .slider-side-bar p {
  margin: 16px;
  position: absolute;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
}

.techno-root {
  padding: 0 85px 60px;
}

@media screen and (min-width: 1200px) and (max-width: 1220px){
  .techno-root {
    padding: 0 60px 60px;
  }
}

.techno-root .techno-spacer {
  height: 100px;
}

.techno-root .techno-card + .techno-card {
  margin-top: -1px;
}

.techno-root .techno-card {
  border-bottom: 1px solid var(--white);
  border-top: 1px solid var(--white);
  transition: padding 0.3s ease-in-out, width 0.5s ease-in-out;
  width: 925px;
}

.techno-root .techno-card .techno-card-title {
  display: flex;
  justify-content: space-between;
  padding: 40px 30px;
  transition: padding-left 0.3s ease-in-out, padding-right 0.3s ease-in-out;
}

.techno-root .techno-card .techno-card-title:hover {
  padding-left: 0;
  padding-right: 10px;
}

.techno-root .techno-card .techno-card-title .techno-arrow {
  align-self: center;
  background-image: url(/wp-content/themes/twentytwentyfour/assets/images/arrow-techno.50da5c118e40334d2bab.svg);
  height: 24px;
  transition: -webkit-transform 0.5s ease-in-out;
  transition: transform 0.5s ease-in-out;
  transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;
  width: 24px;
}

.techno-root .techno-card.selected {
  width: 1135px;
}

.techno-root .techno-card.selected .techno-card-title {
  padding-left: 0;
  padding-right: 10px;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}

.techno-root .techno-card.selected .techno-content {
  margin-bottom: 20px;
  margin-top: 20px;
  transition-delay: 0s, 0s;
}

.techno-root .techno-card.selected .techno-content .variant {
  height: 190px;
  margin-bottom: 20px;
  opacity: 1;
  transition-delay: 0s, 0.5s, 0.5s;
  width: 190px;
}

.techno-root .techno-card.selected .techno-content .variant div {
  padding: 8px;
}

.techno-root .techno-card.selected .techno-content .variant div .techno-image {
  height: 174px;
  transition-delay: 0s;
}

.techno-root .techno-card.selected .techno-arrow {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.techno-root .techno-card .techno-content {
  display: flex;
  flex-wrap: wrap;
  margin-top: 0;
  max-width: 840px;
  transition: margin-top 0.5s ease-in-out;
  transition-delay: 0.5s, 0s;
  transition-property: grid-gap, margin-top;
}

.techno-root .techno-card .techno-content .variant {
  align-self: center;
  background-color: #eaf5f9;
  border-radius: 12px;
  height: 0;
  justify-content: center;
  margin-bottom: 0;
  margin-right: 20px;
  opacity: 0;
  transition: opacity 0.5s ease-in-out, height 0.5s ease-in-out;
  transition-delay: 0.5s, 0s, 0s;
  transition-property: height, opacity, margin-bottom;
  width: 190px;
}

.techno-root .techno-card .techno-content .variant div {
  height: 0;
  padding: 0;
  transition-delay: 0.5s, 0.5s, 0.5s, 0.5s, 0.5s;
  transition-property: padding-top, padding-bottom, padding-left, padding-right;
}

.techno-root .techno-card .techno-content .variant div .techno-image {
  height: 0;
  object-fit: scale-down;
  transition: height 0.5s ease-in-out;
  transition-delay: 0.5s;
  transition-property: height;
  width: 174px;
}

.techno-root .techno-line {
  background-color: #fff;
  height: 1px;
  transition: width 0.5s ease-in-out;
  width: 925px;
  z-index: 1;
}

.techno-root .techno-line.selected {
  position: -webkit-sticky;
  position: sticky;
  top: 100px;
  width: 1135px;
}

@media screen and (max-width: 1536px) and (min-width: 1201px) {
  .techno-container {
    padding-left: 120px;
  }

  .techno-container .slider-side-bar {
    width: 120px;
  }
}

@media (-webkit-device-pixel-ratio: 1.25) and (min-width: 960px) {
  .techno-container {
    padding-left: 360px;
  }

  .techno-container .slider-side-bar {
    width: 360px;
  }
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  .techno-container {
    padding-left: 0;
  }

  .techno-root {
    padding: 0 64px 60px;
    width: 100%;
  }

  .techno-root .techno-spacer {
    height: 60px;
  }

  .techno-root .techno-card {
    width: 100%;
  }

  .techno-root .techno-card .techno-card-title {
    padding: 34px 20px 34px 0;
  }

  .techno-root .techno-card .techno-card-title:hover {
    padding-left: 0;
    padding-right: 20px;
  }

  .techno-root .techno-card.selected {
    width: 100%;
  }

  .techno-root .techno-card.selected .techno-card-title {
    padding-right: 20px;
  }

  .techno-root .techno-card.selected .techno-content {
    margin-bottom: 12px;
    margin-top: 10px;
  }

  .techno-root .techno-card.selected .techno-content .variant {
    height: 120px;
    width: 120px;
  }

  .techno-root
    .techno-card.selected
    .techno-content
    .variant
    div
    .techno-image {
    height: 104px;
  }

  .techno-root .techno-card .techno-content {
    width: 100%;
  }

  .techno-root .techno-card .techno-content .variant {
    width: 120px;
  }

  .techno-root .techno-card .techno-content .variant div .techno-image {
    width: 104px;
  }

  .techno-root .techno-card .H5 {
    font-size: 24px;
    line-height: 29px;
  }

  .techno-root .techno-line {
    width: 100%;
  }

  .techno-root .techno-line.selected {
    top: 60px;
    width: 100%;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .techno-container {
    padding-left: 120px;
  }

  .techno-container .slider-side-bar {
    width: 120px;
  }

  .techno-root {
    padding: 0 85px 60px;
    width: auto;
  }

  .techno-root .techno-spacer {
    height: 100px;
  }

  .techno-root .techno-card {
    width: 925px;
  }

  .techno-root .techno-card .techno-card-title {
    padding: 40px 30px;
  }

  .techno-root .techno-card .techno-card-title:hover {
    padding-left: 0;
    padding-right: 10px;
  }

  .techno-root .techno-card.selected {
    width: 1135px;
  }

  .techno-root .techno-card.selected .techno-card-title {
    padding-right: 10px;
  }

  .techno-root .techno-card.selected .techno-content {
    margin-bottom: 20px;
    margin-top: 20px;
  }

  .techno-root .techno-card.selected .techno-content .variant {
    height: 190px;
    width: 190px;
  }

  .techno-root
    .techno-card.selected
    .techno-content
    .variant
    div
    .techno-image {
    height: 174px;
  }

  .techno-root .techno-card .techno-content {
    width: auto;
  }

  .techno-root .techno-card .techno-content .variant {
    width: 190px;
  }

  .techno-root .techno-card .techno-content .variant div .techno-image {
    width: 174px;
  }

  .techno-root .techno-card .H5 {
    font-size: 32px;
    line-height: 38px;
  }
}

@media (max-width: 480px) {
  .techno-container {
    padding-left: 0;
  }

  .techno-root {
    padding: 0 16px 60px;
    width: 100%;
  }

  .techno-root .techno-spacer {
    height: 60px;
  }

  .techno-root .techno-card {
    width: 100%;
  }

  .techno-root .techno-card .techno-card-title {
    padding: 38px 20px 38px 0;
  }

  .techno-root .techno-card .techno-card-title:hover {
    padding-left: 0;
    padding-right: 20px;
  }

  .techno-root .techno-card.selected {
    width: 100%;
  }

  .techno-root .techno-card.selected .techno-card-title {
    padding-right: 20px;
  }

  .techno-root .techno-card.selected .techno-content {
    margin-bottom: 12px;
    margin-top: 10px;
  }

  .techno-root .techno-card.selected .techno-content .variant {
    height: 120px;
    width: 120px;
  }

  .techno-root
    .techno-card.selected
    .techno-content
    .variant
    div
    .techno-image {
    height: 104px;
  }

  .techno-root .techno-card .techno-content {
    width: 100%;
  }

  .techno-root .techno-card .techno-content .variant {
    width: 120px;
  }

  .techno-root .techno-card .techno-content .variant div .techno-image {
    width: 104px;
  }

  .techno-root .techno-card .H5 {
    font-size: 16px;
    font-weight: 600;
    line-height: 140%;
  }

  .techno-root .techno-line {
    width: 100%;
  }

  .techno-root .techno-line.selected {
    top: 60px;
    width: 100%;
  }
}

.partners-section {
  align-items: center;
  display: flex;
  justify-content: center;
  overflow: hidden;
  width: 100%;
}

.partners-section .partners {
  height: 1046px;
  position: relative;
  width: 1920px;
}

.partners-section .partners .partner-list .dynamic {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-filter: grayscale(100%) drop-shadow(0 -2px 16px rgba(0, 0, 0, 0.4));
  filter: grayscale(100%) drop-shadow(0 -2px 16px rgba(0, 0, 0, 0.4));
  left: 0;
  top: 0;
}

.partners-section .partners .partner-list .dynamic:hover {
  -webkit-filter: grayscale(0) drop-shadow(0 -2px 16px rgba(0, 0, 0, 0.4));
  filter: grayscale(0) drop-shadow(0 -2px 16px rgba(0, 0, 0, 0.4));
}

.partners-section .partners .partner-list .dynamic.offset-0 {
  -webkit-animation-name: move0;
  animation-name: move0;
}

.partners-section .partners .partner-list .dynamic.offset-1 {
  -webkit-animation-name: move1;
  animation-name: move1;
}

.partners-section .partners .partner-list .dynamic.offset-2 {
  -webkit-animation-name: move2;
  animation-name: move2;
}

.partners-section .partners .partner-list .dynamic.offset-3 {
  -webkit-animation-name: move3;
  animation-name: move3;
}

.partners-section .partners .partner-list .dynamic.offset-4 {
  -webkit-animation-name: move4;
  animation-name: move4;
}

.partners-section .partners .partner-list .dynamic.offset-5 {
  -webkit-animation-name: move5;
  animation-name: move5;
}

.partners-section .partners .partner-list .dynamic.offset-6 {
  -webkit-animation-name: move6;
  animation-name: move6;
}

.partners-section .partners .partner-list .dynamic.offset-7 {
  -webkit-animation-name: move7;
  animation-name: move7;
}

.partners-section .partners .partner-list .dynamic.offset-8 {
  -webkit-animation-name: move8;
  animation-name: move8;
}

.partners-section .partners .partner-list .dynamic.offset-9 {
  -webkit-animation-name: move9;
  animation-name: move9;
}

.partners-section .partners .partner-list .dynamic.line-0 {
  -webkit-animation-duration: 60s;
  animation-duration: 60s;
  offset-path: path(
    "M1210.95 523.437C1210.95 555.668 1183.05 585.001 1137.59 606.305C1092.17 627.592 1029.38 640.771 960 640.771C890.621 640.771 827.835 627.592 782.412 606.305C736.949 585.001 709.052 555.668 709.052 523.437C709.052 491.207 736.949 461.874 782.412 440.569C827.835 419.283 890.621 406.104 960 406.104C1029.38 406.104 1092.17 419.283 1137.59 440.569C1183.05 461.874 1210.95 491.207 1210.95 523.437Z"
  );
  z-index: 7;
}

.partners-section .partners .partner-list .dynamic.line-1 {
  -webkit-animation-duration: 65s;
  animation-duration: 65s;
  offset-path: path(
    "M1336.15 523.438C1336.15 571.937 1294.24 616 1226.12 647.966C1158.04 679.914 1063.95 699.688 960 699.688C856.049 699.688 761.963 679.914 693.884 647.966C625.765 616 583.854 571.937 583.854 523.438C583.854 474.938 625.765 430.875 693.884 398.909C761.963 366.961 856.049 347.188 960 347.188C1063.95 347.188 1158.04 366.961 1226.12 398.909C1294.24 430.875 1336.15 474.938 1336.15 523.438Z"
  );
  z-index: 6;
}

.partners-section .partners .partner-list .dynamic.line-2 {
  -webkit-animation-duration: 60s;
  animation-duration: 60s;
  offset-path: path(
    "M1466.6 524.49C1466.6 589.549 1410.33 648.603 1318.98 691.422C1227.67 734.222 1101.5 760.708 962.104 760.708C822.709 760.708 696.534 734.222 605.227 691.422C513.881 648.603 457.604 589.549 457.604 524.49C457.604 459.43 513.881 400.376 605.227 357.557C696.534 314.757 822.709 288.271 962.104 288.271C1101.5 288.271 1227.67 314.757 1318.98 357.557C1410.33 400.376 1466.6 459.43 1466.6 524.49Z"
  );
  z-index: 5;
}

.partners-section .partners .partner-list .dynamic.line-3 {
  -webkit-animation-duration: 75s;
  animation-duration: 75s;
  offset-path: path(
    "M1592.85 523.438C1592.85 605.057 1522.21 679.103 1407.64 732.774C1293.1 786.427 1134.84 819.625 960 819.625C785.161 819.625 626.898 786.427 512.363 732.774C397.789 679.103 327.146 605.057 327.146 523.438C327.146 441.818 397.789 367.772 512.363 314.101C626.898 260.448 785.161 227.25 960 227.25C1134.84 227.25 1293.1 260.448 1407.64 314.101C1522.21 367.772 1592.85 441.818 1592.85 523.438Z"
  );
  z-index: 4;
}

.partners-section .partners .partner-list .dynamic.line-4 {
  -webkit-animation-duration: 50s;
  animation-duration: 50s;
  offset-path: path(
    "M1718.05 523.438C1718.05 621.326 1633.4 710.102 1496.17 774.435C1358.97 838.749 1169.41 878.542 960 878.542C750.588 878.542 561.026 838.749 423.835 774.435C286.604 710.102 201.948 621.326 201.948 523.438C201.948 425.549 286.604 336.773 423.835 272.44C561.026 208.126 750.588 168.333 960 168.333C1169.41 168.333 1358.97 208.126 1496.17 272.44C1633.4 336.773 1718.05 425.549 1718.05 523.438Z"
  );
  z-index: 3;
}

.partners-section .partners .partner-list .dynamic.line-5 {
  -webkit-animation-duration: 60s;
  animation-duration: 60s;
  offset-path: path(
    "M1844.3 523.438C1844.3 637.596 1745.51 741.101 1585.44 816.095C1425.4 891.071 1204.27 937.458 960 937.458C715.725 937.458 494.6 891.071 334.563 816.095C174.485 741.101 75.6979 637.596 75.6979 523.438C75.6979 409.279 174.485 305.774 334.563 230.78C494.6 155.804 715.725 109.417 960 109.417C1204.27 109.417 1425.4 155.804 1585.44 230.78C1745.51 305.774 1844.3 409.279 1844.3 523.438Z"
  );
  z-index: 2;
}

.partners-section .partners .partner-list .dynamic.line-6 {
  -webkit-animation-duration: 55s;
  animation-duration: 55s;
  offset-path: path(
    "M1969.5 523.438C1969.5 653.865 1856.7 772.099 1673.97 857.756C1491.27 943.393 1238.85 996.375 960 996.375C681.153 996.375 428.728 943.393 246.034 857.756C63.3006 772.099 -49.5 653.865 -49.5 523.438C-49.5 393.01 63.3006 274.776 246.034 189.119C428.728 103.482 681.153 50.5 960 50.5C1238.85 50.5 1491.27 103.482 1673.97 189.119C1856.7 274.776 1969.5 393.01 1969.5 523.438Z"
  );
  z-index: 1;
}

.partners-section .partners .static-pos img {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}

.partners-section .partners .static-pos img:hover {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
}

.partners-section .partners .static-pos.pos-0 {
  left: 1118px;
  top: 506px;
}

.partners-section .partners .static-pos.pos-0,
.partners-section .partners .static-pos.pos-1 {
  -webkit-filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
}

.partners-section .partners .static-pos.pos-1 {
  left: 645px;
  top: 146px;
}

.partners-section .partners .static-pos.pos-2 {
  -webkit-filter: drop-shadow(0 -9px 15px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(0 -9px 15px rgba(0, 0, 0, 0.4));
  left: 1048px;
  top: 293px;
}

.partners-section .partners .static-pos.pos-3 {
  left: 1048px;
  left: 1518px;
  top: 690px;
  top: 528px;
}

.partners-section .partners .static-pos.pos-3,
.partners-section .partners .static-pos.pos-4 {
  -webkit-filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
}

.partners-section .partners .static-pos.pos-4 {
  left: 1460px;
  top: 790px;
}

.partners-section .partners .static-pos.pos-5 {
  left: 1533px;
  top: 263px;
}

.partners-section .partners .static-pos.pos-5,
.partners-section .partners .static-pos.pos-6 {
  -webkit-filter: drop-shadow(0 -9px 15px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(0 -9px 15px rgba(0, 0, 0, 0.4));
}

.partners-section .partners .static-pos.pos-6 {
  left: 970px;
  top: 115px;
}

.partners-section .partners .static-pos.pos-7 {
  -webkit-filter: drop-shadow(0 -9px 15px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(0 -9px 15px rgba(0, 0, 0, 0.4));
  left: 709px;
  top: 376px;
}

.partners-section .partners .static-pos.pos-8 {
  -webkit-filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
  left: 450px;
  top: 560px;
}

.partners-section .partners .static-pos.pos-9 {
  -webkit-filter: drop-shadow(0 -9px 15px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(0 -9px 15px rgba(0, 0, 0, 0.4));
  left: 1250px;
  top: 17px;
}

.partners-section .partners .static-pos.pos-10 {
  left: 816px;
  top: 750px;
}

.partners-section .partners .static-pos.pos-10,
.partners-section .partners .static-pos.pos-11 {
  -webkit-filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
}

.partners-section .partners .static-pos.pos-11 {
  left: 357px;
  top: 784px;
}

.partners-section .partners .static-pos.pos-12 {
  left: 123px;
  top: 657px;
}

.partners-section .partners .static-pos.pos-12,
.partners-section .partners .static-pos.pos-13 {
  -webkit-filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
}

.partners-section .partners .static-pos.pos-13 {
  left: 690px;
  top: 875px;
}

.partners-section .partners .static-pos.pos-14 {
  -webkit-filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
  filter: drop-shadow(0 9px 15px rgba(0, 0, 0, 0.4));
  left: 1192px;
  top: 655px;
}

.partners-section .partners .shadow-partner {
  offset-rotate: 0deg;
  position: absolute;
}

.partners-section .partners .shadow-partner img {
  -webkit-filter: blur(15px) grayscale(100%);
  filter: blur(15px) grayscale(100%);
  height: 120px;
  object-fit: scale-down;
  width: 120px;
}

.partners-section .partners .partner {
  offset-rotate: 0deg;
  position: absolute;
}

.partners-section .partners .partner img {
  height: 120px;
  object-fit: scale-down;
  width: 120px;
}

.partners-tablet {
  align-items: center;
  display: flex;
  justify-content: flex-start;
  overflow: hidden;
  padding: 50px 64px 80px;
  width: 100%;
}

.partners-tablet .partners {
  height: 473px;
  position: relative;
  width: 1360px;
}

.partners-tablet .partners .partner-list .partner {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  left: 0;
  offset-rotate: 0deg;
  position: absolute;
  top: 0;
}

.partners-tablet .partners .partner-list .partner.offset-0 {
  -webkit-animation-name: move0;
  animation-name: move0;
}

.partners-tablet .partners .partner-list .partner.offset-1 {
  -webkit-animation-name: move1;
  animation-name: move1;
}

.partners-tablet .partners .partner-list .partner.offset-2 {
  -webkit-animation-name: move2;
  animation-name: move2;
}

.partners-tablet .partners .partner-list .partner.offset-3 {
  -webkit-animation-name: move3;
  animation-name: move3;
}

.partners-tablet .partners .partner-list .partner.offset-4 {
  -webkit-animation-name: move4;
  animation-name: move4;
}

.partners-tablet .partners .partner-list .partner.offset-5 {
  -webkit-animation-name: move5;
  animation-name: move5;
}

.partners-tablet .partners .partner-list .partner.offset-6 {
  -webkit-animation-name: move6;
  animation-name: move6;
}

.partners-tablet .partners .partner-list .partner.offset-7 {
  -webkit-animation-name: move7;
  animation-name: move7;
}

.partners-tablet .partners .partner-list .partner.offset-8 {
  -webkit-animation-name: move8;
  animation-name: move8;
}

.partners-tablet .partners .partner-list .partner.offset-9 {
  -webkit-animation-name: move9;
  animation-name: move9;
}

.partners-tablet .partners .partner-list .partner.line-0 {
  -webkit-animation-duration: 60s;
  animation-duration: 60s;
  offset-path: path(
    "M1186.5 236.5C1186.5 260.66 1172.42 283.748 1146.8 304.816C1121.18 325.88 1084.08 344.873 1038.19 360.832C946.419 392.75 819.602 412.5 679.5 412.5C539.398 412.5 412.581 392.75 320.808 360.832C274.918 344.873 237.818 325.88 212.199 304.816C186.578 283.748 172.5 260.66 172.5 236.5C172.5 212.34 186.578 189.252 212.199 168.184C237.818 147.12 274.918 128.127 320.808 112.168C412.581 80.2505 539.398 60.5 679.5 60.5C819.602 60.5 946.419 80.2505 1038.19 112.168C1084.08 128.127 1121.18 147.12 1146.8 168.184C1172.42 189.252 1186.5 212.34 1186.5 236.5Z"
  );
  z-index: 2;
}

.partners-tablet .partners .partner-list .partner.line-1 {
  -webkit-animation-duration: 65s;
  animation-duration: 65s;
  offset-path: path(
    "M1359.5 236.5C1359.5 268.944 1340.6 299.924 1306.24 328.17C1271.9 356.413 1222.17 381.87 1160.67 403.259C1037.68 446.034 867.736 472.5 680 472.5C492.264 472.5 322.322 446.034 199.332 403.259C137.834 381.87 88.1027 356.413 53.7553 328.17C19.4046 299.924 0.5 268.944 0.5 236.5C0.5 204.056 19.4046 173.076 53.7553 144.83C88.1027 116.587 137.834 91.13 199.332 69.7415C322.322 26.9662 492.264 0.5 680 0.5C867.736 0.5 1037.68 26.9662 1160.67 69.7415C1222.17 91.13 1271.9 116.587 1306.24 144.83C1340.6 173.076 1359.5 204.056 1359.5 236.5Z"
  );
}

.partners-tablet .partners .partner-list .partner.line-2 {
  -webkit-animation-duration: 45s;
  animation-duration: 45s;
  offset-path: path(
    "M1017.5 236C1017.5 252.083 1008.15 267.477 991.081 281.545C974.015 295.611 949.289 308.3 918.691 318.966C857.5 340.297 772.933 353.5 679.5 353.5C586.067 353.5 501.5 340.297 440.309 318.966C409.711 308.3 384.985 295.611 367.919 281.545C350.849 267.477 341.5 252.083 341.5 236C341.5 219.917 350.849 204.523 367.919 190.455C384.985 176.389 409.711 163.7 440.309 153.034C501.5 131.703 586.067 118.5 679.5 118.5C772.933 118.5 857.5 131.703 918.691 153.034C949.289 163.7 974.015 176.389 991.081 190.455C1008.15 204.523 1017.5 219.917 1017.5 236Z"
  );
  z-index: 3;
}

.partners-tablet .partners .partner-list .partner img {
  -webkit-filter: grayscale(100%) drop-shadow(0 -2px 16px rgba(0, 0, 0, 0.2));
  filter: grayscale(100%) drop-shadow(0 -2px 16px rgba(0, 0, 0, 0.2));
  height: 100px;
  object-fit: scale-down;
  width: 100px;
}

.partners-tablet .partners .partner-list .partner img:hover {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
}

.partners-mob {
  align-items: center;
  display: flex;
  justify-content: center;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.partners-mob .hinge {
  aspect-ratio: 1/1;
  background-image: url(/wp-content/themes/twentytwentyfour/assets/images/hinge.1e244e2c0165617a7843.png);
  position: absolute;
  right: -250px;
  top: 0;
  width: 400px;
}

.partners-mob .hinge-msg {
  color: var(--just-grey);
  opacity: 40%;
  position: absolute;
  right: 16px;
  top: 400px;
  transition: opacity 0.5s ease-out;
  width: 134px;
}

.partners-mob .blocker {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 60vw;
  z-index: 2;
}

.partners-mob .blocker:after,
.partners-mob .blocker:before {
  background-image: url(/wp-content/themes/twentytwentyfour/assets/images/cil.7310162e9d18e9fd7cdf.svg);
  content: "";
  height: 24px;
  position: absolute;
  right: -12px;
  top: 0;
  width: 24px;
}

.partners-mob .blocker:after {
  top: 376px;
  -webkit-transform: scaleY(-1);
  transform: scaleY(-1);
}

.partners-mob .partners {
  height: 464px;
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
  width: 100%;
  z-index: 1;
}

.partners-mob .partners .partner-list {
  display: flex;
  flex-direction: column;
}

.partners-mob .partners .partner-list .partner {
  align-items: center;
  display: flex;
  height: 400px;
  justify-content: center;
  padding: 5px;
  scroll-snap-align: start;
  width: 200px;
}

.partners-mob .partners .partner-list .partner img {
  object-fit: scale-down;
  width: 100%;
}

.partners-mob .partners .partner-list .partner.last-partner {
  margin-bottom: 64px;
}

@-webkit-keyframes move0 {
  0% {
    offset-distance: 0;
  }

  to {
    offset-distance: 100%;
  }
}

@keyframes move0 {
  0% {
    offset-distance: 0;
  }

  to {
    offset-distance: 100%;
  }
}

@-webkit-keyframes move1 {
  0% {
    offset-distance: 20%;
  }

  to {
    offset-distance: 120%;
  }
}

@keyframes move1 {
  0% {
    offset-distance: 20%;
  }

  to {
    offset-distance: 120%;
  }
}

@-webkit-keyframes move2 {
  0% {
    offset-distance: 40%;
  }

  to {
    offset-distance: 140%;
  }
}

@keyframes move2 {
  0% {
    offset-distance: 40%;
  }

  to {
    offset-distance: 140%;
  }
}

@-webkit-keyframes move3 {
  0% {
    offset-distance: 60%;
  }

  to {
    offset-distance: 160%;
  }
}

@keyframes move3 {
  0% {
    offset-distance: 60%;
  }

  to {
    offset-distance: 160%;
  }
}

@-webkit-keyframes move4 {
  0% {
    offset-distance: 80%;
  }

  to {
    offset-distance: 180%;
  }
}

@keyframes move4 {
  0% {
    offset-distance: 80%;
  }

  to {
    offset-distance: 180%;
  }
}

@-webkit-keyframes move5 {
  0% {
    offset-distance: 110%;
  }

  to {
    offset-distance: 210%;
  }
}

@keyframes move5 {
  0% {
    offset-distance: 110%;
  }

  to {
    offset-distance: 210%;
  }
}

@-webkit-keyframes move6 {
  0% {
    offset-distance: 130%;
  }

  to {
    offset-distance: 230%;
  }
}

@keyframes move6 {
  0% {
    offset-distance: 130%;
  }

  to {
    offset-distance: 230%;
  }
}

@-webkit-keyframes move7 {
  0% {
    offset-distance: 150%;
  }

  to {
    offset-distance: 250%;
  }
}

@keyframes move7 {
  0% {
    offset-distance: 150%;
  }

  to {
    offset-distance: 250%;
  }
}

@-webkit-keyframes move8 {
  0% {
    offset-distance: 170%;
  }

  to {
    offset-distance: 270%;
  }
}

@keyframes move8 {
  0% {
    offset-distance: 170%;
  }

  to {
    offset-distance: 270%;
  }
}

@-webkit-keyframes move9 {
  0% {
    offset-distance: 190%;
  }

  to {
    offset-distance: 290%;
  }
}

@keyframes move9 {
  0% {
    offset-distance: 190%;
  }

  to {
    offset-distance: 290%;
  }
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  .partners-section {
    justify-content: normal;
  }
}

@media screen and (max-width: 1200px) and (min-width: 481px) and (orientation: portrait) {
  .partners-tablet .partners .telesens-logo-icon {
    display: none;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .partners-section {
    justify-content: center;
  }
}

.text-input {
  display: flex;
  flex: 1 1;
  flex-direction: column;
  position: relative;
}

.text-input .input {
  background: transparent;
  border: 1px solid var(--just-grey);
  color: var(--just-grey);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.015em;
  line-height: 22px;
  margin-top: 8px;
  outline: 0;
  padding: 14px 16px;
  width: 100%;
}

.text-input .input:focus {
  border: 2px solid var(--navy-green);
  color: var(--navy-green);
  padding: 13px 15px;
}

.text-input .multi {
  max-width: 100%;
  min-height: 118px !important;
  height: 118px;
  overflow: hidden;
  resize: none;
}

.text-input .input-error {
  align-items: center;
  bottom: 0;
  display: flex;
  flex-direction: row;
  height: 40px;
  left: 16px;
  pointer-events: none;
  position: absolute;
  top: -10px;
}

.text-input .input-error p:before {
  background-image: url(/wp-content/themes/twentytwentyfour/assets/images/error_outline.9bc4a0fa83fb5ffe8730.svg);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: inline-block;
  height: 20px;
  margin-right: 10px;
  vertical-align: middle;
  width: 20px;
}

.text-input .letters-counter {
  bottom: 16px;
  font-size: 10px;
  font-weight: 400;
  line-height: 14px;
  position: absolute;
  right: 14px;
}

.text-input.error input,
.text-input.error textarea {
  color: transparent;
}

.checkbox-root {
  align-items: center;
  display: flex;
  flex-direction: row;
  margin-bottom: 20px;
  position: relative;
}

.checkbox-root > p:not(.Body) {
  display: flex;
}

.checkbox-root .checkbox-error {
  color: var(--navy-blue);
  font-size: 12px;
  font-weight: 400;
  line-height: 17px;
  position: absolute;
  right: calc(100% + 10px);
  width: -webkit-max-content;
  width: max-content;
}

.checkbox {
  margin-right: 8px;
  position: relative;
}

.checkbox input,
.checkbox svg {
  display: block;
  height: 16px;
  width: 16px;
}

.checkbox input {
  -webkit-appearance: none;
  -moz-appearance: none;
  border: none;
  box-shadow: inset 0 0 0 1px var(--just-grey);
  margin: 0;
  outline: none;
  padding: 0;
  position: absolute;
  top: 0;
  transition: box-shadow 0.3s;
}

.checkbox input:checked {
  border: var(--just-grey);
}

.checkbox svg {
  fill: none;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke: var(--just-grey);
  height: 16px;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  -webkit-transform: scale(1) translateZ(0);
  transform: scale(1) translateZ(0);
  width: 16px;
}

p:has(.checkbox) {
  white-space: normal;
}

.checkbox.path {
  width: 16px;
  height: 16px;
  display: block;
  cursor: none;
}

.checkbox.path input:checked {
  --s: 2px;
  transition-delay: 0.4s;
}

.checkbox.path input:checked + svg {
  --a: 16.1 86.12;
  --o: 102.22;
}

.checkbox.path svg {
  stroke-dasharray: 86.12;
  stroke-dasharray: var(--a, 86.12);
  stroke-dashoffset: 86.12;
  stroke-dashoffset: var(--o, 86.12);
  transition: stroke-dasharray 0.6s, stroke-dashoffset 0.6s;
}

.checkbox.bounce {
  stroke: var(--just-grey);
}

.checkbox.bounce input:checked {
  --s: 11px;
}

.checkbox.bounce input:checked + svg {
  -webkit-animation: bounce 0.4s linear 0.2s forwards;
  animation: bounce 0.4s linear 0.2s forwards;
}

.checkbox.bounce svg {
  scale: 0;
}

.download-button:hover {
  -webkit-text-decoration-line: underline;
  text-decoration-line: underline;
}

.download-button:hover svg path {
  fill: var(--navy-green);
}
form.wpcf7-form > p {
  white-space: normal;
}
.dropzone {
  z-index: 2;
  flex: 1 1 0%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 25px 16px;
  border-width: 1px;
  border-radius: 2px;
  border-color: rgb(175, 188, 186);
  border-style: dashed;
  background-color: rgb(234, 245, 249);
  outline: none;
}

.dropzone > * {
  white-space: wrap;
}

.dropzone-overlay {
  -webkit-animation: show 1s ease 0s 1 normal forwards;
  animation: show 1s ease 0s 1 normal forwards;
  background: rgba(0, 0, 0, 0.5);
  height: 100vh;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 2;
  display: none;
}

.dropzone .codedropz-upload-inner {
  white-space: nowrap;
}

.dropzone .codedropz-upload-container {
  padding: 0;
}
.dropzone .codedropz-upload-handler {
  margin: 0;
}

.dropzone .container-uploads {
  display: flex;
  flex-direction: column;
  align-items: center;
}

@media screen and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .dropzone-overlay {
    height: 125vh;
  }
}

.dropzone.disabled,
.dropzone.disabled:hover {
  background-color: var(--soft-blue) !important;
}

.dropzone.disabled p,
.dropzone.disabled path {
  fill: var(--light-grey);
  color: var(--light-grey);
}

.dropzone.disabled a {
  fill: var(--light-grey);
  color: var(--light-grey);
}

.dropzone.disabled .download-button:hover {
  -webkit-text-decoration-line: none;
  text-decoration-line: none;
}

.dropzone.green-bg,
.dropzone:hover {
  background-color: var(--light-green) !important;
}

.dropzone-error {
  align-items: baseline;
  background-color: var(--bright-blue);
  border-radius: 4px;
  display: flex;
  flex-direction: row;
  gap: 4px;
  left: 8px;
  padding: 2px 6px;
  position: absolute;
  top: 38px;
}

.dropzone-error p {
  font-size: 9px;
  line-height: 13px;
}

.single-file:first-child {
  margin-top: 12px;
}

.delete-button {
  height: 18px;
  padding: 4px;
  position: relative;
  width: 18px;
}

.delete-button:after,
.delete-button:before {
  background-color: var(--light-grey);
  content: "";
  height: 2px;
  left: 3px;
  position: absolute;
  top: 8px;
  width: 12px;
}

.delete-button:hover:after,
.delete-button:hover:before {
  background-color: var(--navy-green);
}

.delete-button:after {
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

.delete-button:before {
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

.text-input .letters-counter {
  font-size: 10px !important;
}

@-webkit-keyframes bounce {
  50% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }

  75% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }

  to {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes bounce {
  50% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }

  75% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }

  to {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  .dropzone:hover {
    background-color: var(--soft-blue) !important;
  }

  .dropzone-error {
    margin-top: 16px;
    position: static;
  }

  .single-file .f1 {
    flex: 0 1;
  }

  .checkbox-root .checkbox input,
  .checkbox-root .checkbox svg {
    height: 16px;
    width: 16px;
  }

  .download-button:hover {
    -webkit-text-decoration-line: none;
    text-decoration-line: none;
  }

  .download-button:hover svg path {
    fill: var(--light-grey);
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .dropzone:hover {
    background-color: var(--light-green) !important;
  }

  .dropzone-error {
    margin-top: 0;
    position: absolute;
  }

  .single-file .f1 {
    flex: 1 1;
  }

  .checkbox-root .checkbox input,
  .checkbox-root .checkbox svg {
    height: 16px;
    width: 16px;
  }

  .download-button:hover {
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
  }

  .download-button:hover svg path {
    fill: var(--navy-green);
  }
}

@media (max-width: 480px) {
  .dropzone {
    padding: 25px 16px;
  }

  .dropzone:hover {
    background-color: var(--soft-blue) !important;
  }

  .dropzone-error {
    margin-top: 16px;
    position: static;
  }

  .single-file .f1 {
    max-width: 18px;
  }

  .dropzone-description {
    flex-direction: column;
  }

  .codedropz-upload-container {
    padding: 0 !important;
  }

  .container-uploads .flex-row .Small-11 {
    text-align: left;
  }

  .text-input .Sub2 {
    font-size: 15px;
    line-height: 18px;
  }

  .text-input .letters-counter {
    font-size: 10px !important;
  }

  .checkbox-root .checkbox input,
  .checkbox-root .checkbox svg {
    height: 16px;
    width: 16px;
  }

  .checkbox-root .checkbox-error {
    bottom: -20px;
    left: 20px;
  }

  .download-button:hover {
    -webkit-text-decoration-line: none;
    text-decoration-line: none;
  }

  .text-input .letters-counter {
    bottom: 16px;
    right: 14px;
  }

  .pum-title {
    font-weight: 400 !important;
  }
}

#top_section_mob {
  margin-top: -1px;
}

@media screen and (max-width: 480px) {
  .services-slider .product-card .product-desc .product-image {
    height: 200px;
    width: 100%;
  }
  .services-slider .product-card .product-desc .product-image img {
    height: 200px;
    width: 100%;
  }

  .main-menu .up .main-links .link a img,
  #planets_header_desktop,
  #planets_body_desktop {
    display: none;
  }
  .quote-container .single-quote {
    padding: 0 32px;
  }
  .quote-container .single-quote .H4 {
    font-size: 24px;
    font-weight: 700;
    line-height: 28px;
    margin-bottom: 30px;
  }
  .quote-container .single-quote .Body {
    font-size: 14px;
    margin-bottom: 10px;
  }
  .quote-container .single-quote .Body2 {
    font-size: 12px;
    line-height: 17px;
  }
  .module-container-mob {
    white-space: unset !important;
  }
  .services-tree .prod_container .single .img img {
    width: 100px;
    height: 100px;
  }
}
.mob-link.color-white.mob_title {
  text-decoration: none;
}

.services-tree .prod_container {
  display: block;
  /* padding-top: 60px; */
}
#cards-tree.shelf-content .H3 {
  padding-bottom: 120px;
}

.services-tree .prod_container .single {
  display: inline-flex;
}

.services-tree .prod_container .single .desc .sub_page_title,
.services-tree .prod_container .single .desc .sub_page_link{
  margin-bottom: 8px;
}
.services-tree .prod_container .single .desc .simple_link {
  margin-bottom: 12px;
}
.services-tree .prod_container .single .desc .main {
  font-weight: 700;
  font-family: "Commissioner", sans-serif;
  font-size: 24px;
  line-height: 29.35px;
  margin-bottom: 24px;
  color: var(--just-grey);
}

.services-tree .prod_container .single .desc .sub_page_title {
  font-weight: 600;
  font-size: 18px;
  font-family: "Commissioner", sans-serif;
  line-height: 22.4px;
  color: var(--just-grey);
}
.services-tree .prod_container .single .desc .sub_page_link.sub3_level {
  padding-left: 32px;
}
.services-tree .prod_container .single .desc .sub_page_title.sub3_level,
.services-tree .prod_container .single .desc .sub_page_link {
  padding-left: 16px;
}

.services-tree .prod_container .single .desc a {
  font-size: 16px;
  color: var(--just-grey);
  text-decoration: underline;
  line-height: 22.4px;
  font-weight: 400;
}
@media screen and (max-width: 375px) {
  .services-title {
    padding-inline: 32px;
  }
}
@media screen and (min-width: 376px) and (max-width: 480px) {
  .services-title {
    padding-inline: 40px;
  }
}
@media screen and (min-width: 481px) {
  .services-title {
    padding-inline: 60px;
  }
}
@media screen and (max-width: 700px) {
  .services-slider .product-card .product-title {
    position: static;
    padding-top: 0;
    height: auto;
    width: auto;
    text-align: right;
  }
  .services-slider .product-desc .animated-link {
    display: none;
  }
  #products_swiper {
    padding-top: 60px;
  }

  .slider-container {
    display: block;
  }
  .services-slider .product-card {
    display: block;
  }

  .services-tree .shelf-content-mob {
    padding: 60px 32px 40px;
  }

  .services-tree .prod_container .single .img {
    height: 200px;
    margin-bottom: 12px;
  }
  .services-tree .prod_container .single .img img {
    height: 100%;
    width: 100%;
  }
  .services-tree .prod_container .single {
    display: block;
  }
  .services-tree .prod_container .single .desc .main {
    margin-bottom: 12px;
  }
  .services-tree .prod_container .single .desc a {
    font-size: 14px;
    line-height: 19.6px;
  }
  .services-tree .prod_container .single .desc .sub_page_title {
    font-size: 16px;
  }

  .services-tree .prod_container {
    padding: 0 32px;
  }

  .services-tree .prod_container .single {
    padding-bottom: 40px;
  }
}
@media screen and (min-width: 701px) {
  .services-slider .product-card .product-title .H2 {
    line-height: 90%;
  }
  .services-title {
    display: none;
  }

  .services-tree .prod_container .single .img {
    margin-right: 30px;
  }
  .services-tree .prod_container .single {
    padding-bottom: 60px;
  }
}
@media screen and (min-width: 1200px) {
  .services-tree .prod_container .single:nth-child(1) {
    padding-right: 30px;
  }
  .services-tree .prod_container .single:nth-child(2) {
    padding-left: 30px;
  }
  .services-slider {
    width: 100%;
    /* width: calc(100% - 120px); */
    position: relative;
    left: 0px;
    /* left: 120px; */
  }
}
@media screen and (min-width: 701px) {
  .services-tree .prod_container {
    max-width: 1240px;
    margin: 0 64px;
  }

  .main-menu .main-menu-picture {
    left: auto !important;
    width: auto;
    right: 0% !important;
  }
  .main-menu .up .main-links .link {
    position: relative;
  }

  #planets_mobile {
    display: none;
  }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .page_charity .blog-side-bar div,
  .page_charity-en .blog-side-bar div,
  .page_blog .blog-side-bar div,
  .page_blog-en .blog-side-bar div,
  .page_privacy-policy .blog-side-bar div,
  .page_privacy-policy-en .blog-side-bar div {
    display: none !important;
  }
  .page_charity .blog-content .H3,
  .page_charity-en .blog-content .H3,
  .page_blog .blog-content .H3 {
    line-height: 47px;
  }
  .page_charity .blog-content .H3,
  .page_charity-en .blog-content .H3,
  .page_blog .blog-content .H3,
  .page_blog-en .blog-content .H3 {
    font-size: 40px;
    font-weight: 400;
  }
  .page_blog .module-container .Body,
  .page_blog-en .module-container .Body,
  .page_privacy-policy .module-container .Body,
  .page_privacy-policy-en .module-container .Body,
  .page_charity .module-container .Body,
  .page_charity-en .module-container .Body {
    color: #000;
    font-size: 14px;
    line-height: 18px;
  }
  .page_privacy-policy .blog-content .H4,
  .page_privacy-policy-en .blog-content .H4,
  .page_charity .blog-content .H4,
  .page_charity-en .blog-content .H4,
  .page_blog .blog-content .H4,
  .page_blog-en .blog-content .H4 {
    font-size: 32px;
    line-height: 38px;
  }
  .page_blog .blog-view .blog-side-bar,
  .page_blog-en .blog-view .blog-side-bar,
  .page_privacy-policy .blog-view .blog-side-bar,
  .page_privacy-policy-en .blog-view .blog-side-bar,
  .page_charity .blog-view .blog-side-bar,
  .page_charity-en .blog-view .blog-side-bar {
    width: 144px;
  }
  .page_blog .blog-view,
  .page_blog-en .blog-view,
  .page_privacy-policy .blog-view,
  .page_privacy-policy-en .blog-view,
  .page_charity .blog-view,
  .page_charity-en .blog-view {
    padding: 32px 64px 0;
  }
}
@media screen and (max-width: 768px) {
  .H6 {
    font-size: 18px;
  }
  .module-container.type-paragraph.padding {
    padding: 40px 20px;
  }

  .services-slider .product-card {
    margin: 0 16px;
    margin-bottom: 48px;
  }

  .slider-container .services-title .Body {
    font-weight: 600;
  }

  .blog-side-bar,
  .main-menu .up .footer-links,
  .blog-view .container .blog-side-bar,
  #ind_wrap_large {
    display: none !important;
  }
  .services-slider .swiper .slider-wrapper {
    flex-shrink: 1 !important;
  }
  .services-slider .product-card .mob-card-arrow .arrow-svg .point {
    fill: var(--navy-green);
  }
  .services-slider .product-card .mob-card-arrow {
    background-color: var(--white);
    border-radius: 50%;
    bottom: -32px;
    height: 66px;
    position: absolute;
    right: 16px;
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg);
    width: 66px;
    z-index: 110;
  }
  .services-slider .product-card .product-title .H2 {
    font-size: 36px;
    font-weight: 700;
    text-align: left;
    line-height: 1;
  }

  .services-title {
    align-items: center;
    margin-top: 100px;
    width: 100%;
  }
}
@media screen and (min-width: 481px) and (max-width: 700px) {
  .services-slider .product-card .product-title .H2 {
    line-height: 100%;
  }
  .services-slider .product-card .product-desc .product-image {
    height: 612px;
    width: 100%;
  }
  .services-slider .product-card .product-desc .product-image img {
    width: 100%;
  }
}
@media screen and (min-width: 701px) and (max-width: 1200px) {
  .services-slider .product-card .product-desc .product-image {
    margin-bottom: 0;
  }
}
@media screen and (min-width: 701px) and (max-width: 999px) {
  .services-slider .product-card .product-desc {
    width: 100%;
  }
  .services-slider .product-card {
    width: 49.7%;
    margin: 182px 0px 196px 0px;
    padding-left: 16px;
    padding-right: 30px;
  }
  .services-slider .product-card:nth-child(2) {
    margin: 182px 0px 0px 0px;
    padding-left: 30px;
    padding-right: 16px;
  }
  .services-slider .product-card .product-title {
    bottom: 0px !important;
    left: 16px;
  }
  .services-slider .product-card:nth-child(2) .product-title {
    left: 30px;
  }
}
@media screen and (min-width: 1001px) and (max-width: 1200px) {
  .services-slider .product-card .product-desc {
    width: 100%;
  }
  .services-slider .product-card {
    margin: 182px 0 105px 0;
    padding-left: 16px;
    padding-right: 30px;
    width: 49.8%;
  }
  .services-slider .product-card:nth-child(2) {
    margin: 182px 0 0px 0;
    padding-left: 30px;
    padding-right: 16px;
  }
}
@media screen and (min-width: 1201px) {
  .services-slider .product-card {
    margin: 100px 0 179px 0;
    padding-left: 100px;
    padding-right: 50px;
    width: 49.8%;
  }
  .services-slider .product-card:nth-child(2) {
    margin: 100px 0 0px 0;
    padding-left: 50px;
    padding-right: 100px;
  }
  .slider-container .slider-side-bar p {
    font-size: 24px;
    margin: 20px;
  }
  .services-slider .product-card .product-desc {
    width: 100%;
  }
}
@media screen and (min-width: 769px) {
  .main-menu .up .follow-links.mob-wrap,
  .main-menu .up .page-links.mob-wrap,
  .services-slider .product-card .mob-card-arrow {
    display: none;
  }
}

@media screen and (max-width: 1000px) {
  .services-slider .product-card .product-desc .product-image {
    width: auto;
    margin-bottom: 8px;
  }
  .services-slider .product-card .product-title .H2 {
    font-size: 36px;
  }
}
@media screen and (min-width: 1001px) {
  .services-slider .product-card .product-title .H2 {
    font-size: 60px;
  }
}
@media screen and (min-width: 701px) and (max-width: 1000px) {
  .services-tree .prod_container .single .img img {
    height: 100px;
    width: 100px;
  }
}
@media screen and (min-width: 1001px) and (max-width: 1200px) {
  .services-tree .prod_container .single .img img {
    height: 140px;
    width: 140px;
  }
}
@media screen and (min-width: 1201px) {
  .services-tree .prod_container .single .img img {
    width: 200px;
    height: 200px;
  }
}
@media screen and (min-width: 1001px) and (max-width: 1024px) {
  .services-tree .prod_container {
    padding: 0;
  }
  .services-tree .prod_container {
    display: flex;
    gap: 60px;
  }

  .services-tree .prod_container .single {
    width: 50%;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
  .services-tree .prod_container {
    display: flex;
  }
  .services-tree .prod_container .single {
    width: 50%;
  }
}
@media screen and (min-width: 700px) and (max-width: 999px) {
  .services-slider {
    display: contents;
  }
  #products_swiper {
    width: 100%;
    /* width: 770px; */
    margin: 0 auto;
  }
}
@media screen and (min-width: 1000px) and (max-width: 1200px) {
  .services-slider {
    display: contents;
  }
  #products_swiper {
    width: 100%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 1200px) {
  #cards-tree,
  #top_section {
    display: none !important;
  }
  .services-slider .product-card .product-title {
    bottom: 50px;
  }
}
@media screen and (min-width: 1201px) and (max-width: 1391px) {
  .services-slider .product-card .product-desc .product-image {
    height: 491px !important;
  }
}
@media screen and (min-width: 1201px) and (max-width: 1535px) {
  .services-slider .product-card .product-title {
    bottom: 66px;
    left: 140px;
  }
  .services-slider .product-card:nth-child(2) .product-title {
    left: 90px;
  }
}
@media screen and (min-width: 1201px) {
  /* .slider-container {
        padding-left: 120px;
    } */
  #cards-tree-mob,
  #top_section_mob {
    display: none;
  }

  /* .slider-container .slider-side-bar {
        width: 120px;
        background: #0A0D29;
    } */

  .services-slider .product-card .product-title {
    width: 570px;
  }

  /* .single-page-template .module-container, */
  .services-tree .prod_container {
    display: flex;
  }
  .services-tree .prod_container.single-page-template {
    display: block;
  }
  .services-tree .prod_container .single {
    width: 50%;
  }
}

@media screen and (max-width: 1440px) {
  .width-wrapper {
    margin-top: -1px;
  }
}

.module-container {
  margin-bottom: 12px;
  font-family: "Commissioner", sans-serif;
  font-size: 16px;
  color: #0a0d29;
}

.module-container.side-pad {
  padding-left: 180px !important;
}

.module-container.padding {
  padding: 40px 20px;
}

.module-container.padding.side-pad {
  padding-left: 120px !important;
}

.module-container .side-by-side {
  display: flex;
  flex-direction: row;
  gap: 40px;
}
.module-container .pdf-btn-wrapper {
  display: flex;
  justify-content: center;
  margin: 30px auto 0;
}

.module-container .pdf-btn-wrapper .pdf-btn-toggle {
  border: 1px solid var(--navy-green);
  padding: 19px 21px;
  width: -webkit-max-content;
  width: max-content;
}

.module-container .pdf-btn-wrapper .pdf-btn-toggle:hover {
  background-color: var(--light-grey);
  border: 1px solid var(--light-grey);
}

.module-container .pdf-btn-wrapper .pdf-btn-toggle.active {
  background-color: var(--navy-green);
}

.module-container .pdf-btn-wrapper .pdf-btn-toggle.active p {
  color: var(--white);
}

.module-container .link-btn-wrapper {
  display: flex;
  justify-content: center;
  margin: 40px auto 0;
}

.module-container .link-btn-wrapper .link-btn-toggle {
  border: 1px solid var(--navy-green);
  padding: 19px 21px;
  width: -webkit-max-content;
  width: max-content;
}

.module-container .link-btn-wrapper .link-btn-toggle:hover {
  background-color: var(--light-grey);
  border: 1px solid var(--light-grey);
}

.module-container .link-btn-wrapper .link-btn-toggle.active {
  background-color: var(--navy-green);
}

.module-container .link-btn-wrapper .link-btn-toggle.active p {
  color: var(--white);
}

.module-container .pdf-container {
  margin: 0 auto;
  padding-top: 60px;
  width: 595px;
}

.module-container .pdf-container .pdf-body {
  display: flex;
  justify-content: center;
}

.module-container .pdf-container .pdf-body .background {
  background-color: #000;
  margin-top: 30px;
}

.module-container .pdf-container .pdf-body .background .react-pdf__Page:hover {
  opacity: 0.5;
}

.module-container .pdf-container .pdf-buttons {
  display: flex;
  justify-content: center;
  margin-top: 30px;
  position: relative;
}

.module-container .pdf-container .pdf-buttons .pdf-button-save {
  align-items: center;
  background-color: var(--navy-green);
  border-radius: 50%;
  display: flex;
  height: 66px;
  justify-content: center;
  width: 66px;
}

.module-container .pdf-container .pdf-buttons .pdf-button-save p {
  color: var(--white);
  -webkit-transform: rotate(-15deg);
  transform: rotate(-15deg);
}

.module-container .pdf-container .pdf-buttons .pdf-button-open {
  position: absolute;
  right: 0;
  top: 0;
}

.module-container .pdf-container .pdf-buttons .pdf-button-open .body {
  padding: 0;
}

.module-container .pdf-preview {
  background-color: rgba(0, 0, 0, 0.5);
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;
}

.module-container .pdf-preview .pdf-preview-header {
  background-color: #0a2129;
  display: flex;
  height: 56px;
  justify-content: end;
  padding: 16px 24px;
  width: 100%;
}

.module-container .pdf-preview .pdf-preview-header .pdf-preview-btn-wrapper {
  align-content: center;
  display: flex;
  gap: 29px;
}

.module-container
  .pdf-preview
  .pdf-preview-header
  .pdf-preview-btn-wrapper
  .pdf-download {
  align-items: center;
  display: flex;
}

.module-container
  .pdf-preview
  .pdf-preview-header
  .pdf-preview-btn-wrapper
  .pdf-preview-close {
  border: 1px solid #eaf5f9;
  border-radius: 50%;
  height: 24px;
  position: relative;
  width: 24px;
}

.module-container
  .pdf-preview
  .pdf-preview-header
  .pdf-preview-btn-wrapper
  .pdf-preview-close
  .line {
  background-color: #eaf5f9;
  height: 1px;
  left: calc(50% - 7px);
  position: absolute;
  top: 50%;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 15px;
}

.module-container
  .pdf-preview
  .pdf-preview-header
  .pdf-preview-btn-wrapper
  .pdf-preview-close
  .line:nth-child(2) {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.module-container .pdf-preview .pdf-preview-container {
  display: flex;
  height: calc(100% - 56px);
  justify-content: center;
  width: 100%;
}

.module-container .pdf-preview .pdf-preview-container .scroll {
  overflow: overlay;
}

.module-container .pdf-preview .pdf-preview-container .scroll .react-pdf__Page {
  margin-bottom: 30px;
}

@media (max-width: 480px) {
  .module-container .Body {
    padding: 0 32px;
  }
  .module-container.padding .Body {
    padding: 0;
  }
  .module-container.type-block.padding {
    padding: 40px 20px;
  }

  .module-container.padding {
    margin-left: 32px;
    margin-right: 32px;
  }
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  .wide-gallery-mob-root {
    padding-left: 16px;
    padding-top: 60px;
  }

  .wide-gallery-mob-root .gallery-heading {
    font-size: 40px;
    font-style: italic;
    font-weight: 400;
    line-height: 47px;
    margin-left: 16px;
  }

  .wide-gallery-mob-root .wide-gallery-mob-slider {
    display: flex;
    flex-direction: row;
    gap: 32px;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
  }

  .wide-gallery-mob-root .wide-gallery-mob-slider .spacer {
    display: block;
    height: 100%;
    margin: 40px 0 60px;
    width: 310px;
  }

  .wide-gallery-mob-root .wide-gallery-mob-slider .wide-gallery-card {
    display: flex;
    flex-direction: column;
    margin: 40px 0 60px;
    pointer-events: none;
    scroll-snap-align: start;
    width: 310px;
  }

  .wide-gallery-mob-root
    .wide-gallery-mob-slider
    .wide-gallery-card
    .wide-gallery-image {
    height: 528px;
    margin-bottom: 20px;
    -webkit-user-select: none;
    user-select: none;
    width: 310px;
  }

  .wide-gallery-mob-root
    .wide-gallery-mob-slider
    .wide-gallery-card
    .wide-gallery-image.cover {
    object-fit: cover;
  }

  .wide-gallery-mob-root
    .wide-gallery-mob-slider
    .wide-gallery-card
    .wide-gallery-image.scale-down {
    object-fit: scale-down;
  }

  .wide-gallery-mob-root
    .wide-gallery-mob-slider
    .wide-gallery-card
    .wide-gallery-image.contain {
    object-fit: contain;
  }

  .wide-gallery-mob-root
    .wide-gallery-mob-slider
    .wide-gallery-card
    .wide-gallery-image.fill {
    object-fit: fill;
  }
}

@media (max-width: 480px) {
  .wide-gallery-mob-root {
    padding: 60px 0 60px 16px;
  }

  .wide-gallery-mob-root .gallery-heading {
    font-size: 40px;
    line-height: 47px;
    margin-left: 16px;
  }

  .wide-gallery-mob-root .wide-gallery-mob-slider {
    display: flex;
    flex-direction: row;
    gap: 32px;
    margin-top: 40px;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
  }

  .wide-gallery-mob-root .wide-gallery-mob-slider .wide-gallery-card {
    display: flex;
    flex-direction: column;
    pointer-events: none;
    scroll-snap-align: start;
    width: 310px;
  }

  .wide-gallery-mob-root
    .wide-gallery-mob-slider
    .wide-gallery-card
    .wide-gallery-image {
    height: 528px;
    margin-bottom: 20px;
    -webkit-user-select: none;
    user-select: none;
    width: 310px !important;
  }

  .wide-gallery-mob-root
    .wide-gallery-mob-slider
    .wide-gallery-card
    .wide-gallery-image.cover {
    object-fit: cover;
  }

  .wide-gallery-mob-root
    .wide-gallery-mob-slider
    .wide-gallery-card
    .wide-gallery-image.scale-down {
    object-fit: scale-down;
  }

  .wide-gallery-mob-root
    .wide-gallery-mob-slider
    .wide-gallery-card
    .wide-gallery-image.contain {
    object-fit: contain;
  }

  .wide-gallery-mob-root
    .wide-gallery-mob-slider
    .wide-gallery-card
    .wide-gallery-image.fill {
    object-fit: fill;
  }

  .slider-mob {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overflow-y: hidden;
    transition: height 0.3s ease-in !important;
  }
  .slider-mob > div {
    scroll-snap-align: start;
  }
}

.vacancies-root {
  display: flex;
  justify-content: center;
  padding: 60px 0;
  width: 100%;
}

.vacancies-root .vacancies-bar {
  margin-right: 20px;
  width: 295px;
}

.vacancies-root .vacancies-bar .bar-filter {
  margin-bottom: 20px;
}

.vacancies-root .vacancies-list {
  flex: 1 1;
  max-width: 820px;
}

.vacancies-root .vacancies-list .single-vacancy {
  border-bottom: 1px solid var(--navy-green);
}

.vacancies-root .vacancies-list .single-vacancy .accordion {
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 24px 0;
}

.vacancies-root .vacancies-list .single-vacancy .accordion .toggle {
  height: 32px;
  position: relative;
  width: 32px;
}

.vacancies-root .vacancies-list .single-vacancy .accordion .toggle:after,
.vacancies-root .vacancies-list .single-vacancy .accordion .toggle:before {
  background-color: var(--navy-green);
  content: "";
  height: 2px;
  left: 3px;
  position: absolute;
  top: 15px;
  width: 26px;
}

.vacancies-root .vacancies-list .single-vacancy .accordion .toggle:before {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

.vacancies-root .vacancies-list .single-vacancy .single-desc {
  height: 0;
  overflow-y: initial;
  padding-right: 100px;
  transition: height 0.7s ease-in-out;
}

.vacancies-root .vacancies-list .single-vacancy .single-desc .apply-btn {
  border: 1px solid var(--navy-green);
  padding: 20px 46px;
  transition: background-color 0.5s ease-out;
  width: -webkit-max-content;
  width: max-content;
}

.vacancies-root .vacancies-list .single-vacancy .single-desc .apply-btn:hover {
  background-color: var(--light-grey);
  border: 1px solid var(--light-grey);
}

.vacancies-root .vacancies-list .single-vacancy .single-desc .apply-btn.apply {
  background-color: var(--navy-green);
}

.vacancies-root
  .vacancies-list
  .single-vacancy
  .single-desc
  .apply-btn.apply
  p {
  color: var(--white);
}

.vacancies-root
  .vacancies-list
  .single-vacancy
  .single-desc
  .vacancies-separator {
  height: 60px;
  width: 100%;
}

.vacancies-root
  .vacancies-list
  .single-vacancy.collapse
  .accordion
  .toggle:before {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  .vacancies-root {
    display: flex;
    justify-content: flex-end;
    padding: 20px 0 0;
    width: 100vw;
  }

  .vacancies-root .container {
    flex: initial;
    flex-direction: column;
    padding-right: 64px;
    width: 70%;
  }

  .vacancies-root .container .vacancies-bar {
    margin-right: 0;
    width: 100%;
  }

  .vacancies-root .container .vacancies-bar .bar-filter {
    border-bottom: 1px solid var(--navy-green);
    margin-bottom: 40px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .accordion {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 16px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .accordion .toggle {
    height: 24px;
    position: relative;
    width: 24px;
  }

  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter
    .accordion
    .toggle:after,
  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter
    .accordion
    .toggle:before {
    background-color: var(--navy-green);
    content: "";
    height: 2px;
    left: 2px;
    position: absolute;
    top: 13px;
    width: 20px;
  }

  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter
    .accordion
    .toggle:before {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .filter-item {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 16px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .filter-item.selected {
    background-color: var(--soft-blue);
  }

  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter
    .filter-item
    .tick-empty {
    border: 1px solid var(--light-grey);
    border-radius: 50%;
    height: 14px;
    margin: 2px;
    width: 14px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .overflow-hidden {
    border-top: 1px solid rgba(0, 77, 53, 0.4);
    transition: height 0.3s ease-in-out;
  }

  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter.collapse
    .accordion
    .toggle:before {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .Body {
    color: var(--navy-green);
  }

  .vacancies-root .container .vacancies-list {
    border-top: 1px solid rgba(0, 77, 53, 0.4);
    flex: 1 1;
    padding-top: 40px;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .accordion {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 32px 16px 16px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .accordion
    .toggle {
    height: 32px;
    position: relative;
    width: 32px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .accordion
    .toggle:after,
  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .accordion
    .toggle:before {
    background-color: var(--navy-green);
    content: "";
    height: 2px;
    left: 3px;
    position: absolute;
    top: 15px;
    width: 26px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .accordion
    .toggle:before {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .accordion .H5 {
    font-size: 24px;
    font-weight: 400;
    line-height: 24px;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .accordion p {
    padding-right: 16px;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .single-desc {
    margin: 0;
    padding: 0 16px;
    transition: margin 0.5s ease-out, height 0.7s ease-in-out;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .single-desc .Sub {
    font-size: 16px;
    line-height: 140%;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .Body {
    font-size: 14px;
    line-height: 19.6px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .Body.checkbox-error {
    font-size: 12px;
    line-height: 140%;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .download-button {
    font-size: 16px;
    line-height: 140%;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .apply-btn {
    display: flex;
    justify-content: center;
    margin-bottom: 0;
    padding: 16px 130px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .apply-btn:hover {
    background-color: initial;
    border: 1px solid var(--navy-green);
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .apply-btn
    .Sub2 {
    font-size: 16px;
    font-weight: 600;
    line-height: 140%;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .tablet-separator-16 {
    height: 16px;
    width: 100%;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .vacancies-separator {
    height: 40px;
    width: 100%;
  }

  .vacancies-root .container .vacancies-list .single-vacancy.collapse {
    border-bottom: initial;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .single-desc {
    margin-top: 16px;
    transition: height 0.7s ease-in-out;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .single-desc
    .apply-btn.apply {
    background-color: var(--navy-green);
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .single-desc
    .apply-btn.apply
    p {
    color: var(--white);
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .accordion
    .toggle:before {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .vacancies-root {
    justify-content: center;
    padding: 60px 0;
    width: 100%;
  }

  .vacancies-root .container {
    flex: 1 1;
    flex-direction: row;
    padding-right: 0;
    width: auto;
  }

  .vacancies-root .container .vacancies-bar {
    margin-right: 20px;
    width: 295px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter {
    border-bottom: initial;
    margin-bottom: 20px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .accordion .toggle {
    height: 32px;
    width: 32px;
  }

  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter
    .accordion
    .toggle:after,
  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter
    .accordion
    .toggle:before {
    content: "";
    left: 3px;
    top: 15px;
    width: 26px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .Body {
    color: inherit;
  }

  .vacancies-root .container .vacancies-list {
    border-top: initial;
    flex: 1 1;
    padding-top: 0;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .accordion {
    padding: 24px 0;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .accordion .H5 {
    font-size: 32px;
    font-weight: 300;
    line-height: 38px;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .accordion p {
    padding-right: 0;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .single-desc {
    margin: initial;
    padding: 0 100px 0 0;
    transition: height 0.7s ease-in-out;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .single-desc .Sub {
    font-size: 24px;
    line-height: 28px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .Body {
    font-size: 16px;
    line-height: 22px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .Body.checkbox-error {
    line-height: 17px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .download-button {
    line-height: 22px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .apply-btn {
    display: block;
    justify-content: normal;
    margin-bottom: 0;
    padding: 20px 46px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .apply-btn:hover {
    background-color: var(--light-grey);
    border: 1px solid var(--light-grey);
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .apply-btn
    .Sub2 {
    font-size: 18px;
    line-height: 21px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .tablet-separator-16 {
    height: auto;
    width: auto;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .vacancies-separator {
    height: 60px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .vacancy-application
    .contact-form-root
    .text-input
    :last-child
    .Body {
    font-size: 16px;
  }

  .vacancies-root .container .vacancies-list .single-vacancy.collapse {
    border-bottom: 1px solid var(--navy-green);
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .single-desc {
    margin-top: 0;
    transition: initial;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .single-desc
    .apply-btn.apply {
    background-color: var(--navy-green);
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .single-desc
    .apply-btn.apply
    p {
    color: var(--white);
  }
}

@media (max-width: 480px) {
  .vacancies-root {
    display: flex;
    justify-content: center;
    padding: 0;
    width: 100vw;
  }

  .vacancies-root .container {
    flex-direction: column;
    width: 100%;
  }

  .vacancies-root .container .vacancies-bar {
    margin-right: 0;
    padding-inline: 16px;
    width: 100%;
  }

  .vacancies-root .container .vacancies-bar .bar-filter {
    border-bottom: 1px solid var(--navy-green);
    margin-bottom: 32px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .accordion {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 16px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .accordion .toggle {
    height: 20px;
    position: relative;
    width: 20px;
  }

  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter
    .accordion
    .toggle:after,
  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter
    .accordion
    .toggle:before {
    background-color: var(--navy-green);
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    top: 13px;
    width: 20px;
  }

  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter
    .accordion
    .toggle:before {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .filter-item {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 16px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .filter-item.selected {
    background-color: var(--soft-blue);
  }

  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter
    .filter-item
    .tick-empty {
    border: 1px solid var(--light-grey);
    border-radius: 50%;
    height: 14px;
    margin: 2px;
    width: 14px;
  }

  .vacancies-root .container .vacancies-bar .bar-filter .overflow-hidden {
    border-top: 1px solid rgba(0, 77, 53, 0.2);
    transition: height 0.3s ease-in-out;
  }

  .vacancies-root
    .container
    .vacancies-bar
    .bar-filter.collapse
    .accordion
    .toggle:before {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  }

  .vacancies-root .container .vacancies-list {
    border-top: 1px solid rgba(0, 77, 53, 0.4);
    flex: 1 1;
    padding-inline: 16px;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .accordion {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 36px 16px 16px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .accordion
    .toggle {
    height: 20px;
    position: relative;
    width: 20px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .accordion
    .toggle:after,
  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .accordion
    .toggle:before {
    background-color: var(--navy-green);
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    top: 10px;
    width: 20px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .accordion
    .toggle:before {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .accordion .H5 {
    font-size: 24px;
    line-height: 28px;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .accordion p {
    padding-right: 16px;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .single-desc {
    margin: 0;
    padding: 0;
    transition: margin 0.5s ease-out, height 0.7s ease-in-out;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .Body {
    font-size: 14px;
    line-height: 19.6px;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .Body.checkbox-error {
    font-size: 12px;
    line-height: 140%;
  }

  .vacancies-root .container .vacancies-list .single-vacancy .single-desc .Sub {
    font-size: 16px;
    line-height: 140%;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .Sub2 {
    font-size: 16px;
    font-weight: 600;
    line-height: 140%;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .apply-btn {
    display: flex;
    justify-content: center;
    margin-bottom: 0;
    padding: 16px;
    width: 100%;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .tablet-separator {
    height: 16px;
    width: 100%;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy
    .single-desc
    .download-button {
    font-size: 16px;
    line-height: 140%;
  }

  .vacancies-root .container .vacancies-list .single-vacancy.collapse {
    border-bottom: initial;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .single-desc {
    transition: height 0.7s ease-in-out;
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .single-desc
    .apply-btn:hover {
    background-color: initial;
    border: 1px solid var(--navy-green);
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .single-desc
    .apply-btn.apply {
    background-color: var(--navy-green);
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .single-desc
    .apply-btn.apply
    p {
    color: var(--white);
  }

  .vacancies-root
    .container
    .vacancies-list
    .single-vacancy.collapse
    .accordion
    .toggle:before {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  }
}

.cookie-popup {
  -webkit-animation: slide-down 1s linear both;
  animation: slide-down 1s linear both;
  bottom: 0;
  height: 257px;
  padding: 20px 30px 32px;
  position: fixed;
  right: 0;
  visibility: hidden;
  width: 460px;
  z-index: 999;
}

.cookie-popup.wide {
  height: 195px;
  width: 550px;
}

.cookie-popup.wide .popup-title {
  margin-bottom: 8px;
  margin-right: 24px;
  width: 442px;
}

.cookie-popup.wide > .popup-description {
  margin-bottom: 0;
  width: 490px;
}

.cookie-popup.hidden {
  display: none;
}

@-webkit-keyframes slide-down {
  0% {
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    visibility: hidden;
  }

  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    visibility: visible;
  }
}

@keyframes slide-down {
  0% {
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    visibility: hidden;
  }

  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    visibility: visible;
  }
}

.cookie-popup .button {
  font-family: var(--font);
  font-size: 18px;
  font-style: italic;
  line-height: 21px;
  margin-left: auto;
  padding-bottom: 6px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.cookie-popup .button.color-navy-green:hover {
  border-bottom: 1px solid var(--navy-green);
}

.cookie-popup .button.color-white:hover {
  border-bottom: 1px solid var(--white);
}

.cookie-popup .button.bold {
  margin-left: 32px;
}

.cookie-popup .button.bold.color-navy-green:hover {
  border-bottom: 2px solid var(--navy-green);
}

.cookie-popup .button.bold.color-white:hover {
  border-bottom: 2px solid var(--white);
}

.popup-title {
  margin-bottom: 8px;
}

.popup-description {
  margin-bottom: 32px;
  width: 400px;
}

.popup-link {
  border-bottom: 1px solid;
}

.popup-link.color-navy-green {
  border-color: var(--navy-green);
}

.popup-link.color-white {
  border-color: var(--white);
}

.close-button.button-white {
  border: 1px solid var(--white);
}

.close-button.button-white span {
  background: var(--white);
}
.calculator {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
}

.calculator .button {
  border: 2px solid var(--just-grey);
  padding: 20px 65px;
  position: relative;
  width: 190px;
}

.calculator .button:hover {
  background: var(--light-green);
  border: 2px solid var(--navy-green);
  color: var(--navy-green);
}

.calculator .button.selected {
  background: var(--navy-green);
  border: 2px solid var(--navy-green);
  color: var(--white);
}

.calculator .buttons-container {
  flex-wrap: wrap;
  gap: 20px;
  width: 100%;
}

.calculator-item {
  margin-bottom: 60px;
  margin-top: 60px;
  width: 610px;
}

.calculator-item > div {
  justify-content: space-between;
}

.calculator-check {
  display: block;
  height: 100%;
  opacity: 0;
  position: absolute;
  width: 100%;
  z-index: 2;
}

.snackbar {
  align-items: center;
  background-color: rgba(0, 0, 0, 0.333);
  display: flex;
  height: 100vh;
  justify-content: center;
  left: 0;
  position: fixed;
  top: 0;
  width: 100vw;
  z-index: 999;
}

.snackbar .snackbar-box {
  box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.333);
  margin-bottom: 20vh;
  padding: 20px 30px 32px;
  width: 550px;
  z-index: 1000;
}

.close-button {
  border-radius: 50%;
  height: 24px;
  padding: 10px;
  position: relative;
  width: 24px;
}

.close-button div {
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
}

.close-button span {
  display: block;
  height: 1px;
  left: 4px;
  position: absolute;
  top: 50%;
  width: 15px;
}

.close-button span:first-of-type {
  -webkit-transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
  transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
}

.close-button span:last-of-type {
  -webkit-transform: matrix(0.71, -0.71, 0.71, 0.71, 0, 0);
  transform: matrix(0.71, -0.71, 0.71, 0.71, 0, 0);
}

.close-button.button-navy-green {
  border: 1px solid var(--navy-green);
}

.close-button.button-navy-green span {
  background: var(--navy-green);
}

.isOpen {
  -webkit-animation: show 2.5s forwards;
  animation: show 2.5s forwards;
}

.admin-snackbar-box {
  background-color: #de7262;
  border-radius: 4px;
  bottom: 20px;
  color: #fff;
  font-size: 14px;
  padding: 10px 12px;
  position: fixed;
  right: 20px;
  width: 212px;
  z-index: 1000;
}

.admin-snackbar-box .close-button {
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 50%;
  cursor: pointer;
  height: 16px;
  padding: 0;
  position: absolute;
  right: -7px;
  top: -7px;
  width: 16px;
}

.admin-snackbar-box .close-button:after,
.admin-snackbar-box .close-button:before {
  background-color: #ccc;
  content: "";
  height: 1px;
  left: 4px;
  position: absolute;
  top: 6px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 7px;
}

.admin-snackbar-box .close-button:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.admin-snackbar-box .close-button:hover {
  border-color: #747474;
}

.admin-snackbar-box .close-button:hover:after,
.admin-snackbar-box .close-button:hover:before {
  background-color: #747474;
}

.admin-snackbar-box .warning {
  border: 1px solid #fff;
  border-radius: 50%;
  height: 18px;
  position: relative;
  width: 26px;
}

.admin-snackbar-box .warning:after {
  content: attr(data-content);
  font-size: 14px;
  left: 5px;
  position: absolute;
}

@media screen and (min-width: 1201px) and (-webkit-device-pixel-ratio: 1.25) {
  .snackbar {
    zoom: 0.8;
    height: 125vh;
    width: 125vw;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .snackbar {
    zoom: 0.8;
    height: 125vh;
    width: 125vw;
  }
}

@media (max-width: 480px) {
  .snackbar {
    padding: 16px;
  }
}

.text-fall {
  -webkit-clip-path: polygon(0 0, 80% 0, 80% 0, 0 100%);
  clip-path: polygon(0 0, 80% 0, 80% 0, 0 100%);
  float: left;
  opacity: 0;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  transition: all 1s ease-out;
}

.text-fall.animating {
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  transition: all 1s ease-out;
}

@-webkit-keyframes titleAnimation {
  0% {
    -webkit-clip-path: polygon(0 0, 80% 0, 80% 0, 0 100%);
    clip-path: polygon(0 0, 80% 0, 80% 0, 0 100%);
    opacity: 0;
    -webkit-transform: translateY(50%);
    transform: translateY(50%);
  }

  20% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  to {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes titleAnimation {
  0% {
    -webkit-clip-path: polygon(0 0, 80% 0, 80% 0, 0 100%);
    clip-path: polygon(0 0, 80% 0, 80% 0, 0 100%);
    opacity: 0;
    -webkit-transform: translateY(50%);
    transform: translateY(50%);
  }

  20% {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  to {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

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

body::-webkit-scrollbar-track {
  background-color: var(--white);
}

body::-webkit-scrollbar-thumb {
  background-color: var(--navy-green);
}

html {
  scroll-behavior: var(--smoothy);
}

.splash {
  align-items: center;
  background-color: var(--navy-green);
  display: flex;
  flex: 1 1;
  height: 100vh;
  justify-content: center;
  overflow: hidden;
  width: 100vw;
}

.splash .splash-container svg text {
  stroke: var(--white);
  stroke-width: 3;
  fill: var(--navy-green);
  -webkit-animation: textAnimate 4s forwards;
  animation: textAnimate 4s forwards;
  font-family: var(--font);
  font-size: 150px;
  font-style: italic;
  font-weight: 100;
  letter-spacing: 10px;
}

.splash .splash-container svg text + text {
  font-weight: 600;
}

@-webkit-keyframes textAnimate {
  0% {
    stroke-dasharray: 0 50%;
    stroke-dashoffset: 20%;
  }

  10% {
    stroke-dasharray: 0 50%;
    stroke-dashoffset: 20%;
  }

  50% {
    stroke-dasharray: 50% 0;
    stroke-dashoffset: -20%;
    fill: var(--navy-green);
  }

  90% {
    fill: var(--white);
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes textAnimate {
  0% {
    stroke-dasharray: 0 50%;
    stroke-dashoffset: 20%;
  }

  10% {
    stroke-dasharray: 0 50%;
    stroke-dashoffset: 20%;
  }

  50% {
    stroke-dasharray: 50% 0;
    stroke-dashoffset: -20%;
    fill: var(--navy-green);
  }

  90% {
    fill: var(--white);
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@media screen and (min-width: 1201px) and (-webkit-device-pixel-ratio: 1.25) {
  .splash {
    height: 125vh;
    width: 125vw;
  }
}

@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .splash {
    height: 125vh;
    width: 125vw;
  }
}

@media (max-width: 480px) {
  .splash .splash-container svg {
    -webkit-transform: scale(0.4);
    transform: scale(0.4);
  }

  .codedropz-upload-handler {
    margin-bottom: 0 !important;
  }
}

.charity-tabs {
  svg {
    display: none;
  }
}

div.wpcf7-validation-errors {
  display: none !important;
}
span.wpcf7-not-valid-tip {
  display: none;
}
.wpcf7-spinner {
  display: none !important;
}

#pdfCanvas {
  display: none;
}

.dropzone > p {
  width: 100%;
  height: inherit;
}

.codedropz-upload-handler {
  border: none !important;
}

.dnd-upload-counter {
  display: none !important;
  white-space: unset;
}

.pum {
  overflow: hidden !important;
}
@media screen and (max-width: 1200px) and (min-width: 481px) {
  .pdf-page-mob .title .H-mob,
  .pdf-page-mob .title .H3 {
    font-size: 24px;
    font-weight: 700;
    line-height: 28px;
  }
  .pdf-page-mob .Sub2 {
    font-size: 16px;
    line-height: 140%;
  }
}