/* pt-sans-regular - latin */
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/pt-sans-v11-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('PT Sans'), local('PTSans-Regular'),
       url('../fonts/pt-sans-v11-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/pt-sans-v11-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/pt-sans-v11-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/pt-sans-v11-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/pt-sans-v11-latin-regular.svg#PTSans') format('svg'); /* Legacy iOS */
}

/* raleway-regular - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/raleway-v14-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Raleway'), local('Raleway-Regular'),
       url('../fonts/raleway-v14-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/raleway-v14-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/raleway-v14-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/raleway-v14-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/raleway-v14-latin-regular.svg#Raleway') format('svg'); /* Legacy iOS */
}

/* raleway-700italic - latin */
@font-face {
  font-family: 'Raleway';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/raleway-v14-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local('Raleway Bold Italic'), local('Raleway-BoldItalic'),
       url('../fonts/raleway-v14-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/raleway-v14-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/raleway-v14-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/raleway-v14-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/raleway-v14-latin-700italic.svg#Raleway') format('svg'); /* Legacy iOS */
}

/* raleway-700 - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/raleway-v14-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Raleway Bold'), local('Raleway-Bold'),
       url('../fonts/raleway-v14-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/raleway-v14-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/raleway-v14-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/raleway-v14-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/raleway-v14-latin-700.svg#Raleway') format('svg'); /* Legacy iOS */
}


/* ALLGEMEIN */

html {
	font-family: 'PT Sans';
	font-size: 18px;
	line-height: 1.3;
	/*color: #9f2626;*/
	-moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

a {color: #61615b; text-decoration: none;}
a:hover {color: #b51913;}

h1, h2, h3 {margin: 1.5em 0 0.5em; font-family: 'Raleway'; font-style: italic; text-transform: uppercase; color: #9f2626;}

figure.float_left {margin-right: 2em;}
figure.float_right {margin-left: 2em;}

.abstand_oben {margin-top: 1em;}

.mod_navigation ul,
.mod_article > *,
#footer .inside {
	width: calc(100vw - 2em);
	max-width: 1200px;
	margin: 0 auto;
	padding: 1em;
}



/* HEADER */

#header {
	width: 100%;
	position: -webkit-sticky;
	position: sticky;
	top: -104px;
	border-bottom: 1px solid white;
	background: #b51913;
	transition: 2s;
	z-index: 2;
}
#logo {
	width: 196px;
	height: 196px;
	line-height: 196px;
	margin: 0 auto;
	position: absolute;
	top: 10px;
	left: calc(50% - 98px);
	border-radius: 98px;
	text-align: center;
	background: #ffd9a9;
	z-index: 1;
}
#logo img {
	width: 140px;
	vertical-align: middle;
	padding: 0 0 10px 10px;
}


/* Hauptmenü */
.mod_navigation {
	padding-top: 98px;
	font-family: 'Raleway';
	font-weight: 400;
	text-transform: uppercase;
	color: #f39300;
}
.mod_navigation ul {padding: 1em 1em 0.6em;}
.mod_navigation li {
	display: inline-block;
	padding: 0.3em 1em 0.3em 0;
}

.index .mod_navigation.zurueck {display: none;}

.mod_navigation li.extra {padding-right: 0;}
.mod_navigation li.active {font-weight: bold;}
.mod_navigation li a {color: #f39300;}
.mod_navigation li a:hover {color: white;}



/* INHALT */

#container {margin-bottom: 5em;}
.piktogram figure {margin-top: 2em; margin-bottom: 2em;}

/* Hintergrundfarbe */
.hg_rot {color: white; background: #b51913; overflow: visible; position: relative; padding: 1em; border-top: 1px solid white; border-bottom: 1px solid white;}
.hg_rot h1, .hg_rot h2, .hg_rot h3 {color: white;}
.hg_rot a {color: #f39300;}
.hg_rot a:hover {color: white;}
.hg_rot:after, .hg_rot:before {
	content: "";
	display: block;
	background-color: #b51913;
	position: absolute;
	left: 100%;
	top: 0; bottom: 0;
	width: 100%;
	z-index: -1;
}
.hg_rot:before {left: auto; right: 100%;}


/* Titelfoto */
.mod_article > .titelfoto {width: unset; padding: 0; position: relative;}
.titelfoto h1 {width: 64%; position: absolute; bottom: 0; color: #b51913;}


/* Wegweiser */

/* Wegweiser: Filter */
.ce_metamodels_frontendfilter {color: black;}
.ce_metamodels_frontendfilter .mm_checkbox {margin: 0 20px 8px 0;}
.ce_metamodels_frontendfilter .mm_checkbox.kat_beratung:before {content: ''; display: block;}
.ce_metamodels_frontendfilter .mm_checkbox > label {display: none;}
.ce_metamodels_frontendfilter .mm_checkbox fieldset legend {display: none;}
.ce_metamodels_frontendfilter .mm_checkbox fieldset input {display: none;}
.ce_metamodels_frontendfilter .mm_checkbox fieldset label:before {
	content: '✓';
	display: inline-block;
	width: 17px;
	height: 20px;
	border-radius: 10px;
    margin-right: 8px;
    padding-left: 3px;
}

.ce_metamodels_frontendfilter .alter_0_3 fieldset label:before		{color: #a8a8a8; background: #a8a8a8;}
.ce_metamodels_frontendfilter .alter_3_6 fieldset label:before 		{color: #ffe100; background: #ffe100;}
.ce_metamodels_frontendfilter .alter_6_11 fieldset label:before 	{color: #f7b284; background: #f7b284;}
.ce_metamodels_frontendfilter .alter_11_14 fieldset label:before 	{color: #e30613; background: #e30613;}
.ce_metamodels_frontendfilter .alter_14 fieldset label:before 		{color: #753a0b; background: #753a0b;}
.ce_metamodels_frontendfilter .kat_beratung fieldset label:before 	{color: #0099f0; background: #0099f0;}
.ce_metamodels_frontendfilter .kat_begegnung fieldset label:before 	{color: #65c200; background: #65c200;}
.ce_metamodels_frontendfilter .kat_freizeit fieldset label:before 	{color: #007000; background: #007000;}

.ce_metamodels_frontendfilter .mm_checkbox.unused {color: #61615b;}

.ce_metamodels_frontendfilter .mm_checkbox:hover fieldset label:before,
.ce_metamodels_frontendfilter .mm_checkbox.used  fieldset label:before {color: white;}
.ce_metamodels_frontendfilter .alter_3_6:hover fieldset label:before,
.ce_metamodels_frontendfilter .alter_3_6.used  fieldset label:before {color: black;}

.filter_alter .formbody {column-count: 2; height: 6em;}


/* Wegweiser: Kacheln */

.ce_metamodel_content .layout_full {
	display: flex;
	flex-wrap: wrap;
	font-size: 0.8em;
	color: black;
}
.layout_full .item {
	width: 21.8%;
	min-width: 200px;
	margin: 0 0.8% 10px 0;
	padding: 14px;
	border-radius: 5px;
	background: #eee;
}
.item .name {font-size: 1.3em; font-weight: bold;}

.kreis {
	display: block;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    font-size: 0.7em;
    text-align: center;
    cursor: default;
}
.ce_metamodel_content .alter_0_3,
.ce_metamodel_content .alter_3_6,
.ce_metamodel_content .alter_6_11,
.ce_metamodel_content .alter_11_14,
.ce_metamodel_content .alter_14,
.ce_metamodel_content .kat_beratung,
.ce_metamodel_content .kat_begegnung,
.ce_metamodel_content .kat_freizeit {display: inline-block; margin: 8px 0;}

.alter_0_3 .kreis {color: #a8a8a8; background: #a8a8a8;}
.alter_3_6 .kreis {color: #ffe100; background: #ffe100;}
.alter_6_11 .kreis {color: #f7b284; background: #f7b284;}
.alter_11_14 .kreis {color: #e30613; background: #e30613;}
.alter_14 .kreis {color: #753a0b; background: #753a0b;}
.kat_beratung .kreis {color: #0099f0; background: #0099f0;}
.kat_begegnung .kreis {color: #65c200; background: #65c200;}
.kat_freizeit .kreis {color: #007000; background: #007000;}

.ce_metamodel_content .field:after {display: none;}
.ce_metamodel_content .alter_0_3:after {content: 'von 0 - 3 Jahren'; background: #a8a8a8; color: white;}
.ce_metamodel_content .alter_3_6:after {content: 'von 3 - 6 Jahren'; background: #ffe100;}
.ce_metamodel_content .alter_6_11:after {content: 'von 6 - 11 Jahren'; background: #f7b284;}
.ce_metamodel_content .alter_11_14:after {content: 'von 11 - 14 Jahren'; background: #e30613; color: white;}
.ce_metamodel_content .alter_14:after {content: 'ab 14 Jahren'; background: #753a0b; color: white;}
.ce_metamodel_content .kat_beratung:after {content: 'Beratungsangebote'; background: #0099f0; color: white;}
.ce_metamodel_content .kat_begegnung:after {content: 'Begegnungs- und Bildungsangebote'; background: #65c200;}
.ce_metamodel_content .kat_freizeit:after {content: 'Freitzeit- und Ferienangebote'; background: #007000; color: white;}

.ce_metamodel_content .field.tooltip:after {
	display: block;
	position: absolute;
	border: 1px solid darkgrey;
	margin-top: 6px;
	padding: 3px 6px;
	font-size: 0.8em;
}
.item .plz {float: left; padding-right: 0.3em;}
.item .email {margin-top: 8px;}


/* Formular */
.kontaktformular form {color: black; margin-top: 2em;}
.kontaktformular .widget {margin-bottom: 5px;}
.kontaktformular label {width: 6em; display: inline-block;}
.kontaktformular .checkbox_container label {width: auto; width: unset; max-width: calc(100% - 25px); vertical-align: top;}
.kontaktformular .widget-textarea label {vertical-align: top;}
.kontaktformular input,
.kontaktformular textarea {width: calc(100% - 7em); color: black; border: 1px solid grey; border-radius: 2px;}

.kontaktformular input[type="checkbox"],
.kontaktformular input[type="radio"] {width: auto; width: unset;}

.kontaktformular fieldset {margin:0px;}
.kontaktformular fieldset legend {float: left;}
.kontaktformular fieldset > span {display: block; margin-left: 6em;}

.kontaktformular p {margin-bottom: 0;}

.kontaktformular .widget-submit {text-align: center; margin-top: 30px;}
button {
	background: #f39300;
	padding: 4px 30px;
	border: 2px solid white;
	border-radius: 4px;
	text-transform: uppercase;
}
button:hover {color: white; background: #b51913;}


/* Slider */
.ce_slick-slider {overflow: visible; padding-top: 60px;}
.slick-arrow {position: absolute; top: calc(50% - 0.7em); border: none; background: none; font-size: 3em;}
.slick-arrow:hover {color: white;}
.slick-prev {left: -50px;}
.slick-next {right: -50px;}

.slick-dots {display: block; text-align: center; font-size: 20px; margin: 5px 0 0; padding: 0;}
.slick-dots li {display: inline list-item; color: #666;}
.slick-dots li.slick-active {color: black;}
.slick-dots li button {display: none;}

.slick-slide {margin: 0 10px;}
.slick-slide a:hover {opacity: 0.8;}
.slick-list {margin: 0 -10px;}

/* Galerie */
.ce_gallery ul {display: flex;}
.ce_gallery li figure {margin: 0 10px 10px 0;}
.ce_gallery li.row_last figure {margin-right: 0;}

/* Spalten */
.rs-columns {display: flex; flex-wrap: wrap;} /*sonst stimmt margin nicht */


/* FOOTER */
#footer {background: #b51913;}

/* Footer-Menü */
#footer nav {text-align: right;}
#footer ul {
	margin: 20px 0 60px;
	padding: 0;
	list-style: none;
	font-size: 0.9em;
}
#footer li {display: inline-block; padding: 0 6px;}
#footer li.last {padding-right: 0;}
#footer li a {color: #f39300;}
#footer li a:hover {color: white}
#footer li strong {font-weight: normal;}


/*Cookiebar */
.cookiebar__button {background-color: #f39300;}.cookiebar__button:hover {background-color: #b51913;}




/*********** RESPONSIV ***********/
/*********** RESPONSIV ***********/
/*********** RESPONSIV ***********/
/*********** RESPONSIV ***********/




/*********** DESKTOP BREIT ***********/
@media (max-width:1200px) {

.titelfoto h1 {margin-left: 0.5em;}

.layout_full .item {width: 28%;}
.ce_metamodel_content .layout_full {justify-content: space-between;}

} /* Ende Desktop schmal */



/*********** DESKTOP SCHMAL ***********/
@media (max-width:950px) {

.filter_alter .formbody {column-count: 1; height: unset;}

} /* Ende Desktop schmal */



/*********** TABLET BREIT ***********/
@media (max-width:850px) {
	
html {font-size: 16px;}
.custom {margin-top: -32px; height: 32px;}
.mod_onepage_navigation li {padding: 0.3em 1em 0.3em 0; font-size: 1em;}
.mod_onepage_navigation li.extra {padding-right: 0;}

} /* Ende Tablet breit */



/*********** TABLET SCHMAL ***********/
@media (max-width:750px) {

#logo {left: unset; right: 1em;}
.titelfoto h1 {position: relative;}

.rs-column.-medium-first-row {margin-top: 0;}
.layout_full .item {width: 43%;}

.kontaktformular label {width: 5em;}
.kontaktformular input, .kontaktformular textarea {width: calc(100% - 6em);}
.kontaktformular fieldset > span {margin-left: 5em;}
.kontaktformular fieldset legend {float: none;}

} /* Ende Tablet schmal */




/*********** MOBIL ***********/
@media (max-width:500px) {

html {font-size: 15px;}

#header {top: -142px;}
#header .inside {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column-reverse;
}

.mod_navigation {padding-top: 0;}

#logo {
	position: relative;
	left: unset;
	right: 0;
	width: 100%;
	height: unset;
	border-radius: 0;
	top: 0;
	padding: 10px 0;
	line-height: 1em;
}
.titelfoto h1 {font-size: 6.2vw;}

.layout_full .item {width: 100%; margin-right: 0;}

.mod_article > *,
#footer .inside {
	padding: 0 10px;
}


} /* Ende Mobil */

