@charset "utf-8";
address,
article,
aside,
button,
blockquote,
body,
dd,
dialog,
dl,
dt,
fieldset,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
li,
nav,
ol,
p,
pre,
section,
td,
th,
tr,
ul {
  margin: 0;
  padding: 0;
}

body {	
  background: #adaa2e;
  color: #1c1b1c;
  font-family: "Romain";
  margin: 0;
  padding: 0;
  width: 100vw !important;
  font-weight:300;	
  line-height:0;
  text-transform:uppercase;	
  touch-action: manipulation !important;	
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
  height:100%;	
  overflow-x: hidden !important;		
  /*#f8f7f2;*/

}	



@font-face {
  font-family: "Romain";
  src: url("BodoniMTStd Book.otf")
    format("opentype");
}


* {
  box-sizing: border-box;
}


.btn:focus {
  outline: none !important;
  box-shadow: none !important;
}

::-webkit-scrollbar {
  display: none !important; 
  width: 0px !important;	
  opacity: 0 !important; 	
}

html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}



.transition-fade {
    transition: .001s;
    opacity: 1;
	/*transition-delay: .3s;*/
}

html.is-animating .transition-fade {
    opacity: 0;
}


.lazyload,
.lazyloading {
	opacity: 0;
}
.lazyloaded {
	opacity: 1;
	transition: opacity 500ms;
}

h1 {
  font-weight: 300;
  font-size: 1.15vw;
  line-height: 1.45em;
  letter-spacing: 0.05em;
  text-align:center;
  text-transform:uppercase;
}

h2 {
  font-weight: 300;
  font-size: 2.5vw;
  line-height: 1.15em;
  letter-spacing: 0.1em;
}

a {text-decoration:none; color:#1c1b1c;}

.logoHolder {
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

.logoHolder .block {
  will-change: transform, opacity;
}

.justified {
  text-align: justify;
  text-align-last: center;
}

/* XMENU BASE */
.xmenu {
  width: 16vw; /* overwritten dynamically by JS per section */
  margin: 3rem auto;
  padding-top: .25em;
  padding-bottom: .25em;
  padding-right: 1em;
  padding-left: 1em;
  border-radius: 0px;
  overflow: hidden;
  will-change: transform;
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;	
  background: #f7f7f4;
}



.xmenu__head {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0px;
  cursor: pointer;
   will-change: transform;
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;		
}

.xmenu__wrap {
  height: 0;
  overflow: hidden;
  border-top: none;
  border-bottom: none;
  will-change: height;
  contain: layout;
}

.xmenu__list {
  list-style: none;
  margin: 0;
}

.xmenu__item {
  font-family: "Romain";
  overflow: hidden;
  border-bottom: 1px solid #1c1b1c;
}

.xmenu__btn {
  width: 100%;
  text-align: center;
  font-family: "Romain";
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: inherit;
  border: 0;
  cursor: pointer;
}

.xmenu__btn:hover {
  background: rgba(255, 255, 255, 0.03);
}

  .xmenu__item h2 {
    padding-top: 0.25em;
    padding-bottom: 0.25em;
  }

  .date_footer {
    padding-top: 0.25em;
    padding-bottom: 0.25em;
  }


/* SUBMENU WRAP */
.subwrap {
  height: 0;
  overflow: hidden;
  will-change: height;
  contain: layout;
}

.sublist {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: justify;
  text-align-last: center;
  font-weight: 300;
  font-size: 1.5vw;
  line-height: 1.25em;
  letter-spacing: 0.1em;
}

.sublink {
  display: block;
  text-align: center;
  text-decoration: none;
  border-radius: 8px;
}

/* SECTIONS */
.section-title {
  display: none; /* used for text source only */
}

/* PLAYER / TIMER ITEM */
#player {
  width: 100%; /* important: tie to xmenu width */
  margin: auto;
  text-align: center;
  padding: 0;
}

#title {
  opacity: 0;
}

#titleHolder {
  position: fixed;
  bottom: 0;
  left:0;
  width: 100vw;
  overflow: hidden;
  display: flex;
  justify-content:center;
  align-items:center;
  flex-direction:column;
  margin-bottom: 2.5vh;
  z-index:2;
}

/* PROGRESS / TIMER */
#progressContainer {
  position: relative;
  width: 100%;
  height: 3.5vw;
  cursor: pointer;
  z-index: 1;
  background: #f7f7f4;
}

#progressContainer::before {
  content: "";
  position: absolute;
  top: -10px;
  left: 0;
  right: 0;
  bottom: -10px;
  background: transparent;
  z-index: 2;
  pointer-events: auto;
}

#progress {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background:#f7f7f4;
  width: 0%;
  border-radius: 0px;
  z-index:5;
  mix-blend-mode: exclusion;
}

.timer{
  z-index:4;
}

#playhead {
  position: absolute;
  width: 1px;
  height: 1px;
  display: none;
  background: #fff;
  border-radius: 0%;
  cursor: pointer;
}

/* CONTROLS ITEM */
.controls-row {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 1vw;
}

.controls-row .action {
  cursor: pointer;
}

/* TRACK SUMMARY SUBMENU LIST */
.trackSummary {
  max-height: 45vh;
  overflow-y: auto;
  padding: 0;
  background: transparent;
}

.trackSummary .subitem {
  cursor: pointer;
  border-bottom: 1px solid #1c1b1c;
}

.sublink h2 {
  text-align: justify;
  text-align-last: center;
  font-weight: 300;
  font-size: 2.5vw;
  line-height: 1.15em;
  letter-spacing: 0.1em;
  color: #1c1b1c;
  opacity:.2 !important,
}

.trackSummary li {
  font-weight: 300;
  font-size: 1.5vw;
  line-height: 1.25em;
  letter-spacing: 0.1em;
}

.trackSummary .subitem.active h2 {
   color:rgba(28, 27, 28, 1)
}

.trackSummary .subitem h2 {
   color:rgba(28, 27, 28, .2)
}

.trackSummary .subitem:last-child {
  border-bottom: none;
}

/* OPTIONAL: BUTTON RESET */
button {
  background: transparent;
  border: none;
  padding: 0;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.section {
  z-index:100; 
  width:100vw;
  position:relative; 
  min-height:110vh;
  height:auto;
  display:flex; 
  align-items:center; 
  padding-bottom:60vh;
  justify-content:center;
  flex-direction:column;
  pointer-events:none;
  
}

.imgContainer {
  background: #f7f7f4;
  position: relative;
  width: 60vw;
  overflow: hidden;
  margin: 0;
  padding: 0;
  pointer-events:auto;
  cursor:pointer;
}


.imgContainer img {
  display: block;
  width: 100%;
  height: auto;
  mix-blend-mode: multiply;
}

.imgContainer video {
  display: block;
  width: 100%;
  height: auto;
  object-fit:contain;
  mix-blend-mode: multiply;
}

.imgContainerFull {
  background: #f7f7f4;
  position: relative;
  width: 100vw;
  overflow: hidden;
  margin: 0;
  padding: 0;
  pointer-events:auto;
  cursor:pointer;
}

.imgContainerFull img {
  display: block;
  width: 100%;
  height: auto;
  mix-blend-mode: multiply;
}  

.imgContainerFull video {
  display: block;
  width: 100%;
  height: auto;
  object-fit:contain;
  mix-blend-mode: multiply;
}  

.menuHolder{
position:fixed; 
  top:0; 
  left:0; 
  display:flex;
  width:100vw; 
  height:100vh;
  justify-content:center; 
  align-items:center; 
  z-index:2;
}

.menuHolder.menu-open {
  z-index: 1000;
}

.trackSummary {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  width: 100%;
}

.trackSummary::-webkit-scrollbar {
  display: none; /* optional: hide scrollbar */
}

.trackCell {
  scroll-snap-align: start;      /* or "center" if you prefer */
  flex: 0 0 100%;                /* 100% width slide */
  box-sizing: border-box;           /* adjust to taste */
}

.trackCell h2 {
  display: block;
  width: 100%;
  text-align: center;  
   opacity:.2;/* or left/right */
}

.trackCell.active h2 {
  opacity:1;   /* style for active track */
  /* or color change, font change, etc. */
}

.hover-video::-webkit-media-controls {
  display: none !important;
}

.hover-video:hover::-webkit-media-controls {
  display: block !important;
}

.video-embed-container {
    position: relative;
    padding-top: 56.25%; 
    height: 0;
    overflow: hidden;
}

.video-embed-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	border: none !important;
  outline: none !important;
  display: block;
}



@media only screen and (max-width: 800px) {
	
	

	
	
 .xmenu {
  margin: .25rem auto;
  padding-top: .5em;
  padding-bottom: .5em;
  padding-right: 1em;
  padding-left: 1em;
} 
  
.imgContainer {
  background: #f7f7f4;
  position: relative;
  width: 90vw;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.imgContainer img {
  display: block;
  width: 100%;
  height: auto;
  mix-blend-mode: multiply;
}
  
.imgContainer video {
  display: block;
  width: 100%;
  height: auto;
  mix-blend-mode: multiply;
}  
  
.imgContainerFull {
  background: #f7f7f4;
  position: relative;
  width: 100vw;
  overflow: hidden;
  margin: 0;
  padding: 0;
}
   
.imgContainerFull img {
  display: block;
  width: 100%;
  height: auto;
  mix-blend-mode: multiply;
}  

.imgContainerFull video {
  display: block;
  width: 100%;
  height: 80vh;
  object-fit:cover;
  mix-blend-mode: multiply;
}  
  
  .menuHolder{
  position:fixed; 
  padding-top:3.5vh;   
  top:0; 
  left:0; 
  display:flex;
  width:100vw; 
  height:auto;
  justify-content:flex-start; 
  align-items:center; 
}
  
  h1 {
    font-weight: 300;
    font-size: 3.5vw;
    line-height: 1.45em;
    letter-spacing: 0.05em;
  }

  h2 {
    font-weight: 300;
    font-size: 5.5vw;
    line-height: 1.15em;
    letter-spacing: 0.1em;
  }

  #progressContainer {
    position: relative;
    width: 100%;
    height: 9vw;
    cursor: pointer;
    z-index: 1;
  }

  .sublink h2 {
    text-align: justify;
    text-align-last: center;
    font-weight: 300;
    font-size: 5.5vw;
    line-height: 1.25em;
    letter-spacing: 0.1em;
    color: #1c1b1c;
  }

  .xmenu__item h2 {
    padding-top: 0.25em;
    padding-bottom: 0.25em;
  }

  .xmenu__item {
    font-family: "Romain";
    overflow: hidden;
  }
}

}



@supports (-webkit-touch-callout: none) {
  a, button, [role="button"],
  input[type="button"], input[type="submit"], label {
    -webkit-tap-highlight-color: transparent; /* or rgba(0,0,0,0) */
  }

*:focus {
  outline: 0;
  outline: none;
}