/* Local replacements for styling that findingstones.com loaded from Squarespace's servers
   and scripts, which no longer exist. site.css is the site's own stylesheet, unchanged. */

/* Image blocks: Squarespace fitted these with a script. site.css sets each block's height
   (vsize-7, vsize-8); the picture fills it, cropped about the centre as on the original. */
.sqs-block-image .sqs-block-image-figure {
  margin: 0 auto;
}
.sqs-block-image .image-block-wrapper {
  overflow: hidden;
}
.sqs-block-image .image-block-wrapper img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Knossos drop-down: also open it when reached with the keyboard. */
.horizontal-navigation-bar nav.main-nav .folder:focus-within .subnav {
  display: block;
}

/* Mobile menu button: the original icon came from a Squarespace font. */
#mobile-navigation-label {
  cursor: pointer;
}
#mobile-navigation-label:before {
  font-family: inherit;
  content: "\2630";
  font-size: 24px;
}

/* Gallery slideshow (autoplay off, cropped to fill, thumbnail strip 100px high, 20px margin). */
.sqs-gallery-block-slideshow .sqs-gallery {
  position: relative;
}
.sqs-gallery-block-slideshow .slide img {
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: 20px;
}
.sqs-gallery-block-slideshow.js-slideshow .sqs-gallery {
  padding-bottom: 46%;
  overflow: hidden;
  cursor: pointer;
}
.sqs-gallery-block-slideshow.js-slideshow .slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.6s ease;
}
.sqs-gallery-block-slideshow.js-slideshow .slide.sqs-active-slide {
  opacity: 1;
}
.sqs-gallery-block-slideshow.js-slideshow .slide img {
  height: 100%;
  margin: 0;
  object-fit: cover;
}
.sqs-gallery-thumbnails {
  display: none;
}
.js-slideshow + .sqs-gallery-thumbnails {
  display: block;
  margin-top: 20px;
  height: 100px;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
}
.sqs-gallery-thumbnails img {
  float: none;
  display: inline-block;
  vertical-align: top;
  height: 100px;
  width: auto;
  margin: 0 10px 0 0;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.sqs-block .sqs-gallery-thumbnails .sqs-gallery-design-strip-slide:hover,
.sqs-block .sqs-gallery-thumbnails .sqs-gallery-design-strip-slide:focus {
  opacity: 1;
}

/* Contact form: Squarespace's form styles were not part of the site stylesheet. */
.form-wrapper .form-item {
  margin: 0 0 24px;
  padding: 0;
  border: 0;
}
.form-wrapper .title {
  display: block;
  margin: 0 0 8px;
  padding: 0;
  font-weight: normal;
}
.form-wrapper .required {
  color: #888;
}
.form-wrapper .fields {
  display: flex;
  gap: 18px;
}
.form-wrapper .fields .field {
  flex: 1;
}
.form-wrapper .caption {
  display: block;
}
.form-wrapper .caption-text {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: #888;
}
.form-wrapper .field-element {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 12px;
  font: inherit;
  color: #222;
  background: #fafafa;
  border: 1px solid #ccc;
  border-radius: 2px;
}
.form-wrapper textarea.field-element {
  min-height: 100px;
}
.form-wrapper .button {
  padding: 1em 2.5em;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #fff;
  background: #272727;
  border: 0;
}
.form-wrapper fieldset[disabled] {
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0.6;
}