/**
 * Header banner image
 */


header {
	background: #333333 url('/SiteElements/images/custom-branding/FireRescueResilience-Banner.jpg') no-repeat center top;
	background-size: cover;
}

/* a:focus ,area[href]:focus, input:focus, select:focus, textarea:focus, button:focus, iframe:focus, 
[tabindex]:focus, [contentEditable=true]:focus, .addFocus:focus
{
  border-color:    #419E64 !important;
} */

.landing .intro .container .content #spydusfloatlanding ul li a:focus{
    border-style: solid !important;
}

/**
 * Header logo
 */
/*
 header h1 { 
   width: 310px; background: none;
}

header h1 a {
    display: inline-block;
    text-indent: 0em; 
}

header h1 a img{
    width: 100%;
    height: 100%;
    max-width: 192px;
  max-height: 119px; 
}

.search.block { 
	top:  -20px; 
	position: relative; 
}*/

/**
 * Landing page heading underline colour
 */
.landing .intro .container .content h1 {
    border-bottom: 2px solid #d71920;
}

/**
 * Alternative landing page heading underline colour
 */
.altlandingMid {  
  	border-top: 3px solid #d71920; 
}

/**
 * Menu bar colour
 */
nav {
    background-color: #d71920;
	color: #FFF}
.nav a {
    color: #FFF;
}

/**
 * Colour of 'Find out more' button on carousel
 */
.content .secondary {
    background-color: #d71920;
    color: white;
}

/**
 * Hover colour of 'Find out more' button on carousel
 */

.content .secondary:hover { background-color: #e62426; }

/**
 * Line above title colour
 */
.content .toolbar {
    border-top: 2px solid #d71920;
}

/**
 * Removes 'Hertfordshire County Council' from right of search button
 */
header h2 {
    background: url('') no-repeat left top;
  	display: none;
}

/**
 * Jump links colour
 */
.content article ul:not([class]) li::before {
    color: #d71920;
}

/**
 * Breadcrumb active page colour
 */
.breadcrumb ul li.active { 
  	background-color: #d71920; 
}

/**
 * Breadcrumb hover colour
 */
.breadcrumb ul li a:hover, .breadcrumb ul li a:focus {
    background-color: #d71920;
}

/**
 * Breadcrumb divider line hover colour
 */
.breadcrumb ul:hover + .toggleMenu, 
.breadcrumb .toggleMenu.active {
  	border-color: #e62426;
}

/**
 * Left line in body of page colour
 */
.content .vcard, .content .indented {
    border-left: 3px solid #d71920;
}

/**
 * Form left line colour
 */
ul.sys_cms-form-body {
    border-left: 2px solid #d71920;
}

/**
 * Primary call to action button colour
 */
.content .primary {
    background-color: #d71920;
}

/**
 * Primary call to action button hover colour
 */
.content .primary:hover {
    background-color: #e62426;
}

/**
 * Jump link colour
 */
.content .anchors li a, a[name*='_Top1'] + ul li a {
    color: #D71920;
}

/**
 * Jump link hover colour
 */
.content .anchors li a:hover,
a[name*="_Top1"] + ul li a:hover { color: #D71920; }

/**
 * Jump link external link colour
 */
.content a.link-taskLink {
    color: #D71920;
}
/**
 * Jump link link colour
 */
.content a.link-taskLink {
    font-family: "lola",sans-serif;
    font-weight: 300;
    font-size: 1.5em;
    padding: 0.25em 2em 0.25em 0px;
    color: #D71920;
    transition: all 0.3s ease 0s;
    text-decoration: none;
    border-top: 2px solid #D0D5D9;
    border-bottom: 2px solid #D0D5D9;
    display: block;
}

/* active crumbtrail link colour - HS 170316 */


li.active-trail.show.active>a.active-trail {color: #FFF;}

/**
 * Landing page top tasks widget colour
 */
.landing .topTasks {
   /* background-color: rgb(115, 115, 115);*/
  background-color: #fff;
}

.topTasks.altmiddle { margin-top: -42px;}

/**
 * Opening hours tab colour
 */
.tab-links li.active a, .tab-links li.active a:hover {
    background: #d71920;
}

/**
 * nav button colour
 */
.landing .intro .container .content ul li a {
    background-color: #d71920; 
    color: white;
   border-style:    solid;   
  border-width:    3px;
  border-color:    #d71920;
}

/**
 * nav button hover colour
 */
.landing .intro .container .content ul li a:hover {
    background-color: #e62426;
    border-style:    solid;   
  border-width:    3px;
  border-color:    #e62426;
}

.icon a 
{
  border-style: none !important;
}


/**
 * Fire card - I have moved the red one into the main style sheet so it can be used elsewhere on the site CW
 */

.content .widget.cardLightGrey h3 {
  	background-color: #737373;
}
.content .widget.cardLLBlue h3 {
  	background-color: #330099 ;
}

/**
 * Alternative landing page tile colour
 */
.landing .intro .container .content ul.altpurple li a{
  	background-color: #d71920;
    color: white;
}

/*background color for body reset*/

body {
    background-color: #333333;
}


.landing .intro .container .content ul.altpurple li a:hover{
 	background-color: #e62426;
}
/**
 * Mobile view
 */ 
@media only screen and (max-device-width : 768px) 
   
   {

   	.landing .topTasks {
    background-color: white;
}
/*
.search.block .searchButton { 
      margin-top: -20px; position: relative; 
    }
 
     
header .container h1 {
    box-sizing: border-box;
    margin-top:  15px;
    padding: 0;
    margin-bottom: 0px;
    text-align: center;
}

header .container { 
  max-height: 165px;
}*/
.landing .intro .container .content .altcontentlinks ul li a {
    
 
}
   }


@media only screen and (max-width : 970px) 
      {
 /*
	header .container { min-height: 240px; }
	header h1 { width: 250px;}
	header h1 a {
    	display: block;
    	text-indent: 0em; 
    	padding-bottom: 20px; 
    	margin-top:  0px;
	}

	.search.block, .search.block .searchButton {
      	margin-top: 50px; 
      	position: relative; 
      	 
    }*/
 .altcontenttoptasks h1 {width: 90%;}


   
 
}

@media only screen and (max-width : 736px) {
.block.search
{
    display:block;  
}

.landing .intro .container .content.altcontenttoptasks h1 {
    border-bottom: none;
}

 .altlanding {
        border-top: 2px solid #d71920;
        width: 90%;   
    }

}

 

@media only screen   
  and (max-device-width: 568px)
{
    .altLandItem li{ 
        width: 100% !important;
    }
    header h1 a, header .header a
    {
        display: inline;
    }
    header h1 a img {
	max-width: 100%;
	height: auto;
	display: block;
  	margin: 0 auto;
    }
}

@media only screen and (min-width: 760px)
{
    header h1, header .header {
        width: 450px;
        display: inline-block;
    }
    header h1 a, header .header a{
        text-indent: -345px;
    }
}


.content .widget.fixed.cardRed .menu {
  height: 270px;
  -webkit-overflow-scrolling: touch;
  overflow-y: auto;
}


.altlandingMid h3 span {
    background-color: #FFF;
    padding: 0px 10px;
}

.content .primary a {
    color: #FFF;
}

/**
* Mega menu sub-menu hover over colour
*/
.nav.primary .menu .menuPrimaryLink.current {
  background-color: #333333
}

.nav.primary > li .menu {
    box-shadow: 2px 4px 5px rgba(51, 51, 51, 0.5);
    position: absolute;
    width: 100%;
    text-align: left;
    top: 100%;
    left: 0px;
    display: none;
    background-color: rgb(115, 115, 115);
}

/**
* Menu bar hover over colour

.nav.primary > li.hover > a {
    background-color: #737373; 
}
*/
/**
* Menu bar home hover over colour

.nav.primary > li > a:hover, .nav.primary > li > a:focus, .nav.primary > li.hover > a {
    background-color: #737373;
}

.nav.primary .menu .menuSecondaryLink:hover, .nav.primary .menu .menuSecondaryLink:focus{
    background-color: #333333;
}

.nav.primary .menu .menuAdLink:hover, .nav.primary .menu .menuAdLink:focus{
  	background-color: #737373
}
*/
.content .widget .content .menuList li > a:after {
	content: '\e802';
	font-family: "fontello";
	display: inline-block;
	text-decoration: inherit;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: 1.3em;
	line-height: 1em;
	margin-left: .25em;
	vertical-align: -0.1em;
	position: absolute;
  	right: 20px;
 	top: 33%;
  	color: #d71920;
	font-family: "fontello";
}

.nav.primary > li .menu ul.feature li p:after {
  font-family: "fontello";
  display: inline-block;
  text-decoration: inherit;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\e802';
  color: #d71920;
  font-size: 1.6em;
  line-height: 1em;
  margin-left: .25em;
  vertical-align: -0.1em;
}

.nav.primary > li .menu ul li ul li.summary p:after {
	font-family: "fontello";
	display: inline-block;
	text-decoration: inherit;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	content: '\e802';
	color: #d71920;
	font-size: 1.6em;
	line-height: 1em;
	margin-left: .25em;
	vertical-align: -0.1em;
}


.faq .faq-content {
    position: relative;
    display: none;
    padding: 1px 43px 15px 10px;
    background: #EFEFE9 none repeat scroll 0% 0%;
}


.faq .faq-toggle .faq-toggle-icon, .faq .faq-toggle.plus .faq-toggle-icon {
    background: #D71920 url("//code.jquery.com/mobile/1.4.5/images/icons-png/carat-d-white.png") no-repeat scroll 4px 50%;
}


@media only screen and (max-width: 760px)
{
    .intro {
        margin-top: -108px;
        padding-top: 108px;
    }
}

.content .panel.info::before {
    color: #d71920;
}


/**
* twitter feed center
*/

.fireTwitter {overflow: auto; margin-top: 30px}

.fireTwitter .widget {margin-left: auto; margin-right: auto; float: none;}

/**
* List of fire station locations
*/
.liblist li:first-child a.link-taskLink {
    font-family: 'lola', sans-serif;
    font-weight: 300;
  	font-size: 1.5em;
  	padding: .25em 2em .25em 0;
	color: #d71920 !important;
    text-decoration: none;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
  	text-decoration: none;
    border-top: none !important;
    border-bottom: none !important;
  	display: block;
}

.liblist li:last-child a.link-taskLink {
    border-bottom: none !important;
}

.liblist li a.link-taskLink {
    font-family: 'lola', sans-serif;
    font-weight: 300;
  	font-size: 1.5em;
  	padding: .25em 0em .25em 0;
	color: #d71920 !important;
    text-decoration: none;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
  	text-decoration: none;
    border-top: 2px solid #d0d5d9;
    border-bottom: none !important;
  	display: block;
  	width: 100%;
}
/**
 * Jump link external link colour
 */
.content a.link-taskLink {
    color: #D71920 !important;
}

@media only screen and (max-width: 759px)
{
    .landing #card
    {
        margin-bottom: 0;
    }
}

.fireheader{
    background-size: contain;
    display: inline-block;
    width: 125px;
    height: 70px;
    margin-right: 98px;
    vertical-align: text-bottom;
    float: left;
}

/**
 * Secondary CTA MC 09/04/21
 */

.content .secondary {
    background-color: #fff;
    border: 2px solid #d71920;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -pie-border-radius: 2px;
    font-size: 1.2em;
    font-weight: 600!important;
    text-decoration: none;
    margin: 0 auto;
    display: block;
    text-align: left;
    line-height: 1.2em;
    letter-spacing: 0.2pt;
    font-weight: 600;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
    border-radius: 2px;
    cursor: pointer;
    -webkit-transition: ease all 300ms;
    -moz-transition: ease all 300ms;
    -o-transition: ease all 300ms;
    transition: ease all 300ms;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.23), 0px 5px 15px rgba(0, 0, 0, 0.19);
    -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.23), 0px 5px 15px rgba(0, 0, 0, 0.19);
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.23), 0px 5px 15px rgba(0, 0, 0, 0.19);
}
.content .secondary:hover {
    border-color: #971216;
    background-color: #fff;
    text-decoration: none;
}
.content .secondary a {
    color: #d71920;
	padding: 18px;
    -webkit-transition: ease all 300ms;
    -moz-transition: ease all 300ms;
    -o-transition: ease all 300ms;
    transition: ease all 300ms;
}
.content .secondary a:hover {
    color: #971216;
}

.content .toolbar {
    display: none;
}

footer {
    background-color: #1B203D;
}

.breadcrumb{
    background-color: #0B203D;
}

.breadcrumb ul li.active-trail a:before {
    border-left: 10px solid #0B203D;
}

li.active-trail.show a {
      background-color: #0B203D;
}

li.overflow::after{
    background-color: #0B203D;
}

li.active-trail a.active-trail:hover{
      background: #0B203D;
}

.breadcrumb ul li.show{
    background: #0B203D;
}

div.current ul li.active-trail.show::after{
    border-color: transparent transparent #0B203D;
}

@media only screen and (min-width: 1170px) {
     .main-menu {
         background-color: rgb(27,32,61,0.8);
     }
    .main-menu .main-menu__panel {
         background-color: #0B203D;
    }
    .main-menu .main-menu__panel li ul {
        background-color: #0B203D;
    }
    .breadcrumb>div {
         background-color: #0B203D;
    }
    .main-menu .main-menu__panel li:hover > a {
    background-color: #d71920;
  }
    .main-menu .main-menu__panel li li a:hover,
    .main-menu .main-menu__panel li li a:focus,
    .main-menu .main-menu__panel li li a:active {
    background-color: #d71920;
    }
}

@media only screen and (max-width: 1170px){
   .fireheader {
        height: unset;
    }
}