body {
    font-family: "Figtree", sans-serif;
  }
/* font-sizes  */
.text-64 {
    font-size: 64px;
    font-weight: 700;
    line-height: 76.8px;
    letter-spacing: -0.04em;
}

.text-55 {
    font-size: 55px;
    font-weight: 700;
    line-height: 76.8px;
    letter-spacing: -0.04em;
}

.text-48 {
    font-size: 48px;
    font-weight: 500;
    line-height: 57.6px;
    letter-spacing: -0.04em;
}

.text-32 {
    font-size: 32px;
    font-weight: 500;
    line-height: 38.4px;
    letter-spacing: -0.05em;
}

.text-80 {
    font-size: 80px;
    font-weight: 700;
    line-height: 96px;
    letter-spacing: -0.05em;
}

.text-40 {
    font-size: 40px;
    font-weight: 600;
    line-height: 46px;
}

.text-28 {
    font-size: 28px;
    font-weight: 400;
    line-height: 32.2px;
}

.text-24 {
    font-size: 24px;
    font-weight: 400;
    line-height: 28.8px;
    letter-spacing: -0.04em;
}

.text-20 {
    font-size: 20px;
    font-weight: 400;
    line-height: 23px;
}

.text-18 {
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
}

/* color  */
.brown-color {
    color: rgba(28, 3, 1, 1);
}

.grey-color {
    color: rgba(103, 103, 103, 1);
}

.gold-color {
    color: rgba(255, 168, 0, 1);
}

.red-color {
    color: rgba(178, 21, 4, 1);
}

.blue-color {
    color: rgba(23, 15, 73, 1);
}

.lb-color {
    color: rgba(111, 108, 144, 1);

}

/* background color  */
.red-bg {
    background-color: rgba(178, 21, 4, 1);
}

.pink-bg {
    background-color: rgba(255, 168, 0, 0.1);
}

.brown-bg {
    background: rgba(28, 3, 1, 1);
}

.gold-bg {
    background-color: rgba(255, 168, 0, 1);
}

.blur-whitebg {
    background-color: rgba(255, 255, 255, 0.842);
}

.grey-bg {
    background-color: rgba(244, 244, 244, 1);

}

/* nav bar  */
.navbar {
    z-index: 1000;
    border-bottom: 5px solid rgba(178, 21, 4, 1);
}

#service {
    color: rgba(178, 21, 4, 1);
}

.logbtn{
    background-color:rgba(178, 21, 4, 1) ;
    color: white;
    &:hover{
      background: white;
      color: rgba(178, 21, 4, 1) ;
      border: 2px solid rgba(178, 21, 4, 1) ;
    }
  }
.btn-red-1 {
    color: white;
    background-color: rgba(178, 21, 4, 1);
    border: 2px solid rgba(178, 21, 4, 1); /* Ensure the button has a border */
    transition: color 0.3s, background-color 0.3s, border-color 0.3s; /* Smooth transition */
}

.btn-red-1:hover {
    color: rgba(178, 21, 4, 1); /* Change text color on hover */
    background-color: white; /* Optional background color change */
    border-color: rgba(178, 21, 4, 1); /* Ensure the border color remains consistent */
}

.btn-red-1 a {
    color: inherit; /* Inherit text color from the button */
    text-decoration: none; /* Remove underline */
}

.btn-red-1:hover a {
    color: inherit; /* Maintain hover text color from the button */
}

.time{
    margin-left: auto;
}
.text-left {
    text-align: left; /* Aligns text to the left */
}

.d-flex1 {
    display: flex;
    flex-direction: row; /* Default direction for larger screens */
}

@media screen and (max-width: 375px) {
    .d-flex1 {
        flex-direction: column; /* Stack elements on small screens */
        justify-content: start; /* Align items to the start */
        align-items: flex-start; /* Ensure all items align to the left */
    }
}

