.mx-800 {
  max-width: 800px;
  display: inline-block;
}

#beta-testeurs .heading-area p.para {
  font-size: 1.2rem;
  margin: 1rem 0;
  color: #ffffff;
}

#main-header .logo-dark.default {
  display: block;
  width: 80px;
  height: 80px;
}
#main-header.header-appear .logo-dark.default {
  width: 60px;
  height: 60px;
}

/* Navigation Pills Custom Styles */
.nav-pills .nav-link {
  border-radius: 50px;
  padding: 0.75rem 1.5rem;
  transition: all 0.3s ease;
}
.nav-pills .nav-link.active {
  background-color: #562FB7;
  color: white !important;
  text-decoration: none !important;
}
.nav-pills .nav-link:hover {
  color: #562FB7;
  text-decoration: underline;
}

/* Optional: Add a subtle hover effect for non-active pills */
.nav-pills .nav-link:not(.active):hover {
  color: #562FB7;
}

/* FORMS */
form[data-parsley-validate] input.parsley-success,
form[data-parsley-validate] select.parsley-success,
form[data-parsley-validate] textarea.parsley-success {
  border-color: #28a745;
}
form[data-parsley-validate] input.parsley-error,
form[data-parsley-validate] select.parsley-error,
form[data-parsley-validate] textarea.parsley-error {
  border-color: #dc3545;
}
form[data-parsley-validate] .parsley-errors-list {
  list-style-type: none;
  padding-left: 0;
  margin-top: -1rem;
  font-size: 80%;
  color: #dc3545;
}
form[data-parsley-validate] .parsley-error ~ .parsley-errors-list {
  display: block;
}
form[data-parsley-validate] .parsley-errors-list.filled {
  display: block;
}
form[data-parsley-validate] .parsley-errors-list li {
  margin-bottom: 0.25rem;
}
form[data-parsley-validate] .parsley-success:focus,
form[data-parsley-validate] .parsley-error:focus {
  box-shadow: none;
}

.form-control:not([type=checkbox]) {
  min-height: 50px !important;
}

textarea.form-control.js-auto-size {
  box-sizing: border-box;
  max-height: 300px;
  min-height: 100px !important;
}

label.required::after {
  content: " *";
  color: red;
}

.form-check input[type=checkbox] {
  width: 25px;
  min-height: 25px;
  height: 25px;
  display: inline-block;
}
.form-check label {
  position: absolute;
  margin-left: 8px;
}

/* ===================================
   About
====================================== */
#portfolio {
  background-color: #f2f2f2;
}
#portfolio .main-title {
  position: relative;
  margin-bottom: 4rem;
  text-align: center;
}
#portfolio .about-box {
  border-radius: 20px;
  padding: 50px 15px 50px;
  background: #ffffff;
  text-align: center;
  cursor: pointer;
  -webkit-box-shadow: 0 0 5px rgba(127, 123, 123, 0.1);
  box-shadow: 0 0 5px rgba(127, 123, 123, 0.1);
  transition: ease-in-out 0.3s;
}
#portfolio .about-box:hover {
  background: #03b3cb;
  -webkit-box-shadow: 0 0 10px -2px rgba(127, 123, 123, 0.9);
  box-shadow: 0 0 10px -2px rgba(127, 123, 123, 0.9);
}
#portfolio .about-box .about-main-icon img {
  width: 80px;
  transform: translateY(0);
  transition: ease-in-out 0.3s;
}
#portfolio .about-box:hover .about-main-icon img {
  transform: translateY(-10px);
}
#portfolio .about-box h5 {
  font-weight: 200;
  color: #1f1f1f;
  transition: ease-in-out 0.3s;
}
#portfolio .about-box:hover img, #portfolio .about-box:hover h5 {
  color: #fff;
  transition: ease-in-out 0.3s;
}
#portfolio .about-opacity-icon {
  width: 100%;
  display: flex;
  justify-content: center;
}
#portfolio .about-opacity-icon img {
  position: absolute;
  color: #03b3cb;
  top: 30px;
  width: 100px;
  line-height: 1;
  text-transform: capitalize;
  opacity: 0;
  animation: scale 0.6s alternate infinite linear both;
}
@keyframes scale {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-10px);
  }
}
#portfolio .about-box:hover .about-opacity-icon img {
  width: 100px;
  opacity: 0.09;
}
#portfolio .about-box.active {
  background: #03b3cb;
  -webkit-box-shadow: 0 0 10px -2px rgba(127, 123, 123, 0.9);
  box-shadow: 0 0 10px -2px rgba(127, 123, 123, 0.9);
}
#portfolio .about-box.active i, #portfolio .about-box.active h5 {
  color: #fff;
}
#portfolio .about-box.active .about-opacity-icon img {
  opacity: 0.09;
}
#portfolio .about-box.active:hover {
  background: #fff;
  -webkit-box-shadow: 0 0 5px rgba(127, 123, 123, 0.1);
  box-shadow: 0 0 5px rgba(127, 123, 123, 0.1);
}
#portfolio .about-box.active:hover i {
  color: #bd084d;
}
#portfolio .about-box.active:hover h5 {
  color: #1f1f1f;
}
#portfolio .about-box.active:hover .about-opacity-icon img {
  opacity: 0.09;
}
#portfolio .about-box.active.about-box-green {
  background: #fff;
  -webkit-box-shadow: 0 0 5px rgba(127, 123, 123, 0.1);
  box-shadow: 0 0 5px rgba(127, 123, 123, 0.1);
}
#portfolio .about-box.active.about-box-green img {
  color: #bd084d;
}
#portfolio .about-box.active.about-box-green h5 {
  color: #1f1f1f;
}
#portfolio .about-box.active.about-box-green .about-opacity-icon i {
  opacity: 0;
}
#portfolio .about-box.active.about-box-green:hover {
  background: #03b3cb;
}
#portfolio .about-box.active.about-box-green:hover img {
  color: #ffffff;
}
#portfolio .about-box.active.about-box-green:hover h5 {
  color: #ffffff;
}
#portfolio .about-box.active.about-box-green:hover .about-opacity-icon img {
  opacity: 0.09;
}

#blog .news-item > div {
  padding: 24px;
}

@media screen and (max-width: 767px) {
  .nav-holder.style-2 .full-menu-navigation {
    top: 40%;
  }
  p {
    text-align: justify;
  }
  .container {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }
}
#organization {
  color: #ffffff !important;
}
#organization h2, #organization span {
  color: #ffffff !important;
}

.preview-img {
  max-width: 100%;
  cursor: pointer;
  transition: transform 0.3s ease;
}

.preview-img:hover {
  transform: scale(1.02);
}

.nav-holder.style-2 .full-menu-navigation.left ul > li > a {
  text-align: left;
  padding: 12px 0 12px 30px !important;
}

.page-title h1 {
  position: relative;
  color: #ffffff;
  font-weight: 600;
  line-height: 1.2em;
  margin-bottom: 10px;
  font-size: 3.5rem;
  text-transform: capitalize;
}
.page-title h1 span {
  display: block;
  font-size: 0.4em;
}

.page-title img.header-img {
  margin: auto;
}

@media (max-width: 767px) {
  .mb-xs-2rem {
    margin-bottom: 2rem !important;
  }
  .page-title img.header-img {
    max-width: 200%;
    width: 200%;
    margin-left: -50% !important;
  }
}

/*# sourceMappingURL=custom.css-QbQVItf.map */
