/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}

/* h1:before, h2:before {display:block;position:relative;width:50px;height:28px;content:'';background-image:url('https://sabre27.tinstar.design/wp-content/uploads/sabre-burgee-icon.png');background-repeat:no-repeat;background-position:center center;top:-5px;} */

/* Colours */
/*
SabreRed - #8c140f rgb(140, 20, 15)
SabreBlue - #e1e5ed rgb(225, 230, 236)
SabreDarkBlue - #564A87 rgb(86, 74, 135)
*/

h1 {border-bottom:5px solid #e1e5ed;padding-bottom:20px;}
h4,h5,h6 {color:#333333 !important;}
.centerheading h1, .centerheading h2 {text-align:center;}
h1:before, h2:before {display:block;position:relative;width:50px;height:28px;content:'';background-image:url('img/sabre-burgee-icon.png');background-repeat:no-repeat;background-position:center center;top:-5px;}
.centerheading h1:before, .centerheading h2:before {margin:0 auto;top:-10px;}
p.lead {font-size:110%;line-height:1.5;}

/* Yachts for sale carousel VIEW */

/*
.tinstar-container {position:relative;display:block;width:100%;margin:0 auto;}
.tinstar-row {position:relative;display:block;width:100%;margin:0 auto;}
.tinstar-cell {position:relative;display:block;width:100%;margin:0 auto;padding:20px;}

h3.yachtheader {display:block;color:white;background-color:#8c140f;margin-bottom:0;}
h3.yachtheader small {font-size:75%;margin-left:10px;margin-right:10px;color:#e1e5ed;}
#yachtsforsalecarousel {text-align:center;}
#yachtsforsalecarousel p.priceblock {display:block;color:white;background-color:#564A87;margin-top:0;margin-bottom:5px;}
#yachtsforsalecarousel p strong {font-family: Bevan, sans-serif;font-weight:normal;}

@media (min-width: 1024px) {
.tinstar-small-12.tinstar-medium-6.tinstar-cell {width:50%;float:left;}
.tinstar-small-12.tinstar-medium-4.tinstar-cell {width:33.333%;float:left;}
.tinstar-small-12.tinstar-medium-3.tinstar-cell {width:25%;float:left;}
}

@media (min-width: 1200px) {
.tinstar-small-12.tinstar-large-3.tinstar-cell {width:25%;float:left;}
}

.square-container {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding-top: 100%;
}

.inner-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#responsive-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
*/
.single-yacht .entry-header-text {padding-bottom:0;}
.single-yacht .entry-content.single-page {padding:0;}
.single-yacht .entry-title {margin-bottom: 0;}
.single-yacht .entry-divider {margin-bottom: 0;}


/* Boat picture slider */
.slider-wrapper {
  max-width: 100%;
  overflow: hidden;
  position: relative;
}

.gallery-top {
  width: 100%;
  aspect-ratio: 1 / 1;
  position: relative;
  overflow: hidden;
}

.gallery-top .swiper-slide {
  display: flex; /* Added to enable flexbox */
  justify-content: center; /* Horizontal alignment */
  align-items: flex-end; /* Aligns images to the bottom */
}

.gallery-top .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Maintains image aspect ratio while filling container */
  object-position: bottom;
}

.gallery-thumbs {
  margin-top: 10px;
}

.gallery-thumbs .swiper-slide {
  height: 100px;
  opacity: 0.5;
  padding: 4px;
}

.gallery-thumbs .swiper-slide-thumb-active {
  opacity: 1;
  border: 2px solid #333;
}

.thumbs-nav-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.thumbs-button-prev,
.thumbs-button-next,
.swiper-button-prev,
.swiper-button-next {
  font-size: 24px;
  cursor: pointer;
  padding: 6px;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.6);
  background-color: transparent;
  color: #fff;
  transition: background-color 0.2s ease;
}

.thumbs-button-prev:hover,
.thumbs-button-next:hover,
.swiper-button-prev:hover,
.swiper-button-next:hover {
  background-color: rgba(0, 0, 0, 0.8);
  background-color: transparent;
}