/* 
   Style Over-Ride file for Leamington Spa. 
   WARNING - Do not edit this file unless you know exactly what you are doing. And make a back-up first. */

/* ############ Size of site logo image */
/* (For reference the entire desktop header is 128px high, unless there is a massive logo present) */
header .logo-icon img
{ 
	width:  auto !important; /* <<< mobile logo width */
	height: 108px !important; 
}
@media(min-width:467px){header .logo-icon img
{ 
	height: 108px !important; 
}
}
@media(min-width:992px){header .logo-icon img
{ 
	height: 108px !important; 
}
}
/* Gap between logo and top/bottom of screen  */
header div.logo-container 
{
	display: none !important;
	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 
{
	display: block !important;
	margin-top: 10px !important; /* <<< gap from top for desktop */
	margin-bottom: 0 !important; /* <<< gap from bottom for desktop */
}}

header span.logo-name {display:none;}

/* ############ Mobile menu colours */
header section.slice_Header_T a.slicknav_btn
{
	background-color: rgba(0,0,0,0.15) !important; /* <<< colour of the menu bar */
}
header section.slice_Header_T a.slicknav_btn.slicknav_open
{
	background-color: #959595 !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 */
}

/* ############ Search box background colour */
header div.search-overlay
{
	background-color: #959595 !important; /* <<< Search box background colour */
}
header a.search-close 
{
	color: white !important;  /* <<< Search box close icon */
}
@media (max-width:1200px) {
  header section.slice_Header_T div.nav-menu ul.root_menu a.menu_link {
    letter-spacing:normal;
    padding-left:10px;
    padding-right:10px;
  }
}

/* Social media links */
header div.SocialMediaLinks,
header ul.root_menu img.IconTwitterHover,
header ul.root_menu img.IconFacebookHover,
header ul.root_menu img.IconInstagramHover,
header ul.root_menu a.TwitterLink:hover img.IconTwitter,
header ul.root_menu a.FacebookLink:hover img.IconFacebook,
header ul.root_menu a.InstagramLink:hover img.IconInstagram
{display:none;}

header ul.root_menu a.TwitterLink,
header ul.root_menu a.FacebookLink,
header ul.root_menu a.InstagramLink {display:inline-block; width:31px;}
header ul.root_menu a.TwitterLink img,
header ul.root_menu a.FacebookLink img,
header ul.root_menu a.InstagramLink img {margin:0 auto;}

header ul.root_menu img.IconTwitter,
header ul.root_menu img.IconFacebook,
header ul.root_menu img.IconInstagram,
header ul.root_menu a.TwitterLink:hover img.IconTwitterHover,
header ul.root_menu a.FacebookLink:hover img.IconFacebookHover,
header ul.root_menu a.InstagramLink:hover img.IconInstagramHover
{display:block;}

header ul.root_menu span.SocialMediaLinks {position: relative;}
header ul.root_menu img.IconTwitterHover {position: absolute; top:14px;}
header ul.root_menu img.IconFacebookHover {position: absolute; top:12px;}
header ul.root_menu img.IconInstagramHover {position: absolute; top:12px;}
header ul.root_menu img.IconInstagram {position: relative; top:1px;}

header ul.slicknav_nav img.IconTwitter,
header ul.slicknav_nav img.IconFacebook,
header ul.slicknav_nav img.IconInstagram
{display:none;}
header ul.slicknav_nav img.IconTwitterHover,
header ul.slicknav_nav img.IconFacebookHover,
header ul.slicknav_nav img.IconInstagramHover
{display:block;}
header ul.slicknav_nav a.TwitterLink,
header ul.slicknav_nav a.FacebookLink,
header ul.slicknav_nav a.InstagramLink
{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;}

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: 5px 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:20%;text-align:right;}
	section.slice_SlideBar div.SlideBarButton.Slide1 a {padding-right:10px;}
	section.slice_SlideBar div.SlideBarButton.Slide3 {width:20%;}
	section.slice_SlideBar div.SlideBarButton.Slide4 {width:20%;}
	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 */
section.slice_Header_T {transition:background-color 500ms linear;}
section.slice_Header_T.HeaderTintOn {background-color: rgba(20,20,20,0.8) !important;}

/* allow a wider content page */
section.slice_content_page div.container {max-width: 4096px;}
section.slice_content_page div.main-content,
section.slice_CommunityText_L {font-weight:400;}
section.slice_content_page div.main-content ul {padding-left:20px;}

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

section.slice_LatestArticles {padding:0 10px 60px; text-align:center;}
section.slice_LatestArticles h3 {padding-bottom:10px;}
section.slice_LatestArticles > div {margin:0 auto; text-align:center;}
section.slice_LatestArticles a:hover {text-decoration:underline;}

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: 200% !important; /* double the width, which doubles the height, and then translate so we see the middle 50% */
		transform: translateX(-25%);
	}
  	header#anchorVideo section.slice_VideoWrapper div.ArticleBody > div {overflow:hidden;} /* hide anything that pokes outside */
}

/* Make the Landing page banner smaller on 1366x768 screens */
section.LargeBlockImage1LandingPage div.title1,
section.LargeBlockImage1LandingPage div.title3 {padding-bottom:0;}
@media (min-width: 992px) {
  section.LargeBlockImage1LandingPage {padding-top:150px; padding-bottom:100px;}
}
section.LargeBlockImage1SystemPage {
  background-image:url(/Images/Content/1755/Templates/48793/images/Background1.jpg);
  background-position:center bottom;
}

header section.slice_Header_T a.top-link,
header section.slice_Header_T a.menu_link
{font-family:Roboto; font-weight:500 !important;}

/* section.slice_SlideBar div.SlideBarButton {pointer-events: none;} */