/*
@dr:
Die vieibility Klasse bitte drinnen lassen. Damit kann man per Templavoila
den Content Elementen eine dieser Klassen geben und kann damit steuern wann das Element sichtbar sein soll.
Kannst sie evtl noch an die richtigen Auflösungen verschieben.
*/

.visible-phone {
	display: none !important;
}

.visible-tablet {
	display: none !important;
}

.hidden-desktop {
	display: none !important;
}

.visible-desktop {
	display: inherit !important;
}

.mininavi {
	display: none;
}


/*  Breite kleiner als 1000 Pixel  */
@media screen and (max-width: 1000px) {

	.hidden-desktop {
		display: inherit !important;
	}
	.visible-desktop {
		display: none !important;
	}
	.visible-tablet {
		display: inherit !important;
	}
	.hidden-tablet {
		display: none !important;
	}


	#positionierung {
		width: 768px;
	}
	#spalte_2 {
	  width: 548px;
	}
	#hauptnavigation,
	#topnavigation_sp1 {
		display: none;
	}
	#topnavigation {
		background: none;
		position: absolute;
		top: 0;
		padding-left: 10px;
	}
	#topnavigation_sp2 {
		float: left;
	}
 	.mininavi {
		display: block;
	}
	#headerbild {
		clear: both;
		width: 550px;
 	}
	#headerbild img {
		margin-left: -66px;
 	}

	/* Inhalte */
	#inhalte_sp1 {
		float: none;
	}
	#inhalte.inhalte_einspaltig #inhalte_sp1 {
		width: 470px;
	}
	#inhalte_sp2 {
    float: none;
	  padding: 0;
    width: 500px;
	}
	#inhalte_sp2 > div {
	}
	#inhalte_sp2 > div > div {
		background-color: #e2e2e2;
		float: left;
    width: 220px;
		margin: 0 0 1em 30px !important;
	}
	#inhalte_sp2 .klapper {
		float: none;
		clear: both;
    width: 100%;
	}
	#inhalte_sp2 .fotozeile_headline {
    padding: 0;
	}
	#inhalte_sp2 .fotozeile_headline .fotozeile_headline,
	#inhalte_sp2 .bildergalerie_headline
	{
		background-color: #C6C6C6;
    color: #474747;
    padding: 5px 0 5px 10px;
	}
	#inhalte_sp2 .fotozeile_text,
	#inhalte_sp2 .social_copytext,
	#inhalte_sp2 .grossansicht_hinweis
	{
    padding: 10px;
	}
	#inhalte_sp2 .fotozeile_text p,
	#inhalte_sp2 .social_copytext p,
	#inhalte_sp2 .grossansicht_hinweis p
	{
    margin: 0;
	}

	/* Seitenservice ans Seitenende
		 Siehe auch functions.js, innerhalb von viewport() */

	#inhalte {
		position: relative;
	}
	#seitenservice {
		height: auto;
		position: absolute;
		bottom: 0;
		margin-top: 0;
		padding-top: 3em;
	}


	/* Klinikliste */
	.klinikliste_item_head {
		width: 280px;
	}
	.klinikliste_item_details {
		right: 0;
	}

	/* Aktuelles, Termine, Stellen, Presse */
	.liste_head {
		margin-top: 0;
	}
	.liste_filter + .liste_head {
		margin-top: 1em;
	}
	.listitem_sp1,
	.listitem_sp2
	{
		float: none;
		width: auto;
		margin-right: 0;
	}
	.listitem_sp2 {
		margin-top: 0.5em;
	}
	.tx-aspresse-pi1 .liste_filter_feld input#stichworte {
		width: 120px;
	}
	.tx-aspresse-pi1 .liste_filter_feld input.jscalendar {
		width: 90px;
	}
	.tx-aspresse-pi1 .liste_filter_button {
		padding-top: 5px;
		clear: both;
	}

	/* Home */
	.home #inhalte {
		top: 0;
	}
	.home #inhalte_sp1 {
		width: 500px;
	}
	.home #inhalte_sp2 {
		display: none;
	}
	.home .copytext,
	.home .vorspann
	{
    width: auto;
	}
	.home .teaser_home {
    width: 100%;
		margin: 1em 0 !important;
	}
	#karte {
		/*display: none;*/
		/* Wird display:none gesetzt, werden die Fähnchen nicht richtig positioniert! */
		visibility: hidden;
		top: auto;
		bottom: 0;
	}

}

/*  Breite kleiner als 768 Pixel  */
@media screen and (max-width: 768px) {

	#positionierung {
		width: 600px;
	}
	#content {
    background-position: -40px 0;
	}
	#spalte_1,
	.kontextnavigation
	{
		width: 180px;
	}
	.referenzfeld {
    height: auto;
    padding: 10px 10px 10px 20px;
	}
	#logo img {
    margin-left: -20px;
	}

	#spalte_2 {
	  width: 420px;
	}
	#suche label {
    display: none;
	}
	#suche input#suchbegriff {
    width: 140px;
	}
	#headerbild {
		width: 420px;
 	}
	#headerbild img {
		margin-left: -180px;
 	}
	#inhalte_sp1,
	#inhalte.inhalte_einspaltig #inhalte_sp1
	{
		width: 380px;
		padding-left: 20px;
		margin-right: 0;
	}
	#inhalte_sp2 {
    width: 380px;
		padding-left: 20px;
	}
	#inhalte_sp2 > div > div {
		float: none;
    width: 100%;
		margin: 0 0 1em 0 !important;
	}
	#inhalte_sp2 .fotozeile_bild {
    float: left;
	}

	/* Klinikliste */
	.klinikliste_item_head {
		width: auto;
	}
	.klinikliste_item_details {
		height: 0;
		width: 0;
		visibility: hidden;
		left: -9999em;
	}

	/* Aktuelles, Termine, Stellen, Presse */
	.liste_filter_feld input {
		width: 210px;
	}
	.liste_filter_feld input[type=checkbox] {
		width: auto;
	}
	.liste_filter_button {
		clear: both;
		padding-top: 10px;
	}
	.tx-asjobboerse-pi1 .liste_filter_feld {
		margin-bottom: 5px;
	}
	.tx-asjobboerse-pi1 .liste_filter_feld input {
		width: 352px;
	}
	.tx-asjobboerse-pi1 .liste_filter_feld select {
		width: 360px;
	}
	.tx-asjobboerse-pi1 .liste_filter_button {
		padding-top: 0;
 	}
	.tx-aspresse-pi1 .liste_filter_feld {
		margin-bottom: 5px;
		float: none;
	}
	.tx-aspresse-pi1 .liste_filter_feld input#stichworte {
		width: auto;
	}
	.tx-aspresse-pi1 .liste_filter_feld input.jscalendar {
		width: auto;
	}
	.tx-aspresse-pi1 .liste_filter_button {
		padding-top: 5px;
		clear: both;
	}
	.tx-indexedsearch-browsebox p {
    float: none;
    padding: 5px 0;
    width: auto;
	}
	.tx-indexedsearch .browsebox {
		 clear: both;
		 float: none;
		 width: auto;
		 text-align: left;
	}

	/* Overlays */
	#player {
    width: 560px;
	}
	.close {
    left: auto;
		right: 0;
		top: 0;
		position: absolute;
	}

	/* Startseite Einrichtung */
	.box_meldungen, .box_meldungen_inhalt, .meldung
	#box_meldungen, #box_meldungen_inhalt, .meldung {
		width: 380px;
	}

	/* Home */
	.home #inhalte_sp1 {
		width: 380px;
	}

}

/*  Breite kleiner als 600 Pixel  */
@media screen and (max-width: 600px) {

	.hidden-desktop {
		display: inherit !important;
	}
	.visible-desktop {
		display: none !important;
	}
	.visible-phone {
		display: inherit !important;
	}
	.hidden-phone {
		display: none !important;
	}


	#positionierung {
		width: 480px;
	}
	#content {
    background: none;
	}
	#logo {
		position: absolute;
		width: 180px;
		height: 160px;
		overflow: hidden;
	}
	#logo img {
		background-color: #fff;
		padding-top: 10px;
	}
	.kontextnavigation {
		display: none;
		position: absolute;
		bottom: 0;
		width: 100%;
		padding-bottom: 30px;
	}

	#spalte_2 {
	  width: 480px;
	}
	#headerbild {
		width: 300px;
		margin-left: 180px;
 	}
	.home #headerbild {
		height: 160px;
 	}
	#inhalte_sp1,
	#inhalte.inhalte_einspaltig #inhalte_sp1
	{
		width: 440px;
	}
	#inhalte_sp2 {
    width: 440px;
	}
	#inhalte_sp2 .fotozeile_bild {
    float: none;
	}

	/* Aktuelles, Termine, Stellen, Presse */
	.liste_filter_feld input {
		width: 130px;
	}
	.liste_filter_button {
		clear: none;
		float: left;
		padding-top: 0;
	}

	/* Overlays */
	#player {
		width: 440px;
	}

	/* Startseite Einrichtung */
	.box_meldungen, .box_meldungen_inhalt, .meldung,
	#box_meldungen, #box_meldungen_inhalt, .meldung {
		width: 440px;
	}

	/* Home */
	.home #inhalte_sp1 {
		width: 440px;
	}
	.home .logos {
		/*display: none;*/
		position: absolute;
		padding-top: 20px;
		bottom: 50px;
		left: 20px;
	}

	/* Fusszeile ans Seitenende */
	#inhalte {
		border-bottom: 30px solid rgba(241,241,241,0);
	}
	#fusszeile {
		position: absolute;
		bottom: 0;
		height: auto;
		padding: 0 0 20px 20px;
	}

}

/*  Breite kleiner als 480 Pixel  */
@media screen and (max-width: 480px) {

	#positionierung {
		width: 320px;
	}
	#content {
    background: none;
	}
	#logo {
		background-color: #fff;
		height: auto;
		width: 160px;
		padding-top: 30px;
	}
	#logo img {
		padding: 0;
		margin-left: -30px;
	}
	.kontextnavigation {
		display: none;
		position: absolute;
		bottom: 0;
		width: 100%;
		padding-bottom: 30px;
	}

	#spalte_2 {
	  width: 320px;
	}
	#topnavigation {
		right: 0;
		top: 30px;
		/*background-color: #e2e2e2;*/
		width: 160px;
		padding: 0;
		height: auto;
	}
	#suche label {
		display: block;
		float: none;
		color: #474747;
		font-size: 90%;
	}
	#suche input#suchbegriff {
    width: 100px;
		background-color: #e2e2e2;
		color: #474747;
	}
	#suche input#suchen {
		width: 45px;
		margin-left: 0;
		text-transform: lowercase;
		background-color: #e2e2e2;
		color: #474747;
	}
	#suche input#suchen:first-letter {
		text-transform: uppercase;
	}
	.mininavi {
		border-top: 0;
	}
	.mininavi_switch a {
		width: 140px;
	}
	.mininavi_inhalt {
		top: 30px;
	}
	#headerbild {
		background-color: #fff;
		position: static;
		margin: 0;
		width: 100%;
 	}
	#headerbild img {
		display: none;
 	}
	#inhalte_sp1,
	#inhalte.inhalte_einspaltig #inhalte_sp1
	{
		width: 280px;
	}
	#inhalte_sp2 {
    width: 280px;
	}

	/* Aktuelles, Termine, Stellen, Presse */
	.liste_filter_feld {
		float: none;
		margin-bottom: 5px;
	}
	.liste_filter_feld input,
	.tx-asjobboerse-pi1 .liste_filter_feld input
	{
		width: 252px;
	}
	.liste_filter_feld select,
	.tx-asjobboerse-pi1 .liste_filter_feld select
	{
		width: 260px;
	}
	.liste_filter_button {
		float: right;
	}

	/* Overlays */
	#player {
		width: 280px;
	}

	/* Startseite Einrichtung */
	.box_meldungen, .box_meldungen_inhalt, .meldung,
	#box_meldungen, #box_meldungen_inhalt, .meldung {
		width: 280px;
	}
	.meldung_bild {
		float: none;
		background-color: #CCD6E0;
	}
	/*.meldung_text {
    height: auto;
    overflow: visible;
	}*/

	/* Home */
	.home #inhalte_sp1 {
		width: 280px;
	}
	.home .logos {
		left: auto;
		right: 20px;
	}
	/*#karte_legende {
    left: 75px;
    top: 10px;
	}*/

	/* Liste statt Karte */
	#karte {
    position: static;
		width: auto;
		height: auto;
		padding: 0 20px;
		margin-top: 30px;
	}
	#karte_legende {
		position: static;
		overflow: hidden;
		height: 26px;
	}
	.legende a.internal-link {
		float: none;
		border: 0;
		color: #fff;
		background-color: #B5113E;
		padding: 5px 10px;
	}
	#karte_bild,
	#karte_orte,
	#karte_overs
	{
		display: none;
	}
	#karte_icons {

		position: static;

	}
	.icons_ort {
		display: block;
	}
	.ort_icons {
		position: static !important;
		width: auto !important;
		background-color: #fff;
		border-bottom: 1px solid #ababab;
		padding: 10px;
	}
	.icon {
		float: none;
		margin: 0.5em 0;
	}
	.icon a {
		width: auto;
		height: auto;
		font-size: 80%;
		font-weight: bold;
		padding-left: 20px;
	}
	.icon a .text {
		display: block;
	}


}