/*!
Theme Name: Porridge
Theme URI: https://www.ormistonacademiestrust.co.uk/
Author: Jason Keyse
Author URI: https://www.ormistonacademiestrust.co.uk/
Description: Custom-built WordPress theme for Ormiston Academies Trust
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
Text Domain: porridge
*/


/******************
* FORMATTING STYLES
******************/

html {
	}

body {
	background-color: #111;
	}

#page {
	background-color: #fff;
	}

ul, ol {
	list-style-position: outside;
	}

ul {
	margin-left: 14px;
	}

ol {
	margin-left: 18px;
	}

ul ul, ul ol, ol ol, ol ul {
	font-size: 100% !important;
	}

/**********************************
* PULL-QUOTE AND BLOCK-QUOTE STYLES
**********************************/

.wp-block-pullquote {
	padding-top: 2em;
	padding-bottom: 2em;
	text-align: left;
	}

.wp-block-pullquote blockquote {
	margin-left: 0;
	margin-right: 0;
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 35px 30px;
    padding-top: 50px;
    }

.oatcyan .wp-block-pullquote blockquote {background-image: url('assets/images/oat-quote-cyan.png');}
.oatcobalt .wp-block-pullquote blockquote {background-image: url('assets/images/oat-quote-cobalt.png');}
.oatpurple .wp-block-pullquote blockquote {background-image: url('assets/images/oat-quote-purple.png');}
.oatmauve .wp-block-pullquote blockquote {background-image: url('assets/images/oat-quote-mauve.png');}
.oatturquoise .wp-block-pullquote blockquote {background-image: url('assets/images/oat-quote-turquoise.png');}
.oatgreen .wp-block-pullquote blockquote {background-image: url('assets/images/oat-quote-green.png');}
.oatyellow .wp-block-pullquote blockquote {background-image: url('assets/images/oat-quote-yellow.png');}


.wp-block-pullquote p {
	font-weight: 600;
	margin-bottom: 15px;
	}

.wp-block-pullquote cite {
	font-size: 0.8em;
	}

.oatcyan .wp-block-pullquote p, .oatcyan .wp-block-pullquote cite {color: #00AEFF;}
.oatcobalt .wp-block-pullquote p, .oatcobalt .wp-block-pullquote cite {color: #0047AB;}
.oatpurple .wp-block-pullquote p, .oatpurple .wp-block-pullquote cite {color: #7158A4;}
.oatmauve .wp-block-pullquote p, .oatmauve .wp-block-pullquote cite {color: #BC73AF;}
.oatturquoise .wp-block-pullquote p, .oatturquoise .wp-block-pullquote cite {color: #49BFB5;}
.oatgreen .wp-block-pullquote p, .oatgreen .wp-block-pullquote cite {color: #C5DC7F;}
.oatyellow .wp-block-pullquote p, .oatyellow .wp-block-pullquote cite {color: #FFCA05;}

.wp-block-quote {
	width: 50%;
	padding: 3em 1.25em 1.25em 1.25em;
	margin: 0 30px 20px 0;
	float: left;
	font-weight: 600;
	border-radius: 6px;
    background-repeat: no-repeat;
    background-position: 1.25em 1.25em;
    background-size: 20px 17px;
	}

@media (max-width: 899px) {
	.wp-block-quote {
		width: 100%;
		}
	}

.wp-block-quote p {
	margin-bottom: 10px;
	}

.wp-block-quote cite {
	font-weight: normal;
	}

.oatcyan .wp-block-quote {background-color: #00AEFF;}
.oatcobalt .wp-block-quote {background-color: #0047AB;}
.oatpurple .wp-block-quote {background-color: #7158A4;}
.oatmauve .wp-block-quote {background-color: #BC73AF;}
.oatturquoise .wp-block-quote {background-color: #49BFB5;}
.oatgreen .wp-block-quote {background-color: #C5DC7F;}
.oatyellow .wp-block-quote {background-color: #FFCA05;}

.oatcyan .wp-block-quote,
.oatcobalt .wp-block-quote,
.oatpurple .wp-block-quote,
.oatmauve .wp-block-quote,
.oatturquoise .wp-block-quote {background-image: url('assets/images/oat-quote-white.png'); color: #fff;}
 
.oatgreen .wp-block-quote,
.oatyellow .wp-block-quote {background-image: url('assets/images/oat-quote-black.png'); color: #000;}


/**************************************
* END PULL-QUOTE AND BLOCK-QUOTE STYLES
**************************************/

.wp-block-embed iframe { /* FORCE EMBEDED VIDEO TO FULL-WIDTH */
	aspect-ratio: 16/9;
	width: 100%;
	height: 100%;
	border-radius: 6px;
	}
	
a.button.button-white {
	background-color: #fff;
	transition: background-color .3s ease-in-out;
	}

a.button.button-white:hover {
	background-color: #bbb;
	}

/**************************
* BRAND ILLUSTRATION STYLES
**************************/

.brandimagewrapper {
	display: inline-block;
	text-align: center;
	overflow-x: hidden;
	}

/* Extra small devices (phones, 600px and down) */
@media (max-width: 600px) {
	.brandimagewrapper {
		margin-left: calc(-100% - 50vw);
		margin-right: calc(-100% - 50vw);
		margin-top: 20px;
		margin-bottom: 40px;
		}
	
	.brandimagewrapper #pagepic {
		min-width: 100vw !important;
		width: 350vw !important;
		}
	}

/* Small devices (between 600px and 768px) */
@media (min-width: 600px) and (max-width: 768px) { 
	.brandimagewrapper {
		margin-left: calc(-12% - 50vw);
		margin-right: calc(-12% - 50vw);
		margin-top: 10px;
		margin-bottom: 50px;
		}
	
	.brandimagewrapper #pagepic {
		min-width: 100vw !important;
		width: 200vw !important;
		}
	}

/* Devices 768px and up */
@media (min-width: 769px) { 
	.brandimagewrapper {
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		margin-top: 0;
		margin-bottom: 60px;
		}
	
	.brandimagewrapper #pagepic {
		min-width: 100vw !important;
		width: 100vw !important;
		}
	}


/***********************************
* THEME-SPECIFIC STYLES FOR PORRIDGE
***********************************/

.hero-area {
	margin-bottom: 50px;
	}

header.site-header {
	background-color: #fff;
	margin-bottom: 30px;
	}

.brandingwrapper {
	padding-top: 40px;
	margin-bottom: 15px;
	}

.logowrapper img {
	width: 120px;
	height: auto;
	}

/*********************
* MAX MEGA MENU STYLES
*********************/

li.mega-smMenu a i {
	font-size: 28px;
	}

li.mega-smMenu {
	float: left !important;
	clear: none !important;
	background-color: #fff !important;
	padding: 11px 5px 0px 0px !important;
	margin-top: 10px !important;
	margin-bottom: 10px !important;
	}

li.mega-smMenu.mega-smMenuFirst {
	margin-left: 10px !important;
	padding-left: 5px !important;
	border-radius: 2px 0 0 2px !important; 
	}

li.mega-smMenu.mega-smMenuLast {
	border-radius: 0 2px 2px 0 !important; 
	}

li.mega-smMenu.mega-smMenutx a i { color: #000; }
li.mega-smMenu.mega-smMenufb a i { color: #1877fb; }
li.mega-smMenu.mega-smMenuyt a i { color: #ff0000; }
li.mega-smMenu.mega-smMenuli a i { color: #0a66c2; }

.mega-toggle-block {
	margin-left: -6px !important;
	}

/*******************
* SOCIAL MENU STYLES
*******************/

@media (min-width: 900px) {
	.socialmenu, .noclick {
		display: none;
		}
	}

@media (max-width: 899px) {
	
	.socialmenu {
		color: #666;
		font-size: 1.6em;
		padding: 1px 10px;
		margin-right: 10px;
		border-radius: 4px;
		border:1px solid #ddd;
		float: left;
		}
	
	.noclick {
		display: block;
		margin: 30px 0 15px 0;
		}
	
	.noclick a {
		color: #aaa !important;
		text-transform: lowercase !important;
		}
	
	.noclick a::first-letter {
		text-transform: uppercase;
		}
	
	.socialwrapper {
		display: none;
		}
	}

@media (min-width: 900px) {
	.socialwrapper {
		text-align: right !important;
		}
	
	.socialwrapper a {
		margin-right: 15px;
		}
	
	.socialwrapper a:last-child {
		margin-right: 0;
		}
	
	.socialwrapper a img {
		width: 30px;
		height: auto;
		}
	}

.colcol {
	background-color: #ddd;
	height: 30px;
	display: block;
	}

footer.site-footer {
	background-color: #0a0c17;
	color: #fff;
	padding: 20px 0;
	}

.tempBuild div {
	text-align: center;
	}

button.button-primary.button-recolor-to,
button.button-primary.button-recolor-to-cyan {
	background-color: #00AEFF;
	border-color: #00AEFF;
	}

button.button-primary.button-recolor-to-:hover,
button.button-primary.button-recolor-to-cyan:hover {
	background-color: #0047AB;
	border-color: #0047AB;
	color: #FFFFFF;
	}

button.button-primary.button-recolor-to-cobalt {
	background-color: #0047AB;
	border-color: #0047AB;
	}

button.button-primary.button-recolor-to-cobalt:hover {
	background-color: #FFFFFF;
	border-color: #FFFFFF;
	color: #00AEFF;
	}

/****************
* OAT PAGE STYLES
****************/

@media (max-width: 899px) /* mobile display */ {
	.oat-page.entry-content,
	.oat-page.entry-title,
	.oat-page.entry-meta,
	.oat-page.entry-thumbnail,
	.oat-page.entry-footer {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		}
	}

@media (min-width: 900px) /* desktop display */ {
	.oat-page.entry-content,
	.oat-page.entry-title,
	.oat-page.entry-description,
	.oat-page.entry-meta,
	.oat-page.entry-thumbnail,
	.oat-page.entry-footer {
		width: 80%;
		margin-left: auto;
		margin-right: auto;
		}
	}

.oat-page.entry-meta {
	font-size: 1em;
	}

.entry-thumbnail img {
	max-width: 100%;
	height: auto;
	border-radius: 6px;
	}

.entry-thumbnail {
	margin-bottom: 40px;
	}

.oat-page.entry-content {
	margin-bottom: 150px;
	}

.oat-page.entry-title {
	margin-bottom: 6rem;
	}

/*.oat-page.entry-title::after {
	display: block;
	margin-top: 10px;
	content: '';
	position: absolute;
	height: 6px;
	width: 90px;
	background-color: #FF8600;
	}*/

.oat-page.entry-title::after {
	display: block;
	margin-top: 10px;
	content: '';
	position: absolute;
	height: 6px;
	width: 90px;
	}

.oatcyan .oat-page.entry-title::after {background-color: #00AEFF;}
.oatcobalt .oat-page.entry-title::after {background-color: #0047AB;}
.oatpurple .oat-page.entry-title::after {background-color: #7158A4;}
.oatmauve .oat-page.entry-title::after {background-color: #BC73AF;}
.oatturquoise .oat-page.entry-title::after {background-color: #49BFB5;}
.oatgreen .oat-page.entry-title::after {background-color: #C5DC7F;}
.oatyellow .oat-page.entry-title::after {background-color: #FFCA05;}

.oat-page.entry-content::after {
	display: block;
	margin-top: 40px;
	margin-bottom: 80px;
	content: '';
	position: absolute;
	height: 6px;
	width: 90px;
	background-color: #dddddd;
	}

#post-240 .oat-page.entry-content::after {
	display: none;
	}

.oat-page.entry-footer {
	margin-top: 70px;
	margin-bottom: 80px;
	font-size: 0.85em;
	}

.oat-page.entry-footer span.cat-links,
.oat-page.entry-footer span.tags-links {
	margin-right: 20px;
	}

figure {
	margin-left: 0;
	margin-right: 0;
	}

figure img {
	border-radius: 6px;
	}

.wp-block-image figcaption,
.wp-block-kadence-image figcaption,
.wp-block-embed figcaption {
	margin-bottom: 50px;
	font-size: 0.85em;
	font-weight: 600;
	}

.wp-block-image figcaption::after,
.wp-block-kadence-image figcaption::after,
.wp-block-embed figcaption::after {
	display: block;
	margin-top: 5px !important;
	content: '';
	position: absolute;
	height: 3px;
	width: 60px;
	background-color: #DDDDDD;
	}


.wp-block-image figure.aligncenter figcaption::after,
.wp-block-kadence-image figure.aligncenter figcaption::after,
.wp-block-embed figure.aligncenter figcaption::after {
	left: 50%;
    transform: translate(-50%,0);
    }


/* Temp styles while in dev */

/*.featureonhomewrapper {
	margin-bottom: 0 !important;
	}*/

.feature-on-home {
	clear: both;
	display: block;
	padding: 20px 0;
	}

.feature-on-home a {
	color: #FFFFFF;
	}

/************
* TEXT STYLES
************/

h1, h2, h3, h4, h5 {
	font-weight: 700;
	clear: both;
	}

h1 {
	margin-bottom: 4rem;
	}

h1.stickyband {
	margin-bottom: 2rem;
	}

h1 a, h2 a, h3 a, h4 a, h5 a {
	text-decoration: none;
	}

b, strong {
	font-weight: 600;
	}

.oat-page h2, .oat-page h3, .oat-page h4, .oat-page h5 {
	margin-top: 40px;
	}

.entry-content ul {
	list-style-type: disc;
	}

.entry-content li {
	margin-bottom: 0.5rem;
	}

.entry-content li::marker {
	color: #00aeff;
	}

a:hover {
	color: #0047AB;
	}

/******************
* NAVIGATION STYLES
******************/

.main-navigation {
	display: block;
	width: 100%;
	}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
	}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
	}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
	}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
	}

.main-navigation ul ul a {
	width: 200px;
	}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
	}

.main-navigation li {
	position: relative;
	}

.main-navigation a {
	display: block;
	text-decoration: none;
	color: #000;
	text-transform: uppercase;
	font-weight: 500;
	}

.main-navigation li.current-menu-item a {
	color: #00aeff;
	}

/* Small menu. */
/*.menu-toggle,
.main-navigation.toggled ul {

	display: block;
}*/

/*@media screen and (min-width: 37.5em) {*/
/*@media screen and (min-width: 900px) {

	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: flex;
		gap: 25px;
	}
}*/

button.menu-toggle { display: none;} /* Disables the primary nav when using Max Mega Menu plugin */

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;
	}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
	}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
	}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
	}

/*************************
* BREADCRUMB NAV XT STYLES
*************************/

.poridgeBreadcrumbs {
	font-size: 0.82em;
	margin-bottom: 40px;
	color: #999;
	padding-bottom: 10px;
	border-bottom: 1px solid #eee;
	}

.poridgeBreadcrumbs span.current-item {
	color: #000;
	font-weight: 500;
	}

.poridgeBreadcrumbs a {
	color: #999;
	text-decoration: none;
	}

.poridgeBreadcrumbs a:hover {
	color: #00aeff;
	}

.homecrumb i {
	font-size: 0.9em;
	}

@media (max-width: 899px) /* mobile display */ {
	.poridgeBreadcrumbs { display: none; }
	}

@media (min-width: 900px) /* desktop display */ {
	.poridgeBreadcrumbs {
		width: 80%;
		margin-left: auto;
		margin-right: auto;
		}
	}

/**********************
* POST META DATA STYLES
**********************/

.metadivider {
	color: #ccc;
	margin-left: 12px;
	margin-right: 12px;
	}

/******************************************
* RELATED CONTENT and SCHOOL CONTACT STYLES
******************************************/

.relatedwrapper,
.schooldetails {
	margin-bottom: 50px;
	}


.relatedwrapper ul,
.schooldetails ul {
	list-style-type: none;
	margin-left: 0;
	}

.relatedwrapper ul li,
.schooldetails ul li {
	padding-bottom: 5px;
	margin-bottom: 12px;
	border-bottom: 1px solid #eee;
	}

.relatedwrapper ul li a,
.schooldetails ul li a,
.schooldetails ul li span {
	display: inline-flex;
	align-items: center;
	height: 30px;
	text-decoration: none;
	font-weight: 450;
	}

.relatedwrapper ul li a::before,
.schooldetails ul li a::before,
.schooldetails ul li span::before {
	margin-right: 15px;
	height: 30px;
	width: 30px;
	content: '';
	background-repeat: no-repeat;
	background-size: 200% auto;
	}

a.plainlink::before {
	margin: 0 5px 0 0 !important;
	height: auto !important;
	width: auto !important;
	background: none !important;
	content: none !important;
	}

.relatedwrapper ul li a.reldown::before {background-image: url('assets/images/related-icons-sprite-cyan.png'); background-position: 0 0;}
.relatedwrapper ul li a.relint::before {background-image: url('assets/images/related-icons-sprite-cyan.png'); background-position: 0 -30px;}
.relatedwrapper ul li a.relext::before {background-image: url('assets/images/related-icons-sprite-cyan.png'); background-position: 0 -60px;}
.schooldetails ul li span.scaddress::before, .schooldetails ul li a.scaddress::before {background-image: url('assets/images/school-icons-sprite.png'); background-position: 0 0;}
.schooldetails ul li a.sctel::before {background-image: url('assets/images/school-icons-sprite.png'); background-position: 0 -30px;}
.schooldetails ul li a.scemail::before {background-image: url('assets/images/school-icons-sprite.png'); background-position: 0 -60px;}
.schooldetails ul li a.scweb::before {background-image: url('assets/images/school-icons-sprite.png'); background-position: 0 -90px;}

.relatedwrapper ul li a:hover,
.schooldetails ul li a:hover {
	text-decoration: underline;
	}

.relatedwrapper ul li a:hover::before, .schooldetails ul li a:hover::before {background-position-x: 100%;}


/******************
* FLEXSLIDER STYLES
******************/

@media (max-width: 899px) /* mobile display */ {
	.showMobile {display: block !important;}
	.showDesktop {display: none !important;}
	p.slideHeading {font-size:4.5vw; margin-bottom: 1.25rem !important;}
	p.slideText {font-size:2.5vw; line-height: 1.5em;}
	.slideTextWrapper {top: 35% !important;}
	}

@media (min-width: 900px) /* desktop display */ {
	.showMobile {display: none !important;}
	.showDesktop {display: block !important;}
	p.slideHeading {font-size: 3.75vw;}
	p.slideText {font-size: 2.25vw; line-height: 1.3em;}
	}

.slideTextWrapper {
	/*color: #FFF;*/
	position: absolute;
	top: 30%;
	left: 50%;
	transform: translate(-50%, -50%);
	}

p.slideHeading {
	line-height: 1.1em;
	font-weight: 900;
	}

p.slideText {
	font-weight: normal;
	}

/*img.darkSlide { *********** Darkens slide background if slide has text overlay ***********
	filter: brightness(60%);
	}*/

	/******** FLEXSLIDER STYLES - ORIGINAL - DO NOT DELETE!! *********/

	/*	@media (max-width: 899px) {
			.showMobile {display: block !important;}
			.showDesktop {display: none !important;}
			p.slideHeading {font-size:3em;}
			}
		
		@media (min-width: 900px) {
			.showMobile {display: none !important;}
			.showDesktop {display: block !important;}
			p.slideHeading {font-size:4.5em;}
			}
		
		img.darkSlide {
			filter: brightness(60%);
			}
		
		.slideTextWrapper {
			text-align: center;
			color: #fff;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			}
		
		p.slideHeading {
			line-height: 1.1em;
			font-weight: 900;
			}
		
		p.slideText {
			font-size:1.5em;
			line-height: 1.1em;
			font-weight: 700;
			text-align: center;
		}
	
		*/

/**************
* SEARCH STYLES
**************/

p.searchterm,
p.searchtermnope {
	display: inline-flex;
	align-items: center;
	height: 30px;
	}

p.searchterm::before,
p.searchtermnope::before {
	margin-right: 15px;
	height: 30px;
	width: 30px;
	display: inline-block;
	content: '';
	background-image: url('assets/images/search-icon-sprite.png');
	background-repeat: no-repeat;
	background-size: 200% auto;
	background-position: 0 0;
	}

p.searchtermnope::before {
	background-image: url('assets/images/search-icon-nope-sprite.png');
	}

h5.searchtitle {
	font-size: 1.2em;
	margin-bottom: 0;
	font-weight: 700;
	}

a.searchurl {
	color: #bbb;
	font-size: 0.8em;
	}

a.searchurl:hover {
	color: #00aeff;
	}

.searchnav {
	margin: 50px 0;
	color: #999;
	/*font-weight: bold;*/
	}

.searchnav a {
	text-decoration: none;
	/*font-weight: normal;*/
	margin-right: 15px;
	}

.searchnav span.current {
	margin-right: 15px;
	}

.newsearch {
	display: block;
	height: 45px;
	}

.searchagain label {
	display: inline-block;
	}

.searchagain input.search-submit {
	background-color: #00AEFF;
	color: #fff;
	border: 0;
	transition: 0.25s;
	margin-left: 15px;
	vertical-align: top;
	}

.searchagain input.search-submit:hover {
	background-color: #0047AB;
	}

/**********************************
* STAFF GRIDS and SINGLE STAFF PAGE
**********************************/

.staffwrapper {
	margin-bottom: 60px;
	}
	
.staffgrid {
	display: grid;
	column-gap: 10%;
	row-gap: 50px;
	}

@media (max-width: 599px) /* mobile display */ {
	.staffgrid {grid-template-columns: repeat(2, minmax(0, 1fr));}	
	}

@media (min-width: 600px) /* desktop display */ {
	.staffgrid {grid-template-columns: repeat(3, minmax(0, 1fr));}
	}

.staffgriditem::after {
	display: block;
	margin-top: 10px;
	content: '';
	position: absolute;
	height: 3px;
	width: 60px;
	background-color: #00aeff;
	}

.staffgriditem a,
.staffgriditem p {
	margin: 0;
	padding: 0;
	}

.staffgriditem a {
	font-weight: 700;
	font-size: 1.3em;
	color: #000;
	text-decoration: none;
	}

.staffgriditem a img {
	transition: filter 0.3s ease;
	}

.staffgriditem a img:hover {
	filter: brightness(90%);
	}

.staffgriditem p {
	font-size: 0.9em;
	}

p.staffgridorder {
	/*background-color: #eee;*/
	color: #000;
	font-size: 0.7em;
	padding: 3px 0px;
	margin: 8px 0;
	/*border-radius: 2px;*/
	}

.profilethumb {
	/*text-align: center;*/
	}

.profilethumb img {
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	width: 250px;
	max-width: 100%;
	height: auto;
	border-radius: 6px;
	border: 8px solid #eee;
	}

.singlestaff.entry-thumbnail {
	margin-bottom: 10px;
	}

/***********************
* SCHOOL PROFILE PAGES *
***********************/

span.schooldivider hr {
	margin-top: 1em;
	margin-bottom: 1.5em;
	}

.schoolcontact {
	display: flex;
	flex-flow: row wrap;
	}

.schooldetails .profilethumb.schoollogo,
.schooldetails .ofstedrating {
	display: inline-block;
	}

.schooldetails .ofstedrating {
	margin-left: 15px;
	}

.profilethumb.schoollogo img {
	width: 180px;
	}

/******************
* SCHOOL HUB PAGE *
******************/

.schoolgrid {
	display: grid;
	column-gap: 5%;
	row-gap: 40px;
	}

@media (min-width: 400px) /* small display */ {
	.schoolgrid {grid-template-columns: repeat(2, minmax(0, 1fr));}	
	}

@media (min-width: 600px) /* medium display */ {
	.schoolgrid {grid-template-columns: repeat(4, minmax(0, 1fr));}
	}

@media (min-width: 1000px) /* desktop display */ {
	.schoolgrid {grid-template-columns: repeat(5, minmax(0, 1fr));}
	}

.schoolgriditem a {
	margin: 0;
	padding: 0;
	text-decoration: none;
	}

.schoolgriditem a img {	transition: filter 0.3s ease; }
.schoolgriditem a img:hover { filter: brightness(90%); }

.schoolgriditem img {
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	max-width: 100%;
	height: auto;
	border-radius: 6px;
	border: 8px solid #eee;
	}

/************
* NEWS GRID *
************/

@media (min-width: 900px) {
	.newsgrid {grid-template-columns: repeat(3, minmax(0, 1fr));}
	}

@media (max-width: 899px) {
	.newsgrid {grid-template-columns: repeat(2, minmax(0, 1fr));}
	}

@media (max-width: 499px) {
	.newsgrid {grid-template-columns: repeat(1, minmax(0, 1fr));}
	}

	
.newsgrid {
	display: grid;
	column-gap: 5%;
	row-gap: 20px;
	}

h4.smalltitle.grid {
	margin-top: 0;
	}

.newsnav {
	margin: 30px 0 10px 0;
	}

.newsnav a {
	text-decoration: none;
	}

.newsnav .olderposts a::after {
	font-family: "Font Awesome 6 Pro";
	font-weight: 900;
	content: "\f152";
	margin-left: 10px;
	}

.newsnav .newerposts a::before {
	font-family: "Font Awesome 6 Pro";
	font-weight: 900;
	content: "\f191";
	margin-right: 10px;
	}

.newsnav .newerposts {
	margin-right: 40px;
	}

@media (max-width: 768px) /* DESKTOP */ {
	
	.newsgrid .cardwrapper {
		border-right: 1px solid #eee;
		border-bottom: 1px solid #eee;
		border-left: 1px solid #eee;
		border-radius: 0 0 6px 6px;
		}
	
	.newsgrid h4.smalltitle {
		font-size: 1.2em;
		margin-bottom: 1rem;
		letter-spacing: normal;
		}

	.newsgrid .cardwrapper p, .cardwrapper h4 {
		padding-left: 15px;
		padding-right: 15px;
		}
	
	/*.cardwrapper h4.smalltitle.oatwidget {
		padding-left: 0;
		padding-right: 0;
		}*/
	
	}

/*************
* BLOG PAGES *
*************/

.blogpp {
	background-color: #d9f3ff;
	border-radius: 6px;
	padding: 15px 15px 5px 15px;
	}

p.blogppauthor {
	font-weight: 600;
	margin-bottom: 10px;
	}

p.blogpptext,
p.blogattrib {
	margin-bottom: 10px;
	}

/*************************
* GOVERNOR EOI FORM STYLES
*************************/

.eoiForm .subtle {
	font-weight: normal !important;
	}

.eoiForm {
	width: 100%;
	padding: 20px;
	/*border: 8px solid #d3f1fc;*/
	border: 8px solid #8bdeff;
	border-radius: 6px;
	background-color: #cef2ff;
	margin-bottom: 20px;
	}

.eoiForm span.reqfield {
	color: red;
	padding: 0 2px;
	}

.eoiForm h3, .eoiForm h4 {
	font-weight: bold;
	}

.eoiForm h5 {
	margin-top: 10px;
	}

.eoiForm hr {
	margin: 30px 0 25px 0;
	border: 1px dashed #8bdeff;
	}

.eoiForm label {
	font-weight: 600 !important;
	width: 100%;
	font-weight: normal;
	}

.eoiForm input,
.eoiForm select,
.eoiForm textarea {
	border: 1px solid #8bdeff;
	border-radius: 4px;
	width: 100%;
	margin-top:4px;
	margin-bottom:0;
	}

.eoiForm select {
	padding: 7px;
	color: #000;
	background-color: #afeaff;
	border: 1px solid #3ab7e8;
	}

.eoiForm input[type="tel"],
.eoiForm input[type="date"] {
	padding: 6px 4px;
	outline: none;
	font: 13px helveticaneue,helvetica neue,Helvetica,Arial,sans-serif;
	color: #777;
	margin: 0;
	max-width: 100%;
	display: block;
	background: #fff;
	}

.eoiForm .wpcf7-submit {
	width: 200px;
	height: 46px;
	background-image: none;
	background-color: #00aeff;
	text-transform: uppercase;
	border: 4px solid #0082e9;
	border-radius: 8px;
	font-size: 1.2em;
	color: #fff;
	text-shadow: none;
	}

.eoiForm .wpcf7-submit:hover {
	background-image: none;
	background-color: #0082e9;
	border: 4px solid #0067b9;
	color: #fff;
	}

.eoiForm .formnote {
	margin-top: 30px;
	color: #666;
	font-size: 0.85em;
	line-height: normal;
	font-weight: normal;
	}

.eoiForm .wpcf7-not-valid-tip {
	font-weight: 500 !important;
	}

.wpcf7 form .wpcf7-response-output {
	margin: 2em 0 1em 0 !important;
	padding: 0.8em !important;
	border-radius: 8px;
	border-width: 4px !important;
	background-color: #fff;
	font-weight: 500;
	}

.wpcf7 form.invalid .wpcf7-response-output { background-color: #ffebc3; }

.wpcf7 form.sent .wpcf7-response-output { background-color: #d8f4cd; }

.eoiForm .wpcf7-radio {
	display: block;
	}

.eoiForm .wpcf7-radio span.wpcf7-list-item {
	margin: 0 2em 0 0 !important;
	}

.eoiForm .wpcf7-radio span.wpcf7-list-item input {
	width: 20px;
	}

/**********************
* WRITERS' STYLE PAGE *
**********************/

.styleentry {
	margin-bottom: 20px;
	border-bottom: 1px solid #eee;
	}

p.styletitle {
	font-weight: 700;
	margin-bottom: 10px;
	color: #00AEFF;
	}

p.styletitle a {
	text-decoration: none;
	}

.stylecontent {
	padding-left: 30px;
	}

.stylecontent p {
	margin-bottom: 15px;
	}

/*************************
* DOCS AND POLICIES PAGE *
*************************/

ul.folderlist {
	margin: 40px 0 30px 0;
	list-style: none;
	padding-left: 0;
	box-sizing: border-box;
	}

ul.folderlist li {
	margin-bottom: 15px;
	padding-bottom: 10px;
	border-bottom: 1px solid #eee;
	}

ul.folderlist li::before {
	content: none !important;
	}

ul.folderlist li a {
	transition: color ease-in-out .3s;
	display: inline-flex;
	align-items: center;
	height: 44px;
	background-image: url('assets/images/blue-folder-400-open-closed.png');
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 47px auto;
	font-size: 1.1em;
	padding-left: 60px;
	color: #000 !important;
	font-weight: 450;
	text-decoration: none;
	}

ul.folderlist li a:hover {
	background-image: url('assets/images/blue-folder-400-open-closed.png');
	background-position: left bottom;
	color: #00AFF0 !important;
	}

/***************
* CONTACT PAGE *
***************/

.socialRow img {
	width: 46px;
	height: auto;
	margin-right: 15px;
	}

/*************************
* "EVERY" VACANCIES STYLES
*************************/

#everyMainContainer a.every-search-btn {
	/*background-color: #00aeff !important;*/
	}

figure.picborder img {
	border: 10px solid #f3f3f3;
	}

body.page-id-6902 .wp-block-image img {
	/*max-height: 75px;
	width: auto !important;*/
	margin-top:20px;
	margin-bottom: 20px;
	}

body.page-id-6902 table td {
	border: 1px solid #ddd;
	padding: 7px;
	}	

body.page-id-6902 table {
	margin-bottom: 20px;
	}

.wp-block-image.c19icon img {
	width: 45px !important;
	height: 45px !important;
	}

/******************
* ACCORDION FIXES *
******************/

h5.accheading {
	margin-top: 0;
	}

/*********************
* FEATURED IMAGE FIT *
*********************/

.widefit img {
	aspect-ratio: 2 / 1;
	object-fit: cover;
	}

/****************
* FOOTER STYLES *
****************/

.footerwidgetwrapper {
	padding: 40px 0;
	font-size: 0.85em;
	color: #fff;
	}

.footerwidgetwrapper .columns {
	/*background-color: #222;*/
	}

.footerwidgetwrapper .footer-halves {
	margin-top: 40px;
	}

.footerwidgetwrapper .footer-right-half {
	text-align: right;
	}

.footerwidgetwrapper ul {
	list-style-type: none;
	margin-left: 0;
	}

.footerwidgetwrapper ul li {
	margin-bottom: 0;
	}

.footerwidgetwrapper a {
	color: #fff;
	text-decoration: none;
	}

.footerwidgetwrapper a:hover {
	color: #00aeff;
	}

/******************
* 404 PAGE STYLES *
******************/

.dracones {
	margin-top: 150px;
	margin-bottom: 150px;
	text-align: center;
	}

@media (max-width: 899px) /* mobile display */ {
	.dracones { margin-top: 80px; }
	}
	
.dracones img.ship {
	display: block;
	margin: 0 auto 30px auto;
	width: 120px;
	height: auto;
	}

.dracones img.legend {
	display: block;
	margin: 0 auto 80px auto;
	width: 500px;
	max-width: 100%;
	height: auto;
	}

.dracones h1.page-title {
	font-size: 2.5em;
	}

.dracones p.setsail {
	clear: both;
	width: 800px;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	}