p{
  padding-bottom: 10%;
  font-family: 'Sansita Swashed';
  font-style: normal;
  font-weight: 400;
  font-size: 1.5vw;
  line-height: 210%;
  color: rgba(255, 255, 255, 0.87);
  text-shadow: 0px 0px 32.3px rgba(0, 0, 0, 0.01);
  text-indent: 5%;
  text-align: center;

}
ul{
  position: relative;
  display: flex;
  flex-direction: column;


}
.marker {
  color: rgb(0, 0, 0);
  font-size: 1.2em;
  margin-right: 10px;
}

p1 {
  font-size: 0.92vw;
}

p2 {
    align-self: center;
    justify-content: center;
    font-size: 1.35vw;
    padding: 2.5%;
    text-shadow: 0px 0px 1.5rem rgba(0, 0, 0, 0.369);
  
  
  }

p4{
  font-family: 'Open Sans', sans-serif;
  font-size: 0.48vw;
  color: #333;
}

h1{
    padding-top: 10%;
    font-family: 'Sansita Swashed', extra-bold;
    font-style: normal;
    font-weight: 800;
    font-size: 4.25vw;
    line-height: 150%;
    letter-spacing: -0.02em;
    text-shadow: 0px 0px 32.3px rgba(0, 0, 0, 0.0165);
    color: #FFFFFF;
    margin: 0%;
  }
  h6{
    /* Contact us? */
  margin:0%;
  text-align: center;
  font-family: 'Sansita Swashed';
  font-style: normal;
  font-weight: 800;
  font-size: 2.35vw;
  text-align: center;
  text-decoration-style: solid;
  text-decoration-line: underline;
  text-underline-position: from-front;
  text-underline-offset: 14%;
  text-decoration-skip-ink: none;
  color: #865C5E;
  }
  h7 {
    color: #A5DEE0;
  text-align: center;
  text-shadow: 0px 0px 51.126px rgba(19, 28, 33, 0.33);
  font-family: "Sansita Swashed";
  
  font-style: normal;
  font-weight: 800;
  line-height: 2.76931rem; /* 92.857% */
  letter-spacing: -0.05963rem;
  font-size: clamp(0.55rem, 1.65vw, 1.9rem)
 
  }

  body{
    display:flex;
    flex-direction: column;
    margin:0;
    font-family: "Sansita Swashed";
    background-clip: border-box;
    width: 100vw;
    min-height: 100vh; /* Ensure body fills viewport height */
    background: linear-gradient(180deg, rgba(85, 101, 115, 0.83) 49.89%, rgba(89, 64, 33, 0.83) 100%);
    z-index: -3;
    overflow-x: clip; /* Add this line */
    position: static;
    

  }

  main{
    display: flex;
    flex-direction: column;
    height: 90vw;
    flex-shrink: 0;
  }


header {
    display: flex;
    justify-content:center;
    align-self:flex-end;
    height: 7vw;
    width: 100vw;
    background-color: #BEB69B;
    z-index: 5;
    border-bottom: none;
    margin:0;
    padding:0;
    position: relative;
  
    
  }

header a {
    color: inherit;
    text-decoration: none;
    position: relative;
    transition: color 0.3s ease;
}

header a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2px; /* Adjust position if needed */
    width: 100%;
    height: 2px; /* Thickness of the underline */
    background-color: #4242421e; /* Color of the underline */
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.3s ease;
    border-radius: 2px; /* Rounded corners */
}

header a:hover::after {
    transform: scaleX(1);
}

  #Intro{
    display: flex;
    background: linear-gradient(180deg, rgba(184, 184, 184, 0.72) -201.94%, #262626 -75.71%);
    width: 100vw;
    height: 8vw;
    z-index:1;
    position: relative;
    justify-content: space-around;
    margin-top: -4%;

  }

  #GinaKirby{
    display: flex;
    width:55vw;
    align-self: center;
    margin-right:-22%;
    margin-left: -10%;
  }

  #IntroText{
   
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-self: center;
    box-sizing: border-box;
    width: 36.5vw;
    height: 35.5vw;
    background: #76A2A4;
    border-radius: 20%;
    box-shadow: 
    0 5px 10px rgba(0, 0, 0, 0.103),
    0 15px 40px rgba(0, 1, 3, 0.082);
    margin-top:10.8%;
  }
  #IntroText p{
    width: 28.6vw;
    line-height: 190%;
  }  

  #logo{
    height: 72%;
    z-index:0;
    align-self: center;
    position: absolute;
    padding-bottom: 15%;
  }
  
  #pictureOfStore{
    object-fit:contain;
    /* width: 100%; */
    max-width: 100vw;
    height: 100%;
    transform: scaleY(1.055);
  }

  #mainBack {
    position: absolute;
    width: 100vw;
    z-index: -3;
    top:10vw;
}

  #image{
    align-self:center;
    justify-self: center;
    justify-content: center;
    display: flex;
    position: relative;
    height:38vw;
  }

  #footer {
    display: flex;
    width: 100%;
    height: auto;
    z-index: 0;
    align-items: flex-end;
    flex-direction: row;
    justify-content: space-around;
    gap: 2%;
    justify-self: flex-end;
    position: relative;
    flex-shrink: 0;

  }
  #icons svg {
    width: 6vw;
  }

  #hours {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 20vw;
    height: 23vw;
    background-color: #F3E6C1;
    border-radius: 15%;
    gap: 4%;
    margin-bottom: 5%;
  }

  #hours ul li {
    padding-bottom: 4%;
  }

  #Contact{

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 3vw;
    background-color: #F3E6C1;
    width:20vw;
    height: 23vw;
    border-radius: 15%;
    z-index: 1;
    margin-bottom: 5%;
    
  
  
  
  }

  #map {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    width: 35vw;
    height: 36vw;
    align-items: center;
    gap: 4vw;
  }

  #Located{
    width: 33vw;
    height: 87%;
    background-color: #F3E6C1;
    border-radius: 15%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  
  }

  #loco {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-bottom: 0.5vw;
    gap: 0.3vw;
}

  #gmap {
    width: 72%;
    /* margin-bottom: 5%; */
    opacity: 85%;
    height: 70%;
    scale: 100%;     
    
  
  }
  .bobox{
    /* box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1); */
    box-shadow: 0px 0px 164.024px 0px rgba(0, 0, 0, 0.25) inset;
    opacity: 90%;
  }

  #gmapbox{
    width: 33vw;
    height: 18vw;
    
    display: flex;
    justify-content: center;
    align-items: center;
    /* box-shadow: inset 0 0 10px rgba(173, 163, 163, 0.1); */
    /* opacity: 90%; */
  
  }
iframe #gmap {
  width: 10vw;
}
  #mapicon{
    width: 2vw;
    min-height: auto;
    padding-top: 0.555vw;
  }

  #back{
    display:flex;
    justify-content: flex-end;
    flex-direction: column;
    height: 50vw;
    position: absolute;
    width: 100vw;
    z-index: -1;
}

#back svg{
  filter: url(#inner-shadow);
    /*add a inner shadow on the top edge thats black like <feBlend mode="normal" in2="shape" result="effect1_innerShadow_341_29"/>*/
}

  #bottominfo{
    width: 100%;
    height: 2.5vw;
    position: absolute;
    flex-direction: column;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12%;
    margin-top: 1%;
  
  }

  #payments{
    width:8vw;
    height:40%;
  }

  #para2{
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  #back2{
    display:flex;
    justify-content: flex-end;
    flex-direction: column;
    height: 60vw;
    position: absolute;
    width: 100vw;
    z-index: -1;
  }
  #back2 svg{
    overflow: visible;
  }

  #back2 > svg > path{
    transform-origin: center;
    transform: scaleY(1.35);
    overflow: unset;
  }

  #reviewP {
  display: flex;
  flex-direction: column;
  width: 100vw;
  /* padding-top:5%; */
  height: 40vw;
  /* background: #262626; */
  position: relative;
  z-index: 4;
  margin-bottom: 33%;
}

@media (min-width: 768px) {
  #containReview {
   scale: 125%;
  }
}

  #containReview{
    /* background-color: #000000; */
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width:70vw;
    height: 50vw;
    align-self: center;

    
    /* scale:155%; */
    /* scale:100%; */
    /* overflow-x: hidden; */
    
  }

   #containReview iframe{
    height: 40vw;
    border: none;
    width: 100%;
   }
  
  #rtitle{
    display: flex;
    flex-direction: row;
    justify-content: center;
    position: relative;
    border-radius: 7vmin;
    background: rgb(255, 255, 255);
    padding-top:2.5%;
    padding-bottom:2.5%;
    width:70vw;
    height:6vw;
    align-self: center;
    align-items: center;
    margin-bottom: 6vw;
    
    
  }
  
  #rtitle h3{
    color: rgba(0, 0, 0, 0.86);
    text-shadow: 0px 0px 21.537px rgba(0, 0, 0, 0.25);
    font-weight: 700;
    font-size: clamp(0.7rem, 2.9vw, 2.7rem);
    text-align:center;
  }

  #buttonCon{
    display: flex;
    justify-content: center;
    width: 100vw;
    height:fit-content;
  
  }


  #schedule-button{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28vw;
    height: 6vw;
    background-color: #76A2A4;
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
    border-radius: 4.85rem;
    cursor: pointer;
    border: none; /* Remove the border */
    scale: 100%;
    padding: 0%;
    margin-top:6%;
  }

   /* iframe #asdf {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border: none;
} */

/* Enhanced Staff Page Styles */

/* Mobile Styles */
@media (max-width: 768px) {
    header {
        height: 7vw;
    }

    header a {
        font-size: 4vw;
    }

    p2 {
        font-size: 4vw;
        scale: 77%;
    }

    #bottominfo p4 {
        font-size: 3.5vw;
    }
}

/* ...existing code... */

.readMoreBtn {
    background-color: #76A2A4;
    color: white;
    border: none;
    padding: 0.5vw 1vw;
    font-size: 1vw;
    font-family: 'Sansita Swashed', sans-serif;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    margin-top: 1vw;
    border-radius: 0.5vw;
    box-shadow: 0 0.3vw 0.6vw rgba(0, 0, 0, 0.1);
}

.readMoreBtn:hover {
    background-color: #5a8284;
    transform: translateY(-0.2vw);
}

/* ...existing code... */
#hours > h6 {
  padding-bottom: 1.5%;
}