/* Style Over-Ride file for Creation template. */

/* Size of LOGO image */
header .logo-icon img { 
	width:  auto !important; 
	height: 60px !important; /* <<< mobile logo height */
}
@media(min-width:467px){header .logo-icon img
{ 
	height: 80px !important; /* <<< tablet logo height */
}}
@media(min-width:992px){header .logo-icon img
{ 
	height: 100px !important; /* <<< desktop logo height */
}}
/* Gap between logo and top/bottom of screen  */
header div.logo-container 
{
	margin-top: 10px !important; /* <<< gap from top for mobile/tablet */
	margin-bottom: 10px !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 */
}}
/* To make more space in the header adjust this */
header section.slice_Header_L div.nav-menu {margin-top:20px;}

/* 3 Big Button colours */
.slice_WhatsOn3Buttons_L a.button1,
.slice_content_page .sidebar_buttons a.button1
{
    background-color: #f5844e !important; /* <<< Green/left/top big button */
}
.slice_WhatsOn3Buttons_L a.button2,
.slice_content_page .sidebar_buttons a.button2
{
    background-color: #bcaa94 !important; /* <<< Red/middle big button */
}
.slice_WhatsOn3Buttons_L a.button3,
.slice_content_page .sidebar_buttons a.button3
{
    background-color: #f4af47 !important; /* <<< Blue/right/bottom big button */
}

/* slide show button and round pager button colour */
.slice_SlidesFullWidth a.slideButton, .slice_SlidesFullWidth .bx-pager a:hover, .slice_SlidesFullWidth .bx-pager a.active,
.slice_WhatsOnSlidesEB_L a.slideButton, .slice_WhatsOnSlidesEB_L .bx-pager a:hover, .slice_WhatsOnSlidesEB_L .bx-pager a.active
{
    background-color: #f5844e  !important; /* <<< slide show button background color */
    border-color: #f5844e  !important; /* <<< slide show button border color */
}

.slice_SlidesFullWidth a.slideButton
{
    background-color: transparent !important; /* <<< slide show button background color */
    border-color: #fff !important; /* <<< slide show button border color */
}

.slice_SlidesFullWidth a.slideButton:hover
{
    background-color: #fff !important; /* <<< slide show button background color */
    border-color: #fff !important; /* <<< slide show button border color */
    color: #f5844e;
}

/* Time and Location logos */
.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: #bcaa94 !important; /* <<< Clock and Location icon colour */
}

/* Search box */
.slice_Header_L .search-overlay
{
    background-color: #bcaa94 !important; /* <<< Search box back-ground colour */
}

/* 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;
	}
}

/* Fix various issues */
div.endis-jquery-ui div#divOverlay {font-size:17px;line-height:1.3;}
body.OnSmallAppleDevice input {-webkit-appearance: none;}
body.ArticleEditor img.module_icon {width:auto !important;}
section.slice_Footer_L div.footerbar span:last-child:not([id]),
section.slice_Footer_D div.footerbar span:last-child:not([id]) { display: block; padding-top: 25px; }

/* prevent text-overwriting when desktop menus wrap around */
section.slice_Header_D ul.root_menu ul,
section.slice_Header_L ul.root_menu ul,
section.slice_Header_T ul.root_menu ul {z-index:4;}

section.slice_Footer_D div.footerbar a#footer_cookies::after,
section.slice_Footer_L div.footerbar a#footer_cookies::after { content: "|"; padding: 0 5px; }
@media (min-width: 768px) {
	section.slice_Footer_D div.footerbar a#footer_cookies::after,
	section.slice_Footer_L div.footerbar a#footer_cookies::after { padding: 0 10px; }
}

/* CSS to allow a normal web-office image to be used as a css background. */
section.slice_Children::before { 
  content: " "; 
  position: fixed; top: 0; left: 0; width: 100%; height: 100vh; 
  background-size: cover; 
  background-repeat: no-repeat; z-index: -1; 
  will-change: transform; 
}
section.slice_Children {
  	background-image:none;
}
section.slice_Children div.ArticleBody {line-height:1.5;}
section.slice_Children div.ArticleBody span {display:block;}
section.slice_Children div.ArticleBody p,
section.slice_Children div.ArticleBody div.title1
{margin:0;}
section.slice_WhatsOn3Buttons_L {background-color:white;}

.HideElement {display:none !important;}

/* Slide-show bottom buttons */ 
section.Xslice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager {bottom:30px;}
section.Xslice_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.Xslice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager {bottom:10px;}
	section.Xslice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager a.bx-pager-link {width:14px;height:14px;border-radius:7px;}
}
section.slice_SlidesFullWidth {background-color:#f4af47;}
section.slice_SlidesFullWidth div.bannerSlides {margin-bottom:25px;}
section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager {bottom:-19px;}
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;
}

/* 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;}

/* CSS to allow a normal web-office image to be used as a css background. */
section.slice_Children::before { 
  background-image: url(../../../939643.jpg);  
  background-position:14% center;
}