body { min-width: 330px; font-family: 'Lato', sans-serif; }

/* *********************** */
/* ** CHA - CSS STYLING ** */
/* *********************** */


/* *** GENERAL OVERWRITES *** */
.btn, .wpcf7 input[type="submit"] { padding: .5rem .9rem; line-height: 1.1; -webkit-border-radius: 0.5rem; -moz-border-radius: 0.5rem; border-radius: 0.5rem; font-weight: 500; text-transform: uppercase; }

.btn-primary, .wpcf7 input[type="submit"] { background-color: #00bfbf; border-color: #00bfbf; color: #fff; }
.btn-primary:hover, .wpcf7 input:hover[type="submit"] { background-color: #0ecece; border-color: #0ecece; }
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle { background-color: #0ecece; border-color: #0ecece; }
.btn-primary:focus,
.wpcf7 input.focus[type="submit"], .wpcf7 input:focus[type="submit"],
.wpcf7 .show > input.dropdown-toggle[type="submit"], .wpcf7 input:not(:disabled):not(.disabled).active[type="submit"], .wpcf7 input:not(:disabled):not(.disabled):active[type="submit"],
.wpcf7 .show > input.dropdown-toggle:focus[type="submit"], .wpcf7 input:not(:disabled):not(.disabled).active:focus[type="submit"], .wpcf7 input:not(:disabled):not(.disabled):active:focus[type="submit"],
.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus {
	color: #fff;
	background-color: #0ecece; border-color: #0ecece;
	
	-webkit-box-shadow: 0 0 0 .2rem rgba(0,191,191,.5);
	box-shadow: 0 0 0 .2rem rgba(0,191,191,.5);
}

.btn-outline-primary { color: #00bfbf; border-color: #00bfbf; }
.btn-outline-primary:hover { color: #fff; background-color: #00bfbf; border-color: #00bfbf; }
.btn-outline-primary.focus, .btn-outline-primary:focus,
.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-outline-primary.dropdown-toggle,
.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-outline-primary.dropdown-toggle:focus { 
	-webkit-box-shadow: 0 0 0 .2rem rgba(0,191,191,.5);
	box-shadow: 0 0 0 .2rem rgba(0,191,191,.5);
	
	background-color: #0ecece; border-color: #0ecece;
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled, .wpcf7 input.disabled[type="submit"], .wpcf7 input:disabled[type="submit"] { color: #00bfbf; }

.btn-white { background-color: #fff; }

.custom-select:focus {
    border-color: #0ecece;
    outline: 0;
    -webkit-box-shadow: 0 0 0 .2rem rgba(0,191,191,.5);
	box-shadow: 0 0 0 .2rem rgba(0,191,191,.5);
}

.form-control:focus, .wpcf7 .wpcf7-validation-errors:focus, .wpcf7 input:focus[type="color"], .wpcf7 input:focus[type="date"], .wpcf7 input:focus[type="datetime-local"], .wpcf7 input:focus[type="datetime"], .wpcf7 input:focus[type="email"], .wpcf7 input:focus[type="file"], .wpcf7 input:focus[type="month"], .wpcf7 input:focus[type="number"], .wpcf7 input:focus[type="range"], .wpcf7 input:focus[type="search"], .wpcf7 input:focus[type="tel"], .wpcf7 input:focus[type="text"], .wpcf7 input:focus[type="time"], .wpcf7 input:focus[type="url"], .wpcf7 input:focus[type="week"], .wpcf7 select:focus, .wpcf7 textarea:focus {
	border-color: #04428f;
	-webkit-box-shadow: 0 0 0 .2rem rgba(4,66,143,.5);
	box-shadow: 0 0 0 .2rem rgba(4,66,143,.5);
}

.btn-outline-light.focus, .btn-outline-light:focus { color: #fff; }
.btn-outline-light.focus:hover, .btn-outline-light:hover:focus { color: #212529; }

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link { color: #fff; }

.text-blue { color: #04428f; }

.bg-dark { background-color: #1d1d20 !important; }

a, a:hover, a:focus { color: #04428f; }

/* *** TYPE *** */
body { font-size: 13px; }
.h1, h1 { font-size: 2.4em; }
.h2, h2 { font-size: 1.9em; }
.h3, h3 { font-size: 1.7em; }
.h4, h4 { font-size: 1.5em; }
.h5, h5 { font-size: 1.25em; }
.h6, h6 { font-size: 1em; }
.lead { font-size: 1.25em; }

h1.smallerFont { font-size: 1.8em; }

.theme-font,
.h1, h1,
.h2, h2,
.h3, h3,
.h4, h4,
.h5, h5,
.h6, h6 { font-family: 'Vollkorn', serif; }

blockquote { padding-left: 2.2em; position: relative; }
blockquote:before { content: "\f10d"; font-family: 'Font Awesome\ 5 Free'; font-weight: 900; font-size: 1.5em; color: #dbe0e7; position: absolute; top: 0; left: 0; }
blockquote:after { content: ""; background-color: #dbe0e7; position: absolute; top: 2.5em; bottom: 0.3em; left: 0.7em; width: 1px; }

@media (min-width: 576px) {
	body { font-size: 14px; }
}
@media (min-width: 768px) {
	body { font-size: 16px; }
}

/* ************** */
/* *** HEADER *** */
/* ************** */

.upperLinks { font-size: 80%; }

.headerWrap { background-color: #04428f; }
.headerWrap.headerImg { background-image: none; }
.headerWrap.headerImg .navbarBg { height: 48vw; min-height: 275px; max-height: 600px; background-repeat: no-repeat; background-size: cover; background-position: center center; }

.logoBox { position: relative; z-index: 11; }
.logoBox img { width: 100%; max-width: 60px; }
.headerTagline  { color: #fff; margin-right: 1rem; text-align: center; font-weight: 500; font-size: 0.9em; }
.navbar-nav { font-weight: 500; }

.navbar .logoBox { text-shadow: 1px 1px 1px rgba(0, 0, 0, 1); color: #fff; 
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	transition: 0.4s;
}
.navbar .logoBox.nav-is-visible { text-shadow: 1px 1px 1px rgba(250,250,250, 1); color: #212529;  }
.navbar .logoBox h1 { font-size: 1.5em; }
.navbar .logoBox span { text-transform: uppercase; font-size: 0.8em; }

.headerImg .navbar { 
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#00000000',GradientType=0 );
}

.mainNavbar .navbar-nav > li > .nav-link  { position: relative; display: inline-block; }
.mainNavbar .navbar-nav > li > .nav-link:after  { content: ""; position: absolute; bottom: .5rem; left: .5rem; right: .5rem; height: 1px; background-color: transparent; }
.mainNavbar .navbar-nav > li.current-menu-item > .nav-link:after  { background-color: #fff; }

@media (min-width: 576px) {
	.headerWrap.headerImg .navbarBg { height: 30vw; }
	.logoBox img { max-width: 80px; }
}
@media (min-width: 992px) {
	.navbar .logoBox h1 { font-size: 1.8em; }
	.navbar .logoBox span { font-size: 1em; }
}

/* -------------------------------- 
Slide out menu
-------------------------------- */
.navCover { z-index: 9; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(255,255,255,0);
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform: translateX(-100%);
	-moz-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	-o-transform: translateX(-100%);
	transform: translateX(-100%);
	-webkit-transition: background-color 0.4s;
	-moz-transition: background-color 0.4s;
	transition: background-color 0.4s;
}
.navCover.nav-is-visible {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	-o-transform: translateX(0);
	transform: translateX(0);
	background-color: rgba(255,255,255,0.5);
}

.mainNavbar {
	padding-top: 145px;
	position: absolute;
	top: 0;
	left: 0;
	/*width: 63vw;*/
	
	width: -moz-calc(100% - 76px);
	width: -webkit-calc(100% - 76px);
	width: -o-calc(100% - 76px);
	width: calc(100% - 76px);
	
	height: 100%;
	background: #fff;
	box-shadow: 4px 4px 20px transparent;
	z-index: 10;
	overflow: hidden;
	/* Force Hardware Acceleration in WebKit */
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform: translateX(-100%);
	-moz-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	-o-transform: translateX(-100%);
	transform: translateX(-100%);
	-webkit-transition: -webkit-transform 0.3s, box-shadow 0.3s;
	-moz-transition: -moz-transform 0.3s, box-shadow 0.3s;
	transition: transform 0.3s, box-shadow 0.3s;
}
.mainNavbar.nav-is-visible {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	-o-transform: translateX(0);
	transform: translateX(0);
	box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.2);
}
.mainNavbar.nav-is-visible .cd-close { opacity: 1; }

.mainNavbar .mainNavbarInner { width: 100vw; }
.mainNavbar .mainNavbarInner .navbar-collapse { padding-left: 15px; }

.navicon-button {
	position: relative;
	z-index: 11;
	-webkit-transition: 0.25s;
	-moz-transition: 0.25s;
	transition: 0.25s;
	cursor: pointer;
	user-select: none;
}
.navicon-button .navicon:before, .navicon-button .navicon:after {
	-webkit-transition: 0.25s;
	-moz-transition: 0.25s;
	transition: 0.25s;
}
.navicon-button:hover {
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	transition: 0.5s;
}
.navicon-button:hover .navicon:before, .navicon-button:hover .navicon:after {
	-webkit-transition: 0.25s;
	-moz-transition: 0.25s;
	transition: 0.25s;
}
.navicon-button:hover .navicon:before { top: 8px; }
.navicon-button:hover .navicon:after { top: -8px; }
.navicon {
	position: relative;
	width: 1.5em;
	height: 2px;
	background: #212529;
	-webkit-border-radius: 2.5rem;
	-moz-border-radius: 2.5rem;
	border-radius: 2.5rem;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	transition: 0.5s;
}
.navicon:before, .navicon:after {
	display: block;
	content: "";
	height: 2px;
	width: 1.5rem;
	background: #212529;
	position: absolute;
	z-index: -1;
	-webkit-border-radius: 1rem;
	-moz-border-radius: 1rem;
	border-radius: 1rem;
	-webkit-transition: 0.5s 0.25s;
	-moz-transition: 0.5s 0.25s;
	transition: 0.5s 0.25s;
}
.navicon:before { top: 6px; }
.navicon:after { top: -6px; }

.nav-is-visible:not(.steps) .navicon:before,
.nav-is-visible:not(.steps) .navicon:after {
	top: 0 !important;
}

.nav-is-visible .navicon:before,
.nav-is-visible .navicon:after {
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	transition: 0.5s;
}
.nav-is-visible.x .navicon { background: transparent; }
.nav-is-visible.x .navicon:before {	  
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.nav-is-visible.x .navicon:after {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

/* navbar updates */
.navbar-expand .navbar-nav {  
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
}
.navbar-expand .navbar-nav .nav-link { padding-left: 10px; padding-right: 10px; }

/* Home Postcode */
.homePostcode  { background-color: rgba(0,0,0,0.6); }
.homePostcode .homePostcodeInput  { max-width: 135px; border: none; -webkit-box-shadow: none !important; box-shadow: none !important; }

@media (min-width: 576px) {
	.mainNavbar { width: 80vw; }
	.mainNavbar .mainNavbarInner .navbar-collapse { padding-left: 65px; }
	
	.homePostcodeText { font-size: 1.2em; }
}
@media (min-width: 679px) {
	.mainNavbar { width: 77vw; }
	
	.homePostcode .homePostcodeInput { max-width: 200px; }
}
@media (min-width: 768px) {
	.mainNavbar { width: 69vw; }
}
@media (min-width: 992px) {
	.mainNavbar { width: 63vw; }
}

@media (max-width: 575px) {
	.navicon-button { padding: .25rem .7rem; }
}


/* ************** */
/* *** FOOTER *** */
/* ************** */

.footerSection { background-color: #04428f; background-size: auto 90%; background-repeat: no-repeat; background-image: url("../images/left-pattern-bg.svg"); background-position: -90vw 0; text-align: center; }
.footerSection a { color: #fff; }
.footerLogo img { max-width: 80px; }
.footerLogo .textLogo:hover { text-decoration: none; }

.footerLowerSection { background-color: #1d1d20; font-weight: 200; }

@media (min-width: 576px) {
	.footerSection { background-position: 0 0; text-align: unset; }
}
@media (min-width: 768px) {
	.footerLogo img { max-width: 100px; }
}

@media (max-width: 575px) {
	.footer-menu li { display: inline-block; padding-right: 1em; margin-right: 1em; margin-bottom: 1em; border-right: 1px solid #2f6fbd; line-height: 1.1; }
	.footer-menu li:last-of-type { padding-right: 0; margin-right: 0; border-right: none; }
}



/* ******************** */
/* *** SLICK SLIDER *** */
/* ******************** */

/* Dots */
.slick-dotted.slick-slider { margin-bottom: 30px; }
.slick-dots { position: absolute; bottom: -25px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; }
.slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; }
.slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; }
.slick-dots li button:hover,
.slick-dots li button:focus { outline: none; }
.slick-dots li button:hover:before,
.slick-dots li button:focus:before { font-weight: 900; }
.slick-dots li button:before { 
	content: "\f111";
    font-family: "Font Awesome 5 Free";
    font-size: 12px;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    text-align: center;
    color: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before { font-weight: 900; }



/* ************ */
/* *** PAGE *** */
/* ************ */

/* Title */
.titleWrap { padding: 40px 0; }
.titleWrap h1 { color: #fff; }
.titleWrap.titleBg-blue { background-color: #04428f; }
.titleWrap.titleBg-grey { background-color: #e3e8ef; }
.titleWrap.titleBg-grey h1 { color: #04428f; }

.titleWrap .entry-header a { font-style: italic; font-weight: 300; font-size: 1.2em; }
.titleWrap.titleBg-blue .entry-header a { color: #fff; }

/* General */
.dashed-border { border-bottom: 1px dotted #ddd; }

/* Homepage */
.titleWrap  h1 { position: relative; z-index: 3; }
.keyAreaIntro { background-color: #04428f; background-size: auto 100%; background-repeat: no-repeat; background-image: url("../images/right-pattern-bg.svg"); background-position: 2vw 0; }
.keyAreaIntroBox { padding-bottom: 120px; }
.keyAreaItemBox { margin-top: -120px; }
.keyAreaItem img { border: 6px solid #04428f; width: 300px; }
@media (min-width: 576px) {
.keyAreaIntro { background-position: 6vw 0; }
	.keyAreaItem img { width: auto; }
}
@media (min-width: 768px) {
	.keyAreaIntro { background-position: 30vw 0; }
}


/* Child List */
.subpage .subImage { padding-bottom: 45%; background-color: #e3e8ef; background-size: cover; background-repeat: no-repeat; background-image: url("../images/soundwave-header-30-mob.png"); background-position: center; }
@media (min-width: 992px) {
	.subpage .subImage { padding-bottom: 35%; }
}


/* ************ */
/* * ARCHIVES * */
/* ************ */

#archive-wrapper { background-color: #ededed; }
.ul.pagination  { -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }
.page-item.active .page-link { background-color: #04428f; border-color: #04428f; }
.page-item .page-link { color: #04428f; }
.page-item .page-link:focus, .page-item .page-link:hover { background-color: #ededed; color: #053a74; }

/* ************ */
/* *** POST *** */
/* ************ */

#single-wrapper { min-height: 40vh; }

/* ************************ */
/* *** FLEXIBLE CONTENT *** */
/* ************************ */

/* display_heading */
.displayHeadingSec h2 { color: #04428f; }
h2.heading-thin { font-weight: 300; }
h2.heading-bold { font-weight: 700; }
p.heading-regular { font-weight: 400; }
p.heading-bold { font-weight: 500; }

/* image_and_text */
.headingsGroup h4 { font-style: italic; font-weight: 300; }

/* double_text_column */
.doubleColumn { 
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
	-webkit-column-width: 250px;
	-moz-column-width: 250px;
	column-width: 250px; 
	-webkit-column-gap: 4em;
	-moz-column-gap: 4em;
	column-gap: 4em;
	-webkit-column-rule: 1px dotted #ddd;
	-moz-column-rule: 1px dotted #ddd;
	column-rule: 1px dotted #ddd;
}
.doubleColumn.no-seperator { -webkit-column-rule: none; -moz-column-rule: none; column-rule: none; }

/* contact_section */
.mapDiv { position: relative; height: 22vw; min-height: 250px; max-height: 380px; }
.mapDiv iframe { border:0; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; }
.equalBoxes .imgGalBox a { padding-bottom: 70%; background-size: cover; background-repeat: no-repeat; background-position: center center; }
.equalBoxes .imgGalBox.imgPos-top a { background-position: center top; }
.equalBoxes .imgGalBox.imgPos-bottom a { background-position: center bottom; }

/* image_gallery */
.imageGallerySec h3 { font-weight: 300; }
.imageGallerySec p { font-style: italic; font-weight: 300; }
.imgGalBox { max-width: 500px; }

/* Full Width Fade */
.fullWidthFade { position: relative; }
.fullWidthFade:before { content: ""; z-index: 0; position: absolute; top: 0; right: 0; bottom: 0; width: 100vw; opacity: 0.15; background-size: cover; background-position: 50%; background-repeat: no-repeat; }
.fullWidthFadeInner { position: relative; z-index: 1; }
@media (min-width: 768px) {
	.fullWidthFade:before { width: 50vw; background-position: 0 50%; opacity: 1; }
}

/* ************************ */
/* *** WP STORE LOCATOR *** */
/* ************************ */

#wpsl-wrap.mapOverlay #wpsl-gmap,
#wpsl-wrap.mapOverlay #wpsl-result-list { position: relative; }
#wpsl-wrap.mapOverlay #wpsl-gmap:after,
#wpsl-wrap.mapOverlay #wpsl-result-list:after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(255,255,255,0.8); }
#wpsl-wrap.mapOverlay:after { 
	content: "";
	position: absolute; top: 200px; left: 50%; z-index: 1;


  display: block;
  width: 60px;
  height: 60px;
  margin: 0 0 0 -30px;
  border-radius: 50%;
  border: 5px solid #04428f;
  border-color: #04428f transparent #04428f transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}






