/* Inner content inside a layout container. Could be used to constrain maximum content width. */
.vsc-layout-inner {
  position: relative;
  max-width: 100%;
  margin: 0 auto;
}

/* Layout containers */
.vsc-one-column,
.vsc-two-columns,
.vsc-three-columns {
  position: relative;
}

/* Layout inner container. */
.vsc-two-columns .vsc-layout-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

/* Layout inner container. */
.vsc-three-columns .vsc-layout-inner {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

/* Container content widths for the One, Two, Three Column layout containers. */
.vsc-one-column .vsc-layout-inner.vsc-narrow,
.vsc-two-columns .vsc-layout-inner.vsc-narrow,
.vsc-three-columns .vsc-layout-inner.vsc-narrow {
  width: 70%;
  margin: 0 auto;
}

/* Column widths within the Two Column layout container. */
.vsc-two-columns.vsc-5050 .vsc-layout-inner {
  grid-template-columns: 1fr 1fr;
}

.vsc-two-columns.vsc-7030 .vsc-layout-inner {
  grid-template-columns: 7fr 3fr;
}

.vsc-two-columns.vsc-3070 .vsc-layout-inner {
  grid-template-columns: 3fr 7fr;
}

/* Column container. */
.vsc-column {
  position: relative;
}

/* Positioning within a Column container. */
.vsc-column.vsc-horizontal-align-centre,
.vsc-column.vsc-horizontal-align-right,
.vsc-column.vsc-vertical-align-middle,
.vsc-column.vsc-vertical-align-bottom {
  display: flex;
  flex-direction: column;
}

.vsc-column.vsc-horizontal-align-left {
  align-items: flex-start;
}

.vsc-column.vsc-horizontal-align-centre {
  align-items: center;
}

.vsc-column.vsc-horizontal-align-right {
  align-items: flex-end;
}

.vsc-column.vsc-vertical-align-top {
  justify-content: flex-start;
}

.vsc-column.vsc-vertical-align-middle {
  justify-content: center;
}

.vsc-column.vsc-vertical-align-bottom {
  justify-content: flex-end;
}

/* Add padding inside layout containers. */
.vsc-padding .vsc-layout-inner {
  padding-top: 40px;
  padding-bottom: 40px;
}

.vsc-padding-top .vsc-layout-inner {
  padding-top: 40px;
}

.vsc-padding-bottom .vsc-layout-inner {
  padding-bottom: 40px;
}

/* Add padding inside column containers. */
.vsc-column-padding {
  padding: 40px;
}

/* 'Background' image within a column or a layout container. Actually an img tag. */
.vsc-layout-background-image img {

  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.vsc-column > *:not(.vsc-layout-background-image):not(.swiper-pagination):not(.swiper-button-next):not(.swiper-button-prev) {
  position: relative;
}

/* Layout spacer. */
.vsc-layout-spacer {
  height: 50px;
}

/* Tabs - Tab item outer wrapper */
.vsc-tabs .wrapper-layout-tabs {
  margin-bottom: 16px;
}

.vsc-tabs .wrapper-layout-tabs:last-child {
  margin-bottom: 0;
}

/* Tabs - Desktop tabs buttons container */
.vsc-tabs-container {
  display: none;
}

/* Tabs - Mobile tab button */
.vsc-tab-button-mobile {
  border-bottom: 1px solid #eee;
  padding-left: 16px;
  padding-right: 16px;
}

/* Tabs - Mobile tab button selected anchor link element */

.vsc-tab-button-mobile.selected .vsc-tab-link {
  background-color: #eee;
}

/* Tabs - Tab anchor link element */

.vsc-tab-link {
  display: block;
  border: 1px solid #eee;
  border-bottom: none;
  padding: 20px;
  cursor: pointer;
}

.vsc-tab-link--icon {
  display: flex;
  gap: 8px;
}

svg.tab-icon {
  display: block;
}

@media (min-width: 992px) {

  /* Tabs - Tab item outer wrapper */
  .vsc-tabs .wrapper-layout-tabs {
    margin-bottom: 0;
  }

  /* Tabs - Desktop tabs button container */
  .vsc-tabs-container {
    display: block;
  }

  /* Tabs - Desktop tabs list container */
  .vsc-tabs-list {
    display: flex;
    flex-wrap: wrap;
    column-gap: 12px;
    row-gap: 8px;
    border-bottom: 1px solid #eee;
    padding-left: 12px;
    padding-right: 12px;
  }

  /* Tabs - Desktop tabs button selected anchor link element */
  .vsc-tab-button.selected .vsc-tab-link {
    background-color: #eee;
  }

  /* Tabs - Mobile tabs button */
  .vsc-tab-button-mobile {
    display: none;
  }
}
