/***GLOBAL VARIABLES
*****************************************************/
:root {
/***TEXT***/
    /*--fontSize: clamp(1rem, 1.25vw, 1.5rem);*/
    --fontSizeSmall: 1.25rem;
    --fontSizeMedium: 1.5rem;
    --fontSizeLarge: 3.25rem;
    --fontSizeXLarge: 3.75rem;
    --fontWeight: 400;
    --letterSpacing: .02em;
    --wordSpacing: 0em;
    --lineHeightNatural: 1.2;
    --lineHeightLow: 1;
    --lineHeightExtraLow: 0.8;

/***SPACES***/
    --spaceY: calc(var(--fontSizeSmall) * 0.5);
    --spaceX: calc(var(--fontSizeSmall) * 0.75);
    --bodySpaces: 0;
    --rowGutterMedium: calc(var(--fontSizeMedium) * var(--lineHeightLow));
    --rowGutterLarge: calc(var(--fontSizeLarge) * var(--lineHeightExtraLow));
    --rowGutterXLarge: calc(var(--fontSizeXLarge) * var(--lineHeightExtraLow));
    --rowGutterSmall: calc(var(--fontSizeSmall) * var(--lineHeightNatural));
    --colGutter: calc(var(--fontSizeMedium) * 0.75);
    --mainTopSpace: calc(var(--rowGutterMedium) * 2);
    --mainBottomSpace: calc(var(--rowGutterMedium) * 3);

/***SIZES***/
    --headerHeight: calc(var(--spaceY)*2.5 + var(--rowGutterXLarge));
    --mainWidth: 100%;
    --mainHeight: calc(100vh - var(--headerHeight) - var(--mainTopSpace) - var(--mainBottomSpace) - var(--footerHeight));
    --footerHeight: calc(var(--spaceY)*2 + var(--rowGutterMedium));

/***GRIDS***/
    --gridTemplate: repeat(12, 1fr);
    --gridGap: var(--rowGutterMedium) var(--colGutter);

/***COLOR***/
    --paletteWhite: #FFFFFF;
    --paletteGray: #E2E1E0;
    --paletteBlack: #000000; 
    --columnLeftColor: var(--paletteWhite);
    --columnCenterColor: var(--paletteBlack);
    --columnRightColor: var(--paletteBlack);
    --columnLeftBack: var(--paletteBlack);
    --columnCenterBack: var(--paletteWhite);
    --columnRightBack: var(--paletteGray);
    --backColor: var(--paletteWhite);
    --textColor: var(--paletteBlack);
    --linkColor: var(--paletteBlack);
    --hoverColor: var(--paletteGray);

/***DECORATION***/
    --linkDeco: underline;
    --borderWidth: 1px;
    --borderLineWhite: var(--borderWidth) solid var(--paletteWhite);
    --borderLineBlack: var(--borderWidth) solid var(--paletteBlack);

/***TRANSITION***/
    --transitionDuration: 0.15s;
    --transitionDurationSlow: 0.3s;
    --transitionDurationXSlow: 0.5s;
}
  
/***FONTS
*****************************************************/
* {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -o-text-size-adjust: 100%;
	text-size-adjust: 100%;
    -webkit-font-smoothing: smooth;
	-moz-font-smoothing: smooth;
    -moz-osx-font-smoothing: smooth;
	-ms-font-smoothing: smooth;
    -o-font-smoothing: smooth;
    text-rendering: geometricPrecision;
}
@font-face {
    font-family: Knockout HTF68 Regular;
    src: url("Knockout-HTF68-FullFeatherwt-Regular.woff");
}
@font-face {
    font-family: Founders Grotesk XCond Medium;
    src: url("FoundersGroteskXCond-Med.woff");
}
@font-face {
    font-family: Founders Grotesk XCond Semibold;
    src: url("FoundersGroteskXCond-SmBd.woff");
}
.font_size_S {
    font-size: var(--fontSizeSmall);
    line-height: var(--lineHeightNatural);
}
.font_size_M {
    font-size: var(--fontSizeMedium);
    line-height: var(--lineHeightLow);
}
.font_size_L {
    font-family: Founders Grotesk XCond Semibold, Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    font-size: var(--fontSizeLarge);
    line-height: var(--lineHeightExtraLow);
}
.font_size_XL {
    font-family: Founders Grotesk XCond Semibold, Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    font-size: var(--fontSizeXLarge);
    line-height: var(--lineHeightExtraLow);
}
.uppercase {
    text-transform: uppercase;
}
.capitalize {
    text-transform: capitalize;
}
.lowercase {
    text-transform: lowercase;
}

/***RESET
*****************************************************/
::-webkit-scrollbar {
    display: none;
}
::-webkit-selection {
    color: var(--backColor);
    background-color: var(--textColor);
}
::-moz-selection {
    color: var(--backColor);
    background-color: var(--textColor);
}
::-ms-selection {
    color: var(--backColor);
    background-color: var(--textColor);
}
::-o-selection {
    color: var(--backColor);
    background-color: var(--textColor);
}
::selection {
    color: var(--backColor);
    background-color: var(--textColor);
}
img::-webkit-selectio {
    color: transparent;
    background-color: transparent;
}
img::-moz-selection {
    color: transparent;
    background-color: transparent;
}
img::-ms-selection {
    color: transparent;
    background-color: transparent;
}
img::-o-selection {
    color: transparent;
    background-color: transparent;
}
img::selection {
    color: transparent;
    background-color: transparent;
}
*,
*::before,
*::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}
html {
    /*color-scheme: light dark;*/
    scroll-behavior: smooth;
}
body {
    position: relative;
    margin: var(--bodySpaces);
    display: flex;
    color: var(--textColor);
    font-family: Founders Grotesk XCond Semibold, Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}
ul {
    display: block;
    list-style-type: none;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
    padding-inline-start: 0;
}
li {
  display: inline;
}
a {	
    text-decoration: none;
    transition-property: color, background;
    transition-duration: var(--transitionDuration);
}
h1, h2, h3 {
    margin: 0;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding: 0;
    font-style: normal;
    font-weight: 400;
}
p {
    display: block;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0;
}
span {
    display: inline;
}
form, input, textarea, submit,
iframe, embed, audio {
    margin: 0;
    padding: 0;
    color: var(--textColor);
    background: transparent;
    border: 0;
    outline: none;
    font: inherit;
    font-size: inherit;
}
input:focus, textarea:focus {
    outline: none;
}
input[name="submit"] {
	cursor: pointer;
}
:-webkit-input-placeholder {
	/*internet explorer*/
	color: var(--textColor);
}
::-moz-input-placeholder {
	/*mozilla edge*/
    color: var(--textColor);
}
::-ms-input-placeholder {
	/*microsoft edge*/
    color: var(--textColor);
}
::-o-input-placeholder {
	/*microsoft edge*/
    color: var(--textColor);
}
::placeholder {
	/*chrome, firefox, opera, safari*/
    color: var(--textColor);
}
img, video {
    vertical-align: middle;
}
img.lazy,
video.lazy {
    opacity: 0;
    transition: opacity var(--transitionDuration);
}
img.lazy.loaded,
video.lazy.loaded {
    opacity: 1;
}

/***HEADER AND MENU
*****************************************************/
header {
    width: 100%;
    min-height: var(--headerHeight);
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    padding: var(--spaceY) var(--spaceX) calc(var(--spaceY)*1.5);
    display: flex;
    justify-content: space-between;
    align-items: start;
    z-index: 100;
}

.column.left header {
    background: var(--columnLeftBack);
}
.column.center header {
    background: var(--columnCenterBack);
}
.column.center header span.site_name,
.column.center header span.site_name a {
    width: 100%;
}
.column.center header span.site_name a {
    display: inline-block;
    text-align: justify;
    text-align-last: justify;
}
.column.right header {
    background: var(--columnRightBack);
}

/***COLUMNS
*****************************************************/
.column {
    position: relative;
    height: 100vh;
    flex: 1;
    overflow-y: scroll;
    padding-bottom: var(--rowGutterLarge);
}
.column.left {
    color: var(--columnLeftColor);
    background: var(--columnLeftBack);
}
.column.center {
    color: var(--columnCenterColor);
    background: var(--columnCenterBack);
}
.column.right {
    color: var(--columnRightColor);
    background: var(--columnRightBack);
}
.column.left a {
    color: var(--palettewhite);
}
.column.center a,
.column.right a {
    color: var(--paletteBlack);
}

/***CONTENT***/
.column main.content {
    padding: 0 var(--spaceX) var(--spaceY);
}
section:not(:first-child) {
    margin-top: var(--rowGutterLarge);
}
section:not(.videos) .section_data .data_title {
    padding-bottom: calc(var(--spaceY)*1.25);
    border-bottom: var(--borderLineWhite);
}
.column.center section:not(.videos) .section_data .data_title,
.column.right section:not(.videos) .section_data .data_title {
    border-bottom: var(--borderLineBlack);
}
section .section_data .data_text {
    margin-top: var(--spaceY);
}
section .more_content {
    display: grid;
    transition-property: padding-block, grid-template-rows, opacity;
    transition-duration: var(--transitionDurationXSlow);
}
section:not(.open) .more_content {
    grid-template-rows: 0fr;
    padding-block: 0;
}
section.open .more_content {
    grid-template-rows: 1fr;
    padding-block: var(--rowGutterLarge);
}
section .more_content:not(.visible) {
    opacity: 0;
}
section .more_content.visible {
    opacity: 1;
}
section .more_content .stack {
    overflow-y: hidden;
}
.album {
    width: 75%;
}
.album .album_cover {
    width: 100%;
    aspect-ratio: 1/1;
    border: var(--borderLineWhite);
}
.album .album_cover img {
    width: 100%;
}
.album .album_data {
    padding-top: calc(var(--spaceY)*0.6);
}

/***ARTICLES***/
section > .more_content > .stack > article:not(:first-child),
section:not(.videos) article:not(:first-child) {
    margin-top: var(--rowGutterLarge);
}
article .article_media {
    width: 100%;
}
article:not(.video) .article_media {
    margin-bottom: var(--rowGutterMedium);
}
article.video .article_media {
    aspect-ratio: 16/9;
    object-fit: cover;
    margin-top: calc(var(--spaceY)*1.25);
}
article.video .article_media iframe {
    border: var(--borderLineWhite);
}
article .article_media img {
    width: 100%;
}
article.video .article_media iframe {
    width: 100%;
    height: 100%;
    object-fit: cover; 
}
article.product .article_media img {
    padding: 0 calc(var(--spaceX)*2);
    /*mix-blend-mode: multiply;*/
}
.column.left article.product .article_media img {
    filter: drop-shadow(0px 1px 3px rgba(255, 255, 255, 0.6));
}
.column.center article.product .article_media img,
.column.right article.product .article_media img {
    filter: drop-shadow(0px 1px 3px rgba(0, 0, 0, 0.6));
}
.column article.video .article_data {
    padding-top: calc(var(--spaceY) * 0.6)
}
.column article .article_data .data_title {
    padding-bottom: calc(var(--spaceY) * 1.25);
}
.column.left article .article_data .data_title {
    border-bottom: var(--borderLineWhite);
}
.column.center article .article_data .data_title,
.column.right article .article_data .data_title {
    border-bottom: var(--borderLineBlack);
}
article .article_data .data_text {
    margin-top: var(--spaceY);
}

/***BUTTONS***/
.button_stack {
    display: flex;
    column-gap: calc(var(--spaceX)*0.6);
}
.button_stack:not(.footer){
    margin-top: calc(var(--spaceY)*1.5);
}
.button_stack.footer {
    margin-top: var(--rowGutterLarge);
}
.button {
    padding: calc(var(--spaceY)*0) calc(var(--spaceX)*0.45) calc(var(--spaceY)*0.25);
    border-radius: 3px;
    cursor: pointer;
}

.column.left .button:not(.highlight) {
    color: var(--paletteWhite);
    border: var(--borderLineWhite);
}
.column.left .button:not(.highlight):hover {
    color: var(--paletteBlack);
    background: var(--paletteWhite);
}
.column.left .button.highlight {
    color: var(--paletteBlack);
    background: var(--paletteWhite);
    border: var(--borderLineWhite);
}
.column.left .button.highlight:hover {
    color: var(--paletteWhite);
    background: transparent;
}
.column.center .button:not(.highlight) {
    color: var(--paletteBlack);
    border: var(--borderLineBlack);
}
.column.right .button:not(.highlight) {
    color: var(--paletteBlack);
    border: var(--borderLineBlack);
}
.column.center .button:not(.highlight):hover {
    color: var(--paletteWhite);
    background: var(--paletteBlack);
}
.column.right .button:not(.highlight):hover {
    color: var(--paletteGray);
    background: var(--paletteBlack);
}
.column.center .button.highlight {
    color: var(--paletteWhite);
    background: var(--paletteBlack);
    border: var(--borderLineBlack); 
}
.column.right .button.highlight {
    color: var(--paletteGray);
    background: var(--paletteBlack);
    border: var(--borderLineBlack);
}
.column.center .button.highlight:hover,
.column.right .button.highlight:hover {
    color: var(--paletteBlack);
    background: transparent;
}
.popup .button:not(.highlight) {
    color: var(--paletteWhite);
    border: var(--borderLineBlack);
    background: var(--paletteBlack);
}
.popup .button:not(.highlight):hover {
    color: var(--paletteBlack);
    border: var(--borderLineWhite);
    background: var(--paletteWhite);
}
.popup .button.highlight {
    color: var(--paletteBlack);
    background: var(--paletteWhite);
    border: var(--borderLineWhite);
}
.popup .button.highlight:hover {
    color: var(--paletteWhite);
    border: var(--borderLineBlack);
    background: var(--paletteBlack);
}

/***SEATED DATES
*****************************************************/
.seated-event-row {
    padding: var(--spaceY) 0 !important;
    border-bottom: 0 !important;
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -webkit-flex-flow: row !important;
    -ms-flex-flow: row !important;
    flex-flow: row !important;
}
.seated-event-description-cells {
    flex: 4 !important;
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    width: auto !important;
    /*text-align: left !important;*/
}
.seated-event-date-cell {
    order: 1 !important;
    flex: 1.25 !important;
}
.seated-event-venue-cell {
    order: 2 !important;
    display: inline-block !important;
    flex: 2 !important;
    -webkit-box-align: start !important;
    -webkit-align-items: start !important;
    -ms-flex-align: start !important;
    align-items: start !important;
    margin-bottom: 0px !important;
}
.seated-event-venue-name {
    width: 100% !important;
}
.seated-event-details-cell {
    order: 3 !important;
    flex-basis: 100%;
    padding-left: 38.5% !important;
}
.seated-event-link-cells {
    flex: 1 !important;
    width: 100% !important;
    justify-content: end;
    align-items: start;
    margin-top: 6px;
}
.seated-event-link-cell {
    white-space: wrap !important;
    /*text-align: left !important;*/
}
.seated-event-link,
.seated-event-link:visited,
.seated-event-link1,
.seated-event-link1:visited,
.seated-event-link2,
.seated-event-link2:visited,
.seated-event-link3,
.seated-event-link3:visited {
    color: var(--paletteBlack) !important;
    border: var(--borderLineWhite) !important;
    padding: calc(var(--spaceY)*0) calc(var(--spaceX)*0.45) calc(var(--spaceY)*0.25) !important;
    margin: 0 !important;
    font-size: var(--fontSizeMedium) !important;
    min-width: auto !important;
    text-transform: none !important;
    white-space: wrap !important;
    /*text-align: left !important;*/
}
.seated-event-link:hover,
.seated-event-link1:hover,
.seated-event-link2:hover,
.seated-event-link3:hover {
    color: var(--paletteWhite) !important;
}
.seated-follow-box {
    padding: 30px 0 0 0 !important;
    margin-top: 0 !important;
}
.seated-follow-box ,
.seated-follow-text {
    font-weight: 400 !important;
    text-align: left !important;
}
.seated-follow-link,
.seated-follow-link:visited {
    color: var(--paletteBlack) !important;
    border: var(--borderLineWhite) !important;
    padding: calc(var(--spaceY)*0) calc(var(--spaceX)*0.45) calc(var(--spaceY)*0.25) !important;
    margin: calc(var(--spaceY)*1.5) 0 0 0 !important;
    font-size: var(--fontSizeMedium) !important;
    min-width: auto !important;
    text-transform: capitalize !important;
}

/***POP-UP
*****************************************************/
.popup {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
}
.popup_bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.75);
    transition: opacity var(--transitionDuration);
    cursor: pointer;
}
.popup_bg:not(.remove) {
  opacity: 1;
}
.popup_bg.remove {
  opacity: 0;
}
.popup .popup_media {
    position: fixed;
    z-index: 100;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
}
.popup .popup_media img {
    object-fit: contain;
    max-height: calc(100vw - var(--spaceX)*2);
    max-height: calc(100vh - var(--headerHeight)*5);
    border: var(--borderLineBlack);
    pointer-events: auto !important;
}
.popup .popup_media:not(.remove) {
    display: inline-flex;
}
.popup .popup_media.remove {
    display: none;
}
.popup .popup_media .button_stack {
    pointer-events: auto !important;
}