:root {
  --light-bg: #f8f8f9;
  --dark: #222425;
  --white: white;
  --light-primary-201: #814efa;
  --light-primary-hover: #673ec8;
  --meetingscience-blue: #19acc0;
  --light-primary-200: #b395fc;
  --light-sea-green: #01b1a1;
  --light-primary-300: #cdb8fd;
  --light-primary-100: #9a71fb;
  --light-grey: #e7e7e7;
  --light-purple: #ece6fc;
  --logiselect-turquoise: #00ccb7;
  --grey-2: #757575;
  --light: #fbfbfb;
  --grey: #757575;
  --light-primary-400: #e6dcfe;
  --light-red: #ffeded;
  --error-red: #ff2947;
  --light-secondary-200: #f0f0f0;
  --light-secondary-300: #e6e6e6;
}

@font-face {
  font-family: 'Brown-Pro-Regular';
  src: url('../fonts/BrownPro-Regular.otf');
}
.brown-regular {
  font-family: 'Brown-Pro-Regular', sans-serif;
}
@font-face {
  font-family: 'Brown-Pro-Bold';
  src: url('../fonts/BrownPro-Bold.otf');
  font-weight: 700;
}
.brown-bold {
  font-family: 'Brown-Pro-Bold', sans-serif;
}
@font-face {
  font-family: 'Brown-Pro-Light';
  src: url('../fonts/lineto-brown-pro-light.woff');
  font-weight: 300;
}
.brown-light {
  font-family: 'Brown-Pro-Light', sans-serif;
}

.smartbreaks-background-animation.fade {
  opacity: 0.4;
  background-image: url('../images/Animation2.svg');
  background-position: 50%;
  background-size: cover;
  height: 160%;
  display: block;
  position: absolute;
  inset: -30% 0 0;
}

@media (min-width: 1024px) {
  .clip-diamond {
    clip-path: polygon(0% 0%, 100% 0%, 100% 12%, 100% 93%, 0 100%, 0% 100%);
  }

  .clip-diamond-2 {
    clip-path: polygon(0% 7%, 100% 0%, 100% 12%, 100% 93%, 0 100%, 0% 100%);
  }

  .clip-diamond-3 {
    clip-path: polygon(0% 7%, 100% 0%, 100% 12%, 100% 93%, 0 100%, 0% 100%);
  }
}

.testimonial-slide .slick-dots {
  bottom: -60px;
}

.testimonial-slide .slick-dots li button:before {
  color: #fff;
  font-size: 30px;
}

.testimonial-slide .slick-dots li {
  margin: 0;
}

.testimonial-slide .slick-dots li.slick-active button:before {
  color: #fff;
}

@keyframes slideDown {
  0% {
    transform: translateY(-100%);
    opacity: 0;
  }
  100% {
    transform: translateY(0%);
    opacity: 1;
  }
}

@keyframes fadeOutDown {
  0% {
    transform: translateY(0%);
    opacity: 1;
  }
  100% {
    transform: translateY(100%);
    opacity: 0;
  }
}

.text-enter {
  animation: slideDown 0.6s ease forwards;
}

.text-exit {
  animation: fadeOutDown 0.6s ease forwards;
}

.nav-link.active {
  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-thickness: 1px;
}