* {padding: 0;
margin: 0;}

body {background: #2A3442;
color: #000;
font: 1em/1.5691 Helvetica, "Helvetica Neue", Arial, sans-serif;}

b, strong {font-weight: bold;}

#text a:link {color: #1122CC;} /*verwendet auch Google*/
#text a:visited {color: #660099;} /*verwendet auch Google*/

#text a:focus,
#text a:hover,
#text a:active {color: #B30000;}

#text a:active,
#text a:hover {outline: 0;}

main {display: block;}

#wrapper {min-width: 1000px;
max-width: 61em;
margin: 0 auto 118px;
background: #fff;}

#wrapper {min-height: calc(98vh - 105px);/*kommentar56p90*/
position: relative;}/*sunsd is ba a z gloana seidn da footer midm impressum ned ganz und (kommentar56p90)*/

nav {min-height: 290px;}/*kommentar56p90, falls a browser "min-height: calc(98vh - 105px)" ned kennd*/

header {background: #fff;
padding: 1.6em 0 1em 1.6em;
border-bottom: 3px solid #5aa7d5;}

header p {margin: 0;}

nav {float: left;
width: 18.3%;
margin: 1.6em 0 0 1.6em;}

nav ul {list-style: none;
margin: 0;}

nav li {background: #5aa7d5;
margin-bottom: 0.3em;}

nav a {padding: 0.5em 0.8em;
display: block;
text-decoration: none;
color: #fff;
font-weight: bold;}

nav a:focus,
nav a:hover,
nav a:active {background: #398EC1;}

nav strong {padding: 0.5em 0.8em;
display: block;
color: #fff;
background: #1A75AB;}

#sticky-footer {background: #5AA7D5;
color: #fff;
font-weight: bold;
bottom: 0;
position: fixed;
max-width: 61em; /*max- und min-width va wrapper und sticky-footer miasn gleich sa*/
min-width: 1000px;
height: 105px;
padding: 0.5em 0;}

#sticky-footer div {margin: 0 auto;
display: table;}/*sunsd is ned horizontal und da inhalt linksbuendig zentriert*/

#sticky-footer span {display: block;}

footer {color: #fff;
background: #5aa7d5;
text-align: center;
padding: 1em;
position: absolute;/*kommentar56p90*/
bottom: 0;/*kommentar56p90*/
width: 100%;/*kommentar56p90*/
box-sizing: border-box;}/*kommentar56p90*/

footer a {color: #fff;}

footer a + a,
footer a + strong,
footer strong + a {margin-left: 1em;}

#text {padding: 1.6em;
background: #fff;
float: left;
width: 72%;
margin-bottom: 45px;}/*kommentar56p90*/

#text p + ul,
#text p + ol {margin-top: -0.5em;}

#text li {margin-left: 1em;}

p,
ul,
ol,
address,
table {margin-bottom: 1em;}

h1 + p {margin-top: 1em;
font-size: 1.1em;
font-weight: bold;
color: #000;}

h1,
h2,
h3,
h4 {font-family: Helvetica, "Helvetica Neue", Arial, sans-serif;
font-weight: bold;}

#start h1,
header a {font-size: 3em;
color: #fff;
text-decoration: none;
line-height: 1.2;
font-weight: bold;
margin-bottom: 0;}


h1,
#start h2 {font-size: 1.9375em;
line-height: 1.2;
margin-top: 0;
margin-bottom: 0.5em;}

#start h3,
h2 {font-size: 1.5625em;
line-height: 1.4155;
margin-top: 1.0176em;}

/*margin-top für .clearen+h2 und .clearen+3 fehlen*/

#start h4,
h3 {font-size: 1.25em;
line-height: 1.4754;
margin-top: 1.0101em;}

#start h5,
h4 {font-size: 1.1em;}


iframe {max-width: 100%;
border: none;}

iframe + p {margin-top: 1em;}

img {border: 0; max-width: 100%; height: auto; display: block;}

figure {display: table;
border: 1px solid #ddd;
border-bottom: none;}

.bildergalerie figure {border: 0;}

figure img {display: block;}

figcaption {color: #000;
padding: 0 0.5em;
border-color: #828282;
border-style: solid;
border-width: 0 1px 1px;
line-height: 1.5;
display: table-caption;
caption-side: bottom;
font-weight: bold;}

a[rel="lightbox"] figcaption::before, a[rel="lightbox-gruppe"] figcaption::before {
content: url("bilder/lupe.png");
float: right;
margin-right: 10px;
margin-top: -26px;
position: relative;}

figcaption {background: #eee;
border-color: #ddd;
padding: 0 0.65em;}


a[rel="lightbox-gruppe"] {min-height: 300px;}

/*
a[rel="lightbox-gruppe"] + a[rel="lightbox-gruppe"] {margin-top: 1.3em;}*/

.rahmen {background: #eee;
border-color: #ddd;
border-style: solid;
border-width: 1px 1px 0;
padding: 0.65em 0.65em 0;}
/*margin-bottom: 0.45em;}*/

.abstand-zu-ueberschrift {margin-bottom: 0}

a[rel="lightbox"],
a[rel="lightbox-gruppe"] {text-decoration: none;
color: #fff;
float: left;
cursor: -moz-zoom-in;
cursor: -webkit-zoom-in;
cursor: zoom-in;}

#link-startfoto {float: none;}

.clearen {clear: both; width: 0; height: 0; font-size: 0; line-height: 0; border: none;}

input,
textarea {font: inherit;}/*normalize.css*/



#header-links {float: left;}

#fotoblock {float: right;}

#header-foto-1 {float: left;}

#header-foto-2 {float: right;}




.linkes-bild {float: left;
margin: 0 1em 0.5em 0;}

.bild-links {background: #eee;
	padding: 0.65em 0.65em 0;
	border-color: #ddd;
float: left;
margin: 0 1em 0.5em 0;}

#startfoto {float: right;
margin: 0 0 0.5em 0.5em;}

figcaption {background: #eee;
border-color: #ddd;
padding: 0 0.65em;}


/*Bildergalerie*/
/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxTopLeft{width:14px; height:14px; background:url(images/controls.png) no-repeat 0 0;}
    #cboxTopCenter{height:14px; background:url(images/border.png) repeat-x top left;}
    #cboxTopRight{width:14px; height:14px; background:url(images/controls.png) no-repeat -36px 0;}
    #cboxBottomLeft{width:14px; height:43px; background:url(images/controls.png) no-repeat 0 -32px;}
    #cboxBottomCenter{height:43px; background:url(images/border.png) repeat-x bottom left;}
    #cboxBottomRight{width:14px; height:43px; background:url(images/controls.png) no-repeat -36px -32px;}
    #cboxMiddleLeft{width:14px; background:url(images/controls.png) repeat-y -175px 0;}
    #cboxMiddleRight{width:14px; background:url(images/controls.png) repeat-y -211px 0;}
    #cboxContent{background:#fff; overflow:visible;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:5px;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
        #cboxTitle{position:absolute; bottom:-28px; left:0; text-align:center; width:100%; font-weight:bold; color:#000; font-size: 0.9em;}
        #cboxCurrent{position:absolute; font-size: 0.75em; bottom:-27px; left:58px; font-weight:bold; color:#7C7C7C;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible;  position:absolute; bottom:-29px; background:url(images/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;}
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxPrevious{left:0px; background-position: -51px -25px;}
        #cboxPrevious:hover{background-position:-51px 0px;}
        #cboxNext{left:27px; background-position:-75px -25px;}
        #cboxNext:hover{background-position:-75px 0px;}
        #cboxClose{right:0; background-position:-100px -25px;}
        #cboxClose:hover{background-position:-100px 0px;}

        .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}
        .cboxSlideshow_on #cboxSlideshow:hover{background-position:-150px 0px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}
        .cboxSlideshow_off #cboxSlideshow:hover{background-position:-125px 0px;}


#cboxOverlay {cursor: -moz-zoom-out !important;
cursor: -webkit-zoom-out !important;
cursor: zoom-out !important;}

#koa-margin {margin-top: 0;}







/*Kontakt*/
label {display: block;}

#kontaktformular-mantel {background: #eee;
border: 1px solid #ccc;
padding: 1em;
margin-bottom: 1em;}

#vorname,
#nachname,
#strasse,
#ort,
#email,
#nachricht {
border: 1px solid #abadb1;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
box-sizing: border-box;
display: block;
margin-bottom: 0.8em;
max-width: 100%;
overflow: auto;
padding: 0.4em;
width: 350px;}

#nachricht {height: 300px;}

input,
textarea {font: inherit;}

#kontakt-button {padding: 1em;
cursor: pointer;}

.fehlermeldung {color: red;
font-weight: bold;}

#nachricht-gesendet {color: green;
margin: 0;
font-weight: bold;}

#nachricht-gesendet:before {content:"✓ ";}


@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
nav,
#text,
#header-links,
#fotoblock,
#header-foto-1,
#header-foto-2 {float: none;}

nav {width: auto;
min-height: 200px;/*da Safari va iOS 9 kennd unset via min-height ned*/
margin: 1.6em 1.6em 0;}

#text {width: auto;}

#wrapper {min-width: 10px;/*da Safari va iOS 9 kennd unset via min-width ned*/
max-width: none;}

#sticky-footer {min-width: 100%;}

#startfoto {float: none;
margin: 0 0 0.5em;}

.bild-links {float: none;
padding: 0;
margin: 0 0 0.5em;}

main {padding-bottom: 2.2em;}/*sunsd föd unt a stiggö vam text*/

#koa-margin {margin-top: 1.3em;}

figure {border: none;}
}

@media only screen and (min-width: 768px) and (max-width: 1000px), only screen and (min-device-width:768px) and (max-device-width: 1000px) {
#wrapper {min-width: 10px;/*da Safari va iOS 9 kennd unset via min-width ned*/
max-width: none;}/*testen, ob nötig*/

nav {width: auto;}

/*#text {width: 74%;}*/

#sticky-footer {min-width: 100%;}
}

/*iphone im portrait-modus*/
@media only screen and (max-width: 767px) and (orientation: portrait), only screen and (max-device-width: 767px) and (orientation: portrait) {
a[rel="lightbox-gruppe"] {min-height: 30px;}

a[rel="lightbox-gruppe"] + a[rel="lightbox-gruppe"] {margin-top: 1.3em;}
}

/*iphone im landscape-modus*/
@media only screen and (max-width: 767px) and (orientation: landscape), only screen and (max-device-width: 767px) and (orientation: landscape) {
#koa-margin {margin-top: 0;}
}

/*ipad im portrait-modus*/
@media only screen and (min-width: 768px) and (max-width: 1000px) and (orientation: portrait), only screen and (min-device-width:768px) and (max-device-width: 1000px) and (orientation: portrait) {
#logo {max-width: 246px;}

#header-foto-1,
#header-foto-2 {max-width: 210px;}

a[rel="lightbox-gruppe"] {min-height: 30px;}

#koa-margin,
a[rel="lightbox-gruppe"] + a[rel="lightbox-gruppe"] {margin-top: 1.3em;}
}

/*ipad im landscape-modus*/
@media only screen and (min-width: 768px) and (max-width: 1000px) and (orientation: landscape), only screen and (min-device-width:768px) and (max-device-width: 1000px) and (orientation: landscape) {
#text {width: 75%;}
}

@media print {
*,
*:before {background: transparent !important;
color: #000 !important;
box-shadow: none !important;
text-shadow: none !important;}

body {font: 12pt/1.6 Georgia, "Times New Roman", serif;}

#wrapper {padding: 1.5em 3em;/*pt statt em?*/
min-width: 100px;
max-width: none;}

header {padding: 0 0 1em;
border-bottom: none;}

#text {padding: 0;}
	
/*werden wegen zu geringer spezifizität nicht übernommen*/
h1 {font-size: 23pt;}
h2 {font-size: 19pt;}
h3 {font-size: 17pt;}

#header-foto-1,
#header-foto-2,
nav,
footer {display: none;}


#sticky-footer {position: static;
padding: 0;}

h2, h3, h4, h5 {page-break-inside: avoid;
page-break-after: avoid;}

tr,
img {page-break-inside: avoid;}
}