/* jsloader//css file: assets/css/module-header-first.css */
.module-header {

}

.module-header .header-container {
  ---rem: var(--rem, 100px);

  ---color-main: var(--color-main, 255, 192, 0);
  ---color-first: var(--color-first, 255, 255, 255);
  ---color-second: var(--color-second, 0, 0, 0);

  ---grid: var(--grid, calc( 0.64 * var(---rem) ) );

  display: grid;
  grid-auto-rows: auto 1fr;
  grid-template-columns: 100%;
  min-height: 100vh;
}

.module-header.header-sub-first .header-container {
  height: auto;
  min-height: auto;
  overflow: hidden;
  position: relative;
}

.module-header .header-content {
  align-items: center;
  display: flex;
  flex-flow: column;
  justify-content: center;
  padding-bottom: var(---grid);
  padding-top: var(---grid);
}

.header-first .header-heading {
  color: rgb( var(---color-first) );
  font-size: calc( 0.32 * var(---rem) );
  font-weight: 700;
  background: rgb( var(---color-main) );
  padding: 1em;
  text-align: center;
  text-transform: uppercase;
  text-wrap: balance;
  max-width: calc( 6.40 * var(---rem) );
}

.header-first .header-main {
  background: rgb( var(---color-second) );
  color: rgb( var(---color-first) );
  margin: calc( 0.06 * var(---rem) ) 0 0;
  max-width: calc( 6.40 * var(---rem) );
  padding: 2em 1em;
  text-align: center;
}

.header-first .header-img {
  filter: blur( calc( 0.05 * var(---rem) ) );
  height: 100%;
  left: 0;
  object-fit: cover;
  position: absolute;
  right: 0;
  top: 0;
  transform: scale(1.2);
  width: 100%;
  z-index: -1;
}
/* jsloader//css file: assets/css/module-top-first.css */
.module-top.top-first {
  container: top-first / inline-size;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1;
}

.module-header .top-first {
  position: static;
}

.top-first .top-container {
  ---rem: var(--rem, 100px);

  ---color-main: var(--color-main, 255, 192, 0);
  ---color-first: var(--color-first, 255, 255, 255);
  
  ---grid: var(--grid, calc( 0.64 * var(---rem) ) );
  ---grid-: calc( var(--grid) * -1 );

  ---margins: calc( ( 100vw - var(--container) ) / 2 );
  ---margins-: calc( var(---margins) * -1 );

  background: rgb( var(---color-first) );
  display: flex;
  width: 100%;
}

.top-first .top-main {
  align-items: center;
  display: flex;
  flex: 1;
  padding: 0.24rem var(---margins) 0.24rem 0.64rem;
}

.top-first .top-sub {
  align-items: center;
  background: rgb( var(---color-main) );
  display: flex;
  padding: 0.24rem 0.64rem 0.24rem var(---margins);
}

@container top-first (max-width: 81.75em) { /*1308px*/
  .top-first .top-main,
  .top-first .top-sub {
    padding: 0.24rem var(---grid);
  }
}

@container top-first (max-width: 45em) { /*720px*/
  .top-first .top-main,
  .top-first .top-sub {
    padding: 0.24rem var(---grid);
  }
}

@container top-first (max-width: 20em) { /*320px*/
  .top-first .top-main,
  .top-first .top-sub {
    padding: 0.24rem var(---grid);
  }
}

@container top-first (max-width: 18em) { /*288px*/
  .top-first .top-sub {
    display: none;
  }
}
/* jsloader//css file: assets/css/module-logo-first.css */
.logo-first {
  ---rem: var(--rem, 100px);
}

.logo-first .logo-link {
  display: inline-block;
  margin: calc( -0.16 * var(---rem) );  
  padding: calc( 0.16 * var(---rem) );
}
/* jsloader//css file: assets/css/module-nav-first.css */
.module-nav.nav-first {
  ---rem: var(--rem, 100px);

  ---color-main: var(--color-main, 255, 192, 0);
  ---color-first: var(--color-first, 255, 255, 255);
  ---color-second: var(--color-second, 0, 0, 0);
  ---color-third: var(--color-third, 88, 97, 101);

  --nav-gap: calc( 0.32 * var(---rem) );
  --nav-link-spacing: calc( var(--nav-gap) / 2 );
  --nav-link-spacing-: calc( var(--nav-link-spacing) * -1 );
  align-items: center;
  background: rgb( var(---color-first) );
  container: nav-first / inline-size;
  display: flex;
  width: 100%;
}

.nav-first .nav-list,
.nav-first-modal .nav-list {
  align-items: center;
  display: inline-flex;
  flex-flow: row wrap;
  gap: var(--nav-gap);
  position: relative;
}

.nav-first .nav-item {
  display: block;
}

.nav-first .nav-link,
.nav-first-modal .nav-link {
  color: rgb( var(---color-third) );
  display: inline-block;
  margin: var(--nav-link-spacing-);
  padding: var(--nav-link-spacing);
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
  transition: color 0.2s;
}

.nav-first .nav-link:hover,
.nav-first .nav-link:focus,
.nav-first-modal .nav-link:hover,
.nav-first-modal .nav-link:focus {
  color: rgb( var(---color-main) );
}

.nav-first .nav-list .nav-list {
  align-items: start;
  background: rgb( var(---color-first) );
  bottom: 0;
  display: flex;
  flex-flow: column nowrap;
  gap: 0;
  left: var(--nav-link-spacing-);
  opacity: 0;
  padding: var(--nav-link-spacing);
  pointer-events: none;
  position: absolute;
  right: var(--nav-link-spacing-);
  transform: translate( 0, calc( 100% + var(--nav-link-spacing) ) );
  transition: opacity 0.2s;
}

.nav-first .nav-item:focus-within .nav-list,
.nav-first .nav-item:hover .nav-list,
.nav-first .nav-link:hover + .nav-list,
.nav-first .nav-link:focus + .nav-list {
  opacity: 1; 
  pointer-events: auto;
}

.nav-first .nav-list .nav-list .nav-link {
  align-items: center;
  display: inline-flex;
  gap: 0 calc( var(--nav-gap) / 2 );
  padding: calc( var(--nav-link-spacing) / 2 );
  margin: 0 calc( var(--nav-link-spacing-) / 2 );
}

.nav-first .nav-list .nav-list .nav-link:before {
  background: rgb( var(---color-second) );
  border-radius: 100%;
  content: "";
  height: calc( 0.03 * var(---rem) );
  width: calc( 0.03 * var(---rem) );
}

.nav-first .nav-list .nav-list .nav-list {
  padding: 0 var(--nav-link-spacing);
  position: static;
  transform: unset;
}

.nav-first .nav-button {
  align-items: center;
  background: none;
  border: none;
  box-sizing: content-box;
  color: rgb( var(---color-third) );
  cursor: pointer;
  display: none;
  flex-flow: row nowrap;
  gap: calc( var(--nav-link-spacing) / 2 );
  justify-content: space-between;
  margin: var(--nav-link-spacing-) var(--nav-link-spacing-) var(--nav-link-spacing-) auto;
  padding: var(--nav-link-spacing);
  position: relative;
  text-transform: uppercase;
  transition: color 0.4s;
}

.nav-first .nav-button:before {
  background: rgb( var(---color-main) );
  content: "";
  display: block;
  height: calc( 0.02 * var(---rem) );
  position: absolute;
  right: var(--nav-link-spacing);
  top: 50%;
  transform: translate(0, -50%);
  width: calc( 0.20 * var(---rem) );
}

.nav-first .nav-button:after {
  border-bottom: calc( 0.02 * var(---rem) ) solid rgb( var(---color-main) );
  border-top: calc( 0.02 * var(---rem) ) solid rgb( var(---color-main) );
  display: block;
  content: "";
  height: calc( 0.10 * var(---rem) );
  width: calc( 0.20 * var(---rem) );
}

.nav-first .nav-checkbox,
.nav-first .nav-label  {
  display: none;
}

.module-nav.nav-first-modal {
  ---rem: var(--rem, 100px);

  ---color-main: var(--color-main, 255, 192, 0);
  ---color-first: var(--color-first, 255, 255, 255);
  ---color-second: var(--color-second, 0, 0, 0);
  ---color-third: var(--color-third, 88, 97, 101);

  --nav-gap: calc( 0.32 * var(---rem) );
  --nav-gap-: calc( var(--nav-gap) * -1 );
  --nav-link-spacing: calc( var(--nav-gap) / 2 );
  --nav-link-spacing-: calc( var(--nav-link-spacing) * -1 );
  --nav-modal-button: calc( 0.42 * var(---rem) );
  --nav-modal-button-: calc( var(--nav-modal-button) * -1 );
  container: nav-first / inline-size;
}

.nav-first-modal .nav-list {
  align-items: start;
  display: flex;
  flex: 1 100%;
  flex-flow: column;
  gap: 0;
}

.nav-first-modal .nav-item {
  align-items: center;
  display: flex;
  flex-flow: row wrap;
}

.nav-first-modal .nav-link {
  align-items: center;
  display: inline-flex;
  gap: 0 calc( var(--nav-gap) / 2 );
  padding: calc( var(--nav-link-spacing) / 2 );
  margin: 0;
}

.nav-first-modal .nav-checkbox,
.nav-first-modal .nav-label {
  border: none;
  cursor: pointer;
  height: var(--nav-modal-button);
  opacity: 0;
  order: -1;
  padding: 0;
  position: relative;
  width: var(--nav-modal-button);
  z-index: 1;
}

.nav-first-modal .nav-label {
  margin: 0 0 0 var(--nav-modal-button-);
  opacity: 1;
  z-index: 0;
}

.nav-first-modal .nav-label:before,
.nav-first-modal .nav-label:after {
  background: rgb( var(---color-main) );
  content: "";
  display: block;
  height: calc( 0.02 * var(---rem) );
  position: absolute;
  right: 50%;
  top: 50%;
  transform: translate(50%, -50%);
  width: calc( 0.16 * var(---rem) );
}

.nav-first-modal .nav-label:after {
  height: calc( 0.16 * var(---rem) );
  transform: translate(50%, -50%);
  width: calc( 0.02 * var(---rem) );
}

.nav-first-modal .nav-list .nav-list {
  display: none;
  padding: 0 0 0 var(--nav-modal-button);
}

.nav-first-modal .nav-checkbox:checked + .nav-label:after {
  display: none;
}

.nav-first-modal .nav-checkbox:checked + .nav-label + .nav-list {
  display: flex;
}

@container nav-first (max-width: 45em) { /*720px*/
  .nav-first .nav-list {
    display: none;
  }

  .nav-first .nav-button {
    display: flex;
  }

  .nav-first-modal .nav-list .nav-list {
    padding: 0;
  }
}
/* jsloader//css file: assets/css/module-modal.css */
.compsoul-modal-popup {
  ---rem: var(--rem, 100px);

  ---color-main: var(--color-main, 0, 0, 0);
  ---color-first: var(--color-first, 255, 255, 255);
  ---color-second: var(--color-second, 0, 0, 0);

  background: rgba( var(---color-second), 0.5 );
  bottom: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  right: 0;
  top: 0;
  transition: opacity 0.4s;
  will-change: opacity;
  z-index: 6;
}

.compsoul-modal-popup.modal-active {
  opacity: 1;
  pointer-events: auto;
}

.compsoul-modal-popup.modal-close {
  pointer-events: auto;
}

.modal-unset, .modal-unset:before, .modal-unset:after, .compsoul-modal-popup.modal-unset, .compsoul-modal-main.modal-unset {
  animation: unset !important;
  transition: none !important;
}

.compsoul-modal-popup:before {
  animation: compsoul-modal-loading 1s infinite;
  border-bottom: 0.5em solid rgba( var(---color-first), 0 );
  border-left: 0.5em solid rgba( var(---color-first), 0 );
  border-right: 0.5em solid rgba( var(---color-first), 0 );
  border-top: 0.5em solid rgba( var(---color-first), 0 );
  border-radius: 100%;
  box-sizing: content-box;
  content: "";
  font-size: calc( 0.04 * var(---rem) );
  height: 6em;
  left: 50%;
  opacity: 1;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  transition: opacity 0.4s;
  will-change: opacity;
  width: 6em;
}

.compsoul-modal-popup.modal-ready:before, .compsoul-modal-popup.modal-error:before {
  animation-play-state: paused;
  opacity: 0;
}

@keyframes compsoul-modal-loading {
  from {
    transform: translate3d(-50%, -50%, 0) rotate(0deg);
  }

to {
    transform: translate3d(-50%, -50%, 0) rotate(360deg);
  }
}

.compsoul-modal-popup:after {
  color: rgb( var(---color-first) );
  content: "\26A0";
  font-size: calc( 0.42 * var(---rem) );
  font-weight: 200;
  left: 50%;
  margin: calc( -0.06 * var(---rem) ) 0 0 0;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  transition: opacity 0.4s;
  will-change: opacity;
}

.compsoul-modal-popup.modal-error:after {
  opacity: 1;
}

.compsoul-modal-popup .compsoul-modal-main {
  left: 50%;
  max-height: calc(2 * 40vh);
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  width:calc( 8.00 * var(---rem) );
  z-index: 1;
}

.compsoul-modal-popup.modal-change .compsoul-modal-main {
  transition: transform 0.4s, opacity 0.4s;
}

.compsoul-modal-popup .compsoul-modal-main:before {
  background: rgb( var(---color-first) );
  bottom: calc( -0.32 * var(---rem) );
  box-shadow: 0 calc( 0.05 * var(---rem) ) calc( 0.26 * var(---rem) ) 0 rgba( var(---color-second), 0.22), 0 calc( 0.20 * var(---rem) ) calc( 0.28 * var(---rem) ) 0 rgba( var(---color-second), 0.30);
  content: "";
  left: calc( -0.32 * var(---rem) );
  position: absolute;
  right: calc( -0.32 * var(---rem) );
  top: calc( -0.32 * var(---rem) );
  z-index: -1;
}

.compsoul-modal-popup .compsoul-modal-content {
  background: rgb( var(---color-first) );
  line-height: 1.2;
  overflow-y: auto;
  max-height: calc(2 * 40vh);
  padding: 0 calc( 0.32 * var(---rem) ) 0 0;
  position: relative;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.compsoul-modal-popup .compsoul-modal-content:after {
  content: "";
  display: table;
  clear: both;
}

.compsoul-modal-popup .compsoul-modal-footer {
  bottom: calc( 0.10 * var(---rem) );
  margin-top: 2em;
  position: sticky;
  text-align: right;
}

.compsoul-modal-popup .compsoul-modal-close {
  right: 8em;
  position: absolute;
  top: 8em;
  z-index: 2;
}

.compsoul-modal-popup .compsoul-modal-next {
  right: 8em;
  position: absolute;
  top: 50%;
  transform: translate3d(0, -50%, 0);
  z-index: 2;
}

.compsoul-modal-popup .compsoul-modal-prev {
  left: 8em;
  position: absolute;
  top: 50%;
  transform: translate3d(0, -50%, 0);
  z-index: 2;
}

.compsoul-modal-popup .compsoul-modal-close,
.compsoul-modal-popup .compsoul-modal-next,
.compsoul-modal-popup .compsoul-modal-prev {
  background: rgb( var(---color-second) );
  border: none;
  cursor: default;
  font-size: calc( 0.026 * var(---rem) );
  height: 16em;
  opacity: 0;
  outline: 1px solid rgba( var(---color-main), 0 );
  padding: 0;
  text-align: center;
  transition: opacity 0.4s, outline 0.4s;
  width: 16em;
}

.compsoul-modal-popup .compsoul-modal-close:focus,
.compsoul-modal-popup .compsoul-modal-close:focus-within, 
.compsoul-modal-popup .compsoul-modal-next:focus, 
.compsoul-modal-popup .compsoul-modal-next:focus-within,
.compsoul-modal-popup .compsoul-modal-prev:focus,
.compsoul-modal-popup .compsoul-modal-prev:focus-within {
  outline: 1px solid rgba( var(---color-main), 1 );
}

.compsoul-modal-popup .compsoul-modal-close,
.compsoul-modal-popup .compsoul-modal-next.modal-active,
.compsoul-modal-popup .compsoul-modal-prev.modal-active {
  cursor: pointer;
  opacity: 1;
}

.compsoul-modal-popup .compsoul-modal-close:before,
.compsoul-modal-popup .compsoul-modal-close:after,
.compsoul-modal-popup .compsoul-modal-next:before,
.compsoul-modal-popup .compsoul-modal-prev:before {
  border-top: 1em solid rgb( var(---color-first) );
  border-right: 1em solid rgb( var(---color-first) );
  box-sizing: content-box;
  content: "";
  cursor: pointer;
  display: inline-block;
  height: 4em;
  padding: 0 0 1em 1em;
  transform: rotate(45deg) translate3d(-25%, 25%, 0);
  transition: opacity 0.4s, border 0.4s;
  width: 4em;
}

.compsoul-modal-popup .compsoul-modal-close:before,
.compsoul-modal-popup .compsoul-modal-close:after {
  height: 3em;
  width: 3em;
}

.compsoul-modal-popup .compsoul-modal-close:hover:before,
.compsoul-modal-popup .compsoul-modal-close:hover:after,
.compsoul-modal-popup .compsoul-modal-next:hover:before,
.compsoul-modal-popup .compsoul-modal-prev:hover:before {
  border-top: 1em solid rgb( var(---color-main) );
  border-right: 1em solid rgb( var(---color-main) );
}

.compsoul-modal-popup .compsoul-modal-close:after,
.compsoul-modal-popup .compsoul-modal-prev:before {
  transform: rotate(-135deg) translate3d(-25%, 25%, 0);
}

.compsoul-modal-popup .compsoul-modal-close:before {
  transform: rotate(45deg) translate3d(-7%, 7%, 0);
}

.compsoul-modal-popup .compsoul-modal-close:after {
  transform: rotate(-135deg) translate3d(-7%, 7%, 0);
}

.compsoul-modal-popup .compsoul-modal-timer {
  height: calc( 0.03 * var(---rem) );
  left: 0;
  position: absolute;
  top: 0;
  z-index: 5;
  width: 100%;
}

.compsoul-modal-popup .compsoul-modal-timer:before {
  animation: compsoul-slide-timeline 8s linear forwards;
  animation-play-state: paused;
  background: rgb( var(---color-main) );
  content: "";
  display: block;
  height: 100%;
  transform: translate3d(-100%, 0, 0);
  width: 100%;
}

.compsoul-modal-popup.modal-ready .compsoul-modal-timer:before {
  animation-play-state: running;
}

.compsoul-modal-popup:hover .compsoul-modal-timer:before {
  animation-play-state: paused;
}

@keyframes compsoul-slide-timeline {
  from {
    transform: translate3d(-100%, 0, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

@media only screen and (max-width: 1060px) {
  .compsoul-modal-popup .compsoul-modal-main {
    width: calc(100% - ( 0.94 * var(---rem) ));
  }

  .compsoul-modal-popup .compsoul-modal-main:before {
    bottom: calc( -0.24 * var(---rem) );
    left: calc( -0.24 * var(---rem) );
    right: calc( -0.24 * var(---rem) );
    top: calc( -0.24 * var(---rem) );
  }

  .compsoul-modal-popup.compsoul-modal-close,
  .compsoul-modal-popup .compsoul-modal-next,
  .compsoul-modal-popup .compsoul-modal-prev {
    font-size: calc( 0.02 * var(---rem) );
  }

  .compsoul-modal-popup .compsoul-modal-close {
    right: 0;
    top: 0;
  }

  .compsoul-modal-popup .compsoul-modal-next {
    right: 0;
  }

  .compsoul-modal-popup .compsoul-modal-prev {
    left: 0;
  }

}

.compsoul-modal-box {
  ---rem: var(--rem, 100px);

  ---color-main: var(--color-main, 0, 0, 0);
  ---color-first: var(--color-first, 255, 255, 255);
  ---color-second: var(--color-second, 0, 0, 0);

  background: rgb( var(---color-first) );
  bottom: calc( 0.32 * var(---rem) );
  box-shadow: 0 0 calc( 0.32 * var(---rem) ) 0 rgba( var(---color-second) , 0.2);
  left: 50%;
  max-height: calc(100% - ( 0.64 * var(---rem) ));
  max-width: calc(100% - ( 0.32 * var(---rem) ));
  opacity: 0;
  pointer-events: none;
  position: fixed;
  transform: translate(-50%, 0);
  transition: opacity 0.4s;
  width: calc( 5.00 * var(---rem) );
  will-change: opacity;
  z-index: 6;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.compsoul-modal-box.modal-active {
  opacity: 1;
  pointer-events: auto;
}

.compsoul-modal-box.modal-close {
  pointer-events: auto;
}

.compsoul-modal-box.modal-unset {
  animation: unset !important;
  transition: none !important;
}

.compsoul-modal-box .compsoul-modal-main {
  display: flex;
  flex-direction: column;
  overflow: auto;
  flex: 1;
}

.compsoul-modal-box .compsoul-modal-content {
  height: 100%;
  overflow-y: auto;
  padding: calc( 0.32 * var(---rem) );
}

.compsoul-modal-box .compsoul-modal-close {
  --compsoul-modal-close-translate: -4%;
  --compsoul-modal-close-translate-: calc( var(--compsoul-modal-close-translate) * -1 );
  background: rgb( var(---color-second) );
  border: none;
  cursor: pointer;
  font-size: calc( 0.026 * var(---rem) );
  height: 16em;
  outline: 1px solid rgba( var(---color-main), 0 );
  padding: 0;
  right: 0;
  position: absolute;
  top: 0;
  text-align: center;
  transform: translate3d(25%, -25%, 0);
  transition: outline 0.4s;
  width: 16em;
  z-index: 3;
}

.compsoul-modal-box .compsoul-modal-close:focus,
.compsoul-modal-box .compsoul-modal-close:focus-within {
  outline: 1px solid rgba( var(---color-main), 1 );
}

.compsoul-modal-box .compsoul-modal-close:before,
.compsoul-modal-box .compsoul-modal-close:after {
  border-top: 2em solid rgb( var(---color-first) );
  border-right: 2em solid rgb( var(---color-first) );
  box-sizing: content-box;
  content: "";
  cursor: pointer;
  display: inline-block;
  height: 1em;
  padding: 0 0 2em 2em;
  transform: rotate(45deg) translate3d(-25%, 25%, 0);
  transition: opacity 0.4s, border 0.4s;
  width: 1em;
}

.compsoul-modal-box .compsoul-modal-close:hover:before,
.compsoul-modal-box .compsoul-modal-close:hover:after {
  border-top-color: rgb( var(---color-main) );
  border-right-color: rgb( var(---color-main) );
}

.compsoul-modal-box .compsoul-modal-close:after {
  transform: rotate(-135deg) translate3d(-25%, 25%, 0);
}

.compsoul-modal-box .compsoul-modal-close:before {
  transform: rotate(45deg) translate3d(var(--compsoul-modal-close-translate-), var(--compsoul-modal-close-translate), 0);
}

.compsoul-modal-box .compsoul-modal-close:after {
  transform: rotate(-135deg) translate3d(var(--compsoul-modal-close-translate-), var(--compsoul-modal-close-translate), 0);
}

.compsoul-modal-box .compsoul-modal-timer {
  height: calc( 0.03 * var(---rem) );
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  z-index: 2;
  width: 100%;
}

.compsoul-modal-box .compsoul-modal-timer:before {
  animation: compsoul-slide-box-timeline 8s linear forwards;
  animation-play-state: paused;
  background: rgb( var(---color-main) );
  content: "";
  display: block;
  height: 100%;
  transform: translate3d(-100%, 0, 0);
  width: 100%;
}

.compsoul-modal-box.modal-ready .compsoul-modal-timer:before {
  animation-play-state: running;
}

.compsoul-modal-box:hover .compsoul-modal-timer:before {
  animation-play-state: paused;
}

@keyframes compsoul-slide-box-timeline {
  from {
    transform: translate3d(-100%, 0, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

@media only screen and (max-width: 640px) {
  .compsoul-modal-popup .compsoul-modal-main {
    width: calc(100% - ( 0.64 * var(---rem) ));
  }

  .compsoul-modal-popup .compsoul-modal-main:before {
    bottom: calc( -0.12 * var(---rem) );
    left: calc( -0.12 * var(---rem) );
    right: calc( -0.12 * var(---rem) );
    top: calc( -0.12 * var(---rem) );
  }

  .compsoul-modal-popup .compsoul-modal-footer {
    background: rgb( var(---color-first) );
    bottom: 0;
    margin-top: 2em;
    padding-top: calc( 0.12 * var(---rem) );
    text-align: center;
  }
}
/* jsloader//css file: assets/css/module-gallery-first.css */
.module-gallery.gallery-first {
  container: gallery-first / inline-size;
  position: relative;
}

.module-gallery.gallery-first:last-child {
  margin-bottom: 0;
}

.gallery-first .gallery-container {
  ---rem: var(--rem, 100px);
  ---color-main: var(--color-main, 0, 0, 0);
  ---color-first: var(--color-first, 255, 255, 255);

  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.gallery-first .gallery-item {
  overflow: hidden;
  position: relative;
}

.gallery-first .gallery-link,
.gallery-first .gallery-figure {
  display: block;
  height: 100%;
  width: 100%;
}

.gallery-first .gallery-link {
  color: rgb( var(---color-first) );
  font-size: 4vw;
  position: relative;
}

.gallery-first .gallery-link:before {
  align-items: center;
  background: rgba( var(---color-main), 0.5 );
  bottom: 0;
  content: "\e986";
  display: flex;
  justify-content: center;
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: 0.2s opacity;
}

.gallery-first .gallery-link:hover:before,
.gallery-first .gallery-link:focus:before {
  opacity: 1;
}

.gallery-first .gallery-figure {
  pointer-events: none;
}

.gallery-first .gallery-img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

@container gallery-first (max-width: 60em) { /*960px*/
  .gallery-first .gallery-container {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

@container gallery-first (max-width: 40em) { /*640px*/
  .gallery-first .gallery-container {
    grid-template-columns: 1fr 1fr;
  }
}

@container gallery-first (max-width: 20em) { /*320px*/
  .gallery-first .gallery-container {
    grid-template-columns: 1fr;
  }
}
/* jsloader//css file: assets/css/module-gallery.css */
.compsoul-gallery-div, .compsoul-gallery-small, .compsoul-gallery-small,
.compsoul-gallery-big, .compsoul-gallery-hash, .compsoul-gallery-hash-test,
.compsoul-gallery-comment, .compsoul-gallery-comment-inside, .compsoul-gallery-comment-mix, .compsoul-gallery {
  display: inline-block;
  position: relative;
}

.compsoul-gallery-div:after, .compsoul-gallery-small:after, .compsoul-gallery-small:after,
.compsoul-gallery-big:after, .compsoul-gallery-hash:after, .compsoul-gallery-hash-test:after,
.compsoul-gallery-comment:after, .compsoul-gallery-comment-inside:after, .compsoul-gallery-comment-mix:after, .compsoul-gallery:after {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.compsoul-gallery {
  display: inline-block;
  max-width: 80%;
}

.compsoul-gallery-container {
  ---rem: var(--rem, 100px);

  ---color-main: var(--color-main, 255, 192, 0);
  ---color-first: var(--color-first, 255, 255, 255);
  ---color-second: var(--color-second, 0, 0, 0);

  background: rgba( var(---color-second), 0.9 );
  bottom: 0;
  font-size: calc( 0.08 * var(---rem) );
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  will-change: auto;
  z-index: 10;
}

.compsoul-gallery-container .compsoul-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  position: absolute;
  padding: 0;
  width: 1px;
}

.compsoul-gallery-container.compsoul-active {
  animation: gallery-container 0.2s linear;
  will-change: opacity;
}

.compsoul-gallery-container.compsoul-inactive {
  animation: gallery-container-close 0.2s linear forwards;
  will-change: opacity;
}

@keyframes gallery-container {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes gallery-container-close {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.compsoul-gallery-container button {
  background: none;
  border: none;
  cursor: pointer;
  font-size: inherit;
  line-height: 0;
  margin: 0;
  padding: 0;
}

.compsoul-gallery-content {
  bottom: 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: 0;
}

.thumbnails-active .compsoul-gallery-content {
  bottom: calc( 1.20 * var(---rem) );
}

.thumbnails-inactive .compsoul-gallery-content {
  bottom: 0;
}

.compsoul-gallery-content .compsoul-gallery-item {
  height: 80vh;
  height: calc( 100vh - ( 1.72 * var(---rem) ) );
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  user-select: none;
  visibility: hidden;
  width: 80vw;
  width: calc( 100vw - ( 2.04 * var(---rem) ) );
  will-change: auto;
  z-index: 0;
}

.compsoul-gallery-item.compsoul-active, .compsoul-gallery-item.compsoul-prev, .compsoul-gallery-item.compsoul-next {
  opacity: 1;
  transform: translate(-150vw, -50%);
  transition: opacity 0.3s ease-out, transform 0.3s ease-out;
  visibility: visible;
  will-change: opacity, transform;
  z-index: 1;
}

.compsoul-gallery-item.compsoul-fade {
  opacity: 0;
  transition: opacity 0.2s ease-out;
  visibility: visible;
  will-change: opacity;
}

.compsoul-direction-prev .compsoul-gallery-item.compsoul-prev,
.compsoul-direction-next .compsoul-gallery-item.compsoul-next {
  transition: unset;
  will-change: auto;
}

.compsoul-resize .compsoul-gallery-item.compsoul-prev {
  animation: compsoul-resize-prev 0.1s linear forwards;
}

@keyframes compsoul-resize-prev {
  from {
    transform: translate(-150vw, -50%);
  }

  to {
    transform: translate(-150vw, -50%);
  }

}

.compsoul-resize .compsoul-gallery-item.compsoul-next {
  animation: compsoul-resize-next 0.1s linear forwards;
}

@keyframes compsoul-resize-next {
  from {
    transform: translate(50vw, -50%);
  }

  to {
    transform: translate(50vw, -50%);
  }

}

.compsoul-gallery-item.compsoul-next {
  transform: translate(50vw, -50%);
}

.compsoul-gallery-item.compsoul-active {
  transform: translate(-50%, -50%);
}

.compsoul-disorderly .compsoul-gallery-item,
.compsoul-disorderly .compsoul-gallery-item.compsoul-prev,
.compsoul-disorderly .compsoul-gallery-item.compsoul-next {
  opacity: 0;
  transition: unset;
  visibility: hidden;
  will-change: auto;
  z-index: 2;
}

.compsoul-disorderly .compsoul-gallery-item.compsoul-past {
  animation: disorderly-past 0.2s linear;
  will-change: opacity, transform, visibility;
  z-index: 3;
}

@keyframes disorderly-past {
  0% {
    opacity: 1;
    transform: translate(-50%, -50%);
    visibility: visible;
  }

  99% {
    opacity: 0;
    transform: translate(-50%, -50%);
    visibility: visible;
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%);
    visibility: hidden;
  }

}

.compsoul-disorderly .compsoul-gallery-item.compsoul-active {
  animation: disorderly-active 0.2s linear;
  opacity: 1;
  visibility: visible;
  will-change: opacity, transform, visibility;
  z-index: 4;
}

@keyframes disorderly-active {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%);
    visibility: hidden;
  }

  1% {
    opacity: 0;
    transform: translate(-50%, -50%);
    visibility: visible;
  }

  100% {
    opacity: 1;
    transform: translate(-50%, -50%);
    visibility: visible;
  }

}

.compsoul-gallery-item .compsoul-gallery-image {
  display: inline-block;
  left: 50%;
  opacity: 0.001;
  overflow: hidden;
  position: relative;
  top: 50%;
  transform: translate(-50%, -50%);
  transform-origin: top left;
  will-change: auto;
  width: auto;
  z-index: 1;
}

.compsoul-gallery-item.compsoul-active .compsoul-gallery-image {
  transition: opacity 0.2s 0.2s linear, transform 0.2s linear;
  will-change: opacity;
}

.compsoul-gallery-item .compsoul-gallery-image:before {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.thumbnails-show .compsoul-gallery-image {
  transform: scale(0.8) translate(-50%, -50%);
}

.thumbnails-show .compsoul-gallery-item.compsoul-active .compsoul-gallery-image {
  will-change: transform;
}

.compsoul-gallery-item.compsoul-loaded .compsoul-gallery-image {
  opacity: 1;
}

.compsoul-gallery-item .compsoul-gallery-image img {
  display: block;
  max-height: 80vh;
  max-height: calc( 100vh - ( 1.72 * var(---rem) ) );
  max-width: 80vw;
  max-width: calc( 100vw - ( 2.04 * var(---rem) ) );
}

.compsoul-gallery-item .compsoul-gallery-comment {
  background: rgba(0, 0, 0, 0.6);
  bottom: 0;
  color: rgb( var(---color-first) );
  font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
  font-size: 2em;
  left: 0;
  padding: 2em;
  position: absolute;
  right: 0;
  transform: translate(0, 100%);
  transition: transform 0.2s 0.4s linear;
  z-index: 1;
}

.compsoul-disorderly .compsoul-gallery-item .compsoul-gallery-comment {
  transform: translate(0, 0);
  transition: unset;
}

.compsoul-gallery-item.compsoul-active.compsoul-loaded .compsoul-gallery-comment {
  transform: translate(0, 0);
}

.compsoul-gallery-item .compsoul-gallery-comment.compsoul-inactive {
  display: none;
}

.compsoul-loader {
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 0;
}

.compsoul-loader:before, .compsoul-loader:after {
  animation: compsoul-loading 1s linear infinite;
  animation-play-state: paused;
  border: 0.5em solid rgb( var(---color-first) );
  border-radius: 100%;
  content: "";
  display: block;
  filter: blur(1px);
  height: 8em;
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 8em;
}

.compsoul-gallery-item.compsoul-active .compsoul-loader,
.compsoul-gallery-item.compsoul-prev .compsoul-loader,
.compsoul-gallery-item.compsoul-next .compsoul-loader {
  transition: opacity 0.2s linear;
}

.compsoul-gallery-item.compsoul-active .compsoul-loader {
  opacity: 1;
}

.compsoul-gallery-item.compsoul-loaded .compsoul-loader {
  opacity: 0;
}

.compsoul-gallery-item.compsoul-active.compsoul-loading .compsoul-loader:before,
.compsoul-gallery-item.compsoul-active.compsoul-loading .compsoul-loader:after {
  animation-play-state: running;
}

.compsoul-loader:after {
  animation-delay: 0.5s;
}

@keyframes compsoul-loading {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0);
  }

  50% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(0.5);
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1);
  }

}

.compsoul-gallery-full-screen {
  background: #000;
  bottom: 0;
  font-size: 0;
  position: absolute;
  left: 0;
  opacity: 0;
  overflow: auto;
  right: 0;
  top: 0;
  transition: opacity 0.2s linear;
  z-index: -1;
}

.compsoul-gallery-full-screen.compsoul-active {
  z-index: 1;
}

.compsoul-zoom .compsoul-gallery-full-screen {
  opacity: 1;
}

.compsoul-zoom-out .compsoul-gallery-full-screen {
  opacity: 0;
  transition-delay: 0.2s;
}

.compsoul-gallery-full-screen img {
  display: block;
  margin: 0 auto;
  opacity: 0;
  transition: opacity 0.2s 0.2s linear;
}

.compsoul-zoom .compsoul-gallery-full-screen img {
  opacity: 1;
}

.compsoul-zoom-out .compsoul-gallery-full-screen img {
  opacity: 0;
  transition-delay: unset;
}

.compsoul-logo, .compsoul-gallery-close, .compsoul-gallery-next, .compsoul-gallery-prev, .thumbnails-toggle, .compsoul-gallery-progress, .compsoul-gallery-zoom {
  cursor: pointer;
  height: 7em;
  outline: 1px solid rgba(242, 242, 242, 0);
  overflow: hidden;
  position: absolute;
  right: 4em;
  top: 2em;
  transform: translate(0);
  transition: outline 0.2s linear;
  width: 7em;
}

.compsoul-logo {
  box-sizing: border-box;
  left: 4em;
  right: auto;
  transition: unset;
  width: 8em;
}

.compsoul-logo svg {
  fill: rgb( var(---color-first) );
  top: 50%;
  position: relative;
  transform: translate(0, -50%);
  transition: fill 0.2s linear;
}

.compsoul-logo:focus-within {
  outline: none;
}

.compsoul-logo:hover svg, .compsoul-logo:focus-within svg {
  fill: rgb( var(---color-main) );
}

.compsoul-logo:focus-within, .compsoul-gallery-close:focus-within, .compsoul-gallery-next:focus-within, .compsoul-gallery-prev:focus-within, .thumbnails-toggle:focus-within, .compsoul-gallery-progress:focus-within, .compsoul-gallery-zoom:focus-within {
  outline-color: rgba(242, 242, 242, 0.8);
}

.compsoul-gallery-close:before, .compsoul-gallery-next:before, .compsoul-gallery-prev:before, .thumbnails-toggle:before, .compsoul-gallery-progress:before, .compsoul-gallery-zoom:before, .compsoul-gallery-close:after, .compsoul-gallery-next:after, .compsoul-gallery-prev:after, .thumbnails-toggle:after, .compsoul-gallery-progress:after, .compsoul-gallery-zoom:after {
  background: rgb( var(---color-second) );
  bottom: 0;
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: -2;
}

.compsoul-gallery-close:after, .compsoul-gallery-next:after, .compsoul-gallery-prev:after, .thumbnails-toggle:after, .compsoul-gallery-progress:after, .compsoul-gallery-zoom:after {
  background: none;
  z-index: 1;
}

.compsoul-gallery-close button, .compsoul-gallery-next button, .compsoul-gallery-prev button, .thumbnails-toggle button, .compsoul-gallery-progress button, .compsoul-gallery-zoom button {
  outline: 0;
  position: relative;
  z-index: -1;
}

.compsoul-gallery-close button:before, .compsoul-gallery-close button:after, .compsoul-gallery-next button:before, .compsoul-gallery-prev button:before {
  border-top: 0.25em solid rgb( var(---color-first) );
  border-right: 0.25em solid rgb( var(---color-first) );
  box-sizing: content-box;
  content: "";
  cursor: pointer;
  display: inline-block;
  height: 1em;
  padding: 0 0 0.25em 0.25em;
  width: 1em;
}

.compsoul-gallery-close {
  z-index: 2;
}

.compsoul-gallery-close button {
  cursor: pointer;
  height: 6em;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  width: 6em;
}

.compsoul-gallery-close button:before, .compsoul-gallery-close button:after {
  bottom: 1.625em;
  left: 1.625em;
  position: absolute;
  transform: rotate(0deg);
}

.compsoul-gallery-close button:before {
  border: none;
  border-bottom: 0.25em solid rgb( var(---color-first) );
  border-left: 0.25em solid rgb( var(---color-first) );
  left: auto;
  padding: 0.25em 0.25em 0 0;
  right: 1.625em;
  top: 1.625em;
}

.compsoul-gallery-close button:after {
  border-top: 0.25em solid rgb( var(---color-first) );
  border-right: 0.25em solid rgb( var(---color-first) );
  padding: 0 0 0.25em 0.25em;
}

.compsoul-gallery-zoom {
  right: 28em;
}

.compsoul-gallery-zoom button {
  cursor: pointer;
  height: 100%;
  position: relative;
  width: 100%;
}

.compsoul-gallery-zoom button:before {
  border: 0.25em solid rgb( var(---color-first) );
  border-radius: 100%;
  content: "";
  height: 2em;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 2em;
}

.compsoul-gallery-zoom button:after {
  background: rgb( var(---color-first) );
  border-radius: 0 0 0.25em 0.25em;
  content: "";
  height: 1em;
  left: 50%;
  margin: 1em 0 0 -1.5em;
  position: absolute;
  top: 50%;
  transform: rotate(45deg) translate(-50%, -50%);
  width: 0.25em;
}

.compsoul-gallery-progress {
  right: 20em;
}

.compsoul-gallery-progress button {
  cursor: pointer;
  height: 100%;
  position: relative;
  width: 100%;
}

.compsoul-gallery-progress button:before {
  border-bottom: 1em solid transparent;
  border-left: 1.2em solid rgb( var(---color-first) );
  border-top: 1em solid transparent;
  border-radius: 0.2em;
  content: "";
  height: 0;
  left: 50%;
  opacity: 1;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: opacity 0.2s 0.2s linear;
  width: 0;
}

.compsoul-gallery-progress.compsoul-active button:before {
  opacity: 0;
  transition-delay: unset;
}

.compsoul-gallery-progress button:after {
  animation: gallery-progress 6s linear forwards;
  animation-play-state: paused;
  color: rgb( var(---color-first) );
  content: "10";
  font-size: 1.6em;
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  transition: opacity 0.2s linear;
  transform: translate(-50%, -50%);
}

.compsoul-gallery-progress.compsoul-active button:after {
  opacity: 1;
  transition-delay: 0.2s;
}

.compsoul-gallery-progress.compsoul-play button:after {
  animation-delay: 0.4s;
  animation-play-state: running;
}

.compsoul-gallery-progress.compsoul-unset button:after {
  animation: unset;
}

@keyframes gallery-progress {
  0% {
    content: "10";
  }

  9% {
    content: "9";
  }

  18% {
    content: "8";
  }

  27% {
    content: "7";
  }

  36% {
    content: "6";
  }

  45% {
    content: "5";
  }

  54% {
    content: "4";
  }

  63% {
    content: "3";
  }

  72% {
    content: "2";
  }

  81% {
    content: "1";
  }

  90% {
    content: "0";
  }

  100% {
    content: "0";
  }

}

.compsoul-gallery-next, .compsoul-gallery-prev {
  opacity: 0;
  right: 4em;
  top: 50%;
  transform: translate(0, -50%);
  transition: opacity 0.2s linear, outline 0.2s linear;
}

.compsoul-gallery-next.compsoul-active, .compsoul-gallery-prev.compsoul-active {
  opacity: 1;
}

.compsoul-gallery-prev {
  left: 4em;
}

.compsoul-gallery-next button, .compsoul-gallery-prev button {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-1em, -50%);
}

.compsoul-gallery-prev button {
  transform: translate(-0.5em, -50%);
}

.compsoul-gallery-next button:before, .compsoul-gallery-prev button:before {
  transform: rotate(-135deg);
}

.compsoul-gallery-next button:before {
  transform: rotate(45deg);
}

.thumbnails-toggle {
  right: 12em;
}

.thumbnails-toggle button {
  cursor: pointer;
  height: 100%;
  position: relative;
  width: 100%;
}

.thumbnails-toggle button:before {
  background-color: transparent;
  background-image: linear-gradient(90deg, rgb( var(---color-first) ) 0.5em, transparent 0.25em),
                    linear-gradient(90deg, rgb( var(---color-first) ) 0.5em, transparent 0.25em),
                    linear-gradient(90deg, rgb( var(---color-first) ) 0.5em, transparent 0.25em);
  background-position: 0 0, 0 0.75em, 0 1.5em;
  background-repeat: repeat-x;
  background-size: 0.75em 0.5em, 0.75em 0.5em, 0.75em 0.5em;
  content: "";
  cursor: pointer;
  height: 2em;
  left: 50%;
  opacity: 0.6;
  position: absolute;
  top: 50%;
  transition: opacity 0.4s linear;
  transform: translate(-50%, -50%);
  width: 2em;
}

.thumbnails-toggle:active button:before, .thumbnails-toggle button:active:before {
  background-image: linear-gradient(90deg, rgb( var(---color-first) ) 0.5em, transparent 0.125em),
                    linear-gradient(90deg, rgb( var(---color-first) ) 0.5em, transparent 0.125em),
                    linear-gradient(90deg, rgb( var(---color-first) ) 0.5em, transparent 0.125em);
  background-position: 0 0, 0 0.625em, 0 1.25em;
  background-size: 0.625em 0.5em, 0.625em 0.5em, 0.625em 0.5em;
  height: 1.75em;
  width: 1.75em;
}

.thumbnails-show .thumbnails-toggle button:before {
  opacity: 1;
}

.thumbnails-container {
  background: rgb( var(---color-second) );
  bottom: 0;
  font-size: 0;
  height: calc( 0.72 * var(---rem) );
  left: 0;
  letter-spacing: 0;
  position: fixed;
  right: 0;
  transition: transform 0.2s linear;
  transform: translateY(100%);
}

.thumbnails-show .thumbnails-container {
  transform: translateY(0);
}

.thumbnails-content {
  bottom: 0;
  left: 0;
  position: absolute;
  top: 0;
  white-space: nowrap;
}

.thumbnails-show .thumbnails-content  {
  transition: transform 0.2s linear;
}

.thumbnails-content.compsoul-drag {
  transition: unset;
}

.thumbnails-content.compsoul-drag:before {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
}

.thumbnails-content .thumbnails-image {
  background: none;
  border: none;
  cursor: pointer;
  display: inline-block;
  font-size: 0;
  height: 100%;
  position: relative;
  user-select: none;
}

.thumbnails-content .thumbnails-image:before, .thumbnails-content .thumbnails-image:after {
  bottom: 0;
  content: "";
  left: 0;
  opacity: 0;
  outline: 1px solid rgb( var(---color-first) );
  outline-offset: -1px;
  position: absolute;
  right: 0;
  top: 0;
  transition: opacity 0.2s linear;
  z-index: 1;
}

.thumbnails-content .thumbnails-image:after {
  outline-color: rgb( var(---color-main) );
}

.thumbnails-content .thumbnails-image button:focus {
  outline: none;
}

.thumbnails-content .thumbnails-image:focus-within:before {
  opacity: 1;
}

.thumbnails-content .thumbnails-image.compsoul-active:after {
  opacity: 1;
}

.thumbnails-content .thumbnails-image img {
  display: block;
  max-height: calc( 0.72 * var(---rem) );
}

.gallery {
  display: flex;
  flex-flow: row wrap;
  gap: calc( 0.10 * var(---rem) );
}

.gallery-row {
  display: flex;
  flex: 1 100%;
  flex-flow: row nowrap;
  gap: calc( 0.10 * var(---rem) );
}

.gallery-thumbnail * {
  pointer-events: none;
}

.gallery-thumbnail img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

@media (max-width: 1000px) {
  .compsoul-gallery-container {
    font-size: calc( 0.054 * var(---rem) );
  }

  .compsoul-gallery-content .compsoul-gallery-item {
    height: 100vh;
    height: calc(100vh - ( 0.16 * var(---rem) ) );
    width: 100vw;
    width: calc(100vw - ( 0.16 * var(---rem) ) );
  }

  .thumbnails-show .compsoul-gallery-image {
    transform: scale(0.68) translate(-50%, -50%);
  }

  .compsoul-gallery-item .compsoul-gallery-image img {
    max-height: 100vh;
    max-height: calc(100vh - ( 0.16 * var(---rem) ) );
    max-width: 100vw;
    max-width: calc(100vw - ( 0.16 * var(---rem) ) );
  }

}

@media (max-width: 380px) {
  .compsoul-gallery-content .compsoul-gallery-item {
    height: 100vh;
    width: 100vw;
  }

  .thumbnails-show .compsoul-gallery-image {
    transform: scale(0.75) translate(-50%, -50%);
  }

  .compsoul-gallery-item .compsoul-gallery-image img {
    max-height: 100vh;
    max-width: 100vw;
  }

}
/* jsloader//css file: assets/css/layout-first-css.css */
.layout.layout-first {
  container: layout-first / inline-size;
  margin-bottom: var(--grid);
  margin-top: var(--grid);
}

.layout-first .layout-container {
  ---rem: var(--rem, 100px);
  ---color-main: var(--color-main, 255, 192, 0);

  display: grid;
  gap: 0 calc( 0.32 * var(---rem) );
  grid-template-columns: auto auto auto;
}

.layout-first .layout-content {
  min-width: 33.333%;
}

.layout-first .layout-heading {
  grid-column: 1 / -1;
}

.layout-first .layout-headline {
  border-left: calc( 0.06 * var(---rem) ) solid rgb( var(---color-main) );
  font-size: calc( 0.24 * var(---rem) );
  font-weight: 400;
  line-height: 1.5em;
  margin-bottom: 1em;
  padding-left: 1em;
  grid-column: 1 / -1;
}

.layout-first img {
  height: auto;
  max-width: 100%;
}

@container layout-first (max-width: 60em) { /*960px*/
  .layout-first .layout-container {
    gap: 0;
    grid-template-columns: 1fr;
  }

  .layout-first .layout-content {
    margin-bottom: 2em;
  }
}
/* jsloader//css file: assets/css/module-footer-first.css */
.module-footer.footer-first {
  container: footer-first / inline-size;
  position: sticky;
  top: 100vh;
}

.footer-first .footer-container {
  ---rem: var(--rem, 100px);

  ---color-first: var(--color-first, 255, 255, 255);
  ---color-second: var(--color-second, 0, 0, 0);
  ---color-third: var(--color-third, 88, 97, 101);

  align-items: center;
  background: rgb( var(---color-second) );
  color: rgb( var(---color-third) );
  display: flex;
  justify-content: center;
  padding: calc( 0.32 * var(---rem) );
  position: sticky;
  top: 100vh;
  text-align: center;
}

.footer-first .content {
  color: rgb( var(---color-first) );  
}
/* jsloader//css file: assets/css/module-slider-first.css */
.module-slider.slider-first {
  container: slider-first / inline-size;
  position: relative;
  z-index: 0;
}

.slider-first .slider-container {
  ---rem: var(--rem, 100px);

  ---color-main: var(--color-main, 255, 192, 0);
  ---color-first: var(--color-first, 255, 255, 255);
  ---color-second: var(--color-second, 0, 0, 0);
  ---color-third: var(--color-third, 88, 97, 101);

  ---grid: var(--grid, calc( 0.64 * var(---rem) ) );
  ---grid-: calc( var(--grid) * -1 );
}

.slider-first .slider-container:before {
  bottom: 0;
  border-left: calc( 0.35 * var(---rem) ) solid transparent;
  border-right: calc( 0.35 * var(---rem) ) solid transparent;
  border-bottom: calc( 0.35 * var(---rem) ) solid rgb( var(---color-first) );
  content: "";
  height: 0;
  left: 50%;
  position: absolute;
  transform: translate(-50%, 0);
  width: 0;
  z-index: 4;
}

.slider-first .slider-slide {
  align-items: center;
  display: flex;
  justify-content: center;
}

.slider-first .slider-content {
  align-items: center;
  display: flex;
  flex-flow: column;
  justify-content: center;
  padding: calc( 1.28 * var(---rem) ) var(--margins);
}

.slider-first .slider-heading {
  color: rgb( var(---color-first) );
  font-size: calc( 0.32 * var(---rem) );
  font-weight: 700;
  background: rgb( var(---color-main) );
  padding: 1em;
  text-align: center;
  text-transform: uppercase;
  text-wrap: balance;
  max-width: calc( 6.40 * var(---rem) );
}

.slider-first .slider-description {
  background: rgb( var(---color-second) );
  color: rgb( var(---color-first) );
  margin: calc( 0.06 * var(---rem) ) 0 0;
  max-width: calc( 6.40 * var(---rem) );
  padding: 2em 1em;
  text-align: center;
}

.slider-first .slider-more {
  margin: calc( 0.32 * var(---rem) ) 0 0;
}

.slider-first .slider-picture {
  bottom: calc( -0.10 * var(---rem) );
  left: calc( -0.10 * var(---rem) );
  position: absolute;
  right: calc( -0.10 * var(---rem) );
  top: calc( -0.10 * var(---rem) );
  z-index: -1;
}

.slider-first .slider-img {
  display: block;
  filter: blur(calc( 0.05 * var(---rem) ));
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.slider-first .slider-prev,
.slider-first .slider-next {
  align-items: center;
  background: rgb( var(---color-main) );
  border: 0;
  bottom: 0;
  cursor: pointer;
  display: none;
  font-size: var(---grid);
  left: 0;
  padding: 0;
  position: absolute;
  height: var(---grid);
  justify-content: center;
  width: var(---grid);
  z-index: 2;
}

.slider-first .slider-next {
  left: auto;
  right: 0;
}

.slider-first .slider-prev:before,
.slider-first .slider-next:before {
  border-top: 0.075em solid rgb( var(---color-first) );
  border-right: 0.075em solid rgb( var(---color-first) );
  box-sizing: content-box;
  content: "";
  cursor: pointer;
  display: block;
  height: 0.25em;
  padding: 0 0 0.075em 0.075em;
  transform: rotate(-135deg);
  width: 0.25em;  
}

.slider-first .slider-next:before {
  transform: rotate(45deg);  
}

@container slider-first (max-width: 60em) { /*920px*/
  .slider-first .slider-timeline:before {
    animation: unset;
  }

  .slider-first .slider-prev,
  .slider-first .slider-next {
    display: flex;
  }
}

@container slider-first (max-width: 45em) { /*720px*/
  .slider-first .slider-content {
    padding: calc( 1.28 * var(---rem) ) var(---grid);
  }
}

@container slider-first (max-width: 24em) { /*384px*/
  
  .slider-first .slider-container {
    ---grid: calc( 0.32 * var(---rem) );
  }

  .slider-first .slider-content {
    padding: var(---grid);
  }
}