/* CSS Document */
a {  -webkit-transition: all 0.35s;  -moz-transition: all 0.35s;  transition: 0.35s;  }
.top a { text-decoration:none; color:#545A3E }
a:hover { text-decoration:none; color:#FEC601 }
.footer { background-color:#13222E; color:#FFF;}
.footer a { color:#545A3E;}
.footer a:hover { color:#FEC601;}
.small { font-size:12px;}
.logo { max-height:120px;}
.black_bg {  background-color:#1B1B1B!important; color:#fff;}
.dk_gray_bg {  background-color:#999!important; color:#fff;}
.orange_bg { background-color:#FBCE72!important; color:#fff;}
.blue_bg { background-color:#1C2F40!important; }
.dk_blue_bg { background-color:#13222E!important; }
.white_bg { background-color:#fff!important;}
.lg_bg { background-color:#F5F0EC!important;}
.box-border { border: solid 6px #FEC601!important; padding:20px;}
.mh40 { min-height:400px;}
.white { color:#FFF;}
.blue  {color:#13222E}
.dk_green  {color:#545A3E}
.relative {position:relative;}
.btn-close {
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: .25em .25em;
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center / 1em auto no-repeat !important;
    border: 0;
    border-radius: .25rem;
    opacity: .9; /* slightly stronger since white is softer */
}


.btn-primary {
    background: #FBCE72 !important;
    color: #1C2F40 !important;
    border: 1px solid #e2b45f !important;
    border-radius: 6px;
    font-weight: 300;
    transition: all 0.25s ease-in-out;
	font-family:Arial, Helvetica, sans-serif;
}

.btn-primary:hover,
.btn-primary:focus {
    background: #e2b45f !important;
    border-color: #d1a24f !important;
    color: #1C2F40 !important;
  
    box-shadow: none!important;
}

.btn-trans {
    background: none !important;
    color: #fff !important;
    border: 1px solid #fff !important;
    border-radius: 6px;
    font-weight: 300;
	font-family:Arial, Helvetica, sans-serif;
    transition: all 0.25s ease-in-out;
}

.btn-trans:hover,
.btn-trans:focus {
    background: #none !important;
    border-color: #fff !important;
    color: #fff !important;
  
    box-shadow: none!important;
}


.card { border:none!important; color:#FFFFFF!important; background:none!important;}

.text_logo { text-decoration:none; color:#FFF;  text-transform:uppercase; font-size: calc(1.0em + 1.2vmin);}
a.text_logo:hover { text-decoration:none; color:#FEC601;  text-transform:uppercase;}

.top-nav { background-color: #13222E; }
.top_nav { list-style:none; position:relative; margin:0px; }
.top_nav a{ color:#FFF; text-decoration:none; }
.top_nav a:hover{ color:#FEC601; text-decoration:none; }
a.top_nav:hover{ color:#FEC601; text-decoration:none; }
.nav-item {display:inline-block; text-transform:uppercase; }

.navbar-nav {    padding-left: 15px;}
.navbar {background-color: #545A3E; text-transform:uppercase; }
.navbar a { color:#FFFFFF;}
.navbar a:hover { color:#333333;}
.navbar-toggler { color:#FFFFFF;}
.navbar-toggler:focus {     box-shadow: 0 0 0 0rem;  }


.h100{ height:calc(100vh)}
.h80{  height:calc(80vh )}
.h70{  height:calc(70vh )}
.h60{  height:calc(60vh )}
.h50{  height:calc(50vh )}
.h40{  height:calc(40vh )}
.h30{  height:calc(30vh )}
.h20{  height:calc(20vh )}
.h10{  height:calc(10vh )}


.carousel-item-100{ height:100vh; }
.carousel-item-90{  height:80vh; }
.carousel-item-80{  height:80vh; }
.carousel-item-70{  height:70vh; }
.carousel-item-60{  height:60vh; }
.carousel-item-50{  height:50vh; }
.carousel-item-40{  height:40vh; }
.carousel-item-30{  height:30vh; }
.carousel-item-20{  height:20vh; }
.carousel-item-10{  height:10vh; }
.carousel-indicators [data-bs-target] {
   
	border: solid 1px #000;
	background-color: #000;
	height:20px;

}

.carousel-indicators {
	
	border-radius: 100%;
	position:absolute;
	bottom:-40px;
	
}
.carousel-indicators {  bottom:-40px;}

.carousel-caption { position:absolute; bottom:40px; left:0px; padding:0px 20px; ; margin:0px; text-align:left; text-transform:uppercase; font-size: calc(1.0em + 2.0vmin);}
.carousel-caption p { font-size:14px; line-height:16px; padding:0px; margin:0px;} 




.carousel-inner { background-color:#fff; }
.carousel {  position: reltive;  top: 0;  left: 0;}
.carousel-inner {  background-color: green;  height: 100%;}
.carousel-item {  background-color: yellow;  opacity .5; }
a.carousel-control-next:link, a.carousel-control-prev:link {  background-color: transparent;  text-decoration: none;  opacity: .5; }
.carousel,.carousel-inner,.carousel-item {
  width: 100%;
   background: no-repeat center center scroll;
  -webkit-background-size: cover;
  background-position: center center;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
   
}



.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}


@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}


.imgshadow { box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;}
.imgshadow-2 { box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;}

.img-bg-scroll { background-attachment: scroll; -webkit-background-size: cover;  background-position: center center;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }
  
.img-bg-fixed  { background-attachment: fixed; -webkit-background-size: cover;  background-position: center center;
  -moz-background-size: cover;
  -o-background-size: cover;}

.ratio-cover {  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  background-position: center center;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;}  

.ratio-3x4 {
  /* For a width-to-height ratio of 3:4, we calculate:
     (height / width) * 100 = (4 / 3) * 100 ˜ 133.33%
  */
  --bs-aspect-ratio: 133.33%;
}
.img-zoom {
    overflow: hidden;
    position: relative;
	 background: transparent !important;
   }

.img-zoom img {
    position: absolute;
    animation: zoom 20s ease-in-out infinite alternate;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures the image fills the container */
}



   @keyframes zoom {
       0% {
           transform: scale(1) translate(0, 0);
           transform-origin: center center;
       }
       100% {
           transform: scale(1.1) translate(-5%, -5%);
           transform-origin: center center;
       }
   }


.hero-zoom {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.hero-zoom img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;

    /* Smooth cinematic zoom */
    animation: heroZoom 22s ease-in-out infinite alternate;

    /* GPU acceleration */
    will-change: transform;
}


@keyframes heroZoom {
    0%   { transform: scale(1) translate(0, 0); }
    100% { transform: scale(1.2) translate(-6%, -3%); }
}



.overlay-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    text-align: center;

}


.overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background-color: #080d15;
    opacity: .01;

}

.overlay_img {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
	font-family:"Times New Roman", Times, serif;
	font-size: larger!important;
	
}

.overlay-text {
    position: absolute;
    top: 50%;
    left: 50%;
    color: #ffffff!important;
    text-align: center;
    text-shadow: 2px 2px 8px #000;
    -webkit-transform: translate3d(-50%,-50%,0);
    -moz-transform: translate3d(-50%,-50%,0);
    -ms-transform: translate3d(-50%,-50%,0);
    -o-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0);
	z-index:102;
}


  
  
  
  .m_container {
  margin: 0 auto;
  max-width: 960px;
  padding: 20px;
}
.columns {
  -webkit-column-count: 5;
  -moz-column-count: 5;
  column-count: 5;
  -webkit-column-gap: 20px;
  -moz-column-gap: 20px;
  column-gap: 20px;
  -webkit-column-width: 33.33333333333333%;
  -moz-column-width: 33.33333333333333%;
  column-width: 33.33333333333333%;
}
.card-img {
  height: auto;
  margin-bottom: 15px;
}
@media only screen and (min-width: 480px) and (max-width: 727px) {
  .columns {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-width: 50%;
    -moz-column-width: 50%;
    column-width: 50%;
  }
}
@media only screen and (max-width: 479px) {
  .columns {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-width: 100%;
    -moz-column-width: 100%;
    column-width: 100%;
  }
}


.swim { border:solid 1px #CCCCCC; padding:5px; background-color:#545A3E; margin:2px; min-width:180px;  display:inline-block; position:relative; color:#fff;}

.Booked { background-color:#FF4F2E!important; color:#fff;}
.Available { background-color:#fff!important; color:#1B1B1B; background:#545a3e}

.footerlogo { max-width:150px;}
footer {  background-color:#162433!important; color:#fff; background:#162433}
footer a { color:#FFFFFF;}