/* -----  Reset    ----- */

*, *:before, *:after {
    margin: 0 auto;
    padding: 0;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

.invisible, 
.mod_search .relevance, .mod_search p.url, .mod_search p.info {
    display: none;
}

sub, sup {
    font-size: 0.7em;
    line-height: 0.5;
}

figure {
    line-height: 0.1;
    text-align: center;                  		/* alle Fotos in Figure-Box zentrieren */
}

img {
    /*width: auto;*/
    width: 100%;
    /*max-width: 100%;*/
    height: auto;
    max-height: 100%;
}


/* -----  Layout    ----- */

@media (min-width: 1601px) {
    #header {
        padding-top: 60px;
    }
}

@media (max-width: 1600px) {
    #header {
        padding-top: 3.75vw;                    /* 60px bei 1600px Breite */
    }
}

#wrapper {
    position: relative;                         /* vor den fixed HG-Container setzen */
}

#container {
    position: relative;                         /* vor den fixed Footer setzen */
    z-index: 10;
}

#header, #container, #footer {
    width: 78%;
    min-width: 260px;
    max-width: 1400px;
}

.mod_article {
	position: relative;						
	/* Bezugspunkt für klickbaren Link + für Anführungszeichen bei Presse*/
}


/* -----  HG-Bilder, Seitenformat 2zu1 wenn möglich   ----- */

#hg-container {
    position: fixed;
    width: 100%;
    height: 480px;                              /* für < mobile Safari 8 */
    background-size: cover;
}

body:not(.sf6):not(.sf7) #hg-container {
    height: 100vh;
    /*min-height: 450px;*/
}

/*#hg-container {
    background-image: url("css-img/HGs/hg_20180325-NIK_5337_2000x1000.jpg");
    background-position: 48% 55%;
}*/

/* HG-Fotos in Quer- und Hochformat gleich groß */
/*@media (max-width: 1050px), (max-height: 1050px) {
	body:not(.sf6):not(.sf7) #hg-container {
		background-size: auto 80vmax;
	}
}*/

#hg-container .inside {
    width: 94%;
	height: 100%;
    margin-right: 0;
	opacity: 0.07;
    background-image: url("css-img/HGs/HG_bakterie.svg");
    background-size: 140% auto;
    background-position: 0% 10%;
    background-repeat: no-repeat;
}


/* -----    Navi    ----- */

.navi.mobil, .navi.breadcrumb,
#navitoggle, #naviclose {
    display: none;
}

.navi.main ul.level_1, .navi.legal ul.level_1 {
    padding-left: 5%;
    padding-right: 5%;
}

/*.navi.sub ul, .navi.legal ul {
	max-width: 1800px;
}*/

/*@media (min-width: 2250px) {
	.navi.logo ul, .navi.sub ul, .navi.legal ul {
		width: 80%;
	}
}*/

.navi li {
    list-style-type: none;
}


  /* -----    Logo + Burger + Closer   ----- */

#navitoggle, #naviclose {
    position: fixed;
    width: 93.75%;                              /* 100% - 6.25% */
    font-size: 0.001em;                         /* Hauptnavi oben bündig */
}

#navitoggle, #naviclose {
    right: 6.25%;                               /* in der 12,5%-breiten Spalte zentrieren */
}

.navi.logo li {
    height: 1px;								/* soll nicht Navi sub überdecken */
}

.navi.logo li a, .navi.logo li strong, #navitoggle, #naviclose {
    width: 2.105rem;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

#navitoggle, #naviclose {
	margin-right: -1.053rem;                     /* Textmitte in der Mitte der Spalte zentrieren */
	height: 2.105rem;
}

#navitoggle {
    background-image: url("css-img/Burger.svg");
}

#naviclose {
    background-image: url("css-img/Closer.svg");
    top: 3.5vw;
    z-index: 25;
}

body:not(.sf6):not(.sf7) .logo li a, body:not(.sf6):not(.sf7) .logo li strong {
    max-height: 80vh;
    max-height: calc(100vh - 7.5vw);
}

#seitentitel {
	display: none;
}

@media (max-width: 1000px) { 
    .navi.main, .navi.sub, .navi.legal, .suchschlitz-obenrechts {
        display: none;
    }

    .navi.mobil, .navi.breadcrumb {
    	display: block;
    }

    #naviclose, #navitoggle {
        display: inline-block;
    }

    .navi.mobil, #naviclose {
    	opacity: 0;
    	-webkit-transform: scaleY(0);
                transform: scaleY(0);
		-webkit-transition: transform 0s 0.7s, opacity 0.7s;
                transition: transform 0s 0.7s, opacity 0.7s;
    }

    body.active .navi.mobil,  body.active #naviclose {
        -webkit-transform: scaleY(1);
                transform: scaleY(1);
		opacity: 1;
		-webkit-transition: transform 0s 0s, opacity 0.7s;
                transition: transform 0s 0s, opacity 0.7s;
    }

    body.active #navitoggle {
    	opacity: 0;
    	-webkit-transition: opacity 0.7s;
                transition: opacity 0.7s;
    }

    #container {
        padding-top: 2rem;
    }

    body.startseite #container {
        padding-top: 3rem;
    }

    /*#seitentitel {
		display: inline-block;
		margin-bottom: 7rem;
		font-size: 2rem;
    	line-height: 0.8;        
    	font-weight: normal;
		text-transform: uppercase;
	}

	body.ios #seitentitel {
		margin-top: -0.07em;
	}

	body.sub #seitentitel {
		text-transform: none;
	}*/

	.suchschlitz-inline input.text {
		max-width: 49vw;
	}
}


  /* -----    Navi main    ----- */

.navi.main {
    padding-bottom: 150px;						/* für < Safari 8 */
}

body:not(.sf6):not(.sf7) .navi.main {
    padding-bottom: 8rem;
}

body.no-navi-ani:not(.sf6):not(.sf7) .navi.main,
body.navi-sub:not(.sf6):not(.sf7) .navi.main {
    padding-bottom: 4.5rem;
}


.navi.main ul.level_1 {
    text-align: justify;
}

.navi.main .level_1:after {
    content: "";
    display: inline-block;
    width: 100%;
}

.navi.main ul.level_1 li {
    display: inline-block;
    text-transform: uppercase;
    margin-top: 0;
}

.navi.main ul.level_2 li {
    text-transform: initial;
}

.navi.main li {
	transition: transform 0.7s;
}

.navi.main li.startseite, .navi.breadcrumb li {
    position: relative;
}

.navi.main li.startseite:after, 
.navi.breadcrumb li:first-child:after, body.startseite .navi.breadcrumb li:after {
    content: "Steuerberater in Lohmar";
    display: block;
    font-size: 0.8em;
    text-transform: none;
    white-space: pre;    
}

.navi.main li.startseite:after {
    position: absolute;
    left: -0.45em;
    bottom: -1.2em;
}

body.startseite .navi.breadcrumb li:after {
    position: absolute;
    left: -0.52em;
    bottom: -1.05em;
}

.navi.breadcrumb li:first-child:after {
    -webkit-transform: translateY(-0.4em);
            transform: translateY(-0.4em);
}

.navi.main li.startseite a, .navi.main li.startseite strong,
.navi.breadcrumb li:first-child a, body.startseite .navi.breadcrumb li {
    background-image: url("css-img/Logo_Graetzer_300x300.png");
    display: inline-block;
    background-repeat: no-repeat;
    background-position: 50% 0%;
}

.navi.main li.startseite a, .navi.main li.startseite strong {
	padding-top: 3em;
    background-size: auto 80%;
}

.navi.breadcrumb li:first-child a, body.startseite .navi.breadcrumb li {
	padding-top: 4.2em;
    background-size: auto 4.7em;
}

.navi.main li.active:not(.startseite),
.navi.main li.trail {
	/*-webkit-transform-origin: 100% 100%;*/
			transform-origin: 100% 100%;
	/*-webkit-animation: navi-active 1s cubic-bezier(.46,.03,.52,.96)  forwards;*/
			animation: navi-active 1s cubic-bezier(.46,.03,.52,.96)  forwards;
	/*transform: translateY(4.7em) scale(2);*/		/* zum Testen der Keyframe-Parameter */
}

@-webkit-keyframes navi-active {
	to {		
		-webkit-transform: translateY(6.5rem) scale(2);
	}
}

@keyframes navi-active {
	to {		
		transform: translateY(4.7em) scale(2); /* Safari kann kein rem an dieser Stelle */
	}
}


  /* -----    Navi sub    ----- */

.navi.sub {
    position: fixed;
    right: 6.25%;                               /* in der 12,5%-breiten Spalte zentrieren */
    width: 93.75%;                              /* 100% - 6.25% */
    bottom: 3.1rem;
    text-align: right;
    margin-bottom: 1rem;
}

.navi.sub li {
    margin-right: -0.6rem;                      /* Textmitte in der Mitte der Spalte zentrieren */
    margin-bottom: 1.5rem;
}

.navi.sub li:not(.img-rep) {
    font-size: 0.9rem;
    text-transform: uppercase;
}

.navi.sub a.img-rep, .navi.mobil a.img-rep {
    display: inline-block;
    width:  1.2rem;                             /* gibt dem YouTube-Icon etwas mehr Fläche */
    height: 1.15rem;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}


  /* -----    Navi legal    ----- */

.navi.legal {
    margin-top: -0.5rem;
    margin-bottom: 5.5rem;
    text-align: right;
    text-transform: uppercase;
}

.navi.legal li {
	display: inline-block;
}

.navi.legal li:not(:first-child) {
    margin-left: 5%;
}


  /* -----    Navi mobil    ----- */

.navi.mobil {
	text-transform: uppercase;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    /*width: 100%;
    height: 600px;*/
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    z-index: 20;
}

/*body:not(.sf6):not(.sf7) {
	height: 100vh;
}*/

.navi.mobil ul.level_2 {
    text-transform: none;
}

.navi.mobil ul.level_1 {
	width: 17em;
    padding-bottom: 2.5em;
    padding-top: 1.5em;
}

body:not(.sf6):not(.sf7) .navi.mobil ul.level_1 {
    padding-top: 6vh;
}

.navi.mobil li {
    margin-top: 1.6rem;
}

/*.navi.mobil li.presse {
    padding-bottom: 2rem;
}*/

.navi.mobil .level_2 li {
    margin-top: 1em;
    margin-left:  10%;
    margin-right: 10%;
}

.navi.mobil li.img-rep {
	display: inline-block;
}

.navi.mobil li.img-rep:not(:last-child) {
    margin-right: 10%;
}

body.active  {
        overflow: hidden;           /* Content bei geöffneter Mobilnavi nicht scrollbar */
    }


  /* -----    Navi breadcrumb    ----- */

.navi.breadcrumb {
	text-align: center;
}

.navi.breadcrumb li {
	text-transform: uppercase;
}

.navi.breadcrumb li:not(:first-child) {
    display: inline-block;
}

.navi.breadcrumb li:nth-child(n+3),
body.startseite .navi.breadcrumb li:first-child {
	display: none;
}


/* -----    Content    ----- */

.mod_article {
	overflow: hidden;				/* für schräge Teaser-Bilder */
}

@media (min-width: 1001px) {
	.mod_article {
		margin-bottom: 6rem;
	}
}

@media (max-width: 1000px) {
	.mod_article {
		margin-bottom: 3rem;
	}
}

.mod_article, .ce_gallery {
    font-size: 0.001px;
    text-align: center;
}

.mod_article .ce_text, 
.mod_article .ce_download, .mod_article .ce_downloads
.mod_article .mod_calendar, .mod_article .mod_eventlist, .mod_article section,
.mod_search, .mod_sitemap {
	font-size: 1rem;				/* font-size von .mod_article zurücksetzen */
	direction: ltr;
}

.mod_article .ce_text, .mod_article .ce_headline, 
.mod_article .ce_download, .mod_article .ce_downloads,
.ce_gallery h1, .ce_gallery h2,
.mod_eventlist .header, .mod_eventlist .layout_teaser, .mod_article section,
.mod_search, .mod_sitemap {
    text-align: left;               /* center von .mod_article zurücksetzen */
}

.mod_article:not(.teaser) .ce_text:not(:first-child), 
.ce_headline:not(:first-child), 
.ce_gallery:not(:first-child), 
.mod_article:not(.teaser) .ce_image:not(:first-child), 
.ce_youtube:not(:first-child), .ce_player:not(:first-child) {
	padding-top: 2.5rem;
}

.mod_article.teaser:nth-child(2n):not(.zweispaltig) {
    direction: rtl;
}

@media (min-width: 1201px) {
	.mod_article:not(.teaser) {
	    padding-top: 5%;			/* 3.3rem */
	    padding-bottom: 5%;
	}

	.mod_article.teaser .ce_text {
		padding-left: 5%;
		padding-right: 5%;
		padding-bottom: 1.3%;
	}

    .ce_text, .ce_headline, 
    .mod_article:not(.teaser) .ce_image, .ce_youtube, .ce_player,
    .mod_article .ce_download, .mod_article .ce_downloads,
    .mod_eventlist .header, .mod_eventlist .layout_teaser,
    .mod_search, .mod_sitemap h1 {
        width: 90%;
    }

    .ce_gallery {
	    width: 90.9%;
	}

    .teaser .ce_image, .teaser .ce_text {
        width: 50%;
        display: inline-block;
        vertical-align: middle;
    }

    .teaser .image_container {
	-webkit-transform: skewX(-5deg);
            transform: skewX(-5deg);
	overflow: hidden;
	}

	.teaser:nth-child(2n+1) .image_container {
		margin-left: -4%;
		padding-left: 4%;
	}

	.teaser:nth-child(2n) .image_container {
		margin-right: -4%;
		padding-right: 4%;
	}

	.teaser .image_container img {
		-webkit-transform: skewX(5deg);
                transform: skewX(5deg);
		width: 104%
	}
}

@media (max-width: 1200px) {
	.mod_article:not(.teaser) {
	    padding-top: 6.5%;
	}

	.ce_youtube:first-child, .ce_player:first-child {
		margin-top: -6.5%;
        padding-top: 0.5%;
	}

    .teaser {
        max-width: 460px;
    }

    .ce_text:last-child, .ce_download:last-child, 
    .mod_eventlist:last-child, .mod_sitemap:last-child {
    	padding-bottom: 10%;
    }

    .teaser .ce_text {
    	padding-top: 10%;
    }

    .ce_text, .ce_headline, .ce_gallery h1, .ce_gallery h2, 
    .mod_article .ce_download, .mod_article .ce_downloads,
    .mod_eventlist, .mod_search, .mod_sitemap {
        width: 80%;
    }

    .mod_article:not(.teaser) .ce_image, .ce_youtube, .ce_player {
        width: 99%;
    }

    .mod_article:not(.teaser) .ce_image:last-child, .ce_youtube:last-child, .ce_player:last-child {
        padding-bottom: 0.5%;
    }

    .teaser .image_container {
		-webkit-transform: skewY(-3deg);
                transform: skewY(-3deg);
		overflow: hidden;
		padding-top: 4%;
		margin-top: -4.5%;
	}

	.teaser .image_container img {
		-webkit-transform: skewY(3deg);
                transform: skewY(3deg);
		margin-bottom: -2.6%;
	}
}

/* macht die Teaserbilder auf schmalen Bildschirmen quadratischer
-40px bei 320 px Breite, 0px bei 610px

@media (max-width: 610px) {
	.teaser .image_container {
		margin-left:  calc(13.79vw - 84.14px);	
		margin-right: calc(13.79vw - 84.14px);
	}
}
*/

/*.mod_article.teaser p a:not([href^="http://"]):not([href^="https://"]) {
	font-size: 1.2em;
	line-height: 0.7;
	vertical-align: -10%;
	border-bottom-style: none;
}*/

/*.mod_article.teaser {
	position: relative;
}*/

.mod_article.teaser p a:after {
	content: "";
	display: block;
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
}


  /* -----    Termine    ----- */

.layout_teaser h2, .layout_teaser .ce_text p {
    display: inline;
}

.layout_teaser {
    position: relative;         /* Bezugspunkt für .time */
}

h1 + .mod_eventlist, .layout_teaser + .header {
    margin-top: 1.5rem;
}

.mod_eventlist .header {
    margin-bottom: 0.5em;
}

.layout_teaser .time {
    position: absolute;
}

.layout_teaser .info-block {
	margin-left: 3.3%;
    padding-left: 46px;
}

/*.layout_teaser .location {
    margin-left: 0.5em;
}*/

.mod_article .layout_teaser .ce_text.ce_text {
	padding-top: 0;
}

.layout_teaser .location + .ce_text:before {
    content: "|";
    /*margin-left: -0.28em;*/
}


  /* -----    Presse    ----- */

/*body.presse .mod_article {
	position: relative;	
}*/

.ce_text.presse:before, .ce_text.presse:after {
	position: absolute;
	font-size: 8rem;
    line-height: 0;
    font-weight: normal;
    font-style: italic;
	opacity: 0.05;
}

.ce_text.presse:before {
	content: '„';
	left: 2%;
	top: -1.3rem;
}

.ce_text.presse:after {
	content: '“';
    padding-right: 0.1em;                    /* damit Safari nicht rechts abschneidet */
	right: 2%;
	bottom: 0.4rem;
}

  /* -----    Social Media    ----- */

a.img-rep.youtube,
.video_container a:after {
    background-image: url("svg/youtube-braun.svg");
}

a.img-rep.soundcloud {
    background-image: url("svg/soundcloud-braun.svg");
    width:  1.4rem;                             /* gibt dem SoundCloud-Icon etwas mehr Fläche */
}

a.img-rep.instagram {
    background-image: url("svg/instagram-braun.svg");
}

.navi.mobil a.img-rep.instagram {
    background-image: url("svg/instagram-weiss.svg");
}

a.img-rep.facebook {
    background-image: url("svg/facebook-braun.svg");
    height: 1.2rem;
}

.navi.mobil a.img-rep.facebook {
	background-image: url("svg/facebook-weiss.svg");
}

li.img-rep {
    vertical-align: text-top;
}

a.img-rep, button.submit {
    display: inline-block;
    width: 1.2rem;
    height: 1.15rem;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

.mod_sitemap a.img-rep {
	display: inline;
	background-image: none;
}


  /* -----    Galerie    ----- */

.ce_gallery ul > * {
    font-size: 1rem;
}

.ce_gallery li {
    display: inline-block;
    vertical-align: top;
    margin: 0.25%;				/* gutter 0.5% breit */
}

@media (min-width: 1201px) {
	.ce_gallery h1, .ce_gallery h2 {
		margin-left: 0.5%;			/* margin der LIs + Abstände des UL */
		margin-right: 0.5%;
	}
}

@media (min-width: 901px) {
    .ce_gallery li {
        width: 32.65%;
    }
}

@media (max-width: 900px) {
    .ce_gallery li {
        width: 49.25%;
    }
}

#cboxCurrent {
	display: none !important;
}

#cboxContent {
	margin: auto;
}

#cboxLoadedContent {
	border-style: none; 
}

#cboxPrevious, #cboxPrevious:hover,
#cboxNext, #cboxNext:hover, 
#cboxClose, #cboxClose:hover {
	width: 2rem;	
	background-position: 50% 50%;
}

#cboxPrevious, 
#cboxNext, 
#cboxClose {
	opacity: 0.8;
    filter: drop-shadow(0 0 0.15em rgb(0, 0, 0));
}

#cboxPrevious:hover,
#cboxNext:hover, 
#cboxClose:hover {
	opacity: 0.95;
}

#cboxPrevious {
	height: 64px;
	background-image: url("css-img/previous.svg");
}

#cboxNext {
	height: 64px;
	background-image: url("css-img/next.svg");
}

#cboxClose {
	height: 2rem;
	background-image: url("css-img/close.svg");
}

#cboxOverlay {
	opacity: 1 !important;
	filter: alpha(opacity = 100) !important;
}

#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {
    outline: none;
}


  /* -----    Video    ----- */

 .ce_youtube, .ce_player {
 	display: inline-block;
    vertical-align: top;
 	margin: 0.25%;
 }

 .ce_youtube > *, .ce_player > * {
    font-size: 1rem;
}

.ce_youtube + .ce_youtube, .ce_player + .ce_player {
    padding-top: 0;
}

.ce_youtube.videoeinhalb + .ce_youtube.videoeinhalb,
.ce_player.videoeinhalb + .ce_player.videoeinhalb {
    vertical-align: bottom;
}

@media (min-width: 1201px) {
	.ce_youtube.videoeinhalb:not(.videogross), .ce_player.videoeinhalb:not(.videogross) {
	    width: 44.75%;
	}
}

@media (max-width: 1200px) {
	.ce_youtube.videoeinhalb:not(.videogross), , .ce_player.videoeinhalb:not(.videogross) {
	    width: 49.25%;
	}
}

.video_container {
    position: relative;
    padding-bottom: 56.25%;
}

.video_container a, .video_container iframe, .video_container video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

figure.video_container.video_container a:before {
    content: "YouTube-Video starten";
    font-family: montserrat;
    font-size: 0.85em;
    line-height: 1;
    display: block;
    position: absolute;
    top: 60%;
    right: 0;
    left: 0;
    color: transparent;
    text-shadow: 0 0.05em 0.4em hsla(0, 0%, 0%, 0);
}

figure.video_container a:hover:before,
figure.video_container a:focus:before,
figure.video_container a:active:before {
    text-shadow: 0 0.05em 0.4em hsla(0, 0%, 0%, 0.7);
}

.video_container a:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 10%;
    opacity: 0.6;
}

.video_container a:hover:after,
.video_container a:focus:after,
.video_container a:active:after {
    opacity: 0.85;
}

.video_container a ~ .caption {
    position: absolute;
    bottom: 0;
    left: 0;
    max-width: 90%;
    text-align: left;
    font-size: 0.85em;
    line-height: 1;
	padding: 0.2em 0.5em 0 0;
}

/*.video_container a ~ .caption span {
	font-size: 0.85em;
    line-height: 1;
	padding: 0.2em 0.5em 0 0;
	-webkit-box-decoration-break: clone;
			box-decoration-break: clone;
}*/

.video_container iframe ~ .caption {
	display: none;
}


/* -----    Akkordeon    ----- */

.toggler {
    display: inline-block;
    min-width: 30%;
    padding-right: 0.6em;
    cursor: pointer;
}


  /* -----    Suchfunktion    ----- */

form, .formbody, .formbody > div {
	display: inline-block;
}

input.text {	
	padding: 0.2em 0 0.3em 0.8em;
}

.suchschlitz-obenrechts input.text {
	width: 20em;
	max-width: 25vw;
}

.suchschlitz-inline input.text {
	width: 30em;
}

input.text, button.submit {
	border-style: none;
	background-color: transparent;
}

button.submit {
	line-height: 2.3;
	margin: 0 0.75rem 0 0.35rem;
	background-image: url("svg/search-braun.svg");
}

header .inside {
	position: relative;				/* Bezugsbox für Suchschlitz */
}

.suchschlitz-obenrechts, .suchschlitz-obenrechts form {
	position: absolute;
	top: 0;
	right: 0;
}



/* -----    Rahmen    ----- */

.mod_article {
	box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.2);
}

.ce_accordionSingle .accordion {
    border-left: solid 0.1em hsl(77, 57%, 46%);
    margin-left: 0.41em;
    padding-left: 0.95em;
}

/*.formbody {
	border-radius: 0.3rem;
    box-shadow: inset 0 0 0.3rem rgba(0, 0, 0, 0.2);
}*/


/* -----    Farben    ----- */

html {
	min-height: 100%;
	background: hsl(35, 30%, 94%);
	background: linear-gradient(180deg, hsl(35, 20%, 94%) 70%, hsl(35, 20%, 86%) 100%);
}

.mod_article, .formbody  {
    background-color: #fff;
}

html, a {
    color: hsl(0, 0%, 10%);
}

.mod_article h2, .mod_article strong, .navi li.active strong {
	opacity: 0.9;
}

.navi.mobil li strong {
	opacity: 0.4;
}

.ce_text a, .ce_download a, .mod_search h3 a, .mod_sitemap a {
	border-bottom: 1px solid hsla(0, 0%, 20%, 0.3);
}

.ce_text a:hover, 
.ce_text a:focus, 
.ce_text a:active {
    border-bottom: 1px solid hsla(0, 0%, 20%, 1);
}

.navi.main a, .navi.main strong,
.navi.legal a,
.navi.breadcrumb a, body.startseite .navi.breadcrumb li {
	border-bottom: 1px solid hsla(0, 0%, 20%, 0);
}

.formbody, input.text {
    border: 0px solid rgba(0, 0, 0, 0.13);
}

.formbody {
    border-radius: 0.3rem;
    border-width: 1px;
}

input.text {
	color: hsl(36, 47%, 34%);
	border-right-width: 1px;
}

.navi:not(.mobil) a:hover, 
.navi:not(.mobil) a:focus, 
.navi:not(.mobil) a:active {
    border-bottom: 1px solid hsla(0, 0%, 20%, 1);
}

.navi.mobil a, .navi.mobil strong {
	color: #fff;
}

.navi.mobil, #cboxOverlay, .video_container a ~ .caption {
	background-color: hsla(35, 20%, 25%, 0.93);
}

.highlight {
    background-color: transparent;
}


/* -----    Typo    ----- */

html, .navi li.actice:not(.startseite), input.text {
    font-family: Muli, Helvetica, sans-serif;    
}

html, input.text {
    font-size: 19px;
    line-height: 1.4;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: none;
}

@media (max-width: 1600px) {
    html, .ce_text {
        font-size: 15px;
        font-size: calc(0.313vw + 14px);                /*bei 1600px Breite font-size 19px, bei 320px 15px */
    }
}

.navi.main li {
	font-size: 1.1rem;
	line-height: 1.1;
}

a, .navi li, 
.mod_article h1, .mod_article h2,
ol li::marker, .toggler, 
.mod_search h3, .highlight, input.text {
	font-family: Muli;
}

.navi.mobil li:not(.navi-sub) {
	font-size: 1.1rem;
}

.navi.mobil li.navi-sub {
    font-size: 0.9rem;
}

.navi.main li.startseite strong, .navi.mobil li strong {
	font-weight: normal;
}

p, h1 + ul, .ce_gallery h2 + ul {
    margin-top: 1rem;
}

.mod_article p:first-child, .mod_search p {
    margin-top: 0;
}

.mod_search p {
    margin-bottom: 2rem;
}

p.header {
    margin-top: 2rem;
}

.mod_search form {
    margin-top: 0;
    margin-bottom: 1.1rem;
}

.mod_article h1 {
    font-size: 1.8rem;
    line-height: 1.14;
    font-weight: normal;
    text-transform: uppercase;
}

.mod_article h2, .toggler {
    font-size: 1rem;
    line-height: 1.4;
    font-weight: bold;
    padding-top: 0.2em;
}

.mod_article h2 
/* , .mod_article p + h2, .mod_article ul + h2 */ {
	margin-top: 2rem;
}

a, a:before, a:after, button {
    transition: 0.15s ease-out;
    text-decoration: none;
}

a.noicon.noicon, a.noicon.noicon:hover, a.noicon.noicon:focus, a.noicon.noicon:active {
    border-bottom-style: none;
}

a[href^="http://"]:not(.noicon):before, a[href^="https://"]:not(.noicon):before,
a[href^="mailto:"]:not(.noicon):before, a[href^="tel:"]:not(.noicon):before,
.ce_download:not(.noicon) .download-element a:before,
.ce_accordionSingle .toggler:before {
    font-family: fa-solid;
    font-size: 0.7em;
    margin-right: 0.4em;
}

a[href^="http://"]:not(.noicon):before, a[href^="https://"]:not(.noicon):before {
    content: "\f061";
}

.mod_search a[href^="http://"]:before, .mod_search a[href^="https://"]:before {
	content: "";
    margin-right: 0;
}

/*a[href^="mailto:"]:not(.noicon):before {
    content: "\f0e0";
}

a[href^="tel:"]:not(.noicon):before {
    content: "\f095";
}*/

.ce_download:not(.noicon) .download-element a:before {
    content: "\f019";
}

.ce_accordionSingle .toggler:before {
    font-size: 0.9em;
    content: "\f0aa";
}

.ce_accordionSingle .toggler.ui-accordion-header-collapsed:before {
    content: "\f0ab";
}

.break, .download-element, .layout_teaser a {
    word-wrap: break-word;
}

.ce_text li, .mod_sitemap li {
    margin-top: 0.5em;
    margin-left: 6%;
}

h2 + ul {
    margin-top: 1em;
}

ul li {
    list-style-type: none;
}

ol li {
    list-style-type: decimal;
}

.mod_sitemap ul li ul, li.sitemap-sub {
    font-size: 0.9em;
}

.ce_text:not(.no-li-style) ul li:before,
.mod_sitemap ul li:before {
	position: absolute;
	content: "\f105";
	font-family: fa-solid;
	font-size: 0.7em;
	margin-left: -1.1em;
	margin-top: 0.35em;
}

.mod_sitemap li.suche {
	margin-top: 2rem;
}

.mod_search h3 {
    font-size: 1rem;
}


@font-face {
  font-family: 'Muli';
  src: url('fonts/Muli-Light.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Muli';
  src: url('fonts/Muli-LightItalic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Muli';
  src: url('fonts/Muli-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Muli';
  src: url('fonts/Muli-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
}

/*
@font-face {
  font-family: 'Latina-Medium';
  src: url('fonts/Muli-ExtraLight.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Latina-Medium';
  src: url('fonts/Muli-ExtraLightItalic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Latina-Medium';
  src: url('fonts/Muli-Medium.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Latina-Medium';
  src: url('fonts/Muli-MediumItalic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Latina-Medium';
  src: url('fonts/Muli-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Latina-Medium';
  src: url('fonts/Muli-Italic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Latina-Medium';
  src: url('fonts/Muli-SemiBold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Latina-Medium';
  src: url('fonts/Muli-SemiBoldItalic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Latina-Medium';
  src: url('fonts/Muli-ExtraBold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Latina-Medium';
  src: url('fonts/Muli-ExtraBoldItalic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Latina';
  src: url('fonts/Muli-Black.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Latina';
  src: url('fonts/Muli-BlackItalic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}
*/

@font-face {
    font-family: 'fa-solid';
    src: url('fonts/fa-solid-900.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


/*@font-face {
  font-family: 'fontawesome';
  src: url('fonts/fontawesome-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}*/


/* -----    Test Client-Erkennung    ----- */

/*body.tags:before {
    content: attr(class);
    display: inline-block;
    margin: 50px;
    padding: 10px 60px 7px;
    background-color: #00a8eb;
    font-size: 20px;
    line-height: 26px;
    color: #fff;
    border: 1px solid currentcolor;
    border-radius: 100px;
}*/