:root {

--step-0: clamp(0.2rem, 0.32vi + 0.16rem, 0.94rem);
--step-1: clamp(0.25rem, 0.44vi + 0.2rem, 1.25rem);
--step-2: clamp(0.31rem, 0.6vi + 0.24rem, 1.67rem);
--step-3: clamp(0.39rem, 0.8vi + 0.29rem, 2.22rem);
--step-4: clamp(0.49rem, 1.09vi + 0.35rem, 2.96rem);
--step-5: clamp(0.61rem, 1.47vi + 0.43rem, 3.95rem);
--step-6: clamp(0.76rem, 1.98vi + 0.52rem, 5.26rem);

}



*[href^="tel"] {
  color: inherit; /* Inherit text color of parent element. */
  text-decoration: none; /* Remove underline. */
  /* Additional css `propery: value;` pairs here */
}


@media (hover: none) {
  .button a:hover {
    background-color: transparent; /* Or your default background */
    opacity: 1; /* Or whatever your default opacity is */
  }
}



h1 {
  font-size: var(--step-5);
}

h2 {
  font-size: var(--step-4);
}

h3 {
  font-size: var(--step-3);
}

h4 {
  font-size: var(--step-2);
}

h5 {
  font-size: var(--step-1);
}

p {
  font-size: var(--step-4);
}

a {
  font-size: var(--step-4);
}




@font-face {
  font-family: 'AvenirNextLTPro'; /* Choose a descriptive name */
  src: url('AvenirNextLTProRegular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'AvenirNextLTProBold'; /* Choose a descriptive name */
  src: url('AvenirNextLTProBold.otf') format('opentype');
  font-weight: bold;
  font-style: normal;
}


html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #2a6bccFF; 
    font-family: 'AvenirNextLTPro', sans-serif, verdana, arial, tahoma, garamond;
    background-image: url("liora_site_background.webp"); 
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}







.fixed-background {
    background-image: url('liora_site_background.webp'); /* Replace with your image */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: fixed; /* Stays fixed in the viewport on all devices */
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: -1; /* Ensures it stays behind other content */
}


.content-wrapper {
    position: relative; /* Position content above the background */
    z-index: 1; /* Make sure content is above the fixed-background */
    width: auto;
    height: 100dvh; /* Viewport height for mobile compatibility */
    overflow-y: auto; /* Enable vertical scrolling within this div */
    object-fit: contain;
  }



    .viewport-border {
        width: 100vdw; /* Occupy 100% of the viewport width */
        height: 100vdh; /* Occupy 100% of the viewport height */
        box-sizing: border-box; /* Include padding and border in the element's total width and height */
    }


    #title_color {
      background-color: #2a6bccAA;
      color: black;
    }


    .header {
        width: auto;
        height: 14dvh;
        border: 2px solid black;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        text-align: center;
        background-color: #00000080;
        object-fit: contain;
        align-items: center;
        justify-content: space-evenly;
    }

    


    .logo {
        width: 22dvw;
        height: 14dvh;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #00000000;
        object-fit: contain;
      }
    

    .logo img {
        height: 100%;
        width: 100%;
        max-width: 100%; /* Ensures image fits within the container */
        max-height: 100%; /* Ensures image fits within the container */
        box-sizing: border-box;
        padding: 0;
    }

    .logo a {
        font-size: 0px;
    }



    .button-contain {
        width: 75dvw;
        height: auto;        
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        object-fit: contain;
    }

  
.button {
  width: 14dvw;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}


.button img {
  width: 100%;
  height: 100%;
}

.button a {
  padding: 0px;
  text-decoration: none;
  text-align: center;
  font-size: 0px;
  border: .1rem solid #ffffff60;
  border-radius: .3rem;
  box-sizing: border-box;
  background-color: #00000080;
}

.button a:hover {
  border: .3rem solid white;
  border-radius: .3rem;
}

.button a:focus {
  border: .3rem solid white;
  border-radius: .3rem;
}

.button a:active {
  border: .17rem solid white;
  border-radius: .3rem;
}

.active_button a {
  border: .17rem solid white;
  border-radius: .3rem;
  background-color: black;
}




    .section-contain {
        width: 100%;
        height: auto;   /* important controls body height */
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        margin-top: 14dvh;
        margin-bottom: 12dvh;
        object-fit: contain;
    }


    .main-text-1 {
        border-top: .1rem solid black;
        border-bottom: .1rem solid black;
        box-sizing: border-box;
        padding: 3dvh;
        width: 100%;
        height: auto;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        background-color: #000000BB;
        color: white;
        object-fit: contain;
      }


    .main-text-2 {
        border-top: .1rem solid black;
        border-bottom: .1rem solid black;
        box-sizing: border-box;
        padding: 3dvh;
        width: 100%;
        height: auto;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        background-color: #00000099;
        color: #a3a3a3;
        object-fit: contain;
    }





    .main-section-contain {
        box-sizing: border-box;
        width: 100%;
        height: auto;
        background-color: #00000000;
        display: flex;
        flex-direction: column;
        object-fit: contain;
      }






      


.gallery-container {
  display: flex;             /* Aligns images in a horizontal row */
  overflow-x: scroll;        /* Enables horizontal scrolling */
  scroll-snap-type: x mandatory; /* Enforces snapping to each image */
  scroll-behavior: smooth;   /* Makes scrolling smooth when using navigation */
  width: auto;               /* Adjust container width as needed */
  height: 74dvh;             /* Set a fixed height for the gallery */
  object-fit: contain;
  box-sizing: border-box;
  background-color: #00000080;
  color: white;
}



.gallery-container img {
  flex: 0 0 100%;            /* Each image takes up the full width of the container */
  width: 100%;               /* Ensures image scales within its flex container */
  height: 100%;              /* Ensures image scales within its flex container */
  object-fit: contain;         /* Ensures images cover the area nicely */
  scroll-snap-align: center; /* Snaps the center of the image to the center of the container */
  object-fit: contain;
  
}




.hide-scrollbars {
  overflow-x: scroll; /* Allows horizontal scrolling */
  scrollbar-width: none; /* For Firefox */
  -ms-overflow-style: none; /* For Internet Explorer and Edge */
}

/* For WebKit browsers (Chrome, Safari, Opera) */
.hide-scrollbars::-webkit-scrollbar {
  display: none;
}





    .main-section-1 {
      border: .1rem solid black;
      box-sizing: border-box;
      background-color: #00000040;
      width: 100%;
      height: auto;
      padding: 0dvh;
      margin: 0px;
      text-align: center;
      color: white;
      object-fit: contain;
    }

    .main-section-2 {
      border: .1rem solid black;
      box-sizing: border-box;
      background-color: #00000099;
      width: 100%;
      height: auto;
      padding: 0dvh;
      margin: 0px;
      text-align: center;
      color: white;
      object-fit: contain;
    }


    .title-bold {
      font-family: 'AvenirNextLTProBold';
      font-weight: bold;
    }



    


    .text-1 {
        border: .7px solid black;
        width: 100%;
        height: 7.4vh;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #000000BB;
        color: white;
        object-fit: contain;
    }

    .text-2 {
        border: .7px solid black;
        width: 100%;
        height: 7.4dvh;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #00000080;
        color: white;
        object-fit: contain;
    }

    
    .section-2 {
        width: 100%;
        height: auto;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        flex-direction: column;

    }


    .section-2 img {

        max-width: 100%; /* Ensures image fits within the container */
        max-height: 100%; /* Ensures image fits within the container */
        box-sizing: border-box;
    }




    .bottom-contain {
        width: 100%;
        height: 12dvh;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        align-items: center;
    }




    .bottom-1 {
        width: 100%;
        height: auto;
        box-sizing: border-box;
    }

    .bottom-2 {
        width: 100%;
        height: auto;
        box-sizing: border-box;
    }

    .bottom-3 {
        width: 100%;
        height: auto;
        box-sizing: border-box;
    }




.social_link_contain {
    width: 35dvw;
    height: 12dvh;
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  border: .1rem solid black;
  box-sizing: border-box;
background-color: #0000001A;
object-fit: contain;
}

.social_link_contain img {
  max-height: 6.8dvh;
  width: auto;
  object-fit: contain;
}

.social_link_contain a {
  font-size: 0px;
}




.actionbar {
  width: 30dvw;
  height: 12dvh;
  display: flex;
  justify-content: space-around;
  align-items: center;
  border: .1rem solid black;
  box-sizing: border-box;
  object-fit: contain;
  background-color: #0000001A;
}

.actionbar_button {
  width: auto;
  height: 8dvh;
  opacity: 100%;
  display: flex;
  justify-content: center;

}


.actionbar_button img {
width: 100%;
height: 100%;
padding: 0px;
}

.actionbar_button a {
  padding: 0px;
  text-decoration: none;
  text-align: center;
  font-size: 0px;
  border: .1rem solid #ffffff60;
  border-radius: .3rem;
  box-sizing: border-box;
    background-color: #000000BB;
}

.actionbar_button a:hover {
  border: .3rem solid white;
  border-radius: .3rem;
}







.bottom_seven_contain {
    width: 35dvw;
    height: 12dvh;
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  border: .1rem solid black;
  box-sizing: border-box;
background-color: #0000001A;
object-fit: contain;
}

.bottom_seven_contain img {
  max-height: 8dvh;
  width: auto;
  object-fit: contain;
}

.bottom_seven_contain a {
  font-size: 0px;
}


    .contact_header {
        width: 100%;
        height: 33.333dvh;
        border: 10px solid black;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        text-align: center;
        background-color: #00000033;
    }


    .contact_logo {
        width: 36dvw;
        height: auto;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #00000000;     
        padding: 2vw;
    }

    .contact_logo img {

        height: auto;
        max-width: 100%; /* Ensures image fits within the container */
        max-height: 100%; /* Ensures image fits within the container */
        box-sizing: border-box;
    }

    .contact_logo a {
        font-size: 0px;
    }


    .contact-button-contain {
        width: 100%;
        height: 100%;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }

  
.contact_button {
  width: 100%;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}


.contact_button img {
  width: 13dvw;
  height: auto;
}

.contact_button a {
  padding: 0px;
  text-decoration: none;
  text-align: center;
  font-size: 0px;
  border: .1rem solid #ffffff60;
  border-radius: .3rem;
  box-sizing: border-box;
  background-color: #00000060;
}

.contact_button a:hover {
  border: .3rem solid white;
  border-radius: .3rem;
}

.contact_active_button a {
  border: .17rem solid white;
  border-radius: .3rem;
}


  .contact-section-contain {
        width: 100%;
        height: auto;   /* important controls body height */
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        margin-top: 33.333dvh;
    }


    .contact-section-2 {
        width: 100%;
        height: auto;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        flex-direction: column;
    }


    .contact-bottom-contain {
        width: 100%;
        height: auto;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
    }  


.contact_social_link_contain {
    width: 100%;
    height: 33.333dvh;
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  border: 10px solid black;
  box-sizing: border-box;
background-color: #00000099;
}

.contact_social_link_contain img {
  width: auto;
  max-height: 10dvh;
  
}

.contact_social_link_contain a {
  font-size: 0px;
}


.contact_actionbar {
  width: 100%;
  height: 33.333dvh;
  display: flex;
  justify-content: center;
  align-items: center;
  border-left: 10px solid black;
  border-right: 10px solid black;
  box-sizing: border-box;
  background-color: #00000080;
}

.contact_actionbar_button {
  width: 100%;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: center;

}

.contact_actionbar_button img {
  width: auto;
  max-height: 16dvh;
  padding: 5px;
  background-color: #0000005C;
}

.contact_actionbar_button a {
  padding: 0px;
  text-decoration: none;
  text-align: center;
  font-size: 0px;
  border: .1rem solid #ffffff80;
  border-radius: .3rem;
  box-sizing: border-box;
}

.contact_actionbar_button a:hover {
  border: .3rem solid white;
  border-radius: .3rem;
}



.header_stick {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #00000080; /* Example background */
  color: white;
  text-align: center;
  padding: 0px; /* Adjust as needed */
  object-fit: contain;
}

.footer_stick {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #00000080; /* Example background */
  color: white;
  text-align: center;
  padding: 0px; /* Adjust as needed */
  object-fit: contain;
}























/* iPad vertical - same as iPhone vertical with iphone horizontal in between*/

@media (max-width: 1050px) {


   .main-section-contain {
        flex-direction: column;
    }

    .section-contain {
        margin-top: 21dvh;
        margin-bottom: 21dvh;
    }
  

    .header {
        flex-direction: column;
        height: 21dvh;
    }
  

    .logo {
        width: 100%;
        height: 100%;
    }

    .logo img {
        width: auto;
        height: 14dvh;
        object-fit: contain;
    }

    
    
    .button-contain {
        width: 100dvw;
        height: 5dvh;        
    }

  
.button {
  width: 20dvw;
  height: auto;
}


.button img {
  width: 19dvw;
  height: auto;
  object-fit: contain;
}


    .section-contain {
        margin-top: 21dvh;
        margin-bottom: 21dvh;
    }


    .main-text-1 {
        width: 100%;
        height: auto;
    }

    .main-text-2 {
        width: 100%;
        height: auto;
    }

    

.gallery-container {
  display: flex;             /* Aligns images in a horizontal row */
  overflow-x: scroll;        /* Enables horizontal scrolling */
  scroll-snap-type: x mandatory; /* Enforces snapping to each image */
  scroll-behavior: smooth;   /* Makes scrolling smooth when using navigation */
  width: 100dvw;               /* Adjust container width as needed */
  height: 58dvh;             /* Set a fixed height for the gallery */
  object-fit: contain;
  box-sizing: border-box;
  
}

.gallery-container img {
  flex: 0 0 100%;            /* Each image takes up the full width of the container */
  width: 100%;               /* Ensures image scales within its flex container */
  height: 100%;              /* Ensures image scales within its flex container */
  object-fit: contain;         /* Ensures images cover the area nicely */
  scroll-snap-align: center; /* Snaps the center of the image to the center of the container */
}




    .bottom-contain {
        width: 100%;
        height: 21dvh;
        flex-direction: column;
    }



.social_link_contain {
    width: 100%;
    height: 7dvh;
}

.social_link_contain img {
  max-height: 5.5dvh;
  width: auto;
  object-fit: contain;
}




.actionbar {
  width: 100%;
  height: 7dvh;
  display: flex;
  justify-content: center;
  align-items: center;
  border: .1rem solid black;
  box-sizing: border-box;
}

.actionbar_button {
  width: 100%;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: space-evenly;
}


.actionbar_button img {
  max-height: 6dvh;
  width: auto;
}

.actionbar_button a {
  padding: 0px;
  text-decoration: none;
  text-align: center;
  font-size: 0px;
}





.bottom_seven_contain {
    width: 100%;
    height: 7dvh;
}


.bottom_seven_contain img {
  max-height: 6dvh;
  width: auto;
  object-fit: contain;
}



.text-1 {
  height: 5.8dvh;
}

.text-2 {
  height: 5.8dvh;
}



    .contact_header {
        width: 100%;
        height: 33.333dvh;
        display: flex;
        flex-direction: column;
        text-align: center;
        align-items: center;
        object-fit: contain;
    }


    .contact_logo {
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;    
    }

    .contact_logo img {
        padding: 0;
        height: 19dvh;
        width: auto;
    }

    

    .contact-button-contain {
        width: 100%;
        height: 5dvh;        
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
  
.contact_button {
  width: 100%;
  height: auto;
  opacity: 100%;

  display: flex;
  justify-content: center;
  align-items: center;
}

.contact_button img {
  width: 18dvw;
  height: auto;
  padding-top: 0.2dvh;
  padding-bottom: 0.2dvh;
}


  .contact-section-contain {
        width: 100%;
        height: auto;   /* important controls body height */
        display: flex;
        flex-direction: column;
        margin-top: 33.333dvh;
    }


    .contact-section-2 {
        width: 100%;
        height: auto;
        display: flex;
        align-items: center;
        flex-direction: column;
    }


    .contact-bottom-contain {
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
    }  


.contact_actionbar {
  width: 100%;
  height: 33.333dvh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.contact_actionbar_button {
  width: 100%;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: center;

}

.contact_actionbar_button img {
  width: auto;
  max-height: 10dvh;
}



.contact_social_link_contain {
    width: 100%;
    height: 33.333dvh;
}

.contact_social_link_contain img {
  width: auto;
  max-height: 8dvh;
}


}


















@media (max-width: 1050px) and (max-height: 768px) {



    .header {
        width: auto;
        height: 14dvh;
        border: 2px solid black;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        text-align: center;
        object-fit: contain;
        align-items: center;
        justify-content: space-evenly;
    }

    


    .logo {
        width: 22dvw;
        height: 14dvh;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        object-fit: contain;
      }
    

    .logo img {
        height: 100%;
        width: 100%;
        max-width: 100%; /* Ensures image fits within the container */
        max-height: 100%; /* Ensures image fits within the container */
        box-sizing: border-box;
        padding: 0;
    }

    .logo a {
        font-size: 0px;
    }



    .button-contain {
        width: 75dvw;
        height: auto;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        object-fit: contain;
    }

  
.button {
  width: 14dvw;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}


.button img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.button a {
  padding: 0px;
  text-decoration: none;
  text-align: center;
  font-size: 0px;
  border: .1rem solid #ffffff60;
  border-radius: .3rem;
  box-sizing: border-box;
}

.button a:hover {
  border: .3rem solid white;
  border-radius: .3rem;
}

.active_button a {
  border: .17rem solid white;
  border-radius: .3rem;
}




    .section-contain {
        width: 100%;
        height: auto;   /* important controls body height */
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        margin-top: 14dvh;
        margin-bottom: 12dvh;
        object-fit: contain;
    }


    .main-text-1 {
        border-top: .1rem solid black;
        border-bottom: .1rem solid black;
        box-sizing: border-box;
        padding: 3dvh;
        width: 100%;
        height: auto;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        object-fit: contain;
      }


    .main-text-2 {
        border-top: .1rem solid black;
        border-bottom: .1rem solid black;
        box-sizing: border-box;
        padding: 3dvh;
        width: 100%;
        height: auto;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        object-fit: contain;
    }





    .main-section-contain {
        box-sizing: border-box;
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        object-fit: contain;
      }




.gallery-container {
  display: flex;             /* Aligns images in a horizontal row */
  overflow-x: scroll;        /* Enables horizontal scrolling */
  scroll-snap-type: x mandatory; /* Enforces snapping to each image */
  scroll-behavior: smooth;   /* Makes scrolling smooth when using navigation */
  width: auto;               /* Adjust container width as needed */
  height: 74dvh;             /* Set a fixed height for the gallery */
  object-fit: contain;
  box-sizing: border-box;
}



.gallery-container img {
  flex: 0 0 100%;            /* Each image takes up the full width of the container */
  width: 100%;               /* Ensures image scales within its flex container */
  height: 100%;              /* Ensures image scales within its flex container */
  object-fit: contain;         /* Ensures images cover the area nicely */
  scroll-snap-align: center; /* Snaps the center of the image to the center of the container */
  object-fit: contain;
}




.hide-scrollbars {
  overflow-x: scroll; /* Allows horizontal scrolling */
  scrollbar-width: none; /* For Firefox */
  -ms-overflow-style: none; /* For Internet Explorer and Edge */
}

/* For WebKit browsers (Chrome, Safari, Opera) */
.hide-scrollbars::-webkit-scrollbar {
  display: none;
}





    .main-section-1 {
      border: .1rem solid black;
      box-sizing: border-box;
      width: 100%;
      height: auto;
      padding: 0dvh;
      margin: 0px;
      text-align: center;
      object-fit: contain;
    }

    .main-section-2 {
      border: .1rem solid black;
      box-sizing: border-box;
      width: 100%;
      height: auto;
      padding: 0dvh;
      margin: 0px;
      text-align: center;
      object-fit: contain;
    }


    .title-bold {
      font-family: 'AvenirNextLTProBold';
      font-weight: bold;
    }



    


    .text-1 {
        border: .7px solid black;
        width: 100%;
        height: 7.4vh;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        object-fit: contain;
    }

    .text-2 {
        border: .7px solid black;
        width: 100%;
        height: 7.4dvh;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        object-fit: contain;
    }

    
    .section-2 {
        width: 100%;
        height: auto;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        flex-direction: column;
    }


    .section-2 img {

        max-width: 100%; /* Ensures image fits within the container */
        max-height: 100%; /* Ensures image fits within the container */
        box-sizing: border-box;
    }




    .bottom-contain {
        width: 100%;
        height: 12dvh;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        align-items: center;
    }




    .bottom-1 {
        width: 100%;
        height: auto;
        box-sizing: border-box;
    }

    .bottom-2 {
        width: 100%;
        height: auto;
        box-sizing: border-box;
    }

    .bottom-3 {
        width: 100%;
        height: auto;
        box-sizing: border-box;
    }




.social_link_contain {
    width: 35dvw;
    height: 12dvh;
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  border: .1rem solid black;
  box-sizing: border-box;
object-fit: contain;
}

.social_link_contain img {
  max-height: 7.8dvh;
  width: auto;
  object-fit: contain;
}

.social_link_contain a {
  font-size: 0px;
}








.actionbar {
  width: 30dvw;
  height: 12dvh;
  display: flex;
  justify-content: space-around;
  align-items: center;
  border: .1rem solid black;
  box-sizing: border-box;
  object-fit: contain;
}

.actionbar_button {
  width: 18dvw;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: center;

}


.actionbar_button img {
width: auto;
max-height: 8dvh;
padding: 0px;
}

.actionbar_button a {
  padding: 0px;
  text-decoration: none;
  text-align: center;
  font-size: 0px;
  border: .1rem solid #ffffff60;
  border-radius: .3rem;
  box-sizing: border-box;
}

.actionbar_button a:hover {
  border: .3rem solid white;
  border-radius: .3rem;
}







.bottom_seven_contain {
    width: 35dvw;
    height: 12dvh;
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  border: .1rem solid black;
  box-sizing: border-box;
object-fit: contain;
}

.bottom_seven_contain img {
  max-height: 9dvh;
  width: auto;
  object-fit: contain;
}

.bottom_seven_contain a {
  font-size: 0px;
}





    .contact_header {
        width: 100%;
        height: 33.333dvh;
        border: 10px solid black;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        text-align: center;
    }


    .contact_logo {
        width: 36dvw;
        height: auto;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 2vw;   
    }

    .contact_logo img {

        height: auto;
        max-width: 100%; /* Ensures image fits within the container */
        max-height: 100%; /* Ensures image fits within the container */
        box-sizing: border-box;
    }

    .contact_logo a {
        font-size: 0px;
    }


    .contact-button-contain {
        width: 100%;
        height: 33.333dvh;        
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }

  
.contact_button {
  width: 100%;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}


.contact_button img {
  width: 13dvw;
  height: auto;
}

.contact_button a {
  padding: 0px;
  text-decoration: none;
  text-align: center;
  font-size: 0px;
  border: .1rem solid #ffffff60;
  border-radius: .3rem;
  box-sizing: border-box;
}

.contact_button a:hover {
  border: .3rem solid white;
  border-radius: .3rem;
}

.contact_active_button a {
  border: .17rem solid white;
  border-radius: .3rem;
}


  .contact-section-contain {
        width: 100%;
        height: auto;   /* important controls body height */
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        margin-top: 33.333dvh;
    }


    .contact-section-2 {
        width: 100%;
        height: auto;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        flex-direction: column;
    }


    .contact-bottom-contain {
        width: 100%;
        height: auto;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
    }  


.contact_social_link_contain {
    width: 100%;
    height: 33.333dvh;
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  border: 10px solid black;
  box-sizing: border-box;
}

.contact_social_link_contain img {
  width: auto;
  max-height: 13dvh;
}

.contact_social_link_contain a {
  font-size: 0px;
}


.contact_actionbar {
  width: 100%;
  height: 33.333dvh;
  display: flex;
  justify-content: center;
  align-items: center;
  border-left: 10px solid black;
  border-right: 10px solid black;
  box-sizing: border-box;
}

.contact_actionbar_button {
  width: 100%;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: center;

}

.contact_actionbar_button img {
  width: auto;
  max-height: 16dvh;
  padding: 5px;
}

.contact_actionbar_button a {
  padding: 0px;
  text-decoration: none;
  text-align: center;
  font-size: 0px;
  border: .1rem solid #ffffff80;
  border-radius: .3rem;
  box-sizing: border-box;
}

.contact_actionbar_button a:hover {
  border: .3rem solid white;
  border-radius: .3rem;
}




.header_stick {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  padding: 0px; /* Adjust as needed */
  object-fit: contain;
}

.footer_stick {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  padding: 0px; /* Adjust as needed */
  object-fit: contain;
}

}  
















@media (max-width: 768px) {


   .main-section-contain {
        flex-direction: column;
    }

    .section-contain {
        margin-top: 21dvh;
        margin-bottom: 21dvh;
    }
  

    .header {
        flex-direction: column;
        height: 21dvh;
    }
  

    .logo {
        width: 100%;
        height: 100%;
    }

    .logo img {
        width: auto;
        height: 14dvh;
        object-fit: contain;
    }




    
    .button-contain {
        width: 100%;
        height: 5dvh;        
    }

  
.button {
  width: 20dvw;
  height: auto;
}


.button img {
  width: 19dvw;
  height: auto;
  object-fit: contain;
}




    .section-contain {
        margin-top: 21dvh;
        margin-bottom: 21dvh;
    }


    .main-text-1 {
        width: 100%;
        height: auto;
    }

    .main-text-2 {
        width: 100%;
        height: auto;
    }

    

.gallery-container {
  display: flex;             /* Aligns images in a horizontal row */
  overflow-x: scroll;        /* Enables horizontal scrolling */
  scroll-snap-type: x mandatory; /* Enforces snapping to each image */
  scroll-behavior: smooth;   /* Makes scrolling smooth when using navigation */
  width: 100dvw;               /* Adjust container width as needed */
  height: 58dvh;             /* Set a fixed height for the gallery */
  object-fit: contain;
  box-sizing: border-box;
  
}

.gallery-container img {
  flex: 0 0 100%;            /* Each image takes up the full width of the container */
  width: 100%;               /* Ensures image scales within its flex container */
  height: 100%;              /* Ensures image scales within its flex container */
  object-fit: contain;         /* Ensures images cover the area nicely */
  scroll-snap-align: center; /* Snaps the center of the image to the center of the container */
}




    .bottom-contain {
        width: 100%;
        height: 21dvh;
        flex-direction: column;
    }



.social_link_contain {
    width: 100%;
    height: 7dvh;
}

.social_link_contain img {
  max-height: 5.5dvh;
  width: auto;
  object-fit: contain;
}




.actionbar {
  width: 100%;
  height: 7dvh;
  display: flex;
  justify-content: center;
  align-items: center;
  border: .1rem solid black;
  box-sizing: border-box;
}

.actionbar_button {
  width: 100%;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: space-evenly;
}


.actionbar_button img {
  max-height: 5.5dvh;
  width: auto;
  padding-left: 4dvw;
  padding-right: 4dvw;
}

.actionbar_button a {
  padding: 0px;
  text-decoration: none;
  text-align: center;
  font-size: 0px;
}








.bottom_seven_contain {
    width: 100%;
    height: 7dvh;
}


.bottom_seven_contain img {
  max-height: 6dvh;
  width: auto;
  object-fit: contain;
}



.text-1 {
  height: 5.8dvh;
}

.text-2 {
  height: 5.8dvh;
}



    .contact_header {
        width: 100%;
        height: 21dvh;
        display: flex;
        flex-direction: column;
        text-align: center;
        align-items: center;
    }


 
    .contact_logo {
        width: 100%;
        height: 100%;
    }

    .contact_logo img {
        height: 14dvh;
        width: auto;
        object-fit: contain;
    }






    .contact-button-contain {
        width: 100dvw;
        height: 7dvh;        
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
  
.contact_button {
  width: 20dvw;
  height: auto;
  opacity: 100%;

  display: flex;
  justify-content: center;
  align-items: center;
}

.contact_button img {
  width: 18dvw;
  height: auto;
  padding-top: 0.2dvh;
  padding-bottom: 0.2dvh;
}


  .contact-section-contain {
        width: 100%;
        height: auto;   /* important controls body height */
        display: flex;
        flex-direction: column;
        margin-top: 21dvh;
    }


    .contact-section-2 {
        width: 100%;
        height: auto;
        display: flex;
        align-items: center;
        flex-direction: column;
    }


    .contact-bottom-contain {
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
    }


.contact_actionbar {
  width: 100%;
  height: 58dvh;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
}

.contact_actionbar_button {
  width: 100%;
  height: auto;
  opacity: 100%;
  display: flex;
  justify-content: center;

}

.contact_actionbar_button img {
width: auto;
max-height: 9dvh;
  padding-left: 5px;
  padding-right: 5px;
}



.contact_social_link_contain {
    width: 100%;
    height: 21dvh;
}

.contact_social_link_contain img {
  width: auto;
  max-height: 6.7dvh;
}

}
























@media (max-width: 340px) {

.logo img {
  width: auto;
  height: 9dvh;
}

.contact_logo img {
  width: auto;
  height: 9dvh;
}


.gallery-container {
  display: flex;             /* Aligns images in a horizontal row */
  overflow-x: scroll;        /* Enables horizontal scrolling */
  scroll-snap-type: x mandatory; /* Enforces snapping to each image */
  scroll-behavior: smooth;   /* Makes scrolling smooth when using navigation */
  width: 100dvw;               /* Adjust container width as needed */
  height: 58dvh;             /* Set a fixed height for the gallery */
  object-fit: contain;
  box-sizing: border-box;
  
}

.gallery-container img {
  flex: 0 0 100%;            /* Each image takes up the full width of the container */
  width: 100%;               /* Ensures image scales within its flex container */
  height: 100%;              /* Ensures image scales within its flex container */
  object-fit: contain;         /* Ensures images cover the area nicely */
  scroll-snap-align: center; /* Snaps the center of the image to the center of the container */
}




}