

.keyfacts.container--wrapper.alignwide .cb-inside-container, 
.keyfacts.container--wrapper.alignfull .cb-inside-container,
#editor .keyfacts.container--wrapper.alignwide .cb-inside-container,
#editor .keyfacts.container--wrapper.alignfull .cb-inside-container {
  max-width: var(--default-editor, var(--block-wide-max-width));
  width: var(--default-editor, var(--block-width));
  margin-left: auto;
  margin-right: auto;
}

#editor .keyfacts.container--wrapper.alignwide .cb-inside-container,
#editor .keyfacts.container--wrapper.alignfull .cb-inside-container {
  max-width: var(--normal-container-max-width);
  padding-left: var(--container_padding);
  padding-right: var(--container_padding);
}

.keyfacts.color8 {
  padding-left: 0;
  padding-right: 0;
}
.keyfacts .headline {
  font-family: freight-display-pro, serif;
  font-weight: 700;
  font-size: var(--font-size-h2-small);
  line-height: 1;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: .75em;
  position: relative;
}
.keyfacts.dark .headline {
  color: var(--paletteColor8);
}
.keyfacts.medium .headline,
.keyfacts.light .headline {
  color: var(--color-black);
}

@media screen and (min-width: 690px) {
  .keyfacts .headline {
    font-size: var(--font-size-h2-medium);
  }
}
@media screen and (min-width: 1000px) {
  .keyfacts .headline {
    font-size: var(--font-size-h2-large);
  }
}

.keyfact--list {
  display: grid;
  position: relative;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  grid-gap: 1rem;
}
.factbox,
.editor-styles-wrapper .factbox {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;  
  padding: 2em;
}
.fact,
.editor-styles-wrapper .fact {
  text-align: center;
  margin: 0 auto;
  font-weight: 700;
	font-size: 1.25em;
	line-height: 1.4;
}
.fact.align--left,
.editor-styles-wrapper .fact.align--left {
    text-align: left;
}
.fact.weight--normal,
.editor-styles-wrapper .fact.weight--normal {
    font-weight: 500;
}
.factbox .morelink,
.editor-styles-wrapper .factbox .morelink {
  margin-bottom: 0;
}
.factbox .morelink a {  
  margin-top: 1.5em;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: .3em 1.1em;
  border-radius: 900px;
  font-size: 14px;
  display: flex;
  align-items: center;
}
.factbox .morelink a svg {
  margin-left: .25em;
}
.keyfacts.light .morelink a { 
  color: var(--color-black); 
  /* border: 1px solid var(--color-black); */
}
.keyfacts.light .factbox {
	background-color: rgba(0,0,0,.04);
}
.keyfacts.color8 .factbox {
	background-color: var(--paletteColor7);
}
.keyfacts.medium .factbox {
	background-color: rgba(255,255,255,.1);
}
.keyfacts.medium .morelink a { 
  color: var(--color-black); 
  /* border: 1px solid var(--color-black); */
}
.keyfacts.dark .factbox {
	background-color: rgba(0,0,0,.5);
  /* backdrop-filter: brightness(85%); */
}
.keyfacts.dark .morelink a { 
  color: var(--paletteColor8); 
  /* border: 1px solid  var(--paletteColor8); */
}
.keyfacts.bg-img .factbox {
  /* backdrop-filter: brightness(65%); */
}
.keyfacts.black .factbox {
	background-color: rgba(255,255,255,.07);
}


@supports (backdrop-filter: brightness) {
  .keyfacts.dark .factbox {
    background-color: rgba(0,0,0,.04);
    backdrop-filter: brightness(85%);
  }
  .keyfacts.bg-img .factbox {
    backdrop-filter: brightness(65%) blur(5px);
  }
}


