@charset "UTF-8";
:root {
  --pamoja-orange: #d65e29;
  --pamoja-orange-rgb: 214, 94, 41;
  --pamoja-yellow: #e2b354;
  --pamoja-yellow-rgb: 226, 179, 84;
  --pamoja-blue: #233155;
  --pamoja-blue-rgb: 35, 49, 85;
  --pamoja-red: #6b0505;
  --bs-primary: var(--pamoja-orange);
  --bs-primary-rgb: var(--pamoja-orange-rgb);
  --bs-secondary: var(--pamoja-yellow);
  --bs-secondary-rgb: var(--pamoja-yellow-rgb);
  --bs-heading-color: var(--pamoja-blue); }

.bg-pamoja-blue {
  background-color: rgba(var(--pamoja-blue-rgb), var(--bs-bg-opacity)); }

.btn-primary {
  --bs-btn-bg: var(--pamoja-orange);
  --bs-btn-hover-bg: var(--pamoja-orange);
  --bs-btn-hover-border-color: var(--pamoja-orange);
  --bs-btn-disabled-bg: var(--pamoja-orange);
  border: none; }

.btn:hover, .btn:focus,
input:hover,
input:focus,
.select2:hover,
.select2:focus {
  box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 16px 0px !important; }

.btn .select2-selection,
input .select2-selection,
.select2 .select2-selection {
  border: none; }

input:not(:placeholder-shown).custom-amount {
  box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 16px 0px !important; }

input[type="checkbox"]:checked {
  accent-color: var(--pamoja-orange);
  background-color: var(--pamoja-orange);
  border-color: var(--pamoja-orange); }

.btn-outline-primary {
  --bs-btn-color: var(--bs-dark); }

.btn-check + .btn {
  --bs-btn-bg: var(--bs-light);
  --bs-btn-border-color: var(--bs-light); }

.btn-check:checked + .btn {
  --bs-btn-active-bg: var(--pamoja-orange);
  --bs-btn-active-border-color: var(--pamoja-orange);
  box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 16px 0px !important; }

.container {
  max-width: 960px; }

body {
  font-family: Roboto, Helvetica, Arial, sans-serif; }

.social-icon {
  color: var(--pamoja-blue); }

a {
  color: var(--pamoja-orange);
  text-decoration: none; }

.link-hover-underline a:hover {
  color: var(--pamoja-orange);
  text-decoration: underline; }

.btn-link {
  color: white;
  text-decoration: none; }
  .btn-link:hover {
    color: white;
    text-decoration: none; }

.contact-card i {
  width: 15px;
  text-align: center; }

.home-description {
  background-color: #eae9e6; }

.home-description-row {
  padding: 5%;
  font-size: 1.1rem; }

.border-custom-yellow {
  border-color: var(--pamoja-yellow); }

.font-custom-blue {
  color: var(--pamoja-blue); }

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; }

h1 {
  font-size: clamp(1rem, 8vw, 2.8rem); }

.nav-link {
  color: var(--pamoja-blue);
  font-weight: bold; }
  .nav-link .active {
    color: black; }

.fade-in-text {
  animation: fade-right 3s, fade-in 2s;
  animation-timing-function: cubic-bezier(0.1, 0, 3, 1); }

@keyframes fade-right {
  from {
    padding-right: 30px; }
  to {
    padding-right: 0px; } }

@keyframes fade-in {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

input.form-control,
textarea.form-control,
select.form-control {
  border: 0px;
  border-bottom-width: 2px;
  border-color: var(--pamoja-red);
  border-bottom-style: solid;
  border-radius: 0; }

.select2 {
  border: 0px;
  border-bottom-width: 2px;
  border-color: var(--pamoja-red);
  border-bottom-style: solid;
  border-radius: 0;
  padding: 5px 5px; }

/* Ensures links auto-scroll below the navbar */
html,
body {
  scroll-padding-top: 90px; }

.navbar-toggler:hover, .navbar-toggler:focus, .navbar-toggler:active,
.navbar-toggler-icon:hover,
.navbar-toggler-icon:focus,
.navbar-toggler-icon:active,
.navbar .dropdown button:hover,
.navbar .dropdown button:focus,
.navbar .dropdown button:active {
  outline: none;
  box-shadow: none !important; }

/* https://stackoverflow.com/questions/58108177/set-bootstrap-4-collapse-default-hidden-or-shown-based-on-breakpoint */
/* Show collapsible above sm by default. Don't show below */
@media (min-width: 576px) {
  .collapse.collapse-reverse.show {
    display: none !important; }
  .collapse.collapse-reverse:not(.show) {
    display: block !important; } }

/* Hide the spinner on number input fields */
input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield; }
  input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none; }

/* Removes grey extras on each side of the progress bar */
.progress {
  padding: 0 !important; }

.required::after {
  content: "*";
  color: var(--pamoja-orange); }

.card-img-top {
  height: auto; }

.shortcode-youtube {
  position: relative;
  display: inline-block;
  width: 100%; }
  .shortcode-youtube::before, .shortcode-youtube::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0; }
  .shortcode-youtube::before {
    background: url(/images/youtube_preview_button/youtube_button.svg) center center/auto 4rem no-repeat; }
  .shortcode-youtube:hover::before {
    background: url(/images/youtube_preview_button/youtube_button_hover.svg) center center/auto 4rem no-repeat; }
  .shortcode-youtube::after {
    background: url(/images/youtube_preview_button/youtube.svg) calc(100% - 1rem) calc(100% - 1rem)/auto 2rem no-repeat; }
  .shortcode-youtube img {
    display: block;
    width: 100%; }

.hero-image {
  background-size: cover;
  height: 50vh; }

.custom-amount-wrapper {
  position: relative;
  display: inline-block; }
  .custom-amount-wrapper:not(:placeholder-shown)::after {
    color: var(--bs-light); }
  .custom-amount-wrapper::after {
    content: "€";
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: var(--bs-secondary); }

.custom-amount {
  min-width: 200px; }
  .custom-amount:hover {
    background-color: #e9ecef;
    caret-color: var(--pamoja-orange); }
  .custom-amount:focus {
    background-color: #e9ecef;
    caret-color: var(--pamoja-orange); }
    .custom-amount:focus::placeholder {
      color: transparent; }
  .custom-amount:not(:placeholder-shown) {
    background-color: var(--pamoja-orange) !important;
    caret-color: var(--bs-light);
    color: var(--bs-light); }
    .custom-amount:not(:placeholder-shown):hover, .custom-amount:not(:placeholder-shown):focus {
      background-color: var(--pamoja-orange) !important;
      caret-color: var(--bs-light);
      color: var(--bs-light); }

.form-check-input {
  border-color: darkgray;
  border-width: 2px; }

.pamoja-tooltip {
  --bs-tooltip-bg: var(--pamoja-orange); }
  .pamoja-tooltip a {
    text-decoration: none;
    color: white; }
  .pamoja-tooltip p:last-child {
    margin-bottom: 0; }

.pamoja-tooltip-large {
  --bs-tooltip-bg: var(--pamoja-blue);
  --bs-tooltip-max-width: 400px;
  text-align: left !important; }
  .pamoja-tooltip-large .tooltip-inner {
    text-align: left; }
  .pamoja-tooltip-large p:last-child {
    margin-bottom: 0; }

.dropdown-menu {
  border-radius: 0; }

@media (min-width: 992px) {
  .dropdown:hover > .dropdown-menu {
    display: block; }
  .dropdown > .dropdown-toggle:active {
    /*Without this, clicking will make it sticky*/
    pointer-events: none; } }

.justified-gallery {
  margin: 20px 0; }

.video-overlay {
  position: absolute;
  margin: 15px;
  font-size: 20px;
  color: white; }
  .video-overlay i {
    text-shadow: 1px 1px 3px black, -1px -1px 3px black; }

.accordion {
  --bs-accordion-border-color: rgba(var(--bs-secondary-rgb), 1);
  --bs-accordion-border-width: 2px; }

.accordion-button {
  color: var(--bs-body-color); }

.accordion-button::after {
  filter: none;
  /* reset any inherited filters */ }

.accordion-button:not(.collapsed) {
  background-color: var(--bs-secondary);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.05); }

.accordion-button:not(.collapsed)::after {
  filter: invert(1) brightness(1.1); }

.accordion-button:focus {
  border-color: rgba(var(--bs-secondary-rgb), 1); }

.accordion-item {
  border-color: rgba(var(--bs-secondary-rgb), 1); }

.accordion-button.collapsed {
  background-color: rgba(var(--pamoja-yellow-rgb), 0.2); }

.accordion-button.collapsed:hover {
  background-color: rgba(var(--pamoja-yellow-rgb), 0.5); }