.kentekencheck-wrapper {
  position: relative;
  height: 394px;
  --content-xpos: 0%;
  --image-xpos: 0%;
}
@media (max-width: 1199px) {
  .kentekencheck-wrapper {
    height: auto;
    min-height: 250px;
    transition: height 0.5s ease-in-out 1s;
  }
}
.kentekencheck-wrapper .page {
  display: none;
  overflow: hidden;
}
.kentekencheck-wrapper .page.active {
  display: flex;
}
.kentekencheck-wrapper .kentekencheck {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  background-color: #fff;
}
@media (max-width: 1199px) {
  .kentekencheck-wrapper .kentekencheck {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    height: 250px;
  }
}
.kentekencheck-wrapper .kentekencheck .image {
  grid-column: 1;
  width: 100%;
}
@media (max-width: 1199px) {
  .kentekencheck-wrapper .kentekencheck .image {
    display: none;
  }
}
.kentekencheck-wrapper .kentekencheck .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.kentekencheck-wrapper .kentekencheck .content {
  grid-column: 2;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--gap);
  box-sizing: border-box;
  padding: 2rem;
}
@media (max-width: 1199px) {
  .kentekencheck-wrapper .kentekencheck .content {
    align-items: center;
    grid-column: 1;
  }
  .kentekencheck-wrapper .kentekencheck .content .desc {
    display: none;
  }
}
.kentekencheck-wrapper .kentekencheck .content form {
  display: flex;
  justify-content: center;
  flex-direction: row;
}
.kentekencheck-wrapper .kentekencheck .content button#finnik-submit {
  line-height: 2rem;
  background: unset;
  border: 0;
  outline: 0;
  align-self: flex-end;
}
.kentekencheck-wrapper .kentekencheck .content button#finnik-submit i:before {
  font-size: 1rem;
  line-height: 2rem;
}
.kentekencheck-wrapper .kentekencheck .content .vwe-licenseplate-wrapper {
  margin: 30px 10px 0px 10px;
}
.kentekencheck-wrapper .kentekencheck .wp-block-button.is-style-text.to-finnik-btn {
  align-self: end;
  margin-top: 30px;
  margin-bottom: -10px;
  margin-right: -5px;
}
.kentekencheck-wrapper .kentekencheck .wp-block-button.is-style-text.to-finnik-btn .wp-element-button {
  padding: 0;
  color: var(--wp--preset--color--vwe-green);
}
.kentekencheck-wrapper .kentekencheck-result {
  display: none !important;
  opacity: 0;
  gap: 27px;
  box-sizing: border-box;
  padding: 2rem;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(4, 1fr);
  background: #fff;
}
@media (max-width: 1199px) {
  .kentekencheck-wrapper .kentekencheck-result {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(5, 1fr);
  }
}
.kentekencheck-wrapper .kentekencheck-result .general-info-wrapper,
.kentekencheck-wrapper .kentekencheck-result .more-info-wrapper {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
}
.kentekencheck-wrapper .kentekencheck-result .more-info-wrapper {
  justify-content: flex-end;
  align-items: center;
  gap: var(--gap);
}
.kentekencheck-wrapper .kentekencheck-result .makemodel-container {
  font-family: "alwyn-new-rounded-web", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-stretch: normal;
  font-optical-sizing: auto;
}
.kentekencheck-wrapper .kentekencheck-result .makemodel-container span.make {
  font-size: 1.5rem;
  display: block;
  color: var(--wp--preset--color--text);
}
.kentekencheck-wrapper .kentekencheck-result .makemodel-container span.model {
  font-size: 1.5rem;
  color: #000;
}
.kentekencheck-wrapper .kentekencheck-result .licensefield-container {
  --vwe-licenseplate-background-color: var(--wp--preset--color--vwe-yellow);
  --vwe-licenseplate-border-color: #000;
  --vwe-licenseplate-text-color: #000;
  --vwe-licenseplate-side-background-color: #0037f9;
  --vwe-licenseplate-side-icon: url('data:image/svg+xml,<svg id="a" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 243.48 422.54"><polygon points="120.58 0 124.04 10.47 135.07 10.52 126.17 17.04 129.53 27.55 120.58 21.11 111.63 27.55 114.99 17.04 106.1 10.52 117.13 10.47 120.58 0" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="68.68 14.4 72.14 24.87 83.16 24.92 74.27 31.44 77.63 41.94 68.68 35.5 59.73 41.94 63.09 31.44 54.2 24.92 65.23 24.87 68.68 14.4" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="30.02 51.23 33.47 61.7 44.5 61.75 35.61 68.27 38.97 78.78 30.02 72.34 21.07 78.78 24.43 68.27 15.54 61.75 26.56 61.7 30.02 51.23" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="14.48 106.1 17.94 116.57 28.96 116.62 20.07 123.15 23.43 133.65 14.48 127.21 5.53 133.65 8.89 123.15 0 116.62 11.03 116.57 14.48 106.1" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="31.85 156.86 35.3 167.33 46.33 167.38 37.44 173.91 40.8 184.41 31.85 177.97 22.9 184.41 26.26 173.91 17.37 167.38 28.39 167.33 31.85 156.86" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="66.85 193.69 70.31 204.17 81.33 204.22 72.44 210.74 75.8 221.24 66.85 214.8 57.9 221.24 61.26 210.74 52.37 204.22 63.4 204.17 66.85 193.69" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="120.58 212.2 124.04 222.67 135.07 222.72 126.17 229.25 129.53 239.75 120.58 233.31 111.63 239.75 114.99 229.25 106.1 222.72 117.13 222.67 120.58 212.2" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="174.31 193.69 177.77 204.17 188.8 204.22 179.9 210.74 183.26 221.24 174.31 214.8 165.36 221.24 168.72 210.74 159.83 204.22 170.86 204.17 174.31 193.69" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="209.32 156.86 212.77 167.33 223.8 167.38 214.91 173.91 218.27 184.41 209.32 177.97 200.37 184.41 203.73 173.91 194.83 167.38 205.86 167.33 209.32 156.86" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="226.68 106.1 230.14 116.57 241.17 116.62 232.28 123.15 235.63 133.65 226.68 127.21 217.73 133.65 221.09 123.15 212.2 116.62 223.23 116.57 226.68 106.1" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="211.15 51.23 214.6 61.7 225.63 61.75 216.74 68.27 220.1 78.78 211.15 72.34 202.2 78.78 205.56 68.27 196.67 61.75 207.69 61.7 211.15 51.23" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="172.48 14.4 175.94 24.87 186.97 24.92 178.07 31.44 181.43 41.94 172.48 35.5 163.53 41.94 166.89 31.44 158 24.92 169.03 24.87 172.48 14.4" style="fill:%23fdcb00; stroke-width:0px;"/><path d="m34.64,422.54v-121.69h23.91l49.8,81.26v-81.26h22.83v121.69h-24.65l-49.06-79.36v79.36h-22.83Z" style="fill:%23fff; stroke-width:0px;"/><path d="m157.82,422.54v-120.69h24.57v100.19h61.09v20.5h-85.66Z" style="fill:%23fff; stroke-width:0px;"/></svg>');
  position: relative;
  outline: 0px;
  border: 0px;
  background-color: var(--vwe-licenseplate-background-color) !important;
  padding: 20px 10px 20px 40px;
  font-weight: 600;
  font-size: 2.4rem;
  line-height: 1rem;
  text-transform: uppercase;
  border-radius: 5px;
  color: var(--vwe-licenseplate-text-color) !important;
  text-align: center;
  width: 210px;
}
@media (max-width: 1199px) {
  .kentekencheck-wrapper .kentekencheck-result .licensefield-container {
    padding: 10px 5px 10px 30px;
    font-weight: 600;
    font-size: 1.7rem;
    width: 110px;
  }
}
.kentekencheck-wrapper .kentekencheck-result .licensefield-container:before {
  content: "";
  left: 0px;
  top: 0px;
  width: 40px;
  height: 100%;
  background-color: #003caa;
  background-color: var(--vwe-licenseplate-side-background-color);
  position: absolute;
  border-radius: 5px 0 0 5px;
  background-image: url('data:image/svg+xml,<svg id="a" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 243.48 422.54"><polygon points="120.58 0 124.04 10.47 135.07 10.52 126.17 17.04 129.53 27.55 120.58 21.11 111.63 27.55 114.99 17.04 106.1 10.52 117.13 10.47 120.58 0" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="68.68 14.4 72.14 24.87 83.16 24.92 74.27 31.44 77.63 41.94 68.68 35.5 59.73 41.94 63.09 31.44 54.2 24.92 65.23 24.87 68.68 14.4" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="30.02 51.23 33.47 61.7 44.5 61.75 35.61 68.27 38.97 78.78 30.02 72.34 21.07 78.78 24.43 68.27 15.54 61.75 26.56 61.7 30.02 51.23" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="14.48 106.1 17.94 116.57 28.96 116.62 20.07 123.15 23.43 133.65 14.48 127.21 5.53 133.65 8.89 123.15 0 116.62 11.03 116.57 14.48 106.1" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="31.85 156.86 35.3 167.33 46.33 167.38 37.44 173.91 40.8 184.41 31.85 177.97 22.9 184.41 26.26 173.91 17.37 167.38 28.39 167.33 31.85 156.86" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="66.85 193.69 70.31 204.17 81.33 204.22 72.44 210.74 75.8 221.24 66.85 214.8 57.9 221.24 61.26 210.74 52.37 204.22 63.4 204.17 66.85 193.69" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="120.58 212.2 124.04 222.67 135.07 222.72 126.17 229.25 129.53 239.75 120.58 233.31 111.63 239.75 114.99 229.25 106.1 222.72 117.13 222.67 120.58 212.2" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="174.31 193.69 177.77 204.17 188.8 204.22 179.9 210.74 183.26 221.24 174.31 214.8 165.36 221.24 168.72 210.74 159.83 204.22 170.86 204.17 174.31 193.69" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="209.32 156.86 212.77 167.33 223.8 167.38 214.91 173.91 218.27 184.41 209.32 177.97 200.37 184.41 203.73 173.91 194.83 167.38 205.86 167.33 209.32 156.86" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="226.68 106.1 230.14 116.57 241.17 116.62 232.28 123.15 235.63 133.65 226.68 127.21 217.73 133.65 221.09 123.15 212.2 116.62 223.23 116.57 226.68 106.1" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="211.15 51.23 214.6 61.7 225.63 61.75 216.74 68.27 220.1 78.78 211.15 72.34 202.2 78.78 205.56 68.27 196.67 61.75 207.69 61.7 211.15 51.23" style="fill:%23fdcb00; stroke-width:0px;"/><polygon points="172.48 14.4 175.94 24.87 186.97 24.92 178.07 31.44 181.43 41.94 172.48 35.5 163.53 41.94 166.89 31.44 158 24.92 169.03 24.87 172.48 14.4" style="fill:%23fdcb00; stroke-width:0px;"/><path d="m34.64,422.54v-121.69h23.91l49.8,81.26v-81.26h22.83v121.69h-24.65l-49.06-79.36v79.36h-22.83Z" style="fill:%23fff; stroke-width:0px;"/><path d="m157.82,422.54v-120.69h24.57v100.19h61.09v20.5h-85.66Z" style="fill:%23fff; stroke-width:0px;"/></svg>');
  background-image: var(--vwe-licenseplate-side-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto 70%;
}
@media (max-width: 1199px) {
  .kentekencheck-wrapper .kentekencheck-result .licensefield-container:before {
    width: 25px;
  }
}
.kentekencheck-wrapper .kentekencheck-result .data {
  text-align: center;
  color: var(--wp--preset--color--text);
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: flex-start;
}
.kentekencheck-wrapper .kentekencheck-result .data .label-wrapper {
  display: flex;
  gap: 10px;
  justify-content: center;
}
.kentekencheck-wrapper .kentekencheck-result .data .value {
  text-align: center;
  width: 100%;
  display: block;
  font-size: 1.5rem;
  line-height: 1.5rem;
  color: #000;
}
.kentekencheck-wrapper .kentekencheck-result .wp-block-button.return {
  margin-right: auto;
}
@media (max-width: 1199px) {
  .kentekencheck-wrapper .kentekencheck-result .wp-block-button.return a#back-to-start {
    padding: 0 !important;
    width: 70px !important;
  }
}
.kentekencheck-wrapper .to-finnik-btn i.icon-link-out:before {
  font-size: 1rem;
}
.kentekencheck-wrapper .fade-out-quick {
  animation: fade-out-with-return 0.5s ease-in-out forwards;
}
.kentekencheck-wrapper.show-step-1 {
  animation: transformer-transition-return;
  animation-fill-mode: forwards;
  animation-duration: 0.5s;
  animation-timing-function: ease-in-out;
}
.kentekencheck-wrapper.show-step-2 {
  animation: transformer-transition;
  animation-fill-mode: forwards;
  animation-duration: 0.5s;
  animation-timing-function: ease-in-out;
}
.kentekencheck-wrapper.show-step-2:after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100px;
  height: 100px;
  background: var(--wp--preset--color--vwe-green);
  border-radius: 100%;
  transform: translate(-50%, -50%);
  opacity: 0;
  animation: pulse-opacity 2s infinite ease-in-out;
  animation-delay: 0.3s;
}
.kentekencheck-wrapper .content {
  transform: translateX(var(--content-xpos));
  z-index: 1;
}
.kentekencheck-wrapper .image {
  transform: translateX(var(--image-xpos));
  z-index: 2;
}
.kentekencheck-wrapper.show-step-3 {
  --image-xpos: -100%;
  --content-xpos: -200%;
}
.kentekencheck-wrapper.show-step-3 .kentekencheck {
  display: none !important;
}
.kentekencheck-wrapper.show-step-3 .kentekencheck-result {
  display: grid !important;
  animation: fade-in 1s ease-in-out forwards;
}

@keyframes transformer-transition {
  0% {
    --content-xpos: 0%;
  }
  45% {
    --content-xpos: -100%;
  }
  50% {
    --image-xpos: 0%;
    --content-xpos: -100%;
  }
  90% {
    --image-xpos: -100%;
    --content-xpos: -200%;
  }
  100% {
    --image-xpos: -100%;
    --content-xpos: -200%;
  }
}
@media (max-width: 1199px) {
  @keyframes transformer-transition {
    0% {
      --content-xpos: 0%;
    }
    100% {
      --content-xpos: -100%;
    }
  }
}
@keyframes transformer-transition-return {
  0% {
    --image-xpos: -100%;
    --content-xpos: -200%;
  }
  50% {
    --image-xpos: 0%;
    --content-xpos: -100%;
  }
  100% {
    --image-xpos: 0%;
    --content-xpos: 0%;
  }
}
@media (max-width: 1199px) {
  @keyframes transformer-transition-return {
    0% {
      --content-xpos: -100%;
    }
    100% {
      --content-xpos: 0%;
    }
  }
}
@keyframes pulse-opacity {
  0%, 100% {
    opacity: 0;
  }
  50% {
    opacity: 0.5;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
    display: grid;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-out-with-return {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}