

 

 /* Fonts */
 /* ubuntu-300 - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Ubuntu';
	 font-style: normal;
	 font-weight: 300;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/ubuntu/ubuntu-v20-latin-300.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ubuntu-300italic - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Ubuntu';
	 font-style: italic;
	 font-weight: 300;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/ubuntu/ubuntu-v20-latin-300italic.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ubuntu-regular - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Ubuntu';
	 font-style: normal;
	 font-weight: 400;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/ubuntu/ubuntu-v20-latin-regular.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ubuntu-italic - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Ubuntu';
	 font-style: italic;
	 font-weight: 400;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/ubuntu/ubuntu-v20-latin-italic.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ubuntu-500 - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Ubuntu';
	 font-style: normal;
	 font-weight: 500;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/ubuntu/ubuntu-v20-latin-500.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ubuntu-500italic - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Ubuntu';
	 font-style: italic;
	 font-weight: 500;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/ubuntu/ubuntu-v20-latin-500italic.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ubuntu-700 - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Ubuntu';
	 font-style: normal;
	 font-weight: 700;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/ubuntu/ubuntu-v20-latin-700.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ubuntu-700italic - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Ubuntu';
	 font-style: italic;
	 font-weight: 700;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/ubuntu/ubuntu-v20-latin-700italic.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-baskerville-regular - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Libre Baskerville';
	 font-style: normal;
	 font-weight: 400;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/libre/libre-baskerville-v14-latin-regular.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-baskerville-italic - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Libre Baskerville';
	 font-style: italic;
	 font-weight: 400;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/libre/libre-baskerville-v14-latin-italic.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-baskerville-700 - latin */
 @font-face {
	 font-display: swap;
	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	 font-family: 'Libre Baskerville';
	 font-style: normal;
	 font-weight: 700;
	 src: url('/typo3conf/ext/sola/Resources/Public/Fonts/libre/libre-baskerville-v14-latin-700.woff2') format('woff2');
	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
 

 /* Base Code */
 :root {
	 --green: #56a331;
	 --lightgreen: #93c256;
	 --white: #d1d1d1;
	 --black: #3b3b3b;
	 --maxWidth: 1300px;
	 --padding-lr: 20px;
	 --padding-tb: 50px;
}
 @media (min-width: 1000px) {
	 :root {
		 --padding-tb: 100px;
	}
}
 * {
	 box-sizing: border-box;
	 margin: 0;
	 padding: 0;
	 -webkit-tap-highlight-color: transparent;
}
 html {
	 --header-color: var(--green);
	 --text-color: var(--black);
	 background-color: var(--white);
	 color: var(--text-color);
	 font-family: 'Ubuntu', Roboto;
	 font-size: 62.5%;
	 scroll-behavior: smooth;
	 transition: background 0.5s ease-in, color 0.5s ease-out;
	 background-color: var(--black);
	 color: var(--white);
	 --header-color: var(--white);
	 --text-color: var(--white);
	 --reverse-text: var(--black);
	 --hl-color: var(--green);
	/* &.bg1{
		 background-color: var(--black);
		 color: var(--white);
		 --header-color: var(--white);
		 --text-color: var(--white);
		 #header{
			 #navigation{
				 background-color: var(--green);
				 a{
					 color: var(--white);
				}
			}
		}
	}
	 &.bg2{
		 background-color: var(--green);
		 color: var(--white);
		 --header-color: var(--white);
		 --text-color: var(--white);
	}
	 &.bg3{
		 background-color: var(--lightgreen);
		 color: var(--white);
		 --header-color: var(--white);
		 --text-color: var(--white);
	}
	 */
}
 html #header #navigation {
	 background-color: var(--green);
	 margin-left: 5px;
}
 html #header #navigation a {
	 color: var(--white);
}
 html #main, html #footer {
	 transition: opacity 0.75s ease;
}
 html.nav-open #main, html.nav-open #footer {
	 opacity: 0.5;
}
 body {
	 font-size: 1.9em;
	 hyphens: auto;
	 -ms-hyphens: auto;
	 -webkit-hyphens: auto;
	 -moz-hyphens: auto;
	 line-height: 1.4;
}
 img {
	 max-width: 100%;
	 height: auto;
	 display: block;
	 border-radius: 4px;
}
 a {
	 text-decoration: none;
	 color: var(--lightgreen);
	 font-weight: 700;
}
 strong {
	 color: var(--hl-color);
	 font-weight: 600;
}
 p {
	 max-width: 100%;
}
 p:not(:last-child) {
	 margin-bottom: 16px;
}
 .text-center {
	 text-align: center;
}
 table {
	 background-color: var(--white);
	 border-collapse: separate;
	 border-spacing: 1px;
	 border-radius: 5px;
	 width: 100%;
}
 table td {
	 padding: 2px 10px;
	 background-color: var(--black);
	 border-radius: 5px;
}
 h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
	 color: var(--header-color);
	 font-family: 'Libre Baskerville', 'Noto Serif', 'Ubuntu', Roboto;
	 font-size: 2em;
	 font-weight: 700;
	 margin-bottom: 2rem;
	 transition: color 0.5s ease-out;
}
 @media (min-width: 800px) {
	 h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
		 font-size: 3em;
	}
}
 h1:has(.btn), .h1:has(.btn), h2:has(.btn), .h2:has(.btn), h3:has(.btn), .h3:has(.btn), h4:has(.btn), .h4:has(.btn), h5:has(.btn), .h5:has(.btn), h6:has(.btn), .h6:has(.btn) {
	 font-size: 1em;
	 font-family: 'Ubuntu', Roboto;
}
 h1.slim, .h1.slim, h2.slim, .h2.slim, h3.slim, .h3.slim, h4.slim, .h4.slim, h5.slim, .h5.slim, h6.slim, .h6.slim {
	 font-size: 1.5em;
}
 @media (min-width: 800px) {
	 h1.slim, .h1.slim, h2.slim, .h2.slim, h3.slim, .h3.slim, h4.slim, .h4.slim, h5.slim, .h5.slim, h6.slim, .h6.slim {
		 font-size: 2em;
	}
}
/* h2, .h2{
	 color: var(--header-color);
	 font-family: 'Libre Baskerville', 'Noto Serif' , 'Ubuntu', Roboto;
	 font-size: 2em;
	 font-weight: 700;
	 margin-bottom: 2rem;
	 transition: color 0.5s ease-out;
	 @media (min-width: 800px) {
		 font-size: 3em;
	}
}
 h3, .h3{
	 color: var(--header-color);
	 font-family: 'Libre Baskerville', 'Noto Serif' , 'Ubuntu', Roboto;
	 transition: color 0.5s ease-out;
}
 h4, .h4{
	 color: var(--header-color);
	 font-family: 'Libre Baskerville', 'Noto Serif' , 'Ubuntu', Roboto;
	 transition: color 0.5s ease-out;
}
 h5, .h5{
	 color: var(--header-color);
	 font-family: 'Libre Baskerville', 'Noto Serif' , 'Ubuntu', Roboto;
	 transition: color 0.5s ease-out;
}
 h6, .h6{
	 color: var(--header-color);
	 font-family: 'Libre Baskerville', 'Noto Serif' , 'Ubuntu', Roboto;
	 transition: color 0.5s ease-out;
}
 */
 hr {
	 border-color: var(--text-color);
	 margin-bottom: 16px;
	 opacity: 0.3;
}
 #header {
	 padding: 5px 20px;
	 position: fixed;
	 z-index: 100;
	 background-color: transparent;
	 top: 0;
	 left: 0;
	 width: 100%;
	 transition: background ease-in 0.5s;
}
 .scrolled-more #header {
	 background-color: var(--white);
}
 #header .inner {
	 max-width: calc(var(--maxWidth) + 300px);
	 margin-left: auto;
	 margin-right: auto;
	 display: flex;
	 flex-flow: row;
	 gap: 20px;
	 align-items: center;
}
 #header #logo {
	 height: 55px;
	 width: auto;
	 margin-right: auto;
	 opacity: 0;
	 transition: 0.5s ease opacity;
}
 .scrolled #header #logo {
	 opacity: 1;
}
 #header #logo img {
	 width: auto;
	 height: 100%;
	 display: block;
}
 #header #burgernav {
	 background-color: var(--black);
	 position: relative;
	 width: 35px;
	 height: 35px;
	 border-radius: 50%;
	 cursor: pointer;
	 z-index: 50;
}
 #header #burgernav div {
	 width: 100%;
	 height: 100%;
	 transition: transform 0.5s ease;
}
 .nav-open #header #burgernav div {
	 transform: rotate(225deg);
}
 #header #burgernav span {
	 --spanWidth: 60%;
	 display: block;
	 position: absolute;
	 width: var(--spanWidth);
	 height: 3px;
	 background: white;
	 border-radius: 3px;
	 left: calc((100% - var(--spanWidth))/2);
	 top: 50%;
	 transform: translateY(-50%);
}
 #header #burgernav span:nth-child(2) {
	 transform: translateY(-50%) rotate(90deg);
}
 #header #navigation {
	 position: fixed;
	 right: 5px;
	 top: 5px;
	 background: var(--black);
	 padding: 30px;
	 padding-top: 70px;
	 z-index: 40;
	 border-radius: 5px;
	 color: var(--white);
	 transform: scale(0);
	 transform-origin: calc(100% - 30px) 25px;
	 transition: transform 0.5s ease, color 0.5s ease, background 0.5s ease;
}
 .nav-open #header #navigation {
	 transform: scale(1);
}
 #header #navigation a {
	 color: var(--white);
}
 #header #navigation ul {
	 list-style-type: none;
	 display: flex;
	 align-items: center;
	 flex-flow: row wrap;
	 gap: 40px;
}
 #header #navigation li {
	 position: relative;
}
 #header #navigation li::after {
	 content: "";
	 position: absolute;
	 bottom: 0;
	 height: 3px;
	 width: 0%;
	 background-color: var(--lightgreen);
	 left: 50%;
	 transform: translateX(-50%) translateY(100%);
	 transition: width 0.5s ease;
}
 .no-touch #header #navigation li:hover::after {
	 width: 100%;
}
 #footer {
	 background-color: var(--black);
	 padding: 40px var(--padding-lr);
	 position: relative;
	 z-index: 10;
}
 #footer .inner {
	 max-width: var(--maxWidth);
	 margin-left: auto;
	 margin-right: auto;
	 display: flex;
	 flex-flow: row;
	 justify-content: space-between;
	 align-items: center;
	 gap: 20px;
}
 #footer .inner ul {
	 list-style-type: none;
	 display: flex;
	 flex-flow: row wrap;
	 align-items: center;
	 gap: 20px;
}
 #footer .inner ul svg {
	 width: 25px;
	 height: 25px;
}
 #footer .inner ul svg * {
	 stroke: var(--green);
}
 #footer .inner ul a {
	 color: var(--green);
}
 #main {
	 max-width: 100vw;
}
 #main > .frame {
	 padding: var(--padding-tb) var(--padding-lr);
	/* &.frame-layout-1{
		 background-color: var(--black);
		 color: var(--white);
		 *{
			 color: var(--white);
		}
	}
	 &.frame-layout-2{
		 background-color: var(--green);
		 color: var(--white);
		 *{
			 color: var(--white);
		}
		 .btn{
			 background-color: var(--lightgreen);
		}
	}
	 &.frame-layout-3{
		 background-color: var(--lightgreen);
		 color: var(--white);
		 *{
			 color: var(--white);
		}
	}
	 */
}
 #main > .frame:first-child {
	 margin-top: 65px;
}
 #main > .frame:has(.hero) {
	 margin-top: 0;
	 padding: 0;
}
 #main > .frame:has(.hero) > .inner {
	 margin: 0;
	 max-width: 100vw;
}
 #main > .frame:not(:has(.hero)) {
	 overflow-x: hidden;
}
 #main > .frame > .inner {
	 max-width: var(--maxWidth);
	 margin-left: auto;
	 margin-right: auto;
}
 #main > .frame.frame-fullWidth > .inner {
	 max-width: 100%;
}
 #main .frame-type-text {
	 margin-top: 40px;
	 margin-bottom: 40px;
}
 #main .frame-type-text > .inner {
	 max-width: var(--maxWidth);
	 margin-left: auto;
	 margin-right: auto;
}
 #main .frame-anmelden {
	 scroll-margin: calc(180px + 50vh);
	 hyphens: auto;
	 width: calc(100%);
	 transition: margin 0.1s ease;
	 margin: 20px 0;
}
 #main .frame-anmelden h1, #main .frame-anmelden h2, #main .frame-anmelden h3, #main .frame-anmelden h4, #main .frame-anmelden h5 {
	 font-size: 1.2em;
	 margin-bottom: 0;
}
 @media (min-width: 1000px) {
	 #main .frame-anmelden {
		 scroll-margin: calc(180px + 25vh);
		 width: 100%;
		 margin-left: 0 !important;
	}
}
 #main .frame-anmelden .teaser {
	 color: var(--text-color);
	 font-size: 1em;
	 line-height: 1.4;
	 margin-bottom: 16px;
	 max-width: 100%;
	 color: var(--white);
	 font-weight: 400;
}
 #main .frame-anmelden .teaser * {
	 color: var(--white);
	 font-weight: 400;
}
 #main .frame-anmelden .accordion {
	 border-bottom: 1px solid var(--header-color);
}
 #main .frame-anmelden .accordion:first-child {
	 border-top: 1px solid var(--header-color);
}
 #main .frame-anmelden .accordion-title {
	 background-color: transparent;
	 color: white;
	 padding: 20px 10px;
	 cursor: pointer;
}
 #main .frame-anmelden .accordion-title > *:nth-last-child(1) {
	 margin-bottom: 0;
	 transition: 0.5s ease margin;
}
 #main .frame-anmelden .accordion-title > *:nth-last-child(1) h5 {
	 margin-bottom: 0px !important;
}
 #main .frame-anmelden .accordion-title > *:nth-last-child(1) * {
	 transition: 0.5s ease margin;
}
 #main .frame-anmelden .accordion-title:not(.active) > *:nth-last-child(1) {
	 margin-bottom: 0px;
}
 #main .frame-anmelden .accordion-title:not(.active) > *:nth-last-child(1) h5 {
	 margin-bottom: 0px;
}
 #main .frame-anmelden .accordion-title .header {
	 display: flex;
	 flex-flow: row;
	 align-items: center;
	 gap: 10px;
}
 #main .frame-anmelden .accordion-title .header h1, #main .frame-anmelden .accordion-title .header h2, #main .frame-anmelden .accordion-title .header h3, #main .frame-anmelden .accordion-title .header h4, #main .frame-anmelden .accordion-title .header h5 {
	 max-width: calc(100% - 30px);
	 margin-bottom: 10px;
	 margin-right: auto;
}
 #main .frame-anmelden .accordion-title .header .thereIsMore {
	 width: 30px;
	 height: 30px;
	 background-color: var(--green);
	 border-radius: 50%;
	 margin-bottom: 10px;
	 padding: 5px;
	 position: relative;
	 transform: rotate(90deg);
}
 #main .frame-anmelden .accordion-title .header .thereIsMore span {
	 display: block;
	 width: calc(100% - 10px);
	 height: 4px;
	 background-color: var(--text-color);
	 position: absolute;
	 top: 50%;
	 transform: translateY(-50%);
	 border-radius: 3px;
	 transition: width 0.5s ease;
}
 #main .frame-anmelden .accordion-title .header .thereIsMore span:nth-child(1) {
	 transform: translateY(-50%) rotate(90deg);
}
 #main .frame-anmelden .accordion-title.active .header .thereIsMore span:nth-child(2) {
	 width: 0;
}
 #main .frame-anmelden .accordion-title .btn {
	 width: 100%;
	 text-align: center;
}
 #main .frame-anmelden .accordion-content {
	 padding: 0px 10px;
	 background-color: transparent;
	 border: 0px solid #ddd;
	 overflow: hidden;
	 max-height: 0;
	 transition: max-height 0.4s ease-out, padding 0.5s ease;
}
 #main .frame-anmelden .accordion-content .link {
	 display: block;
	 width: 100%;
	 margin-top: 16px;
}
 #main .frame-anmelden .accordion-content .link span {
	 width: 100%;
	 text-align: center;
}
 #main .frame-anmelden .accordion-content.active {
	 padding-top: 10px;
	 padding-bottom: 25px;
}
 #main .frame-anmelden .accordion-content ul {
	 padding-left: 20px;
}
 #main .frame-anmelden .col {
	 display: flex;
	 flex-flow: column;
	 column-gap: 1%;
	 padding-right: var(--padding-lr);
}
 @media (min-width: 1000px) {
	 #main .frame-anmelden .col {
		 flex-flow: row wrap;
		 padding: 0;
	}
}
 #main .frame-anmelden .col .inner-col {
	 width: 100%;
}
 #main .frame-anmelden .col .inner-col:nth-child(2) {
	 margin-bottom: 20px;
}
 @media (min-width: 1000px) {
	 #main .frame-anmelden .col .inner-col {
		 width: 49.5%;
	}
	 #main .frame-anmelden .col .inner-col:nth-child(2) {
		 margin-bottom: 0px;
	}
}
 #main .frame-anmelden .image {
	 width: 100%;
	 margin-bottom: 2rem;
}
 #main .frame-anmelden .image img {
	 width: 100%;
	 border-radius: 7px;
}
 #main .frame-anmelden .image img:nth-child(1) {
	 display: block;
}
 @media (min-width: 1000px) {
	 #main .frame-anmelden .image img:nth-child(1) {
		 display: none;
	}
}
 #main .frame-anmelden .image img:nth-child(2) {
	 display: none;
}
 @media (min-width: 1000px) {
	 #main .frame-anmelden .image img:nth-child(2) {
		 display: block;
	}
}
 .btn {
	 padding: 10px 25px;
	 background-color: var(--green);
	 font-size: 1em;
	 line-height: 1.4;
	 display: inline-block;
	 border-radius: 5px;
	 color: var(--text-color);
}
 .btn.inactive {
	 opacity: 0.3;
	 color: var(--lightgreen);
	 display: none !important;
}
 .bg2 .btn {
	 background-color: var(--black);
}
 .frame-space-before-extra-small {
	 padding-top: 0 !important;
}
 .frame-space-after-extra-small {
	 padding-bottom: 0 !important;
	 margin-bottom: 0 !important;
}
 .hero {
	 width: 100%;
	 position: relative;
	 z-index: 1;
	 display: flex;
	 flex-flow: row wrap;
	 --gap: 30px;
	 gap: var(--gap);
	 height: 150vh;
	/* img{
		 width: calc(60% - (var(--gap)/2));
		 margin-bottom: calc(var(--gap) * 2);
		 max-height: calc(100vh - (var(--gap) * 2)) - 60px;
	}
	 */
}
 .hero-end .hero {
	 z-index: -10;
}
 .hero .emblem {
	 max-width: 800px;
	 width: calc(100% - 20px);
	 position: fixed;
	 top: 50%;
	 left: 50%;
	 transform: translateX(-50%) translateY(-50%);
	 opacity: 0;
}
 .scrolled .hero .emblem {
	 transform: translateX(-50%) translateY(-50%) scale(2);
	 margin-top: 10px;
	 transition: ease 0.5s transform, ease 0.75s opacity, margin 0.5s ease;
}
 .notscrolled .hero .emblem {
	 opacity: 1;
	 transition: ease 0.5s transform, ease 0.75s opacity, margin 0.5s ease;
}
 .hero-end .hero .emblem {
	 z-index: -10;
}
 .hero .bg {
	 width: 100%;
	 height: 90vh;
	 position: sticky;
	 z-index: -1;
	 top: 0;
	 transition: filter 0.5s ease;
	 filter: brightness(0.6);
}
 .scrolled .hero .bg {
	 filter: brightness(1);
}
 .hero .bg img {
	 --imgMargin: 10px;
	 width: calc(100% - var(--imgMargin) - var(--imgMargin));
	 height: 100%;
	 object-fit: cover;
	 transition: margin 0.5s ease, border-radius 0.5s ease, width 0.5s ease;
	 margin: var(--imgMargin);
}
 .scrolled .hero .bg img {
	 --imgMargin: 0px;
	 border-radius: 0px;
}
 @media (min-width: 500px) {
	 .hero .bg img:nth-child(1) {
		 display: none;
	}
}
 .hero .bg img:nth-child(2) {
	 display: none;
}
 @media (min-width: 500px) {
	 .hero .bg img:nth-child(2) {
		 display: block;
	}
}
 .hero .bodytext {
	 width: calc(40% - (var(--gap)/2));
}
 .whatsSola {
	 width: 500px;
	 max-width: 100%;
	 margin-right: auto;
	 margin-left: auto;
}
 .whatsSola .swiper-slide {
	 background-color: var(--white);
	 color: var(--reverse-text);
	 border-radius: 5px;
	 filter: brightness(0.6);
}
 .whatsSola .swiper-slide.swiper-slide-active {
	 filter: brightness(1);
}
 .whatsSola .swiper-slide .bodytext {
	 padding: 20px;
}
 .whatsSola .swiper-slide img {
	 width: 100%;
	 border-radius: 0px 0px 5px 5px;
}
 .dev {
	 display: none !important;
}
 .banner {
	 position: absolute;
	 right: 0;
	 top: calc(100% + 0px);
	 opacity: 0;
	 transition: 0.5s ease opacity;
	 max-width: 100%;
	 width: 500px;
}
 @media (min-width: 500px) {
	 .banner {
		 top: calc(100% + 10px);
	}
}
 .banner img {
	 border-radius: 0;
}
 .scrolled .banner {
	 opacity: 1;
}
 