html {
  min-height: 100%;
  position: relative;
  background: var(--bg-10);
  overflow-x: hidden;
  height: 100vh !important;
}

body {
  min-height: 100vh;
  background: var(--bg-10);
  overflow-x: hidden;
}
.text-center{
  text-align: center;
}
header .container {
  display: flex;
  justify-content: space-between;
  z-index: 20;
}

@media (min-width:641px) {
  header .container {
    padding: var(--margin-0);
  }
}

video {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: var(--margin-1);
  /* position: relative; */
}

.logo {
  flex-basis: 70%;
  z-index: 30;
}

@media (min-width:641px) {
  .logo {
    flex-basis: 20%;
    z-index: 0;
  }
}

.logo img {
  aspect-ratio: 27 / 11;
  width: 100%;
}


H1,
H2,
H3,
H4,
H5,
H6 {
  background: var(--main-color);
  background-size: 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

ul.checkmark {
  margin-left: var(--margin-2);
  text-align: left;
  display: inline-block;
}

ul.checkmark li {
  line-height: 2em;
}

ul.checkmark li:before {
  font-family: icomoon;
  font-weight: 400;
  color: #00dd00;
  content: "\e910";
  margin-left: calc(var(--margin-2) * -1 - 2px);
  margin-right: 10px;
}

.gallery {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: center;
}

main p {
  color: var(----main-color);
  margin-bottom: var(--margin-1);
}

main h2,main h3 {
  text-align: center;
  margin-bottom: 10px;
}


.blok h2 {
  margin-top: var(--margin-1);
}

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

@media (min-width:641px) {
  .column-2 {
    flex-direction: row;
  }

}

.column-2 img {
  max-width: 300px;
  align-self: center;
}

main .blok {
  color: var(--main-color);
  margin-bottom: var(--margin-1);
  padding: 10px;
}

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

.waves {
  color: #fff;
  font-size: 1.2em;
  font-weight: 100;
  background: var(--main-color);
}

.waves:before {
  content: "";
  display: block;
  height: 59px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='1920px' height='135px' viewBox='0 0 1920 135'%3E%3Cdefs%3E%3Cg id='Layer1_0_FILL'%3E%3Cpath fill='%23FFFFFF' stroke='none' d='%0AM 1996.45 159.55%0AL 1996.45 -17.4 -13.55 -17.4 -13.55 159.55 1996.45 159.55 Z'/%3E%3C/g%3E%3Cg id='Layer0_0_FILL'%3E%3Cpath fill='%2340499C' stroke='none' d='%0AM 1921.3 17.9%0AQ 1858.55 62.05 1745.25 70.45 1631.9 78.7 1531.55 25.55 1431.15 -27.55 1234.3 52.6 1037.45 132.8 806.75 52.25 576 -28.35 409.6 28.65 243.1 85.6 164.05 49.35 84.8 13.1 -0.8 53.45%0AL -13.55 59.4 -13.55 159.55 1996.45 159.55 1996.45 -17.4%0AQ 1946.903125 -2.163671875 1921.3 17.9 Z'/%3E%3C/g%3E%3Cpath id='Layer1_0_1_STROKES' stroke='%23000000' stroke-width='1' stroke-linejoin='round' stroke-linecap='round' fill='none' d='%0AM -13.55 -17.4%0AL 1996.45 -17.4 1996.45 159.55 -13.55 159.55 -13.55 -17.4 Z'/%3E%3C/defs%3E%3Cg transform='matrix( 1, 0, 0, 1, 0,0) '%3E%3Cuse xlink:href='%23Layer1_0_FILL'/%3E%3Cuse xlink:href='%23Layer1_0_1_STROKES'/%3E%3C/g%3E%3Cg transform='matrix( 1, 0, 0, 1, 0,0) '%3E%3Cuse xlink:href='%23Layer0_0_FILL'/%3E%3C/g%3E%3C/svg%3E") left top no-repeat, #fff;
  background-size: 100% 60px;
  border-top: #fff 1px solid;
}

.waves:after {
  content: "";
  display: block;
  height: 59px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' x='0px' y='0px' width='1920px' height='135px' viewBox='0 0 1920 135'%3E%3Cdefs%3E%3Cg id='Layer1_0_FILL'%3E%3Cpath fill='%23FFFFFF' stroke='none' d='%0AM 1996.45 159.55%0AL 1996.45 -17.4 -13.55 -17.4 -13.55 159.55 1996.45 159.55 Z'/%3E%3C/g%3E%3Cg id='Layer0_0_FILL'%3E%3Cpath fill='%2340499C' stroke='none' d='%0AM 1996.45 30.95%0AL 1996.45 -17.4 -13.55 -17.4 -14.5 124.05%0AQ -6.4939453125 119.436328125 12.5 110.75 93.85 73.45 183.5 68.85 421.15 56.8 525.25 109.95 629.25 163 744.15 90.95 859.05 18.75 1103.8 68.45 1348.65 118.1 1516.9 62.85 1685.1 7.5 1774.3 75.5 1835.65 122.4 1919.35 81.8 1961.32265625 61.4205078125 1996.45 30.95 Z'/%3E%3C/g%3E%3Cpath id='Layer1_0_1_STROKES' stroke='%23000000' stroke-width='1' stroke-linejoin='round' stroke-linecap='round' fill='none' d='%0AM -13.55 -17.4%0AL 1996.45 -17.4 1996.45 159.55 -13.55 159.55 -13.55 -17.4 Z'/%3E%3C/defs%3E%3Cg transform='matrix( 1, 0, 0, 1, 0,0) '%3E%3Cuse xlink:href='%23Layer1_0_FILL'/%3E%3Cuse xlink:href='%23Layer1_0_1_STROKES'/%3E%3C/g%3E%3Cg transform='matrix( 1, 0, 0, 1, 0,0) '%3E%3Cuse xlink:href='%23Layer0_0_FILL'/%3E%3C/g%3E%3C/svg%3E") left bottom no-repeat, #fff;
  background-size: 100% 60px;
}




.hero {
  z-index: -10;
  width: 100%;
  /*aspect-ratio: 1 / 1;*/
}

.hero video {
  width: 100%;
  height: 100%;
}

.hero img {
  width: 100%;
  height: auto;
}

footer {
  background-color: var(--bg-30);
  overflow: hidden;
  margin-top:  var(--margin-2);
}

footer .container {
  display: flex;
  flex-direction: column;
  width: min-content;
}

@media (min-width:641px) {
  footer .container {
    flex-direction: row;
    justify-content: space-evenly;
    width: auto;
  }

}

footer li {
  margin-bottom: 10px;

}

footer ul {
  margin-left: var(--margin-2);
}

.f-blok {

  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin: var(--margin-1) 0 var(--margin-1) 0;
}

.f-blok h3 {

  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 10px;
}

.glider {
  font-size: 2em;
  text-align: center;
}



.grey{
  background-color: var(--bg-20);
margin-bottom: var(--margin-2);
}
.container.flex{
  padding-top: var(--margin-2);
  padding-bottom:0;
}

.container.flex .image{

text-align: center;
}
.twan-contact{
  width:auto;
max-width:70%;
  }
@media (min-width:641px) {
  .container.flex{
    display: grid;
    gap: 1em;
  grid-template-columns: 70% 30%;
  grid-auto-flow: column;
  }

  .container.flex .image{
    align-items: flex-end;
    justify-content: end;
  }
}


.container.flex .form{

  margin-bottom: var(--margin-2);
}


.flex-outer,
.flex-inner {
  list-style-type: none;
  padding: 0;
}

.flex-outer {

  margin-bottom: 10px;
}

.flex-outer li,
.flex-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.flex-inner {
  padding: 0 4px;
  justify-content: space-between;  
}

.flex-outer > li:not(:last-child) {
  margin-bottom: 10px;
}

.flex-outer li label,
.flex-outer li p {



}

.flex-outer > li > label,
.flex-outer li p {
  flex: 1 0 120px;
  max-width: 220px;
}

.flex-outer > li > label + *,
.flex-inner {
  flex: 1 0 220px;
}

.flex-outer li p {
  margin: 0;
}

.flex-outer li input:not([type='checkbox']),
.flex-outer li textarea {
  padding: 8px;
  border: 1px solid var(--bg-30);
}

.flex-outer li button {
  margin-left: auto;
  padding: 8px 12px;
  outline: 2px solid #fff;
  border: 2px solid #000;
  border-radius: 8px;
  outline-offset: -4px;
  background: var(--main-color);
  color: var(--bg-10);
text-transform: uppercase;
font-weight: 700;
font-size:90%;
}

.flex-inner li {
  width: 100px;
}