html {
    /*font-size: calc(0.75em + 0.5vw);*/
}
body,
p {
  font-family: 'Josefin Sans', Montserrat;
  -webkit-font-smoothing: antialiased;
}

h2 {
  font-family: 'Josefin Sans', Montserrat;
  font-size: 1.5rem;
  color: #27271f;
}

h1,
h3,
h4,
h5,
h5,
p {
  font-family: 'Josefin Sans', Montserrat;
  font-size: 1rem;
  color: #27271f;
}

nav {
  min-height: 45px;
  height: 10vh;
  /*overflow: hidden;*/
}

footer {
  height: 4vh;
}

.nav-item {
  font-family: 'Josefin Sans', Montserrat;
}

h5 {
  color: #37372d;
}

.josefin-sans-font {
  font-family: 'Josefin Sans', Montserrat;
  /* font-weight: 100; */
}

.montserrat-font {
  font-family: 'Josefin Sans', Montserrat;
  /* font-weight: 700; */
}

.lovelo-font {
  font-family: 'Josefin Sans', Montserrat;
}

.main-container {
  /*background-color: #89845a;*/
  background-color: white;
  height: auto;
  padding-top: 70px;

}

a {
  color: #8a8354;
}

a:hover {
  color: #b3ad83;
}

/* home page styles */
.home-img {
  display: block;
  margin: auto;
  padding: auto;
  width: 20vw;
  height: 20vh;
  object-fit: cover;
}

.home-img-l {
  display: block;
  margin: auto;
  padding: auto;
  width: 15vw;
  object-fit: contain;
}

.home-splash-img {
  margin: auto;
  padding: 2vw;
  width: 35vw;
  object-fit: contain;
}

.home-img-text {
  color: white;
  /* position: relative;
    margin-bottom: -60px; */
  /*font-size: calc(1.9rem + 1.5vw);*/
  font-size: 1rem;
  margin: 0;
  position: absolute;
  top: 25%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  /* font-style: normal; */
  /* font-weight: 700; */
  /* font-size: 60px; */
  /* line-height: 60px; */

  /* width: 610px;
    height: 60px;
    left: 117px;
    top: 325px; */
}

.home-rec {
  width: 75px;
  height: 75px;
  border-radius: 20px;
  margin-bottom: 10px;
}

.pink-bg {
  background: #e7c7c7;
}
.pink-bg:hover {
  background: #f1d3d3;
}

.orange-bg {
  background: #e7d9ab;
}
.orange-bg:hover {
  background: #ecdeb0;
}

.blue-bg {
  background: #98c3db;
}
.blue-bg:hover {
  background: #a0cce4;
}

.green-bg {
  background: #a6da94;
}
.green-bg:hover {
  background: #b0e59e;
}

.purple-bg {
  background: #cec2f0;
}
.purple-bg:hover {
  background: #d2c6f3;
}

.lightblue-bg {
  background: #adeae6;
}
.lightblue-bg:hover {
  background: #b3eeea;
}

.section-color {
  background: rgba(217, 217, 217, 0.3);
}

.modal-custom {
  background: #ececde;
  z-index: 10;
}

/* footer styles */
footer {
  border-top: solid #edebde;
}

footer a {
  text-decoration: none;
  color: #8a8354;
  font-size: 0.9em;
  font-family:  Montserrat;
  font-weight: 100;
}

footer a:hover {
  text-decoration: underline;
  color: #6b6853;
}

/* about page styles */
.abouthead-bg {
  background: rgba(180, 186, 141, 0.3);
}

.img-custom {
  width: 80%; /* or any specific width you prefer */
  height: auto; /* to maintain the aspect ratio */
  object-fit: fill; /* to ensure the image covers the whole area of img tag */
}

.img-custom:hover {
  opacity: 60%;
}

.col-sm-3.text-bottom {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

@media (max-width: 468px) {
  .navbar-collapse-custom {
    margin-top: 80px;
    font-size: 1 rem;
  }
}

.nav-link.active {
  font-weight: bold;
}

#sys_dataContainer ul {
  display: flex; flex-direction: column; gap: 60px;font-size: 28px;
}

#sys_dataContainer li {
  /*font-size: 28px;*/
  color: #3E3C3C;
}