/* 
   Style Over-Ride file for Revelation OPTIONS 1,2 & 5 TRIAL SITE template.
   Put/edit CSS styles in here that are specific to a customer. 

   WARNING - try not to add styles that will be applied to article contents, 
   or else customers will get confused if they try to change colours/styles 
   in an article but see no change on their screen. We do have styles in here to 
   change the colour of buttons in slices, as these are not so easy for customers 
   to change. */

/* ############ Size of site logo image */
/* (For reference the entire desktop header is 127px high, unless there is a massive logo present) */
header .logo-icon img
{ 
	width:  auto !important; /* <<< mobile logo width */
	height: 65px !important; 
}
@media(min-width:467px){header .logo-icon img
{ 
	height: 80px !important; 
}
}
@media(min-width:992px){header .logo-icon img
{ 
	height: 95px !important; 
}
}
/* 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: 10px !important; /* <<< gap from top for desktop */
	margin-bottom: 0 !important; /* <<< gap from bottom for desktop */
}}

header ul.root_menu > li:first-child img.NotHover {display:block;}
header ul.root_menu > li:first-child img.Hover {display:none;}
header ul.root_menu > li:first-child a.menu_link {padding:21px 13px !important; transition:none; margin:0;}
header ul.root_menu > li:first-child:hover a.menu_link {padding:6px 0 !important;}
header ul.root_menu > li:first-child:hover img.NotHover {display:none;}
header ul.root_menu > li:first-child:hover img.Hover {display:block; position:relative; top:2px;}

header ul.slicknav_nav > li:first-child img {margin-left:5px;}
header ul.slicknav_nav > li:first-child img.NotHover {display:block;}
header ul.slicknav_nav > li:first-child img.Hover {display:none;}
header ul.slicknav_nav > li:first-child a.menu_link {padding:15px 13px !important; transition:none; margin:0;}
header ul.slicknav_nav > li:first-child:hover a.menu_link {padding:0 !important;}
header ul.slicknav_nav > li:first-child:hover img.NotHover {display:none;}
header ul.slicknav_nav > li:first-child:hover img.Hover {display:block; position:relative; top:2px;}

/* ############ Mobile menu colours */
header section.slice_Header_L a.slicknav_btn
{
	background-color: #f0f0f0 !important; /* <<< colour of the menu bar */
}
header section.slice_Header_L .slicknav_icon-bar
{
	background-color: #e27a73 !important; /* <<< colour of the menu icon */
}
header section.slice_Header_L div.SlickNavCloseIcon
{
	color: #e27a73 !important; /* <<< colour of the menu close icon */
}

/* ############ Search box background colour */
header div.search-overlay
{
	background-color: #e27a73 !important; /* <<< Search box background colour */
}
header a.search-close 
{
	color: white !important;  /* <<< Search box close icon */
}
header section.slice_FixedSideLinks a.Donate {
	background-color:transparent;
	display:block; margin:205px 0 0 !important; padding:0 !important; position:fixed; top:25vh; left:0; width:auto !important; height:auto !important;
	z-index:10;
}
header section.slice_FixedSideLinks a.Donate img.NotHover {display:block;}
header section.slice_FixedSideLinks a.Donate img.Hover {display:none;}
header section.slice_FixedSideLinks a.Donate:hover img.NotHover {display:none;}
header section.slice_FixedSideLinks a.Donate:hover img.Hover {display:block;}

/* Resize header */
@media (max-width:1100px) {
	header div.logo-container {margin-left:5px !important;}
	header section.slice_Header_L div.nav-menu ul.root_menu a {font-size:19px; padding-left:12px; padding-right:12px;}
	header section.slice_Header_L div.nav-menu ul.root_menu li:first-child {position:relative; top:-2px;}
}

/* ############ slide show caption button, and active/hover round pager button colour */
section[class*="Slides"] a.slideButton, 
section[class*="Slides"] a.bx-pager-link:hover, 
section[class*="Slides"] a.bx-pager-link.active
{	
	background-color: #8f859f !important; /* <<< slide show button background color */
	border-color: 	  #8f859f !important; /* <<< slide show button border color */
} 
/* Slide show inactive round pager buttons */
section[class*="Slides"] a.bx-pager-link
{	
	background-color: white !important; /* <<< slide show inactive round button color */
	border-color: 	  #8f859f !important; /* <<< slide show inactive round button border color */
}

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

/* Code to make slide-shows look better on mobile screens */
section.slice_SlidesFullWidth {overflow:hidden;} /* hide anything that pokes outside */
@media (max-width:767px) {
	section.slice_SlidesFullWidth div.bannerSlides {
		width: 133.333%; /* double the width, which doubles the height, and then translate so we see the middle 50% */
		transform: translateX(-12.5%);
		overflow: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: 12.5%;
		right: 12.5%;
		width: 66.666%;
		overflow:hidden; /* hide anything that pokes outside */
	}
}

section.slice_ArticleList_2_L,
section.slice_ArticleList_2_L div.article_cards > div,
section.slice_ArticleList_2_L div.article_cards > div div.articleListTitle,
section.slice_ArticleList_2_L div.article_cards > div div.articleListSummary {background-color:#f0f0f0 !important;}
section.slice_ArticleList_2_L div.articleListImage img {margin-bottom:10px !important;}
section.slice_ArticleList_2_L div.article_cards > div div.articleListSummary {padding:10px 30px;}
@media (max-width:992px) {
	section.slice_ArticleList_3_L div.articleListTitle a,
	section.slice_ArticleList_2_L div.articleListTitle a {font-size:32px; line-height:1;}
	section.slice_ArticleList_3_L div.article_cards > div div.articleListSummary,
	section.slice_ArticleList_2_L div.article_cards > div div.articleListSummary {font-size:18px; line-height:1.3;}
	section.slice_ArticleList_2_L div.article_cards > div div.articleListSummary {padding:10px;}
	section.slice_ArticleList_2_L div.articleListImage img {margin-bottom:0 !important;}
}

section.slice_image_blocks_4 div.image_block_title {font-family:Lola; font-size:36px !important; line-height:1; font-weight:700;}
section.slice_image_blocks_4 div.image_block_text {color:white; font-size:24px; line-height:1.5; text-align:center; margin:0 5px;max-width:70%;}
section.slice_image_blocks_4 .gallery_ul .gallery_li:first-child {width:61.23982467125860989355040701315%; border-right:2px solid white; border-bottom:1px solid white;}
section.slice_image_blocks_4 .gallery_ul .gallery_li:nth-child(2) {width:38.76017532874139010644959298685%; border-left:1px solid white; border-bottom:1px solid white;}
section.slice_image_blocks_4 .gallery_ul .gallery_li:nth-child(3) {clear:both;width:38.634940513462742642454602379461%; border-right:1px solid white; border-top:2px solid white;}
section.slice_image_blocks_4 .gallery_ul .gallery_li:last-child {width:61.365059486537257357545397620539%; border-left:2px solid white;border-top:2px solid white;}
@media (max-width:992px) {
	section.slice_image_blocks_4 div.image_block_title {font-size:30px !important;}
	section.slice_image_blocks_4 div.image_block_text {font-size:22px; line-height:1.3; max-width:100%;}
}
@media (max-width:768px) {
	section.slice_image_blocks_4 .gallery_ul .gallery_li {float:none; width:100% !important; border:none !important; border-top:2px solid white !important;}
}
@media (max-width:467px) {
	section.slice_image_blocks_4 div.image_block_title {margin:0 5px !important; font-size:28px !important;}
	section.slice_image_blocks_4 div.image_block_text {font-size:20px; line-height:1.2;}
}

section.slice_Partners {
	background-color:white;
	padding:50px 40px 20px;
	text-align: center;
}
section.slice_Partners h1 {font-family:Lola; font-size:32px; line-height:1; font-weight:700; color:#5b5377; margin:0 0 20px;}
section.slice_Partners div.LogoWrapper {max-width:1400px; margin:0 auto;}
section.slice_Partners div.LogoWrapper ul {
  	list-style-type:none;
  	padding:0;
	margin:0;
	display:flex; 
	flex-flow: row wrap; 
	justify-content:space-around; 
	align-items:center;
}
section.slice_Partners div.LogoWrapper img {margin:20px;}

footer section.slice_FooterTop_D {padding:40px 10px;}
footer section.slice_FooterTop_D div.container {
	display:flex; flex-flow:row nowrap; justify-content:space-between; align-items:flex-start;
}
footer section.slice_FooterTop_D div.FlexPair {flex:1 1 auto;}
footer section.slice_FooterTop_D div.FlexPair {
	display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start;
}
footer section.slice_FooterTop_D div.FlexPair:last-child {justify-content:flex-end;}
footer section.slice_FooterTop_D div.FooterForm {margin-left:40px;}
footer section.slice_FooterTop_D a.MadeInMarylebone,
footer section.slice_FooterTop_D a.ChurchArmy {margin-left:5px;}

footer section.slice_FooterTop_D div.AboutLinks a {display:block; margin:10px 0; font-size:16px; font-weight:700; color:#e27a73; text-align:left;}
footer section.slice_FooterTop_D div.AboutLinks a:hover {color:#ed8982;}
footer section.slice_FooterTop_D div.FooterForm {text-align:left;}
footer section.slice_FooterTop_D div.FooterFormTopText {color:#eae7e8; font-size:24px; font-weight:700; text-align:left; margin-bottom:15px;}
footer section.slice_FooterTop_D div.FooterForm div.ArticleBody input[type=text],
footer section.slice_FooterTop_D div.FooterForm div.ArticleBody input[type=button] {padding:10px; background-color:#5f5176; color:white; font-size:15px; margin:0 0 7px; border:none; border-radius:0;}
footer section.slice_FooterTop_D div.FooterForm div.ArticleBody input[type=text] {width:350px;}
footer section.slice_FooterTop_D div.FooterForm div.ArticleBody input::placeholder {color:white; opacity:1;}
footer section.slice_FooterTop_D div.FooterForm div.ArticleBody input[type=button] {background-color:#e27a73; padding:10px 20px; border:none; border-radius:2px; margin:10px 0 0;}
footer section.slice_FooterTop_D div.FooterForm div.ArticleBody input[type=button]:hover {background-color:#ed8982; opacity:1;}
footer section.slice_FooterTop_D a.MadeInMarylebone,
footer section.slice_FooterTop_D a.ChurchArmy {
	display:flex; flex-flow:column nowrap; justify-content:flex-start; align-items:center;
	background-color:#8f81a6; color:white;
	line-height:1.3;
	padding:10px;
}
footer section.slice_FooterTop_D a.MadeInMarylebone:hover,
footer section.slice_FooterTop_D a.ChurchArmy:hover {
	background-color:#6d5d87;
}
footer section.slice_FooterTop_D img {display:block; margin-bottom:10px;}
footer section.slice_FooterTop_D a.MadeInMarylebone img {height:75px;}
@media (max-width:1130px) {
	footer section.slice_FooterTop_D div.container {display:flex; flex-flow:column nowrap; justify-content:center; align-items:center;}
	footer section.slice_FooterTop_D a.MadeInMarylebone:first-child {margin-left:0;}
	footer section.slice_FooterTop_D a.MadeInMarylebone,
	footer section.slice_FooterTop_D a.ChurchArmy {margin-top:30px;}
	footer section.slice_FooterTop_D div.FooterForm div.ArticleBody input[type=text] {width:300px;}	
}
@media (max-width:560px) {
	footer section.slice_FooterTop_D div.FlexPair {display:flex; flex-flow:column nowrap; justify-content:center; align-items:center;}
	footer section.slice_FooterTop_D div.FooterForm {margin-top:20px;}
	footer section.slice_FooterTop_D div.FooterForm,
  	footer section.slice_FooterTop_D a.MadeInMarylebone,
	footer section.slice_FooterTop_D a.ChurchArmy {margin-left:0;}	
  	footer section.slice_FooterTop_D a.MadeInMarylebone:nth-child(2),
	footer section.slice_FooterTop_D a.ChurchArmy {margin-top:10px;}
  	footer section.slice_FooterTop_D a.MadeInMarylebone,
	footer section.slice_FooterTop_D a.ChurchArmy {min-width:170px;}
}
div.endis-jquery-ui div#divOverlay {font-size:17px;}

/* Banner Image code */
section.slice_BannerImage {
	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 {
	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_content_page div.main-content {border-radius:4px;}
section.slice_content_page div.ArticleBody a:hover {text-decoration:none; color:#5b5377;}

section.slice_content_page div.ArticleBody ul {
    list-style: none; /* Remove list bullets */
    padding: 0;
    margin: 0;
}

section.slice_content_page div.ArticleBody li { 
    padding-left: 15px; 
}

section.slice_content_page div.ArticleBody li:before {
    content: "•"; /* Insert content that looks like bullets */
    padding-right: 0;
    color: #e27a23; /* Or a color you prefer */
}

footer section.slice_FooterTop_D input.form-control:focus,
section.slice_content_page div.ArticleBody input[type=text]:focus,
section.slice_content_page div.ArticleBody textarea:focus {
	outline: none;
	box-shadow: 0 0 2px 0 #ed8982 !important;
}

/* Extra Endis code */
a {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
}
a:focus {outline:none;}

section.slice_content_page aside nav div.group-nav a {font-size:18px !important;}
@media (max-width:767px) {
	section.slice_content_page aside nav div.group-nav a {text-align:center;}
}