.card {
    height: 100%;
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
}
.card-block {
    display: flex;
    flex: 0 1 calc(100% - 0.5em);
    justify-content: space-between;
    flex-direction: column;
    margin: 10px 0;
}
.card.card-footer {
    align-self: flex-end;
    flex: 1 1 auto;
}

@media screen and (min-width: 40em) {
    .card {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-evenly;
    }
 
    .card-block {
        flex: 0 1 calc(50% - 1em);
        min-height: 350px;
    }
}

@media screen and (min-width: 60em) {
    .card {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-evenly;
    }
 
    .card-block {
        flex: 0 1 calc(33% - 1em);
    }
}

@media only screen and (max-width: 1000px) {
    .w3-content {
        margin-left: 20px;
        margin-right: 20px;
    }
}

.card-container {
    display: flex

    .w3-cell {
        height: 100%
    }
}


:root {
  --height: 40px;
  --top-color: white;
  --bottom-color: #292b3d;
}

.hero-color {
    background: var(--bottom-color);
    color: white;
}

.navhinge {
    background-color: black;
}

.navhnge::before {

}

.toppanel {
    background-color: var(--top-color);
    color: black;
    overflow: hidden;
    margin: 0;
}

.lowerpanel {
    background-color: var(--bottom-color);
    color: white;
    overflow: hidden;
    height: 100%;
    margin: -1px 0px;
}

.separator {
  position: relative;
  width: var(--width);
  height: var(--height);
  overflow: hidden;
  margin: 0;
  line-height:0;
  padding:0;
}

.separator::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: var(--top-color);
  clip-path: polygon(100% 0, 0 0, 0 100%);
}

.separator::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: var(--bottom-color);
  clip-path: polygon(100% 0, 0 100%, 100% 100%);
}

.separator.reverse {
  transform: rotateY(180deg);
}

.separatorB {
  position: relative;
  width: var(--width);
  height: var(--height);
  overflow: hidden;
  margin: 0;
  line-height:0;
  padding:0;
  margin-top:-1px;
}

.separatorB::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: var(--bottom-color);
  clip-path: polygon(100% 0, 0 0, 0 100%);
}

.separatorB::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: var(--top-color);
  clip-path: polygon(100% 0, 0 100%, 100% 100%);
}

.separatorB.reverse {
  transform: rotateY(180deg);
}
.separatorNav {
  position: relative;
  width: var(--width);
  height: 25px;
  overflow: hidden;
  margin: 0;
  line-height:0;
  padding:0;
}

.separatorNav::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: black;
  clip-path: polygon(100% 0, 0 0, 0 100%);
}

.separatorNav::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: white;
  clip-path: polygon(100% 0, 0 100%, 100% 100%);
}

.separatorNav.reverse {
  transform: rotateY(180deg);
}

.mainpage-last-element {
    margin-bottom: 10rem !important;
}

.mainpage-heading {
  margin-top: 7rem;
}

.mainpage-section-content {
    padding: 5rem 0;
    margin-top: auto;
    margin-bottom: auto;
}

.mainpage-bullets li {
    padding: 1em;
}

.topic-table td {
    padding-bottom: 2em;
}

.js-scroll {
    opacity: 0;
    transition: opacity 3000ms;
}

.js-scroll.scrolled {
  opacity: 1;
}


.booking-table {
    font-size: 1.2em;
    margin:auto
}

.booking-table-info {
    margin:auto;
}

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


.partners {
    display:flex;
    justify-content: center;
    align-content: center;
}

.partner-card {
    diplay: flex;
}