.delta-center-vertical {
  margin: 0;
  position: relative;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 100%;
}

.delta-no-overflow-horizontal {
  overflow-x: hidden!important;
}

.delta-stick-top-temp-right {
  position: absolute;
  top: 9px;
  z-index: 999;
  right: 9px;
}

.delta-stick-bottom-temp {
  position: absolute;
  bottom: 9px;
  z-index: 999;
  left: 9px;
}

.delta-stick-bottom-perm {
  position: fixed;
  bottom: 0px;
  z-index: 999;
}

.delta-c-100w {
  width: 100%;
  align-content: center;
}

.delta-shape-mask-one {
  --mask: radial-gradient(52.06px at 50% calc(100% + 39.15px),#0000 calc(99% - 9px),#000 calc(101% - 9px) 99%,#0000 101%) calc(50% - 54px) calc(50% - 18px + .5px)/108px 36px , radial-gradient(52.06px at 50% -39.15px,#0000 calc(99% - 9px),#000 calc(101% - 9px) 99%,#0000 101%) 50% calc(50% + 18px)/108px 36px;
  -webkit-mask: var(--mask);
  mask: var(--mask);
  size: 50px;
}

.delta-blur-9px {
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
}

.navbar-toggler {
  padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);
  font-size: var(--bs-navbar-toggler-font-size);
  line-height: 1;
  color: #fafafa!important;
  background-color: transparent;
  border: var(--bs-border-width) solid transparent!important;
  border-radius: var(--bs-navbar-toggler-border-radius);
  transition: var(--bs-navbar-toggler-transition);
}

.delta-gray-backblurred-bg-btn {
  background: rgba(62,68,80,0.54)!important;
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
  color: #fafafa!important;
  border-radius: 12px;
  border: none;
}

.delta-noHover {
  pointer-events: none;
}

html {
  scroll-behavior: smooth;
}

html::-webkit-scrollbar {
  display: none;
}

.gallery {
  /*margin-top: 5%;*/
  /*padding-top: 0px;*/
  text-align: center;
}

.centered-container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 50px;
  margin-bottom: 100px;
  margin-left: 10px;
  margin-right: 10px;
}

.image-container {
  width: 100%;
  text-align: center;
}

#myModal {
  z-index: 101;
}

.scrollable-images {
  display: flex;
  /*justify-content: center;*/
  overflow-x: auto;
  gap: 18px;
  transition: 540ms cubic-bezier(0.075, 0.02, 0.165, 1);
  transform-origin: center;
}

.scrollable-images::-webkit-scrollbar {
  display: none;
}

.scrollable-images img {
  width: 270px;
  max-width: 100%;
  height: 300px;
  object-fit: cover;
  cursor: pointer;
  border-radius: 5px;
  cursor: pointer;
  transition: 0.22s;
  filter: grayscale(0%);
}

.scrollable-images img:hover {
  filter: grayscale(100%);
}

.modal {
  display: none;
  position: fixed;
  z-index: 1;
  padding-top: 100px;
  padding-bottom: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  overflow-y: auto;
  background-color: #ffffffcc;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.modal-content {
  background-size: contain;
  margin: auto;
  display: block;
  width: auto;
  height: auto;
  /*margin-bottom: 27px;*/
}

#caption {
  margin: auto;
  display: block;
  font-family: 'FONTSPRING DEMO - Aequitas';
  width: 100%;
  max-width: 700px;
  text-align: justify;
  color: #000000;
  padding: 10px 0;
  /*height: 150px;*/
  font-size: 18px;
  margin-top: 18px;
  margin-bottom: 27px;
}

.modal-content, #caption {
  animation-name: zoom;
  animation-duration: 0.54s;
}

.close {
  position: absolute;
  top: 35px;
  right: 35px;
  color: #181718;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}

.close:hover, .close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

@keyframes zoom {
  from {
    transform: scale(0.1);
  }
  to {
    transform: scale(1);
  }
}

@keyframes typing {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}

@media screen and (max-width:768px) {
  .modal-content {
    margin-top: 20%;
    width: 100%;
  }
}

@media (min-width: 769px) {
  .modal-content {
    /*max-width: none;*/
    max-height: 100%;
    width: auto;
  }
}

/* Style the button and place it in the middle of the container/image */