/*  (C) 2019 Endis Ltd. 
	No permission is given to use this code, except on an Endis/ChurchInsight website.

	ChurchInsight over-ride CSS file for the Creation template.
	WARNING - do not edit this file unless you know exactly what you are doing. 
	You might consider making a BACKUP COPY before you change anything.
	If you need advice, contact ChurchInsight Support. */

/* Size of LOGO image */

header .logo-icon img { 
	height: 44px !important; /* <<< mobile logo height */
}
@media(min-width:467px){header .logo-icon img
{ 
	height:44px !important; /* <<< tablet logo height */
}}
@media(min-width:992px){
  	header .logo-icon img { 
		height: 58px !important; /* <<< desktop logo height */
    }
    header.HeaderSmall section.slice_Header_L .logo-icon img {
      height:40px !important; /* <<< desktop shrunken logo height */
    }
  header .logo-name {margin-bottom:30px;}
}
@media(min-width:1100px){
  	header .logo-icon img { 
		height: 98px !important; /* <<< desktop logo height */
    }
}

/* Gap between logo and top/bottom of screen  */
header div.logo-container 
{
	margin-top: 3px !important; /* <<< logo gap from top for mobile/tablet */
}
@media(min-width:992px){
  	header div.logo-container {
		margin-top: 8px !important; /* <<< logo gap from top for desktop */
	}
	header.HeaderSmall section.slice_Header_L div.logo-container {
      margin-top:20px !important; /* <<< logo gap from top for shrunken desktop */
    }
}

/* To make more space in the header when menu entries start over-writing the logo, adjust this */
header section.slice_Header_L div.nav-menu {margin-top:10px;}
@media (max-width:900px) {
	header section.slice_Header_L div.nav-menu {margin-top:55px;}
}
@media (max-width:900px) {
  header.HeaderSmall section.slice_Header_L div.nav-menu {margin-top:20px;} 
}

header section.slice_Header_L div.nav-menu ul.root_menu > li:last-child > a {padding-right:5px;}
.slice_Header_L .nav-menu ul.root_menu > li > a {font-size:18px;font-weight:600;}
@media (max-width:1320px) and (min-width:992px) {
  .slice_Header_L .nav-menu ul.root_menu > li > a {
    font-size:16px;padding-left:12px;padding-right:12px;}
}

/* Control header indentation on desktop screens */
section.slice_Header_L div.top-link-wrapper { transition:margin-right 300ms linear; }
section.slice_Header_L div.logo-container {transition:margin-left 300ms linear;}
section.slice_Header_L div.nav-menu {transition:padding-right 300ms linear;}
@media (min-width: 1400px) {
	section.slice_Header_L div.top-link-wrapper { margin-right: 50px; }
    section.slice_Header_L div.logo-container {margin-left: 50px;}
    section.slice_Header_L div.nav-menu {padding-right: 50px;}
}
@media (max-width:1500px) {
  header.HeaderSmall section.slice_Header_L div.logo-container {margin-left:10px;}
  header.HeaderSmall section.slice_Header_L div.top-link-wrapper {margin-right:10px;}
  header.HeaderSmall section.slice_Header_L div.nav-menu {padding-right:10px;}
}

header .logo-icon img { 
	width:  auto !important; 
  	transition:width 300ms linear, height 300ms linear;
}
header div.logo-container {margin-bottom: 0 !important;}

section.slice_Header_L div.nav-menu ul.root_menu ul {
	box-shadow: 0px 10px 10px 2px rgba(0,0,0,.12);
}

/* slide show button and round pager button colour */  
section.slice_content_page div.main-content div.bx-pager a
{
    background-color: #f5f5f5 !important; /* <<< slide show button background color */
    border-color: #f5f5f5 !important; /* <<< slide show button border color */
}
section.slice_content_page div.main-content div.bx-pager a:hover,
section.slice_content_page div.main-content div.bx-pager a.active
{
    background-color: #58585A !important; /* <<< slide show button background color */
    border-color: #58585A !important; /* <<< slide show button border color */
}

.slice_SlidesFullWidth a.slideButton,
body.OnSmallAppleDevice section.slice_SlidesFullWidth a.slideButton:hover
{
    background-color: #58585A !important; /* <<< slide show button background color */
    border-color: #58585A !important; /* <<< slide show button border color */
  	color: white !important;
}

.slice_SlidesFullWidth a.slideButton:hover
{
    background-color:white !important; /* <<< slide show button background color */
    border-color: #34495e !important; /* <<< slide show button border color */
  	color: #34495e !important; /* <<< slide show button color */
}

section.slice_WhatsOnSlidesEB_L div.bx-pager a, 
section.slice_WhatsOnSlidesEB_L div.bx-pager a
{
    background-color: #58585A !important; /* <<< slide show button background color */
    border-color: #58585A !important; /* <<< slide show button border color */
}
section.slice_WhatsOnSlidesEB_L div.bx-pager a:hover, 
section.slice_WhatsOnSlidesEB_L div.bx-pager a.active
{
    background-color: #58585A !important; /* <<< slide show button background color */
    border-color: #58585A !important; /* <<< slide show button border color */
}

/* Time and Location logos */
section.slice_ServiceText_L {background-color:white;margin:10px 0 50px;}
section.slice_ServiceText_L div.blocks {
  background-color:#f1f1f1;border:none;border-radius:10px;
}
section.slice_ServiceText_L div.block2-1, 
section.slice_ServiceText_L div.block2-2 {color:inherit;}
.slice_ServiceText_L .block2-1::after, .slice_ServiceText_L .block2-2::after,
.slice_ServiceTextEB_L .block2-1::after, .slice_ServiceTextEB_L .block2-2::after
{
    color: #58585A !important; /* <<< Clock and Location icon colour */
}

/* Search box */
header div.search-overlay
{
    background-color: #58585A !important; /* <<< Search box back-ground colour */
}

/* Code to make slide-shows look better on mobile screens */
section.slice_SlidesFullWidth,
section.slice_WhatsOnSlidesEB_L {overflow-x:hidden;} /* hide anything that pokes outside */
@media (max-width:767px) {
	section.slice_SlidesFullWidth div.bannerSlides {
		width: 200%; /* double the width, which doubles the height, and then translate so we see the middle 50% */
		transform: translateX(-25%);
		overflow-x:hidden; /* hide anything that pokes outside */
	}
  	section.slice_WhatsOnSlidesEB_L div.bannerSlides {
		width: 150%; /* double the width, which doubles the height, and then translate so we see the middle 50% */
		transform: translateX(-16.6667%);
		overflow-x:hidden; /* hide anything that pokes outside */
	}
	/* Adjust the captions back again, so they look normal */
	section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper ul.gallery_ul li.gallery_li div.caption {
		/* div.bx-wrapper has position:relative set, so this is ok */
		left: 25%;
		right: 25%;
		width: 50%;
		overflow-x:hidden; /* hide anything that pokes outside */
	}
	section.slice_WhatsOnSlidesEB_L div.bannerSlides div.bx-wrapper ul.gallery_ul li.gallery_li div.caption {
		/* div.bx-wrapper has position:relative set, so this is ok */
		left: 16.6667%;
		right: 16.6667%;
		width: 66.6666%;
		overflow-x:hidden; /* hide anything that pokes outside */
	}
  section.slice_WhatsOnSlidesEB_L div.bannerSlides div.bx-wrapper {margin-bottom:50px;}
  section.slice_WhatsOnSlidesEB_L div.bannerSlides div.bx-wrapper div.bx-pager a {width:15px;height:15px;}
  
  section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper a.bx-prev {left:25%;}
  section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper a.bx-next {right:25%;}
  
  section.slice_WhatsOn3Buttons_L {padding:30px 10px 0;}
  section.slice_WhatsOn3Buttons_L div.bannerSlides {margin-left:0; margin-right:0;}
  section.slice_WhatsOnSlidesEB_L {padding-bottom:0;}
  section.slice_WhatsOnSlidesEB_L div.bannerSlides div.bx-wrapper a.bx-prev {left:16.6667%;}
  section.slice_WhatsOnSlidesEB_L div.bannerSlides div.bx-wrapper a.bx-next {right:16.6667%;}
  
}
section.slice_SlidesFullWidth div.slideTitle {margin:0 20px;}

/* Fix various issues */
div.endis-jquery-ui div#divOverlay {font-size:17px;line-height:1.3;}
body.OnSmallAppleDevice input {-webkit-appearance: none;}
body.ArticleEditor img.module_icon {width:auto !important;}
section.slice_Footer_L div.footerbar span:last-child:not([id]),
section.slice_Footer_D div.footerbar span:last-child:not([id]) { display: block; padding-top: 25px; }

/* prevent text-overwriting when desktop menus wrap around */
section.slice_Header_D ul.root_menu ul,
section.slice_Header_L ul.root_menu ul,
section.slice_Header_T ul.root_menu ul {z-index:4;}

section.slice_Footer_D div.footerbar a#footer_cookies::after,
section.slice_Footer_L div.footerbar a#footer_cookies::after { content: "|"; padding: 0 5px; }
@media (min-width: 768px) {
	section.slice_Footer_D div.footerbar a#footer_cookies::after,
	section.slice_Footer_L div.footerbar a#footer_cookies::after { padding: 0 10px; }
}

.HideElement {display:none !important;}

/* Fix system page ul lists */		
section.slice_system_page div.system_content ul {
  list-style-type: disc;
  padding-left:40px;
}
section.slice_system_page._media_allmedia_aspx ul.media_recording_links,
section.slice_system_page._media_allmedia_aspx ul.media_recording_details {
  list-style-type: none;
  padding-left:0;
}
section.slice_system_page._media_allmedia_aspx a.system_toggle_advanced,
section.slice_system_page._publisher_search_aspx a.system_toggle_advanced {
	margin:0 0 10px;padding:5px 10px; background-color:#58585A; color:white;
  font-size:18px; line-height:1; border-radius:6px;
}
section.slice_system_page._media_allmedia_aspx a.system_toggle_advanced:hover,
section.slice_system_page._publisher_search_aspx a.system_toggle_advanced:hover {
	background-color:#58585A;
}
section.slice_system_page._media_allmedia_aspx div#media_sort,
section.slice_system_page._media_allmedia_aspx ul#media_buttons {
  margin:10px 0 5px; padding-left:0;
}
section.slice_system_page._media_allmedia_aspx div#media_sort {margin-right:20px;}
section.slice_system_page._media_allmedia_aspx div#media_sort select {margin:0;}
section.slice_system_page._media_allmedia_aspx ul#media_buttons a {border:none;}
section.slice_system_page._media_allmedia_aspx div.media_option_right a {margin:0;}

/* Fix the new calendar page pop-up */
div.dialog-content.calendar-event-content > h4,
div.dialog-content.calendar-event-content > h4 a.event-location-link {
	display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;
}

/* Extra icon using a square background image */
footer i.icomoon-icon-XXXXXX.ImageSocialMediaIcon::after
{ /* Replace url below with actual url of square icon image */
  background-image: url(/Images/Content/1495/Templates/46170/images/CommissionLogo.png);
}

section.slice_CommunityText_L > div.container > div.ArticleBody {float:none;margin:0;width:100%;}
section.slice_CommunityText_L div.WelcomeWrapper {
	display:flex;flex-flow:row nowrap;justify-content:center;align-items:flex-start;
  text-align:left; max-width:1020px; margin:0 auto;
}
section.slice_CommunityText_L div.WelcomeWrapper h1 {
  margin:0 0 20px;font-size:40px;line-height:1.1;font-weight:700;
}
section.slice_CommunityText_L div.WelcomeWrapper img {
 	display:block;margin-right:40px; border-radius:150px;border:6px solid #d5d5d5;
  background-color:#d5d5d5;
}
section.slice_CommunityText_L div.WelcomeWrapper a.button,
section.slice_CommunityText_L div.WelcomeWrapper a.button2 {
  font-weight:400;line-height:1.3; font-size:15px;
  display:inline-block;margin:0;
}
@media (max-width:1100px) {
  section.slice_CommunityText_L div.WelcomeWrapper h1 {font-size:26px;}
}
@media (max-width:767px) {
  section.slice_CommunityText_L div.WelcomeWrapper {
    flex-flow:column nowrap;justify-content:flex-start;align-items:center;
    text-align:center;
  }
  section.slice_CommunityText_L div.WelcomeWrapper img {margin:0 0 20px 0;}
  section.slice_CommunityText_L div.WelcomeWrapper a.button,
  section.slice_CommunityText_L div.WelcomeWrapper a.button2 {
    font-size:15px;padding-left:15px;padding-right:15px;
  }
}
@media (max-width:467px) {
  section.slice_CommunityText_L div.WelcomeWrapper a.button,
  section.slice_CommunityText_L div.WelcomeWrapper a.button2 {
    font-size:13px;padding-left:10px;padding-right:10px;
  }  
}

/* Sort out article text */
section.slice_content_page div.main-content div.ArticleBody span {
  font-size:inherit !important; 
  font-family:inherit !important;
}

section.slice_content_page.WideContent div.main-content {
  width:100%;
  float:none;
  margin-left:0; margin-right:0;
  padding-left:10px; padding-right:10px;
  background-color:#f1f1f1;
}
section.slice_content_page.WideContent div.CenterButton {text-align:center;}
section.slice_content_page.WideContent div.CenterButton a.button {margin:0;}
section.slice_content_page.WideContent div.CenterButton a.button:hover {text-decoration:none;}

/* 
	UML_ML_1: Universal Mini-Layout Media-List 1 
	Code is for a 3 > 2 > 1 column layout.
	
	The media-list module outputs a "span.MediaList" wrapper, around all the card div's.
*/
section.slice_content_page div.UML_ML_1 span.MediaList {
	display: flex; flex-flow: row wrap; justify-content: center; align-items:stretch;
}
section.slice_content_page div.UML_ML_1 span.MediaList > div { background-color: white; width: 100%; margin:15px 0;} /* 1 column */
@media (min-width: 467px) { /* 2 columns */
	section.slice_content_page div.UML_ML_1 span.MediaList > div { width: 49%; margin:15px 0; }
	section.slice_content_page div.UML_ML_1 span.MediaList > div:nth-child(2n+1) {margin-right:1%;} /* Extra 1% on each */
	section.slice_content_page div.UML_ML_1 span.MediaList > div:nth-child(2n) {margin-left:1%;}
}
@media (min-width: 992px) { /* 3 columns */
	section.slice_content_page div.UML_ML_1 span.MediaList > div { width:32%; margin:15px 0;}
	section.slice_content_page div.UML_ML_1 span.MediaList > div:nth-child(3n+1) {margin-left:0;margin-right:0;}
	section.slice_content_page div.UML_ML_1 span.MediaList > div:nth-child(3n+2) {margin-left:2%;margin-right:2%;} /* extra 4% on the middle one only */
	section.slice_content_page div.UML_ML_1 span.MediaList > div:nth-child(3n) {margin-left:0;margin-right:0;}
}
section.slice_content_page div.UML_ML_1 div.MediaListImage img { display: block; width: 100%; }
section.slice_content_page div.UML_ML_1 div.MediaListImage a { display: block; margin: 0; }
section.slice_content_page div.UML_ML_1 div.MediaListImage a:hover,
section.slice_content_page div.UML_ML_1 div.MediaListTitle a:hover { opacity: 0.6;text-decoration:none; }
section.slice_content_page div.UML_ML_1 div.MediaListTitle {  padding: 10px 10px;}
section.slice_content_page div.UML_ML_1 div.MediaListTitle a { font-weight: 700; font-size: larger; text-transform: capitalize;text-align: center;line-height: 1.2; display:block;}
section.slice_content_page div.UML_ML_1 div.MediaListSpeaker,
section.slice_content_page div.UML_ML_1 div.MediaListDate,
section.slice_content_page div.UML_ML_1 div.MediaListBible,
section.slice_content_page div.UML_ML_1 div.MediaListLength
{ padding: 0 10px 10px;  font-weight: 400; text-align: center;line-height: 1.3;}
section.slice_content_page div.UML_ML_1 div.MediaListLink {flex:1 1 auto;font-size:0;line-height:1;color:transparent;} /* takes up the height slack */

/* Banner Image code */
section.slice_BannerImage {
  position:relative;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	padding: 200px 10px;
}
@media(max-width:992px){
	section.slice_BannerImage {padding:100px 10px;}
}
section.slice_BannerImage h1 {
  position:relative; z-index:0;
	line-height:1.2; 
	margin:0; 
	text-align:center;
	color: white;
	font-size: 60px;
	text-transform:uppercase;
}
@media(max-width:992px){
	section.slice_BannerImage h1 {font-size: 40px;}
}
@media(max-width:467px){
	section.slice_BannerImage h1 {font-size: 30px;}
}
section.slice_BannerImage div.BannerImgCustomFields {display:none;}
section.slice_BannerImage div.container {text-align:center;}
section.slice_BannerImage div.OverlayTint { 
  position:absolute;top:0;bottom:0;left:0;right:0;width:100%;height:100%;
  background-color:rgba(0,0,0,0.4);
}
section.slice_content_page.AddTopBorder {border-top:1px solid #dddddd;}

/* Media Landing page search box */
section.slice_MediaSearch div.search-overlay {padding:25px 10px 25px 0; background-color: white; }
section.slice_MediaSearch div.search-overlay input.button, section.slice_MediaSearch div.search-overlay label { display: none; }
section.slice_MediaSearch div.search-overlay div.search-form { position: relative; max-width:600px;}
section.slice_MediaSearch div.search-overlay div.search-form span.top-link { position: absolute; top: 0; right:0 ; background-color: #a97c50; display: inline-block; line-height: 1; padding: 13px;  font-size: 15px; transition: color 500ms linear, background-color 500ms linear; cursor:pointer;}
section.slice_MediaSearch div.search-overlay div.search-form span.top-link:hover { background-color: #038e63; }
section.slice_MediaSearch div.search-overlay div.search-form span.top-link img { display: inline-block; padding: 3px 3px 0; }
section.slice_MediaSearch div.search-overlay .search_div { margin: 0 50px 0 0; }
section.slice_MediaSearch div.search-overlay .search_div input.text { height: 47px; margin-bottom: 0px; border: none; background-color: #f1f1f1;  font-size: 15px; line-height: 1;  width: 100%; color: #414141; outline: none; margin-left: 10px; padding-left: 20px; padding-right: 5px; }
@media (max-width: 400px) { section.slice_MediaSearch div.search-overlay div.search-form div.search_div input.text { font-size: 16px; letter-spacing: -0.5px; } }

@media(max-width:467px){
  section.slice_content_page div.main-content {padding-left:10px;padding-right:10px;}
}

div.slice_Cookies {
  	background-color:#58585A;
  	color:white;
  	padding:10px;
  	text-align:center;
  	float:none;clear:both;
}
div.slice_Cookies img { margin:0 0 0 10px; float:right !important;}
div.slice_Cookies a {color:white !important; text-decoration:underline;}
@media (max-width:500px) {
  div.slice_Cookies {font-size:13px; line-height:1.2;padding:5px 10px;}
}

footer div.FooterSafeGuarding {
	text-align:center; width:100%; margin:0 auto 20px; max-width:870px; 
  font-size:16px; line-height:1.625; font-weight:300;
  padding:10px 10px 0 10px;
}
footer div.FooterSafeGuarding h1 {
  font-size:22px; line-height:1; font-weight:600; margin:0;
}
footer div.FooterSafeGuarding h1 + p {margin-top:5px;}
footer div.FooterSafeGuarding a {color:#58585A;}
footer div.FooterSafeGuarding a:hover {color:#34495e;}
footer div.FooterSafeGuarding.BottomBorder {border-bottom:1px solid #d7d7d7;}

/* Supporter logos */
footer div.LogoWrapper {
	border-bottom:1px solid #d7d7d7;
  	margin:-20px 1.28866% 20px;
}
footer div.LogoWrapper ul {
  	list-style-type:none;
  	padding:0;margin:0;
	display:flex; 
	flex-flow: row wrap; 
	justify-content:center; 
	align-items:center;
}
footer div.LogoWrapper img {margin:30px 40px 40px 40px;display:block;}
@media (max-width:991px) {
 footer div.LogoWrapper img {margin:20px 30px 20px 30px;display:block;}
}

/* Code for the Seeker Boxes */
section.SeekerBox {
  position:fixed;right:20px;bottom:20px;width:275px;
  border-radius:4px;
	background-color:white;
  padding:15px;
  box-shadow: 0px 0px 4px 4px rgba(128,128,128,.2);
  line-height:1.2;
}
section.SeekerBox div.FullSeekerArticle {display:none;}
section.SeekerBox div.SmallSeekerArticle a.HeadLink {
  display:block; background-color:transparent; font-size:0; padding:0;
}
section.SeekerBox img.Photo {
  position:absolute; right:10px; top:-85px;
  width:93px;height:93px;border-radius:50px;
  display:block;
  background-color:#58585a;
}
body.ArticleEditor section.SeekerBox img.Photo {
  background-color:#58585a;
}
section.SeekerBox img.Close {
	width:30px;position:absolute; left:14px; bottom:16px; cursor:pointer;
  background-color:#c5bfbf; padding:4px; border-radius:50px;
}
section.SeekerBox img.Close:hover {background-color:#9fa4a7;}
section.SeekerBox.Shrink img.Close {
	left:7px; bottom:7px;
}
section.SeekerBox.BigBox img.Close {
	width:auto; left:initial; bottom:initial; right:5px; top:5px;
  	padding:0; background-color:transparent;
}
section.SeekerBox.BigBox img.Close.Outer {display:none;}
section.SeekerBox b,
section.SeekerBox strong {font-weight:700;}

section.SeekerBox div.SmallSeekerArticle a {
  font-size:17px; font-weight:700;
  display:inline-block;padding:8px 10px 5px 40px;background-color:white;color:#58585A;
  border-radius:7px;
}
section.SeekerBox div.SmallSeekerArticle a:hover {color:#686262;}
body.OnSmallAppleDevice section.SeekerBox div.SmallSeekerArticle a {
	background-color:#686262 !important;
}

section.SeekerBox div.VerboseText a {margin-top:10px;}
section.SeekerBox.Shrink {width:195px;padding:5px 5px 5px 10px;width:auto;right:10px;bottom:10px;}
section.SeekerBox.Shrink div.VerboseText,
section.SeekerBox div.NonVerboseText {display:none;}
section.SeekerBox.Shrink div.NonVerboseText {display:block;}

section.SeekerBox.BigBox {
	left:0;right:0;bottom:0;top:0;width:100%;height:100vh;border-radius:0;padding:0;
  background-color:rgba(0,0,0,0.6); box-shadow:none;
  z-index:110;
  display:flex;flex-flow:row nowrap;justify-content:center;align-items:center;
}
@media (max-width:900px) {
  section.SeekerBox.BigBox {
    align-items:flex-end;
  }
}
section.SeekerBox.BigBox div.SmallSeekerArticle {display:none;}
section.SeekerBox.BigBox div.FullSeekerArticle {
  display:block;position:relative;max-width:840px;
  background-color:white;
  box-shadow: 0px 0px 20px 5px rgba(0,0,0,.12);
}
section.SeekerBox.BigBox div.FullSeekerArticle > h2 {
	background-color:#58585A;color:white;
  	padding:5px 5px 5px 20px;margin:0;
  	box-shadow: 0 2px 5px 0 rgba(0,0,0,.12), 0 2px 10px 0 rgba(0,0,0,.12);
}
section.SeekerBox.BigBox div.FullSeekerArticle div.ArticleBody {
  overflow-y:scroll;max-height:70vh;
  padding:10px 10px 20px 10px;
} 
@media (max-width:767px) { 
  section.SeekerBox.BigBox div.FullSeekerArticle > h2 {padding:10px 5px 10px 20px;}
  section.SeekerBox.BigBox div.FullSeekerArticle div.ArticleBody {max-height:80vh;}
}

/* On a seeker box page, the reCAPTCHA widget has to move */
div.grecaptcha-badge {
	width:237px !important;
  	height:58px !important;
  	left:-75px;
  	right:initial  !important;
  	bottom:0 !important;
}
section.slice_content_page div.main-content div.grecaptcha-badge,
section.SeekerBox div.grecaptcha-badge,
section.slice_system_page div.grecaptcha-badge {
  position:static !important;
  box-shadow:none !important;
  border:1px solid #bbbbbb;
  margin-top:10px;
  width:256px !important;
  height:60px !important;
}
section.slice_system_page div.grecaptcha-badge {margin:10px auto 0;}

footer {background-color:#f1f1f1;}
@media (max-width:1600px) {
  footer.WidgetShowing {padding-bottom:50px;}
}
@media (max-width:1400px) {
  footer.WidgetShowing {padding-bottom:130px;}
}

footer div.footer-column-3 div.EmailWrapper {display:inline-block;text-align:center;}
@media (max-width:767px) {
	footer div.footer-column-1 {margin-top:10px;}
}

section.slice_content_page aside nav div.group_nav_selected {font-weight:700;}
section.slice_content_page aside nav div.group_nav_child {font-weight:400;}

div.endis-jquery-ui-dialog div.media-player-audio h3 {margin:5px 0;}
div.endis-jquery-ui-dialog div.media-player-audio h4 {margin:5px 0;}

/* Fixed Header stuff */
header.HeaderSmall {
  position:fixed; left:0; right:0; top:0; width:100%; z-index:100;
}
header.HeaderSmall section.slice_Header_L {
	border-bottom:1px solid #58585a;
}
@media (min-width:992px) {
  header section.slice_Header_L.SystemPage {
      border-bottom:1px solid #58585a;
  }
}
header.HeaderSmall.HasCookieBar section.slice_Header_L {
	border-bottom:none;
}
header.HeaderSmall section.slice_Header_L div.logo-container .logo-name a {
	font-weight:700;
  	font-size:24px;
}
header section.slice_Header_L div.top-link-wrapper div.search-form,
header section.slice_Header_L div.top-link-wrapper div.search_div {
  font-size:0;line-height:0;display:inline-block;
}
header section.slice_Header_L div.top-link-wrapper div.search-form {display:none;}

header div.top-link-wrapper div.search-form input[type=text] {
	transition:padding-top 300ms linear, padding-bottom 300ms linear, height 300ms linear;
  	line-height:1;height:44px;
}
header.HeaderSmall div.top-link-wrapper {position:relative;top:-2px;}
header.HeaderSmall div.top-link-wrapper a.top-link {
  padding-top:5px;padding-bottom:5px;
}
header.HeaderSmall section.slice_Header_L div.top-link-wrapper div.search-form input[type=text] {
  padding-top:5px;padding-bottom:4px;height:24px;
}
header.HeaderSmall section.slice_Header_L div.top-link-wrapper div.search-form i {top:0;}
header.HeaderSmall section.slice_Header_L div.nav-menu {margin-top:2px;}
header.HeaderSmall section.slice_Header_L div.nav-menu ul.root_menu > li > a {
	padding-top:10px;padding-bottom:10px;
}
header div.top-link-wrapper i.journey-icon-search::before {top:1px;}
header div.top-link-wrapper i.InFocus {cursor:pointer;}

header div.MobileMenuMask {
	display:none;
  background-color:rgba(0,0,0,0.6);
  position:fixed;top:0;left:0;width:100%;height:100vh;z-index:58;
}
header div.search-overlay.On + div.MobileMenuMask {display:block;z-index:70;}
		
header section.slice_Header_L.SlickNavFullWidth {
  width:100%;position:absolute;
}
@media (max-width:991px) {
  header section.slice_Header_L div.logo-container {
  	position:absolute; top:0; left:0;
    max-width:calc(100% - 100px);
    z-index:2;
    margin-right:0;
  }
}
header section.slice_Header_L div.logo-container .logo-name a {line-height:1;}

header li.MenuSearchOpen i::before {top:2px;right:7px;}
header ul.slicknav_nav li.MenuSearchOpen {display:none !important;}
header div.SearchText {color:white;padding:0 10px 10px;}
header div.search-overlay h1 {color:white;padding-left:10px;}
header div.SearchWrapper {position:relative;padding-right:10px;}
header div.search-overlay .search-close {top:3px; right:10px; font-size:30px;}
@media (min-width:992px) {
  header div.search-overlay {
    padding:25px 10%;
  }
}
@media (min-width:360px) {
	header div.SearchText {font-size:16px;}
}

section.slice_content_page div.main-content h1 {margin:0;}

/* Global Fix for slide-show captions */
section.slice_SlidesFullWidth div.slideTitle,
section.slice_SlidesFullWidth div.slideText,
section.slice_WhatsOnSlidesEB_L div.slideTitle,
section.slice_WhatsOnSlidesEB_L div.slideText {
	max-width:90%; /* some templates will set this to eg. 1170px */
    text-shadow:0 0 2px #00000036;
}
section.slice_SlidesFullWidth a.bx-prev::after, 
section.slice_SlidesFullWidth a.bx-next::after,
section.slice_WhatsOnSlidesEB_L a.bx-prev::after,
section.slice_WhatsOnSlidesEB_L a.bx-next::after,
section.slice_image_blocks_3 div.image_block_title_wrapper {
	text-shadow:0 0 4px #00000036;
}
section.slice_image_blocks_3 a:hover div.image_block_title_wrapper {text-shadow:none;}

/* Fix media page display. Needs JS fixes applied. */
section.slice_system_page._media_allmedia_aspx input#btnSearchTemplate {
  margin:0 0 10px;
  height:auto;
}
section.slice_system_page._media_allmedia_aspx div#media_controls,
section.slice_system_page._publisher_search_aspx div#media_controls {
  padding-top:10px; padding-right:40px; position:relative;
}
section.slice_system_page._media_allmedia_aspx div#media_controls img,
section.slice_system_page._publisher_search_aspx div#media_controls img {
 	position:absolute; top:5px; right:5px; cursor:pointer; 
  	width:25px; height:25px;
  	background-color:#aaaaaa;
  	border:1px solid #aaaaaa;
  	border-radius:14px;
  	flex:none; flex-basis:0;
}
section.slice_system_page._media_allmedia_aspx div.media_option_right a {margin-bottom:10px;}
section.slice_system_page._media_allmedia_aspx div#media_controls div.Line { 
  width:100%; flex-basis: 100%; border-top:1px solid #bbbbbb; 
} 
section.slice_system_page._media_allmedia_aspx div#media_controls div.LineB { 
  width:100%; flex-basis: 100%;
}
section.slice_system_page._media_allmedia_aspx div#media_controls div.LineB + div {margin-left:0;}
section.slice_system_page._media_allmedia_aspx ul#media_buttons {padding-top:4px;}
@media(min-width:1200px) {
  section.slice_system_page._media_allmedia_aspx div#media_controls div.LineB {display:none;}
}

/* Fix calendar display. Needs JS fixes applied. */
@media(min-width:1200px) {
  section.slice_system_page._calendar_month_aspx div.calendar_week div.calendar_event_time,
  section.slice_system_page._calendar_month_aspx div.calendar_week a span
  {font-size:14px; line-height:1.2;}
}
section.slice_system_page._calendar_month_aspx select.group-selector {margin:1px 5px 0 10px;}
section.slice_system_page._calendar_month_aspx ul#calendar_buttons li.list-view-toggle i::before {
  font-size:48px; line-height:1; position:relative; top:-7px;
}
section.slice_system_page._calendar_month_aspx div.Line {display:none;margin-bottom:10px;}
section.slice_system_page._calendar_month_aspx span.calendar_children_select label {font-size:16px;}
@media(max-width:860px) {
  section.slice_system_page._calendar_month_aspx div#calendar_title {float:none;}
  section.slice_system_page._calendar_month_aspx select.group-selector {margin:10px 5px 0 16px;}
  section.slice_system_page._calendar_month_aspx div#calendar_header {position:relative;}
  section.slice_system_page._calendar_month_aspx ul#calendar_buttons {
    position:absolute; top:-1px; right:0;margin:0;padding:0
  }
  section.slice_system_page._calendar_month_aspx div.Line {display:block;}
  section.slice_system_page._calendar_month_aspx input#chkIncludeCalendarSubgroups {
    margin-left:16px !important;
  }
}

section.slice_content_page.NoGroupNav aside.sidebar nav {display:none !important;}

/* Global Fix to ensure certain icons are not bold */
section.slice_content_page aside.sidebar div.sidebar_buttons a.button_1::after,
section.slice_content_page aside.sidebar div.sidebar_buttons a.button_2::after,
section.slice_content_page aside.sidebar div.sidebar_buttons a.button_3::after,
section.slice_content_page aside.sidebar div.sidebar_buttons a.button1::after,
section.slice_content_page aside.sidebar div.sidebar_buttons a.button2::after,
section.slice_content_page aside.sidebar div.sidebar_buttons a.button3::after {font-weight:400;}

/* Social media icons - hide the unused ones */
footer section.slice_FooterTop_L div.footer-column.footer-column-1 a.footer_icon_block[href$="/#"],
footer section.slice_FooterTop_L div.footer-column.footer-column-1 a.footer_icon_block[href$="/#/"]
{display:none;}

section.Xslice_SlidesFullWidth a.bx-pager-link {
	box-shadow:0 0 5px 1px #bbbbbb;
}

section.slice_content_page div.main-content ul {
  list-style: none; /* Remove default bullets */
}

section.slice_content_page div.main-content > div.ArticleBody ul:not([class]) > li::before {
  content: "\2022" !important;  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #58585A ; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline; /* Needed to add space between the bullet and the text */
  margin-left: -14px; /* Also needed for space (tweak if needed) */
  padding:0;
}
section.slice_content_page div.main-content ol {padding-left:25px;}

/* Robin's mobile fixes */
@media (max-width:767px) {
  
  section.slice_CommunityText_L div.WelcomeWrapper img {border-width:4px;}
  
  section.slice_ServiceText_L {margin:10px 10px 20px;}
  section.slice_ServiceText_L div.block2-1, 
  section.slice_ServiceText_L div.block2-2 {font-size:15px;}
  section.slice_ServiceText_L div.block2-1 span, 
  section.slice_ServiceText_L div.block2-2 span {font-size:16px;}
  section.slice_ServiceText_L div.block2-1 a, 
  section.slice_ServiceText_L div.block2-2 a {font-size:14px;}
  section.slice_ServiceText_L div.block2-1 {border-width:1px;}
  
  section.slice_image_blocks_3 div.image_blocks ul.gallery_ul li.gallery_li a div.image_block_title 
  {font-size:32px;}
  
  section.slice_WhatsOn3Buttons_L {background-color:white;}
  section.slice_WhatsOn3Buttons_L h1 {font-size:28px;}
  
  section.slice_WhatsOnSlidesEB_L div.bannerSlides div.bx-wrapper ul.gallery_ul li.gallery_li div.caption div.slideTitle {font-size:22px;}
  section.slice_WhatsOnSlidesEB_L div.bannerSlides div.bx-wrapper ul.gallery_ul li.gallery_li div.caption div.slideText {font-size:15px;}  
}
@media (max-width:599px) {
  
  div.SermonsAndPDFs div.article_cards > span > div div.articleListTitle a {font-weight:600;}
  
  footer div.FooterSafeGuarding h1 {font-size:18px;}
}

header div.search-overlay div.search_div input.text {margin:0; font-size:16px;}
header div.SearchWrapper {padding-left:10px;}

div.calendar-event-dialog div.calendar-event-content div.event-link a {text-decoration:underline;}

section.slice_system_page._media_allmedia_aspx div.media_recording_file_title,
section.slice_system_page._media_allmedia_aspx div.MobileRecorded {display:none;}
@media (max-width:767px){
  
  section.slice_system_page._media_allmedia_aspx div.system_row.media_recording {
    display:block; position:relative; width:100%;
  }
  section.slice_system_page._media_allmedia_aspx div.media_recording_main {
  	display:block; width:100%;
  }
  section.slice_system_page._media_allmedia_aspx div.media_recording_extra {
    display:table-cell;width:0;height:0;padding:0;margin:0;border:none;
  }
  section.slice_system_page._media_allmedia_aspx ul.media_recording_links,
  section.slice_system_page._media_allmedia_aspx ul.media_recording_details li {display:none;}
  section.slice_system_page._media_allmedia_aspx ul.media_recording_details,
  section.slice_system_page._media_allmedia_aspx ul.media_recording_details li {
  	padding:0;margin:0;
  }
  section.slice_system_page._media_allmedia_aspx div.MobileRecorded {
  	display:block; font-size:14px; font-weight:700;
  }
}

section.slice_FooterTop_L div.footer-column-2 {margin-right:0;}

section.slice_content_page div.main-content div.bx-wrapper div.bx-pager {padding:0; bottom:5px;}
section.slice_content_page div.main-content div.bx-pager a {width:15px;height:15px;border-radius:8px;}
section.slice_content_page div.main-content div.bx-wrapper a.bx-prev,
section.slice_content_page div.main-content div.bx-wrapper a.bx-next {
  background-image:none;
  color:transparent;
  text-indent:0;
  box-shadow:none;
}
section.slice_content_page div.main-content div.bx-wrapper a.bx-prev::before {
  font-family: journey;
  content:"\e901";
  color:white;
  font-size:30px;
}
section.slice_content_page div.main-content div.bx-wrapper a.bx-next::before {
  font-family: journey;
  content:"\e900";
  color:white;
  font-size:30px;
}

section.slice_content_page aside div.ContentPageImage {text-align:center;line-height:1;font-size:1px;}
section.slice_content_page aside div.ContentPageImage a {
  display:block; margin:10px auto 0;line-height:1;font-size:1px;}
section.slice_content_page aside div.ContentPageImage img {
  width:100%; max-width:263px; display:block;
}
@media (max-width:768px) {
  section.slice_content_page aside div.ContentPageImage a {display:inline-block;}
}
section.slice_content_page aside div.ContentPageImage:last-child {margin-bottom:30px;}
/* above 1200px make the image exactly 263px so it appears crisp */
@media (min-width:1200px) {
  section.slice_content_page aside div.ContentPageImage img {width:263px;}
}

/* Code that was in the "New To Church?" article */
section.SeekerBox.BigBox div.FullSeekerArticle table table td:first-child {
  vertical-align:middle !important;
}
section.SeekerBox.BigBox div.FullSeekerArticle td.SendButton {padding-left:40.5%;}
@media (max-width:500px) {
  section.SeekerBox.BigBox div.FullSeekerArticle td.SendButton {padding-left:0;}
}

section.CoronaVirus {
  padding:10px; background-color:#c0392b;
}
section.CoronaVirus div.ArticleBody > div {
  	text-align:center;
	display:flex; flex-flow:row nowrap; justify-content:center; align-items:center;
}
section.CoronaVirus a {display:inline-block; color:white; font-size:24px;line-height:1.3;}
section.CoronaVirus a:hover {text-decoration:underline;}
section.CoronaVirus img {
  display:inline-block;
  margin-right:10px;
  width:50px;
  height:auto;
}
@media (max-width:991px) {
	section.CoronaVirus a {font-size:18px;}
}
@media (max-width:359px) {
	section.CoronaVirus a {font-size:16px;}
}

section.slice_SlidesFullWidth li > a {display:block;}

body.ArticleEditor span.ServicesLocation {
	display:block;
  	margin:20px 0;
  	font-weight:700;
}
body.ArticleEditor a.ServicesLocation {
  	display:block;
  	margin:20px 0;
  font-size:smaller;
}

body.ArticleEditor a.footer_icon_block {
  display:block; margin:20px 10px; width:100%;
}
body.ArticleEditor a.footer_icon_block i {
  position:relative;
  z-index:-1;
}
body.ArticleEditor div.WelcomeWrapper h1 {margin-top:10px;}

header ul.root_menu i.journey-icon-search {color:#a1a1a1;}

section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager { display: block; bottom: 0; }

section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager a.bx-pager-link { 
	display: block; 
  font-size:20px; line-height: 1; font-weight:600;
  color:white; padding: 8px 12px; margin: 0 3px; 
  background-color:#34495e; 
  transition: color 500ms linear, background-color 500ms linear; 
  width:auto; height:auto;
  border:none; border-radius:0;
}
section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager a.bx-pager-link:hover, 
section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager a.bx-pager-link.active { 
  background-color:#f1f1f1; color: #34495e; 
}

section.SlideShowWrapper {
  background-color:white;
}
section.SlideShowWrapper div.container {
  	width:100%; max-width:1300px;
	display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:stretch;
  	margin-bottom:-60px;
}
section.SlideShowWrapper div.HeroText {
  width:70%; margin:10px 0 0; padding:0 0 0 10px;
}
section.SlideShowWrapper div.SlideShowArticle {
  width:30%; padding:40px 0; font-size:20px;
  flex:1 1 auto;
  display:flex;flex-flow:row nowrap;justify-content:center;align-items:center;
  background-color:#58585A; color:white;
  position:relative; z-index:10; top:40px;
  /* box-shadow:0 0 5px 5px #58585A; */
}
section.SlideShowWrapper div.SlideShowArticle div.ArticleBody {
  max-width:79%; flex:1 1 auto;
}
section.SlideShowWrapper div.SlideShowArticle h1 {
  font-size:36px; font-weight:700; line-height:1; margin:0; color:white;
}
section.SlideShowWrapper div.SlideShowArticle a {
  color:white; text-decoration:underline; font-size:19px;
}
section.SlideShowWrapper div.SlideShowArticle a:hover {color:#fccd99;}
section.SlideShowWrapper div.SlideShowArticle div.FlexRow {
	display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;
}
section.SlideShowWrapper div.SlideShowArticle div.FlexRow img {margin-right:15px;}
@media (max-width:1300px) {
  section.SlideShowWrapper div.container {flex-flow:column nowrap; align-items:center;}
  section.SlideShowWrapper div.HeroText {
    width:100%; max-width:900px; margin:0; padding:30px 20px;
  }
  section.SlideShowWrapper div.SlideShowArticle {
    position:static;
    width:100%; max-width:100%; padding:30px 10px;
    text-align:center;
  }
  section.SlideShowWrapper div.SlideShowArticle div.FlexRow {
    justify-content:center;
  }
  section.SlideShowWrapper div.SlideShowArticle div.ArticleBody {
    max-width:800px;
  }
}

section.SlideShowWrapper div.HeroText div:first-child {
	font-family:Merriweather,serif;
  	font-weight:300;
  	font-style:italic;
  	font-size:52px; line-height:1;
}
section.SlideShowWrapper div.HeroText div:nth-child(2) {
	font-family:Montserrat,sans-serif;
  	font-weight:400; color:#58585A;
  	font-size:175px; line-height:1; margin:-10px 0 20px;
}
section.SlideShowWrapper div.HeroText a {
	margin-left:46%; font-weight:600;
}
@media (max-width:991px) {
  section.SlideShowWrapper div.HeroText {text-align:center;}
  section.SlideShowWrapper div.HeroText a {margin:20px 0 0;}
  section.SlideShowWrapper div.HeroText div:first-child {font-size:36px;}
  section.SlideShowWrapper div.HeroText div:nth-child(2) {font-size:80px;margin:20px 0;}
}
@media (max-width:467px) {
  section.SlideShowWrapper div.HeroText div:nth-child(2) {font-size:60px;}
}

a.PillButton {
	display:inline-block;
  	padding:10px 40px;
  	background-color:#58585A;
  	color:white;
  	border-radius:50px;
  	border:1px solid #58585A;
}
a.PillButton:hover {
  background-color:white;
  color:#58585A;
  opacity:1;
}

a.ArrowToRight {color:#58585A;}
a.ArrowToRight:hover {color:#757575;}
a.ArrowToRight::after {
	content:'\e903';
  	font-family:HubbIcons;
  	color:#58585A;
  	display:inline-block; line-height:1;
  	position:relative; top:2px; left:12px;
  	transition:left 300ms linear,color 300ms linear;
}
a.ArrowToRight:hover::after {
  color:#757575;
  left:18px;
}

section.IntersectingBlocks {
  	background-image:none; /* added via JS */
  	background-color:#58585A; /* backup color */
  	background-repeat:repeat;
  	padding:80px 0;
}
section.IntersectingBlocks div.container {
  	max-width:1200px;
	display:flex;flex-flow:row nowrap;justify-content:center;align-items:center;
}
section.IntersectingBlocks div.container > div:first-child {
  width:50%; display:block; position:relative; left:25px;
}
section.IntersectingBlocks div.container > div:last-child {
  width:50%; display:block; position:relative; right:25px;
}
section.IntersectingBlocks div.container > div:first-child img {width:100%; display:block;}
section.IntersectingBlocks div.ArticleBody {
  	width:100%; font-size:20px;
	background-color:white; /* box-shadow:0 0 5px 5px white; */
  	padding:30px 40px;
}
section.IntersectingBlocks div.ArticleBody h1 {font-weight:700;}
section.IntersectingBlocks div.ArticleBody a {
	text-decoration:underline; font-size:19px;
}
@media (max-width:1100px) {
  section.IntersectingBlocks {padding:40px 20px;}
  section.IntersectingBlocks div.container > div:first-child {
    left:15px;
  }
  section.IntersectingBlocks div.container > div:last-child {
    right:15px;
  }
  section.IntersectingBlocks div.ArticleBody {padding:20px;}
}
@media (max-width:991px) {
  section.IntersectingBlocks {padding:40px 20px 0;}
 section.IntersectingBlocks div.container {
   max-width:600px;
	flex-flow:column nowrap;justify-content:flex-start;align-items:center;
 } 
  section.IntersectingBlocks div.container > div:first-child {
    width:100%; left:0;
  }
  section.IntersectingBlocks div.container > div:last-child {
    width:100%; right:0; top:-40px; padding:0 30px;
  }
  section.IntersectingBlocks div.ArticleBody {font-size:18px;}
}
@media (max-width:467px) {
  section.IntersectingBlocks {padding:30px 15px 0;}
  section.IntersectingBlocks div.container > div:last-child {
    padding:0 15px;
  }  
}

section.IntersectingBlocks.Reverse div.container > div:first-child {z-index:1;}
section.IntersectingBlocks.Reverse div.container > div:last-child img {width:100%; display:block;}
@media (max-width:991px) {
   section.IntersectingBlocks.Reverse div.container {
	flex-flow:column-reverse nowrap;
 }
  section.IntersectingBlocks.Reverse div.container > div:last-child {
    left:0; right:0; top:0; padding:0;
  }
  section.IntersectingBlocks.Reverse div.container > div:first-child {
    left:0; right:0; top:-40px; padding:0 30px;
  }  
}
@media (max-width:467px) {
  section.IntersectingBlocks div.container > div:first-child {
    padding:0 15px;
  }  
  section.IntersectingBlocks div.container > div:last-child {
    padding:0;
  }
}

/* Move the SlideShow button up, and fade in, at the same time */
@keyframes CIA_MoveRedTile {
	0% {top:140px; right:100px;}
	100% {top:40px; right:0;}
}
@media(min-width:1301px){
  section.SlideShowWrapper div.SlideShowArticle { 
      animation-name: CIA_MoveRedTile;
      animation-iteration-count: 1;
      animation-duration: 1000ms;
      animation-delay:500ms; /* initial delay */
      animation-timing-function: linear;
      animation-fill-mode:both; 
  }
}

/* Move the SlideShow button up, and fade in, at the same time */
@keyframes CIA_MoveHeroText {
	0% {margin-top:10px;}
	100% {margin-top:80px;}
}
@media(min-width:1301px){
  section.SlideShowWrapper div.HeroText { 
      animation-name: CIA_MoveHeroText;
      animation-iteration-count: 1;
      animation-duration: 1000ms;
      animation-delay:500ms; /* initial delay */
      animation-timing-function: linear;
      animation-fill-mode:forwards; 
  }
}

@keyframes CIA_DiagMove {
	0% {top:100px; right:100px;}
	100% {top:0; right:0;}
}
@media(min-width:992px){
  /* code needed to prepare the cards for animation */
  section.IntersectingBlocks div.ArticleBody {position:relative;top:100px; right:100px;}

  /* JS will add the class "RunAnimation" to start the animation going */
  section.IntersectingBlocks div.ArticleBody.RunAnimation {
      animation-name: CIA_DiagMove;
      animation-iteration-count: 1;
      animation-duration: 750ms;
      animation-delay:0s; /* initial delay, will be zero if scroll-position activated. */
      animation-timing-function: linear;
      animation-fill-mode:forwards; /* keep opacity on at the end */
  }
}

@keyframes CIA_DiagMoveReverse {
	0% {top:100px; left:100px;}
	100% {top:0; left:0;}
}
@media(min-width:992px){
  /* code needed to prepare the cards for animation */
  section.IntersectingBlocks.Reverse div.ArticleBody {position:relative;top:100px; left:100px;}

  /* JS will add the class "RunAnimation" to start the animation going */
  section.IntersectingBlocks.Reverse div.ArticleBody.RunAnimation {
      animation-name: CIA_DiagMoveReverse;
      animation-iteration-count: 1;
      animation-duration: 750ms;
      animation-delay:0s; /* initial delay, will be zero if scroll-position activated. */
      animation-timing-function: linear;
      animation-fill-mode:forwards; /* keep opacity on at the end */
  }
}

section.slice_content_page div.main-content div.SmallGallery {
	max-width:400px; margin:0 auto;
}

/* ============================================================
   Hubb tidy-up, 28 Sep 2026 (Claude for Adam Johannes)
   Everything below is scoped to page content only.
   To roll back, delete from this comment to the end of the file.
   Carry these rules into Genesis.
   ============================================================ */

/* R1: heading spacing (the rule above sets div.main-content h1 {margin:0}) */
section.slice_content_page div.main-content div.ArticleBody h1 {margin:0 0 20px;}
section.slice_content_page div.main-content div.ArticleBody h2 {margin-top:40px;}
section.slice_content_page div.main-content div.ArticleBody h3 {margin-top:30px;}
section.slice_content_page div.main-content div.ArticleBody img {max-width:100%; height:auto;}

/* R2: contact form in a grey box (Contact Us, article 522283) */
section.slice_content_page div.main-content div.ContactFormBox {
  background-color:#f1f1f1; border-radius:10px; padding:25px; max-width:640px; margin:10px 0 30px;
}
section.slice_content_page div.main-content div.ContactFormBox label {font-weight:600;}
section.slice_content_page div.main-content div.ContactFormBox input[type=text],
section.slice_content_page div.main-content div.ContactFormBox textarea {
  width:100%; box-sizing:border-box; margin-top:5px; padding:8px 10px;
  border:1px solid #cccccc; border-radius:4px; background-color:#ffffff; font-size:16px;
}
section.slice_content_page div.main-content div.ContactFormBox input#ArticleSubmitButton {
  width:auto; padding:10px 30px; border:1px solid #58585A; border-radius:50px;
  background-color:#58585A; color:#ffffff; cursor:pointer;
}
section.slice_content_page div.main-content div.ContactFormBox input#ArticleSubmitButton:hover {
  background-color:#ffffff; color:#58585A;
}

/* R3: Staff and Leadership in two columns, one column on phones (table.StaffGrid) */
section.slice_content_page div.main-content table.StaffGrid {width:100%; border-collapse:collapse; border:none;}
section.slice_content_page div.main-content table.StaffGrid td {
  width:50%; vertical-align:top; padding:0 20px 30px 0; border:none;
}
section.slice_content_page div.main-content table.StaffGrid td h2 {margin-top:10px;}
@media (max-width:767px) {
  section.slice_content_page div.main-content table.StaffGrid,
  section.slice_content_page div.main-content table.StaffGrid tbody,
  section.slice_content_page div.main-content table.StaffGrid tr,
  section.slice_content_page div.main-content table.StaffGrid td {display:block; width:100%;}
  section.slice_content_page div.main-content table.StaffGrid td {padding-right:0;}
}
