/*  (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: 40px !important; /* <<< mobile logo height */
}
@media(min-width:467px){header .logo-icon img
{ 
	height: 40px !important; /* <<< tablet logo height */
}}
@media(min-width:992px){
  	header .logo-icon img { 
		height: 40px !important; /* <<< desktop logo height */
    }
    header.HeaderSmall section.slice_Header_L .logo-icon img {
      height:40px !important; /* <<< desktop shrunken logo height */
    }
}
@media(min-width:1100px){
  	header .logo-icon img { 
		height: 70px !important; /* <<< desktop logo height */
    }
}

/* Gap between logo and top/bottom of screen  */
header div.logo-container 
{
	margin-top: 5px !important; /* <<< logo gap from top for mobile/tablet */
}
@media(min-width:992px){
  	header div.logo-container {
		margin-top: 5px !important; /* <<< logo gap from top for desktop */
	}
	header.HeaderSmall section.slice_Header_L div.logo-container {
      margin-top:5px !important; /* <<< logo gap from top for shrunken desktop */
    }
}
@media(min-width:1100px){
  	header div.logo-container {
		margin-top: 10px !important; /* <<< logo gap from top for 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:30px;}
@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:1300px) 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: 1500px) {
	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);
}
  
/* 3 Big Button colours */
.slice_content_page .sidebar_buttons a.button1
{
    background-color: #888888 !important; /* <<< Green/left/top big button */
}
.slice_content_page .sidebar_buttons a.button2
{
    background-color: #000002 !important; /* <<< Red/middle big button */
}
.slice_content_page .sidebar_buttons a.button3
{
    background-color: #000001 !important; /* <<< Blue/right/bottom big button */
}

/* slide show button and round pager button colour */ 
section.slice_SlidesFullWidth div.bx-pager a, 
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_SlidesFullWidth div.bx-pager a:hover, 
section.slice_SlidesFullWidth div.bx-pager a.active,
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: #888888 !important; /* <<< slide show button background color */
    border-color: #888888 !important; /* <<< slide show button border color */
}

.slice_SlidesFullWidth a.slideButton,
body.OnSmallAppleDevice section.slice_SlidesFullWidth a.slideButton:hover
{
    background-color: #888888 !important; /* <<< slide show button background color */
    border-color: #888888 !important; /* <<< slide show button border color */
  	color: white !important;
}

.slice_SlidesFullWidth a.slideButton:hover
{
    background-color: #777777 !important; /* <<< slide show button background color */
    border-color: #777777 !important; /* <<< slide show button border color */
}

section.slice_WhatsOnSlidesEB_L div.bx-pager a, 
section.slice_WhatsOnSlidesEB_L div.bx-pager a
{
    background-color: #000001 !important; /* <<< slide show button background color */
    border-color: #000001 !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: #888888 !important; /* <<< slide show button background color */
    border-color: #888888 !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: #888888 !important; /* <<< Clock and Location icon colour */
}

/* Search box */
header div.search-overlay
{
    background-color: #000001 !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.ArticleEditor img.module_icon {width:auto !important;}
body.OnSmallAppleDevice input {-webkit-appearance: none;}
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;}

/* Slide-show bottom buttons */ 
section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager {bottom:30px;}
section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager a.bx-pager-link {
	width:18px;height:18px;border-radius:9px;border-width:2px;margin:0 6px;
}
@media (max-width:1200px) {
	section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager {bottom:10px;}
	section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager a.bx-pager-link {width:14px;height:14px;border-radius:7px;}
}

/* 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:#888888; 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:#777777;
}
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 div.RoundImage img {
 	display:block;margin-right:40px; border-radius:150px;border:6px solid #d7d7d7;
  background-color:#d7d7d7;
}
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 div.RoundImage 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;
  }  
}

section.EventsAndTalks {background-color:white; padding:60px 10px 50px;}
section.EventsAndTalks h1 {
  color:#000001; font-size:30px; line-height:1; margin:0 0 25px; font-weight:600;
}
section.EventsAndTalks span {display:block;}
section.EventsAndTalks a.button { 
  font-weight:600; display:inline-block; margin:20px 0 0;
  color:#000001;border-color: #d7d7d7; background-color: transparent;border-radius:4px; }
section.EventsAndTalks a.button:hover { 
  color:#000001;border-color: #888888; opacity: 1; }
section.EventsAndTalks div.container {
  	/* make sure the vertical stretch propagates into here */
	display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:stretch;
}
section.EventsAndTalks div.EventFlex {width:65%;padding:0 30px 0 0;}
section.EventsAndTalks div.TalkFlex {width:35%;}
section.EventsAndTalks div.EventsList > div {
  line-height:1.3;
  float:none !important;background-color:#f1f1f1;margin:0 0 3px; padding:15px;
}
section.EventsAndTalks div.TalksList span.MediaList > div {
  line-height:1.5;
  background-color:#f1f1f1;margin:0 0 3px;padding:16px 10px 16px 60px;
  float:none !important;
}

section.EventsAndTalks div.mediaListTitle a {
  font-size:20px;font-weight:600;color:#000001;position:relative;
}
section.EventsAndTalks div.mediaListTitle a:hover {color:#888888;}
section.EventsAndTalks div.mediaListTitle a::before {
	content:' ';
  	display:block;position:absolute;top:1px;left:-40px;
  	width:26px; height:25px;
  	background-image:url(/Images/Content/1000000028/Templates/1000010762/image/IconAudio25h.png);
  	background-repeat:no-repeat;
}
section.EventsAndTalks div.mediaListSpeaker {font-size:18px;font-weight:600;}
section.EventsAndTalks div.MediaListDate {font-size:16px;}

section.EventsAndTalks div.EventsList a,
section.EventsAndTalks div.EventsList img {display:block;}
section.EventsAndTalks div.EventsList img {width:250px;}
section.EventsAndTalks div.EventsList img {padding:0 30px 0 0;}
section.EventsAndTalks div.eventListTitle a {
	font-size:24px;font-weight:600;color:#000001;
}
section.EventsAndTalks div.eventListTitle a:hover {color:#888888;}
section.EventsAndTalks div.eventListDate {
  display:inline-block; border-radius:4px; font-size:17px; line-height:1;
  background-color:#888888; color:white; padding:6px 12px 5px; font-weight:600;
  margin:5px 0 5px;
}
section.EventsAndTalks div.eventListLocation a {
  padding:6px 0 0 25px;position:relative;color:#000002;
}
section.EventsAndTalks div.eventListLocation a::before {
	content:' ';
  	display:block;position:absolute;top:5px;left:0;
  	width:15px; height:20px;
  	background-image:url(/Images/Content/2823/Templates/56063/images/IconMapPin20h.png);
  	background-repeat:no-repeat;
}
section.EventsAndTalks div.eventListLocation a:hover {color:#888888;}
section.EventsAndTalks div.eventListLocation a.InActive {cursor:default;}
section.EventsAndTalks div.eventListLocation a.InActive:hover {color:#000002;}
@media (max-width:991px) {
  	section.EventsAndTalks {padding:30px 10px 20px;}
  	section.EventsAndTalks h1 {margin:0 0 10px; text-align:center;}
  	section.EventsAndTalks a.button {margin:10px 0 0;}
	section.EventsAndTalks div.container {
		flex-flow:column nowrap;align-items:center;
	}
  	section.EventsAndTalks div.EventFlex {width:100%;padding:0;margin:0 auto;max-width:600px;}
	section.EventsAndTalks div.TalkFlex {width:100%;margin:40px auto;max-width:600px;}
}
/* on mobiles put image at the top */
@media (max-width:600px) {
  section.EventsAndTalks div.EventsList tr {
  	display:flex;flex-flow:column nowrap;justify-content:flex-start;align-items:flex-start;
  }
  section.EventsAndTalks div.EventsList img {padding:0 0 15px;width:100%;}
}
/* on desktop make sure the heights of the 2 columns match up perfectly */
@media (min-width:992px) {
  section.EventsAndTalks div.EventFlex,
  section.EventsAndTalks div.TalkFlex {
    	/* ensure the stretching propagates up */
      display:flex;flex-flow:column nowrap;justify-content:stretch;align-items:stretch;
  }
  section.EventsAndTalks div.EventFlex div.EventsList,
  section.EventsAndTalks div.EventFlex div.TalksList {
      flex:1 1 auto; /* controls the stretching, vertical space goes into the 'space-between' */
      display:flex;flex-flow:column nowrap;justify-content:space-between;align-items:stretch;	
  }
  /* stop the buttons from changing shape */
  section.EventsAndTalks a.button {align-self:flex-start;}
}

/* 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:#000001;
  	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; line-height:1.4;
  padding:10px 10px 0 10px;
}
footer div.FooterSafeGuarding h1 {font-size:22px; line-height:1; margin:0 0 10px; color:#000001;}
footer div.FooterSafeGuarding.BottomBorder {border-bottom:1px solid #d7d7d7;}

/* Supporter logos */
footer div.LogoWrapper {
	background-color:#F1F1F1;
	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:10px;
	background-color:white;
  padding:15px;
  box-shadow: 0px 0px 20px -5px rgba(0,0,0,.12);
  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:-60px;
  width:70px;height:70px;border-radius:50px;border:2px solid #a3b4ba;
  background-color:#a3b4ba;
  display:block;
}
section.SeekerBox img.Close {
	width:22px;position:absolute; left:21px; bottom:21px; cursor:pointer;
}
section.SeekerBox.Shrink img.Close {
	left:10px; bottom:10px;
}
section.SeekerBox.BigBox img.Close {
	width:auto; left:initial; bottom:initial; right:5px; top:5px;
}
section.SeekerBox.BigBox img.Close.Outer {display:none;}
section.SeekerBox b,
section.SeekerBox strong {font-weight:700;}

section.SeekerBox div.SmallSeekerArticle a {
  display:inline-block;padding:8px 10px 5px 40px;background-color:#000001;color:white;
  border-radius:7px;
}
section.SeekerBox div.SmallSeekerArticle a:hover {background-color:#777777;}
body.OnSmallAppleDevice section.SeekerBox div.SmallSeekerArticle a {
	background-color:#000001 !important;
}

section.SeekerBox div.VerboseText a {margin-top:10px;}
section.SeekerBox.Shrink {width:195px;padding:3px;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:#000001;color:white;
  	padding:10px 10px 10px 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:20px;
} 
@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:30px;}
}
@media (max-width:1400px) {
  footer.WidgetShowing {padding-bottom:90px;}
}

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 #bbbbbb;
}
@media (min-width:992px) {
  header section.slice_Header_L.SystemPage {
      border-bottom:1px solid #bbbbbb;
  }
}
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 black;
}
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 2px black;
}
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:#888888;
  	border:1px solid #888888;
  	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: #888888 ; /* 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 div.RoundImage 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) {
  section.EventsAndTalks {padding:10px 10px 0;}
  section.EventsAndTalks h1 {
    text-align:left; font-size:22px;
    padding-left:15px;
  }
  section.EventsAndTalks div.eventListTitle a {font-size:18px;}
  section.EventsAndTalks div.EventsList td:first-child {display:none;}
  section.EventsAndTalks div.eventListDate {
    font-size:13px; font-weight:400; padding-top:9px; padding-bottom:8px;
  }
  section.EventsAndTalks div.eventListLocation a {font-size:14px;}
  section.EventsAndTalks div.EventsList > div {margin:0 0 2px;}
  
  section.EventsAndTalks a.button {font-size:12px; padding-bottom:8px; margin-left:15px;}
  
  section.EventsAndTalks div.mediaListTitle a {font-size:18px;}
  section.EventsAndTalks div.mediaListSpeaker {font-size:16px;}
  section.EventsAndTalks div.MediaListDate {font-size:14px;}
  section.EventsAndTalks div.TalksList span.MediaList > div {margin:0 0 2px;}
  
  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.RedBanner {
  padding:10px; background-color:#888888;
}
section.RedBanner div.ArticleBody,
section.RedBanner a {
  	text-align:center;font-size:24px;line-height:1.3;color:white;
}
section.RedBanner a,
section.RedBanner a:hover {text-decoration:underline;}
@media (max-width:991px) {
  	section.RedBanner div.ArticleBody,
	section.RedBanner a {font-size:18px;}
}
@media (max-width:359px) {
  	section.RedBanner div.ArticleBody,
	section.RedBanner 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;}

/* UML_AL_1: Universal Mini-Layout Article-List 1 */
div.ArticleBody > div.UML_AL_1 {
	display: flex; flex-flow: row wrap; justify-content: center; align-items:stretch;
}
div.ArticleBody > div.UML_AL_1 > div { background-color: #f1f1f1; width: 100%; margin:15px 0;} /* 1 column */
@media (min-width: 467px) { /* 2 columns */
	div.ArticleBody > div.UML_AL_1 > div { width: 49%; margin:15px 0; }
	div.ArticleBody > div.UML_AL_1 > div:nth-child(2n+1) {margin-right:1%;} /* Extra 1% on each */
	div.ArticleBody > div.UML_AL_1 > div:nth-child(2n) {margin-left:1%;}
}
@media (min-width: 992px) { /* 3 columns */
	div.ArticleBody > div.UML_AL_1 > div { width:32%; margin:15px 0;}
	div.ArticleBody > div.UML_AL_1 > div:nth-child(3n+1) {margin-left:0;margin-right:0;}
	div.ArticleBody > div.UML_AL_1 > div:nth-child(3n+2) {margin-left:2%;margin-right:2%;} /* extra 4% on the middle one only */
	div.ArticleBody > div.UML_AL_1 > div:nth-child(3n) {margin-left:0;margin-right:0;}
}
div.ArticleBody > div.UML_AL_1 div.articleListImage img { display: block; width: 100%;  margin:0;}
div.ArticleBody > div.UML_AL_1 div.articleListImage a { display: block; margin: 0; }
div.ArticleBody > div.UML_AL_1 div.articleListImage a:hover,
div.ArticleBody > div.UML_AL_1 div.articleListTitle a:hover { opacity: 0.6;text-decoration:none; }
div.ArticleBody > div.UML_AL_1 div.articleListTitle {  padding: 10px 10px;}
div.ArticleBody > div.UML_AL_1 div.articleListTitle a { 
  font-weight: 700; font-size: larger; text-transform: capitalize;text-align: 
    center;line-height: 1.2; display:block;
  text-decoration:none;
}
div.ArticleBody > div.UML_AL_1 div.articleListSummary { padding: 0 10px 10px;  font-weight: 400; text-align: center;line-height: 1.3;}
div.ArticleBody > div.UML_AL_1 div.articleListLink {flex:1 1 auto;font-size:0;line-height:1;color:transparent;} /* takes up the height slack */

section.OurChurches {background-color:white; padding:50px 10px 60px;}
section.OurChurches a {text-decoration:underline;}

body.TemplateDemo2 header .logo-name {display:block !important;}

section.slice_content_page div.main-content table.hubb-article-table {
  border-collapse:collapse;
  border:none;
}
section.slice_content_page div.main-content table.hubb-article-table td {
  border:none;
}

section.HomepageVideo {position:relative; color:white; }
section.HomepageVideo video {
  display:block; max-height:800px; min-height:500px; object-fit:cover;
  opacity:0;
}


@keyframes CIA_OpacityRise {
	0% {opacity:0;}
	100% {opacity:1;}
}
section.HomepageVideo video {
    animation-name: CIA_OpacityRise;
	animation-iteration-count: 1;
	animation-duration: 1s;
	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.HomepageVideo div.VideoOverlay {
  position:absolute; left:0; right:0; top:0; bottom:0;
  display:flex; flex-flow:column nowrap; justify-content:center; align-items:center;
  color:white;text-align: center;
  padding:0 20px;
  background-size:cover;
}

section.HomepageVideo div.VideoOverlay h1 {
  font-size:64px; font-weight:500; color:white; line-height:1.2;
  margin:0 20px 30px;
  text-align:center;
}
section.HomepageVideo div.VideoOverlay h3 {color:white; font-size:32px;}
section.HomepageVideo div.VideoOverlay a {
  display:inline-block;
  padding:10px 20px;
  background-color:#b18149; color:white;
  border-radius:6px;
  border:2px solid #b18149;
}
section.HomepageVideo div.VideoOverlay a:hover {
  border-color:white;
}
@media(max-width:991px){
  section.HomepageVideo div.VideoOverlay h1 {
    font-size:32px;
  }
}
section.HomepageVideo div.VideoOverlay div.ArticleBody {
  padding:35px 40px 40px;
  border-radius:6px;
}

body.logged_in_user section.slice_Newsletter {display:none;}
section.slice_Newsletter {
	padding:80px 10px 80px;
  background-image:url(/Images/Content/1000000028/Templates/1000010762/image/Newsletter.jpg);
  background-size:cover;
  background-position:center center;
  text-align:center;
}
section.slice_Newsletter h3 {
  color:white; font-size:32px; font-weight:600; text-align:center;
  margin:0;
}
section.slice_Newsletter div.TextA {
	color:white; margin:0 auto; max-width:610px;font-size:22px
}
section.slice_Newsletter div.TextB,
section.slice_Newsletter div.TextB a {
	color:white; font-size:15px;
}

/* Newsletter profile editor fixes */
div._user_registration_aspx.HomePage div.TopCaption,
div._user_registration_aspx.HomePage div[id$="_outerdiv_ctls_basic_details"] td:first-child
{display:none;}
div._user_registration_aspx.HomePage div#GroupNotesEnclosingDiv > div {
	background-color:transparent !important;
  	border:none;
  	color:white;
  	max-width:1200px;
}
div._user_registration_aspx.HomePage div#GroupNotesEnclosingDiv > div[id$="_outerdiv_ctls_consentfields"] {
  	margin:30px auto 0;
}
div._user_registration_aspx.HomePage div[id$="_div_ctls_basic_details"] {
	display:flex; flex-flow:row nowrap; justify-content:space-between; align-items:flex-start;
}
div._user_registration_aspx.HomePage div#GroupNotesEnclosingDiv div[id$="_div_ctls_basic_details"] > div input.text[type="text"] {
  	border:none; 
  	padding:15px 20px !important;
  	width:100% !important;
}
div._user_registration_aspx.HomePage div[id$="_div_ctls_basic_details"] > div:first-child {
 	width:24%;
}
div._user_registration_aspx.HomePage div[id$="_div_ctls_basic_details"] > div:nth-child(2) {
 	width:24%;
}
div._user_registration_aspx.HomePage div[id$="_div_ctls_basic_details"] > div:nth-child(3) {
 	width:36%;
}
div._user_registration_aspx.HomePage div[id$="_div_ctls_basic_details"] > div.DummyButton {
 	width:12%; position:relative; top:2px; margin:0 0 0 20px; max-width:150px;
}
div._user_registration_aspx.HomePage div[id$="_div_ctls_consentfields"] {
	display:flex; flex-flow:row nowrap; justify-content:center; align-items:flex-start;
}
@media (max-width:991px) {
  div._user_registration_aspx.HomePage div[id$="_div_ctls_consentfields"] {
      flex-flow:column nowrap; justify-content:flex-start; align-items:center;
  }
}
div._user_registration_aspx.HomePage ul.consent-questions {
  margin:0;padding:0;max-width:556px;
}
div._user_registration_aspx.HomePage li.consent-question {
  text-indent:-32px;
}
div._user_registration_aspx.HomePage ul.consent-questions label {
  margin:0 !important;
	position:relative; top:-12px;
    cursor:pointer;
}
div._user_registration_aspx.HomePage ul.consent-questions input[type="checkbox"] {
	width:28px; height:28px; position:relative; right:10px;
  	border-radius:6px;
    cursor:pointer;
}
div._user_registration_aspx.HomePage div.DummyButton {
  display:inline-block;
  border:2px solid white;
  border-radius:30px;
  margin:0;
  padding:13px 30px;
  font-size:18px; font-weight:500;
  line-height:1;
  transition:background-color 300ms linear,color 300ms linear;
  cursor:pointer;
  white-space:nowrap;
}
div._user_registration_aspx.HomePage div.DummyButton:hover {
  opacity:1;
  background-color:white; color:black;
}
div._user_registration_aspx.HomePage span[id$="_ctlCaptchaButton_objConfigurableButton"] {display:none;}

@media (max-width:991px) {
  div._user_registration_aspx.HomePage div[id$="_div_ctls_basic_details"] {
      flex-flow:column nowrap; justify-content:flex-start; align-items:center;
  }
  div._user_registration_aspx.HomePage div[id$="_div_ctls_basic_details"] > div {
      width:100% !important;
    	max-width:400px;
      margin:0 0 20px  !important;
  }
  div._user_registration_aspx.HomePage div[id$="_div_ctls_basic_details"] > div:last-child {
      margin:0 !important;
  }
}

div.invisible-recaptcha {display:none;}

section.slice_content_page section.slice_Newsletter {padding:30px 0 !important;}
section.slice_content_page section.slice_Newsletter td {padding-left:0!important;} 
@media(min-width:992px){
   section.slice_content_page section.slice_Newsletter div.DummyButton {
      margin:0!important; padding:13px 10px!important;
    width:14%!important;
  }
}

/* Bits of a shop are not covered by a shop template. These inculde:

1) T&C's page.
2) Credit Card "why is this safe" and "security number on back of card" pop-ups.

They are set by the template in use for system pages, and not by the shop template.
So the code below should be added to the system page template.
This code assumes the system page template JS is correctly adding the "_shop_termsandconditions_aspx" etc. class to the body tag.
*/
body.system_popup { 
	padding-left: 10px !important; 
  	background-color:white !important;
}
body.system_popup input[type=submit],
body.system_popup input[type=button] {
  	margin-top:5px !important;
  	padding:5px 20px;
	background-color:#000000 !important;
  	color: white;
  	border:none;
  	border-radius:5px;
  	width:auto !important;
}
body.system_popup._shop_termsandconditions_aspx table.pagebox_homepage.pagebox blockquote { 
	margin: 0 10px 0 0 !important; 
}
body.system_popup._shop_termsandconditions_aspx table.pagebox_homepage.pagebox h1 {font-size:32px;}
body.system_popup._shop_termsandconditions_aspx table.pagebox_homepage.pagebox h3 { 
	padding-top: 30px !important; 
}
body.system_popup._shop_termsandconditions_aspx table.pagebox_homepage.pagebox p { 
	margin: 0 !important; 
	padding: 0 !important; 
}
body.system_popup._shop_termsandconditions_aspx table.pagebox_homepage.pagebox table td:last-child { 
	text-align: left !important; 
	padding-left: 10px !important;
}

body._myarea_walletitem_aspx input[type=submit] {width:auto !important}
body._myarea_walletitem_aspx div[id$=_pnlEdit] > table {width:96% !important;}
body._myarea_walletitem_aspx div[id$=_pnlEdit] table td,
body._myarea_walletitem_aspx div[id$=_pnlView] table td {padding:2px !important;}

body._shop_checkout_whyisthissafe_aspx table.pagebox_homepage.pagebox {width:100% !important;}
body._shop_checkout_whyisthissafe_aspx table.pagebox_homepage.pagebox td {padding:5px 2px !important;}

body._shop_checkout_explaincardcsv_aspx table.pagebox_homepage.pagebox td {padding:5px 2px !important;}

.slice_Header_L .nav-menu ul.root_menu > li ul li.has_sub_menu::after {
	top:2px !important;
}

section.slice_content_page div.main-content font {
	font-family:Nunito Sans, sans-serif !important;
  font-size: inherit !important;
}
section.slice_content_page div.main-content div.author {
	margin-top:20px;
}
section.slice_content_page div.main-content img[align="left"] {
	margin-right:10px;
  margin-left:0;
}
section.slice_content_page div.main-content img[align="right"] {
	margin-left:10px;
  margin-right:0;
}