@font-face {
    font-family: 'Barlow-Black';
    src:url('Barlow-Black.ttf.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'Dock11';
  src:url('heavy_dock11.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins-Regular';
  src:url('Poppins-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins-Black';
  src:url('Poppins-Black.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

:root {
  --bbb-background: #fff;		/* base background */
  --bbb-background-alt: #e2ddc5;	/* alternate background */
  --bbb-contrast-background: #0e2721;	/* constrasting background */

  --bbb-text-color: var(--bbb-contrast-background);	/* text color on background */
  --bbb-contrast-text-color: var(--bbb-background);	/* text color on contrasting background */

  --bbb-accent-color: #e8520d;		/* accent color */
  --bbb-highlight: rgb(26,70,60);
  --bbb-card: #eee;
  --bbb-card-header: var(--bbb-accent-color);

  --bbb-header-font: 'Poppins-Black',"Segoe UI","Helvetica Neue",Arial,sans-serif; 
  --bbb-header-text-transform: none;
  --bbb-header-font-weight: normal;
  --bbb-header-line-height: 125%;

  --bbb-font-text: 'Poppins-Regular',"Segoe UI","Helvetica Neue",Arial,sans-serif;
}

#sw3lbp {
  color: var(--bbb-text-color);
}

#floater {
  position: fixed;
  display: block;
  z-index: 111;
  background: var(--bbb-background-alt);
  bottom: 50px;
  right: 50px;
  text-align: center;
  padding-top: 35px;
  padding-bottom: 1em;
  padding-left: 3em;
  padding-right: 3em;
  border: 3px solid #fff;
  border-radius: 30px;
  font-family: var(--bbb-header-font);
  color: var(--bbb-accent-color);
  text-decoration: none;
}

#floater p {
 margin: 0.5em; 
}

#floater :first-child {
  color: var(--bbb-text-color);
  font-size:larger;
}

#floater:after {
  content:'';
  width:70px;
  height:100px;
/*  background: #0ff;*/
  background-image: url('knot.png');
  background-size: contain;
  display:block;
  position:absolute;
  top:0;
  left:50%;
  transform: translate(-50%,-50%);
}

#floater:hover {
  background: var(--bbb-contrast-background);
}

#floater:hover :first-child {
  color: var(--bbb-contrast-text-color);
}

@media screen and (max-width:900px) {
  #floater {
    display:none;
  }
}



.block.header {
  padding: 2em;
}

.header .sw3lbp {
  display: block;
  position: absolute;

  background: #eee;

  right: 4em;
  top: -3em;
  width: 175px;
  height: 7em;
  padding-top: 3em;
  clip-path: polygon(0% 0%, 100% 0%, 93% 100%, 4% 92%);

  color: #484;
  font-family: "Dock11";
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  line-height: 140%;
  z-index: 10;
}

.header .sw3lbp:hover {
  background: var(--bbb-contrast-background);
}

.header .sw3lbp:hover #sw3lbp {
  color: #fff;
}

.footer .sw3lbp {
  display: none;
  position: absolute;

  background: #eee;

  right: 4em;
  top: 1em;
  width: 165px;
  height: calc(100% + 32px - 1em);
  padding-top: 1em;
  clip-path: polygon(0% 0%, 100% 0%, 95% 100%, 3% 100%);

  color: #484;
  font-family: "Dock11";
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  line-height: 140%;
  z-index: 10;
}

.footer .sw3lbp:hover {
  background: var(--bbb-background-alt);
}

html {
  font-family: var(--bbb-font-text);
  padding:0px;
  margin:0px;
}

body {
  padding:0px;
  margin:0px;
}

.ce-above .ce-row {
  display: flex;
  justify-content: center;
}

.ce-above .ce-row .ce-column {
  margin: 0px;
  flex: 1 1 auto;
}

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

.c-siema > div {
  container-type: inline-size;
}

.c-siema img {
  max-height: 75cqw;
  width: auto;
  margin-left:auto;
  margin-right:auto;
}

.ce-bodytext *:last-child {
  margin-bottom: 0;
}

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

:not(.frame-card) > .ce-above .ce-bodytext > h2 {
  float: left;
  width: 33%;
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 0em;
  text-align: center;
}
 
.frame-type-container .block {
  padding: 0em;
  background: inherit;
}

.c-columns {
  overflow: hidden;
}

.ce-intext.ce-left .ce-gallery, .ce-intext.ce-right .ce-gallery {
  width: 40%;
  min-width: 40%;
}

/*
.frame-card .ce-gallery {
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1em;
  border-radius: 100%;
  overflow: hidden;
}
*/

.frame-card .ce-gallery {
  display: block;
  position: relative;
  height: 200px;
  left: -2em;
  right: -2em;
  top: -2em;
  width: calc(100% + 4em);
}

.frame-card .ce-textpic {
  overflow: unset;
}

.frame-card .ce-gallery * {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  float: none !important;
}

.frame-type-container .col .block { 
  position: relative;
}

.frame-type-container { 
  position: relative;
}

.frame-type-container .col:has(.frame-card):before {
  content:'';
  background: var(--bbb-card);
  border-radius: 15px;
  position:absolute;
  top: 0; /*inherit;*/
  bottom: 0;
  width: inherit;
}

@media screen and (max-width:840px) {
  .frame-type-container .col:before {
    display:none;
  }
}

.ce-intext.ce-left .ce-gallery {
  margin-right: 3em;
}
.ce-intext.ce-right .ce-gallery {
  margin-left: 3em;
}

.c-siema .siema-navigation {
  height: 30% !important;
  bottom: 35% !important;

  opacity: 0 !important;
  transition: opacity 0.3s;
}

.c-siema:hover .siema-navigation {
  opacity: 1 !important;
}

button.siema-navigation {
  background: rgba(255,255,255,0.5)  !important;
/*  border: none; */  
  border-radius: 5px;
}

.siema-navigation::after {
  border-color:rgba(255,255,255,0) var(--bbb-accent-color) var(--bbb-accent-color) rgba(255,255,255,0) !important;
  border-width:0px 5px 5px 0px !important;
}

a {
  color: inherit;
}

.menu label, #hamburger {
  display: none;
  font-size: 2em;
  font-style: normal;
  color: #fff;
  padding: 0px;
  padding-left: 1em;
  line-height: 48px;
}

.menu input[type=checkbox] {
  display: none;
}

.menu ul {
  list-style: none;
  padding:0px;
  margin:0px;
  font-weight: bold;
}

.menu > ul {
  line-height: 48px;
  margin-left: 24px;
  text-align: center;
}

.menu li {
  position: relative;
  display: inline-block;
  padding-left: 1em;
  padding-right: 1em;
}

.menu li a {
  padding-top: 5px;
  padding-bottom: 5px;
}

.menu li ul li {
  display:block;
  width: 15em;
}

.menu li.active {
  color: var(--bbb-accent-color);
}

.menu li:hover {
  background: var(--bbb-highlight);
  color: var(--bbb-accent-color);
}

.menu > ul ul {
  float:left;
  position: absolute;
  left: 0px;
  top: 48px;
  display:none;
  z-index: 11;
  line-height: 48px;
  text-align: left;
  background-color: var(--bbb-background-alt);
  color: var(--bbb-text-color);
  border: 1px solid black;
  box-shadow: 2px 2px 5px rgba(0,0,0,.3);
}

.menu li:hover ul {
  display: block;
}

.menu a {
  color: inherit;
  text-decoration: none;
}

#sticky-bar, #sticky-bar * {
  transition: all 300ms;
}

.sticky {
  position: fixed;
  display: block;
  top: 0; 
  z-index:10;
  box-shadow: 0px 0px 30px rgba(0,0,0,.5);
}

.sticky + .block {
  padding-top: calc(3em + 48px) !important;
}

div:target ::before {
  height: calc(3em + 48px);
  margin-top: calc(-3em - 48px);
  display: block;
  content: "";
}

.button {
/*  line-height: 48px; */
  display: inline-block;
  background: var(--bbb-contrast-background);
  color: var(--bbb-contrast-text-color);
/*  padding-left: 2em;*/
/*  padding-right: 2em;*/
}

.button * {
  padding: 0.8em 2em 0.8em 2em;
  display: inline-block;
}

.button:hover {
  background: var(--bbb-accent-color);
}

.button a {
  color: inherit;
  text-decoration: none;
}

.tag, .taglabel {
  display: inline-block;
  background: var(--bbb-background-alt);
  padding: 0.8em 1em 0.8em 1em;
  margin-right: 0.4em;
}

.block {
  display: block;
  background: var(--bbb-background);
  color: var(--text-color);

  padding: 3em;
  margin: 0;
}

.block.header h2 {
  text-align: center;
  margin: 0;
  padding-top: 1em;
}

.frame-card {
  background: var(--bbb-card);
  border-radius: 15px;
  overflow: hidden;
  padding: 2em;
  font-size: 14px;
}

.ce-textpic.ce-intext .ce-row {
  width: fit-content;
  margin: auto;
}

.taupebg {
  /*background: var(--bbb-background-alt);*/
  position: relative;
}

.greenbg {
  background: var(--bbb-contrast-background);
  color: var(--bbb-contrast-text-color);
}

/*
.offsetbg {
  margin-top: 8em;
  margin-bottom: -8em;
}

.offsetbg > div {
  position: relative;
  top: -8em;
}
*/

.block > .frame {
  position:relative;
}

.taupebg::before {
  background: var(--bbb-background-alt);
  content:'';
  position: absolute;
  left:0;
  right:0;
  bottom:0;
  top:0;
}

.taupebg.offsetbg::before {
    top: 8em;
}

/*
.taupebg.offsetbg {
  background: linear-gradient(#fff 40%, var(--bbb-background-alt) 40%);
}
.greenbg.offsetbg {
  background: linear-gradient(#fff 40%, var(--bbb-contrast-background) 40%);
}
*/

h2 {
  margin-top: 0em;
  margin-bottom: 1em;
  color: var(--bbb-accent-color);
  font-size: 30pt;
  font-family: var(--bbb-header-font);
  text-transform: var(--bbb-header-text-transform);
  font-weight: var(--bbb-header-font-weight);
  line-height: var(--bbb-header-line-height);
}

h3 {
  margin-top: 0em;
  margin-bottom: 0em;
  font-size: 22px;
  font-weight: bold;
}

.frame-card h2 {
  font-size: 24pt;
  color: var(--bbb-card-header);
}

.frame-space-after-small {
  margin-bottom: -3em;
}

.frame-space-after-extra-small {
  margin-bottom: -6em;
}

.frame-space-before-small {
  margin-top: -3em;
}

.frame-space-before-extra-small {
  margin-top: -6em;
}

figure.table {
  margin: 0px;
}

.contenttable {
  width: 100%;
}

.contenttable td {
  vertical-align: top;
}

@media only screen and (max-width:700px) {
  .contenttable table, .contenttable tbody, .contenttable tr, .contenttable td, .contenttable th {
    display: block;
  }
}
.bg {
  width: 50%;
  height: 100%;
  z-index: -2;
  position: fixed;
  top: 0px;
  display: block;
  overflow: hidden;
}

.spacer {
  width: 100%;
  height: 3em;
  display: block;
  overflow: hidden;
  position: relative;
}

.spacer > img {
  position: relative;
  z-index: -4;
}

.left {
  left: 0px;
}

.right {
  right: 0px;
  text-align: right;
}

.right > img {
  position: absolute;
  right: 0;
}

.stretch {
  height:100%;
  width:auto;
}

.center, .sticky {
  width: 874px;
}

.center {
  position: relative;
  margin: 0px;
  margin-left: auto;
  margin-right: auto;
  padding: 0px;
  background: var(--bbb-background);
  z-index: 0;

  box-shadow: 0px 0px 15px rgba(0,0,0,.7);
}

.footer {
  text-align: right;
}

.footer span {
  display: block;
  position: relative;
  z-index: 1;
}


@media only screen and (min-width:1330px) {
  /* Large enough for fixed-size 3 column layout */

  .footer .sw3lbp {
     display: block;
  }

  .center, .sticky {
    width:1299px;
  }

  .menu > ul { 
    line-height:64px;
    font-size:larger;
  }

  /*.sticky + .block {
    padding-top: calc(3em + 118px) !important;
  }*/

  .ce-intext {
    margin-left: 3em;
    margin-right: 3em;
  }

  :not(.frame-card) > .ce-above .ce-bodytext > h2 {
    width: 25%;
    margin-left: 2em;
    margin-right: 2em;
  }

  .footer {
    text-align: center;
  }

  .footer span {
    display: inline-block;
    padding: 0 1em 0 1em;
  }

  .footer span:not(span:last-of-type) {
    border-right: 1px solid var(--bbb-contrast-text-color);
  }
}

@media only screen and (max-width:900px) {
  /* Variable width 2-column layout */
  .center, .sticky {
    width:100%;
  }

  .bg {
    display:none;
  }

  h2, .frame-card h2 {
    font-size: 24pt;
  }

  .ce-intext.ce-left .ce-gallery, .ce-intext.ce-right .ce-gallery {
    width: 100%;
    float: none;
    margin-left: 0em;
    margin-right: 0em;
    margin-bottom: 1em;
  }

  :not(.frame-card) > .ce-above .ce-bodytext > h2 {
    float: none;
    width: 100%;
    margin-left: 0em;
    margin-right: 0em;
    margin-bottom: inherit;
    text-align: left;
  }

  .ce-above.ce-center .ce-gallery {
    margin-bottom: 1em;
  }
}

@media only screen and (max-width:768px) {
  /*.sticky + .block {
    padding-top: calc(3em + 36px) !important; 
  }*/

  .header .sw3lbp {
    right: 0em;
    width: 150px;
    height: 7em;
    padding-top: 3em;
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 4% 92%);
  }

  .taupebg.offsetbg::before {
    top: 5em;
  }


  .block.header {
    padding: 1em;
  }

  .menu label {
    display: inline-block;
  }

  /* Break down menu items into vertical list */
  .menu ul li {
    display: block;
  }

  .menu > ul {
    text-align: left;
  }

  .menu > ul ul {
    display: block;
    position: relative;
    float: none;
    box-shadow: none;
    top: auto;
    left: auto;
  }

  .menu li ul li {
    width: 100%;
  }

  /* toggle label */ 
  .menu > input:checked ~ #openMenu {
    display: none;
  }
  .menu > input:checked ~ #closeMenu {
    display: block;
  }
  .menu > input:not(:checked) ~ #openMenu {
    display: block;
  }
  .menu > input:not(:checked) ~ #closeMenu {
    display: none;
  }

  /* Toggle show/hide menu on checkbox click */
  .menu > ul {
    overflow: hidden;
    max-height: 0px;
    transition: 400ms;
  }

  .menu > input:checked ~ ul {
    max-height: 1000px;
  }
}
 

@media only screen and (max-width:570px) {
  .block {
    padding: 2em 1.5em 2em 1.5em;
  }
}

@media only screen and (max-width:670px) {
  .footer img {
/*    display:none !important;*/
    height: 70% !important;
    top: 40% !important;
  }
}
 
