/*!
 * b5st since v1.0 | Unicence
 */
@font-face {
  font-family: "BasteB";
  src: url("../fonts/BasteB-Regular-patched.woff2") format("woff2"),
       url("../fonts/BasteB-Regular-patched.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Adjusted Arial Fallback";
  src: local("Arial");
  size-adjust: 92%;
  ascent-override: 90%;
  descent-override: normal;
  line-gap-override: 20%;
}

/* COLOURS */
:root { 
	--font-color:#000000;
	--green:#daff66;
	--orange:#ff501f;
	--page-max-width: 1520px;
	--design-font:"BasteB", 'Adjusted Arial Fallback', sans-serif; 
	--font-design: "BasteB", sans-serif;
	--font-body: "Instrument Sans", sans-serif;
}

body {
  display: flex;
  min-height: 100vh;
  min-height: -webkit-fill-available;
  flex-direction: column;
  font-family: var(--font-body);
  font-weight: 400;
  font-size:16px;
  font-optical-sizing: auto;
  font-style: normal;
  color: var(--font-color);
}
 
html{
	height: -webkit-fill-available;
}
main {
  flex: 1 0 auto; }

a {
	transition: color .2s ease-in-out, 
	            background-color .2s ease-in-out, 
	            border-color .2s ease-in-out,
				font-weight.2s ease-in-out;
}
a {
	color:var(--font-color);
	text-decoration:none;
	
}
a:hover,
a:active,
a:focus
 {	
	color:var(--font-color);
	text-decoration:none;
}

b, strong {
    font-weight: 600;
}
p {
	margin-bottom: 2rem;
}
ul {
	margin-bottom: 2rem;
}

h1, h2, h3, h4, h5, h6{
	font-weight:400;
	margin-bottom: 1.5rem;
}
.sticky-top {
    top: 25px;
}





img,
.size-auto,
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
  max-width: 100%;
  height: auto; }

.margin-bottom{
	margin-bottom:30px;
}
.bottom-spacer{
	margin-bottom:30px;
}
.large-margin-bottom{
	margin-bottom:60px;
}

.div-bottom-margin {
    margin-bottom: var(--bs-gutter-x);
}



@media only screen and (min-width: 768px){

	.margin-bottom{
		margin-bottom:0px;
	}
	.large-margin-bottom{
		margin-bottom:0px;
	}
}
@media only screen and (min-width: 1200px){
	.container-fluid{
		padding-right: 50px;
		padding-left: 50px;
	}
}



  

/* HEADER */ 


.menu-button-home {
	position:absolute;
	top:20px;
	right:20px;
	z-index:1000;
}
.menu-button {
	margin-top:20px;
	float:right;
}
.menu-link{
	font-size:1.2rem;
	font-weight:500;
	color:var(--orange);
	cursor:pointer;
}
.menu-link:hover,
.menu-link:active,
.menu-link:focus
{
	color:#000;
}

.page-template-page-home .menu-link{
	font-weight:500;
	color:var(--green);
	cursor:pointer;
}
.page-template-page-home .menu-link:hover,
.page-template-page-home .menu-link:active,
.page-template-page-home .menu-link:focus{
	color:#fff;
}
.mobile-svg{
	height:20px;
}
.offcanvas-header {
    justify-content: end;
	padding: 1.5rem 1.85rem;
	background:transparent;
}
.btn-close{
	font-size:1.3rem;
	opacity:.7;
}
.offcanvas{
	background:var(--green);
	width: 90%!important;
		min-width:300px;
}
.mobile-menu{
	padding-left:20px;
	font-size:1.6rem;
	line-height: 2;
	
  font-weight:500;
	
}
.mobile-menu ul{
	list-style-type:none;
    padding:0px;
    margin:0px;
}
.mobile-menu ul li{
    padding-bottom:0px;
}
.mobile-menu a{
	color:var(--font-color);
	
	text-decoration:none;
}
.mobile-menu a:hover{
	color:var(--orange);
}
.mobile-menu .sub-menu a{
	padding-left:20px;
	font-size:1.4rem;
}
@media only screen and (min-width: 768px){
	.menu-button-home {
		position:absolute;
		top:50px;
		right:60px;
		z-index:1000;
	}
	.menu-button {
		margin-top:60px;
		float:right;
	}
	.menu-link{
		font-size:1.5rem;
	}
	.offcanvas{
		background:var(--green);
		width: 40%!important;
		min-width:700px;
	}
	.mobile-menu{
		padding-left:30px;
		font-size:2rem;
	}	
	
}


.menu-experiments {

	list-style: none;

	font-size: 1rem;
	width: max-content;
	padding-top: 10px;
}

.small-listing {
	font-size: .85rem;
	font-weight: 400;
	display: none;
}

.menu-experiments li {

	border-bottom: 1px solid var(--font-color);

	color: var(--font-color);
}


.menu-experiments li a {
	color: inherit;
	text-decoration: none;
	transition: none;
	transition: color .2s ease-in-out;
}
.menu-experiments .order-number{
	display: inline-block;
    margin-right: 5px;
    min-width: 24px;
}
.menu-experiments li.is-published:hover {
	color: var(--orange);
	border-bottom: 1px solid var(--font-color);
}

.menu-experiments li.is-draft {
	color: rgba(0, 0, 0, 0.35);
	cursor: default;
}

.menu-experiments li.is-draft:hover {
	color: rgba(0, 0, 0, 0.35);
}

.menu-experiments li.is-draft .draft-menu-item {
	color: inherit;
}
@media only screen and (min-width: 768px){
	.menu-experiments {
	  counter-reset: item;
	  list-style: none;
	  padding-left: 20px;
	  font-size:1.1rem;
	}	
	.small-listing{
		font-size:.9rem;
		font-weight:400;
		display:inline;
	}
}

/* HOME PAGE */

.homepage-slideshow {
    position: relative;
    width: 100%;
    height: 100dvh;
    min-height: 100dvh;
	background-color:#000;
}

.slideshow-images {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
    transition: opacity 1s ease-in-out;
    z-index: 1;
	filter: grayscale(100%) contrast(1.1);
}

.slide.active {
    opacity: 1;
}

.homepage-slideshow::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 2;
}

.slideshow-overlay {
	z-index: 3;
		pointer-events: none;
		padding:20px;
}

.slideshow-overlay .overlay-item {
    pointer-events: auto;
    color: #fff;
}

@media only screen and (min-width: 768px){
	.slideshow-overlay {
		z-index: 3;
		pointer-events: none;
		padding:50px;
	}

}

/* Overlay Content*/
.top-text{
	color:var(--green);
	font-family:var(--font-design);
	font-size:1.5rem;
	line-height:1.1;
	max-width:50%;
    letter-spacing: 1px;
}
.main-logo img{
	width: 713px;
    height: auto;
    max-width: 100%;
	padding-right:30px;
}
.slideshow-link {
	color:var(--green);
	font-size:1rem;
	line-height:1;
	text-align:left;
}
.slideshow-link a{
	color:var(--green);
	
}
.slideshow-link a:hover,
.slideshow-link a:active,
.slideshow-link a:focus
{
	color:#fff;
}
.green-arrow{
	height:26px;
	width:26px;
}
 .overlay-bottom-left {	
        position: absolute;
        left: 1.5rem;           /* same as your padding */
        top: 50%;
        transform: translateY(-50%);
    }

@media only screen and (min-width: 768px){
	.top-text{
		font-size:2.625rem;
		max-width:70%;
	}
	.slideshow-link{
		font-size:1.5rem;
		text-align:left;
	}	
	.green-arrow{
		height:42px;
		width:42px;
	}	
	.overlay-bottom-left {	
		position: relative;
		top: auto;
		transform: none;
	}
}

/* HOMEPAGE MAIN CONTENT*/

.homepage-main-content{
	padding-top:80px;
	font-size:1.8rem;
	font-family:var(--font-design);
	text-transform:uppercase;
	line-height:1;
}
.main-content-link {
	color: inherit;
	text-decoration: none;
	transition: none;
}

.homepage-main-content .small{
	font-size:.8rem;
	font-family:var(--font-body);
	text-transform:none;
	vertical-align: middle;
	position: relative;
	line-height:1.4;
}

.experiment-row{
	padding-bottom:25px;
}


.homepage-main-content .is-draft {
	color: rgba(0, 0, 0, 0.3);
	cursor: default;
}



.homepage-main-content .is-draft:hover {
	color: rgba(0, 0, 0, 0.3);
}



.homepage-main-content .is-published {
	color: #000;
	transition: color .2s ease-in-out;
}

.homepage-main-content .is-published:hover {
	color: var(--orange);
}
.homepage-main-content .order-number{
	min-width:44px;
}

.experiment-id-75 .title{
	margin-left:44px;
}
.row.experiment-id-75 {
  flex-direction: column;
  flex-wrap: nowrap;
}
.min-w-0 {
  min-width: 0;
}
@media only screen and (min-width: 768px){
	.homepage-main-content{
		padding-top:114px;
		font-size:3rem;

	}	
	.experiment-row{
		padding-bottom:45px;
	}
	.homepage-main-content .small{
		font-size:1rem;
	}
	.homepage-main-content .order-number{
		min-width:74px;
	}

	.experiment-id-75 .title{
		margin-left:74px;
	}
}
@media only screen and (min-width: 992px){
	.homepage-main-content{
		padding-top:114px;
		font-size:4rem;

	}	
	.experiment-row{
		padding-bottom:55px;
	}
	.homepage-main-content .small{
		font-size:1.2rem;
	}
	.homepage-main-content .order-number{
		min-width:97px;
	}

	.experiment-id-75 .title{
		margin-left:97px;
	}
}
@media only screen and (min-width: 1200px){
	.homepage-main-content{
		padding-top:114px;
		font-size:4.8rem;

	}		
	
	.homepage-main-content .small{
		font-size:1.25rem;
	}
	.homepage-main-content .order-number{
		min-width:117px;
	}

	.experiment-id-75 .title{
		margin-left:117px;
	}
}
@media only screen and (min-width: 1400px){
	.homepage-main-content{
		padding-top:114px;
		font-size:5.3rem;

	}	
	
	.homepage-main-content .small{
		font-size:1.25rem;
	}
	.homepage-main-content .order-number{
		min-width:129px;
	}

	.experiment-id-75 .title{
		margin-left:129px;
	}
}

.tooltip-target {
	display: inline-block;
}

.tooltip-orange {
	--bs-tooltip-bg: var(--orange);
	--bs-tooltip-color: #fff;
	--bs-tooltip-opacity: 1;
}

.tooltip-orange .tooltip-inner {
	background-color: var(--orange);
	color: #fff;
	padding: 16px 20px;
	border-radius: 6px;
	font-size: 20px;
	text-align: left;
	max-width: 300px;
	width: 300px;
}

.tooltip-orange .tooltip-arrow::before {
	border-top-color: var(--orange) !important;
}

.tooltip-left.bs-tooltip-bottom .tooltip-arrow {
	left: 18px !important;
}
/* WEB COUNTER */

.web-counter {
	margin-top: 80px;
	margin-bottom: 80px;
}

.web-counter-title {
	color: var(--orange);
	font-size: 1.2rem;
	font-family: var(--font-design);
	margin-bottom:30px;
	letter-spacing:1px;
}
.web-counter-footer {
	color: var(--orange);
	font-size: 1.2rem;
	font-family: var(--font-design);
	letter-spacing:1px;
}
.visitor-widget {
	margin-bottom: 10px;
}

.visitor-number {
	font-size: 5.5rem;
	color: var(--orange);
	font-family: var(--font-design);
	line-height: 1;
	margin-left:-5px;
	margin-bottom:10px;
}

.scale-wrapper {
	position: relative;
	width: 100%;
	padding-bottom: 28px;
}

.scale-bar {
	position: relative;
	width: 100%;
	height: 12px;
	background: #e6e6e6;
	border-radius: 10px;
	overflow: hidden;
}

.scale-fill {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	background: var(--orange);
	border-radius: 10px;
}
.scale-labels-mobile{
	display:block;
}
.scale-labels-desktop{
	display:none;
}
.scale-labels {
	position: relative;
	width: 100%;
	height: 20px;
	margin-top: 8px;
}

.scale-labels span {
	position: absolute;
	top: 0;
	transform: translateX(-50%);
	text-align: center;
	white-space: nowrap;
	font-size: 0.65rem;
	color: var(--font-color);
	font-weight: 500;
}

/* left edge alignment */
.scale-labels span:first-child {
	transform: translateX(0);
}

/* right edge alignment */
.scale-labels span:last-child {
	transform: translateX(-100%);
}

.optional {
	display: none;
}

.mobile-tick {
	display: block;
}

@media only screen and (min-width: 768px) {
	.web-counter {
		margin-top: 200px;
		margin-bottom: 80px;
	}
	.web-counter-title {
		color: var(--orange);
		font-size: 2.8rem;
		font-family: var(--font-design);
		margin-bottom:40px;
	}
	.web-counter-footer {
		font-size: 2.8rem;
		margin-bottom:50px;
	}

	.visitor-number {
		font-size: 12rem;
		margin-left:-15px;
		margin-bottom:0;
	}

	.visitor-widget {
		margin-bottom: 30px;
	}
	
	
	.scale-wrapper {
		padding-bottom: 36px;
	}
	.scale-bar {
		position: relative;
		width: 100%;
		height: 20px;
		background: #e6e6e6;
		border-radius: 10px;
		overflow: hidden;
	}
	.scale-labels-mobile{
		display:none;
	}
	.scale-labels-desktop{
		display:block;
	}	
		.scale-labels {
		margin-top: 8px;
		height: 28px;
	}

	.scale-labels span {
		font-size: 1rem;
	}

	.optional {
		display: block;
	}

	.mobile-tick {
		display: none;
	}
}
@media only screen and (min-width: 992px) {
		.visitor-number {
		font-size: 18rem;
		margin-left:-15px;
		margin-bottom:0;
	}
}
/* SINGLE EXPERIMENT */

.main-link a {
	text-decoration:none;
	color:var(--orange); -webkit-transition: all .2s ease-in-out; 
	-moz-transition: all .2s ease-in-out; 
	-o-transition: all .2s ease-in-out; 
	transition: all .2s ease-in-out; 
}
.main-link a:hover,
.main-link a:active,
.main-link a:focus
 {	
	color:var(--orange);
	text-decoration:underline; -webkit-transition: all .2s ease-in-out; 
	-moz-transition: all .2s ease-in-out; 
	-o-transition: all .2s ease-in-out; 
	transition: all .2s ease-in-out; 
}
.single-header{
	margin-top:23px;
	font-size:1rem;
	color:var(--orange);
	font-weight: 500;
}
.number-margin-row{
	margin-top:100px;
	margin-bottom:40px;
}
.number{
	font-size:4.5rem;
	font-family:var(--font-design);
	color:var(--orange);
	line-height:.7;
}
.single-image{
	margin-bottom:70px;
}
.single-image img{
	border-radius:10px;
}
.single-image-mobile{
	aspect-ratio: 1 / 1;
	width: 100%;
	overflow: hidden;
	margin-bottom:30px;
}
.single-image-mobile img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.video-image {
  position: relative;
  cursor: pointer;
}

.video-image img {
  display: block;
}
.video-loop video {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius:10px;
}

.play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 84px;
  height: 84px;
  background: rgba(255, 255, 255, 0.85);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transition: transform 0.2s ease, background 0.2s ease;
}

.play-button::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 54%;
  transform: translate(-50%, -50%);
  border-left: 24px solid var(--orange);
  border-top: 16px solid transparent;
  border-bottom: 16px solid transparent;
}

.video-image:hover .play-button {
  transform: translate(-50%, -50%) scale(1.08);
  background: rgba(255, 255, 255, 1);
}

.video-modal {
  display: none;
  position: fixed;
  z-index: 999999;
  inset: 0;
  background: rgba(0, 0, 0, 0.85);
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.video-modal.active {
  display: flex;
}

.video-modal-content {
  position: relative;
  width: 100%;
	height:auto;
  max-width: min(1400px, 90vw);
}

.video-modal-content video {
  width: 100%;
  height: auto;
  display: block;
  background: black;
  border-radius: 10px;
}

.video-close {
  position: absolute;
  top: -54px;
  right: 0;
  background: transparent;
  color: white;
  border: none;
  font-size: 54px;
  cursor: pointer;
  line-height: 1;
}

@media (max-width: 767px) {
  .play-button {
    width: 64px;
    height: 64px;
  }

  .play-button::before {
    border-left-width: 19px;
    border-top-width: 13px;
    border-bottom-width: 13px;
  }

  .video-modal {
    padding: 16px;
  }

  .video-close {
    top: -44px;
    font-size: 44px;
  }
}





.single-intro-heading{
	max-width:850px;
	font-size:2rem;
	font-family:var(--font-design);
	color:var(--orange);
	line-height:1.2;
	margin-bottom:20px;
	text-transform:none;
}
.single-intro-paragraph{
	font-size:1rem;
	margin-bottom:40px;
}
.orange{
	color:var(--orange);
}
.single-image-1 img{
	border-radius:10px;
	margin-bottom:0px;
}
.single-image-2 img{
	border-radius:10px;
	margin-bottom:0px;
}
.image-byline{
	font-size:.8rem;
	margin-top:5px;
}
.single-about-heading{
	font-size:2rem;
	font-family:var(--font-design);
	color:var(--orange);
	line-height:1.2;
	margin-bottom:20px;
}

.single-about-text{
	font-size:1rem;
	margin-bottom:40px;
}
.single-about-quote{
	
	font-size:1.5rem;
	font-family:var(--font-design);
	color:var(--orange);
	line-height:1.2;
	letter-spacing:1px;
	margin-bottom:40px;
}
.name-of-person-quoted{
		margin-bottom:60px;    
		margin-top: -20px;
		text-align:right;
		font-size:1.2rem;
		font-weight:bold;
	}

.experiment-green-box{
	background:var(--green);
	padding:40px 0 20px;
	border-radius:0px;
	margin-bottom:40px;
}
.experiment-label{
	font-size:.75rem;
	background:#000;
		color:var(--green);
		font-weight:500;
	padding:4px 10px;
	text-transform:uppercase;
	letter-spacing:1px;
	display:inline-block;
	font-weight:500;
	margin-bottom:30px;
	
}

.experiment-heading{
	font-size:2rem;
	line-height:1.1;
	font-family:var(--font-design);
	margin-bottom:25px;
	
}
.experiment-intro-paragraph{
	font-size:1.25rem;
	font-weight:600;
	line-height:1.3;
	margin-bottom:30px;
	
}
.experiment-image{
	height:240px;
    margin-top: 0px;
    margin-right: 0px;
	border-radius:5px 5px 5px 5px;
}
.experiment-main-content{
	font-size: 1rem;
    margin-top: 30px;
	column-count: 1;
	column-gap: 30px;
	margin-bottom:0px;

}
.experiment-main-content p{
	line-height:1.5rem;
	margin-bottom:1.5rem;
	break-inside: avoid;
}

@media (min-width:767px){
	.single-header{
		margin-top:60px;
		font-size:1.5rem;
	}
	.number{
		font-size:10.375rem;
	}	
	.single-intro-heading{
		
		font-size:3.5rem;
		font-family:var(--font-design);
		color:var(--orange);
		line-height:1.2;
		margin-bottom:60px;
		text-transform:uppercase;
	}
	.single-intro-paragraph{
		font-size:1.375rem;
		margin-bottom:70px;
	}
	.single-image-1 img{
		border-radius:10px;
		margin-bottom:0px;
	}
	.single-image-2 img{
		border-radius:10px;
		margin-bottom:0px;
	}

	.single-about-heading{
		font-size:2.6rem;
		line-height:1.2;
	}

	.single-about-text{
		font-size:1.375rem;
		margin-bottom:70px;
	}
	.single-about-quote{
		padding-top:60px;
		font-size:3.5rem;
		margin-bottom:70px;
	}
	.name-of-person-quoted{
		margin-bottom:100px;
		margin-top: -30px;
		text-align:right;
		font-size:1.5rem;
		font-weight:bold;
	}

	.experiment-green-box{
		background:var(--green);
		padding:40px 40px 40px;
		margin-bottom:70px;
		border-radius:10px;
	}
	.experiment-label{
		font-size:.8rem;
		background:#000;
		color:var(--green);
		padding:3px 10px;
		text-transform:uppercase;
		letter-spacing:1px;
		display:inline-block;
		font-weight:500;
		margin-bottom:50px;
		
	}
	.experiment-heading{
		font-size:3.5rem;
		line-height:1.1;
		font-family:var(--font-design);
		margin-bottom:50px;
		
	}
	.experiment-intro-paragraph{
		font-size:1.5rem;
		font-weight:600;
		margin-bottom:0px;
		
	}
	.experiment-image{
		height:calc(100% + 40px);
		margin-top: -40px;
		margin-right: -40px;
		border-radius:0px 10px 0px 0px;
	}
	.experiment-main-content{
		font-size: 1.375rem;
		margin-top: 70px;
		column-count: 2;
		column-gap: 30px;
		margin-bottom:30px;

	}
	.experiment-main-content p{
		line-height:2.1rem;
		margin-bottom:2.1rem;
	}
}
@media only screen and (min-width: 992px) {
	.number{
			font-size:14.375rem;
		}
}
.dropdown-menu-experiments-button {
    min-width: 150px;
	font-size:.9rem;
    background-color: var(--green);
    color: var(--font-color);
    padding: 7px 12px;
    border-radius: 7px 7px 7px 7px;
    display: inline-flex;
    align-items: center;
    column-gap: 10px;
}
.dropdown-menu-experiments-button[aria-expanded="true"]{
    border-radius: 7px 7px 0 0;
}
/* Chevron (default = down) */
.dropdown-menu-experiments-button::after {
    font: var(--fa-font-sharp-solid); /* adjust if using FA5 */
    font-weight: 500;
    content: "\f078"; /* down */

    margin-left: auto; /* KEY LINE */
}

/* When open → switch to up */
.dropdown-menu-experiments-button[aria-expanded="true"]::after {
    content: "\f077"; /* up */
}
.dropdown-menu-experiments-button .thumbnail{
	width: 50px;
	height: 50px;
	border-radius: 50%;
	object-fit: cover;
	display: none;
	margin-right:13px;
}
.dropdown-menu {
    --bs-dropdown-zindex: 1000;
    --bs-dropdown-min-width: 100%;
    --bs-dropdown-padding-x: 0;
    --bs-dropdown-padding-y: 0.5rem;
    --bs-dropdown-spacer: 0.125rem;
    --bs-dropdown-font-size: 1rem;
    --bs-dropdown-color: #212529;
    --bs-dropdown-bg: #fff;
    --bs-dropdown-border-color: var(--bs-border-color-translucent);
    --bs-dropdown-border-radius: 10px 0px 10px 10px;
    --bs-dropdown-border-width: 0px;
    --bs-dropdown-inner-border-radius: calc(0.375rem - 1px);
    --bs-dropdown-divider-bg: var(--bs-border-color-translucent);
    --bs-dropdown-divider-margin-y: 0.5rem;
    --bs-dropdown-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --bs-dropdown-link-color: #212529;
    --bs-dropdown-link-hover-color: #1e2125;
    --bs-dropdown-link-hover-bg: #e9ecef;
    --bs-dropdown-link-active-color: #fff;
    --bs-dropdown-link-active-bg: #0d6efd;
    --bs-dropdown-link-disabled-color: #adb5bd;
    --bs-dropdown-item-padding-x: 1rem;
    --bs-dropdown-item-padding-y: 0.25rem;
    --bs-dropdown-header-color: #6c757d;
    --bs-dropdown-header-padding-x: 1rem;
    --bs-dropdown-header-padding-y: 0.5rem;
    position: absolute;
    z-index: var(--bs-dropdown-zindex);
    display: none;
    padding: 20px 20px 20px;
    margin: 0;
	margin-top: -2px !important;
    font-size: var(--bs-dropdown-font-size);
    color: var(--bs-dropdown-color);
    text-align: left;
    list-style: none;
    background-color: var(--green);
    background-clip: padding-box;
    border: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);
    border-radius: var(--bs-dropdown-border-radius);
}

.dropdown-menu-experiments {
	
	list-style: none;
	padding-left: 20px;
	font-size: .9rem;
}

.dropdown-menu-experiments li {
	
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 0.5rem;
	padding-bottom: 12px;

	color: var(--font-color);
	transition: font-weight .2s ease-in-out, color .2s ease-in-out;
}

.dropdown-menu-experiments a {
	color: inherit;
	text-decoration: none;
	transition: none;
}

.dropdown-menu-experiments a:hover,
.dropdown-menu-experiments a:active,
.dropdown-menu-experiments a:focus {
	color: inherit;
	text-decoration: none;
}

.dropdown-menu-experiments li:first-of-type {
	border-top: 0;
	padding-top: 0;
}

.dropdown-menu-experiments .order-number{
	display: inline-block;
    margin-right: 5px;
    min-width: 24px;
}


.dropdown-menu-experiments li::after {
	font: var(--fa-font-sharp-solid);
	content: '\f054';
	font-weight: 500;
	font-size: .8rem;
	grid-column: 3;
	justify-self: end;
	align-self:anchor-center;
	color: inherit;
	transition: font-weight .2s ease-in-out;
}

.dropdown-menu-experiments li.is-published:hover {
	font-weight: 600;
	color: var(--font-color);
}

.dropdown-menu-experiments li.is-published:hover::after {
	font-weight: 700;
}

.dropdown-menu-experiments li.is-draft {
	color: rgba(0, 0, 0, 0.35);
	cursor: default;
}

.dropdown-menu-experiments li.is-draft:hover {
	color: rgba(0, 0, 0, 0.35);
	font-weight: inherit;
}

.dropdown-menu-experiments li.is-draft::after {
	content: "";
}

.dropdown-menu-experiments li.is-draft:hover::after {
	font-weight: 500;
}

.dropdown-menu-experiments .draft-dropdown-item {
	color: inherit;
}
@media only screen and (min-width: 768px){
	.dropdown-menu-experiments-button {
		min-width: 290px;
		font-size:1.2rem;
		padding: 10px 12px;
		border-radius: 10px 10px 10px 10px;
	}
	.dropdown-menu-experiments-button[aria-expanded="true"]{
		border-radius: 10px 10px 0 0;
	}
	.dropdown-menu-experiments {
	  counter-reset: item;
	  list-style: none;
	  padding-left: 20px;
	  font-size:1rem;
	  border-radius: 0px 0px 10px 10px;	
	}	
	.dropdown-menu-experiments-button .thumbnail{
		width: 50px;
		height: 50px;
		border-radius: 50%;
		object-fit: cover;
		display: inline-block;
		margin-right:10px;
	}	
	.dropdown-menu {
		--bs-dropdown-border-radius: 0px 0px 10px 10px;	
		padding:10px 20px 20px;
	}
	.dropdown-menu-experiments li:first-of-type{
		border-top: 1px solid #000;
		padding-top: 20px;
	}
}


/* MISSIONEN*/
.mosaic{
	background:#e6e6e6;
	height:900px;
	margin:80px 0;
	border-radius:10px;
}
.missionen-content{
	font-family:var(--font-design);
	font-size:2rem;
	margin-top:150px;
	margin-bottom:150px;
}
.missionen-content h1{
	color:var(--orange);
	font-size:3.5rem;
	text-transform:uppercase;
}
.missionen-content h3{
	color:var(--orange);
	font-size:2rem;
}


.scientists-panel{
	margin-bottom:100px;
}
.mission-number{
	font-family: var(--font-design);
	color:var(--orange);
	font-size:3rem;
	margin-bottom:10px;
}
.scientist-image{
	border-radius:10px;
}
.scientist-name{
	padding-top:15px;
	
	font-size: 1.375rem;
	text-transform:uppercase;
	font-weight: 500;
}
.scientists-info{
	padding:30px 0;
	font-size: 1rem;
	max-width:700px;
}
.scientists-link a{
	color:var(--orange);
	text-decoration:underline;
}
.image-placeholder {
    position: relative;
    width: 100%;
    aspect-ratio: 920 / 1200;
    background-color: var(--green);
    overflow: hidden;
	border-radius:10px;
}

.image-placeholder img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;

    opacity: 0;
    transition: opacity 0.8s ease var(--fade-delay, 0ms);
}

.image-placeholder.is-visible img {
    opacity: 1;
}
@media only screen and (min-width: 768px){
	.missionen-content{
		font-family:var(--font-design);
		font-size:3rem;
		margin-top:100px;
		margin-bottom:100px;
	}
	.missionen-content h1{
		color:var(--orange);
		font-size:3.5rem;
		text-transform:uppercase;
	}
	.missionen-content h3{
		color:var(--orange);
		font-size:3rem;
	}	
	.scientists-info{
		padding:30px 0;
		font-size: 1.375rem;
	}
}
/* FOOTER */
#site-footer {
	
	padding-top:100px;
	padding-bottom:30px;
	background:var(--green);
	color:var(--font-color);
	font-size:.85rem;
}
.footer-logo img{
	width: 200px;
	margin-top:50px;
    height: auto;
    max-width: 100%;
}
.footer-menus{
	margin-top:30px
}
.footer-menus a{
	color:var(--font-color);
}
.footer-menus a:hover,
.footer-menus a:focus,
.footer-menus a:active
{
	color:var(--font-color);
	font-weight:bold;
	text-decoration:none;
}
.footer-row-margin{
	margin-top:80px
}
.footer-text-right{
	max-width:240px;
}
.footer-text-header{
	font-weight:bold;
	margin-bottom:13px;
}
#site-footer h4{
	font-size:1.2rem;
}
@media (min-width:767px){
	#site-footer {
		
		padding-top:190px;
		padding-bottom:60px;
		font-size:1rem;
	}
	.footer-logo img{
		width: 320px;
		margin-top:0px;
		height: auto;
		max-width: 100%;
	}
	.footer-menus{
		margin-top:0px
	}
	#site-footer h4{
		font-size:1.5rem;
	}	
}