/**
$footer-bg:                     desaturate($primary, 70%);         // $primary-heller;
$footer-nav-bg:                 darken($footer-bg, 1.5%);
$footer-nav-link-color:         fade-out($primary-mittel, 35%);
$footer-nav-link-color-hover:   $primary-hell; // $primary-heller; // $primary;

$footer-text-color:             $primary-mittel; // rgba($text-color-light, 0.6);
$footer-headline-color:         $primary-hell; // rgba($text-color-light, 0.4);
$footer-link-color:             rgba($text-color-light, 0.8);
$footer-link-hover-color:       rgba($text-color-light, 1);
/**/
.rotate-hover svg {
  transform: rotate(0);
  transition: 0s;
}
.parallax {
  height: 100% !important;
}
.schulmenu-item:hover {
  /*
        ~ div
        {
            opacity: .3;
            filter: saturate(.25);
        }
        /**/
}
.schulmenu-item:hover .rotate-hover svg {
  transform: rotate(360deg);
  transition: transform 0.65s ease-out;
}
.zentrum {
  left: -20vw;
  position: absolute;
  top: -5vw;
  animation: xAchse 80s ease-in-out 0s infinite;
}
@media (max-width: 575.98px) {
  .zentrum {
    left: 0vw;
  }
}
.zentrum-inner {
  animation: orbit 200s linear 0s infinite;
}
@keyframes xAchse {
  0% {
    transform: translateX(0px);
  }
  50% {
    transform: translateX(10vw);
  }
  100% {
    transform: translateX(0px);
  }
}
@keyframes orbit {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}
.schulmenu-item.grafik {
  display: inline-block !important;
  top: calc(2vw) !important;
  left: calc(-30%) !important;
}
@media (max-width: 575.98px) {
  .schulmenu-item.grafik {
    position: absolute !important;
    top: auto !important;
    bottom: calc(100vw) !important;
    left: calc(0%) !important;
  }
}
.schulmenu-item.grafik svg {
  width: clamp(100px, 50vw, 600px);
}
@media (max-width: 575.98px) {
  .schulmenu-item.grafik svg {
    width: 100vw;
  }
}
.schulmenu-item.grafik a {
  display: inline-block;
}
.schulmenu-item.grafik .schulmenu-item-wrap {
  transform-origin: 55% 45%;
  transform: rotate(90deg) scale(0.5) translate(-30%, 30%);
  transition: all 2s ease-in-out;
  opacity: 0;
}
#carousel268 .carousel-item {
  z-index: 0;
}
#carousel268 .carousel-item.item1292:before {
  --bs-primary-bg-rgb: 1,91,163;
}
#carousel268 .carousel-item.item1291:before {
  --bs-primary-bg-rgb: 104,1,49;
}
#carousel268 .carousel-item.item613:before {
  --bs-primary-bg-rgb: 27,1,106;
}
#carousel268 .carousel-item:before {
  content: "";
  background: radial-gradient(circle, rgba(var(--bs-primary-bg-rgb), 0.5) 20%, rgba(0, 0, 0, 0) 70%);
  width: 58vw;
  height: 60vw;
  position: absolute;
  top: -25vw;
  left: -25vw;
  z-index: 1;
  border-radius: 50%;
  pointer-events: none;
}
#carousel268 .carousel-item.active .schulmenu-item.grafik .schulmenu-item-wrap {
  transform: rotate(0deg) scale(1.1) translate(0%, -5%);
  opacity: 0.8;
}
@media (max-width: 575.98px) {
  #carousel268 .carousel-indicators {
    margin-left: 0;
    margin-right: 0;
    bottom: 3vw;
  }
  #carousel268 .carousel-indicators li {
    width: 3vw !important;
    height: 3vw !important;
  }
}
.schulmenu-item.themennavigation {
  bottom: calc(0%) !important;
  left: calc(0%) !important;
  width: 100%;
  /*
    .rotate-hover svg
    {
        transform: rotate(10deg);
    }
    /**/
}
@media (max-width: 575.98px) {
  .schulmenu-item.themennavigation {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100%;
    height: 100%;
  }
}
/* /
.schulmenu-sekundarschule
{
    top: calc(50vh - 25vmin) !important;
    left: 50vw !important;
}
.schulmenu-gymnasium 
{
    top: 50vh !important;
    left: calc(50vw - 50vmin) !important;
}

@media screen and (orientation: portrait) {
    .schulmenu-article
    {
        height: 100vh;
    }
}

@media screen and (orientation: portrait) and (max-width: 479.99px) {

    .schulmenu-item {    
        svg
        {
            width: 80vmin;
            height: 80vmin;
        }
    }
    
    //.schulmenu-gymnasium,
    .schulmenu-grundschule
    {   
        top: calc(50vh - 79vmin) !important;
        left: calc(50vw - 72vmin) !important;
    }
    .schulmenu-sekundarschule
    {
        top: calc(50vh - 40vmin) !important;
    }
    .schulmenu-gymnasium 
    {
        left: calc(50vw - 80vmin) !important;
    }
}

@media screen and (orientation: portrait) and (min-width: 480px)  {

    .schulmenu-item {    
        svg
        {
            width: 65vmin;
            height: 65vmin;
        }
    }
    
    //.schulmenu-gymnasium,
    .schulmenu-grundschule
    {   
        top: calc(50vh - 65vmin) !important;
        left: calc(50vw - 57vmin) !important;
    }
    .schulmenu-sekundarschule
    {
        top: calc(50vh - 33vmin) !important;
    }
    .schulmenu-gymnasium 
    {
        left: calc(50vw - 65vmin) !important;
    }
}
*/
.slick-vertical .slide {
  display: block;
  height: 20vw;
  width: 100%;
}
@keyframes scaleAnimation {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}
@keyframes scaleAnimation_fv {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
  100% {
    opacity: 1;
  }
}
.schulmenu-item .fische_hinten path, .schulmenu-item .fische_hinten circle {
  animation: scaleAnimation 2.5s ease-in-out infinite alternate 1s;
}
.schulmenu-item .blasen_hinten path, .schulmenu-item .blasen_hinten circle {
  animation: scaleAnimation 5s ease-in-out infinite alternate 1.5s;
}
.schulmenu-item .fische_mitte path, .schulmenu-item .fische_mitte circle {
  animation: scaleAnimation 3.5s ease-in-out infinite alternate 2.5s;
}
.schulmenu-item .blasen_vorne path, .schulmenu-item .blasen_vorne circle {
  animation: scaleAnimation 6s ease-in-out infinite alternate 2s;
}
.schulmenu-item .fische_vorne path:nth-child(1) {
  animation: scaleAnimation_fv 6s ease-in-out infinite alternate 0s;
}
.schulmenu-item .fische_vorne path:nth-child(2) {
  animation: scaleAnimation_fv 6s ease-in-out infinite alternate 2s;
}
.schulmenu-item .fische_vorne path:nth-child(3) {
  animation: scaleAnimation_fv 6s ease-in-out infinite alternate 4s;
}
.animation-menu {
  /** /
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);	
	@include media-breakpoint-down(sm) {
		backdrop-filter: blur(1px);
		-webkit-backdrop-filter: blur(1px);		
	}
	/**/
  border-radius: 50%;
  height: clamp(250px, 30vw, 400px);
  width: clamp(250px, 50vw, 600px);
  bottom: 5vw;
  left: 20%;
  right: 0vw;
  margin: 0 auto;
  position: absolute;
  display: flex;
  align-content: center;
  justify-content: center;
}
.animation-menu h5 {
  font-size: clamp(20px, 4vw, 40px);
  color: #fff;
  line-height: 1.25em;
  margin-bottom: 0;
}
.animation-menu p {
  font-size: clamp(15px, 3vw, 30px);
  color: #fff;
  line-height: 1.25em;
  margin-bottom: 0;
}
.animation-menu ul {
  margin-bottom: 0;
}
.animation-menu ul li {
  line-height: 1.5;
}
.animation-menu a {
  font-size: clamp(10px, 2vw, 22px);
  font-weight: 500;
}
.animation-menu .kreis {
  margin: 2vw;
}
.animation-menu .kreis h5 {
  left: -90vw;
  position: relative;
  transition: left 3s ease-in-out;
}
.animation-menu .kreis p {
  right: -90vw;
  position: relative;
  transition: right 2s ease-in-out 1s;
}
@media (max-width: 575.98px) {
  .animation-menu {
    top: 34% !important;
    left: 0% !important;
    bottom: auto;
    height: 90vw;
    width: 90vw;
  }
  .animation-menu h5 {
    font-size: 9vw;
  }
  .animation-menu a {
    font-size: 4vw;
  }
  .animation-menu p {
    font-size: clamp(25px, 7vw, 30px);
  }
}
.carousel-item.active .kreis h5 {
  left: 0;
}
.carousel-item.active .kreis p {
  right: 0;
}
#carousel268 .carousel-control-next, #carousel268 .carousel-control-prev {
  opacity: 1;
  transition: transform 0.65s ease-out;
  display: flex;
}
#carousel268 .carousel-control-next:hover, #carousel268 .carousel-control-prev:hover {
  transform: scale(1.5);
}
@media (max-width: 575.98px) {
  #carousel268 .carousel-control-next, #carousel268 .carousel-control-prev {
    display: none;
  }
}
#carousel268 .animation-menu .carousel-control-next, #carousel268 .animation-menu .carousel-control-prev {
  display: none;
}
@media (max-width: 575.98px) {
  #carousel268 .animation-menu .carousel-control-next, #carousel268 .animation-menu .carousel-control-prev {
    display: flex;
  }
}
#carousel268 .animation-menu .carousel-control-prev {
  left: -5vw;
}
#carousel268 .animation-menu .carousel-control-next {
  right: -5vw;
}
/*# sourceMappingURL=/media/templates/site/minnemedia/css/schulmenu.css.map */