/* open-sans-regular - latin */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; src: url('fonts/open-sans-v34-latin-regular.eot'); /* IE9 Compat Modes */ src: local(''), url('fonts/open-sans-v34-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('fonts/open-sans-v34-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('fonts/open-sans-v34-latin-regular.woff') format('woff'), /* Modern Browsers */ url('fonts/open-sans-v34-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('fonts/open-sans-v34-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */ } /* open-sans-700 - latin */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 700; src: url('fonts/open-sans-v34-latin-700.eot'); /* IE9 Compat Modes */ src: local(''), url('fonts/open-sans-v34-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('fonts/open-sans-v34-latin-700.woff2') format('woff2'), /* Super Modern Browsers */ url('fonts/open-sans-v34-latin-700.woff') format('woff'), /* Modern Browsers */ url('fonts/open-sans-v34-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('fonts/open-sans-v34-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */ } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } .align-center { text-align: center; } /******************************** Basis Styles ********************************/ * {margin: 0; padding: 0; } .clear {overflow:hidden; clear: both;} .trenner {overflow:hidden; clear: both;width: 100%;height: 20px;} * html .clear {height:1%} img {border: none; max-width: 100%; height: auto; width: auto; } input, select, textarea { -ms-box-sizing: content-box; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; border-radius: 0; border: none; outline: 0 none; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } select::-ms-expand { display: none; } input[type=checkbox] { -webkit-appearance: checkbox; appearance: checkbox; background: none; } body { font-family: 'Open Sans', sans-serif; font-size: 100%; font-weight: 400; text-align: left; color: #000; line-height: 1.5em; } .csc-default { position: relative; overflow: hidden; } div.csc-textpic { clear: both; } table { line-height: 1.5em; } /******************************** Weiche Übergänge ********************************/ a, #navigation ul li, #navigation2 ul li, #logo { transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; } /******************************** Kopf ********************************/ #kopfwrap { position: relative; width: 100%; max-width: 1200px; height: auto; overflow: hidden; margin: auto; } /* #logo { position: relative; float: left; display: inline; margin: 70px 20px 24px 20px; max-width: 599px; } #logo img { border-bottom: 1px dotted #b1bcc8; } */ #logo { position: relative; float: left; display: inline; margin: 40px 20px 24px 20px; max-width: 340px; } #logo img { border: none; } #kopfbox { position: relative; float: right; display: inline; margin: 20px 20px 30px 0; font-size: 0.6875em; color: #999; } #sprache { position: relative; float: left; display: inline; margin: 0 0 3px 0; line-height: 0; } #sprache a { border: none; margin: 0 5px 0 0; } #kopfbox #sprache a:hover { border: none; } #socials { position: relative; float: right; display: inline; margin: 0 0 3px 0 ; line-height: 0; } #kopfbox #socials a:hover { border: none; } #suchefeld { font-family: 'Open Sans', sans-serif; font-size: 1em; background-color: #eee; padding: 4px 5px 4px 25px; color: #999; background-image: url(../img/icon-lupe.png); background-position: 5px; background-repeat: no-repeat; } #subnavi div { width: auto; background-position: left; background-repeat: no-repeat; padding: 5px 0 5px 25px; line-height: 1em; } .tel { background-image: url(../img/icon-telefon.png); font-weight: 700; } .mail { background-image: url(../img/icon-mail.png); } .login { background-image: url(../img/icon-user.png); } #kopfbox a { color: #999; text-decoration: none; border-bottom: none; } #kopfbox a:hover { color: #142d51; border-bottom: 1px dotted #999; } #mobiltrigger { display: none; position: relative; margin: 0 0 0 20px; padding: 0; width: 48px; height: 48px; cursor: pointer; z-index: 530; background-image: url(../img/mobiltrigger.png); float: left; clear: both; } #mobiltrigger.kreuz { background-image: url(../img/mobiltrigger_kreuz.png); } @media only screen and (max-width: 1024px) { #kopfbox { display: none; } #mobiltrigger { display: inline; } #logo { position: relative; float: left; display: inline; margin: 20px 20px 20px 20px; width: calc(100% - 40px); text-align: center; max-width: none; } #logo img { max-width: 300px; margin: auto; width: 100%; } } /******************************** Navigation ********************************/ #navigationwrap { position: relative; width: 100%; max-width: 100%; height: auto; overflow: hidden; margin: auto; border-bottom: 1px dotted #b1bcc8; } #navigation { position: relative; width: 100%; max-width: 1200px; height: auto; overflow: hidden; margin: auto; } #navigation ul { margin-left: 10px; } #navigation ul li { position: relative; float: left; display: inline; border-bottom: 2px solid #fff; margin: 0 10px; } #navigation ul li a { text-decoration: none; color: #666; font-size: 0.875em; text-transform: uppercase; padding: 0px; } #navigation ul li a:hover { color: #142d51; } #navigation ul li.aktiv { border-bottom: 2px solid #142d51; } #navigation ul li:hover { border-bottom: 2px solid #142d51; } #mobilnavigation { display: none; } @media only screen and (max-width: 1200px) { #navigation ul li a { font-size: 0.75em; } #navigation ul li { margin: 0 6px; } } @media only screen and (max-width: 1024px) { #navigation { display: none; } #mobilnavigation { padding: 0 0 20px 0; } #mobilnavigation ul { width: 100%; } #mobilnavigation ul li { width: 100%; background-color: #fff; border-bottom: none; margin: 0; } #mobilnavigation ul li:hover { background-color: #b1bcc8; } #mobilnavigation ul li a { padding: 5px 20px; color: #000; background: none; display: block; text-decoration: none; width: 100%; margin: 0; text-transform: uppercase; } #mobilnavigation ul li ul { display: none; opacity: 1; height: auto; position: relative; } #mobilnavigation ul li ul li { width: 100%; background-color: #fff; border: none; } #mobilnavigation ul li ul li a { padding: 5px 10px 5px 40px; color: #666; } #mobilnavigation ul li ul li a:hover { color: #142d51; background: none; } #mobilnavigation ul li a:hover { color: #142d51; } #mobilnavigation ul li.aktiv { background-color: #b1bcc8; } #mobilnavigation ul li.aktiv:hover { background-color: #b1bcc8; } #mobilnavigation ul li.aktiv a { color: #fff; } #mobilnavigation ul li.aktiv a:hover { color: #fff; } #mobilnavigation ul li.aktiv ul { height: auto; position: relative; display: inline; width: 100%; } #mobilnavigation ul li.aktiv ul li a { padding: 5px 10px 5px 40px; color: #666; } #mobilnavigation ul li.aktiv ul li a:hover { color: #142d51; background: none; } #mobilnavigation ul li.aktiv ul li.aktiv a { color: #fff; } } /******************************** Navigation 2. Ebene ********************************/ #navigation2 { position: relative; float: left; display: inline; width: calc(25% - 30px); margin-left: 20px; } #navigation2 ul li { position: relative; display: block; border-bottom: 1px dotted #fff; margin: 0; width: 100%; } #navigation2 ul li a { text-decoration: none; color: #666; font-size: 0.875em; padding: 5px 0px; width: auto; display: block; } #navigation2 ul li a:hover { color: #142d51; } #navigation2 ul li.aktiv { border-bottom: 1px dotted #b1bcc8; font-weight: 700; } #navigation2 ul li:hover { border-bottom: 1px dotted #b1bcc8; } @media only screen and (max-width: 1024px) { #navigation2 { display: none; } } /******************************** Inhalt ********************************/ #inhaltwrap { position: relative; width: 100%; max-width: 1200px; height: auto; overflow: hidden; margin: 50px auto; } #inhalt { position: relative; float: left; display: inline; width: calc(75% - 30px); margin: 0 20px; } #inhalt.startseite { width: calc(100% - 40px); } #inhalt a { color: #142d51; text-decoration: none; border-bottom: 1px dotted #b1bcc8; } #inhalt a:hover { color: #000; border-bottom: 1px dotted #142d51; } #inhalt h1 { font-size: 1.25em; color: #142d51; border-bottom: 1px dotted #b1bcc8; margin: 0 0 20px 0; font-weight: 700; } #inhalt h2 { font-size: 1.25em; color: #142d51; border-bottom: 1px dotted #b1bcc8; margin: 0 0 20px 0; font-weight: 700; } #inhalt h3 { font-size: 1.25em; color: #666; border-bottom: 1px dotted #b1bcc8; margin: 0 0 10px 0; font-weight: 700; } #inhalt h4 { font-size: 1em; color: #142d51; border-bottom: 1px dotted #b1bcc8; margin: 0 0 10px 0; font-weight: 700; } #inhalt p { margin: 0 0 20px 0; font-size: 0.9em; color: #666; } #inhalt string, #inhalt b { font-weight: 700; } #inhalt ul { /* overflow: hidden; position: relative; */ width: 100%; margin: 0 0 20px 0; } #inhalt ul li { margin: 0 0 0 25px; list-style: circle; font-size: 0.9em; color: #666; } #inhalt ol { /* overflow: hidden; position: relative; */ width: 100%; margin: 0 0 20px 0; } #inhalt ol li { margin: 0 0 0 25px; list-style: decimal; font-size: 0.9em; color: #666; } @media only screen and (max-width: 1024px) { #inhalt { width: calc(100% - 40px); } } /******************************** Fuss ********************************/ #fusswrap { position: relative; width: 100%; max-width: 100%; height: auto; overflow: hidden; margin: auto; border-top: 1px dotted #b1bcc8; } #fuss { position: relative; width: 100%; max-width: 1200px; height: auto; overflow: hidden; margin: auto; } #fuss .fussspalte { width: calc(16.6666666666% - 40px); padding: 20px; float: left; display: inline; } #fuss .fussspalte h1, #fuss .fussspalte h2, #fuss .fussspalte h3 { color: #999; font-size: 0.675em; font-weight: 700; margin: 10px 0 10px 0; line-height: 1.3em; } #fuss .trennmenu { color: #999; font-size: 0.675em; font-weight: 700; margin: 10px 0 0 0; line-height: 1.3em; } #fuss .fussspalte a { font-size: 0.675em; font-weight: 400; color: #999; display: block; padding: 2px 0; text-decoration: none; line-height: 1.3em; } #fuss .fussspalte a:hover { color: #142d51; } @media only screen and (max-width: 1024px) { #fuss .fussspalte { width: calc(33.3333333333% - 40px); } #fuss .fussspalte:nth-of-type(3n+1) { clear: both; } } @media only screen and (max-width: 768px) { #fuss .fussspalte { width: calc(50% - 40px); } #fuss .fussspalte:nth-of-type(3n+1) { clear: none; } #fuss .fussspalte:nth-of-type(2n+1) { clear: both; } } /******************************** Social Bar ********************************/ #inhalt .shariff ul li { margin: 0 15px 0 0; } #inhalt .socialbar { position: relative; width: 100%; overflow: hidden; } /******************************** Text und Bild ********************************/ #inhalt .ce-textpic { position: relative; width: 100%; overflow: hidden; } #inhalt .ce-gallery { position: relative; width: 100%; margin: 0 0 30px 0; overflow: hidden; } #inhalt .ce-gallery .ce-row { width: 100%; overflow: hidden; position: relative; } #inhalt .ce-gallery .ce-column { width: calc(100% - 20px); float: left; padding: 10px; font-size: 0.875em; line-height: 1.4em; } #inhalt .ce-gallery[data-ce-columns="1"] .ce-column { width: calc(100% - 20px); } #inhalt .ce-gallery[data-ce-columns="2"] .ce-column { width: calc(50% - 20px); } #inhalt .ce-gallery[data-ce-columns="3"] .ce-column { width: calc(33.3333333333% - 20px); } #inhalt .ce-gallery[data-ce-columns="4"] .ce-column { width: calc(25% - 20px); } #inhalt .ce-gallery[data-ce-columns="5"] .ce-column { width: calc(20% - 20px); } #inhalt .ce-gallery[data-ce-columns="6"] .ce-column { width: calc(16.6666666666% - 20px); } #inhalt .ce-left.ce-intext .ce-gallery { width: auto; float: left; margin: 0 20px 20px 0; } #inhalt .ce-right.ce-intext .ce-gallery { width: auto; float: right; margin: 0 0 20px 20px; } #inhalt .ce-right.ce-nowrap .ce-gallery { width: calc(35% - 40px); float: right; margin: 0 0 20px 40px; } #inhalt .ce-right.ce-nowrap .ce-gallery .ce-column { padding: 0; width: 100%; } #inhalt .ce-right.ce-nowrap .ce-bodytext { width: 65%; } #inhalt .ce-left.ce-nowrap .ce-gallery { width: calc(35% - 40px); float: left; margin: 0 40px 20px 0; } #inhalt .ce-left.ce-nowrap .ce-gallery .ce-column { padding: 0; width: 100%; } #inhalt .ce-left.ce-nowrap .ce-bodytext { float: left; width: 65%; } #inhalt .ce-gallery img { filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: url(desaturate.svg#greyscale); filter: gray; -webkit-filter: grayscale(1); -webkit-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.4); -moz-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.4); box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.4); padding: 0px; width: calc(100% - 0px); } #inhalt .ce-gallery a { border: none; } #inhalt figcaption { font-size: 0.75em; line-height: 1.4em; font-weight: 700; } #inhalt .ce-right.ce-intext figcaption { max-width: 200px; } @media only screen and (max-width: 767px) { #inhalt .ce-right.ce-nowrap .ce-gallery { width: calc(100% - 20px); float: left; margin: 0 0 20px 0; } #inhalt .ce-right.ce-nowrap .ce-bodytext { width: calc(100% - 20px); } #inhalt .ce-left.ce-nowrap .ce-gallery { width: calc(100% - 20px); margin: 0 0 20px 0; } #inhalt .ce-left.ce-nowrap .ce-bodytext { width: calc(100% - 20px); } #inhalt .ce-gallery .ce-column { width: calc(100% - 20px); } #inhalt .ce-gallery[data-ce-columns="1"] .ce-column { width: calc(100% - 20px); } #inhalt .ce-gallery[data-ce-columns="2"] .ce-column { width: calc(100% - 20px); } #inhalt .ce-gallery[data-ce-columns="3"] .ce-column { width: calc(100% - 20px); } #inhalt .ce-gallery[data-ce-columns="4"] .ce-column { width: calc(100% - 20px); } #inhalt .ce-gallery[data-ce-columns="5"] .ce-column { width: calc(100% - 20px); } #inhalt .ce-gallery[data-ce-columns="6"] .ce-column { width: calc(100% - 20px); } } @media only screen and (max-width: 480px) { #inhalt .ce-left.ce-intext .ce-gallery { width: 100%; float: left; margin: 0 20px 0; } #inhalt .ce-right.ce-intext .ce-gallery { width: 100%; float: right; margin: 0 0 20px 0; } #inhalt .ce-right.ce-nowrap .ce-gallery { width: 100%; float: right; margin: 0 0 20px 0; } #inhalt .ce-right.ce-nowrap .ce-gallery .ce-column { padding: 0; width: 100%; } #inhalt .ce-right.ce-nowrap .ce-bodytext { width: 100%; } #inhalt .ce-left.ce-nowrap .ce-gallery { width: 100%; float: left; margin: 0 0 20px 0; } #inhalt .ce-left.ce-nowrap .ce-gallery .ce-column { padding: 0; width: 100%; } #inhalt .ce-left.ce-nowrap .ce-bodytext { float: left; width: 100%; } #inhalt .ce-right.ce-intext figcaption { max-width: auto; } } /******************************** Spalten ********************************/ #inhalt .spalten { position: relative; width: 100%; margin: 0 auto; overflow: hidden; } #inhalt .spalte2 { position: relative; width: calc(50% - 10px); padding: 0 10px 20px 0; float: left; display: inline; clear: both; } #inhalt .spalte2:nth-of-type(2n) { padding: 0 0 20px 10px; clear: none; } #inhalt .spalte2a { position: relative; width: calc(66.6666666666% - 20px); padding: 0 10px 20px 0; float: left; display: inline; clear: both; } #inhalt .spalte2a:nth-of-type(2n) { padding: 0 0 20px 10px; clear: none; width: calc(33.3333333333%); } #inhalt .spalte3 { position: relative; width: calc(33.3333333333% - 20px); padding: 0 10px 20px 10px; float: left; display: inline; } #inhalt .spalte3:nth-of-type(3n+1) { padding: 0 10px 20px 0; clear: both; } #inhalt .spalte3:nth-of-type(3n) { padding: 0 0 20px 10px; } #inhalt .spalte4 { position: relative; width: calc(25% - 15px); padding: 0 10px 20px 10px; float: left; display: inline; } #inhalt .spalte4:nth-of-type(4n+1) { padding: 0 10px 20px 0; clear: both; } #inhalt .spalte4:nth-of-type(4n) { padding: 0 0 20px 10px; } #inhalt .spalte4i { position: relative; width: calc(25% - 15px); padding: 0 10px 20px 10px; float: left; display: inline; } #inhalt .spalte4i:nth-of-type(4n+1) { padding: 0 10px 20px 0; clear: both; } #inhalt .spalte4i:nth-of-type(4n) { padding: 0 0 20px 10px; } #inhalt .spalte4i img { padding: 0; -webkit-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.5); box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.5); width: 100%; } #inhalt .spalte4i figcaption { position: absolute; bottom: 25px; left: 10px; background-color: rgba(255,255,255,0.75); padding: 10px; font-size: 1.1em; text-align: left; width: calc(100% - 40px); text-transform: uppercase; } @media only screen and (max-width: 768px) { #inhalt .spalte2 { width: 100%; padding: 0 0 0 0; } #inhalt .spalte2:nth-of-type(2n) { padding: 0 0 0 0; } #inhalt .spalte2a { width: 100%; padding: 0 0 0 0; } #inhalt .spalte2a:nth-of-type(2n) { width: 100%; padding: 0 0 0 0; } #inhalt .spalte3 { width: 100%; padding: 0 0 0 0; } #inhalt .spalte3:nth-of-type(3n+1) { padding: 0 0 0 0; clear: none; } #inhalt .spalte3:nth-of-type(3n) { padding: 0 0 0 0; } #inhalt .spalte4 { width: 100%; padding: 0 0 0 0; } #inhalt .spalte4:nth-of-type(4n+1) { padding: 0 0 0 0; clear: none; } #inhalt .spalte4:nth-of-type(4n) { padding: 0 0 0 0; } #inhalt .spalte4i { width: 50%; padding: 0 0 0 0; } #inhalt .spalte4i:nth-of-type(4n+1) { padding: 0 0 0 0; clear: none; } #inhalt .spalte4i:nth-of-type(4n) { padding: 0 0 0 0; } #inhalt .spalte4i figcaption { font-size: 0.875em; } } /******************************** Tabelle ********************************/ #inhalt .ce-table { position: relative; overflow: hidden; width: 100%; margin: 0 0 20px 0; } #inhalt .ce-table th { color: #142d51; border-bottom: dotted 1px #142d51; padding: 3px 5px; font-size: 0.75em; font-weight: 700; } #inhalt .ce-table td { padding: 3px 5px; border-bottom: dotted 1px #b1bcc8; font-size: 0.75em; } /******************************** Akkordeon ********************************/ #inhalt .accordion-header { cursor:pointer; background-image: url(../img/icon_plus.png); background-repeat: no-repeat; background-position: 100% 5px; padding: 0 30px 4px 0; border-bottom: #b1bcc8 dotted 1px; } #inhalt .accordion-header h1, #inhalt .accordion-header h2, #inhalt .accordion-header h3, #inhalt .accordion-header h4 { border: none; margin: 0; } #inhalt .active { background-image: url(../img/icon_minus.png) } #inhalt .accordion-content { display: none; margin: 10px 0 0 0; } #inhalt .accordion { margin: 0 0 20px 0; } /******************************** Uploads ********************************/ #inhalt .ce-uploads li { list-style: none; margin: 0 0 5px 0; } #inhalt .ce-uploads img { float: left; margin: 5px 15px 0 0; } #inhalt .ce-uploads-filesize { margin: 0 0 0 10px; font-size: 0.75em; } /******************************** Login ********************************/ #inhalt .tx-felogin-pi1 h3 { display: none; } #inhalt .tx-felogin-pi1 legend { display: none; } #inhalt .tx-felogin-pi1 fieldset { margin: 20px 0 0 0; } #inhalt .tx-felogin-pi1 input { background-color: #efefef; padding: 5px; font-family: 'Open Sans', sans-serif; font-size: 1em; margin: 0 0 20px 0; } /* Bloom Addons */ .tx-go-maps-ext { padding-bottom: 20px; } .tx-indexedsearch-redMarkup { color: red; } .tx-indexedsearch-searchbox { padding-bottom: 20px; } .tx-indexedsearch-searchbox legend { font-size: 32px; line-height: 32px; padding: 0 0 20px; } .tx-indexedsearch-searchbox .tx-indexedsearch-form--wrapper { display: flex; font-size: 24px; flex-wrap: wrap; } .tx-indexedsearch-searchbox .tx-indexedsearch-form--wrapper label { align-self: center; margin-right: 10px; } @media only screen and (max-width: 768px) { .tx-indexedsearch-searchbox .tx-indexedsearch-form--wrapper label { width: 100%; padding-bottom: 10px; } } .tx-indexedsearch-searchbox .tx-indexedsearch-searchbox-sword { border: 1px solid black; padding: 5px 10px; font-size: 24px; } .tx-indexedsearch-searchbox .tx-indexedsearch-searchbox-button { font-size: 24px; border: 1px solid black; padding: 5px; cursor: pointer; } ul.tx-indexedsearch-browsebox { display: flex; } ul.tx-indexedsearch-browsebox li { list-style: none !important; padding: 20px 0 10px!important; margin: 0 10px 0 0 !important; } .tx-indexedsearch-info { display: none; } .cookie-consent-container .buttons { display: flex !important; }