:root {
  --main-transition: all 0.3s ease;
  --main-hero-color: #590d82;
  --main-hero-color-active: #f25d9c;
  --content-bg-color: #f5e6fc;
  --content-bg-color-hsl: 280.9, 78.6, 94.5
}

/* BS FIXES */
.dropdown-toggle::after { display:none }

.dropdown-item.active, .dropdown-item:active {
  background-color: var(--content-bg-color);
  color:black;
}

.dropdown-menu.show {
  border-color: var(--main-hero-color);
}

/* MAIN STYLE */
body {
  font-family: "Open Sans", sans-serif;
}

.content {
  background-color: #f5e6fc;
  border-radius: 25px;
}

img {
  border-radius: 25px;
}

a {
  color: var(--main-hero-color);
  transition: var(--main-transition);
}

a:hover {
  color: var(--main-hero-color-active);
}

.carousel img {
  display: block;
  height: 200px;
  border-radius: 0;
  border: 1px solid var(--content-bg-color);
}

.text-wrapper i {
  color: var(--main-hero-color);
}

@media screen and ( min-width: 768px ) {
  .carousel img {
    height: 300px;
  }
}

@media screen and ( min-width: 1200px ) {
  .text-wrapper {
    width:50%;
  }
}


.flickity-viewport{
  border-radius: 25px 25px 0 0;
}

.flickity-button {
  background: hsla(280.9, 78.6%, 94.5%,.75);
}

.flickity-button:hover {
  background: var(--content-bg-color);
}

.flickity-button:focus {
  outline: 0;
  box-shadow: 0 0 0 5px var(--main-hero-color-active);
}