
@media (max-width: 1024px) {

	html {
		height: 100%;
		overflow-x: hidden;
	}

	body {
		/*
		width: 320px;
		margin-left: auto;
		margin-right: auto;
		*/
		-webkit-text-size-adjust: none;
		text-size-adjust: none;
		font-size: 15px;
		overflow-x: hidden;
	}

	/*
	.undertoppercontainer {
		display: none;
	}
	*/

	#cust-navigation113-outer {
		display: none;
	}

	#cust-navigation146-outer {
		display: none;
	}
	
	.slide-desc {
		display: none;
	}
	
	.mobile-slider-container {
		width: 100%;
		overflow: hidden;
	}
	
	.mobile-slider {
		background: #039db7;
		color: white;
		overflow: hidden;
		width: 100000%;
		transition: all 0.4s ease;
	}
	
	.mobile-slide-desc {
		width: 100vw;
		box-sizing: border-box;
		padding: 15px;
		float: left;
		overflow: hidden;
	}
	
	.mobile-slide-desc a {
		color: white;
	}
	


	.topinfo {
		display: none;
	}

	.container {
		width: 100%;
	}

	#topper {
		height: auto;
		overflow: hidden;
		width: 100%;
		/*padding-top: 100px;*/
		padding-top: 77px;
	}

	.mobile_fixed {
		width: 100%;
		width: 100vw;
		position: fixed;
		top: 0px;
		background: rgba(255,255,255,0.9);
		z-index: 4;
	}

	#mobile_menubutton {
		width: 30px;
		height: 35px;
		padding-left: 25px;
		padding-right: 25px;
		padding-top: 15px;
		float: left;
		position: relative;
		display: block;
		/*margin-top: 25px;*/
		margin-top: 14px;
		transition: all 0.4s ease;
	}

	.smallBanner #mobile_menubutton {
		margin-top: 0px;
	}
	
	#hauptmenu a.mobile_open {
		background: rgba(0, 125, 138, 0.1);
	}

	.menubuttonline {
		background: #0097a8;
		height: 2px;
		width: 30px;
		position: absolute;
		transition: all 0.4s ease;
	}

	.menubuttonline_1 {
		/*margin-top: 0px;*/
		margin-top: 4px;
		transform: rotate(0deg);
	}

	.opened .menubuttonline_1 {
		margin-top: 9px;
		transform: rotate(45deg);
	}

	.menubuttonline_2 {
		margin-top: 9px;
		opacity: 1;
		display: none;
	}

	.opened .menubuttonline_2 {
		opacity: 0;
		display: none;
	}

	.menubuttonline_3 {
		/*margin-top: 18px;*/
		margin-top: 14px;
		transform: rotate(0deg);
	}

	.opened .menubuttonline_3 {
		margin-top: 9px;
		transform: rotate(-45deg);
	}

	.mobile_topinfo {
		float: right;
		width: 80px;
		height: 50px;
		display: block;
		/*margin-top: 25px;*/
		margin-top: 14px;
		transition: all 0.4s ease;
	}

	.smallBanner .mobile_topinfo {
		margin-top: 0px;
	}
	
	.mobile_topinfo p {
		padding-bottom: 0px;
	}
	
	.mobile_topinfo a {
		display: block;
		height: 40px;
		padding-top: 10px;
		padding-left: 25px;
		padding-right: 25px;
	}
	
	.mobile_topinfo a em {
		color: transparent;
		width: 30px;
		font-size: 26px;
		overflow: hidden;
		height: 28px;
		padding-top: 2px;
		padding-left: 2px; /* fa 4 */
		display: inline-block;
	}
	
	.mobile_topinfo a em::before {
		color: #007d8a;
	}

	#logo {
		float: none;
		padding: 0px;
		width: 100%;
		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
	}

	#logo a {
		display: block;
		overflow: hidden;
		margin-left: auto;
		margin-right: auto;
		/*width: 147px;*/
		/*height: 85px;*/
		/*padding-top: 15px;*/
		width: 117px;
		height: 65px;
		padding-top: 12px;
		transition: all 0.4s ease;
	}

	.smallBanner #logo a {
		width: 78px;
		height: 44px;
		padding-top: 6px;
	}

	#logo a img {
		transition: all 0.4s ease;
		/*width: 147px;*/
		/*height: 70px;*/
		width: 117px;
		height: 56px;
		
	}

	.smallBanner #logo a img {
		width: 78px;
		height: 37px;
	}

	.toprightspace {
		float: none;
		padding: 0px;
	}

	#hauptmenu {
		max-width: none;
		padding: 0px;
		display: none;
		
		position: absolute;
		z-index: 3;
		width: 100%;
		background: rgba(255,255,255,0.95);
	}

	#hauptmenu li {
		float: none;
		padding: 0px;
		border-top: 1px solid #e1e1e1;
		position: relative;
	}

	#hauptmenu li:first-child {
		display: block;
	}

	#hauptmenu ul.nav>li:first-child {
		display: none;
	}

	#hauptmenu ul.nav>li:nth-child(2) {
		border-top: 0px;
	}

	#hauptmenu ul.nav>li:last-child {
		border-bottom: 1px solid #e1e1e1;
	}

	#hauptmenu li a {
		padding-right: 25px;
		padding-left: 25px;
		display: block;
		padding-top: 11px;
		padding-bottom: 11px;
		font-size: 18px;
	}

	#hauptmenu li a:hover {
		text-decoration: none;
	}

	#hauptmenu li ul li a {
		padding-left: 50px;
	} 

	#hauptmenu li ul li ul li a {
		padding-left: 75px;
	} 

	#hauptmenu li ul li ul li ul li a {
		padding-left: 100px;
	} 

	#hauptmenu li:last-child {
		width: auto;
		background: none;
	}

	#hauptmenu li:last-child a {
		color: black;
	}

	#hauptmenu ul.nav-child {
		padding-left: 0px;
	}

	#hauptmenu ul ul {
		display: none;
	}

	#hauptmenu li.deeper::before {
		content: " ";
		display: block;
		position: absolute;
		right: 25px;
		margin-top: 19px;
		width: 5px;
		height: 10px;
		background: url(../images/mobile_menu_go.png) no-repeat;
		transform: rotate(0deg);
		transition: all 0.4s ease;
	}

	#hauptmenu li.deeper.opened::before {
		transform: rotate(90deg);
	}
	
	#hauptmenu li.active a {
		color: black;
	}


	.contentfull {
		padding: 0px;
	}

	.containerfull {
		min-width: 0;
		max-width: none;
	}

	.containerfullstep {
		min-width: 0;
		max-width: none;
	}

	.moduletablestartnews li, .blog-featuredstarttexte li, .moduletablestartlinks li {
		float: none;
		width: 100%;
		padding-right: 0px;
	}


	.contentfull {
		display: flex;
		flex-direction: column;
	}

	.moleft, .moright, .mocontent {
		float: none;
	}

	.mocontent {
		order: 1;
		margin-right: 0px;
		padding-left: 15px;
		padding-right: 15px;
		padding-top: 25px;
		overflow: hidden;
		font-size: 15px;
	}

	.moright {
		order: 2;
		margin-top: 25px;
		width: 100%;
	}

	.moleft {
		order: 3;
	}


	.blog-featuredstarttexte h2 {
		padding-left: 0px;
	}

	.blog-featuredstarttexte li p {
		padding-left: 0px;
		padding-right: 0px;
		font-size: 15px;
	}

	.starticons li .imgholder {
		margin-left: -15px;
		margin-right: -15px;
	}

	.moduletablestartnews ul, .blog-featuredstarttexte ul, .moduletablestartlinks ul {
		overflow: visible;
	}

	.moduletablestartnews .mod-articles-category-introtext, .moduletablestartlinks p {
		font-size: 15px;
	}

	.moduletablestartnews .mod-articles-category-readmore {
		font-size: 15px;
	}

	.moduletablestartnews li {
		margin-left: -15px;
		margin-right: 0px;
		width: 100vw;
	}

	.moduletablestartlinks li {
		margin-left: -15px;
		margin-right: 0px;
		width: 100vw;
		margin-bottom: 25px;
	}


	ul.menufooterfullmenue {
		display: none;
	}

	.footerlinks {
		display: none;
	}

	ul.menufooterrightsmenu {
		display: none;
	}

	.footercontainer {
		margin-top: 5px;
	}

	.footercontainer .moduletable.footerfirmeninfo {
		width: 170px;
		margin-left: auto;
		margin-right: auto;
		float: none;
		margin-bottom: 25px;
	}

	.footercontainer>.container {
		padding-left: 15px;
		padding-right: 15px;
		width: 100%;
		box-sizing: border-box;
	}

	.footercontainer .moduletable:nth-child(4) {
		padding-bottom: 0px;
	}

	.kategorieanzeige {
		display: none;
	}
	
	.navigation-container {
		display: block;
		position: absolute;
		top: calc(50% - 18px) !important;
		width: 100%;
	}
	
	.navigation-container .next-button {
		position: absolute;
		right: 1px;
	}

	table.mobile_break td {
		display: block;
	}
	
	.mobile_show {
		display: block;
	}

	.mobile_hide {
		display: none;
	}
	
	.mobile_readmore_outer {
		overflow: hidden;
	}
	
	.mobile_readmore_action {
		font-size: 15px;
		background: #007d8a;
		color: white;
		display: inline-block;
		padding: 15px;
		margin-top: 10px;
		padding-left: 20px;
		padding-right: 20px;
	}
	
	body.tlp_page_id_9 .zusatzrechts { /* zusatzrechts auf der mobilen kontaktseite ausblenden*/
		display: none;
	}
	
	body.tlp_page_id_22 .moduletablenewsbox { /* aktuelles-box in der mobilen infos&news wegblenden */
		display: none;
	}
	
	body.isMobile .pagination li {
		display: none;
	}
	
	body.isMobile .pagination li.pagination-prev,
	body.isMobile .pagination li.pagination-next
	{
		display: list-item;
	}
}

/*
	ACHTUNG HIER KEINE STYLES DIE -NUR- FUER DESKTOP GELTEN SOLLEN.
	DIESE WERDEN BEI DER DESKTOP-ANSICHT - NICHT GELADEN -

	when the screen is less than 500px wide, then do something like that ...
	Fairly small screens including iphones: only screen and (max-width: 500px),
	IPads: only screen and (min-device-width: 768px) and (max-device-width: 1024px)
*/

@media (max-width:600px)
{
	.mobile_break_expand
	{
		border-style: none;
		/* hier !important, weil direkt an dem object */
		/* im style attribute werte gesetzt werden könnten. */
		/* diese werden mit !important ueberschrieben */
		width: 100% !important;
	}

	/* .mobile_break_expand tr td {
		vertical-align: top;
	} */

	.mobile_break_expand *
	{
		/* float: left; */

		/* okay, viell. muss dies wieder auf display: block gesetzt werden */
		/* aber die gesamtweite von 100% kompensiert dies anscheinend */
		/* vgl. mobile_break_expand td */
		/* display: block; */
		padding-left: 2.5%;
		padding-right: 2.5%;
		/* in der desktopansicht ist oft eine margin gesetzt, */
		/* das ist in der mobilen ansicht nicht erwuenscht */
		margin: 0px 0px 0px 0px; 
		max-width: 100%;
		width: 95%;
	}
}


