#main {
	padding: 25px;
}

/* Make the site logo image scale with the .square-logo box instead of using its fixed HTML width/height,
   so it matches the OII/Oxford logos at every breakpoint. */
.square-logo.site-logo img {
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 767px) {
	#main { padding: 0 !important; }
}

#publications .pagination {
	margin-top: -60px;
}

#site-title-link,
#site-title-link:hover,
#site-title-link:focus,
#site-title-link:visited {
	color: inherit;
	text-decoration: none;
}

/* Always-visible nav bar: ensure menu bar stays on top and sticks on scroll */
#menu-bar-container {
	z-index: 9999 !important;
}

@media screen and (min-width: 768px) {
	#menu-bar-container {
		position: sticky !important;
		top: 0 !important;
	}
}

/* Breadcrumb-style title (title-bar-style = 'breadcrumb' in site-settings.php) */
.title-bar--breadcrumb {
	background-color: transparent !important;
}

.title-bar--breadcrumb .breadcrumbs {
	padding-top: 1.6rem;
	padding-bottom: 2.8rem;
}

h1.breadcrumb-title {
	display: inline;
	font-size: inherit;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: inherit;
	color: inherit;
	vertical-align: baseline;
}

body.home div.title-bar{display:none;}

/*
Theme Name: OIIwebtheme SOSI
description: OIIwebtheme sosi
Author: John Gilbert
Template: oiiwebtheme
Version: 1.0.0

*/

#logo-text {
	position: relative;
}

.scroll-indicator {
	display: flex;
	flex-direction: column;
	align-items: center;
	
	opacity: 0.5;
	gap: 0.2em;
	text-decoration: none;
	color: inherit;
}

.scroll-indicator:hover {
	opacity: 0.8;
	color: inherit;
	text-decoration: none;
}

.scroll-indicator__text {
	font-size: 0.7em;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.scroll-indicator__arrow {
	font-size: 1em;
	animation: scroll-bounce 1.8s ease-in-out infinite;
}

@keyframes scroll-bounce {
	0%, 100% { transform: translateY(0); }
	50%       { transform: translateY(7px); }
}

section.block {
	margin-bottom: 8rem !important;
	
}

p {
	font-size: 1em;
}

h2 {
	font-size: 3.5rem !important;
	font-weight: 500;
}

main > section.block:last-child {
	margin-bottom: 0 !important;
}

main#main {
	padding-bottom: 0;
}

#site-tags{
	background-color: transparent;
	display:flex;
	align-items:center;
}
#site-tags .container-xl {
	width:100%;
}

button.btn-primary {
	font-family: 'Outfit', sans-serif;
	font-weight:500;
	padding:13px;
}
.box-text-container {padding:15px;}
/*
div.title-bar{display:none;}
*/
/* Hero section — add 'hero-section' to the block's custom classes field */
#intro h2 {
	font-size: 4em !important;
	max-width: 600px;
	margin-top:30px;
}

@media screen and (min-width: 992px) {
	#intro div.hero-block { margin-left: 130px; }
}

section#intro {margin-bottom:0!important}

@media screen and (max-width: 767px) {
	section#intro {margin:0!important}
	#intro h2 {font-size: 2.2em !important;}
}

section#scroll {
margin:0!important;
padding:0!important;
}
#intro p {
	font-size: 1.3em;
	line-height: 1.7;
	max-width: 600px;
	margin-bottom: 1.8em;
	opacity: 0.9;
}


#ourresearch h2 {
	font-size: 3em !important;
	margin-top:0;
}

#ourresearch {
  scroll-margin-top: 80px; /* adjust to your header height */
  padding: 0;
  margin: 0;
}

@media screen and (max-width: 767px) {
	#ourresearch h2 {
		font-size: 2em !important;
	}
	#ourresearch {
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 15px;
		padding-right: 15px;
	}
}

@media screen and (min-width: 768px) {
	#ourresearch .row > .col-12 {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
	}
}

/* Supporters block */
.supporters-heading {
	text-align: center;
	font-size: 0.75em !important;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	opacity: 0.5;
	margin-bottom: 1.25em !important;
}

.supporters-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	gap: 2em 3em;
	max-width: calc(4 * 130px + 3 * 3em);
	margin-left: auto;
	margin-right: auto;
}

@media (max-width: 600px) {
	.supporters-grid {
		max-width: calc(2 * 130px + 2em);
		gap: 1.5em 2em;
	}
}

@media (max-width: 340px) {
	.supporters-grid {
		max-width: 130px;
	}
}

.supporter-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5em;
	width: 130px;
}

.supporter-logo {
	width: 130px;
	height: 68px;
	
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.8em;
	font-weight: 700;
	color: #888;
	letter-spacing: 0.05em;
}

.supporter-logo img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	filter: grayscale(100%);
	opacity: 0.6;
	transition: opacity 0.3s, filter 0.3s;
}

.supporter-item:hover .supporter-logo img {
	filter: grayscale(0%);
	opacity: 1;
}

.supporter-name {
	display: block;
	font-size: 0.75em;
	opacity: 0.5;
	text-align: center;
	width: 100%;
}

/* Feature items */
.feature-item {
	display: flex;
	align-items: flex-start;
	gap: 1em;
	padding: 1.2em;
	background: #f4f4f4;
	border-radius: 8px;
	margin-bottom: 1em;
}

.feature-icon {
	width: 48px;
	height: 48px;
	min-width: 48px;
	background: #0f2b5e;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
	font-size: 1.2em;
}

.feature-content h3 {
	font-size: 1em !important;
	font-weight: 500;
	margin: 0 0 0.3em !important;
	color: #0f2b5e;
}

.feature-content p {
	font-size: 0.9em;
	margin: 0;
	line-height: 1.5;
	color: #444;
}

/* Stats columns */
.stats-columns {
	display: flex;
	flex-direction: column;
	margin-top:2.5em;
	gap: 0;
}

.stat-block {
	display: flex;
	flex-direction: column;
	padding: 1.5em 0;
	border-top: 1px solid rgba(255,255,255,0.25);
}

.stat-number {
	font-family: 'Outfit', sans-serif;
	font-size: 3em;
	font-weight: 700;
	line-height: 1;
	margin-bottom: 0.2em;
}

.stat-label {
	font-size: 0.85em;
	letter-spacing: 0.04em;
	opacity: 0.75;
	text-transform: uppercase;
}

@media screen and (min-width: 768px) {
	.stats-columns {
		flex-direction: row;
	}
	.stats-columns .stat-block {
		flex: 1;
		padding: 1.5em 2em 1.5em 1.5em;
		border-top: 1px solid rgba(255,255,255,0.25);
		border-right: 1px solid rgba(255,255,255,0.25);
	}
	.stats-columns .stat-block:last-child {
		border-right: none;
		padding-right: 0;
	}
}


#site-title{
		float: left;
		width: 100px;
		margin-left: 30px;
		height: 110px;
		font-size:20px;
		line-height:19px;
		display:none;
	}

	#site-title-text, #site-title h1 {
		text-decoration:none;
		color:#0e2050;
		font-family: 'Alegreya Sans SC';
		font-size: 1.2em;
		line-height: 1em;

	}
	
	#site-title h1 {
		text-decoration:none;
		color:#0e2050;
		font-family: 'Alegreya Sans SC';
		font-size: 30px;
		line-height: 1em;
		padding:0px;
	}	
	
	
.row .ab-name-cont{
	border-bottom: solid lightgrey 0.2rem;
	}
	
.ab-name-block{

		padding:20px 0 5px 0;
		margin:0 0 20px 0;
		clear:both;
}
.ab-name-block img{
		width:90px;
		height:90px;
}

.ab-name {
	font-size:140%;	
}
.ab-position {
	font-size:120%;
	font-style: italic;	
}
.ab-desc {
	font-size:110%;	
	padding-bottom:15px;

}

@media screen and (min-width:580px){	
	#site-title, #site-title h1{
		width:270px;	
		display:block;
		
	}
	
}


	
@media screen and (min-width:992px){	

	#site-title, #site-title h1{
		width:500px;
		
	}
	
	#site-title-text{
		font-size:2.3em;
		line-height:1em;
	}

}

/* Vertical alignment for contact block columns */
@media screen and (min-width: 768px) {
	.contact-block .row > .col-12 {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
	}
}

/* Contact items */
.contact-item {
	display: flex;
	align-items: flex-start;
	gap: 1em;
	padding: 1em;
	border-bottom: 1px solid #e8e8e8;
}

.contact-item:last-child {
	border-bottom: none;
}

.contact-icon {
	width: 48px;
	height: 48px;
	min-width: 48px;
	background: #f0eedf;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0f2b5e;
	font-size: 1.1em;
}

.contact-details {
	display: flex;
	flex-direction: column;
}

.contact-label {
	font-size: 0.8em;
	color: #888;
	margin-bottom: 0.2em;
}

.contact-details a {
	font-weight: 700;
	color: #0f2b5e;
	display: block;
	text-decoration: none;
}

.contact-details a:hover {
	text-decoration: underline;
}

/* Community card */
.community-card {
	background: #0f2b5e;
	border-radius: 12px;
	padding: 2em;
	color: #ffffff;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.community-card h3 {
	font-size: 1.3em !important;
	font-weight: 500;
	color: #ffffff !important;
	margin: 0 0 0.6em !important;
}

.community-card p {
	font-size: 0.95em;
	color: rgba(255,255,255,0.85) !important;
	line-height: 1.6;
	margin-bottom: 1.5em;
}

.community-card .community-footer,
.community-card .community-footer p {
	margin-top: auto;
	font-size: 0.8em;
	color: rgba(255,255,255,0.6) !important;
	line-height: 1.5;
}

.community-card .btn {
	background: #ffffff;
	color: #0f2b5e;
	border: none;
	font-weight: 700;
	margin-bottom: 1.5em;
}

.community-card .btn:hover {
	background: #e8e8e8;
	color: #0f2b5e;
}

/* Research stream items */
.stream-item {
	display: flex;
	align-items: stretch;
	gap: 0;
	margin-bottom: 1em;
	background: #f4f4f4;
	border-radius: 8px;
	overflow: hidden;
}

.stream-number {
	min-width: 140px;
	width: 140px;
	background: #0f2b5e;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
	font-family: 'Outfit', sans-serif;
	font-size: 3.5em;
	font-weight: 700;
	padding: 1em 0.5em;
}

.stream-content {
	padding: 1.5em;
	flex: 1;
}

.stream-content h3 {
	font-size: 1.2em !important;
	font-weight: 500;
	margin: 0 0 0.5em !important;
	color: #0f2b5e;
}

.stream-focus-heading {
	font-size: 0.75em;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #0f2b5e;
	margin: 1em 0 0.4em;
}

.stream-content ul {
	font-size: 0.9em;
	color: #888;
	margin: 0;
	padding-left: 1.2em;
	line-height: 1.7;
}

/* Prevent float collapse in embed block when background colour is set */
.embed-block .container-xl::after {
	content: '';
	display: table;
	clear: both;
}

/* Value cards */
.value-card {
	background: #ffffff;
	border-radius: 12px;
	padding: 1.8em;
	height: 100%;
}

.value-card .value-icon {
	width: 52px;
	height: 52px;
	background: #0f2b5e;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
	font-size: 1.3em;
	margin-bottom: 1.2em;
}

.value-card h3 {
	font-size: 1.05em !important;
	font-weight: 500;
	margin: 0 0 0.5em !important;
	color: #0f2b5e;
}

.value-card p {
	font-size: 0.9em;
	color: #444;
	margin: 0;
	line-height: 1.6;
}

/* Media & Publications cards */
.media-col-header {
	display: flex;
	align-items: center;
	gap: 0.75em;
	margin-bottom: 1.2em;
}

.media-col-icon {
	width: 40px;
	height: 40px;
	min-width: 40px;
	background: #f0eedf;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0f2b5e;
	font-size: 1em;
}

.media-col-header h3 {
	font-size: 1.4em !important;
	font-weight: 500;
	margin: 0 !important;
	color: #0f2b5e;
}

.media-card {
	display: flex;
	align-items: flex-start;
	gap: 0.9em;
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 10px;
	padding: 1em;
	margin-bottom: 0.75em;
	position: relative;
	text-decoration: none;
	color: inherit;
}

.media-card:hover {
	border-color: #c0c0c0;
	text-decoration: none;
	color: inherit;
}

.media-card__icon {
	width: 40px;
	height: 40px;
	min-width: 40px;
	background: #f0eedf;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0f2b5e;
	font-size: 0.95em;
}

.media-card__body {
	flex: 1;
}

.media-card__type {
	font-size: 0.7em;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #5c52a0;
	display: block;
	margin-bottom: 0.3em;
}

.media-card__title,
a.media-card__title {
	font-size: 0.95em;
	font-weight: 700;
	line-height: 1.4;
	color: #0f2b5e;
	margin-bottom: 0.3em;
	display: block;
	text-decoration: none;
}

a.media-card__title:hover {
	color: #0f2b5e;
	text-decoration: underline;
}

.media-card__meta {
	font-size: 0.8em;
	color: #888;
	margin: 0;
}

.media-card__external {
	position: absolute;
	top: 0.75em;
	right: 0.75em;
	font-size: 0.75em;
	color: #aaa;
}


.news-header h3 {
	font-size: 1.4em !important;
	font-weight: 700;
	margin: 0 !important;
	color: #0f2b5e;
}

/* Publication box card */
/* Consistent card radius across all post-type boxes */
article.box-publication,
article.box-news,
article.box-coverage,
article.box-people {
	margin-bottom: 2rem;
}

article.box-publication > a,
article.box-publication > .pub-card-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
}

article.box-publication > .pub-card-inner .box-text-container {
	flex: 1;
}

article.box-publication > a,
article.box-news > a,
article.box-coverage > a,
article.box-people > a {
	display: block;
	height: 100%;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 2px 14px rgba(0, 0, 0, 0.10);
	position: relative;
}

article.box-publication > a,
article.box-publication > .pub-card-inner {
	background: #cce0f5; /* overridden by inline CSS from functions.php */
}

.box-tags {
	padding: 0 15px 15px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.tag-pill {
	display: inline-block;
	background: #0f2b5e;
	color: #fff;
	font-size: 0.875rem;
	font-weight: 600;
	padding: 4px 12px;
	border-radius: 20px;
	text-decoration: none;
	letter-spacing: 0.03em;
}

.tag-pill:hover {
	background: #002147;
	color: #fff;
}

/* Publication cover container */
.box .box-publication-container {
	background-color: #0f2b5e;
	height: 200px;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	position: relative;
}

.box .box-publication-container.top-half {
	align-items: flex-start;
}

.box .box-publication-container.bottom-half {
	align-items: flex-end;
}

.box .box-publication-container svg {
	position: absolute;
	fill: #002147;
}

.box .box-publication-container.top-half svg {
	transform: rotate(180deg) scale(-1.05, 0.95);
	bottom: -10px;
	right: 0;
}

.box .box-publication-container.bottom-half svg {
	transform: scale(1.05, 0.95);
	top: -5px;
	right: 0;
}

.box .box-publication-container img {
	max-height: 300px;
	height: auto;
	max-width: 250px;
	transform: rotate(10deg);
	margin-top: 20px;
	position: relative;
	z-index: 2;
	width: auto !important;
}

.box .box-publication-container.bottom-half img {
	padding-bottom: 20px;
	margin-top: 0;
}

.box-publication:nth-child(even) .box-publication-container img {
	transform: rotate(-10deg);
}

.box-people p:last-of-type {
	margin-bottom: 120px;
}

.single-publications .box button.btn-primary {
	margin-bottom: 0;
}

article.featured-publication {
	padding-left: 0;
	padding-right: 0;
}

.featured-publication a .box-interior {
	display: flex;
	align-items: stretch;
	padding-left: 0;
	padding-right: 0;
	float: none;
	width: 100%;
}

.featured-publication.featured.box .button-container {
	bottom: 0;
	right: 0;
	padding-bottom: 0;
}

.featured-publication .box-publication-container {
	height: 100%;
}

.featured-publication .box-publication-container svg {
	height: 100%;
	width: 100%;
}

	.dropdown-content {

		padding-bottom:10px;
	}

/* ===================================================
   Mobile menu — simple vertical list style
   =================================================== */

#mobile-menu {
	background-color: #002147 !important;
	padding-bottom: 0 !important;
}

#mobile-menu .container-xl {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

#mobile-menu .container-xl .row {
	margin: 0 !important;
	margin-top: 0 !important;
	display: block !important;
}

/* Each mega-menu column becomes full-width */
#mobile-menu .col-12.col-md-4 {
	width: 100% !important;
	max-width: 100% !important;
	flex: 0 0 100% !important;
	padding: 0 !important;
	float: none !important;
}

#mobile-menu .section-first-level-items {
	border-right: none !important;
	margin: 0 !important;
	padding: 0 !important;
	height: auto !important;
}

#mobile-menu .section-first-level-items .menu-item {
	font-size: 1rem !important;
	margin-bottom: 0 !important;
	padding: 0 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.13) !important;
}

#mobile-menu .section-first-level-items .menu-item > a,
#mobile-menu .section-first-level-items .menu-item > span {
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	padding: 14px 18px !important;
	color: #ffffff !important;
	text-decoration: none !important;
	font-family: 'Outfit', sans-serif !important;
	font-size: 1.25rem !important;
	font-weight: 400 !important;
	letter-spacing: 0.01em !important;
	text-transform: none !important;
}

#mobile-menu .section-first-level-items .menu-item-has-children > a::after {
	content: '›';
	font-size: 1.5em;
	font-weight: 300;
	line-height: 1;
	opacity: 0.65;
	flex-shrink: 0;
	display: inline-block;
	transition: transform 0.2s ease;
}

#mobile-menu .section-first-level-items .menu-item-has-children.is-open > a::after {
	transform: rotate(90deg);
}

#mobile-menu .section-second-level-items {
	display: none;
	margin: 0 !important;
	padding: 0 !important;
	border-left: none !important;
	list-style: none;
	background-color: rgba(0, 0, 0, 0.2);
}

#mobile-menu .menu-item-has-children.is-open > .section-second-level-items {
	display: block;
}

#mobile-menu .section-second-level-items .menu-item {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

#mobile-menu .section-second-level-items .menu-item a {
	display: block !important;
	padding: 11px 18px 11px 32px !important;
	color: rgba(255, 255, 255, 0.85) !important;
	font-size: 1.1rem !important;
	text-decoration: none !important;
	font-family: 'Outfit', sans-serif !important;
	font-weight: 400 !important;
	letter-spacing: 0.01em !important;
	text-transform: none !important;
}

#mobile-menu .section-second-level-items .menu-item a:hover {
	color: #ffffff !important;
	background-color: rgba(255, 255, 255, 0.08) !important;
}

#menu-main_menu-1 > .menu-item:last-of-type ul.section-first-level-items {
	padding-bottom: 0 !important;
}
#contactus{

	padding-bottom:30px!important;
}
#filter-bar{display:none;}
.title-bar{margin-bottom:15px;}
