/**
 * @file
 * Gradient backgrounds for content boxes
 * Usage: Add gradient class to any element (e.g. class="gradient-smaragd-aquamarin")
 */

/* ==========================================================================
   GRADIENTS - DIAGONAL (top-left to bottom-right)
   ========================================================================== */

.gradient-amethyst-erde {
  background: linear-gradient(to bottom right, #D971AF 0%, #C0BC1A 100%);
}

.gradient-aprikose-preussen {
  background: linear-gradient(to bottom right, #FFA29B 0%, #11A8C1 100%);
}

.gradient-aprikose-smaragd {
  background: linear-gradient(to bottom right, #FFA29B 0%, #00C9A0 100%);
}

.gradient-flieder-preussen {
  background: linear-gradient(to bottom right, #DCCBFF 0%, #11A8C1 100%);
}

.gradient-flieder-rubin {
  background: linear-gradient(to bottom right, #DCCBFF 0%, #D71760 100%);
}

.gradient-heide-rubin {
  background: linear-gradient(to bottom right, #FBC1CC 0%, #D71760 100%);
}

.gradient-heide-smaragd {
  background: linear-gradient(to bottom right, #FBC1CC 0%, #00B08A 100%);
}

.gradient-himmel-erde {
  background: linear-gradient(to bottom right, #5DE6E9 0%, #C0BC1A 100%);
}

.gradient-himmel-kornblume {
  background: linear-gradient(to bottom right, #5DE6E9 0%, #0046AC 100%);
}

.gradient-himmel-rubin {
  background: linear-gradient(to bottom right, #5DE6E9 0%, #D71760 100%);
}

.gradient-licht-amethyst {
  background: linear-gradient(to bottom right, #EEFF71 0%, #A36AB7 100%);
}

.gradient-licht-rubin {
  background: linear-gradient(to bottom right, #EEFF71 0%, #C34582 100%);
}

.gradient-licht-zinnober {
  background: linear-gradient(to bottom right, #EEFF71 0%, #FF2919 100%);
}

.gradient-meer-rubin {
  background: linear-gradient(to bottom right, #89FFE6 0%, #C34582 100%);
}

.gradient-meer-smaragd {
  background: linear-gradient(to bottom right, #89FFE6 0%, #00B08A 100%);
}

.gradient-meer-zinnober {
  background: linear-gradient(to bottom right, #89FFE6 0%, #FF2919 100%);
}

.gradient-smaragd-aquamarin {
  background: linear-gradient(to bottom right, #5FE7AD 0%, #11A8C1 100%);
}

.gradient-smaragd-erde {
  background: linear-gradient(to bottom right, #5FE7AD 0%, #C0BC1A 100%);
}

/* ==========================================================================
   GRADIENTS - DIAGONAL FIRST COLOR LONGER (first color holds until 40%)
   ========================================================================== */

.gradient-himmel-himmel-erde {
  background: linear-gradient(to bottom right, #4BB3C8 0%, #4BB3C8 40%, #C0BC1A 100%);
}