/* Custom styles */

:root{
	--jvh-black: var(--tcb-color-8);
	--jvh-mintlight: #ebf9f8;
	--jvh-mint: var(--tcb-color-5);
	--jvh-blue: var(--tcb-color-4);
	--jvh-green: var(--tcb-color-1);
	--jvh-yellow: var(--tcb-color-7);
	--jvh-white-80: rgba(255,255,255,0.8);
	--jvh-white-70: rgba(255,255,255,0.7);
}

article{
	position: relative;
}
.fullheight{
	position: absolute;
	width: 100%;
	height: 100% !important;
}

.hero_border_bottom{
	position: relative;
	overflow: hidden;
}
.hero_border_bottom::after {
	position: absolute;
	content: "";
	background-image: url('../images/jvh-heroborder.svg');
	background-repeat: no-repeat;
	background-position: center bottom;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.bg_img_fullborder > div:first-child {
	background-position: 10vw center !important;
	background-size: cover !important;
	background-color: white !important;
	mask-image: url('../images/jvh-fullborder.svg');
	mask-size: 140% 120%;
	mask-repeat: no-repeat;
	mask-position: 12vw bottom;
	max-width: 60vw;
	right: 0;
	position: absolute;
	margin: 0 0 0 auto;
}
@media only screen and (max-width: 460px){
	.bg_img_fullborder > div:first-child {
		background-position: top center !important;
		background-size: 112vw !important;
		mask-size: 100vw 99%;
		mask-position: center -170vw;
		max-width: 100%;
		margin: 0 auto;
	}
	.bg_img_fullborder > div:last-child {
		padding-top: 60vw;
	}
}

.img_fullborder img{
	mask-image: url('../images/jvh-fullborder.svg');
	mask-size: 100% 100%;
	mask-repeat: no-repeat;
	mask-position: center center;
}
.img_fullborder.big_img_right_top > :first-child {
	overflow: visible clip;
}
.img_fullborder.big_img_right_top img {
	position: relative;
	max-width: calc(125vw / 2) !important;
	width: calc(125vw / 2) !important;
	top: -5vw;
	right: 0;
}

.bg_full{
	mask: url('../images/jvh-bgfull.svg');
	mask-repeat: no-repeat;
	mask-position: top;
	mask-size: 100% 100%;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	background-color: #fff;
}
.bg_full.mintlight{
	background-color: var(--jvh-mintlight);
}
.bg_full.mint{
	background-color: var(--jvh-mint);
}
.bg_full.blue{
	background-color: var(--jvh-blue);
}
.bg_full.green{
	background-color: var(--jvh-green);
}
.bg_full.yellow{
	background-color: var(--jvh-yellow);
}
.bg_full.white_80{
	background-color: var(--jvh-white-80);
}
.bg_full.white_70{
	background-color: var(--jvh-white-70);
}

.swoosh_klein{
	mask: url('../images/jvh-swoosh-klein.svg');
	mask-repeat: no-repeat;
	mask-position: top;
	mask-size: 100% 100%;
	width: auto;
	height: auto;
	background-color: #fff;
	padding-top: 2rem !important;
	padding-bottom: 2rem !important;
}
.swoosh_klein.mintlight{
	background-color: var(--jvh-mintlight);
}
.swoosh_klein.mint{
	background-color: var(--jvh-mint);
}
.swoosh_klein.blue{
	background-color: var(--jvh-blue);
}
.swoosh_klein.green{
	background-color: var(--jvh-green);
}
.swoosh_klein.yellow{
	background-color: var(--jvh-yellow);
}
.swoosh_klein.white_80{
	background-color: var(--jvh-white-80);
}
.swoosh_klein.white_70{
	background-color: var(--jvh-white-70);
}

.swoosh_mittel{
	mask: url('../images/jvh-swoosh-mittel.svg');
	mask-repeat: no-repeat;
	mask-position: top;
	mask-size: 100% 100%;
	width: auto;
	height: auto;
	background-color: #fff;
	padding-top: 2rem !important;
	padding-bottom: 2rem !important;
}
.swoosh_mittel.mintlight{
	background-color: var(--jvh-mintlight);
}
.swoosh_mittel.mint{
	background-color: var(--jvh-mint);
}
.swoosh_mittel.blue{
	background-color: var(--jvh-blue);
}
.swoosh_mittel.green{
	background-color: var(--jvh-green);
}
.swoosh_mittel.yellow{
	background-color: var(--jvh-yellow);
}
.swoosh_mittel.white_80{
	background-color: var(--jvh-white-80);
}
.swoosh_mittel.white_70{
	background-color: var(--jvh-white-70);
}

.border_right_out {
	position: relative;
	z-index: 0;
	height: 100% !important;
	padding: 0 !important;
	display: contents;
}
.border_right_out > :first-child {
	mask-image: url('../images/jvh-borderleft.svg');
	mask-size: 100% 120%;
	mask-repeat: no-repeat;
	mask-position: 0px -1em;
	overflow: visible clip;
	height: 100%;
	width: calc( 100vw / 2) !important;
	max-width: calc( 100vw / 2) !important;
	position: absolute;
	top: 0;
}
.border_right_out > :first-child picture img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.border_right_out.mintlight{
	background-color: var(--jvh-mintlight);
}
.border_right_out.mint{
	background-color: var(--jvh-mint);
}
.border_right_out.blue{
	background-color: var(--jvh-blue);
}
.border_right_out.green{
	background-color: var(--jvh-green);
}
.border_right_out.yellow{
	background-color: var(--jvh-yellow);
}

.border_left_out{
	height: 100% !important;
	padding: 0 !important;
	display: contents;
	position: relative;
	z-index: 0;
}
.border_left_out > :first-child {
	mask-image: url('../images/jvh-borderright.svg');
	mask-size: 100% 120%;
	mask-repeat: no-repeat;
	mask-position: 0px -1em;
	overflow: visible clip;
	height: 100%;
	width: calc( 100vw / 2) !important;
	max-width: calc( 100vw / 2) !important;
	position: absolute;
	top: 0;
	left: calc(100% - 100vw / 2 - 1em);
}
.border_left_out > :first-child picture img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.border_left_out.mintlight{
	background-color: var(--jvh-mintlight);
}
.border_left_out.mint{
	background-color: var(--jvh-mint);
}
.border_left_out.blue{
	background-color: var(--jvh-blue);
}
.border_left_out.green{
	background-color: var(--jvh-green);
}
.border_left_out.yellow{
	background-color: var(--jvh-yellow);
}

.tilt_left {
	transform: rotate(-5deg);
	width: 300px !important;
	margin: 0 auto;
}
.tilt_right {
	transform: rotate(5deg);
	width: 300px !important;
	margin: 0 auto;
}
.icon_podcast > ::before {
	position: relative;
	display: inline-block;
	content: "";
	mask: url('../images/jvh-podcast.svg');
	background-color: white;
	margin-right: 1rem;
	width: 46px;
	height: 46px;
	vertical-align: middle;
	mask-repeat: no-repeat;
	mask-size: 100% 100%;
}
.icon_podcast.mintlight > *:before{
	background-color: var(--jvh-mintlight);
}
.icon_podcast.mint > *:before{
	background-color: var(--jvh-mint);
}
.icon_podcast.blue > *:before{
	background-color: var(--jvh-blue);
}
.icon_podcast.green > *:before{
	background-color: var(--jvh-green);
}
.icon_podcast.yellow > *:before{
	background-color: var(--jvh-yellow);
}

#cat_drop {
	border: 1px solid var(--tcb-color-1);
	border-radius: 2rem;
	margin-top: -5px;
	padding: 1rem 1.5rem;
	background: #fff;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.wechselbild{
	transition: all 1s ease-in-out;
	-webkit-transition: all 1s ease-in-out;
}
.wechselbild:hover > div:first-child, .wechselbild:focus > div:first-child{
	background-size: 0px, cover !important;
}

.thrv_wrapper{
	padding: 0px !important;
}
.blog #theme-top-section{
	z-index: 3 !important;
}
.tve-dynamic-dropdown .tve-item-dropdown-trigger {
	background-color: var(--tcb-local-color-30800);
	border-radius: 50%;
	width: 3em !important;
	height: 3em !important;
	position: absolute;
	right: 1% !important;
	top: 8% !important;
}


.menu-button a{
	border-radius: 40px;
	width: auto;
	padding: 0.5rem 1rem;
	background-color: var(--jvh-yellow);
}
.menu-button a > span{
	color: var(--jvh-black); !important;
}
.menu-button:hover > a{
	text-decoration: none !important;
	background-color: var(--jvh-blue);
}


.thrive-blog-list article {
	width: calc( 100% / 3 - 20px) !important;
	min-height: 300px;
	height: fit-content;
}
.slick-track .content-section .post-wrapper {
	background-image: unset !important;
}
.slick-track .content-section .post-wrapper.thrv_wrapper:nth-child(3n){
	margin-right: 25px !important;
}

@media only screen and (max-width: 822px){
	#thrive-header{
		position: static !important;
	}
	.theme-section.top-section .section-content {
		padding-top: 0 !important;
	}
	.thrive-blog-list article, .tcb-post-list article{
		width: calc( 100% / 2 - 20px) !important;
		margin-bottom: 20px;
	}
	.img_fullborder.big_img_right_top img{
		max-width: 150vw !important;
		width: 150vw !important;
		top: 0;
		left: -25vw;
	}
	.menu-button a{
		margin: 0 auto 1em 2em;
		padding: 0.25rem 0.5rem;
	}
}
@media only screen and (max-width: 460px){
	.thrive-blog-list article, .tcb-post-list article{
		width: 100% !important;
		margin-bottom: 20px;
	}
	.hidemobile{
		display: none !important;
	}
	.border_right_out > :first-child, .border_left_out > :first-child {
		position: relative;
		aspect-ratio: 5 / 4;
		width: 130vw !important;
		max-width: 130vw !important;
		left: -15vw;
		right: -15vw;
		mask-image: url('../images/jvh-fullborder.svg');
		mask-size: 100% 140%;
		mask-repeat: no-repeat;
		mask-position: 0px center;
		overflow: visible;
	}
}