/* -------------------- Farben-Variablen BEGINN -------------------- */
:root {
	/*Allgemein*/
	--bg-body:#FFF;
	--color-allgemein: #333;
	--color-akzent: #6DBB25;
	--bg-call2action: #fff;
	--bg-slideshow: #fff;
	--bg-fallback-farbe: #aaa;
	--border-social-media: none;

	--img-negative:invert(0%);

	/*Backgrounds*/
	--bg-content-top-info:url(../images/background/beach_84084363.jpg);
	--bg-content-top-info-fallback:#b3dc1d;
	--bg-color-content-back: rgba(255, 255, 255, 0.65);
	--bg-color-review: rgba(255, 255, 255, 0.65);
	--bg-color-02:#b3dc1d;
	--bg-color-09:#C89C66;
	--bg-color-12:linear-gradient(45deg, #40a629 0%, #b3dc1d 100%);
	--bg-color-12-fallback:#40a629;
	--bg-color-17: linear-gradient(to bottom, rgba(255,255,255,0.1) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0.1) 100%);
	--bg-btn-mieten:linear-gradient(to bottom, #f9a61f 0%, #f5f21e 100%);
	--bg-logo-slider: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 50%,rgba(255,255,255,0) 100%);
	--bg-logo-heroimg:linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%);

	/*Call2Actions*/
	--bg-cta: url(../images/background/beach_84084363.jpg);
	--bg-cta-fallback:#40a629;
	--boxshadow-cta: rgba(179, 220, 28, 0.35);
	--heading-cta:#683C11;
	--subtitle-cta:#333;
	--color-cta-hover:#333;

	--color-ctamini:#333;
	--color-ctamini-hover:#333;
	--color-ctamini-heading:#633012;

	/*Colors*/
	--color-a:#5589d3;
	--color-btn-mieten: #4d1f03;
	--color-08:#4d1f03;
	--footer-title:#4d1f03;

	--color-table:#333;

	--color-footer-a:#333;
	--color-footer-a-hover:#40a629;

	--color-camper-hover:#633012;


	/*Barrierefreiheit Panel*/
	--bcc-shadow: 0px 0px 4px 1px rgba(0,0,0,0.80);
	--bg-access-panel: #fff;
	--access-panel-bs: 0px 0px 4px 2px rgba(95,95,95,0.60);
	--bg-panel-button: #E7E7E7;
	--color-readline: #000;
	--cursor-color: url('../images/icons/cursor-light.png');
	--cursor-pointer: url('../images/icons/cursor-pointer-light.png');
	--cursor-text: url('../images/icons/cursor-text-light.png');
	--access-icon-tooltip-color: #333;
	--access-icon-tooltip-text: #fff;

	/*Cookie Modal*/
	--bg-modal-content: #fff;
	--modal-content-text-color: #333;
	--modal-header-bg: #3b3b3b;
	--modal-header-text-color: #fff;
	--modal-footer-bg: #E7E7E7;
	--placeholder-background: #eeeeee;
	--bg-consent-icons: #F6F6F6;
	--color-btn-custom-accept-normal: #3b3b3b;
	--color-btn-custom-accept-hover: #2A2A2A;

	--background-content: #fff;
	/*--background-content: url('../images/background/');*/
	--background-kontaktformular: #fff;
	--img-filter: none;
	--mapsiframe-filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.80));

	/*Navigation*/
	--bg-mainNav: linear-gradient(to bottom, rgba(249, 166, 31, 0.6) 0%, rgba(245, 242, 30, 0.1) 100%);
	--bg-mainNav-fallback: #FFF;
	--color-navlink:#4d1f03;
	--color-navigation-hover: #fff;
	--color-dropdown-navigation: #000;
	--dropdown-menu: rgba(255,255,255,0.80);
	--line-burger:#000;

	/*Top-Info*/
	--color-top-info-a:#333;
	--color-top-info-text: #000;
	--links-top-info: #000;
	--links-top-info-hover: #870C1C;
	--background-top-info: linear-gradient(90deg, rgba(86,86,86,1) 0%, rgba(180,180,180,1) 42%, rgba(180,180,180,1) 58%, rgba(86,86,86,1) 100%);

	/*Kontaktbox*/
	--color-kontaktbox-h4: #004176;
	--bg-kontaktbox: linear-gradient(160deg, #b4b4b4 0%, #565656 100%);
	--bg-main-kontaktbox: #fff;

	/*Text*/
	--color-ueberschriften: var(--color-akzent);
	--color-subline: #555756;

	--color-text: #333;
	--color-links: var(--color-akzent);
	--color-links-hover: #565756;

	/*Float Kontakt*/
	--color-float-contact-icon: #fff;
	--color-float-contact-background: #333;
	--bg-float-contact: rgba(255,255,255,0.50);

	/*Review-Slider*/
	--title-review: #000;
	--background-review-slider: linear-gradient(90deg, rgba(86,86,86,1.00) 0%, rgba(180,180,180,1.00) 42%, rgba(180,180,180,1.00) 58%, rgba(86,86,86,1.00) 100%);

	/*Footer*/
	--color-footer-text: #000;
	--color-footer-links: #333;
	--footer-icon-color: #565756;
	--background-footer: linear-gradient(180deg, rgba(255,255,255,1.00) 30%, rgba(161,161,161,1.00) 100%);

	/*Social Media*/
	--color-facebook: #3c5997;
	
	/* Glas Effekt */
	--glas-background: rgba(255,255,255,0.40);
	--glas-border: rgba(255,255,255,0.30);

	/* -------------------- Schrift-Variablen ANFANG -------------------- */

		--font-ueberschriften: "poppins", sans-serif;
		--font-fliesstext: "futura-pt", sans-serif;
		--font-navigation: "futura-pt", sans-serif;

/* -------------------- Schrift-Variablen ENDE -------------------- */
}

[data-theme="dark"] {
	/*Allgemein*/
	--bg-body:#212529;
	--color-allgemein: #FFF;
	--color-akzent: #6DBB25;
	--bg-call2action: #555555;
	--bg-slideshow: #212529;
	--bg-fallback-farbe: #989898;
	--border-social-media: 2px solid #fff;

	--img-negative:invert(100%);

	/*Backgrounds*/
	--bg-content-top-info:url(../images/background/beach_84084363_dark.jpg);
	--bg-content-top-info-fallback:#333;
	--bg-color-content-back: rgba(0, 0, 0, 0.8);
	--bg-color-review: rgba(0, 0, 0, 0.8);
	--bg-color-02:#343434;
	--bg-color-09:#55422c;
	--bg-color-12:linear-gradient(45deg, #5e5e5e 0%, #5e5e5e 100%);
	--bg-color-12-fallback:#40a629;
	--bg-color-17: linear-gradient(to bottom, rgba(14, 14, 14, 0.1) 0%,rgb(14, 14, 14) 50%,rgba(14, 14, 14, 0.1) 100%);
	--bg-btn-mieten:linear-gradient(to bottom, #f9a61f 0%, #f9a61f 100%);
	--bg-logo-slider: linear-gradient(to bottom, rgb(0, 0, 0) 0%,rgba(0, 0, 0, 0.7) 50%,rgba(0, 0, 0, 0) 100%);
	--bg-logo-heroimg:linear-gradient(to right, rgba(0, 0, 0, 0) 0%,rgb(0, 0, 0) 50%,rgba(0, 0, 0, 0) 100%);

	/*Call2Actions*/
	--bg-cta: url(../images/background/beach_84084363_dark.jpg);
	--bg-cta-fallback:#272727;
	--boxshadow-cta:#545454;
	--heading-cta:#FFF;
	--subtitle-cta:#FFF;
	--color-cta-hover:#FFF;

	--color-ctamini:#FFF;
	--color-ctamini-hover:#FFF;
	--color-ctamini-heading:#FFF;




	/*Colors*/
	--color-a:#4782d4;
	--color-btn-mieten: #FFF;
	--color-08:#FFF;
	--footer-title:#FFF;

	--color-table:#FFF;

	--color-footer-a:#40a629;
	--color-footer-a-hover:#FFF;

	--color-camper-hover:#40a629;

	/*Barrierefreiheit Panel*/
	--bcc-shadow: none;
	--bg-access-panel: #3b3b3b;
	--access-panel-bs: none;
	--bg-panel-button: #989898;
	--color-readline: #fff;
	--cursor-color: url('../images/icons/cursor-dark.png');
	--cursor-pointer: url('../images/icons/cursor-pointer-dark.png');
	--cursor-text: url('../images/icons/cursor-text-dark.png');
	--access-icon-tooltip-color: #fff;
	--access-icon-tooltip-text: #333;

	/*Cookie Modal*/
	--bg-modal-content: #3b3b3b;
	--modal-content-text-color: #fff;
	--modal-header-bg: #3b3b3b;
	--modal-header-text-color: #fff;
	--modal-footer-bg: #3b3b3b;
	--placeholder-background: #555555;
	--bg-consent-icons: #989898;
	--color-btn-custom-accept-normal: #2A2A2A;
	--color-btn-custom-accept-hover: #191919;

	--background-content: #212529;
	--background-kontaktformular: #212529;
	--img-filter: brightness(0.8);
	--mapsiframe-filter: grayscale(100%) invert(90%) contrast(95%);

	/*Navigation*/
	--bg-mainNav: linear-gradient(to bottom, rgb(21, 23, 30) 0%, rgb(61, 61, 61) 100%);
	--bg-mainNav-fallback:#000;
	--color-navlink:#FFF;
	--color-navigation-hover: #fff;
	--color-dropdown-navigation: #fff;
	--dropdown-menu: rgba(0,0,0,0.80);
	--line-burger:#FFF;

	/*Top-Info*/
	--color-top-info-a:#FFF;
	--color-top-info-text: #fff;
	--links-top-info: #fff;
	--links-top-info-hover: #fff;
	--background-top-info: linear-gradient(90deg, rgba(86,86,86,1.00) 0%, rgba(53,53,53,1.00) 42%, rgba(53,53,53,1.00) 58%, rgba(86,86,86,1.00) 100%);

	/*Kontaktbox*/
	--color-kontaktbox-open: #fff;
	--color-kontaktbox-h4: #004176;
	--bg-kontaktbox: linear-gradient(160deg, #353535 0%, #565656 100%);
	--bg-main-kontaktbox: #212529;

	/*Text*/
	--color-ueberschriften: var(--color-akzent);
	--color-subline: #fff;
	--color-text: #fff;
	--color-links: var(--color-akzent);
	--color-links-hover: #314EB4;

	/*Float Kontakt*/
	--color-float-contact-icon: #fff;
	--color-float-contact-background: #531E20;
	--bg-float-contact: rgba(33,37,41,0.50);

	/*Review-Slider*/
	--title-review: #fff;
	--background-review-slider: linear-gradient(90deg, rgba(86,86,86,1.00) 0%, rgba(53,53,53,1.00) 42%, rgba(53,53,53,1.00) 58%, rgba(86,86,86,1.00) 100%);

	/*Footer*/
	--color-footer-text: #fff;
	--color-footer-links: #fff;
	--footer-icon-color: #c4c5c5;
	--background-footer: #212529;
	
	/* Glas Effekt */
	--glas-background: rgba(33,37,41,0.40);
	--glas-border: rgba(33,37,41,0.30);
}
/* -------------------- Farben-Variablen ENDE -------------------- */