/* ------------------------------------------------------------------- */
/* CODE
/* The Anderen • December 2022 • https://theanderen.com
/* ------------------------------------------------------------------- */

*, *:before, *:after{
	margin: 0;
	padding: 0;
	border: 0;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

@font-face {
  font-family: 'SuisseIntl Medium';
  src: url('../fonts/SuisseIntl-Medium.woff2') format('woff2'),
	   url('../fonts/SuisseIntl-Medium.woff') format('woff');
  font-weight:  400;
  font-style:   normal;
  font-stretch: normal;
}
@font-face {
  font-family: 'SuisseIntl Medium Italic';
  src: url('../fonts/SuisseIntl-MediumItalic.woff2') format('woff2'),
	   url('../fonts/SuisseIntl-MediumItalic.woff') format('woff');
  font-weight:  400;
  font-style:   normal;
  font-stretch: normal;
}
@font-face {
  font-family: 'SuisseIntl Bold';
  src: url('../fonts/SuisseIntl-Bold.woff2') format('woff2'),
	   url('../fonts/SuisseIntl-Bold.woff') format('woff');
  font-weight:  400;
  font-style:   normal;
  font-stretch: normal;
}
@font-face {
  font-family: 'SuisseIntl Bold Italic';
  src: url('../fonts/SuisseIntl-BoldItalic.woff2') format('woff2'),
	   url('../fonts/SuisseIntl-BoldItalic.woff') format('woff');
  font-weight:  400;
  font-style:   normal;
  font-stretch: normal;
}



/* ------------------------------------------------------------------- */
/* !$ Base */
/* ------------------------------------------------------------------- */

:root {
  --padding: 1.5rem;
  --text-size: calc(20px + (27 - 20) * ((100vw - 420px) / (2000 - 420)));
  --marker-size: 40px;
  --header-height: calc(var(--padding)/1.5*2 + var(--text-size)*1.1);
  --col-dark:#000;
  --col-dark-off: #1F1F1E;
  --col-light:#FFF;
  --col-medium: #6F6F6F;
  --col-h0: #FF3301; /*(199,174,126)*/
  --col-h1: #FFFF42;
  --col-h2: #F0E9E9;

}

::selection {background: rgba(255,255,66,0.99); color: var(--col-dark);}
::-moz-selection {background: rgba(255,255,66,0.99); color: var(--col-dark);}

.card .title::selection {background: var(--col-dark); color: rgba(255,255,66,0.99);}
.card .title::-moz-selection {background: var(--col-dark); color: color: rgba(255,255,66,0.99);}
.card-content p::selection {background: var(--col-dark); color: rgba(255,255,66,0.99);}
.card-content p::-moz-selection {background: var(--col-dark); color: color: rgba(255,255,66,0.99);}
.card-content .external-link a::selection {background: var(--col-dark); color: rgba(255,255,66,0.99);}
.card-content .external-link a::-moz-selection {background: var(--col-dark); color: color: rgba(255,255,66,0.99);}


input[type="text"]::selection {background: var(--col-dark); color: rgba(255,255,66,0.99);}
input[type="text"]::-moz-selection {background: var(--col-dark); color: color: rgba(255,255,66,0.99);}

.label-info::selection {background: var(--col-dark); color: rgba(255,255,66,0.99);}
.label-info::-moz-selection {background: var(--col-dark); color: color: rgba(255,255,66,0.99);}


::placeholder {
  color: var(--col-dark);
  opacity: 1; /* Firefox */
}
::-ms-input-placeholder { /* Edge 12 -18 */
  color: var(--col-dark);
}

.bg-white {
	background-color: var(--col-light);
}
.bg-black {
	background-color: var(--col-dark);
	color: var(--col-light);
}
.bg-c1 {
	background-color: #F0E9E9;
}
.bg-c2 {
	background-color: #D9DDDE;
}
.bg-c3 {
	background-color: #E4E5DF;
}
.black {
	color: var(--col-dark);
}
.expertise.bg-c1 {
	--color: #F0E9E9;
	background-color: var(--color);
}
.expertise.bg-c2 {
	--color: #D9DDDE;
	background-color: var(--color);
}
.expertise.bg-c3 {
	--color: #E4E5DF;
	background-color: var(--color);
}

.gradient {
	height: calc(var(--padding)*6);
	width: 100%;
	position: absolute;
	z-index: 1;
	bottom: 0;
	pointer-events: none;
}
.gradient.small {
	height: calc(var(--header-height) + var(--padding));
	z-index: 9;
}
.gradient.reversed {
	bottom: inherit;
	top: 0;
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}
.gradient-c1 {
	background: linear-gradient(transparent, #F0E9E9);
}
.gradient-c2 {
	background: linear-gradient(transparent, #D9DDDE);
}
.gradient-c3 {
	background: linear-gradient(transparent, #E4E5DF);
}


html {
	-webkit-text-size-adjust: 100%;
}
body {
	font-weight: normal;
	font-feature-settings: "liga", "dlig", "kern" 1;
	font-kerning: normal;
	-webkit-tap-highlight-color: transparent;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.text, .title {
	word-wrap: break-word;
	overflow-wrap: break-word;
}
.person .title {
	word-wrap: inherit;
	overflow-wrap: inherit;
}

svg {
	overflow: visible;
}
img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* for alt text */
  color: transparent;
  line-height: 1.1;
  vertical-align: bottom; /* remove white space */
}
.pixelated {
	image-rendering: pixelated;
}
figure {
	position: relative;
	width: 100%;
}
figcaption.credits {
	position: absolute;
	right: calc(var(--padding)/3);
	top: 50%;
	text-align: center;
	-webkit-transform: rotate(-90deg) translate(50%, -100%);
	transform: rotate(-90deg) translate(50%, -100%);
	-webkit-transform-origin: 100% 0;
	transform-origin: 100% 0;
	line-height: 1;
}
.template-default figcaption.credits,
.template-map figcaption.credits {
	top: 25%;
}

.hidden {
	display: none;
}


/* ------------------------------------------------------------------- */
/* !$ Link */
/* ------------------------------------------------------------------- */

a,
.filter-reset,
.filter-show,
.mixitup-page-list .mixitup-control {
	color: currentColor;
	opacity: 1;
	text-decoration: none;
	position: relative;
	transition: opacity 0.3s ease-in-out;
}
a.link,
.text p a,
.text li a,
.accordion p a,
.accordion li a,
.link-dark a,
.leaflet-container a,
.page-credits,
.filter-reset,
.filter-show {
	opacity: 0.5;
}
a[href^="mailto:"],
a[href^="tel:"],
.text a[href^="mailto:"],
.text a[href^="tel:"],
.text .button {
	opacity: 1;
}
a:focus {
	outline: none;
}


button {
	font: inherit;
	background: none;
	border: 0;
	color: currentColor;
	cursor: pointer;
}
button:focus, input:focus {
	outline: none;
}
.button {
	border: 1px solid;
	padding: calc(var(--padding)/4) var(--padding);
	border-radius: var(--padding);
	margin: var(--padding) 0;
	display: inline-block;
	opacity: 1;
	overflow: hidden;
	transition: 0.3s ease-in-out;
}
.button:hover {
	opacity: 1 !important;
	color: var(--col-dark);
	transition: 0.1s linear;
}




/* ------------------------------------------------------------------- */
/* !$ Text */
/* ------------------------------------------------------------------- */

body {
	font-family: 'SuisseIntl Medium', sans-serif;
	font-size: calc(20px + (27 - 20) * ((100vw - 420px) / (2000 - 420)));
	line-height: 1.25;
}

h1, .text-L {
	font-size: calc(52px + (100 - 52) * ((100vw - 420px) / (2000 - 420)));
	line-height: 1;
}
h2, .text-M, .text-S h1 {
	font-size: calc(28px + (60 - 28) * ((100vw - 420px) / (2000 - 420)));
	line-height: 1.1;
}
h4 {
	font-size: calc(20px + (27 - 20) * ((100vw - 420px) / (2000 - 420)));
}
h3, h5, h6,
.text-S, small, .leaflet-popup-content,
.text-S h2 {
	font-size: calc(15px + (20 - 15) * ((100vw - 420px) / (2000 - 420)));
	letter-spacing: 0.5px;
	line-height: 1.1;
}
.text-XS, .page-credits {
	font-size: calc(11px + (15 - 11) * ((100vw - 420px) / (2000 - 420)));
	letter-spacing: 0.5px;
	line-height: 1.1;
}
.credits, .leaflet-control-attribution, .mixitup-control-page {
	font-size: calc(9px + (14 - 9) * ((100vw - 420px) / (2000 - 420)));
	letter-spacing: 0.5px;
	line-height: 1;
}


h1, h2, h3, h4, h5, h6  {
	font-weight: normal;
}
.bold, b, strong {
	/* font-family: 'SuisseIntl Bold', sans-serif; */
	font-weight: normal;
	color: var(--col-medium);
}
.commentary {
	color: var(--col-medium);
}
address {
	font-weight: normal;
	font-style: normal;
}
em, i, .italic {
	font-family: 'SuisseIntl Medium Italic', sans-serif;
	font-style: normal;
	color: currentColor;
}
.uppercase, h3 {
	text-transform: uppercase;
}
.lowercase {
	text-transform: lowercase;
}

p:empty {
	display: none;
}
p,
.text ul, .title ul {
	margin-top: calc(var(--text-size)*1.25);
	margin-bottom: calc(var(--text-size)*1.25);
}
.text-S p,
.text.text-S ul {
	margin-top: calc(var(--text-size)*1.1);
	margin-bottom: calc(var(--text-size)*1.1);
}

p:first-child,
.text ul:first-child,
.title ul:first-child,
.map-note p,
.leaflet-popup-content p {
	margin-top: 0 !important;
}
p:last-child,
.text ul:last-child,
.title ul:last-child,
.map-note p,
.leaflet-popup-content p {
	margin-bottom: 0 !important;
}

p + h1, p + h2, p + h3 {
	margin-top: calc(var(--padding)*1.5);
}

h1 + p, h2 + p, .text h2 + ul {
	margin-top:  calc(var(--text-size)*1.25);
}
h3 + p, .text h3 + ul,
.text-S h2 + p, .text.text-S h2 + ul,
.text-S h3 + p, .text.text-S h3 + ul {
	margin-top: calc(var(--text-size)*0.4);
}

.accordion h3 + ul {
	margin-top: calc(var(--padding)/2);
}
.template-person .accordion h3 + ul {
	margin-top: var(--padding);
}


.text ul {
	list-style-type: disc;
	padding-left: var(--text-size);
}
.text ol {
	list-style-type: decimal-leading-zero;
	padding-left: calc(var(--text-size)*2);
}
.text.text-S ul, .text.text-S ol {
	padding-left: calc(var(--text-size)*0.75);
}
.text.text-M ul, .text.text-M ol {
	padding-left: calc(var(--text-size)*1.4);
}


/* ------------------------------------------------------------------- */
/* !$ Container */
/* ------------------------------------------------------------------- */

html {
	scroll-behavior: smooth;
}

body {
	margin: 0 auto;
	width: 100%;
	background-color: var(--col-light);
}

body::-webkit-scrollbar, 
.scroll-container:not(.horizontal)::-webkit-scrollbar {
	display: none;
}
body, 
.scroll-container:not(.horizontal) {
	-ms-overflow-style: none;
	scrollbar-width: none;
}
.scroll-container {
	overflow-y: scroll;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
}


.no-select {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.bg-image {
	width: 100%;
	height: 100%;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
}
.bg-image.contain {
	background-size: contain;
}

.page-header, .page-main, .page-footer {
	position: relative;
}
.page-main {
	z-index: 2;
	-webkit-transform: translate3d(0,0,0); /* fix safari z-index bug with sticky footer */
}

.wrapper {
	position: relative;
	z-index: 1;
	margin: 0;
}
.about .wrapper,
.database .wrapper {
	margin: 0 0 0 var(--padding);
}
.block-container {
	max-width: 1600px;
	margin: 0 auto;
	transition: background-color 0.2s linear;
	padding: 0 var(--padding);
}
.block-container.bg-white {
	padding-top: var(--padding);
	padding-bottom: calc(var(--padding)*3);
	min-height: calc(var(--padding)*10);
}
.template-case .block-container.bg-white {
	padding-bottom: var(--padding);
}


.col:first-child h3 {
	margin-bottom: calc((var(--text-size)*1.33 - var(--text-size)*1.1)*1.25);
}
.info-col {
	padding-right: var(--padding);
}
.info-title,
.info-col {
	margin-bottom: calc((16px * 1.1) + (20 - 16) * 1.1 * ((100vw - 420px) / (2000 - 420)));
}
.info-col.menu-links {
	margin-bottom: 0;
}
.pre-header .info-col.address {
	margin-bottom: 0;
}
.pre-header .info-col.menu-links {
	display: none;
}

.block {
	position: relative;	
	z-index: 1;
	margin: calc(var(--padding)*3) 0;
}
.block:first-child,
.block.diagram {
	margin-top: 0;
}
.block:last-child,
.block.diagram {
	margin-bottom: 0;
}
.block.contact {
	padding-bottom: var(--padding);
}
.block.title {
	margin-bottom: var(--padding);
}
.block.gallery {
	margin-top: var(--padding);
}
.intro .block.title {
	padding: calc(var(--padding)*3) var(--padding) var(--padding) var(--padding);
	margin: 0;
}
.block.text:not(.text-M) + .block.text {
	margin-top: calc(var(--padding)*1.5 * -1);
}
.template-case .block.text:not(.text-M) + .block.text {
	margin-top: 0;
}


.template-person .block.text-M,
.template-case .block.info {
	margin: 0;
}
.template-person .content .block,
.template-case .content .block {
	margin: 0;
	padding-top: calc(var(--header-height) + var(--padding));
}



/* ------------------------------------------------------------------- */
/* !$ Cursor */
/* ------------------------------------------------------------------- */

#cursor, #torch {
	width: calc(var(--padding)*2);
	height: calc(var(--padding)*2);
	position: fixed;
	top: calc(var(--padding)*2 * -1);
	left: calc(var(--padding)*2 * -1);
	pointer-events: none;
	mix-blend-mode: difference;
	z-index: 999999;
	-webkit-transform: scale(0.2);
	transform: scale(0.2);
}
#torch {
	z-index: 3;
	position: absolute;
	-webkit-transform: scale(0);
	transform: scale(0);
	/* mix-blend-mode: darken; */
}
#cursor .dot,
#torch .dot {
	background-color: #FFF;
	border-radius: 100%;
	width: 100%;
	height: 100%;	
}
#torch.disabled {
	display: none;
}

/* ------------------------------------------------------------------- */
/* !$ Header */
/* ------------------------------------------------------------------- */

.footer-overlay {
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: var(--col-light);
}

.pre-header {
	padding: var(--padding);
	position: relative;
	z-index: 1000;
	background-color: rgba(255,255,255,1);
}
.page-header {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	width: 100%;
	z-index: 999;
	background-color: rgba(255,255,255,0.3);
	-webkit-backdrop-filter: blur(9px);
	backdrop-filter: blur(9px);
	-webkit-transform: translate3d(0,0,0);
}
.menu-container {
	padding: calc(var(--padding)*2) var(--padding);
	background-color: var(--col-dark-off);
	color: var(--col-light);
	position: fixed;
	width: 100%;
	top: var(--header-height);
	left: 0;
	-webkit-transform: translateY(-100%);
	transform: translateY(-100%);
	/* transition: padding-bottom 0.3s ease-in-out; */
	max-height: 100vh;
	max-height: calc(var(--vh, 1vh) * 100);
	opacity: 0;
}
.menu-container .menu-primary li:first-child {
	border-top: 1px solid;
}
.menu-container .menu-primary li,
.menu-container .menu-secondary li {
	border-bottom: 1px solid;
}
.menu-container .menu-primary li a,
.menu-container .menu-secondary li a {
	padding: calc(var(--padding)/2) 0;
	display: block;
}

.menu-mobile {
	padding-top: calc(var(--padding)*2);
}
.menu-mobile .info-col {
	display: inline-block;
	vertical-align: text-top;
}

#page-logo {
	position: absolute;
	left: 50%;
	top: 0;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	height: var(--header-height);
	display: flex;
	align-items: center;
	z-index: 3;
}
#page-logo a {
	font-size: 0;
	display: block;
}
#page-logo svg {
	width: 100px;
	-webkit-transform: translate3d(0,0,0);
}

#btn-menu {
	padding: 0 var(--padding);
	text-align: right;
	position: relative;
	z-index: 3;
	/* background-color: rgba(255,255,255,0.3);
	backdrop-filter: blur(9px);
	-webkit-backdrop-filter: blur(9px); */
	height: var(--header-height);
	display: flex;
	align-items: center;
	justify-content: flex-end;
}
#btn-menu .btn {
	cursor: pointer;
	font-size: 0;
}
#btn-menu svg {
	width: 36px;
}

.active a:before,
.list-category li.is-active:before,
.filter-group.dropdown-item.is-active .dropdown-itemTitle.main:before,
.template-case .block.info .info.cat:before,
.grid-view .info.cat:before {
	content: '';
	width: calc(var(--text-size)/3);
	height: calc(var(--text-size)/3);
	border-radius: 100%;
	background-color: var(--col-dark);
	position: absolute;
	left: 0;
	top: 50%;
	-webkit-transform: translate(-175%, -55%);
	transform: translate(-175%, -55%);
}
.active a:before {
	background-color: var(--col-light);
}
.template-case .block.info .info.cat:before,
.grid-view .info.cat:before,
.menu-anchor .active a:before {
	top: calc(var(--text-size)/2.5);
}
.active a:hover {
	opacity: 1;
}

.pin-spacer {
	pointer-events: none;
}
#pre-logo {
	position: absolute;
	z-index: 9;
	right: var(--padding);
	top: var(--padding);
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: flex-end;
	width: 300px;
	-webkit-transform-origin: top right;
	transform-origin: top right;
	opacity: 0;
	pointer-events: none;
}
#pre-logo svg {
	width: 300px;
	height: 82px;
	-webkit-transform: translate3d(0,0,0);
}
/* causes bug on iOS 15.1
#pre-logo .logo .A, #pre-logo .logo .C, #pre-logo .logo .and {
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
}
#pre-logo .logo .R {
	-webkit-transform: translateY(110%);
	transform: translateY(110%);
}
*/

.button-language a {
	margin-right: calc(var(--padding)/4);
}
.button-language a:before {
	content: "/";
}
.button-language a.current {
	opacity: 0.5 !important;
	pointer-events: none;
}


/* ------------------------------------------------------------------- */
/* !$ Sticker */
/* ------------------------------------------------------------------- */

.sticker-container {
	position: absolute;
	top: var(--padding);
	right: var(--padding);
	z-index: 6;
	line-height: 1;
}
.sticker {
	width: calc(var(--text-size)*8);
	height: calc(var(--text-size)*8);
	background-color: var(--col-h1);
	border-radius: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.sticker-container.medium .sticker {
	width: calc(var(--text-size)*10);
	height: calc(var(--text-size)*10);
}
.sticker svg {
	position: absolute;
	top: 2.5%;
	left: 2.5%;
	width: 95%;
	height: 95%;
	-webkit-transform-origin: center;
	transform-origin: center;
	-webkit-animation: rotate 21s infinite linear;
	animation: rotate 21s infinite linear;
}


.sticker:hover svg {
	-webkit-animation-play-state: paused;
	animation-play-state: paused;
}

@-webkit-keyframes rotate {
  0%    { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100%  { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes rotate {
  0%    { transform: rotate(0deg); }
  100%  { transform: rotate(360deg); }
}




/* ------------------------------------------------------------------- */
/* !$ Intro */
/* ------------------------------------------------------------------- */

.intro {
	position: relative;
	color: var(--col-light);
	background-color: var(--col-dark);
	padding-bottom: 50vh;
	padding-bottom: calc(var(--vh, 1vh) * 50);
	min-height: calc(100vh - var(--header-height));
	min-height: calc((var(--vh, 1vh) * 100) - var(--header-height));
}
.home .intro,
.template-person .intro {
	padding-bottom: 25vh;
	padding-bottom: calc(var(--vh, 1vh) * 25);
}
.intro .block.title {
	z-index: 3;
	position: -webkit-sticky;
	position: sticky;
	top: var(--header-height);
	max-width: 1200px;
}
.intro .block.img {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.intro .block.img figure {
	height: 100%;
	background-color: var(--col-dark);
}
.intro .block.img figure.hero-preview {
	position: absolute;
	top: 0;
	left: 0;
}
.intro .block.img figure.hero-image {
	background: none;
}



/* ------------------------------------------------------------------- */
/* !$ About */
/* ------------------------------------------------------------------- */

.about,
.database {
	margin: -50vh auto 0 auto;
	margin: calc(var(--vh, 1vh) * 50 * -1) auto 0 auto;
	position: relative;
	z-index: 3;
	padding-top: calc(var(--padding)*2);
}
.home .about,
.template-person .about {
	margin: -25vh auto 0 auto;
	margin: calc(var(--vh, 1vh) * 25 * -1) auto 0 auto;
}
.template-database .about {
	margin: 0 auto;
	padding-top: 0;
}



/* ------------------------------------------------------------------- */
/* !$ Expertise */
/* ------------------------------------------------------------------- */
.expertise {
	position: relative;
	padding-top: calc(var(--header-height) + var(--padding));
	padding-bottom: calc(var(--header-height) + var(--padding));
	overflow: hidden;
}
.expertise .block.title {
	z-index: 2;
}

.block.diagram {
	margin: calc(var(--text-size)*0.85) 0;
}

.circle-container {
	position: relative;
	height: calc(100vh - var(--header-height)*3);
	height: calc((var(--vh, 1vh) * 100) - var(--header-height)*3);
	max-height: 360px;
	min-height: 360px;
}
.circle {
	width: 55%;
	height: 55%;
	border: 1px solid;
	border-radius: 100%;
	position: absolute;
	text-align: center;
	z-index: 4;
}

.circle:not(.is-active) {
	box-shadow: var(--color) 0px 0px 0px 0.6px;
	mix-blend-mode: hard-light;
}
.circle.is-active {
	background-color: var(--col-light);
	/* mix-blend-mode: difference; */
	z-index: 1;
}
/* media */
.circle:nth-child(1) {
	right: 0;
	top: 0%;
	height: 70%;
}
/* trademarks */
.circle:nth-child(2) {
	left: 0;
	top: 12%;
	width: 60%;
	height: 63%;
}
.circle:nth-child(3),
.circle:nth-child(4) {
	bottom: 0;
	display: flex;
	align-items: end;
	justify-content: center;
}
/* copyright */
.circle:nth-child(3) {
	right: 5%;
	bottom: 7%;
	width: 60%;
	height: 63%;
}
/* design */
.circle:nth-child(4) {
	left: 15%;
	width: 44%;
	height: 44%;
}
.circle:nth-child(1) .title,
.circle:nth-child(2) .title {
	-webkitk-transform: translateY(-150%);
	transform: translateY(-150%);
}
.circle:nth-child(3) .title,
.circle:nth-child(4) .title {
	-webkitk-transform: translateY(130%);
	transform: translateY(130%);
}
.circle .title {
	display: inline-block;
	mix-blend-mode: multiply;
	text-shadow: 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color);
	cursor: pointer;
}


.diagram .list-item {
	position: absolute;
}
.list-category {
	display: inline-block;
	position: relative;
}
.list-category:before {
	content: "";
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: inline-block;
	background-color: var(--color);
	box-shadow: 0 0 calc(var(--padding)*1.5) calc(var(--padding)*1.5) var(--color);
	position: absolute;
	z-index: -1;
	border-top-right-radius: 100%;
	border-bottom-right-radius: 100%;
	opacity: 0.9;
}
.list-category li {
	position: relative;
}
.list-category li span {
	cursor: pointer;
	white-space: nowrap;
}
.list-subcategory .list-item {
	white-space: nowrap;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	pointer-events: none;
	text-align: center;
	color: var(--color);
}
.list-subcategory .list-item.is-active {
	color: var(--col-dark);
	mix-blend-mode: multiply;
	text-shadow: 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color),
				 0px 0px 0.6px var(--color);
	z-index: 3;
} 


.list-case .list-item .card {
	overflow: hidden;
}
.list-case .list-item.is-active .card {
	overflow: inherit;
}
.list-case .list-item {
	z-index: 9;
}
.list-case .list-item:hover {
	z-index: 10;
}
.list-case .list-item .dot {
	width: calc(var(--text-size)/3 + 2px);
	height: calc(var(--text-size)/3 + 2px);
	border-radius: 100%;
	background-color: var(--col-dark);
	cursor: pointer;
	border: 1px solid var(--color);
	transition: 0.1s linear;
	position: relative;
	z-index: 3;
}
.list-case .list-item.is-active:not(.pos-centre) .dot {
	border-color: var(--col-h1);
	/* transition: 0.1s linear; */
}
.list-case .list-item.is-active.pos-centre .dot {
	background-color: var(--color);
	border-color: var(--col-dark);
	/* transition: 0.1s linear; */
}

.list-case .list-item.is-active {
	z-index: 12;
}

.list-case .list-item .tooltip,
.list-case .list-item .card {
	position: absolute;
	z-index: 1;
	top: calc(var(--padding)/6 * -1);
	left: calc(var(--padding)/8 * -1);
	border-radius: calc(var(--text-size)/6);
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.1s linear;
	-webkit-transform: translate3d(0,0,0);
}
.list-case .list-item .tooltip {
	background-color: var(--col-h1);
}
.list-case .list-item .card {
	background-color: var(--col-h1);
}
.list-case .list-item .card:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% + var(--padding)/2);
	height: calc(100% + var(--padding)/2);
	-webkit-transform: translate(calc(var(--padding)/4 * -1), calc(var(--padding)/4 * -1));
	transform: translate(calc(var(--padding)/4 * -1), calc(var(--padding)/4 * -1));
	border-radius: calc(var(--text-size)/6);
	z-index: -1;
	background-color: var(--col-h1);
	opacity: 0;
	transition: opacity 0.1s linear;
}
.list-case .list-item.is-active .card,
.list-case .list-item.is-active .card:before {
	opacity: 1;
	pointer-events: all;
}
.list-case .list-item .tooltip h3,
.list-case .list-item .card .title {
	padding: calc(var(--padding)/8);
	padding-left: var(--padding);
	white-space: nowrap;
	line-height: 1;
	-webkit-transform: translateY(3%);
	transform: translateY(3%);
}

.list-case .list-item.pos-left .tooltip,
.list-case .list-item.pos-left .card {
	left: calc(var(--text-size)/3 + 2px + var(--padding)/8);
	-webkit-transform: translateX(-100%);
	transform: translateX(-100%);
}
.list-case .list-item.pos-left .tooltip h3,
.list-case .list-item.pos-left .card .title {
	padding-left: calc(var(--padding)/8);
	padding-right: var(--padding);
}
.list-case .list-item.pos-centre .card .title,
.list-case .list-item.pos-bottom:not(.pos-left):not(.pos-centre) .card .title  {
	padding-left: calc(var(--padding)/8);
}
.list-case .list-item.pos-centre .card {
	top: calc(var(--padding)/4*3);
}
.list-case .list-item.pos-bottom .card {
	-webkit-transform: translateY(calc(-100% + var(--text-size)/3 + 2px + var(--padding)/4));
	transform: translateY(calc(-100% + var(--text-size)/3 + 2px + var(--padding)/4));
}
.list-case .list-item.pos-left.pos-bottom .card {
	-webkit-transform: translate(-100%, calc(-100% + var(--text-size)/3 + 2px + var(--padding)/4));
	transform: translate(-100%, calc(-100% + var(--text-size)/3 + 2px + var(--padding)/4));
}
.list-case .list-item.pos-centre.pos-bottom .card {
	-webkit-transform: translateY(calc(-100% - var(--text-size)/3 - 2px - var(--padding)/4 - var(--padding)/2));
	transform: translateY(calc(-100% - var(--text-size)/3 - 2px - var(--padding)/4 - var(--padding)/2));
}

.list-case .list-item .card-content {
	padding: 0 calc(var(--padding)/8) calc(var(--padding)/2) calc(var(--padding)/8);
	width: 280px;
}





/* ------------------------------------------------------------------- */
/* !$ People */
/* ------------------------------------------------------------------- */

.people,
.touchpoint,
.related {
	position: relative;
	padding-top: calc(var(--header-height) + var(--padding));
}
.people .block.title {
	display: flex;
	align-items: center;
}
.category {
	margin-top: 0 !important;
	margin-left: calc(var(--padding)/2);
	white-space: nowrap;
}
.category-item {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	margin-right: calc(var(--padding)/6);
}
.category-item .icon,
.person .icon,
.template-person .about .icon,
.mixitup-page-list .mixitup-control-page {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid;
	border-radius: 100%;
	width: calc(var(--padding)/3*2);
	height: calc(var(--padding)/3*2);
	line-height: 1;
}
.category-item .icon span,
.person .icon span,
.template-person .about .icon span,
.mixitup-page-list .mixitup-control-page span {
	-webkit-transform: translate(5%, 5%);
	transform: translate(5%, 5%);
}
.category-item .title,
.template-person .about .title {
	-webkit-transform: translateY(5%);
	transform: translateY(5%);
}

.category-item:first-child .icon,
.person .icon.icon-hex,
.template-person .about .icon.icon-hex {
	border: none;
}
.icon-hex .hex {
	position: absolute;
}
.template-person .about .category-item {
	position: absolute;
	z-index: 2;
	margin-top: calc(var(--header-height) + var(--padding) - var(--padding)/3*2 - var(--padding)/2);
}
.template-person .about .icon {
	position: relative; 
}
.template-person .empty-space {
	padding-bottom: calc(var(--padding)/3*2);
}

.category-item .icon {
	position: relative;
	cursor: pointer;
}
.category-item .icon span {
	z-index: 1;
}
.category-item .title {
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	height: calc(var(--padding)/3*2);
	padding-left: 0;
	max-width: 0;
	-webkit-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
	overflow: hidden;
	line-height: 1;
}
.category-item.is-active .icon + .title {
	max-width: 200px;
	padding: 0 calc(var(--padding)/4);
	transition-duration: 0.15s;
}
.category-item.is-active .icon:not(.icon-hex) {
	background-color: var(--col-dark);
	color: var(--col-light);
	border-color: var(--col-dark);
}
.category-item.is-active .icon.icon-hex {
	color: var(--col-light);
}
.category-item.is-active .icon.icon-hex path {
	fill: var(--col-dark);
	stroke: var(--col-dark);
}



.person {
	position: relative;
	width: 50%;
	height: calc(50vw * 1.25);
	display: inline-block;
	vertical-align: top;
}
.person .link {
	display: block;
	width: 100%;
	height: 100%;
	background-color: var(--bg-color);
	color: var(--color);
	opacity: 1;
}
.person img {
	position: relative;
	z-index: 1;
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.person .title,
.person .icon,
.person .tagline {
	position: absolute;
	bottom: 0;
}
.person .tagline {
	left: 0;
	z-index: 1;
	padding: calc(var(--padding)/2);
	opacity: 0;
	-webkit-transition: 0.15s linear 0.15s;
	transition: 0.15s linear 0.15s;
}
.person .title {
	padding: 0 calc(var(--padding)/2);
	left: 0;
	bottom: calc(var(--padding)/2);
	z-index: 2;
	color: var(--col-light);
	width: 75%;
	max-width: calc(100% - var(--padding)*1.5 - var(--text-size)*2);
}
.person .icon {
	right: calc(var(--padding)/2);
	bottom: calc(var(--padding)/2);
	z-index: 2;
	color: var(--col-light);
}

.person .link .title,
.person .link .icon,
.person .link .icon .hex path:last-child,
.person .link img {
	-webkit-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}

.person .link:hover .title,
.person .link:hover .icon,
.person.current .link .title,
.person.current .link .icon,
.person.is-active .link .title,
.person.is-active .link .icon {
	bottom: calc(var(--padding)*1.5 + var(--text-size)*2);
	-webkit-transition-duration: 0.15s;
	transition-duration: 0.15s;
}
.person .link:hover .title,
.person.current .link .title,
.person.is-active .link .title {
	/* color: var(--bg-color); */
}
.person .link:hover .icon,
.person.current .link .icon,
.person.is-active .link .icon {
	color: var(--color);
}
.person .link:hover .icon .hex path:last-child,
.person.current .link .icon .hex path:last-child,
.person.is-active .link .icon .hex path:last-child  {
	opacity: 0;
	-webkit-transition-duration: 0.15s;
	transition-duration: 0.15s;
}
.person .link:hover img,
.person.current .link img,
.person.is-active .link img {
	padding-right: calc(var(--padding) + var(--text-size)*2);
	padding-bottom: calc(var(--padding) + var(--text-size)*2);
	-webkit-transition-duration: 0.15s;
	transition-duration: 0.15s;
}
.person .link:hover .tagline,
.person.current .link .tagline,
.person.is-active .link .tagline {
	opacity: 1;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}


.person.current {
	pointer-events: none;
}


/* ------------------------------------------------------------------- */
/* !$ Accordion */
/* ------------------------------------------------------------------- */

.accordion-item,
.dropdown-item {
	position: relative;
	/* transition: all 0.3s ease-in-out; */
}
.accordion-item:first-child {
	border-top: 1px solid;
}
.accordion-item {
	border-bottom: 1px solid;
}

.accordion-itemTitle {
	position: relative;
	transition: all 0.3s ease-in-out;
	cursor: pointer;
	padding: calc(var(--padding)/2) 0;
}
.disabled .accordion-itemTitle {
	cursor: inherit;
}
.accordion-itemContent,
.dropdown-itemContent {
	height: 0;
	overflow: hidden;
	transition: margin 0.3s ease-in-out;
}
.accordion-item.is-active .accordion-itemContent {
	margin: calc(var(--padding)/2) 0 calc(var(--padding)*2) 0;
}
.filter-group.dropdown-item.is-active .dropdown-itemContent {
	margin: calc(var(--padding)/4) 0 calc(var(--padding)/2) 0;
}
.filter-wrapper.dropdown-item.is-active .dropdown-itemContent {
	overflow: inherit;
}
.filter-wrapper.dropdown-item.is-active .dropdown-itemContent .dropdown-itemContent {
	overflow: hidden;
}


.accordion-itemTitle .title,
.dropdown-itemTitle {
	position: relative;
	z-index: 2;
}
.button:before,
.accordion-item:before,
.filter-search:before,
.mix a:before {
	content: "";
	width: 0;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background-color: var(--col-h1);
	transition: 0.3s ease-in-out;
	z-index: -1;
}
/* .template-database .mix a:after {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background-color: var(--col-light);
	z-index: -2;
} */
.button:hover:before,
/* .accordion-item:not(.disabled):hover:before, */
/* .filter-search:hover:before, */
.filter-search.is-focus:before,
.mix a:hover:before {
	width: 100%;
	transition: 0.15s linear;
}

.accordion-itemContent h3:first-child {
	margin-top: calc((var(--text-size)*1.33 - var(--text-size)*1.15)*1.5);
}

/* ------------------------------------------------------------------- */
/* !$ Filter */
/* ------------------------------------------------------------------- */

.filter-title {
	margin-bottom: calc(var(--padding)/2);
}
.filter-reset {
	margin-left: calc(var(--text-size)/2);
}
.filter-reset:not(.filter-active) {
	opacity: 0;
	pointer-events: none;
}
.filter-scroller {
	margin-left: calc(var(--padding) * -1);
	padding-left: var(--padding);
	height: calc((28px + (60 - 28) * ((100vw - 420px) / (2000 - 420))) * 1.1 * 4.5 + var(--padding)/2);
}
.filter-scroller .filter-group {
	padding-top: calc(var(--padding)/4);
}
.filter-scroller .filter-group:not(:first-child) {
	margin-top: calc(var(--padding)/4 * -1);
}
.filter-scroller .filter-group:last-child {
	padding-bottom: calc(var(--padding)/4);
}

.scroll-wrapper {
	position: relative;
}
.scroll-icon {
	width: calc(28px + (60 - 28) * ((100vw - 420px) / (2000 - 420)));
	position: absolute;
	right: calc(var(--padding)/4);
	z-index: 1;
}
.scroll-up {
	top: calc(var(--padding)/2);
}
.scroll-down {
	bottom: calc(var(--padding)/2);
}
.scroll-icon.disabled {
	pointer-events: none;
	opacity: 0.3;
}

.filter hr {
	width: 100%;
	height: 1px;
	background: var(--col-dark);
}
.filter hr.bottom {
	margin-top: -1px;
}


/* .mixitup-control-active {
	color: red !important;
} */
.mixitup-control-disabled {
	opacity: 0.3 !important;
	pointer-events: none;
}
.mixitup-page-list {
	white-space: nowrap;
}
.mixitup-page-list .mixitup-control {
	margin-left: calc(var(--padding)/12);
}
.mixitup-page-list .mixitup-control-active {
	pointer-events: none;
	position: relative;
	opacity: 0.3;
}


.filter-item.sub {
	transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}
.filter-item.sub:hover,
.filter-item.sub.is-active {
	background-color: var(--col-dark);
	border-color: var(--col-dark);
	color: var(--col-light);
	transition: 0.1s;
}

.filter-group .dropdown-itemContent {
	line-height: 1;
}
.filter-item.sub {
	border: 1px solid;
	padding: calc(var(--text-size)/4) calc(var(--text-size)/3) calc(var(--text-size)/6) calc(var(--text-size)/3);
	border-radius: calc(var(--text-size)/3);
	line-height: 1;
	margin-bottom: calc(var(--text-size)/3);
	margin-right: calc(var(--text-size)/3);
}
.filter-show {
	margin-top: var(--text-size);
	display: flex;
	align-items: center;
}
.filter-show .icon {
	margin-left: calc(var(--padding)/4);
}

.block.search {
	margin-top: calc((15px + (20 - 15) * ((100vw - 420px) / (2000 - 420))) * 1.1 + var(--padding)/2);
}

.filter-search {
	border-top: 1px solid;
	border-bottom: 1px solid;
	border-radius: calc(var(--text-size)/3);
	width: 100%;
	padding: calc(var(--text-size)/8) calc(var(--padding)/4);
	position: relative;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
}
.filter-search input {
	width: 100%;
}
.filter-search svg {
	width: calc(28px + (60 - 28) * ((100vw - 420px) / (2000 - 420)));
	position: absolute;
	right: calc(var(--padding)/4);
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
.filter-search svg .lens {
	transform-origin: center;
	transform: rotate(45deg);
}

.filter-year {
	position: relative;
	margin-top: calc(var(--text-size)*1.2);
}
.filter-year h3 {
	display: flex;
	justify-content: space-between;
	margin-bottom: calc(var(--text-size)/3);
}
.filter-total {
	margin-top: calc(var(--text-size)*0.8);
	text-align: right;
}


.range-slider {
  position: relative;
  min-height: calc(var(--text-size)/1.5);
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  border: none;
  pointer-events: all;
  width: calc(var(--text-size));
  height: calc(var(--text-size));
  background-color: rgba(0,0,0,0);
  box-shadow: none;
  border-radius: 50%;
  cursor: pointer;
  background-image: radial-gradient(
  	circle closest-side,
  	var(--col-dark) 33.33%,
  	transparent 33.33%,
  	transparent 100%
  );
}
input[type=range]:first-child::-webkit-slider-thumb {
	-webkit-transform: translateX(-33.33%);
	transform: translateX(-33.33%);
}
input[type=range]:last-child::-webkit-slider-thumb {
	-webkit-transform: translateX(33.33%);
	transform: translateX(33.33%);
}

input[type=range]::-moz-range-thumb {
  -webkit-appearance: none;
  appearance: none;
  border: none;
  pointer-events: all;
  width: calc(var(--text-size));
  height: calc(var(--text-size));
  background-color: rgba(0,0,0,0);
  box-shadow: none;
  border-radius: 50%;
  cursor: pointer; 
  background-image: radial-gradient(
	circle closest-side,
	var(--col-dark) 33.33%,
	transparent 33.33%,
	transparent 100%
  );
}
input[type=range]:first-child::-moz-range-thumb {
	-webkit-transform: translateX(-33.33%);
	transform: translateX(-33.33%);
}
input[type=range]:last-child::-moz-range-thumb {
	-webkit-transform: translateX(33.33%);
	transform: translateX(33.33%);
}


input[type=range]::-webkit-slider-thumb:hover {
  
}
input[type=range]::-webkit-slider-thumb:active {
  
}

input[type="range"] {
  -webkit-appearance: none !important; 
  appearance: none !important;
  height: 1px;
  width: 100%;
  top: 50%;
  -webkit-transform: translateY(calc(-50% - 0.5px));
  transform: translateY(calc(-50% - 0.5px));
  position: absolute;
  /*background: rgba(0,0,0,0.3);*/
  background: repeating-linear-gradient(
	  to right,
	  #000000,
	  #000000 1px,
	  transparent 1px,
	  transparent 3px
	);
  /* //background: transparent; */
  pointer-events: none;
}
input[type=range]:focus {
	outline: none;
}


.slider-track {
  position: absolute;
  width: 100%;
  height: 1px;
  top: 50%;
  -webkit-transform: translateY(calc(-50% - 0.5px));
  transform: translateY(calc(-50% - 0.5px));
  background: var(--col-dark); /* Background of the track */
  z-index: 0;
}

.range-slider-input.from {
  height: 0;
  z-index: 1;
}




.icon.view {
	width: calc(28px + (60 - 28) * ((100vw - 420px) / (2000 - 420)));
	margin-right: calc(var(--padding)/2);
	display: inline-block;
	vertical-align: bottom;
}

.controls.sort {
	display: flex;
	padding-bottom: calc(var(--padding)/2);
	border-bottom: 1px solid;
	margin-top: calc(var(--padding)/2);
	position: relative;
	justify-content: space-between;
}
.sort-item {
	position: relative;
	width: 40%;
	line-height: 0;
}
.sort-item.date {
	width: 20%;
}
.sort-item.code,
.sort-item.name,
.sort-item.subcat {
	display: none;
}
.sort-item:last-child {
	text-align: right;
}
.sort-wrapper {
	position: relative;
	display: inline-block;
}
.sort-item .icon {
	position: absolute;
	top: 50%;
	left: 0;
	-webkit-transform: translate(-200%, -50%);
	transform: translate(-200%, -50%);
	transition: opacity 0.3s ease-in-out;
}
.sort-item:not(.is-sorted) .icon {
	opacity: 0;
	transition: 0.1s;
}

.sort-item .control {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.sort-item .control.mixitup-control-active {
	pointer-events: none;
	opacity: 0.3;
} 
.sort-item h3 {
	margin-bottom: 0 !important;
}



/* ------------------------------------------------------------------- */
/* !$ Map */
/* ------------------------------------------------------------------- */

.template-map .block-container.bg-white {
	padding-bottom: var(--padding);
}

#map {
	height: 100vw;
	max-height: calc(100vh - var(--header-height)*4);
	max-height: calc((var(--vh, 1vh) * 100) - var(--header-height)*4);
	font-family: 'SuisseIntl Medium', sans-serif;
}

.leaflet-container {
	background: none;
}
.leaflet-container a {
	color: currentColor;
	-webkit-tap-highlight-color: rgba(0,0,0, 0.4);
}
.leaflet-tile-pane {
	filter: grayscale(1);
}

.leaflet-touch .leaflet-bar {
	box-shadow: none;
	border-radius: 0;
	border: none;
	margin-bottom: calc(var(--padding)/2);
	margin-right: calc(var(--padding)/2);
}
.leaflet-touch .leaflet-bar a:first-child,
.leaflet-touch .leaflet-bar a:last-child {
	border-top-left-radius: 100%;
	border-top-right-radius: 100%;
	border-bottom-left-radius: 100%;
	border-bottom-right-radius: 100%;
}
.leaflet-touch .leaflet-bar a {
	width: var(--marker-size);
	height: var(--marker-size);
	line-height: var(--marker-size);
}
.leaflet-bar a {
	background-color: var(--col-light);
	border: none;
	opacity: 1;
}
.leaflet-bar a:focus {
	background-color: var(--col-dark);
	color: var(--col-light);
}
.leaflet-control-zoom-in span, .leaflet-control-zoom-out span {
	display: none;
}
.leaflet-control-zoom-in {
	margin-bottom: calc(var(--padding)/4);
}
.leaflet-control-zoom-in:before {
	content: "";
	border-right: 1px solid;
	width: calc(40% + 0.5px);
	height: 80%;
	position: absolute;
	top: 10%;
	left: 10%;
	transition: 0.3s ease-in-out;
}
.leaflet-control-zoom-in:after,
.leaflet-control-zoom-out:after {
	content: "";
	border-bottom: 1px solid;
	width: 80%;
	height: calc(40% + 0.5px);
	position: absolute;
	top: 10%;
	left: 10%;
	transition: 0.3s ease-in-out;
}

.leaflet-container .leaflet-control-attribution {
	background: transparent;
	opacity: 0.5;
	padding: calc(var(--padding)/2) calc(var(--marker-size) + var(--padding)) calc(var(--padding)/2) calc(var(--padding)/2);
}
.leaflet-container .leaflet-control-attribution a {
	opacity: 1;
}
.leaflet-control-attribution svg {
	display: none !important;
}

.leaflet-div-icon {
	background: none;
	border: none;
}
.leaflet-map-pane svg,
.leaflet-map-pane svg > * {
	outline: none;
}
.map-marker > * {
	transition: 0.3s ease-in-out;
}

.leaflet-popup {
	left: 0 !important;
	margin: 0;
}
.leaflet-popup-content-wrapper, .leaflet-popup-tip {
	box-shadow: none;
	color: var(--col-dark);
	background-color: transparent;
}
.leaflet-popup-content-wrapper {
	border-radius: 0;
	padding: 0;
}
.leaflet-popup-tip-container {
	display: none;
}
.leaflet-popup-content {
	margin: 0;
	line-height: 1.1;
	color: var(--col-light);
}

#map-data {
	min-height: calc(50vh - var(--padding)*3);
	min-height: calc((var(--vh, 1vh) * 50) - var(--padding)*3);
}
#map-data li {
	margin-top: calc(var(--marker-size)/3);
	margin-bottom: calc(var(--padding)*2);
	padding-left: calc(var(--marker-size) + var(--padding)/2);
	position: relative;
	width: 100%;
}
#map-data li .marker {
	width: var(--marker-size);
	height: var(--marker-size);
	position: absolute;
	left: 0;
	top: calc((var(--marker-size)*1.33 - var(--text-size))/4 * -1);
	border-radius: 100%;
}
.leaflet-marker-pane .leaflet-marker-icon:nth-child(1) circle {
	fill: var(--col-h1);
}
#map-data li:nth-child(1) .marker {
	background-color: var(--col-h1);
}
.leaflet-marker-pane .leaflet-marker-icon:nth-child(2) circle {
	fill: var(--col-h0);
}
#map-data li:nth-child(2) .marker {
	background-color: var(--col-h0);
}
#map-data li.selected .marker {
	background-color: var(--col-light);
}

.leaflet-popup:before {
	content: "";
	width: 200vw;
	height: 200vh;
	background-color: var(--col-dark);
	opacity: 0.7;
	display: block;
	position: absolute;
	left: -100vw;
	top: -100vh;
	pointer-events: none;
	z-index: -1;
}

.leaflet-marker-icon:before {
	content: "";
	width: var(--marker-size);
	height: var(--marker-size);
	background-color: var(--col-dark);
	opacity: 0.7;
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	border-radius: 100%;
	opacity: 0;
	transition: opacity 0.2s linear;
}
.leaflet-marker-icon.disabled:before {
	opacity: 1;
}


/* ------------------------------------------------------------------- */
/* !$ Footer */
/* ------------------------------------------------------------------- */

.page-footer {
	background-color: var(--col-dark-off);
	color: var(--col-light);
	position: -webkit-sticky;
	position: sticky;
	bottom: 0;
	z-index: 1;
}
.page-footer .wrapper {
	padding-top: var(--padding);
	margin: 0 var(--padding);
}
.page-footer .menu-links li {
	display: block;
	margin: 0;
}
.page-footer aside {
	position: absolute;
	bottom: 0;
	right: 0;
}
.menu-footer {
	padding: var(--padding);
	text-align: right;
}
.menu-footer ul {
	border-top: 1px solid rgba(255,255,255, 0.5);
	padding-top: var(--padding);
}
.menu-footer li {
	position: relative;
	margin-bottom: calc(var(--padding)/8);
}
.menu-footer li:last-child {
	margin-bottom: 0;
}


.logout {
	text-align: center;
	padding: calc(var(--padding)/2);
	background-color: var(--col-h1);
}
.logout a {
	display: inline-block;
}



/* ------------------------------------------------------------------- */
/* !$ PAGE Home */
/* ------------------------------------------------------------------- */

.home .page-main {
	
}




/* ------------------------------------------------------------------- */
/* !$ PAGE Default */
/* ------------------------------------------------------------------- */

.template-default .page-main {

}


/* ------------------------------------------------------------------- */
/* !$ PAGE Person */
/* ------------------------------------------------------------------- */

.template-person .page-main .intro {
	background-color: var(--bg-color);
	color: var(--color);
	padding-bottom: 0;
}
.template-person .intro .block.title {
	padding: 0;
	position: relative;
	top: 0;
}
.template-person .intro .block.title h1 {
	padding: calc(var(--padding)*3) var(--padding) var(--padding) var(--padding);
	background-color: #1F1F1E;
	color: var(--col-light);
}
.template-person .intro .block.title ul {
	padding: 0 var(--padding);
}
.template-person .intro .block.title ul span.tab {
	display: inline-block;
	width: var(--padding);
}

.template-person .intro .block.img {
	position: relative;
	height: 100vh;
	height: calc(var(--vh, 1vh) * 100);
	color: var(--col-light);
}


.menu-anchor {
	display: none
}
.content .block .section-title {
	border-top: 1px solid;
	padding-top: calc(var(--padding)/2);
}

.content .block.list li {
	margin: var(--padding) 0;
}
.content .block.list li:last-child {
	margin-bottom: 0;
}
.content .block.list h3.list-title {
	padding-left: var(--padding);
	position: relative;
}
.content .block.list h3.list-title:before {
	content: '';
	width: calc(var(--text-size)/3);
	height: calc(var(--text-size)/3);
	border-radius: 100%;
	background-color: var(--col-dark);
	position: absolute;
	left: 0;
	top: 0;
	-webkit-transform: translateY(60%);
	transform: translateY(60%);
}
.content .block.list h3.list-title + p {
	margin-top: 0;
}
p + .external-link,
ul + .external-link {
	margin-top: calc(var(--text-size)/2 * -1);
}
.template-case ul + .external-link {
	margin-top: calc(var(--padding)/2);
}
.external-link a {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
}
.template-case .external-link a {
	align-items: end;
	white-space: inherit;
}
.back-link {
	line-height: 0.7;
	margin-right: var(--padding);
}
.back-link a {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
}
.external-link svg,
.back-link svg {
	height: calc(var(--text-size)*0.8);
	transition: 0.3s ease-in-out;
	-webkit-transform: translate3d(0,0,0);
}
.external-link svg {
	margin-left: calc(var(--padding)/4);
}
.back-link svg {
	margin-right: calc(var(--padding)/4);
}
.external-link.text-XS svg {
	height: calc(var(--text-size)*0.5);
}
.external-link a:hover svg {
	-webkit-transform: translateX(10%);
	transform: translateX(10%);
	transition-duration: 0.15s;
}
.back-link a:hover svg {
	-webkit-transform: translateX(-10%);
	transform: translateX(-10%);
	transition-duration: 0.15s;
}
.external-link.multiple h5,
.external-link.multiple li {
	margin-bottom: calc(var(--padding)/4);
}
.external-link.multiple li:last-child {
	margin-bottom: 0;
}
.external-link.multiple h5 {
	opacity: 0.5;
}

.ticker-list {
	margin-top: var(--padding); 
}
.ticker-item {
	border-bottom: 1px solid;
	overflow: hidden;
	position: relative;
}
.ticker-item:first-child {
	border-top: 1px solid;
}
.ticker-item::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: repeating-linear-gradient(
	  to right,
	  var(--col-dark),
	  var(--col-dark) 1px,
	  var(--col-light) 1px,
	  var(--col-light) 4%
	);
}
.ticker-item::after {
	content: "";
	position: absolute;
	height: 100%;
	right: 0;
	top: 0;
	border-right: 1px solid;
}
.ticker-item .item-wrapper {
	position: relative;
	z-index: 1;
	background-color: var(--col-light);
	padding: calc(var(--padding)/2) var(--padding);
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	-webkit-transform: translateX(100vw);
	transform: translateX(100vw);
	-webkit-animation: ticker 21s infinite linear;
	animation: ticker 21s infinite linear;
	height: 100%;
}
.ticker-item:nth-child(2n+2) .item-wrapper {
	-webkit-animation-delay: 4.5s;
	animation-delay: 4.5s;
}
.ticker-item:nth-child(3n+3) .item-wrapper {
	-webkit-animation-delay: 9s;
	animation-delay: 9s;
}
.ticker-item:nth-child(4n+4) .item-wrapper {
	-webkit-animation-delay: 13.5s;
	animation-delay: 13.5s;
}

.ticker-item .item-wrapper:hover {
	-webkit-animation-play-state: paused;
	animation-play-state: paused;
	cursor: default;
}

.ticker-item .item-wrapper > * {
	display: inline-block;
	vertical-align: bottom;
}
.ticker-item .title {
	margin-right: calc(var(--padding)/2);
}
.ticker-item .note {
	margin-left: calc(var(--padding)/2);
}

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




/* ------------------------------------------------------------------- */
/* !$ PAGE Text */
/* ------------------------------------------------------------------- */

.template-text .footer-overlay,
.template-text .page-main,
.template-error .page-main .intro  {
	background-color: var(--bg-color);
}
.template-error .page-main .intro {
	color: var(--color);
}
.template-text .page-header {
	color: var(--col-light);
	background-color: rgba(0,0,0,0.7);
}
.template-text #page-logo svg {
	fill: var(--col-light);
}
.template-text #btn-menu line {
	stroke: var(--col-light);
}

.template-text .about {
	margin: -75vh auto 0 auto;
	margin: calc(var(--vh, 1vh) * 75 * -1) auto 0 auto;
}
.template-text .intro {
	padding-bottom: 75vh;
	padding-bottom: calc(var(--vh, 1vh) * 75);
}

.template-text .footer-overlay,
.template-text .page-main {
	background-color: var(--bg-color);
}
.template-text .page-main .intro{
	color: var(--color);
	background-color: transparent;
}
.template-text .page-main .touchpoint {
	color: var(--color);
}

.template-text .list-title {
	margin-bottom: calc(var(--padding)*1.5);
}
.template-text .list-item {
	border-top: 1px solid;
	margin: calc(var(--padding)*1.5) 0;
	padding-top: calc(var(--padding)/8);
}
.template-text .list-item:first-child {
	margin-top: 0;
}
.template-text .list-item:last-child {
	margin-bottom: 0;
}



/* ------------------------------------------------------------------- */
/* !$ PAGE Database */
/* ------------------------------------------------------------------- */


.database .block-container.bg-white {
	min-height: inherit;
}
.database .block-container.bg-white:first-child {
	padding-bottom: calc(var(--padding)*1.5);
}
.database .block-container.bg-white:last-child {
	padding-bottom: calc(var(--padding)*2);
}

.block.filter {
	margin-top: 0;
	margin-bottom: calc(var(--padding)*1.1);
}

.block.switch-view {
	margin: 0;
}
.block.switch-view.list-view {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 2;
	background-color: var(--col-light);
}
.block.switch-view .controls.view {
	height: var(--header-height);
	display: flex;
	align-items: center;
	justify-content: space-between;
}


.controls.view .icon-wrapper {
	position: relative;
}
.controls.view .title {
	position: absolute;
	left: calc(100% - var(--padding)/4);
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	white-space: nowrap;
	padding-left: 0;
	max-width: 0;
	-webkit-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
	overflow: hidden;
	display: none;
	line-height: 1;
}


.block.data {
	margin-bottom: calc(var(--padding)/2);
}
.block.data-page {
	margin-top: calc(var(--padding)/2);
	display: flex;
	justify-content: space-between;
	align-items: baseline;
}


.block.data.list-view {
	margin-top: 0;
}
.block.data.grid-view {
	margin-top: var(--padding);
}

.related .block.grid {
	margin-top: var(--padding);
}

.switch-view.list-view .icon.list,
.switch-view.grid-view .icon.grid {
	pointer-events: none;
}
.switch-view.list-view .icon.list,
.switch-view.grid-view .icon.grid {
	opacity: 0.3;
	transition: opacity 0.3s ease-in-out;
}

.switch-view.grid-view .controls.sort {
	display: none;
}

.data.list-view {
	padding-top: calc(var(--padding)/2);
}
.list-view .mix {
	margin-top: calc(var(--padding)/2 * -1);
}
.grid-view .mix {
	border-top: 1px solid;
}


.data .mix a {
	display: inline-block;
	width: 100%;
	height: 100%;
	position: relative;
	vertical-align: bottom;
}
.data.list-view .mix a {
	padding-top: calc(var(--padding)/2 + (var(--text-size)*1.33 - var(--text-size)*1.15)*1.5);
	padding-bottom: calc(var(--padding)/2);
}
.data.grid-view .mix a {
	padding-top: calc(var(--padding)/2);
	padding-bottom: var(--padding);
}
.list-view-wrapper,
.grid-view-wrapper {
	position: relative;
}

.data.list-view .info {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.data.list-view .code {
	padding-right: calc(var(--padding)*5);
}
.data.list-view .cat {
	padding-right: calc(var(--padding)/2);
}

.data.list-view .grid-view-wrapper,
.data.grid-view .list-view-wrapper {
	display: none;
}

.data.list-view .cat,
.data.list-view .subcat,
.data.list-view .name {
	width: 100%;
}
.data.list-view .date {
	position: absolute;
	top: 0;
	right: 0;
	padding-right: 0;
}


.block.data.grid-view  {
	display: grid;
	grid-template-columns: 1fr;
}

.template-case .block.info .info.date,
.data.grid-view .info.date {
	position: absolute;
	right: 0;
	top: 0;
	margin-right: 0;
}
.data.grid-view .info.cat {
	margin-bottom: calc((var(--text-size)*1.33 - var(--text-size)*1.1)*1.25);
	padding-right: calc(var(--padding)*4);
}
.template-case .block.info .info.cat,
.data.grid-view .info.cat {
	position: relative;
	margin-left: calc(var(--text-size)/3*1.75);
	margin-right: calc(var(--padding)/2);
}

.data.grid-view .info.code,
.data.grid-view .info.name {
	display: inline-block;
	vertical-align: baseline;
	margin-right: calc(var(--padding)/2);
}

.button-tour {
	position: absolute;
	top: 0;
	right: var(--padding);
	background-color: var(--col-h1);
	-webkit-transform: translateY(-66.66%) rotate(15deg);
	transform: translateY(-66.66%) rotate(15deg);
	width: calc(var(--text-size)*4.5);
	height: calc(var(--text-size)*4.5);
	border-radius: 100%;
	text-align: center;
	padding: calc(var(--padding)/2);
	transition: 0.3s ease-in-out;
}

.label-tour {
	padding: calc(var(--padding)/2) calc(var(--padding)/2) calc(var(--padding)/2.2) calc(var(--padding)/2);
	background-color: var(--col-h1);
	border-radius: calc(var(--text-size)/6);
	position: absolute;
	z-index: 3;
	max-width: 440px;
	display: none;
	opacity: 0;
}
.label-tour:before {
	content: "";
	width: calc(var(--padding)/2);
	height: calc(var(--padding)/2);
	background-color: var(--col-h1);
	-webkit-transform-origin: center;
	transform-origin: center;
	-webkit-transform: translate(0, -50%) rotate(45deg);
	transform: translate(0, -50%) rotate(45deg);
	position: absolute;
	top: 0;
	left: calc(var(--padding)/2);
}
.label-info {
	padding-right: calc(var(--padding)*1.5);
}
.label-tour svg {
	width: calc(28px + (60 - 28) * ((100vw - 420px) / (2000 - 420)));
	position: absolute;
	right: calc(var(--padding)/2 - 4.5px);
	top: calc(var(--padding)/2 - 4.5px);
}
.label-nav span {
	pointer-events: none;
}
.label-nav {
	display: flex;
	justify-content: space-between;
	align-items: end;
	margin-top: var(--padding);
}




/* ------------------------------------------------------------------- */
/* !$ PAGE Case */
/* ------------------------------------------------------------------- */

.template-case .page-main .intro {
	background-color: var(--bg-color);
	color: var(--color);
}
.template-case .intro .block.title {
	max-width: 1000px;
}

.template-case .block .commentary {
	padding-left: var(--padding);
}
.template-case .block .commentary h3 {
	padding-top: calc((var(--text-size)*1.33 - var(--text-size)*1.1)*1.25);
}

.template-case .block.info {
	padding-right: calc(var(--padding)*4);
}
.template-case .grid-view {
	margin: 0;
}

.template-case .block.info .info {
	margin-right: calc(var(--padding)/2);
	margin-bottom: calc((var(--text-size)*1.33 - var(--text-size)*1.1)*1.25);
}
.template-case .block.info .info.code,
.template-case .block.info .info.name {
	display: inline-block;
	vertical-align: top;
}

.template-case  .block.links {
	display: flex;
	justify-content: space-between;
	align-items: end;
}
.external-link.mobile {
	text-align: right;
}
.external-link.mobile.multiple {
	margin-top: calc((var(--text-size)*1.1 - var(--text-size)*0.95)*1.25);
}

.term {
	text-decoration: underline;
	text-decoration-thickness: 1px;	
	text-decoration-color: var(--col-medium);
}
.block.text .card {
	position: relative;
	color: var(--col-dark);
	font-family: 'SuisseIntl Medium', sans-serif;
	z-index: 1;
}
.block.text .card.is-active {
	z-index: 2;
}
.block.text .card .dot {
	position: relative;
	padding: 0 calc(var(--padding)/3);
	z-index: 2;
	cursor: pointer;
}
.block.text .card .dot:before {
	content: '';
	width: calc(var(--text-size)/1.33);
	height: calc(var(--text-size)/1.33);
	border-radius: 100%;
	background-color: var(--col-dark);
	position: absolute;
	left: calc(var(--padding)/2.5);
	top: 50%;
	transform-origin: center;
	-webkit-transform-origin: center;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	opacity: 0.5;
	transition: 0.3s ease-in-out;
}
.block.text .card.is-active .dot:before {
	opacity: 1;
	transition: 0.1s linear;
	content: '';
	width: calc(var(--text-size)/3);
	height: calc(var(--text-size)/3);
	background-color: var(--col-dark);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.block.text .card-content {
	position: absolute;
	display: block;
	left: calc(var(--text-size)/4.5);
	width: 140px;
	z-index: 1;
	border-radius: calc(var(--text-size)/6);
	padding: 0 calc(var(--padding)/8) calc(var(--padding)/2) calc(var(--padding)/8);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease-in-out;
}
.block.text .card.pos-right .card-content {
	right: 0;
	left: inherit;
}

.block.text .card-content:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% + var(--padding)/4);
	height: calc(100% + var(--padding)/4 + var(--padding)/4 + var(--text-size)/1.5);
	-webkit-transform: translate(calc(var(--padding)/4 * -1), calc(var(--padding)/4 * -1));
	transform: translate(calc(var(--padding)/4 * -1), calc((var(--padding)/4 + var(--padding)/8 + var(--text-size)/1.5) * -1));
	border-radius: calc(var(--text-size)/6);
	z-index: -1;
	background-color: var(--col-h1);
}
.block.text .card.is-active:before {
	opacity: 1;
}
.block.text .card.is-active .card-content {
	transition: opacity 0.1s linear;
	opacity: 1;
	pointer-events: all;
}


/* ------------------------------------------------------------------- */
/* !$ PAGE Maintenance */
/* ------------------------------------------------------------------- */

.template-maintenance:not(.logged-in) .page-main {
	margin-top: 0;
}

/* ------------------------------------------------------------------- */
/* !$ Error */
/* ------------------------------------------------------------------- */


.template-error .page-main .intro {
	color: var(--col-light);
	background-color: #353535;
	min-height: 100vh;
	min-height: calc(var(--vh, 1vh) * 100);
}

.template-error .page-section .wrapper {
	padding: calc(100vw/var(--scale-factor)*0.85 + var(--padding)*2.25) var(--padding);
}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* !$ ~~~~~~~~~~ Media Queries */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

@media screen and (max-device-width: 736px){
	body{
		-webkit-text-size-adjust: none;
	}
}


/* ------------------------------------------------------------------- */
/* !$ screen > 440px */
/* ------------------------------------------------------------------- */

@media all and (min-width: 440px) {

/* database list show subcat */
.data.list-view .cat,
.data.list-view .subcat {
	display: inline-block;
	vertical-align: top;
}
.data.list-view .cat {
	width: 40%;
}
.data.list-view .subcat {
	width: 60%;
}

.sort-item.subcat {
	display: block;
}

}


/* ------------------------------------------------------------------- */
/* !$ screen > 600px */
/* ------------------------------------------------------------------- */

@media all and (min-width: 600px) {

:root {
  --padding: 2rem;
}

.sticker {
	width: calc(var(--text-size)*10);
	height: calc(var(--text-size)*10);
}
.sticker-container.medium .sticker {
	width: calc(var(--text-size)*13);
	height: calc(var(--text-size)*13);
}

.person {
	width: 33.33%;
	height: calc(33.33vw * 1.25);
}

.page-footer .info-col {
	display: inline-block;
	vertical-align: text-top;
}
.menu-footer ul {
	border-top: none;
	padding-top: 0;
}
.menu-footer li {
	display: inline-block;
	margin-left: var(--padding); 
}
.menu-footer li:first-child {
	margin-left: 0;
}
.page-footer aside {
	top: var(--padding);
}

.circle-container {
	max-height: 600px;
}




}

/* ------------------------------------------------------------------- */
/* !$ screen > 720px */
/* ------------------------------------------------------------------- */

@media all and (min-width: 720px) {


.sort-item.name {
	display: block;
}
.sort-item.date {
	width: 10%;
}
.sort-item {
	width: 30%;
}

.data.list-view .cat {
	width: 30%;
}
.data.list-view .subcat {
	width: 30%;
	padding-right: calc(var(--padding)/2);
}
.data.list-view .name {
	width: 40%;
	display: inline-block;
	vertical-align: top;
}

/* switch database filter/search size */

.database .block.filter,
.database .block.search {
	display: inline-block;
	width: 50%;
	vertical-align: top;
}
.database .block.filter {
	padding-right: calc(var(--padding)/2);
}
.database .block.search {
	padding-left: calc(var(--padding)/2);
}

.label-tour {
	width: 33.33vw;
	max-width: 480px;
}
#tourFilter {
	top: calc(var(--padding)/2 * -1);
	left: calc(var(--text-size)*3.5);
}
#tourSearch {
	top: calc(var(--padding)/3);
	left: inherit;
	right: calc(var(--padding)/2 * -1);
}
#tourYear {
	top: calc(var(--padding)/2 * -1);
	left: calc(var(--text-size)*3);
}
#tourView {
	top: calc(var(--padding)/3);
	left: calc((28px + (60 - 28) * ((100vw - 420px) / (2000 - 420))) * 2 + var(--padding)*1.25);
}
#tourSort {
	top: calc(var(--padding)*2.15);
	left: inherit;
	right: calc(var(--text-size)*3.75);
}

.label-tour:before {
	-webkit-transform: translate(-50%, 0%) rotate(45deg);
	transform: translate(-50%, 0%) rotate(45deg);
	position: absolute;
	top: calc(var(--padding)/2);
	left: 0;
}
#tourSort.label-tour:before {
	-webkit-transform: translate(50%, 0%) rotate(45deg);
	transform: translate(50%, 0%) rotate(45deg);
	left: inherit;
	right: 0;
}

.block.text .card-content {
	width: 210px;
}


}

/* ------------------------------------------------------------------- */
/* !$ screen > 840px */
/* ------------------------------------------------------------------- */

@media all and (min-width: 840px) {

/* switch to desktop menu */

.active a:before {
	background-color: var(--col-dark);
}

.page-credits {
	font-size: calc(9px + (14 - 9) * ((100vw - 420px) / (2000 - 420)));
}

#btn-menu {
	display: none;
}
.menu-container {
	padding: calc(var(--padding)/1.5) var(--padding);
	-webkit-transform: translateY(0%);
	transform: translateY(0%);
	opacity: 1;
	background: none;
	color: var(--col-dark);
	position: relative;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-height: inherit;
	opacity: 1;
	height: var(--header-height);
}
.template-text .menu-container {
	color: var(--col-light);
}
.menu-container .menu-primary li:first-child {
	border-top: none;
}
.menu-container .menu-primary li,
.menu-container .menu-secondary li {
	border-bottom: none;
}
.menu-container .menu-primary li a,
.menu-container .menu-secondary li a {
	padding: 0;
	display: inherit;
}
.menu:not(.menu-links) li {
	display: inline-block;
	margin: 0 calc(var(--padding)/2); 
	position: relative;
}
.menu:not(.menu-links) li:first-child {
	margin-left: 0;
}
.menu:not(.menu-links) li:last-child {
	margin-right: 0;
}
.menu-mobile {
	display: none;
}
#page-logo svg {
	fill: var(--col-dark) !important;
}
.template-text #page-logo svg {
	fill: var(--col-light) !important;
}

#map-data li {
	display: inline-block;
	vertical-align: top;
	width: 50%;
}

.template-default figcaption.credits,
.template-map figcaption.credits {
	top: 50%;
}

.wrapper,
.about .wrapper,
.database .wrapper {
	margin: 0 var(--padding);
}

.pre-header .info-col {
	-webkit-transform: translateY(0) !important;
	transform: translateY(0) !important;
}
.pre-header .info-col.address {
	margin-bottom: calc((16px * 1.1) + (20 - 16) * 1.1 * ((100vw - 420px) / (2000 - 420)));
}
.pre-header .info-col.menu-links {
	display: inline-block;
}
.col,
.info-col {
	display: inline-block;
	vertical-align: text-top;
}
.col:first-child {
	width: 33.33%;
	padding-right: calc(var(--padding)/2);
}
.col:last-child {
	width: 66.66%;
	padding-left: calc(var(--padding)/2);
}
.col:first-child h3 {
	margin-top: calc((var(--text-size)*1.33 - var(--text-size)*1.1)*1.25);
}
body:not(.template-person) .accordion-item .accordion-itemTitle .title {
	max-width: 33.33%;
	padding-right: calc(var(--padding)/2);
}
body:not(.template-person) .accordion-item .accordion-itemContent {
	margin-left: 33.33%;
	position: relative;
	z-index: 1;
	padding-left: calc(var(--padding)/2);
}
body:not(.template-person) .accordion-item.is-active .accordion-itemContent {
	margin-top: calc((var(--padding)/2 + var(--text-size)*1.25) * -1);
}
body:not(.template-person) .accordion .note {
	margin-left: 33.33%;
}


.expertise .block.title,
.block.diagram {
	display: inline-block;
	vertical-align: top;
	overflow: inherit;
}
.expertise .block.title {
	width: 33.33%;
}
.block.diagram {
	width: 66.66%;
}
.circle-container {
	max-height: inherit;
	min-height: 600px;
}

.template-person .page-main .intro {
	padding-bottom: 25vh;
	padding-bottom: calc(var(--vh, 1vh) * 25);
}
.template-person .intro .block.title {
	width: 50%;
	position: -webkit-sticky;
	position: sticky;
	top: var(--header-height);
}
.template-person .intro .block.img {
	position: absolute;
	height: 100%;
	width: 50%;
	left: 50%;
	margin: 0;
}

.category-item .icon span,
.person .icon span,
.template-person .about .icon span {
	-webkit-transform: translate(5%, 1%);
	transform: translate(5%, 1%);
}
.category-item .title,
.template-person .about .title {
	-webkit-transform: translateY(1%);
	transform: translateY(1%);
}

.content,
.menu-anchor {
	display: inline-block;
	vertical-align: top;
}
.content {
	width: 66.66%;
}
.menu-anchor {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	padding-left: var(--padding);
	padding-top: calc(var(--header-height) + var(--padding));
	width: 33.33%;
}
.menu-anchor li.anchor:first-child {
	border-top: 1px solid;
}
.menu-anchor li.anchor {
	border-bottom: 1px solid;
	padding: calc(var(--padding)/2) 0;
}
.menu-anchor li.anchor a {
	display: inline-block;
	vertical-align: bottom;
}
.menu-anchor li.anchor span {
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
}

.ticker-item .item-wrapper {
	-webkit-transform: translateX(66.66vw);
	transform: translateX(66.66vw);
}
@-webkit-keyframes ticker {
  0%    { -webkit-transform: translateX(66.66vw); transform: translateX(66.66vw); }
  100%  { -webkit-transform: translateX(-100%); transform: translateX(-100%); }
}
@keyframes ticker {
  0%    { transform: translateX(66.66vw); }
  100%  { transform: translateX(-100%); }
}


.external-link.mobile {
	display: none;
}
.template-case .external-link a {
	white-space: nowrap;
}

.template-case .block .commentary {
	padding-left: calc(var(--padding)*2);
}
.block.text .card-content {
	width: 280px;
}


/* switch database grid view size */

.block.data.grid-view {
	grid-template-columns: 1fr 1fr;
	column-gap: var(--padding);
}

.controls.view .title {
	display: inline-block;
}


}



/* ------------------------------------------------------------------- */
/* !$ screen > 1000px */
/* ------------------------------------------------------------------- */

@media all and (min-width: 1000px) {


.col:first-child,
.col:last-child {
	width: 50%;
}
.template-text .col:first-child {
	width: 33.33%;
}
.template-text .col:last-child {
	width: 66.66%;
}

#map-data li {
	width: 33.33%;
}

body:not(.template-person) .accordion-item .accordion-itemTitle .title {
	max-width: 50%;
}
body:not(.template-person) .accordion-item .accordion-itemContent {
	margin-left: 50%;
}
body:not(.template-person) .accordion .note {
	margin-left: 50%;
}

.person {
	width: 25%;
	height: calc(25vw * 1.25);
}

.expertise .block.title {
	width: 25%;
}
.block.diagram {
	width: 75%;
}



/* database list show all columns */

.sort-item.code,
.sort-item.date {
	width: 12.5%;
}
.sort-item.code {
	display: block;
}
.sort-item {
	width: 25%;
}

/* .data.list-view {
	padding-top: calc(var(--padding)/3);
}
.list-view .mix {
	margin-top: calc(var(--padding)/3 * -1);
} */
.data.list-view .mix a {
	padding-top: calc(var(--padding)/2);
}

.data.list-view .code {
	position: relative;
	top: calc((var(--text-size)*1.33 - var(--text-size)*1.1)*1.25);
	padding-right: calc(var(--padding)/2);
	display: inline-block;
	vertical-align: top;
	width: 12.5%;
}
.data.list-view .cat, 
.data.list-view .subcat {
	width: 25%;
}
.data.list-view .name {
	width: 25%;
}
.data.list-view .date {
	top: calc((var(--text-size)*1.33 - var(--text-size)*1.1)*1.25);
}





}


/* ------------------------------------------------------------------- */
/* !$ screen > 1200px */
/* ------------------------------------------------------------------- */

@media all and (min-width: 1200px) {

#pre-logo {
	width: calc(600px * 1.4);
}
#pre-logo svg {
	width: calc(600px * 1.4);
	height: calc(164px * 1.4);
}

.person {
	width: 20%;
	height: calc(20vw * 1.25);
}



}



/* ------------------------------------------------------------------- */
/* !$ screen > 1440px */
/* ------------------------------------------------------------------- */

@media all and (min-width: 1440px) {



.ticker-item::before {
	background: repeating-linear-gradient(
	  to right,
	  var(--col-dark),
	  var(--col-dark) 1px,
	  var(--col-light) 1px,
	  var(--col-light) 2%
	);
}



}


/* ------------------------------------------------------------------- */
/* !$ screen > 1600px */
/* ------------------------------------------------------------------- */

@media all and (min-width: 1600px) {


.sticker {
	width: calc(var(--text-size)*11);
	height: calc(var(--text-size)*11);
}
.sticker-container.medium .sticker {
	width: calc(var(--text-size)*15);
	height: calc(var(--text-size)*15);
}


}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* !$ ~~~~~~~~~~ Hover */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

@media (hover: hover) {

a:hover,
.filter-reset:hover,
.filter-show:hover,
.mixitup-page-list .mixitup-control:hover {
	transition: color 0.1s linear, opacity 0.1s linear;
}
a:hover {
	opacity: 0.5;
}
a.link:hover,
.text p a:hover,
.text li a:hover,
.accordion p a:hover,
.accordion li a:hover,
.link-dark a:hover,
.leaflet-container a:hover,
.filter-reset:hover,
.filter-show:hover,
.mix a:hover,
.sticker:hover,
.block.text .card:hover .dot:before{
	opacity: 1;
}
a[href^="mailto:"]:hover,
a[href^="tel:"]:hover,
.text a[href^="mailto:"]:hover,
.text a[href^="tel:"]:hover,
.text .button:hover,
.mixitup-page-list .mixitup-control:hover  {
	opacity: 0.5;
}

.button-tour:hover {
	transition: 0.15s linear;
	-webkit-transform: translateY(-66.66%) rotate(0deg);
	transform: translateY(-66.66%) rotate(0deg);
}

.accordion-item:not(.disabled):hover:before,
.filter-search:hover:before {
	width: 100%;
	transition: 0.15s linear;
}
.switch-view.list-view .icon.list:hover,
.switch-view.grid-view .icon.grid:hover {
	opacity: 1;
	transition: 0.1s;
}
.category-item .icon:hover + .title,
.controls.view .icon:hover + .title {
	max-width: 200px;
	padding: 0 calc(var(--padding)/4);
	transition-duration: 0.15s;
}

.list-case .list-item:not(.is-active) .dot:hover {
	background-color: var(--color);
	border-color: var(--col-dark);
	/* transition: 0.1s linear; */
}

.list-case .list-item.is-active .tooltip,
.list-case .list-item:not(.is-active) .dot:hover + .tooltip {
	opacity: 1;
	/* transition: opacity 0.1s linear; */
}

.leaflet-bar a:hover, .leaflet-bar a:focus {
	background-color: var(--col-dark);
	color: var(--col-light);
	transition: 0.1s linear;
}
.leaflet-control-zoom-in:hover:before,
.leaflet-control-zoom-in:hover:after,
.leaflet-control-zoom-out:hover:after {
	border-color: var(--col-light);
	transition: 0.1s linear;
}


}