@charset "UTF-8";
@import "taskIcons.css";
/* Tue, 08 Dec 2020 11:18:25 +0000 */
/* CSS Document for winchester - contains resets */

/* links */
a
{
  color: #065D92;
  text-decoration-line: none;
  text-decoration-style: solid;
}
a:hover, a:active
{
  color: #043E62;
  text-decoration-line: underline;
  text-decoration-style: solid;
}
a:focus,
a.promo:focus p span,
.promo:focus .promoText .abstract, .promo:focus .promoText .published { color:#000 !important}
.headline
{
  color: #065D92 !important;
  text-decoration-line: none;
  text-decoration-style: solid;
}
a:hover .headline,
.formMap ul a:hover
{
  color: #043E62 !important;
  text-decoration-line: underline;
  text-decoration-style: solid;
}
a:focus .headline { color:#000 !important }


/* typography */
body {		
	font-family: "myriad-pro",sans-serif !important;
	font-weight:400;
	font-style: normal;
	background: #ffffff;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 {		
	font-family: "myriad-pro",sans-serif !important;
	font-style: normal;
}
.promo .promoText p .headline { font-weight:600; }
.promo .promoText .published { color: #444444; font-size: 1.125rem}

/* change base font size for the design - default 16px upped to 18px - this is moved into the medium media query to avoid class with mobile  */
.container { font-size:100%;  }  
.article .content,
.article .content strong {color:#222222}
/* if default is 18px */
html body.font-size2 .container {
  font-size: 150% !important;
}

body.font-size2 .container .button,
body.font-size2 .container h1,
body.font-size2 .container .h1,
body.font-size2 .container h2,
body.font-size2 .container .h2,
body.font-size2 .container h3,
body.font-size2 .container .h3,
body.font-size2 .container h4,
body.font-size2 .container .h4,
body.font-size2 .container h5,
body.font-size2 .container .h5,
body.font-size2 .container h6,
body.font-size2 .container .h6,
body.font-size2 .container small,
body.font-size2 .desktopTogglePanel,
body.font-size2 .desktopTogglePanel .button { font-size:150% !important; }

.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6,
.content .h1,
.content .h2,
.content .h3,
.content .h4,
.content .h5,
.content .h6 { color:#222; line-height:normal }
/* first heading */
.main .content h1:first-of-type { font-weight: 500; padding-bottom: 1.5rem;  }




/* reset main link colours */
a { color: #065D92; }
a:hover, a:focus { color: #043E62; }

/* focussed form elements rest from the default  */
/*input:not([type]):focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
input[type="color"]:focus,
textarea:focus,
input.sync_sent_highlighted,
select:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus,






#formsMaster input:not([type]):focus,
#formsMaster input[type="text"]:focus,
#formsMaster input[type="password"]:focus,
#formsMaster input[type="date"]:focus,
#formsMaster input[type="datetime"]:focus,
#formsMaster input[type="datetime-local"]:focus,
#formsMaster input[type="month"]:focus,
#formsMaster input[type="week"]:focus,
#formsMaster input[type="email"]:focus,
#formsMaster input[type="number"]:focus,
#formsMaster input[type="search"]:focus,
#formsMaster input[type="tel"]:focus,
#formsMaster input[type="time"]:focus,
#formsMaster input[type="url"]:focus,
#formsMaster input[type="color"]:focus,
#formsMaster textarea:focus,
#formsMaster input.sync_sent_highlighted,
#formsMaster select:focus,
#formsMaster input[type="radio"]:focus,
#formsMaster input[type="checkbox"]:focus {
    outline-color: #AFB735
}*/

body.contrastView input:not([type]):focus,
body.contrastView input[type="text"]:focus,
body.contrastView input[type="password"]:focus,
body.contrastView input[type="date"]:focus,
body.contrastView input[type="datetime"]:focus,
body.contrastView input[type="datetime-local"]:focus,
body.contrastView input[type="month"]:focus,
body.contrastView input[type="week"]:focus,
body.contrastView input[type="email"]:focus,
body.contrastView input[type="number"]:focus,
body.contrastView input[type="search"]:focus,
body.contrastView input[type="tel"]:focus,
body.contrastView input[type="time"]:focus,
body.contrastView input[type="url"]:focus,
body.contrastView input[type="color"]:focus,
body.contrastView textarea:focus,
body.contrastView input.sync_sent_highlighted,
body.contrastView select:focus,
body.contrastView input[type="radio"]:focus,
body.contrastView  input[type="checkbox"]:focus,

body.contrastView #formsMaster input:not([type]):focus,
body.contrastView #formsMaster input[type="text"]:focus,
body.contrastView #formsMaster input[type="password"]:focus,
body.contrastView #formsMaster input[type="date"]:focus,
body.contrastView #formsMaster input[type="datetime"]:focus,
body.contrastView #formsMaster input[type="datetime-local"]:focus,
body.contrastView #formsMaster input[type="month"]:focus,
body.contrastView #formsMaster input[type="week"]:focus,
body.contrastView #formsMaster input[type="email"]:focus,
body.contrastView #formsMaster input[type="number"]:focus,
body.contrastView #formsMaster input[type="search"]:focus,
body.contrastView #formsMaster input[type="tel"]:focus,
body.contrastView #formsMaster input[type="time"]:focus,
body.contrastView #formsMaster input[type="url"]:focus,
body.contrastView #formsMaster input[type="color"]:focus,
body.contrastView #formsMaster textarea:focus,
body.contrastView #formsMaster input.sync_sent_highlighted,
body.contrastView #formsMaster select:focus,
body.contrastView #formsMaster input[type="radio"]:focus,
body.contrastView #formsMaster input[type="checkbox"]:focus {
    outline-color: #0CCBCE
}

/*a:focus,
.bx-wrapper .bx-controls-auto .bx-start:focus,
.bx-wrapper .bx-controls-auto .bx-stop:focus,
.sidebar a:focus .value .valueTitle,
.displayOptions a:focus,
.contrast:focus,
.buttonSquare:focus,
input.button:focus,
.button:focus,
.FormButton:focus,
button:focus,
button:focus span.icon,
.headerLink.trigger.active:focus,
.button.hollow:focus,
.button.toggler.active:focus,
.featuredNewsCol figcaption a:focus,
body a.skip_content,
.skip_content:hover,
body .skip_content:active, body .skip_content:focus,
.newsFeature .item a:focus,
.callout .close-button:focus,
#formsMaster #fm_upload:focus,
#formsMaster .buttonGroup input:focus, 
#formsMaster .buttonGroup button:focus {
    outline-color: #AFB735;
    background-color: #AFB735!important;
	color:#000 !important
}
#news-pager a.active:focus:after {
	border-right-color: #AFB735 !important; 
}*/
a.liveHelp { 
	background-color:#ff9933; 
	position: fixed;
	z-index: 1004;
	height: 97px;
	width: 62px;
	top: auto;
	bottom:50px;
	right: -18px;
	display: block;
	border-top-left-radius: 5px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 5px; 
	-webkit-transition: all 0.5s;
    transition: all 0.5s;
}

a.liveHelp:hover { right:0px; }
a.liveHelp span.icon { 
	display:block; 
	width:33px; 
	height:33px; 
	background-image:url(../graphics/icon-lifeSaver.png); 
	background-size:contain; 
	position:absolute; 
	top:6px; 
	left:6px;
	display:none
}
a.liveHelp span.text { 
	background-image:url(../graphics/live-help.png); 
	background-repeat:no-repeat; 
	display:block; 
	width:15px; 
	height:68px; 
	position:absolute; 
	top:15px; 
	background-size:cover; 
	left:15px;
}

#whoson_chat_link { width: 100%; height: auto; }


body.contrastView a.liveHelp { background-color:#00ffff}
body.contrastView a.liveHelp span.icon {background-image:url(../graphics/icon-lifeSaver-contrast.png); }
body.contrastView a.liveHelp span.text { background-image:url(../graphics/live-help-contrast.png);  }

.liveHelpPopup .close-button { background-color:#3F0; width:44px; opacity:0}

/* cookie message */
#cookie-law {
	padding: 10px 0 15px 0;
	text-align: center !important;
	color: white !important;
	background-color: #333;
	border-top: 1px solid #ccc;
}
#cookie-law a { color:#FFF; }
#cookie-law button { 
	padding:10px 20px; 
	border:1px solid #fff;
	font-size: 1em; 
	color:#FFF; 
	font-weight:bold;
}
#cookie-law button span.tick { }
#cookie-law button:hover {
	background-color:#FFF;
	border:1px solid #000;
	color:#333 !important;
}
#cookie-law button:hover span.tick { }
/* no script tag  */
.noScript {
    background-color: #000;
    
	background-image:url(../graphics/winchester-city-council-logo-invert-white.png); 
	
    background-repeat: no-repeat;
    background-position: center 20px;
    background-size: 200px;
    padding: 86px 15px 15px;
    color: #FFF!important;
    text-shadow: -1px -1px 0 rgba(0, 0, 0, .5);
    text-align: center;
    -webkit-box-shadow: 0 10px 22px 7px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0 10px 22px 7px rgba(0, 0, 0, 0.75);
    box-shadow: 0 10px 22px 7px rgba(0, 0, 0, 0.75);
    position: relative;
    z-index: 1000
}


.lt-ie9 .noScript,
.ie9 .noScript {
    background-image: none;
    padding-top: 20px
}

.noScript .h1 {
    color: #FFF;
    margin-top: 10px
}

.noScript a {
    text-decoration: underline;
    color: #FF0
}

.noScript a:hover {
    text-decoration: none
}


.serviceMessages { background-color:#F3F3F3}

/* theme */
.theme {}

/*additional top row for url and display options link */
.toolRow { background-color:#7D2248; color:#FFF;}





/* display options link */
.accessLink { border-bottom-left-radius:5px; font-weight:bold; position:relative }
.accessLink.active { background-color:#FFBF47; color:#000 !important}
.accessLink:after {
    border-bottom-color: #FFBF47;
}

/* buttons */
.button { text-transform:capitalize; border-radius:5px; font-weight:500 }
form .button {	border-radius:0 !important}

.button,
.theme .button,
/*reset formsmmaster */
#formsMaster .FormButton, 
#formsMaster button, 
#formsMaster .button, 
.fileUpload, 
.fileUpload span,
.theme .button { background-color:#065D92; color:#FFF !important; font-size: 1.125rem  }

.button.hollow,
.theme .button.hollow,
#formsMaster .FormButton.hollow, 
#formsMaster button.hollow, 
#formsMaster .button.hollow  { 
	color: #065D92 !important; 
	border-color: #065D92 !important; 
	background-color:#FFF !important; 
}	
.button:hover,
.button.hollow:hover,
.theme .button:hover,
#formsMaster .FormButton:hover, #formsMaster button:hover, #formsMaster .button:hover, .fileUpload:hover, .formMapTrigger:hover{ background-color:#043E62 !important; color:#FFF !important }

.button.hollow:hover,
.theme .button.hollow:hover { color:#FFF !important; border-color: #043E62 !important;   }
/*.button:focus,
.theme .button:focus {
    background-color: #AFB735!important;
}*/


/* reset callouts */
.callout,
.content .callout  {
  color: #FFF !important;
  background-color: black; }

.callout p,
.callout h1, 
.callout h2, 
.callout h3, 
.callout h4, 
.callout h5, 
.callout h6, 
.callout li, 
.callout ol, 
.callout ul,
.callout a,
.callout .close-button { color: #FFF !important }
.callout a:focus { color:#000 !important}

.callout.primary {
background-color: #4E5051; }
.callout.secondary {
background-color: #624E53; }
.callout.alert {
background-color: #7D2248; }
.callout.success {
background-color: #517C19; }
.callout.warning {
background-color: #000; }
/* reset info block */
.content .info { /*background-color:#89b8c5; changed for WCAG*/ background-color: #E0ECF0; }

/* reset formsmaster */
#formsMaster .ErrorText ul li,
#formsMaster .right-col .errorMessage, 
.myCouncilForm .errorMessage {background-color: #7D2248; border-color:#7D2248; color:#FFF !important}
#formsMaster .ErrorText ul li a {color:#FFF}




/* generic header furniture */
.smallViewportHeader { background-color:#7D2248}
#header { background-color:#fff; position:relative; z-index:2 }
.stickyHeader {  }



#header .headerLink { 
	display:block; 
	text-align:center; 
	color:#FFF; 
	box-sizing: border-box; 
	line-height: 1;
	height: 2.4375rem;
  	padding: 0.5rem 1rem;
	text-decoration:none;
	border-radius:5px;
	background-color:#7D2248;
	font-size: 	1.125rem;
	font-weight: normal !important 
	}
	#header .headerLink:hover,
	#header .toolRow .headerLink:hover  { background-color:#551731 !important; color:#FFF !important }
	
	#header .headerLink.accessLink {  border-radius:0  !important; font-weight: normal !important }
	#header .headerLink.accessLink.active { background-color:#551731 !important; color:#FFF !important}
	
	
#header	.visuallyhidden {
/* added in for WCAG automated testing*/
	background-color: black !important;
	color: white !important;
	
}
	
	
	.headerLink.accessLink:hover { color:#FFF !important } 
	#header .headerLink.accessLink:after  { border-bottom-color: #551731 !important; }
	
	
	/*#header .headerLink.accessLink.active:focus { background-color:#AFB735 !important; color:#000 !important}
	#header .headerLink.accessLink.active:focus:after  { border-bottom-color: #AFB735 !important; }*/
	
	
#header .headerLink.homeLink { border-radius:0  !important; text-align:left !important; display:inline-block !important }	
	
	
.headerSearch,
.headerMenu { margin-top:1.25rem;}

/*#header .headerLink.loginTrigger { background-color:#0F0 !important; padding: 1.74rem 1rem; height:79px; border-radius:5px 5px 0 0;}*/
#header .headerLink.loginTrigger { border:1px solid #7D2248 !important; }
#header .headerLink.loginTrigger:hover { background-color:#551731!important; text-decoration:none; color:#fff !important; }
#header .headerLink.loginTrigger:focus:hover { color:#FFF !important}

#header .headerLink.loginTrigger.active,
#header .headerLink.loginTrigger.active:hover { background-color:#fff !important; color:#7D2248 !important;  }

.breadcrumb { border-top:1px solid #e3e3e3; border-bottom:1px solid #e3e3e3; box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.15);}


.desktopTogglePanel { 
	top:-20px; /*offset the margin  and row padding*/ 
	border-radius:5px; 
	padding:20px; 
	border:1px solid #7D2248 !important; 
	position:relative;
	font-size:  1.125rem
}
.desktopTogglePanel:after, .desktopTogglePanel:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.desktopTogglePanel:after {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #ffffff;
	border-width: 15px;
	margin-left: -15px;
}
.desktopTogglePanel:before {
	border-color: rgba(186, 34, 60, 0);
	border-bottom-color: #7D2248;
	border-width: 16px;
	margin-left: -16px;
}
.desktopTogglePanel .button:last-of-type { margin-bottom: 20px !important; }

/* tip work out the height of your logo with the shim in the grid first without the min-height applied - THEN when you work it out add the min-height in */
#header .show-for-medium .logo a { min-height:74px; }
#header .logo a { 
	display:block;
	background-size:contain; 
	background-repeat:no-repeat; 
	background-position:center center;
	transition-property: opacity;
  	transition-duration: 0.2s;
  	transition-timing-function: ease-out;
  	transition-delay: 0.2s;
	background-image:url(../graphics/winchester_city_council_logo_2020.png);
	}
	body.contrastView #header .logo a { background-image:url(../graphics/winchester-city-council-logo-invert-white.png)}
	#header .logo a:hover {opacity: 0.6;}
	#header .logo a:focus,
	body.contrastView #header .logo a:hover { background-image:url(../graphics/winchester-city-council-logo-invert.png);  }
.headerSearch .button { 
	background-color:transparent;
	background-image:url(../graphics/search-icon.png);
	background-size:85% 85%;
	background-repeat:no-repeat;
	background-position:center center;
}
.headerSearch .button:hover { background-color:transparent !important; }

/* mobile header */
.smallViewport .logo { 
	background-image:url(../graphics/winchester-city-council-logo-invert-white.png);
	background-repeat:no-repeat;
	background-size:90%;
	background-position:center center;
}
/* reset this if they have only role='button' in the mobile header */
/* remove the below if sign in is added */
.smallViewport .small-6 .logo { 
	background-size:95%;
}
@media screen and (min-width: 21em) { 

	.smallViewport .small-6 .logo { 
		background-size:60% !important;
		background-position:12px
	}

}


.mobileTogglePanel form .button { border-radius:0px !important; }


.allServicesButton { 
	text-transform:capitalize; 
	border:1px solid #7D2248;
	text-align:left !important;
	background-image:url(../graphics/menu-bars-icon.png);
	background-position:96% center;
	background-repeat:no-repeat;
	background-size:24px 24px;
	}
	.allServicesButton:hover {  }
	.allServicesButton:focus { 
		background-image:url(../graphics/menu-bars-icon-invert.png);
	}
	.allServicesButton.active { background-color:#551731 !important}
/*	#header .headerLink.allServicesButton:focus,
	#header .headerLink.allServicesButton:focus:hover { background-color:#AFB735 !important; color:#000 !important}*/
	
.bannerWallpaper { background-color: #000;  }
figure.bannerWallpaper p.h1 a, 
div.bannerWallpaper p.h1 a { color: #fff }	
div.bannerWallpaper p.h1 { background-color: rgba(0, 0, 0, 1)!important; background-image: none}
div.bannerWallpaper p.h1 { padding-bottom: 1.25rem;}
div.bannerWallpaper p.h1 small {overflow-wrap: break-word; height: auto; line-height: normal !important}

	@media screen and (max-width: 39.9375em) {
		div.bannerWallpaper p.h1 { 
			font-size: 24px !important;
		}
		div.bannerWallpaper p.h1 small { font-size: 75%;}
		
	}
	

/* layout decor */
.row.withMidLine { background-image:url(../graphics/withMidLine.png); }
.border-top { border-top:1px solid #e3e3e3 }
.border-bottom {border-bottom:1px solid #e3e3e3}
.borderAlt { border-color:#551731 !important;}
.colorAlt { color:#7D2248 !important}
.bgColorAlt { background-color:#F5F5F5}

/* content with aside background lines */
.withSidebarRight .columns.content.paddingRight { padding-right: 0.625rem !important; }
.withSidebarRight .columns.sidebar.paddingLeft { padding-left: 0.625rem !important; }
.withSidebarRight .columns.sidebar { border-top:1px solid #d4d7d9; padding-top:1.25rem !important; 
	
	/* added for WCAG issues of automated testing */
	background-color: #f5f5f5; border-right: 1px solid #d4d7d9; border-left: 1px solid #d4d7d9 }

.withSidebarRight {
	background-image:none;
	background-repeat: repeat-y;
	background-size: 33.33% auto;
	background-position:right;
}
.sidebar { background-color:#f5f5f5 }
.sidebar section { 
	padding:1.125rem; 
	border:1px dotted #d4d7d9; 
	background-color:#FFF;

	-webkit-box-shadow: 0px 0px 5px 0px rgba(221,244,252,0.1);
	-moz-box-shadow: i0px 0px 5px 0px rgba(0,0,0,0.1);
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
}
.sidebar section.socialFeed { padding:0 !important; }


/* side bar chapternav (see content area version below this */
.sidebar .sideNav { font-size: 1em; position:relative; }
.sidebar .sideNav .h1 { padding:1.25rem; line-height:normal; display:block; background-color:#FFF; margin-bottom:0; border:1px solid #d4d7d9; border-bottom:0px;  }
.sidebar .sideNav ul.nav li { 
	border-bottom:1px solid #d4d7d9; 
	}
	.withSidebarRight .sidebar .sideNav ul.nav li { border-right:1px solid #d4d7d9; border-left:1px solid #d4d7d9; }
	.withSidebarLeft .sidebar .sideNav ul.nav li { border-left:1px solid #d4d7d9; }

.sidebar .sideNav ul.nav li:first-of-type { border-top:1px solid #d4d7d9; }
.sidebar .sideNav ul.nav a { 
	background-color: #ffffff;
}
.sidebar .sideNav ul.nav a span.folioTitle { font-weight:800 }
.sidebar .sideNav ul.nav a.active,
.sidebar .sideNav ul.nav a.active:hover { background-color:#043E62 !important; color:#FFF !important }
.sidebar .sideNav ul.nav a span.part { display:block; color:#333; font-size:0.778em; font-weight:800; }
.sidebar .sideNav ul.nav a span.subTitle { display:block; color:#333; font-size:0.778em; font-weight:300}	

.sidebar .sideNav ul.nav a:hover { background-color:#FFF; color:#043E62 }
.sidebar .sideNav ul.nav a:hover span.part,
.sidebar .sideNav ul.nav a:hover span.subTitle  { color:#333; }

.sidebar .sideNav ul.nav a.active span { color:#FFF}
.sidebar .sideNav ul.nav a.active:hover { background-color: #043E62; color:#FFF }

.sidebar .sideNav ul.nav a.active:hover span.part,
.sidebar .sideNav ul.nav a.active:hover span.subTitle { color:#FFF }

/* left arrow */
.sidebar .sideNav ul.nav a { position:relative; }
.sidebar .sideNav ul.nav a:hover:after, 
.sidebar .sideNav ul.nav a:hover:before {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	/* we dont want to see it on desktop */
	display:none 
}
.sidebar .sideNav ul.nav a:hover:after {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #fff;
	border-width: 15px;
	margin-top: -15px;
}
.sidebar .sideNav ul.nav a:hover:before {
	border-color: rgba(212, 215, 217, 0);
	border-right-color: #d4d7d9;
	border-width: 16px;
	margin-top: -16px;
}
	.sidebar .sideNav ul.nav a.active:after, 
	.sidebar .sideNav ul.nav a.active:before {
		right: 100%;
		top: 50%;
		border: solid transparent;
		content: " ";
		height: 0;
		width: 0;
		position: absolute;
		pointer-events: none;
		/* we dont want to see it on desktop */
		display:none 
	}
	.sidebar .sideNav ul.nav a.active:after {
		border-color: rgba(0, 115, 170, 0);
		border-right-color: #043E62;
		border-width: 15px;
		margin-top: -15px;
	}
	.sidebar .sideNav ul.nav a.active:before {
		border-color: rgba(212, 215, 217, 0);
		border-right-color: #d4d7d9;
		border-width: 16px;
		margin-top: -16px;
	}

/* focus styles for aside nav arrow */
.sidebar .sideNav ul.nav a.active:focus,
.sidebar .sideNav ul.nav a.active:focus :hover { background-color: #ffbf47 !important; color:#000 !important}

.sidebar .sideNav ul.nav a.active:focus span {color:#000 !important}

.sidebar .sideNav ul.nav a:focus:hover:after,
.sidebar .sideNav ul.nav a.active:focus:after { border-right-color: #ffbf47 !important;}



/* sidebar menu structure */
.sideMenu a { 
	padding:0.625rem 0; 
	border-bottom:1px solid #d4d7d9; 
	font-weight:600; 
}
.sideMenu ul li:last-of-type a { border:0px;}	

/* content area chapter nav */
/* prev */
a.chapterNav.prev .blockParent:after, 
a.chapterNav.prev .blockParent:before {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
a.chapterNav.prev .blockParent:after {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #fff;
	border-width: 10px;
	margin-top: -10px;
}
a.chapterNav.prev .blockParent:before {
	border-color: rgba(212, 215, 217, 0);
	border-right-color: #d4d7d9;
	border-width: 11px;
	margin-top: -11px;
}
/* next */
a.chapterNav.next .blockParent:after, 
a.chapterNav.next .blockParent:before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
a.chapterNav.next .blockParent:after {
	border-color: rgba(255, 255, 255, 0);
	border-left-color: #fff;
	border-width: 10px;
	margin-top: -10px;
}
a.chapterNav.next .blockParent:before {
	border-color: rgba(212, 215, 217, 0);
	border-left-color: #d4d7d9;
	border-width: 11px;
	margin-top: -11px;
}

.chapterNav .blockParent {
	border:1px solid #d4d7d9;
}
a.chapterNav .blockParent span.part { color:#333; font-size:0.778em; font-weight:800;  }
a.chapterNav .blockParent span.subTitle { color:#333; font-size:0.778em; font-weight:300; }
a.chapterNav .blockParent span.folioTitle { font-weight:700 }
a.chapterNav:hover .blockParent { text-decoration:none; background-color: #fff!important;  }
a.chapterNav.active .blockParent,
a.chapterNav.active:hover .blockParent { 
	background-color: #043E62 !important; 
	color:#fff
	}
	a.chapterNav.active .blockParent span,
	a.chapterNav.active:hover .blockParent span.part,
	a.chapterNav.active:hover .blockParent span.subTitle { color:#fff }
	a.chapterNav.active:hover .blockParent span.folioTitle { color:#ffff; text-decoration:none !important}

/* active */
/* see media queries */

/* focus */

/* active */
a.chapterNav.active .blockParent:after, 
a.chapterNav.active .blockParent:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
a.chapterNav.active .blockParent:after {
	border-color: rgba(0, 115, 170, 0);
	border-bottom-color: #043E62;
	border-width: 10px;
	margin-left: -10px;
}
a.chapterNav.active .blockParent:before {
	border-color: rgba(212, 215, 217, 0);
	border-bottom-color: #d4d7d9;
	border-width: 11px;
	margin-left: -11px;
}
a.chapterNav:focus { background-color:#FFF !important; }
a.chapterNav:focus .blockParent {
	background: #ffbf47 !important;
	color: #000000 !important;
}

a.chapterNav.active:focus .blockParent { background-color:#ffbf47 !important; }
a.chapterNav.active:focus .blockParent span { color:#000 !important; }

/* next prev focus */
a.chapterNav.next:focus .blockParent:after {
	border-left-color: #ffbf47;
}
a.chapterNav.prev:focus .blockParent:after {
	border-right-color: #ffbf47;
}
a.chapterNav.active:focus .blockParent:after {border-bottom-color: #ffbf47;}

/* hide the arrows on mobile */
a.chapterNav.next .blockParent:after,
a.chapterNav.next .blockParent:before,
a.chapterNav.prev .blockParent:after,
a.chapterNav.prev .blockParent:before,
a.chapterNav.active .blockParent:after,
a.chapterNav.active .blockParent:before { display:none }


	

/* promo */
.card-image-overflow {
	background-color:#444444;
	
}
.content .card-image-overflow  { color: #fff !important } 


/* icons based buttons for tasks */
.signButtons.topTasks { background-color:#fff}
.signButtons.topTasks .buttonPanel a { color:#fff; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3) !important ; background-color:#065D92 }
.signButtons.topTasks .buttonPanel a:hover { color:#fff; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3) !important ; background-color:#043E62 }

/* icons based buttons */
.signButtons.topTasks {}
.signButtons.topTasks .heading {text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.8);  }

/*

CHECK IT

.signButtons .row .columns,
.signButtons .row .column { margin-bottom:20px; }*/

.signButtons.topTasks a { border-radius:5px; }
 
.signButtons.topTasks a .buttonText { 
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3); 
	font-weight:500;
	line-height:normal
	}
	.signButtons.topTasks a:focus .buttonText { text-shadow:none !important }
 

/* 
.signButtons.topTasks a .icon {
	background-image:url(../graphics/signIcons/wallet-white.png);
	background-position-x: center;
	background-position-y: center;
	background-repeat: no-repeat;
	background-size: contain;
	display: block;
}
*/
.signButtons.topTasks .button.hollow { 
	/*color:#333 !important; 
	border-color:#333 !important; 
	background-color:transparent !important;*/
	}
	/*.signButtons.topTasks .button.hollow:focus { background-color:#AFB735 !important; color:#000 !important }*/

/* icons based buttons for services */
.signButtons.topServices { background-color:#eeeeee;  }

.signButtons .buttonPanel a .buttonText { padding: 0 15px 10px 15px !important; }

/*
.signButtons.topServices a .icon {
	background-image:url(../graphics/signIcons/wallet-white.png);
	background-position-x: center;
	background-position-y: center;
	background-repeat: no-repeat;
	background-size: contain;
	display: block;
	}
	.signButtons.topServices a.active .icon {
		background-image:url(../graphics/signIcons/wallet-black.png);
		background-position-x: center;
		background-position-y: center;
		background-repeat: no-repeat;
		background-size: contain;
		display: block;
	}
*/
/* sign buttons need to be rescaled down a bit on the smallest viewports */
.signButtons.topTasks a .icon,
.signButtons.topServices a .icon {}
.signButtons .buttonPanel a .icon { /*height:95px;*/ height:50px}
.signButtons .buttonPanel a .buttonText { /*padding-bottom:10px;*/ padding-bottom:0px; }

/* service category toggle panels */
.serviceCategory.trigger.active:after { border-bottom-color:#fff}
.signButtons.topServices .buttonPanel a { 
	color:#fff; 
	background-color:#7D2248; 
	text-decoration:none !important; 
	border-radius:5px; 	
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
	font-weight:500;
}


.signButtons.topServices .buttonPanel a:hover { background-color:#551731}
	.signButtons.topServices .buttonPanel a.active,
	.signButtons.topServices .buttonPanel a.active:hover { background-color:#ffffff; color:#000; text-shadow: none;}

/*
.signButtons .buttonPanel a:focus .icon {
	background-image:url(../graphics/signIcons/wallet-black.png);
}
*/

.expandedServicePanel .row .row { background-color:#fff; border-radius:5px;  }
.expandedServicePanel .headline {color:#000 !important; padding-top:10px;}
.expandedServicePanel a  { border-radius:5px; }
.expandedServicePanel .closeServicePanel {}


/* added in because thw want the buttons to look different */


.expandedServicePanel .textPanel a { 
	font-weight:500;
	background-color:#7D2248;
	color:#fff;
	}
	.expandedServicePanel .textPanel a:hover { background-color:#551731; color:#fff }
	
	.expandedServicePanel .textPanel .buttonText { }

.closeServicePanel { 
	background-image:url(../graphics/icon-cross-dark.png);
	}
	.closeServicePanel:hover { background-image:url(../graphics/icon-cross-dark.png); background-color:#fff; }
	.closeServicePanel:focus { background-image:url(../graphics/icon-cross-dark.png); }


.signButtons.topServices .button.hollow { 
	/*color:#FFF !important; 
	border-color:#FFF !important; 
	background-color:transparent !important*/
	}
	/*.signButtons.topServices .button.hollow:focus { background-color:#AFB735 !important; color:#000 !important}*/


/* service page service nav */
.signButtons.serviceNodes {}
.signButtons.serviceNodes .textPanel a { color:#FFF !important; background:#7D2248; border-radius:5px; padding:20px; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8); }

.signButtons.serviceNodes .textPanel a:hover { background:#551731; text-shadow: 1px 1px 1px rgba(0, 0, 0, 1); }
.signButtons.serviceNodes .textPanel a:focus,
.signButtons.serviceNodes .textPanel a:focus:hover { color:#000 !important;  }

/* home page news */
.featuredNewsCol figcaption.black65, 
.campaignSlides figcaption.black65,
.featuredNewsCol figcaption { 
	padding:15px 20px;
	
}
.featuredNewsCol figcaption p.h1 {	font-weight:300;}
.featuredNewsCol figcaption.black65, 
.campaignSlides figcaption.black65 { 
	
		background-image: none;
	background-color: #000
}
/* home page campaignSlides */

.featuredNewsCol figcaption p > .button,
.featuredNewsCol figcaption p .abstract { font-size: 1.125rem  }

/* for the tv layoput when they use the signed off layout we need tjhis to offset the border issue */
.newsFeature { margin-bottom:1px; }
.campaignSlides figcaption { 
	padding:15px 20px 20px 20px;  
	text-align:center
}
.campaignSlides figcaption p.h1 { }
.campaignSlides .bx-wrapper .bx-prev { left:0 !important;}
.campaignSlides .bx-wrapper .bx-next { right:0 !important;}


/* content details sections */
.pairLabel { font-weight:normal; color: #555555; }
.pairValue {}
.details .labelIcon { width:32px; height:32px;}

/* reset core font sizes  */
label,
.button.small { font-size: 1.125rem !important }


/* custom postcode for repairs search */
.searchPanel {background-color:#F3F3F3 !important;}

/* search applicance */
.searchMain { background-color:#F3F3F3 !important;}
.showAdvancedFilters { 
	background-color:#F3F3F3 !important;
}
.panelDecor { background-image:url(../graphics/diagonalShade.png); background-color: #f3f3f3}

/* news feature */
/* customise heights */
.featuredNewsCol,
.featuredNewsNavCol,
.newsFeature .item { height:43vh }
.newsFeature .item a { color:#FFF !important}
.newsFeature { position:relative; z-index:1}
#news-pager a { height:10.75vh; }
#news-pager a span { font-size:1.125rem }
#news-pager a { 
	background:#F3F3F3;
	color:#000;
	font-size:1.250em;
}
#news-pager a span {
	border-bottom:1px solid #fff;
}

#news-pager a:hover,
#news-pager a.active { background-color:#FFF; border-right:1px solid #F3F3F3;  }
#news-pager a.active:after {
	border-right-color: #fff; 
}
.no-js .newsFeature  { background:none;}
.no-js .featuredNewsCol figcaption { color:#333; }








/* bx slider pagination */
.bx-wrapper .bx-pager.bx-default-pager a {
	background: #065D92;
	border:2px solid #065D92;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover {background: #043E62; border-color:#043E62;}
.bx-wrapper .bx-pager.bx-default-pager a.active {
	/*background: #000;*/
	background:transparent;
	}
	.bx-wrapper .bx-pager.bx-default-pager a.active:hover { border-color:#000}


/* galleries in general publishing */
.galleryThumbs a span {
	padding: 3px;
	border: 2px solid #d4d7d9;
}
.galleryThumbs a:hover span,
.galleryThumbs a.active span {
	border:2px solid #043E62 ;
}



/* dynamic filtering */
a.filter-tag-button { 
	border:1px solid #d4d7d9;
}




/* card view for events etc */
.card .cardWrap {
    border: 1px solid #d4d7d9
}
.lineTop {
    border-top: 1px solid #d4d7d9
}
.lineBottom {
    border-bottom: 1px solid #d4d7d9
}
.card figure figcaption {
    padding: .625rem;
}
.card .promoText.darkened {
    background-color: #E9ECEE;
    color: #000
}
.cardWrap a { color:#000 !important; text-decoration:none !important }
.cardWrap a:focus .promoText { background-color:#ffbf47 !important; color:#000 !important}
.card .linkColour {
    color: #065D92;
    text-decoration: none
}
p.hashTag a:hover { text-decoration:underline !important; color: #043E62 !important;}
a:hover .linkColour {
    color: #043E62;
    text-decoration: underline
}
a:focus .linkColour {
    color: #000 !important
}
.cardWrap.darkBorder {
    border-color: #d4d7d9;
}


/* listing like atoZ */
.listLinks {
    padding-top: 0;
	padding-bottom:0;
	margin-top:0;
	margin-bottom:0;
	padding-left:20px;
	padding-right:20px;
	font-weight:normal !important
}
.listLinks li {
    margin: .5rem 0
}
.listLinks li:last-of-type {  margin-bottom:0;}

.listLinks li a::first-letter {
    text-transform: capitalize !important
}
.listLinks li a {
    padding: .625rem;
	display:inline-block;
	vertical-align:middle
}




/* general content publishing */
/* images */
.content figcaption p,
.content figcaption,
.content .contentVid p {
	color:#666;
	line-height:normal
}

blockquote {
  	border-left: 1px solid #d4d7d9; }
blockquote, blockquote p {
	color: #043E62;
    font-style: italic;
	font-size:1.25rem;
}
blockquote cite { }



/* task button inside publishing */
a.button.taskAction { 
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#767676+0,636363+100 */
	background: #767676; /* Old browsers */
	background: -moz-linear-gradient(top,  #767676 0%, #636363 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #767676 0%,#636363 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #767676 0%,#636363 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#767676', endColorstr='#636363',GradientType=0 ); /* IE6-9 */
	
	border-color:#444; 
	border-radius:3px; 
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
}
.content a.button.taskAction:hover {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#707070+0,606060+100 */
	background: #707070; /* Old browsers */
	background: -moz-linear-gradient(top,  #707070 0%, #606060 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #707070 0%,#606060 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #707070 0%,#606060 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#707070', endColorstr='#606060',GradientType=0 ); /* IE6-9 */

	text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.8);
	
	-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75),0px 0px 5px 0px rgba(221,244,252,1);
	-moz-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75),0px 0px 5px 0px rgba(221,244,252,1);
	box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75),0px 0px 5px 0px rgba(221,244,252,1);
	
	border-color:#DDF4FC; 	
}
.content a.button.large.taskAction:hover {padding-top: 0.87em; padding-bottom: 0.83em;}
.content a.button.taskAction:focus { 
	background:#ffbf47 ; 
	color:#000 ;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	border-color:#444; 
}


/* accordion content */
.accordion-title {
	font-size: 1.4rem;
	color: #000 !important;
	text-decoration:none !important;
	border: 1px solid #e6e6e6;
	border-bottom: 0;
	background-color:#f5f5f5;
	padding-right:50px;
}
.accordion-title:hover, 
.accordion-title:focus {
    background-color: #e6e6e6; 
}
.accordion-title::before {
	margin-top: -1rem;
}
.is-active > .accordion-title::before {
	content: '–';
}
.accordion-content ol,
.accordion-content ul { margin-bottom:1.25em;}




/* card toggle content - not in core yet */





/* search results */
#searchResults li a.linkBlock {
    border-left-width: 10px;
    border-color: #d4d7d9;
    color: #000
}
#searchResults li a.linkBlock small {
    color: green;
}
#searchResults li a.linkBlock h3 {
    color: #065D92;
    text-decoration: underline
}
#searchResults li a.linkBlock:hover h3 {
    color: #043E62;
    text-decoration: none
}
#searchResults li a.linkBlock:hover {
    border-color: #e5e7e8;
}
#searchResults li a.linkBlock:focus,
#searchResults li a.linkBlock:focus h3,
#searchResults li a.linkBlock:focus small {
    color: #000!important
}


/* updated search for elastic */
.searchResults li a h3 { color: #065D92; text-decoration:underline; }
.searchResults li a:hover h3 { color:#043E62;  text-decoration:none; }
/* doc type */
.searchResults li a b.docType { 
	background-image:url(../graphics/download-ready.png);
	background-repeat:no-repeat;
	background-position:bottom left;
	}
	.searchResults li a:hover b.docType { background-image:url(../graphics/download-hover.png); }	



/* calendars */
.dateCalBlock .dateCalBlockTitle {
    color: #000
}
.dateCal span {
    display: block;
    clear: both
}
.dateMonthAbbr {
    background-color: #AD3211!important;
    color: #FFF;
    text-transform: uppercase;
}
.dateDayNum {
    border-color: #d4d7d9;
    color: #444;
    font-size: 18px;
    background-color: #FFF;
    font-weight: 700
}

/* hints */
.hint { 
	border-radius:15px; 
	background-color:#000; 
	color:#fff !important;
	font-weight:600;
}
/* loading */
.loader .loader-bar {
	border-radius:4px; 
	background-color:#888 !important
}






/* a to z footer & header  */
.atozHeader { background-color:#FFF; }
.atozFooter { background-color:#f6f6f6; }
.azNav {
	font-weight:300;
}
.azNav li{
	text-transform:uppercase;
	font-size:1em;
}
.atozHeader .azNav li a { color:#000; border:1px solid #d4d7d9; }
.atozFooter .azNav li a { color:#000; border:1px solid transparent; }
.azNav li a:hover { 
	border-color: #043E62;
	color: #043E62;
}
.azNav li a.active { 
	background-color: #043E62;
	color:#FFF;
}

/* global footer */
.footer { 
	
}
.footerLinks {
	background-color:#4F4F4F;
	color:#FFF;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
.footerBlockTitle { font-weight:bold; font-size:1.25rem; line-height:normal; margin-bottom:1.5rem; }
.footer a { color:#FFF; text-decoration:none; border-bottom: dotted 1px #8a8a8a;}
.footer a:hover { text-decoration:none; border-bottom:0px;}
.logoLink {  margin-bottom:2em; width:95%; border-bottom:0px !important }
.vcard time { display:block !important; }
/* synicate */
.syndicate,
.syndicate a { color: #fff  }
/* social */
.social { 
		background-image:url(../graphics/winchester-city-skyline-grey-2020.png);
		background-position:top;
		background-size:contain;
		background-repeat:no-repeat;
		background-color:#4F4F4F;
		padding-top:5rem
}
.badgeButtons img { max-width:44px; max-height:44px; }

.badgeButtons {
	font-family: felt-tip-roman, sans-serif;
	font-weight: 400;
	font-style: normal;
}

/* credits */
a.credit { 
	font-family: felt-tip-roman, sans-serif;
	font-style: normal;
	font-weight: 400;
	color:#fff; 
	text-decoration:none; 
	border-bottom:0px !important
}

/* back-to-top floating button */
a.back-to-top {
	background: #043e62;
    background-color: #043e62;
    color: #ffffff;
	border:1px solid #fff;

	}
	a.back-to-top:hover {background-color: #043e62; color:#FFF }

/* medium */
@media screen and (min-width: 40em) { 


	/* change base font size for the design - default 16px upped to 18px - this is moved into the medium media query to avoid class with mobile  */
	.container { font-size:112.5%;  }  

	
	/* display options toggle verb */
	/* all services 'ALL' */
	.allServicesButton span { display:none !important}

	/* content with aside background lines */
	.withSidebarRight {
		background-image:url(../graphics/sidebar.gif);
    }
	.sidebar { background-color:transparent }
	.withSidebarRight .columns.content.paddingRight { padding-right: 0.625rem !important; }
	.withSidebarRight .columns.sidebar.paddingLeft { padding-left: 0.625rem !important; }
	.withSidebarRight .columns.sidebar { border-top:none; }
	
	/* sign buttons need to be rescaled up a bit from the smallest viewports */
	.signButtons.topTasks a .icon,
	.signButtons.topServices a .icon {}
	.signButtons .buttonPanel a .icon { height:95px; }
	.signButtons .buttonPanel a .buttonText { padding-bottom:10px !important; }
	
	/* first heading */
	.main .content h1:first-of-type { margin-top:1.125rem; }
	
	
	/* content area chapter nav */
	.pageNav a.chapterNav:first-of-type .blockParent { border-bottom:1px solid #d4d7d9;}

	
	/* left arrow */
	.sidebar .sideNav ul.nav a:hover:after, 
	.sidebar .sideNav ul.nav a:hover:before,
	.sidebar .sideNav ul.nav a.active:after, 
	.sidebar .sideNav ul.nav a.active:before,
	a.chapterNav.next .blockParent:after,
	a.chapterNav.next .blockParent:before,
	a.chapterNav.prev .blockParent:after,
	a.chapterNav.prev .blockParent:before,
	a.chapterNav.active .blockParent:after,
	a.chapterNav.active .blockParent:before {
		display:block !important
	}
	
	/* social */
	.social { 
		padding-top:13vh;
	}
	.badgeButtons { 
		padding-top:0px; 
	}
	
	a.liveHelp { 
		top: 22%;
		height: 130px;
	}
	a.liveHelp span.icon { 
		display:block
	}
	a.liveHelp span.text { 
		top:48px; 
	}

	/* back-to-top floating button */
	.back-to-top {
		/* reset because of position of live help widget */
		right:20px;
		left:auto;
	}


}


/* large */
@media screen and (min-width: 64em) {
	
	

	/* display options toggle verb *//* all services 'ALL' */
	.toggleLabel,
	.allServicesButton span { display:inline-block !important}
	
	/* content with aside background lines */
	.withSidebarRight {
		background-image:url(../graphics/sidebar.gif);
    }
	.sidebar { background-color:transparent }
	.withSidebarRight .columns.content.paddingRight { padding-right: 1.125rem!important }
	.withSidebarRight .columns.sidebar.paddingLeft { padding-left: 1.125rem!important; }
	.withSidebarRight .columns.sidebar { border-top:none;  }
	
	/* social */
	.social { 
		padding-top:27vh;
		background-image:url(../graphics/winchester-city-skyline-hires-grey-2020.png);
	}
	
	

}


/* contrast */
body.contrastView .smallViewportHeader { background-color:#333}
body.contrastView .social { background: none; padding-top:20px;}
body.contrastView .syndicate { background-color:#000 !important}
/*body.contrastView .atozFooter { border-bottom:1px solid #555555}*/
body.contrastView .toolRow {border-bottom:1px solid #555555}
body.contrastView .footerLinks {border-top:1px solid #555555}

body.contrastView .allServicesButton {background-image: url("../graphics/menu-bars-icon-invert.png");}