@import url('https://fonts.googleapis.com/css2?family=Libre+Caslon+Text&family=Montserrat:ital,wght@0,400;0,700;1,900&family=Playfair+Display&family=Nosifer&family=Young+Serif&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cinzel&family=Fjalla+One&family=Montserrat:wght@900&display=swap');

.bgimg{
    background: url(images/bg.jpg);
     height: 100vh; 
     width: 100vw; 
     background-position: center;     
     background-size: cover; 
     margin: 0 0 3em 0;
}
.navBar{
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 120%;
    font-weight:530;
}


.logo{
    height: 40vh;
}
.jcc{
    font-family: 'Fjalla One', sans-serif;
    font-size: 320%;
    padding-bottom: 1%;
    padding-top: 1%;
   
    
}
.tag{
    font-family: 'Cinzel', serif;
    color: black;
    font-weight: bold;
    text-align: center;
    padding: 0.2rem 5rem 0rem 5rem;
    font-size: 2.5vw;
    /* position: absolute; */
}

.wrapper {
  display: grid;
  place-items: center;
}

.tag2 {
  white-space: nowrap;
  overflow: hidden;
  font-family: 'Montserrat', sans-serif;
  color: rgb(244, 229, 97);
  font-size: 1.8vw;
  position: relative;
  margin-left: -30%; /* Start off-screen */
  animation: typing 3s steps(60) infinite forwards; /* Use forwards to retain final state */
}

@keyframes typing {
  to {
    margin-left: 0; /* Move to on-screen position */
  }
}


  

.content{
    font-family: 'Montserrat', sans-serif;
    font-size: 1.5vw;
    text-align: justify;
    padding-bottom: 5% ;
    padding: 1% 0% 5%
}
.head{
    font-family: 'Playfair Display', serif;
    font-size: 2.7vw;
    padding-bottom: 5% ;
    padding: 1% 1% 5%;
}

.button{
    color: black;
}
.button:hover{
    background-color: black;
    color: white;
}


.carousel-caption {
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    text-align: center;
    padding: 20px;
}

.carousel-caption h2 {
    font-size: 36px;
}

.carousel-caption p {
    font-size: 18px;
}


.social-buttons {
    margin: 1vw;
    
  }

  .social-buttons a {
    display: inline-block;
    margin: 1vw 5vw;
    color: #fff;
    text-align: center;
    font-size: 3.5vw;
    border-radius: 50%;
    width: 6vw;
    height: 6vw;
    line-height: 6vw;
    background-color: #007bff;
    transition: background-color 0.3s;
    text-decoration: none;
  }

  .social-buttons a:hover {
    background-color: #0056b3;
    text-decoration: none;
  }

  .fa-facebook-f {
    background-color: #3b5998;
  }

  .fa-instagram {
    background-color: #e4405f;
  }

  .fa-whatsapp {
    background-color: #25d366;
  }

  .fa-envelope {
    background-color: #dd4b39;
  }


  @media (max-width: 768px) {

    .col-4 {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
    }


    .fa,
    .fa-instagram,
    .fa-facebook,
    .mail {
        max-height: 37vw; /* Adjust the max-height as needed */
        max-width: 27vw;  /* Adjust the max-width as needed */
        display: block;   
        margin: 0 auto;
       
    }
}
