@font-face {
    font-family: 'fs_untitled-bold';
    src: url('../fonts/FSUntitledWeb-Bold750.woff2') format('woff2'),
         url('../fonts/FSUntitledWeb-Bold750.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'fs_untitled-medium';
    src: url('../fonts/FSUntitledWeb-Medium550.woff2') format('woff2'),
         url('../fonts/FSUntitledWeb-Medium550.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'fs_untitled-regular';
    src: url('../fonts/FSUntitledWeb-Regular450.woff2') format('woff2'),
         url('../fonts/FSUntitledWeb-Regular450.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

// A map of breakpoints.
$breakpoints: (
  xs: 576px,
  sm: 768px,
  md: 992px,
  lg: 1200px
);



$breakpointsp: (
  xs: "(min-width: 576px) and (orientation: portrait)",
  sm: "(min-width: 768px) and (orientation: portrait)",
  md: "(min-width: 992px) and (orientation: portrait)",
  lg: "(min-width: 1200px) and (orientation: portrait)"
);

$breakpointsl: (
  xs: "(min-width: 576px) and (orientation: landscape)",
  sm: "(min-width: 768px) and (orientation: landscape)",
  md: "(min-width: 992px) and (orientation: landscape)",
  lg: "(min-width: 1200px) and (orientation: landscape)"
);



@mixin media-breakpoint-up($breakpoint) {

  @if map-has-key($breakpoints, $breakpoint) {
    $breakpoint-value: map-get($breakpoints, $breakpoint) ;
    @media (min-width: $breakpoint-value)   {
      @content;
    }
  } @else {
    @warn 'Invalid breakpoint: #{$breakpoint}.';
  }
}

@mixin media-breakpoint-up-portrait($breakpoint) {

  @if map-has-key($breakpointsp, $breakpoint) {
    $breakpoint-value: map-get($breakpointsp, $breakpoint) ;
    @media #{unquote( $breakpoint-value)}   {
      @content;
    }
  } @else {
    @warn 'Invalid breakpoint: #{$breakpoint}.';
  }
}

@mixin media-breakpoint-up-landscape($breakpoint) {

  @if map-has-key($breakpointsl, $breakpoint) {
    $breakpoint-value: map-get($breakpointsl, $breakpoint) ;
    @media #{unquote( $breakpoint-value)}   {
      @content;
    }
  } @else {
    @warn 'Invalid breakpoint: #{$breakpoint}.';
  }
}

@mixin media-breakpoint-down($breakpoint) {

  @if map-has-key($breakpoints, $breakpoint) {
    $breakpoint-value: map-get($breakpoints, $breakpoint);
    @media (max-width: ($breakpoint-value - 1)) {
      @content;
    }
  } @else {
    @warn 'Invalid breakpoint: #{$breakpoint}.';
  }
}


body{
	font-size: 18px;
	line-height: 24px;
	background-color: white;
	font-family: 'fs_untitled-regular';
	background: url(../pics/BG.svg);
	background-position: -2vw 200px;
	@include media-breakpoint-down(lg){
		background-position: -2vw 135px;
	}
	@include media-breakpoint-down(md){
		background-position: -2vw 105px;
	}
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: 168vw auto;
}
@include media-breakpoint-down(md){
	body.menueopen{
		overflow: hidden;
	}
}

.zad-partner-login-page,
.zad-partner-mode{
	#masthead.zad-partner-header{
		padding: 24px 0 18px;
		background: white;
		border-bottom: 1px solid rgba(49, 175, 215, 0.15);
		box-shadow: 0 12px 32px rgba(15, 36, 46, 0.08);
		overflow: visible;

		.row{
			flex-wrap: nowrap;
			align-items: center;
		}

		&.shrink{
			transform: none;
		}

		.site-branding{
			position: static;
			display: flex;
			align-items: center;
			margin: 0;
			flex: 0 1 auto;
			width: auto;
			max-width: none;
		}

		.zad-partner-branding{
			display: flex;
			align-items: center;
			gap: 24px;
			flex-wrap: nowrap;
			width: auto;

			> a{
				display: inline-flex;
				align-items: center;
				flex: 0 0 auto;
			}
		}

		#logo{
			width: 210px;
			height: auto;
			max-height: none;
			max-width: 100%;
		}

		.zad-partner-brand{
			display: flex;
			align-items: center;
			gap: 18px;
			min-height: 52px;
		}

		.zad-partner-brand-divider{
			display: block;
			width: 1px;
			height: 52px;
			background: rgba(49, 175, 215, 0.25);
		}

		.zad-partner-brand-logo{
			display: flex;
			align-items: center;
			flex: 0 0 auto;

			img{
				display: block;
				height: 52px;
				width: auto;
				max-height: 52px;
				max-width: none;
				flex: 0 0 auto;
			}
		}

		.zad-partner-brand-name{
			font-family: 'fs_untitled-medium';
			font-size: 26px;
			line-height: 1.1;
			color: #111;
		}

		.primary-navigation.zad-partner-navigation{
			position: relative;
			margin-left: auto;
			margin-top: 0;
			display: flex;
			align-items: center;
			justify-content: flex-end;
			flex: 1 1 auto;
			min-width: 0;
		}

		.zad-partner-nav{
			list-style: none;
			display: flex;
			align-items: center;
			justify-content: flex-end;
			gap: 14px;
			margin: 0;
			padding: 0;
			width: 100%;

			li{
				margin: 0;
			}

			a{
				display: grid;
				padding: 6px 10px 3px 10px;
				border: none;
				border-radius: 0;
				background: transparent;
				outline: none;
				box-shadow: none;
				font-family: 'fs_untitled-medium';
				font-size: 20px;
				line-height: 1.1;
				color: #31AFD7;
				text-decoration: none;
				transition: none;
				white-space: nowrap;

				&:hover{
					text-decoration: none;
					color: white;
					background: #31AFD7;
					border-radius: 15px;
				}

				&:focus,
				&:focus-visible{
					outline: none;
					box-shadow: none;
				}
			}
		}

		@include media-breakpoint-down(md){
			padding: 18px 0 16px;

			.site-branding,
			.primary-navigation.zad-partner-navigation{
				flex: 0 0 100%;
				max-width: 100%;
			}

			.primary-navigation.zad-partner-navigation{
				margin-top: 18px;
				justify-content: flex-start;
			}

			.zad-partner-nav{
				justify-content: flex-start;
				flex-wrap: wrap;
			}

			height: auto;
			min-height: 0;

			.zad-partner-branding{
				gap: 16px;
				flex-wrap: wrap;
			}

			#logo{
				width: 170px;
			}

			.zad-partner-brand{
				width: 100%;
				gap: 12px;
			}

			.zad-partner-brand-divider{
				height: 38px;
			}

			.zad-partner-brand-logo img{
				height: 38px;
				max-height: 38px;
			}

			.zad-partner-brand-name{
				font-size: 20px;
			}

			.zad-partner-nav{
				gap: 10px;

				a{
					display: inline;
					padding: 6px 10px 3px 10px;
					font-size: 20px;
					line-height: 1.1;
					
					&:hover{
						border-radius: 25px;
					}
				}
			}
		}
	}
}

@media (min-width: 992px){
	.zad-partner-login-page #masthead.zad-partner-header #logo,
	.zad-partner-mode #masthead.zad-partner-header #logo{
		width: 150px !important;
		height: auto !important;
		max-width: none !important;
	}

	.zad-partner-login-page #masthead.zad-partner-header .zad-partner-brand,
	.zad-partner-mode #masthead.zad-partner-header .zad-partner-brand{
		min-height: 61px;
	}

	.zad-partner-login-page #masthead.zad-partner-header .zad-partner-brand-logo,
	.zad-partner-mode #masthead.zad-partner-header .zad-partner-brand-logo{
		min-height: 61px;
		align-items: center;
	}

	.zad-partner-login-page #masthead.zad-partner-header .zad-partner-brand-logo img,
	.zad-partner-mode #masthead.zad-partner-header .zad-partner-brand-logo img{
		height: 44px;
		max-height: 44px;
	}
}

.zad-partner-login,
.zad-partner-availability{
	padding-bottom: 72px;

	.zad-partner-login-card,
	.zad-partner-page-header{
		background: white;
		border-radius: 24px;
		box-shadow: 0 18px 48px rgba(15, 36, 46, 0.08);
		padding: 32px;
		margin-bottom: 32px;
	}

	h1{
		font-size: 42px;
		line-height: 1;
		margin-bottom: 18px;
	}

	p{
		font-size: 18px;
		line-height: 1.5;
		margin-bottom: 0;
	}

	@include media-breakpoint-down(md){
		padding-bottom: 48px;

		.zad-partner-login-card,
		.zad-partner-page-header{
			padding: 24px;
			border-radius: 18px;
			margin-bottom: 24px;
		}

		h1{
			font-size: 30px;
		}

		p{
			font-size: 16px;
		}
	}
}

.zad-partner-login{
	.zad-partner-login-card{
		border: 1px solid #D8D9DA;
	}

	.zad-partner-login-message{
		margin: 0 0 24px;
		padding: 14px 16px;
		border-radius: 14px;
		background: rgba(109, 6, 84, 0.08);
		color: #6D0654;
		font-size: 15px;
		line-height: 1.4;
	}

	.zad-partner-login-form{
		margin-top: 28px;
	}

	.zad-partner-login-field{
		margin-bottom: 20px;
	}

	label{
		display: block;
		margin-bottom: 8px;
		font-family: 'fs_untitled-medium';
		font-size: 15px;
		line-height: 1.2;
		color: #111;
	}

	input{
		width: 100%;
		height: 52px;
		padding: 0 18px;
		border: 1px solid rgba(17, 17, 17, 0.12);
		border-radius: 14px;
		font-size: 16px;
		color: #111;
		background: #fff;
	}

	.zad-partner-login-actions{
		margin: 28px 0 0;

		.btn-zad{
			border-color: #31AFD7;
			color: #31AFD7;
			background: transparent !important;
			background-color: transparent !important;
			border-radius: 999px;
			padding: 8px 20px;
			font-family: 'fs_untitled-medium';
			font-size: 15px;
			line-height: 1.15;
			min-height: 0;

			&:hover{
				color: white;
				background: #31AFD7 !important;
				background-color: #31AFD7 !important;
			}
		}
	}
}

body.zad-partner-login-modal-open{
	overflow: hidden;
}

.zad-partner-login-modal{
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 24px;

	&.is-open{
		display: flex;
	}

	.zad-partner-login-modal-backdrop{
		position: absolute;
		inset: 0;
		background: rgba(0, 0, 0, 0.42);
	}

	.zad-partner-login-modal-dialog{
		position: relative;
		width: min(520px, 100%);
		max-height: calc(100vh - 48px);
		overflow: auto;
		background: white;
		border: 1px solid #D8D9DA;
		border-radius: 24px;
		box-shadow: 0 24px 72px rgba(15, 36, 46, 0.24);
		padding: 32px;
	}

	.zad-partner-login-modal-close{
		position: absolute;
		top: 18px;
		right: 18px;
		width: 36px;
		height: 36px;
		border: 0;
		border-radius: 0;
		background: transparent;
		color: #31AFD7;
		font-size: 26px;
		line-height: 1;
		cursor: pointer;
		box-shadow: none;
		outline: none;

		&:hover,
		&:focus,
		&:focus-visible{
			background: transparent;
			color: #31AFD7;
			box-shadow: none;
			outline: none;
		}
	}

	h2{
		font-size: 38px;
		line-height: 1;
		margin: 0 48px 16px 0;
		color: #31AFD7;
	}

	p{
		font-size: 17px;
		line-height: 1.45;
		margin-bottom: 0;
	}

	.zad-partner-login-message{
		margin: 24px 0 0;
		padding: 14px 16px;
		border-radius: 14px;
		background: rgba(109, 6, 84, 0.08);
		color: #6D0654;
		font-size: 15px;
		line-height: 1.4;
	}

	.zad-partner-login-form{
		margin-top: 28px;
	}

	.zad-partner-login-field{
		margin-bottom: 20px;
	}

	label{
		display: block;
		margin-bottom: 8px;
		font-family: 'fs_untitled-medium';
		font-size: 15px;
		line-height: 1.2;
		color: #111;
	}

	input{
		width: 100%;
		height: 52px;
		padding: 0 18px;
		border: 1px solid rgba(17, 17, 17, 0.12);
		border-radius: 14px;
		font-size: 16px;
		color: #111;
		background: #fff;
	}

	.zad-partner-login-actions{
		margin: 28px 0 0;

		.btn-zad{
			border-color: #31AFD7;
			color: #31AFD7;
			background: transparent !important;
			background-color: transparent !important;
			border-radius: 999px;
			padding: 8px 20px;
			font-family: 'fs_untitled-medium';
			font-size: 15px;
			line-height: 1.15;
			min-height: 0;

			&:hover{
				color: white;
				background: #31AFD7 !important;
				background-color: #31AFD7 !important;
			}
		}
	}
}

/* Plain CSS fallback for browsers/WP caches that receive this file directly. */
.zad-partner-login-modal .zad-partner-login-modal-close,
.zad-partner-login-modal .zad-partner-login-modal-close:hover,
.zad-partner-login-modal .zad-partner-login-modal-close:focus,
.zad-partner-login-modal .zad-partner-login-modal-close:focus-visible,
.zad-partner-login-modal .zad-partner-login-modal-close:active {
	background: transparent !important;
	background-color: transparent !important;
	color: #31AFD7 !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	outline: none !important;
	padding: 0 !important;
	min-width: 0 !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.zad-partner-login-modal .zad-partner-login-modal-close::before,
.zad-partner-login-modal .zad-partner-login-modal-close::after {
	background: transparent !important;
	box-shadow: none !important;
}

.zad-partner-login .zad-partner-login-actions .btn-zad,
.zad-partner-login-modal .zad-partner-login-actions .btn-zad {
	background: transparent !important;
	background-color: transparent !important;
	color: #31AFD7 !important;
	border-color: #31AFD7 !important;
	padding: 8px 20px !important;
	line-height: 1.15 !important;
	min-height: 0 !important;
	box-shadow: none !important;
}

.zad-partner-login .zad-partner-login-actions .btn-zad:hover,
.zad-partner-login .zad-partner-login-actions .btn-zad:focus,
.zad-partner-login-modal .zad-partner-login-actions .btn-zad:hover,
.zad-partner-login-modal .zad-partner-login-actions .btn-zad:focus {
	background: #31AFD7 !important;
	background-color: #31AFD7 !important;
	color: white !important;
}

.vcheck.vcheck-page{
	position: relative;
	width: 100%;
	height: auto;
	padding: 42px 40px 46px;
	border-radius: 24px;
	transform: none;
	background-color: #6D0654;

	.container-fluid{
		padding: 0;
	}

	.container{
		margin-top: 0;
	}

	.zad-vcheck-intro{
		max-width: 720px;
		margin: 10px 0 0;
		color: white;
		font-size: 18px !important;
		line-height: 1.45 !important;
	}

	form{
		margin-top: 16px;

		.form-row [class*=col] .btn-zad{
			margin-top: 30px;
			color: white;

			&:visited,
			&:focus,
			&:hover{
				color: white;
			}
		}
	}

	@include media-breakpoint-down(md){
		padding: 28px 22px 32px;
		border-radius: 18px;
	}
}
*, h1, h2, h3, h4, h5, h6{
	letter-spacing: 0;
	font-weight: 400;
	font-family: 'fs_untitled-medium';
}

h5{
	margin-bottom: 0px !important;
	font-family: 'fs_untitled-bold';
}

p{
	font-size: 18px !important;
	line-height: 28px !important;
	font-family: 'fs_untitled-regular' !important;
}

a, a:visited{
	transition: color 110ms ease-in-out;
	color: #31AFD7;
}
a:focus, a:hover{
	outline: none;
	text-decoration: none;
	color:black;
}

#content{
	min-height: 900px;
}

[type=reset], [type=submit], button, html [type=button]{
	-webkit-appearance: none;
}

strong{
	 font-family: 'fs_untitled-bold' !important;
}

p{
	line-height: 1.6rem;
}

ol{
	li{
		margin-bottom: 20px;
	}
}

code{
	color:black;
}


button:focus, button:focus-visible {
	outline:none;
	box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);
}

.lock-scrolling .site{
	position: relative;
}

.primary-navigation-open .primary-navigation{
	position: absolute;
}

.entry-header, .post-thumbnail, .entry-content, .entry-footer, .author-bio{
	margin-left: 0px;
	@include media-breakpoint-down(md){
		margin-top: 0px;	
	}
}

.entry-content{
	background-color: rgba(255, 255, 255, 0.8);
}

.site-main > *{
	margin-top: auto;
	margin-bottom: auto;
}

.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button){
	color:#31AFD7;
	background: transparent;
}

.site .button, input[type=submit], input[type=reset], .wp-block-search__button, .wp-block-button .wp-block-button__link{
	font-family: 'fs_untitled-medium';
	padding: 0;
	margin: 0;
	font-size: 1.0rem;
	border: 2px solid #31AFD7;
	color:white;
	background-color: #31AFD7 !important;
	padding: 2px 0 0 0;
}

.site .button:hover, input[type=submit]:hover, input[type=reset]:hover, .wp-block-search .wp-block-search__button:hover, .wp-block-file .wp-block-file__button:hover{
	color:#31AFD7;
}


input[type=text], input[type=email], input[type=url], input[type=password], input[type=search], input[type=number], input[type=tel], input[type=date], input[type=month], input[type=week], input[type=time], input[type=datetime], input[type=datetime-local], input[type=color], .site textarea{
	border: 2px solid #31AFD7;
}

input[type=text]:focus, input[type=email]:focus, input[type=url]:focus, input[type=password]:focus, input[type=search]:focus, input[type=number]:focus, input[type=tel]:focus, input[type=date]:focus, input[type=month]:focus, input[type=week]:focus, input[type=time]:focus, input[type=datetime]:focus, input[type=datetime-local]:focus, input[type=color]:focus, .site textarea:focus{
	outline: none;
}

.site-title{
	font-family: 'fs_untitled-regular';
}

.page-header{
	border-bottom: none;
	margin-top: 30px;
	padding-bottom: 0px;
}
 
.bgwhite{
	background: white;
}

#head-wrapper{
	display: flex;
	justify-content:center;
}

#masthead{
	width:100%;
	position: fixed;
	padding-top: 10px;
	background: rgb(255,255,255);
	height:fit-content;
	z-index:999;
	transition: all 0.55s;
	overflow:hidden;
	
	&.shrink{
		transform: translate3d(0, -110px, 0px);
	}
	
	@include media-breakpoint-down(md){
		height:90px;
		&.show{
			height:100vh !important;
		}
	}
	@include media-breakpoint-up(md){
		min-height:110px;	
	}
		
	&.border{
		border-bottom: 1px solod gray;
	}
	#logo{
		height:60px;
		width: auto;
		@include media-breakpoint-up(md){
			height:80px;
		}
	}
	
	.site-branding{
		position: absolute;
		z-index: 999;
		margin-top: 4px;
		margin-right: 0px;
	}
	
	#primary-mobile-menu{
		margin-right: 5px; 
		width:60px;
		justify-content: center;
		align-items: center;
		height:60px;
		background: transparent !important;
		outline: none;
		
		.open img{
			 height:18px;
		}
		.close{
			opacity: 1.0;
			img{
			 	height:23px;
			 }
		}
	}
	
	.primary-navigation{
		position: relative;
		margin-left: auto;
		
		@include media-breakpoint-up(md){
			margin-top: 25px;
		}
		a{
			color:#31AFD7;
			font-family: 'fs_untitled-regular';
			padding: 6px 10px 3px 10px;
			display: grid;
			transition: none;
			@include media-breakpoint-down(md){
				display: inline;
				font-size: 24px;
				line-height: 40px;
			}
			&:hover{
				text-decoration: none;
				background-color: #31AFD7;
				border-radius: 15px;
				@include media-breakpoint-down(md){
					border-radius: 25px;
				}
				color:white;
			}	
			span{
				
			}
		}
		.dropdown-toggle{
			&:after{
				margin: 0;
				border: 0px;
			}
		}
		a#dropdownSuche{
			@include media-breakpoint-down(md){
				display: flex;
				justify-content: flex-end;
				img{
					
				}
			}
			&:hover{
				text-decoration: none;
				background-color: transparent;
				color:#31AFD7;
			}
		}
		a.wpmenucart-contents{
			display: flex;
			span{
				background-color: #6D0654;
				border-radius: 10px;
				width: 16px;
				height: 16px;
				color: white;
				text-align: center;
				font-size: 12px;
				vertical-align: auto;
				display: -webkit-box;
				padding: 3px 0 0 1px;
				margin: -11px 0 0 -12px;
				letter-spacing: -0.05em;
			}
			&:hover{
				text-decoration: none;
				background-color: transparent;
				color:#31AFD7;
			}
		}
		.dropdown-menu.show{
			.active{
				a{
					background-color: #31AFD7;
					border-radius: 15px;
					color:white;
					&:hover{
						text-decoration: none;
					}	
				}
			}
		}
		.current-menu-ancestor > a{
			background-color: #31AFD7;
			border-radius: 15px;
			@include media-breakpoint-down(md){
				border-radius: 25px;
			}
			color:white;
			&:hover{
				text-decoration: none;
			}	
		}
		
		.menu-button-container{

			@include media-breakpoint-down(xs){
				display:block;
				padding:10px 0 0 0;
			}
			@include media-breakpoint-down(md){
				display:block;
				padding:4px 0 0 0;
			}
		}
		
		.main-navi{
			display: flex;
			@include media-breakpoint-down(md){
				display:none;
				flex-direction: column;
				&.show{
					display:flex;
					margin-top: 90px;
				}
				li{
					text-align: right;
				}
			}
			.navbar-collapse{
				flex: 1 auto;	
							
				#menu-navi_main{
					flex-direction: row;
					@include media-breakpoint-down(md){
						flex-direction: column;
					}
					justify-content:flex-end;
					
					.sub-menu-toggle{
						display: none;
					}
					li{
						@include media-breakpoint-down(md){
							text-align: right;
						}
						@include media-breakpoint-up(md){
							margin-right: 20px;
							height:40px;
						}
					}
					.spacer-left{
						margin-left:40px;
						@include media-breakpoint-down(md){
							margin-left:0px;
							margin-top: 15px;
						}
					}
					.dropdown-menu{
						margin-top: 9px;
						@include media-breakpoint-down(md){
							margin:0;
							padding: 0;
							position: relative !important;
							transform: none !important;
							margin-bottom: 20px;
						}
						li{
							
							a{
								@include media-breakpoint-down(md){
									padding: 6px 10px 3px 10px;
								}
							}
						}
					}
				}
			}
			.suche{
				margin: -3px 0 0 10px;
				@include media-breakpoint-down(md){
					margin: 15px 0 0 0;
				}
				#dropdownSuche{
					&::after{
						display: none;
					}
					#Lupe{
						height:25px;
						width: auto;
					}		
				}
				.dropdown-suche{
					width: 400px;
					@include media-breakpoint-down(md){
						width: 100%;
						padding: 0 20px 0 15px;
					}
					#search-form-1{
						width:200px;
						@include media-breakpoint-down(md){
							width:160px;
						}
						height: 36px;
						margin: 0;
						border-top-left-radius: 20px;
						border-bottom-left-radius: 20px;
						
						padding-left: 20px;
						padding-top: 14px;
					}
					
					.search-submit{
						width:100px;
						height:36px;
						font-size: 1.0rem;
						border-top-right-radius: 20px;
						border-bottom-right-radius: 20px;
						border-top-left-radius: 0px;
						border-bottom-left-radius: 0px;
						border-left: 0px;
						margin:0;
						color:white;
						&:hover{
							color:#31AFD7;
							background-color: white !important;
							border: 2px solid #31AFD7;
							border-left: 0px;
						}
						.search-form{
							max-width: none;
						}
					}
				}
			}
			.login{
				margin: -3px 0 0 10px;

				@include media-breakpoint-down(md){
					margin:43px 0 0 0;
					display: flex;
					justify-content: flex-end;
				}
				&:hover{
					text-decoration: none;
					background-color: transparent;
					color:#31AFD7;
				}
			}
			.dropdown-menu{
				border: none;
			}
			.current-menu-item{
				a{
					text-decoration: none;
				}
			}
		}
	}
}

.submenue{
	
	ul{
		padding: 0;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
	}
	li{
		list-style: none;
		list-style-position:inside;
		float: right;
		@include media-breakpoint-down(md){
			float: left;
		}
		display: block;
		margin: 0 0px 10px 0;
		a{
			font-size: 20px;
			color:#31AFD7;
			font-family: 'fs_untitled-medium';
			padding: 6px 10px 3px 10px;
			display: grid;
			transition: none;
			float: right;
			@include media-breakpoint-down(md){
				float: left;
			}
			&:hover{
				text-decoration: none;
				background-color: #31AFD7;
				border-radius: 15px;
				color:white;
			}	
		}
		&.current-menu-item{
			a{
				text-decoration: none;
				background-color: #31AFD7;
				border-radius: 15px;
				color:white;
			}
		}
	}
}

.dropdown-toggle{
	&::after{
		border-top:0px;
	}
}

.btn-zad{
	background-color: transparent;
	border: 2px solid white;
	transition: all 0.25s;
	&.active{
		color:transparent;
		background-color: white;
	}
}

.vcheck{
	background-color: #6D0654;
	width: 100vw;
	height:100vh;
	color:white;
	position:fixed;
	z-index:100;
	padding-top:110px;
	@include media-breakpoint-down(md){
		padding-top:90px;
	}
	transform: translate3d(100vw, 0, 0px);
	
	.vcheck_nippel{
		transform: rotate(-90deg);
		margin-left: -145px;
		@include media-breakpoint-down(md){
				margin-left: -110px;
			}
		background: #6D0654 !important;
		border:none;
		border-top-left-radius:18px;
		border-top-right-radius:18px;
		color:white;
		padding: 11px 15px 43px 15px;
		margin-top: 150px;
		position: absolute;
		font-size: 20px;
		font-family: 'fs_untitled-regular';
	}
	.vcheck_nippel.plz{
			font-family: 'fs_untitled-regular';
			margin-left: -145px;
			@include media-breakpoint-down(md){
				margin-left: -120px;
			}
			span{
				font-family: 'fs_untitled-medium';
			}
		}
	
	&.show{
		transform: translate3d(0px, 0vw, 0px);
		transition: transform 1.0s ease-in-out 0.125s;
	}
	&.hide{
		transition: transform 1.0s ease-in-out 0.125s;
	}
	.close{
		color:white !important;
		text-shadow: none;
		font-size: 2.5rem;
		opacity: 1.0;
		transition: all 0.25s;
		padding: 20px;
		background: transparent !important;
		&:hover{
			opacity: 0.5 !important;
		}
		@include media-breakpoint-down(md){
			padding: 10px 24px;
			height:55px;
		}
	}
	
	.container{
		margin-top: 10vh;
		@include media-breakpoint-down(md){
			margin-top: 0vh;
		}
		.btn-group{
			margin: 50px 0 0 0;
			border-radius: 15px;
			height:36px;
			width: 100%;
		
			.btn-zad{
				background-color: transparent;
				border: 2px solid white;
				transition: all 0.25s;
				color: white;
				
				&.active{
					color:#6D0654;
					background-color: white;
				}
				&:first-child{
					border-top-left-radius: 18px;
					border-bottom-left-radius: 18px;
				}
				&:last-child{
					border-top-right-radius: 18px;
					border-bottom-right-radius: 18px;
				}
			}
		}
		
		form{
			margin-top: 30px;
			
			.form-row{
				margin-right: -15px;
				margin-left: -15px;
				
				.form-group{
					
					margin-bottom: 2rem;
					@include media-breakpoint-down(md){
						margin-bottom: 1rem;	
					}
					
					.form-control{
						color: #6D0654;
						font-size: 32px;
						padding: 3px 0 0 22px;
						height: 48px;
						border-radius: 24px;
						
						&.isDisabled {
						  cursor: not-allowed;
						  opacity: 0.5;
						  text-decoration: none;
						}
						@include media-breakpoint-down(md){
							font-size: 20px;
							padding: 3px 0 0 13px;
							height: 40px;
						}
					}
				}
				
				[class*=col]{
					padding-right: 15px;
					padding-left: 15px;
					&.lesspadding{
						@include media-breakpoint-down(md){
							padding-right: 0px;
						}
					}
					input{
						background: transparent;
						font-size: 40px;
						border: none;
						border-bottom: 2px solid white;
						margin-top: 50px;
						margin-right: 20px;
						color:white;
						
						&::placeholder{
							color:white;
							opacity: 0.2;
						}
					}
					.btn-zad{
						background-color: transparent;
						border: 2px solid white;
						transition: all 0.25s;
						color: white;
						border-radius: 18px;
						width: 100%;
						height: 48px;
						border-radius: 24px;
						font-size: 32px;
						padding:0;
						margin-top: 46px;
						
						&:hover{
							color:#6D0654;
							background-color: white;
						}
						&.isDisabled {
						  cursor: not-allowed;
						  opacity: 0.5;
						  text-decoration: none;
						}
						@include media-breakpoint-down(md){
							height: 40px;
							font-size: 20px;
							padding-top: 4px;
						}
					}	
				}
				.los{
					padding-top:0px;
				}
			}
			
			.invalid-feedback{
				color: white;
				margin-top: 10px;
			}
		}
	}
	
}

#primary{
	margin-top: 180px;
	
	@include media-breakpoint-down(lg){
		margin-top: 130px;
	}
	
	@include media-breakpoint-down(md){
		margin-top: 90px;
	}
	
	.site-main{
		padding: 0;
	}
}


.home{
	.carousel-control-prev, .carousel-control-next{
		display: none;	
	}
	
	#primary{
		margin-top: 90px;
		@include media-breakpoint-up(md){
			margin-top: 110px;
		}
	}
		
	#carouselStart{
		
		h2{
			line-height: 78px !important;
			font-size: 80px !important;
			@include media-breakpoint-down(md){
				line-height: 52px !important;
				font-size: 54px !important;
			}
			p{
				line-height: 78px !important;
				font-size: 80px !important;
				@include media-breakpoint-down(md){
					line-height: 52px !important;
					font-size: 54px !important;
				}
			}
		}
		h3{
			line-height: 78px !important;
			font-size: 60px !important;
			@include media-breakpoint-down(md){
				line-height: 38px !important;
				font-size: 32px !important;
			}
			p{
				line-height: 78px !important;
				font-size: 60px !important;
				@include media-breakpoint-down(md){
					line-height: 38px !important;
					font-size: 32px !important;
				}
			}
		}
		h4{
			font-size: 48px !important;
			font-family: 'fs_untitled-bold';
		}
	
		.carousel-inner{
			
			.img_wrapper{
				display:flex;
				justify-content: center;
				height:600px;
				@include media-breakpoint-down(md){
					height:400px;
				}
				z-index: 1;
				position: relative;
				img{
					width:100% !important;
					height:100% !important;
					max-width: 4000px !important;
					object-fit: cover;
				}
			}
			.svg_wrapper{
				display:flex;
				justify-content: center;
				background-color: white;
				height:600px;
				@include media-breakpoint-down(md){
					height:400px;
				}
				z-index: 1;
				position: relative;
				svg{
					width:100% !important;
					height:100% !important;
					max-width: 4000px !important;
					object-fit: cover;
				}
			}
			
			.teasers{
				color:white;
				position: relative;
				z-index:2;
				margin-top: -600px;
				height:600px;
				@include media-breakpoint-down(md){
					margin-top: -400px;
					height:400px;
				}
				
				display: flex;

				align-items: center;
				
				.row{
					display: flex;
					flex-direction: column;
					h2{
						margin-bottom: 20px;
					}
					
					.btn-zad{
						background-color: transparent;
						border: 2px solid white;
						transition: all 0.25s;
						color: white;
						border-radius: 18px;
						width: 150px;
						margin-top: 20px;
						height:36px;
						display: flex;
						justify-content: center;
						align-items: center;
						padding-top:3px;
						&:hover{
							color:#31AFD7;
							background-color: white;
						}
					}
				}	
			}
		}
	}
}

.home, .page-template-tarife_uebersicht, .page-template-tarife_privat, .page-template-tarife_geschaeft{
	
	.tarif_head_wrap{
		margin-top: 80px;
		margin-bottom: 20px;
		@include media-breakpoint-down(md){
			margin-top: 32px;
		}
		
		.tarif_head{
			color:#31AFD7;
			font-size: 60px;
			@include media-breakpoint-down(md){
				font-size: 30px;
			}
		}		
	}

	.tarife{
		// padding-right: 0px;
		// padding-left: 0px;
		@include media-breakpoint-down(md){
			padding-right: 15px;
			padding-left: 15px;
		}
		@include media-breakpoint-down(sm){
			padding-right: 30px;
			padding-left: 30px;
			font-size: 14px;
		}
		.tarif_row{
			padding-right: -30px;
			padding-left: -30px;
			
			.tarif_wrapper{
				padding-right: 15px;
				padding-left: 15px;
				padding-bottom: 30px;
				@include media-breakpoint-down(md){
					padding-bottom: 30px;
				}
				@include media-breakpoint-down(sm){
					padding-right: 7px;
					padding-left: 7px;
					padding-bottom: 15px;
				}
				.tarif{
					height:470px;
					@include media-breakpoint-down(sm){
						height:210px;
					}
					color:white;
					display: flex;
					flex-direction: column;
					padding:16px 20px 18px;
					@include media-breakpoint-down(sm){
						padding:6px 10px 0px;
					}
					transition: all 0.75s;
					
					h3, h4{
						font-size: 46px;
						@include media-breakpoint-down(sm){
							font-size: 24px;
							line-height: 30px;
						}
					}
					.stretcher{
						align-content:stretch;
						height:80%;
						@include media-breakpoint-down(sm){
							height:6%;
						}
						display: flex;
						flex-direction: column;
						margin-bottom: 120px;
						.cont{
							flex: 1;
							font-size: 36px;
							@include media-breakpoint-down(sm){
								font-size: 18px;
							}
							display: flex;
							flex-direction: row;
							align-items: flex-end;
							svg{
								margin-bottom: 6px;
								@include media-breakpoint-down(sm){
									width: 20px;
									margin-bottom: 0px;
								}
							}
							.text{
								margin-left: 20px;
								@include media-breakpoint-down(sm){
									margin-left: 10px;
								}
								.small{
									font-size: 20px;
									margin-left:5px;
										
									@include media-breakpoint-down(lg){
										font-size: 16px;
										width: 20px;
										display: inline-block;
										line-height: 16px;
									}
									@include media-breakpoint-down(sm){
										font-size: 10px;
										width: 20px;
										display: inline-block;
										line-height: 10px;
									}
								}
							}
							&.telefonleitung{
								svg{
									margin-bottom: 2px;
									@include media-breakpoint-down(sm){
										width: 18px;
										margin-bottom: -2px;
									}
								}
							}
							&.download{
								margin-bottom: 10px;
								.text{
									//font-size: 16px;
								}
							}
						}
						path { 
							 transition: stroke 0.75s; 
						}
						line { 
							 transition: stroke 0.75s; 
						}
						rect { 
							 transition: stroke 0.75s; 
						}
						svg g line {stroke:white;}
						svg g path {stroke:white;}
						svg g rect {stroke:white;}
					}
					
					.vcheck-Link{
						background: white;
						height:32px;
						@include media-breakpoint-down(sm){
							height:24px;
							padding-top:3px;
						}
						border-radius: 16px;	
						display: flex;
						justify-content: center;
						align-items: center;
						transition: all 0.75s;
						.desktop_text{
							display: block;
							@include media-breakpoint-down(sm){
								display: none;
							}
						}
						.mobile_text{
							display: none;
							@include media-breakpoint-down(sm){
								display: block;
							}
						}
					}
					
					&.blau{
						background-color: #31AFD7;
						border:4px solid #31AFD7;
						.vcheck-Link{
							color: #31AFD7;
						}
					}
					&.rot{
						background-color: #D0002A;	
						border:4px solid #D0002A;	
						.vcheck-Link{
							color: #D0002A;
						}
					}
					&.tuerkis{
						background-color: #00859B;
						border:4px solid #00859B;
						.vcheck-Link{
							color: #00859B;
						}
					}
					&.gelb{
						background-color: #FD9F00;
						border:4px solid #FD9F00;
						.vcheck-Link{
							color: #FD9F00;
						}
					}
					&.gruen{
						background-color: #99B815;
						border:4px solid #99B815;
						.vcheck-Link{
							color: #99B815;
						}
					}
					&.dunkelrot{
						background-color: #81001A;
						border:4px solid #81001A;
						.vcheck-Link{
							color: #81001A;
						}
					}
					&.dunkelblau{
						background-color: #002458;
						border:4px solid #002458;
						.vcheck-Link{
							color: #002458;
						}
						.aktion{
							color: white;
						}
					}
					&.dunkelrot{
						background-color: #81001A;
						border:4px solid #81001A;
						.vcheck-Link{
							color: #81001A;
						}
						.aktion{
							color: white;
						}
					}
					&.dunkelgelb{
						background-color: #CD8300;
						border:4px solid #CD8300;
						.vcheck-Link{
							color: #CD8300;
						}
						.aktion{
							color: white;
						}
					}
					&.dunkelgruen{
						background-color: #637711;
						border:4px solid #637711;
						.vcheck-Link{
							color: #637711;
						}
						.aktion{
							color: white;
						}
					}
					&.dunkelgruen{
						background-color: #637711;
						border:4px solid #637711;
						.vcheck-Link{
							color: #637711;
						}
						.aktion{
							color: white;
						}
					}

					&:hover{
						&.blau{
							background-color: white;
							color: #31AFD7;
							svg g line {stroke:#31AFD7;}
							svg g path {stroke:#31AFD7;}
							svg g rect {stroke:#31AFD7;}
							.vcheck-Link{
								color: white;
								background-color: #31AFD7;
							}
						}
						&.rot{
							background-color: white;
							color: #D0002A;		
							svg g line {stroke:#D0002A;}
							svg g path {stroke:#D0002A;}
							svg g rect {stroke:#D0002A;}						
							.vcheck-Link{
								color: white;
								background-color: #D0002A;
							}
						}
						&.tuerkis{
							background-color: white;
							color: #00859B;
							svg g line {stroke:#00859B;}
							svg g path {stroke:#00859B;}
							svg g rect {stroke:#00859B;}
							.vcheck-Link{
								color: white;
								background-color: #00859B;
							}
						}
						&.gelb{
							background-color: white;
							color: #FD9F00;
							svg g line {stroke:#FD9F00;}
							svg g path {stroke:#FD9F00;}
							svg g rect {stroke:#FD9F00;}
							.vcheck-Link{
								color: white;
								background-color: #FD9F00;
							}
						}
						&.gruen{
							background-color: white;
							color: #99B815;
							svg g line {stroke:#99B815;}
							svg g path {stroke:#99B815;}
							svg g rect {stroke:#99B815;}
							.vcheck-Link{
								color: white;
								background-color: #99B815;
							}
						}
						&.dunkelblau{
							background-color: white;
							color:#002458;
							svg g line {stroke:#002458;}
							svg g path {stroke:#002458;}
							svg g rect {stroke:#002458;}
							.vcheck-Link{
								color: white;
								background-color: #002458;
							}
							.aktion{
								color: white;
							}
						}
						&.dunkelrot{
							background-color: white;
							color:#81001A;
							svg g line {stroke:#81001A;}
							svg g path {stroke:#81001A;}
							svg g rect {stroke:#81001A;}
							.vcheck-Link{
								color: white;
								background-color: #81001A;
							}
							.aktion{
								color: white;
							}
						}
						&.dunkelgelb{
							background-color: white;
							color:#CD8300;
							svg g line {stroke:#CD8300;}
							svg g path {stroke:#CD8300;}
							svg g rect {stroke:#CD8300;}
							.vcheck-Link{
								color: white;
								background-color: #CD8300;
							}
							.aktion{
								color: white;
							}
						}
						&.dunkelgruen{
							background-color: white;
							color:#637711;
							svg g line {stroke:#637711;}
							svg g path {stroke:#637711;}
							svg g rect {stroke:#637711;}
							.vcheck-Link{
								color: white;
								background-color: #637711;
							}
							.aktion{
								color: white;
							}
						}
						
					}
				}
			}
			
			// Button für alle weiteren Tarife
			.tarif_more_button {
				
				// Mobile: In der Row als 4. Tarif
				@include media-breakpoint-down(lg) {
					padding-bottom: 49px;
				}
				@include media-breakpoint-down(md) {
					background-color: transparent;
					display: flex;
					flex-direction: column;
					justify-content: flex-end;
					align-items: flex-end;
					padding-bottom: 49px;
				}

				@include media-breakpoint-down(sm) {
					padding-bottom: 26px;
				}

				// Desktop lg: Unterhalb der Row, rechts ausgerichtet
				@include media-breakpoint-up(md) {
					width: 100%;
					margin-top: px;
					display: flex;
					justify-content: flex-end;
					padding-right: 15px;
					padding-bottom: 0px;
				}
				
				.tarif-more-link {
					background-color: #31AFD7;
					border-radius: 20px;
					color: white;
					border: 2px solid white;
					padding: 3px 10px 3px 10px;
					line-height: 23px;
					display: inline-block;
					transition: all 0.5s;
					font-size: 18px;
					
					&:hover {
						background-color: white;
						color: #31AFD7;
						border: 2px solid #31AFD7;
					}
				}
			}
		}
	}
	
	.news{
		margin-top: 100px;
		margin-bottom: 100px;
		padding: 30px 30px 0px 30px;
		@include media-breakpoint-down(md){
			padding: 15px 15px 0px 15px;
			margin-top: 30px;
			margin-bottom: 30px;
		}
		background-image: url('../pics/news_bg.jpg');
		background-size:cover;
		
		h2{
			color: white;
			@include media-breakpoint-down(md){
				padding: 10px 0 15px 0;
			}
		}
		h4{
			line-height:34px;
			margin-bottom: 10px;
			word-wrap: break-word;
		}
		
		div.wrapper{
			margin-bottom: 18px;
			@include media-breakpoint-down(md){
				margin-bottom: 15px;
			}
			&:first-child{
				@include media-breakpoint-down(md){
					margin-bottom: 5px;
				}
			}
			
			a{
				background: white;
				display: block;
				padding: 15px;
				min-height:280px;
				transition: all 0.5s;
				height: 100%;
				p{
					line-height: 21px !important;
				}
				.more-link{
					background-color: #31AFD7;
					border-radius: 20px;
					color:white;
					border: 2px solid #31AFD7;
					padding: 1px 10px 0;
					line-height: 23px;
					display: inline-block;
					margin-top: 10px;
					transition: all 0.5s;
				}
				&:hover{
					color:white;
					background: #31AFD7;
					.more-link{
						background-color: white;
						color:#31AFD7;
					}
				}
			}
		}
		.moreNews{
			text-align: right;
			a{
				color:#31AFD7;
				margin-bottom: 30px;
				
				background-color: white;
				border-radius: 20px;
				border: 2px solid white;
				padding: 1px 10px 0;
				line-height: 23px;
				display: inline-block;
				margin-top: 10px;
				transition: all 0.5s;
			}
			a:hover{
				color:white;
				background-color: #31AFD7;
				border: 2px solid #31AFD7;
			}
		}
	}
	
	h3{
		color: #31AFD7;
		font-size: 60px !important;	
		@include media-breakpoint-down(md){
			font-size: 30px !important;
		}
	}
	#sb_instagram #sbi_load{
		text-align: right;
	}
	#sb_instagram #sbi_load {
		margin-top: 5px;
	}
	#sb_instagram #sbi_load .sbi_load_btn, 
	#sb_instagram .sbi_follow_btn a{
		border-radius: 32px;
		font-size: 18px;
		padding: 3px 14px;
	}
	#sb_instagram svg:not(:root).svg-inline--fa{
		display: none;
	}
	
	
	.tb_hs_arrow_left__{
		border-radius: 30px;
		border: 1px solid #31AFD7;
		left:15px;
	}
	
	.tb_hs_arrow_right__{
		border-radius: 30px;
		border: 1px solid #31AFD7;
		right:15px;
	}
	
	.tb-arrow-left-alt:before, .tb-arrow-right-alt:before{
		color: #31AFD7;
	}
	.tb_app_wrapper .splide__slide{
		width: 33.3333% !important;
	}
	
	.tb_hs_content{
		height: 100% !important;
	}
	.tb_hs_author_wrapper{
		display: none !important;
	}
	.tb_hs_social_{
		display: none !important;
	}
	.emoji{
		display: none !important;
	}
	.tb_content_text {
		text-align: left !important;
		color:  #31AFD7;
		height:100%;
		font-size: 24px;
		line-height: 30px;
	}
	.tb_post_modal_post_report_media_btn__{
		display: none !important;
	}
	.tb_post_modal_close_btn, .tb_post_modal_nav, .tb_post_nav{
		font-size: 32px;
		color: #31AFD7
	}
}

.singular.page-template-tarife_geschaeft{
	.tarife {
		.tarif_row {
			.tarif_wrapper {
				// Mobile: Zweispaltig mit optimierten Abständen
				@include media-breakpoint-down(sm){
					flex: 0 0 50%;
					max-width: 50%;
					padding-right: 5px;
					padding-left: 5px;
					padding-bottom: 10px;
				}
				.tarif {
					@include media-breakpoint-down(md){
						height: 483px !important;
					}
					@include media-breakpoint-down(sm){
						height: auto !important;
						min-height: 320px;
						padding: 10px 12px 20px;
						font-size: 12px;
					}
					.stretcher {
						height: auto !important;
						margin-bottom: 50px;
						@include media-breakpoint-down(md){
							margin-top: 20px;
						}
						@include media-breakpoint-down(sm){
							margin-top: 8px;
							margin-bottom: 0px;
							padding-bottom: 15px;
						}
						.cont{
							font-size: 20px;
							@include media-breakpoint-down(md){
								align-items: center;
								margin-bottom: 10px !important;
							}
							@include media-breakpoint-down(sm){
								font-size: 12px;
								margin-bottom: 10px !important;
							}
							svg {
								@include media-breakpoint-down(sm){
									width: 14px;
									height: 14px;
								}
							}
							.text{
								font-size: 20px;
								@include media-breakpoint-down(md){	
									line-height: 20px;
								}
								@include media-breakpoint-down(sm){
									margin-left: 6px;
									line-height: 20px;
									font-size: 16px;
									.small{
										font-size: 11px;
										margin-left: 2px;
										width: 20px;
										display: inline-block;
										line-height: 10px;
									}
								}
							}
							.icon_wrapper{
								@include media-breakpoint-down(md){
									
								}
							}
						}
					}
					h3, h4 {
						@include media-breakpoint-down(sm){
							font-size: 28px;
							line-height: 30px;
							margin-bottom: 20px;
						}
					}
					.preis{
						@include media-breakpoint-down(md){
							font-size: 24px;
						}
						@include media-breakpoint-down(sm){
							font-size: 12px;
							margin-top: 4px;
							margin-bottom: 6px;
						}
					}
					.options{
						@include media-breakpoint-down(md){
							display: none;
						}
					}
					.vcheck-Link {
						@include media-breakpoint-down(sm){
							height: 28px;
							font-size: 12px;
							margin-top: auto;
							border-radius: 14px;
						}
					}
					&.businessdirect{
						h4{
							@include media-breakpoint-down(md){
								margin-bottom: 0px;
							}
						}
						.options{
							@include media-breakpoint-down(md){
								display: block;
								font-size: 15px;
								margin-top: 0px;
								line-height: 28px;
								height: 150px;
							}
						}
						.vcheck-Link{
							@include media-breakpoint-down(md){
								margin-bottom: 11px;
							}
						}
					}
				}
			}
		}
	}
}



/* 

.page-template-tarife_uebersicht{

	.tarif_head_wrap{
		margin-top: 80px;
		margin-bottom: 20px;
		@include media-breakpoint-down(md){
			margin-top: 32px;
		}
		
		.tarif_head{
			color:#31AFD7;
			font-size: 60px;
			@include media-breakpoint-down(md){
				font-size: 30px;
			}
		}		
	}
	
	.tarife{
		padding-right: 0px;
		padding-left: 0px;
		padding-bottom: 120px;
		@include media-breakpoint-down(md){
			padding-bottom: 0px;
		}
		
		.tarif_row{
			padding-right: -30px;
			padding-left: -30px;
			
			.tarif_wrapper{
				padding-right: 30px;
				padding-left: 30px;
				padding-bottom: 60px;
				@include media-breakpoint-down(md){
					padding-bottom: 15px;
				}
				.tarif{
					height:470px;
					color:white;
					display: flex;
					flex-direction: column;
					
					padding:16px 20px 18px;
					transition: all 0.75s;
					
					h3, h4{
						font-size: 48px;
					}
					.stretcher{
						align-content:stretch;
						height:80%;
						display: flex;
						flex-direction: column;
						margin-bottom: 120px;
						.cont{
							flex: 1;
							font-size: 36px;
							display: flex;
							flex-direction: row;
							align-items: flex-end;
							svg{
								margin-bottom: 6px;
							}
							.text{
								margin-left: 20px;
								.small{
									font-size: 20px;
									margin-left:5px;
								}
							}
							&.telefonleitung{
								svg{
									margin-bottom: 2px;
								}
							}
							
						}
						path { 
							 transition: stroke 0.75s; 
						}
						line { 
							 transition: stroke 0.75s; 
						}
						rect { 
							 transition: stroke 0.75s; 
						}
						svg g line {stroke:white;}
						svg g path {stroke:white;}
						svg g rect {stroke:white;}
					}
					
					.vcheck-Link{
						background: white;
						height:32px;
						border-radius: 16px;	
						display: flex;
						justify-content: center;
						align-items: center;
						transition: all 0.75s;
					}
					
					&.blau{
						background-color: #31AFD7;
						border:4px solid #31AFD7;
						.vcheck-Link{
							color: #31AFD7;
						}
					}
					&.rot{
						background-color: #D0002A;	
						border:4px solid #D0002A;	
						.vcheck-Link{
							color: #D0002A;
						}
					}
					&.tuerkis{
						background-color: #00859B;
						border:4px solid #00859B;
						.vcheck-Link{
							color: #00859B;
						}
					}
					&.gelb{
						background-color: #FD9F00;
						border:4px solid #FD9F00;
						.vcheck-Link{
							color: #FD9F00;
						}
					}
					&.gruen{
						background-color: #99B815;
						border:4px solid #99B815;
						.vcheck-Link{
							color: #99B815;
						}
					}
					&.dunkelrot{
						background-color: #81001A;
						border:4px solid #81001A;
						.vcheck-Link{
							color: #81001A;
						}
					}
					
					
					&:hover{
						&.blau{
							background-color: white;
							color: #31AFD7;
							svg g line {stroke:#31AFD7;}
							svg g path {stroke:#31AFD7;}
							svg g rect {stroke:#31AFD7;}
							.vcheck-Link{
								color: white;
								background-color: #31AFD7;
							}
						}
						&.rot{
							background-color: white;
							color: #D0002A;		
							svg g line {stroke:#D0002A;}
							svg g path {stroke:#D0002A;}
							svg g rect {stroke:#D0002A;}						
							.vcheck-Link{
								color: white;
								background-color: #D0002A;
							}
						}
						&.tuerkis{
							background-color: white;
							color: #00859B;
							svg g line {stroke:#00859B;}
							svg g path {stroke:#00859B;}
							svg g rect {stroke:#00859B;}
							.vcheck-Link{
								color: white;
								background-color: #00859B;
							}
						}
						&.gelb{
							background-color: white;
							color: #FD9F00;
							svg g line {stroke:#FD9F00;}
							svg g path {stroke:#FD9F00;}
							svg g rect {stroke:#FD9F00;}
							.vcheck-Link{
								color: white;
								background-color: #FD9F00;
							}
						}
						&.gruen{
							background-color: white;
							color: #99B815;
							svg g line {stroke:#99B815;}
							svg g path {stroke:#99B815;}
							svg g rect {stroke:#99B815;}
							.vcheck-Link{
								color: white;
								background-color: #99B815;
							}
						}
					}
				}
			}
		}
	}
}

*/



.page-template-tarife_privat, .page-template-tarife_geschaeft{
	
	.tarif_head_wrap{

		margin-bottom: 0px;
		
		.tarif_head{
			color:#31AFD7;
			font-size: 60px;	
			@include media-breakpoint-down(md){
				font-size: 30px;
				margin-bottom: 15px;
			}	
		}		
	}
	
	.tarife{
		// padding-right: 0px;
		// padding-left: 0px;
	
		.tarif_row{
			padding-right: -30px;
			padding-left: -30px;
			
			.tarif_wrapper{
				padding-right: 30px;
				padding-left: 30px;
				padding-bottom: 60px;
				@include media-breakpoint-down(md){
					//padding-bottom: 15px;
				}
				@include media-breakpoint-down(sm){
					flex: 0 0 50%;
					max-width: 50%;
					padding-right: 5px;
					padding-left: 5px;
					padding-bottom: 10px;
				}
				@include media-breakpoint-down(xs){
					padding-right: 7px;
					padding-left: 7px;
					padding-bottom: 30px;
				}
					.tarif{
						height:800px;
						@include media-breakpoint-down(md){
							height:565px;
						}
						@include media-breakpoint-down(sm){
							height: auto !important;
							min-height: 320px;
							padding: 10px 12px 20px;
							font-size: 12px;
						}
						color:white;
						display: flex;
						flex-direction: column;
						align-content:space-between;
						padding:16px 20px 18px;
						transition: all 0.75s;
						
						h3{
							font-size: 60px;
							flex: 1;
							@include media-breakpoint-down(sm){
								font-size: 18px;
								line-height: 22px;
								margin-bottom: 0px;
							}
						}
						
					
						h4{
							font-size: 46px;
							line-height: 54px;
							@include media-breakpoint-down(sm){
								font-size: 24px;
								line-height: 24px;
								margin-bottom: 20px;
							}
						}
						.stretcher{
							height: auto !important;
							margin: 30px 0 50px;
							@include media-breakpoint-down(md){
								margin: 20px 0 50px;
							}
							@include media-breakpoint-down(sm){
								margin: 8px 0 0px;
								padding-bottom: 15px;
							}
													
							.cont{
								flex: 1;
								font-size: 20px;
								display: flex;
								flex-direction: row;
								align-items: flex-end;
								margin-bottom: 20px;
								@include media-breakpoint-down(md){
									align-items: center;
									margin-bottom: 10px !important;
								}
								@include media-breakpoint-down(sm){
									font-size: 12px;
									margin-bottom: 10px !important;
								}
								
								.icon_wrapper{
									width: 30px;
									display: flex;
									justify-content: center;
								}
								svg{
									margin-bottom: 7px;
									@include media-breakpoint-down(sm){
										width: 14px;
										height: 14px;
									}
								}
								.text{
									margin-left: 20px;
									font-size: 20px;
									@include media-breakpoint-down(md){
										line-height: 20px;
									}
									@include media-breakpoint-down(sm){
										margin-left: 6px;
										line-height: 20px;
										font-size: 16px;
									}
								}
								&.email, &.telefonleitung{
									margin-bottom: 3px;	
								}
								&.laufzeit{
									svg{
										margin-bottom:4px;
									}
								}
								&.download{
									margin-bottom: 10px;
									.text{
										//font-size: 16px;
									}
								}
							}
							
							path { 
								transition: all 0.75s; 
							}
							line { 
								transition: all 0.75s; 
							}
							rect { 
								transition: all 0.75s; 
							}
							svg g line {stroke:white;}
							svg g path {stroke:white;}
							svg g rect {stroke:white;}
						}
						
						.vcheck-Link{
							background: white;
							height:32px;
							border-radius: 16px;	
							display: flex;
							justify-content: center;
							align-items: center;
							transition: all 0.75s;
							flex-basis: content;
						}
						
						&.blau{
							background-color: #31AFD7;
							border:4px solid #31AFD7;
							.vcheck-Link{
								color: #31AFD7;
							}
							.aktion{
								color: white;
							}
						}
						&.rot{
							background-color: #D0002A;	
							border:4px solid #D0002A;	
							.vcheck-Link{
								color: #D0002A;
							}
							.aktion{
								color: white;
							}
						}
						&.tuerkis{
							background-color: #00859B;
							border:4px solid #00859B;
							.vcheck-Link{
								color: #00859B;
							}
							.aktion{
								color: white;
							}
						}
						&.gelb{
							background-color: #FD9F00;
							border:4px solid #FD9F00;
							.vcheck-Link{
								color: #FD9F00;
							}
							.aktion{
								color: white;
							}
						}
						&.gruen{
							background-color: #99B815;
							border:4px solid #99B815;
							.vcheck-Link{
								color: #99B815;
							}
							.aktion{
								color: white;
							}
						}
						&.dunkelblau{
							background-color: #002458;
							border:4px solid #002458;
							.vcheck-Link{
								color: #002458;
							}
							.aktion{
								color: white;
							}
						}
						&.dunkelrot{
							background-color: #81001A;
							border:4px solid #81001A;
							.vcheck-Link{
								color: #81001A;
							}
							.aktion{
								color: white;
							}
						}
						&.dunkelgelb{
							background-color: #CD8300;
							border:4px solid #CD8300;
							.vcheck-Link{
								color: #CD8300;
							}
							.aktion{
								color: white;
							}
						}
						&.dunkelgruen{
							background-color: #637711;
							border:4px solid #637711;
							.vcheck-Link{
								color: #637711;
							}
							.aktion{
								color: white;
							}
						}

						&:hover{
							&.blau{
								background-color: white;
								color: #31AFD7;
								svg g line {stroke:#31AFD7;}
								svg g path {stroke:#31AFD7;}
								svg g rect {stroke:#31AFD7;}
								.vcheck-Link{
									color: white;
									background-color: #31AFD7;
								}
								.aktion{
									color: white;
								}
							}
							&.rot{
								background-color: white;
								color: #D0002A;		
								svg g line {stroke:#D0002A;}
								svg g path {stroke:#D0002A;}
								svg g rect {stroke:#D0002A;}						
								.vcheck-Link{
									color: white;
									background-color: #D0002A;
								}
								.aktion{
									color: white;
								}
							}
							&.tuerkis{
								background-color: white;
								color: #00859B;
								svg g line {stroke:#00859B;}
								svg g path {stroke:#00859B;}
								svg g rect {stroke:#00859B;}
								.vcheck-Link{
									color: white;
									background-color: #00859B;
								}
								.aktion{
									color: white;
								}
							}
							&.gelb{
								background-color: white;
								color: #FD9F00;
								svg g line {stroke:#FD9F00;}
								svg g path {stroke:#FD9F00;}
								svg g rect {stroke:#FD9F00;}
								.vcheck-Link{
									color: white;
									background-color: #FD9F00;
								}
								.aktion{
									color: white;
								}
							}
							&.gruen{
								background-color: white;
								color: #99B815;
								svg g line {stroke:#99B815;}
								svg g path {stroke:#99B815;}
								svg g rect {stroke:#99B815;}
								.vcheck-Link{
									color: white;
									background-color: #99B815;
								}
								.aktion{
									color: white;
								}
							}
							&.dunkelblau{
								background-color: white;
								color:#002458;
								svg g line {stroke:#002458;}
								svg g path {stroke:#002458;}
								svg g rect {stroke:#002458;}
								.vcheck-Link{
									color: white;
									background-color: #002458;
								}
								.aktion{
									color: white;
								}
							}
							&.dunkelrot{
								background-color: white;
								color:#81001A;
								svg g line {stroke:#81001A;}
								svg g path {stroke:#81001A;}
								svg g rect {stroke:#81001A;}
								.vcheck-Link{
									color: white;
									background-color: #81001A;
								}
								.aktion{
									color: white;
								}
							}
							&.dunkelgelb{
								background-color: white;
								color:#CD8300;
								svg g line {stroke:#CD8300;}
								svg g path {stroke:#CD8300;}
								svg g rect {stroke:#CD8300;}
								.vcheck-Link{
									color: white;
									background-color: #CD8300;
								}
								.aktion{
									color: white;
								}
							}
							&.dunkelgruen{
								background-color: white;
								color:#637711;
								svg g line {stroke:#637711;}
								svg g path {stroke:#637711;}
								svg g rect {stroke:#637711;}
								.vcheck-Link{
									color: white;
									background-color: #637711;
								}
								.aktion{
									color: white;
								}
							}
						}
						.aktion{
							background: #6D0654;
							height:168px;
							width: 168px;
							border-radius: 84px;
							position: absolute;
							display: flex;
							justify-content: center;
							align-items: center;
							text-align: center;
							flex-flow: column;
							font-size: 20px;
							line-height: 22px;
							top:542px;
							right:-7px;
							h5{
								font-size: 27px;	
								line-height: 42px;
							}
							@include media-breakpoint-down(md){
								height:150px;
								width: 150px;
								top: 447px;
								right: 21px;
							}
						}
					}
					
					.preis{
						flex:1;
						@include media-breakpoint-down(sm){
							margin-bottom: 20px;
						}
						.variation-prices{
							display: flex;
							align-items: flex-start;
							.woocommerce-Price-amount{
								font-size: 50px;
								@include media-breakpoint-down(sm){
									font-size: 28px;
								}
							}
							sup{
								font-size: 22px;
								margin-left: 5px;
								margin-top: -4px;
								@include media-breakpoint-down(sm){
									font-size: 11px;
									margin-left: 2px;
								}
							}
						}
					}
					.options{
						line-height: 28px;
						margin-bottom: 20px;
						@include media-breakpoint-down(md){
							display: none;
						}
					}
				}
			}
		}
		.preis_sterne{
			margin-top: 150px;
			margin-bottom: 10px;
			color:#31AFD7;
			@include media-breakpoint-down(md){
				margin-top: 20px;
			}
			a{
				text-decoration: underline;
			}
		}
}

.page-template-tarife_privat{
	.tarife{
		.tarif_row{
			.tarif_wrapper{
				@include media-breakpoint-down(sm){
					padding-bottom: 15px;
				}
				.preis{
					.variation-prices .woocommerce-Price-amount{
						@include media-breakpoint-down(md){
							font-size: 36px;
							line-height: 39px;
						}
						@include media-breakpoint-down(sm){
							font-size: 24px;
							line-height: 20px;
						}
					}
					
					@include media-breakpoint-down(sm){
						margin-bottom: 16px !important;
					}
				}
				.tarif{
					@include media-breakpoint-down(sm){
						padding: 8px 8px 7px;
						min-height: 340px !important;
					}
					h4{
						@include media-breakpoint-down(md){
							font-size: 36px;
							line-height: 39px;
						}
						@include media-breakpoint-down(sm){
							margin-bottom: 5px !important;
							font-size: 24px;
							line-height: 24px;
						}
					}
					.stretcher{
						.cont{
							@include media-breakpoint-down(sm){
								align-items: baseline;	
								margin-bottom: 5px !important;
							}
							.icon_wrapper{
								@include media-breakpoint-down(sm){
									width: 20px;
								}
							}
							
							.text{
								@include media-breakpoint-down(sm){
									font-size: 12px;
									line-height: 13px;
								}
								.small{
									@include media-breakpoint-down(lg){
										display:inline !important;
									}
									@include media-breakpoint-down(sm){
										display:inline-block !important;
									}
								}
							}
						}
						.email, .telefonleitung{
							.icon_wrapper{
								svg{
									@include media-breakpoint-down(sm){
										padding-top: 5px !important;
									}
								}
								
							}
						}
					}
				}
				.iptv{
					.text{
						@include media-breakpoint-down(sm){
							font-size: 12px;
							line-height: 18px;
						}
					}
				}
			}
		}
	}
}


.page-template-tarife_tv_uebersicht, .page-template-tarife_privat{
	.tv-intro{
		font-size: 24px !important;
		line-height: 32px !important;
	}
	.tarife{
		margin-top:70px;
		@include media-breakpoint-down(md){
			margin-bottom: 50px;
			margin-top:20px;
		}
		.tarif_row{
			.tarif_wrapper{
				.tarif{
					height:auto;
					.stretcher{
						height:auto;
						.opt{
							display: flex;
							flex-direction: row;
							margin: 15px 0;
							@include media-breakpoint-down(sm){
								margin: 3px 0;
							}
							.check{
								height: 25px;
								width: 25px;
								flex-shrink: 0; 
								@include media-breakpoint-down(sm){
									height: 10px;
									width: 10px;
									margin-top: 0px;
								}
							}
							.text{
								margin-left: 12px;
								font-family: 'fs_untitled-bold';
								@include media-breakpoint-down(sm){
									margin-left: 5px;
									line-height: 13px;
								}
								span{
									display: block;
									font-family: 'fs_untitled-regular';
								}
							}
						}
					}
				}	
				.preis{
					@include media-breakpoint-down(sm){
						margin-bottom: 0px !important;
					}
					.variation-prices{
						display: block;
						margin-top: 22px;
						margin-bottom: 22px;
						@include media-breakpoint-down(sm){
							margin-top: 0px;
							margin-bottom: 0px;
						}
						.woocommerce-Price-amount{
							line-height: 80px;
							@include media-breakpoint-down(sm){
								line-height: 20px !important;
							}
						}
						.im_Monat{
							display: block;
						}
					}
				}
			}
		}
	}
}


.singular.page-template-tarife_geschaeft{
	
	h3{
		font-size: 60px;
	}
	
	h4{
		font-size: 48px;
		line-height: 54px;
	}
	
	.tarife {
		.tarif_row {
			.tarif_wrapper {
				.tarif {
					font-size: 18px;
					height:720px;
					@include media-breakpoint-down(md){
						height:650px;
					}
					@include media-breakpoint-down(sm){
						min-height: 300px !important;
						padding: 10px 12px 10px;
					}
					h4{
						@include media-breakpoint-down(sm){
							font-size: 20px;
							line-height: 25px;
							margin-bottom: 0px;
						}
					}
					.stretcher{
						height:200px;
						@include media-breakpoint-down(md){
							height:164px;
						}
						@include media-breakpoint-down(sm){
							padding-bottom: 5px;
						}
						.cont{
							margin-bottom: 20px;
							@include media-breakpoint-down(sm){
								margin-bottom: 7px !important;
							}
							.text{
								margin-left: 20px;
								@include media-breakpoint-down(sm){
									margin-left: 10px;
								}
							}
						}
						.laufzeit{
							.icon_wrapper{
								svg{
									margin-bottom: 3px;
								}
							}
						}
					}

					.preis .variation-prices .woocommerce-Price-amount{
						@include media-breakpoint-down(sm){
							font-size: 20px;
						}
					}
					.aktion{
						top:450px;
						@include media-breakpoint-down(md){
							top:380px;	
						}
					}
					&.businessdirect{
						@include media-breakpoint-down(md){
							height:450px;
						}
						.stretcher, .optional, .preis{
							display: none;
						}
						.options{
							flex: 1;
							margin-top: -6px;
							padding-right: 7px;

							@include media-breakpoint-down(sm){
								line-height: 21px !important;
							}
						}
						.vcheck-Link{
							@include media-breakpoint-down(sm){
								margin-bottom: 0px !important;
							}
						}

					}
					.options{
						line-height: 33px;
					}

				}
			}
		}
	}
}

.single-product .woocommerce-Tabs-panel--additional_information p, .single-product .woocommerce-Tabs-panel--reviews p{
	font-family: 'fs_untitled-medium' !important;
	font-size: 23px !important;
}

.single-product_{
	font-size: 23px;
	font-family: 'fs_untitled-medium' !important;
	color: #31AFD7;
	 
	.summary{
		@include media-breakpoint-down(md){
			margin-bottom: 4rem;
		}
	}
	
	.preis_sterne{
		@include media-breakpoint-down(md){
			font-size: 16px;
			line-height: 19px;
		}
	}
	
	.qib-container{
		display: none !important;
	}
	.product{
		margin-bottom: 200px;
	} 
	
	.product_cat-business{
		margin-bottom: 100px;
		@include media-breakpoint-down(md){
			margin-bottom: 0px;
		}
	}
	
	.entry-summary{
		.price{
			display:none;
			@include media-breakpoint-down(md){
				font-size: 1.0em;	
			}
		}
		.tc-price-wrap{
			.price{
				display: inline-block;
				
			}
		}
		.tm-options-totals{
			.price{
				display: inline-block;
			}			
		}
	}
	.variations, .woocommerce-product-gallery, .woocommerce-breadcrumb{
		display: none;
	}
	
	.legal-price-info, .product_meta {
		display: none;
	}
	
	.quantity{
		display: none !important;
	}
	
	.single_variation_wrap{
		
		.tm-section-label{
			font-size: 18px;
			
			&::after{
				content: " hinzubuchen:";
			}
		}
	}
	
	.tc-totals-form{
		width: auto;
		align-self: flex-end;
		margin: 35px 12px 0 0;
	}
	
	.single_add_to_cart_button{
		width: 50%;
		@include media-breakpoint-down(md){
			width: 100%;
		}
		align-self: flex-end;
	}
	
	div.product{
		display: flex;
		@include media-breakpoint-down(md){
			flex-direction: column;
		}
		.variations_button{
			flex-wrap: nowrap !important;
			display: flex;
			flex-direction: column;
		}
		.woocommerce-variation-add-to-cart{
			
		}
	}
	
	.zad_info{
		order:1;
		flex:1;
		margin-right: 30px;
		
		.woocommerce-tabs{
			margin:2rem 0 0;
			
			.wc-tabs{
				display: none;
			}
			
			.woocommerce-Tabs-panel{
				h2{
					display: none;
				}
			}
			.woocommerce-product-attributes{
				border:none;
				.woocommerce-product-attributes-item{
					border: none;
					.woocommerce-product-attributes-item__label{
						display: none;
					}
					.woocommerce-product-attributes-item__value{
						border: none;
					}
				}
				
				.woocommerce-product-attributes-item__value {
					padding: 10px 10px;
					p{
						position: relative;
						margin-left: 53px;
						&::before{
							position: absolute;
							display: inline-block;
							width: 30px;
							left: -39px;
						}
					}
				}
				
				.woocommerce-product-attributes-item--attribute_download{
					.woocommerce-product-attributes-item__value p::before{
						content: url(../pics/donwload_klein_blau.svg); 
						top:-1px;
					}
					.woocommerce-product-attributes-item__value p::after{
						content: " Mbit/s" 
					}
				}
				
				.woocommerce-product-attributes-item--attribute_upload{
					.woocommerce-product-attributes-item__value p::before{
						content: url(../pics/upload_klein_blau.svg); 
						top:-1px;
					}
					.woocommerce-product-attributes-item__value p::after{
						content: " Mbit/s" 
					}
				}
				
				
				
				.woocommerce-product-attributes-item--attribute_email-adresse{
					.woocommerce-product-attributes-item__value{
						padding:12px 10px 0px 10px; 
						p::before{
							content: url(../pics/mail_klein_blau.svg); 
							top:0px;
						}
					}
				}
				
				.woocommerce-product-attributes-item--attribute_postfach{
					.woocommerce-product-attributes-item__value{
						padding:0px 10px 12px 10px; 
					}
				}
				
				.woocommerce-product-attributes-item--attribute_telefonleitung{
					.woocommerce-product-attributes-item__value{
						padding:12px 10px 0px 10px; 
						p::before{
							content: url(../pics/flatrate_klein_blau.svg); 
							left:-56px;
							top:-2px;
						}
					}
				}
				
				.woocommerce-product-attributes-item--attribute_telefonnummer{
					.woocommerce-product-attributes-item__value{
						padding:0px 10px 12px 10px; 
					}
				}
				
				.woocommerce-product-attributes-item--attribute_laufzeit{
					.woocommerce-product-attributes-item__value p::before{
						content: url(../pics/laufzeit_klein_blau.svg); 
						top:-5px;
					}
				}
				
				.woocommerce-product-attributes-item--attribute_fritzbox{
					.woocommerce-product-attributes-item__value p::before{
						content: url(../pics/fritzbox_klein_blau.svg); 
						top:-5px;
					}
				}
			}
		}
		.woocommerce-product-details__short-description{
			h4{
				font-size: 23px;
				margin-bottom: 10px;
			}
			font-size: 16px;
			margin: 10px 0 0 63px;
			
		}
	}
	
	.details_head{
		margin-top: 130px;
		@include media-breakpoint-down(md){
			margin-top: 30px;
		}
	}
	
	.summary {
		order:2;
		float: none !important;
		width: 55% !important;
		@include media-breakpoint-down(md){
			width: 100% !important;
		}
		.variations_form{
			height:100%;
			.single_variation_wrap{
				height:100%;
			}
		}
	}
	.tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-checkbox li.tmcp-field-wrap .tm-label{
		padding: 0 !important;
		margin-left: 9px !important;
		margin-top: 2px !important;
	}
	
	.single_variation_wrap, .product-type-simple{
		
		.woocommerce-variation-description{
			display: none;
		}
		
		div.tc-container{
			margin-top: 7px;
		}
			
		#liste-flats, #liste-mobile, #liste-anschluss{
			margin-top: -5px;
			ul{
				margin-left: 34px;
			}
			.tmcp-field-wrap{
				margin: 0 0 5px 0;
				.tc-label{
					font-size: 16px !important;
				}
				.price.tc-price{
					font-size: 16px !important;
				}
			}
			.tm-epo-field.tmcp-radio{
				width: 16px;
				height:16px;
				border: 2px solid #31AFD7;
				color:#31AFD7;
				-webkit-tap-highlight-color:#31AFD7;
				top:-2px;
				display: inline-block;
				&:after{
					background: #31AFD7;
				}
			}
			@supports (-webkit-appearance: none) or (-moz-appearance: none){
				.tc-active input[type=radio]:after {
					content: "";
					opacity: 1;
					display: block;
					left: 2px;
					top: 2px;
					position: absolute;
					width: 8px;
					height: 8px;
					border-radius: 50%;
					background: #31AFD7;
				}
			}
		}
		
		.tm-section-label{
			font-size: 23px !important;
			margin: 5px 0 8px 0;
			height:40px;
		}
		.tmcp-field-wrap{
			padding-left: 35px !important;

			.tc-label{
				font-size: 23px !important;
			}
			.tcmp-field{
				margin-left: -35px !important;
			}
			.tm-label{
				font-weight: normal !important;
				position: relative;	
				
/*	
				&::before{
					position: absolute;
					content: url(../pics/plus.svg); 
					left:-40px;
					top:-3px;
				}
*/
			}
			.tc-label-wrap{
				color:#85D3E5;
			}
			.amount{
				font-weight: normal !important;
				color:#85D3E5;
			}	
			&.tc-active{
				
				.amount{
					color:#31AFD7;
				}
				.tc-label-wrap{
					.tc-label{
						color:#31AFD7;
					}
				}
/*				.tm-label{
					&::before{
						content: url(../pics/minus.svg); 
						left:-40px;
						top:-7px;
					}
				}
*/
			}
		}
		
		.tm-extra-product-options-radio .tmcp-field-wrap{
			padding-left: 0px !important;	
		}
			
		.tm-element-ul-radio{		
			.tm-label{
				&::before{
					left:0px;
					top:0px;
				}
			}
				
			.tc-active{
				.tm-label{
					&::before{						
						left:0px;
						top:0px;
					}
				}
			}
		}
	}
	
	.product-type-simple{
		.cart{
			display: flex;
			margin-top: 36px;
			@include media-breakpoint-down(md){
				margin-top: 60px;
			}
			flex-wrap: nowrap !important;
			display: flex;
			flex-direction: column;
		}
		.tm-extra-product-options{
			width: 100%
		}
		
	}
	.tm-extra-product-options {
		.tmcp-field-wrap{
			
			.tmcp-ul-wrap{
				width:65%;
			}
			
			.tc-label.tm-label{
				opacity: 0.5;
				font-size: 23px;
			}
				
			.tm-epo-field.tmcp-checkbox{
				width: 22px;
				height:21px;
				border: 2px solid #31AFD7;
				color:#31AFD7;
				-webkit-tap-highlight-color:#31AFD7;
				border-radius: 4px;
				top:-3px;
				display: inline-block;
				margin-left: -33px !important;
				&:after{
					background: #31AFD7;
				}
			}
			
			@supports (-webkit-appearance: none) or (-moz-appearance: none){
				 input[type=checkbox]:after {
					content: "";
					opacity: 0;
					display: block;
					left: 3px;
					top: 3px;
					position: absolute;
					width: 12px;
					height: 11px;
					border: none; 
					border-top: 0;
					border-left: 0;
					transform: rotate(0);
					border-radius:2px;
				}
			}
			
			.price.tc-price, .after-amount{ 
				opacity: 0.5;
				.amount{
					margin: 0;
				}
			}
			.einmalig{
				font-size: 16px;
			}
			.klein{
				margin: 5px 0 0 36px;
			}
				
			&.tc-active{
				@supports (-webkit-appearance: none) or (-moz-appearance: none){
					 input[type=checkbox]:after {
						opacity: 1;
					}
				}
				.tc-label.tm-label{
					font-weight: normal;
					opacity: 1;
				}
				.price.tc-price, .after-amount, .klein{ 
					opacity: 1;
					.amount{
						font-weight: normal;
					}
				}
			}
			
			.tm-epo-field.tmcp-radio{
				width: 21px;
				height:21px;
				border: 2px solid #31AFD7;
				color:#31AFD7;
				-webkit-tap-highlight-color:#31AFD7;
				top:-3px;
				display: inline-block;
				&:after{
					background: #31AFD7;
				}
			}
			
			.after-amount{
				 font-size: 16px;
			}
		}
	}
	
	#sipaccount{
		.tc-price-wrap{
			
		}
	}
			
	.single_variation_wrap{
		.tm-extra-product-options-radio{
			.tc-label{
				font-size: 16px !important;
			}
			.tmcp-field-wrap .price.tc-price .amount{
				font-size: 16px !important;
			}
			.tmcp-field-wrap{
				display: flex;
				align-items: center;
				width: auto !important;
				margin:0 30px 0 0;
				.tc-label-wrap{
					
				}
			}
		}
	}
	.tm-options-totals{
		display: none;
	}
	dt.tm-final-totals{
		display: none;
	}
	dd.tm-final-totals{
		font-size: 48px;
		bdi::after{
			content:" / Monat";
			font-size: 23px;
		}
	}
	.single_add_to_cart_button{
		color: white;
		background: #31AFD7 !important;
		height:38px;
		border:2px solid #31AFD7;
		border-radius: 18px;
		display: flex !important;
		justify-content: center;
		align-items: center;
		font-size: 21px !important;
		transition: all 0.25s;
		padding: 0;
		font-family: 'fs_untitled-medium' !important;
		&:hover{
			background-color: white !important;
			color: #31AFD7;
		}
	}
	
	#sipaccount{
		.tc-price-wrap{
			display: block;
		}
	}
	.zusatz{
		display: none !important;
		text-align:right !important;
		margin: 0 13px 15px 0 !important;
		@include media-breakpoint-down(md){
			font-size: 16px;
			margin: 0 13px 5px 0 !important;
		}
		&.show{
			display: block  !important;
		}
		.kosten, .einrichtung{
			display: none;
			&.show{
				display: inline-block;
			}
		}
	}

	.mwst_{
		display: none !important;
		text-align:right !important;
		margin: 0 13px 40px 0 !important;
		font-size: 16px;
		&.private{
			display: block !important;
		}
	}
	
	.product_cat-business{
		.mwst_{
			&.business{
				display: block !important;
			}
			&.private{
				display: none !important;
			}
		}
	}
	
	#einmalig{
		display: none;
	}
	
	.tm-extra-product-options-fields{
		.tc-row:nth-child(2){
			display: none;
		}
	}
	
	.preis_sterne{
		display: none !important;
	}
	.preis_sterne.product_cat-business{
		margin-bottom: 10px;
		color:#31AFD7;
		display: block !important;
		a{
			text-decoration: underline;
		}
	}
	.tcwidth-100{
		font-size: 23px;
		margin-bottom: 10px;
	}
	
	.only_one-div{
		.tm-epo-field.tmcp-checkbox	{
			width: 21px !important;
			height: 21px !important;
			border-radius: 20px !important;
			&:after{
				border-radius: 20px !important;
				width: 11px !important;
				height: 11px !important;
			}
		}
	}
}

.tm-epo-totals{
	@include media-breakpoint-down(md){
		padding-bottom: 8px;
	}
}

.related.products {
	display: none;
}

#main{ 
	.woocommerce-error{
		color:red;
		background: transparent;
		padding-left:0px;
		font-size: 20px;
		a{
			color:red;
			text-decoration: underline;
			&:hover{
				color:black;
			}
		}
	}
	
	.woocommerce-checkout ul.woocommerce-error li {
		font-family: 'fs_untitled-medium' !important;
		padding:10px 0 10px 15px;
	}
}

.woocommerce .woocommerce-notices-wrapper>*{
	padding:10px 30px 8px 30px;
	font-family: 'fs_untitled-medium'!important;
}

.woocommerce-info, .woocommerce-message{
	border:2px solid #6D0654;
	border-radius:27px;
	background: white;
	font-family: 'fs_untitled-medium';
	font-size: 18px;
	color:#6D0654;
	a.button{
		background: white;
		color:#6D0654;
		&:hover{
			text-decoration: none !important;
			color:#31AFD7;
		}
	}
}

.woocommerce-checkout_{
	#main{
		.col-3{
			display: none;
		}
	}
	.col-lg-9{
		max-width: 100%;
		flex: 100%;
	}
	.form-row{
		margin-right: 0px;
		margin-left: 0px;
	}
	
	.woocommerce-billing-fields{
		@include media-breakpoint-down(md){
			margin-bottom: 50px;
		}
	}
	
	.checkbox-legal{
		.woocommerce-form__label-for-checkbox{
			display: flex !important;
			.input-checkbox{
				width: 93px;
				margin-right: 10px;
			}
		}
	}
	
	.woocommerce-message, .entry-header{
		display: none;
	}
	form{
		#order_review{
			width: auto;
			padding: 0;
			float: none;
			clear: none;
		}
		#order_review_heading{
			width: auto;
			padding:0;
			float: none;
			clear: none;
		}

		.woocommerce-additional-fields{
			display: none;
		}
		.wooccm-field-country{
			display: none;
		}
		.wc-gzd-product-name-left{
			display: none;
		}
	}
	form[name=checkout]{
		display: flex;
	}
	
	.woocommerce-billing-fields, .woocommerce-shipping-fields{
		
		h3{
			color: #31AFD7;
			margin: 0 0 20px 0;
		}
		
		.woocommerce-billing-fields__field-wrapper, .woocommerce-shipping-fields__field-wrapper{
			font-size: 20px;
			width: 85%;
			@include media-breakpoint-down(md){
				width: 100% ;
			}
			
			.woocommerce-radio-wrapper{
				display: flex;
				
				align-items: center;
				margin-bottom: 15px;
				
				label{
					margin-bottom: 0px;
					margin-right: 40px;
					color: #31AFD7;
					font-family: 'fs_untitled-medium';
					font-size: 20px;
				}
				input[type=radio]{
					border: 2px solid #31AFD7;
					color:#31AFD7;
					width: 21px;
					height:21px;
					
					&:after{
						background: #31AFD7;
					}
				}
			}
			.woocommerce-input-wrapper{
				width: 100%;
				
				.input-text{
					background: #C1EAF4;
					border: none;
					color: #31AFD7;
					margin: 0 0 10px 0;
					padding: 10px 10px 7px 12px; 
					
					&::placeholder{
						color:#31AFD7;
						opacity: 0.4;
					}
				}
			}
		}
	}
	.wc-gzd-product-name-right{
		.product-quantity{
			display: none;
		}
	}
	
	.woocommerce-checkout-review-order{
			
		#order_review_heading{
			color: #31AFD7;
			margin: 0 0 20px 0;
		}
		.shop_table{
			background: transparent;
			font-size: 20px;
			dd{
				padding-left:0px;;
			}
		}
	}
	.woocommerce-checkout-review-order-table{
		td{
			padding: 15px 0;
		}
		.woocommerce-shipping-totals.shipping{
			display: none;
		}
	}
	td.product-name a.tm-cart-edit-options, .tm-cart-edit-options{
		font-size:20px;
		font-weight: normal;
		font-style: normal;
	}

	.wc-gzd-order-submit{
		clear: both;
		float:right;
		width: 350px;
	}
	
	.product-quantity{
		font-family: 'fs_untitled-medium';
	}
	
	.product-total{
		text-align: right;
		vertical-align: top;
		line-height: 1.0 !important;
		.amount{
			.woocommerce-Price-currencySymbol{
				&:after{
					content:" / Monat";
					font-size: 23px;
				}
			}
		}
	}
	
	.cart-subtotal, .order-total{
		text-align: left;
		th{
			padding: 5px 5px 5px 0px;
		}
		td{
			text-align: right;
		}
	}
	
	.cart_item{
		display: grid;
		.product-name{
			padding: 15px 0 15px;
		}
	}
	
	#main{
		.woocommerce{
			padding: 0;
		}
	}

	dt.variation-zzgleinmaligerKostengesamt{
		margin-top: 20px;
		font-family: 'fs_untitled-medium' !important;
		font-size: 20px;
		float: left;

	}
	dd.variation-zzgleinmaligerKostengesamt{
		float: right;
		margin-top: 20px;
		font-size: 20px;

		p{
			font-family: 'fs_untitled-medium' !important;
			margin-left: 10px;
			&:after{
				content:" €";
			}
		}
	}
	.cart-subtotal, .order-total{
		display: none;
	}
	
	.container{
		.container{
			padding-right: 0px;
			padding-left: 0px;
		}
	}
	.woocommerce-gzd-legal-checkbox-text{
		color: #31AFD7;
		font-family: 'fs_untitled-regular';
		a{
			text-decoration: underline;
			font-family: 'fs_untitled-regular';
		}
	}
	
	.wc-gzd-product-name-right{
		font-size: 30px;
		font-family: 'fs_untitled-medium';
		color: #31AFD7;
		display: flex;
		flex-direction: column;
		.tc-epo-metadata{
			order:2;
		}
		.tm-cart-edit-options{
			order:3;
			text-decoration: underline;
			font-size: 23px !important;
			font-family: 'fs_untitled-medium' !important;
			margin-top: 20px;
		}
	}
	
	.tc-epo-metadata.variation{
		p{
			font-size: 23px !important;
			font-family: 'fs_untitled-medium' !important;
			margin: 10px 0;
		}
		.tc-name{
			display: none;
		}
	}
	
	.variation-zzgleinmaligerKostengesamt{
		display: none;
	}
	
	.checkbox-legal{
		margin-bottom: 30px;
	}
	
	.order-fixcosts{
		float: right;
		font-size: 23px !important;
		font-family: 'fs_untitled-medium' !important;
		color: #31AFD7;
	}
	
	.woocommerce-Price-amount{
		color: #31AFD7;
		bdi{
			font-size: 72px !important;
			@include media-breakpoint-down(md){
				font-size: 48px !important;
			}
		}
	}
	
	.order-tax{
		display: none;
	}
	.mwst_inkl, .mwst_exkl{
		display: none;
		color: #31AFD7;
		float: right;
		margin-top: 10px;
		font-size: 16px;
	}
	.woocommerce-table__product-total .mwst_inkl, .woocommerce-table__product-total .mwst_exkl{
		display: block;
		color: black;
		float: right;
		margin-top: 10px;
	}
	#ship-to-different-address label span::before{
		background: #31AFD7;
		border-color: #31AFD7;
	}
	#ship-to-different-address label input[type=checkbox]:checked+span::after{
		background: #31AFD7;
	}
	@supports (-webkit-appearance: none) or (-moz-appearance: none){
		input[type=checkbox]:after{
			border-color:#31AFD7;
		}
	}
}



.woocommerce form .form-row .required{
	visibility: hidden;
}

.woocommerce-form__input.woocommerce-form__input-checkbox.input-checkbox{
	border-color: #31AFD7;
	border-radius: 3px;
}

.woocommerce-order-received{
	
	.woocommerce-thankyou-order-received{
		font-size: 60px !important;
		line-height: 65px !important;
		margin-bottom: 20px;
		font-family: 'fs_untitled-medium' !important;
		@include media-breakpoint-down(md){
			font-size: 30px !important;
			line-height: 36px !important;
		}
	}
	
	.woocommerce-order-overview{
		padding-left: 0px;
		list-style:none;
	}
	
	.shop_table{
		background-color: #fff !important;
		border-top: 1px solid black;
		border-bottom: 1px solid black;
		
	}
	
	.woocommerce-order-overview__total{
		display: none;
	}
	
	woocommerce-table__product-name.product-name{
		font-size: 0px !important;
	}
	.woocommerce-table__product-table.product-total{
		padding-top: 28px;
		font-size: 0px;
	}
	
	.woocommerce-table__product-name{
		a{
			color:black;
		}
	}
	
	.woocommerce-Price-amount{
		bdi{
			font-family: 'fs_untitled-bold';
			color: black;
		}
	}
	
	.wc-item-meta{
		margin-bottom: 24px;
		padding-left:0px;
		li{
			font-family: 'fs_untitled-regular' !important;
			font-size: 20px;
		}
		li:last-child{
			margin-top: 20px;
			font-family: 'fs_untitled-bold';
			.wc-item-meta-label{
				display: block;
			}
			display:none;
		}
		:last-child:after{
			content:" €";
		}
		.wc-item-meta-label:after{
			content: "";
		}
		
	}
	.wc-item-meta-label{
		display: none;
	}
	
	.woocommerce-table--order-details{
		tfoot{
			display: none;
		}
	}
	
	.product-quantity{
		display: none;
	}
	
	.woocommerce-columns--addresses{
		display: flex;
		.woocommerce-column--billing-address{
			margin-right: 50px;
		}
	}
	.fixcostes{
		color: black;
		font-size: 23px;
		margin-top: 10px;
	}
	
	.woocommerce-table__product-name a{
		font-size:30px;
	}
	.woocommerce-order-received .woocommerce-order li, .woocommerce-order-received .woocommerce-order p{
		font-family: 'fs_untitled-regular' !important;
	}
}



table th, .wp-block-table th{
	font-family: 'fs_untitled-medium';
}


.post-thumbnail, .entry-content .wp-audio-shortcode, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce), *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce), .default-max-width{
	max-width: none;
	margin-left: 0px;
	margin-right: 0px;
}


.woocommerce-checkout-review-order-table dl.variation dd p, .woocommerce-checkout-review-order-table dl.variation dt p{
	font-family: 'fs_untitled-medium';
}


.woocommerce-cart_{
	.woocommerce-cart-form__contents{
		thead{
			display: none;
		}
	}
	td{
		border: none;
	}
	.actions{
		float: left;
		padding-left: 0px;
	}
	.woocommerce-cart-form__cart-item{
		display: flex;
		justify-content: space-between;
		border-bottom: 2px solid #31AFD7;
	    padding-bottom: 41px;

		
		td{
			border:none;
		}
		.product-thumbnail{
			display: none;
		}
		.product-quantity{
			order:1;
			padding:0;
			display: none;
			.qib-container{
				.qib-button{
					background-color: #31AFD7 !important;
					color:white !important;
					font-size: 26px !important;
					border: none !important;
					height:45px !important;
					&:hover{
						background-color: white !important;
						color:#31AFD7 !important;
					}
				}
				.minus{
					border: 2px solid #31AFD7 !important;
					&:hover{
						color: #31AFD7 !important;
					}
				}
				.plus{
					border: 2px solid #31AFD7 !important;
					&:hover{
						color: #31AFD7 !important;
					}
				}
				input{
					background-color: #31AFD7 !important;
					color:white !important;
					border: none !important;
					font-size: 32px !important;
					height:45px !important;
					width: 80px !important;
					padding-top:7px !important;
					margin:0 2px !important;
				}
			}
			
		}
		.product-name{
			color: #31AFD7;
			order:2;
			flex-grow: 1;
			font-size: 23px;
			line-height: 26px;
// 			padding-left: 40px;
			padding-top: 13px;
			
			a:first-child{
				font-size: 36px;
			}
			a.tm-cart-edit-options{
				font-style: normal;
				font-weight: normal;
			}
			dd{
				padding: 0;
			}
		}
		.product-price{
			display: none;
		}
		.product-subtotal{
			order:4;
			font-size: 72px;
			color: #31AFD7;
			line-height: 67px;
			padding-right: 65px;		
			.monat, .einmalig-preis{
				font-size: 23px;
			}
			.einmalig-preis{
				line-height: 42px;
				display: none;
				&.show{
					display: block;
				}
			}
			
		}
		.product-remove{
			order:5;
			width: 40px;
			
			:before {
			  display: block;
			  content: ' ';
			  background-image: url('../pics/trash.svg');
			  background-size: 28px 28px;
			  height: 28px;
			  width: 28px;
			}
			a.remove{
				font-size: 0px;
				width: 0px;
				height:0px;
				line-height: 0px;
			}
		}
		.tc-epo-metadata{
			.variation-zzgleinmaligerKostengesamt{
				display: none;
			}
		}
		
	}
	.return-to-shop{
		display: none;
	}
	.cart_totals{
		   width: 370px !important;
		   margin-right: 100px;
		h2{
			display: none;
		}
		.cart-subtotal{
			display: none;
		}
		.order-total{
			th{
				display: none;
			}
			.woocommerce-Price-amount{
				font-size: 72px;
				color: #31AFD7;
			}
		}
		.checkout-button{
			color: white;
			background: #31AFD7;
			height:38px;
			border:2px solid #31AFD7;
			border-radius: 18px;
			display: flex !important;
			justify-content: center;
			align-items: center;
			font-size: 21px !important;
			transition: all 0.25s;
			padding: 0;
			width: 70%;
			font-weight: normal;
			&:hover{
				background-color: white;
				color: #31AFD7;
				text-decoration: none !important;
			}
		}
	}
	.shop_table{
		tr:last-child{
			display: none;
		}
	}
	.tc-price-in-cart, .tc-quantity-in-cart, .klein, .einmalig{
		font-size: 18px;
	}
	.klein{
		&:before{
			content:"+ ";
		}
	}
	.tc-value.variation-{
		margin-top: 5px;
	}
}

.singular{
	.entry-title{
		font-size: 60px !important;
		@include media-breakpoint-down(md){
			font-size: 30px !important;
		}
		color: #31AFD7;
		margin: 2.5rem 0 0 !important;
	}
	.entry-header {
		border: none;
		padding-bottom: 0px;
		margin-bottom: 40px;
		@include media-breakpoint-down(md){
			margin-bottom: 0px;
		}
	}
	time{
		font-size: 14px;
	}
	
	h2{
		font-size: 60px;
		@include media-breakpoint-down(md){
			font-size: 30px;
		}
	}
	h3{
		font-size: 40px;
		@include media-breakpoint-down(md){
			font-size: 30px;
		}
	}
	h4{
		font-size: 30px;
		font-family: 'fs_untitled-medium';
	}
}

.no-widgets .site-footer{
	margin-top: 0px;
}
	
.site-footer{
	background-color: #31AFD7;
	color:white;
	max-width: none;
	width: 100%;
	.container{
		margin-top: 35px;
		margin-bottom: 150px;
		@include media-breakpoint-down(md){
			margin-bottom: 50px;
		}
	}
	a{
		color: white !important;
		&:hover{
			text-decoration: none !important;
		}
	}
	.footer-navigation{
		margin: 0;
	}
	.footer-navigation-wrapper{
		display: flex;
		li{
			line-height: 3;
			@include media-breakpoint-down(md){
				line-height: 2;
			}
		}
		li a{
			padding: 0;
		}
	}
	.footer_1, .footer_2{
		flex-direction: column;
	}
	.footer_3{
		
		flex-direction: row;
		@include media-breakpoint-down(md){
			margin-top: 20px;
		}
		justify-content: flex-start;
		
		li{
			margin-right: 25px;
			@include media-breakpoint-down(md){
				margin-right: 14px;
			}
		}
		.facebook{
			line-height: 1.5;
			a{
				font-size: 30px;
			}
		}
		.Twitter{
			line-height: 1.5;
			a{
				font-size: 30px;
			}
		}
		.Instagram{
			line-height: 1.5;
			a{
				font-size: 30px;
			}
		}
	}
}



.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers{
	border-top:0px;
	border-bottom: 1px solid black;
}

.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li, 
.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li{
	padding-bottom: 58px;
	padding-top:17px;
	@include media-breakpoint-down(md){
		padding-bottom: 40px;
		padding-top:0px;
	}
}

.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers:not(.is-grid) > li:last-child, 
.wp-block-latest-posts.is-style-twentytwentyone-latest-posts-dividers > li:last-child{
	padding-bottom: 58px;
	padding-top:17px;
	@include media-breakpoint-down(md){
		padding-bottom: 40px;
		padding-top:0px;
	}
}

.wp-block-latest-posts .wp-block-latest-posts__post-excerpt, 
.wp-block-latest-posts .wp-block-latest-posts__post-full-content{
	font-family: 'fs_untitled-regular';
	@include media-breakpoint-down(md){
		margin-top: 0px;
	}
}

.wp-block-latest-posts__list li{
	display: flex;
	flex-direction: column;
	time{
		order:1;
	}
	a{
		order:2;
		font-family:  'fs_untitled-medium';
	}
	.more-link{
		background-color: #31AFD7;
		border-radius: 20px;
		color:white;
		border: 2px solid #31AFD7;
		padding: 1px 10px 0;
		line-height: 23px;
		display: inline-block;
		&:hover{
			background-color: white;
			color:#31AFD7;
		}
	}
	div{
		order:3;
		
	}
}



.post-navigation{
	margin-top: 100px;
	margin-bottom: 160px;
	
	@include media-breakpoint-down(md){
		margin-top: 50px;
		margin-bottom: 50px;
	}
	
	.nav-links .nav-next a,
	.nav-links .nav-previous a{
		display: block;	
	}
	.nav-links .nav-next ,
	.nav-links .nav-previous {
		padding-right: 30px;
	}
	.post-title{
		margin: 0;
		color:#31AFD7 !important;
		font-size: 24px !important;
	}
	.mehr{
		background-color: #31AFD7;
		border-radius: 20px;
		color:white;
		border: 2px solid #31AFD7;
		padding: 2px 10px 1px;
		line-height: 23px;
		margin-top: 8px;
		display: inline-block;
	}
	a:hover{
		text-decoration: none;
		.mehr{
			background-color: white;
			color:#31AFD7;
		}
	}
}

.navigation .nav-links .nav-next{
	text-align: left;
}


.search-results, .search-no-results{
	h1{
		font-size: 60px;
	}
	.page-header{
		border: none;
		padding-bottom: 20px;
	}
	.search-result-count{
		margin-bottom: 50px;
	}
	article{
		border-top:1px solid black;
		width: 100%;
	}
	.entry-footer{
		display: none;
	}
	#primary{
		margin-bottom: 100px;
	}
	.more-link{
		background-color: #31AFD7;
		border-radius: 20px;
		color:white;
		border: 2px solid #31AFD7;
		padding: 1px 10px 0;
		line-height: 23px;
		display: inline-block;
		transition: all 0.5s;
		&:hover{
			background-color: white;
			color:#31AFD7;
		}
	}
	.search-form{
		
		margin: 40px 0 0 0;
		max-width: 400px;
		
		.search-field{
			width:200px;
			height: 36px;
			margin: 0;
			border-top-left-radius: 20px;
			border-bottom-left-radius: 20px;
			padding-left: 20px;
			padding-top: 14px;
		}
		
		.search-submit{
			width:100px;
			height:36px;
			font-size: 1.0rem;
			border-top-right-radius: 20px;
			border-bottom-right-radius: 20px;
			border-left: 0px;
			margin:0;
			color:#31AFD7;
			&:hover{
				color:white;
				background-color: #31AFD7;
				border: 2px solid #31AFD7;
				border-left: 0px;
			}
		}
	}
}

.wp-block-file{
	
	.wp-block-file__button{
		padding: 3px 18px 0px 18px !important;
		background: white !important;
		color:#31AFD7 !important;
		border:2px solid #31AFD7 !important;
		border-radius: 20px !important;
		margin: 15px 0 15px 10px !important;
		font-size: 18px !important;
		font-family: fs_untitled-medium !important;
		&:hover{
			background: #31AFD7 !important;
			color:white !important;
		}
	}
}

.sitemap-container{
	padding-bottom: 200px;
	line-height: 40px;
	font-size: 20px;
	padding-top: 34px;
	@include media-breakpoint-down(md){
		padding-top: 37px;
		padding-bottom: 50px;
	}
	
	h2{

			padding-bottom: 20px;

	}
	
	.sub-menu-toggle{
		display: none;
	}
	.fa-facebook, .fa-twitter, .fa-instagram{
		display: none;
	}
	ul ul{
		list-style: disc;
		padding-left: 50px;
	}
	ul{
		list-style-position: inside;
		padding-left: 0px;
		margin-bottom: 30px;
	}
	
	a{
		color:#31AFD7 !important;
	}
}

.wp-block-image{
	figcaption{
		text-align: left;
		line-height: 20px;
		font-size: 14px;
		em{
			font-style: normal;
		}
	}
}

em{
	font-weight: normal;
	font-style: italic;
	font-family: 'fs_untitled-regular';
	strong{
		font-style: normal;
		font-weight: normal;
		font-family: 'fs_untitled-bold';
	}
}

strong{
	font-style: normal;
	font-weight: normal;
	font-family: 'fs_untitled-bold';
	em{
		font-weight: normal;
		font-style: italic;
		font-family: 'fs_untitled-bold';
	}
}

.cookie-notice-container{
	padding: 20px 20px 15px 20px;
	#cn-notice-text{
		font-size: 20px;
		
		line-height: 20px;
	}
	.cn-button.bootstrap{
		background: transparent;
		border: 1px solid white;
		border-radius: 0px;
		padding: 5px 50px;		
		margin-top: -3px;
	}
}

.tc-tooltip{
	vertical-align: super;
	font-size: 15px;
	color:#31AFD7 !important;
	margin-left: 0px !important;
}
.tcfa-question-circle{
	&:before{
		content: "\f05a";
	}
	&:hover{
		cursor:auto !important;
	}
}

.tm-tip {
    text-align: left !important;
    background: none !important;
    border-radius: 0px !important;
    background-color: #31AFD7 !important;
    font-family: 'fs_untitled-regular' !important;
    text-shadow: none !important;
    font-size: 14px !important;
    &::after {
	  border-color: #31AFD7 transparent !important;
	}
}

.woocommerce{
	.content-area{
		  .site-main{
			  margin: 0;
		  }
	}
}

.woocommerce-product-details__short-description{
	.tooltipsall{
		font-family: 'fs_untitled-regular';
		&:after{
			content: "\f05a";
			font-family: 'tc-fontawesome' !important;
			font-weight: 900;
			font-size: 15px;
			margin-left: 8px;
		}
	}
}

.woocommerce-product-attributes{
	.tooltipsall{
		&:after{
			content: "\f05a";
			font-family: 'tc-fontawesome' !important;
			font-weight: 900;
			font-size: 14px;
			margin-left: 8px;
		}
	}
}

.details_head a{
	display: flex;
	align-items: center;
	margin-left: 16px;
	
	.details_plus{
		display: none;
		&.show{
			display: inline-block;
		}
	}
	.details_minus{
		display: none;
		&.show{
			display: inline-block;
		}
	}
	.produktdetails{
		margin: 3px 0 0 7px;
	}
}

.woocommerce-product-details__short-description{
	&.show{
		display: inline-block;
	}
}


.ui-datepicker {
	td{
		 span, a{
			 text-align: center;
			 padding: .3em .2em .2em .2em;
		 }
		 a{
			 transition: none;
		 }
	}
}

.ui-widget-header{
	border: none;
}

.ui-widget.ui-widget-content{
	border: 1px solid #31AFD7;
	padding: 19px 26px;
	width: 400px;
	margin-top: 12px;

	@include media-breakpoint-down(xs){
		width: calc(100vw - 30px);
	}
}

.ui-widget-content .ui-state-hover{
	border: 1px solid #31AFD7;
	color: white;
}

.woocommerce form .form-row label, 
.woocommerce-page form .form-row label{
	display: block;		
	@include media-breakpoint-down(md){
		font-family: "fs_untitled-regular" !important;
	}
	.optional{
		display: none;
	}
}

.heateorSssClear{
	display: none;
}

.heateor_sss_sharing_container{
	margin-top: 0px;
	margin-bottom: -15px;
	height: 28px;
}



table.wp-block-advgb-table, table.advgb-table-frontend{
	
	tr{
		padding: 0 !important;
		
		td{
			vertical-align: top;
			padding: 10px 0 10px 0 !important;
			font-family: 'fs_untitled-regular';
			&:first-child{
				padding: 10px 30px 10px 0 !important;
			}
		}
	}
}

.privacy-policy{
	td:first-child{
		width: 180px
	}
}

.c-accordion__content{
	padding-top: 30px;
}

.c-accordion__title:after{
	color: #31AFD7;
}

.c-accordion__title{
	outline: none;
}


@include media-breakpoint-down(md){
    tbody, thead { float: left; }
    thead { min-width: 120px }
    td,th { display: block }
}

.woocommerce-order-received .woocommerce-columns--addresses{
	@include media-breakpoint-down(md){
		flex-direction: column;
	}
}


.page-template-vertraege-kuendigen, .page-template-kuendigungsformular{
	.kontaktformular-container, .kuendigen-container{
		margin-bottom: 200px;
		.formular_head_wrap{
			margin-bottom: 0px;
			
			.formular_head{
				color:#31AFD7;
				font-size: 60px;	
				@include media-breakpoint-down(md){
					font-size: 30px;
					margin-bottom: 15px;
				}	
			}		
		}
	}
	.kuendigen-container{
		margin-bottom: 0px;
	}
}

.page-template-vertraege-kuendigen{
	h4{
		margin-bottom: 30px;	
	}
	.buttons-wrapper{
		@include media-breakpoint-down(md){
			flex-direction: column-reverse;
		}
		.buttons{
			display: flex;
			align-content: stretch;
			justify-content: space-between;
			margin:7px 0;
			
			a{
				border:1px solid #31AFD7;
				width: 100%;
				text-align: center;
				padding:30px;
				background-color: white;
				border-radius: 10px;
				font-size: 30px;
				font-family: 'fs_untitled-medium';
				line-height: 35px;
				transition: all 0.5s;
				&:hover{
					background-color: #31AFD7;
					color:white;
				}
				&.aktiv{
					background-color: #31AFD7;
					color:white;
				}
			}
		}
	}
	.reden-wrapper{
		&.hide{
			display: none;
		}
		.reden{
			border:1px solid #31AFD7;
			border-radius: 10px;
			display: flex;
			margin-top:20px;
			background-color: white;
			margin-bottom: 30px;
			@include media-breakpoint-down(md){
				flex-direction: column;
			}
			.rede{
				padding: 30px;
				width: 100%;
				.grau{
					color: #aaa;
				}
			}
		}
	}
	
}

.gform_wrapper.gravity-theme{
	
	.gform_validation_errors{
		h2{
			font-size: 15px;
		}
	}
	.gform_validation_errors{
		margin-bottom: 48px;
	}
	
	.gform_heading{
		display: none;	
	}
	.gform_body{
		
		.gfield{
			margin-bottom: 30px;
			
			input, select, textarea {
				background-color: #C1EAF4;
				border: 1px solid #C1EAF4;
				color: #31AFD7;
				font-size: 18px;
				line-height: 28px;
				margin: 0;
			}
			
			.ginput_container_fileupload{
				input{
					background-color: transparent;
					border: 0px solid #C1EAF4;
				}
				.gform_fileupload_rules{
					color:#aaa;
				}
			}
			
			.gfield_checkbox, .gfield_radio{
				div{
					margin-bottom: 5px;
					label{
						margin-bottom: -3px;
					}
				}
			}
			.validation_message{
				padding-top: 15px;
				padding-bottom: 10px;
				border: 1.5px solid #c02b0a;
				border-radius: 5px;
			}
			
			select{
				border-radius: 0px;
			}
			textarea{
				margin-top: 5px;
			}
			.gfield_label{
				font-weight: normal;
				font-size: 30px;
				color: #31AFD7;
				height:30px;
				@include media-breakpoint-down(md){
					font-size: 24px;
					line-height: 28px;
					height:auto
				}
			}
			.gfield_required_text{
				font-style: normal;
				font-size: 30px;
			}
			.gfield_required{
				font-size: 30px;
			}
			.ginput_complex{
				label{
					color: #31AFD7;
				}
			}
			&.Check-Datenschutz{
				label{
					font-size: 18px;
					margin: 2px 0 0 5px;
				}
			}
			@supports ( appearance: none ) or ( -moz-appearance: none ) or ( -webkit-appearance: none ) {
				input[type=checkbox]:after{
					left: 9px;
					top: 5px;
				}
				input[type=radio]:after{
					left: 6px;
					top: 6px;
				}
			}
		}
		#field_1_16, #field_1_8, #field_1_18, #field_1_9{
			margin-bottom: 0px;
		}
		#field_1_18, #field_1_10{
			margin-top: 30px;
		}
		#field_1_6{
			.gfield_description{
				padding-top: 0px;
			}
		}
		#field_1_13{
			input, label{
				@include media-breakpoint-down(md){
					float:left;
				}
			}
		}
	}
	.gform_footer{
		.gform_button{
			background: #31AFD7 !important;
			height: 38px;
			border: 2px solid #31AFD7;
			border-radius: 18px;
			display: flex !important;
			justify-content: center;
			align-items: center;
			font-size: 21px !important;
			transition: all 0.25s;
			padding: 0;
			font-family: 'fs_untitled-medium' !important;
			width: 50%;
			@include media-breakpoint-down(md){
				width: 100%;
				height: 42px;
			}
			&:hover{
				background-color: white !important;
				color: #31AFD7;
			}

		}
	}
}

.gform_confirmation_wrapper {
	table{
		border: 0px solid black;
		background-color: white;
		tbody{
			border: 0px solid black;
			tr{
				background-color: white;
				border: 0px solid black;
				td{
					border: 0px solid black;
					padding:0px;
					font{
						font-size: 18px !important;
						font-family: 'fs_untitled-medium' !important;
						strong{
							margin-top: 22px;
							display: block;
						}
						ul{
							padding-left: 0px;
							list-style-type: none;
						}
						.map-it-link{
							display: none;
						}
					}
					table{
						tr:nth-child(even){
							td:first-child{
								width: 0px;
								height:1px;
							}
							td:nth-child(2){
								@include media-breakpoint-up(md){
									margin-left:-6px;
								}
								display: block;
							}
						}
					}
				}
			}
		}
	}
}

#ui-datepicker-div{
	overflow: scroll;
	@include media-breakpoint-down(md){
		width: calc(100% - 40px);
		thead{
			display: table-header-group;
		}
		td, th{
			display: table-cell;
		}
	}
}

.oeffnungszeiten{
	td{
		padding:2px 0px 0px 0px;
		border: 0px;
	}
	.fst_td{
		padding-right: 10px;
	}
	@include media-breakpoint-down(lg){
		td,th { display: block }
	}
	@include media-breakpoint-down(md){
		td,th { display: table-cell }
	}
}

// FAQs ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––


#ewd-ufaq-jquery-ajax-search{
	.ewd-ufaq-field-label{
		display: none !important;
	}
	.search-field{
		margin: 0px !important;
		#ewd-ufaq-text-search{
			width: 400px;
			height: 36px;
			margin: 0;
			border-top-left-radius: 20px !important;
			border-bottom-left-radius: 20px !important;
			padding: 8px 30px 6px 22px !important;
		}
		.clear-field:hover{
			border-color: transparent !important;
		}
	}
	#ewd-ufaq-ajax-search-submit{
		width: 100px;
		height: 36px;
		font-size: 1rem;
		border-top-right-radius: 20px;
		border-bottom-right-radius: 20px;
		border-top-left-radius: 0px;
		border-bottom-left-radius: 0px;
		border-left: 0px;
		margin: 0;
		color: white;
		background: #31AFD7;
		border: 2px solid #31AFD7;
		margin-left:-10px;
		padding: 3px 0 0 0;
		&:hover{
			color: #31AFD7;
			background-color: white !important;
		}
	}
	
}

.ewd-ufaq-faqs{
	h3{
		font-size: 18px;
	}
}

.ewd-ufaq-faq-list{
	min-height: 1000px;
	p{
		margin: 14px 0;
	}
	.ewd-ufaq-post-active{
		.ewd-ufaq-faq-body{
			max-height: 500px;
		}
	}
	
	.ewd-ufaq-can-be-toggled{
		.ewd-ufaq-faq-body{
			transition: max-height 1.0s;

			overflow: hidden;
			padding:0 25px 0 42px;
			.ewd-ufaq-faq-post{
				padding-bottom:50px;
			}
		}
		.ewd-ufaq-hidden{
			display: block;
			max-height:0px;
			overflow: hidden;
			transition: max-height 1.0s;
			padding:0 25px 0 42px;
		}
	}
	
	.ewd-ufaq-post-margin-symbol{
		span{
			font-family: 'ewd-toggle-icon';
			font-size:18px !important;
			padding-top: 6px;
		}
	}
}
































// Neue Bestellstrecke ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––

.single-product {
	#content{
		.container{
			background-color:white;	
	
			.entry{
				.entry-summary{
					h3{
						font-size: 32px;
					}
					.product_title{
						float: left;
					}
					p.price{
						float: right;
						margin-top: 60px !important;
						margin-bottom: 0px;
						display: block;
						.woocommerce-Price-amount{
							bdi{
								font-size: 60px;
							}
							&:after{
								content: "monatlich";
								display: block;
								font-size: 22px !important;
								margin-top: 12px;
							}
						}
					}
					p.einmaliger-preis{
						float: right;
						margin-top: 60px !important;
						margin-bottom: 0px;
						display: block;
						.woocommerce-Price-amount{
							bdi{
								font-size: 60px;
							}
							&:after{
								content: "einmalig";
								display: block;
								font-size: 22px !important;
								margin-top: 12px;
							}
						}
					}
					.woocommerce-product-details__short-description{
						clear: both;
						width: 45%;
						p{
							font-size: 16px !important;
							color: #31AFD7;
						}
						p:first-child{
							font-size: 22px !important;
							font-family: "fs_untitled-medium" !important;
							color: black;
						}
					}
					
					.cart{
						
						.tc-extra-product-options{
							margin-bottom: 100px;
							width: 45%;
							@include media-breakpoint-down(md){
								width: 100% !important;
							}
						}
						.tc-totals-form{
							display: none;
						}
						.quantity{
							display: none;
						}
						.tm-element-description{
							margin-top:-18px;
						}
						.tm-extra-product-options {
							.tmcp-ul-wrap{
								width: 100%;
							}
						}
							
					}
				}
			}
		}
	}
}

.fussnoten_shop{
	font-size: 14px;
	color: #989898;
	font-family: "fs_untitled-regular";
	line-height: 19px;
	padding-bottom: 20px;
	ol{
		padding-left: 25px;
		li{
			margin-bottom: 13px;
		}
	}
}

.tm-floating-box.right{
	position: absolute;
	top:500px;
	right: calc(50% - 555px);
	width: 400px;
	max-width: 400px;
	border-radius: 30px;
	color:white;
	border:1px solid white;

	background-color: #31AFD7;
	
	
	.uebersicht{
		display: none;
		color: #31AFD7;
		border: 2px solid #31AFD7;
		padding: 0 0 0 20px;
		border-radius: 26px;
		display: flex;
		line-height: 40px;
		font-size:24px;
		cursor: pointer;
		
		
		&:hover{
			
		}
		div{
			margin-top:2px;
			margin-bottom:-2px;
		}
		span{
			background-image: url('../pics/arrow.svg');  
			background-size: 20px 20px;
			background-repeat: no-repeat;
			background-position: center;
			height: 40px;
			width: 40px;
			background-color:#31AFD7;
			display: block;
			border-radius: 26px;
			margin-left: 15px;
		}
		
	}
	#close_ueber, h5{
		display: block !important;
	}
	.tm-fb{
		display: grid;
		grid-template-columns: 1fr 1fr;
		font-size: 14px;
		.tm-fb-title{
			grid-column-start: 1;
			padding-right: 10px;
		}
		.tm-fb-value{
			grid-column-start: 2;
		}
		padding-top: 15px;
		padding-bottom: 15px;
		border-bottom: 2px solid white;
		margin-top: 10px;
		&.hide{
			display: none;
		}
	}
	
	.tm-custom-price-totals{
		display: grid !important;
		grid-template-columns: 1fr 1fr;
		dt{}
		dd{}
		&.hide{
			display: none !important;
		}
	}
	#close_ueber{
		position:absolute;
		right: 19px;
		color:white;
		background-image: url('../pics/close.svg');  
		background-size: 20px 20px;
		height: 20px;
		width: 20px;
		transition: transform 0.3s;
		&:hover{
			opacity: 0.5;
		}
		&.closed{
			transform: rotate(-45deg);
		}
	}
}

// Mobile Header Button for Floating Box
.mobile-product-costs-btn {
	display: none;
	position: absolute;
	left: 200px;
	top: 26px;
	background-color: white !important;
	color: #31AFD7 !important;
	border: 1px solid #31AFD7;
	padding: 5px 22px;
	border-radius: 20px;
	font-size: 14px;
	font-family: "fs_untitled-medium";
	cursor: pointer;
	align-items: center;
	gap: 8px;
	transition: all 0.3s ease;
	
	&:hover {
		background: #f0f0f0;
		transform: scale(1.05);
	}
	
	&.active {
		background-color: #31AFD7 !important;
		color: white !important;
		border-color: #31AFD7 !important;
	}
}

// Mobile Mode: Hide floating box by default, show as modal on demand
@media (max-width: 991px) {
	#checkout-floating-box.mobile-mode {
		display: none !important;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		max-width: 100%;
		height: 100%;
		z-index: 9999;
		background: transparent;
		border-radius: 0;
		overflow-y: auto;
		
		// Hide close button on mobile
		#close_ueber {
			display: none !important;
		}
		
		&.mobile-modal-open {
			display: block !important;
			
			> div[style] {
				background: #31AFD7;
				border-radius: 20px;
				padding: 1em;
				margin: 80px 0px 0 0px;
				width: 100%;
				height: calc(100vh - 80px); // Full height minus header
				overflow-y: auto;
				position: relative;
				animation: slideUpModal 0.3s ease-out;
				transform: translateY(0);
				z-index: 2;
			}
		}
		
		// Animation when closing
		&.mobile-modal-closing {
			> div[style] {
				animation: slideDownModal 0.3s ease-in;
			}
		}
	}
	
	.mobile-product-costs-btn {
		display: inline-flex !important;
	}
	
	// Prevent body scroll when modal is open
	body.floating-modal-open {
		overflow: hidden;
	}
}

// Keyframes for slide animations
@keyframes slideUpModal {
	from {
		transform: translateY(calc(100vh - 80px));
		opacity: 0;
	}
	to {
		transform: translateY(0);
		opacity: 1;
	}
}

@keyframes slideDownModal {
	from {
		transform: translateY(0);
		opacity: 1;
	}
	to {
		transform: translateY(calc(100vh - 80px));
		opacity: 0;
	}
}

.produkt_options_link{
	display: none;
}

.tm-floating-box{
	padding: 1em; // Desktop padding
	
	.tm-fb{
		max-height: 2000px;
	}
	
	// Mobile padding
	@media (max-width: 991px) {
		padding: 0.5em;
	}
}

.woocommerce-checkout #main .woocommerce{
	padding:0;
}

.woocommerce-checkout input{
	@include media-breakpoint-down(md){
		padding: 5px 10px;
	}
}
#thwmsc_wrapper{
	
	.thwmsc-buttons{
		text-align: left !important;
		display: flex;
		justify-content: space-between;
		margin: 50px 0px 70px;
		
		@media (max-width: 991px) {
			flex-direction: column;
			gap: 15px;
			margin: 30px 0px 40px;
			@include media-breakpoint-down(md){
				flex-direction: row;
				margin: 50px 0px 40px;
			}
		}
		
		.thwmsc-btn{
			padding:6px 20px 2px;
			font-family: "fs_untitled-medium";
			font-size:20px;
			border-radius: 20px !important; 
			width: 400px;
			text-transform: capitalize;
			margin: 0px;
			
			@media (max-width: 991px) {
				width: 100%;
			}
			@include media-breakpoint-down(md){
				width: 50%;
			}
		}
		#action-prev{
			
		}
		
		.next-last{
			display: none !important;
		}
	}	
	
	#thwmsc-tabs{
		display: flex;
		justify-content: space-between;
		
		&:before {
			content: '';
			position: absolute;
			left: 70px;
			width: calc(100% - 145px);
			top: 33%;
			height: 1px; 
			background-color: #bed9df; 
			transform: translateY(-50%);
		}
		&:after{
			content: none;
		}
		
		// Mobile: Vertical layout
		@media (max-width: 991px) {
			flex-direction: column;
			gap: 0;
			
			&:before {
				// Vertical line instead of horizontal
				left: 30px;
				top: 40px;
				width: 1px;
				height: calc(100% - 100px);
				transform: none;
			}
		}
		
		li.thwmsc-tab{
			@media (max-width: 991px) {
				width: 100%;
				margin-bottom: 0px;
				
				&:last-child {
					margin-bottom: 0;
				}
			}
			
			a{
				margin: 0;
				
				@media (max-width: 991px) {
					display: flex;
					flex-direction: row;
					align-items: center;
					gap: 20px;
				}
				
				&.active{
					.thwmsc-index{
						color:#ffffff !important;
						//background-color: #31AFD7 !important; 
						color:#31AFD7 !important;
						width: 60px;
						height: 60px;
						padding: 20px;
						margin-top: 0px;
						margin-bottom: 5px;
						
						@media (max-width: 991px) {
							margin-bottom: 0;
						}
					}
					color: #31AFD7 !important; 
				}
				.thwmsc-index{
					border:none;
					color:#31AFD7 !important;
					@include media-breakpoint-down(md){
						color:black !important;
						font-size: 32px !important;
					}
					font-size: 28px;
					width: 40px;
					height: 40px;
					padding: 10px;
					margin-top: 12px;
					margin-bottom: 13px;
					
					@media (max-width: 991px) {
						margin-top: 0;
						margin-bottom: 0;
						flex-shrink: 0;
					}
				}
				.thwmsc-tab-label{
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;
					text-transform: uppercase;
					
					@include media-breakpoint-down(md){
						text-transform: none !important;
						font-size: 32px !important;
					}

					@media (max-width: 991px) {
						align-items: flex-start;
						text-align: left;
						font-size: 16px;
						flex-direction: row;
					}
					
					&:first-child{
						padding-left: 0px !important;
					}
					&:last-child{
						padding-right: 0px !important;
					}
				}
			}
		}
		.thwmsc-index{}
		
	
	}
	
	// Mobile: Duplicate wizard styling
	#thwmsc-tabs-bottom {
		// Hide on desktop
		@media (min-width: 992px) {
			display: none !important;
		}
		
		// Mobile styling - same as top wizard
		@media (max-width: 991px) {
			margin-bottom: 30px;
			margin-top: -20px; // Negative margin to bring closer to content
		}
		@include media-breakpoint-down(md){
			margin-top: 30px;

			.thwmsc-tab-icon{
				border:none !important;
				font-size: 32px !important;
			}
			span.thwmsc-tab-label{
				padding-left: 0px !important;
				font-size: 32px !important;
			}
		}
		 li{
			line-height: 33px;
			margin-bottom: 0px;
		}

	}
	
	.thwmsc-tabs-mobile-top {
		// On mobile, add margin bottom for spacing
		@media (max-width: 991px) {
			margin-bottom: 0px;
		}
		@include media-breakpoint-down(md){
			margin-top: 10px;
		}
	}
	
	.thwmsc-tab-panel-wrapper, .order_sumarize{
		@include media-breakpoint-down(md){
			width: 100% !important;
			max-width: 100% !important;
			overflow-x: hidden;
		}
		
		.thwmsc-tab-panel{
			padding: 0px;
			@include media-breakpoint-down(md){
				width: 100% !important;
				max-width: 100% !important;
				box-sizing: border-box;
			}
		}
		
		@include media-breakpoint-down(md){
			.thwmsc-tab-panel.order_review,
			#thwmsc-tab-panel-4,
			#thwmsc-tab-content-4,
			#order_review,
			.woocommerce-checkout-review-order,
			.shop_table.woocommerce-checkout-review-order-table{
				width: 100% !important;
				max-width: 100% !important;
				box-sizing: border-box;
			}
		}
		
		.review-line{
			height: 2px;
			border: none;
			margin-bottom: 10px;
			color: #000000;
			background-color: #000000;
		}
		
		.one-line{
			display: flex;
			justify-content: flex-start;
			
			@include media-breakpoint-down(md){
				flex-direction: column;
				margin-bottom: 10px;
			}
			&.header{
				.two{
					margin-top: 60px;
				}
			}
			
			&.fst{
				padding-left:20px;
				@include media-breakpoint-down(md){
					padding-left: 0;
				}
			}
			
			&.snd{
				padding-left:40px;
				@include media-breakpoint-down(md){
					padding-left: 0;
				}
				.head{
					display: list-item;
					list-style-type: disc;
				}
			}
			
			.head{
				flex-grow: 5;
				@include media-breakpoint-down(md){
					min-width: 0;
					max-width: 100%;
				}
				span{
					display: inline-block;
				}
			}
			
			.head_short{
				flex-basis: 300px;
				@include media-breakpoint-down(md){
					flex-basis: 100%;
					color:gray !important;
				}
			}
			
			.tail{
				flex-shrink: 20000;
			}
			
			.one{
				width: 300px;
				text-align: left;
				font-family: "fs_untitled-medium";
				font-size: 18px;
			}
			.two{
				width: 150px;
				text-align: left;
				font-family: "fs_untitled-medium";
				font-size: 18px;
				@include media-breakpoint-down(md){
					width: auto;
					font-size: 12px;
				}
			}
		}
		
		.order_review{
			.product-short-description{
				width: 600px;
				@include media-breakpoint-down(md){
					width: auto !important;
					max-width: 100% !important;
				}
			}
		}
	}
}

.thwmsc-arrows {
	ul.thwmsc-tabs{
		li{
			a{
				background: none !important;
				&:before{
					content: none !important;
				}
				&:after{
					content: none !important;
					border-width:0 !important;
				}	
			}		
		} 
	} 
}

.thwmscp-new-layout-styles{
	&.thwmsc-closed-arrow-layout{
		li.thwmsc-tab{
			&:before{
				border:0px !important;
				content: none !important;
			}	
		}
	}
	&.thwmscp-harrow{
		li.thwmsc-tab{
			&:before{
				border:0px !important;
				content: none !important;
			}	
		}
	}
}

.thwmscp-new-layout-styles.thwmscp-harrow.thwmsc-arrows ul.thwmsc-tabs li:first-child a:before, .thwmscp-new-layout-styles.thwmscp-harrow li.thwmsc-tab:after, .thwmscp-new-layout-styles.thwmsc-closed-arrow-layout li.thwmsc-tab:after{
	content: none !important;
	border-width:0 !important;
}

.woocommerce{
	#content{
		div.product{
			
			div.summary{
				float: none;
				width: 100%;
			}
		}
	}
}


#thwmsc-tab-content-3{
	display: flex;
	flex-direction: column;
	
	.shop_table.woocommerce-checkout-review-order-table{
		order: 1;
	}
	.wc-gzd-checkbox-placeholder-legal{
		order: 2;
	}
	.wc-gzd-order-submit{
		order: 3;
	}
}



.woocommerce-checkout .shop_table{
	background: none;
	
	.woocommerce-placeholder{
		display: none;
	}
}


.page-template-page-custom-cart{
	h4 {margin-top: 50px;}
	@include media-breakpoint-down(md){
		h4 {
			margin-top: 40px;
			margin-bottom: 0px;
			font-size: 24px !important;
			
		}
	}
}



.tm-extra-product-options-fields{
	#router-optionen, #router-optionen_eigen, #tele_options_flats, #tele_options_eintrag{
		.tc-epo-label{
			display: none;
		}
	}
	
}

.mapsvg-data-form-view{
	display: none !important;
}

.woocommerce-notices-wrapper{
	display: none;
}

.single-product .single_add_to_cart_button{
	color: #31afd7 !important
	;background-color:#ffffff !important;
	border-width:2px !important;
	border-color:#31afd7 !important;
	border-style:solid !important;
	border-radius:10px !important;
}

.woocommerce-breadcrumb{
	display:none;
}

.legal-price-info{
	display: none;
}




.single-product{
	.product_step1, .product_step2, .product_step3, .product_step4{
		
		&.hide{
			display: none;
		}
		
		text-align: left !important;
		display: flex;
		justify-content: space-between;
		margin: 50px 0px 70px;
		
		button{
			padding:6px 20px 2px !important;
			font-family: "fs_untitled-medium";
			font-size: 20px;
			color: #31afd7 !important
			;background-color:#ffffff !important;
			border-width:2px !important;
			border-color:#31afd7 !important;
			border-style:solid !important;
			border-radius: 20px !important; 
			width: 400px;
			line-height: 30px !important;
			&:hover{
				color: #ffffff !important;
				background-color:#31afd7 !important;
			}
		}
	}
	.product_step1{
		text-align: right !important;
		justify-content: flex-end;
	}
}


#thwmsc_wrapper{
	.woocommerce-additional-fields	{display:none;}
}

.tm-extra-product-options .tm-epo-field.tmcp-checkbox, .tm-extra-product-options .tm-epo-field.tmcp-radio {
	width: 25px;
}

.tm-extra-product-options .tc-epo-label{
	margin-top: 50px;
}

.product_title, .product-2-title {display:none;}

.tm-range-picker {display:none;}

#mengenauswahl .tc-epo-label, #einheitauswahl .tc-epo-label {margin-top:0px;}

#einmalig {display:none !important;}

.after-amount {margin-left: 20px;}

.thwmsc-tab-panel {
	background:transparent !important;
	
	
	#ihr_anschluss_field{
		.woocommerce-input-wrapper{
			width:100%;
			.woocommerce-radio-wrapper{
				display: flex;
				justify-content:space-between;
				label{
					margin-right:-10px;
					flex:3;
					font-size: 40px;
				}
			}
		}
	}
	#text_neuanschlus_field, #text_anbieterwechsel_field{
		float: left;
		width: calc(50% - 25px);
		margin-left:30px;
	}
	#text_anbieterwechsel_field{
		padding-left: 5px;
	}
	#vermieter_vorname_field, #vermieter_nachname_field, #vermieter_neubau_field{
		 float:left;
		 clear: none;
		// display: none;
		// margin-right: 20px;
		width: calc(50% - 10px);
	}
}

.tm-extra-product-options .tc-element-container, .tm-extra-product-options .tmcp-ul-wrap{
	width: auto;
}






.terms{
	margin-top:50px;
	width: 600px;
}

.woocommerce-checkout{
	
	width: 100%;
	
	h4{
		margin-bottom: 15px;
	}
	
	::placeholder {
	  color:#31AFD7;
	  opacity: .5;
	}
	
	::-webkit-input-placeholder { 
	  color:#31AFD7;
	  opacity: .5;
	}
	
	::-moz-placeholder { 
	  color:#31AFD7;
	  opacity: .5; 
	}
	
	:-ms-input-placeholder {
	  color:#31AFD7;
	  opacity: .5;
	}
	
	select{
		border-top-left-radius: 0px;
		border-top-right-radius: 0px;
		border-bottom-right-radius: 0px;
		border-bottom-left-radius: 0px;
		border: 2px solid #31AFD7;
		color: #31AFD7;
		background: var(--global--color-white) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%2331AFD7'><polygon points='0,0 10,0 5,5'/></svg>") no-repeat;
		background-position: right var(--form--spacing-unit) top 60%;
	}
	
	.form-row{
		margin-right:0px;
		margin-left:0px;
	}
	
	input{
		border: 2px solid #31AFD7 !important;
		&:checked{
			border: 4px solid #31AFD7 !important;
		}
		&:after{
			background: #31AFD7;
		}
	}

	
	
	#thwmsc-tab-content-0{
		width: 50%;
		
		.entry-title{

			@include media-breakpoint-down(md){
				font-size: 40px !important;
				margin: 0 !important;
				display: none;
			}
		}

		#ihr_anschluss_field{
			input, label{
				float: left;
			}
			input{padding: 5px;}
			label{
				display: block;
				margin-top: -24px;
				margin-left: 30px;
				line-height: 1.6rem;
				span{
					color: #31AFD7;
					font-size: 22px;
					@include media-breakpoint-down(md){
						font-size: 18px;
					}
				}
			}
		}	
		
		#lagewohnung_field{
			span{
				width: 100%;
			}
		}
		
		#vormieter_field, #anbieter_portierung_radio_field{
			span{
				width: 100%;
				input{
					float:left;
					display: block;
					@include media-breakpoint-down(md){
						padding: 5px;
					}
				}
				label{
					display: block !important;
					margin-left: 30px;
					
					color: #31AFD7;
					font-size: 22px;
					@include media-breakpoint-down(md){
						font-size: 18px;
					}
				}
			}
		}
		
		#vermieter_vorname_field, #vermieter_nachname_field{
			float:left;
			clear: none;
			width: calc(50% - 10px);
			span{
				width: 100%;
			}
			@include media-breakpoint-down(md){
				width: 100% !important;
			}
		}
		
		#vermieter_nachname_field{
			@include media-breakpoint-down(md){
				margin-top: 20px !important;
			}
		}

		#vermieter_vorname_field{
			margin-right: 20px;
		}
		
		#vermieter_neubau_field{
			width: 100%;
			span{
				width: 100%;
			}
		}
		
		#anbieter_anrede_field, #anbieter_vorname_field, #anbieter_nachname_field{
			float:left;
			clear: none;
			span{
				width: 100%;
			}
		}
		
		#anbieter_anrede_field{
			width: 100px;
			margin-right: 20px;
			@include media-breakpoint-down(md){
				width: 80px !important;
			}
		}
		
		#anbieter_vorname_field{
			margin-right: 20px;
		}
		
		#anbieter_vorname_field, #anbieter_nachname_field{
			width: calc(50% - 70px);
			span{
				width: 100%;
			}
			@include media-breakpoint-down(md){
				width: 100% !important;
				margin-top: 20px !important;
			}
		}
		
		#anbieter_strasse_field{
			width: 100%;
			margin-top: 20px;
			float: left;
			span{
				width: 100%;
			}
		}
		
		#anbieter_plz_field, #anbieter_ort_field{
			float:left;
			clear: none;
			margin-top: 20px;
			span{
				width: 100%;
			}
		}
		
		#anbieter_plz_field{
			width: 160px;
			margin-right: 20px;
			@include media-breakpoint-down(md){
				width: 80px !important;
			}
		}
		
		#anbieter_ort_field{
			width: calc(100% - 180px);
			@include media-breakpoint-down(md){
				width: calc(100% - 100px) !important;
			}
		}
		
		#anbieter_netzbetreiber_heading_field{
			clear: both;
		}
		
		#anbieter_netzbetreiber_field{
			span{
				width: 100%;
			}
		}
		
		#anbieter_keine_field{
			float:left;
			clear: none;
			width: 135px;
			label{
				display: flex;
				align-items: center;
				input{
					width:54px;
					height:54px;
					margin-right: 10px;
					&:after{
						background:none;
						left: 14px;
						top: 5px;
						width: 17px;
						height: 29px;
						border-bottom: 4px solid #31AFD7;
						border-right: 4px solid #31AFD7;
					}
				}
			}
		}
		
		#anbieter_mindestvertragslaufzeit_field{
			float:left;
			clear: none;
			width: calc(100% - 135px);
			span{
				width: 100%;
			}
		}
		
		#anbieter_portierung_field{
			clear: both;
		}

		#anbieter_vorwahl1_field, #anbieter_rufnummer1_field, #anbieter_vorwahl2_field, #anbieter_rufnummer2_field{
			float:left;
			clear: none;
			span{
				width: 100%;
			}
		}
		#anbieter_vorwahl2_field, #anbieter_rufnummer2_field{
			margin-top: 20px;
		}
		
		#anbieter_vorwahl1_field, #anbieter_vorwahl2_field{
			width: 100px;
			margin-right: 20px;
		}
		#anbieter_rufnummer1_field, #anbieter_rufnummer2_field{
			width: calc(100% - 120px);
		}
		#anbieter_rufnummer2_field{
			margin-left: 120px;
		}
	}


	.woocommerce-billing-fields{
		
		width: 50%;
		
		#billing_title, #brief_anrede{
			@include media-breakpoint-down(md){
				width: 100% !important;
				padding:5px;
			}
		}

		&:before {
			content: 'Persönliche Daten';
			font-size: 60px !important;
			color: #31AFD7;
			display: block;
			margin: 3.8rem 0 21px;
			@include media-breakpoint-down(md){
				font-size: 40px !important;
				margin: 0;
				display: none;
			}
		}
		
		h3{
			display: none;
		}
		
		#billing_title_field, #billing_first_name_field, #billing_last_name_field, #brief_anrede_field, #brief_vorname_field, #brief_nachname_field{
			float:left;
			clear: none;
			span{
				width: 100%;
			}
		}
		
		#billing_title_field, #brief_anrede_field{
			width: 100px;
			margin-right: 20px;
		}
		
		#billing_first_name_field, #brief_vorname_field{
			margin-right: 20px;
		}
		
		#billing_first_name_field, #brief_vorname_field, #billing_last_name_field, #brief_nachname_field{
			width: calc(50% - 70px);
			@include media-breakpoint-down(md){
				width: 100% !important;
				margin-top: 20px !important;
			}
			span{
				width: 100%;
			}
		}
		
		#billing_address_1_field, #festnetz_field, #billing_phone_field, #billing_email_field, #geboren_am_field, #brief_strasse_field, #brief_festnetz_field{
			width: 100%;
			margin-top: 20px;
			float: left;
			span{
				width: 100%;
			}
		}
		
		#billing_postcode_field, #brief_plz_field, #billing_city_field, #brief_ort_field{
			float:left;
			clear: none;
			margin-top: 20px;
			span{
				width: 100%;
			}
		}
		
		#billing_postcode_field, #brief_plz_field{
			width: 160px;
			margin-right: 20px;
		}
		
		#billing_city_field, #brief_ort_field{
			width: calc(100% - 180px);
		}
		
		#briefpost_head_field{
			clear: both;
		}
		

		@include media-breakpoint-down(md){
			#briefpost_radio_andere_adresse, #briefpost_radio_anschlussadresse{
				padding:5px;
			}
		}

		#briefpost_radio_field{
			span{
				width: 100%;
				input{
					float:left;
					display: block;
				}
				label{
					display: block !important;
					margin-left: 30px;
					
					color: #31AFD7;
					font-size: 22px;
					
				}
			}
		}
	}
	
	.rechnungsdaten{
		
		width: 50%;
		
		#rechnungsadresse__anschluss_adresse, #rechnungsadresse__andere_adresse{
			@include media-breakpoint-down(md){
				padding:5px;
			}
		}

		h3 {
			font-size: 60px !important;
			color: #31AFD7;
			display: block;
			margin: 2.0rem 0 0px;
			@include media-breakpoint-down(md){
				display: none;
			}
		}
		
		#rechnungsadresse__field{
			span{
				width: 100%;
				input{
					float:left;
					display: block;
					@include media-breakpoint-down(md){
						padding:5px;
					}
				}
				label{
					display: block !important;
					margin-left: 30px;
					
					color: #31AFD7;
					font-size: 22px;
					
				}
			}
		}
		
		#firma_field, #strasse_field, #kontoinhaber_field, #kreditinstitut_field, #iban_field{
			width: 100%;
			margin-top: 20px;
			float: left;
			span{
				width: 100%;
			}
		}
		
		#ansprache_field, #vorname_field, #nachname_field, #plz_field, #ort_field{
			float:left;
			clear: none;
			margin-top: 20px;
			span{
				width: 100%;
			}
		}
		
		
		#ansprache_field, #plz_field{
			width: 100px;
			margin-right: 20px;
		}

		#ansprache_field{
			@include media-breakpoint-down(md){
				select{padding:5px;}
			}
		}
		
		#vorname_field{
			margin-right: 20px;
		}
		
		#ort_field{
			width: calc(100% - 120px);
			span{
				width: 100%;
			}
		}
		
		#vorname_field, #nachname_field{
			width: calc(50% - 70px);
			span{
				width: 100%;
			}
			@include media-breakpoint-down(md){
				width: 100% !important;
			}
		}
		
		#rechnungsversand_email_field, #bankverbindung_field{
			clear: both;
		}
		
		#check_rechnung_email_field{
			float:left;
			clear: none;
			width: 135px;
			label{
				display: flex;
				align-items: center;
				input{
					width:54px;
					height:54px;
					margin-right: 10px;
					@include media-breakpoint-down(md){
						padding:5px;
						width:44px;
						height:44px;
					}
					&:after{
						background:none;
						left: 14px;
						top: 5px;
						width: 17px;
						height: 29px;
						border-bottom: 4px solid #31AFD7;
						border-right: 4px solid #31AFD7;
						@include media-breakpoint-down(md){
							left: 13px;
							top: 5px;
							width: 14px;
							height: 23px;
						}
					}
				}
			}
		}
		
		 #email_rechnung_field{
			float:left;
			clear: none;
			width:calc(100% - 135px);
			span{
				width: 100%;
			}
		}
	}
	
	.woocommerce-checkout-payment{
		
		margin-top:50px;
		
		.wc_payment_methods{
			display: none !important;
		}
		
		.place-order{
			justify-content: end;
			width: 100%;
			.woocommerce-terms-and-conditions-wrapper{
				
				margin-bottom: 50px;
				
				.woocommerce-privacy-policy-text{
					display: none !important;
				}
				.validate-required{
					label{
						input{
							width:30px;
							height:30px;
							margin-right: 10px;
							&:after{
								background:none;
								left: 7px;
								top: 2px;
								width: 9px;
								height: 15px;
								border-bottom: 3px solid #31AFD7;
								border-right: 3px solid #31AFD7;
							}
						}
					}
				}
			}
		}
	}
	
	#place_order, #print_pdf{
		padding: 6px 20px 2px;
		font-family: "fs_untitled-medium";
		font-size: 20px;
		border-radius: 20px !important;
		width: 400px;
		max-width: 100%;
		margin: 0px;
		color: #31afd7 !important;
		background-color: #ffffff !important;
		border-width: 2px !important;
		border-color: #31afd7 !important;
		border-style: solid !important;
		@include media-breakpoint-down(md){
			width: 100%;
		}
		&:hover{
			color: #ffffff !important;
			background-color: #31afd7 !important;
		}
	}
	#print_pdf{
		margin:50px  0 0;
	}

	#thwmsc-tab-panel-0, #thwmsc-tab-panel-1, #thwmsc-tab-panel-2, #thwmsc-tab-panel-3, #thwmsc-tab-panel-4{
		@include media-breakpoint-down(md){
			width: 100% !important;
			max-width: 100% !important;
			box-sizing: border-box;
		}
		.thwmsc-tab-content{
			@include media-breakpoint-down(md){
				width: 100% !important;
				max-width: 100% !important;
				box-sizing: border-box;
			}
		}
	}
	
	@include media-breakpoint-down(md){
		.thwmsc-tab-panel.order_review,
		#order_review,
		.woocommerce-checkout-review-order,
		.shop_table.woocommerce-checkout-review-order-table{
			width: 100% !important;
			max-width: 100% !important;
			box-sizing: border-box;
		}
	}

	.woocommerce-billing-fields{
		@include media-breakpoint-down(md){
			width: 100% !important;
		}
	}
}



 .woocommerce-order-received{
	.order_sumarize{
	
		.review-line{
			height: 2px;
			border: none;
			margin-bottom: 10px;
			color: #000000;
			background-color: #000000;
		}
		
		.one-line{
			display: flex;
			justify-content: flex-start;

			&.header{
				.two{
					margin-top: 60px;
				}
			}
			
			&.fst{
				padding-left:20px;
				@include media-breakpoint-down(md){
					padding-left: 0;
				}
			}
			
			&.snd{
				padding-left:40px;
				@include media-breakpoint-down(md){
					padding-left: 0;
				}
				.head{
					display: list-item;
					list-style-type: disc;
				}
			}
			
			.head{
				flex-grow: 5;
				@include media-breakpoint-down(md){
					flex-grow: 1;
				}
				span{
					display: inline-block;
				}
				.product-short-description{
					max-width: 600px;
				}
			}
			
			.head_short{
				flex-basis: 300px;
				@include media-breakpoint-down(md){
					flex-basis: 100%;
				}
			}
			
			.tail{
				flex-shrink: 20000;
			}
			
			.one{
				width: 300px;
				text-align: left;
				font-family: "fs_untitled-medium";
				font-size: 18px;
			}
			.two{
				width: 150px;
				text-align: left;
				font-family: "fs_untitled-medium";
				font-size: 18px;
				.fixcostes, .mwst_inkl{
					display: none;
				}
			}
		}
	}
	.print-pdf{
		display: block;
		padding:6px 40px 2px;
		text-align: center;
		font-family: "fs_untitled-medium";
		font-size: 20px;
		border-radius: 20px !important;
		width: 400px;
		max-width: 100%;
		margin: 50px 0;
		color: #31afd7 !important;
		background-color: #ffffff !important;
		border-width: 2px !important;
		border-color: #31afd7 !important;
		border-style: solid !important;
		line-height: 30px;
		@include media-breakpoint-down(md){
			width: 100%;
		}
		&:hover{
			color: #ffffff !important;
			background-color: #31afd7 !important;
		}
	}

}



/* Date Picker Default Styles */
.ui-datepicker {
	padding: 0;
	border: 2px solid #fff !important;
	background: #31AFD7;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 20px !important;
	padding: 19px 26px 12px 26px;
	
	* {
		padding: 0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
	}

	table {
		font-size: 16px;
		margin: 0;
	}

	.ui-datepicker-header {
		border: none;
		background: none;
		color: #000;
		font-weight: normal;
		
		
		.ui-state-hover {
			background: #31AFD7;
			
			cursor: pointer;
			-webkit-border-radius: 0;
			-moz-border-radius: 0;
			border-radius: 0;
		}
	}

	thead {
		background: none;
		color: #000;
	}

	.ui-datepicker-title {
		margin-top: .4em;
		margin-bottom: .3em;
		color: #fff;
		font-size: 14px;
	}

	.ui-datepicker-prev-hover,
	.ui-datepicker-next-hover,
	.ui-datepicker-next,
	.ui-datepicker-prev {
		height: 20px;
		width: 20px;
		
	}

	.ui-datepicker-next span,
	.ui-datepicker-prev span {
		background: #31AFD7 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20'><polyline points='0,0 10,10 0,20' fill='none' stroke='%23ffffff' stroke-width='2'/></svg>") no-repeat;
		background-position: 0 0;
		height: 20px;
		margin-top: 4px;
		&:hover{
			border: none;
		}
	}

	.ui-datepicker-prev span {
		background: #31AFD7 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20'><polyline points='10,0 0,10 10,20' fill='none' stroke='%23ffffff' stroke-width='2'/></svg>") no-repeat;
	}

	th {
		padding: 0.75em 0;
		color: #fff;
		font-weight: normal;
		border: none;
	}

	td {
		background: none;
		border: none;
		padding: 0;

		.ui-state-default {
			background: transparent;
			border: none;
			text-align: center;
			padding: .5em;
			margin: 0;
			font-weight: normal;
			color: white;
		}

		.ui-state-active,
		.ui-state-hover {
			background: #fff;
			color: #31AFD7;
		}
	}

	td.ui-state-disabled,
	td.ui-state-disabled .ui-state-default {
		opacity: 0.5;
		color: #fff;
	}
	
	.ui-datepicker-title{
		select{
			background: #31AFD7 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%23ffffff'><polygon points='0,0 10,0 5,5'/></svg>") no-repeat;
			color:white;
			border: 1px solid white;
			background-position: 90% 70%;
			padding: 3px 15px 2px 15px;
			border-radius: 20px !important;
		}
		.ui-datepicker-month{
			margin-right: 5px;
		}
		.ui-datepicker-year{
			margin-left: 5px;
		}
	} 
	
	.ui-datepicker-buttonpane{
		height:40px;
		border:none;
		background: none;
		button{
			background: #31AFD7;
			border-radius: 20px !important;
			border:1px solid white;
			text-transform: lowercase;
			font-size: 16px;
			font-family: "fs_untitled-regular";
			font-weight: normal;
			padding: 3px 15px 2px 15px;
			&:not(:hover){
				background: #31AFD7;
			}
			&:hover{
				background: white;
				color: #31AFD7;
			}
		}
	}
}


/* Print Styles */
@media print {
	
	
	footer, 
	nav,
	.site-footer,
	.menu,
	.sidebar,
	.woocommerce-breadcrumb,
	.buttons,
	#payment .payment_methods,
	button:not(#place_order),
	.wc-proceed-to-checkout,
	.widget,
	.entry-header, 
	.thwmsc-tabs,
	.place-order {
		display: none !important;
	}
	

	
	body {
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		line-height: 1.4;
		font-family: Arial, sans-serif;
		color: #000;
		background: none;
	}
	
	a[href]:after {
		content: none !important;
	}
	
	#page{
		margin-top:0px;
		#masthead{
			width: 100%;
			position:relative;
			padding-top: 10px;
			background: transparent;
			
			
			transition: all 0.55s;
			overflow: hidden;
		}
	}
	
	#primary{
		margin-top:0px;
	}
	
	#order_review {
		width: 100% !important;
		margin: 0;
		padding: 20px;
		border: 1px solid #ccc;
	}

	
	.woocommerce-checkout-review-order-table {
		width: 100%;
		border-collapse: collapse;
		margin-bottom: 20px;
	}

	.woocommerce-checkout-review-order-table th,
	.woocommerce-checkout-review-order-table td {
		padding: 10px;
		border: 1px solid #ddd;
		text-align: left;
	}

	.woocommerce-checkout-review-order-table thead th {
		background-color: #f5f5f5;
		font-weight: bold;
	}

	/* Customer details */
	.woocommerce-billing-fields,
	.woocommerce-shipping-fields {
		margin-bottom: 20px;
	}

	.woocommerce-billing-fields h3,
	.woocommerce-shipping-fields h3 {
		font-size: 16px;
		margin-bottom: 10px;
	}

	/* Order totals */
	.order-total {
		font-weight: bold;
	}

	/* Page breaks */
	h1, h2, h3, h4, h5 {
		page-break-after: avoid;
	}

	table, figure {
		page-break-inside: avoid;
	}

	/* Links */
	a {
		text-decoration: none;
		color: #000;
	}

	/* Add order information header */
	.woocommerce-checkout-review-order::before {
		content: "Bestellübersicht";
		display: block;
		font-size: 24px;
		font-weight: bold;
		margin-bottom: 20px;
		text-align: center;
	}

	/* Print-specific information */
	.woocommerce-checkout-review-order::after {
		content: "Druckdatum: " attr(data-print-date);
		display: block;
		margin-top: 20px;
		font-size: 12px;
		text-align: right;
	}

	/* Ensure white background */
	* {
		-webkit-print-color-adjust: exact !important;
		color-adjust: exact !important;
		print-color-adjust: exact !important;
	}

	/* Remove shadows and backgrounds */
	* {
		box-shadow: none !important;
		text-shadow: none !important;
	}

	/* Format prices */
	.amount {
		font-weight: bold;
	}

	/* Add page numbers */
	@page {
		margin: 2cm;
	}

	@page :first {
		margin-top: 3cm;
	}
}




/*
.thwmsc-tab-panel.connectiondata	{display:none !important;}
.thwmsc-tab-panel.rechnungsdaten	{display:none !important;}
.thwmsc-tab-panel.billing			{display:none !important;}
.thwmsc-tab-panel.order_review		{
	display:block !important;
	#thwmsc-tab-content-3{
		display:block !important;
	}
}
*/



























// Karte Verfügbarkeit ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––

.map{
	margin-bottom: 0px !important;
	
	h3{
		font-size: 60px;
		@include media-breakpoint-down(md){
			font-size: 34px;
		}
		color:#31AFD7;
		margin-bottom:50px;
	}
	
	.col{
		padding-left:0px;
		padding-right:0px;
	}
	
	.legende{
		margin-top: 40px;
		margin-bottom: 20px;
		display: flex;
		justify-content: flex-end;
		@include media-breakpoint-down(md){
			justify-content: flex-start;
			flex-direction: column;
			margin-top: 20px;
		}
		font-size: 14px;
		line-height: 18px;
		.legende_wrap{
			margin-right: 20px;
			.legende1, .legende2, .legende3{
				margin-right: 10px;
				width: 15px;
				height:15px;
				float:left;
			}
			.legende0{
				clear:both;
				display: block;
				margin-bottom: 10px;
			}
			.legende1{
				background-color:#a4c249 ;
			}
			.legende2{
				background-color: #55b3d3;
			}
			.legende3{
				background-color: #ededed;
			}
		}
	}
	.mapsvg-wrap {
	
		.mapsvg{
			background-color: transparent !important;
		}
	}
	.mapsvg-gauge{
		display: none !important;
	}
	
	.mapsvg-header .mapsvg-filters-wrap{
		display: none;
	}
	
	.mapsvg{
		text, tspan{
			font-family: "fs_untitled-medium";
			fill:#7a1f63 !important;
		}
	}
	
	.mapsvg-popover{
		border-radius: 0px !important;
	}
	
	.mapsvg-controller-view{
		font-size:18px;
		.mapsvg-controller-view-content{
			padding: 9px 20px 5px 20px !important;
			@include media-breakpoint-down(md){
				padding: 0px 20px 5px 20px !important;
			}
			h4{
				font-size: 24px;
			}
		}
		a{
			margin-top:5px;
			display: block;
		}
		.mapsvg-controller-view-toolbar{
			float:right;
			.mapsvg-popover-close{
				width: 80px;
				height: 80px;
				top:17px;
				right:17px;
				&:before, &:after{
					height:9px;
				}
				@include media-breakpoint-down(md){
					width: 40px;
					height: 40px;
					top:7px !important;
					right:7px !important;
					&:before, &:after{
						height:4px;
					}
				}
			}
		}
		.mapsvg-controller-view-wrap.nano{
			margin-top:-12px;
			@include media-breakpoint-down(md){
				margin-top:-24px;
			}
		}
	}
	
	.mapsvg-btn-group{
		box-shadow: none !important;
		border:1px solid #cccccc;
	}
	
	.nano {
		.nano-pane{
			background: none !important;
			width: 9px !important;
			right: 3px !important;
		}
	}
	.mapsvg-directory{
		background-color: white !important;
		.mapsvg-controller-view-wrap.nano{
			margin-top: 0px;
			.mapsvg-controller-view-content{
				margin-top: 1px;
				.mapsvg-directory-item{
					&:first-child{
						border-top:1px solid #cccccc;
					}
					border-bottom:1px solid #cccccc;
					font-family: fs_untitled-medium;
					font-size: 18px;
					padding: 8px;
				}
			}
		}
	}
	
	.mapsvg-mobile-buttons{
		background-color: transparent;
		margin-top:30px !important;
		.mapsvg-button-menu, .mapsvg-button-map{
			border-radius: 20px;
			background-color: white;
			color: #31AFD7;
			border: 2px solid #31AFD7;
			line-height: 40px;
			display: inline-block;
			height:40px;
			transition: all 0.5s;
			&.active{
				background-color: #31AFD7;
				color: white;
			}
		}
		.mapsvg-button-menu{
			margin: 0 15px 0 5px;
		} 
		.mapsvg-button-map{
			margin: 0 5px 0 15px;
		}
	}
}



.page-template-landingpage_kommune{
	
	p{
		font-size: 24px !important;
		line-height: 32px !important;
		margin-bottom: 32px;
	}
	
	#primary{
		margin-top: 90px;
		margin-bottom:200px; 
		@include media-breakpoint-up(md){
			margin-top: 110px;
		}
	}
	
	h2{
		color: #31AFD7;
		font-size: 44px;
		margin-top:88px;
		margin-bottom:12px;	
	}
	.tarif_head_wrap{
		margin-top: 80px;
		@include media-breakpoint-down(md){
			margin-top: 32px;
		}
		
		.tarif_head{
			color:#31AFD7;
			font-size: 44px;
			margin-bottom:12px;	
			@include media-breakpoint-down(md){
				
			}
		}		
	}
	
	#carouselStart{
		
		h2{
			line-height: 78px !important;
			font-size: 80px !important;
			@include media-breakpoint-down(md){
				line-height: 52px !important;
				font-size: 54px !important;
			}
			p{
				line-height: 78px !important;
				font-size: 80px !important;
				@include media-breakpoint-down(md){
					line-height: 52px !important;
					font-size: 54px !important;
				}
			}
		}
		h3{
			line-height: 78px !important;
			font-size: 60px !important;
			@include media-breakpoint-down(md){
				line-height: 38px !important;
				font-size: 32px !important;
			}
			p{
				line-height: 78px !important;
				font-size: 60px !important;
				@include media-breakpoint-down(md){
					line-height: 38px !important;
					font-size: 32px !important;
				}
			}
		}
		h4{
			font-size: 48px !important;
			font-family: 'fs_untitled-bold';
		}
	
		.carousel-inner{
			
			.img_wrapper{
				display:flex;
				justify-content: center;
				height:600px;
				@include media-breakpoint-down(md){
					height:400px;
				}
				z-index: 1;
				position: relative;
				img{
					width:100% !important;
					height:100% !important;
					max-width: 4000px !important;
					object-fit: cover;
				}
			}
			.svg_wrapper{
				display:flex;
				justify-content: center;
				background-color: white;
				height:600px;
				@include media-breakpoint-down(md){
					height:400px;
				}
				z-index: 1;
				position: relative;
				svg{
					width:100% !important;
					height:100% !important;
					max-width: 4000px !important;
					object-fit: cover;
				}
			}
			
			.teasers{
				color:white;
				position: relative;
				z-index:2;
				margin-top: -600px;
				height:600px;
				@include media-breakpoint-down(md){
					margin-top: -400px;
					height:400px;
				}
				
				display: flex;
	
				align-items: center;
				
				.row{
					display: flex;
					flex-direction: column;
					h2{
						margin-bottom: 20px;
					}
					
					.btn-zad{
						background-color: transparent;
						border: 2px solid white;
						transition: all 0.25s;
						color: white;
						border-radius: 18px;
						width: 150px;
						margin-top: 20px;
						height:36px;
						display: flex;
						justify-content: center;
						align-items: center;
						padding-top:3px;
						&:hover{
							color:#31AFD7;
							background-color: white;
						}
					}
				}	
			}
		}
	}
	
	.wp-block-columns {
		display: flex;
		.wp-block-column{
			flex-grow: 1;
			width: 50%;
			padding: 0px;
			
			.wp-block-file{
				display: flex;
				a:not(.wp-block-file__button){display:none;}
				.wp-block-file__button{
					margin:15px !important;
					flex-grow: 1;
					text-align: center;
					color: white !important;
					background-color: #31AFD7 !important;
					padding: 5px 0px 2px 0px !important;
					line-height: 23px;
					&:hover{
						color:#31AFD7 !important;
						background-color: white !important;
					}
				}
			}
			a{
				width: calc(100% - 30px);
				display: block;
				padding: 5px 0px 2px 0px !important;
				background: #31AFD7 !important;
				color: white !important;
				border: 2px solid #31AFD7 !important;
				border-radius: 20px !important;
				margin: 15px !important;
				font-size: 18px !important;
				text-align: center;
				line-height: 23px;
				&:hover{
					color:#31AFD7 !important;
					background-color: white !important;
				}
			}
		}
	}
}


.woocommerce-account.woocommerce-lost-password .woocommerce .woocommerce-ResetPassword .woocommerce-form-row--first{
	float: left;
}



// Störung melden –––––––––––––––––––––––––––––––––––––––––––––––––––––

.mystoerung_wrapper{
	display: none !important;
}

#gform_wrapper_2{
	margin: 0px;
}

.gform_wrapper.gravity-theme .gfield_error [aria-invalid=true] {
	border: 2px solid #c02b0a !important;
}

.stoerungsformular-einblenden{
	display: none;
}

// –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––






.page-template-tarife_tv_uebersicht{
	
	
	#primary{
		margin-top: 90px;
		margin-bottom:200px; 
		@include media-breakpoint-up(md){
			margin-top: 110px;
		}
	}
	
	h2{
		color: #31AFD7;
		font-size: 44px;
		margin-top:88px;
		margin-bottom:12px;	
	}
	.tarif_head_wrap{
		margin-top: 80px;
		@include media-breakpoint-down(md){
			margin-top: 32px;
		}
		
		.tarif_head{
			color:#31AFD7;
			font-size: 44px;
			margin-bottom:12px;	
			@include media-breakpoint-down(md){
				
			}
		}		
	}
	
	#carouselStart{
		
		h2{
			line-height: 78px !important;
			font-size: 80px !important;
			@include media-breakpoint-down(md){
				line-height: 52px !important;
				font-size: 54px !important;
			}
			p{
				line-height: 78px !important;
				font-size: 80px !important;
				@include media-breakpoint-down(md){
					line-height: 52px !important;
					font-size: 54px !important;
				}
			}
		}
		h3{
			line-height: 78px !important;
			font-size: 60px !important;
			@include media-breakpoint-down(md){
				line-height: 38px !important;
				font-size: 32px !important;
			}
			p{
				line-height: 78px !important;
				font-size: 60px !important;
				@include media-breakpoint-down(md){
					line-height: 38px !important;
					font-size: 32px !important;
				}
			}
		}
		h4{
			font-size: 48px !important;
			font-family: 'fs_untitled-bold';
		}
	
		.carousel-inner{
			
			.img_wrapper{
				display:flex;
				justify-content: center;
				height:600px;
				@include media-breakpoint-down(md){
					height:400px;
				}
				z-index: 1;
				position: relative;
				img{
					width:100% !important;
					height:100% !important;
					max-width: 4000px !important;
					object-fit: cover;
				}
			}
			.svg_wrapper{
				display:flex;
				justify-content: center;
				background-color: white;
				height:600px;
				@include media-breakpoint-down(md){
					height:400px;
				}
				z-index: 1;
				position: relative;
				svg{
					width:100% !important;
					height:100% !important;
					max-width: 4000px !important;
					object-fit: cover;
				}
			}
			
			.teasers{
				color:white;
				position: relative;
				z-index:2;
				margin-top: -600px;
				height:600px;
				@include media-breakpoint-down(md){
					margin-top: -400px;
					height:400px;
				}
				
				display: flex;
	
				align-items: center;
				
				.row{
					display: flex;
					flex-direction: column;
					h2{
						margin-bottom: 20px;
					}
					
					.btn-zad{
						background-color: transparent;
						border: 2px solid white;
						transition: all 0.25s;
						color: white;
						border-radius: 18px;
						width: 150px;
						margin-top: 20px;
						height:36px;
						display: flex;
						justify-content: center;
						align-items: center;
						padding-top:3px;
						&:hover{
							color:#31AFD7;
							background-color: white;
						}
					}
				}	
			}
		}
	}
	
	.wp-block-columns {
		display: flex;
		.wp-block-column{
			flex-grow: 1;
			width: 50%;
			padding: 0px;
			
			.wp-block-file{
				display: flex;
				a:not(.wp-block-file__button){display:none;}
				.wp-block-file__button{
					margin:15px !important;
					flex-grow: 1;
					text-align: center;
					color: white !important;
					background-color: #31AFD7 !important;
					padding: 5px 0px 2px 0px !important;
					line-height: 23px;
					&:hover{
						color:#31AFD7 !important;
						background-color: white !important;
					}
				}
			}
			a{
				width: calc(100% - 30px);
				display: block;
				padding: 5px 0px 2px 0px !important;
				background: #31AFD7 !important;
				color: white !important;
				border: 2px solid #31AFD7 !important;
				border-radius: 20px !important;
				margin: 15px !important;
				font-size: 18px !important;
				text-align: center;
				line-height: 23px;
				&:hover{
					color:#31AFD7 !important;
					background-color: white !important;
				}
			}
		}
	}
}


.page-template-landingpage_kommune{
	h2{
		font-size:32px;
		color:black;
	}
}





/* Landingpage  Gemeinde —–––––––––––––––––––––––––––––––––––––––––– */

.landingpage-template-default, .landingpage-template, .gemeindeseite-template-default, .gemeindeseite-template{
	
	p{
		font-size: 24px !important;
		line-height: 32px !important;
		margin-bottom: 32px;
	}
	
	#primary{
		margin-top: 90px;
		margin-bottom:200px; 
		@include media-breakpoint-down(md){
			margin-top: 110px;	
			margin-bottom: 70px;
		}
	}
	
	h1{
		color: #31AFD7;
		font-size: 44px;
		margin-top:88px;
		margin-bottom:12px;	
		@include media-breakpoint-down(md){
			font-size: 32px;
		}
	}
	
	h2 {
		color: #31AFD7;
		margin-bottom: 1.5rem;
		font-size: 60px;
		@include media-breakpoint-down(md){
			font-size: 36px;
			margin-bottom: 0rem;
			line-height: 42px;
		}
	}
	
	.tarif_head_wrap{
		margin-top: 40px;
		@include media-breakpoint-down(md){
			margin-top: 32px;
		}
		
		.tarif_head{
			color:#31AFD7;
			font-size: 44px;
			margin-bottom:12px;	
			@include media-breakpoint-down(md){
				
			}
		}		
	}
	
	#carouselStart{
		
		h1{
			line-height: 131px !important;
			font-size: 125px !important;
			@include media-breakpoint-down(md){
				line-height: 52px !important;
				font-size: 54px !important;
			}
			p{
				line-height: 131px !important;
				font-size: 125px !important;
				@include media-breakpoint-down(md){
					line-height: 52px !important;
					font-size: 54px !important;
				}
			}
		}
		h3{
			line-height: 78px !important;
			font-size: 60px !important;
			@include media-breakpoint-down(md){
				line-height: 38px !important;
				font-size: 32px !important;
			}
			p{
				line-height: 78px !important;
				font-size: 60px !important;
				@include media-breakpoint-down(md){
					line-height: 38px !important;
					font-size: 32px !important;
				}
			}
		}
		h4{
			font-size: 48px !important;
			font-family: 'fs_untitled-bold';
		}
	
		.carousel-inner{
			
			.img_wrapper{
				display:flex;
				justify-content: center;
				height:600px;
				@include media-breakpoint-down(md){
					height:400px;
				}
				z-index: 1;
				position: relative;
				img{
					width:100% !important;
					height:100% !important;
					max-width: 4000px !important;
					object-fit: cover;
				}
			}
			.svg_wrapper{
				display:flex;
				justify-content: center;
				background-color: white;
				height:600px;
				@include media-breakpoint-down(md){
					height:400px;
				}
				z-index: 1;
				position: relative;
				svg{
					width:100% !important;
					height:100% !important;
					max-width: 4000px !important;
					object-fit: cover;
				}
			}
			
			.teasers{
				color:white;
				position: relative;
				z-index:2;
				margin-top: -600px;
				height:600px;
				@include media-breakpoint-down(md){
					margin-top: -400px;
					height:400px;
				}
				
				// display: flex;
				// align-items: center;
				
				.row{
					display: flex;
					flex-direction: column;
					h1{
						margin-bottom: 20px;
						color: white;
					}
					
					.btn-zad{
						background-color: transparent;
						border: 2px solid white;
						transition: all 0.25s;
						color: white;
						border-radius: 18px;
						width: 150px;
						margin-top: 20px;
						height:36px;
						display: flex;
						justify-content: center;
						align-items: center;
						padding-top:3px;
						&:hover{
							color:#31AFD7;
							background-color: white;
						}
					}
				}	
			}
		}
	}
	
	.custom-field{
		font-size: 24px !important;
		line-height: 32px !important;
	}
	
	.erschliessung{
		font-size: 36px;
		line-height: 42px;
		font-family: "fs_untitled-regular";
		margin: 20px 0 100px 20px;
		@include media-breakpoint-down(md){
			font-size: 22px;
			line-height: 28px;
			margin: 30px 10px 50px 10px;
		}
	}
	
	.expansion-areas {
		padding: 2rem 0;
		@include media-breakpoint-down(md){
			padding:0;
		}
		
		.breitband-accordion {
			
			.card {
				border: none;
				margin-bottom: 1px;
				border-bottom: 4px rgba(50, 175, 215, 0.3) solid;
			}
			
			.card-header {
				background-color: #fff;
				border: none;
				padding: 0;
			}
			
			h4{
				margin-top:40px;	
				margin-bottom:20px;	
				font-size: 28px;
				@include media-breakpoint-down(md){
					font-size: 24px;
					margin-top:20px;
				}
			}
			
			.btn-link {
				width: 100%;
				text-align: left;
				text-decoration: none;
				color: #31AFD7;
				font-weight: 500;
				padding: 1rem;
				position: relative;
				background: none;
				border: none;
				font-size: 36px;
				@include media-breakpoint-down(md){
					font-size: 28px;
				}
				font-family: "fs_untitled-medium";
				&:hover, &:focus, &:focus-visible{
					text-decoration: none;
					color: #333;
					outline: none;
					box-shadow: none;
				}
			}
			
			.icon {
				margin-right: 10px;
				font-size: 1.2em;
				color: #6D0755;
				display: inline-block;
				transition: transform 0.3s ease;
			}
			
			.btn-link:not(.collapsed) .icon {
				transform: rotate(45deg);
			}
			
			.connection-info, .company-section, .section, .timeline, .news, .contact{
				border-bottom:2px solid black;
				padding-bottom: 60px;
				@include media-breakpoint-down(md){
					padding-bottom: 20px;
				}
			}
			
			.contact{
				border-bottom:0px solid black;
			}
			
			.connection-info h3 {
				font-size: 48px;
				margin-bottom: 1rem;
				@include media-breakpoint-down(md){
					font-size: 32px;
				}
			}
			
			.connection-details {
				display: flex;
				flex-wrap: wrap;
				gap: 2rem;
				@include media-breakpoint-down(md){
					gap:0;
				}
				width: 100%;
			}
			
			.residential, .commercial {
				display: flex;
				align-items: center;
				font-size: 36px;
				margin-top:30px;
				flex: 0 0 calc(50% - 1rem);
				@include media-breakpoint-down(md){
					font-size: 24px;
					margin-top:0px;
				}
			}
			
			.residential span, .commercial span {
				margin-left: 0.5rem;
				@include media-breakpoint-down(md){
					margin-left: 15px;
					margin-top: 15px;
				}
			}

			.commercial {
				padding-left: 50px;
				@include media-breakpoint-down(md){
					padding-left: 0px;
				}
				span{
					@include media-breakpoint-down(md){
						margin-top: 7px;
					}
				}
			}
			
			.home-icon, .business-icon, .calender-icon  {
				width: 50px;
				height: 50px;
				@include media-breakpoint-down(md){
					width: 30px;
					height: 30px;
				}
				background-size: contain;
				background-repeat: no-repeat;
				display: block;
			}
			
			.home-icon {
				background-image:  url('../pics/Wohneinheiten.svg');  
				background-size:45px; 
				margin-top: -20px;
				@include media-breakpoint-down(md){
					background-size:30px; 
					margin-top: 0px;
				}
			}
			
			.business-icon {
				background-image:  url('../pics/Gewerbeeinheiten.svg');  
				background-size:50px; 
				margin-top: -20px;
				@include media-breakpoint-down(md){
					background-size:30px; 
					margin-top: 0px;
				}
				
			}
			
			.calender-icon {
				background-image:  url('../pics/Zeitraum.svg');  
				background-size:45px; 
				margin-top: -14px;
				@include media-breakpoint-down(md){
					background-size:28px; 
					margin-top: -4px !important;
				}
			}
			
			.timeline{
				div{
					display: flex;
					margin-top: 40px;
					@include media-breakpoint-down(md){
						margin-top: 20px;
					}
					p{
						font-size: 38px !important;
						margin: 0 0 0 10px;
						@include media-breakpoint-down(md){
							font-size: 28px !important;
						}
					}
				}
			}
			
			.company-logos {
				display: flex;
				flex-wrap: wrap;
				gap: 2rem;
				width: 100%;
				div{
					flex: 0 0 calc(50% - 1rem);
					align-items: flex-start;
					@include media-breakpoint-down(md){
						width: 60%;
					}
				}
				@include media-breakpoint-down(sm){
					flex-direction: column;
					align-items: center;
				}
			}
			
			.company-logos img, .section img {
				max-height: 150px;
				width: auto;
			}
			
			.news-items{
				display: flex;
				flex-wrap: wrap;
				gap: 2rem;
				width: 100%;
				.news-item{
					flex: 0 0 calc(50% - 1rem);
					p{
						margin: 0px;
					}
					margin-bottom: 32px;
				}
			}
			
			.contact-link{
				color: #6D0755;
				font-size: 36px;
				margin-top:40px;
				@include media-breakpoint-down(md){
					font-size: 28px;
					margin-top:10px;
					line-height: 32px;
				}
			}
		}
		
		
		
		/* Responsive adjustments */
		@media (max-width: 768px) {
			.connection-details {
				flex-direction: column;
			}
			
			.residential, .commercial {
				margin-bottom: 1rem;
			}
			
			.company-logos {
				flex-direction: column;
				align-items: flex-start;
			}
			
			.company-logos img {
				margin-bottom: 1rem;
			}
		}
		
		
	}
	
	// Responsive adjustments
	@media (max-width: 768px) {
		.expansion-areas {
			.accordion {
				.accordion-body {
					.area-stats {
						.connections-detail {
							flex-direction: column;
							gap: 1rem;
						}
					}
				}
			}
		}
	}
	
	
	#landing_check{
		
		background: #6D0654;
		padding: 1px 30px 30px 30px;
		border-radius: 24px;
		margin-top: 2vh;
		margin-bottom: 0vh;
		@include media-breakpoint-down(md){
			margin-top: 1vh;
			padding: 1px 15px 15px 15px;
		}
		.btn-group{
			margin: 50px 0 0 0;
			border-radius: 15px;
			height:36px;
			width: 100%;
		
			.btn-zad{
				background-color: transparent;
				border: 2px solid white;
				transition: all 0.25s;
				color: white;
				
				&.active{
					color:#6D0654;
					background-color: white;
				}
				&:first-child{
					border-top-left-radius: 18px;
					border-bottom-left-radius: 18px;
				}
				&:last-child{
					border-top-right-radius: 18px;
					border-bottom-right-radius: 18px;
				}
			}
		}
		
		form{
			margin-top: 30px;
			@include media-breakpoint-down(md){
				margin-top: 15px;
			}
			.form-row{
				margin-right: -15px;
				margin-left: -15px;
				
				.form-group{
					
					margin-bottom: 2rem;
					@include media-breakpoint-down(md){
						margin-bottom: 1rem;	
					}
					
					.form-control{
						color: #6D0654;
						font-size: 32px;
						padding: 3px 0 0 22px;
						height: 48px;
						border-radius: 24px;
						
						&.isDisabled {
						  cursor: not-allowed;
						  opacity: 0.5;
						  text-decoration: none;
						}
						@include media-breakpoint-down(md){
							font-size: 20px;
							padding: 3px 0 0 13px;
							height: 40px;
						}
					}
				}
				
				[class*=col]{
					padding-right: 15px;
					padding-left: 15px;
					background: transparent;
					&.lesspadding{
						@include media-breakpoint-down(md){
							padding-right: 0px;
						}
					}
					input{
						background: transparent;
						font-size: 40px;
						border: none;
						border-bottom: 2px solid white;
						margin-top: 50px;
						margin-right: 20px;
						color:white;
						
						&::placeholder{
							color:white;
							opacity: 0.2;
						}
					}
					.btn-zad{
						background-color: transparent;
						border: 2px solid white;
						transition: all 0.25s;
						color: white;
						border-radius: 18px;
						width: 100%;
						height: 48px;
						border-radius: 24px;
						font-size: 32px;
						padding:0;
						margin-top: 46px;
						
						&:hover{
							color:#6D0654;
							background-color: white;
						}
						&.isDisabled {
						  cursor: not-allowed;
						  opacity: 0.5;
						  text-decoration: none;
						}
						@include media-breakpoint-down(md){
							height: 40px;
							font-size: 20px;
							padding-top: 4px;
						}
					}	
				}
				.los{
					padding-top:0px;
				}
			}
			
			.invalid-feedback{
				color: white;
				margin-top: 10px;
			}
		}
	}
	
	.wp-block-columns {
		display: flex;
		.wp-block-column{
			flex-grow: 1;
			width: 50%;
			padding: 0px;
			
			.wp-block-file{
				display: flex;
				a:not(.wp-block-file__button){display:none;}
				.wp-block-file__button{
					margin:15px !important;
					flex-grow: 1;
					text-align: center;
					color: white !important;
					background-color: #31AFD7 !important;
					padding: 5px 0px 2px 0px !important;
					line-height: 23px;
					&:hover{
						color:#31AFD7 !important;
						background-color: white !important;
					}
				}
			}
			a{
				width: calc(100% - 30px);
				display: block;
				padding: 5px 0px 2px 0px !important;
				background: #31AFD7 !important;
				color: white !important;
				border: 2px solid #31AFD7 !important;
				border-radius: 20px !important;
				margin: 15px !important;
				font-size: 18px !important;
				text-align: center;
				line-height: 23px;
				&:hover{
					color:#31AFD7 !important;
					background-color: white !important;
				}
			}
		}
	}
	.container{
		.row{
			.col-lg-8{
				background: rgba(255, 255, 255, 0.8);
			}
		}
	}
	.mehr_erfahren_before{
		margin-bottom: 12px;
	}
	.ausbaugebiete{
		color:#a4c249;
	}
	
	.netzbetrieb, .netzausbau{
		p{
			margin-bottom: 12px;
		}
	}
	.container-carousel.ansprechpartner{
		
		margin-top:150px;
		margin-bottom:100px;
		@include media-breakpoint-down(md){
			margin-top:70px;
			margin-bottom:30px;
		}
		
		.carousel-control-prev,
		.carousel-control-next {
			background: none;
			opacity: 1;
			width: auto;
			padding: 0 20px;
			@include media-breakpoint-down(md){
				padding: 0;
			}
		}
		
		.carousel-control-prev:hover,
		.carousel-control-next:hover {
			opacity: 0.8;
		}
		
		.home-icon-w, .business-icon-w{
			width: 50px;
			height: 50px;
			background-size: contain;
			background-repeat: no-repeat;
			display: block;
			@include media-breakpoint-down(md){
				width: 30px;
				height: 30px;
			}
		}
		
		.rounded-circle{
			background: #31AFD7;
			width: 80px; 
			height: 80px;
			@include media-breakpoint-down(md){
				width: 60px;
				height: 60px;
			}
		}
		
		.home-icon-w {
			background-image:  url('../pics/Wohneinheiten_w.svg');  
			background-size:45px; 
			margin-top: 0px;
			margin-left: 3px;
			@include media-breakpoint-down(md){
				background-size:30px;
				margin-left: 0px;
			}
		}
		
		.business-icon-w {
			background-image:  url('../pics/Gewerbeeinheiten_w.svg');  
			background-size:50px; 
			margin-top: 0px;
			margin-left: -2px;
			@include media-breakpoint-down(md){
				background-size:30px;
				margin-left: 0px;
			}
		}
		
		.arrow-left, .arrow-right {
			vertical-align: middle;
			position: relative;
			top: -2px; 
			
		}
		
		.arrow-left {
			width: 30px;
			height: 30px;
			border-left: 3px solid #800080;  /* Purple color */
			border-bottom: 3px solid #800080;
			transform: rotate(45deg);
			display: inline-block;
		}
		
		/* For right arrow, just change the rotation */
		.arrow-right {
			width: 30px;
			height: 30px;
			border-left: 3px solid #800080;
			border-bottom: 3px solid #800080;
			transform: rotate(-135deg);
			display: inline-block;
		}
		
		.text-purple {
			color: #800080;
		}

		.rowcolls{
			justify-content: center !important;
			@include media-breakpoint-down(md){
				flex-direction: column;
				align-items: center;
			}
		}
		.colls{
			position: relative;
			width: 100%;
			padding-right: 15px;
			padding-left: 15px;
			flex: 0 0 auto;
  			width: auto;
    		max-width: 100%;
			@include media-breakpoint-down(md){
				justify-content: center;
			}
		}

		.blau{
			color: #31AFD7;
			margin-top: 10px;
			@include media-breakpoint-down(md){
				font-size: 28px;
				line-height: 32px;
			}
		}
		p{
			@include media-breakpoint-down(md){
				font-size: 18px !important;
				line-height: 24px !important;
			}
		}

		.carousel-control-prev-icon,
		.carousel-control-next-icon {
			display: none;
		}
		
		.carousel-item {
			transition: transform .6s ease;
		}
		
		.carousel-control-prev,
		.carousel-control-next {
			opacity: 1;
			transition: opacity 0.3s ease;
		}
		
		.carousel-control-disabled {
			opacity: 0.2;
			pointer-events: none;
		}
	}
	.info-grid {
		display: flex;
		flex-wrap: wrap;
		gap: 20px;
		padding: 20px;
		max-width: 1200px;
		margin: 0 auto;
		@include media-breakpoint-down(md){
			padding: 0px;
			margin-top: 20px;
		}
	}
	
	.info-item {
		flex: 1 1 calc(50% - 10px);
		min-width: 280px;
		text-decoration: none;
		height:261px;
		@include media-breakpoint-down(md){
			height: 120px;
		}
	}
	
	.item-content {
		background-color: #9DC45F;
		border-radius: 25px;
		padding: 50px;
		height: 100%;
		transition: all 0.3s ease;
		display: flex;
		align-items: center;
		justify-content: center;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}
	
	#rundumglasfaser .item-content {
		background-image: url('../pics/kacheln/bg4.svg');
	}
	
	#bauenimerschlossenengebiet .item-content {
		background-image: url('../pics/kacheln/bg3.svg');
	}
	
	#schnellerundeinfacherwechsel .item-content {
		background-image: url('../pics/kacheln/bg1.svg');
	}
	
	#faq .item-content {
		background-image: url('../pics/kacheln/bg2.svg');
	}
	
	.item-content h3 {
		color: #722F72;
		font-size: 32px;
		margin: 0;
		font-family: 'fs_untitled-bold';
		text-align: center;
		@include media-breakpoint-down(md){
			font-size: 24px;
		}
	}
	
	.info-item:hover .item-content {
		box-shadow: 0 0px 15px rgba(0, 0, 0, 0.3);
	}
	
	@media (max-width: 768px) {
		.info-item {
			flex: 1 1 100%;
		}
	}
	
	.ueber_uns{
		margin-top: 100px;
		@include media-breakpoint-down(md){
			margin-top: 50px;
		}
	}

	.custom-field p{
		@include media-breakpoint-down(md){
			font-size: 22px !important;
			line-height: 28px !important;
		}
	}
	// ---------------- Statusbar ----------------
	.status-bar {
		display: flex;
		align-items: center;
		width: 100%;
		max-width: 1200px;
		margin: 20px auto;
		position: relative;
		height: 62px;
		gap: 1px;

		.circle-wrapper {
			padding: 1px;
			border-radius: 50%;
			background-color: #fff;
		}
		
		.circle {
			width: 60px;
			height: 60px;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			position: relative;
			flex-shrink: 0;
			z-index: 2;
			margin: 0 5px;
		}
		
		/* Bar styles */
		.bar-wrapper {
			padding: 1px;
			flex-grow: 1;
			position: relative;
			background-color: #fff;
		}
		
		.width-3-6 {
			flex: 3;
		}
		
		.width-2-6 {
			flex: 2;
		}
		
		.width-1-6 {
			flex: 1;
		}
		
		.bar {
			height: 60px;
			width: 100%;
			position: relative;
			z-index: 1;
		}
		
		.bar-background {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}
		
		.bar-progress {
			position: absolute;
			top: 0;
			left: 0;
			height: 100%;
			width: 0%;
			transition: width 0.3s ease;
			
		}
		
		/* Icon styles */
		.status-icon {
			width: auto;
			height: 47px;
			position: relative;
			z-index: 3;
			opacity: 0.5;
			transition: opacity 0.3s ease;
		}
		
		/* Circle icon positioning (centered) */
		.circle .status-icon {
			margin: -6px -5px 0 -14px;
		}
		
		/* Bar icon positioning (left-aligned) */
		.bar .status-icon {
			position: absolute;
			left: 5px;
			top: 27px;
			transform: translateY(-50%);
		}
		
		/* Specific element styles */
		.step-1 .circle {
			background-color: #E8B87B;
		}
		
		.step-2 .bar-background, 
		.step-3 .bar-background,
		.step-4 .bar-background {
			background-color: #cccccc;
		}
		
		.step-2 .bar-progress {
			background-color: #AFE1F1;
			border-bottom: 2px solid #779EAA;
		}
		.step-3 .bar-progress {
			background-color: #86D2DB;
			border-bottom: 2px solid #508B91;
		}
		.step-4 .bar-progress {
			background-color: #E8F398;
			border-bottom: 2px solid #8B9352;
		}
		
		.step-5 .circle,
		.step-6 .circle {
			background-color: #cccccc;
		}
		
		/* Progress dot */
		.progress-dot {
			position: absolute;
			bottom: -12px;
			margin-left: -5px;
			left: 0%;
			width: 10px;
			height: 10px;
			background-color: red;
			border-radius: 50%;
			z-index: 3;
			display: none;
		}
		
		.circle-wrapper .progress-dot {
			left:30px;
		}
		
		button.circle-wrapper,
		button.bar-wrapper {
			background: none;
			border: none;
			padding: 1px;
			cursor: pointer;
			width: auto;
		}
		
		button.bar-wrapper {
			flex: none;
		}
		
		button.bar-wrapper.width-3-6 {
			flex: 3;
		}
		
		button.bar-wrapper.width-2-6 {
			flex: 2;
		}
		
		button.bar-wrapper.width-1-6 {
			flex: 1;
		}
		
		/* Modal styles */
		.modal-dialog.modal-lg {
			max-width: 800px;
		}
		
		.modal-body img {
			max-width: 100%;
			height: auto;
		}

		button.step-1:hover{
			.circle {
				background-color: #D9A144 !important;
			}
		}
		
		button.step-2:hover{
			.bar-progress {
				background-color: #92BDCB !important;
			}
		}
		
		button.step-3:hover{
			.bar-progress {
				background-color: #73B7BF !important;
			}
		}
		
		button.step-4:hover{
			.bar-progress {
				background-color: #C9D380 !important;
			}
		}
		
		button.step-5:hover{
			.circle {
				background-color: #BDCC56 !important;
			}
		}
		
		button.step-6:hover{
			.circle {
				background-color: #9AB701 !important;
			}
		}

		@media (max-width: 767px) {
			transform: rotate(-90deg);
			transform-origin: center center;
			width: 600px;
			height: 62px;
			margin: 0 auto;
			
			// Bar wrapper styles
			.bar-wrapper {
				height: 100%;
				position: relative;
				background-color: transparent;
				
				.bar {
					height: 100%;
					position: relative;
					overflow: visible;
				}
			}
			
			// Adjust bar widths
			.width-3-6 .bar {
				width: 180px;
			}
			
			.width-2-6 .bar {
				width: 120px;
			}
			
			.width-1-6 .bar {
				width: 60px;
			}
	
			// Bar background styles
			.bar-background {
				background-color: #cccccc !important;
				width: 100%;
				height: 100%;
				position: absolute;
			}
			
			// Bar progress styles
			.bar-progress {
				position: absolute;
				bottom: 0;
				left: 0;
				width: 0%;
				height: 100%;
			}
			
			// Bar colors
			.step-2 .bar-progress {
				background-color: #AFE1F1;
				border-bottom: 2px solid #779EAA;
			}
			.step-3 .bar-progress {
				background-color: #86D2DB;
				border-bottom: 2px solid #508B91;
			}
			.step-4 .bar-progress {
				background-color: #E8F398;
				border-bottom: 2px solid #8B9352;
			}
			
			// Progress dot styles
			.progress-dot {
				position: absolute;
				bottom: -12px;
				left: 0;
				width: 10px;
				height: 10px;
				background-color: red;
				border-radius: 50%;
				z-index: 10;
				margin-left: -5px;
			}
			
			// Circle styles
			.circle {
				background-color: #cccccc;
				width: 60px;
				height: 60px;
				border-radius: 50%;
				display: flex;
				align-items: center;
				justify-content: center;
				position: relative;
				
				.progress-dot {
					bottom: -12px;
					left: 30px !important;
				}
			}
			
			// Icon styles
			.status-icon {
				height: 35px;
				width: auto;
				opacity: 0.5;
				transition: opacity 0.3s ease;
			}
			#icon_3{
				left: -3px;
			}
			div.bar-wrapper .status-icon{
				margin: -4px 0px 0px 0px;
			}
	
			// Rotate icons differently for circles and bars
			.circle .status-icon {
				transform: rotate(90deg);
				margin: -4px -14px 0 -14px;
			}
	
			.bar .status-icon {
				transform: rotate(90deg);
				position: absolute;
				left: 5px;
				top: 50%;
				transform: translateY(-50%) rotate(90deg);
			}
		}
	}
	
// Container adjustments
.status-bar-container {
    position: relative;
    width: 100%;
    
    @media (max-width: 767px) {
        height: 565px;
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

	/* Add this to your CSS */
	.modal {
		text-align: center;
		padding: 0!important;
		@include media-breakpoint-down(md){
			
		}
	}
	
	/* This helps with vertical centering */
	.modal:before {
		content: '';
		display: inline-block;
		height: 100%;
		vertical-align: middle;
		margin-right: -4px;
	}
	
	.modal-dialog {
		display: inline-block;
		text-align: left;
		vertical-align: middle;
		width: 100%;
		border: 2px solid #00b1eb;
		@include media-breakpoint-down(md){
			width: auto;
		}
	}
	
	/* Rest of your modal styles */
	.modal-content {
		border-radius: 0;
		border: none;
		box-shadow: 0 0 20px rgba(0,0,0,0.1);
	}
	
	.modal-header {
		border-bottom: none;
		padding: 2rem 2rem 1rem;
		@include media-breakpoint-down(md){
			padding: 1rem 1rem 0.5rem;
		}
	}
	
	.modal-title {
		line-height: 1.2;
		color: #00b1eb;
	}
	
	.modal-body {
		padding: 1rem 2rem 2rem;
		@include media-breakpoint-down(md){
			padding: 0.5rem 1rem 0.5rem;
		}
		
		@include media-breakpoint-down(md){
			.post-content p{
				font-size: 18px !important;
				line-height: 24px !important;
			}
		}
	}
	
	.modal-body img {
		max-width: 100%;
		height: auto;
	}
	
	.modal-header .close {
		padding: 1rem;
		margin: -1rem -1rem -1rem auto;
		font-size: 2rem;
		color: #721c24;
	}
	
	.modal-header .close span{
		font-size: 45px;
	}
	
	.modal-header .close:hover{
		opacity: 0.8;
	}
	
	/* Modal backdrop (background) */
	.modal-backdrop {
		background-color: rgba(255, 255, 255, 0.98); /* Almost fully opaque white */
		opacity: 0.9;
	}
	
	/* Close button styling */
	.modal .close {
		padding: 1rem;
		margin: -1rem -1rem -1rem auto;
		font-size: 2rem;
		color: #721c24  !important; /* Dark red */
		opacity: 1; /* Full opacity */
		border: none;
		background: transparent;
		outline: none !important; /* Remove focus outline */
		background-color: white !important;
		
	}
	
	.modal .close:hover,
	.modal .close:focus,
	.modal .close:active {
		color: #721c24; /* Keep same red color on hover */
		opacity: 1;
		border: none;
		background: transparent;
		text-decoration: none;
	}
	
	/* Ensure close button doesn't get a background when clicked */
	.modal .close:focus:not(:focus-visible) {
		box-shadow: none;
	}
	
	/* Rest of your modal styles */
	.modal-content {
		border-radius: 0;
		border: none;
		box-shadow: 0 0 20px rgba(0,0,0,0.1);
	}
	
	/* Make modal wider on larger screens */
	@media (min-width: 992px) {
		.modal-lg {
			max-width: 800px;
		}
	}
	
	
	
}


#docusign-debug-panel{
	display: none;
}




// Herbstaktion ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––

// #banner{
// 	position: fixed;
// 	z-index:9999;
// 	background-color: #000000;
// 	color:white;
// 	width: 100%;
// 	height:30px;
// 	display: flex;
// 	align-items: center;
	
// 	top:0px;
// 	overflow: hidden;
// 	white-space: nowrap;
	
// 	#banner-text {
// 		display: inline-block;
// 	}
// 	&:hover{
// 		background-color: #31AFD7;
// 	}	
// }

// #page{
// 	margin-top: 30px;
// }
// 
// 
// .postid-2823 {
// 	.entry-content{
// 		h3{
// 			margin-bottom: 10px;
// 		}
// 		ul{
// 			margin-top: 10px;
// 			padding-left: 20px;
// 			li{
// 				font-family: "fs_untitled-regular";
// 				margin-bottom: 10px;
// 			}
// 		}
// 		.wp-block-button{
// 			margin-top: 60px;
// 			a{
// 				
// 				background-color: #6D0654 !important;
// 				border-radius: 20px;
// 				color: white;
// 				border: 2px solid #6D0654;
// 				padding: 14px 31px 11px !important;
// 				line-height: 23px;
// 				margin-top: 8px;
// 				display: inline-block;
// 				&:hover{
// 					background-color: white !important;
// 					color: #6D0654 !important;
// 				}
// 			}	
// 		}
// 	}
// 	.post-navigation{
// 		display: none;
// 	}
// 	
// }
// 
// 
// .home{
// 		
// 	#carouselStart{
// 		
// 		h2{
// 			@include media-breakpoint-down(md){
// 				line-height: 42px !important;
// 				font-size: 44px !important;
// 			}
// 			p{
// 				@include media-breakpoint-down(md){
// 					line-height: 42px !important;
// 					font-size: 44px !important;
// 				}
// 			}
// 		}
// 		h3{
// 			@include media-breakpoint-down(md){
// 				line-height: 32px !important;
// 				font-size: 26px !important;
// 			}
// 			p{
// 				@include media-breakpoint-down(md){
// 					line-height: 32px !important;
// 					font-size: 26px !important;
// 				}
// 			}
// 		}
// 	}
// }


// Social Feed ––––––––––––––––––––––––––––––––––––––––––––––––––––––

.postid-177{
	time, .post-navigation {display:none;}
}

.insta{
	margin-top:50px;
	margin-bottom:150px !important;
	
	.sb_instagram_header {
		display: none !important;
	}
}

#docusign-debug-panel{
	bottom:27px !important;
	button {
		padding:0px 15px !important;
		font-size: 16px	!important;
	}
	
}

.docusign-wrapper{
	
	.docusign_admin{
		display: none;
	}
}


.tb_mc_content{
	font-size: 16px !important;
}



// CTA - Tarife –––––––––––––––––––––––––––––––––––––––––––––––––––––––

.gform_wrapper.gravity-theme .gfield_checkbox label, .gform_wrapper.gravity-theme .gfield_radio label{
	font-size: 18px !important;
}

.gfield_description{
	font-size: 18px !important;
}

input[type="file"]::-webkit-file-upload-button {
	background: #31AFD7 !important;
	height: 38px;
	border: 2px solid #31AFD7;
	border-radius: 18px;
	display: flex !important;
	justify-content: center;
	align-items: center;
	font-size: 21px !important;
	transition: all 0.25s;
	padding: 0;
	font-family: "fs_untitled-medium" !important;
	color: white !important;
	font-size: 16px !important;
	border:2px solid #31AFD7;
	padding: 0 20px;
	margin-right: 10px;
}

input[type="file"]::-webkit-file-upload-button:hover {
	background-color: white !important;
	color: #31AFD7 !important;
}








// ===================================================
// ABOUT US PAGE STYLES - From Template
// ===================================================


.page-template-page-uber_uns{

	#primary{
		margin-top: 100px;
	}






	
	// Hero Section with Team Image and Banner –––––––––––––––––––––––––––––––––––––––––––––––––
	.hero-section {
		position: relative;
		height: 600px;
		overflow: hidden;
		
		@include media-breakpoint-down(sm) {
			height: 400px;
		}
		
		@include media-breakpoint-down(xs) {
			height: 200px;
		}
		
		.hero-image {
			width: 100%;
			height: 100%;
			
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: center;
				display: block;
			}
		}
		
		.hero-banner {
			position: absolute;
			bottom: 0;
			left: 0;
			right: 0;
			z-index: 2;
			padding: 0 0 115px 0;
			
			@include media-breakpoint-down(sm) {
				padding: 15px 0;
			}
			
			@include media-breakpoint-down(xs) {
				padding: 10px 0;
			}
			
			.container {
				position: relative;
				
				.col-12 {
					display: flex;
					justify-content: flex-start;
				}
			}
		}
		
		.hero-title {
			font-size: 4rem;
			font-weight: 400;
			color: #31AFD7;
			margin: 0;
			font-family: "fs_untitled-medium";
			line-height: 1.2;
			background: rgba(255, 255, 255, 0.95);
			padding: 11px 20px 2px 20px;
			border-radius: 0;
			display: inline-block;
			
			@include media-breakpoint-down(sm) {
				font-size: 2rem;
				padding: 12px 20px;
			}
			
			@include media-breakpoint-down(xs) {
				font-size: 1.6rem;
				padding: 10px 15px;
			}
		}
	}






	// Statistics Section ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	.statistics-section {
		padding: 30px 0 0px 0;
		background: white;
		@include media-breakpoint-down(sm) {
			padding: 25px 0 0px 0;
		}
		
		@include media-breakpoint-down(xs) {
			padding: 0px 0 0px 0;
		}

		.statistics-grid {
			margin-bottom: 15px;
			
			// Bootstrap margin-bottom für Columns überschreiben
			.col-6, .col-lg-4 {
				margin-bottom: 0 !important;
			}
		}
		
		.stat-item {
			background: transparent;
			padding: 20px 10px;
			
			@include media-breakpoint-down(xs) {
				padding: 20px 15px;
			}
		}
		
		.stat-number {
			font-size: 3.5rem;
			font-weight: 400;
			color: #31AFD7;
			margin-bottom: 5px;
			font-family: "fs_untitled-regular";
			line-height: 1;
			display: inline;
			
			@include media-breakpoint-down(sm) {
				font-size: 2.5rem;
			}
			
			@include media-breakpoint-down(xs) {
				font-size: 2rem;
			}
		}
		
		.stat-percent,
		.stat-suffix {
			font-size: 3.5rem;
			font-weight: 400;
			color: #31AFD7;
			font-family: "fs_untitled-regular";
			
			@include media-breakpoint-down(sm) {
				font-size: 2.5rem;
			}
			
			@include media-breakpoint-down(xs) {
				font-size: 2rem;
			}
		}
		
		.stat-label {
			font-size: 2rem !important;
			color: #31AFD7;
			margin: 10px 0 0 0;
			font-weight: 400;
			font-family: "fs_untitled-regular";
			line-height: 1!important;
			
			@include media-breakpoint-down(sm) {
				font-size: 1.5rem !important;
			}
			
			@include media-breakpoint-down(xs) {
				font-size: 1.1rem !important;
			}
		}
	}






	// Generic Section Titles –––––––––––––––––––––––––––––––––––––––––––––––––
	.section-title {
		font-size: 3.0rem;
		font-weight: 400;
		color: #31AFD7;
		margin-bottom: 0px;
		font-family: "fs_untitled-regular";
		text-align: left;
		
		@include media-breakpoint-down(sm) {
			font-size: 2.5rem;
		}
		
		@include media-breakpoint-down(xs) {
			font-size: 2rem;
		}
	}
	
	.section-subtitle {
		font-size: 2.4rem !important;
		line-height: 1!important;
		color: #31AFD7;
		margin-bottom: 25px;
		text-align: left;
		font-weight: 400;
		font-family: "fs_untitled-regular";
		
		@include media-breakpoint-down(sm) {
			font-size: 2rem !important;
			margin-bottom: 20px;
		}
		
		@include media-breakpoint-down(xs) {
			font-size: 1.6rem !important;
			line-height: 1.2!important;
			margin-bottom: 15px;

		}
	}
	
	// Generic Section Text –––––––––––––––––––––––––––––––––––––––––––––––––
	.section-text {
		p {
			font-size: 1.6rem !important;
			line-height: 1.5 !important;
			color: #495057;
			font-family: "fs_untitled-regular";
			text-align: left;
			margin-bottom: 1.5rem;
			
			@include media-breakpoint-down(sm) {
				font-size: 1.4rem !important;
			}
			
			@include media-breakpoint-down(xs) {
				font-size: 1.2rem !important;
			}
			
			strong {
				font-family: "fs_untitled-bold";
				font-weight: 400;
				color: inherit;
			}
			
			&:last-child {
				margin-bottom: 0;
			}
		}
	}






	// Nah. Digital. Persönlich Section –––––––––––––––––––––––––––––––––––––––––––––––––
	.nah-digital-section {
		padding: 50px 0 0 0;
		background: white;
		
		@include media-breakpoint-down(xs) {
			padding: 30px 0;
		}
		
		.content-with-image {
			margin-top: 50px;
		}
		
		.image-container-fullwidth {
			position: relative;
			margin-bottom: 40px;
			
			@include media-breakpoint-down(xs) {
				margin-bottom: 20px;
			}

			img {
				width: 100%;
				height: auto;
				border-radius: 0;
				box-shadow: none;
			}
		}
		
		.image-caption-cycling {
			background: rgba(255, 255, 255, 0.95);
			color: #31AFD7;
			padding: 27px 20px 18px 20px;
			border-radius: 0;
			font-weight: 400;
			text-align: left;
			position: absolute;
			bottom: 90px;
			left: 45px;
			font-family: "fs_untitled-regular";
			font-size: 3.0rem;
			transition: color 0.25s ease-in-out, width 0.25s ease-in-out;
			display: inline-block;
			white-space: nowrap;
			
			@include media-breakpoint-down(md) {
				bottom: 15px;
				left: 15px;
				padding: 12px 20px;
				font-size: 1.4rem;
			}
			
			@include media-breakpoint-down(xs) {
				bottom: 10px;
				left: 10px;
				padding: 10px 15px 7px 15px;
				font-size: 1.4rem;
			}
		}
		
		// Service Links in Nah Digital Section
		.service-links-nah {
			display: flex;
			flex-direction: column;
			gap: 10px;
			margin-top: 40px;
			align-items: flex-start;
		}
		
		.service-link-nah {
			color: #31AFD7;
			font-size: 1.6rem;
			font-family: "fs_untitled-regular";
			font-weight: 400;
			text-decoration: none;
			line-height: 1.2;
			
			@include media-breakpoint-down(sm) {
				font-size: 1.4rem;
			}
			
			@include media-breakpoint-down(xs) {
				font-size: 1.2rem;
			}
		}
		
		
		.company-description {
			font-size: 1.7rem !important;
			line-height: 1.5!important;
			color: #495057;
			margin: 0 auto;
			font-family: "fs_untitled-regular";
			
			@include media-breakpoint-down(sm) {
				font-size: 1.1rem;
				text-align: left;
			}
			
			strong {
				color: #31AFD7;
				font-weight: 600;
			}
		}
	}






	// Team Section –––––––––––––––––––––––––––––––––––––––––––––––––
	.team-section {
		padding: 75px 0 0 0;
		background: white;
		
		@include media-breakpoint-down(xs) {
			padding: 0px 0;
		}
		
		// Team Carousel
		.team-carousel {
			margin-top: 0px;
			
			.carousel-inner {
				background: linear-gradient(135deg, #31AFD7 0%, #2694b8 100%);
				padding: 0;
			}
		}
		
		.team-slide {
			height: 600px;
			display: flex;
			align-items: flex-start;
			
			@include media-breakpoint-down(md) {
				height: auto;
				flex-direction: column;
			}
		}
		
		.team-image {
			padding: 20px;
			height: 600px;
			display: flex;
			align-items: center;
			
			@include media-breakpoint-down(md) {
				height: 450px;
				width: 100%;
			}

			@include media-breakpoint-down(xs) {
				height: 400px;
			}
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: center;
				border-radius: 0;
				box-shadow: none;
			}
		}
		
		.team-content {
			padding: 40px 40px 20px 0px ;
			color: white;
			height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: flex-start;
			
			@include media-breakpoint-down(md) {
				height: auto;
				padding: 20px;
			}
			
			@include media-breakpoint-down(sm) {
				padding: 0px 20px 20px 20px; 
			}
		}
		
		.team-member-name {
			font-size: 2.5rem;
			font-weight: 400;
			color: white;
			margin-bottom: 30px;
			font-family: "fs_untitled-regular";
			line-height: 1.2;
			
			@include media-breakpoint-down(md) {
				font-size: 2rem;
				margin-bottom: 20px;
			}
			
			@include media-breakpoint-down(sm) {
				font-size: 1.5rem;
				margin-bottom: 15px;
			}
		}
		
		.team-quote {
			p {
				font-size: 1.6rem !important;
				line-height: 1.5 !important;
				color: white;
				font-family: "fs_untitled-regular";
				font-weight: 400;
				margin-bottom: 1rem;
				
				@include media-breakpoint-down(md) {
					font-size: 1.3rem !important;
				}
				
				@include media-breakpoint-down(sm) {
					font-size: 1.1rem !important;
				}
				
				&:last-child {
					margin-bottom: 0;
				}
			}
			
			@include media-breakpoint-down(sm) {
				padding: 0;
			}
		}
		
		// Carousel Indicators
		.team-indicators {
			position: relative;
			bottom: auto;
			margin-top: 10px;
			margin-bottom: 0;
			justify-content: center;
			
			li {
				width: 60px;
				height: 25px;
				border-radius: 0;
				background-color: transparent;
				border: none;
				margin: 0 5px;
				padding: 10px 0;
				position: relative;
				cursor: pointer;
				
				&:before {
					content: '';
					position: absolute;
					top: 10px;
					left: 0;
					width: 100%;
					height: 5px;
					background-color: rgba(49, 175, 215, 0.3);
					transition: background-color 0.3s ease, transform 0.2s ease;
				}
				
				&.active:before {
					background-color: #31AFD7;
				}
				
				&:hover:before {
					background-color: rgba(49, 175, 215, 0.8);
					transform: scaleY(1.2);
				}
				
				&.active:hover:before {
					background-color: #1a7a96;
					transform: scaleY(1.2);
				}
			}
		}
	}






	// Vision and Mission Section –––––––––––––––––––––––––––––––––––––––––––––––––
	.vision-mission-section {
		padding: 0;
		background: white;
		overflow: hidden;
		margin-top: 150px;
		
		@include media-breakpoint-down(xs) {
			margin-top: 0px;
		}	


		.vision-mission-wrapper {
			position: relative;
			height: 500px;
			display: flex;
			align-items: center;
			
			@include media-breakpoint-down(md) {
				height: auto;
				flex-direction: column;
			}
		}
		
		.vision-mission-image {
			position: absolute;
			top: 0;
			left: 0;
			width: calc(50% - 40px);
			height: 100%;
			z-index: 1;
			
			@include media-breakpoint-down(md) {
				position: relative;
				width: 100%;
				height: 350px;
				order: 1;
			}
			
			@include media-breakpoint-down(sm) {
				height: 300px;
			}
			
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: center;
			}
		}
		
		.vision-mission-content {
			position: relative;
			z-index: 2;
			width: 100%;
			height: 100%;
			padding: 0;
			display: flex;
			align-items: flex-start;
			
			@include media-breakpoint-down(md) {
				position: relative;
				order: 2;
				padding: 40px 0;
			}
			@include media-breakpoint-down(xs) {
				padding: 15px 0 0 0;
			}
		}
		
		.content-wrapper {
			background: white;
			padding: 0 40px 40px 0;
			margin-top: 0;
			margin-left: 0;
			
			@include media-breakpoint-down(md) {
				padding: 20px;
				margin: 0;
			}
			@include media-breakpoint-down(xs) {
				padding: 20px 0 20px 0;
			}
		}
		
		.vision-box,
		.mission-box {
			margin-bottom: 40px;
			
			@include media-breakpoint-down(xs) {
				padding: 0px;
			}
			
			&:last-child {
				margin-bottom: 0;
			}
			
			h3 {
				font-size: 2.5rem;
				font-weight: 400;
				margin-bottom: 20px;
				color: #31AFD7;
				font-family: "fs_untitled-regular";
				line-height: 1.2;
				
				@include media-breakpoint-down(sm) {
					font-size: 2rem;
				}
				
				@include media-breakpoint-down(xs) {
					font-size: 1.6rem;
				}
			}
			
			p {
				font-size: 1.6rem !important;
				line-height: 1.5 !important;
				color: #495057;
				font-family: "fs_untitled-regular";
				margin: 0;
				
				@include media-breakpoint-down(sm) {
					font-size: 1.4rem !important;
				}
				
				@include media-breakpoint-down(xs) {
					font-size: 1.2rem !important;
				}
			}
		}
	}






	// Subsidiary Section –––––––––––––––––––––––––––––––––––––––––––––––––
	.subsidiary-section {
		padding: 0;
		background: white;
		
		@include media-breakpoint-down(xs) {
			padding: 30px 0;
		}
		
		.subsidiary-header {
			padding: 100px 0 40px 0;
			background: white;
			.section-subtitle{
				margin-bottom: 0px;
			}
			@include media-breakpoint-down(xs) {
				padding: 0px 0 20px 0;
			}
		}
		
		.subsidiary-wrapper {
			position: relative;
			height: 500px;
			display: flex;
			align-items: center;
			margin-bottom: 250px;
			
			@include media-breakpoint-down(md) {
				height: auto;
				flex-direction: column;
			}
			@include media-breakpoint-down(xs) {
				margin-bottom: 20px;
			}
		}
		
		.subsidiary-image {
			position: absolute;
			top: 0;
			right: 0;
			width: calc(50% - 40px);
			height: 100%;
			z-index: 1;
			
			@include media-breakpoint-down(md) {
				position: relative;
				width: 100%;
				height: 350px;
				order: 1;
			}
			
			@include media-breakpoint-down(sm) {
				height: 300px;
			}
			
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: center;
			}
		}
		
		.subsidiary-content {
			position: relative;
			z-index: 2;
			width: 100%;
			height: 100%;
			padding: 0;
			display: flex;
			align-items: flex-start;
			
			@include media-breakpoint-down(md) {
				position: relative;
				order: 2;
				padding: 40px 0;
			}
			@include media-breakpoint-down(xs) {
				padding: 15px 0 0 0;
			}
		}
		
		.content-wrapper-subsidiary {
			background: white;
			padding: 0;
			margin: 0;
			
			@include media-breakpoint-down(md) {
				padding: 20px;
				margin: 0;
			}
			@include media-breakpoint-down(xs) {
				padding: 0px;
			}
		}
		
		.intro-text {
			p {
				font-size: 1.6rem !important;
				line-height: 1.5 !important;
				color: #495057;
				font-family: "fs_untitled-regular";
				margin-bottom: 1rem;
				
				@include media-breakpoint-down(sm) {
					font-size: 1.4rem !important;
				}
				
				@include media-breakpoint-down(xs) {
					font-size: 1.2rem !important;
				}
				
				&:last-child {
					margin-bottom: 30px;
				}
			}
		}
		
		.feature-item {
			margin-bottom: 30px;
			
			h4 {
				font-size: 1.6rem;
				font-weight: 400;
				color: #495057;
				margin-bottom: 10px;
				font-family: "fs_untitled-bold";
			}
			
			p {
				font-size: 1.6rem !important;
				line-height: 1.5 !important;
				color: #495057;
				font-family: "fs_untitled-regular";
				margin: 0;
				
				@include media-breakpoint-down(sm) {
					font-size: 1.4rem !important;
				}
				
				@include media-breakpoint-down(xs) {
					font-size: 1.2rem !important;
				}
			}
		}
	}

}

// ===================================================
// HOME PAGE FEATURES SECTION
// ===================================================


html {
	scroll-behavior: smooth;
	scroll-padding-top: 120px; 
}

.features-section {
	padding: 70px 0;
	background: white;
	
	@include media-breakpoint-down(md) {
		padding: 30px 0;
	}
}

.features-title {
	font-size: 3.5rem;
	font-weight: 400;
	color: #31AFD7;
	margin-bottom: 20px;
	font-family: "fs_untitled-medium";
	text-align: left;
	line-height: 1.2;
	padding-right: 220px;

	@include media-breakpoint-down(md) {
		font-size: 2.8rem;
		padding-right: 0px;
	}
	
	@include media-breakpoint-down(sm) {
		font-size: 2.2rem;
		padding-right: 0px;
	}
}

.features-subtitle {
	font-size: 2.4rem !important;
	color: #31AFD7;
	margin-bottom: 40px;
	font-family: "fs_untitled-regular";
	font-weight: 400;
	text-align: left;
	line-height: 1.2;
	
	@include media-breakpoint-down(md) {
		font-size: 2rem !important;
	}
	
	@include media-breakpoint-down(sm) {
		font-size: 1.6rem !important;
	}
}

.features-text {
	font-size: 1.6rem !important;
	line-height: 1.5 !important;
	color: #495057;
	font-family: "fs_untitled-regular";
	margin-bottom: 40px;
	text-align: left;
	
	@include media-breakpoint-down(md) {
		font-size: 1.4rem !important;
	}
	
	@include media-breakpoint-down(sm) {
		font-size: 1.2rem !important;
	}
}

.features-buttons {
	display: flex;
	gap: 20px;
	margin-bottom: 60px;
	flex-wrap: wrap;
	
	@include media-breakpoint-down(sm) {
		gap: 15px;
		margin-bottom: 40px;
		justify-content: center;
	}
}

.features-btn {
	background: #31AFD7;
	color: white;
	padding: 8px 30px 5px 30px;
	border-radius: 25px;
	text-decoration: none;
	font-size: 1.1rem;
	font-weight: 400;
	font-family: "fs_untitled-medium";
	transition: all 0.3s ease;
	display: inline-block;
	border: 2px solid #31AFD7;
	white-space: nowrap;
	
	&:visited {
		color: white;
	}
	
	&:hover {
		background: white;
		color: #31AFD7;
		text-decoration: none;
	}
	
	@include media-breakpoint-down(sm) {
		text-align: center;
		padding: 8px 25px 5px 25px;
	
	}
}

.features-icons {
	margin-top: 40px;
}

// Mobile adjustments for columns
@include media-breakpoint-down(md) {
	.features-icons .col-6 {
		padding-left: 20px;
		padding-right: 20px;
	}
	
	// Ungerade Spalten (links): Tooltip nach rechts verschieben
	.features-icons .col-6:nth-child(odd) .feature-tooltip {
		left: calc(50% + 25px);
	}
	
	// Gerade Spalten (rechts): Tooltip nach links verschieben
	.features-icons .col-6:nth-child(even) .feature-tooltip {
		left: calc(50% - 25px);
	}
}

@include media-breakpoint-down(sm) {
	.features-icons .col-6 {
		padding-left: 25px;
		padding-right: 25px;
	}
	
	// Ungerade Spalten (links): Tooltip nach rechts verschieben
	.features-icons .col-6:nth-child(odd) .feature-tooltip {
		left: calc(50% + 25px);
	}
	
	// Gerade Spalten (rechts): Tooltip nach links verschieben
	.features-icons .col-6:nth-child(even) .feature-tooltip {
		left: calc(50% - 25px);
	}
}

.feature-item {
	text-align: center;
	margin-bottom: 30px;
	position: relative;
	cursor: pointer;
	transition: transform 0.3s ease;
	
	@include media-breakpoint-down(lg) {
		margin-bottom: 40px;
	}
}

.feature-icon {
	width: 80px;
	height: 80px;
	margin: 0 auto 20px auto;
	display: flex;
	align-items: center;
	justify-content: center;
	
	@include media-breakpoint-down(md) {
		width: 60px;
		height: 60px;
		margin-bottom: 15px;
	}
	
	img {
		width: 100%;
		height: 100%;
		object-fit: contain;
	}
}


.feature-icon-rocket {
	img {
		width: 65px;
		height: 65px;
		
		@include media-breakpoint-down(md) {
			width: 50px;
			height: 50px;
		}
	}
}

.feature-icon-wlan {
	img {
		width: 80px;
		height: 80px;
		
		@include media-breakpoint-down(md) {
			width: 60px;
			height: 60px;
		}
	}
}

.feature-icon-house {
	img {
		width: 60px;
		height: 60px;
		
		@include media-breakpoint-down(md) {
			width: 55px;
			height: 55px;
		}
	}
}

.feature-icon-hands {
	img {
		width: 85px;
		height: 85px;
		
		@include media-breakpoint-down(md) {
			width: 65px;
			height: 65px;
		}
	}
}

.feature-label {
	font-size: 1.9rem !important;
	color: #31AFD7;
	font-family: "fs_untitled-regular";
	font-weight: 400;
	margin: 0;
	line-height: 1.2;
	display: inline-block;
	transition: all 0.3s ease;
	
	@include media-breakpoint-down(md) {
		font-size: 1.2rem !important;
		border: 2px solid #31AFD7;
		border-radius: 30px;
		padding: 6px 15px 4px 15px;
	}
	
	@include media-breakpoint-down(sm) {
		font-size: 1.2rem !important;
		border: 2px solid #31AFD7;
		border-radius: 30px;
		padding: 5px 12px 3px 12px;
	}
}



.feature-tooltip {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: white;
	color: #31AFD7;
	border: 4px solid #31AFD7;
	border-radius: 12px;
	padding: 20px;
	width: 280px;
	max-width: 90vw;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
	z-index: 1000;
	margin-bottom: 15px;
	box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.2);
	
	@include media-breakpoint-down(md) {
		max-width: calc(100vw - 80px);
		right: auto;
	}
	
	@include media-breakpoint-down(xs) {
		width: 260x;
		max-width: calc(100vw - 60px);
		padding: 20px;
		margin-bottom: 12px;
	}
	
	@media (max-width: 576px) {
		width: 260px;
		max-width: calc(100vw - 50px);
		padding: 20px;
		border-radius: 8px;
		margin-bottom: 10px;
	}
}

// Tooltip positioning for mobile 2x2 grid - ungerade Spalten (links)
.features-icons .col-6:nth-child(odd) .feature-tooltip {
	@include media-breakpoint-down(md) {
		left: calc(50% + 30px) !important;
	}
}

// Tooltip positioning for mobile 2x2 grid - gerade Spalten (rechts)
.features-icons .col-6:nth-child(even) .feature-tooltip {
	@include media-breakpoint-down(md) {
		left: calc(50% - 30px) !important;
	}
}

.tooltip-content {
	p {
		margin: 0;
		font-size: 14px;
		line-height: 1.4;
		text-align: left;
		color: #31AFD7;
		
		@include media-breakpoint-down(xs) {
			font-size: 13px;
		}
		
		@media (max-width: 576px) {
			font-size: 12px;
		}
	}
}

@include media-breakpoint-up(md) {
	.feature-item {
		&:hover {
			transform: scale(1.05);
			
			.feature-tooltip {
				opacity: 1;
				visibility: visible;
			}
		}
	}
}

@include media-breakpoint-down(sm) {
	.feature-item {
		&.active {
			.feature-tooltip {
				opacity: 1;
				visibility: visible;
			}
		}
	}
}

// ===================================================
// NEWS & REVIEWS CAROUSEL - MOBILE VIEW
// ===================================================

@include media-breakpoint-down(lg) {
	.news,
	.google-reviews {
		// Container für das Karussell
		.news-carousel-container {
			position: relative;
			overflow: hidden;
			margin: 0 -15px;
		}
		
		// Karussell-Wrapper
		.news-carousel {
			display: flex;
			transition: transform 0.5s ease-in-out;
			
			.wrapper {
				flex: 0 0 100%;
				max-width: 100%;
				padding: 0 15px;
				margin-bottom: 0 !important;
				
				&:first-child {
					margin-bottom: 0 !important;
				}
				a{
					min-height:210px !important;
				}
			}
		}
		
		// Navigation Buttons and Indicators
		.carousel-nav {
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			gap: 30px;
			margin-top: 10px;
			margin-bottom: 2px;
			flex-wrap: nowrap;
			
			button {
				background: transparent !important;
				border: none !important;
				border-radius: 0;
				width: 40px;
				height: 40px;
				display: flex;
				align-items: center;
				justify-content: center;
				cursor: pointer;
				transition: all 0.3s ease;
				padding: 0;
				flex-shrink: 0;
				
				&:hover:not(:disabled) {
					&::before {
						border-color: #31AFD7;
					}
				}
				
				&:disabled {
					opacity: 0.3;
					cursor: not-allowed;
				}
				
				// Arrow Styles - 90 degree angles
				&::before {
					content: '';
					display: block;
					width: 12px;
					height: 12px;
					border-top: 2px solid white;
					border-left: 2px solid white;
					transition: border-color 0.3s ease;
				}
				
				&.carousel-prev::before {
					transform: rotate(-45deg);
				}
				
				&.carousel-next::before {
					transform: rotate(135deg);
				}
			}
			
			// Indicator Dots (inside carousel-nav)
			.carousel-indicators {
				display: flex;
				justify-content: center;
				align-items: center;
				gap: 8px;
				list-style: none;
				padding: 0;
				margin: 0;
				position: relative;
				
				li {
					width: 10px;
					height: 10px;
					border-radius: 50%;
					background: rgba(255, 255, 255, 0.5);
					cursor: pointer;
					transition: all 0.3s ease;
					border: none;
					
					&.active {
						background: white;
						transform: scale(1.2);
					}
				}
			}
		}
		
		// Google Reviews specific styles
		&.google-reviews {
			.reviews-carousel-container {
				position: relative;
				overflow: hidden;
				margin: 0 -15px;
			}
			
			.wrapper {
				// Ensure review items display correctly
				> * {
					width: 100%;
					min-height: 200px;
				}
				.grs-card{
					margin-bottom: 0px !important;
				}
			}
			
			// Carousel Navigation in Blau für weißen Hintergrund
			.carousel-nav {

				margin-top: 8px;
				margin-bottom: 15px;
				
				button {
					&::before {
						border-top: 2px solid #31AFD7;
						border-left: 2px solid #31AFD7;
					}
					
					&:hover:not(:disabled) {
						&::before {
							border-color: #1a7a96;
						}
					}
					
					&:disabled {
						&::before {
							border-color: rgba(49, 175, 215, 0.3);
						}
					}
				}
				
				.carousel-indicators {
					li {
						background: rgba(49, 175, 215, 0.3);
						
						&.active {
							background: #31AFD7;
						}
					}
				}
			}
		}
	}
}