/*
Theme Name: Creixell Lab
Text Domain: Creixell
Version: 1.0.0
Author: SciStories
Author URI: http://scistories.com
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/
/* @import url("https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600&family=Roboto&display=swap"); */
@font-face {
	font-family: 'Oswald';
	src: url('fonts/Oswald-Regular.woff2') format('woff2'),
		url('fonts/Oswald-Regular.woff') format('woff'),
		url('fonts/Oswald-Regular.ttf') format('truetype'),
		url('fonts/Oswald-Regular.otf') format('opentype');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Oswald';
	src: url('fonts/Oswald-Medium.woff2') format('woff2'),
		url('fonts/Oswald-Medium.woff') format('woff'),
		url('fonts/Oswald-Medium.ttf') format('truetype'),
		url('fonts/Oswald-Medium.otf') format('opentype');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: 'Oswald';
	src: url('fonts/Oswald-SemiBold.woff2') format('woff2'),
		url('fonts/Oswald-SemiBold.woff') format('woff'),
		url('fonts/Oswald-SemiBold.ttf') format('truetype'),
		url('fonts/Oswald-SmeiBold.otf') format('opentype');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: 'Roboto';
	src: url('fonts/Roboto-Regular.woff2') format('woff2'),
		url('fonts/Roboto-Regular.woff') format('woff'),
		url('fonts/Roboto-Regular.ttf') format('truetype'),
		url('fonts/Roboto-Regular.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}

:root {
	/* Fonts */
	--mainFont: "Oswald", sans-serif;
	--textFont: "Roboto", sans-serif;
	/*Colors*/
	--primaryColor: #051f34;
	--textGray: #5d5d5d;
	--secondTitle: #c1592b;
	--bgGray: #f3f3f4;
	--borderGray: #d9d9d9;
	--black: #232323;
	--white: #ffffff;
}

html {
	box-sizing: border-box;
	font-size: 62.5%;
	/*10 px = 1rem */
}

body {
	font-size: 14px;
	/* px fallback*/
	font-size: 1.4rem;
	/*default font size for document*/
	line-height: 1.5;
	font-family: var(--textFont);
}

*,
*::before,
*::after {
	box-sizing: inherit;
}

h1 {
	font-size: 3.2rem;
	font-weight: bold;
	color: var(--white);
	font-family: var(--mainFont);
	font-weight: 500;
}

h2 {
	font-size: 2.2rem;
	font-weight: bold;
	color: var(--secondTitle);
	padding-top: 5rem;
	padding-bottom: 1.5rem;
	text-align: center;
	font-family: var(--mainFont);
	font-weight: 600;
}

h3 {
	font-size: 1.8rem;
	font-weight: bold;
	color: var(--primaryColor);
	font-family: var(--mainFont);
}

figure.wp-block-image img {
	max-width: 100% !important;
	height: auto !important;
}

.thumbnail-icon {
	/* border-radius: 50%; */
	background: transparent;
	/* border: 2px solid var(--primaryColor); */
	/* width: 50px; */
	height: 50px;
	padding-top: 0.5rem;
}

.icon-circles {
	display: flex;
	margin: auto;
	justify-content: center;
}

.copyright-text {
	margin-bottom: 0;
}

@media screen and (min-width: 1024px) {
	body {
		font-size: 18px;
		/* px fallback*/
		font-size: 1.8rem;
		/*default font size for document*/
	}

	h1 {
		font-size: 4rem;
	}

	h2 {
		font-size: 3.8rem;
		padding-top: 10rem;
		padding-bottom: 1.5rem;
	}

	h3 {
		font-size: 2.6rem;
	}
}

a {
	color: var(--secondTitle);
}

pt-5 {
	padding-top: 5rem;
}

pb-5 {
	padding-bottom: 5rem;
}

.uppercase {
	text-transform: uppercase;
}

/*Navbar*/
@media screen and (max-width: 1023px) {
	.navbar-light .navbar-nav .nav-link {
		text-align: end;
	}

	.nav-mobile {
		visibility: visible;
	}

	.nav-desktop {
		display: none;
	}
}

@media screen and (min-width: 1024px) {
	.nav-mobile {
		display: none;
	}

	.nav-desktop {
		visibility: visible;
	}
}

.navbar-light .navbar-nav .nav-link {
	color: var(--textGray);
	padding-left: 1.8rem;
	font-size: 1.6rem;
}

.navbar-light .navbar-nav .nav-link:hover {
	color: var(--secondTitle);
}

.navbar .current_page_item .nav-link {
	color: var(--secondTitle) !important;
	font-weight: bold;
}

.navbar .current-page-ancestor>a,
.navbar .current-menu-ancestor>a {
	color: var(--secondTitle) !important;
	font-weight: bold;
}

.navbar-light .navbar-nav .nav-item.social-media-twitter .nav-link,
.navbar-light .navbar-nav .nav-item.social-media-instagram .nav-link {
	color: var(--primaryColor);
	font-size: 2.8rem;
}

.navbar-light .navbar-nav .nav-item.social-media-twitter .nav-link {
	padding-left: 4rem;
	padding-right: 0;
}

.navbar-light .navbar-nav .nav-item.social-media-instagram .nav-link {
	padding-left: 0.5rem;
}

.logo-nav img {
	width: 10rem;
}

.second-logo-nav img {
	width: 10rem;
}

@media screen and (min-width: 425px) {
	.logo-nav img {
		width: 15rem;
	}

	.second-logo-nav img {
		width: 15rem;
	}
}

@media screen and (min-width: 1024px) {
	.navbar-nav.menu {
		align-items: center;
	}

	.navbar-light .navbar-nav .nav-link {
		padding-top: 1.5rem;
		padding-bottom: 1.5rem;
		font-size: 2rem;
	}

	.navbar-light .navbar-nav .nav-link.active {
		color: var(--secondTitle);
		padding-top: 1.5rem;
		padding-bottom: 1.5rem;
		font-size: 2rem;
	}
}

/*header*/
header {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

header>video {
	object-fit: cover;
	width: 100vw;
	height: inherit;
	position: absolute;
}

header.index-header {
	height: 50vh;
}

header.header-pages {
	height: 30vh;
}

header h1 {
	text-shadow: 2px 2px 2px #0b0503;
	text-align: center;
}

header p {
	color: var(--white);
	font-style: italic;
	text-align: center;
	text-shadow: 2px 2px 2px #0b0503;
	margin-bottom: 0;
	padding-top: 1rem;
}

.banner-text-author {
	color: var(--white);
	font-style: italic;
	text-shadow: 2px 2px 2px #0b0503;
	padding-top: 0;
}

.viewport-header {
	position: relative;
	height: 100vh;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

@media screen and (min-width: 1024px) {
	header.index-header {
		height: 80vh;
	}
}

/***home***/
.hex-container {
	padding-bottom: 5rem;
}

.index-hex-content {
	padding-top: 3rem;
}

.hex-title {
	padding-top: 3rem;
}

.hex-container h3>a {
	text-decoration: none;
	color: inherit;
}

.hex-container h3:hover {
	font-weight: bold;
}

.hex-container h3 {
	font-weight: normal;
	cursor: pointer;
	font-size: 2.2rem;
}

#home-hex {
	width: 100%;
}

#home-img {
	width: 100%;
}

@media screen and (max-width: 767px) {
	.hex-container h2 {
		text-align: left;
	}
}

@media screen and (min-width: 768px) {
	.hex-title h3 {
		text-align: center;
	}

	.hex-container {
		padding-bottom: 10rem;
	}

	.hex-container h2 {
		padding-bottom: 2rem;
	}
}

@media screen and (min-width: 1400px) {
	.hex-title h3 {
		padding-top: 5rem;
	}
}

.chosen__publications {
	padding-bottom: 10rem;
}

.home-content .wp-block-columns {
	margin-bottom: unset;
}

/*research*/
.research-video {
	overflow: hidden;
}

video {
	max-width: 100%;
	height: auto;
}

.research-hex-container {
	padding-top: 8rem;
}

.research-areas-txt {
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.research-areas-txt p>a {
	color: var(--secondTitle);
}

.tech-hybrid-container {
	padding-top: 10rem;
}

.tech-hybrid-txt p>a {
	color: var(--secondTitle);
}

.research-env-container {
	padding-top: 10rem;
}

.research-env-content img {
	padding-top: 3rem;
	padding-bottom: 5rem;
	max-width: 100%;
	height: auto;
	display: block;
	margin: auto;
}

@media screen and (min-width: 1024px) {
	.tech-hybrid-content {
		padding-left: 10rem;
		padding-right: 10rem;
	}
}

/*lab*/
@media screen and (min-width: 768px) {
	.lab-supporting-container .row .col {
		padding-left: 2rem;
		padding-right: 2rem;
	}
}

@media screen and (max-width: 767px) {
	.lab-logos {
		padding-bottom: 5rem;
	}
}

.lab-content p>a {
	color: var(--secondTitle);
}

.lab-campus-facilities-img {
	padding-top: 2rem;
}

.blue-bg {
	background-color: var(--primaryColor);
	margin-top: 5rem;
}

.lab-wizard-text {
	color: var(--white);
	text-align: center;
}

.lab-supporting-container h3 {
	padding-top: 3rem;
}

@media screen and (max-width: 700px) {
	.lab-supporting-container h3 {
		text-align: left;
	}

	.lab-supporting-container div:nth-child(2)>div {
		padding-top: 2rem;
		text-align: left;
	}

	.lab-supporting-container div:nth-child(3)>div {
		padding-top: 2rem;
		text-align: left;
	}

	.lab-supporting-container div:nth-child(4)>div {
		padding-top: 2rem;
		text-align: left;
	}
}

@media screen and (min-width: 768px) {
	.lab-supporting-container {
		padding-bottom: 5rem;
		padding-left: 10rem;
		padding-right: 10rem;
	}

	.lab-supporting-container h3 {
		text-align: center;
		padding-bottom: 3rem;
	}

	.lab-supporting-container div:nth-child(4)>div {
		padding-right: 3rem;
	}

	.lab-supporting-container div:nth-child(4)>div:first-child {
		padding-right: inherit;
	}
}

.join-us-btn {
	padding-top: 2rem;
	padding-bottom: 10rem;
	justify-content: center;
	display: flex;
}

.join-us-btn a {
	background-color: var(--secondTitle);
	padding: 0.5rem 5rem;
	border-radius: 25px;
	color: var(--white);
	text-decoration: none;
}

.join-us-btn a:hover {
	background-color: var(--white);
	padding: 0.5rem 5rem;
	border-radius: 25px;
	color: var(--secondTitle);
	text-decoration: none;
}

.blank-space {
	padding: 5rem;
}

.blank-space p {
	display: none;
}

/*team*/
.team-member-txt a {
	color: inherit;
	cursor: pointer;
	text-decoration: none;
}

#team-hex {
	width: 100%;
}

@media not all and (min-resolution: 0.001dpcm) {
	@media {
		#team-hex {
			width: 100%;
			height: 100%;
		}
	}
}

#team-img {
	width: 100%;
}

#pub-img {
	width: 100%;
}

.team-member-img {
	padding-top: 1rem;
	padding-bottom: 1rem;
	display: flex;
	justify-content: center;
}

.team-member-img img {
	cursor: pointer;
}

.team-member-txt {
	text-align: center;
	padding-bottom: 5rem;
}

.team-member-icon {
	color: var(--secondTitle);
	font-size: 2.6rem;
}

.team-img-wrapper {
	position: relative;
	cursor: pointer;
}

.hidden-div {
	position: absolute;
	inset: 0;
	opacity: 0;
}

/* team modal */
.modal-publications-txt {
	padding-top: 3rem;
}

.e-pubmed-link {
	color: #051f34;
	text-decoration: none;
}

.e-pubmed-link:hover {
	text-decoration: underline;
}

/******************************************************************************************/
.wrapper {
	position: relative;
	width: 500px;
	height: 430px;
}

#hex-bg .hex {
	fill: #fff;
	fill-opacity: 1;
	stroke: rgb(206, 198, 198);
	stroke-width: 1;
	width: 100%;
}

#hex-item .hex {
	fill: url(#gradientbg);
	fill-opacity: 1;
	stroke: #000;
	stroke-width: 1;
	cursor: pointer;
}

#hex-item:hover .hex {
	stroke-width: 2;
}

#magic-icon-img {
	width: 10rem;
}

#magic-icon-wp1,
#magic-icon-wp2,
#magic-icon-wp3 {
	width: 80%;
	position: absolute;
	z-index: 2;
	left: -3px;
	cursor: pointer;
}

#magic-icon-wp4 {
	width: 80%;
	position: absolute;
	z-index: 2;
	left: -1px;
	cursor: pointer;
	top: -7px;
	object-fit: scale-down;
}

#magic-icon-wp5 {
	width: 80%;
	position: absolute;
	z-index: 2;
	left: -3px;
	cursor: pointer;
	top: 5px;
}

#magic-icon-wp6 {
	width: 80%;
	position: absolute;
	z-index: 2;
	left: -5px;
	cursor: pointer;
}

.messagebox {
	background: rgb(255, 255, 255);
	background: linear-gradient(90deg,
			rgba(255, 255, 255, 1) 0%,
			rgba(240, 239, 239, 1) 100%);
	border: 1px solid #bbb;
	padding: 10px;
	font-family: sans-serif;
	/* z-index: 9999; */
	position: absolute;
	font-weight: bold;
	color: #071e36;
	border-radius: 10px;
	text-align: center;
}

@media screen and (max-width: 1023px) {
	.messagebox {
		z-index: 9999;
	}
}

.messagebox h3 {
	font-size: 1.2rem;
}

.messagebox-open {
	background: var(--primaryColor);
	border: 1px solid #bbb;
	padding: 10px;
	font-family: sans-serif;
	z-index: 9999;
	position: absolute;
	color: var(--white);
	border-radius: 10px;
	text-align: left;
	font-size: 1.2rem;
}

.magic-content h3 {
	font-size: 1.2rem;
	font-weight: bold;
	color: var(--white);
}

@media screen and (max-width: 1023px) {

	#messagebox-1,
	#messagebox-2,
	#messagebox-3,
	#messagebox-4,
	#messagebox-5,
	#messagebox-6 {
		display: none;
	}
}

#messagebox-1 {
	width: 200px;
	top: -50px;
	left: -50px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#messagebox-11 {
	width: 200px;
	top: 110px;
	left: -50px;
	display: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#messagebox-2 {
	width: 200px;
	top: 84px;
	left: -52px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#messagebox-22 {
	width: 200px;
	top: -52px;
	left: -210px;
	display: none;
	text-align: left;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#messagebox-3 {
	width: 200px;
	top: -100px;
	left: 100px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#messagebox-33 {
	width: 200px;
	top: -100px;
	left: -214px;
	display: none;
	text-align: left;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#messagebox-4 {
	width: 200px;
	top: 21px;
	left: -165px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#messagebox-44 {
	width: 200px;
	top: -266px;
	left: -60px;
	display: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#messagebox-5 {
	width: 200px;
	top: 1px;
	left: 100px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#messagebox-55 {
	width: 200px;
	top: -184px;
	left: 107px;
	display: none;
	text-align: left;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#messagebox-6 {
	width: 200px;
	top: -14px;
	left: -206px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	text-align: left;
}

#messagebox-66 {
	width: 200px;
	top: -50px;
	left: 108px;
	display: none;
	text-align: left;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.team-last-container {
	padding-top: 3rem;
	padding-bottom: 3rem;
}

.team-last-container p {
	font-size: 1rem;
}

@media screen and (max-width: 767px) {
	.magic-sauce-content {
		overflow: hidden;
	}

	.wrapper {
		position: relative;
		max-width: 767px;
		width: 100%;
		margin-top: 2rem;
		margin-bottom: 5rem;
	}

	#magic-icon-img {
		width: 10rem;
	}

	#magic-icon-wp1 {
		width: 80%;
		position: absolute;
		z-index: 2;
		left: -3px;
	}
}

@media screen and (min-width: 320px) {
	#item-wrapper-1 {
		position: absolute;
		top: 45px;
		left: 113px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-2 {
		position: absolute;
		bottom: 250px;
		left: 214px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-3 {
		position: absolute;
		top: 250px;
		left: 214px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-4 {
		position: absolute;
		top: 306px;
		right: 104px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-5 {
		position: absolute;
		bottom: 100px;
		left: 0px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-6 {
		position: absolute;
		bottom: 250px;
		right: 214px;
		width: 90.75px;
		height: 78.5px;
	}
}

@media screen and (min-width: 375px) {
	.magic-sauce-content {
		padding-bottom: 6rem;
	}

	.wrapper {
		margin-top: 3rem;
	}

	#item-wrapper-1 {
		position: absolute;
		top: 22px;
		left: 136px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-2 {
		position: absolute;
		bottom: 250px;
		left: 269px;
		width: 90.75px;
		height: 78.5px;
	}

	#messagebox-22 {
		top: -34px;
		left: -217px;
	}

	#item-wrapper-3 {
		position: absolute;
		top: 250px;
		left: 268px;
		width: 90.75px;
		height: 78.5px;
	}

	#messagebox-33 {
		top: -100px;
		left: -213px;
	}

	#item-wrapper-4 {
		position: absolute;
		top: 330px;
		right: 138px;
		width: 90.75px;
		height: 78.5px;
	}

	#messagebox-44 {
		top: -273px;
		left: -60px;
	}

	#item-wrapper-5 {
		position: absolute;
		bottom: 100px;
		left: 0px;
		width: 90.75px;
		height: 78.5px;
	}

	#messagebox-55 {
		top: -184px;
		left: 107px;
	}

	#item-wrapper-6 {
		position: absolute;
		bottom: 250px;
		right: 269px;
		width: 90.75px;
		height: 78.5px;
	}

	#messagebox-66 {
		top: -50px;
		left: 108px;
	}
}

@media screen and (min-width: 425px) {
	.wrapper {
		margin-top: 5rem;
	}

	#item-wrapper-1 {
		position: absolute;
		top: 0px;
		left: 160px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-2 {
		position: absolute;
		bottom: 250px;
		left: 318px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-3 {
		position: absolute;
		top: 250px;
		left: 318px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-4 {
		position: absolute;
		top: 351px;
		right: 155px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-5 {
		position: absolute;
		bottom: 100px;
		left: 0px;
		width: 90.75px;
		height: 78.5px;
	}

	#item-wrapper-6 {
		position: absolute;
		bottom: 250px;
		right: 319px;
		width: 90.75px;
		height: 78.5px;
	}
}

@media screen and (min-width: 768px) {
	.magic-sauce-content {
		overflow: hidden;
		padding: 10rem;
		padding-top: 8rem;
	}

	#item-wrapper-1 {
		position: absolute;
		top: -56px;
		left: 181px;
		width: 141.5px;
		height: 117px;
	}

	#item-wrapper-2 {
		position: absolute;
		bottom: 250px;
		left: 372px;
		width: 141.5px;
		height: 117px;
		/* z-index: 99999; */
	}

	#item-wrapper-3 {
		position: absolute;
		top: 245px;
		left: 374px;
		width: 141.5px;
		height: 117px;
	}

	#item-wrapper-4 {
		position: absolute;
		top: 369px;
		right: 185px;
		width: 141.5px;
		height: 117px;
	}

	#item-wrapper-5 {
		position: absolute;
		bottom: 60px;
		left: -11px;
		width: 141.5px;
		height: 117px;
	}

	#item-wrapper-6 {
		position: absolute;
		bottom: 250px;
		right: 372px;
		width: 141.5px;
		height: 117px;
	}

	.magic-sauce-content {
		padding-bottom: 15rem;
	}

	#messagebox-11 {
		top: 166px;
		left: -35px;
	}

	#messagebox-22 {
		top: -15px;
		left: -215px;
	}

	#messagebox-33 {
		width: 206px;
		top: -100px;
		left: -215px;
	}

	#messagebox-44 {
		top: -285px;
		left: -16px;
	}

	#messagebox-4 h3 {
		padding-top: 0.5rem;
	}

	#messagebox-55 {
		top: -187px;
		left: 160px;
	}

	#messagebox-66 {
		top: 0px;
		left: 175px;
	}
}

@media screen and (min-width: 1024px) {
	.magic-sauce-content {
		padding-bottom: 15rem;
	}

	#messagebox-1 {
		top: -65px;
		left: -27px;
	}

	#messagebox-11 {
		top: -65px;
		left: -27px;
	}

	#messagebox-2 {
		top: 35px;
		left: 154px;
	}

	#messagebox-22 {
		top: 35px;
		left: 154px;
	}

	#messagebox-3 {
		width: 206px;
		top: 35px;
		left: 149px;
	}

	#messagebox-33 {
		width: 206px;
		top: 35px;
		left: 149px;
	}

	#messagebox-4 {
		top: 135px;
		left: -25px;
	}

	#messagebox-44 {
		top: -30px;
		left: -25px;
	}

	#messagebox-5 {
		top: 35px;
		left: -210px;
	}

	#messagebox-55 {
		top: 20px;
		left: -210px;
	}

	#messagebox-6 {
		top: 35px;
		left: -210px;
	}

	#messagebox-66 {
		top: 35px;
		left: -210px;
	}
}

/******************************************************************************************/
/******************team-modal*********************************/
@media screen and (min-width: 768px) {
	.modal-dialog {
		max-width: 90%;
	}
}

.team-modal-container {
	padding-top: 6rem;
}

.close {
	float: right;
	font-size: 4.5rem;
	font-weight: 600;
	line-height: 1;
	color: var(--primaryColor);
	text-shadow: none;
	opacity: 1;
}

.close:not(:disabled):not(.disabled) {
	cursor: pointer;
}

.close:not(:disabled):not(.disabled):hover,
.close:not(:disabled):not(.disabled):focus {
	color: var(--primaryColor);
	text-decoration: none;
	opacity: 0.75;
}

button.close {
	padding: 0;
	background-color: transparent;
	border: 0;
	-webkit-appearance: none;
	padding-right: 1rem;
}

.modal-member-txt h2 {
	padding-top: 1rem;
	padding-bottom: 0;
}

.modal-bio-txt {
	padding-top: 3rem;
}

.modal-publications-link {
	padding-top: 2rem;
	/* padding-bottom: 5rem; */
}

.modal-publications-link--true {
	display: block;
}

.modal-publications-link--false {
	display: none;
}

.modal-publications-link p>a {
	color: var(--secondTitle);
}

.modal-wizard-txt h3 {
	padding-top: 2rem;
}

.modal-body {
	padding: 4rem 2rem;
}

button.close {
	transform: translateY(-20px);
}

@media screen and (min-width: 768px) {
	.modal-bio-txt h3 {
		font-size: 1.8rem;
	}

	.modal-desktop-side-txt {
		padding-left: 4rem;
	}

	.modal-desktop-side-txt h2 {
		font-size: 2.6rem;
	}

	.modal-desktop-side-txt h3 {
		font-size: 1.8rem;
	}

	.modal-desktop-side-txt h2.wizard-title {
		padding-top: 0.5rem;
	}

	.modal-content {
		border-radius: 3rem;
	}

	.modal-member-txt h2 {
		font-size: 2.6rem;
	}
}

/*publications*/
.publication-img {
	padding-top: 5rem;
	padding-left: 5rem;
	padding-right: 5rem;
}

.publication-circle-img {
	padding-top: 2rem;
	padding-bottom: 3rem;
	margin: 0 auto;
	width: 5rem;
}

.publication-txt {
	align-self: center;
}

@media screen and (max-width: 767px) {
	.publication-txt {
		padding-top: 2rem;
	}
}

.publication-txt a {
	color: inherit;
	text-decoration: none;
	cursor: pointer;
}

.publication-txt h3 {
	cursor: pointer;
}

.publication-txt p:nth-child(3) {
	font-weight: bold;
}

.pub-journal {
	font-weight: bold;
	color: var(--textGray);
}

@media screen and (max-width: 767px) {
	.publication-filter-txt {
		padding-top: 5rem;
	}

	.publication-filter-dropdown {
		padding-bottom: 1rem;
	}
}

.filter-drop-content {
	text-align: center;
	padding-top: 8rem;
	/*Desktop*/
}

.publications-pagination {
	padding-top: 3rem;
	padding-bottom: 3rem;
}

.publications-pagination .page-link {
	border-radius: 50%;
	border: 1px solid var(--secondTitle);
	color: var(--primaryColor);
}

.publications-pagination .page-item:first-child .page-link {
	border-top-left-radius: 50%;
	border-bottom-left-radius: 50%;
}

.publications-pagination .page-item:last-child .page-link {
	border-top-right-radius: 50%;
	border-bottom-right-radius: 50%;
}

.publications-pagination .page-item {
	margin-left: 1rem;
}

/* .publications-pagination .page-item.active .page-link {
    background-color: var(--secondTitle);
    color: var(--white);
    border: solid 1px var(--secondTitle);
  } */
.publications-pagination .page-link {
	padding: 0.375rem 1rem;
	cursor: pointer;
}

.publications-pagination .page-link.active {
	background-color: var(--secondTitle);
	color: var(--white);
	border: solid 1px var(--secondTitle);
}

@media screen and (min-width: 1024px) {
	.publications-pagination .page-link {
		padding: 0.4rem 1.2rem;
	}

	.publications-pagination {
		padding-top: 4rem;
		padding-bottom: 8rem;
	}
}

/*select svg styled*/
.t-neutral .select-box-svg__inner select:active,
.t-neutral .select-box-svg__inner select:focus {
	background-color: none;
}

.t-neutral .icon--arrow .icon__box {
	fill: var(--secondTitle);
}

.t-neutral .icon--arrow .icon__caret {
	fill: #fff;
}

.select-box-svg__label {
	display: block;
	margin: 1em 0 0.5em;
}

.select-box-svg__inner {
	margin: 0;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.select-box-svg__inner:hover,
.select-box-svg__inner:focus,
.select-box-svg__inner:active {
	cursor: pointer;
}

.icon--arrow {
	z-index: 1;
	position: absolute;
	right: 0;
	bottom: -5px;
	display: block;
	padding: 0;
}

.select-box-svg__inner select option {
	display: block;
	line-height: 1.5;
}

.select-box-svg__inner select:hover {
	cursor: pointer;
}

.select-box-svg__inner select {
	position: relative;
	z-index: 2;
	width: 100%;
	text-overflow: ellipsis;
	border: 1px solid var(--secondTitle);
	font-size: 1.4rem;
	font-family: var(--mainFont);
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-color: transparent;
	background-image: none;
	box-shadow: none;
	padding: 1rem;
	padding-right: 4rem;
	display: block;
}

/******************publications modal **************************/
.publication-modal-img {
	margin: 0;
	text-align: center;
	width: 6rem;
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.publication-modal-btn {
	padding-top: 2rem;
	padding-bottom: 3rem;
	justify-content: center;
	display: flex;
}

.publication-modal-btn a {
	background-color: var(--secondTitle);
	padding: 0.5rem 5rem;
	border: 2px solid var(--secondTitle);
	border-radius: 25px;
	color: var(--white);
	text-decoration: none;
}

.publication-modal-btn a:hover {
	background-color: var(--white);
	padding: 0.5rem 5rem;
	border: 2px solid var(--secondTitle);
	border-radius: 25px;
	color: var(--secondTitle);
	text-decoration: none;
}

.pub-author {
	display: inline-flex;
}

.pub-author::after {
	content: ", ";
}

.pub-author:last-of-type::after {
	content: ".";
}

@media screen and (min-width: 768px) {
	.publications-modal-container {
		padding-top: 5rem;
	}

	.modal-content {
		margin-top: 5rem;
	}
}

/*contact*/
.join-us-txt p>a {
	color: var(--secondTitle);
}

.contact-us-txt p>a {
	color: var(--secondTitle);
}

.contact-us-txt {
	align-self: center;
	padding-top: 2rem;
}

.join-us-txt {
	padding-top: 2rem;
}

.contact-map p,
.lab-location-img p {
	padding-top: 2rem;
}

.contact-map p {
	padding-bottom: 3rem;
}

.lab-location-img p {
	padding-bottom: 8rem;
}

#contact-hex {
	width: 100%;
}

#contact-img {
	width: 100%;
}

.lab-location-content .wp-block-columns:first-child .wp-block-column {
	width: 100%;
	padding-top: 66.66%;
	/* 4:3 Aspect Ratio (divide 3 by 4 = 0.75) */
	position: relative;
}

iframe {
	max-width: 100%;
	/* height: auto; */
}

.lab-location-content .wp-block-columns .wp-block-column:first-child p {
	padding-top: 1rem;
}

@media screen and (max-width: 767px) {
	.lab-location-content .wp-block-column figure {
		padding-top: 5rem;
	}
}

@media screen and (min-width: 768px) {
	.contact-us-txt {
		padding-left: 5rem;
	}

	.join-us-txt {
		padding-left: 5rem;
	}
}

/*footer*/
footer {
	background-color: var(--primaryColor);
	padding-top: 1.5rem;
	padding-bottom: 0.5rem;
}

.footer-txt p {
	color: var(--white);
	font-size: 1rem;
}

/* Dotwise additions */
.news__timeline_wrapper {
	background-color: #f8f8fa;
	padding: 55px 35px 36px;
	margin-bottom: 80px;
}

.news__timeline {
	border-left: 1px solid #d3d3d3;
	max-width: 983px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 1px;
	margin-top: 10px;
}

.news__timeline__content {
	font-size: 16px;
	line-height: 22px;
	margin-top: -9px;
	margin-bottom: 40px;
	padding-left: 50px;
	padding-right: 50px;
	position: relative;
}

.news__timeline__content time {
	font-size: 16px;
	text-transform: uppercase;
	margin-bottom: 4px;
	font-family: var(--mainFont);
	letter-spacing: 0.05em;
}

.news__timeline__content:before {
	content: "";
	position: absolute;
	left: -8px;
	top: 3px;
	width: 16px;
	height: 16px;
	background: #4d4d4d;
	border-radius: 100%;
	display: block;
	border: 5px solid #F8F8FA;
}

.news__timeline__content h2 {
	font-size: 1.3em;
	text-align: left;
	padding-top: 0;
}

/* Alumni timeline styles */
.timeline-table {
	display: grid;
	gap: 8px;
	overflow-x: auto;
}

.timeline-header,
.timeline-row {
	display: grid;
	grid-template-columns: 255px repeat(auto-fit, minmax(4px, 1fr));
	align-items: center;
}

.timeline-cell {
	border: 1px solid #ddd;
	text-align: center;
	padding: 12px 0;
	min-height: 64px;
}

.name-cell {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
	background: #fafafa;
	position: sticky;
	left: 0;
	z-index: 2;
	padding: 6px;
}

.member-thumb img {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 50%;
}

.member-name {
	flex: 1;
	line-height: 1.2;
}

.year-cell {
	font-weight: 500;
	background: #f0f0f0;
}

.timeline-cell.active {
	background: var(--secondTitle)
}