/*!
Theme Name: BONS SONS
Base Theme URI: http://underscores.me/
Author: Marco Reixa
*/

@font-face {
    font-family: 'BS Largo';
    src: url('fountain/bslargo-condensed-webfont.woff2') format('woff2'),
         url('fountain/bslargo-condensed-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('fountain/Inter-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('fountain/Inter-Italic.woff2') format('woff2');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Inter';
    src: url('fountain/Inter-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('fountain/Inter-BoldItalic.woff2') format('woff2');
    font-weight: bold;
    font-style: italic;
}


:root {
    --black:        #000000;
    --darkgray:     #1D1D1D;
    --midgray:      #7A7978;
    --gray:         #999999;
    --lightgray:    #F5F3F0;
	--white:        #FFFFFF;
  }

*                                                           { box-sizing: border-box; }
html, body                                                  { margin: 0; padding: 0; background-color: var(--lightgray); color: var(--black); }
img                                                         { border: none; display: block; }
a                                                           { color: var(--black); text-decoration: underline; }
a:hover                                                     { color: var(--black); text-decoration: underline; }
a:visited                                                   { color: var(--black); }

.toggle-this                                                { display: none; }

/*
——————————————————————————————————————————
TYPOGRAPHY 
——————————————————————————————————————————
*/

body, select, button, .content-subtitle, .button            { font-family: 'Inter', sans-serif; font-weight: normal; font-style: normal; }

#masthead,
.footer-tagline,
.home-manifesto,
h1													        { font-family: "BS Largo", sans-serif; font-weight: normal; font-style: normal; text-transform: uppercase; }

/* –––––––––––––––––– S I Z E S  &  S T Y L E S –––––––––––––––––– */

body                                                        { font-size: 18px; line-height: 1.50em; }

#masthead                                       			{ font-size: 36px; line-height: 1.00em; letter-spacing: 0.010em; }
.footer-tagline                                             { font-size: 36px; line-height: 0.80em; letter-spacing: 0.010em; }
.content-subtitle                                           { font-size: 24px; line-height: 1.15em; }
select, button, .button                                     { font-size: 18px; line-height: 1.00em; }
.content-thumb-caption                                      { font-size: 12px; line-height: 1.00em; }

.ticker-tape 												{ font-size: 18px; line-height: 1.00em; letter-spacing: 0.050em; text-transform: uppercase; }
.featured-text												{ font-size: 36px; line-height: 1.15em; text-transform: uppercase; }
.featured-button											{ text-transform: uppercase; }

.poster .lineup-title										{ font-size: 18px; line-height: 1.00em; text-transform: uppercase; }
.poster .lineup												{ font-size: 24px; line-height: 1.20em; text-transform: uppercase; }

.event-list-schedule 										{ font-size: 18px; line-height: 1.40em; text-transform: uppercase; }
.event-schedule 											{ font-size: 24px; line-height: 1.40em; text-transform: uppercase; }

.post-nav													{ font-size: 18px; line-height: 1.00em; text-transform: uppercase; }
#colophon                                                   { font-size: 14px; line-height: 1.00em; text-transform: uppercase; letter-spacing: 0.050em; }

.home-manifesto 											{ font-size: 48px; line-height: 1.15em; text-transform: uppercase; }

				h1  										{ font-size: 48px; line-height: 1.15em; letter-spacing: 0.010em; }
.notfound 		h1											{ font-size: 48px; line-height: 1.15em; letter-spacing: 0.010em; }
.poster 		h1											{ font-size: 36px; line-height: 1.25em; letter-spacing: 0.010em; }
header 			h1											{ font-size: 36px; line-height: 1.25em; letter-spacing: 0.010em; }

h2                                                          { line-height: 1.25em; }
h3                                                          { line-height: 1.25em; }
h4                                                          { line-height: 1.25em; }

h2 span                                                     { font-weight: normal; }

/*
——————————————————————————————————————————
STRUCTURE
——————————————————————————————————————————
*/

body                                                        { margin: 0 !important; }
.main-grid                                                  { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.logo-wall													{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
#colophon  													{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }

#primary                                                    { margin: 0; padding: 0 0 96px 0;  position: relative; z-index: 800;  background-color: var(--lightgray); will-change: transform;  }

.home #primary, 
.single-event #primary, 
.single-biography #primary,
.error404 #primary,
.page-template-template-event-list #primary					{ padding: 0; }

/*
——————————————————————————————————————————
HEADER & NAV
——————————————————————————————————————————
*/

#masthead 													{ width: 100%; height: 80px; margin: 0; padding: 0 20px; display: flex; flex-direction: row; align-items: center; justify-content: space-between; background-color: #FFF; position: sticky; top: 0; left: 0; z-index: 900; }
#masthead ul                                                { list-style: none; }
#masthead a                                                 { text-decoration: none; }
#masthead a:hover                                           { text-decoration: underline; }
#masthead .current-menu-item a                              { text-decoration: underline; }
#masthead .menu-item-has-children > a                       { pointer-events: none; }

.site-branding                                              { margin: 0; padding: 0; z-index: 999 !important; position: relative; }

#site-navigation                                            { margin: 0; padding: 0; }
#primary-menu 												{ margin: 0; padding: 80px 20px 20px 20px; width: 100%; height: 100vh;  display: none; flex-direction: column; position: fixed; left: 0; top: 0;  background-color: #FFF; z-index: 900 !important;   }
#primary-menu > li										    { margin: 0; padding: 10px 0 0 0; position: relative;  }

#primary-menu .sub-menu 									{ margin: 0; padding: 0 0 0 30px; display: flex; flex-direction: column; white-space: nowrap; }
#primary-menu .sub-menu li									{ margin: 0; padding: 10px 0 0 0; }

.main-navigation.toggled #primary-menu                      { display: flex; }


/* –––––––––––––––––– T O G G L E  M E N U  –––––––––––––––––– */

.menu-toggle                                                { margin: 0 !important; padding: 0 !important; border: none; border-radius: 0; background-color: transparent; display: flex; z-index: 999 !important; position: relative; }
#menu-icon                                                  { cursor: pointer; display: flex;  flex-direction: column;  align-items: center;  justify-content:center; width: 100%; height: 100%; transition: all .2s ease-in-out, background-color 1ms; -moz-transition: all .2s ease-in-out, background-color 1ms; -webkit-transition: all .2s ease-in-out, background-color 1ms; }
#menu-icon:after, #menu-icon:before, #menu-icon span        { display: block !important; transition: all .2s ease-in-out, background-color 1ms; -moz-transition: all .2s ease-in-out, background-color 1ms; -webkit-transition: all .2s ease-in-out, background-color 1ms; content: ''; margin: 2px 0; height: 3px; width: 30px; background-color: var(--black); }
.main-navigation.toggled #menu-icon:before                  { transform: translateY(6px) rotate(135deg); -webkit-transform: translateY(8px) rotate(135deg); -moz-transform: translateY(6px) rotate(135deg); }
.main-navigation.toggled #menu-icon:after                   { transform: translateY(-6px) rotate(-135deg); -moz-transform: translateY(-8px) rotate(-135deg); -webkit-transform: translateY(-6px) rotate(-135deg); }
.main-navigation.toggled #menu-icon span                    { transform: scale(0); -moz-transform: scale(0); -webkit-transform: scale(0); }


/*
——————————————————————————————————————————
CONTENT
——————————————————————————————————————————
*/

/* –––––––––––––––––– H O M E  P A G E  –––––––––––––––––– */

.site-cover 												{ width: 100%;  margin: 0; padding: 0; background-position: center; background-size: cover; background-color: var(--white); display: flex; flex-direction: column; transition: all 0.5s ease-in-out; }
.featured-item 												{ width: 100%; height: auto; margin: 0; padding: 0; display: flex; flex-direction: column; align-items: stretch; justify-content: flex-end;  border-bottom: solid 2px var(--darkgray); }
.featured-item:last-of-type									{ border-bottom: 0; }
.featured-content 											{ margin: 0; padding: 48px 20px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 30px; }
.featured-text												{ text-align: center; color: var(--white); }

.poster 													{ width: 100%; height: auto; margin: 0; padding: 120px 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 48px; background-color: var(--white); }
.poster h1 													{ margin: 0; padding: 0; text-align: center; }
.poster p:first-of-type										{ margin-top: 0; }
.poster p:last-of-type										{ margin-bottom: 0; }
.poster .lineup-title										{ margin: 0; padding: 0; text-align: center; }
.poster .lineup 											{ width: 100%; height: auto; margin: 0; padding: 0; list-style: none; display: flex; flex-direction: row; flex-wrap: wrap; gap: 10px 20px; align-items: center; justify-content: center; }
.poster .lineup li											{ margin: 0; padding: 0; text-align: center; }
.poster a                                   				{ text-decoration: none; }
.poster a:hover												{ text-decoration: underline; }

.home-manifesto 											{ width: 100%; height: auto; margin: 0; padding: 20px; }
.home-manifesto a 											{ color: var(--black); text-decoration: none; }


/* TICKER */  
.ticker-tape 												{ width: 100%; height: auto; margin: 0; padding: 15px 0 15px 100%; overflow: hidden; display: flex; background-color: var(--black); text-transform: uppercase; }
.ticker 													{ width: auto; height: auto; white-space: nowrap;
															  -webkit-animation-iteration-count: infinite;
															  -webkit-animation-timing-function: linear;
															  -webkit-animation-name: ticker;
															  -webkit-animation-duration: 60s;

															  animation-iteration-count: infinite;
															  animation-timing-function: linear;
															  animation-name: ticker;
															  animation-duration: 60s; }

.ticker:hover 												{ animation-play-state: paused; }

.ticker__item 												{ display: inline-block; margin: 0; padding: 0 20px 0 0; color: var(--lightgray); }
.ticker__item:last-child 									{ padding-right: 100vw; }
.ticker__item::after 										{ content: "•"; display: inline-block; padding-left: 20px; }
.ticker__item:last-child::after 							{ content: none; }
.ticker__item a 											{ color: var(--lightgray); text-decoration: underline; }
.ticker__item a:hover 										{ color: var(--lightgray); text-decoration: none; }

@-webkit-keyframes ticker {
0% {
	-webkit-transform: translateX(0);
	transform: translateX(0);
	visibility: visible;
}
100% {
	-webkit-transform: translateX(-100%);
	transform: translateX(-100%);
}
}

@keyframes ticker {
0% {
	-webkit-transform: translateX(0);
	transform: translateX(0);
	visibility: visible;
}
100% {
	-webkit-transform: translateX(-100%);
	transform: translateX(-100%);
}
}



/* –––––––––––––––––– G E N E R A L –––––––––––––––––– */

header                                                      { margin: 0; padding: 50px 20px; } 
header h1                                                   { margin: 0; padding: 0; }
ul                                                          { margin-left: 3em; padding: 0; }
ol                                                          { margin-left: 3em; padding: 0; }

/* –––––––––––––––––– F I L T E R S  –––––––––––––––––– */

.controls                                                   { width: 100%; height: auto; margin: 0; padding: 40px 0 0 0; display: flex; flex-direction: column; gap: 20px; justify-content: center; }

.controls fieldset                                          { margin: 0; padding: 0; border: none; width: 100%; position: relative; }
.controls fieldset:before                                   { content: "\2228"; position: absolute; right: 15px; height: 100%; display: flex; align-items: center; justify-content: center; }
.controls select                                            { appearance: none; width: 100%; margin: 0; padding: 8px 20px 10px 20px; background-color: var(--lightgray); border-radius: 50px; border: solid 2px #333; cursor: pointer; }

.controls .control-group                                    { margin: 0; padding: 0; border: none; display: flex; gap: 10px; justify-content: flex-end; }
.control-group .control                                     { margin: 0; padding: 8px 12px 10px 12px; background-color: var(--lightgray); border-radius: 50px; border: solid 2px #333; cursor: pointer; }
.control-group .mixitup-control-active                      { background-color: #333; color: var(--lightgray);}

/* –––––––––––––––––– E V E N T S  L I S T  –––––––––––––––––– */

.event-list                                                 { margin: 0; padding: 0; list-style: none; gap: 0; }
.event-list li                                              { margin: 0; padding: 0; grid-column: span 4; border-top: solid 1px var(--midgray); background-color: var(--lightgray); }
.event-list a                                               { text-decoration: none; display: flex; flex-direction: row; gap: 0; flex-wrap: nowrap; position: relative;  }
.event-list a:hover                                         { text-decoration: none; }

.event-list-nothumb											{ width: 25%; height: auto; margin: 0; padding: 0; position: relative; background-color: var(--black); }
.event-list-thumb											{ width: 25%; height: auto; margin: 0; padding: 0; position: relative; }
.event-list-thumb figure									{ width: 100%; height: 100%; margin: 0; padding: 0; position: absolute; top: 0; left: 0; overflow: hidden; }
.event-list-thumb img 			                        	{ width: 100%; height: 100%; object-fit: cover !important;  }

.event-list-schedule										{ width: 75%; height: auto; margin: 0; padding: 10px 20px; display: flex; flex-direction: column; }

.event-list-title											{ text-decoration: underline; }
.event-list-subtitle 										{ font-style: italic;}


/* –––––––––––––––––– E V E N T S  &  B I O S  –––––––––––––––––– */

.content                                                    { display: flex; flex-direction: column; }
.content-a                                                  { margin: 0; padding: 0; width: 100%; height: auto; position: relative; }
.content-b                                                  { margin: 0; padding: 0; width: 100%; height: auto; position: relative; }

.content-thumb 				                                { margin: 0; padding: 0; width: 100%; height: 50vh; display: block; position: relative !important; overflow: hidden; background-color: var(--black); }
.content-thumb img 			                                { width: 100%; height: 100%; object-fit: cover !important; }
.content-thumb-caption 		                                { margin: 0; padding: 10px; position: absolute !important; right: 0; bottom: 0; background-color: rgba(0,0,0,0.3); color: var(--lightgray); display: block; }

.content-header                                             { margin: 0; padding: 40px 20px; }
.content-subtitle                                           { margin: 0; padding: 0; text-transform: none; }
.content-schedule                                           { margin: 0; padding: 0 20px 40px 20px; }

.event-schedule												{ margin: 0; padding: 60px 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.event-schedule * 											{ text-align: center; }

.content-synopsis                                           { margin: 0; padding: 0 20px; }
    .content-synopsis p:first-of-type                       { margin-top: 0; }
    .content-synopsis p:last-of-type                        { margin-bottom: 0; }
.content-notes                                              { margin: 0; padding: 40px 20px 0 20px; color: var(--gray); }
    .content-notes p:first-of-type                          { margin-top: 0; }
    .content-notes p:last-of-type                           { margin-bottom: 0; }
.content-video                                              { margin: 0; padding: 40px 20px 0 20px; width: 100%; }
.content-related-docs                                       { margin: 0; padding: 40px 20px 0 20px; }
    .content-related-docs h4                                { margin: 0 0 10px 0; }
    .content-related-docs ul                                { margin: 0; padding: 0; list-style: none; }
    .content-related-docs li                                { margin: 0; padding: 0; }
.content-related-links                                      { margin: 0; padding: 40px 20px 0 20px; }
    .content-related-links h4                               { margin: 0 0 10px 0; }
    .content-related-links ul                               { margin: 0; padding: 0; list-style: none; }
    .content-related-links li                               { margin: 0; padding: 0; }
.content-related-content                                    { margin: 0; padding: 40px 20px 0 20px; }
    .content-related-content h4                             { margin: 0 0 24px 0; }
    .content-related-content ul                             { margin: 0 -20px; padding: 0; list-style: none; border-top: solid 1px var(--black); }
    .content-related-content li                             { margin: 0; padding: 0; display: flex; position: relative; border-bottom: solid 1px var(--black); }
    .content-related-content li:before                      { content: "\003E"; position: absolute; right: 20px; height: 100%; display: flex; align-items: center; justify-content: center; }
    .content-related-content li a                           { margin: 0; padding: 20px; width: 100%; text-decoration: none; }
    .content-related-content li a:hover                     { text-decoration: none; background-color: #FFF; }    


.post-nav 													{ width: 100%; height: auto; margin: -1px 0 0 0; padding: 0; display: flex; flex-direction: row; justify-content: flex-end; position: sticky; bottom: 0; background-color: var(--lightgray); border-top: solid 1px var(--black); }
.post-nav * 												{ margin: 0; padding: 10px 20px; border-left: solid 1px var(--black); }
.post-nav a 												{ text-decoration: none; }
.post-nav a:hover 											{ background-color: var(--black); color: var(--lightgray); }
.post-nav-tax:last-child 									{ background-color: var(--black); color: var(--lightgray); }
.post-nav-false 											{  color: var(--gray); }

/* –––––––––––––––––– P A G E S  –––––––––––––––––– */

.page-content                                               { margin: 0; padding: 0 20px; }
.page-header                                                { margin: 0; padding: 40px 0; grid-column: 1 / span 4; }
.no-content                                                 { margin: 0; padding: 0; grid-column: 1 / span 4; }

.page-main-content                                          { margin: 0 0 40px 0; padding: 0; grid-column: 1 / span 4; }
    .page-main-content p:first-of-type                      { margin-top: 0; }
    .page-main-content p:last-of-type                       { margin-bottom: 0; }

.page-section                                               { margin: 0; padding: 32px 0 20px 0 ; border-top: solid 1px var(--black); }
.page-section:nth-child(odd)                                { grid-column: 1 / span 4; }
.page-section:nth-child(even)                               { grid-column: 1 / span 4; }
    .page-section h2                                        { margin: 0 0 40px 0; }
    .page-section h2 span                                   { display: block; }
    .page-section p:first-of-type                           { margin-top: 0; }
    .page-section p:last-of-type                            { margin-bottom: 0; }

.section-content                                            { margin: 0; padding: 0; }
.section-content h4                                         { margin-bottom: 0; }
.section-content ol                                         { margin: 0 0 0 1.4em; padding: 0; }
.section-content ol li                                      { margin: 0; padding: 0; }
.section-links                                              { margin: 0; padding: 0; list-style: none; }
.section-links h4                                           { margin: 0 0 10px 0; }

.section-content + .section-links                           { margin-top: 40px; }

.page-epilogue                                              { margin: 40px 0 0 0; padding: 0; grid-column: 1 / span 4;  }
.page-disclaimer                                            { margin: 40px 0 0 0; padding: 0; grid-column: 1 / span 4; color: var(--gray); }

/* –––––––––––––––––– F A Q S  –––––––––––––––––– */

.faq-block 													{ margin: 0; padding: 0; grid-column: 1 / span 4; }
.faq-block + .faq-block 									{ margin-top: 48px; }
.faq-block h2 												{ margin-top: 0; }

.faq-questions 												{ margin: 0; padding: 0; display: flex; flex-direction: column; gap: 20px;}

.faq-question-row											{ margin: 0; padding: 0; }
.faq-question												{ margin: 0; padding: 0; cursor: pointer; }
.faq-answer													{ margin: 0; padding: 20px 0; display: none; transition: max-height 0.3s ease-out; }
.faq-links 													{ margin: 10px 0 0 1.25em; }
.faq-links li												{ margin: 0; padding: 0;}

.faq-question-row.active .faq-answer 						{ display: block; }

/* –––––––––––––––––– A C C O R D I O N  –––––––––––––––––– */

.accordion                                                  { margin: 0; padding: 0; grid-column: 1 / span 4; border-top: solid 1px var(--black); }
.accordion-entry                                            { margin: 0; padding: 0; border-bottom: solid 1px var(--black); }

.accordion-header                                           { margin: 0; padding: 32px 0; position: relative; }
.accordion-header .toggle-title                             { margin: 0; padding: 0; cursor: pointer; }
.accordion-header .toggle                                   { width: auto; height: 100%;  margin: 0; padding: 0; position: absolute; top: 0; right: 0; z-index: 900; cursor: pointer; }

.accordion-content                                          { margin: 0; padding: 0 0 32px 0; }
.accordion-extra                                            { margin-top: 32px; color: var(--gray) !important; }
.accordion-message                                          { margin-top: 32px; }

.accordion-content .buttons-block                           { margin-top: 32px; justify-content: flex-start; }


/* –––––––––––––––––– A C C O M M O D A T I O N –––––––––––––––––– */

.accommodation-block                                        { margin: 0; padding: 0 0 40px 0; grid-column: 1 / span 4; border-top: solid 1px var(--black); }
.accommodation-block  h2                                    { margin: 40px 0; }
.accommodation-list                                         { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 20px; }
.accommodation-km                                           { color: var(--gray); }
.accomodation-name                                          { font-weight: bold; }

/* –––––––––––––––––– M A P S –––––––––––––––––– */

.map                                                        { margin: 0 0 120px 0; padding: 0; position: relative; display: flex; flex-direction: column; flex-wrap: nowrap; }
.full-map                                                   { margin: 0; padding: 0; width: auto; height:auto; }
.full-map img                                               { margin: 0; padding: 0; width: 100%; height: auto; }

.map-captions-container                                     { margin: 0; padding: 0 20px 80px 20px; background-color: #FFF;  flex-grow: 1 }
.map-captions                                               { margin: 0; padding: 0; width: 100%; display: table; }
.map-captions ul                                            { margin: 0; padding: 0; list-style: none; display: table-row; width: 100%; background: none; }
.map-captions li                                            { margin: 0; padding: 5px 0; display: table-cell; border-top: solid 1px var(--gray); }
.map-captions li:first-child                                { padding-right: 15px; }

.map-location                                             	{ margin: 0; padding: 0; width: 100% !important; height: 50vh; position: relative; z-index: 800; }


/* –––––––––––––––––– S U P P O R T –––––––––––––––––– */

.logo-wall                                                  { margin: 0; padding: 0 0 40px 0; grid-column: 1 / span 4; list-style: none; }
.logo-wall li                                               { margin: 0; padding: 0; grid-column: span 2; border-top: solid 1px var(--black); display: flex; align-items: center; justify-content: center; }
.logo-wall h4                                               { text-align: center; }


/* –––––––––––––––––– 4 0 4  –––––––––––––––––– */
.notfound                                                   { margin: 0; padding: 0; display: flex; flex-direction: column; position: relative; }
.notfound .message-board                                    { width: 100%; padding: 40px 20px; background-color: #FFF; position: relative; }
.notfound #wallpaper                                        { width: 100%; height: 100vh; }

/* –––––––––––––––––– V I D E O –––––––––––––––––– */

.embed-container                                            {  position: relative;  padding-bottom: 56.25%; overflow: hidden; max-width: 100%; height: auto; } 
.embed-container iframe,
.embed-container object,
.embed-container embed                                      { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* –––––––––––––––––– B U T T O N S –––––––––––––––––– */

.buttons-block                                              { margin: 0; padding: 0; display: flex; flex-direction: row; flex-wrap: wrap; gap: 20px; }

.button                                                     { width: auto; height: 48px !important; margin: 0; padding: 0 24px; border: solid 2px var(--black); border-radius: 24px; background-color: var(--lightgray); color: var(--black); text-decoration: none; display: flex; flex-direction: row; align-items: center; justify-content: center; align-self: flex-start; }
.button:hover                                               { background-color: var(--darkgray); color: var(--lightgray); text-decoration: none; }

.button.dark                                                { background-color: var(--darkgray); color: var(--lightgray); border: solid 2px var(--black); text-decoration: none; }
.button.dark:hover                                          { background-color: var(--lightgray); color: var(--darkgray); border: solid 2px var(--black); text-decoration: none; }

.button.light												{ background-color: var(--white); color: var(--black); border: none; text-decoration: none; }
.button.light:hover											{ background-color: var(--black); color: var(--white); border: none; text-decoration: none; }

.toggle-button                                              { width: 24px; height: 100%;  display: block; margin: 0; padding: 0; }
.icon-plus::before, .icon-plus:after                        { content: ''; width:  100%; height: 100%; position: absolute; background-color: var(--black); }


.toggle-button .icon-plus { 
    width: 24px; height: 2px; display: block; position: absolute; top:  50%; left: 50%; bottom: auto; right: auto;

	-webkit-transform: translateY(-50%) translateX(-50%);
	-moz-transform:    translateY(-50%) translateX(-50%);
	-ms-transform:     translateY(-50%) translateX(-50%);
	-o-transform:      translateY(-50%) translateX(-50%);
	transform:         translateY(-50%) translateX(-50%);
	
	-webkit-transition: background-color 0.3s;
	-moz-transition:    background-color 0.3s;
	transition:         background-color 0.3s; }

.toggle-button .icon-plus::before, .toggle-button .icon-plus:after {
	top: 0; left: 0;
	
	-webkit-transition: -webkit-transform 0.3s, top 0.3s, background-color 0.3s;
	-moz-transition: 	   -moz-transform 0.3s, top 0.3s, background-color 0.3s;
	transition: 			    transform 0.3s, top 0.3s, background-color 0.3s; }

.toggle-button .icon-plus::before {
	-webkit-transform: rotate(0deg);
	-moz-transform:    rotate(0deg);
	-ms-transform:     rotate(0deg);
	-o-transform:      rotate(0deg);
	transform:         rotate(0deg); }

.toggle-button .icon-plus::after {
	-webkit-transform: rotate(90deg);
	-moz-transform:    rotate(90deg);
	-ms-transform:     rotate(90deg);
	-o-transform:      rotate(90deg);
	transform:         rotate(90deg); }

.toggle-button .icon-plus.is-clicked::before {
	-webkit-transform: rotate(135deg);
	-moz-transform:    rotate(135deg);
	-ms-transform:     rotate(135deg);
	-o-transform:      rotate(135deg);
	transform:         rotate(135deg); }

.toggle-button .icon-plus.is-clicked::after {
	-webkit-transform: rotate(225deg);
	-moz-transform:    rotate(225deg);
	-ms-transform:     rotate(225deg);
	-o-transform:      rotate(225deg);
	transform:         rotate(225deg); }

/*
——————————————————————————————————————————
FOOTER
——————————————————————————————————————————
*/

#colophon                                                   { width: 100%; height: auto; margin: 0; padding: 0; color: var(--lightgray); background-color: var(--darkgray); position: sticky; z-index: 0 !important; }
#colophon ul                                                { width: 100%; height: auto; margin: 0; padding: 0; list-style: none; }
#colophon li                                                { width: 100%; height: auto; margin: 0; padding: 0; }
#colophon li a                                              { width: 100%; height: auto; margin: 0; padding: 20px; display: block; position: relative; color: var(--lightgray); text-decoration: none; }

.footer-stamp                                               { grid-row: 1; grid-column: 1 / span 4; margin: 0; padding: 72px 0; display: flex; flex-direction: row; align-items: center; justify-content: center; }
.footer-stamp img                                           { width: auto; height: 150px; }

#footer-footer-menu                                         { grid-row: 2; grid-column: 1 / span 4; border-top: solid 1px var(--midgray); display: flex; flex-direction: column; }
#footer-footer-menu > li > a:first-of-type                  { display: none; }

#footer-footer-menu .sub-menu                               { display: flex; flex-direction: column; }
#footer-footer-menu .sub-menu li                            { border-bottom: solid 1px var(--midgray); }
#footer-footer-menu .sub-menu li a:hover,
#footer-footer-menu .sub-menu li.current-menu-item a,
#footer-footer-menu .sub-menu li.current-menu-item a:hover  { background-color: var(--lightgray); color: var(--darkgray); }

#footer-social-menu                                         { grid-row: 5; grid-column: 1 / span 4; border-top: solid 1px var(--midgray);  display: flex; flex-direction: row;  }
#footer-social-menu li                                      { border-right: solid 1px var(--midgray); }
#footer-social-menu li:last-of-type							{ border-right: none; }
#footer-social-menu li a:hover                              { background-color: var(--lightgray); color: var(--darkgray);  }
#footer-social-menu li a::after                             { content: "\003E"; height: 100%; position: absolute; right: 20px; top: 0; display: flex; align-items: center; justify-content: center; transform: rotate(-45deg); }

.footer-tagline                                             { grid-row: 3; grid-column: 1 / span 4; margin: 0; padding: 72px 0 24px 0; display: flex; flex-direction: row; align-items: center; justify-content: center; }
.footer-copy                                                { grid-row: 4; grid-column: 1 / span 4; margin: 0; padding: 0 0 64px 0;  display: flex; flex-direction: row; align-items: center; justify-content: center; }


/*
——————————————————————————————————————————
C A R O U C E L S
——————————————————————————————————————————
*/

/* –––––––––––––––––– W A L L P A P E R –––––––––––––––––– */

.wallpaper													{ width: 100%;  margin: 0; padding: 0; position: relative; background-color: var(--darkgray);  transition: all 0.5s ease-in-out; }
.wallpaper-cell												{ width: 100%; height: 100%; margin: 0; position: relative; background-position: center; background-size: cover; background-repeat: no-repeat; filter: grayscale(100%); background-blend-mode: multiply; background-color: var(--lightgray); }
.wallpaper-cell												{ opacity: 0; transition: opacity 1.5s ease-in-out; z-index: 0; }

/* –––––––––––––––––– F L I C K I T Y –––––––––––––––––– */

.flickity-enabled                                                   { position: relative; }
.flickity-enabled:focus                                             { outline: none; }
.flickity-viewport                                                  { overflow: hidden; position: relative; height: 100% !important; }
.flickity-slider                                                    { position: absolute; width: 100%; height: 100%; }

/* draggable */
.flickity-enabled.is-draggable                                      { -webkit-tap-highlight-color: transparent; /* tap-highlight-color: transparent; */ -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.flickity-enabled.is-draggable .flickity-viewport                   { cursor: move; cursor: -webkit-grab; cursor: grab; }
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down   { cursor: -webkit-grabbing; cursor: grabbing; }

/* flickity-button */
.flickity-button                                                    { position: absolute; background-color: #E30613; border: none; color: #FFF; }
.flickity-button:hover                                              { cursor: pointer; }
.flickity-button:focus                                              { outline: none; }
.flickity-button:active                                             { opacity: 1; }
.flickity-button:disabled                                           { opacity: 0.3; cursor: auto; pointer-events: none; /* prevent disabled button from capturing pointer up event. #716 */ }
.flickity-button-icon                                               { fill: currentColor; }

/* previous/next buttons */
.flickity-prev-next-button                                          { width: 64px; height: 64px; margin: 0; padding: 0; border-radius: 50%; top: 50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; }
.flickity-prev-next-button.previous                                 { left: 10px; padding-left: 1px; }
.flickity-prev-next-button.next                                     { right: 10px; padding-right: 1px; }
.flickity-prev-next-button .flickity-button-icon                    { width: 30px !important; }

/* right to left */
.flickity-rtl .flickity-prev-next-button.previous                   { left: auto; right: 10px; }
.flickity-rtl .flickity-prev-next-button.next                       { right: auto; left: 10px; }

/* page dots */
.flickity-page-dots                                                 { position: absolute; width: 100%; bottom: 30px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1; }
.flickity-rtl .flickity-page-dots                                   { direction: rtl; }
.flickity-page-dots .dot                                            { display: inline-block; width: 12px; height: 12px; margin: 0 8px; border-radius: 50%; cursor: pointer; border: solid 2px #333333; }
.flickity-page-dots .dot.is-selected                                { background-color: #333333; }

/* flickity-fade */
.flickity-enabled.is-fade .flickity-slider > *                      { pointer-events: none; z-index: 0; }
.flickity-enabled.is-fade .flickity-slider > .is-selected           { pointer-events: auto !important; z-index: 1; }