@charset "UTF-8";


/*
12 / 16 = 0.75rem
14 / 16 = 0.875rem
16 / 16 = 1rem
18 / 16 = 1.125rem
20 / 16 = 1.25rem
24 / 16 = 1.5rem
30 / 16 = 1.875rem
36 / 16 = 2.25rem
40 / 16 = 2.5rem
48 / 16 = 3rem

@media (min-width:576px){}
@media (min-width:768px){}
@media (min-width:992px){}
@media (min-width:1200px){}
@media (min-width:1400px){}

*/


/* Copyright (c) 2022 by Eduardo Manso. All rights reserved.
 * This software is the property of Emtype Foundry and may not be reproduced, used, displayed, modified, disclosed or transferred.
 * For use these Webfonts you may obtain a valid license at http://www.emtype.net */

@font-face {
font-family: 'ApproachKoelnRegular';
      src: url('/fonts/ApKo1000-Rg/wf/ApKo1000-Rg.eot'); /* IE9 Compat Modes */
      src: url('/fonts/ApKo1000-Rg/wf/ApKo1000-Rg.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
           url('/fonts/ApKo1000-Rg/wf/ApKo1000-Rg.woff2') format('woff2'), /* Modern Browsers */
           url('/fonts/ApKo1000-Rg/wf/ApKo1000-Rg.woff') format('woff'), /* Modern Browsers */
           url('/fonts/ApKo1000-Rg/wf/ApKo1000-Rg.ttf') format('truetype'); /* Safari, Android, iOS */
      font-style: normal;
      font-weight: normal;
      text-rendering: optimizeLegibility;
}
@font-face {
font-family: 'ApproachKoelnSemiBold';
      src: url('/fonts/ApKo1000-SmBd/wf/ApKo1000-SmBd.eot'); /* IE9 Compat Modes */
      src: url('/fonts/ApKo1000-SmBd/wf/ApKo1000-SmBd.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
           url('/fonts/ApKo1000-SmBd/wf/ApKo1000-SmBd.woff2') format('woff2'), /* Modern Browsers */
           url('/fonts/ApKo1000-SmBd/wf/ApKo1000-SmBd.woff') format('woff'), /* Modern Browsers */
           url('/fonts/ApKo1000-SmBd/wf/ApKo1000-SmBd.ttf') format('truetype'); /* Safari, Android, iOS */
      font-style: normal;
      font-weight: normal;
      text-rendering: optimizeLegibility;
}
@font-face {
font-family: 'ApproachKoelnBold';
      src: url('/fonts/ApKo1000-Bd/wf/ApKo1000-Bd.eot'); /* IE9 Compat Modes */
      src: url('/fonts/ApKo1000-Bd/wf/ApKo1000-Bd.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
           url('/fonts/ApKo1000-Bd/wf/ApKo1000-Bd.woff2') format('woff2'), /* Modern Browsers */
           url('/fonts/ApKo1000-Bd/wf/ApKo1000-Bd.woff') format('woff'), /* Modern Browsers */
           url('/fonts/ApKo1000-Bd/wf/ApKo1000-Bd.ttf') format('truetype'); /* Safari, Android, iOS */
      font-style: normal;
      font-weight: normal;
      text-rendering: optimizeLegibility;
}


html #body {
	font-size:16px !important; /* REM BASE */
}
body#body  {
	font-size:1rem; /*16px*/
	line-height:1.35em;
	color: rgba(45,45,45,1);
	font-family: 'ApproachKoelnRegular', Arial, sans-serif;
}
body#body .t-big,
body#body.tpl- .listbox a {
	font-size: 1.25rem;
	line-height: 1.5rem;
}
    
	



@media (min-width:576px){
	body#body .t-big {
		font-size: 1.25rem;
		line-height: 1.5rem;
	}
}
@media (min-width:768px){
	body#body .t-big{
		font-size: 1.25rem;
		line-height: 1.5rem;
	}
}
@media (min-width:992px){
	body {
		font-size:1.125rem; /*18px*/
	}
	body#body .t-big{
		font-size: 1.25rem;
		line-height: 1.5rem;
	}

}
@media (min-width:1200px){
}
@media (min-width:1400px){
	body {
		font-size:1.375rem; /*22px*/
	}
	body#body .t-big {
		font-size: 1.375rem;
		line-height: 1.8rem;
	}

}


#body h1,
#body h2,
#body h3,
#body h4,
#body h5,
#body h6,
#body .articlehead {
	text-transform: none;
	font-family: 'ApproachKoelnSemiBold', Arial, sans-serif;
    font-style: normal;
    font-weight: normal;
    letter-spacing: -0.1px;
}


body.tpl-2022-startseite h1 {
    color: rgba(239,0,0,1);
}


#body .tinyblock h3,
#body .veranstaltungskalender h3,
body .tinyblock strong,
body .veranstaltungssuche label.fatlabel,
body strong,
body b,
#body .va_detailseite .head_oeffnung,
body .va_detailseite dl dt.headline,
body .va_detailseite dl dt strong {
	font-family: 'ApproachKoelnSemiBold', Arial, sans-serif;
	font-weight: normal;
	font-size: 1rem; /* = 15/16 = 16px -> buggy font*/
}

#body .tinyblock p + h3 {
	margin-top:1rem;
	font-size:1rem;
}


#bodybody .va_detailseite .head_oeffnung {
	font-size: 1rem;
}

#body .va_detailseite h2 {
	font-size: 1rem;
	font-family: "ApproachKoelnSemiBold";
}

body .tinyblock blockquote,
body .tinyblock ul li,
body .adressen dd,
body p {
	font-size: 1rem;
	line-height: 1.38;
}

/* schriftgröße auf anderen seiten */
#body ul.textteaserliste li a h2,
#body .buttonside .inhalt h2,
#body .ueberschrift_veranstaltungskalender,
body .veranstaltungssuche h2,
#body .veranstaltungssuche h3,
#body .teaser.aside ul li a h3,
#body #produktinfocenter h3,
#body #produktinfocenter dl dt.oeffnungszeiten,
#body .produkt .accordionhead h2,
#body label.fdesigner,
#body .adressen dl.zeiten dt.titel,
#body .adressen h3
{
	font-family: 'ApproachKoelnSemiBold', Arial, sans-serif;
	font-size: 1.125rem;
	color:#2d2d2d;
	font-weight: normal;;
}

#body .tinyblock h2,
#body h2.flexheadline,
#body #body .teaser .inhalt h2,
#body .produktsuche .suchbox form.ps_suche .ps_suche_input h3
#body .produktsuche .kachel_wrapper .ps_kachel .ps_kachel_inner h3,
#body .anfahrtpanel fieldset legend {
	font-family: 'ApproachKoelnSemiBold', Arial, sans-serif;
	color:#2d2d2d;
	font-weight:normal;
}

#body .tinyblock h2,
#body:not(.tpl-2022-startseite) h2.flexheadline,
#body .tabbox .tabboxcontrols li a,
#body #produktinfocenter h2,
table.data-table.table-striped.no-topheadtable th,
.filterbox label,
#body .topteaser .inhalt h2
{
	font-family: 'ApproachKoelnSemiBold', Arial, sans-serif;
	font-weight: normal;
	font-size: 1.125rem;
}

#body .veranstaltungssuche table caption a.monat,
#body .teaser.darkhead .inhalt h2  {
	font-weight: normal;
	font-family: 'ApproachKoelnSemiBold', Arial, sans-serif;
}

#body .teaser .inhalt a p,
#body .topteaser .inhalt a p,
#body .buttonside .inhalt a,
#body .buttonside .inhalt a p,
#body .teaser ul li a,
#body .servicesuche .itemlist li a,
#body .tabbox .tabpanel .dottedlinklist li a,
#body .artikel.bigfont p, 
#body .artikel.bigfont ul li, 
#body .artikel.bigfont ol li, e
#body .artikel.bigfont dl dt, 
#body .artikel.bigfont dl dd, 
#body .artikel.bigfont .tinyblock p, 
#body .artikel.bigfont .tinyblock ul li, 
#body .artikel.bigfont .tinyblock ol li, 
#body .artikel.bigfont .tinyblock dl dt, 
#body .artikel.bigfont .tinyblock dl dd, 
#body .artikel.bigfont .tinyblock blockquote,
#body .veranstaltungssuche label,
#body .topteaser .inhalt p,
#body .artikel p,
#body #produktinfocenter ul li a, #produktinfocenter dd a,
#body a.standardlink,
#body .teaser .inhalt > a,
#body .topteaser .inhalt > a,
#body .va_detailseite p {
	font-family: 'ApproachKoelnRegular', Arial, sans-serif;
	font-size:1rem;
	color:#2d2d2d;
	font-weight: normal;
}

/* top-teaser */
#body .buttonside .inhalt a,
#body .buttonside .inhalt a p {
	font-size:0.9rem;
}

#body table.data-table tr th,
#body table.data-table tr td{
	font-family: 'ApproachKoelnRegular', Arial, sans-serif;
	font-size:1rem;
	font-weight: normal;
}


.teaser .inhalt > a:hover,
.teaser .inhalt > a:focus,
.teaser .inhalt > a:active,
.topteaser .inhalt > a:hover,
.topteaser .inhalt > a:focus,
.topteaser .inhalt > a:active,
.teaser .inhalt > a p:hover,
.teaser .inhalt > a p:focus,
.teaser .inhalt > a p:active,
.topteaser .inhalt > a p:hover,
.topteaser .inhalt > a p:focus,
.topteaser .inhalt > a p:active {
	background-color:transparent
}

#body #produktinfocenter dl dt,
#body #produktinfocenter dl dd,
#body #produktinfocenter dd a.linkintern{
	font-size:1rem;
}

#body .articlehead,
#body .servicesuche h2,
#body .tabbox .tabboxcontrols li a:hover,
#body .tabbox .tabboxcontrols li a:focus,
#body .tabbox .tabboxcontrols li a:active,
#body .tabbox .tabboxcontrols li.ui-state-active a {
	color:#2d2d2d;
}

#body .bewertung h2,
#body #produktbeschreibung ul li h2, #produktbeschreibung ul li h3{
	font-size:1rem;
	color:#2d2d2d;
}



#body .produktsuche .alle-dienstleistungen li a,
#body .produktsuche .ps_kachel_inner ul li a,
#body .veranstaltungssuche button,
#body  #veranstaltungssuchergebnis li div span.veranstaltungskalender_datum,
#body .fahrrad-route button,
#body .anfahrtpanel button {
	font-family: 'ApproachKoelnRegular', Arial, sans-serif;
}

#body  #veranstaltungssuchergebnis li div span.veranstaltungskalender_datum,
#body em.flag{
	font-size:.75rem;
	font-weight: normal;
}

#body .allg-hinweis dt.allg-hinweistitel span {
    color: #B00002;
    font-size: 1rem;
    font-weight: normal;
}


/* Anpassungen Stellenangebote */
#body.tpl-2020_stellenangebote .kurzinfos_ueberschrift h2 {
	font-size: 1.125rem;
	padding-bottom: 1%;
	padding-top: 1%;
}

#body.tpl-2020_stellenangebote a.more {
	background-color: unset;
	margin-top: 5px;

}

#body.tpl-2020_stellenangebote h4 {
	font-size: 1.0875rem;

}

/* Anpassungen Veranstaltungen */
#body.tpl-2008_veranstaltungen .va_detailseite p {
	font-size: 1rem;
}

#body.tpl-2008_veranstaltungen .va_detailseite blockquote p {
	font-size: 1rem/*0.865rem*/;
}

#body .va_detailseite dd.anschrift {
	font-size: 1rem
}

#body .va_detailseite ul li a {
	font-size: 1rem
}

#body dd[itemprop="telephone"] a.telLink {
	font-weight: normal;
}
/* Anpassugen für formdesigner mit neuer Schrift */

#body fieldset.fdesigner {
	width:98%;
	margin:1% 2% 1% 1%;
	font-size:90%;
	border:none;
  }

 #body .fdesigner p {
	 font-size: 1rem!important;
 }

 #body a.fdesigner_prev {
font-size: 1rem
 }

 #body a.fdesigner_next, input.fdesigner_next {
	 font-size: 1rem
 }

 /* Anpassungen neue TYPO Verkehrskalender */

 #body .verkehrskalenderdetail .vkd-liste dd {
	 font-size: 1rem
 }

 #body .verkehrskalenderdetail .vkd-liste dt {
	 font-size: 1rem
 }

 #body .verkehrskalenderdetail dl.vkd-liste {
	margin-top: 11px;
 }



 /* anpassungen für adressseiten */
 

#body .adressen .amt-liste .grid_2 .labels dl,
#body .adressen .amt-liste .grid_2 .labels dd,
#body .adressen .amt-liste .grid_2 .labels dd strong,
#body .adressen .amt-liste .grid_2 .labels dd a,
#body .adressen .amt-liste .grid_2 .labels dd[itemprop="telephone"] a.telLink,
#body .adressen .amt-liste .grid_2 .labels dd:last-child,
#body .adressen .amt-liste .grid_2 .labels dt,
#body .adressen dl.amt-liste .grid_2 dd,
#body .adressen dl.amt-liste .grid_2 dt,
#body .adressen .amt-liste dt,
#body .adressen .amt-liste dd
{
	font-size:1rem; /*16px*/
	line-height:1.35em;
	color: rgba(45,45,45,1);
	font-weight: normal;
	font-family: 'ApproachKoelnRegular', Arial, sans-serif;
}

#body .adressen .amt-liste .grid_2 .labels dd a,
#body .adressen .amt-liste .grid_2 .labels dd[itemprop="telephone"] a.telLink {
	text-decoration:none;
/*	color:#ef0000; */
	cursor: pointer;
	padding-left:0;
}
#body .adressen a {
	color: rgba(45,45,45,1);
}

@media screen and (max-width:768px) {
	#body .adressen .hinweis{
		margin-top:1rem;
	}
}

.tabbox .tabboxcontrols li a {
	background-color: #6C655F;
}

/* 8.7.2022 Tabs im Formdesigner waren plötzlich weiss auf hellem hintergrund */
#formulardesigner ul li.ui-state-active a 
 {
	background-color: #eee!important
}

#formulardesigner ul li.ui-state-default a ,
#formulardesigner tab.tabbox .tabboxcontrols li.ui-state-default a
 {
	background-color: #6C655F
}

fieldset div {
	width: 80%
}

.fdesigner_next:hover,
.fdesigner_prev:hover{
	color: rgba(45,45,45,1);
}

#body .tinyblock ol li {
	font-size:1rem;
}