/* ------------------------ m&t ------------------------------- */

@base: 1366px;
@correction: 6px;

@phone-portrait-2: 375px - @correction;
@phone-landscape: 421px - @correction;
@tablet-portrait: 768px - @correction;
@tablet-landscape: 1024px - @correction;
@desktop: 1366px - @correction;

@image_banner_font_base: 23px;
@main_font_base: 16px;

@mobile_frame: 15px;


/* ----- all screen sizes ----- */
	* {
		box-sizing: border-box;
	}


	a, a:visited {
		color:#575757;
	}

	a:hover {
		color:grey;
	}
	
	article ul, article ol {
		margin: 0 0 0.75em 0;
	}

	/* ----- fonts ----- */

	@font-face {
		font-family: Phenomena-Light;
		src: url('fonts/phenomena/Phenomena-Light.woff2') format('woff2'), url('fonts/phenomena/Phenomena-Light.woff') format('woff'), url('fonts/phenomena/Phenomena-Light.ttf') format('truetype'); 
	}

	@font-face {
	  font-family: Phenomena-Bold;
	  src: url('fonts/phenomena/Phenomena-Bold.woff2') format('woff2'), url('fonts/phenomena/Phenomena-Bold.woff') format('woff'), url('fonts/phenomena/Phenomena-Light.ttf') format('truetype');
	}

	@font-face {
		font-family: OpenSans-Regular;
		src: url('fonts/opensans/OpenSans-Regular.ttf') format('truetype'); 
	}

	@font-face {
		font-family: OpenSans-SemiBold;
		src: url('fonts/opensans/OpenSans-SemiBold.ttf') format('truetype'); 
	}
	
	#title_intro strong {
		font-family: Phenomena-Bold !important;
	}

	/* ----- design elements ----- */

	#footer_fixed, .preview_image_banner_outer, #title_image_banner, .title_image_banner_article, #title_image_banner_mobile_home {
		background-color: #009bd9;
		color: white;
	}
	
	
	h1, .carousel-caption .title {
		font-size: 1em;
	}
	
	#title_image_banner_article_2_levels  {
		.category_name {
			//font-size: 1em;
			//line-height: 1.25;
			display: none;
		}
		h1 {
			font-size: 1em; //0.6em;
			//line-height: 1.25;
			//margin-bottom: 0.5em; 
		}
	}
	
	
	.level-3 #title_image_banner, .level-3 .title_image_banner_article, .level-4 #title_image_banner, .level-4 .title_image_banner_article {
		background-color: #5ab88f;
		
	}

	#footer_fixed {
		border-top: 1px solid lightgrey;
		z-index: 11;
		position: relative;
	}

	body {
		font-family: OpenSans-Regular  !important;
		color: #575757 !important;
	}

	/* ----- editor ----- */
	.block-editor-writing-flow__click-redirect {
		display: none;
	}

	.acf-field-5eb7d2fdda177, .acf-field-5eb7d44c3f3fc {
		width: 30%;
		float: left;
	}


	/* backend */
	.block {
		display: block;
	}

/* ----- smartphones portrait----- */
	@adapt: 400px / @base; /* TODO adapt raus -> vw */
	@adapt_font_size: 14 / 16;
	
	
	#page {
		margin: 0 auto;
		padding: 0 @mobile_frame;
	}
	
	
	.page_area {
		//min-height: 100vh;
		//position: relative;
	}
	
	body {
		font-size: 16px * @adapt_font_size; //12px;
	}
	
	.article_content h1, .article_content h2, .article_content h3, .article_content h4, .article_content h5, .article_content h6 {
		margin: 1em 0 0.5em 0;
	}
	
	.article_content p {
		margin: 0.5em 0 0.5em 0;
	}


	/* ----- header ----- */
	header {
		height: 60px;
	}

	.custom-logo {
		//width: 120px;
		width: 84px;
	}
	
	#custom-logo-2 {
		//width: 120px;
		width: 120px;
		margin-top: 7px;
	}

	.site-branding {
		float: left;
		margin-top:12px;
	}
	
	#site-navigation, #site-navigation-2 {
		float: right;
		margin-right:0px;
		font-family: Phenomena-Bold !important;
		font-size:25px !important; /* TODO */
		//margin-top:32px;
	}
	
	#site-navigation div ul li a:hover, #site-navigation-2 div ul li a:hover {
		color: #5ab88f;
	}
	
	#site-navigation-2 {
		margin-top: 20px;
	}
	
	#site-navigation {
		display: none;
	}
	
	#quadmenu_0 {
		background-color: white !important;
		.quadmenu-navbar-nav {
			margin-top: 20px;
		}
	}
	
	#quadmenu .quadmenu-navbar-toggle {
		position: initial;
		margin: 0;
	}
	
	#wpbsearchform-mobile {
		display: block;
		width: 300px;
		position: absolute;
	}
	
	#search-wpb-mobile {
		float: right;
		margin-top: 25px;
		margin-right: 20px;		
	}
		
	
	#search-icon-mobile {
		display: inline-block;
		height: 23px;
		width: 22px;
		cursor: pointer;
	}

	#search-icon i {
		display: none;
	}
	
	#menu-item-back-to-page {
		display: none;
	}
	
	#menu-item-back-to-page_2 {
		display: none !important;
	}
	
	.term-gesundimjob.term-19 #menu-item-back-to-page_2 {
		display: block !important;
	}
	
	.term-gesundimjob.term-19 #menu-item-43 {
		display: none !important;
	}
	
	#menu-item-back-to-page {
		display: none !important;
	}

	/********************
	 * Search Navigation
	 ********************/

	.search-wpb .fa-search {
		color: #666666;
		font-weight: 900;
	}

	.search-wpb .fa-search:hover, 
	.search-wpb .fa-search:focus {
		color: #999999;
		text-decoration: none;
	}

	.wpbsearchform, #wpbsearchform-mobile {
		display: block;
		width: 100%;
		//position: absolute;
		right: 0;
		//top: 100%;
		margin-top: 1px;
		z-index: 99999;
		background-color: white; // rgba(200,199,197,0.8);
		padding: 5px;
		border-radius: 0;
		 -webkit-box-shadow: 0 1px 10px rgba(0,0,0,0.15);
		box-shadow: 0 1px 10px rgba(0,0,0,0.15);
		border: 1px solid #ccc;
	}
	
	.wpbsearchform {
		top: 100%;
	}

	.wpbsearchform form input:focus {
		color: #555;
	}

	.wpbsearchform input[type="search"] {
		border-radius: 0;
	}

	.wpbsearchform ::-moz-placeholder {
		color: #999 !important;
		font-weight: 300;
		opacity: 1;
	}

	.wpbsearchform ::-webkit-input-placeholder {
		color: #999 !important;
		font-weight: 300;
	}
	
	#search-icon {
		height: round(25px / 1360 * 1018); // 20px;
		width: round(24px / 1360 * 1018); //19px;
		cursor: pointer;
		margin-top: 3px;
	}
	
	#search_form_mobile_box {

	}
	
	#search_form_mobile {
		margin-left: 8px;
	}
	
	#search_field, #search_button {
		border-radius: 2px;
	}
	
	#search_button {
		padding: 3px 1px;
	}
	
	/* ----- content ----- */
	
	/* .carousel-caption, #title_image_banner, .title_image_banner_article {
		bottom: 30px;
		width: 225px;
		height: 29px;
		line-height: 29px;
		padding-left: 34px;
		background-color: #41abdc;
		color: white;
		font-family: Phenomena-Light;
		font-size: 18px; 
	} */
	
	
	#top-slider {
		display: none;
	}
	
	#myCarousel {
		z-index: -1;
	}
	
	.carousel-caption, #title_image_banner, #title_image_banner_mobile_home {
		font-family: Phenomena-Light !important;
		font-size: 5.5vw; // 15px; //round(@adapt * @image_banner_font_base);
		color: white;
		line-height: 9vw; //round(@adapt * 45px);
		padding: 0 2.5vw; //round(@adapt * 20px);
		position: absolute;
		bottom: 0px;
		//margin-bottom: 85  / 400 * 100%;
		width: 210 / 400 * 100%; 
		bottom: 85 / 400 *100%;
		background-color: #009bd9;
		overflow: hidden;
		text-overflow: clip;
		h1, .category_name{
			overflow: hidden;
			text-overflow: clip;
			white-space: nowrap;
		}
	}
	
	.title_image_banner_article {
		font-family: Phenomena-Light !important;
		font-size: 5.5vw; // 15px; //round(@adapt * @image_banner_font_base);
		line-height: 9vw; //round(@adapt * 45px);
		padding: 0 2.5vw; //round(@adapt * 20px);
		position: absolute;
		bottom: 0px;
		//margin-bottom: 85  / 400 * 100%;
		width: 210 / 400 * 100%; 
		bottom: 85 / 400 * 100%; 
		overflow: hidden;
		text-overflow: clip;
		h1, .category_name {
			overflow: hidden;
			text-overflow: clip;
			white-space: nowrap;
		}
	}
	
	
	//@adapt: 667 / @base;
	.title_image_banner_article {
		/* bottom: round(120px * @adapt);
		width: round(450px * @adapt);
		height: round(58px * @adapt);
		line-height: round(58px * @adapt);
		padding-left: round(68px * @adapt);
		font-size: round(36px * @adapt);
		position: absolute; */
	}
	
	
	
	.carousel-item {
		width: 100%;
		padding-bottom: 350 / 400 *100%;
		position: relative;
	}
	
	.slider_image {
		width: 100%;
		height: 100%;
		position: absolute;
		//background-size: 100% 100%;
		background-position: top;
		background-size: 100% auto;
		background-repeat: no-repeat;
		background-size: cover;
		top: 0;
		background-color: lightgrey;
	}

	#title_image, #title_image_box, #title_image_box_article, #title_image_box_mobile_home {
		width: 100%; 
		background: lightgrey;
	}
	
	#title_image, #title_image_box {
		//padding-bottom: 350 / 400 * 100%;
	}
	
	#title_image_box_article {
		padding-bottom: 350 / 400 * 100%;
		//padding-bottom: 350 / 400 * 420 / 700 * 100%;
	}
	
	#title_image_category, #title_image_category_mobile {
		width: 100%;
		//height: 100%;
		//background-size: 100% 100%;
		//background-position: top;
		//background-size: 100% auto;
		//background-repeat: no-repeat;
		//background-size: cover;
		//position: absolute;
		//top: 0;
	}
	
	#title_image_article, #title_image_article_mobile {
		width: 100%;
		height: 100%;
		//background-size: 100% 100%;
		background-position: top;
		background-size: 100% auto;
		background-repeat: no-repeat;
		background-size: cover;
		position: absolute;
		top: 0;
	}
	
	#title_image_category, #title_image_article {
		display: none;
	}
	
	#title_image_box, #title_image_box_article, #title_image_box_mobile_home {
		position: relative;
		line-height: 1em;
	}

	#title_image_banner, .title_image_banner_article {
		position: absolute;
	}
	
	.carousel-indicators {
		bottom: 0 !important;
		margin-bottom: 1% !important;
	}
	
	.carousel-indicators li {
		width: 10px !important;
		height: 10px !important;
		border-radius: 100% !important;
		background-color: white !important;
		opacity: 1 !important;
	}
	
	.carousel-indicators .active {
		background-color: #009bd9 !important;
		opacity: 1 !important;
	}
	
	#title_intro {
		text-align: center;
		//padding: 0 10vw;
		margin: 11px 0;
	}
	
	#title_intro, #title_intro * {
		font-family: Phenomena-Light !important;
		font-size: 21px !important; //round(28px * @adapt);
		br {
			display: none;
		}
	}
	
	
	#short_message_outer {
		color: white;
		background-color: #009bd9;
		z-index: 10;
		position: absolute;
		display:none;
		overflow: hidden;
		text-overflow: clip;
	}
	
	#short_message {
		display: none;
		z-index: 11;
		overflow: hidden;
		text-overflow: clip;
	}

	.breadcrumbs {
		margin-top: round(14/18 * 20px);
		margin-bottom: round(14/18 * (80px-14px-20));
		a {
			white-space: nowrap;
		}
	}
	
	#primary, .article_content {
		//min-height: 50vh;
	}
	
	#page_outer {
		min-height: 100vh;
	}

	p {
		margin: 0;
	}
	
	.article_content, #preview_frame {
		width: 100%;
		margin: 0 auto;
	}
	
	.article_content, #preview_frame {
		padding: 0;
	}
	
	.column_3 {
		border-bottom: 1px solid #575757;
	}
	
	.article_content {
		h1 {
			font-size: 2em;
			margin: 1em 0 0.5em 0;
		}
		h2 {
			font-size: 1.4em;
			margin: 1em 0 0.5em 0;
		}
		h3 {
			font-size: 1.2em;
			margin: 1em 0 0.5em 0;
		}
		h4 {
			font-size: 1em;
			margin: 1em 0 0.5em 0;
		}
		h5 {
			font-size: 1em;
			margin: 1em 0 0.5em 0;
			font-weight: normal;
			text-decoration: underline;
		}
	}
	

	
	/* ----- category pages ----- */
	
	#preview_frame {
		/* text-align: center; */
	}
	
	.preview_box {
		margin: 0 auto;
		display: block;
		width: 100%
	}
	
	.preview_image_box {
		width:100%;
		padding-bottom: 350 / 400 *100%;
		position: relative;
		margin: 5vw 0;
	}
	
	.preview_image {
		position: absolute;
		top: 0;
		height: 100%;
		width: 100%;
		background-color: lightgrey;
		border: 0;
		background-repeat: no-repeat;
		background-size: cover;
	}
	
	.preview_text_box, .preview_text_box p {
		max-width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	
	.preview_text_headline {
		font-weight: bold;
	}
	
	
	.preview_text_box_outer, .preview_link {
		display: none;
	}
	
	.preview_text_box_outer.search {
		display: block;
		margin-top: 0;
	}

	.preview_image_link {
		text-decoration: none;
		//position: relative;
	}
	
	.preview_image {
		max-width: 100%;
		line-height: initial;
	}
	
	.preview_image_banner_outer {
		//width: 210 / 400 * 100%; 
		//padding-bottom: 40 / 400 *100%;
		//position: absolute;
		//bottom: 85 / 400 *100%;
		//background-color: #41abdc;
	}
	
	.preview_image_banner_outer {
		font-family: Phenomena-Light !important;
		font-size: 5.5vw; // 15px; //round(@adapt * @image_banner_font_base);
		color: white;
		line-height: 9vw; //round(@adapt * 45px);
		padding: 0 2.5vw; //round(@adapt * 20px);
		position: absolute;
		bottom: 0px;
		//margin-bottom: 85  / 400 * 100%;
		width: 210 / 400 * 100%; 
		bottom: 85 / 400 *100%;
		background-color: #009bd9;
	}
	
	.preview_image_banner {
		overflow: hidden;
		text-overflow: clip;
		white-space: nowrap;
	}

/*	.preview_image_banner {
		font-family: Phenomena-Light;
		font-size: round(@adapt * @image_banner_font_base);
		color: white;
		width: 210 / 400 * 100%; 
		line-height: round(@adapt * 45px);
		padding: 0 round(@adapt * 20px);
		position: absolute;
		bottom: 0px;
		margin-bottom: 85  / 400 * 100%;
	} */

	.preview_link {
		text-decoration:none;
		position: relative;
		margin-bottom: 0.5em;
		max-width: 100%;
	}

	.preview_link, .preview_link:visited {
		color: initial;
	}

	.preview_link:hover {
		color: grey;
	}

	.preview_text_box_outer {
		width:inherit;
	}

	.preview_text_box_outer {
		margin-top: 11px;
	}
	
	
	/* short previews */
	
	#preview_frame_outer_short {
		background-color: #5ab88f;
		color: white;
		padding: 1em;
		margin-bottom: 22px;
	}
	
	#preview_frame_short {
		//column-count: 2;
		//column-rule: 1px solid white;
		//column-gap: 11px; 
		.preview_link_short {	
			margin: 0 auto;
			display: block;
			text-align: center;
		}
			
		.divider, .more, .intro {
			display: none;
		}
		span, a, a:visited {
			color: white;
		}
		
		a, a:visited {
			text-decoration: none;
		}
		//display: grid;
		//grid-template-columns: repeat(2, 1fr);
	}
	
	#preview_box_intro_short {
		display: none;
	}
	
	#preview_box_intro_mobile_short {
		margin-bottom: 1.5em;
	}
	
	.preview_box_short {
		margin-bottom: 1.5em;
	}
	
	/* search results */
	#preview_frame_search {
		//display: initial
	}
	
	.preview_box.search {
		display: flex;
		justify-content: space-between;
		margin-bottom: 12vw;
		border: none;
		min-height: initial;
	}
	
	#title_2 {
		font-family: Phenomena-Light !important;
		font-size: 2em;
		margin-bottom: 1em;
	}
	
	.preview_image_box_outer.search, .preview_text_box_outer.search { 
		float: left;
	}
	
	.preview_image_box_outer.search {
		width: 30%;
		padding-right: 3%;
	}
	
	.preview_image_box.search {
		margin: initial;
	}
	
	.preview_text_box_outer.search, .preview_text_box.search {
		//width: 75%;
	}
	
	.preview_text_box.search {
		display: initial;
	}
	
	.preview_title.search {
		font-weight: bold;
		font-size: 18px;
		line-height: 1;
		margin-bottom: 3px;
	}
		
		
	.preview_link.search {
		display: block;
	}
	
	.info_box .preview_text_box_outer {
		background-color: #009bd9;
		color: white;
	}
	
	.info_box.from_tablet_portrait, .info_box.tablet_portrait, .info_box.from_tablet_landscape { 
		display: none;
	}
	
	.info_box .preview_text_headline {
		font-family: Phenomena-Light !important;
	}
	
	/* content */
	.article_content p {
		margin-bottom: 10.5px;
	}
	
	/* faq-mobile-portrait */
	
	.page-fragen-und-antworten, .page-id-117, .term-fragen-und-antworten  {
		.article_content {
			grid-template-columns: repeat(2, 1fr);
		}
	}
	
	#sp-ea-370, #sp-ea-374 { 
		display: none;
	}
	
	.ea-header, .sp-easy-accordion, .ea-card, .sp-ea-single {
		border: none !important; 
	}
	
	.ea-body {
		padding: 7.5px 0 7.5px 15px !important;
	}
	
	.ea-header a  {
		padding: 7.5px 0 !important;
	}
	
	.ea-body {
		font-size: 16px * @adapt_font_size !important;
	}
	
	.article_content > div > div > div > h3 > a {
		background-color: white !important;
		font-size: 24px * @adapt_font_size !important;
	}
	
	.article_content > div > div > div > div > div > div > div > h3 > a, .article_content > div > div > div > div > div > div > div > h3 a, .ea-header a{
		background-color: white !important;
		font-size: 18px * @adapt_font_size !important;
		color: #878787 !important;
	}	
	
	.ea-expand-icon {
		float: right !important;
	}
	
	.ea-expand-icon {
		font-size: 1.2em !important;
	}
	
	.ea-expand-icon.fa-plus:before {
		content: "\f107" !important;
		color: #009bd9 !important;
	}
	
	.ea-expand-icon.fa-minus:before {
		content: "\f106" !important;
		color: #009bd9 !important;
	}
	
	/* directions-mobile-portrait */
	#directions {
		margin-bottom: 1em;
		border: 1px solid lightgrey;
	}
	
	
	/* ----- footer ----- */

	
	#footer, #footer_fixed {
		font-size: 3.2vw;
	}
	
	.footer_link, .footer_fixed_link, .footer_link:visited, .footer_fixed_link:visited {
		text-decoration: none;
		color: white;
		height: 100%;
	}
	
	#footer {
		background-color: #203876;
		color: white;
		padding: 0 2.5vw; /* TODO */
		margin: 28px auto 12vw auto;
		height: 9vw;
		line-height: 9vw;
		color:white;
		bottom: 0;
		//position: absolute;
		left: @mobile_frame;
		right: @mobile_frame;
	}
	
	
	.footer_link {
		margin-right:5px; /* TODO */
	}
	
	#footer_links {
		float:left;
		display: flex;
		justify-content: space-between;
		width: 100%;
		
		#footer_link_2 {
			text-align:center;
		}
		#footer_link_3 {
			text-align: right;
			margin-right: 0;
		}
	}
	
	#footer_link_4, #footer_link_5, #footer_link_6 {
		display: none;
	}
	

	#footer_adress {
		display: none;
	}
	
	.footer_link:hover, .footer_fixed_link:hover {
		color: lightgrey;
	}
	
	/* ***** footer_fixed ***** */
	
	#footer_fixed_outer {
		width: 100%;
		bottom: 0px;
		position: fixed;
		padding: 0 @mobile_frame;
	}
	
	#footer_fixed {
		height: 12vw;
		margin: 0 auto;
		padding: 0 2.5vw;
		display: flex;
		justify-content: space-between;
		width: 100%;
	}
	
	.footer_fixed_element {
		display: none;
	}
	
	.footer_fixed_element_mobile {
		float: left;
		margin-right: 2vw;
		margin-top: 0.9vw;
	}
	
	.footer_fixed_symbol.phone {
		height: 8vw;
		width: 8vw;
		margin-top: 1.1vw;
	}
	
	.footer_fixed_symbol.mail {
		height: 10vw;
		width: 10vw;
	}
	
	
	#footer_fixed_right {
		float: right;
		line-height: 6vw;
	}


@media screen and (min-width: @phone-portrait-2) {
/* footer only breakpoint */

	#footer, #footer_fixed {
		font-size: 2.8vw;
	}
	
	#footer_fixed {
		height: 10vw;
	}
	
	#footer_fixed_right {
		line-height: 10vw;
		#part_1, #part_2 {
			float: left;
		}
	}
	
	.footer_fixed_symbol.phone {
		height: 6.5vw;
		width: 6.5vw;
		margin-top: 0.7vw;
	}
	
	.footer_fixed_symbol.mail {
		height: 8vw;
		width: 8vw;
	}
	
	#footer {
		margin-bottom: 10vw;
		height: 20vw;
		font-size: 3.2vw;
	}
	
	#footer_adress {
		display: flex;
		justify-content: space-between;
		width: 100%;
	}
	
	/* TODO etwas Abstand bei footer_fixed nach unten wg. der Symbole */
	
}



/* ----- smartphones landscape ----- */
@media screen and (min-width: @phone-landscape) {

	/* ----- previews ----- */

	
	/* ----- content ----- */	
	/*
	.slider_image_mobile, #title_image_category_mobile, #title_image_article_mobile,  {
		display: none;
	}
	
	.slider_image, div#title_image_category, div#title_image_article {
		display: block;
	}
	
	img#slider_image, img#title_image_category, img#title_image_article {
		display: initial;
	}
	*/
	
	
	/* title-image-smartphone-landscape */
	
	#title_image_banner_article_2_levels  {
		.category_name {
			font-size: 1em;
			line-height: 1.25;
			display: block;
		}
		h1 {
			font-size: 0.6em;
			line-height: 1.25;
			margin-bottom: 0.5em; 
		}
	}
	
	
	
	
	/* search results */
	.preview_box.search {
		margin-bottom: 55px;
	}
	
	
	
	/* ***** footer_fixed ***** */
	#footer, #footer_fixed {
		font-size: 12px;
	}
	
	#footer {
		margin-bottom: 44px;
		height: 90px;
		line-height: 45px;
	}
	

	#footer_fixed {
		height: 45px;
		line-height: 45px;
	}
	
	.footer_fixed_symbol.phone {
		height: 31px;
		width: 31px;
		margin-top: 2.5px;
	}
	
	.footer_fixed_symbol.mail {
		height: 35px;
		width: 35px;
	}	
	
	#footer_fixed_right {
		line-height: inherit;
	}
	
	.footer_fixed_element_mobile {
		margin-top:5px;
		margin-right:8px;
		line-height: 1;
	}
	
	
	/* search results */
	.preview_image_box_outer.search {
		width: 30%;
		padding-right: 11px;
	}
	
}


@media screen and (min-width: 500px) { 
/* footer only  breakpoint */
	/* #footer_adress {
		display: initial;
		width: 100%;
		div {
			float: right;
			margin-left: 1em;
		}
	} */
}



/* ----- tablets portrait ----- */
@media screen and (min-width: @tablet-portrait) {

	@width: @tablet-portrait;
	@adapt: @tablet-portrait / @base;
	@adapt_2: @tablet-portrait / 1024px;
	@adapt_font_size: 322 / 388;
	
	body {
		font-size: 16px * @adapt_font_size;
	}
	
	.article_content h1, .article_content h2, .article_content h3, .article_content h4, .article_content h5, .article_content h6, .article_content p {
		margin-bottom: 0.5em; // 16px * 322 / 388 * 0.75;
	}
	
	/* ----- width ----- */
	#page {
		width: @width;
	}
	
	#footer_fixed, #footer {
		width: @width - 30px;
	}
	
	
	/* ----- header ----- */
	header {
		height: 63px; //round(85px * @adapt);
	}

	.custom-logo {
		width: round(112px * 1018 / 1360);
	}

	#custom-logo-2 {
		//width: 120px;
		width: 120px;
		margin-top: 10px;
	}

	.site-branding {
		float: left;
		margin-top: 11px; //round(14px * @adapt);
	}
	
	/* top-menu-tablet-portrait */

	#site-navigation {
		/* max-width: round(812px * @adapt); */
		margin-right: round(77px * @adapt);
		font-size: 20px; /* round(27px * @adapt); */ /* TODO */
		margin-top: 24px; //round(32px * @adapt);
		display: initial;
	}
	
	#site-navigation-2, #quadmenu {
		display: none;
	}
	
	#top_menu {
		line-height: 1;
	}

	#top_menu .menu-item {
		margin-right: 15px; //round(20px * @adapt); /* TODO */
	}

	#top_menu .menu-item .sub-menu {
		display: block;
	}

	#top_menu .menu-item .sub-menu .menu-item {
		background: #5ab88f; 
		margin-right: initial;
		color: white;
		font-family: OpenSans-Regular !important;
		font-size: 14px;
		line-height: 1.5;
		border-bottom: 1px solid #009bd9;
		a, a:visited {
			color: white;
		}
		white-space:nowrap ;
	}
	
	#top_menu .menu-item .sub-menu:last-child {
		border-bottom: none;
	}

	#top_menu .menu-item .sub-menu .menu-item:hover {
		background-color: #009bd9;
	}

	#top_menu .menu-item .sub-menu .menu-item a {
		margin: 0 round(10px * @adapt);
	}
	
	.term-gesundimjob.term-19 #menu-item-back-to-page {
		width: 100px;
		display: block !important;
		img {
			margin-top: -14px;
		}
	
	}
	
	#menu-item-back-to-page_2 {
		display: none !important;
	}
	
	.term-gesundimjob.term-19 #menu-item-back-to-page_2 {
		display: none !important;
	}
	
	
	/* search-tablet-portrait */
	
	#search-icon-mobile, #wpbsearchform-mobile, #search-wpb-mobile {
		display:none;
	}
	
	#search_form_mobile {
		display: none;
	}
	
	.wpbsearchform {
		display: block;
		width: 280px;
		height: 58px;
		position: absolute;
	}
	
	li #searchform {
		width: 260px;
		margin-left: 7px;
		#search_button {
			position: absolute;
			bottom: 18px;
			right: 10px;
		}
		
		#search_field {
			margin-top: 7px;
		}
	}
	
	
	/* slider */
	#top-slider {
		display: block;
	}
	
	#title_image_box_mobile_home {
		display: none;
	}
	
	
	
	/* short previews */
	
	#preview_frame_outer_short {
		background-color: white;
		color: #575757;
	}
	
	#preview_frame_short {
		.divider, .intro {
			display: initial;
		}
		.more_mobile {
			display: none;
		}
		.head {
			font-weight: bold;
		}
		span, a, a:visited {
			color: #575757;
		}
		.more {
			display: initial;
		}
	}
	
	#preview_box_intro_short {
		display: block;
		font-weight: bold;
		
	}
	
	#preview_box_intro_mobile_short {
		display: none;
	}
	
	#preview_box_intro_mobile_short {
		margin-bottom: none;
	}
	
	#preview_frame_short {
		column-count: 2; 
	}
	
	#preview_frame_short .preview_link_short {
		margin-bottom: 0.5em;
		text-align: initial;
	}
	
	
	/* ----- content ----- */
	
	#top-slider {
		/* height: 700px; 
		background: lightgrey; */
		/* background-image: url("/wp-content/uploads/2020/05/A-HS-1.Medizinische-Fitness-r75-scaled.jpg") */
		width: 100%
	}

	/* image banners */
	.carousel-caption, #title_image_banner, .title_image_banner_article {
		bottom: round(120px * @adapt);
		width: round(450px * @adapt);
		line-height: round(58px * @adapt);
		padding-left: round(68px * @adapt);
		font-size: round(36px * @adapt); /* TODO */	
	}
	
	#title_image_banner, .title_image_banner_article {
		min-height: round(58px * @adapt);
		max-height: 2.5*round(58px * @adapt);
	}
	
	.carousel-caption {
		height: round(58px * @adapt);
	}
	
	.carousel-item {
		padding-bottom: 700 / 1366 *100%;
	}
	
		
	#title_image, #title_image_box {
		//padding-bottom: 700 / 1366 * 100%;
	}
	
	#title_image_box_article {
		padding-bottom: 420 / 1366 * 100%;
	}
	
	#title_image_article, #title_image_category {
		display: initial;
	}
	
	#title_image_article_mobile, #title_image_category_mobile {
		display: none;
	}
	

	#title_intro {
		//text-align: center;
		font-family: Phenomena-Light !important;
		font-size: 21px; // round(28px * @adapt);
		br {
			display: none;
		}
	}

	.article_content, #preview_frame, #preview_frame_outer_short {
		padding: 0 round(68px * @adapt);
		p {
			padding: 0;
		}
	}
	
	.preview_text_box_outer, .preview_link {
		display: block;
	}
	
	.preview_image_box {
		margin: 0; 
	}
	
	.preview_image_banner_outer {
		/* width: initial; 
		padding-bottom: initial;
		position: initial;
		bottom: initial;
		background-color: initial; */
	}
	
	#preview_frame {
		display: grid;
		grid-column-gap: 11px; //round(@adapt * 15px); /* TODO height too */
		grid-row-gap: 18px; //round(25px * @adapt) ;
		margin-bottom: 18px; //round(@adapt * 25px);
		grid-template-columns: repeat(2, 1fr);

	}
	
	.preview_image_banner_outer {
		font-family: Phenomena-Light !important; /* TODO */
		font-size: round(@adapt * @image_banner_font_base * 1.5); /* TODO */
		color: white;
		width: 210 / 400 * 100%; /* TODO responsive */
		line-height: round(@adapt * 45px * 1.5);
		padding: 0 round(@adapt * 20px * 1.5);
		position: absolute;
		bottom: 0px;
		margin-bottom: 85  / 400 * 100%;
	}
	
	#short_message_outer {
		display: block;
		bottom: round(@adapt_2 * 30px);
		right: round(@adapt_2 * 70px);
		width: round(@adapt_2 * 260px);
		height: round(@adapt_2 * 65px);
		font-size: round(@adapt_2 * 20px);
		line-height: round(@adapt_2 * 23px);	
	}
	
	#short_message {
		display: block;
		margin: round(@adapt_2 * 9.5px);
		height: round(@adapt_2 * 46px);
	}
	

	#title_intro {
		//padding: 0 round(@adapt * 238px * 0.9);
		padding: initial;
	}
	
	#title_intro, #title_intro * {
		font-size: 21px !important;
		line-height: 27px !important;
	}
	
	.column_1, .column_2, .column_3, .preview_box {
	}

	.breadcrumbs {
		margin-top: round(@adapt * 20px);
		margin-bottom: round(@adapt * (80px-14px));
	}

	/* ----- categories ----- */
	.preview_text_box_outer {
		height: 320px * 322 / 388;
	}
	
	.preview_text_box_outer.search {
		height: initial;
	}
	
	.preview_box {
		border-bottom: 1px solid #575757;
	}
	
	.preview_box.info_box {
		border-bottom: none;
	}
	
	.preview_text_box {
		height: 276px * 322 / 388; // round(@adapt * 290px);
		margin-bottom: 16px * 322 / 388 * 0.75;
		.preview_text_headline {
			margin-bottom: 16px * 322 / 388 * 0.75;
		}
	}
	
	.info_box .preview_text_box {
		//height: (16px * 322 / 388)*1.5*10.5 + 25px;// 212px;
		font-size: 11px;
		margin: 0;
		padding: 0;
		overflow: hidden;
		text-overflow: clip;
		p {
			margin-top: 12px;
		}
		//font-size: 12px;
	}
	
	.info_box ul {
		margin: 0 0 0 -18px;
	}
	
	.info_box .preview_text_box_outer {
		padding: 18px;
	}
	
	#info_box_2nd_image_outer {
		padding: 0;
	}
	
	#info_box_2nd_image {
		position: relative; 
		width: 100%; 
		height: 100%
	}
		
	.preview_text_headline {
		margin-bottom: 9px;
	}
	
	.info_box .preview_text_headline {
		font-size: 25px;
		line-height: 1;
	}
	
	
	.info_box.from_tablet_portrait, .info_box.tablet_portrait { 
		display: initial;
	}
	
	.info_box.mobile { 
		display: none;
	}
	
	
	/* faq-tablet-portrait */	
	
	.ea-body {
		font-size: 16px * @adapt_font_size !important;
	}
	
	.article_content > div > div > div > h3 > a {
		font-size: 24px * @adapt_font_size!important;
	}
	
	.article_content > div > div > div > div > div > div > div > h3 > a, .article_content > div > div > div > div > div > div > div > h3 a, .ea-header a{
		font-size: 18px * @adapt_font_size !important;
	}	
	
	/* ----- footer ----- */
	
	#footer, #footer_fixed {
		font-size: 13px;
	}
	
	#footer {
		padding: 0 round(68px * @adapt);
		margin-bottom: 71px;//round(45px * @adapt);
		height: 72px; // round(85px * @adapt);
		//padding-top:round(@adapt * 20px);
		line-height: 36px;//round(@adapt * 65px);
		font-size: 13px; //round(@adapt * 18px);
	}

	.footer_link {
		margin-right: round(@adapt * 30px); /* TODO */
	}
	
	#footer_links_1, #footer_links_2 {
		display: initial;
		width: initial;
	}
	
	#footer_links_1 {
		float:left;
	}
	
	#footer_links_2 {
		float: right;
	}

	#footer_adress {
		float: initial;//float:left;
	}

	#footer_fixed {
		//font-size: 16px;//round(@adapt * 18px); /* TODO */
		padding: 0 round(@adapt * 68px);
		height: 45px;//round(@adapt * 90px);
		line-height: 1; //round(@adapt * 45px);
	}

	#footer_fixed_left, .footer_fixed_element {
		float:left;
		margin-right: round(@adapt * 30px);
	}

	#footer_fixed_right {
		float: right;
		line-height: 45px;
	}
	
	#footer {
		margin-bottom: 44px;
	}
	
	#footer_links {
		float:left;
		display: flex;
		justify-content: space-between;
		width: 100%;
	}
	
	#footer_link_4, #footer_link_5, #footer_link_6 {
		display: initial;
	}
	
	
	.footer_fixed_element_mobile {
		margin-top:5px;
		margin-right:15px;
	}
	
	.footer_link, #footer_links_1 #link_3 {
		margin-right:0;
	}
	
	#footer_links_2 #link_6 {
		margin-right: 0;
	}
	

	


}

/* ----- tablets landscape ----- */
@media screen and (min-width: @tablet-landscape) {

	@width: @tablet-landscape;
	@adapt: @width / @base;
	@adapt_font_size: 288 / 388;
	
	body {
		font-size: 16px * @adapt_font_size; //12px; // @adapt * 16px ;
	}
	
	.article_content h1, .article_content h2, .article_content h3, .article_content h4, .article_content h5, .article_content h6, .article_content p {
		margin-bottom: 0.5em; // 16px * @adapt_font_size * 0.75;
	}
	
	/* ----- width ----- */
	#page {
		width: @width;
	}
		
	/* ----- header ----- */
	header {
		height: round(85px * @adapt);
	}

	.custom-logo {
		width: round(112px * 1018 / 1360);
	}
	
	#custom-logo-2 {
		width: 120px;
		margin-top: 10px;
	}


	.site-branding {
		float: left;
		//margin-top: round(18px * @adapt);
	}
	
	/* top-menu-tablet-landscape */

	#site-navigation {
		max-width: round(812px * @adapt);
		margin-right: round(77px * @adapt);
		font-size: round(27px * @adapt); /* TODO */
		margin-top: round(32px * @adapt);
	}
	
	nav#quadmenu {
		display: none;
	}

	#top_menu .menu-item {
		margin-right: round(20px * @adapt); /* TODO */
	}

	#top_menu .menu-item .sub-menu .menu-item a {
		margin: 0 round(10px * @adapt);
	}
	
	#site-navigation, #site-navigation-2 {
		font-size:27px !important;
	}
		

	/* short previews */
	#preview_frame_outer_short {	
		padding: 0 round(68px * @adapt);
	}
	
	#preview_frame_short {
		column-count: 3;
	}

	/* ----- content ----- */
	
	.preview_image {
		//position: relative;
	}
	
	#short_message_outer {
		display: block;
		bottom: 30px;
		right: 70px;
		width: 260px;
		height: 65px;
		font-size: 20px;
		line-height: 23px;	
	}
	
	#short_message {
		display: block;
		margin: 9.5px;
		height: 46px;
	}
	
	

	.breadcrumbs {
		margin-top: round(@adapt * 20px);
		margin-bottom: round(@adapt * (80px-16px));
	}

	
	.article_content, #preview_frame {
		display: grid;
		grid-column-gap: round(@adapt * 15px);
		grid-row-gap: round(25px * @adapt) ;
		margin-bottom: round(@adapt * 25px);
		grid-template-columns: repeat(3, 1fr);
		padding: 0 round(68px * @adapt);
	}
	
		/* image banners */
	.carousel-caption, #title_image_banner, .title_image_banner_article {
		bottom: round(120px * @adapt);
		width: round(450px * @adapt);
		line-height: round(58px * @adapt);
		padding-left: round(68px * @adapt);
		font-size: round(36px * @adapt); /* TODO */	
	}
	
	#title_image_banner, .title_image_banner_article {
		min-height: round(58px * @adapt);
		max-height: 2.5*round(58px * @adapt);
	}
		
	.carousel-caption {
		height: round(58px * @adapt);
	}

	#title_intro {
		padding: 0 round(@adapt * 238px * 0.8);
	}
	
	#title_intro, #title_intro * {
		font-size: round(28px * @adapt) !important;
		line-height: round(36px * @adapt) !important;
	}
	
	
	.preview_text_box_outer {
		height: 320px * 288 / 388; //240px;
	}	
	
	.preview_text_box {
		height: 276px * 288 / 388; //240px;
		margin-bottom: 16px * 288 / 388 * 0.75;
		.preview_text_headline {
			margin-bottom: 16px * 288 / 388 * 0.75;
		}
	}	
	
	.info_box .preview_text_box_outer {
		padding: 11px;
		.preview_text_headline {
			font-size: 22px;
		}
		.preview_text_box {
			font-size: 10px;
		}
		
		p { 
			margin-top: 10px;
		}
		
	}
	
	
	
	
	
	.preview_image_banner_outer {
		font-family: Phenomena-Light !important; /* TODO */
		font-size: round(@adapt * @image_banner_font_base); /* TODO */
		color: white;
		width: 210 / 400 * 100%; /* TODO responsive */
		line-height: round(@adapt * 45px);
		padding: 0 round(@adapt * 20px);
		position: absolute;
		bottom: 0px;
		margin-bottom: 85  / 400 * 100%;
	}
	
	.info_box.from_tablet_landscape { 
		display: initial;
	}
	
	.info_box.tablet_portrait { 
		display: none;
	}
	
	
	/* search results */
	.preview_image_box_outer.search {
		width: 20%;
		//padding-right: 3%;
	}
	
	.column_1, .column_2 {
		border-bottom: 1px solid #575757;
		padding-bottom: 0.25em;
	}
	
	/* faq-tablet-landscape */
	#sp-ea-496 { 
		display: none;
	}
	
	#sp-ea-370, #sp-ea-374 { 
		display: initial;
	}

	.ea-body {
		font-size: 16px * @adapt_font_size !important;
	}
	
	.article_content > div > div > div > h3 > a {
		font-size: 24px * @adapt_font_size!important;
	}
	
	.article_content > div > div > div > div > div > div > div > h3 > a, .article_content > div > div > div > div > div > div > div > h3 a, .ea-header a{
		font-size: 18px * @adapt_font_size !important;
	}	
	
	/* directions-tablet-landscape */
	#directions {
		margin-bottom: 0;
		border: none;
	}
	
	
	/* ----- footer ----- */

	#footer_fixed, #footer {
		width: @tablet-landscape - 30px;
	}
	
	#footer {
		padding: 0 round(68px * @adapt);
		margin-bottom: 33px;
		height: 66px; //round(85px * @adapt);
		//padding-top:round(@adapt * 20px);
		line-height: 66px; //round(@adapt * 65px);
		//font-size: 16px; /* round(@adapt * 18px) */;
	}
	
	#footer_links {
		float: left;
		//display: blocK;
		width: 50%;
	}
	
	#footer_adress {
		width: 38%;
		float: right;
	}
	
	
	#footer_links_1, #footer_links_2 {
		float: left;
	}
	
	#footer_right {
		float: right;
	}
	
	#footer_links_1, #footer_links_2, #footer_adress {
		height: 100%;
	}
	
	#footer #footer_links_1 .footer_link, #footer #footer_links_2 .footer_link {
		margin-right: 8px;
		padding: 24px 0;
	}

	.footer_link {
		//margin-right: round(@adapt * 30px); /* TODO */
	}

	#footer_fixed {
		//font-size: 15px/* round(@adapt * 18px)*/ ; /* TODO */
		padding: 0 round(@adapt * 68px);
		height: round(@adapt * 45px);
		line-height: round(@adapt * 45px);
	}

	#footer_fixed_left, .footer_fixed_element {
		float:left;
		margin-right: 15px; /* round(@adapt * 30px) */;
	}
	
	#footer_fixed_right {
		float: right;
		line-height: inherit; 
	}
	
	.footer_fixed_element {
		display: initial;
	}
	
	.footer_fixed_element_mobile {
		display: none;
	}

}

/* ----- desktops ----- */
@media screen and (min-width: @desktop) {
	
	@width: @desktop;
	@adapt: @width / @base;
	@adapt_2: @width / 1024px;
	@adapt_font_size: 1;
	
	body {
		font-size: 16px;
	}
	
	.article_content h1, .article_content h2, .article_content h3, .article_content h4, .article_content h5, .article_content h6, .article_content p {
		margin-bottom: 0.5em; // 16px * 0.75;
	}
	
	
	/* ----- width ----- */
	#page {
		width: @width;
	}
	
	#footer_fixed, #footer {
		width: @width - 30px;
	}

	/* ----- header ----- */
	header {
		height: round(85px * @adapt);
	}

	.custom-logo {
		width: 112px; //round(120px * @adapt);
	}
	
	#custom-logo-2 {
		width: 150px;
		margin-top: 8px;
	}

	.site-branding {
		float: left;
		margin-top: 15px; //round(18px * @adapt);
	}

	#site-navigation {
		max-width: round(812px * @adapt);
		margin-right: round(77px * @adapt);
		font-size: round(27px * @adapt); /* TODO */
		margin-top: round(32px * @adapt);
	}

	#top_menu .menu-item {
		margin-right: round(20px * @adapt); /* TODO */
	}

	#top_menu .menu-item .sub-menu .menu-item a {
		margin: 0 round(10px * @adapt);
	}
	
	#top_menu .menu-item .sub-menu .menu-item {
		font-size: 20px;
	}
	
	#search-icon {
		height: 25px;
		width: 24px;
		cursor: pointer;
		margin-top: 5px;
	}
	
	
	/* top-menu-desktop */
	
	.term-gesundimjob.term-19 #menu-item-back-to-page {
		width: 112px;
		img {
			margin-top: -17px;
		}
	}

	/* ----- content ----- */
	
	#page_banner {
		max-width: 1920px;
		margin: 0 auto;
	}
	
	.carousel-item {
		width: 100%;
		padding-bottom: 700 / 1366 *100%;
		position: relative;
	}
	
	.slider_image {
		width: 100%;
		height: 100%;
		position: absolute;
		//background-size: 100% 100%;
		background-position: top;
		background-size: 100% auto;
		background-repeat: no-repeat;
		background-size: cover;
		top: 0
	}

	.carousel-caption, #title_image_banner, .title_image_banner_article {
		/* bottom: round(120px * @adapt);
		width: round(450px * @adapt);
		height: round(58px * @adapt);
		line-height: round(58px * @adapt);
		padding-left: round(68px * @adapt);
		font-size: round(36px * @adapt);  */ /* TODO */	
		bottom: 8.78vw;
		width: 32.94vw;
		line-height: 4.25vw;
		padding-left: 4.98vw;
		font-size: 2.64vw; 
	}
	
	#title_image_banner, .title_image_banner_article {
		min-height: 4.25vw;
		max-height: 2.5*4.25vw; 
	}
	
	.carousel-caption, #title_image_banner {
		height: 4.25vw;
	}
	
	
	#short_message_outer {
		display: block;
		bottom: round(@adapt_2 * 30px);
		right: round(@adapt_2 * 70px);
		width: round(@adapt_2 * 260px);
		height: round(@adapt_2 * 65px);
		font-size: round(@adapt_2 * 20px);
		line-height: round(@adapt_2 * 23px);	
	}
	
	#short_message {
		display: block;
		margin: round(@adapt_2 * 9.5px);
		height: round(@adapt_2 * 46px);
	}

	#title_intro {
		padding: 0 round(@adapt * 238px * 0.9);
		margin: 14px 0;
	}
	
	#title_intro, #title_intro * {
		font-size: round(28px * @adapt) !important;
		line-height: round(36px * @adapt) !important;
	}
	
	.article_content, #preview_frame {
		width: 100%;
		padding: 0 round(68px * @adapt);
		display: grid;
		grid-column-gap: round(15px * @adapt);
		grid-row-gap: round(25px * @adapt) ;
		margin-bottom: round(@adapt * 25px);
		grid-template-columns: repeat(3, 1fr);

	}
	
	.article_content p {
		margin-bottom: 0.5em;
	}

	.column_1, .column_2, .column_3, .preview_box {
		/* width:33%;
		float:left; */
	}

	.column_1, .column_2 {
		/* margin-right: 15px; */
	}
	
	.preview_text_box_outer {
		height: 320px;
		margin-top: 15px;
	}	
	
	.preview_text_box_outer.search {
		min-height: initial;
	}
	
	.preview_text_box {
		height: 276px;
		margin-bottom: 12px;
	}
	
	.preview_text_headline {
		margin-bottom: 12px;
	}
	
	.info_box .preview_text_box_outer {
		padding: 20px;
		.preview_text_headline {
			font-size: 25px;
		}
		.preview_text_box {
			height: 272px;
			margin: 0;
			padding: 0;
			overflow: hidden;
			text-overflow: clip;
			font-size: 13px;
		}
		p {
			margin-top: 18px;
		}
	}
	
	
	.info_box ul {
		margin: 0 0 0 -20px;
	}
	
	.info_box p {
		margin-top: 13px;
	}
	
	.info_box .preview_text_headline {
		font-size: 30px;
		margin-bottom: 15px;
	}
	
	.preview_link {
		width:365px;
	}
	
	.preview_image_banner_outer {
		font-family: Phenomena-Light !important; /* TODO */
		font-size: round(@adapt * @image_banner_font_base); /* TODO */
		color: white;
		width: 210 / 400 * 100%; /* TODO responsive */
		line-height: round(@adapt * 45px);
		padding: 0 round(@adapt * 20px);
		position: absolute;
		bottom: 0px;
		margin-bottom: 85  / 400 * 100%;
	}
	

	.clear {
		clear: both;
	}

	.breadcrumbs {
		margin-top: round(@adapt * 20px);
		margin-bottom: round(@adapt * (80px-16px));
	}
	
	
	.breadcrumbs, .breadcrumbs span a span {
		line-height: 16px;
	}
	
	/* short previews */
	#preview_frame_outer_short {	
		padding: 0 round(68px * @adapt);
		margin-bottom: 30px;
	}
	
	#preview_frame_short {	
		column-gap: 15px; 
	}

	/* search results */
	#preview_frame_search {
		margin: 0 68px;
	}
	
	.preview_box.search {
		margin-bottom: 60px;
	}
	
	.preview_image_box_outer.search {
		padding-right: 15px;
	}

	/* faq-desktop */

	.ea-body {
		font-size: 16px * @adapt_font_size !important;
	}
	
	.article_content > div > div > div > h3 > a {
		font-size: 24px * @adapt_font_size!important;
	}
	
	.article_content > div > div > div > div > div > div > div > h3 > a, .article_content > div > div > div > div > div > div > div > h3 a, .ea-header a{
		font-size: 18px * @adapt_font_size !important;
	}	
	

	/* ----- footer ----- */

	#footer {
		padding: 0 round(68px * @adapt);
		margin-bottom: round(44px * @adapt);
		margin-top: 32px;
		height: round(85px * @adapt);
		//padding-top:round(@adapt * 20px);
		line-height: round(@adapt * 85px);
		font-size: round(@adapt * 16px);
	}

	.footer_link {
		//margin-right: round(@adapt * 30px); /* TODO */
	}

	#footer_fixed {
		font-size: round(@adapt * 16px); /* TODO */
		padding: 0 round(@adapt * 68px);
		height: round(@adapt * 45px);
		line-height: round(@adapt * 45px);
	}

	#footer_fixed_left, .footer_fixed_element {
		float:left;
		margin-right: round(@adapt * 30px);
	}
	
	#footer_fixed_outer {
		width: 100%;
		bottom: 0px;
		position: fixed;
		padding: 0 15px;
	}


}


@media screen and (min-width: 1920px) {
	@adapt: 1920px / @base;
	@adapt_2: 1920px / 1024px;
	.carousel-caption, #title_image_banner, .title_image_banner_article {
		bottom: round(120px * @adapt);
		width: round(450px * @adapt);
		line-height: round(58px * @adapt);
		padding-left: round(68px * @adapt);
		font-size: round(36px * @adapt); 
	}
	
	#title_image_banner, .title_image_banner_article {
		min-height: round(58px * @adapt);
		max-height: 2.5*round(58px * @adapt);
	}
	
	.carousel-caption {
		height: round(58px * @adapt);
	}
		
	#short_message_outer {
		display: block;
		bottom: round(@adapt_2 * 30px);
		right: round(@adapt_2 * 70px);
		width: round(@adapt_2 * 260px);
		height: round(@adapt_2 * 65px);
		font-size: round(@adapt_2 * 20px);
		line-height: round(@adapt_2 * 23px);	
	}
	
	#short_message {
		display: block;
		margin: round(@adapt_2 * 9.5px);
		height: round(@adapt_2 * 46px);
	}
}


/* TODO 
x 1. Spalte auf Kategorie-Seiten: Anfahrt?
x Grösse Vorschauen, insbesondere Smartphone quer (>400px)
x Aussenrahmen mobil? (15px)?
x Text in Kategorien mobil?
x Abstände zwischen Bildern in Kategorien ok?
x Grösse Footer-Symbole (wirken massiv)
x 2. Struktur in mobil?
x Footer mobil?
x Breite footer fixed?
x Breite Phones -> Grösse Bilder? 
x Font Size in banners -> Umbruch wenn zu lang (Fragen und Antworten)
x Schriftgrössen, insbesondere im Footer Handy (wegen Umbrüchen -> höher)
x wie breadcrumbs bei kleineren Bildschirmen umbrechen lassen?
x "Besuchen Sie uns" Plan und Öffnungszeiten = Entwurf oder immer?
x Kürzeres Intro auf Titelseite mobil?
x webseite mini smbol (für browser tabs)
x Abstand zum Rand bei Artikeltext ab welcher Breite?
x kurze Seiten (iPad hoch): footer runter setzen
x Titelbilder auf Infoseiten (Impressum etc?) oder Standardbild
x Grösse Banner in Bildern (insbesondere Artikel mobil)
x Abstand zwischen Text in Previews und Links (Mehr erfahren)?
* Preview-Texte: Anpassung über Schriftsatz funktioniert nicht.
- Fehlt der Vorschau-Text, werden automatisch die ersten 100 Zeichen des Seitentextes verwendet.
x Titelbild ausschliessen in Eingabemaske für kategorien
x Viele Menüpunkte dürften Einzelseiten sein, nicht Bereiche, bsp. "Kontakt" unter "gesund.im.job"
x Suche verschwindet auf Tablet hochkant
x Gestaltung "Nichts gefunden" und 404 (Titelbild?) + min-height
x richtiges Titelbild zu Suchergebnissen zuordnen (via page id=125)
* Anpassung der Mindest-Höhe über "main" kontrollieren (Seiten ohne Banner)
x Banner Fragen und Antworten verlängern
* Grösse der Eingabefelder (Vorschau-Text und Überschrift) verkleinern
* Bildgrösse für Artikel automatisch erstellen
x Top-Menü: "medizinische fitness" bricht um
x Max-Bildergrössen: Category-Banner austauschen (ausser 404)
	- Suche
	- Labor
	- Streifen
	- Stretching
	- Leistungssport
	- Diagnose
	- Behandlung
	- sitzend
x Gutenberg-Blocks deaktivieren
* Seiten aufräumen (Tests raus)
* carousel-indicators funktionieren nicht als Links
x Physiotherapie-Seite ist verwirrend für Besucher
* TODO suchen
* to dos aus styles.less löschen
* Schriftgrössen article_content h1, h2...
* Anleitungen anpassen (Bildgrösse mobil)
* Code-enabled aus Anfahrt rechte Spalte rausnehmen (Fields)
* https

* Benutzer anlegen
x Info-Boxen formatieren (Textgrösse, Zeilen)
x Schriftsätze erzwingen (!important)
x Doppelte Überschrift auf mobil: 2 Grössen
x Beispiel für 
x Fehler in Back-end "Bereiche"

jetzt
x Überschrift Artikel mobil höher
x Slider
x Kategorien: Platz in Vorschau-Text-Boxen
x FAQ-Seite fertigstellen
x mobile Bilder raus aus Eingabemasken
x Box unter "Termin vereinbaren" nicht definiert
* h1, h2 etc in Artikeln
* Rechte Spalte in Bearbeitungsseite ausblenden
* Animationen raus aus Top-Menü mobil
* https (bei Umzug auf Hauptdomain)
* Benutzer anlegen

* TODOs suchen
* Felder
	* Bildgrösse für Artikel automatisch erstellen
	* Grösse der Eingabefelder (Vorschau-Text und Überschrift) verkleinern
	* Code-enabled aus Anfahrt rechte Spalte rausnehmen (Fields)
	* Dokumentation: mobile Bilder Auflösung

besprechen
x Kontakt-Übersichts-Seite nicht optimal (Termine kommt in zweiter Reihe links)
x Titelbild mobil hat gleiche Proportionen wie Titelbild Desktop?
x 2. Extra-Box (Termin vereinbaren) auch auf Kategorie-Seiten?
* Ungünstige Anzahl Boxen (bsp. Kontakte-Seite)
* Grösse der Überschriften in Artikeln (x em)
x Texte Tablet portrait einspaltig? http://neu.reaktiv-kronberg.de/test-1/
* Anzahl Spalten Tablet portrait -> directions

aufräumen
* echos im Code raus
* TODOs im Code raus
* .js wegen Höhe raus


Kür
* überflüssiger Code in category pages?
* unnötiges CSS + Doppelungen
x Überschriften (Banner in images) -> h1 wg. SEO
* Rechte Spalte in Bearbeitungsseite ausblenden
* Dokumentation: mobile Bilder Auflösung
x Fallback-Bild für Kategorien
* Animationen raus aus Top-Menü mobil

x banner mobile: 16px, z.T. länger, wenn längerer Text


Schulung
Grundsätze: 
* alle Änderungen prüfen (auf mehreren Bildschirmgrössen - F12, Geräte bevorzugt, auch Vorschau (begrenzte Länge Überschrift))
* Angelegte Elemente nicht unnötig ersetzen - lieber ändern - Grund: Ausnahmen, Anpassungen hart codiert - Bezug kann verloren gehen.
* Überschriften nicht zu lang (Designvorgabe)
Anzahl Boxen am besten durch 2 und 3 teilbar (6 oder 12). Im Zweifelsfall durch 3 teilbar (wenige nutzen Tablet hochkant)
1. Artikel anlegen
	Medien verwalten
	richtige Bildgrösse (Auflösung) wählen
		(Vorschau = Titelbild mobil -> hohe Auflösung)
		Text auf Tablet hochkant 1spaltig -> hohe A.
	Überschriften ab h2 (h1 bereits vergeben)
	Artikel zuordnen (Bereich)
	Artikel prüfen (Gerätegrössen)
2. Bereiche verwalten
3. Reihenfolge ändern
4. FAQ
	links + rechts ausgeglichen; wiederholen mobil
5. Caveats
	angelegte Bilder und Artikel nicht löschen (Titelseite: FAQ, Top-Menu, gesund.im.job)
	Spezialseiten: Info-Box
	Spezialseite FAQ
	
Entscheidung: Anzahl Spalten Tablet portrait -> directions

*/