@charset "utf-8"; /* roboto-condensed-300 - latin */ @font-face { font-family: 'Roboto Condensed'; font-style: normal; font-weight: 300; src: url('/storage/fonts/roboto-condensed-v18-latin-300.eot'); /* IE9 Compat Modes */ src: local('Roboto Condensed Light'), local('RobotoCondensed-Light'), url('/storage/fonts/roboto-condensed-v18-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/roboto-condensed-v18-latin-300.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/roboto-condensed-v18-latin-300.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/roboto-condensed-v18-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/roboto-condensed-v18-latin-300.svg#RobotoCondensed') format('svg'); /* Legacy iOS */ } /* roboto-condensed-regular - latin */ @font-face { font-family: 'Roboto Condensed'; font-style: normal; font-weight: 400; src: url('/storage/fonts/roboto-condensed-v18-latin-regular.eot'); /* IE9 Compat Modes */ src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url('/storage/fonts/roboto-condensed-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/roboto-condensed-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/roboto-condensed-v18-latin-regular.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/roboto-condensed-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/roboto-condensed-v18-latin-regular.svg#RobotoCondensed') format('svg'); /* Legacy iOS */ } /* roboto-300 - latin */ @font-face { font-family: 'Roboto'; font-style: normal; font-weight: 300; src: url('/storage/fonts/roboto-v20-latin-300.eot'); /* IE9 Compat Modes */ src: local('Roboto Light'), local('Roboto-Light'), url('/storage/fonts/roboto-v20-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/roboto-v20-latin-300.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/roboto-v20-latin-300.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/roboto-v20-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/roboto-v20-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-300italic - latin */ @font-face { font-family: 'Roboto'; font-style: italic; font-weight: 300; src: url('/storage/fonts/roboto-v20-latin-300italic.eot'); /* IE9 Compat Modes */ src: local('Roboto Light Italic'), local('Roboto-LightItalic'), url('/storage/fonts/roboto-v20-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/roboto-v20-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/roboto-v20-latin-300italic.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/roboto-v20-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/roboto-v20-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-regular - latin */ @font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; src: url('/storage//fonts/roboto-v20-latin-regular.eot'); /* IE9 Compat Modes */ src: local('Roboto'), local('Roboto-Regular'), url('/storage/fonts/roboto-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/roboto-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/roboto-v20-latin-regular.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/roboto-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/roboto-v20-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-italic - latin */ @font-face { font-family: 'Roboto'; font-style: italic; font-weight: 400; src: url('/storage/fonts/roboto-v20-latin-italic.eot'); /* IE9 Compat Modes */ src: local('Roboto Italic'), local('Roboto-Italic'), url('/storage/fonts/roboto-v20-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/roboto-v20-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/roboto-v20-latin-italic.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/roboto-v20-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/roboto-v20-latin-italic.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-500 - latin */ @font-face { font-family: 'Roboto'; font-style: normal; font-weight: 500; src: url('/storage/fonts/roboto-v20-latin-500.eot'); /* IE9 Compat Modes */ src: local('Roboto Medium'), local('Roboto-Medium'), url('/storage/fonts/roboto-v20-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/roboto-v20-latin-500.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/roboto-v20-latin-500.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/roboto-v20-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/roboto-v20-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-500italic - latin */ @font-face { font-family: 'Roboto'; font-style: italic; font-weight: 500; src: url('/storage//fonts/roboto-v20-latin-500italic.eot'); /* IE9 Compat Modes */ src: local('Roboto Medium Italic'), local('Roboto-MediumItalic'), url('/storage/fonts/roboto-v20-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/roboto-v20-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/roboto-v20-latin-500italic.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/roboto-v20-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/roboto-v20-latin-500italic.svg#Roboto') format('svg'); /* Legacy iOS */ } /* oswald-300 - latin */ @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 300; src: url('/storage/fonts/oswald-v29-latin-300.eot'); /* IE9 Compat Modes */ src: local(''), url('/storage/fonts/oswald-v29-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/oswald-v29-latin-300.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/oswald-v29-latin-300.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/oswald-v29-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/oswald-v29-latin-300.svg#Oswald') format('svg'); /* Legacy iOS */ } /* oswald-regular - latin */ @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 400; src: url('/storage/fonts/oswald-v29-latin-regular.eot'); /* IE9 Compat Modes */ src: local(''), url('/storage/fonts/oswald-v29-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/oswald-v29-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/oswald-v29-latin-regular.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/oswald-v29-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/oswald-v29-latin-regular.svg#Oswald') format('svg'); /* Legacy iOS */ } /* oswald-500 - latin */ @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 500; src: url('/storage/fonts/oswald-v29-latin-500.eot'); /* IE9 Compat Modes */ src: local(''), url('/storage/fonts/oswald-v29-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/oswald-v29-latin-500.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/oswald-v29-latin-500.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/oswald-v29-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/oswald-v29-latin-500.svg#Oswald') format('svg'); /* Legacy iOS */ } /* oswald-600 - latin */ @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 600; src: url('/storage/fonts/oswald-v29-latin-600.eot'); /* IE9 Compat Modes */ src: local(''), url('/storage/fonts/oswald-v29-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/storage/fonts/oswald-v29-latin-600.woff2') format('woff2'), /* Super Modern Browsers */ url('/storage/fonts/oswald-v29-latin-600.woff') format('woff'), /* Modern Browsers */ url('/storage/fonts/oswald-v29-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */ url('/storage/fonts/oswald-v29-latin-600.svg#Oswald') format('svg'); /* Legacy iOS */ } body { padding:0; margin:0; color:#484847; background-image: linear-gradient(to bottom, #458bc6, #d5e6f6); font-size:108%; line-height: 1.2 em; font-family:'Roboto', Arial, Helvetica, sans-serif; font-weight:400;} p { hyphens: auto; -webkit-hyphens: auto; -webkit-hyphenate-limit-chars: auto 3; -webkit-hyphenate-limit-lines: 4; -ms-hyphens: auto; -ms-hyphenate-limit-chars: auto 3; -ms-hyphenate-limit-lines: 4; hyphenate-limit-chars: auto 5; hyphenate-limit-lines: 2; } em { font-weight:500; font-style: italic; } h1 { font-family: 'Oswald', sans-serif; font-size: 1.7em; line-height: 1em; font-weight:400; color:#00F;} h2 { font-family: 'Oswald', sans-serif; font-size: 1.25em; line-height: 1.3em; font-weight:400; text-transform: uppercase; color:#00F; } h3 { font-family: 'Oswald', sans-serif; font-size: 1.2em; line-height: 1.4em; font-weight:500; color:#484847;} h4 { font-family: 'Oswald', sans-serif; font-size: 1.7em; line-height: 1em; font-weight:400; color:#00F;} h5 { font-family: 'Oswald', sans-serif; font-size: 1.1em; line-height: 1em; font-weight:500; color:#00F;} #fuss { background-image: url(/bilder/fuss.png); background-repeat:no-repeat; background-position: center bottom; background-color: #2175ba; padding-bottom: 100px;} #seitenbreite { width:100%; margin-left:auto; margin-right:auto; } header #top-logo{ height: auto; max-width: 100%; } .headerbox { padding: 0; margin: 0.5em 0 0.5em 0; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: center; } .grossesBild {max-width: 100%; padding: 5px 0 5px 0; position: relative; } .grossesBild img { display: block; } .grossesBild span { position: absolute; bottom: 5%; left: 7%; font-size: 3em } .bild-textfeld { padding: 1em;} .bilderlink {} .sprache { float:right; margin-right: 10px; clear: both;} .box-container { width: 1650px; margin-left: auto; margin-right: auto; padding: 10px 0 10px 0; list-style: none; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: space-around; } .box-container2 { width: auto; margin-left: auto; margin-right: auto; padding: 10px 0 10px 0; list-style: none; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: space-around; } .inhalt-100 { background: #FFF; padding: 1em; border-radius: 5px; width: 99%; height: auto; color: #666; overflow: hidden; margin-bottom: 0.9%;} .inhalt-box2 { background: #fff; padding: 1em; border-radius: 5px; width: 49%; height: auto; color: #666; overflow: hidden; margin:0.5% 0.2% 0.9% 0.5%;} .inhalt-box { background: #FFF; padding: 0; border-radius: 5px; width: 32%; height: 600px; color: #666; overflow: hidden; margin-bottom: 0.9%; } .klein-inhalt-box { background: #FFF; padding: 0; border-radius: 5px; width: 250px; height: 450px; color: #666; overflow: hidden; margin-bottom: 0.9%;} .box33 {width: 33.2%; height: auto; background: #f0f0f0; padding: 1em; margin-left: 1em;} .box33a {width: 33.2%; height: auto; background: #ffffff; padding: 1em; margin-left: 1em;} .box32 {width: 30%; height: auto; background: #f0f0f0; padding: 0.2em; margin: 0.2em;} .box50 {width: 49%; height: auto;} .box66 {width: 66.4%; height: auto;} .praktiker-box { background: #FFF; padding: 0; width: 32%; height: auto; color: #666; overflow: hidden; margin-bottom: 0.9%; } .fuss-box { padding: 0; width: 32%; minheight: 250px; margin: 5px; color: #fff; overflow: hidden; } .box-3 { padding: 0; width: 32%; minheight: 250px; margin: 5px; overflow: hidden; } .box-2 { padding: 0; width: 48%; minheight: 250px; margin: 5px; overflow: hidden; } .box-2a { padding: 0; width: 48%; minheight: 250px; margin: 5px; overflow: hidden; } .box-1 { display:flex; align-items: flex-start; padding: 0; width: 48%; minheight: 250px; margin: 5px; overflow: hidden; } .tab { border:#CCCCCC; border-style:solid; border-width: 1px; margin: 0.5em; padding: 0.5em;} .tab2 { display:flex; align-items: flex-start; flex-wrap: wrap; border:#CCCCCC; border-style:solid; border-width: 1px; margin: 0.5em; padding: 0.5em;} .tab3 { display:flex; align-items: flex-start; } .tab4 { display:flex; align-items: flex-start; } .b20 { font-family: 'Oswald', Arial, Helvetica, sans-serif; font-weight:600; } .c20 { font-family: 'Oswald', Arial, Helvetica, sans-serif;width: 100%; background-color:#CCC; color:#00f; font-weight:300;} .b80 { font-family: 'Oswald', Arial, Helvetica, sans-serif; margin-left: 1em; } .c80 { font-family: 'Oswald', Arial, Helvetica, sans-serif; margin-left: 1em; } .d80 { font-family: 'Oswald', Arial, Helvetica, sans-serif; margin-left: 0.2em; width: 95px;} .d90 { font-family: 'Oswald', Arial, Helvetica, sans-serif; margin-left: 0.2em; width: 95px;} .ddatum { font-family: 'Oswald', Arial, Helvetica, sans-serif; margin-left: 0.2em; width: 270px; } .dtext { font-family: 'Oswald', Arial, Helvetica, sans-serif; margin-left: 0.2em; width: 300px;} .kpunkt { list-style:none;} .djahr { font-family: 'Oswald', Arial, Helvetica, sans-serif; width: 4em; font-weight:600;} .dinfo { font-family: 'Oswald', Arial, Helvetica, sans-serif; margin-left: 0.2em;} .vorschau-link { color:#000; font-family: 'Oswald', sans-serif; font-size: 1.3em; line-height:1em; font-weight:400; } .inhalt-praktiker { background: #FFF; padding: 0%; border-radius: 5px; width: 99%; height: auto; margin-bottom: 0.9%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: space-around; } .zentriert { display: flex; align-items: center; justify-content: center;} #slideshow { padding: 0 0 0 0; z-index:1; overflow:hidden; float: left; width:80% } .rslides { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; } .rslides li { position: absolute; display: none; width: 100%; left: 0; top: 0; } .rslides li:first-child { position: relative; display: block; float: left; } .rslides img { display: block; height: auto; float: left; width: 100%; border: 0; } .felder {font-weight:600; font-size: 1em; color:#00F;} a:link.vorschau-link { color:#000; text-decoration: underline; font-family: 'Oswald', sans-serif; font-size: 1.3em; line-height:1em; font-weight:400; } a:hover.vorschau-link {color:#00f; animation: 2} a:visited.vorschau-link { color: #000;} a img:hover{ box-shadow:0 10px 10px rgba(22,22,22,0.7); opacity: 0.6; } a:link.fuss-link { color:#fff; text-decoration: underline; font-family: 'Oswald', sans-serif; font-size: 1.3em; line-height:1.4em; font-weight:400; } a:hover.fuss-link {color: #ff0; animation: 2} a:fokus.fuss-link { color: #fff;} a:visited.fuss-link { color: #fff;} a:link.rot-link { color:#f00; text-decoration: underline; } a:hover.rot-link {color: #00f; } a:focus.rot-link {color: #00f; } a:visited.rot-link { color: #f00;} /*Textauszeichnungen */ .druck { display:none;} .vorschau { color:#000; text-decoration: none; font-family: 'Oswald', sans-serif; font-size: 1.3em; line-height:1.6em; font-weight:300; } .p-box {font-family:'Oswald', sans-serif; font-weight:300; color:#000;} .p-schmal {font-family:'Roboto Condensed', sans-serif; font-weight:300; color:#000;} .fett {font-weight:600;} .gross {text-transform: uppercase;} .kapital { font-variant: small-caps; font-size: 1.05em; } .reg { font-variant: small-caps; } .gross-blau { color: #00F; text-transform: uppercase;} .gross-schwarz { color: #000; text-transform: uppercase;} .schwarz { color: #000;} .rot { color:#F00;} .gruen { color:#0F0;} .dgruen { color: #090;} .blau { color: #00F;} .grau { color:#666;} .weiss { color: #FFF;} .text2 { margin:1.5%;} .weiss-schatten { color:#FFF; text-shadow: 1px 1px 1px black, 1px -1px 1px black, -1px 1px 1px black, -1px -1px 1px black; } .blau-schatten { color:#00F; text-shadow: 1px 1px 1px white, 1px -1px 1px white, -1px 1px 1px white, -1px -1px 1px white; } .text-eins { width:99%; margin-left:auto; margin-right:auto; margin-top: 12px; margin-bottom: 20px; padding: 1px 10px 8px 10px; } .text-zwei { width:99%; margin-left:auto; margin-right:auto; margin-top: 12px; margin-bottom: 20px; background-color:#FFF; padding: 1px 10px 8px 10px; border-radius: 5px;} .mehrspaltig { width: 100%; border: 0px solid; -webkit-column-count: 3; column-count: 3; -webkit-column-count: 3; padding-top: 0em; padding-right: 1px; padding-bottom: 0em; padding-left: 0px; -ms-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; } .normal-normal {font-size: 0.8em; text-transform: none;} /*Bilder */ .textbild { float: left; max-width: 100%; padding: 0 0.5em 0.5em 0;} .boxbild { float: left; max-width: 100%; padding-bottom: 1em;} .praktikerbild { float: left; max-width: 100%; padding: 0 1em 1em 0;} .textbild-logo { float: left; padding-bottom: 0.5em; padding-right: 0.5em;} .textbild-logo-r { float: right; padding: 0 0 0.2em 0.2em;} .textbild-logo-lgb { float: left; padding-bottom: 0.5em; padding-right: 1.5em;} .logo { min-height: 90px; width:100%;} .p-logo { min-height: 60px; width:100%; } .textbild33c { max-width: 50%; display: block; margin-left: auto; margin-right: auto; } .textbildr { float: right; max-width: 100%; padding: 0 0 1.5% 0; } .textbildr-2 { float: right; max-width: 100%; padding: 0 0 1.5% 0; } .textbild50 { float: left; max-width: 48.5%; padding: 0 1.5% 1.5% 0;} .textbild50r { float: right;max-width: 48.5%; padding: 0 0 1.5% 1.5%;} .textbild33r { float: right; max-width: 30.3%; padding: 0 0 1.5% 1.5%;} .textbild33r-2 { float: right; max-width: 30.3%; padding: 0 0 1.5% 1.5%;} .textbild33 { float: left; max-width: 30.3%; padding: 0 1.5% 1.5% 0;} .textbild33-50 { float: left; max-width: 30.3%; padding: 0 1.5% 1.5% 0;} .textbild33-50r { float: right; max-width: 30.3%; padding: 0 0 1.5% 1.5%;} .textbild25r { float: right; max-width: 22%; padding: 0 0 1.5% 1.5%;} .textbild25 { float: left; max-width: 22%; padding: 0 1.5% 1.5% 0;} /*für div zum zentrieren */ .klein-bild-center {float:right; } .klein-bild-center-r {float:left; width:33%;} /* div mit rahmen für Text */ .text-bild-center33 {float:right; width:32%; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em;} .text-bild-center33-r {float:left; width:32%; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em; } .text-bild-center50 {float:right; width:48%; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em;} .text-bild-center50-r {float:left; width:48%; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em;} .text-text-hg {width:98%; display: flex; justify-content: center; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em;} .text-text-hg50 {width:48%; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em;} /*Formular noch nicht benötigt*/ .suche form { max-width:500px; margin:20px auto; } .feedback-input { color:#000; font-family: Helvetica, Arial, sans-serif; font-weight:500; font-size: 18px; border-radius: 5px; line-height: 22px; background-color: transparent; border:2px solid #0000ff; transition: all 0.3s; padding: 13px; margin-bottom: 15px; width:100%; box-sizing: border-box; outline:0; } .feedback-input:focus { border:2px solid #000; } .suche textarea { height: 150px; line-height: 150%; resize:vertical; } .suche [type="submit"] { font-family: Arial, Helvetica, sans-serif; width: 100%; background:#ccc; border-radius:5px; border:0; cursor:pointer; color: #333; font-size:1.0em; padding-top:10px; padding-bottom:10px; transition: all 0.3s; margin-top:-4px; font-weight:300; } .suche [type="submit"]:hover { background:#0000ff; color:#FFF; } /* Formular kontakt */ .kontakt input { color:#000; font-family: Helvetica, Arial, sans-serif; font-weight:500; font-size: 18px; border-radius: 5px; line-height: 18px; background-color: #fff; border:2px solid #0000ff; transition: all 0.3s; padding: 5px; margin-bottom: 15px; width:66%; box-sizing: border-box; outline:0; float: left; } .kontakt label { text-align: left; line-height: 1.5; width: 26%; float: left; } .kontakt textarea { border: 2px solid #0000ff; font-family: Helvetica, Arial, sans-serif; background-color:#fff; font-weight:500; font-size: 18px; border-radius: 5px; height: 60px; width: 65%; padding: 5px; margin-bottom: 15px; } ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #999; } ::-moz-placeholder { /* Firefox 19+ */ color: #999; } :-ms-input-placeholder { /* IE 10+ */ color: #999; } :-moz-placeholder { /* Firefox 18- */ color: #999; } .kontakt checkbox { float:right; width: 5%;} .kontakt [type="submit"]:hover { background:#0000ff; color:#FFF; width: 100% } /* trigger for Safari on iOS v9.x and OS X El Capitan v10.11 */ nav :checked ~ ul {opacity:1;} .accordion { padding: 5px; margin: 7px 0px 0px 0px; width:100%; border: 2px solid #00f; font-family: Helvetica, Arial, sans-serif; background-color:#fff; font-weight:500; font-size: 18px; border-radius: 5px; cursor: pointer; text-align: left; transition: 0.4s; } .active, .accordion:hover { background-color: #00f; color:#fff; } .panel { padding: 0 18px; display: none; background-color: #fff; overflow: hidden; } /* Tabellen */ * { box-sizing:border-box; } table { width:100%; } table, td, tr, th { border:1px solid blue; border-collapse: collapse; text-align: left; } td, tr, th { padding:0.5em; } th { background:#d5e6f6; font-weight: bold; } /* ================================================================ This copyright notice must be untouched at all times. The original version of this stylesheet and the associated (x)html is available at http://www.cssplay.co.uk/menus/cssplay-responsive-droplist-touch-screens.html Copyright (c) Stu Nicholls. All rights reserved. This stylesheet and the assocaited (x)html may be modified in any way to fit your requirements. =================================================================== */ nav {width:95%; max-width:1100px; min-width:300px; margin:0 auto; text-align:center; position:relative; font-family: 'Oswald', Arial, Helvetica, sans-serif; z-index:100;} nav ul {padding:0; margin:0; list-style:none;} nav input.inputmenu {position:absolute; left:-9999px; display:none;} nav ul.menu {position:relative; z-index:10;} nav label { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; -ms-touch-action: none; } ul.menu > li {display:inline-block; background:#fff; border-radius:8px; -webkit-transition:1s; transition:1s; } ul.menu > li span {display:block; position:relative;} ul.menu > li span a {text-decoration:none; display:block; padding:0 25px; font:400 16px/40px 'Oswald', Helvetica, sans-serif; cursor:pointer; color:#333; position:relative;} ul.menu > li span a:after {content:""; display:block; width:5px; height:5px; border:1px solid #333; border-color:#333 #333 transparent transparent; position:absolute; right:8px; top:16px; -webkit-transform:rotate(45deg); transform:rotate(45deg); } ul.menu > li span label:nth-of-type(1) {display:block; padding:0 25px; font:400 16px/40px 'Oswald', Helvetica, sans-serif; cursor:pointer; color:#333; position:relative;} ul.menu > li span label:nth-of-type(1):after {content:""; display:block; width:5px; height:5px; border:1px solid #333; border-color:transparent #333 #333 transparent; position:absolute; right:8px; top:14px; -webkit-transition:1s; transition:1s; -webkit-transform:rotate(45deg); transform:rotate(45deg); } ul.menu li div {position:absolute; left:0; top:55px; width:100%; background: rgba(250,250,250,0.5); max-height:0; overflow:hidden; opacity:0; -webkit-transition:1s; transition:1s; } ul.menu div dl {padding:10px 15px; margin:0; display:inline-block; vertical-align:top; width:190px;} ul.menu div dt {display:block; padding:5px; margin:0; color:#fff; font-size:14px; line-height:20px; background:#00f; border-radius:5px; position:relative;} ul.menu div dt label:nth-of-type(1) {display:block;} ul.menu div dd {display:block; padding:0; margin:0;} ul.menu div dd a {line-height:28px; color:#fff; background:#5555ff; display:block; margin:2px 0; padding:0 5px; text-decoration:none; font-size:13px; white-space:nowrap; border-radius:5px; position:relative;} ul.menu div dd a:after {content:""; display:block; width:5px; height:5px; border:1px solid #fff; border-color:#fff #fff transparent transparent; position:absolute; right:10px; top:10px; -webkit-transform:rotate(45deg); transform:rotate(45deg); } ul.menu div dd a:hover {text-decoration:underline; background:#00f; color:#fff;} ul.menu div dd a:hover:after {background:#00f; border-color:#fff #fff transparent transparent;} #top1:checked ~ .menu li:nth-of-type(2), #top2:checked ~ .menu li:nth-of-type(3), #top3:checked ~ .menu li:nth-of-type(4), #top4:checked ~ .menu li:nth-of-type(5), #top5:checked ~ .menu li:nth-of-type(6) {background:#00f;} #top1:checked ~ .menu li:nth-of-type(2) div, #top2:checked ~ .menu li:nth-of-type(3) div, #top3:checked ~ .menu li:nth-of-type(4) div, #top4:checked ~ .menu li:nth-of-type(5) div, #top5:checked ~ .menu li:nth-of-type(6) div {max-height:1000px; padding:10px 0; opacity:1; border-radius:8px;} #top1:checked ~ .menu li:nth-of-type(2) span label:nth-of-type(1), #top2:checked ~ .menu li:nth-of-type(3) span label:nth-of-type(1), #top3:checked ~ .menu li:nth-of-type(4) span label:nth-of-type(1), #top4:checked ~ .menu li:nth-of-type(5) span label:nth-of-type(1), #top5:checked ~ .menu li:nth-of-type(6) span label:nth-of-type(1) {color:#fff;} #top1:checked ~ .menu li:nth-of-type(2) span label:nth-of-type(1):after, #top2:checked ~ .menu li:nth-of-type(3) span label:nth-of-type(1):after, #top3:checked ~ .menu li:nth-of-type(4) span label:nth-of-type(1):after, #top4:checked ~ .menu li:nth-of-type(5) span label:nth-of-type(1):after, #top5:checked ~ .menu li:nth-of-type(6) span label:nth-of-type(1):after {-webkit-transform:rotate(-135deg); transform:rotate(-135deg); top:19px; border-color:transparent #fff #fff transparent;} #top1:checked ~ .menu li:nth-of-type(2) span label:nth-of-type(2), #top2:checked ~ .menu li:nth-of-type(3) span label:nth-of-type(2), #top3:checked ~ .menu li:nth-of-type(4) span label:nth-of-type(2), #top4:checked ~ .menu li:nth-of-type(5) span label:nth-of-type(2), #top5:checked ~ .menu li:nth-of-type(6) span label:nth-of-type(2) {display:block; width:100%; height:100%; position:absolute; left:0; top:0; background:transparent url(); cursor:pointer;} #top1:checked ~ .closetop, #top2:checked ~ .closetop, #top3:checked ~ .closetop, #top4:checked ~ .closetop, #top5:checked ~ .closetop {position:fixed; width:100%; height:100%; left:0; top:0; background:transparent; z-index:1;} nav label.menuopenclose {display:none;} /* ================================================================ Anpassungen Pabst */ .p-logo { clear: both; } .p-logo .logoContainer { float: left; min-width: 115px; text-align: center; display: block; } .logoContainer2 { float: left; min-width: 80px; padding-right: 5px; text-align: center; display: block; } span.nobreak { white-space: nowrap; } /* ================================================================ Anpassungen Pabst Ende */ @media only screen and (max-width: 1650px) { .box-container { width: 95%;} } @media only screen and (max-width: 1400px) { .flex-item {width: 400px; height: 130px;} .grossesBild span { position: absolute; bottom: 5%; left: 8%; font-size: 2em } .praktiker-box { width: 49%;} } @media only screen and (max-width: 1200px) { #seitenbreite { width:100%;} .box-container { width: 100%;} .flex-item {width: 350px; height: 130px;} .mehrspaltig { width: 100%; border: 0px solid; -webkit-column-count: 2; column-count: 2;-webkit-column-count: 2;} .klein-bild-center { width: 33%; } .box-3 { width: 49%; } .text-bild-center33 { width:48%; } .text-bild-center33-r { width:48%; } .textbild33-50 { max-width: 50%; } .textbild33-50r { max-width: 50%; } .tab2 { margin: 0.2em; padding: 0.2em;} .d80 { font-family:'Oswald', sans-serif; font-weight:300; margin-left: 0.1em; width: 92px;} .d90 { font-family:'Oswald', sans-serif; font-weight:300; margin-left: 0.1em; width: 79px;} } @media only screen and (max-width: 1100px) { .inhalt-2box { width: 100%;} .inhalt-100 { width: 100%;} .tab { width:100%} .tab2 { flex-wrap: wrap; width: 100%; } .box-3 { width: 100%; } .box-2 { width: 48%; } .box-2a {width: 100%; } .box-1 { width: 100%; } span.nobreak { white-space: normal;} } @media only screen and (max-width: 902px) { .flex-item {width: 300px; height: 100px; text-align: center;} table, tr, td { padding:0; border:1px solid blue; } table { border:none; } thead { display:none; } tr { float: left; width: 100%; margin-bottom: 0.5em; } td { float: left; width: 100%; padding:0.5em; } td::before { content:attr(data-label); word-wrap: break-word; background: #d5e6f6; border-right:1px solid blue; width: 20%; float:left; padding:0.5em; font-weight: bold; margin:-0.5em 0.5em -0.5em -0.5em;} header #top-logo{ margin 1em; padding-left: 20%; max-width: 80%;} .inhalt-box { width: 95%; height: auto;} .inhalt-box2 { width: 95%;} .inhalt-2box { width: 95%;} .inhalt-3box { width: 95%;} .inhalt-100 {width:95%;} .box33 {width: 95%; background: #fff; margin-left: 0em;} .box33a {width: 95%; background: #fff; margin-left: 0em;} .box32 {width: 95%; background: #fff; margin-left: 0em;} .box66 {width: 95%; } .klein-inhalt-box { width: 46%; height: auto;} .praktiker-box { width: 80%;} .text2 { margin:3%;} .mehrspaltig {-webkit-column-count: 1; column-count: 1;} .textbild33-50 { float: none; max-width: 100%; padding: 0; margin: 0.5%;} .textbild33-50r { float: none; max-width: 100%; padding: 0; margin: 0.5%;} .textbild25r { float: none; max-width: 98.5%; padding: 0; margin: 0.5%;} .textbild25 { float: none; max-width: 98.5%; padding: 0; margin: 0.5%;} .text-bild-center33 {float: none; width: 98.5%; margin: 0.5%;} .text-bild-center33-r {float: none; width: 98.5%; margin: 0.5%;} .text-bild-center50 {float: none; width: 98.5%; margin: 0.5%;} .text-bild-center50-r {float: none; width: 98.5%; margin: 0.5%;} .text-text-hg50 {width:98%;} .grossesBild span { position: absolute; bottom: 5%; left: 5%; font-size: 1em } .abstand { float:left; padding-right: 1em;} .sprache { max-width: 70px;} .tab3 { display:flex; flex-direction: column; } .tab4 { width: 100%; display: flex; flex-direction:column;} nav {width:100%; max-width:300px; margin:0 auto;} nav label.menuopenclose {display:block; font:400 20px/40px 'Oswald', Helvetica, sans-serif; color:#333; position:relative;} ul.menu {width:100%; max-height:0; overflow:hidden; -webkit-transition:1s; transition:1s; } nav label.menuopenclose:before {content:""; display:block; width:30px; height:3px; border:4px solid #000; border-width:4px 0; position:absolute; right:70px; top:11px;} nav label.menuopenclose:after {content:""; display:block; width:30px; height:3px; border:4px solid #000; border-width:4px 0; position:absolute; right:70px; top:18px;} ul.menu li {width:100%; margin-bottom:2px;} ul.menu div dl {display:block; margin:0 auto; padding:2px 0;} nav label {cursor:pointer;} ul.menu div dl dt:after {content:""; display:block; width:5px; height:5px; border:1px solid #fff; border-color:transparent #fff #fff transparent; position:absolute; right:8px; top:10px; -webkit-transition:1s; transition:1s; -webkit-transform:rotate(45deg); transform:rotate(45deg); } #menuopenclose:checked ~ ul.menu {max-height:2000px;} #menuopenclose:checked + label.menuopenclose:before {content:""; display:block; width:20px; height:4px; background:#333; border:0; top:18px; right:75px; -webkit-transform:rotate(45deg); transform:rotate(45deg); } #menuopenclose:checked + label.menuopenclose:after {content:""; display:block; width:20px; height:4px; background:#333; border:0; top:18px; right:75px; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); } ul.menu li div {position:static;} #top1:checked ~ .menu li:nth-of-type(2) div, #top2:checked ~ .menu li:nth-of-type(3) div, #top3:checked ~ .menu li:nth-of-type(4) div, #top4:checked ~ .menu li:nth-of-type(5) div, #top5:checked ~ .menu li:nth-of-type(6) div, #top6:checked ~ .menu li:nth-of-type(7) div {max-height:1000px; opacity:1; padding-bottom:10px;} #top1:checked ~ .closetop, #top2:checked ~ .closetop, #top3:checked ~ .closetop, #top4:checked ~ .closetop, #top5:checked ~ .closetop, #top6:checked ~ .closetop {position:fixed; width:0; height:0;} ul.menu div dd {max-height:0; overflow:hidden; -webkit-transition:1s; transition:1s; } ul.menu div input:checked + dl dd {max-height:300px;} ul.menu div input:checked + dl dt label:nth-of-type(2) {display:block; width:100%; height:100%; position:absolute; left:0; top:0; background:transparent url( url(/images/seite/nichts.gif);} ul.menu div input:checked + dl dt:after {-webkit-transform:rotate(-135deg); transform:rotate(-135deg); top:12px;} } @media only screen and (max-width: 700px) { .textbild33c { max-width: 100%; display: block; margin-left: auto; margin-right: auto; } .textbildr-2 { display: none; } .textbild33r-2 { display: none;} .textbild50 { float: none; max-width: 100%; padding: 0 0 1.5% 0; } .textbild50r { float: none; max-width: 100%; padding: 0 0 1.5% 0;} .textbild33 { float: none; max-width: 100%; padding: 0 0 1.5% 0;} .textbild33r { float: none; max-width: 100%; padding: 0 0 1.5% 0;} .klein-bild-center { display: flex; justify-content: center; align-items: center; float:none; width:100%;} .klein-bild-center-r { display: flex; justify-content: center; align-items: center; float:none; width:100%;} .praktiker-box { width: 95%;} .praktikerbild { max-width: 120px; } .fuss-box { width: 100%;} .tab3 { width: 100%;} .tab4 { width: 100%;} } @media only screen and (max-width: 550px) { .d80 { font-weight:400; margin-left: 0.3em; width: auto;} .d90 {font-weight:400; margin-left: 0.3em; width:auto;} .klein-inhalt-box { width: 95%; height: auto;} } #cookiedingsbums a {color:#000; text-decoration:none;} #cookiedingsbums a:hover {text-decoration:underline;} #cookiedingsbums div {padding:10px; padding-right:40px;} #cookiedingsbums { outline: 1px solid #7b92a9; text-align:right; border-top:1px solid #fff; background: #d6e0eb; background: -moz-linear-gradient(top, #d6e0eb 0%, #f2f6f9 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d6e0eb), color-stop(100%,#f2f6f9)); background: -webkit-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%); background: -o-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%); background: -ms-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%); background: linear-gradient(to bottom, #d6e0eb 0%,#f2f6f9 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6e0eb', endColorstr='#f2f6f9',GradientType=0 ); position:fixed; bottom:0px; z-index:10000; width:100%; font-size:12px; line-height:16px;} #cookiedingsbumsCloser { color: #777; font: 14px/100% arial, sans-serif; position: absolute; right: 5px; text-decoration: none; text-shadow: 0 1px 0 #fff; top: 5px; cursor:pointer; border-top:1px solid white; border-left:1px solid white; border-bottom:1px solid #7b92a9; border-right:1px solid #7b92a9; padding:4px; background: #ced6df; /* Old browsers */ background: -moz-linear-gradient(top, #ced6df0%, #f2f6f9 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ced6df), color-stop(100%,#f2f6f9)); background: -webkit-linear-gradient(top, #ced6df0%,#f2f6f9 100%); background: -o-linear-gradient(top, #ced6df0%,#f2f6f9 100%); background: -ms-linear-gradient(top, #ced6df0%,#f2f6f9 100%); background: linear-gradient(to bottom, #ced6df0%,#f2f6f9 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ced6df', endColorstr='#f2f6f9',GradientType=0 ); } #cookiedingsbumsCloser:hover {border-bottom:1px solid white; border-right:1px solid white; border-top:1px solid #7b92a9; border-left:1px solid #7b92a9;} @media screen { .print { display: none; } } @media print { body { padding:0; margin:0; color:#000; background-image:none; background-color:#FFF; line-height: 1 em; font-family: Arial, Helvetica, sans-serif; font-weight:400;} header { max-width: 100%;} nav {display:none;} .box-container { width:100%; margin-left:auto; margin-right:auto;} #seitenbreite { width:100%; margin-left:auto; margin-right:auto; } .klein-inhalt-box { background: #ccc; padding: 0; border-radius: 0px; width: 250px; height: 350px; color: #000; overflow: hidden; margin-bottom: 0.9%;} .screen { display: none; } p { color:#000000; font-size: 11pt; } em { font-weight:500; font-style: italic; } h1 { font-family: Arial, Helvetica, sans-serif; font-size: 15pt; line-height: normal; font-weight:400; color:#00F; margin-bottom: 2px;} h2 { font-family: Arial, Helvetica, sans-serif; font-size: 12pt; line-height: normal; font-weight:400; text-transform: uppercase; color:#00F; margin-top: 2px; margin-bottom: 2px; } h3 { font-family: Arial, Helvetica, sans-serif; font-size: 14pt; line-height: normal; font-weight:500; color:#484847;} h4 { font-family: Arial, Helvetica, sans-serif; font-size: 13pt; line-height: nirmal; font-weight:400; color:#00F;} h5 { font-family: Arial, Helvetica, sans-serif; font-size: 13pt; line-height: niormal; font-weight:500; color:#00F;} .weiss-schatten { font-family: Arial, Helvetica, sans-serif; font-size: 30pt; line-height: normal; font-weight:500; color:#FFF; text-shadow: 1px 1px 1px black, 1px -1px 1px black, -1px 1px 1px black, -1px -1px 1px black; } li { color:#000000; font-size: 11pt; } ul { color:#000000; font-size: 11pt; } #google {display:none;} #top-logo {display:none;} #fuss { display: none; } #cookiedingsbums { display: none; } .vorschau-link { display: none; } .druck { display: block;} .box-container { height: auto;} .inhalt-100 { overflow: visible; height: auto;} .box66 {width: 100%;} .box33 {width: 100%; background: #fff; margin-left: 0em;} .box33a {width: 100%; background: #fff; margin-left: 0em;} .tab3 { width: 100%; display:flex; flex-direction: column; } /* ================================================================ Bilder */ .grossesBild {max-width: 100%; padding: 0; } .textbild { float: left; max-width: 25%; padding: 0 0.5em 0.5em 0;} .boxbild { float: none; max-width: 100%; padding-bottom: 1em;} .praktikerbild { float: left; max-width: 100%; padding: 0 1em 1em 0;} .textbild-logo { float: left; padding-bottom: 0.5em; padding-right: 0.5em;} .textbild-logo-lgb { float: left; padding-bottom: 0.5em; padding-right: 1.5em;} .logo { min-height: 90px; width:100%;} .p-logo { min-height: 60px; width:100%; } .textbild33c { max-width: 33%; display: block; margin-left: auto; margin-right: auto; } .textbildr { float: right; max-width: 33%; padding: 0 0 1.5% 0; } .textbildr-2 { float: right; max-width: 33%; padding: 0 0 1.5% 0; } .textbild50 { float: left; max-width: 33%; padding: 0 1.5% 1.5% 0;} .textbild50r { float: right;max-width: 33%; padding: 0 0 1.5% 1.5%;} .textbild33r { float: right; max-width: 33%; padding: 0 0 1.5% 1.5%;} .textbild33r-2 { float: right; max-width: 33%; padding: 0 0 1.5% 1.5%;} .textbild33 { float: left; max-width: 33%; padding: 0 1.5% 1.5% 0;} .textbild33-50 { float: left; max-width: 33%; padding: 0 1.5% 1.5% 0;} .textbild33-50r { float: right; max-width: 33%; padding: 0 0 1.5% 1.5%;} .textbild25r { float: right; max-width: 33%; padding: 0 0 1.5% 1.5%;} .textbild25 { float: left; max-width: 33%; padding: 0 1.5% 1.5% 0;} /*für div zum zentrieren */ .klein-bild-center {float:right;} .klein-bild-center-r {float:left; width:33%;} /* div mit rahmen für Text */ .text-bild-center33 {float:right; width:32%; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em;} .text-bild-center33-r {float:left; width:32%; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em; } .text-bild-center50 {float:right; width:48%; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em;} .text-bild-center50-r {float:left; width:48%; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em;} .text-text-hg {width:98%; display: flex; justify-content: center; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em;} .text-text-hg50 {width:48%; background-color:#F3F3F3; border: 1px solid #00f; padding: 10px; margin: 1em;} .inhalt-100 { background: #FFF; padding: 1em; border-radius: 5px; width: 99%; height: auto; color: #666; overflow: hidden; margin-bottom: 0.9%;} /*tabelle ohne zeilenumbruch beim Druck */ table tr td {page-break-inside: avoid;} table {width:100%; font-family: arial; font-size:8pt; color: #000; } td {border:1px solid; overflow:hidden; vertical-align:top;} .noprint { display: none; } .ie { display: none; } }