@charset "utf-8";
/* CSS Document */

*, *:before, *:after { -webkit-box-sizing: border-box; /* Safari/Chrome, andere WebKit-Browser */ -moz-box-sizing: border-box; /* Firefox, andere Gecko-Browser */ box-sizing: border-box; /* Opera/IE 8+ */ }
/* ----------------------------------------------------------------------------- */


html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; height: 100%; scroll-behavior: smooth; }
body { font-family: Arial, Helvetica, sans-serif; height: 100%; background:#FFFFFF; }
@font-face { font-family: 'ralewaylight'; src: url('fonts/raleway-light-webfont.eot'); src: url('fonts/raleway-light-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/raleway-light-webfont.woff2') format('woff2'), url('fonts/raleway-light-webfont.woff') format('woff'), url('fonts/raleway-light-webfont.ttf') format('truetype'), url('fonts/raleway-light-webfont.svg#ralewaylight') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'ralewaylight_italic'; src: url('fonts/raleway-lightitalic-webfont.eot'); src: url('fonts/raleway-lightitalic-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/raleway-lightitalic-webfont.woff2') format('woff2'), url('fonts/raleway-lightitalic-webfont.woff') format('woff'), url('fonts/raleway-lightitalic-webfont.ttf') format('truetype'), url('fonts/raleway-lightitalic-webfont.svg#ralewaylight_italic') format('svg'); font-weight: normal; font-style: normal; }
/* ---------------------*/

img { max-width: 100%; height: auto; }
a { color: #2B4C9B; font-weight: 500; text-decoration: none; }
h1 { font-family: 'ralewaylight_italic', Arial, cursive; font-size: 1.5em; color: #FFFFFF; font-weight:500; text-transform: uppercase; }
h2 { font-size: 1.375em; font-family: 'ralewaylight_italic', cursive; letter-spacing: 3px; color: 99a9c9; }
h3 { font-size: 1.25em; font-family: 'ralewaylight', cursive; color: #99a9c9; }
h4 { font-size: 1.125em; font-family: 'Arial', cursive; color: #2b4c9a; }
h5 { font-size: 1.0em; font-family: 'ralewaylight_italic', Arial, cursive; color: #C0C0C0; letter-spacing: 2px; }
p { font-size: 1em; line-height: 1.4em; /*14/16*/ color: #333; }
/*header*/

header { position: fixed; z-index:99; top: 0; left: 0; width: 100%; height: 35px; background-color: #fff; border-bottom: #eaeaea thin solid; }




/* *****************************************************************************************/
/* Smartphones */
/* *****************************************************************************************/

/* Smartphone Hochformat (Portrait) */

/*startseite*/
#startseite { margin: 0; padding: 0; background: url(../images/startk.jpg); background-position: 50% 10%; background-size: 80% auto; background-repeat: no-repeat; background-color: #9aa9c8; width: 100%; height: 100%; margin: 5px 0 0 0; }
#startseite #intro { width: 95%; heigth: 100%; margin: 0px 2% 2% 2%; padding: 350px 10px 0 15px; }
#startseite #intro h1, h2, h3 { color: #fff; }
#startseite #intro h1 { text-align: left; font-size: 1.375em; font-weight: 900; }
#startseite #intro .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #fff; }
#startseite #intro h2 { text-align: left; font-size: 14px; line-height:normal; }
/*leitmotiv*/
section#leitmotiv.page { width: 100%; height: auto; margin: 0px; padding:30px 5px 0 5px; }
#leitmotiv h1 { text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#leitmotiv .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#leitmotiv h3 { width: 90%; margin:10px; color:#2b4c9a; font-weight: 900; text-align: center; font-size: 14px; }
#leitmotiv .hintergrund { margin: 10px 0 0 0; width:100%; height:100%; background-color: #e9e9e9; padding: 10px 0px; }
#leitmotiv article.leitmotiv_motto_bg { background-image: url(../images/gandhik.jpg); background-position:50% 50%; background-repeat:no-repeat; background-size:cover; padding: 5px; text-align: center; }
#leitmotiv .leitmotiv_motto_bg p { font-family: 'ralewaylight_italic', Arial, cursive; font-size: 1.125em; color: #2b4c9a; font-weight: 900; }
/*Über mich*/
section#ueber.page { width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#ueber h1 { text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#ueber .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#ueber h3 { width: 90%; margin:0; color:#2b4c9a; font-weight: bolder; text-align: left; font-size: 1em; padding: 10px 0px 0px 0px; }
#ueber .hintergrund { margin: 10px 0 0 0; width:100%; height:100%; background-color: #E9E9E9; padding: 10px 0px; }
#ueber .ueber_motto_bg { width:100%; text-align: center; }
#ueber .ueber_motto_bg .portrait { width: 35%; height: auto; margin: 1% 30% 2% 30%; }
#ueber article.ueber { width: 100%; text-align: left; background-color: #fff; height: 150%; padding: 10px; }
#ueber ul { width: 98%; height: auto; }
#ueber ul.keinabstand {margin-top: -1em;}
#ueber ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#ueber li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .5em -1.2em; font-size: 70%; }
/*verfahren */
section#verfahren.page { width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#verfahren h1 { text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#verfahren .flexelement h3 {text-align: font-size: 16px; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#verfahren .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
.flexbox { width: 95%; margin: 2%; background-color: #fff; }
.flexelement1 { background: #E9E9E9; color: #000; text-align: left; margin: 5px; padding: 5px; }
/*Kontakt */
section#kontakt.page { width: 100%; height: auto; margin: 0px; padding: 30px 5px 10px 5px; }
#kontakt h1 {text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#kontakt .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#kontakt .hintergrund { margin: 10px 0 0 0; width:100%; height:auto; background-color: #E9E9E9; padding: 10px 0; }
#kontakt .kontakt_motto_bg { width:100%; text-align: center; }
#kontakt .kontakt_motto_bg .portrait { width: 30%; height: auto; margin: 0% 35%; }
#kontakt h3 {width: 100%; margin:0; color:#2b4c9a; font-weight: bolder; text-align: center; font-size: 1em; padding: 20px 0px 0px 0px; }
#kontakt article.kontakt { width: 100%; height: 100%; text-align: center; background-color: #fff; height: auto%; }
#kontakt article.kontakt p { font-size: 1em; }
/*impressum*/
section#impressum.page {width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#impressum h1 {  text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#impressum .flexelement h3 {text-align: font-size: 1em; color: #2b4c9a; font-weight: 800; text-transform:uppercase;}
#impressum .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#impressum .flexbox { width: 100%; margin: 5px 0; background-color: #fff; padding: 5px;}
#impressum .flexelement { background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; }
/*Datenschutz*/
section#datenschutz.page {width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#datenschutz h1 {text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#datenschutz .flexelement h3 {text-align: font-size: 1em; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#datenschutz .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#datenschutz .flexbox {width: 100%; margin: 5px 0; background-color: #fff; padding: 5px; }
#datenschutz .flexelement {background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; }
#datenschutz .flexelement ul { width: 98%; height: auto; }
#datenschutz .flexelement ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#datenschutz .flexelement li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .5em -1.2em; font-size: 70%; }

/*Footer*/
footer { width: 100%; heigth: auto; margin: 0; text-align: center; color: #000; background-color: #fff; }
footer p { font-size: 0.625em; }

 /* Smartphone Hochformat (Landscape) */ 

@media only screen and (max-width: 792px) and (orientation: landscape) {
#startseite { margin: 0; padding: 0; background: url(../images/startk.jpg); background-position: 90% 20%; background-size: 40% auto; background-repeat: no-repeat; background-color: #9aa9c8; width: 100%; margin: 5px 0 0 0; }
#startseite #intro { width: 50%; heigth: 100%; margin: 0px 2% 2% 2%; padding: 100px 10px 150px 15px; }
#startseite #intro h1, h2, h3 { color: #fff; }
#startseite #intro h1 { text-align: left; font-size: 22px; font-weight: 900; }
#startseite #intro .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #fff; }
#startseite #intro h2 { text-align: left; font-size: 14px; line-height:normal; }}


/* ***************************************************************************************** */
/* Tablet Hochformat (Portrait) 1. und 2. Generation*/
/* ***************************************************************************************** */

@media only screen and (min-width: 46.875em) and (max-width: 63.9375em) {
/*startseite*/
#startseite { padding: 0; background: url(../images/startseite.jpg); background-position: 50% 40%; background-size: 60% auto; background-repeat: no-repeat; background-color: #9aa9c8; width: 100%; height: 100%; margin: 5px 0 0 0; }
#startseite #intro { width: 95%; heigth: 100%; margin: 0px 2% 2% 2%; padding: 700px 10px 0 15px; }
#startseite #intro h1, h2, h3 { color: #fff; }
#startseite #intro h1 { text-align: left; font-size: 28px; font-weight: 900; }
#startseite #intro .ud_h2_balken { margin: 0; height: 2px; width: 90px; background-color: #fff; }
#startseite #intro h2 { text-align: left; font-size: 1.375em; line-height:normal; }
/*leitmotiv*/
section#leitmotiv.page { width: 100%; height: 1024px; margin: 0px; padding:50px 5px 0 5px; }
#leitmotiv h1 { text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#leitmotiv .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#leitmotiv .hintergrund { margin: 50px 0 0 0; width:100%; height:auto; background-color: #e9e9e9; padding: 10px 0; }
#leitmotiv article.leitmotiv_motto_bg { height: 30%; width: 100%; background-image: url(../images/gandhi.jpg); background-position:50% 50%; background-repeat:no-repeat; background-size: cover; padding: 5px; text-align: left; }
#leitmotiv .leitmotiv_motto_bg p { font-family: 'ralewaylight_italic', Arial, cursive; font-size: 1.5em; color: #2b4c9a; font-weight: 900; width: 90%; height: auto; margin: 80px auto;}
#leitmotiv article.leitmotiv {padding: 0px 10px;}
#leitmotiv article.leitmotiv p { font-size: 1.0em; line-height: 2.0em; letter-spacing: 1px; }
/*Über mich*/
section#ueber.page { width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#ueber h1 {  text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#ueber .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#ueber h3 { width: 90%; margin:0; color:#2b4c9a; font-weight: bolder; text-align: left; font-size: 1em; padding: 10px 0px 0px 0px; }
#ueber .hintergrund { margin: 10px 0 0 0; width:100%; height:100%; background-color: #E9E9E9; padding: 10px 0px; }
#ueber .ueber_motto_bg { width:100%; text-align: center; }
#ueber .ueber_motto_bg .portrait { width: 35%; height: auto; margin: 1% 30% 2% 30%; }
#ueber article.ueber { width: 100%; text-align: left; background-color: #fff; height: 150%; padding: 10px; }
#ueber ul { width: 98%; height: auto; }
#ueber ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#ueber li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .5em -1.2em; font-size: 70%; }
/*verfahren */
section#verfahren.page { width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#verfahren h1 {  text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#verfahren .flexelement h3 {text-align: font-size: 16px; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#verfahren .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#verfahren.flexbox { width: 95%; margin: 2%; background-color: #fff; }
#verfahren.flexelement { background: #E9E9E9; color: #000; text-align: left; margin: 5px; padding: 5px; }
/*Kontakt */
section#kontakt.page { width: 100%; height: 1024px; margin: 0px; padding: 30px 5px 0px 5px; }
#kontakt h1 { text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#kontakt .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#kontakt .hintergrund { margin: 10px 0 0 0; width:100%; height: 100%; background-color: #E9E9E9; padding: 10px 0; }
#kontakt .kontakt_motto_bg { width:100%; text-align: center; }
#kontakt .kontakt_motto_bg .portrait { width: 30%; height: auto; margin: 0% 35%; }
#kontakt h3 {width: 100%; margin:0; color:#2b4c9a; font-weight: bolder; text-align: center; font-size: 1em; padding: 20px 0px 0px 0px; }
#kontakt article.kontakt { width: 100%; height: 100%; text-align: center; background-color: #fff; height: auto; }
#kontakt article.kontakt p { font-size: 1em; }
/*impressum*/
section#impressum.page {width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#impressum h1 {text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px;}
#impressum .flexelement h3 {text-align: font-size: 1em; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#impressum .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#impressum .flexbox { width: 100%; margin: 5px 0; background-color: #fff; padding: 5px;}
#impressum .flexelement { background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; }
/*Datenschutz*/
section#datenschutz.page {width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#datenschutz h1 { text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#datenschutz .flexelement h3 {text-align: font-size: 1em; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#datenschutz .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#datenschutz .flexbox {width: 100%; margin: 5px 0; background-color: #fff; padding: 5px; }
#datenschutz .flexelement {background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; }
#datenschutz .flexelement ul { width: 98%; height: auto; }
#datenschutz .flexelement ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#datenschutz .flexelement li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .5em -1.2em; font-size: 70%; }

/*Footer*/
footer { width: 100%; heigth: auto; margin: 0; text-align: center; color: #000; background-color: #fff; }
footer p { font-size: 0.75em; }
}

/* ***************************************************************************************** */
/* Tablet Querfomrat (Landscape) 1. und 2. Generation*/
/* ***************************************************************************************** */

@media only screen and (min-width: 63.9375em) and (max-width: 74.9375em) and (-webkit-min-device-pixel-ratio: 1){

/*startseite*/
#startseite { padding: 0; background: url(../images/startseite.jpg); background-position: 90% 50%; background-size: 40% auto; background-repeat: no-repeat; background-color: #9aa9c8; width: 100%; height: 100%; margin: 5px 0 0 0; }
#startseite #intro { width: 45%; height: 100%; margin: 100px 0px; padding: 250px 10px 0 50px; }
#startseite #intro h1 { text-align: left; font-size: 3.125em; font-weight: 900; color: #fff; }
#startseite #intro .ud_h2_balken { margin: 0; height: 10px; width: 90px; background-color: #fff; }
#startseite #intro h2 { text-align: left; font-size: 1.625em; line-height:normal; color: #fff;}

/*leitmotiv*/
section#leitmotiv.page { width: 100%; height: 100%; overlay-y: scroll; margin: 0px; padding:50px 5px 0 5px; }
#leitmotiv h1 { text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#leitmotiv .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#leitmotiv .hintergrund { margin: 50px 0 0 0; width:100%; height:auto; background-color: #e9e9e9; padding: 10px 0; }
#leitmotiv article.leitmotiv_motto_bg { height: 30%; width: 100%; background-image: url(../images/gandhi.jpg); background-position:50% 50%; background-repeat:no-repeat; background-size: cover; padding: 5px; text-align: left; }
#leitmotiv .leitmotiv_motto_bg p { font-family: 'ralewaylight_italic', Arial, cursive; font-size: 1.5em; color: #2b4c9a; font-weight: 900; width: 90%; height: auto; margin: 80px auto;}
#leitmotiv article.leitmotiv {padding: 0px 10px;}
#leitmotiv article.leitmotiv p { font-size: 1.0em; line-height: 1.75em; letter-spacing: 1px; }
/*Über mich*/
section#ueber.page { width: 100%; height: 100%; margin: 0px; padding: 30px 5px 0 5px; }
#ueber h1 { text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#ueber .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#ueber h3 { width: 90%; margin:0; color:#2b4c9a; font-weight: bolder; text-align: left; font-size: 1em; padding: 10px 0px 0px 0px; }
#ueber .hintergrund { margin: 10px 0 0 0; width:100%; height:50%; background-color: #E9E9E9; }
#ueber .ueber_motto_bg { width:100%; text-align: center; }
#ueber .ueber_motto_bg .portrait { width: 20%; height: auto; margin: auto auto; }
#ueber article.ueber { width: 100%; text-align: left; background-color: #fff; height: 100%; padding: 10px 10px 50px 10px; }
#ueber ul { width: 98%; height: auto; }
#ueber ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#ueber li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .5em -1.2em; font-size: 70%; }}

/*verfahren */
section#verfahren.page { width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#verfahren h1 { text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#verfahren .flexelement h3 {text-align: font-size: 16px; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#verfahren .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#verfahren.flexbox { width: 95%; margin: 2%; background-color: #fff; }
#verfahren.flexelement { background: #E9E9E9; color: #000; text-align: left; margin: 5px; padding: 5px; }
/*Kontakt */
section#kontakt.page { width: 100%; height: auto; margin: 0px; padding: 30px 5px 10px 5px; }
#kontakt h1 {text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#kontakt .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#kontakt .hintergrund { margin: 50px 0 0 0; width:100%; height:750px; background-color: #E9E9E9; padding: 10px 0; }
#kontakt .kontakt_motto_bg { width:100%; text-align: center; }
#kontakt .kontakt_motto_bg .portrait { width: 30%; height: auto; margin: 0% 35%; }
#kontakt h3 {width: 100%; margin:0; color:#2b4c9a; font-weight: bolder; text-align: center; font-size: 1em; padding: 20px 0px 0px 0px; }
#kontakt article.kontakt { width: 100%; height: 100%; text-align: center; background-color: #fff; height: auto%; }
#kontakt article.kontakt p { font-size: 1em; }
/*impressum*/
section#impressum.page {width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#impressum h1 {  text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#impressum .flexelement h3 {text-align: font-size: 1em; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#impressum .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#impressum .flexbox { width: 100%; margin: 5px 0; background-color: #fff; padding: 5px;}
#impressum .flexelement { background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; }
/*Datenschutz*/
section#datenschutz.page {width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#datenschutz h1 {text-align: left; font-size: 1.75em; font-weight: 900; color: #9cacd0; margin: 10px; }
#datenschutz .flexelement h3 {text-align: font-size: 1em; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#datenschutz .ud_h2_balken { margin: 0; height: 2px; width: 75px; background-color: #9cacd0; }
#datenschutz .flexbox {width: 100%; margin: 5px 0; background-color: #fff; padding: 5px; }
#datenschutz .flexelement {background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; }
#datenschutz .flexelement ul { width: 98%; height: auto; }
#datenschutz .flexelement ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#datenschutz .flexelement li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .5em -1.2em; font-size: 70%; }

/*Footer*/
footer { width: 100%; heigth: auto; margin: 0; text-align: center; color: #000; background-color: #fff; }
footer p { font-size: 0.75em; }





/* ***************************************************************************************** */
/* Ipad Pro  (Portrait) */
/* ***************************************************************************************** */

@media only screen 
  and (min-device-width: 64em) 
  and (max-device-width: 64em) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {

/*startseite*/
#startseite { padding: 0; background: url(../images/startseite.jpg); background-position: 50% 30%; background-size: 50% auto; background-repeat: no-repeat; background-color: #9aa9c8; width: 100%; height: 100%; margin: 5px 0 0 0; }
#startseite #intro { width: 100%; height: 100%; margin: 0px 0px; padding: 900px 150px 300px 150px; }
#startseite #intro h1 { text-align: left; font-size: 3.125em; font-weight: 900; color: #fff; }
#startseite #intro .ud_h2_balken { margin: 0; height: 10px; width: 90px; background-color: #fff; }
#startseite #intro h2 { text-align: left; font-size: 1.625em; line-height:normal; color: #fff;}
/*leitmotiv*/
section#leitmotiv.page { width: 100%; height: 1024px; margin: 0px; padding:50px 5px 0 5px; }
#leitmotiv h1 { text-align: left; font-size: 28px; font-weight: 900; color: #9cacd0; margin: 10px; }
#leitmotiv .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#leitmotiv .hintergrund { margin: 50px 0 0 0; width:100%; height:auto; background-color: #e9e9e9; padding: 10px 0; }
#leitmotiv article.leitmotiv_motto_bg { height: 100%; width: 100%; background-image: url(../images/gandhi.jpg); background-position:50% 50%; background-repeat:no-repeat; background-size: 100% auto; padding: 5px; text-align: left; }
#leitmotiv .leitmotiv_motto_bg p { font-family: 'ralewaylight_italic', Arial, cursive; font-size: 1.5em; color: #2b4c9a; font-weight: 900; width: 90%; height: auto; margin: 80px auto;}
#leitmotiv article.leitmotiv {padding: 0px 10px;}
#leitmotiv article.leitmotiv p { font-size: 1.0em; line-height: 2.0em; letter-spacing: 1px; }
/*Über mich*/
section#ueber.page { width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#ueber h1 { text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#ueber .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#ueber h3 { width: 90%; margin:0; color:#2b4c9a; font-weight: bolder; text-align: left; font-size: 1em; padding: 10px 0px 0px 0px; }
#ueber .hintergrund { margin: 10px 0 0 0; width:100%; height:100%; background-color: #E9E9E9; padding: 10px 0px; }
#ueber .ueber_motto_bg { width:100%; text-align: center; }
#ueber .ueber_motto_bg .portrait { margin: 1% 40% 2% 40%; }
#ueber article.ueber { width: 100%; text-align: left; background-color: #fff; height: 150%; padding: 10px; }
#ueber article.ueber p {font-size: 1em; line-height: normal;}
#ueber ul { width: 98%; height: auto; }
#ueber ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#ueber li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .2em -1.2em; font-size: 70%; }
/*verfahren */
section#verfahren.page { width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#verfahren h1 { text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#verfahren .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#verfahren .flexbox { width: 100%; margin: 2% 0; background-color: #E9E9E9; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
#verfahren .flexelement { background: #fff; color: #000; text-align: left; margin: 0.8% 0.8%; width: 48%; padding: 2px; }
#verfahren .flexelement h3 { font-size: 1.0em; color:#2b4c9a; font-weight: 900; text-transform:uppercase; }
div.ud_h3_balken { margin: 0; height: 5px; width: 35px; background-color: #9cacd0; }
#verfahren .flexelement p { font-size: 1.0em; line-height: normal; }
/*Kontakt */
section#kontakt.page { width: 100%; height: auto; margin: 0px; padding: 30px 5px 10px 5px; }
#kontakt h1 {text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#kontakt .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#kontakt .hintergrund { margin: 10px 0 0 0; width:100%; height:auto; background-color: #E9E9E9; padding: 10px 0; }
#kontakt .kontakt_motto_bg { width:100%; text-align: center; }
#kontakt .kontakt_motto_bg .portrait { width: 30%; height: auto; margin: 0% 35%; }
#kontakt h3 {width: 100%; margin:0; color:#2b4c9a; font-weight: bolder; text-align: center; font-size: 1em; padding: 20px 0px 0px 0px; }
#kontakt article.kontakt { width: 100%; height: 100%; text-align: center; background-color: #fff; height: auto%; }
#kontakt article.kontakt p { font-size: 1em; }
/*impressum*/
section#impressum.page {width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#impressum h1 {  text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#impressum .flexelement h3 {text-align: font-size: 1em; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#impressum .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#impressum .flexbox { width: 100%; margin: 5px 0; background-color: #fff; padding: 5px;}
#impressum .flexelement { background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; font-size: 1em; }
/*Datenschutz*/
section#datenschutz.page {width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#datenschutz h1 {text-align: left; font-size: 1.375em; font-weight: 900; color: #9cacd0; margin: 10px; }
#datenschutz .flexelement h3 {text-align: font-size: 1em; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#datenschutz .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#datenschutz .flexbox {width: 100%; margin: 5px 0; background-color: #fff; padding: 5px; }
#datenschutz .flexelement {background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; }
#datenschutz .flexelement ul { width: 98%; height: auto; }
#datenschutz .flexelement ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#datenschutz .flexelement li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .5em -1.2em; font-size: 70%; }

/*Footer*/
footer { width: 100%; heigth: auto; margin: 0; text-align: center; color: #000; background-color: #fff; }
footer p { font-size: 0.75em; }
}






/* ***************************************************************************************** */ 
/* Extra large devices (large laptops and desktops, 1200px and up) und einem Bildschirmverhältnis 16/9 */
/* ***************************************************************************************** */

@media screen and (min-device-width: 64.0625em) and (min-aspect-ratio: 16/9){
.page { width:100%; height:100%; overflow: hidden; float:left; }
.ud_h2_balken { margin:0 auto 10px auto; height:12px; width:120px; }
#startseite { padding: 0; background: url(../images/startseite.jpg); background-position: 80% 60%; background-size: 30%; background-repeat: no-repeat; background-color: #9aa9c8; width: 100%; height: 100%; 
margin: 5px 0 0 0; }
#startseite #intro { width: 50%; margin: 0px; height: 100%; padding: 100px 10px 10px 50px;}
#startseite #intro h1 { text-align: left; font-size: 5em; color: #fff;}
#startseite #intro .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #fff; }
#startseite #intro .startseite_intro { margin-left: 0px; width: 50%; }
#startseite #intro h2 { text-align: left; font-size: 1.875em; line-height:normal; color: #fff; }
/*leitmotiv*/
section#leitmotiv .page{ width: 100%; height: 100%; overflow-y:scroll; margin: 0; padding-top: 50px; }
#leitmotiv h1 { text-align: left; margin: 20px 0 30px 15px; font-size: 2.0em; color: #9cacd0; }
#leitmotiv .ud_h2_balken {  margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#leitmotiv h3 { width: 100%; margin: 50px 0 10px 20px; color:#2b4c9a; font-weight: 900; text-align: left; letter-spacing:3px; }
#leitmotiv .hintergrund { margin: 50px 0 0 0; width:100%; height:680px; background-color: #e9e9e9; padding: 50px; }
#leitmotiv article.leitmotiv_motto_bg { background-image: url(../images/gandhi.jpg); background-position:center center; background-repeat:no-repeat; background-size: cover; width: 35%;height: 400px; padding: 10px; text-align: center; float: left; margin: 0; }
#leitmotiv .leitmotiv_motto_bg p { font-family: 'ralewaylight_italic', Arial, cursive; font-size: 1.25em; color: #2b4c9a; font-weight: 900; text-align:center; padding: 100px; }
#leitmotiv article.leitmotiv { width: 45%; text-align: left; background-color: #fff; padding:20px; float: left; margin: 40px 5% 10% 15%; }
#leitmotiv article.leitmotiv p { font-size: 1em; line-height: 1.25em; letter-spacing:1px; }
/*Über mich*/ 
section#ueber .page{ width: 100%; height: 100%; overflow-y:scroll; margin: 0; padding-top: 50px; }
#ueber h1 { text-align: left; margin: 20px 0 30px 15px; font-size: 2.0em; color: #9cacd0; }
#ueber .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#ueber h3 { width: 95%; margin: 30px 0px 0px 0px; color:#2b4c9a; font-weight: 900; text-align: left; letter-spacing:3px; }
#ueber .hintergrund { margin: 50px 0 0 0; width:100%; height:700px; background-color: #E9E9E9; padding: 20px; }
#ueber .ueber_motto_bg { width:25%; float:left; margin: 20px 1% 0 2%; text-align: center; }
#ueber .ueber_motto_bg .portrait { width: 55%; height: auto; }
#ueber article.ueber { width: 70%; height: auto; text-align: left; background-color: #fff; padding:10px; float: left; margin: 10px 1% 0 1%; }
#ueber article.ueber p { font-size: 1.0em; line-height: 1.2; }
#ueber ul { width: 98%; height: auto; }
#ueber ul li { font-size: 1em; line-height: 1.2em; letter-spacing:1px; color: #333; list-style: none; }
#ueber li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: 0em -1.2em; font-size: 60%; }
/*Verfahren*/
section#verfahren .page { width: 90%; width: 100%; height: 100%; overflow-y:scroll; margin: 20px auto 0 auto; }
#verfahren h1 { text-align: left; margin: 20px 0 30px 15px; font-size: 2.0em; color: #9cacd0; }
#verfahren .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#verfahren .hintergrund { margin: 60px 0 0 0; width:100%; height:100%; background-color: #E9E9E9; }
#verfahren .flexbox { width: 100%; height: 720px; margin: 2% 0%; background-color: #E9E9E9; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
#verfahren .flexelement { background: #fff; color: #000; text-align: left; margin: 0.8% 0.8%; width: 48%; padding: 5px; }
#verfahren .flexelement h3 { font-size: 1.0em; color:#2b4c9a; font-weight: 900; text-transform:uppercase; }
div.ud_h3_balken { margin: 0; height: 5px; width: 75px; background-color: #9cacd0; }
#verfahren .flexelement p { font-size: 1.0em; line-height: normal; }
/*Kontakt*/ 
section#kontakt .page { width: 100%; height: 100%; overflow-y:scroll; margin: 0; padding-top: 50px; }
#kontakt h1 { text-align: left; margin: 20px 0 30px 15px; font-size: 2.0em; color: #9cacd0; }
#kontakt .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#kontakt .hintergrund { margin: 100px 0 0 0; width:100%; height:&00px; background-color: #E9E9E9; }
#kontakt .kontakt_motto_bg { width:30%; float:left; margin: 20px; text-align: center; }
#kontakt article.kontakt { width:30%; height: auto; float:left; margin: 20px 8% 0 3%; text-align: center; }
#kontakt article.kontakt h3 { font-size: 1.25em; color: #2b4c9a; line-height: 2.0em; letter-spacing:1px; }
#kontakt article.kontakt p { font-size: 1em; line-height: 1.5em; letter-spacing:1px; }

/*Impressum*/
section#impressum .impressum { width: 98%; height: 100%; overflow-y:scroll; margin: 20px auto 0 auto; }
#impressum h1 { text-align: left; margin: 20px 0 30px 15px; font-size: 2.0em; color: #9cacd0; }
#impressum .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#impressum .hintergrund { margin: 50px 0 0 0; width:100%; height:100%; background-color: #E9E9E9; }
#impressum .flexbox { width: 100%; margin: 5% 0; ; background-color: #E9E9E9; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
#impressum .flexelement { background: #fff; color: #000; text-align: left; margin: 1% 1%; width: 28%; padding: 5px; }
#impressum .flexelement h3 { color:#2b4c9a; font-weight: 900; text-transform:uppercase; }
#impressum .flexelement p { font-size: 1.0em; }
/*Datenschutz*/
section#datenschutz { width: 100%; height: 100%; overflow-y:scroll; margin: 0px; padding: 30px 5px 0 5px; }
#datenschutz h1 { text-align: left; margin: 20px 0 30px 15px; font-size: 2.0em; color: #9cacd0; }
#datenschutz .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#datenschutz .flexelement h3 {text-align: font-size: 1em; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#datenschutz .flexbox {width: 100%; margin: 5px 0; background-color: #fff; padding: 5px; }
#datenschutz .flexelement {background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; }
#datenschutz .flexelement ul { width: 98%; height: auto; }
#datenschutz .flexelement ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#datenschutz .flexelement li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .5em -1.2em; font-size: 70%; }

footer { width: 100%; height: auto; margin: 0; text-align: center; background-color: #fff; }
footer p { font-size: 0.75em; }
}


/* ***************************************************************************************** */ 
/* Extra large devices (large laptops and desktops, 1025px and up) */
/* ***************************************************************************************** */

@media screen and (min-device-width: 64.0625em)  not (min-aspect-ratio: 16/9){
.page { width:100%; height:100%; overflow: hidden; float:left; }
.ud_h2_balken { margin:0 auto 10px auto; height:12px; width:120px; }
#startseite { padding: 0; background: url(../images/startseite.jpg); background-position: 80% 60%; background-size: 30%; background-repeat: no-repeat; background-color: #9aa9c8; width: 100%; height: 100%; 
margin: 5px 0 0 0; }
#startseite #intro { width: 50%; margin: 0px; height: 100%; padding: 250px 10px 10px 50px;}
#startseite #intro h1 { text-align: left; font-size: 5em; color: #fff;}
#startseite #intro .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #fff; }
#startseite #intro .startseite_intro { margin-left: 0px; width: 50%; }
#startseite #intro h2 { text-align: left; font-size: 3.125em; line-height:normal; color: #fff; }
/*leitmotiv*/
section#leitmotiv.page{ margin: 0; padding-top: 50px;}
#leitmotiv h1 { text-align: left; margin: 50px 0 40px 15px; font-size: 3.125em; color: #9cacd0; }
#leitmotiv .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#leitmotiv h3 { width: 100%; margin: 50px 0 10px 20px; color:#2b4c9a; font-weight: 900; text-align: left; letter-spacing:3px; }
#leitmotiv .hintergrund { margin: 50px 0 0 0; width:100%; height:600px; background-color: #e9e9e9; padding: 50px; }
#leitmotiv article.leitmotiv_motto_bg { background-image: url(../images/gandhi.jpg); background-position:center center; background-repeat:no-repeat; background-size: cover; width: 40%; padding: 20px; text-align: center; float: left; margin: 0; }
#leitmotiv .leitmotiv_motto_bg p { font-family: 'ralewaylight_italic', Arial, cursive; font-size: 2.0em; color: #2b4c9a; font-weight: 900; }
#leitmotiv article.leitmotiv { width: 40%; text-align: left; background-color: #fff; padding:30px; float: left; margin: 10px 5% 0 10%; }
#leitmotiv article.leitmotiv p { font-size: 1em; line-height: 1.5em; letter-spacing:1px; }

/*Über mich*/ 
section#ueber.page { margin: 0; padding-top: 50px; }
#ueber h1 {  text-align: left; margin: 50px 0 40px 15px; font-size: 3.125em; color: #9cacd0; }
#ueber .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#ueber h3 { width: 95%; margin: 30px 0px; color:#2b4c9a; font-weight: 900; text-align: left; letter-spacing:3px; }
#ueber .hintergrund { margin: 50px 0 0 0; width:100%; height:600px; background-color: #E9E9E9; padding: 50px; }
#ueber .ueber_motto_bg { width:30%; float:left; margin: 10px 1% 0 10%; text-align: center; }
#ueber .ueber_motto_bg .portrait { width: 55%; height: auto; }
#ueber article.ueber { width:45%; height: 90%; text-align: left; background-color: #fff; padding:10px; float: left; margin: 10px 1% 0 1%; text-align: left; }
#ueber article.ueber p { font-size: 1em; line-height: 1.5em; letter-spacing:1px;  }
#ueber ul { width: 98%; height: auto; }
#ueber ul li { font-size: 1em; line-height: 1.5em; letter-spacing:1px; color: #333; list-style: none; }
#ueber li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: 0em -1.2em; font-size: 60%; }

/*Verfahren*/
section#verfahren .verfahren{ margin: 0; padding-top: 50px; }
#verfahren h1 { text-align: left; margin: 100px 0 40px 15px; font-size: 3.125em; color: #9cacd0; }
#verfahren .ud_h2_balken {margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#verfahren .hintergrund { margin: 50px 0 0 0; width:100%; height:50%; background-color: #E9E9E9; }
#verfahren .flexbox { width: 100%; margin: 5% 0; ; background-color: #E9E9E9; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
#verfahren .flexelement { background: #fff; color: #000; text-align: left; margin: 2% 1%; width: 22%; padding: 5px; }
#verfahren .flexelement h3 { color:#2b4c9a; font-weight: 900; text-transform:uppercase; }
div.ud_h3_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#verfahren .flexelement p { font-size: 1.0em; }
/*Kontakt */
section#kontakt.page { margin: 0; padding-top: 50px; }
#kontakt h1 { text-align: left; margin: 100px 0 40px 15px; font-size: 3.125em; color: #9cacd0; }
#kontakt .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#kontakt .hintergrund { margin: 50px 0 0 0; width:100%; height:500px; background-color: #E9E9E9; }
#kontakt .kontakt_motto_bg { width:35%; float:left; margin: 70px 0 0 5%; text-align: center; }
#kontakt article.kontakt { width:45%; height: auto; float:right; margin: 50px 10% 0 0; text-align: center; background-color: #fff; }
#kontakt article.kontakt h3 { font-size: 1.25em; color: #2b4c9a; line-height: 2.0em; letter-spacing:1px; }
#kontakt article.kontakt p { font-size: 1em; line-height: 1,5em; letter-spacing:1px; }
/*Impressum*/
section#impressum .impressum { width: 90%; margin: 20px auto 0 auto; }
#impressum h1 { text-align: left; margin: 100px 0 0px 15px; font-size: 3.125em; color: #9cacd0; }
#impressum .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#impressum .hintergrund { margin: 50px 0 0 0; width:100%; height:100%; background-color: #E9E9E9; }
#impressum .flexbox { width: 100%; margin: 5% 0; ; background-color: #E9E9E9; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
#impressum .flexelement { background: #fff; color: #000; text-align: left; margin: 1% 1%; width: 48%; padding: 5px; }
#impressum .flexelement h3 { font-size: 1.25em; color: #2b4c9a; line-height: 2.0em; letter-spacing:1px; }
#impressum .flexelement p { font-size: 1.0em; }
/*Datenschutz*/
section#datenschutz { width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#datenschutz h1 { text-align: left; font-size: 60px; font-weight: 900; color: #9cacd0; margin: 0px 15px 15px 15px; padding: 60px 0 0 0; }
#datenschutz .flexelement h3 {text-align: font-size: 16px; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#datenschutz .ud_h2_balken { margin: 0 0 20px 20px; background-color: #9cacd0; }
#datenschutz .flexbox {width: 100%; margin: 5px 0; background-color: #fff; padding: 5px; }
#datenschutz .flexelement {background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; }
#datenschutz .flexelement ul { width: 98%; height: auto; }
#datenschutz .flexelement ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#datenschutz .flexelement li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .5em -1.2em; font-size: 70%; }

footer { width: 100%; height: auto; margin: 0; text-align: center; background-color: #fff; }
footer p { font-size: 0.75em; }
}


/* ***************************************************************************************** */ 
/* Extra large devices (large laptops and desktops, 1025px and up) IPADS*/
/* ***************************************************************************************** */

/* min:768 max:1024*/
 

@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 1194px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	  
.page { width:100%; height:100%; overflow: hidden; float:left; }
.ud_h2_balken { margin:0 auto 10px auto; height:12px; width:120px; }
#startseite { padding: 0; background: url(../images/startseite.jpg); background-position: 80% 60%; background-size: 30%; background-repeat: no-repeat; background-color: #9aa9c8; width: 100%; height: 100%; 
margin: 5px 0 0 0; }
#startseite #intro { width: 50%; margin: 0px; height: 100%; padding: 250px 10px 10px 50px;}
#startseite #intro h1 { text-align: left; font-size: 5em; color: #fff;}
#startseite #intro .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #fff; }
#startseite #intro .startseite_intro { margin-left: 0px; width: 50%; }
#startseite #intro h2 { text-align: left; font-size: 3.125em; line-height:normal; color: #fff; }
/*leitmotiv*/
section#leitmotiv.page{ margin: 0; padding-top: 50px;}
#leitmotiv h1 { text-align: left; margin: 50px 0 40px 15px; font-size: 3.125em; color: #9cacd0; }
#leitmotiv .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#leitmotiv h3 { width: 100%; margin: 50px 0 10px 20px; color:#2b4c9a; font-weight: 900; text-align: left; letter-spacing:3px; }
#leitmotiv .hintergrund { margin: 50px 0 0 0; width:100%; height:600px; background-color: #e9e9e9; padding: 50px; }
#leitmotiv article.leitmotiv_motto_bg { background-image: url(../images/gandhi.jpg); background-position:center center; background-repeat:no-repeat; background-size: cover; width: 40%; padding: 20px; text-align: center; float: left; margin: 0; }
#leitmotiv .leitmotiv_motto_bg p { font-family: 'ralewaylight_italic', Arial, cursive; font-size: 2.0em; color: #2b4c9a; font-weight: 900; }
#leitmotiv article.leitmotiv { width: 40%; text-align: left; background-color: #fff; padding:30px; float: left; margin: 10px 5% 0 10%; }
#leitmotiv article.leitmotiv p { font-size: 1em; line-height: 1.5em; letter-spacing:1px; }

/*Über mich*/ 
section#ueber.page { margin: 0; padding-top: 50px; }
#ueber h1 {  text-align: left; margin: 50px 0 40px 15px; font-size: 3.125em; color: #9cacd0; }
#ueber .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#ueber h3 { width: 95%; margin: 30px 0px; color:#2b4c9a; font-weight: 900; text-align: left; letter-spacing:3px; }
#ueber .hintergrund { margin: 50px 0 0 0; width:100%; height:600px; background-color: #E9E9E9; padding: 50px; }
#ueber .ueber_motto_bg { width:30%; float:left; margin: 10px 1% 0 10%; text-align: center; }
#ueber .ueber_motto_bg .portrait { width: 55%; height: auto; }
#ueber article.ueber { width:45%; height: 90%; text-align: left; background-color: #fff; padding:10px; float: left; margin: 10px 1% 0 1%; text-align: left; }
#ueber article.ueber p { font-size: 1em; line-height: 1.5em; letter-spacing:1px;  }
#ueber ul { width: 98%; height: auto; }
#ueber ul li { font-size: 1em; line-height: 1.5em; letter-spacing:1px; color: #333; list-style: none; }
#ueber li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: 0em -1.2em; font-size: 60%; }

/*Verfahren*/
section#verfahren .verfahren{ margin: 0; padding-top: 50px; }
#verfahren h1 { text-align: left; margin: 100px 0 40px 15px; font-size: 3.125em; color: #9cacd0; }
#verfahren .ud_h2_balken {margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#verfahren .hintergrund { margin: 50px 0 0 0; width:100%; height:50%; background-color: #E9E9E9; }
#verfahren .flexbox { width: 100%; margin: 5% 0; ; background-color: #E9E9E9; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
#verfahren .flexelement { background: #fff; color: #000; text-align: left; margin: 2% 1%; width: 48%; padding: 5px; }
#verfahren .flexelement h3 { color:#2b4c9a; font-weight: 900; text-transform:uppercase; }
div.ud_h3_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#verfahren .flexelement p { font-size: 1.0em; }
/*Kontakt */
section#kontakt.page { margin: 0; padding-top: 50px; }
#kontakt h1 { text-align: left; margin: 100px 0 40px 15px; font-size: 3.125em; color: #9cacd0; }
#kontakt .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#kontakt .hintergrund { margin: 50px 0 0 0; width:100%; height:500px; background-color: #E9E9E9; }
#kontakt .kontakt_motto_bg { width:35%; float:left; margin: 70px 0 0 5%; text-align: center; }
#kontakt article.kontakt { width:45%; height: auto; float:right; margin: 50px 10% 0 0; text-align: center; background-color: #fff; }
#kontakt article.kontakt h3 { font-size: 1.25em; color: #2b4c9a; line-height: 2.0em; letter-spacing:1px; }
#kontakt article.kontakt p { font-size: 1em; line-height: 1,5em; letter-spacing:1px; }
/*Impressum*/
section#impressum .impressum { width: 90%; margin: 20px auto 0 auto; }
#impressum h1 { text-align: left; margin: 100px 0 0px 15px; font-size: 3.125em; color: #9cacd0; }
#impressum .ud_h2_balken { margin: 0; height: 10px; width: 75px; background-color: #9cacd0; }
#impressum .hintergrund { margin: 50px 0 0 0; width:100%; height:100%; background-color: #E9E9E9; }
#impressum .flexbox { width: 100%; margin: 5% 0; ; background-color: #E9E9E9; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
#impressum .flexelement { background: #fff; color: #000; text-align: left; margin: 1% 1%; width: 48%; padding: 5px; }
#impressum .flexelement h3 {font-size: 1.25em; color: #2b4c9a; line-height: 2.0em; letter-spacing:1px; }
#impressum .flexelement p { font-size: 1.0em; }
/*Datenschutz*/
section#datenschutz { width: 100%; height: auto; margin: 0px; padding: 30px 5px 0 5px; }
#datenschutz h1 { text-align: left; font-size: 60px; font-weight: 900; color: #9cacd0; margin: 0px 15px 15px 15px; padding: 60px 0 0 0; }
#datenschutz .flexelement h3 {text-align: font-size: 16px; color: #2b4c9a; font-weight: 800; text-transform:uppercase; }
#datenschutz .ud_h2_balken { margin: 0 0 20px 20px; background-color: #9cacd0; }
#datenschutz .flexbox {width: 100%; margin: 5px 0; background-color: #fff; padding: 5px; }
#datenschutz .flexelement {background: #E9E9E9; color: #000; text-align: left; margin: 2px; padding: 8px; }
#datenschutz .flexelement ul { width: 98%; height: auto; }
#datenschutz .flexelement ul li { font-size: 1em; line-height: normal; color: #333; list-style: none; }
#datenschutz .flexelement li:before { font-family: Arial, Verdana, sans-serif; content: '■'; color: #2b4c9a; float: left; width: 1em; margin: .5em -1.2em; font-size: 70%; }
footer { width: 100%; height: auto; margin: 0; text-align: center; background-color: #fff; }
footer p { font-size: 0.75em; }
}