@media only screen and (max-width: 766px) {

header .navbar-text a{
    font-size: 20px; padding:0 5px;}
}





header .logodiv {    text-align: center;}
header .logodiv .logo {max-height: 90px;}

.navbar-text a{color: #c74052;
    text-decoration: none;
    font-family: Helvetica, arial, sans-serif;
    font-size: 24px;}
.about-us {padding: 40px 0}	
.about-us .welcome{      padding: 40px;
    background-color: #fbf1f2;
    flex-direction: column;
    display: flex
;
    align-items: center;
    justify-content: center;
}
.about-us .welcome span{    color: #c74052;
    font-weight: 400;    letter-spacing: 0.125em;
    text-transform: uppercase;
    margin-bottom: 18px;
    line-height: 1.25;
    font-family: Helvetica, arial, sans-serif;}
.about-us .welcome h1{    margin-bottom: 16px;
    font-size: 48px;
    line-height: 1.2;
    letter-spacing: 0.023em;
    font-family: 'Playfair Display', Georgia, serif;
    color: #151515;
    font-weight: 400;}
	
.about-us .welcome p{    margin-bottom: 30px;
    line-height: 1.2;
    letter-spacing: 0.023em;
    font-family: 'Playfair Display', Georgia, serif;
    color: #575757;
    font-weight: 400;
    font-size: 18px;}
	
.about-us .welcome .btn{  letter-spacing: 0.214em;
      font-size: 16px;
    background-color: #cb4154;
    color: #ffffff;
    min-height: 56px;
    padding-left: 32px;
    padding-right: 32px;
    font-weight: 700;
    text-decoration: none;
    text-transform: uppercase;
    display: inline-block;
    line-height: 42px;}
	
	
.vision .welcome{      padding: 40px;
    background-color: #fbf1f2;
    flex-direction: column;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vision .welcome h4{font-size: 24px;
    margin-bottom: 24px;
    color: #1b1b1b;
    letter-spacing: 0.045em;
    line-height: 1.25;
    font-family: Helvetica, arial, sans-serif;}
	
.vision .welcome  p{font-size: 18px;
    color: #5e5e5e;
    text-wrap: pretty;
    font-weight: 400;
    line-height: 1.5;
    font-family: Helvetica, arial, sans-serif;}	
.resort {padding:30px 0;}	
.resort h2{font-size: 36px;
    line-height: 1.4;
    color: #1b1b1b;         margin-bottom: 32px;
    font-weight: 400;
    letter-spacing: 0.031em;
    font-family: 'Playfair Display', Georgia, serif;}
	
	
	
	
  #gallery {
    column-count: 3;
    column-gap: 15px;

    margin: 0 auto;
   
  }

  .img-box {
    break-inside: avoid;
    margin-bottom: 15px;
  }

  .img-box img {
    width: 100%;
    height: auto;
    display: block;
   
  }

  .load-more-container {
    text-align: center;
    margin: 20px 0;
  }

  .load-more-btn {
    background-color: #cb4154;
    color: #fff;
    padding: 10px 20px;
    border: none;
  
    cursor: pointer;
    font-size: 16px;
  }

  .load-more-btn:hover {
    background-color: #555;
  }

  @media (max-width: 768px) {
    #gallery {
      column-count: 2;
    }
  }

  @media (max-width: 480px) {
    #gallery {
      column-count: 1;
    }
  }


.photos-grid-container {


  @media (max-width: 580px) {
    grid-template-columns: 1fr;
  }

  .img-box {
    border: 1px solid #ffffff;
    position: relative;
  }

  .img-box:hover .transparent-box {
    background-color: rgba(0, 0, 0, 0.6);
  }

  .img-box:hover .caption {
    transform: translateY(-5px);
  }

  img {
    max-width: 100%;
    display: block;
    height: auto;
  }

  .caption {
    color: white;
    transition: transform 0.3s ease, opacity 0.3s ease;
    font-size: 1.5rem;
  }

  .transparent-box {
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 0;
    left: 0;
    transition: background-color 0.3s ease;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .main-photo {
    grid-row: 1;
    grid-column: 1;
  }

  .sub {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    grid-gap: 0em;

    &:nth-child(0) {
      grid-column: 1;
      grid-row: 1;
    }

    &:nth-child(1) {
      grid-column: 2;
      grid-row: 1;
    }

    &:nth-child(2) {
      grid-column: 1;
      grid-row: 2;
    }

    &:nth-child(3) {
      grid-column: 2;
      grid-row: 2;
    }
  }
}


.hide-element {
  border: 0;
  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

@media screen and (min-width: 1280px) {
  //HD Screens
  .container {
    margin: 0 auto;
    width: 1250px;
  }
}

	
	
	
	
.contact h2{    color: #c74052;
    font-weight: 400;    letter-spacing: 0.125em;
    text-transform: uppercase;
    margin-bottom: 18px; font-size: 18px;
    line-height: 1.25;
    font-family: Helvetica, arial, sans-serif;}	
	
.contact h4 {
    font-size: 24px;
    margin-bottom: 15px;
    color: #1b1b1b;
    letter-spacing: 0.045em;
    line-height: 1.25;
    font-family: Helvetica, arial, sans-serif;
}

.contact  p{margin-bottom: 10px;font-size: 18px;
    color: #5e5e5e;
    text-wrap: pretty;
    font-weight: 400;
    line-height: 1.5;
    font-family: Helvetica, arial, sans-serif;}	
	
.contact .hyper{background-color: #455a64;
    color: white;
    padding: 10px 15px;
    text-decoration: none; margin-bottom:30px; display:inline-block;
    font-weight: 700;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif; }
	
.contact .hyper .bi{color: white;
    background: #36bd49;
    border-radius: 100%;
    width: 22px;
    height: 22px;
    display: inline-block;
    line-height: 12px;
    font-size: 23px;
    vertical-align: middle;
    margin-right: 5px;}
	
.contact .div a{text-decoration:none; font-size: 18px; display:inline-block; margin-bottom:15px;
    color: rgb(203, 65, 84);
    font-family: Helvetica, arial, sans-serif;}
.contact  {    padding: 40px 0;
    background-color: #fbf1f2;}
.contact .socialmedia .img-fluid{max-height:40px}	
.contact .socialmedia{display: flex;
    justify-content: start;
    gap: 15px;}
	
.form h3{    font-size: 36px; margin-bottom:25px;
    font-weight: 400;
    color: rgb(27, 27, 27);
    font-family: "Playfair Display", Georgia, serif;
    line-height: 1.25;
    letter-spacing: 0.031em;}


.form .form-control {line-height: 2;
    border-radius: 0;
    border-top: 0;
    border-left: 0;
    border-right: 0; box-shadow:none;}
	
.form .btn-primary{     color: white;
    background-color: rgb(203, 65, 84);
    font-size: 16px;
    font-weight: 700;
    font-family: Helvetica, arial, sans-serif;
    border-radius: 0;
    border-color: rgb(203, 65, 84);
    text-transform: uppercase;
    padding: 10px 30px; letter-spacing: 0.214em;}
.bottom {padding:15px 0}	
.bottom p{font-size: 14px;
    color: rgb(89, 89, 89);
    letter-spacing: 0.083em;
    text-wrap: pretty;
    text-transform: uppercase;
    line-height: 1.5;
    font-weight: 400;
    font-family: Helvetica, arial, sans-serif;
    margin-bottom: 0;}
	
	.bottom p a{text-decoration:none; color:#cb4154}
	
	
.float{
	position:fixed;
	    width: 45px;
    height: 45px;
	bottom:40px;
	right:40px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.my-float{
	margin-top:16px;
}