/* Style Over-Ride file for Trinity template. */

/* Size of LOGO image */
header .logo-icon img
{ 
	width:  auto !important; 
	height: 45px !important; /* <<< mobile logo height */
}
@media(min-width:467px){header .logo-icon img
{ 
	height: 57px !important; /* <<< tablet logo height */
}
}
@media(min-width:992px){header .logo-icon img
{ 
	height: 57px !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: 5px !important; /* <<< gap from top for desktop */
	margin-bottom: 0 !important; /* <<< gap from bottom for desktop */
}}
@media(min-width:1400px){header div.logo-container 
{
	margin-top: 20px !important; /* <<< gap from top for wide desktop */
	margin-bottom: 0 !important; /* <<< gap from bottom for wide desktop */
}}
/* To make more space in the header adjust this */
header section.slice_Header_L div.nav-menu {margin-top:50px;}



/* extra fixes for the header */
header ul a {
	line-height: 1 !important;
}
header section.slice_Header_L div.slicknav_menu ul.slicknav_nav a {padding: 10px 20px;}
header .slice_Header_L .nav-menu ul.root_menu > li:last-child > a {padding-right:5px;}


/* ############ Mobile menu colours */
header section.slice_Header_L a.slicknav_btn
{
	background-color: #f3f3f3 !important; /* <<< colour of the menu bar */
}
header section.slice_Header_L .slicknav_icon-bar
{
	background-color: #ea652e !important; /* <<< colour of the menu icon */
}
header section.slice_Header_L div.SlickNavCloseIcon
{
	color: #ea652e !important; /* <<< colour of the menu close icon */
}

/* ############ Search box background colour */
header div.search-overlay
{
	background-color: #ea652e !important; /* <<< Search box background colour */
}
header a.search-close 
{
	color: white !important;  /* <<< Search box close icon */
}

/* ############ slide show caption button, and active/hover round pager button colour */ 
section[class*="Slides"] a.bx-pager-link:hover, 
section[class*="Slides"] a.bx-pager-link.active
{	
	background-color: #737473 !important; /* <<< slide show button background color */
	border-color: 	  #737473 !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: 	  white !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: #301c10 !important; /* <<< Group-Nav top bar background colour */
	text-transform:uppercase;
}

/* Rows of 3 buttons */
section.Slice_Buttons3 {background-color: #f3f3f3; padding:40px 10px 0;}
section.Slice_Buttons3 div.WrapperButtons3 {display:flex; flex-flow:row wrap; align-items:center; justify-content:center; margin:0 auto;}
section.Slice_Buttons3 div.WrapperButtons3 a,
section.Slice_Buttons3 div.WrapperButtons3 div {
	display:block; 
	font-size:24px;
	line-height:1.5;
	white-space:nowrap;
}
section.Slice_Buttons3 div.WrapperButtons3 a {color:#301c10;}
section.Slice_Buttons3 div.WrapperButtons3 a:hover {color:#ea652e;opacity:1;}
section.Slice_Buttons3 div.WrapperButtons3 div {color:#737473;padding:0 20px;}
@media (max-width:467px) {
	section.Slice_Buttons3 div.WrapperButtons3 {flex-flow:column nowrap;}
	section.Slice_Buttons3 div.WrapperButtons3 a {line-height:2;}
	section.Slice_Buttons3 div.WrapperButtons3 div {display:none;}	
}

/* slice Testimony */
section.slice_Testimony {
	background-image:url(/Images/Content/2703/933996.jpg);
  	background-size:cover;
  	background-position:bottom center;
	color:white;
	text-align:center;
	font-style:italic; 
	font-weight:400;
	line-height:1.71;
	padding: 0 20px 60px;
}
  @media (min-width:768px) {
	  section.slice_Testimony {
		padding-top: 0;
		padding-bottom: 70px;
  }}
  @media (min-width:1300px) {
	  section.slice_Testimony {
		padding-top: 0;
		padding-bottom: 80px;
  }}
section.slice_Testimony div.title2 {max-width:900px; margin:0 auto; font-size:28px;}
section.slice_Testimony div.title3 {color:#ea652e;font-size:22px;margin-top:5px;}
section.slice_Testimony img {display:block;margin:0 auto;border:3px solid white;border-radius:80px;position:relative;top:-25px;}
@media (max-width:767px) {
	section.slice_Testimony div.title2 {font-size:22px;}
	section.slice_Testimony div.title3 {font-size:20px;}	
}

/* slice Welcome */
section.slice_Welcome {
	background-color:white;
	color:#301c10;
	text-align:center;
	font-weight:400;
	line-height:1.36;
	padding: 30px 10px 0;
}
  @media (min-width:768px) {
	  section.slice_Welcome {
		padding-top: 35px;
  }}
  @media (min-width:1300px) {
	  section.slice_Welcome {
		padding-top: 40px;
  }}
section.slice_Welcome div.title3 {margin:20px 1.28866% 0;background-color:#f3f3f3;padding:20px 40px;font-size:22px;}
@media (max-width:767px) {
	section.slice_Welcome div.title3 {font-size:20px;padding:10px;}	
}

/*
################## 
# Start of Slice #
################## 
*/
.slice_WelcomeArticles { background-color: white; text-align: center; padding: 25px 10px; }
.slice_WelcomeArticles .article_cards { clear: both; }
.slice_WelcomeArticles .article_cards > div { width: 97.42268%; float: left; margin-left: 1.28866%; margin-right: 1.28866%; }
@media (min-width: 467px) { .slice_WelcomeArticles .article_cards > div { width: 47.42268%; float: left; margin-left: 1.28866%; margin-right: 1.28866%; } }
@media (min-width: 768px) { .slice_WelcomeArticles .article_cards > div { width: 30.75601%; float: left; margin-left: 1.28866%; margin-right: 1.28866%; } }
@media (min-width: 768px) { .slice_WelcomeArticles { padding: 25px 0; } }
@media (min-width: 992px) { .slice_WelcomeArticles { padding: 25px 0; } }
.slice_WelcomeArticles .article_cards { text-align: center; display: flex; flex-flow: row wrap; justify-content: center; }
.slice_WelcomeArticles .article_cards > div { background-color: #fff; margin-bottom: 30px; display: flex; flex-direction: column; }
.slice_WelcomeArticles .article_cards > div .articleListImage a { display: block; margin: 0 auto; }
.slice_WelcomeArticles .article_cards > div .articleListImage a:hover { opacity: 0.7; }
.slice_WelcomeArticles .article_cards > div .articleListImage a img { display: block; width: 100%; }
.slice_WelcomeArticles .article_cards > div .articleListTitle { background-color: #fff; text-transform: uppercase; padding: 15px 10px 5px; font-size: 20px; line-height: 24px;}
.slice_WelcomeArticles .article_cards > div .articleListTitle a { color: #301c10; font-weight: 800; }
.slice_WelcomeArticles .article_cards > div .articleListTitle a:hover { opacity: 0.7; }
.slice_WelcomeArticles .article_cards > div .articleListSummary { background-color: #fff; color: #301c10; padding: 10px 20px; font-size: 17px; line-height: 1.333; font-weight: 400;}
@media (min-width: 992px) { .slice_WelcomeArticles .article_cards > div .articleListSummary { font-size: 18px; } }
.slice_WelcomeArticles .article_cards > div .articleListLink a { 
	display: inline-block; font-size: 18px; line-height: 1.333; font-weight: 400; color: #301c10; background-color: #fff;
	text-decoration:underline;
}
.slice_WelcomeArticles .article_cards > div .articleListLink a:hover { color:#ea652e;}

/* Banner Image code */
section.slice_BannerImage {
  position:relative;
	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 {
  position:relative; z-index:0;
	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_BannerImage div.container {text-align:center;}
section.slice_BannerImage 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;}

/* Content page spacing */
section.slice_content_page div.main-content {padding-top:0;}
@media(max-width:992px){
	section.slice_content_page div.main-content {padding-top:20px;}
}

section.slice_content_page aside div.ContentPageImage {text-align:center;line-height:1;font-size:1px;}
section.slice_content_page aside div.ContentPageImage a {
  display:block; margin:10px auto 0;line-height:1;font-size:1px;}
section.slice_content_page aside div.ContentPageImage img {
  width:100%; max-width:263px; display:block;
}
@media (max-width:768px) {
  section.slice_content_page aside div.ContentPageImage a {display:inline-block;}
}
section.slice_content_page aside div.ContentPageImage:last-child {margin-bottom:10px;}
/* above 1200px make the image exactly 263px so it appears crisp */
@media (min-width:1200px) {
  section.slice_content_page aside div.ContentPageImage img {width:263px;}
}

/* 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: 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.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: 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;}

/* Slide-show bottom buttons */ 
section.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager {bottom:30px;}
section.slice_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.slice_SlidesFullWidth div.bannerSlides div.bx-wrapper div.bx-pager {bottom:10px;}
	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;}

/* 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:8px;}

section.slice_image_blocks_4 .image_blocks .gallery_ul li.gallery_li:nth-child(2) a:hover::before { background-color: #0072b5;}
section.slice_image_blocks_4 .image_blocks .gallery_ul li.gallery_li:nth-child(1) a:hover::before { background-color: #301c10;}
section.slice_image_blocks_4 .image_blocks .gallery_ul li.gallery_li:nth-child(3) a:hover::before { background-color: #F9B329;}
section.slice_image_blocks_4 .image_blocks .gallery_ul li.gallery_li:nth-child(4) a:hover::before { background-color: #ADC42C;}