/*
Theme Name: Grace Eyre
Author: Pipe Media
Author URI: https://pipemedia.co.uk
Description: Responsive WordPress Theme for Grace Eyre
Version: 1.0
*/

/* Basic Styles
------------------------------------------- */

	body {
		background-color: #FFFFFF;
		font-family: "museo-sans-rounded", Arial, Helvetica, Sans-serif;
		font-size: 20px;
		line-height: 27px;
		color: #454545;
		font-weight: 300;
	}

/* Typography
------------------------------------------- */

	h1, h2, h3, h4, h5, h6 {
		color: #118898;
		font-weight: 700;
		margin: 0 0 20px; }
	h1 { font-size: 54px; line-height: 62px; margin: 20px 0 50px; font-weight: 900; color: #454545; }
	h2 { font-size: 36px; line-height: 40px; margin: 60px 0 40px; }
	h3 { font-size: 28px; line-height: 36px; margin: 50px 0 30px; font-weight: 300; }
	h4 { font-size: 20px; line-height: 24px; }
	h5 { font-size: 16px; line-height: 20px; }
	h6 { font-size: 14px; line-height: 18px; }
	
	p { margin: 0 0 20px; font-weight: 300; }
	p.small { color: #666666; font-size: 16px; line-height: 21px; }
	p.medium { font-size: 24px; line-height: 30px; }
	p.large { font-weight: 300; font-size: 36px; line-height: 46px; }
	p.larger { font-weight: 900; font-size: 36px; line-height: 46px; }
	p img { margin: 0; }

	em { font-style: italic; }
	strong { font-weight: 700; }
	small { font-size: 80%; }

/*	Blockquotes  */
	blockquote, blockquote p { line-height: 36px; font-size: 26px; font-style: italic; color: #555555; }
	blockquote { margin: 40px 0 0; }
	blockquote p:last-child { margin: 0; }
	
/*	Horizontal Line  */
	hr { border: solid #CCCCCC; border-width: 1px 0 0; clear: both; margin: 20px 0; height: 0; }

/*	Text alignment  */

	.text-center { text-align: center; }

/* Misc Utilities
------------------------------------------- */

/*	Display None  */
	.d-none { display: none; }
	.d-none-important { display: none !important; }

/*	Margins  */
	.m-0 { margin: 0; }
	.mb-10 { margin-bottom: 10px; }
	.mb-20 { margin-bottom: 20px; }
	.mb-30 { margin-bottom: 30px; }
	.mb-40 { margin-bottom: 40px; }
	.mb-60 { margin-bottom: 60px; }
	.mt-10 { margin-top: 10px; }
	.mt-20 { margin-top: 20px; }
	.mt-40 { margin-top: 40px; }
	.mt-60 { margin-top: 60px; }
	.ml-20 { margin-left: 20px; }
	.mr-20 { margin-right: 20px; }
	.m-auto { margin: 0 auto; }

/*	Floats  */

	.float-left { float: left; }
	.float-right { float: right; }

/* Accessibility
------------------------------------------- */

	.colour-mode-page {
		filter: saturate(50%);
	}

/* Links
------------------------------------------- */

	a { color: #454545; text-decoration: underline; }
	a:hover { color: #000000; }
	
	a.btn,
	button.btn,
	form .frm_submit button {
		border-radius: 30px;
		display: inline-block;
		background-color: #118898;
		padding: 12px 30px;
		text-decoration: none;
		font-weight: 700;
		font-size: 28px;
		color: #FFFFFF;
		transition: background .3s ease;
	}
	
	a.btn.btn-sm {
		padding: 10px 25px;
		line-height: 20px;
		font-size: 20px;
	}

	a.btn.btn-white {
		background-color: #FFFFFF;
		color: #118898;
	}
	
	a.btn.btn-block {
		text-align: center;
		display: block;
		padding: 12px;
	}
	
	a.btn:hover,
	form .frm_submit button:hover {
		background-color: #E9493D;
		color: #FFFFFF;
	}

/* Lists
------------------------------------------- */

	ul {
		list-style: square;
		padding: 0 0 0 22px;
	}
	
	ul li, ol li {
		margin: 0 0 8px;
		padding-left: 7px;
	}

/* Images
------------------------------------------- */

	img {
		max-width: 100%;
		height: auto;
	}

	img.alignleft {
		float: left;
		margin: 0 40px 0 0;
	}
	
	img.alignright {
		float: right;
		margin: 0 0 0 40px;
	}
	
	img.aligncenter {
		margin: 40px auto;
		display: block;
	}

	img.img-rounded {
		border-radius: 50%;
		position: relative;
	}

	.image-holder {
		background-color: #118898;
		border-radius: 50%;
		padding-left: 15px;
	}
	
	.image-holder-rectangle {
		background-color: #FFFFFF;
		border-radius: 5px;
		padding: 15px;
		-moz-box-shadow: 0 0 5px #DDDDDD;
		-webkit-box-shadow: 0 0 5px #DDDDDD;
		box-shadow: 0 0 5px #DDDDDD;
	}
	
	.image-holder-rectangle.image-holder-rectangle-no-shadow {
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	
	.wp-caption.alignleft {
		float: left;
		margin: 0 40px 0 0;
	}
	
	.wp-caption.alignright {
		float: right;
		margin: 0 0 0 40px;
	}
	
	.wp-caption .wp-caption-text {
		margin: 5px 0 0;
		font-style: italic;
	}
	
/* Video
------------------------------------------- */

	.video {
		position: relative;
		padding-bottom: 56.25%;
		height: 0;
	}

	.video iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

/* Forms
------------------------------------------- */
	
	input[type="text"], input[type="email"], input[type="password"], textarea {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		border-radius: 0;
	}
	
	#login-form label {
		display: block;
		font-weight: 700;
		margin-bottom: 5px;
	}
	
	#login-form input {
		width: 100%;
		border-radius: 3px;
		height: 38px;
		line-height: 26px;
		border: 1px solid #BFC3C8;
		padding: 7px;
	}
	
	#login-form input:focus {
		border-color: #118898;
	}

	#donate-form .frm_primary_label {
		border-bottom: 2px solid #FFFFFF;
		margin-bottom: 20px;
	}
	
	#donate-form .frm_opt_container .frm_radio label {
		display: inline-block;
		width: 100%;
	}
	
	#donate-form .frm_opt_container .frm_radio label input {
		display: none !important;
	}
	
	#donate-form .frm_opt_container .frm_radio label span {
		border: 1px solid #2F54CC;
		border-radius: 25px;
		padding: 8px 20px;
		display: inline-block;
		width: 100%;
		text-align: center;
		cursor: pointer;
	}
	
	#donate-form .frm_opt_container .frm_radio label input:checked + span {
		background-color: #2F54CC;
		color: #FFFFFF;
	}
	
	#donate-form form .frm_submit button {
		background-color: #2F54CC;
		font-size: 18px;
		width: 100%;
		transition: background .3s ease;
	}
	
	#donate-form form .frm_submit button.frm_prev_page {
		margin-bottom: 10px;
	}
	
	#donate-form form .frm_submit button.frm_prev_page,
	#donate-form form .frm_submit button:hover {
		background-color: #888888;
	}
	
	#course-search-form label {
		display: block;
		font-weight: 700;
		margin-bottom: 5px;
	}
	
	#course-search-form input,
	#course-search-form select {
		width: 100%;
		border-radius: 3px;
		height: 38px;
		line-height: 26px;
		border: 1px solid #BFC3C8;
		padding: 7px;
	}

/* Table
------------------------------------------- */

	table {
		border-collapse: collapse;
		margin: 0;
		width: 100%;
		text-align: left;
	}

	table tr th,
	table tr td {
		border-bottom: 1px solid #DDDDDD;
		padding: 10px;
	}
	
/* Colour Utilities
------------------------------------------- */

	.colour-teal {
		background-color: #118898;
	}

	.colour-l-teal {
		background-color: #CFE7EA;
	}

	.colour-red {
		background-color: #E9493D;
	}

	.colour-l-red {
		background-color: #FBDBD8;
	}

	.colour-blue {
		background-color: #2F54CC;
	}

	.colour-l-blue {
		background-color: #D5DDF5;
	}

	.colour-orange {
		background-color: #F68015;
	}

	.colour-l-orange {
		background-color: #FDE5D0;
	}

	.colour-purple {
		background-color: #8709CF;
	}

	.colour-l-purple {
		background-color: #E7CEF5;
	}

	.text-colour-white {
		color: #FFFFFF;
	}

	.text-colour-teal {
		color: #118898;
	}

	.text-colour-red {
		color: #E9493D;
	}

	.text-colour-blue {
		color: #2F54CC;
	}

	.text-colour-orange {
		color: #F68015;
	}

	.text-colour-purple {
		color: #8709CF;
	}

/* Sections
------------------------------------------- */

	section {
		position: relative;
		padding: 80px 0;
	}

	section h2:first-child {
		margin-top: 0;
	}

	section.section-even .image-holder-rectangle,
	section.page-header .image-holder-rectangle {
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}

/* Accordion
------------------------------------------- */

	.small-accordion {
		border-bottom: 1px solid #CCCCCC;
	}

	.small-accordion .accordion-title {
		border-top: 1px solid #CCCCCC;
		font-weight: 700;
		padding: 25px 25px 25px 0;
		margin: 0;
		position: relative;
	}

	.small-accordion .accordion-title:hover,
	.large-accordion .accordion-title:hover {
		cursor: pointer;
	}

	.small-accordion .accordion-title:focus,
	.large-accordion .accordion-title:focus {
		outline: none;
	}

	.small-accordion .accordion-title .ui-icon,
	.large-accordion .accordion-title .ui-icon {
		position: absolute;
		right: 0;
		top: 22px;
	}

	.small-accordion .accordion-title .ui-icon::before,
	.large-accordion .accordion-title .ui-icon::before {
		display: block;
		content: "+";
	}

	.small-accordion .accordion-title.ui-state-active .ui-icon::before,
	.large-accordion .accordion-title.ui-state-active .ui-icon::before {
		content: "-";
	}

	.small-accordion .accordion-content {
		padding-bottom: 25px;
	}
	
	.small-accordion .accordion-content a {
		display: inline;
	}

	.large-accordion {
		margin-top: 30px;
	}

	.large-accordion > .accordion-title {
		background-color: #CFE7EA;
		font-size: 36px;
		line-height: 48px;
		border-radius: 10px;
		padding: 40px;
		margin: 40px 0 0;
		font-weight: 700;
		position: relative;
	}
	
	.section-even .large-accordion > .accordion-title {
		background-color: #FFFFFF;
		color: #118898;
	}

	.large-accordion > .accordion-title.ui-state-active {
		border-radius: 10px 10px 0 0;
	}

	.large-accordion > .accordion-title > .ui-icon {
		right: 40px;
		top: 36px;
	}

	.large-accordion > .accordion-content {
		background-color: #CFE7EA;
		padding: 0 40px 40px;
		border-radius: 0 0 10px 10px;
	}
	
	.section-even .large-accordion > .accordion-content {
		background-color: #FFFFFF;
	}

/* Card
------------------------------------------- */

	.card {
		background-color: #FFFFFF;
		padding: 30px;
		border-radius: 10px;
	}

	.card.card-small {
		padding: 25px;
	}

	.card.card-with-title {
		background: #FFFFFF url('images/right-arrow.svg') bottom 30px right 30px no-repeat;
		background-size: 15px auto;
		padding: 30px 30px 60px;
		transition: all .2s ease-in-out;
	}

	.card.card-with-title:hover {
		transform: scale(1.05);
	}

	.card a {
		text-decoration: none;
		display: block;
		width: 100%;
		height: 100%;
	}
	
	.card p a,
	.card a.img-link {
		display: inline;
		height: auto;
		width: auto;
		text-decoration: underline;
	}

	.card h3 {
		font-weight: 500;
		margin-top: 0;
	}

	.card h3 a {
		text-decoration: none;
	}
	
	.card h3 a:hover {
		text-decoration: underline;
		color: #118898;
	}

	.card.card-with-title h3 {
		background-color: #2F54CC;
		color: #FFFFFF;
		font-weight: 700;
		padding: 10px 0;
		border-radius: 35px;
		margin: 0 0 40px;
	}

	.card.card-with-title .image-holder {
		background-color: #D5DDF5;
		margin-bottom: 30px;
	}

	.card.card-with-shadow {
		-moz-box-shadow: 0 0 15px #DDDDDD;
		-webkit-box-shadow: 0 0 15px #DDDDDD;
		box-shadow: 0 0 15px #DDDDDD;
	}
	
	.card.card-relative {
		position: relative;
	}
	
	section.section-even .card.card-with-shadow {
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}

	.card.card-with-shadow .amount {
		width: 120px;
		height: 120px;
		padding-left: 10px;
		border-radius: 50%;
		position: absolute;
		top: -15px;
		right: -15px;
	}

	.card.card-with-shadow .amount .amount-inner {
		font-size: 30px;
		font-weight: 700;
		width: 120px;
		height: 120px;
		color: #FFFFFF;
		border-radius: 50%;
		position: relative;
	}

	.card.card-with-shadow .amount .amount-inner span {
		position: absolute;
  		top: 50%;
  		left: 50%;
  		transform: translate(-50%, -50%);
	}

	.card.card-small p:last-child {
		margin: 0;
	}
	
	.card.card-in-listing.card-in-listing-featured {
		background-color: #118898;
		color: #FFFFFF;
	}
	
	.card.card-in-listing.card-in-listing-featured h3 a {
		color: #FFFFFF;
	}

/* Card Buttons
------------------------------------------- */

	.card-button {
		line-height: 36px;
		font-size: 28px;
		border-radius: 10px;
		font-weight: 700;
		transition: all .2s ease-in-out;
	}

	.card-button:hover {
		transform: scale(1.05);
	}

	.card-button a {
		text-decoration: none;
		display: block;
		color: #FFFFFF;
		padding: 40px 50px 40px 20px;
		position: relative;
	}
	
	.card-button a::after {
		content: ">";
		display: block;
		right: 20px;
		top: 50%;
		position: absolute;
		margin-top: -15px;
	}

	.card-button a span {
		float: right;
	}

	.card-button a:hover {
		text-decoration: underline;
	}

/* Story Card
------------------------------------------- */
	
	.story-card {
		padding: 0 20px;
	}
	
	.story-card h3 {
		margin: 20px 0 15px;
		font-weight: bold;
	}
	
	.story-card p.story-card-btn {
		margin-top: 30px;
	}

/* Icons
------------------------------------------- */

	.icon {
		text-align: center;
		padding: 0 15px;
	}

	.icon .material-icons-outlined {
		font-size: 60px;
		display: block;
		margin-bottom: 20px;
		color: #118898;
	}
	
	.icon p {
		line-height: 29px;
		font-size: 22px;
	}

/* Articles
------------------------------------------- */

	ul.news-categories {
		list-style: none;
		margin: 0 0 60px;
		padding: 0;
	}

	ul.news-categories li {
		display: inline-block;
		margin: 0 10px;
		padding: 0;
	}

	ul.news-categories li a {
		border-bottom: 3px solid #118898;
		text-decoration: none;
		color: #CFE7EA;
		display: block;
		padding: 3px 0;
	}

	ul.news-categories li a:hover,
	ul.news-categories li.selected a {
		border-color: #FFFFFF;
		color: #FFFFFF;
	}

	ul.news-categories li.selected a {
		font-weight: 500;
	}

	.article-grid {
		/*padding-bottom: 20px;*/
	}

	.article-grid .article:last-child {
		float: left;
	}

	article {
		position: relative;
		padding-bottom: 55px;
		margin: 0 15px 80px;
	}
	
	article.no-padding {
		padding: 0;
	}

	article h3 {
		font-weight: 700;
		font-size: 24px;
		line-height: 32px;
		margin: 30px 0 15px;
	}

	article h3 a,
	article p {
		text-decoration: none;
		color: #FFFFFF;
	}

	article h3 a:hover {
		text-decoration: underline;
		color: #FFFFFF;
	}
	
	.articles-in-page article h3 a,
	.articles-in-page article h3 a:hover {
		color: #118898;
	}
	
	.articles-in-page article p {
		color: #454545;
	}
	
	.articles-in-page article .image-holder-rectangle {
		-moz-box-shadow: 0 0 5px #DDDDDD;
		-webkit-box-shadow: 0 0 5px #DDDDDD;
		box-shadow: 0 0 5px #DDDDDD;
	}

	article.home-grid .image-holder {
		max-width: none !important;
	}

	article .btn-holder {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 0;
	}

/* Pagination
------------------------------------------- */

	.pagination {
		text-align: center;
	}

	.pagination span,
	.pagination a {
		display: inline-block;
		background-color: #CFE7EA;
		border-radius: 50%;
		width: 47px;
		text-align: center;
		text-decoration: none;
		padding: 10px 0;
		margin-right: 5px;
		color: #118898;
	}
	
	.pagination span:hover,
	.pagination a:hover,
	.pagination span.current {
		background-color: #FFFFFF;
	}
	
	.pagination span.current {
		font-weight: 500;
	}

/* Cookie Consent
------------------------------------------- */

	.ch2 .ch2-theme-bar .ch2-dialog {
		border-top: 2px solid #118898;
		box-shadow: none;
	}

	.ch2 .ch2-container .ch2-dialog {
		font-family: "museo-sans-rounded", Arial, Helvetica, Sans-serif;
	}

	.ch2 .ch2-dialog-actions button {
		box-shadow: none;
		border-radius: 15px;
	}
	
	.ch2 .ch2-dialog-actions button:hover {
		box-shadow: none;
	}

/* Header
------------------------------------------- */
	
	header {
		background-color: #FFFFFF;
		padding: 20px 0 25px;
		position: relative;
		z-index: 999;
	}

	header .row {
		position: relative;
	}

	/*header #logo {
		background: url('images/logo.svg') no-repeat;
		background-size: 100% auto;
		width: 290px;
		height: 69px;
	}

	header #logo a {
		display: block;
		width: 100%;
		height: 100%;
		text-indent: -9999px;
	}*/

	header .colour-mode {
		position: relative;
		float: left;
	}

	header button.btn.btn-search {
		background-color: #888888;
		font-size: 16px;
		line-height: 16px;
		padding: 6px 20px;
		border-radius: 20px;
		cursor: pointer;
		float: right;
	}
	
	header button.btn.btn-search:hover {
		text-decoration: underline;
	}

	header button.btn.btn-search.open {
		background-color: #118898;
	}

	header .colour-mode > label {
		color: #888888;
		font-size: 14px;
		line-height: 25px;
		font-weight: 500;
		float: left;
		margin-right: 5px;
	}

	header .colour-mode-switcher {
		float: right;
	}

	header .colour-mode-switcher input[type=checkbox] {
		height: 0;
		width: 0;
		visibility: hidden;
		display: block;
	}
	
	header .colour-mode-switcher label {
		cursor: pointer;
		text-indent: -9999px;
		width: 40px;
		height: 20px;
		background: #CCCCCC;
		display: block;
		border-radius: 100px;
		position: relative;
	}
	
	header .colour-mode-switcher label:after {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 20px;
		height: 20px;
		background: #F68015;
		border-radius: 90px;
		transition: 0.3s;
	}
	
	header .colour-mode-switcher input:checked + label {
		background: #BADA55;
	}
	
	header .colour-mode-switcher input:checked + label:after {
		left: calc(100%);
		transform: translateX(-100%);
	}
	
	header .colour-mode-switcher label:active:after {
		width: 40px;
	}
	
	header .colour-mode .colour-tooltip {
		position: absolute;
		bottom: -34px;
		right: -7px;
		background: rgba(0, 0, 0, 0.8);
		color: #FFF;
		font-size: 14px;
		line-height: 14px;
		padding: 5px 10px;
		z-index: 999;
		border-radius: 3px;
		display: none;
	}
	
	header .colour-mode .colour-tooltip::before {
		bottom: 100%;
		left: 50%;
		border: solid transparent;
		content: " ";
		height: 0;
		width: 0;
		position: absolute;
		border-color: rgba(194, 225, 245, 0);
		border-bottom-color: rgba(0, 0, 0, 0.8);
		border-width: 6px;
		margin-left: -6px;
	}
	
	header .colour-mode-switcher:hover + .colour-tooltip {
		display: block;
	}
	
/* Banner
------------------------------------------- */
	
	#banner {
		background-color: #E9493D;
		color: #FFFFFF;
		padding: 10px 0;
	}
	
	#banner p {
		font-weight: 700;
		color: #FFFFFF;
		margin: 0;
	}
	
	#banner a.btn {
		background-color: #FFFFFF;
		color: #E9493D;
		line-height: 27px;
		font-size: 20px;
		padding: 5px 15px;
		margin-left: 20px;
	}
	
	#banner a.btn:hover {
		text-decoration: underline;
	}
	
/* Navigation
------------------------------------------- */
	
	nav ul {
		list-style: none;
		padding: 0;
		margin: 0;
		float: right;
	}

	nav ul li {
		display: inline-block;
		margin: 0;
		padding: 0;
		font-weight: 500;
	}

	nav ul li a {
		text-decoration: none;
	}

	nav ul li a:hover {
		text-decoration: underline;
	}

	#primary {
		position: absolute;
		right: 1rem;
		bottom: -28px;
	}

	#primary ul li {
		font-size: 18px;
		position: relative;
		padding-bottom: 25px;
	}

	#primary ul li a {
		color: #118898;
		display: block;
		padding: 0 20px;
	}

	#primary ul li a:hover {
		color: #454545;
	}

	#primary ul > li.menu-item-has-children > a {
		background: url('images/menu-down.svg') right center no-repeat;
		background-size: 10px auto;
	}

	#primary ul > li.menu-item-has-children:hover > a {
		background: url('images/menu-up.svg') right center no-repeat;
		background-size: 10px auto;
	}

	#primary ul li.btn {
		margin-left: 15px;
	}

	#primary ul li.btn a {
		background-color: #2F54CC;
		color: #FFFFFF;
		font-weight: 700;
		font-size: 16px;
		line-height: 16px;
		padding: 6px 25px;
		border-radius: 20px;
	}
	
	#primary ul li.btn a span {
		font-size: 16px;
		display: inline-block;
		margin: -2px 4px 0 0;
		vertical-align: middle;
		animation: beat .4s infinite alternate;
		color: rgba(255, 255, 255, 0.75);
	}
	
	@keyframes beat{
		to { transform: scale(1.3); color: #FFFFFF; }
	}

	#primary ul li ul {
		background-color: #118898;
		border-radius: 0 0 5px 5px;
		position: absolute;
		display: none;
		left: 20px;
		top: 100%;
		width: max-content;
		float: none;
		min-width: 200px;
		/*padding: 10px 20px;*/
		padding: 10px 0;
		z-index: 999;
	}

	#primary ul li:hover > ul,
	#primary ul li:focus-within > ul {
		display: block;
	}

	#primary ul li ul li {
		display: block;
		padding: 0;
		margin: 0 0 0 10px;
	}

	#primary ul li ul li a {
		color: #FFFFFF;
		padding: 8px 15px 8px 5px;
	}
	
	#primary ul li ul li a:hover {
		color: #FFFFFF;
	}
	
	#primary ul > li > ul > li.menu-item-has-children > a {
		background: none;
	}
	
	#primary ul > li > ul > li.menu-item-has-children:hover > a {
		background: #FFFFFF;
		border-radius: 5px 0 0 5px;
		color: #118898;
	}
	
	#primary ul li ul li ul {
		background-color: #FFFFFF !important;
		left: 100%;
		top: -53px;
		border-right: 1px solid #CFE7EA !important;
		border-bottom: 1px solid #CFE7EA !important;
	}
	
	#primary ul li ul li#menu-item-218 ul {
		top: -10px;
	}
	
	#primary ul li ul li#menu-item-220 ul {
		top: -53px;
	}
	
	#primary ul li ul li#menu-item-14792 ul {
		top: -95px;
	}
	
	#primary ul li ul li ul li a {
		color: #454545;
	}
	
	#primary ul li ul li ul li a:hover {
		color: #454545;
	}

	#secondary ul li {
		font-size: 14px;
	}

	#secondary ul li a {
		color: #888888;
		display: block;
		padding: 0 10px;
	}

/* Footer
------------------------------------------- */

	#newsletter {
		padding-bottom: 70px;
	}
	
	section:not(.section-even) + #newsletter {
		border-top: 2px solid #CFE7EA;
	}
	
	#newsletter ul.social {
		list-style: none;
		padding: 0;
		margin: 0 0 45px;
	}
	
	#newsletter ul.social li {
		display: inline-block;
		margin: 0 10px;
		padding: 0;
	}
	
	#newsletter ul.social li svg {
		fill: #4267B2;
		width: 50px;
		height: 50px;
	}
	
	#newsletter ul.social li.twitter svg {
		fill: #1DA1F2;
	}
	
	#newsletter ul.social li.instagram svg {
		fill: #5B7EA3;
	}
	
	#newsletter ul.social li.linkedin svg {
		fill: #0A66C2;
	}

	#newsletter p.title {
		font-weight: 700;
		color: #118898;
		font-size: 36px;
		line-height: 40px;
	}
	
	#newsletter form input {
		height: 44px;
		padding: 10px;
	}
	
	#newsletter form .frm_submit button {
		background-color: #2F54CC;
		width: 100%;
		padding: 8px 0;
		transition: background .3s ease;
	}
	
	#newsletter form .frm_submit button:hover {
		background-color: #888888;
	}

	footer {
		padding-bottom: 20px;
	}

	footer ul.logos {
		list-style: none;
		margin: 0 0 30px;
		padding: 0;
	}

	footer ul.logos li {
		display: inline-block;
		margin: 10px 15px;
	}

	footer ul.logos li img {
		max-height: 65px;
	}

	footer nav ul {
		float: none;
		margin-bottom: 10px;
	}

	footer nav ul li a {
		display: block;
		padding: 0 15px;
	}

	footer nav ul li a:hover {
		text-decoration: underline;
		color: #666666;
	}

	footer nav ul li,
	footer p {
		line-height: 21px;
		font-size: 14px;
		font-weight: 300;
	}
	
	footer p {
		margin-bottom: 10px;
	}

	footer nav ul li a,
	footer p,
	footer p a {
		color: #888888;
	}

/* Breadcrumbs
------------------------------------------- */

	#breadcrumbs {
		border-top: 2px solid #CFE7EA;
		padding: 20px 0;
	}

	#breadcrumbs p {
		line-height: 18px;
		font-size: 12px;
		margin: 0;
	}

	#breadcrumbs p span.sep {
		margin: 0 5px;
	}

	#breadcrumbs p span.breadcrumb_last {
		color: #666666;
	}

/* Search Form
------------------------------------------- */

	#search-form {
		background-color: #CFE7EA;
		padding: 10px 0;
	}

	#search-form form {
		background-color: #FFFFFF;
		border: 1px solid #CCCCCC;
		border-radius: 30px;
		padding: 3px;
	}

	#search-form form input {
		background-color: #FFFFFF;
		border: none;
		border-radius: 30px 0 0 30px;
		padding: 13px 30px;
		width: 100%;
	}

	#search-form form button.btn {
		font-size: 20px;
		line-height: 26px;
		width: 100%;
	}

/* Page
------------------------------------------- */	
	
	.row {
		max-width: 1325px;
	}

	section.page-header .row {
		position: relative;
	}

	section.page-header .image-holder {
		margin-bottom: -120px;
		padding-left: 20px;
		position: relative;
		z-index: 9999;
	}

	section.curve-top,
	section.curve-bottom,
	section.page-header {
		position: relative;
	}
	
	section.page-header-single-image {
		padding: 0;
	}
	
	section.page-header-single-image img {
		width: 100%;
		height: auto;
	}
	
	section.page-header-slider-images {
		padding: 0;
		overflow: hidden;
	}
	
	section.page-header-slider-images .row.with-slider,
	section.page-header-single-image .row.with-slider {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
	}
	
	section.page-header-slider-images #slider-holder .owl-carousel .owl-dots {
		text-align: center;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 20px;
	}

	section.page-header-slider-images #slider-holder .owl-carousel .owl-dots .owl-dot {
		width: 15px;
		height: 15px;
		border-radius: 50%;
		background-color: #CFE7EA;
		margin: 0 5px;
	}

	section.page-header-slider-images #slider-holder .owl-carousel .owl-dots .owl-dot.active {
		background-color: #118898;
	}

	section .section-curve-top {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		width: 100%;
		fill: #FFFFFF;
	}

	section .section-curve-bottom {
		position: absolute;
		bottom: -1px;
		left: 0;
		right: 0;
		width: 100%;
		fill: #FFFFFF;
	}

	section .section-curve-bottom.section-curve-bottom-teal {
		fill: #118898;
	}

/* Home
------------------------------------------- */

	.page-header-slider .row {
		position: relative;
	}
	
	.page-header-slider .row .large-4 {
		position: relative;
	}
	
	.page-header-slider .welcome-circle {
		position: absolute;
		top: -100px;
		left: 1rem;
		z-index: 998;
		width: 100%;
		right: 1rem;
	}
	
	.page-header-slider .welcome-circle img {
		width: 100%;
	}

	/*.page-header-slider .welcome-circle {
		color: #FFFFFF;
		width: 460px;
		height: 460px;
		border-radius: 50%;
		position: absolute;
		top: -100px;
		left: 1rem;
		z-index: 998;
	}

	.page-header-slider .welcome-circle h1 {
		font-size: 58px;
		line-height: 70px;
		color: #FFFFFF;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 75%;
		margin: 0;
	}*/

	.page-header-slider p {
		color: #FFFFFF;
	}

/* Jobs
------------------------------------------- */
	
	ul.news-categories.jobs-location-filter li a {
		border-bottom: 3px solid #CFE7EA;
		text-decoration: none;
		color: #118898;
		display: block;
		padding: 3px 0;
	}

	ul.news-categories.jobs-location-filter li a:hover,
	ul.news-categories.jobs-location-filter li.selected a {
		border-color: #118898;
		color: #118898;
	}

/* Timetable
------------------------------------------- */

	#timetable ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	#timetable ul li {
		display: inline-block;
		margin: 0 0 -1px;
		padding: 0;
	}

	#timetable ul li a {
		text-decoration: none;
		padding: 15px 20px;
		display: block;
		border-radius: 5px 5px 0 0;
	}

	#timetable ul li.ui-state-active a {
		background-color: #F9F9F9;
		border: 1px solid #EEEEEE;
		color: #118898;
		border-bottom: none;
		font-weight: 600;
	}

	#timetable .timetable-day {
		background-color: #F9F9F9;
		border: 1px solid #EEEEEE;
		padding: 15px;
	}
	
	#timetable.tabs-content .timetable-day ul {
		list-style: square;
		 padding: 0 0 0 22px;
	}
	
	#timetable.tabs-content .timetable-day ul li {
		margin: 0 0 8px;
		padding-left: 7px;
		display: list-item;
	}

	#timetable .timetable-day h2  {
		margin-bottom: 20px;
		font-size: 30px;
		line-height: 36px;
	}

	table.timetable {
		margin: 0;
		font-size: 18px;
		table-layout: fixed;
	}

	table.timetable thead tr th,
	table.timetable tbody tr td,
	table.timetable tbody tr th {
		border-bottom: 1px solid #CCCCCC;
		border-right: 1px solid #CCCCCC;
		padding: 10px;
		width: 20%;
		vertical-align: top;
	}

	table.timetable thead tr th {
		color: #FFFFFF;
		background-color: #118898;
	}
	
	/*table.timetable thead tr th.montefiore {
		background-color: #F68015;
		border-right: 1px solid #2F54CC;
		border-bottom: 1px solid #F68015;
	}
	
	table.timetable thead tr th.craven-vale {
		background-color: #2F54CC;
		border-right: 1px solid #E9493D;
		border-bottom: 1px solid #2F54CC;
	}
	
	table.timetable thead tr th.exeter-hall {
		background-color: #E9493D;
		border-right: 1px solid #8709CF;
		border-bottom: 1px solid #E9493D;
	}
	
	table.timetable thead tr th.woodingdean {
		background-color: #8709CF;
		border-bottom: 1px solid #8709CF;
	}
	
	table.timetable thead tr th.brighton-marina {
		background-color: #F68015;
		border-right: 1px solid #2F54CC;
		border-bottom: 1px solid #F68015;
	}
	
	table.timetable thead tr th.king-alfred {
		background-color: #2F54CC;
		border-right: 1px solid #E9493D;
		border-bottom: 1px solid #2F54CC;
	}
	
	table.timetable thead tr th.moulsecoomb {
		background-color: #E9493D;
		border-right: 1px solid #8709CF;
		border-bottom: 1px solid #E9493D;
	}
	
	table.timetable thead tr th.weald {
		background-color: #8709CF;
		border-bottom: 1px solid #8709CF;
	}
	
	table.timetable thead tr th.st-anns {
		background-color: #F68015;
		border-right: 1px solid #2F54CC;
		border-bottom: 1px solid #F68015;
	}*/

	table.timetable tbody tr th {
		text-align: right;
	}

	table.timetable thead tr th:last-child,
	table.timetable tbody tr td:last-child {
		border-right: none;
	}
	
	table.timetable tbody tr td.timeslot {
		font-weight: 600;
	}
	
	table.timetable tbody tr td.timeslot span {
		font-weight: 300;
	}
	
	table.timetable tbody tr td table tbody tr td {
		background-color: #FFFFFF;
		border-bottom: 10px solid #F9F9F9;
		background-color: #CFE7EA;
	}
	
	/*table.timetable tbody tr td.montefiore table tbody tr td {
		background-color: #FDE5D0;
	}
	
	table.timetable tbody tr td.craven-vale table tbody tr td {
		background-color: #D5DDF5;
	}
	
	table.timetable tbody tr td.exeter-hall table tbody tr td {
		background-color: #FBDBD8;
	}
	
	table.timetable tbody tr td.woodingdean table tbody tr td {
		background-color: #E7CEF5;
	}
	
	table.timetable tbody tr td.brighton-marina table tbody tr td {
		background-color: #FDE5D0;
	}
	
	table.timetable tbody tr td.king-alfred table tbody tr td {
		background-color: #D5DDF5;
	}
	
	table.timetable tbody tr td.moulsecoomb table tbody tr td {
		background-color: #FBDBD8;
	}
	
	table.timetable tbody tr td.weald table tbody tr td {
		background-color: #E7CEF5;
	}
	
	table.timetable tbody tr td.st-anns table tbody tr td {
		background-color: #FDE5D0;
	}*/

/* Calendar
------------------------------------------- */
	
	#calendar table {
		margin: 0;
	}
	
	#calendar .fc-view {
		background-color: #FFFFFF;
	}

	#calendar .fc-toolbar h2 {
		font-size: 28px;
	}

	#calendar table thead tr td table thead tr th {
		background-color: #EEEEEE;
		padding: 10px;
		font-weight: 500;
	}

	#calendar .fc-state-default {
		background-image: none;
		box-shadow: none;
		border-radius: 0 !important;
		border-color: rgba(0, 0, 0, 0.1);
		text-shadow: none;
	}

	#calendar .fc-basic-view .fc-day-number,
	#calendar .fc-basic-view .fc-week-number {
		padding: 10px;
	}

	#calendar .fc-event {
		background-color: #F15A29;
		border-color: #F15A29;
		border-radius: 0;
		font-size: 14px;
		padding: 5px;
		margin: 0 10px 5px;
		font-weight: 200;
	}

	#calendar .fc-event .fc-content {
		white-space: normal;
	}

/* Logos
------------------------------------------- */
	
	section ul.logos-page {
		list-style: none;
		margin: 0;
		padding: 0;
		text-align: center;
	}

	section ul.logos-page li {
		display: inline-block;
		margin: 10px 15px;
	}

	section ul.logos-page li img {
		max-height: 65px;
	}

/* Share page
------------------------------------------- */

	ul.share-buttons {
		list-style: none;
		margin: 30px 0 0;
		padding: 0;
		text-align: center;
	}
	
	ul.share-buttons li {
		display: inline-block;
		margin: 0 5px;
		padding: 0;
		font-weight: 600;
	}
	
	ul.share-buttons li a {
		background-color: #4267B2;
		padding: 10px 20px;
		display: block;
		border-radius: 20px;
		color: #FFFFFF;
		text-decoration: none;
	}
	
	ul.share-buttons li.twitter a {
		background-color: #000000;
	}
	
	ul.share-buttons li.email a {
		background-color: #999999;
	}
	
	ul.share-buttons li.whats-app a {
		background-color: #25D366;
	}
	
	ul.share-buttons li a svg {
		fill: #FFFFFF;
		vertical-align: middle;
		margin: -5px 5px 0 0;
	}

/* Media Queries
------------------------------------------- */

/* Small only */
@media screen and (max-width: 39.9375em) {

	h1{	line-height: 44px; font-size: 36px; margin-bottom: 30px; }
	.large-accordion > .accordion-title,
	#newsletter p.title,
	h2 { font-size: 30px; line-height: 36px; }
	h3 { font-size: 24px; line-height: 28px; }
	h4 { font-size: 20px; line-height: 24px; }
	h5 { font-size: 16px; line-height: 20px; }
	h6 { font-size: 14px; line-height: 18px; }

	p.large {
		line-height: 32px;
		font-size: 24px;
	}

	p.larger {
		line-height: 28px;
		font-size: 24px;
	}
	
	img.alignleft,
	img.alignright,
	img.aligncenter {
		margin: 20px 0;
		float: none;
		display: block;
	}
	
	a.btn, button.btn, form .frm_submit button {
		font-size: 24px;
		padding: 10px 20px;
	}
	
	a.btn.btn-block {
		padding: 10px;
	}

	.card,
	.card-button {
		margin-bottom: 20px;
	}

	.card {
		padding: 20px;
	}

	.image-holder {
		margin: 40px 0 40px -1.5rem;
		max-width: 85%;
	}
	
	.image-holder-rectangle {
		margin: 40px auto;
		max-width: 85%;
		display: block;
	}

	section {
		padding: 60px 0;
	}

	section.page-header {
		padding-top: 50px;
	}

	section.page-header .image-holder {
		margin: 0 0 30px -1.5rem;
	}
	
	section.page-header .image-holder-rectangle {
		margin: 0 auto 20px;
	}

	header {
		padding-bottom: 0;
	}

	header #logo {
		width: 200px;
		height: 47px;
		margin-bottom: 35px;
	}

	header ul.mobile-controls {
		list-style: none;
		padding: 0;
		margin: 0;
		position: absolute;
		top: 0;
		right: 1rem;
	}

	header ul.mobile-controls li {
		float: right;
		clear: both;
		margin: 0;
		padding: 0;
	}

	header ul.mobile-controls li a.mobile-menu {
		background: url('images/menu-closed.svg') center no-repeat;
		background-size: 30px auto;
		width: 30px;
		height: 20px;
		display: block;
		text-indent: -9999px;
	}

	header ul.mobile-controls li a.mobile-menu.menu-open {
		background: url('images/menu-open.svg') center no-repeat;
		background-size: 20px auto;
	}

	header ul.mobile-controls li a.btn {
		background-color: #2F54CC;
		font-size: 16px;
		line-height: 16px;
		padding: 6px 20px;
		margin-top: 15px;
	}
	
	header ul.mobile-controls li a.btn span {
		font-size: 16px;
		display: inline-block;
		margin: -2px 4px 0 0;
		vertical-align: middle;
		animation: beat .4s infinite alternate;
		color: rgba(255, 255, 255, 0.75);
	}
	
	#banner {
		line-height: 21px;
		font-size: 16px;
	}
	
	#banner a.btn {
		line-height: 21px;
		font-size: 16px;
		margin: 10px 0 0;
	}

	#primary {
		background-color: #CFE7EA;
		position: static;
		margin: 0 -1rem;
		padding: 10px 1rem;
		display: none;
	}

	#primary ul {
		float: none;
	}

	#primary ul li {
		display: block;
		padding-bottom: 0;
	}

	#primary ul li a {
		padding: 10px 0;
	}
	
	#primary ul li#menu-item-330 {
		padding-top: 10px;
	}

	#primary ul li#menu-item-330 a {
		border-top: 1px solid #118898;
		padding-top: 17px;
	}

	#primary ul li.show-for-small-only {
		font-size: 16px;
	}

	#primary ul li.show-for-small-only a {
		color: #454545;
		padding: 7px 0;
	}

	#primary ul li:hover > ul,
	#primary ul li:focus-within > ul {
		display: none;
	}

	#primary ul > li.menu-item-has-children.menu-open > a {
		background: url('images/menu-up.svg') right center no-repeat;
		background-size: 10px auto;
	}
	
	#primary ul li ul {
		position: static;
		width: 100%;
		border-radius: 5px;
	}
	
	#primary ul li ul li {
		margin: 0 10px;
	}
	
	#primary ul li ul li.show-for-small-only {
		font-size: 18px;
	}
	
	#primary ul li ul li.show-for-small-only a {
		color: #FFFFFF;
		padding: 8px 15px 8px 5px;
	}
	
	#primary ul > li > ul > li.menu-item-has-children > a {
		position: relative;
	}
	
	#primary ul > li > ul > li.menu-item-has-children > a::before {
		position: absolute;
		top: 5px;
		right: 5px;
		content: "+";
	}
	
	#primary ul > li > ul > li.menu-item-has-children.menu-open > a::before {
		content: "-";
	}
	
	#primary ul li ul li ul {
		border: none !important;
		border-radius: 5px;
		padding: 5px 0;
	}
	
	#primary ul li ul li ul li {
		font-size: 16px;
	}
	
	#primary ul li ul li ul li a {
		padding: 6px 15px 6px 5px;
	}

	.page-header-slider .welcome-circle {
		position: relative;
		top: 0;
		left: 0;
		margin-left: -1.5rem;
		width: 300px;
		height: 300px;
	}
	
	.card {
		max-width: 400px;
		margin: 0 auto 40px;
	}
	
	.card.card-with-shadow {
		max-width: 370px;
		margin: 0 auto 40px;
	}
	
	.card-button {
		max-width: 370px;
		margin: 0 auto 20px;
		font-size: 22px;
	}
	
	.card-button a {
		padding: 20px 30px 20px 15px;
	}
	
	.card-button a::after {
		right: 15px;
		margin-top: -18px;
	}
	
	.card.card-with-title .image-holder {
		margin: 0 auto 30px;
	}
	
	.card.card-with-shadow .amount .amount-inner {
		font-size: 24px;
	}
	
	.card.card-with-shadow .amount {
		top: -5px;
		right: -5px;
	}
	
	.card.card-with-shadow .amount,
	.card.card-with-shadow .amount .amount-inner {
		width: 100px;
		height: 100px;
	}
	
	.large-accordion > .accordion-title {
		padding: 20px 50px 20px 20px;
		margin-top: 25px;
	}
	
	.large-accordion > .accordion-title > .ui-icon {
		right: 20px;
		top: 18px;
	}
	
	.large-accordion > .accordion-content {
		padding: 0 20px 20px;
	}
	
	footer ul.logos li img {
		max-height: 50px;
	}
	
	.donate-row {
		margin-top: 0;
	}
	
	article .image-holder-rectangle {
		margin: 0;
		max-width: none;
	}
	
	section.page-header-slider-images,
	section.page-header-single-image {
		padding: 0;
	}
	
	section.page-header-slider-images #slider-holder {
		position: static;
	}
	
	section.page-header-slider-images .welcome-circle,
	section.page-header-single-image .welcome-circle {
		display: none;
	}
	
	#course-search-form {
		margin: 0 0 40px;
		max-width: none;
	}
	
	#course-search-form .columns.medium-3 {
		margin-bottom: 10px;
	}

}

/* Medium and up */
@media screen and (min-width: 40em) {
	
	body.home #primary ul li ul {
		background-color: #CFE7EA;
	}
	
	body.home #primary ul li ul li a,
	body.home #primary ul li ul li a:hover {
		color: #454545;
	}
	
}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	
	h1,
	.page-header-slider .welcome-circle h1 {
		line-height: 50px;
		font-size: 44px;
		margin-bottom: 30px;
	}
	.large-accordion > .accordion-title,
	#newsletter p.title,
	h2 { font-size: 32px; line-height: 36px; }
	h3 { font-size: 26px; line-height: 30px; }
	h4 { font-size: 20px; line-height: 24px; }
	h5 { font-size: 16px; line-height: 20px; }
	h6 { font-size: 14px; line-height: 18px; }

	p.larger { font-size: 32px; line-height: 36px; }

	blockquote, blockquote p { font-size: 24px; line-height: 30px; }

	header {
		padding: 20px 0 15px;
	}

	header .row {
		min-height: 140px;
	}

	#secondary ul {
		margin-bottom: 10px;
	}

	#secondary ul li a {
		padding: 0 5px;
	}

	header .controls {
		float: right;
	}

	header .colour-mode {
		margin-right: 10px;
	}

	header button.btn.btn-search {
		float: left;
		margin-right: 10px;
	}

	header a.btn.btn-donate {
		background-color: #2F54CC;
		padding: 6px 20px;
		float: left;
		font-size: 16px;
		line-height: 16px;
	}
	
	header a.btn.btn-donate span {
		font-size: 16px;
		display: inline-block;
		margin: -2px 4px 0 0;
		vertical-align: middle;
		animation: beat .4s infinite alternate;
		color: rgba(255, 255, 255, 0.75);
	}

	#primary {
		bottom: -16px;
	}

	#primary ul {
		float: none;
	}

	#primary ul li {
		font-size: 16px;
		padding-bottom: 20px;
	}
	
	#primary ul > li#menu-item-37 > a {
		padding-right: 0;
	}
	
	section.page-header-slider {
		padding: 65px 0;
	}
	
	/*.page-header-slider .welcome-circle {
		width: 300px;
		height: 300px;
		top: -75px;
	}
	
	.page-header-slider .welcome-circle h1 {
		width: 80%;
		line-height: 50px;
		font-size: 40px;
	}*/
	
	.page-header-slider p {
		line-height: 28px;
		font-size: 24px;
	}

	.card {
		padding: 20px;
	}

	.card.card-with-shadow.ml-20.mr-20 {
		margin-left: 0;
		margin-right: 0;
	}
	
	.card.card-with-title {
		padding: 10px 10px 60px;
	}
	
	.card-button {
		font-size: 24px;
		line-height: 30px;
	}
	
	.card-button a {
		padding: 20px 45px 20px 20px;
	}
	
	footer ul.logos li img {
		max-height: 50px;
	}
	
	article {
		margin: 0 0 80px;
	}
	
	.card.card-with-shadow .amount {
		top: -5px;
		right: -5px;
	}
	
	.card.card-with-shadow .amount,
	.card.card-with-shadow .amount .amount-inner {
		width: 80px;
		height: 80px;
		font-size: 22px;
	}

	.icon {
		padding: 0;
	}
	
	section.page-header-slider-images {
		padding: 0;
		min-height: auto;
	}
	
	section.page-header-slider-images #slider-holder {
		position: static;
	}
	
	section.page-header-slider-images .welcome-circle,
	section.page-header-single-image .welcome-circle {
		display: none;
	}
	
	section.page-header-single-image {
		padding: 0;
	}

}

@media screen and (min-width: 640px) and (max-width: 688px) {
	
	#primary ul li a {
		padding: 0 13px;
	}
	
}

/* Large and up */
@media screen and (min-width: 64em) {

	section:not(.page-header) .image-holder {
		max-width: 80%;
	}
	
	header .row {
		min-height: 70px;
	}

}

@media screen and (min-width: 1024px) and (max-width: 1185px) {
	
	header .row {
		min-height: 90px;
	}
	
}

/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {}