/*  (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 Centre 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. */

/* Logo system is COMPLEX! Ask Kenton! */

/* Size of LOGO image */
header .logo-icon img
{ 
	width:  auto !important; 
	height: 21px !important; /* <<< mobile logo height */
}
@media(min-width:480px){header .logo-icon img
{ 
	height: 35px !important; /* <<< tablet logo height */
}
}
@media(max-width:479px){header div.logo-container 
{ 
	margin-left:2px !important; /* <<< tablet logo height */
}
}
@media(min-width:1360px){header .logo-icon img
{ 
	height: 41px !important; /* <<< tablet logo height */
}
}
/* Gap between logo and top/bottom of screen  */
header div.logo-container 
{
	margin-top: 3px !important; /* <<< gap from top for mobile/tablet */
	margin-bottom: 0 !important; /* <<< gap from bottom for mobile/tablet */
	position:absolute !important;top:0;left:0;
}
@media (min-width:992px) {
  header div.logo-container {
	margin-top: 60px !important; /* <<< gap from top for desktop */
	margin-bottom: 0 !important; /* <<< gap from bottom for desktop */
	}
}
@media (min-width:1300px) {header div.logo-container 
{
	margin-top: 20px !important; /* <<< gap from top for desktop */
}}

/* Logo in scrolled-down smaller tinited header */
header section.slice_Header_T.HeaderTintOn div.logo-container img {height:21px !important;}
header section.slice_Header_T.HeaderTintOn div.logo-container {margin-top:9px !important;}
@media (min-width:480px) {
  header section.slice_Header_T.HeaderTintOn div.logo-container img {height:35px !important;}
  header section.slice_Header_T.HeaderTintOn div.logo-container {margin-top:2px !important;}
}
@media (min-width:992px) {
  header section.slice_Header_T.HeaderTintOn div.logo-container {
	margin-top: 14px !important; /* <<< gap from top for desktop */
	}
}
@media (max-width:1200px) {
  header section.slice_Header_T.HeaderTintOn div.nav-menu ul.root_menu > li > a {
    padding-left:10px;
    padding-right:10px;
    font-size:16px;
  }
}
@media (max-width:1100px) {
  header section.slice_Header_T.HeaderTintOn div.nav-menu ul.root_menu > li > a {
    padding-left:7px;
    padding-right:7px;
    font-size:15px;
  }
}

/* System pages banner image */
section.LargeBlockImageSystemPage {
  padding:120px 0; 
  background-color:#1ca396;
}
/* This will get over-ridden by JS code */
/*
section.LargeBlockImageContentPage {background-image:url(../../../1071956.jpg);}
*/


/* ############ Mobile menu colours */
header section.slice_Header_T a.slicknav_btn
{
	background-color: transparent !important; /* <<< colour of the menu bar */
}
header section.slice_Header_T a.slicknav_btn.slicknav_open
{
	background-color: #888888 !important; /* <<< colour of the menu bar */
}
header section.slice_Header_T .slicknav_icon-bar
{
	background-color: white !important; /* <<< colour of the menu icon */
}
header section.slice_Header_T div.SlickNavCloseIcon
{
	color: white !important; /* <<< colour of the menu close icon */
}
header section.slice_Header_T div.slicknav_menu  ul.slicknav_nav {padding-bottom:10px;border-bottom:1px #888888 solid;}
header section.slice_Header_T div.slicknav_menu  ul.slicknav_nav a {font-weight:600;}
@media (max-width:991px) {
	header section.slice_Header_T .search-overlay .search-close {top:25px;}
}

/* ############ Search box background colour */
header div.search-overlay
{
	background-color:#1ca396 !important; /* <<< Search box background colour */
}
header a.search-close 
{
	color: white !important;  /* <<< Search box close icon */
}

/* Social media links */
header div.top-link-wrapper {padding:5px 5px 0 0;}
header div.top-link-wrapper img.IconTwitterHover,
header div.top-link-wrapper img.IconFacebookHover,
header div.top-link-wrapper a.TwitterLink:hover img.IconTwitter,
header div.top-link-wrapper a.FacebookLink:hover img.IconFacebook
{display:none;}

header div.top-link-wrapper a.TwitterLink,
header div.top-link-wrapper a.FacebookLink {display:inline-block; width:33px;}
header div.top-link-wrapper a.TwitterLink img,
header div.top-link-wrapper a.FacebookLink img {margin:0 auto;}

header div.top-link-wrapper img.IconTwitter,
header div.top-link-wrapper img.IconFacebook,
header div.top-link-wrapper a.TwitterLink:hover img.IconTwitterHover,
header div.top-link-wrapper a.FacebookLink:hover img.IconFacebookHover
{display:block;}

header ul.slicknav_nav img.IconTwitter,
header ul.slicknav_nav img.IconFacebook
{display:none;}
header ul.slicknav_nav img.IconTwitterHover,
header ul.slicknav_nav img.IconFacebookHover {display:block;}
header ul.slicknav_nav a.TwitterLink,
header ul.slicknav_nav a.FacebookLink {padding-top:5px !important; padding-bottom:5px !important;}

/* Large image blocks */
section.LargeBlockImage1,
section.slice_VideoWrapper {padding-top:0 !important; padding-bottom:0 !important;}
section.LargeBlockImage2,
section.LargeBlockImage3,
section.LargeBlockImage4,
section.LargeBlockImage5 {height:100vh;padding-top:0 !important; padding-bottom:0 !important;}

section.LargeBlockImage2,
section.LargeBlockImage3,
section.LargeBlockImage4,
section.LargeBlockImage5,
section.LargeBlockImage1LandingPage,
section.LargeBlockImage2LandingPage,
section.LargeBlockImageContentPage {background-position: center center;}

@media (min-width:1200px) {
	section.LargeBlockImage1 div.title1 {font-size:80px; font-weight:700;}
}
@media (max-width:1199px) {
	section.LargeBlockImage1 div.title1 {margin-top:80px;}
}
section.slice_LargeBlockImage div.title1 {margin-left:20px;margin-right:20px;}

section.slice_VideoWrapper.SlickNavTransparentOn {height:auto;}
header video {
  width:100% !important; 
  /* height:100vh !important; */
  object-fit: fill !important;
}

/* Slide bar */
section.slice_SlideBar {
	position: fixed; 
	left:30px;
	right:30px;
	bottom: 20px; 
	z-index:1;
}
section.slice_SlideBar div.SlideBarButton {
	text-align:center;
	float:left;
	width:20%;
	font-size: 21px;
	line-height:1;
	letter-spacing: 1px;
	background-color: white;
	border-right: 2px solid black;
	transform: skewX(-30deg);
}
section.slice_SlideBar div.SlideBarButton:last-child {border:none;}
section.slice_SlideBar a {display:inline-block; padding:15px 0 13px;}
section.slice_SlideBar span.SlideBarLinkText {display:block; color:black; border-bottom:2px solid transparent; transform: skewX(30deg);} /* skew back the text */
/* dynamic stuff */
section.slice_SlideBar a:hover span.SlideBarLinkText {border-bottom-color:white;}
section.slice_SlideBar div.SlideBarButton:hover,
section.slice_SlideBar div.SlideBarButton.SlideBarButtonOn {background-color:black}
section.slice_SlideBar div.SlideBarButton:hover span.SlideBarLinkText,
section.slice_SlideBar div.SlideBarButton.SlideBarButtonOn span.SlideBarLinkText {color:white;} /* set text color within <a> to override normal link colour */
@media (max-width:992px) {
	section.slice_SlideBar div.SlideBarButton {font-size: 16px;}
	section.slice_SlideBar a {padding:6px 0 3px;}
}
@media (max-width:767px) {
	section.slice_SlideBar {left:10px;right:10px;bottom:10px;}
	section.slice_SlideBar div.SlideBarButton {font-size: 14px; letter-spacing:normal;}	
}
@media (max-width:500px) {
  	section.slice_SlideBar {left:0;right:0;bottom:0;}
	section.slice_SlideBar div.SlideBarButton {font-size: 13px; transform: skewX(0deg);}
	section.slice_SlideBar div.SlideBarButton.Slide1 {width:15%;text-align:right;}
	section.slice_SlideBar div.SlideBarButton.Slide1 a {padding-right:10px;}
	section.slice_SlideBar div.SlideBarButton.Slide3 {width:30%;}
	section.slice_SlideBar div.SlideBarButton.Slide4 {width:15%;}
	section.slice_SlideBar div.SlideBarButton.Slide5 {text-align:left;}
	section.slice_SlideBar div.SlideBarButton.Slide5 a {padding-left:10px;}
	section.slice_SlideBar span.SlideBarLinkText {border-bottom-width:1px; transform: skewX(0deg);}
}
section.slice_Footer_D.FooterExpand {padding-bottom: 65px;}

/* Header Tint */
header {position:relative;}
header section.slice_Header_T.ContentPage {position:absolute;top:0;left:0;right:0;width:100%;}
header section.slice_Header_T.HeaderTintOn {background-color: rgba(0,0,0,0.6) !important;}
header section.slice_Header_T div.logo-container img {transition:500ms height linear;}

/* allow a wider content page */
section.slice_content_page div.container {max-width: 1300px;}

/* make scrolling text work */
section.slice_LargeBlockImage div.ArticleBody {position:relative; transition:top 50ms linear; will-change:top;}
section.slice_LargeBlockImage {transition:margin-bottom 50ms linear; will-change:margin-bottom;}

div.endis-jquery-ui div#divOverlay {font-size:16px;}

/* Code to make slide-shows look better on mobile screens */
@media (max-width:600px) {
	header#anchorVideo video {
		width: 150% !important; /* double the width, which doubles the height, and then translate so we see the middle 50% */
		transform: translateX(-16.666%);
	}
  	header#anchorVideo section.slice_VideoWrapper {
      overflow-x:hidden;
      overflow-y:visible;
    } 
  	header#anchorVideo div.video-overlay,
    header#anchorVideo div.SlickNav_Wrapper,
  	header#anchorVideo section.slice_VideoWrapper.SlickNavTransparentOn {
      overflow-x:visible;
      overflow-y:visible;
    } 
}
header#anchorVideo section.slice_Header_T div.SlickNav_Wrapper {position:static;}

section.LargeBlockImageContentPage h1,
section.LargeBlockImageSystemPage h1 {color:white;text-shadow:0 0 2px black;}
@media (min-width:1200px) {
	section.LargeBlockImageContentPage {padding-top:250px;padding-bottom:250px;}
}

section.slice_content_page div.main-content {margin-top:0;}
section.slice_content_page aside nav a {border-bottom:1px solid #d5d5d5;}
@media (min-width:992px) {
	section.slice_content_page aside.sidebar nav table.group-nav a {padding-left:0 !important;padding-right:0 !important;}	
}

section.slice_content_page .sidebar .sidebar_buttons a.button1 img {top:4px;padding-right:16px;}
section.slice_content_page .sidebar .sidebar_buttons a.button2 img {top:4px;margin-left:4px;}
section.slice_content_page .sidebar .sidebar_buttons a.button3 img {top:7px;margin-left:2px;}

section.slice_FixedSideLinks.ContentPage div.fixed-link-wrapper {background-color:rgba(0,0,0,0.7);}

section.slice_Header_T .nav-menu ul.root_menu > li ul li { border-top: 1px solid #888888; }

/* code for > and < on desktop menus */
section.slice_Header_T div.nav-menu ul.root_menu > li ul li.has_sub_menu::after,
section.slice_Header_T div.nav-menu ul.root_menu > li:last-child > ul li.has_sub_menu::before, 
section.slice_Header_T div.nav-menu ul.root_menu > li:nth-last-child(2) > ul li.has_sub_menu::before
{top:6px;}

/* 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; }

section.LargeBlockImageContentPage {text-align:center;position:relative;}
section.LargeBlockImageContentPage h1,
section.LargeBlockImageSystemPage h1 {
  position:relative; z-index:0;
}
section.LargeBlockImageContentPage 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;} 

/* 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;}

/* Fix system page ul lists */		
section.slice_system_page div.system_content ul {
  list-style-type: disc;
  padding-left:40px;
}

header div.SlickNav_Wrapper {z-index:1;}

/* 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;}

footer i.ImageSocialMediaIcon::after {padding:10px !important;}

/* 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_LargeBlockImage div.title1,
section.slice_LargeBlockImage a.BlockImageButton {text-shadow:0 0 2px black;}  /* Centre */
section.slice_LargeBlockImage a.BlockImageButton:hover {text-shadow:none;}

header section.slice_Header_T ul.root_menu > li > a {text-shadow:0 0 2px black;} /* Centre */
header section.slice_Header_T ul.root_menu > li:hover > a {text-shadow:none;}
header section.slice_Header_T.HeaderTintOn ul.root_menu > li > a,
header section.slice_Header_T.ContentPage ul.root_menu > li > a {text-shadow:none;}

header ul.root_menu ul ul {border-left: 1px solid #dddddd;border-right: 1px solid #dddddd;}

footer div.FooterSafeGuarding {
  float:none; clear:both;
	width:100%; margin:0 auto 20px; max-width:700px; line-height:1.3;
  padding:0 10px;
}
footer div.FooterSafeGuarding div.ArticleBody {
	display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start;
}
footer div.FooterSafeGuarding a {
  	white-space:no-wrap;
	margin:5px 20px;
}
footer div.FooterSafeGuarding br {display:none;}

@media(min-width:992px){
  section.slice_system_page._media_allmedia_aspx div.media_summary_image img {
    max-width:initial !important;
  }
}

section.slice_system_page div.system_title h1 {display:none;}

section._calendar_month_aspx_B {
	background-image:url(/Images/Content/966/1096453.jpg);
}
section._media_allmedia_aspx_B {
	background-image:url(/Images/Content/966/1094921.jpg);
}

section.slice_system_page._calendar_month_aspx ul#calendar_buttons i.toggle-calendar-view::before {position:relative; top:-11px;}

section.ShowTopLinks10Sep2021 div.nav-menu {margin-top:0;}

@media (min-width:1200px){
  header section.LargeBlockImage1 a[href$="ID=370231"] {margin-top:200px;}
}
@media (min-width:992px) and (max-width:1199px) {
  header section.LargeBlockImage1 a[href$="ID=370231"] {margin-top:100px;}
}

section.slice_LargeBlockImage.LargeBlockImage2 {position:relative;}
section.slice_LargeBlockImage.LargeBlockImage2 div.ArticleBody {
  position:static;
}
/*
section.slice_LargeBlockImage.LargeBlockImage2 a.BlockImageButton {
  position:absolute;
  top:0; bottom:0; left:0; right:0;
  color:transparent;
  border-color:transparent;
  text-shadow:none;
}
section.slice_LargeBlockImage.LargeBlockImage2 a.BlockImageButton:hover {
  color:transparent;
  border-color:transparent;  
  background-color:transparent;
}
*/

/*
@media(max-width:767px){
	section.slice_LargeBlockImage.LargeBlockImage2 {
		background-image:url(/Images/Content/966/Templates/61246/images/Green.jpg) !important;
      	background-position:left center  !important;
	}
}
*/