/* HUMPHREYS SIGNS — SITE STYLES
   Base styles from theme.css are followed by site-specific and responsive
   overrides from site.css. The source order is retained to preserve the
   existing cascade.
*/

/*
Theme Name: Humphreys Signs
Theme URI: http://underscores.me/
Author: Colin Short
Author URI: http://colinshort.co.uk
Description: A custom WordPress theme using Bootstrap.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bootstrap2wordpress
Tags: 

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Humphreys Signs is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
    ## Posts and pages
	## Asides
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
# Theme Specific Styles
# Bootsnipp Slider Styles
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
    display: block;
}
@media screen and (min-width: 37.5em) {
    .menu-toggle {
        display: none;
    }
    .main-navigation ul {
        display: block;
    }
}
.list-inline>li {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px;
}
.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
    margin: 0 0 1.5em;
    overflow: hidden;
}
.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
    float: left;
    width: 50%;
}
.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
    float: right;
    text-align: right;
    width: 50%;
}
/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}
.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
    /* Above WP toolbar. */
}
/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
    outline: 0;
}
/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
    display: inline;
    float: left;
    margin-right: 1.5em;
}
.alignright {
    display: inline;
    float: right;
    margin-left: 1.5em;
}
.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
    content: "";
    display: table;
    table-layout: fixed;
}
.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
    clear: both;
}
/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
    margin: 0 0 5px;
    padding: 10px;
}
/* Make sure select elements fit in widgets. */
.widget select {
    max-width: 100%;
}
.widget-title {
    color: #007DC6;
}
.textwidget h4 {
    color: #007DC6;
}
#breadcrumbs {
    margin-bottom: 0;
}
/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
    display: block;
}
.hentry {
    margin: 0 0 1.5em;
}
.byline,
.updated:not(.published) {
    display: none;
}
.single .byline,
.group-blog .byline {
    display: inline;
}
.page-content,
.entry-content,
.entry-summary {
    margin: 10px 0 0;
}
.page-links {
    clear: both;
    margin: 0 0 1.5em;
}
.main-content h2 {
    text-align: left!important;
}
.main-content h2.intro-heading {
    text-align: center!important;
}
/*--------------------------------------------------------------
## Asides
--------------------------------------------------------------*/
.blog .format-aside .entry-title,
.archive .format-aside .entry-title {
    display: none;
}
/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
    word-wrap: break-word;
}
.bypostauthor {
    display: block;
}
/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation, /* Older / Newer Posts Navigation (always hidden) */
.infinite-scroll.neverending .site-footer {
    /* Theme Footer (when set to scrolling) */
    display: none;
}
/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
    display: block;
}
/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
    border: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
}
/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
    max-width: 100%;
}
/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
    margin-bottom: 1.5em;
    max-width: 100%;
}
.wp-caption img[class*="wp-image-"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.wp-caption .wp-caption-text {
    margin: 0.8075em 0;
}
.wp-caption-text {
    text-align: center;
}
/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
    margin-bottom: 1.5em;
}
.gallery-item {
    display: inline-block;
    text-align: center;
    vertical-align: top;
    width: 100%;
}
.gallery-columns-2 .gallery-item {
    max-width: 50%;
}
.gallery-columns-3 .gallery-item {
    max-width: 33.33%;
}
.gallery-columns-4 .gallery-item {
    max-width: 25%;
}
.gallery-columns-5 .gallery-item {
    max-width: 20%;
}
.gallery-columns-6 .gallery-item {
    max-width: 16.66%;
}
.gallery-columns-7 .gallery-item {
    max-width: 14.28%;
}
.gallery-columns-8 .gallery-item {
    max-width: 12.5%;
}
.gallery-columns-9 .gallery-item {
    max-width: 11.11%;
}
.gallery-caption {
    display: block;
}
/*------------------------------------------------------
	# Theme Specific Styles
 -------------------------------------------------------*/
/* COLOUR REFERENCES

Lt Blue:	#007DC6

*/
/*
Forces carousel image to be 100% width and not max width of 100%
*/
.carousel-item .img-fluid {
    width: 100%;
    height: 100%;
}
/* hide overflow on larger images */
.clearfix {
    overflow: auto;
}
/* 
anchors are inline so you need ot make them block to go full width
*/
.carousel-item a {
    display: block;
    width: 100%;
}
.hs-carousel-outer {
    background-color: #007DC6;
}
.hs-slide-ht {
    height: 100%;
    padding: 0 15% 15% 15%;
    text-align: center;
    color: white;
}
.slide-left {
    margin: 0 0 0 0;
}
.carousel-p {
    padding: 0 0 0 0;
}
.hs-slide-h1 {
    font-size: 1.75em;
    color: white;
}
/* === GENERAL === */
html, body {
    width: auto!important;
    overflow-x: hidden!important
}
body {
    /*margin-top: 50px;*/
    font-family: "proxima-nova", "Raleway", Helvetica, sans-serif;
    font-size: 16px;
    background: url('../images/theme/tile.jpg') top left repeat;
}
.logged-in .navbar-fixed-top {
    top: 32px;
}
.navbar {
    min-height: 110px;
}
.navbar-brand, .navbar-nav li a {
    padding: 0 15px;
}
.navbar-brand img {
    padding: 15px;
}
.navbar-toggle {
    margin-top: 23px;
    padding: 25px 10px !important;
}
.navbar-nav > li.current_page_item a, .navbar-nav > li.current_page_parent a {
    color: #007DC6;
}
.navbar-nav > li a, .navbar-nav > li a {
    color: #007DC6;
}
/* === GLOBAL === */
h1,h2,h3,h4,h5,h6 {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
    font-weight: bold;
}
h1 {
    font-size: 3em;
    color: #007DC6;
}
h1 small {
    color: white;
}
/*h3 {
	margin: 20px 0;
}*/
h4 {
    font-size: 18px;
}
p {
    margin: 0 0 15px;
}
p.lead {
    font-weight: normal;
}
p a:link {
    color: #007DC6;
}
p a:visited {
    color: #007DC6;
}
p a:hover {
    color: darkblue;
}
p a:active {
    color: #007DC6;
}
img {
    max-width: 100%;
}
.modal-content {
    background: url('../images/theme/tile.jpg') top left repeat;
}
blockquote {
    padding: 0;
    border: none;
    font-style: italic;
    text-align: left;
}
blockquote cite {
    display: block;
    color: #777;
    margin: 15px 0 0 0;
}
blockquote:before {
    display: none;
}
/*Added Back in for testing and housekeeping */
#primary {
    padding: 12px 12px 15px 12px;
    padding-top: 12px;
    padding-bottom: 5px
}
#primary h2 {
    color: #007DC6;
}
/* DEFAULT PAGE TEMPLATE (PAGE.PHP) */
.entry-footer {
    background: none;
}

/* Counter section */
/* === EXPERIENCE COUNTERS === */
.stats-section {
	padding: 25px 0 40px;
}

.stats-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.stat-card {
	padding: 22px 15px;
	border-top: 4px solid #007DC6;
	background: #f5f8fa;
	text-align: center;
}

.stat-value {
	color: #007DC6;
	font-size: 2.5rem;
	font-weight: 700;
	line-height: 1.2;
}

.stat-card p {
	margin: 8px 0 0;
	font-size: 1rem;
}

@media (max-width: 600px) {
	.stats-grid {
		grid-template-columns: 1fr;
		gap: 12px;
	}
}

/* === SIGN CATEGORY CARDS === */
.service-categories {
    padding-top: 34px;
    padding-bottom: 48px;
}
.service-categories-heading {
    margin: 0 auto 26px;
    text-align: center;
}

.service-categories-heading h2 {
    margin-bottom: 8px;
    color: #007DC6;
    font-size: 2rem;
}
.service-categories-heading p {
    margin: 0;
    color: #555555;
}
.service-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}
.service-card {
    position: relative;
    display: flex;
    min-height: 250px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #333333;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
}
.service-card::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .2), rgba(0, 0, 0, .67));
    content: "";
    transition: background-color .2s ease;
}
.service-card img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
}
.service-card-copy {
    position: relative;
    z-index: 1;
    display: flex;
    max-width: 90%;
    flex-direction: column;
    align-items: center;
    gap: 9px;
    padding: 24px 14px;
    color: #ffffff;
}
.service-card-copy strong {
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
}
.service-card-copy > span:not(.service-card-rule) {
    font-size: .96rem;
    line-height: 1.4;
}
.service-card-rule {
    width: 42px;
    height: 3px;
    margin-top: 2px;
    background: #00a6d6;
}
.service-card:hover,
.service-card:focus-visible {
    color: #ffffff;
    text-decoration: none;
}
.service-card:hover img,
.service-card:focus-visible img {
    transform: scale(1.04);
}
.service-card:focus-visible {
    outline: 3px solid #007DC6;
    outline-offset: 3px;
}
.intro-moon-lander {
	width: 46px;
	max-width: 12vw;
	height: auto;
	margin-left: 6px;
	vertical-align: middle;
}
/* === ESTATE AGENT BOARDS AND BOARD TYPES SECTION === */
#estateagents {
    text-align: center;
    background: url('../images/theme/slide-estate-agent-min.jpg') center center repeat fixed;
    background-size: 1200px;
    color: white;
    padding: 50px 0;
}
#estateagents h2 {
    font-size: 4em;
    font-weight: 400;
    text-shadow: 3px 3px 5px black;
}
#estateagents h3 {
    font-weight: 400;
    text-shadow: 3px 3px 5px black;
    margin: 20px;
}
#estateagents a:link {
    text-decoration: none;
    color: white;
}
#estateagents a:hover {
    color: #007DC6;
}
.board-types {
    display: flex;
    height: auto;
    flex-flow: row wrap;
    justify-content: space-around;
    align-items: center;
    padding: 10px 0 10px 0;
    background-color: #007DC6;
}
.board-types img {
    width: auto;
    /*padding-bottom: 10px;*/
    align-self: center;
}
.ind-board-type {
    display: flex;
    flex-flow: row nowrap;
    max-width: 110px;
    justify-content: center;
    flex-basis: 110px;
    flex-grow: 0;
    flex-shrink: 0;
    /*height: 200px;*/
}
/* === POPULAR PRODUCTS SECTION === */
.outer-block {
    background: white;
    border-style: solid;
    border-width: thin;
    border-color: #007DC6;
    margin: 15px 0 15px 0;
    padding: 5px 0 5px 0;
}
.outer-block h2 {
    color: #007DC6;
}
#pop-prod-wrapper {
    background: white;
    display: flex;
    height: auto;
    flex-flow: row wrap;
    justify-content: space-around;
}
.pop-product-box {
    background: #007DC6;
    flex: 0 0 150px;
    height: 130px;
    margin: 10px;
    padding: 5px 0 5px 0;
    flex-flow: column nowrap;
    align-items: center;
    overflow: hidden;
    border-radius: 10px;
}
.pop-product-box h3 {
    text-align: center;
    font-size: 1em;
    color: white;
}
.img-pop-prod {
    width: 90%;
    margin-bottom: 3px;
    margin-top: 0;
    background: white;
    border-radius: 5px;
    height: 97%;
}
.pop-prod-heading a:link, a:visited {
    color: white;
}
.pop-prod-heading a:link {
    color: white;
}
.pop-prod-heading a:visited {
    color: white;
}
.pop-prod-heading a:hover {
    color: darkturquoise;
}
.pop-prod-heading a:active {
    color: white;
}
/* Event Signage Section */
#event-signs {
    text-align: center;
    background: url('../images/theme/event-signage-min.jpg') center center repeat fixed;
    background-size: 1200px;
    color: white;
    padding: 50px 0;
}
#event-signs h2 {
    font-size: 4em;
    text-shadow: 3px 3px 5px black;
}
#event-signs h3 {
    font-weight: 400;
    text-shadow: 3px 3px 5px black;
    margin: 25px;
}
#event-signs a:link {
    text-decoration: none;
    color: white;
}
#event-signs a:hover {
    color: #007DC6;
}
/* CORREX SPECIALIST SECTION */
.correx-outer {
    justify-content: space-around;
    align-items: center;
    background: url('../images/theme/correx-tile.png') top left repeat;
    flex-flow: row wrap;
    margin: 5px 0 5px 0;
}
.correx-text {
    padding: 15px 0 15px 0;
    justify-content: center;
    align-items: center;
    flex-flow: column wrap;
    text-align: center;
    flex: 0 3 800px;
}
.correx-text h4 {
    color: #007DC6;
}
.cx-list {
    width: 80%;
}

.board-types {
    display: flex;
    height: auto;
    flex-flow: row wrap;
    justify-content: space-around;
    align-items: center;
    padding: 10px 0 10px 0;
    background-color: #007DC6;
}
.board-types img {
    width: auto;
    /*padding-bottom: 10px;*/
    align-self: center;
}
.ind-board-type {
    display: flex;
    flex-flow: row nowrap;
    max-width: 110px;
    justify-content: center;
    flex-basis: 110px;
    flex-grow: 0;
    flex-shrink: 0;
    /*height: 200px;*/
}

/* === SAFETY SIGNAGE FEATURE === */
.safety-feature {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
	align-items: center;
	gap: 36px;
	padding-top: 40px;
	padding-bottom: 40px;
}

.safety-feature-image img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.safety-feature-copy h2 {
	color: #007DC6;
}

.safety-feature-copy a {
	color: #007DC6;
	font-weight: 700;
}

@media (max-width: 767px) {
	.safety-feature {
		grid-template-columns: 1fr;
		gap: 22px;
		text-align: center;
	}

	.safety-feature-image {
		width: 100%;
		max-width: 440px;
		margin: 0 auto;
	}
}

/* === ELECTION SIGNAGE FEATURE === */
.election-feature {
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	grid-template-areas: "copy image";
}

.election-feature .safety-feature-image {
	grid-area: image;
}

.election-feature .safety-feature-copy {
	grid-area: copy;
}

@media (max-width: 767px) {
	.election-feature {
		grid-template-columns: 1fr;
		grid-template-areas:
			"image"
			"copy";
	}
}



/* CALL US / CONTACT SECTION */

#call-us {
    padding: 0px 0 10px 0;
    background-color: darkorange;
    text-align: center;
    color: white;
    margin-bottom: 0px;
	margin-top: 30px;
}
#call-us h1 {
    margin-top: 10px;
}
#call-us h3 {
    margin-top: 10px;
}
#call-us a:link {
    text-decoration: none;
    color: white;
}
#call-us a:hover {
    color: white;
}
/* PRICE LIST SECTION */
#price-list-parent {
    display: flex;
    flex-flow: row wrap;
    background: url('../images/theme/correx-tile.png') top left repeat;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 15px 0 15px 0;
}
.price-list-icon {
    display: flex;
    flex: 0 0 185px;
    justify-content: center;
    padding: 10px;
}
/* TESTIMONIALS SECTION */

}

#kudos {
	text-align: center;
}
#kudos h2 {
	margin: 30px 0 20px;
	margin-bottom: 20px;
}
.testimonial {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	margin-bottom: 30px;
	margin: 5px 0 5px 0;
	background-color: white;
	padding: 10px 5px 10px 5px;
	border-style: solid;
	border-width: thin;
	border-color: darkgray;
	border-radius: 10px;
}
	.testimonial blockquote {
		margin-bottom: 0;
	}
.avatar-circle {
	/*width: 100px;*/
	flex: 0 0 80px;
	height: 80px;
	justify-content: center;
	align-items: center;
	/*margin-top: 10px;
	margin-right: 25px;
	margin-left: 70px;*/
	text-align: center;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
}

.initials {
	/*position: relative;*/
	/*top: 25px; /* 25% of parent */
	font-size: 40px; /* 50% of parent */
	/*line-height: 50px; /* 50% of parent */
	color: #fff;
	font-family: "Courier New", monospace;
	font-weight: bold;
}

.testimonial img {
	width: 150px;
	height: 150px;
/*	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%*/
}

/* HISTORY / ABOUT HS SECTION */
/*History Section */
#history {
    background-image: 
    linear-gradient(
    rgba(0, 0, 0, 0.3),
    rgba(0, 0, 0, 0.3)
    ),
    url('../images/theme/moon-texture.jpg');
    position: relative;
    left 0;
    top: 0;
    background-size: auto;
    padding: 100px 0;
    overflow: hidden;
    color: white;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizelegibility;
    margin-top: 15px;
}
.moon-landing-div {
    min-height: 490px;
    display: flex;
    align-items: center;
}
img.moon-landing {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 65%;
}
.about-section {
    padding: 0 5% 0 5%;
}
.about-section h1 {
    color: white;
}
/* FOOTER SECTION */
footer {
    background: #007DC6;
    color: white;
    padding: 20px 0 10px;
    font-size: 12px;
}
footer p {
    margin: 0;
}
footer a:link, footer a:visited {
    color: white;
}
footer a:hover {
    color: white;
    font-weight: 600;
}
/* CONTACT PAGE SECTION */
.feature-image {
    display: table;
    width: 100%;
    padding: 150px 0;
}
.feature-image-default {
    background: url('../images/theme/humphreys-premises_snow2.jpg') no-repeat;
    background-size: cover;
}
.feature-image-default-alt {
    background: url('../images/theme/hipster-stuff.jpg') no-repeat;
    background-size: cover;
}
.feature-image h1 {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    color: white;
}
/* === blog === */
.post, .widget, #comments {
    position: relative;
    border: solid 1px #ddd;
    background: white;
    margin: 0 0 20px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px:
    border-radius: 4px;
}
.post header,
.post .post-excerpt,
.post .post-body,
#comments .comments-wrap {
    padding: 20px;
}
.post header h1,
.post header h3 {
    margin: 0 0 15px;
    padding: 0 0 15px;
    border-bottom: solid 1px #ddd;
}
.post header h1 {
    font-size: 24px;
}
.post-image img {
    height: auto;
}
.post-details {
    font-size: 12px;
    width: 90%
}
.post-details  i.fa {
    padding-left: 10px;
}
.post-details i.fa:first-child {
    padding: 0;
}
/* === COMMENTS === */
.post-comments-badge {
    height: 70px;
    width: 70px;
    position: absolute;
    top: 25px;
    right: 20px;
    border: none;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    background: #79b044;
    text-align: center;
    display: table;
}
.post-comments-badge a {
    display: table-cell;
    vertical-align: middle;
    color: white;
    font-size: 20px;
    line-height: 20px;
}
.post-comments-badge i.fa {
    display: block;
    font-size: 15px;
    padding: 0;
    margin-bottom: 4px;
}
.post-comments-badge:hover {
    background-color: #8bc653;
}
#comments h3 {
    text-align: center;
}
#comments h4 {
    font-size: 1.3em;
}
#comments ol {
    list-style: none;
    padding: 0;
    margin: 0;
}
#comments ol li {
    background: rgba(0,0,0,0.02);
    padding: 10px 20px;
    margin: 10px 0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: solid 1px rgba(0,0,0,0.03);
}
#comments ol li ol.children {
    padding: 0;
    list-style: none;
    font-size: 0.96em;
}
#leave-comment {
    margin: 40px 0 0;
    padding: 20px 0 0;
    border-top: solid 1px #eee;
}
.entry-title h3 {
    color: #007DC6;
}
.entry-title a {
    #007DC6;
}
/* === SPECIFIC WORDPRESS COMMENT STYLES === */
#comments footer {
    background: none;
    color: inherit;
}
#comments footer a {
    color: inherit;
}
#comments .comment-metadata {
    margin: 10px 0 0;
}
.entry-title a:link, a:visited, a:active {
    color: #007DC6;
}
.entry-title a:hover {
    color: darkblue;
}
.entry-title {
    font-size: 2em;
}
/*MEDIA QUERIES */
@media only screen and (max-device-width : 1024px) {
    .moon-landing-div {
        min-height: auto;
        display: flex;
        align-items: center;
    }
    img.moon-landing {
        width: 85%;
    }
    #history {
        padding-bottom: 20px;
    }
}
@media only screen and (min-device-width: 668px) {
    .carousel-inner .item {
        position: relative;
        max-height: 100%;
    }
    .current-menu-item {
        font-weight: 600;
    }
    .hs-carousel-outer {
        height: 100%;
        background-color: #007DC6;
    }
    .hs-slide-ht {
        height: 100%;
        padding: 0 0 0 0;
    }
    .slide-left {
        margin: 0 0 0 0;
    }
    .carousel-p {
        padding: 0 15% 0 15%;
    }
    .hs-slide-h1 {
        font-size: 3em;
    }
}
@media only screen and (max-device-width : 768px) {
    .testimonial img {
        padding: 0px;
        height: 100%;
        width: 100%;
    }
    .testimonial {
        margin-bottom: 15px;
    }
    #kudos h2 {
        margin-bottom: 15px;
    }
    .avatar-circle {
        /*display: block;*/
        margin-left: auto;
        margin-right: auto;
        width: 100px;
        height: 100px;
        margin-bottom: 15px;
        text-align: center;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
    }
    img.moon-landing {
        width: 40%;
    }
}
@media only screen and (max-device-width : 660px) {
    .testimonial img {
        padding: 5px;
        height: 75px;
        width: 75px;
    }
    .testimonial {
        margin-bottom: 15px;
    }
    #call-us {
        padding-left: 15px;
        padding-right: 15px;
    }
    #history {
        padding: 20px 10px 5px 10px;
        background-size: auto 100%;
    }
    .moon-landing-div {
        min-height: auto;
        display: flex;
        align-items: center;
    }
    img.moon-landing {
        width: 40%;
    }
    .about-section h1 {
        font-size: 1.5em;
        text-align: center;
        margin-top: 5px;
    }
    .navbar {
        min-height: 60px;
    }
    .navbar-brand {
        padding: 0 15px;
        height: 60px;
    }
    .navbar-brand img {
        height: 45px;
        padding: 0px 0 6px 0;
    }
    .navbar-toggle {
        /* (80px - button height 34px) / 2 = 23px */
        margin-top: 7px;
        padding: 10px 10px !important;
    }
    .navbar-brand, .navbar-nav li a {
        line-height: 40px;
        height: 40px;
        padding-top: 5px;
    }
    .logged-in .navbar-fixed-top {
        top: 46px;
    }
}
@media only screen and (max-device-width : 480px) {
    .hs-slide-h1 {
        font-size: 1.8em;
    }
    .hs-slide-ht {
        padding: 0;
    }
    .carousel-item .container {
        height: 475px;
    }
    .slide-left {
        padding-bottom: 0;
        margin: 2% 0 2% 0;
    }
    #estateagents h2 {
        margin-left: 20px;
        margin-right: 20px;
    }
    #event-signs h2 {
        margin-left: 20px;
        margin-right: 20px;
    }
    .pop-product-box {
        margin: 5px 0 5px 0;
        flex: 0 0 140px;
    }
    .pop-product-box h3 {
        font-size: .9em;
    }
    /* icon images below banner ads */
    .ind-board-type {
        max-width: 90px;
        flex-basis: 90px;
    }
}
@media only screen and (max-device-width : 330px) {
    #primary h2 {
        font-size: 1.6rem;
    }
}

/* SITE-SPECIFIC ADDITIONS AND RESPONSIVE OVERRIDES */

img {
    max-width: 100%;
    height: auto
}
.navbar-brand img {
    max-width: 290px
}
.navbar-nav {
    list-style: none;
    gap: 4px;
    align-items: center
}
.nav-item {
    position: relative
}
.submenu-toggle {
    background: transparent;
    border: 0;
    color: #16689b;
    padding: 4px 8px;
    cursor: pointer
}
.dropdown>.nav-link {
    display: inline-block
}
.submenu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    list-style: none;
    min-width: 220px;
    padding: 12px;
    z-index: 20;
    box-shadow: 0 4px 16px #0002
}
.dropdown.open>.submenu {
    display: block
}
.submenu .submenu {
    left: 100%;
    top: 0
}
.static-gallery {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 12px;
    margin: 24px 0
}
.static-gallery img {
    width: 100%;
    height: 180px;
    object-fit: contain;
    background: #f3f3f3
}
.static-gallery a {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px
}
.main-content {
    padding-top: 30px;
    padding-bottom: 35px;
    overflow-wrap: anywhere
}
article iframe {
    max-width: 100%
}
article table {
    max-width: 100%
}
#enquiry-form label {
    display: block;
    margin: 16px 0
}
#enquiry-form input,#enquiry-form textarea {
    display: block;
    width: 100%;
    padding: 10px;
    border: 1px solid #777;
    border-radius: 3px
}
#form-status {
    margin-top: 12px
}
dialog {
    max-width: 95vw;
    max-height: 95vh;
    border: 0;
    padding: 20px;
    box-shadow: 0 8px 30px #0007;
    text-align: center
}
dialog::backdrop {
    background: #000c
}
dialog img {
    display: block;
    max-width: 85vw;
    max-height: 72vh;
    margin: auto
}
#close-lightbox {
    position: absolute;
    right: 0;
    top: 0;
    font-size: 28px;
    background: white;
    border: 0;
    cursor: pointer
}
button:focus-visible,a:focus-visible {
    outline: 3px solid #e78b10;
    outline-offset: 3px
}
.carousel-indicators li {
    cursor: pointer
}
.carousel-item {
    display: none
}
.carousel-item.active {
    display: block
}
.carousel-control-prev,.carousel-control-next {
    cursor: pointer
}
.skip-link:focus {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    padding: 10px;
    background: white
}
.price-lists li {
    margin: 14px 0
}
footer .list-inline .nav-item {
    display: inline-block
}
footer .nav-link {
    padding: 6px
}
.navbar-nav .nav-link {
    white-space: nowrap
}
@media(max-width:991px) {
    #site-menu {
        display: none;
        width: 100%;
        align-items: stretch;
        padding: 16px 0
    }
    #site-menu.open {
        display: flex
    }
    .submenu {
        position: static;
        box-shadow: none;
        border-left: 2px solid #007dc6;
        margin-left: 12px
    }
    .submenu .submenu {
        position: static
    }
    .hs-slide-ht {
        height: auto!important;
        min-height: 250px;
        padding: 25px 0
    }
    .slide-left {
        max-height: 300px;
        width: auto;
        display: block;
        margin: auto
    }
    .navbar-brand img {
        max-width: 230px
    }
}
@media(max-width:600px) {
    .static-gallery {
        grid-template-columns: repeat(2,minmax(0,1fr))
    }
    .static-gallery img {
        height: 140px
    }
    .hs-slide-h1 {
        font-size: 32px!important
    }
    .carousel-p {
        font-size: 18px!important
    }
    .navbar-brand img {
        max-width: 200px
    }
    #estateagents,#event-signs {
        background-attachment: scroll!important
    }
    .hs-slide-ht .col-md-6 {
        text-align: center
    }
    .main-content table {
        display: block;
        overflow-x: auto
    }
}
@media(max-width:767px) {
    .service-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }
    .service-card {
        min-height: 220px;
    }
}
@media(max-width:560px) {
    .service-categories {
        padding-top: 26px;
        padding-bottom: 32px;
    }
    .service-categories-heading h2 {
        font-size: 1.65rem;
    }
    .service-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .service-card {
        min-height: 230px;
    }
}
@media(prefers-reduced-motion:reduce) {
    *,*:before,*:after {
        scroll-behavior: auto!important;
        animation: none!important;
        transition: none!important
    }
}
/* Horizontal carousel with seamless wrap from last slide to first. */
#humphreys-carousel .carousel-inner {
    overflow: hidden
}
#humphreys-carousel .carousel-track {
    display: flex;
    width: 100%;
    transition: transform 650ms cubic-bezier(.22,.61,.36,1);
    will-change: transform
}
#humphreys-carousel .carousel-track>.carousel-item {
    display: block!important;
    flex: 0 0 100%;
    width: 100%;
    float: none;
    position: relative;
    transition: none
}
@media(prefers-reduced-motion:reduce) {
    #humphreys-carousel .carousel-track {
        transition: none
    }
}


/* === HOMEPAGE FEATURE CAROUSEL === */
/* Desktop: use the slide image as a full-height background with centred copy. */
#humphreys-carousel {
    --carousel-blue: #007DC6;
    --carousel-deep-blue: #004f83;
    --carousel-slide-height: clamp(460px, 42vw, 660px);
    position: relative;
    background: var(--carousel-blue);
    color: #ffffff;
}

#humphreys-carousel .carousel-inner {
    overflow: hidden;
}

#humphreys-carousel .hs-slide {
    position: relative;
    display: flex;
    min-height: var(--carousel-slide-height);
    align-items: center;
    justify-content: center;
    overflow: hidden;
    isolation: isolate;
    background: linear-gradient(135deg, var(--carousel-blue), var(--carousel-deep-blue));
}

#humphreys-carousel .hs-slide-image {
    position: absolute;
    z-index: -2;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: contain;
    object-position: center;
}

#humphreys-carousel .hs-slide--photo .hs-slide-image {
    object-fit: cover;
    object-position: center 42%;
}

#humphreys-carousel .hs-slide--photo::after {
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(90deg, rgba(0, 25, 45, .24), rgba(0, 25, 45, .55), rgba(0, 25, 45, .24));
    content: "";
}

#humphreys-carousel .hs-slide-content {
    display: flex;
    width: 100%;
    min-height: var(--carousel-slide-height);
    align-items: center;
    justify-content: center;
    padding: 64px 12%;
    text-align: center;
}

#humphreys-carousel .hs-slide-copy {
    max-width: 820px;
    padding: 20px 30px;
    border-radius: 4px;
    background: rgba(0, 48, 82, .66);
    box-shadow: 0 3px 18px rgba(0, 0, 0, .16);
}

#humphreys-carousel .hs-slide-h1 {
    margin: 0 0 12px;
    color: #ffffff;
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1.12;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .25);
}

#humphreys-carousel .hs-slide-copy a {
    color: #ffffff;
    text-decoration: none;
}

#humphreys-carousel .hs-slide-copy a:hover,
#humphreys-carousel .hs-slide-copy a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 4px;
}

#humphreys-carousel .hs-slide-copy p {
    margin: 0;
    color: #ffffff;
    font-size: clamp(1rem, 1.6vw, 1.25rem);
    line-height: 1.55;
}

#humphreys-carousel .carousel-indicators {
    z-index: 5;
    margin-bottom: 18px;
}

#humphreys-carousel .carousel-control-prev,
#humphreys-carousel .carousel-control-next {
    z-index: 6;
}

/* Mobile: show each image first, followed by its caption. */
@media (max-width: 767.98px) {
    #humphreys-carousel {
        --carousel-slide-height: auto;
    }

    #humphreys-carousel .hs-slide {
        display: flex;
        min-height: 0;
        flex-direction: column;
        justify-content: flex-start;
        background: var(--carousel-deep-blue);
    }

    #humphreys-carousel .hs-slide-image {
        position: relative;
        z-index: 0;
        inset: auto;
        width: 100%;
        height: 230px;
        flex: 0 0 230px;
        object-fit: contain;
        background: linear-gradient(135deg, var(--carousel-blue), var(--carousel-deep-blue));
    }

    #humphreys-carousel .hs-slide--photo .hs-slide-image {
        height: clamp(205px, 58vw, 320px);
        flex-basis: clamp(205px, 58vw, 320px);
        object-fit: cover;
        object-position: center 42%;
    }

    #humphreys-carousel .hs-slide--photo::after {
        content: none;
    }

    #humphreys-carousel .hs-slide-content {
        min-height: 190px;
        padding: 30px 48px 44px;
        background: linear-gradient(135deg, var(--carousel-blue), var(--carousel-deep-blue));
    }

    #humphreys-carousel .hs-slide-copy {
        padding: 0;
        background: transparent;
        box-shadow: none;
    }

    #humphreys-carousel .hs-slide-h1 {
        margin-bottom: 8px;
        font-size: clamp(1.75rem, 7vw, 2.25rem);
    }

    #humphreys-carousel .hs-slide-copy p {
        font-size: 1rem;
    }

    #humphreys-carousel .carousel-indicators {
        margin-bottom: 10px;
    }

    #humphreys-carousel .carousel-control-prev,
    #humphreys-carousel .carousel-control-next {
        width: 12%;
    }
}

@media (prefers-reduced-motion: reduce) {
    #humphreys-carousel .carousel-track {
        transition: none;
    }
}
#lightbox:not([open]) {
	display: none !important;
}
/* Modern image lightbox */
#lightbox {
    position: relative;
    width: min(1100px, 94vw);
    max-width: 94vw;
    max-height: 94vh;
    padding: 56px 64px 24px;
    border: 0;
    border-radius: 10px;
    background: #111;
    color: #fff;
    box-shadow: 0 16px 60px rgba(0, 0, 0, 0.5);
    text-align: center;
}

#lightbox::backdrop {
    background: rgba(0, 0, 0, 0.88);
}

#lightbox img {
    display: block;
    max-width: 100%;
    max-height: 75vh;
    margin: 0 auto;
    object-fit: contain;
}

#lightbox p {
    margin: 14px 0 0;
    color: #ddd;
}

/* Close button */
#close-lightbox {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
}

/* Previous and Next arrows */
#previous-image,
#next-image {
    position: absolute;
    top: 50%;
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
    font-size: 0;
    cursor: pointer;
    transform: translateY(-50%);
    transition: background-color 0.2s ease;
}

#previous-image {
    left: 12px;
}

#next-image {
    right: 12px;
}

#previous-image::before,
#next-image::before {
    font-size: 32px;
    line-height: 1;
}

#previous-image::before {
    content: "‹";
}

#next-image::before {
    content: "›";
}

#close-lightbox:hover,
#previous-image:hover,
#next-image:hover {
    background: #007DC6;
}

@media (max-width: 600px) {
    #lightbox {
        width: 100vw;
        max-width: 100vw;
        max-height: 100vh;
        padding: 56px 12px 20px;
        border-radius: 0;
    }

    #lightbox img {
        max-height: 72vh;
    }

    #previous-image {
        left: 8px;
    }

    #next-image {
        right: 8px;
    }
}
/* === GALLERY PREVIEW === */
.gallery-preview {
    padding-top: 50px;
    padding-bottom: 50px;
}

.gallery-preview-intro {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
    margin-bottom: 25px;
}

.gallery-preview-eyebrow {
    margin-bottom: 6px;
    color: #007DC6;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.gallery-preview-intro h2 {
    margin-top: 0;
    margin-bottom: 10px;
    color: #007DC6;
}

.gallery-preview-intro p {
    margin-bottom: 0;
}

.gallery-preview-link {
    flex-shrink: 0;
    display: inline-block;
    padding: 12px 18px;
    border-radius: 4px;
    background-color: #007DC6;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.2s ease;
}

.gallery-preview-link:hover,
.gallery-preview-link:focus {
    background-color: #005f96;
    color: #fff;
    text-decoration: none;
}

.gallery-preview-link span {
    margin-left: 6px;
}

.gallery-preview-images {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.gallery-preview-images a {
    display: block;
    overflow: hidden;
    border-radius: 5px;
    background-color: #eee;
}

.gallery-preview-images img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    transition: transform 0.25s ease;
}

.gallery-preview-images a:hover img,
.gallery-preview-images a:focus img {
    transform: scale(1.04);
}

@media (max-width: 767px) {
    .gallery-preview-intro {
        align-items: flex-start;
        flex-direction: column;
        gap: 18px;
    }

    .gallery-preview-images {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}
