:root {
	--black: #1C1C1C;
	--bg-blue: #E0ECFA;
	--bg-green1: #E5EEE4;
	--bg-green2: #F2F4C3;
	--bg-orange: #FFF6E6;
	--bg-gray: #D5D5CB;
	
	--green1: #DADE80;
	--green2: #C3D9C1;
	--blue1: #C4DAF5;
	--blue2: #ACC9F0;
	--orange: #F2C387;
	--yellow: #F7E38F;
	--red: #FF795E;
	
	--btn-green1: #A8C62A;
	--btn-green2: #72A316;
	
	--ls-large: 0.2rem;
	--ls-small: 0.02rem;
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	padding: 0;
	font-size: 1rem;
	line-height: 1.5;
	font-family: 'Courier Prime';
	font-weight: 400;
	background: #fff;
	color: var(--black);
	letter-spacing: var(--ls-small);
}

body.no-scroll {
	overflow-y: hidden;
}

/*******************************************************************************************/
/*** ALLGEMEIN *****************************************************************************/
/*******************************************************************************************/

main  {
	padding: 5rem 0 0 0;
}

.container {
	width: 100%;
	max-width: 90.5rem;
	padding: 0 1.5625rem;
	margin: 0 auto;
}

.scroll-margin {
	scroll-margin-top: 6.25rem;
}

h1, h2, h3, h4, h5 {
	display: block;
	line-height: 1.2;
	margin: 0;
	font-weight: 700;
	letter-spacing: 0;
}

h1, h2, h3 {
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: var(--ls-large);
	margin: 0 0 1.25rem 0;
}

h1 span, h2 span, h3 span {
	font-family: 'Emilys Candy';
	display: block;
	letter-spacing: 0;
	text-transform: none;
	font-weight: 400;
	line-height: 1;
	font-size: 3rem;
	position: relative;
}

h1 span {
	color: var(--green1);
	text-shadow: 0.125rem 0.125rem #fff;
}

h2 span {
	color: var(--blue1);
	margin: 0.625rem 0 1.25rem 0;
}

.bg-color.lblue h2 span {
	color: #fff;
}

.bg-color.lorange h2 span {
	color: var(--orange);
}

h3 span {	
	text-shadow: 0.125rem 0.125rem #fff;
}

.col h2, .col h3 {
	margin: 0 0 0.3125rem 0;
}

.main-cnt h1, .main-cnt h3, .main-cnt h3 {
	color: var(--black);
	font-weight: 700;
	letter-spacing: var(--ls-large);
	text-transform: uppercase;
	margin: 0 0 0.3125rem 0;
}

.main-cnt h1 span, .main-cnt h2 span, .main-cnt h3 span {
	font-family: 'Emilys Candy';
	font-weight: 400;
	bottom: auto;
	z-index: auto;
	margin: 0 0 3.125rem 0;
}

.main-cnt h1 span {
	color: var(--green1);
	font-size: 3rem;
}

.main-cnt h2 span {
	color: var(--blue1);
	font-size: 3rem;
}

.main-cnt h3 span {
	color: var(--red);
	font-size: 3rem;
}

/* Überschriften Farben */

#ueber-uns h1 span {
	color: var(--blue2);
}

#ueber-uns h2 span {
	color: var(--yellow);
}

#tierarten h1 span:nth-child(1) {
	color: #fff;
	text-shadow: 0.125rem 0.125rem var(--red);
}

#tierarten h1 span:nth-child(2) {
	color: var(--red);
}

#infos h1 span {
	line-height: 2.5rem;
}

#infos h1 span:nth-child(1) {
	color: #fff;
	text-shadow: 0.125rem 0.125rem var(--green1);
}

#infos h1 span:nth-child(2) {
	color: var(--green1);
	margin: 0 0 1.25rem 0;
}

#ce03 span {
	color: var(--green1);
}

#galerie h1 {
	margin: 0;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/schild.svg") no-repeat center/contain;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
	min-height: 15.625rem;
}

#galerie h1 span {
	width: 100%;
}

#galerie h1 span:nth-child(1) {
	color: var(--yellow);
	text-shadow: 0.125rem 0.125rem var(--red);
}

#galerie h1 span:nth-child(2) {
	color: var(--red);
	margin: 0 0 1.25rem 0;
}

#kontakt h1 span {
	color: #fff;
	text-shadow: 0.125rem 0.125rem var(--red);
}

#error h1 span {
	color: var(--red);
	bottom: auto;
}

p {
	margin: 0;
	padding: 0 0 0.9375rem 0;
}

p:last-child {
	padding: 0;
}

.txt-center {
	text-align: center;
}

.txt-right {
	text-align: right;
}

a  {
	color: inherit;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

img, svg {
	width: 100%;
	height: auto;
}

.cnt-icon {
	width: 3.125rem;
	margin: 0 0 0.625rem 0;
}

ul {
	padding: 0 0 0 0.9375rem;
	margin: 0 0 0.9375rem 0;
}

/*** Hintergründe ***/

.section {
	padding: 3.125rem 0;
	position: relative;
}

.section > .container {
	position: relative;
	z-index: 3;
}

.bg-color.lblue {
	background: var(--bg-blue);
}

.bg-color.lgreen {
	background: var(--bg-green1);
}

.bg-color.lorange {
	background: var(--bg-orange);
}

/** Border **/

.section.border-top {
	padding-top: 6.25rem;
}

.section.border-bottom {
	padding-bottom: 6.25rem;
}

.border-top::before {
	content: '';
	width: 100%;
	height: 3.125rem;
	position: absolute;
	top: 0;
	left: 0;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/border-top.svg") repeat-x top left/auto 100%;
	z-index: 2;
}

.border-bottom::after {
	content: '';
	width: 100%;
	height: 3.125rem;
	position: absolute;
	bottom: 0;
	left: 0;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/border-bottom.svg") repeat-x bottom left/auto 100%;
	z-index: 2;
}

/** Bogen **/

.section.border-top2 {
	padding-top: 4.6875rem;
}

.section.border-bottom2 {
	padding-bottom: 4.6875rem;
}

.border-top2::before {
	content: '';
	width: 100%;
	height: 1.5625rem;
	position: absolute;
	top: 0;
	left: 0;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/border-top2.svg") no-repeat top center/100% 100%;
	z-index: 2;
}

.border-bottom2::after {
	content: '';
	width: 100%;
	height: 1.5625rem;
	position: absolute;
	bottom: 0;
	left: 0;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/border-bottom2.svg") no-repeat bottom center/100% 100%;
	z-index: 2;
}

/** Muster **/

.bg-pattern {
	background: #ccc;
}

.intro.bg-pattern {
	overflow: hidden;
	background: var(--bg-green2);
}

/* Kariert */

.bg-pattern.plaid .back {
	position: absolute;
	top: -3.125rem;
	left: -3.125rem;
	width: calc(100% + 6.25rem);
	height: calc(100% + 6.25rem);
	z-index: 1;
	transform: rotate(-5deg);
}

.bg-pattern.plaid .back {
	background-image: linear-gradient(45deg, #F7F8DB 25%, transparent 25%, transparent 75%, #F7F8DB 75%, #F7F8DB),
	linear-gradient(45deg, #F7F8DB 25%, transparent 25%, transparent 75%, #F7F8DB 75%, #F7F8DB);
	background-size: 12.5rem 12.5rem;
	background-position: 0 0, 6.25rem 6.25rem;
}

#ueber-uns .intro.bg-pattern {
	overflow: hidden;
	background: var(--bg-blue);
}

#ueber-uns .bg-pattern.plaid .back {
	background-image: linear-gradient(45deg, #ECF3FC 25%, transparent 25%, transparent 75%, #ECF3FC 75%, #ECF3FC),
	linear-gradient(45deg, #ECF3FC 25%, transparent 25%, transparent 75%, #ECF3FC 75%, #ECF3FC);
	background-size: 12.5rem 12.5rem;
	background-position: 0 0, 6.25rem 6.25rem;
}

#tierarten .intro.bg-pattern {
	overflow: hidden;
	background: var(--bg-green1);
}

#tierarten .bg-pattern.plaid .back {
	background-image: linear-gradient(45deg, #EFF5EF 25%, transparent 25%, transparent 75%, #EFF5EF 75%, #EFF5EF),
	linear-gradient(45deg, #EFF5EF 25%, transparent 25%, transparent 75%, #EFF5EF 75%, #EFF5EF);
	background-size: 12.5rem 12.5rem;
	background-position: 0 0, 6.25rem 6.25rem;
}

#error .intro.bg-pattern {
	overflow: hidden;
	background: var(--bg-orange);
}

#error .bg-pattern.plaid .back {
	background-image: linear-gradient(45deg, #fce5c7 25%, transparent 25%, transparent 75%, #fce5c7 75%, #fce5c7),
	linear-gradient(45deg, #fce5c7 25%, transparent 25%, transparent 75%, #fce5c7 75%, #fce5c7);
	background-size: 12.5rem 12.5rem;
	background-position: 0 0, 6.25rem 6.25rem;
}

/* Wellen */

.intro.bg-pattern.waves {
	background: var(--bg-green2);
}

.bg-pattern.waves .back {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/bg-waves01.svg") no-repeat center bottom/auto 150%;
}

#infos .intro.bg-pattern.waves {
	background: var(--bg-green2);
}

#kontakt .intro.bg-pattern.waves {
	background: var(--bg-gray);
}


/* Streifen */

.intro.bg-pattern.stripes {
	background: var(--bg-orange);
}

.bg-pattern.stripes .back {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/bg-stripes.svg") repeat-x top left/auto 21.875rem;
}

/*** Flex ***/

.flex {
	display: flex;
}

.flex-wrap {
	flex-wrap: wrap;
}

.jc_space-between {
	justify-content: space-between;
}

.jc_center {
	justify-content: center;
}

.jc_end {
	justify-content: flex-end;
}

.ai_start {
	align-items: flex-start;
}

.ai_center {
	align-items: center;
}

/*** Grid ***/

.multicol {
	position: relative;
}

.multicol .col {
	position: relative;
	width: 100%;
	margin: 0 0 1.25rem 0;
}

.multicol .col:last-child {
	margin: 0;
}

/*** Buttons ***/

a.btn {
	position: relative;
	display: inline-block;
	text-transform: uppercase;
	letter-spacing: var(--ls-large);
	border-radius: 0.1875rem;
	line-height: 1;
	padding: 0.625rem 1.5625rem;
	font-weight: 400;
	min-width: 14.0625rem;
	text-align: center;
	margin: 1.25rem 0 0 0;
}

a.btn:hover {
	text-decoration: none;
}

a.btn.green {
	color: #fff;
	background: linear-gradient(to bottom, var(--btn-green1), var(--btn-green2));
}

/** PayPal **/

a.paypal {
	background: #ffd140;
	color: #1F264F;
	font-family: 'Roboto';
	font-style: italic;
	padding: 0.9375rem;
	border-radius: 3.125rem;
	text-transform: uppercase;
	line-height: 1;
	font-weight: 700;
	width: 15.625rem;
	text-decoration: none;
	display: inline-block;
}

a.paypal span {
	width: 4.375rem;
	display: inline-block;
	margin: 0 0.9375rem 0 0;
	vertical-align: middle;
	line-height: 1;
}

a.paypal:hover {
	background: #EFC416;
}

/*** Abstände ***/

.space-after-medium,
.space-after-large,
.multicol .col.space-after-medium {
	margin-bottom: 3.125rem;
}

/*******************************************************************************************/
/*** HEADER ********************************************************************************/
/*******************************************************************************************/

header {
	position: fixed;
	z-index: 100;
	width: 100%;
	background: #fff;
	height: 5rem;
}

header > .container {
	height: 100%;
}

#logo {
	width: 10rem;
}

#logo img {
	display: block;
}

#logo .img {
	width: 2.8125rem;
	transition: transform 0.3s;
	transform-origin: top center;
}

#logo:hover .img {
	transform: scale(1.2);
}

#logo .txt {
	width: calc(100% - 2.8125rem);
	padding: 0 0 0 1rem;
}

/*** Mobile Nav ***/

#mo-btn {
	display: block;
	width: 5rem;
	height: 3.75rem;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/menue.svg") no-repeat center/4.0625rem auto;
	border-radius: 100%;
	cursor: pointer;
}

nav {
	position: fixed;
	width: 100%;
	max-width: 20rem;
	height: 100%;
	background: #fff;
	top: 0;
	left: -37.5rem;
	padding: 1.5625rem;
	box-shadow: 0.9375rem 0 1.875rem rgba(0,0,0,0.25);
	transition: left 0.5s;
	z-index: 10;
}

nav.open {
	left: 0;
}

.overlay-nav {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.8);
}

nav ul {
	margin: 0;
	padding: 0;
}

nav ul li {
	padding: 0;
	margin: 0 0 1.25rem 0;
	list-style: none;
	display: block;
}

nav ul li a {
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
	line-height: 1.1;
	display: flex;
	align-items: center;
	position: relative;
	letter-spacing: var(--ls-large);
	padding: 0.625rem 0;
}

nav ul li a:hover {
	text-decoration: none;
}

nav ul li a::before {
	content: '';
	width: 0;
	background: var(--black);
	height: 0.3125rem;
	bottom: -0.3125rem;
	left: 0;
	position: absolute;
	transition: width 0.3s;
}

nav ul li.active a::before {
	width: 100%;	
}

nav ul li a span {
	display: block;
	margin: 0 1.25rem 0 0;
}

nav ul li a span img {
	width: 1.5rem;
}

nav ul li.hide {
	margin: 0 0 0.625rem 0;
}

nav ul li.hide a {
	text-transform: none;
}

nav ul li .sub {
	padding: 1.25rem 0 0 45px;
	li {
		margin: 0;
		a {
			font-size: 14px;
		}
	}
}

#close {
	font-size: 0.75rem;
	text-transform: uppercase;
	display: flex;
	justify-content: flex-end;
	margin: 0 0 2.5rem 0;
	cursor: pointer;
}

#close span {
    position: relative;
    height: 0.9375rem;
    width: 0.9375rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
	margin: 0 0 0 0.625rem;
}

#close span::before,
#close span::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 0.125rem;
    background-color: var(--black);
}

#close span::before {
    transform: rotate(45deg);
}

#close span::after {
    transform: rotate(-45deg);
}

/*******************************************************************************************/
/*** CONTENT *******************************************************************************/
/*******************************************************************************************/

/*** Bubble ***/

.bubble {
	position: relative;
}

.bubble img {
	max-width: 28.75rem;
}

.bubble .txt {
	position: absolute;
	z-index: 2;
}

.bubble .txt span {
	position: relative;
	display: inline-block;
	background: var(--black);
	color: #fff;
	line-height: 1;
	padding: 0.625rem 1.5625rem;
	border-radius: 0.1875rem;
	margin: 0.125rem;
	text-transform: uppercase;
	letter-spacing: var(--ls-large);
	text-align: center;
	font-size: 0.75rem;
}

.bubble .txt.outline span {
	border: 0.0625rem solid var(--black);
	background: #fff;
	color: var(--black);
}

.bubble .heart {
	position: absolute;
	z-index: 3;
	width: 2.5rem;
	height: 2.5rem;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/herz01.svg") no-repeat center/contain;
	transition: transform 0.3s;
}

.bubble .heart:hover {
	transform: scale(1.5);
}

/** Tiere **/

/* Home */

#esel.bubble {
	margin: -6.25rem 0 0 0;
	max-width: 28.75rem;
}

#esel.bubble img {
	margin: 0 0 0 -3.125rem;
}

#esel.bubble .txt {
	right: -0.9375rem;
	bottom: 30%;
}

#esel.bubble .txt span:first-child {
	right: 0.9375rem;
}

/* Home Footer */

#hund01.bubble {
	max-width: 32.5rem;
}

#hund01.bubble .txt {
	top: 50%;
	margin-top: -3.4375rem;
	right: -1.25rem;
	text-align: center;
}

#hund01.bubble img {
	margin-left: -3.125rem;
}

#hund01.bubble .heart {
	top: 60%;
	left: 55%;
}

/* Über uns */

#katzen.bubble {
	margin: 1.25rem 0 -6.25rem 0;
}

#katzen.bubble img {
	display: block;
	margin: 0 auto;
}

#katzen.bubble .txt {
	left: 50%;
	margin-left: -7.1875rem;
	top: 1.5625rem;
}

#katzen.bubble .txt span:nth-child(1) {
	left: -1.5625rem;
}

#katzen.bubble .heart {
	bottom: 25%;
	left: 50%;
}

#hund02.bubble {
	max-width: 35rem;
	margin: 0 auto;
	margin-bottom: -3.125rem;
}

#hund02.bubble img {
	max-width: 100%;
}

#hund02.bubble .heart {
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/herz02.svg") no-repeat center/contain;
	bottom: 30%;
	left: 21%;
}

/* Tierarten */

#tierarten #hund01.bubble {
	margin: 0 auto;
	margin-bottom: -3.125rem;
}

/* Infos */

#vogel.bubble {
	margin: -6.25rem 0 -3.125rem 0;
	max-width: 28.75rem;
}

#vogel.bubble .txt {
	right: -1.25rem;
	bottom: 30%;
}

#vogel.bubble .txt span:nth-child(1) {
	right: 1.25rem;
}

/* Kontakt */

#graphic.bubble {
	text-align: center;
	margin-bottom: -6.25rem;
}

#graphic.bubble .txt {
	bottom: 30%;
}

#graphic.bubble .txt span:nth-child(1) {
	left: -1.375rem;
}

#graphic.bubble img {
	margin-right: -3.125rem;
}

/* 404 */

#eule.bubble {
	text-align: center;
	margin: 2.5rem 0 -6.25rem 0;
}

/*** Teaser ***/

#teaser.multicol .col {
	position: relative;
}

#teaser.multicol .col h3 {
	margin: 0 0 1.25rem 0;
}

#teaser.multicol .col h3 span {
	margin: 0 0 0.3125rem 0;
}

#teaser.multicol .col:nth-child(1) h3 span {
	color: var(--green1);
}

#teaser.multicol .col:nth-child(2) h3 span {
	color: var(--green2);
}

#teaser.multicol .col:nth-child(3) h3 span {
	color: var(--orange);
}

#teaser.multicol .col p {
	max-width: 22.5rem;
	margin: 0 auto;
}

#teaser.multicol .col a.btn {
	margin: 0.3125rem 0 0 0;
}

/** Tiere **/

#teaser.multicol {
	margin-bottom: 3.125rem;
}

#teaser.multicol .col .img {
	height: 12.5rem;
	width: 100%;
	display: block;
	text-align: center;
	margin: 0 0 -1.25rem 0;
}

#teaser.multicol .col .img img {
	height: 100%;
	width: auto;
}

/** Hintergrund Kreis **/

#teaser.multicol .col::after {
	content: '';
	position: absolute;
	top: 3.125rem;
	left: -1.5625rem;
	width: calc(100% + 3.125rem);
	height: 28.75rem;
	z-index: -2;
	background: no-repeat center top/28.75rem auto;
}

#teaser.multicol .col:nth-child(1)::after {
	background-image: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/circle01.webp");
}

#teaser.multicol .col:nth-child(2)::after {
	background-image: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/circle02.webp");
}

#teaser.multicol .col:nth-child(3)::after {
	background-image: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/circle03.webp");
}

/*** Zitat ***/

.quote {
	margin: 0 0 1.25rem 0;
}

.quote p {

}

.quote .author {
	color: #fff;
	font-family: 'Emilys Candy';
	font-size: 2rem;
	line-height: 1;
}

/*** Karte ***/
	
#map {
	position: relative;
	height: 28.125rem;
	left: -1.5625rem;
	width: calc(100% + 3.125rem);
	overflow: hidden;
}

#map img {
	position: absolute;
	top: 0;
	right: -4.375rem;
	width: 31.875rem;
}

#map .circle {
	position: absolute;
	width: 5rem;
	height: 5rem;
	z-index: 2;
	top: 4.6875rem;
	right: 4.375rem;
	transition: transform 0.3s;
}

#map .circle span {
	border: 0.125rem solid var(--black);
	border-radius: 100%;
	height: 5rem;
	width: 5rem;
	position: absolute;
	transition: all 0.3s;
}

#map .circle span:nth-child(2) {
	width: 3.125rem;
	height: 3.125rem;
}

#map .circle span:nth-child(3) {
	width: 2.5rem;
	height: 2.5rem;
}

/** Karte Info-Box **/

#map-route {
	font-family: 'Roboto';
	box-shadow: rgba(0, 0, 0, 0.3) 0 0.0625rem 0.25rem -0.0625rem;
	border-radius: 0.125rem;
	padding: 0.625rem;
	max-width: 20rem;
	font-size: 0.75rem;
	color: #5b5b5b;
	letter-spacing: 0;
}

#map-route .col {
	margin: 0;
}

#map-route .col.lft {
	width: calc(100% - 5rem);
}

#map-route .col.rght {
	width: 5rem;
}

#map-route strong {
	font-size: 0.875rem;
	color: #000;
}

#map-route a {
	color: #1a73e8;
}

#map-route a:hover {
	text-decoration: underline;
}

#map-route p {
	padding: 0;
}

#map-route .col.rght a {
	text-align: center;
	display: inline-block;
}

#map-route .col.rght a img {
	width: 1.25rem;
	opacity: 0.8;
	margin: 0 auto;
	display: block;
}

#map-route .col.rght a:hover img {
	opacity: 1;
}

.review {
	margin: 0.625rem 0;
	line-height: 1;
}

.review .nbr {
	font-weight: 700;
	font-size: 0.875rem;
	color: #5b5b5b;
}

.review .rating {
	margin: 0 0.9375rem 0 0.3125rem;
}

.review .rating span {
	width: 0.625rem;
	height: 0.625rem;
	display: inline-block;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/star.svg") no-repeat center/contain;
}

.review .rating span.gray {
	filter: grayscale(1);
}

/*** Galerie ***/

.overlay-gallery {
	display: none;
	width: 100%;
	height: 100%;
	z-index: 100;
	background: rgba(0,0,0,0.8);
	position: fixed;
	top: 0;
	left: 0;
	padding: 0.9375rem;
}

.overlay-gallery.open {
	display: block;
}

.overlay-gallery .inner {
	height: 100%;
	max-width: 29.375rem;
	position: relative;
	margin: 0 auto;
}

#close-gallery {
	position: absolute;
	z-index: 10;
	width: 1.5625rem;
	height: 1.5625rem;
	background: #A0A0A0;
	color: #fff;
	font-size: 1.25rem;
	right: 0.625rem;
	bottom: 1rem;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	border-radius: 0.125rem;
}

#close-gallery:hover {
	background: var(--black);
}

.swiper {
	width: 100%;
	height: 100%;
	max-width: 25rem;
	max-height: 27.5rem;
}

.swiper .swiper-slide {
	overflow: hidden;
	padding: 0.625rem 0.625rem 3.75rem 0.625rem;
	background: #fff;
	border-radius: 0.1875rem;
	border: 0.0625rem solid #D1D1D1;
}

.swiper .swiper-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0.125rem;
}

.swiper-btn {
	width: 1.5625rem;
	height: 1.5625rem;
	border-radius: 0.125rem;
	background: #A0A0A0 no-repeat center/0.625rem auto;
}

.swiper-btn::after {
	content: none !important;
}

.swiper-button-prev {
	background-image: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/arrow-l.svg");
	left: 0;
}

.swiper-button-next {
	background-image: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/arrow-r.svg");
	right: 0;
}

.swiper-btn:hover {
	background-color: var(--green1);
}

.gallery {
	position: relative;
	width: 100%;
	margin: -9.375rem 0 0 0;
	z-index: 10;
}

.gallery .row {
	
}

.gallery .frame {
	display: block;
	width: calc(100%/2 - 0.625rem);
	max-width: 9.6875rem;
	height: 9.6875rem;
	background: #fff;
	border-radius: 0.1875rem;
	border: 0.0625rem solid #D1D1D1;
	box-shadow: 0.125rem 0.125rem 0.3125rem rgba(0,0,0,0.15);
	padding: 0.625rem 0.625rem 1.875rem 0.625rem;
	position: relative;
	margin: 0.3125rem;
}

.gallery .frame.txt {
	width: 100%;
	max-width: 100%;
	height: auto;
	border: none;
	box-shadow: none;
	background: none;
	margin: 0;
	padding: 1.5625rem 0 1.875rem 0;
}

.gallery .frame.txt .large {
	font-family: 'Emilys Candy';
	font-size: 2rem;
	line-height: 1;
	padding: 0;
	color: var(--yellow);
	position: relative;
	z-index: -1;
}

.gallery .frame.txt .large::before {
	content: '';
	width: 2.5rem;
	height: 2.5rem;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/heart03.svg") no-repeat center/contain;
	position: absolute;
	left: 50%;
	margin-left: -5.625rem;
	bottom: -0.9375rem;
}

.gallery .frame .img {
	position: relative;
	width: 100%;
	height: 100%;
	background: var(--black);
}

.gallery .frame .img img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	border-radius: 0.125rem;
	transition: 0.3s;
}

.gallery .frame:nth-child(1),
.gallery .frame:nth-child(5),
.gallery .frame:nth-child(9){
	transform: rotate(-20deg);
}

.gallery .frame:nth-child(2),
.gallery .frame:nth-child(10) {
	transform: rotate(20deg);
}

.gallery .frame:nth-child(3),
.gallery .frame:nth-child(11) {
	transform: rotate(-5deg);
}

.gallery .frame:nth-child(4),
.gallery .frame:nth-child(8),
.gallery .frame:nth-child(12) {
	transform: rotate(15deg);
}

.gallery .frame:nth-child(6) {
	transform: rotate(5deg);
}

/*******************************************************************************************/
/*** SEITEN ********************************************************************************/
/*******************************************************************************************/

/*** Über uns ***/

#ce01 {
	margin-top: -12.5rem;
	z-index: 2;
	position: relative;
}

/*** Tierarten ***/

/** Intro **/

#tierarten .intro a.btn.green {
	margin: 0.625rem 0 1.25rem 0;
}

/** Bild (Kleintiere) - Text **/

#ce02.multicol::after {
	content: '';
	left: -1.5625rem;
	width: calc(100% + 3.125rem);
	height: 100%;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/circle-bg01.webp") no-repeat top left -6.25rem/42.5rem auto;
	position: absolute;
	top: 0;
	z-index: -1;
}

#ce02.multicol .txt-img .img {
	width: 100%;
	text-align: right;
	margin: -6.25rem 0 -1.25rem 0;
	z-index: 5;
}

#ce02.multicol .txt-img .img img {
	max-width: 18.75rem;
}

#ce02.multicol .txt-img .txt {
	width: 100%;
}

/*** Infos ***/

/** Bubble Hintergründe **/


#ce05.multicol.mc3::before {
	content: '';
	left: -1.5625rem;
	width: calc(100% + 3.125rem);
	height: 100%;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/circle-bg02.webp") no-repeat top left -12.5rem/28.75rem auto;
	position: absolute;
	top: 3.125rem;
	z-index: -1;
}

#ce05.multicol.mc3::after {
	content: '';
	left: -1.5625rem;
	width: calc(100% + 3.125rem);
	height: 100%;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/circle-bg03.webp") no-repeat bottom right -28.75rem/42.5rem auto;
	position: absolute;
	bottom: -3.125rem;
	z-index: -1;
}

/** Statistik Tiere **/

#ce04.multicol.mc3 {
	margin: -6.25rem 0 0 0;
}

#ce04.multicol.mc3 .img {
	width: 100%;
	height: 12.5rem;
}

#ce04.multicol.mc3 .img img {
	height: 100%;
	width: auto;
}

#ce04.multicol.mc3 .col h3 span {
	color: #fff;
	text-shadow: 0.125rem 0.125rem var(--red);
}

#ce04.multicol.mc3 .col {
	position: relative;
}

#ce04.multicol.mc3 .col::after {
	content: '';
	width: calc(100% + 3.125rem);
	height: 100%;
	position: absolute;
	z-index: -1;
	top: 0;
	left: -1.5625rem;
	background: no-repeat center/25rem auto;
}

#ce04.multicol.mc3 .col:nth-child(1)::after {
	top: 1.5625rem;
	background-image: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/shadow-bg01.webp");
}

#ce04.multicol.mc3 .col:nth-child(2)::after {
	top: 1.5625rem;
	background-image: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/shadow-bg02.webp");
}

#ce04.multicol.mc3 .col:nth-child(3)::after {
	background-image: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/shadow-bg03.webp");
}

/** Galerie **/

#galerie .section.intro {
	padding: 3.125rem 0 12.5rem 0;
}

/** Kontakt **/

#kontakt .section.intro .multicol.mc2 .col:nth-child(1) {
	padding-bottom: 3.125rem;
}

#kontakt .section.intro .multicol.mc2 .col:nth-child(1)::after {
	content: '';
	width: 15.625rem;
	height: 6.25rem;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/wegweiser.svg") no-repeat top left/contain;
	position: absolute;
	left: -1.5625rem;
	bottom: 0;
	z-index: -1;
}

/* Karte */

#ce06.multicol #map img {
	right: -2.5rem;
}

#ce06.multicol #map .circle {
	right: 6.1875rem;
}

/*******************************************************************************************/
/*** FOOTER ********************************************************************************/
/*******************************************************************************************/

#CookiebotWidget {
	display: none;
}

footer .ftr {
	padding: 3.125rem 0;
}

footer .ftr.bottom {
	padding: 6.25rem 0;
}

/*** Footer Kontakt ***/

.ftr.top {
	
}

.ftr.top .col .title {
	display: block;
	text-transform: uppercase;
	letter-spacing: var(--ls-large);
	line-height: 1.2;
	margin: 0 0 0.3125rem 0;
}

.ftr.top .col img {
	width: 3.125rem;
}

.ftr.top .col p {
	width: 100%;
	padding: 0.3125rem 0 0 0;
}

/*** Footer Logo ***/

.ftr.bottom .logo {
	margin: 0 0 1.25rem 0;
}

.ftr.bottom .logo .img {
	width: 50%;
	margin: 0 0 0 -1.25rem;
}

.ftr.bottom .logo .img img {
	width: 8.125rem;
}

.ftr.bottom .logo .txt {
	width: 50%;
	line-height: 1.3;
	padding: 0.5rem 0 0 0;
	margin: 0 -1.25rem 0 0;
	z-index: 1;
	text-align: right;
	font-size: 0.875rem;
}


.ftr.bottom .logo .txt span {
	display: block;
	font-family: 'Emilys Candy';
	font-size: 1.5rem;
	line-height: 1.45rem;
	margin: 0 0 0.25rem 0;
}

.ftr.bottom .copyright {
	text-transform: uppercase;
	font-size: 0.75rem;
}

/*** Störer ***/

.quicklinks {
	position: fixed;
	z-index: 99;
	top: 50%;
	right: 0;
	width: 6.25rem;
	height: 12.5rem;
}

.quicklinks .link {
	width: 6.25rem;
	height: 6.25rem;
	position: relative;
}

#donation.link {
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/patch01.webp") no-repeat center/100% auto;
}

#phone.link {
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/patch02.webp") no-repeat center/100% auto;
}

.quicklinks .link svg {
	width: 3.125rem;
	height: 3.125rem;
}

#donation.link svg {
	margin-top: -0.5rem;
}

#donation.link svg .st0 {
	fill: #ffffff;
}

#donation.link svg .st1 {
	fill: #D96519;
}

#donation #coin {
	transition: transform 0.5s;
}

#phone.link svg .st0 {
	fill: none;
}

#phone.link svg .st1,
#phone.link svg .st2 {
	fill: #ffffff;
}

#phone.link #icon {
	position: absolute;
	z-index: 2;
	width: 1.875rem;
	height: 1.25rem;
	top: 2.0625rem;
	transition: transform 0.5s;
	transform-origin: center bottom;
}

/*** Cookies ***/

#cookies {
	position: fixed;
	bottom: 0.9375rem;
	left: 0.9375rem;
	z-index: 99;
	height: 5rem;
	display: flex;
	align-items: center;
	text-decoration: none;
}

#cookies .circle {
	width: 5rem;
	height: 5rem;
	border-radius: 100%;
	display: block;
	background: linear-gradient(to bottom, var(--btn-green1), var(--btn-green2));
	transition: all 0.3s;
}

#cookies .circle .txt {
	display: none;
}

#cookies .icon {
	position: absolute;
	width: 5rem;
	height: 5rem;
	z-index: 2;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
}

#cookies .icon img {
	width: 4rem;
}

#cookies .pattern {
	position: absolute;
	width: 5rem;
	height: 5rem;
	z-index: 1;
	top: -0.3125rem;
	left: -0.3125rem;
	transition: 0.3s;
	background: url("/tiervermittlung/typo3conf/ext/tierheim_pflanzwirbach/Resources/Public/Images/circle-pattern.svg");
	background-size: 6.25rem;
}

/*******************************************************************************************/
/*** COOKIES *******************************************************************************/
/*******************************************************************************************/

.CookieDeclarationIntro {
	display: none;
}