/*
 * Additions on top of the original theme (theme.css, unchanged apart from removing an
 * Internet Explorer-only hack). Covers the styles that used to be inline in concrete5
 * blocks, plus replacements for the jQuery plugins.
 */

/* Page fade-in on load (the old site hid the body and faded it in with jQuery). */
@keyframes ec-fade-in { from { opacity: 0; } to { opacity: 1; } }
body { animation: ec-fade-in 900ms ease-out; }
@media (prefers-reduced-motion: reduce) { body { animation: none; } }

.logo-link { display: inline-block; text-decoration: none; }

/* Home page: from the original block styles. */
#blockStyle152fullside33 { background-repeat: no-repeat; }
.cycle-wrap a { text-decoration: none; color: black; }

/* Home page slider (replaces jQuery Cycle): slides stacked in one grid cell, cross-faded. */
.cycle-wrap { display: grid; }
.cycle-wrap > .slide {
  grid-area: 1 / 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity 2000ms ease, visibility 0s linear 2000ms;
}
.cycle-wrap > .slide.is-active {
  opacity: 1;
  visibility: visible;
  transition: opacity 2000ms ease, visibility 0s;
  z-index: 1;
}
.cycle-wrap .wrapThis { width: 100%; }
@media (prefers-reduced-motion: reduce) {
  .cycle-wrap > .slide, .cycle-wrap > .slide.is-active { transition: none; }
}

/* Service page galleries: from the original Bootstrap Lightbox block. */
.galImgWidth { max-height: 129px; }
.thumbnail {
  width: 149px;
  height: 131px;
  margin: 6px 11px;
  float: none;
  border: 1px solid #00A3F7;
  background: black;
  display: inline-block;
  padding: 0;
  line-height: 126px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
  transition: all 0.2s ease-in-out;
}
.gallery { text-align: center; }

/* Lightbox (replaces prettyPhoto). */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.85);
}
.lightbox[hidden] { display: none; }
.lightbox-img {
  max-width: calc(100vw - 120px);
  max-height: calc(100vh - 80px);
  border: 4px solid #fff;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.6);
  background: #fff;
}
.lightbox button {
  position: absolute;
  border: 0;
  background: rgba(0, 0, 0, 0.4);
  color: #fff;
  font: 40px/1 Arial, Helvetica, sans-serif;
  cursor: pointer;
  padding: 8px 14px;
  border-radius: 4px;
}
.lightbox button:hover, .lightbox button:focus-visible { background: #00a3ea; }
.lightbox button[hidden] { display: none; }
.lightbox-close { top: 12px; right: 12px; }
.lightbox-prev { left: 12px; top: 50%; transform: translateY(-50%); }
.lightbox-next { right: 12px; top: 50%; transform: translateY(-50%); }
.lightbox-open, .lightbox-open body { overflow: hidden; }
@media (max-width: 479px) {
  .lightbox-img { max-width: calc(100vw - 24px); }
}

/* Contact page. */
.googleMapCanvas { width: 100%; border: 0; height: 400px; }
.contact-page-form .field-website { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.contact-page-form .captcha { margin: 10px 0; min-height: 65px; }
.form-status {
  padding: 10px;
  border: 1px solid #00a3ea;
  background: #e6f6fd;
  color: #000;
}
.form-status.is-error { border-color: #c00; background: #fdeaea; }

/* ---------------------------------------------------------------------------
 * Light refresh (Oct 2026): readability and polish, same design.
 * ------------------------------------------------------------------------- */

/* Readable body text: the theme used 12px with fixed 20px line spacing. */
.C5wrap #pageType-default,
.C5wrap #pageType-subpage,
.C5wrap .contact-us-section { font-size: 15px; line-height: 1.6; color: #222; }
.C5wrap #pageType-default p,
.C5wrap #pageType-subpage p { font-size: 15px; line-height: 1.6; margin-bottom: 14px; }
.C5wrap #pageType-default li,
.C5wrap #pageType-subpage li { font-size: 15px; line-height: 1.6; margin-bottom: 4px; }
.C5wrap #pageType-default td { font-size: inherit; line-height: inherit; }
.C5wrap #pageType-subpage h2 { display: block; margin: 18px 0 6px; }
.C5wrap #pageType-subpage h3 { margin: 14px 0 4px; line-height: 1.4; }
.call-us { text-align: center; margin-top: 22px; font-size: 16px; }

/* Header: with the tagline gone, centre the menu bar next to the logo (desktop). */
@media (min-width: 768px) {
  .C5wrap .HFS .topglobal { display: flex; align-items: center; }
  .C5wrap .HFS .topglobal::before,
  .C5wrap .HFS .topglobal::after { display: none; }
  .C5wrap .HFS .topglobal > .w-col { float: none; }
  .C5wrap .HFS .nav-bar { margin-top: 0; }
  .C5wrap .HFS .nav-bar-pad { margin-top: 0; border-width: 2px; border-radius: 11px; }
  .C5wrap .HFS .nav-link { font-size: 15px; }
}

/* Footer company details. */
.C5wrap .HFS .footer-text { font-size: 12px; line-height: 1.5; padding: 8px 0; }

/* Contact form: match the site's blue buttons and give the fields room. */
.contact-page-form .field { margin-bottom: 10px; }
.contact-page-form .field label { display: block; margin-bottom: 3px; }
.contact-page-form input[type="text"],
.contact-page-form input[type="email"],
.contact-page-form input[type="tel"],
.contact-page-form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 7px 9px;
  border: 1px solid #9a9a9a;
  border-radius: 4px;
  background: #fff;
  font: inherit;
  font-size: 15px;
}
.contact-page-form textarea { min-height: 110px; resize: vertical; }
.contact-page-form input:focus,
.contact-page-form textarea:focus { border-color: #00a3ea; outline: 2px solid rgba(0, 163, 234, 0.3); outline-offset: 0; }

.C5wrap .contact-us-section .submit,
.button-link {
  display: inline-block;
  width: auto !important;
  height: 40px !important;
  padding: 0 28px !important;
  border: 1px solid #000;
  border-radius: 4px;
  background: #00a3ea linear-gradient(#00a3ea, #028cc7) !important;
  box-shadow: #fff 0 0 2px 1px inset;
  color: #fff !important;
  font-family: 'Times New Roman', Times, serif;
  font-size: 16px !important;
  line-height: 38px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: all 300ms ease;
}
.C5wrap .contact-us-section .submit:hover,
.button-link:hover {
  background: #b4e5fa linear-gradient(#c5ecfc, #b4e5fa) !important;
  border-color: #6e6e6e;
  color: #000 !important;
}
.C5wrap .contact-us-section .submit:disabled { opacity: 0.6; cursor: wait; }

/* Colour chart page. */
.swatches { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 18px; }
.swatches span { width: 34px; height: 34px; border: 1px solid #333; border-radius: 4px; box-shadow: inset 0 0 0 2px #fff; }
@media (min-width: 768px) {
  .C5wrap .HFS .globalbottom { display: flex; align-items: center; }
  .C5wrap .HFS .globalbottom::before,
  .C5wrap .HFS .globalbottom::after { display: none; }
  .C5wrap .HFS .globalbottom > .w-col { float: none; }
}

/* Footer: company details as short stacked lines. */
.C5wrap .HFS .footer-text { padding: 12px 0; }
.footer-line { display: block; }
.footer-name { font-size: 13px; font-weight: 700; margin-bottom: 2px; }
@media (max-width: 991px) {
  .C5wrap .HFS .globalbottom { display: block; text-align: center; padding: 6px 0 4px; }
  .C5wrap .HFS .globalbottom > .w-col { float: none; width: 100%; text-align: center; }
  .C5wrap .HFS .footer-nav-bar { padding-bottom: 8px; }
}

/* Service page images: one consistent size, cropped to fit. */
.C5wrap .CustomImage {
  width: 180px !important;
  height: 135px !important;
  max-width: 180px !important;
  object-fit: cover;
}
@media (max-width: 479px) {
  .C5wrap .CustomImage { width: 140px !important; height: 105px !important; max-width: 140px !important; }
}

/* Contact page: click-to-load map and privacy note. */
.map-placeholder {
  height: 400px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 20px;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  background: #f4f7f9;
  text-align: center;
}
.map-placeholder p { margin: 6px 0 0 !important; font-size: 13px !important; line-height: 1.4 !important; }
.map-placeholder .map-load { margin-bottom: 6px; }
.form-privacy { font-size: 13px !important; line-height: 1.4 !important; margin: 4px 0 12px !important; color: #444; }

/* Privacy page. */
.privacy { max-width: 760px; padding-bottom: 10px; }
.C5wrap #pageType-default .privacy h2 { display: block; margin: 20px 0 6px; font-size: 18px; }
.C5wrap #pageType-default .privacy ul { margin-bottom: 14px; }
.map-links { margin: 6px 0 0 !important; font-size: 13px !important; line-height: 1.4 !important; }

/* ISO certification logos on the About page. */
.iso-logos img { display: inline-block; margin: 0 16px 8px 0; vertical-align: top; }

/* Main page headings (h1) styled to look exactly like the original text they replaced. */
#pageType-default h1.intro-heading { display: block; font: 700 15px/24px Arial, Helvetica, sans-serif; color: #000; margin: 0; padding: 0; border: 0; text-transform: none; letter-spacing: normal; }
#pageType-default p.intro-sub { margin-top: 0; }
#pageType-subpage h1.contact-heading { display: block; font: 700 18px/27px Arial, Helvetica, sans-serif; color: #000; margin: 18px 0 6px; padding: 0; border: 0; text-transform: none; letter-spacing: normal; }