@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-v47-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/roboto-v47-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-condensed-v27-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

:root {
	
	--font-size: 20px;
	--main-padding-lr: 30px;
	--main-padding-tb: 20px;
	--blog-gap: 12px;
	--grid-gap: 30px;		
	
	--blau: #276485;
	--hellblau: #E9F0F3;
	--gruen: #008D36;
	--hellgruen: #ECF3DA;
	--grasgruen: #93c01f;
	--mittelgrau: #B1B1B1;
	--schwarz: #1D1D1B;
	--btn-off: #cccccc;
	
}

body {
	font-size: var(--font-size);
	color: var(--schwarz);
	position: relative;
	background-color: #222222;
}

h1,
.itemid-218 h2 {
	font-family: 'Roboto';
	font-weight: 600;
	text-transform: uppercase;
	font-size: 1.35em;
	color: var(--blau);
	margin: 0px 0px 0.3em;	
}
h4 {
	
}
.btn {
	display: block;
}
.btn-plus {
	background: transparent url(../images/birkit/plus.svg) center center/contain no-repeat;
}
div .btn:disabled, 
div .btn.disabled, 
div fieldset:disabled .btn {
	background-color: var(--btn-off);
	border-color: var(--mittelgrau);
}
.acc_btn {
	display: block;
	width: 27px;
	height: 14px;
	background: transparent url(../images/birkit/down.svg) center center/contain no-repeat;
}
.open .acc_btn {
	transform: rotate(180deg);
	width: 100%;
}
.blog .acc_btn {
	margin: 0px auto;
}
.mobile-btn {
	display: block;
}
.mobile-btn-left {
	background: transparent url(../images/birkit/left.svg) left center/contain no-repeat;
	width: 1.2em;
}
.mobile-btn-right {
	background: transparent url(../images/birkit/right.svg) right center/contain no-repeat;
	width: 1.2em;	
}
.mobile-btn-cancel {
	background: transparent url(../images/birkit/cancel.svg) center center/contain no-repeat;
	width: 0.8em;	
}
.cck-pos-mainbody .btn-mini {
	width: 1.6em;
	height: 1.6em;
}

header,
#content,
footer {
	max-width: 1200px;
	margin: 0px auto;
	width: 100%;
	background-color: var(--hellblau);	
}
.container-header {
	background: none;
	box-shadow: none;
}
.mod-title {
	padding: var(--main-padding-tb) var(--main-padding-lr);	
}
.mod-title h1 {
	margin: 0px;
}
.mobile-menu {
	padding: var(--main-padding-tb) var(--main-padding-lr);
	display: grid;
	grid-template-columns: 45px auto 45px;
	grid-gap: var(--blog-gap);
}
.container-title ~ .mobile-menu {
	padding-top: 0px;
}
.mobile-menu p {
	margin: 0px;
}
.mobile-menu .mod-custom a {
	height: 1em;
}
.mobile-title * {
	text-align: center !important;
}
.mobile-title h2 {
	font-size: 1em;
	margin: 0px;
}

.container-component > :first-child, 
.container-sidebar-left > :first-child, 
.container-sidebar-right > :first-child, 
.container-component > * + *, 
.container-sidebar-left > * + *, 
.container-sidebar-right > * + * {
	margin: 0px;
}

.blog div.cck-pad-8 .cck-plr,
.blog div.cck-pad-8 .cck-ptb {
	padding: 0px;
}
.blog .cck-pad-8 > div {
	margin: 0px;
}

div div.vertical div.cck_forms,
div div.cck_forms.cck_site div.cck_form,
div div.vertical div.cck_contents,
div div.cck_contents.cck_item div.cck_value.cck_value_text {
	float: none;
}
div div.cck_contents.cck_item div.cck_label,
div div.cck_contents.cck_item div.cck_label label,
div div.cck_contents.cck_item div.cck_value {
	line-height: 1.3em;	 
}
div div.cck-f100,
div div.cck-line-body, 
div div.cck-line-header, 
div div.cck-line-top, 
div div.cck-line-bottom, 
div div.cck-line-footer {
	display: block;
	float: none;
}
div div.cck_forms input.inputbox, 
div div.cck_forms textarea.inputbox, 
div div.cck_forms select.inputbox, 
div div.cck_forms button.inputbox,
div div.cck_forms input.inputbox:focus, 
div div.cck_forms textarea.inputbox:focus, 
div div.cck_forms select.inputbox:focus, 
div div.cck_forms button.inputbox:focus {
	float: none !important;
}

div div.cck_contents.cck_intro div.cck_value.cck_value_wysiwyg_editor {
	padding: 0px;
}

.footer {
	color: var(--schwarz);
	background: #ffffff;
	margin: 0px;
	position: fixed;
	left: 50%;
	bottom: 0px;
	right: 50%;
	padding: var(--main-padding-tb) var(--main-padding-lr);	
	transition: bottom 0.2s ease-in;	
	width: 100%;
	transform: translateX(-50%);
}
.scrolled .footer {
	bottom: -81px;
	transition: bottom 0.6s ease-out;	
}
.footer > div {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}
.footer .mod-menu {
	flex-direction: row;
	align-items: center;
}
.footer .mod-menu a {
	display: block;
}
.footer .mod-menu a.home {
	width: 31px;
	height: 31px;
	font-size: 0px;
	background: transparent url(../images/birkit/home.svg) center center/contain no-repeat;
}
a.footer_icon {
	width: 41px;
	height: 41px;	
	display: block;
	border-radius: 50px;
	border: 2px solid var(--schwarz);
	text-align: center;
}
a.footer_icon img {
	max-width: 32px;
}

#content {
	padding-bottom: 100px;	
	min-height: 100vh;
}

#reise_head {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	margin-top: var(--main-padding-tb);
	position:relative;
}
#reise_head::before {
	content: "";
	position: absolute;
	left: 23px;
	right: 23px;	
	top: 13px;
	height: 2px;
	background-color: var(--mittelgrau);
}
#reise_head > div {
	position: relative;
	padding-top: 35px;
	font-weight: bold;
	color: var(--mittelgrau);	
}
.step1 #reise_head > div:nth-child(1),
.step2 #reise_head > div:nth-child(1),
.step2 #reise_head > div:nth-child(2),
.step3 #reise_head > div:nth-child(1),
.step3 #reise_head > div:nth-child(2),
.step3 #reise_head > div:nth-child(3),
.step4 #reise_head > div:nth-child(1),
.step4 #reise_head > div:nth-child(2),
.step4 #reise_head > div:nth-child(3),
.step4 #reise_head > div:nth-child(4),
.step5 #reise_head > div:nth-child(1),
.step5 #reise_head > div:nth-child(2),
.step5 #reise_head > div:nth-child(3),
.step5 #reise_head > div:nth-child(4),
.step5 #reise_head > div:nth-child(5) {
	color: var(--gruen);	
}
#reise_head > div::before {
	content: "";
	width: 14px;
	height: 14px;
	position: absolute;
	top: 7px;
	left: 50%;
	transform: translateX(-50%);
	display: block;
	border-radius: 50px;
	background-color: var(--mittelgrau);
}
.step1 #reise_head > div:nth-child(1)::before {
	width: 28px;
	height: 28px;	
	top: 0px;
	background-color: var(--gruen);
}
.step2 #reise_head > div:nth-child(1)::before,
.step2 #reise_head > div:nth-child(2)::before,
.step3 #reise_head > div:nth-child(1)::before,
.step3 #reise_head > div:nth-child(2)::before,
.step3 #reise_head > div:nth-child(3)::before,
.step4 #reise_head > div:nth-child(1)::before,
.step4 #reise_head > div:nth-child(2)::before,
.step4 #reise_head > div:nth-child(3)::before,
.step4 #reise_head > div:nth-child(4)::before,
.step5 #reise_head > div:nth-child(1)::before,
.step5 #reise_head > div:nth-child(2)::before,
.step5 #reise_head > div:nth-child(3)::before, 
.step5 #reise_head > div:nth-child(4)::before,
.step5 #reise_head > div:nth-child(5)::before {
	width: 28px;
	height: 28px;	
	top: 0px;
	background-color: var(--gruen);
}
#reise_karte {
	height: 0px;
	background: transparent url(../images/birkit/stationen3.jpg) center top/cover no-repeat;
	overflow: hidden;
	transition: padding 0.5s ease-in-out;
	max-height: 0px;	
	font-size: 0px;
	margin: var(--main-padding-tb) calc(-1 * var(--main-padding-lr));
}
.open #reise_karte {
	padding-bottom: 110%;
}

.layout-blog #content > div {
	background-color: #ffffff;
}


div.blog-items {
	display: block;
	margin: 0px;
}
.blog-items .blog-item {
	padding: var(--main-padding-tb) var(--main-padding-lr);
	background-color: var(--hellblau);
	margin-bottom: var(--blog-gap);	
}
.blog-items .blog-item:last-child {
	margin-bottom: 0px;
}

#seblod_form .cck-pos-bottombody {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	column-gap: var(--blog-gap);
}
#seblod_form div.vertical.cck-pos-bottombody div.cck_forms {
	width: auto;	
}

#item66 {
	background-color: var(--hellgruen);
}
#item66 h2 {
	color: var(--gruen);
}
#item70 {
	height: 150px;
	background: transparent url(../images/birkit/head_back.jpg) center center/cover no-repeat;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	margin-bottom: 0px;
}
.feedintro {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-end;
	column-gap: var(--main-padding-lr);
}
.feedintro p {
	margin: 0px;
}
.feedintro .btn-plus {
	background-position: right center;
}
.itemid-218 h1 {
	font-family: 'Roboto Condensed';
	font-weight: normal;
	text-transform: uppercase;
	text-align: center;
	font-size: 2.5em;
	background-color: #ffffff;
	color: var(--blau);
	padding: 0.1em 0.3em 0em;
	margin: 0px;	
}
div.cck-f100.birkitfeed {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	margin-top: var(--main-padding-tb);
	margin-left: calc(-1 * var(--main-padding-lr));
	margin-right: calc(-1 * var(--main-padding-lr));
	width: calc(100% + 2 * var(--main-padding-lr));
	background-color: var(--mittelgrau);
}
.birkitfeed > div {
	aspect-ratio: 1;
}
.birkitfeed .blog-middle {
	background-color: var(--hellblau);
	overflow: hidden;
}
.birkitfeed .cck_birkit_image .cck_value {
	aspect-ratio: 1;
}
.birkitfeed h4 {
	font-weight: normal;
	color: var(--blau);
	font-size: 1em;
}
.birkitfeed .cck_birkit_image a {
	display: block;
}
.birkitfeed .cck_birkit_image img {
	object-fit: cover;
	object-position: center;
	width: 100%;
	aspect-ratio: 1;
}
.birkitfeed .cck_article_introtext_text {
	background-color: var(--grasgruen);
}
.birkitfeed .cck_article_introtext_text a {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
	padding: var(--main-padding-tb) var(--main-padding-lr);
	aspect-ratio: 1;
	text-decoration: none;
	color: #ffffff;
}
.birkitfeed .feedmodal {
	grid-column: 1 / -1;
	display: none;	
	background-color: var(--hellblau);
	max-height: 0px;
	transition: max-height 0.5s ease-in-out;
	aspect-ratio: unset;
	overflow: hidden;
	position: relative;
}
.birkitfeed .feedmodal.fullwidth {
	display: block;
}
.birkitfeed .feedmodal.active {
	max-height: 2000px;
}
.birkitfeed .feedmodal .com-content-article {
	padding: var(--main-padding-tb) var(--main-padding-lr);	
}
.birkitfeed .feedmodal .cck_birkit_image {
	margin-bottom: var(--main-padding-tb);
}
.birkitfeed .feedmodal .cck_birkit_image .cck_value {
	margin-left: calc(-1 * var(--main-padding-lr));
	margin-right: calc(-1 * var(--main-padding-lr));
	width: calc(100% + 2 * var(--main-padding-lr));	
}
.birkitfeed .feedmodal .cck_art_created {
	margin-bottom: 0.5em;	
}
.birkitfeed .feedmodal .cck_birkit_name {
	font-weight: 600;
	margin-bottom: 0.5em;
}
.birkitfeed .feedmodal .cck_article_introtext_textarea {
	margin-bottom: var(--main-padding-tb);
}
.birkitfeed .feedmodal .close {
	position: absolute;
	top: var(--main-padding-tb);
	right: 0px;
	width: calc(2 * var(--main-padding-lr) + 1.6em);
	height: 3em;
	cursor: pointer;
	background: transparent url(../images/birkit/close.svg) center center/1.6em no-repeat;
}
.birkitfeed .feedmodal + .blind {
	display: none;
}
.birkitfeed .feedmodal.active + .blind,
.birkitfeed .feedmodal.active + .blind + div {
	max-height: 0px;
	display: block;
}
.birkitfeed .feedmodal.active + .blog-middle {
	display: none;
}
.birkitfeed .greenbox {
	padding: var(--main-padding-tb) var(--main-padding-lr);
	margin: calc(-1 * var(--main-padding-tb)) calc(-1 * var(--main-padding-lr));			
}
.cck_page {
	padding: var(--main-padding-tb) var(--main-padding-lr);		
}

.picbox {
	background-color: var(--grasgruen);
	width: 100%;
	aspect-ratio: 1;
	max-height: 40vh;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
.cropped .picbox {
	display: none;
}
div.vertical .picbox div.cck_forms.cck_image_choose_btn {
	width: auto;
}
#cropBox {
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	padding: var(--main-padding-tb) var(--main-padding-lr);	
	background-color: #000000;
	z-index: 100;
}
.cropping #cropBox {
	display: block;
}
#cropBoxInner {
	max-height: calc(100vh - 100px);
	margin-bottom: 1em;
}
#cropBox .btn-box .btn {
	display: inline-block;
	margin-right: 1em;
}
.cck_forms.cck_birkit_image {
	display: none;
}
#resultCanvas {
	margin: 0px auto;
}
.cck_forms.cck_birkit_datenschutz {
	display: grid;
	grid-template-columns: 1em auto;
	grid-template-rows: auto auto; 
	gap: 0.5em;
	margin-bottom: 0.5em;
}

div.vertical div.cck_forms.cck_site.cck_birkit_datenschutz div.cck_label {
	grid-column: 2;
	grid-row: 1;
	width: auto;
}

.cck_forms.cck_birkit_datenschutz .cck_form:nth-child(2) {
  grid-column: 1;
  grid-row: 1;
}

.cck_forms.cck_birkit_datenschutz .cck_desc {
  grid-column: 2;
  grid-row: 2;
}
div.cck_forms.cck_site.cck_birkit_datenschutz div.cck_form.cck_form_checkbox input {
	margin-top: 0.5em !important;
}
div.cck_forms.cck_site.cck_birkit_datenschutz div.cck_desc p {
	margin: 0px;
	font-size: 0.85em;
}
.greenbox {
	background-color: var(--grasgruen);
	color: #ffffff;
}

@media (max-width: 600px) {
	
	:root {
		--font-size: 16px;	
		--main-padding-lr: 15px;
		--main-padding-tb: 20px;
		--blog-gap: 12px;
		--grid-gap: 30px;		
		
	}
}
@media (max-width: 480px) {
	
	.itemid-218 h1 {
		font-family: 'Roboto Condensed';
		font-weight: normal;
		text-transform: uppercase;
		text-align: center;
		font-size: 2em;
		background-color: #ffffff;
		color: var(--blau);
		padding: 0.1em 0.3em 0em;
		margin: 0px;	
	}
}