/*  (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 Grace 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. */

/* Set CSS background images */
section.slice_Article_Image {
    background-image: url(../../../968061.jpg) !important; /* children's background image */
  	background-position: center center;
}
section.slice_Article_Image div.article_image {
    background-image: url(../../../968059.jpg) !important; /* children's fore-ground image */
  	background-position: center center;
}

/* Size of LOGO image */
header .logo-icon img { 
	width:  auto !important; 
	height: 160px !important; /* <<< mobile logo height */
}
@media(min-width:467px){header .logo-icon img
{ 
	height: 160px !important; /* <<< tablet logo height */
}}
@media(min-width:992px){header .logo-icon img
{ 
	height: 160px !important; /* <<< desktop logo height */
}}
/* Gap between logo and top/bottom of screen  */
header div.logo-container 
{
	margin-top: 5px !important; /* <<< gap from top for mobile/tablet */
	margin-bottom: 5px !important; /* <<< gap from bottom for mobile/tablet */
}
@media(min-width:992px){header div.logo-container 
{
	margin-top: 5px !important; /* <<< gap from top for desktop */
	margin-bottom: 5px !important; /* <<< gap from bottom for desktop */
}}

/* In this template the header still expands with the image. */

header .slice_Header_L .logo-container span.logo-name a {
  font-family:Source Serif Pro, serif;
  font-style:normal;
  color:#DA1212;
}
header .slice_Header_L .nav-menu ul.root_menu > li:hover > a {background-color:#DA1212;}


/* ############ slide show caption button, and active/hover round pager button colour */
section.slice_SlidesFullWidth a.bx-pager-link:hover,
section.slice_SlidesFullWidth a.bx-pager-link.active
{
    background-color: #FF8500 !important; /* <<< slide show button background color */
    border-color: 	  #FF8500 !important; /* <<< slide show button border color */
}
/* Slide show inactive round pager buttons */
section.slice_SlidesFullWidth a.bx-pager-link
{
    background-color: #fff !important; /* <<< slide show inactive round button color */
    border-color: 	  #FF8500 !important; /* <<< slide show inactive round button border color */
}
section.slice_SlidesFullWidth div.caption a.slideButton {
	transition:background-color 300ms linear,border-color 300ms linear !important;
}
section.slice_SlidesFullWidth div.caption a.slideButton:hover {
  background-color:#1168AA !important;
	border-color:white !important;
}
section.slice_SlidesFullWidth div.slideTitle {margin:0 20px;}

/* Code to make slide-shows look better on mobile screens */
section.Xslice_SlidesFullWidth {overflow:hidden;} /* hide anything that pokes outside */
@media (max-width:767px) {
	section.Xslice_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:hidden; /* hide anything that pokes outside */
	}
	/* Adjust the captions back again, so they look normal */
	section.Xslice_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:hidden; /* hide anything that pokes outside */
	}
}
@media (max-width:467px) {
	section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager {
	  display:block;bottom:5px;
	}
}

section.slice_SlidesFullWidth a,
section.slice_SlidesFullWidth div.caption,
section.slice_SlidesFullWidth div.caption:hover {opacity:1 !important;}

/* ############ Service Times and Location logos */
section[class^="slice_ServiceText"] div.block2-1::after,
section[class^="slice_ServiceText"] div.block2-2::after,
section.slice_WelcomeText_L div.EventListTitle::after
{
    color: #A1A2AC !important; /* <<< Clock and Location icon colour */
}


/* ############ Top bar of Group-Nav on the content page */
section.slice_content_page aside nav td.boxout_header_middle a
{
    background-color: #1168AA !important; /* <<< Group-Nav top bar background colour */
}

/* 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; }

.HideElement {display:none !important;}

@media (min-width:768px) {
  section.slice_WelcomeText_L div.welcome,
  section.slice_WelcomeText_L section.slice_ServiceTextEB_L {margin-top:50px;}
}

footer section.slice_Footer_D div.footerbar a.footer {
	display:block; width:150px; height:34px; 
  	background-size:contain;
  	background-position:left top;
}
@media (max-width:767px) {
  footer section.slice_Footer_D div.footerbar a.footer {
    float:none; margin:0 auto 15px;
  }
}

section.slice_Gallery3 div.gallery_3_cards ul.gallery_ul div.gallery_3_caption div.gallery_3_title
{font-weight:700;}

header section.slice_Header_L div.nav-menu {font-size:0; text-align:center; line-height:1;}
header section.slice_Header_L div.nav-menu ul.root_menu {
	display:inline-block; float:none;text-align:left;
}
/* code for > and < on desktop menus */
section.slice_Header_L div.nav-menu ul.root_menu > li ul li.has_sub_menu::after,
section.slice_Header_L div.nav-menu ul.root_menu > li:last-child > ul li.has_sub_menu::before, 
section.slice_Header_L div.nav-menu ul.root_menu > li:nth-last-child(2) > ul li.has_sub_menu::before
{top:8px;}

/* 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; }
}

/* Slide-show bottom buttons */ 
section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager {bottom:-22px;}
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:-16px;}
	section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager a.bx-pager-link {width:14px;height:14px;border-radius:7px;}
}
@media (max-width:467px) {
  section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager {display:none;}
}

/* Fix system page ul lists */		
section.slice_system_page div.system_content ul {
  list-style-type: disc;
  padding-left:40px;
}

/* 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;
}
/* make sure these are not set */
html,body {height:initial;}

section.slice_FixedSideLinks i.journey-icon-search::before {position:static;}

/* 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);
  padding:12px 0 0 !important;
}

/* Extra icon using a square background image */
section.slice_FixedSideLinks a.ImageSocialMediaIcon i.icomoon-icon-XXXXXX::after
{ /* Replace url below with actual url of square icon image */
  background-image: url(/Images/Content/1495/Templates/46170/images/CommissionLogo.png);
}

section.slice_Gallery4 ul.gallery_ul {
	display:flex;flex-flow:row wrap;justify-content:center;align-items:stretch;
}

section.slice_WelcomeText_L div.welcome a:not([class]) {color:#1168AA; text-decoration:underline;}

header section.slice_Header_L div.container {max-width:1330px;}
body.logged_in_user header section.slice_Header_L div.container {max-width:1365px;}

/* text links */
section.slice_content_page div.main-content a {font-weight:600;}
section.slice_content_page div.main-content a:hover {opacity:1;}

/* Blue buttons */
section.slice_content_page div.main-content table.BlueButton td {
	vertical-align:middle !important;
}
section.slice_content_page div.main-content a.BlueButton {
	display:block;padding:10px;background-color:white;color:#1168AA;border:1px solid #1168AA;
  min-height:66px;
}
section.slice_content_page div.main-content a.BlueButton.ThreeRowsHigh {min-height:89px;}
section.slice_content_page div.main-content a.BlueButton.OneRowHigh {min-height:43px;}
section.slice_content_page div.main-content a.BlueButton:hover {
	background-color:#1168AA;opacity:1;text-decoration:none;color:white;
}
@media(max-width:991px){
  section.slice_content_page div.main-content a.BlueButton {
	padding:12px 2px 8px;font-size:smaller;
  }
  section.slice_content_page div.main-content table.BlueButton,
  section.slice_content_page div.main-content table.BlueButton td {
    margin:0;padding:0;border-collapse:collapse;
  }
}

section.slice_SlidesFullWidth div.caption div.slideTitle,
section.slice_SlidesFullWidth div.caption div.slideText
{text-shadow:0 0 2px black;}

/* Open and Shut bars */
section.slice_content_page div.main-content div.OpenShut div.OpenShutTitle {
  font-size:20px; font-weight:600;background-color:white;color:#1168AA;border:1px solid #1168AA;
  padding:10px 30px 10px 15px; margin-top:15px; position:relative;
  line-height:1.3;
}
section.slice_content_page div.main-content div.OpenShut.Opened div.OpenShutTitle {
	background-color:#1168AA;color:white;
}
section.slice_content_page div.main-content div.OpenShut div.OpenShutTitle::after {
	font-family:journey;content:'\e913'; position:absolute; right:10px; color:#1168AA;font-weight:400;
}
section.slice_content_page div.main-content div.OpenShut.Opened div.OpenShutTitle::after {
	transform:rotate(180deg);color:white;
}
section.slice_content_page div.main-content div.OpenShut div.OpenShutText {
 display:none; padding:5px; border:2px solid #1168AA; border-top:none;
}
section.slice_content_page div.main-content div.OpenShut.Opened div.OpenShutText {
 display:block; 
}
body.ArticleEditor div.OpenShut div.OpenShutTitle,
body.ArticleEditor a.BlueButton {background-color:white;color:#1168AA;padding:5px;}
body.ArticleEditor div.OpenShut div.OpenShutText {
  padding:5px; border:2px solid #1168AA; border-top:none;
}

/* Footer logos */
footer div.FooterLogosW {
  float:none;clear:both;width:100%; max-width:600px; margin:0 auto;
  padding:10px 10px 0;
}
footer div.FooterLogos {
	display:flex; flex-flow:row wrap; justify-content:space-around; align-items:center;
	background-color:white;
}
footer div.FooterLogos img {display:block;margin:5px;}

section.slice_content_page div.main-content h1,
section.slice_content_page div.main-content h2,
section.slice_content_page div.main-content h3,
section.slice_content_page div.main-content h4,
section.slice_content_page div.main-content h5,
section.slice_content_page div.main-content h6 {color:#1168AA;}
section.slice_content_page div.main-content span {font-size:inherit !important;}
@media (max-width:992){
	section.slice_content_page div.main-content span.Email {word-break: break-all;}
}
section.slice_content_page div.main-content div.ChangingImages ul {
	margin:0; padding:0;
}
section.slice_content_page div.main-content div.ChangingImages img {
	display:block;max-width:100%;
}

section.slice_Article_Image,
div.ImageCopyrightWrapper.isolate_element {position:relative;}
div.ImageCopyrightWrapper.isolate_element img {display:block;}
section.slice_Article_Image div.ImageCopyright,
div.ImageCopyrightWrapper.isolate_element div.ImageCopyright {
  position:absolute;bottom:0;left:0;
  padding:3px 5px;background-color:rgba(0,0,0,0.5);color:white;
  font-size:14px;line-height:1.2;
  font-family:Open Sans, sans-serif;
  font-weight:400;
}
div.ImageCopyrightWrapper.isolate_element.Right {float:right !important;}
div.ImageCopyrightWrapper.isolate_element.Right div.ImageCopyright {
 	right:0;left:initial; 
}

section.slice_WelcomeText_L div.EventListTitle {
	color:#1168AA;
  	text-align:left;
  	font-weight:700;
}
section.slice_content_page aside div.EventListTitle {
	margin:30px 0 0;
  	padding:10px;
  	background-color:#1168AA;
  	color:white;
  	text-align:left;
}
section.slice_WelcomeText_L div.EventListTitle {padding:20px 0 10px 55px;position:relative;}
section.slice_WelcomeText_L div.EventListTitle::after {
	font-family: journey;
    font-style: normal;
    font-weight: normal;
    position: absolute;
  	font-size: 33px;
    top: 11px;
  	left: 10px;
  	content: "\e910";
}
section.slice_WelcomeText_L div.EventList {
	margin:0 0 0 55px;
}

section.slice_WelcomeText_L div.EventList,
section.slice_content_page aside div.EventList {
  	padding:10px 10px 0;
  	background-color:white;
    text-align:left;
}
section.slice_WelcomeText_L div.EventList {padding-left:0;}
section.slice_WelcomeText_L div.EventList td.cal_row,
section.slice_WelcomeText_L div.EventList td.cal_altrow,
section.slice_content_page aside div.EventList td.cal_row,
section.slice_content_page aside div.EventList td.cal_altrow {
	padding:0 0 20px;
}
section.slice_WelcomeText_L div.EventList td.cal_mod_title {font-weight:600;}
section.slice_WelcomeText_L div.EventList td.cal_mod_datetime,
section.slice_WelcomeText_L div.EventList td.cal_mod_location a
{
	font-size:17px;line-height:1.2;
}
section.slice_content_page aside div.EventList td.cal_mod_datetime,
section.slice_content_page aside div.EventList td.cal_mod_location a
{
	font-size:15px;line-height:1.2;
}
section.slice_WelcomeText_L div.EventListTitle,
section.slice_WelcomeText_L div.EventList {
	font-size:18px;
}
section.slice_WelcomeText_L div.EventList tr:last-child td.cal_row,
section.slice_WelcomeText_L div.EventList tr:last-child td.cal_altrow
{padding:0;}
@media (max-width:767px) {
  section.slice_WelcomeText_L div.EventList {margin-bottom:20px;}
  section.slice_WelcomeText_L div.EventListTitle {font-size:14px;}
  section.slice_WelcomeText_L div.EventListTitle::after {font-size:28px;left:16px;}
  section.slice_WelcomeText_L div.EventList td.cal_mod_title,
  section.slice_WelcomeText_L div.EventList td.cal_mod_datetime,
  section.slice_WelcomeText_L div.EventList td.cal_mod_location a {font-size:14px;}
}

/* Event pop-up font fix */
div.dialog-content.calendar-event-content h3 {font-family:Open Sans,sans-serif;}

/* Forms code */
section.slice_content_page div.main-content div.SMForm {
  background-color:#eeeeee;padding:10px;clear:both;
}
section.slice_content_page div.main-content div.FormSmallText {
  font-size:smaller; margin-left:20px;
}
section.slice_content_page div.main-content div.SMForm input[type="button"] {display:block;}
section.slice_content_page div.main-content table.SMTable {
  border-collapse:collapse;width:100%;
color:#1168AA;font-weight:700;
}
section.slice_content_page div.main-content table.SMTable td {
	padding:2px;
}
section.slice_content_page div.main-content table.SMTable td:first-child {
	width:30%;text-align:right;
}
section.slice_content_page div.main-content table.SMTable input[type="text"],
section.slice_content_page div.main-content table.SMTable textarea {margin:0;}
section.slice_content_page div.main-content table.SMTable select
{width:100%;font-size:smaller;padding:5px 2px;}

@media (max-width:467px){
  section.slice_content_page div.main-content table.SMTable td {
      padding:10px 2px;
  }
}

section.HubbChristmasBanner2022 {padding-top:40px !important;}