@charset "UTF-8";
/* fonts */
@font-face {
  font-family: "ProximaNova-Light";
  src: url("fonts/ProximaNova-Light.woff2") format("woff2");
}
@font-face {
  font-family: "ProximaNova-Regular";
  src: url("fonts/ProximaNova-Regular.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: "ProximaNova-Bold";
  src: url("fonts/ProximaNova-Bold.woff2") format("woff2");
  font-display: swap;
}
/*-------------   Colors  --------------*/
/*  -----------------  Grid  ------------------------ */
/* -------------------------------------------------------- */
/* basic rem mixin */
/*
    @include magic-border(2px, blue, 0.3s, 0);
    @include magic-border(4px, #222, 0.2s, 1);
    @include magic-border-mask(10px, 0.4s, linear-gradient(to bottom, #40e0d0, #ff8c00, #ff0080), 0);
*/
[class^=icon-] {
  margin-bottom: 24px;
}

[class^=icon-]:before {
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

.icon-email:before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 18px;
  margin: 3px 10px 0 0;
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='20' height='18' viewBox='0 0 20 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 0L19 0C19.5523 0 20 0.44772 20 1L20 17C20 17.5523 19.5523 18 19 18L1 18C0.44772 18 0 17.5523 0 17L0 1C0 0.44772 0.44772 0 1 0ZM10.0606 8.6829L3.64722 3.2377L2.35278 4.7623L10.0731 11.3171L17.6544 4.75616L16.3456 3.24384L10.0606 8.6829Z' fill='%23FFFFFF' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
}

.icon-totop {
  position: fixed;
  bottom: 53%;
  margin-bottom: 0;
  transition: right 0.5s;
  right: -59px;
  z-index: 9;
}
.icon-totop:before {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 25' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%23FFF' fill='none' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 23.72V1m9 9.003L10.002 1 1 10.003' stroke-width='1.18'/%3E%3Cpath d='M10 23.72V1m9 9.003L10.002 1 1 10.003' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  height: 49px;
  width: 49px;
  background-color: #009aa3;
  border: 1px solid #fff;
  background-size: 18px auto;
  background-position: center center;
}
.icon-totop.active {
  right: 0;
}

.LinkedIn:before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  margin: 1px 10px 0 0;
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%3C%21DOCTYPE%20svg%20PUBLIC%20%22-//W3C//DTD%20SVG%201.1//EN%22%20%22http%3A//www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd%22%3E%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%20455%20455%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A//www.serif.com/%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A1.41421%3B%22%3E%3Cg%3E%3Cpath%20d%3D%22M246.4%2C204.35l0%2C-0.665c-0.136%2C0.223%20-0.324%2C0.446%20-0.442%2C0.665l0.442%2C0Z%22/%3E%3Cpath%20d%3D%22M0%2C0l0%2C455l455%2C0l0%2C-455l-455%2C0Zm141.522%2C378.002l-67.506%2C0l0%2C-203.096l67.506%2C0l0%2C203.096Zm-33.753%2C-230.816l-0.446%2C0c-22.645%2C0%20-37.323%2C-15.601%20-37.323%2C-35.101c0%2C-19.928%2015.107%2C-35.087%2038.211%2C-35.087c23.109%2C0%2037.31%2C15.159%2037.752%2C35.087c0%2C19.5%20-14.643%2C35.101%20-38.194%2C35.101Zm277.231%2C230.816l-67.524%2C0l0%2C-108.657c0%2C-27.291%20-9.756%2C-45.92%20-34.195%2C-45.92c-18.664%2C0%20-29.755%2C12.543%20-34.641%2C24.693c-1.776%2C4.34%20-2.24%2C10.373%20-2.24%2C16.459l0%2C113.426l-67.537%2C0c0%2C0%200.905%2C-184.043%200%2C-203.096l67.537%2C0l0%2C28.779c8.973%2C-13.807%2024.986%2C-33.547%2060.856%2C-33.547c44.437%2C0%2077.744%2C29.02%2077.744%2C91.398l0%2C116.465Z%22%20style%3D%22fill%3A%23fff%3B%22/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
}

.Facebook:before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  margin: 1px 10px 0 0;
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%3C%21DOCTYPE%20svg%20PUBLIC%20%22-//W3C//DTD%20SVG%201.1//EN%22%20%22http%3A//www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd%22%3E%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%20455%20455%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A//www.serif.com/%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A1.41421%3B%22%3E%3Cpath%20d%3D%22M0%2C0l0%2C455l455%2C0l0%2C-455l-455%2C0Zm301.004%2C125.217l-35.564%2C0c-7.044%2C0%20-14.153%2C7.28%20-14.153%2C12.696l0%2C36.264l49.647%2C0c-1.999%2C27.807%20-6.103%2C53.235%20-6.103%2C53.235l-43.798%2C0l0%2C157.588l-65.266%2C0l0%2C-157.605l-31.771%2C0l0%2C-53.029l31.771%2C0l0%2C-43.356c0%2C-7.928%20-1.606%2C-61.009%2066.872%2C-61.009l48.366%2C0l0%2C55.216l-0.001%2C0Z%22%20style%3D%22fill%3A%23fff%3B%22/%3E%3C/svg%3E");
  background-repeat: no-repeat;
}

.page-item a:before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 20px;
  margin-right: 10px;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='18' height='20' viewBox='0 0 18 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M17 20L1 20C0.44772 20 0 19.5523 0 19L0 6L18 6L18 19C18 19.5523 17.5523 20 17 20ZM18 4L0 4L0 1C0 0.44772 0.44772 0 1 0L17 0C17.5523 0 18 0.44772 18 1L18 4ZM4 9L4 13L8 13L8 9L4 9ZM4 15L4 17L14 17L14 15L4 15ZM10 10L10 12L14 12L14 10L10 10Z' fill='%23FFFFFF' /%3E%3C/g%3E%3C/svg%3E");
}

.frame-type-FAQ h2 {
  margin-bottom: 2vh;
}

.faq-schema {
  overflow: hidden;
  position: relative;
}

.faq-schema .faq-item {
  overflow: hidden;
  border-bottom: 1px solid #d8d8d8;
  cursor: pointer;
}

.faq-schema .faq-item h3 {
  position: relative;
}

.faq-schema .faq-name {
  padding: 10px 80px 10px 20px;
  border: 1px solid #f2f2f2;
  background-color: #f2f2f2;
  margin: 0;
}

.faq-schema .faq-answer {
  background-color: white;
  border: 1px solid #f2f2f2;
}

.faq-text {
  padding: 20px 80px 20px 20px;
  display: none;
}

.faq-schema .faq-item h3:after {
  content: "";
  position: absolute;
  right: 27px;
  top: 50%;
  margin-top: -4px;
  width: 17px;
  height: 8px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='8'%3E%3Cpath fill='none' fill-rule='evenodd' stroke='%23000' stroke-linecap='round' d='m.5.5 8 6.85 8-6.85'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 17px 8px;
  background-position: center;
  display: inline-block;
  transform-origin: center;
  transition: transform 0.5s;
}

.faq-schema .faq-item.active h3:after {
  transform: rotate(180deg);
}

.faq-schema .faq-item.active .faq-answer .faq-text {
  display: block;
}

.faq-text a {
  text-decoration: none;
}

*,
:after,
:before {
  box-sizing: border-box;
}

:lang(en) body.solutions h1:before {
  content: "Solutions";
  text-transform: uppercase;
  display: block;
  color: #4d4d4d;
  margin-bottom: clamp(0.125rem, 0.0735rem + 0.1471vw, 0.25rem);
}

:lang(de) body.solutions h1:before {
  content: "Lösungen";
  text-transform: uppercase;
  display: block;
  color: #4d4d4d;
  margin-bottom: clamp(0.125rem, 0.0735rem + 0.1471vw, 0.25rem);
}

html {
  scroll-behavior: smooth;
  font-smooth: always;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  color: #4d4d4d;
  font-family: "ProximaNova-Regular", sans-serif;
  font-weight: normal;
  margin: 0;
  line-height: 1.4;
  overscroll-behavior: none;
}

select {
  color: #4d4d4d;
}

body,
input,
select,
textarea {
  font-size: 1rem;
}

html,
body {
  width: 100%;
  height: 100%;
  position: relative;
}

ul,
ol,
p,
figure {
  margin: 0;
  padding: 0;
}

img {
  display: block;
  width: 100%;
  height: auto;
}

h1, h2 {
  color: #009aa3;
}

table,
h3,
h4,
h5,
h6 {
  line-height: 1.2;
  color: #222222;
}

h1,
h2 {
  line-height: 1;
}

h1 {
  margin: 0 0 clamp(1.5rem, 0.8824rem + 1.7647vw, 3rem) 0;
}

h2 {
  margin: 0 0 clamp(0.75rem, 0.4412rem + 0.8824vw, 1.5rem) 0;
}

p + h2,
ul + h2,
ol + h2 {
  margin: clamp(2rem, -3.4085rem + 11.2676vw, 8rem) 0 clamp(1.5rem, 0.8824rem + 1.7647vw, 3rem) 0;
}

.simple h2 {
  text-transform: none;
}

h3 {
  margin: 0 0 clamp(0.5rem, 0.2941rem + 0.5882vw, 1rem) 0;
}

p + h3,
ul + h3,
ol + h3 {
  margin: clamp(1rem, 0.5882rem + 1.1765vw, 2rem) 0 clamp(0.5rem, 0.2941rem + 0.5882vw, 1rem) 0;
}

h4 {
  margin: 0 0 clamp(0.375rem, 0.2206rem + 0.4412vw, 0.75rem) 0;
}

p + h4,
ul + h4,
ol + h4 {
  margin: clamp(0.75rem, 0.4412rem + 0.8824vw, 1.5rem) 0 clamp(0.375rem, 0.2206rem + 0.4412vw, 0.75rem) 0;
}

.portofolio-item h3 {
  margin: 0;
}

h5,
h6 {
  margin: 0 0 clamp(0.5rem, 0.2941rem + 0.5882vw, 1rem) 0;
}

p + p {
  margin: clamp(0.25rem, 0.1471rem + 0.2941vw, 0.5rem) 0 0 0;
}

footer ul li + li,
main ul li + li,
ul + p,
p + ul {
  margin: clamp(0.25rem, 0.1471rem + 0.2941vw, 0.5rem) 0 0 0;
}

.frame-type-text ul + h3,
.frame-type-text ol + h3,
.frame-type-text ul + h2,
.frame-type-text ol + h2,
.frame-type-text p + h2,
.frame-type-text p + h3,
.frame-type-text ul + h4,
.frame-type-text ol + h4,
.frame-type-text p + h4,
.faq-text ul + h3,
.faq-text ol + h3,
.faq-text ul + h2,
.faq-text ol + h2,
.faq-text p + h2,
.faq-text p + h3,
.faq-text ul + h4,
.faq-text ol + h4,
.faq-text p + h4 {
  margin-top: clamp(1.5rem, 0.8824rem + 1.7647vw, 3rem);
}

.frame-type-text li a,
p a {
  color: #222222;
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
}
.frame-type-text li a:hover,
p a:hover {
  text-decoration: none;
}

sup a {
  color: #222222;
  text-decoration: none;
  margin-left: clamp(0.375rem, 0.2206rem + 0.4412vw, 0.75rem);
}
sup a:hover {
  text-decoration: none;
}

.prod-find h3,
blockquote p,
footer .firstlevel .secondlevel a,
h1,
h2 {
  font-family: "ProximaNova-Light", sans-serif;
  font-weight: normal;
}

b {
  font-family: "ProximaNova-Bold", sans-serif;
  font-weight: normal;
}

.hero h1 {
  font-size: clamp(2.25rem, 0.0047rem + 6.4151vw, 6.5rem);
}

h1 {
  font-size: clamp(2rem, 0.7647rem + 3.5294vw, 5rem);
}

h2 {
  font-size: clamp(1.5rem, 0.7075rem + 2.2642vw, 3rem);
}

main,
.hero p,
.hero,
.firstlevel,
h3 {
  font-size: clamp(1.125rem, 0.9269rem + 0.566vw, 1.5rem);
}

.firstlevel .dropdown-menu {
  font-size: clamp(1rem, 0.8349rem + 0.4717vw, 1.3125rem);
}

form,
button.btn,
h1:before,
footer,
.btn.petrol,
h5,
h6 {
  font-size: clamp(1rem, 0.934rem + 0.1887vw, 1.125rem);
}

figcaption,
.metanav {
  font-size: clamp(0.875rem, 0.809rem + 0.1887vw, 1rem);
}

.firstlevel > .nav-item > a.nav-link,
.btn,
.footer-top,
.footer-bottom,
b,
input,
textarea,
h3.faq-name,
strong,
h1,
h2,
h3,
h4,
h5 {
  font-family: "ProximaNova-Bold", sans-serif;
  font-weight: normal;
}

h1:before,
.hero h1 {
  font-family: "ProximaNova-Light", sans-serif;
  font-weight: normal;
}

select {
  font-family: "ProximaNova-Regular", sans-serif;
  font-weight: normal;
}

blockquote {
  padding: 0 15%;
}
blockquote cite {
  color: #222222;
  display: block;
  font-style: normal;
  padding-top: 18px;
}
blockquote > :nth-child(1) {
  margin-top: 0;
}
blockquote:before {
  display: block;
  height: 0;
  content: "“";
  margin-left: -0.55em;
}

main ol,
main ul,
.faq-text ol,
.faq-text ul,
.frame-type-text ol,
.frame-type-text ul {
  padding-left: 22px;
  line-height: 1.1;
}
main ol li + li,
main ul li + li,
.faq-text ol li + li,
.faq-text ul li + li,
.frame-type-text ol li + li,
.frame-type-text ul li + li {
  margin-top: clamp(0.375rem, 0.2206rem + 0.4412vw, 0.75rem);
}
main ol + p,
main ul + p,
main p + ul,
main p + ol,
.faq-text ol + p,
.faq-text ul + p,
.faq-text p + ul,
.faq-text p + ol,
.frame-type-text ol + p,
.frame-type-text ul + p,
.frame-type-text p + ul,
.frame-type-text p + ol {
  margin-top: clamp(0.75rem, 0.4412rem + 0.8824vw, 1.5rem);
}
main ul li,
.faq-text ul li,
.frame-type-text ul li {
  position: relative;
}

address {
  font-style: normal;
}

sub,
sup {
  font-size: 65%;
}

sub {
  vertical-align: clamp(0.75rem, 0.4412rem + 0.8824vw, 1.5rem);
}

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

.row {
  width: 100%;
  margin: 0 auto;
}

.row {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-gap: 4.35vw;
  gap: 4.35vw;
}

.light-grey-bg .frame-type-text {
  padding: 2.135vw 0;
}

.light-grey-bg.optionen .frame-type-text {
  padding: 0;
}

.flex-row {
  display: flex;
}
.flex-row.v-center {
  align-items: center;
}

.flex {
  display: flex;
}

.col--1 {
  grid-column-end: span 1;
}

.col-offset--1 {
  grid-column-start: 2;
}

.row--1 {
  grid-row-end: span 1;
}

.row-offset--1 {
  grid-row-start: 2;
}

.col--2 {
  grid-column-end: span 2;
}

.col-offset--2 {
  grid-column-start: 3;
}

.row--2 {
  grid-row-end: span 2;
}

.row-offset--2 {
  grid-row-start: 3;
}

.col--3 {
  grid-column-end: span 3;
}

.col-offset--3 {
  grid-column-start: 4;
}

.row--3 {
  grid-row-end: span 3;
}

.row-offset--3 {
  grid-row-start: 4;
}

.col--4 {
  grid-column-end: span 4;
}

.col-offset--4 {
  grid-column-start: 5;
}

.row--4 {
  grid-row-end: span 4;
}

.row-offset--4 {
  grid-row-start: 5;
}

.col--5 {
  grid-column-end: span 5;
}

.col-offset--5 {
  grid-column-start: 6;
}

.row--5 {
  grid-row-end: span 5;
}

.row-offset--5 {
  grid-row-start: 6;
}

.col--6 {
  grid-column-end: span 6;
}

.col-offset--6 {
  grid-column-start: 7;
}

.row--6 {
  grid-row-end: span 6;
}

.row-offset--6 {
  grid-row-start: 7;
}

.col--7 {
  grid-column-end: span 7;
}

.col-offset--7 {
  grid-column-start: 8;
}

.row--7 {
  grid-row-end: span 7;
}

.row-offset--7 {
  grid-row-start: 8;
}

.col--8 {
  grid-column-end: span 8;
}

.col-offset--8 {
  grid-column-start: 9;
}

.row--8 {
  grid-row-end: span 8;
}

.row-offset--8 {
  grid-row-start: 9;
}

.col--9 {
  grid-column-end: span 9;
}

.col-offset--9 {
  grid-column-start: 10;
}

.row--9 {
  grid-row-end: span 9;
}

.row-offset--9 {
  grid-row-start: 10;
}

.col--10 {
  grid-column-end: span 10;
}

.col-offset--10 {
  grid-column-start: 11;
}

.row--10 {
  grid-row-end: span 10;
}

.row-offset--10 {
  grid-row-start: 11;
}

.col--11 {
  grid-column-end: span 11;
}

.col-offset--11 {
  grid-column-start: 12;
}

.row--11 {
  grid-row-end: span 11;
}

.row-offset--11 {
  grid-row-start: 12;
}

.col--12 {
  grid-column-end: span 12;
}

.col-offset--12 {
  grid-column-start: 13;
}

.row--12 {
  grid-row-end: span 12;
}

.row-offset--12 {
  grid-row-start: 13;
}

@media (min-width: 360px) {
  .col-xs-1 {
    grid-column-end: span 1;
  }
  .col-offset-xs-1 {
    grid-column-start: 2;
  }
  .row-xs-1 {
    grid-row-end: span 1;
  }
  .row-offset-xs-1 {
    grid-row-start: 2;
  }
  .col-xs-2 {
    grid-column-end: span 2;
  }
  .col-offset-xs-2 {
    grid-column-start: 3;
  }
  .row-xs-2 {
    grid-row-end: span 2;
  }
  .row-offset-xs-2 {
    grid-row-start: 3;
  }
  .col-xs-3 {
    grid-column-end: span 3;
  }
  .col-offset-xs-3 {
    grid-column-start: 4;
  }
  .row-xs-3 {
    grid-row-end: span 3;
  }
  .row-offset-xs-3 {
    grid-row-start: 4;
  }
  .col-xs-4 {
    grid-column-end: span 4;
  }
  .col-offset-xs-4 {
    grid-column-start: 5;
  }
  .row-xs-4 {
    grid-row-end: span 4;
  }
  .row-offset-xs-4 {
    grid-row-start: 5;
  }
  .col-xs-5 {
    grid-column-end: span 5;
  }
  .col-offset-xs-5 {
    grid-column-start: 6;
  }
  .row-xs-5 {
    grid-row-end: span 5;
  }
  .row-offset-xs-5 {
    grid-row-start: 6;
  }
  .col-xs-6 {
    grid-column-end: span 6;
  }
  .col-offset-xs-6 {
    grid-column-start: 7;
  }
  .row-xs-6 {
    grid-row-end: span 6;
  }
  .row-offset-xs-6 {
    grid-row-start: 7;
  }
  .col-xs-7 {
    grid-column-end: span 7;
  }
  .col-offset-xs-7 {
    grid-column-start: 8;
  }
  .row-xs-7 {
    grid-row-end: span 7;
  }
  .row-offset-xs-7 {
    grid-row-start: 8;
  }
  .col-xs-8 {
    grid-column-end: span 8;
  }
  .col-offset-xs-8 {
    grid-column-start: 9;
  }
  .row-xs-8 {
    grid-row-end: span 8;
  }
  .row-offset-xs-8 {
    grid-row-start: 9;
  }
  .col-xs-9 {
    grid-column-end: span 9;
  }
  .col-offset-xs-9 {
    grid-column-start: 10;
  }
  .row-xs-9 {
    grid-row-end: span 9;
  }
  .row-offset-xs-9 {
    grid-row-start: 10;
  }
  .col-xs-10 {
    grid-column-end: span 10;
  }
  .col-offset-xs-10 {
    grid-column-start: 11;
  }
  .row-xs-10 {
    grid-row-end: span 10;
  }
  .row-offset-xs-10 {
    grid-row-start: 11;
  }
  .col-xs-11 {
    grid-column-end: span 11;
  }
  .col-offset-xs-11 {
    grid-column-start: 12;
  }
  .row-xs-11 {
    grid-row-end: span 11;
  }
  .row-offset-xs-11 {
    grid-row-start: 12;
  }
  .col-xs-12 {
    grid-column-end: span 12;
  }
  .col-offset-xs-12 {
    grid-column-start: 13;
  }
  .row-xs-12 {
    grid-row-end: span 12;
  }
  .row-offset-xs-12 {
    grid-row-start: 13;
  }
}
@media (min-width: 552px) {
  .col-sm-1 {
    grid-column-end: span 1;
  }
  .col-offset-sm-1 {
    grid-column-start: 2;
  }
  .row-sm-1 {
    grid-row-end: span 1;
  }
  .row-offset-sm-1 {
    grid-row-start: 2;
  }
  .col-sm-2 {
    grid-column-end: span 2;
  }
  .col-offset-sm-2 {
    grid-column-start: 3;
  }
  .row-sm-2 {
    grid-row-end: span 2;
  }
  .row-offset-sm-2 {
    grid-row-start: 3;
  }
  .col-sm-3 {
    grid-column-end: span 3;
  }
  .col-offset-sm-3 {
    grid-column-start: 4;
  }
  .row-sm-3 {
    grid-row-end: span 3;
  }
  .row-offset-sm-3 {
    grid-row-start: 4;
  }
  .col-sm-4 {
    grid-column-end: span 4;
  }
  .col-offset-sm-4 {
    grid-column-start: 5;
  }
  .row-sm-4 {
    grid-row-end: span 4;
  }
  .row-offset-sm-4 {
    grid-row-start: 5;
  }
  .col-sm-5 {
    grid-column-end: span 5;
  }
  .col-offset-sm-5 {
    grid-column-start: 6;
  }
  .row-sm-5 {
    grid-row-end: span 5;
  }
  .row-offset-sm-5 {
    grid-row-start: 6;
  }
  .col-sm-6 {
    grid-column-end: span 6;
  }
  .col-offset-sm-6 {
    grid-column-start: 7;
  }
  .row-sm-6 {
    grid-row-end: span 6;
  }
  .row-offset-sm-6 {
    grid-row-start: 7;
  }
  .col-sm-7 {
    grid-column-end: span 7;
  }
  .col-offset-sm-7 {
    grid-column-start: 8;
  }
  .row-sm-7 {
    grid-row-end: span 7;
  }
  .row-offset-sm-7 {
    grid-row-start: 8;
  }
  .col-sm-8 {
    grid-column-end: span 8;
  }
  .col-offset-sm-8 {
    grid-column-start: 9;
  }
  .row-sm-8 {
    grid-row-end: span 8;
  }
  .row-offset-sm-8 {
    grid-row-start: 9;
  }
  .col-sm-9 {
    grid-column-end: span 9;
  }
  .col-offset-sm-9 {
    grid-column-start: 10;
  }
  .row-sm-9 {
    grid-row-end: span 9;
  }
  .row-offset-sm-9 {
    grid-row-start: 10;
  }
  .col-sm-10 {
    grid-column-end: span 10;
  }
  .col-offset-sm-10 {
    grid-column-start: 11;
  }
  .row-sm-10 {
    grid-row-end: span 10;
  }
  .row-offset-sm-10 {
    grid-row-start: 11;
  }
  .col-sm-11 {
    grid-column-end: span 11;
  }
  .col-offset-sm-11 {
    grid-column-start: 12;
  }
  .row-sm-11 {
    grid-row-end: span 11;
  }
  .row-offset-sm-11 {
    grid-row-start: 12;
  }
  .col-sm-12 {
    grid-column-end: span 12;
  }
  .col-offset-sm-12 {
    grid-column-start: 13;
  }
  .row-sm-12 {
    grid-row-end: span 12;
  }
  .row-offset-sm-12 {
    grid-row-start: 13;
  }
}
@media (min-width: 960px) {
  .col-md-1 {
    grid-column-end: span 1;
  }
  .col-offset-md-1 {
    grid-column-start: 2;
  }
  .row-md-1 {
    grid-row-end: span 1;
  }
  .row-offset-md-1 {
    grid-row-start: 2;
  }
  .col-md-2 {
    grid-column-end: span 2;
  }
  .col-offset-md-2 {
    grid-column-start: 3;
  }
  .row-md-2 {
    grid-row-end: span 2;
  }
  .row-offset-md-2 {
    grid-row-start: 3;
  }
  .col-md-3 {
    grid-column-end: span 3;
  }
  .col-offset-md-3 {
    grid-column-start: 4;
  }
  .row-md-3 {
    grid-row-end: span 3;
  }
  .row-offset-md-3 {
    grid-row-start: 4;
  }
  .col-md-4 {
    grid-column-end: span 4;
  }
  .col-offset-md-4 {
    grid-column-start: 5;
  }
  .row-md-4 {
    grid-row-end: span 4;
  }
  .row-offset-md-4 {
    grid-row-start: 5;
  }
  .col-md-5 {
    grid-column-end: span 5;
  }
  .col-offset-md-5 {
    grid-column-start: 6;
  }
  .row-md-5 {
    grid-row-end: span 5;
  }
  .row-offset-md-5 {
    grid-row-start: 6;
  }
  .col-md-6 {
    grid-column-end: span 6;
  }
  .col-offset-md-6 {
    grid-column-start: 7;
  }
  .row-md-6 {
    grid-row-end: span 6;
  }
  .row-offset-md-6 {
    grid-row-start: 7;
  }
  .col-md-7 {
    grid-column-end: span 7;
  }
  .col-offset-md-7 {
    grid-column-start: 8;
  }
  .row-md-7 {
    grid-row-end: span 7;
  }
  .row-offset-md-7 {
    grid-row-start: 8;
  }
  .col-md-8 {
    grid-column-end: span 8;
  }
  .col-offset-md-8 {
    grid-column-start: 9;
  }
  .row-md-8 {
    grid-row-end: span 8;
  }
  .row-offset-md-8 {
    grid-row-start: 9;
  }
  .col-md-9 {
    grid-column-end: span 9;
  }
  .col-offset-md-9 {
    grid-column-start: 10;
  }
  .row-md-9 {
    grid-row-end: span 9;
  }
  .row-offset-md-9 {
    grid-row-start: 10;
  }
  .col-md-10 {
    grid-column-end: span 10;
  }
  .col-offset-md-10 {
    grid-column-start: 11;
  }
  .row-md-10 {
    grid-row-end: span 10;
  }
  .row-offset-md-10 {
    grid-row-start: 11;
  }
  .col-md-11 {
    grid-column-end: span 11;
  }
  .col-offset-md-11 {
    grid-column-start: 12;
  }
  .row-md-11 {
    grid-row-end: span 11;
  }
  .row-offset-md-11 {
    grid-row-start: 12;
  }
  .col-md-12 {
    grid-column-end: span 12;
  }
  .col-offset-md-12 {
    grid-column-start: 13;
  }
  .row-md-12 {
    grid-row-end: span 12;
  }
  .row-offset-md-12 {
    grid-row-start: 13;
  }
}
@media (min-width: 1224px) {
  .col-lg-1 {
    grid-column-end: span 1;
  }
  .col-offset-lg-1 {
    grid-column-start: 2;
  }
  .row-lg-1 {
    grid-row-end: span 1;
  }
  .row-offset-lg-1 {
    grid-row-start: 2;
  }
  .col-lg-2 {
    grid-column-end: span 2;
  }
  .col-offset-lg-2 {
    grid-column-start: 3;
  }
  .row-lg-2 {
    grid-row-end: span 2;
  }
  .row-offset-lg-2 {
    grid-row-start: 3;
  }
  .col-lg-3 {
    grid-column-end: span 3;
  }
  .col-offset-lg-3 {
    grid-column-start: 4;
  }
  .row-lg-3 {
    grid-row-end: span 3;
  }
  .row-offset-lg-3 {
    grid-row-start: 4;
  }
  .col-lg-4 {
    grid-column-end: span 4;
  }
  .col-offset-lg-4 {
    grid-column-start: 5;
  }
  .row-lg-4 {
    grid-row-end: span 4;
  }
  .row-offset-lg-4 {
    grid-row-start: 5;
  }
  .col-lg-5 {
    grid-column-end: span 5;
  }
  .col-offset-lg-5 {
    grid-column-start: 6;
  }
  .row-lg-5 {
    grid-row-end: span 5;
  }
  .row-offset-lg-5 {
    grid-row-start: 6;
  }
  .col-lg-6 {
    grid-column-end: span 6;
  }
  .col-offset-lg-6 {
    grid-column-start: 7;
  }
  .row-lg-6 {
    grid-row-end: span 6;
  }
  .row-offset-lg-6 {
    grid-row-start: 7;
  }
  .col-lg-7 {
    grid-column-end: span 7;
  }
  .col-offset-lg-7 {
    grid-column-start: 8;
  }
  .row-lg-7 {
    grid-row-end: span 7;
  }
  .row-offset-lg-7 {
    grid-row-start: 8;
  }
  .col-lg-8 {
    grid-column-end: span 8;
  }
  .col-offset-lg-8 {
    grid-column-start: 9;
  }
  .row-lg-8 {
    grid-row-end: span 8;
  }
  .row-offset-lg-8 {
    grid-row-start: 9;
  }
  .col-lg-9 {
    grid-column-end: span 9;
  }
  .col-offset-lg-9 {
    grid-column-start: 10;
  }
  .row-lg-9 {
    grid-row-end: span 9;
  }
  .row-offset-lg-9 {
    grid-row-start: 10;
  }
  .col-lg-10 {
    grid-column-end: span 10;
  }
  .col-offset-lg-10 {
    grid-column-start: 11;
  }
  .row-lg-10 {
    grid-row-end: span 10;
  }
  .row-offset-lg-10 {
    grid-row-start: 11;
  }
  .col-lg-11 {
    grid-column-end: span 11;
  }
  .col-offset-lg-11 {
    grid-column-start: 12;
  }
  .row-lg-11 {
    grid-row-end: span 11;
  }
  .row-offset-lg-11 {
    grid-row-start: 12;
  }
  .col-lg-12 {
    grid-column-end: span 12;
  }
  .col-offset-lg-12 {
    grid-column-start: 13;
  }
  .row-lg-12 {
    grid-row-end: span 12;
  }
  .row-offset-lg-12 {
    grid-row-start: 13;
  }
}
@media (min-width: 1730px) {
  .col-xl-1 {
    grid-column-end: span 1;
  }
  .col-offset-xl-1 {
    grid-column-start: 2;
  }
  .row-xl-1 {
    grid-row-end: span 1;
  }
  .row-offset-xl-1 {
    grid-row-start: 2;
  }
  .col-xl-2 {
    grid-column-end: span 2;
  }
  .col-offset-xl-2 {
    grid-column-start: 3;
  }
  .row-xl-2 {
    grid-row-end: span 2;
  }
  .row-offset-xl-2 {
    grid-row-start: 3;
  }
  .col-xl-3 {
    grid-column-end: span 3;
  }
  .col-offset-xl-3 {
    grid-column-start: 4;
  }
  .row-xl-3 {
    grid-row-end: span 3;
  }
  .row-offset-xl-3 {
    grid-row-start: 4;
  }
  .col-xl-4 {
    grid-column-end: span 4;
  }
  .col-offset-xl-4 {
    grid-column-start: 5;
  }
  .row-xl-4 {
    grid-row-end: span 4;
  }
  .row-offset-xl-4 {
    grid-row-start: 5;
  }
  .col-xl-5 {
    grid-column-end: span 5;
  }
  .col-offset-xl-5 {
    grid-column-start: 6;
  }
  .row-xl-5 {
    grid-row-end: span 5;
  }
  .row-offset-xl-5 {
    grid-row-start: 6;
  }
  .col-xl-6 {
    grid-column-end: span 6;
  }
  .col-offset-xl-6 {
    grid-column-start: 7;
  }
  .row-xl-6 {
    grid-row-end: span 6;
  }
  .row-offset-xl-6 {
    grid-row-start: 7;
  }
  .col-xl-7 {
    grid-column-end: span 7;
  }
  .col-offset-xl-7 {
    grid-column-start: 8;
  }
  .row-xl-7 {
    grid-row-end: span 7;
  }
  .row-offset-xl-7 {
    grid-row-start: 8;
  }
  .col-xl-8 {
    grid-column-end: span 8;
  }
  .col-offset-xl-8 {
    grid-column-start: 9;
  }
  .row-xl-8 {
    grid-row-end: span 8;
  }
  .row-offset-xl-8 {
    grid-row-start: 9;
  }
  .col-xl-9 {
    grid-column-end: span 9;
  }
  .col-offset-xl-9 {
    grid-column-start: 10;
  }
  .row-xl-9 {
    grid-row-end: span 9;
  }
  .row-offset-xl-9 {
    grid-row-start: 10;
  }
  .col-xl-10 {
    grid-column-end: span 10;
  }
  .col-offset-xl-10 {
    grid-column-start: 11;
  }
  .row-xl-10 {
    grid-row-end: span 10;
  }
  .row-offset-xl-10 {
    grid-row-start: 11;
  }
  .col-xl-11 {
    grid-column-end: span 11;
  }
  .col-offset-xl-11 {
    grid-column-start: 12;
  }
  .row-xl-11 {
    grid-row-end: span 11;
  }
  .row-offset-xl-11 {
    grid-row-start: 12;
  }
  .col-xl-12 {
    grid-column-end: span 12;
  }
  .col-offset-xl-12 {
    grid-column-start: 13;
  }
  .row-xl-12 {
    grid-row-end: span 12;
  }
  .row-offset-xl-12 {
    grid-row-start: 13;
  }
}
@media (min-width: 1900px) {
  .col-xxl-1 {
    grid-column-end: span 1;
  }
  .col-offset-xxl-1 {
    grid-column-start: 2;
  }
  .row-xxl-1 {
    grid-row-end: span 1;
  }
  .row-offset-xxl-1 {
    grid-row-start: 2;
  }
  .col-xxl-2 {
    grid-column-end: span 2;
  }
  .col-offset-xxl-2 {
    grid-column-start: 3;
  }
  .row-xxl-2 {
    grid-row-end: span 2;
  }
  .row-offset-xxl-2 {
    grid-row-start: 3;
  }
  .col-xxl-3 {
    grid-column-end: span 3;
  }
  .col-offset-xxl-3 {
    grid-column-start: 4;
  }
  .row-xxl-3 {
    grid-row-end: span 3;
  }
  .row-offset-xxl-3 {
    grid-row-start: 4;
  }
  .col-xxl-4 {
    grid-column-end: span 4;
  }
  .col-offset-xxl-4 {
    grid-column-start: 5;
  }
  .row-xxl-4 {
    grid-row-end: span 4;
  }
  .row-offset-xxl-4 {
    grid-row-start: 5;
  }
  .col-xxl-5 {
    grid-column-end: span 5;
  }
  .col-offset-xxl-5 {
    grid-column-start: 6;
  }
  .row-xxl-5 {
    grid-row-end: span 5;
  }
  .row-offset-xxl-5 {
    grid-row-start: 6;
  }
  .col-xxl-6 {
    grid-column-end: span 6;
  }
  .col-offset-xxl-6 {
    grid-column-start: 7;
  }
  .row-xxl-6 {
    grid-row-end: span 6;
  }
  .row-offset-xxl-6 {
    grid-row-start: 7;
  }
  .col-xxl-7 {
    grid-column-end: span 7;
  }
  .col-offset-xxl-7 {
    grid-column-start: 8;
  }
  .row-xxl-7 {
    grid-row-end: span 7;
  }
  .row-offset-xxl-7 {
    grid-row-start: 8;
  }
  .col-xxl-8 {
    grid-column-end: span 8;
  }
  .col-offset-xxl-8 {
    grid-column-start: 9;
  }
  .row-xxl-8 {
    grid-row-end: span 8;
  }
  .row-offset-xxl-8 {
    grid-row-start: 9;
  }
  .col-xxl-9 {
    grid-column-end: span 9;
  }
  .col-offset-xxl-9 {
    grid-column-start: 10;
  }
  .row-xxl-9 {
    grid-row-end: span 9;
  }
  .row-offset-xxl-9 {
    grid-row-start: 10;
  }
  .col-xxl-10 {
    grid-column-end: span 10;
  }
  .col-offset-xxl-10 {
    grid-column-start: 11;
  }
  .row-xxl-10 {
    grid-row-end: span 10;
  }
  .row-offset-xxl-10 {
    grid-row-start: 11;
  }
  .col-xxl-11 {
    grid-column-end: span 11;
  }
  .col-offset-xxl-11 {
    grid-column-start: 12;
  }
  .row-xxl-11 {
    grid-row-end: span 11;
  }
  .row-offset-xxl-11 {
    grid-row-start: 12;
  }
  .col-xxl-12 {
    grid-column-end: span 12;
  }
  .col-offset-xxl-12 {
    grid-column-start: 13;
  }
  .row-xxl-12 {
    grid-row-end: span 12;
  }
  .row-offset-xxl-12 {
    grid-row-start: 13;
  }
}
/* debug grid */
.testgrid .wrapp {
  position: fixed;
  z-index: 100000000000000000;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-gap: 4.35vw;
  gap: 4.35vw;
  pointer-events: none;
}
.testgrid .wrapp div {
  background: rgba(109, 207, 121, 0.2);
}

/* headrom & Nav */
header.head {
  padding: 15px 0;
  background: #fff;
  border-top: 8px solid #00587c;
  top: 0;
  height: 108px;
  width: 100%;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}
header.head .col-12 {
  display: flex;
  justify-content: space-between;
}
header.head {
  will-change: transform;
  transition: transform 0.25s ease-in-out;
  z-index: 99999;
}

.logo {
  margin-top: 6px;
}
.logo a img {
  display: block;
  height: 60px;
  max-width: inherit;
  width: auto;
}

.headroom--pinned {
  transform: translateY(0);
}

.headroom--hidden {
  transform: translateY(-125%);
}

nav {
  position: relative;
}
nav a {
  text-decoration: none;
}

.logo a {
  display: inline-block;
}

.logo img,
.logo a svg {
  display: block;
  height: 60px;
}

.mainnav .nav {
  display: flex;
  justify-content: space-between;
  transition: transform 0.5s;
}

.mainnav {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.mainnav .metanav {
  display: flex;
  width: 100%;
  justify-content: right;
  position: relative;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.mainnav .metanav li + li {
  margin-left: clamp(0.75rem, 0.4412rem + 0.8824vw, 1.5rem);
}
.mainnav .metanav li a {
  color: #4d4d4d;
  text-decoration: none;
}
.mainnav .metanav li.active a {
  color: #009aa3;
}
.mainnav .lanagnav {
  cursor: pointer;
  padding: 0 8px 0 20px;
  position: relative;
}
.mainnav .lanagnav:before {
  content: "";
  position: absolute;
  display: block;
  left: 2px;
  top: 50%;
  margin-top: -7px;
  width: 14px;
  height: 14px;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 15 14' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' d='M0 0h14v13.973H0z'/%3E%3C/defs%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath fill='%23FFF' d='M-1605-27H315v1080h-1920z'/%3E%3Cg transform='translate(.812)'%3E%3Cmask id='b' fill='%23fff'%3E%3Cuse xlink:href='%23a'/%3E%3C/mask%3E%3Cpath d='M9.438 12.597c.521-.727.935-1.706 1.19-2.849.866.1 1.41.216 1.683.285a6.16 6.16 0 0 1-2.873 2.564Zm-7.77-2.604c.316-.067.885-.17 1.726-.257.332 1.224.871 2.259 1.517 3.001a6.159 6.159 0 0 1-3.244-2.744Zm-.511-4.846c.168.046.803.204 1.985.334a10.86 10.86 0 0 0 .062 3.398c-1.015.11-1.64.24-1.92.309a6.074 6.074 0 0 1-.127-4.041Zm3.754-3.91c-.712.818-1.295 1.994-1.612 3.385-.989-.107-1.581-.234-1.818-.29a6.158 6.158 0 0 1 3.43-3.096Zm7.586 3.047c-.132.04-.683.198-1.788.328-.247-1.31-.692-2.428-1.271-3.236a6.161 6.161 0 0 1 3.059 2.909v-.001ZM7.423 8.699v-3.03a35.1 35.1 0 0 0 2.54-.109c.134 1.078.116 2.17-.055 3.243a35.152 35.152 0 0 0-2.485-.104Zm0 4.343V9.568c.9.009 1.665.044 2.308.095-.444 1.776-1.31 3.09-2.308 3.38ZM6.55 9.57v3.462c-.988-.313-1.858-1.618-2.312-3.37.77-.055 1.54-.086 2.312-.092Zm0-8.627v3.856a36.245 36.245 0 0 1-2.403-.097c.42-1.946 1.344-3.422 2.403-3.758V.942Zm.872-.01c1.07.31 1.986 1.796 2.398 3.767-.66.053-1.455.091-2.398.1V.931ZM3.91 6.985c0-.488.031-.965.09-1.424.709.056 1.556.097 2.55.106v3.03a36.56 36.56 0 0 0-2.491.103c-.1-.6-.15-1.207-.15-1.815Zm8.788 2.25c-.24-.07-.845-.222-1.911-.346.163-1.133.18-2.281.05-3.418 1.352-.161 1.943-.364 1.983-.378l-.163-.459a6.074 6.074 0 0 1 .041 4.6ZM14 6.985C14 3.275 11.085.231 7.42.013A2.091 2.091 0 0 0 7.191 0c-.023 0-.045.003-.068.003L7 0C3.14 0 0 3.134 0 6.986c0 3.853 3.14 6.987 7 6.987l.123-.003c.023 0 .045.003.068.003.077 0 .153-.005.229-.014C11.085 13.742 14 10.7 14 6.986Z' fill='%23222' fill-rule='nonzero' mask='url(%23b)'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
}
.mainnav .lanagnav > span:after {
  content: "";
  position: absolute;
  display: block;
  left: 43px;
  top: calc(50% - 2.5px);
  width: 5px;
  height: 5px;
  background-color: #222222;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}
.mainnav .lanagnav ul.lang {
  display: none;
  position: absolute;
  background: rgb(233, 226, 226);
  margin-left: -36px;
  margin-top: -2px;
  z-index: 1;
  text-transform: uppercase;
}
.mainnav .lanagnav ul.lang li {
  margin-left: 0;
  line-height: 25px;
  border-bottom: 1px solid #d8d8d8;
}
.mainnav .lanagnav ul.lang li:hover {
  background-color: #d8d8d8;
}
.mainnav .lanagnav ul.lang li a {
  display: block;
  padding: 6px 36px;
}
.mainnav .lanagnav ul.lang li a:hover {
  color: #009aa3;
}
.mainnav .lanagnav ul.lang li.active a {
  color: #009aa3;
  cursor: default;
}
.mainnav .lanagnav:hover ul.lang {
  display: block;
}
.mainnav .firstlevel {
  display: flex;
  padding-left: 0;
  list-style-type: none;
  margin-left: auto;
  line-height: 1;
}
.mainnav .firstlevel a {
  text-decoration: none;
  position: relative;
}
.mainnav .firstlevel ul {
  list-style-type: none;
}
.mainnav .firstlevel > .nav-item > a.nav-link {
  display: inline-block;
  padding: 20px 0;
}
.mainnav .nav-item + .nav-item {
  margin-left: clamp(1.5rem, 0.8824rem + 1.7647vw, 3rem);
}
.mainnav .nav-item a {
  color: #222222;
  display: block;
}
.mainnav .nav-item a:hover {
  color: #009aa3;
}
.mainnav .level3.nav-item {
  margin-left: 15px;
  border-bottom: 1px solid #009aa3;
}
.mainnav .level3.nav-item:last-child {
  border-bottom: none;
}
.mainnav .level3.nav-item:first-child {
  margin-left: 15px;
}
.mainnav .level3.nav-item a {
  color: #4d4d4d;
  display: block;
}
.mainnav .level3.nav-item a:hover {
  color: #009aa3;
}
.mainnav .nav-item.active > a {
  color: #009aa3;
}
.mainnav .firstlevel > .nav-item.dropdown {
  padding-right: 16px;
}
.mainnav .firstlevel > .nav-item.dropdown > a:after {
  content: "";
  position: absolute;
  display: block;
  right: -16px;
  top: calc(50% - 7px);
  width: 8px;
  height: 10px;
  background-color: #222222;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}
.mainnav .firstlevel > .nav-item:hover a + .dropdown-menu {
  display: block;
}
.mainnav .dropdown-menu {
  position: absolute;
  display: none;
  left: -30px;
  top: 100%;
  width: auto;
  background-color: #f2f2f2;
  padding: 0;
  z-index: -2;
}
.mainnav .dropdown-menu .addmedia {
  background: #fff;
  padding: 10px;
}
.mainnav .dropdown-menu .level2 {
  /* border-top:1px solid $turquoise;*/
  margin-left: 0;
}
.mainnav .dropdown-menu .level2 a.nav-link {
  line-height: 1.2;
  padding: 10px 30px 10px 30px;
  color: #4d4d4d;
  text-transform: none;
}
.mainnav .dropdown-menu .level2 a.nav-link:hover {
  background-color: #009aa3;
  color: #fff;
}
.mainnav .dropdown-menu .level2.active {
  color: #fff;
  background-color: #009aa3;
}
.mainnav .dropdown-menu .level2.active a {
  color: #fff;
  display: block;
}
.mainnav .dropdown-menu .level3 a {
  padding-left: 10px;
  hyphens: auto;
}

.nav-opener {
  display: none;
  float: right;
  width: 31px;
  height: 31px;
  position: relative;
  text-indent: -9999px;
  overflow: hidden;
  border: none;
  background: none;
  cursor: pointer;
  margin-top: 12px;
}

.nav-opener:before,
.nav-opener:after,
.nav-opener span {
  background: #333;
  border-radius: 4px;
  position: absolute;
  top: 17px;
  left: 0;
  right: 0;
  height: 3px;
  transition: all 0.2s linear;
}

.nav-opener:before {
  content: "";
  top: 8px;
  left: 30%;
}

.nav-opener:after {
  content: "";
  top: 26px;
}

.nav-wrapp.active .nav-opener span {
  opacity: 0;
}

.nav-opener:hover {
  opacity: 0.9;
}

.nav-wrapp.active .nav-opener:after,
.nav-wrapp.active .nav-opener:before {
  transform: rotate(45deg);
  top: 16px;
  left: 5%;
  right: 5%;
}

.nav-wrapp.active .nav-opener:after {
  transform: rotate(-45deg);
}

.nav-wrapp.active {
  background: #fff;
}
.nav-wrapp.active .mainnav {
  display: block;
  background-color: #fff;
  position: absolute;
  right: 0;
  top: 90px;
  width: 100%;
  height: 100%;
  min-height: 90vh;
  padding: 40px 20px;
}
.nav-wrapp.active .mainnav .metanav {
  display: block;
}
.nav-wrapp.active .mainnav .firstlevel {
  display: block;
  margin-top: 1.8rem;
}
.nav-wrapp.active .mainnav ul li {
  margin: 0;
  padding: 0;
}
.nav-wrapp.active .mainnav ul.metanav li a {
  padding: 0 0 24px 0;
  display: inline-block;
}
.nav-wrapp.active .mainnav ul.metanav .lanagnav span {
  margin-left: 16px;
}

.breadcrumb {
  display: flex;
  line-height: 1;
  z-index: 1;
}

.breadcrumb-con {
  width: 100%;
}
.breadcrumb-con ul {
  margin: 0 0 0 5px;
  list-style-type: none;
  padding-left: 0;
  display: flex;
  line-height: 1;
}
.breadcrumb-con ul li:before {
  content: " · ";
  color: #4d4d4d;
}
.breadcrumb-con ul li:first-child:before {
  display: none;
}
.breadcrumb-con ul li a {
  color: #4d4d4d;
  text-decoration: none;
}
.breadcrumb-con ul li a:hover {
  text-decoration: underline;
}

.breadcrumb-con.container {
  padding-top: 30px;
  padding-bottom: 0;
}
.breadcrumb-con.container span {
  color: #e6e6e6;
}

.frame-type-form_formframework {
  border: 1px solid #d8d8d8;
  padding: 24px;
  font-family: "ProximaNova-Regular", sans-serif;
}
.frame-type-form_formframework input,
.frame-type-form_formframework select {
  padding: 9px;
  width: 100%;
  border: 1px solid #d8d8d8;
  margin-bottom: 10px;
  background-color: transparent;
}
.frame-type-form_formframework input ::placeholder,
.frame-type-form_formframework select ::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: transparent;
  opacity: 0;
  /* Firefox */
}
.frame-type-form_formframework ::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: transparent;
  opacity: 0;
  /* Firefox */
}
.frame-type-form_formframework .checkbox {
  width: auto;
}
.frame-type-form_formframework .radio input {
  width: auto;
}
.frame-type-form_formframework .radio-group {
  display: flex;
}
.frame-type-form_formframework .radio-group .control-label {
  margin-right: 16px;
}
.frame-type-form_formframework textarea {
  width: 100%;
  height: 70px;
  border: 1px solid #d8d8d8;
  font-family: "ProximaNova-Regular", sans-serif;
}
.frame-type-form_formframework textarea ::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: transparent;
  opacity: 0;
  /* Firefox */
}
.frame-type-form_formframework .error {
  color: #d9326f;
  font-size: 1.2rem;
  transform: translateY(8px);
}
.frame-type-form_formframework input:focus-visible {
  outline: 1px solid #d9326f;
  border: 1px solid transparent;
}
.frame-type-form_formframework input:required:focus:invalid {
  outline: 1px solid #d9326f;
  border: 1px solid transparent;
}

textarea:active,
textarea:focus,
input:active,
input:focus,
select:active,
select:focus {
  outline: 1px solid #d9326f;
  border: 1px solid transparent;
}

.form-check input,
.radio input {
  outline: none;
  cursor: pointer;
}

.form-check input:required:focus:invalid {
  outline: none;
}

.form-check-label .tooltip:after {
  content: "⁛";
  font-size: 30px;
  color: #009aa3;
}
.form-check-label .tooltip:hover span {
  display: block;
}
.form-check-label .tooltip {
  display: inline-block;
  margin-left: 6px;
  margin-top: -20px;
}
.form-check-label .tooltip span {
  position: absolute;
  max-width: 320px;
  border: 1px solid #009aa3;
  padding: 10px;
  background: white;
  bottom: 20px;
  display: none;
}

.products h2 {
  margin-bottom: 10px;
}
.products p {
  margin-bottom: 24px;
}

.form-check-label {
  display: flex;
  cursor: pointer;
  margin-top: 8px;
}
.form-check-label input {
  width: 16px;
  margin-right: 10px;
  margin-top: 6px;
}

#customContact-170400-salutation > .form-group {
  display: flex;
}

.frame-type-form_formframework {
  background-color: white;
}

#customContact-170400 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  font-size: 18px;
}
#customContact-170400 .form-group {
  width: 48%;
  margin-right: auto;
}

/* pixel-lightbox  v 1.77 */
div.lightbox {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(0, 0, 0);
  display: none;
  z-index: 9999;
  justify-content: center;
  align-items: center;
  opacity: 0.1;
  transition: opacity 0.6s ease, display 0.6s ease allow-discrete;
  will-change: opacity;
}
div.lightbox.active {
  display: flex;
  opacity: 1;
  cursor: pointer;
  z-index: 999999;
}
div.lightbox.active .lightbox-content {
  transform: scale(1);
}
div.lightbox .lightbox-content {
  width: 90%;
  height: 90%;
  overflow: hidden;
  display: flex;
  transform: scale(0.9);
  transition: all 0.4s;
}
div.lightbox .lightbox-content.full {
  width: 100%;
  height: 100%;
  transform: scale(1) !important;
}
div.lightbox .lightbox-slides {
  display: flex;
  transition: transform 0.3s ease-in-out;
  min-width: 100%;
}
div.lightbox .slide-wrapper {
  background: black;
  flex: 0 0 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  outline: 2px solid black;
}
div.lightbox .slide-wrapper img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  cursor: n-resize;
  width: 100%;
}
div.lightbox .lightbox-controls .prev-btn,
div.lightbox .lightbox-controls .next-btn {
  background: none;
  border: none;
  color: white;
  cursor: pointer;
  width: 48px;
  height: 48px;
  position: absolute;
  bottom: 47%;
  margin: 0;
  padding: 0;
  opacity: 0.4;
}
div.lightbox .lightbox-controls .prev-btn {
  left: 0;
}
div.lightbox .lightbox-controls .prev-btn:hover {
  opacity: 1;
}
div.lightbox .lightbox-controls .next-btn {
  right: 0;
}
div.lightbox .lightbox-controls .next-btn:hover {
  opacity: 1;
}
div.lightbox .lightbox-controls .prev-btn svg,
div.lightbox .lightbox-controls .next-btn svg {
  width: 28px;
  height: 28px;
}
div.lightbox .lightbox-controls .prev-btn svg path,
div.lightbox .lightbox-controls .next-btn svg path {
  fill: white;
}
div.lightbox .pagination {
  color: white;
  position: fixed;
  top: 16px;
  left: 16px;
  opacity: 0.4;
  margin-top: 0;
}
div.lightbox .close-btn {
  position: fixed;
  top: 6px;
  right: 6px;
  width: 48px;
  height: 48px;
  background: none;
  border: 0;
  cursor: pointer;
}
div.lightbox .close-btn svg {
  width: 20px;
  height: 20px;
}
div.lightbox .close-btn svg path {
  fill: white;
  opacity: 0.4;
}
div.lightbox .close-btn:hover svg path {
  opacity: 1;
}
div.lightbox .disabled {
  cursor: not-allowed !important;
}
div.lightbox .disabled:hover {
  cursor: not-allowed !important;
  opacity: 0.4 !important;
}
div.lightbox .none {
  display: none;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes scaleIn {
  from {
    scale: 0.9;
  }
  to {
    scale: 1;
  }
}
@keyframes scaleOut {
  from {
    scale: 1;
  }
  to {
    scale: 0.9;
  }
}
html {
  scroll-behavior: smooth;
}

main {
  padding-top: 108px;
}

.padd-top {
  padding-top: clamp(2rem, -3.4085rem + 11.2676vw, 8rem);
}

.padd-bottom {
  padding-bottom: clamp(2rem, -3.4085rem + 11.2676vw, 8rem);
}

.optionen {
  padding: 4.35vw 4.35vw 4.35vw 8.7vw;
}

svg:not(:root) {
  overflow: visible;
}

* {
  box-sizing: border-box;
}

:focus-visible {
  outline: 1px solid #222222;
  border-radius: 0;
}

hr {
  background: #222222;
  width: 33.333%;
  height: 1px;
  border: 0;
  margin: 0 auto;
  margin-top: clamp(5rem, 2.9412rem + 5.8824vw, 10rem);
}

h3 + .btn {
  margin: 0;
}

.btn {
  display: inline-flex;
  height: 60px;
  padding-right: 1px;
  margin: 0;
  margin-top: clamp(0.75rem, 0.4412rem + 0.8824vw, 1.5rem);
  text-transform: none;
  pointer-events: all;
  transition: transform 0.5s;
  margin-right: calc(clamp(1rem, 0.5882rem + 1.1765vw, 2rem) + 23px);
}
.btn a {
  background: #009aa3;
  border-left: 1px solid #009aa3;
  border-top: 1px solid #009aa3;
  border-bottom: 1px solid #009aa3;
  position: relative;
  padding: 0 30px;
  text-decoration: none;
  color: white;
  display: flex;
  align-items: center;
}
.btn a::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='60'%3E%3Cpath fill='%23009aa3' fill-rule='evenodd' d='M0 0h23L1.709 60H0z'/%3E%3C/svg%3E");
  content: "";
  display: block;
  position: absolute;
  width: 23px;
  height: 60px;
  top: -1px;
  left: 100%;
  margin-left: -1px;
  background-repeat: no-repeat;
  background-size: cover;
}
.btn a:hover {
  background: #fff;
  color: #009aa3;
  border-left: 1px solid #009aa3;
  border-top: 1px solid #009aa3;
  border-bottom: 1px solid #009aa3;
}
.btn a:hover:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='60'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath fill='%239226ae' fill-rule='nonzero' d='M0 0h22.998L1.709 60H0v-1h1.002L21.581 1H0z'/%3E%3Cpath fill='%23fff' d='M0 0h23L1.709 60H0z'/%3E%3Cpath fill='%23009aa3' fill-rule='nonzero' d='M0 0h22.998L1.709 60H0v-1h1.002L21.581 1H0z'/%3E%3C/g%3E%3C/svg%3E");
}
.btn:hover {
  transform: translateX(8px);
}

.btn.btn-outline a {
  background: #fff;
  color: #009aa3;
}
.btn.btn-outline a::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='60'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath fill='%239226ae' fill-rule='nonzero' d='M0 0h22.998L1.709 60H0v-1h1.002L21.581 1H0z'/%3E%3Cpath fill='%23fff' d='M0 0h23L1.709 60H0z'/%3E%3Cpath fill='%23009aa3' fill-rule='nonzero' d='M0 0h22.998L1.709 60H0v-1h1.002L21.581 1H0z'/%3E%3C/g%3E%3C/svg%3E");
  content: "";
}
.btn.btn-outline a:hover {
  background: #009aa3;
  color: #fff;
  border-left: 1px solid #009aa3;
  border-top: 1px solid #009aa3;
  border-bottom: 1px solid #009aa3;
}
.btn.btn-outline a:hover:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='60'%3E%3Cpath fill='%23009aa3' fill-rule='evenodd' d='M0 0h23L1.709 60H0z'/%3E%3C/svg%3E");
}

button.btn {
  background: #009aa3;
  border-left: 1px solid #009aa3;
  border-top: 1px solid #009aa3;
  border-bottom: 1px solid #009aa3;
  border-right: 0;
  position: relative;
  padding: 0 30px;
  text-decoration: none;
  color: white;
  display: flex;
  align-items: center;
}
button.btn::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='60'%3E%3Cpath fill='%23009aa3' fill-rule='evenodd' d='M0 0h23L1.709 60H0z'/%3E%3C/svg%3E");
  content: "";
  display: block;
  position: absolute;
  width: 23px;
  height: 60px;
  top: -1px;
  left: 100%;
  margin-left: -1px;
  background-repeat: no-repeat;
  background-size: cover;
}
button.btn:hover {
  background: #fff;
  color: #009aa3;
  border-left: 1px solid #009aa3;
  border-top: 1px solid #009aa3;
  border-bottom: 1px solid #009aa3;
}
button.btn:hover:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='60'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath fill='%239226ae' fill-rule='nonzero' d='M0 0h22.998L1.709 60H0v-1h1.002L21.581 1H0z'/%3E%3Cpath fill='%23fff' d='M0 0h23L1.709 60H0z'/%3E%3Cpath fill='%23009aa3' fill-rule='nonzero' d='M0 0h22.998L1.709 60H0v-1h1.002L21.581 1H0z'/%3E%3C/g%3E%3C/svg%3E");
}

.close {
  background-color: transparent;
  border: none;
  margin: 0 auto;
  display: block;
  transform: translateY(-6px);
  cursor: pointer;
}
.close svg {
  width: 2rem;
  height: 2rem;
  fill: white;
  transition: transform 0.5s;
}
.close:hover svg {
  transform: rotate(180deg);
}

dialog {
  transition: display 0.6s allow-discrete, overlay 0.6s allow-discrete;
  animation: close 0.6s forwards;
}
dialog[open] {
  animation: open 1s forwards;
}
dialog {
  border: 0;
  border-radius: 20px;
  background-color: black;
  color: white;
  text-align: left;
  max-width: 1000px;
  padding: max(20px, 2vw);
}

dialog::backdrop {
  background: rgba(28, 28, 30, 0.95);
  cursor: pointer;
}

.table div {
  width: 100%;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  max-width: 100%;
  width: 100%;
  overflow-x: auto;
  vertical-align: top;
  text-align: left;
}
table th {
  border-bottom: 1px solid #222222;
  padding: 15px;
}
table tr td {
  border-bottom: 1px solid #d8d8d8;
  vertical-align: top;
  padding: 10px;
}

.bg-dark-turquoise {
  background-color: #006B70;
  color: white;
}

section.bg-mintlight table tr:nth-child(2n) {
  background: #fff;
}
section.bg-mintlight table th {
  border-bottom: 2px solid #d8d8d8;
}

section.black-m table tr:nth-child(2n) {
  background: rgba(255, 255, 255, 0.1);
}
section.black-m table th {
  border-bottom: 2px solid rgba(255, 255, 255, 0.3);
}
section.black-m table tr td {
  border-bottom: 2px solid rgba(255, 255, 255, 0.3);
}
section.black-m table tr td + td {
  border-left: 1px solid rgba(255, 255, 255, 0.3);
}

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

.v-bottom .grid .row {
  align-items: end;
}

.frame-type-textpic {
  width: 100%;
  height: 100%;
}
.frame-type-textpic .ce-gallery {
  width: 100%;
  height: 100%;
}
.frame-type-textpic .ce-gallery .ce-outer {
  width: 100%;
  height: 100%;
}
.frame-type-textpic .ce-gallery .ce-outer .ce-inner {
  width: 100%;
  height: 100%;
}
.frame-type-textpic .ce-gallery .ce-outer .ce-inner .ce-row {
  width: 100%;
  height: 100%;
}
.frame-type-textpic .ce-gallery .ce-outer .ce-inner .ce-row .ce-column {
  width: 100%;
  height: 100%;
}
.frame-type-textpic .ce-gallery .ce-outer .ce-inner .ce-row .ce-column .image {
  width: 100%;
  height: 100%;
  margin: 0;
}

/*
.ce-gallery figure {
    display: flex;
    margin: 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
*/
.image-caption {
  margin-top: 0.5rem;
  width: 100%;
}

.flex {
  display: flex;
}

/* video */
.frame-type-textmedia,
.ce-gallery,
.ce-column {
  width: 100%;
}

.ce-border img,
.ce-border iframe {
  border: 1px solid #e6e6e6;
}

.ce-gallery picture {
  width: 100%;
}
.ce-gallery img {
  width: auto;
  max-width: 100%;
  width: 100%;
}

.ce-intext.ce-right .ce-gallery,
.ce-intext.ce-left .ce-gallery,
.ce-above .ce-gallery {
  margin-bottom: 0;
}

.v-center .col-12 {
  display: flex;
  align-items: center;
}

.white-bg {
  background-color: white;
  color: #4d4d4d;
}

section {
  position: relative;
}
section .scaling-svg {
  position: absolute;
  bottom: 2.175vw;
  z-index: 1;
  pointer-events: none;
}

section .toplinks .scaling-svg,
section .topright .scaling-svg {
  position: absolute;
  top: 2.175vw;
  bottom: unset;
  transform: rotate(180deg);
  pointer-events: none;
}

.ce-image.ce-center {
  height: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.dark-green-bg {
  background-color: #006B70;
  color: white;
}
.dark-green-bg a, .dark-green-bg p, .dark-green-bg h1, .dark-green-bg h3 {
  color: white;
}

.frame-light-grey-bg,
.light-grey-bg {
  background-color: #e6e6e6;
}

.frame-light-grey-bg {
  padding: 2.175vw;
}

.bg-image img {
  object-fit: cover;
  object-position: center bottom;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  z-index: -2;
}

.totop {
  cursor: pointer;
}

.hero {
  background-color: transparent;
  color: white;
  min-height: calc(100vh - 108px);
  padding: clamp(2rem, -3.4085rem + 11.2676vw, 8rem) 0;
}
.hero a, .hero p, .hero h1, .hero h3 {
  color: white;
}
.hero h1 {
  line-height: 1;
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
}
.hero .row:before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  background-color: rgba(0, 88, 124, 0.8392156863);
  z-index: -1;
}
.hero .row {
  grid-row-gap: 0;
}
.hero .frame-type-textpic .ce-bodytext {
  width: 80%;
}

.banner {
  background-color: transparent;
  color: white;
}
.banner a, .banner p, .banner h1, .banner h3 {
  color: white;
}
.banner h2 {
  line-height: 1;
}
.banner h2 b {
  line-height: 1.3;
}
.banner .ce-gallery img {
  max-width: 100%;
  width: 100%;
}
.banner .row:before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  left: 0;
  top: 0; /*
background-color: rgb(73 73 73 / 53%); */
  z-index: -1;
}
.banner .col-md-12 .frame-type-image {
  width: 100vw;
}

.video-embed {
  position: relative;
  padding-bottom: 56%; /* 16/9 Video */
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.video-embed iframe,
.video-embed object,
.video-embed embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.frame-type-menu_subpages .image + .teaser-text p {
  text-decoration: none;
  color: #4d4d4d;
  margin-top: 10px;
}
.frame-type-menu_subpages a {
  text-decoration: none;
}
.frame-type-menu_subpages a .image {
  overflow: hidden;
}

a .image,
figure.image a {
  display: block;
  overflow: hidden;
}
a .image img,
figure.image a img {
  transition: transform 0.9s;
}
a .image img:hover,
figure.image a img:hover {
  transform: scale(1.2);
}

.frame-type-text ul {
  list-style: outside "▪  ";
  padding-left: 20px;
}
.frame-type-text ul li::marker {
  color: #009aa3;
}

.home-page .frame-type-text p strong {
  text-transform: uppercase;
}

form .row {
  gap: 10px;
}

.inputs-list .form-group {
  display: flex;
  gap: 20px;
}

input,
input[type=radio i] {
  margin: 0 5px 0 0;
}

.form-group {
  margin-top: 5px;
}

@media (prefers-reduced-motion: no-preference) {
  /* css page transition api */
  @view-transition {
    navigation: auto;
  }
  body {
    view-transition-name: page;
  }
  ::view-transition-old(page) {
    animation: page-out 0.9s cubic-bezier(0.86, 0, 0.07, 1) both;
  }
  ::view-transition-new(page) {
    animation: page-in 0.9s cubic-bezier(0.86, 0, 0.07, 1) both;
  }
  @keyframes page-out {
    0% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  @keyframes page-in {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  /* css scroll driven aniomations */
  @supports (animation-timeline: view()) {
    .faq-item,
    .content-elements,
    .portofolio-item {
      animation: autoBLurAnimation linear both;
      animation-timeline: view();
      animation-duration: 0.7ms; /* Firefox requires this to apply the animation */
    }
  }
  .forcehardware {
    transform: translate3d(0, 0, 0);
  }
  .backface {
    backface-visibility: hidden;
  }
  .pers-origin {
    perspective-origin: 50% 0;
  }
  /* css paralax  */
  /* end css paralx */
  @keyframes autoBLurAnimation {
    0% {
      filter: blur(40px);
    }
    15% {
      filter: blur(0px);
    }
    95% {
      filter: blur(0px);
    }
    100% {
      filter: blur(40px);
    }
  }
  @keyframes open {
    from {
      transform: scale(0.8);
      opacity: 0;
    }
    to {
      transform: scale(1);
      opacity: 1;
    }
  }
  @keyframes close {
    from {
      transform: scale(1);
      opacity: 1;
    }
    to {
      transform: scale(0.8);
      opacity: 0;
    }
  }
  @keyframes in-view {
    from {
      opacity: 0;
      transform: translateY(40px);
      transition: opacity 0.6s ease, transform 0.6s ease;
    }
    to {
      transform: translateY(0);
      opacity: 1;
    }
  }
}
footer {
  display: block;
  width: 100%;
  background: #009aa3;
  color: white;
}
footer ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
footer p {
  color: #99D7DA;
}
footer a {
  color: white;
  text-decoration: none;
}
footer a:hover {
  text-decoration: underline;
}
footer a {
  display: flex;
}

.footer-top {
  width: 100%;
  padding: clamp(2rem, 1.1765rem + 2.3529vw, 4rem) 0;
}
.footer-top .flex {
  display: flex;
  justify-content: space-between;
}

.footer-bottom {
  padding: clamp(0.5rem, 0.2941rem + 0.5882vw, 1rem) 0;
}
.footer-bottom .flex {
  width: 100%;
  margin: auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

/* media */
@media only screen and (max-width: 1620px) {
  .btn {
    height: 40px;
    line-height: 1;
  }
  .btn a {
    padding: 0 20px;
  }
  button.btn::after,
  .btn a::after {
    content: "";
    width: 16px;
    height: 40px;
  }
  button.btn:hover::after,
  .btn.btn-outline a::after,
  .btn a:hover:after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='40'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath fill='%23fff' d='M0 0h16.003L1.809 40H0z'/%3E%3Cpath fill='%23009aa3' fill-rule='nonzero' d='M0 0h16.202L2.333 40.016-.003 40l.006-1 1.619.011L14.797 1H0z'/%3E%3C/g%3E%3C/svg%3E");
  }
}
@media screen and (min-device-width: 960px) and (max-device-width: 1223px) {
  .i-p-right {
    padding: 0 2.175vw;
  }
}
@media (min-width: 1224px) {
  .v-center .col-lg-7 .frame-type-text {
    grid-column: span 4;
  }
}
@media only screen and (max-width: 1223px) {
  .col-5-5 {
    padding: 0 2.175vw;
  }
}
@media only screen and (max-width: 959px) {
  .scaling-svg {
    display: none;
  }
  .col-12 {
    grid-column-end: span 12;
    padding-left: 4.35vw;
    padding-right: 4.35vw;
  }
  .col-12 .col-12 {
    padding-left: 0;
    padding-right: 0;
  }
  .mainnav {
    display: none;
  }
  .mainnav li {
    border-bottom: 1px solid #e6e6e6;
  }
  .mainnav li ul li {
    border-bottom: 0;
  }
  .nav-opener {
    display: block;
  }
  svg rect {
    transform: scale(2);
  }
  .scaling-svg {
    width: 130%;
    margin-left: -15%;
  }
  .mainnav .lanagnav span.lang {
    display: none;
  }
  .mainnav .lanagnav:before {
    content: none;
  }
  .mainnav .lanagnav ul.lang {
    display: flex;
    list-style-type: none;
    position: static;
    width: auto;
    background: none;
    margin: 0;
  }
  .mainnav .lanagnav ul.lang span {
    margin-left: 0 !important;
    margin-right: 0;
  }
  .mainnav .lanagnav ul.lang li {
    border-bottom: 0;
    line-height: 1.4;
  }
  .mainnav .lanagnav ul.lang li a {
    text-decoration: none;
    padding: 10px 4.35vw !important;
  }
  .mainnav .lanagnav ul.lang li + li {
    border-left: 1px solid #e6e6e6;
  }
  .light-grey-bg .row {
    padding-bottom: 4.35vw;
  }
  .light-grey-bg .row .frame-type-text {
    padding: 4.35vw 0;
  }
  .padd-top.padd-bottom .row,
  .padd-top.padd-bottom .row .frame-type-text {
    padding: 0;
  }
  .nav-wrapp.active .mainnav ul.metanav li a {
    padding: 10px 4.35vw;
    display: block;
  }
  .mainnav a.active + .dropdown-menu {
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 999999;
  }
  .mainnav a.active + .dropdown-menu ul {
    padding: 0 20px;
  }
  .firstlevel,
  .metanav {
    font-size: 2rem;
  }
  .firstlevel .dropdown-menu {
    font-size: 1.5rem;
  }
  .dropdown-menu li:hover {
    background-color: transparent !important;
  }
  .dropdown-menu .level2 {
    border-bottom: 1px solid #dadada;
  }
  .dropdown-menu .level2 a {
    line-height: 1 !important;
  }
  .mainnav .dropdown-menu .level2:hover a {
    color: #009aa3;
  }
  .mainnav .firstlevel > .nav-item:hover a + .dropdown-menu {
    position: static;
  }
  .mainnav .lanagnav:hover ul.lang {
    display: flex;
  }
  .mainnav .firstlevel > .nav-item.dropdown > a:after {
    top: 27px;
    width: 10px;
    height: 12px;
    right: 4.35vw;
  }
  .nav-wrapp.active .mainnav {
    display: flex;
    flex-direction: column-reverse;
    justify-content: flex-end;
    padding: 0;
  }
  .nav-wrapp.active .mainnav .firstlevel {
    line-height: 1.4;
    margin-top: 0;
    margin-left: 0;
  }
  .nav-wrapp.active .mainnav .firstlevel .nav-item .nav-link {
    display: block;
    padding: 10px 4.35vw;
  }
  #customContact-170400 {
    display: block;
  }
  #customContact-170400 .form-group {
    width: 100%;
  }
  .frame-tehnic-data {
    max-width: 100% !important;
    padding: 30px 0 !important;
    width: 100%;
  }
  .hero .frame-type-textpic .ce-bodytext {
    width: 100%;
  }
  .mainnav .firstlevel > .nav-item.dropdown {
    padding-right: 0;
  }
  .col-5-5 {
    padding: 0;
  }
}
@media only screen and (max-width: 640px) {
  table tr {
    display: flex;
    flex-flow: column;
    width: 100%;
  }
  table tr td {
    padding: 5px 0;
  }
  table tr td:first-child {
    border-bottom: 0;
  }
}
@media only screen and (max-width: 551px) {
  .firstlevel,
  .metanav {
    font-size: 1.5rem;
  }
  .firstlevel .dropdown-menu {
    font-size: 1.25rem;
  }
  .hero {
    padding-top: 4.35vw;
  }
  .sub-menu {
    display: flex;
    flex-flow: column;
  }
  .sub-menu .col-sm-6 {
    width: 100%;
  }
  .mainnav .firstlevel > .nav-item.dropdown > a:after {
    top: 21px;
  }
  .padd-top {
    padding-top: clamp(3rem, 1.7647rem + 3.5294vw, 6rem);
  }
  .padd-bottom {
    padding-bottom: clamp(3rem, 1.7647rem + 3.5294vw, 6rem);
  }
  .footer-top .flex {
    display: block;
  }
  .footer-top .flex .footerpages {
    margin-bottom: 4px;
  }
}

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