/* Startseite Hauptcontent volle Breite */
section#content.startcontent {
	margin-bottom: 0;
	min-height: 20px;
	width: 980px;
}

.start_sonderteaser-rechts {
	float: right;
	font-size: 18px;
	margin-right: 32px;
	margin-bottom: 5px;
}

.start_sonderteaser-rechts1 {
	margin-right: 30px;
	display: block;
	font-weight: bold;
	float: left;
}

.start_sonderteaser-rechts2 {
	display: block;
	font-weight: bold;
	float: right;
	margin-top: 4px;
}

.teaser-start-d {
	margin-bottom: 40px;
	height: 169px;
}

.linkgrafik::after {
	content: '';
	position: absolute;
	width: 25px;
	height: 25px;
	background-image: url(https://www.diejugendherbergen.de/cms/upload/design/linkgrafik.png);
	overflow: hidden;
	margin-top: -2px;
	margin-left: 8px;
}

.linkgrafikorange::after {
	content: '';
	position: absolute;
	width: 25px;
	height: 25px;
	background-image: url(https://www.diejugendherbergen.de/cms/upload/design/linkgrafikorange.png);
	overflow: hidden;
	margin-top: -2px;
	margin-left: 8px;
}

.start-linktextbox {
	padding: 18px 0 10px 0;
	color: #666;
}

.start-linktextbox .headline {
	font-size: 16px;
	font-weight: bold;
	color: #eb690b;
	margin-bottom: 10px;
}

.abstand-startbox {
	height: 30px;
}

a.text-linkgrafik {
	color: #eb6909 !important;
	text-decoration: none;
	font-size: 16px;
	font-weight: bold;
	padding-right: 32px;
}

@media only screen and (min-width: 681px) and (max-width: 1020px) {
	.abstand-startbox {
		height: 25px;
	}

	.start-linktextbox {
		padding: 10px 0 7px 0;
		color: #666;
	}

	a.text-linkgrafik {
		color: #eb6909 !important;
		text-decoration: none;
		font-size: 14px;
		font-weight: bold;
	}
}

@media screen and (max-width: 680px) {
	.abstand-startbox {
		height: 25px;
	}

	.start-linktextbox {
		padding: 10px 0 7px 0;
		color: #666;
	}

	a.text-linkgrafik {
		color: #eb6909 !important;
		text-decoration: none;
		font-size: 14px;
		font-weight: bold;
	}
}

.aktuelles-hight {
	min-height: 115px;
}

.aktuelles-hight22 {
	min-height: 153px;
}

.teasertext-hight {
	height: 148px;
}

.teasertext-hight22 {
	height: 186px;
}

.box-bg {
	background: #f0f0ee;
}

.startheadline19 {
	font-size: 16px;
	color: #eb690b;
	line-height: 18px;
	padding-top: 10px;
	padding-bottom: 12px;
	margin: 0;
	font-weight: 700;
	text-decoration: none;
}

.startheadline19k {
	font-size: 12px;
}

.startheadline119 {
	font-size: 14px;
	color: #fff;
	line-height: 18px;
	padding-top: 8px;
	padding-bottom: 8px;
	margin: 0;
	font-weight: 700;
	text-decoration: none;
	background: #b6b3b3;
	padding-left: 10px;
}

.teaser19 {
	width: 216px;
	background: #f0f0ee;
	padding: 16px 10px 11px 10px;
	margin-bottom: 10px;
}

a.button-first19,
#newsletter_form_st input[type='submit'] {
	display: inline-block;
	padding: 2px 16px;
	background: #fff;
	border: 1px solid #d7d7d2;
	color: #009ee0;
	font-weight: bold;
	text-decoration: none;
}

.teaser-starttop22-1 {
	float: left;
	padding-right: 10px;
	width: var(--width-tablet);
	height: 148px;
}

.teaser-starttop22-2 {
	float: left;
	padding-right: 0;
	width: var(--width-mobil);
	height: 148px;
}

@media only screen and (min-width: 681px) and (max-width: 1020px) {
	.teaser-starttop22-1 {
		float: left;
		padding-right: 10px;
		width: 390px;
		height: 100px;
	}

	.teaser-starttop22-2 {
		float: left;
		padding-right: 0;
		width: 250px;
		height: 100px;
	}
}

@media screen and (max-width: 680px) {
	.teaser-starttop22-1 {
		float: left;
		padding-right: 0;
		width: var(--width-mobil);
		height: 148px;
		padding-bottom: 10px;
	}

	.teaser-starttop22-2 {
		float: left;
		padding-right: 0;
		width: var(--width-mobil);
		height: 148px;
	}
}

.teaser-starttop21-2 {
	background: #ededed;
	padding: 16px 0 0 14px;
	float: left;
	width: 730px;
	height: 94px;
}

.teaser-starttop21-2-headline {
	font-size: 19px;
	letter-spacing: -0.01em;
	font-weight: bold;
	margin-bottom: 12px;
	display: block;
}

.teaser-starttop21-2-text {
	font-size: 14px;
	letter-spacing: -0.01em;
	line-height: 24px;
}

@media only screen and (min-width: 681px) and (max-width: 1020px) {
	.teaser-starttop21-2 {
		padding: 12px 0 0 14px;
		width: 400px;
		height: 98px;
	}

	.teaser-starttop21-2-headline {
		font-size: 11px;
		font-weight: bold;
		margin-bottom: 5px;
		letter-spacing: -0.08em;
	}

	.teaser-starttop21-2-text {
		font-size: 11px;
		line-height: 14px;
		font-weight: bold;
		letter-spacing: -0.03em;
	}
}

@media screen and (max-width: 680px) {
	.teaser-starttop21-2 {
		padding: 15px 0 0 14px;
		width: 305px;
		height: 140px;
	}

	.teaser-starttop21-2-headline {
		font-size: 12px;
		font-weight: bold;
		margin-bottom: 5px;
	}

	.teaser-starttop21-2-text {
		font-size: 12px;
		line-height: 20px;
		letter-spacing: -0.03em;
	}
}

.erlebnistag {
	box-shadow: 0 7px 7px -6px rgba(0, 0, 0, 0.15);
	border-bottom: 1px solid #e8e8e8;
	margin-bottom: 10px;
	webkit-box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.15);
	height: 44px;
}

.erlebnistag .jhname {
	line-height: 40px;
	font-size: 14px;
	color: #eb690b;
	font-weight: bold;
	float: left;
}

.erlebnistag .right {
	float: right;
}

.erlebnistag .button {
	padding: 4px 10px;
	background: #009ee0;
	color: #fff;
	border: 1px solid #009ee0;
	margin-top: 5px;
	-webkit-appearance: none;
	font-weight: bold;
	text-decoration: none;
	font-size: 12px;
	float: right;
}

@media screen and (max-width: 680px) {
	.erlebnistag {
		height: 72px;
	}

	.erlebnistag .jhname {
		line-height: 25px;
	}
}

.erlebnistag .button {
	padding: 4px 6px;
	width: 308px;
	text-align: center;
}

.lnk-klein {
	font-size: 11px;
	margin-top: 10px;
	letter-spacing: -0.02em;
}

.startheadline {
	background-color: #ededed;
	padding-left: 10px;
}

.startcontent .jh-linktextbox {
	margin-bottom: 0;
	position: relative;
}

.box112 {
	height: 124px;
}

.jh-linktextbox-lnk {
	position: absolute;
	bottom: 10px;
}

.start-newsbox {
	margin-bottom: 40px;
}

.djh-logo {
	margin-top: 160px;
}

a.lnk {
	color: #eb690b;
}

#subleiste {
	position: relative;
}

#subleiste ul {
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.75);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.75);
}

#subleiste ul {
	column-count: 4;
	list-style: none;
	margin-top: 0;
	margin-bottom: 20px;
}

#subleiste ul li {
	color: #7f7e7e;
	font-size: 14px;
	padding: 7px;
}

#subleiste ul li a {
	color: #7f7e7e;
	text-decoration: none;
}

@media only screen and (min-width: 681px) and (max-width: 1020px) {
	section#content.startcontent {
		width: var(--width-tablet);
	}

	.start_sonderteaser {
		margin-top: 18px;
	}
	.start_sonderteaser-rechts {
		font-size: 16px;
		float: right;
		text-align: right;
		margin-right: 32px;
	}

	.start_sonderteaser-rechts1 {
		margin-right: 20px;
		display: block;
		font-weight: bold;
		float: left;
	}

	.start_sonderteaser-rechts2 {
		display: block;
		font-weight: bold;
		float: right;
		margin-bottom: 5px;
	}

	.teaser-start-d {
		margin-bottom: 40px;
		height: 412px;
	}

	.aktuelles-hight {
		height: 135px;
	}

	.aktuelles-hight22 {
		min-height: 253px;
	}

	.teasertext-hight {
		height: 168px;
	}

	.teasertext-hight22 {
		height: 286px;
	}

	.teaser19 {
		width: 300px;
		background: #f0f0ee;
		padding: 31px 10px;
		margin-bottom: 10px;
	}

	.pikto {
		width: var(--width-mobil);
	}

	.pikto1 {
		margin-bottom: 10px;
	}

	.pikto2 {
		margin-left: 10px;
		margin-bottom: 10px;
	}

	.pikto3 {
		margin-left: 0;
		margin-bottom: 40px;
	}

	.pikto4 {
		margin-left: 10px;
	}

	.box112 {
		height: 103px;
	}

	.lnk-klein {
		font-size: 11px;
		margin-top: 10px;
	}

	.newsstart {
		display: block;
	}

	.news19 {
		width: var(--width-tablet);
		background: url(https://www.diejugendherbergen.de/cms/css/img/bg_newsletter19-mid.jpg) no-repeat;
	}

	.newsletterform19 {
		margin-left: 224px;
	}

	.newsletterAnmeldungDanke2013 {
		width: 596px;
	}

	#subleiste ul {
		column-count: 3;
		list-style: none;
		margin-top: 0;
		margin-bottom: 20px;
	}
}

@media screen and (max-width: 680px) {
	section#content.startcontent {
		width: 100%;
	}

	section#content.startcontent {
		margin-top: 16px !important;
		margin-bottom: 0;
	}

	.start_sonderteaser {
		height: 45px;
		width: 100%;
		margin-bottom: 0;
		margin-top: 0;
		display: flex;
		justify-content: space-around;
	}

	.start_sonderteaser-rechts {
		margin-bottom: 0;
		margin-top: 0;
		text-align: right;
		float: none;
	}

	.start_sonderteaser-rechts1 {
		margin-bottom: 10px;
		display: block;
		font-weight: bold;
		float: left;
		margin-right: 0px;
	}

	.start_sonderteaser-rechts2 {
		margin-bottom: 20px;
		display: block;
		font-weight: bold;
		font-size: 16px;
	}

	.teaser-start-d {
		margin-top: 0;
		margin-bottom: 30px;
		height: 422px;
	}

	.aktuelles-hight {
		min-height: 140px;
	}

	.aktuelles-hight22 {
		height: auto;
	}

	.teasertext-hight {
		height: 168px;
	}

	.teasertext-hight22 {
		height: auto;
	}

	.teaser19 {
		width: 300px;
		background: #f0f0ee;
		padding: 34px 10px;
		margin-bottom: 10px;
	}

	.pikto {
		width: var(--width-mobil);
	}

	.pikto1 {
		margin-bottom: 10px;
	}

	.pikto2 {
		margin-left: 0;
		margin-bottom: 10px;
	}

	.pikto3 {
		margin-left: 0;
		margin-bottom: 10px;
	}

	.pikto4 {
		margin-left: 0;
		margin-bottom: 40px;
	}

	.box112 {
		height: 103px;
	}

	.lnk-klein {
		font-size: 11px;
		margin-top: 10px;
	}

	#subleiste ul {
		column-count: 1;
		list-style: none;
		margin-top: 0;
		margin-bottom: 20px;
	}
}

.bewertungs-accordion {
    width: 100%;
}

.bewertungs-accordion .bewertungs-accordion-item {
    background-color: #f7f7f7;
    border: 1px solid #ddd;
    margin-bottom: 10px;
    border-radius: 4px;
}

.bewertungs-accordion .bewertungs-accordion-item .accordion-arrow {
    width: 20px;
    height: 20px;
    float: right;
    transition: transform 0.3s ease;
}

.bewertungs-accordion .bewertungs-accordion-item .accordion-star {
    width: 98px;
    height: 16px;
}

.bewertungs-accordion .bewertungs-accordion-item .accordion-button.active .accordion-arrow {
    transform: rotate(90deg);
}

.bewertungs-accordion .bewertungs-accordion-item .accordion-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #00b4ff;
    color: white;
    padding: 4px 15px;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: background-color 0.3s ease;
    cursor: pointer;
    font-size: 14px;
}

.bewertungs-accordion .bewertungs-accordion-item .accordion-button:hover,
.bewertungs-accordion .bewertungs-accordion-item .accordion-button:focus {
    background-color: #009ee0;
}

.bewertungs-accordion .bewertungs-accordion-item .accordion-content {
    padding: 0 15px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
    background-color: white;
}

.bewertungs-accordion .bewertungs-accordion-item .accordion-content p {
    margin: 15px 0;
    line-height: 1.5;
}

.bewertungs-accordion .bewertungs-accordion-item .star-bewertung {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.bewertungs-accordion .bewertungs-accordion-item .bewerbung-header {
    display: flex;
}

.bewertungs-accordion .bewertungs-accordion-item .bewertung-titel {
    display: flex;
    flex-direction: column;
    margin-left: 70px;
}

.bewertungs-accordion .bewertungs-accordion-item .bewertung-titel .bold-text {
    font-size: 14px;
    font-weight: bold;
}

.bewertungs-accordion .bewertungs-accordion-item .bewertung-titel h2 {
    margin-top: 0;
    margin-bottom: 8px;
}

.bewertungs-accordion .bewertungs-accordion-item .bewertung-titel p {
    margin: 0;
}

@media screen and (max-width: 680px) {
    .bewertungs-accordion .bewertungs-accordion-item .bewerbung-header {
        flex-direction: column;
		align-items: flex-start
    }

    .bewertungs-accordion .bewertungs-accordion-item .bewerbung-header .bold-text {
        margin-bottom: 0;
    }
	.bewertungs-accordion .bewertungs-accordion-item .star-bewertung .bold-text {
		display: none;
	}

	.bewertungs-accordion .bewertungs-accordion-item .accordion-button{
		padding: 12px 15px;

	}

	.bewertungs-accordion .bewertungs-accordion-item .star-bewertung {
        margin-left: 10px;
    }
	.bewertungs-accordion .bewertungs-accordion-item .bewertung-titel{
		margin-left: 10px;
	}
}


/*
Schmaler Teaser Startseite
*/
.schmal-links-gesamt {
	float: left;
	margin-bottom: 15px;
}
.schmal-links {
	float: left;
}
.schmal-mitte {
	float: right;
}
.schmal-rechts {
	float: right;
}
.schmal-rechts-footer {
	display: flex;
}
/* Tablet Breite (Maximale Breite) / Bild-Gesamt-Breite * Breite den Bildteile */
.schmal-rechts-footer div:nth-child(1) {
	flex-basis: calc(var(--width-tablet) / 370 * 125);
}
.schmal-rechts-footer div:nth-child(2) {
	flex-basis: calc(var(--width-tablet) / 370 * 114);
}
.schmal-rechts-footer div:nth-child(3) {
	flex-basis: calc(var(--width-tablet) / 370 * 131);
}

@media only screen and (min-width: 681px) and (max-width: 1020px) {
	.schmal-mitte {
		float: none;
	}
	.neben {
		float: left;
	}
}

@media only screen and (max-width: 680px) {
	.neben {
		float: left;
	}
	.schmal-links-gesamt,
	.schmal-links-gesamt img {
		width: 100%;
	}
	.schmal-rechts,
	.schmal-rechts img {
		width: 100%;
	}
	.popup-lnk .img-fluid {
		width: 100%;
	}
}