/*
   Style Over-Ride file. Put/edit CSS styles in here that are specific to a customer.
   Version 1-Feb-2017.

   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.

   All the styles already in here are OK to change. */



/* ############ Size of header logo icon/image */
header .logo-icon img
{
    width:  320px !important; /* <<< mobile logo width */
    height: auto !important;
}
@media(min-width:467px){header .logo-icon img
{
    width:  350px !important; /* <<< tablet logo width */
    height: auto !important;
}}
@media(min-width:992px){header .logo-icon img
{
    width:  320px !important; /* <<< desktop logo width */
    height: auto !important;
}}

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



/* ############ Menu hover-over text-link color, header top-link icons colour,
   footer email link text color */

header section.slice_Header_L .top-link i::before
{
    color: #fff !important; /* <<< header icon color */
}

/* ############ Desktop/Mobile menu hover-over text-link color, top-link icons colour, footer email-link text color */
header .nav-menubar li > a,
header .nav-menubar li > a > a
{
	color: white !important; /* <<< header/footer icon/text-link color */
    background-color: #95c859 !important;
}
header .nav-menubar li:hover > a,
header .nav-menubar li:hover > a > a
{
	color: white !important; /* <<< header/footer icon/text-link color */
    background-color: #60addd !important;
}

header div.top-link-wrapper {background-color: #60addd !important}
header div.top-link-wrapper a {color: white !important}
header .slice_Header_L .nav-menubar {background-color: #95c859 !important}

header ul.root_menu {height: 52px !important}

footer .footer-column-3 a
{
	color: #db763a !important;
}

/* ############ Search box background colour */
header div.search-overlay
{
    background-color: #95c859 !important; /* <<< Search box background colour */
}



/* ############ 3 Big Button colours */
section[class^="slice_WhatsOn3Buttons"] a.button1,
section.slice_content_page aside a.button1
{
    background-color: #95c859 !important; /* <<< Green/left/top big button */
}
section[class^="slice_WhatsOn3Buttons"] a.button2,
section.slice_content_page aside a.button2
{
    background-color: #60addd !important; /* <<< Red/middle big button */
}
section[class^="slice_WhatsOn3Buttons"] a.button3,
section.slice_content_page aside a.button3
{
    background-color: #db763a !important; /* <<< Blue/right/bottom big button */
}



/* ############ 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: #95c859 !important; /* <<< slide show button background color */
    border-color: 	  #95c859 !important; /* <<< slide show button border color */
}
/* Slide show inactive round pager buttons */
section[class*="Slides"] a.bx-pager-link
{
    background-color: #d7d7d7 !important; /* <<< slide show inactive round button color */
    border-color: 	  #d7d7d7 !important; /* <<< slide show inactive round button border color */
}



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



/* ############ Quick branding of slice header-text.
   (All styles are outside of article content.) */
section.slice_Header_L .logo-name a
{
    color: #95c859 !important; /* <<< a *dark* text colour, suitable for a *white* background */
}

section[class$="_L"] > h1,
section[class$="_L"] > div.container > h1
{
    color: #323232 !important; /* <<< a *dark* text colour, suitable for a *white* background */
}



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

/* ############ Button colors of:
   "Welcome Slice" in the free Option 1 & 2 templates, 
   "Church for the community" button on the trial site,
   "piano" button on the trial site */ 
section.slice_CommunityText_L a.button
{ 
	color: white !important; /* <<< text color */
	border-color: #95c859 !important; /* <<< border colour here */
  	background-color: #95c859 !important;
} 
section.slice_CommunityText_L a.button:hover
{ 
	color: #95c859 !important; /* <<< text color */
	background-color: white !important; /* <<< background colour here */
}

.slice_Gallery8_L .gallery_8_cards .gallery_ul .gallery_li a:hover 
{border-color: #95c859 !important;}

.slice_ServiceText_L {
  display: none;
}

.welcome2 {
  background: #f2f1f6;
}