body {
  font-family: "jf-jinxuanlatte", sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "jf-jinxuan", serif;
  text-decoration: none;
}

a {
  text-decoration: none;
}

p {
  color: #FFF;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: bold;
}

.bg-dark hr {
  border-color: rgba(255, 255, 255, 0.2);
}

::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-track {
  background: var(--bs-gray-400);
  outline: 1px solid white;
}

::-webkit-scrollbar-thumb {
  background: #EECC00;
}
::-webkit-scrollbar-thumb:hover {
  background: #FEDC00;
}

#footer {
  width: 100%;
  background: linear-gradient(30deg, var(--bs-gray-800), var(--bs-gray-900));
}
#footer a {
  color: white;
}
#footer a:link:hover, #footer a:visited:hover {
  color: var(--bs-gray-400);
}
#footer .business-info {
  color: var(--bs-gray-200);
}

.bg-dark-transparent {
  margin: 0;
  background-color: rgba(0, 0, 0, 0.5);
}

.rwd-row {
  margin: 0 15%;
}

.work-block {
  background-color: rgba(0, 0, 0, 0.5);
  transition: 0.3s;
}
.work-block .img-block {
  background-position: center;
  background-size: cover;
  height: 0;
  width: 0;
  padding-top: 100%;
  padding-left: 100%;
  transition: 0.3s;
  filter: grayscale(100%);
}
.work-block:hover {
  background-color: rgb(0, 0, 0);
  transition-delay: 0 !important;
  transform: translate(-2px, -2px) !important;
  filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.5));
}
.work-block:hover .img-block {
  filter: grayscale(0%);
}
.work-block p {
  margin: 1em;
  transition: 0.3s;
}
.work-block:hover a, .work-block a:hover {
  text-decoration: none;
}

.modal-header {
  border: 0;
}

.modal .carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.modal p {
  text-align: justify;
}

@media (max-width: 992px) {
  .rwd-row {
    margin: 0 10%;
  }
}
@media (max-width: 767px) {
  .rwd-row {
    margin: 0;
  }
  .work-block .img-block {
    filter: grayscale(0%);
  }
}