body, html {
    background-color: #171615;
    max-width: 2000px;
}


.container {
    position: absolute;
    z-index:1; 
    margin-left: 15%; 
    margin-top: 10%; 
    border: 0px solid red;
    font-size: 150%;

    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
     
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;
}


.container:hover {
    -webkit-transform:rotate(5deg);
    -moz-transform:rotate(5deg); 
    -o-transform:rotate(5deg);
}


.rahmen {
    display: block;
    width: 100%;
}


.leinwand {
    border: 0px solid green;
    position: absolute;
    font-size: 120%;
    margin: 0px auto;
    display: block;  
}


.red {
    color: red;
    padding-right: 10px;
}


.grey {
    color: grey;
    padding-right: 10px;
}


.imprint {
    font-size: 130%; 
    position: absolute; 
    left: 92%; 
    top: 94%;     
    -moz-transform:rotate(25deg);
    -webkit-transform:rotate(25deg);
    -o-transform:rotate(25deg); 
    -ms-transform:rotate(25deg);
    transform:rotate(25deg); 
    
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
     
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;
    color: #FFF;
}

.imprint:hover {
    -webkit-transform:rotate(0deg);
    -moz-transform:rotate(0deg); 
    -o-transform:rotate(0deg);
}

.imprint a {
    color: #FFF;
}
 

/* SPLASHSCREEN */
/* ---------------------------------------------------------------- */


.splash-logo {
    margin-left: 9%;
    margin-top: 10%;
    width: 23%;
}


.intro {
    margin-left: 66%;
    margin-top: 10%;
    width: 23%;
    font-size: 135%;
}


.titel {
    position: absolute; 
    color: white; 
    width: 70%;
    font-size: 150%; 
    margin-left: 15%; 
    margin-top: 22%;
    border: 0px solid green;
    text-align: center;
}

/* ---------------------------------------------------------------- */


/* BEFASST */
/* ---------------------------------------------------------------- */

.befasst-container {
    margin-left: 29.4%;
}


.befasst {
    position: absolute;
    width: 100%;
}


.befasst td {
    padding-top: 5%;
}


.spacer-top-befasst {
    height: 70px;
}


.spacer-left-befasst {
    width: 15%;  
}


.spacer-right-befasst {
    width: 15%;  
}

/* ---------------------------------------------------------------- */


/* BETREUT */
/* ---------------------------------------------------------------- */


.betreut {
    position: absolute;
    width: 100%;
    color: white;
}

.betreut-container {
    margin-left: 49.5%;
    
    
}


.betreut td {
    padding-top: 5%;
}


.spacer-top-betreut {
    height: 55px;
}


.spacer-left-betreut {
    width: 25%;  
}


.spacer-right-betreut {
    width: 15%;  
}


.referenzen {
    position: absolute;
    width: 100%;
    color: white;
}


.referenzen-container {
    margin-left: 25%;
    margin-top: 32%;
    width: 20%; 
}


.spacer-top-referenzen {
    height: 100px;
}


.spacer-left-referenzen {
    width: 19%;  
}


.spacer-right-referenzen {
    width: 15%;  
}



/* ---------------------------------------------------------------- */


/* TRITT EIN */
/* ---------------------------------------------------------------- */

.trittein {
    position: absolute;
    width: 100%;
    color: white;
}

.trittein-container {
    margin-left: 63.8%;   
}


.trittein td {
    padding-top: 5%;
}


.spacer-top-trittein {
    height: 65px;
}


.spacer-left-trittein {
    width: 23%;  
}


.spacer-right-trittein {
    width: 15%;  
}

/* ---------------------------------------------------------------- */













/* IMPRESSUM */
/* ---------------------------------------------------------------- */

.impressum {
    position: absolute;
    width: 100%;
    color: white;
    font-size: 80%;
}

.impressum-container {
    margin-left: 30%;
    width: 55%;
}


.impressum td {
    padding-top: 4.2%;
}


.spacer-top-impressum {
    height: 15px;
}


.spacer-left-impressum {
    width: 11%;  
}


.spacer-right-impressum {
    width: 10%;  
}

/* ---------------------------------------------------------------- */



/* NACHFRAGEN */
/* ---------------------------------------------------------------- */


.nachfragen {
    position: absolute;
    width: 100%;
    color: white;
}

.nachfragen-container {
    margin-left: 45%;  
}

.nachfragen td {
    padding-top: 5%;
}

.spacer-top-nachfragen {
    height: 28px;
}

.spacer-left-nachfragen {
    width: 15%;  
}

.spacer-right-nachfragen {
    width: 15%;  
}


/* ---------------------------------------------------------------- */




/* FOTO */
/* ---------------------------------------------------------------- */

.foto-container {
    margin-left: 22%;
    margin-top: 10%;
}

.christine {
    width: 60%;
}


/* ---------------------------------------------------------------- */








     
@media screen and (max-width: 436px) {
    
}

@media all {
  /**
   *  @section Normalisation Module
   */
  /* (en) Global reset of paddings and margins for all HTML elements */
  /* (de) Globales Zurücksetzen der Innen- und Außenabstände für alle HTML-Elemente */
  * {
    margin: 0;
    padding: 0;
  }

  /* (en) Correction: margin/padding reset caused too small select boxes. */
  /* (de) Korrektur: Das Zurücksetzen der Abstände verursacht zu kleine Selectboxen. */
  option {
    padding-left: 0.4em;
  }

  select {
    padding: 1px;
  }

  /*
  * (en) Global fix of the Italics bugs in IE 5.x and IE 6
  * (de) Globale Korrektur des Italics Bugs des IE 5.x und IE 6
  *
  * @bugfix
  * @affected   IE 5.x/Win, IE6
  * @css-for    IE 5.x/Win, IE6
  * @valid      yes
  */
  * html body * {
    overflow: visible;
  }

  /*
  * (en) Fix for rounding errors when scaling font sizes in older versions of Opera browser
  *      Standard values for colors and text alignment
  *
  * (de) Beseitigung von Rundungsfehler beim Skalieren von Schriftgrößen in älteren Opera Versionen
  *      Vorgabe der Standardfarben und Textausrichtung
  */
  body {
    font-size: 100%;
    background: #000;
    color: #000;
    text-align: left;
  }

  /* (en) avoid visible outlines on DIV and h[x] elements in Webkit browsers */
  /* (de) Vermeidung sichtbarer Outline-Rahmen in Webkit-Browsern */
  div:target,
  h1:target,
  h2:target,
  h3:target,
  h4:target,
  h5:target,
  h6:target {
    outline: 0 none;
  }

  /* (en) HTML5 - adjusting visual formatting model to block level */
  /* (de) HTML5 - Elements werden als Blockelemente definiert */
  article,
  aside,
  details,
  figcaption,
  figure,
  footer,
  header,
  main,
  nav,
  section,
  summary {
    display: block;
  }

  /* (en) HTML5 - default media element styles */
  /* (de) HTML5 - Standard Eigenschaften für Media-Elemente */
  audio,
  canvas,
  video {
    display: inline-block;
  }

  /* (en) HTML5 - don't show <audio> element if there aren't controls */
  /* (de) HTML5 - <audio> ohne Kontrollelemente sollten nicht angezeigt werden */

  /* (en) HTML5 - add missing styling in IE & old FF for hidden attribute */
  /* (de) HTML5 - Eigenschaften für das hidden-Attribut in älteren IEs und FF nachrüsten */

  /* (en) Prevent iOS text size adjust after orientation change, without disabling user zoom. */
  /* (de) Verdindert die automatische Textanpassung bei Orientierungswechsel, ohne Zoom zu blockieren */
  html {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
  }

  /* (en) set correct box-modell in IE8/9 plus remove padding */
  /* (de) Setze das richtige Box-Modell im IE8/9 und entferne unnötiges Padding */

  /* (en) force consistant appearance of input[type="search"] elements in all browser */
  /* (de) Einheitliches Erscheinungsbild für input[type="search"] Elemente erzwingen */

  input[type="search"]::-webkit-search-cancel-button,
  input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }

  /* (en) Correct overflow displayed oddly in IE 9 */
  /* (de) Korrigiert fehlerhafte overflow Voreinstellung des IE 9 */

  /* (en) Address margin not present in IE 8/9 and Safari 5 */
  /* (en) Ergänzt fehlenden Margin in IE 8/9 und Safari 5 */
  figure {
    margin: 0;
  }

  /* (en) Clear borders for <fieldset> and <img> elements */
  /* (de) Rahmen für <fieldset> und <img> Elemente löschen */
  fieldset,
  img {
    border: 0 solid;
  }

  /* (en) new standard values for lists, blockquote, cite and tables */
  /* (de) Neue Standardwerte für Listen, Zitate und Tabellen */
  ul,
  ol,
  dl {
    margin: 0 0 1em 1em;
  }

  li {
    line-height: 1.5em;
    margin-left: 0.8em;
  }

  dt {
    font-weight: bold;
  }

  dd {
    margin: 0 0 1em 0.8em;
  }

  blockquote {
    margin: 0 0 1em 0.8em;
  }

  q {
    quotes: none;
  }

  blockquote:before,
  blockquote:after,
  q:before,
  q:after {
    content: '';
    content: none;
  }


  /**
  * @section Float Handling Module
  */
  /* (en) clearfix method for clearing floats */
  /* (de) Clearfix-Methode zum Clearen der Float-Umgebungen */
  .ym-clearfix:before {
    content: "";
    display: table;
  }

  .ym-clearfix:after {
    clear: both;
    content: ".";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
  }

  .ym-skip {
    position: absolute;
    top: -32768px;
    left: -32768px;
  }

  /* (en) make skip links visible when using tab navigation */
  /* (de) Skip-Links für Tab-Navigation sichtbar schalten */
  .ym-skip:focus,
  .ym-skip:active {
    position: static;
    top: 0;
    left: 0;
  }

  /* skiplinks:technical setup */
  .ym-skiplinks {
    position: absolute;
    top: 0px;
    left: -32768px;
    z-index: 1000;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style-type: none;
  }
  .ym-skiplinks .ym-skip:focus,
  .ym-skiplinks .ym-skip:active {
    left: 32768px;
    outline: 0 none;
    position: absolute;
    width: 100%;
  }
}
@media print {
  /**
  * @section print adjustments for core modules
  *
  * (en) float containment for grids. Uses display:table to avoid bugs in FF & IE
  * (de) Floats in Grids einschließen. Verwendet display:table, um Darstellungsprobleme im FF & IE zu vermeiden
  *
  * @bugfix
  * @since     3.0
  * @affected  FF2.0, FF3.0, IE7
  * @css-for   all browsers
  * @valid     yes
  */

  /* (en) make .ym-print class visible */
  /* (de) .ym-print-Klasse sichtbar schalten */

  /* (en) generic class to hide elements for print */
  /* (de) Allgemeine CSS Klasse, um beliebige Elemente in der Druckausgabe auszublenden */
}
@media all {
  /* 4 navigation levels defined */

  /* title */
}
@media all {

  .ym-hlist ul {
    margin: 0;
    padding: 0.5em 1.5em;
    display: inline;
    float: left;
  }
    
  .ym-hlist ul li {
    display: inline;
    float: left;
    font-size: 1.0em;
    line-height: 1;
    list-style-type: none;
    margin: 0 .25em 0 0;
    padding-left: 8%;
  }
    
  .ym-hlist ul li a {
    background: transparent;
    color: #fff;
    display: block;
    font-size: 1.1em;
    line-height: 2em;
    padding:0 0.5em;
      margin-top: 30px;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
    width: auto;
        border: 0px solid green;
  }
    
  .ym-hlist ul li a:hover {
    color: #ccc;
    background: none;
    border-radius: 0.2em;
    text-decoration: none;
    outline: 0 none;
  }
    
  .ym-hlist ul li a:focus,
  .ym-hlist ul li a:active {
    color: white;
    background: none;
    border-radius: 0.2em;
    text-decoration: none;
    outline: 0 none;
  }  
    
  .ym-hlist ul li.active {
    background: none;
    border-radius: 0.2em;
    color: white;
  }
    
  .ym-hlist ul li.active a:focus,
  .ym-hlist ul li.active a:hover,
  .ym-hlist ul li.active a:active {
    background: transparent;
    color: red;
    text-decoration: none;
  }

}

/* Make tabs printable */


@media all {

  html * {
    font-size: 100%;
  }

  /**
  * (en) reset monospaced elements to font size 16px in all browsers
  * (de) Schriftgröße von monospaced Elemente in allen Browsern auf 16 Pixel setzen
  *
  * @see: http://webkit.org/blog/67/strange-medium/
  */
  textarea,
  pre,
  code,
  kbd,
  samp,
  var,
  tt {

  }

  /* font-size: 14px; */
  body {
    font-family: monaco;
    font-size: 87.5%;
    color: #444444;
  }

  /*--- Headings | Überschriften ------------------------------------------------------------------------*/
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-weight: 400;
    color: #161e21;
    margin: 0;
  }

  h1 {
    /* font-size: 48px; */
    font-size: 342.85714%;
    line-height: 0.875;
    margin: 0 0 0.4375em 0;
  }

  h2 {
    /* font-size: 32px; */
    font-size: 228.57143%;
    line-height: 1.3125;
    margin: 0 0 0.65625em 0;
  }

  h3 {
    /* font-size: 24px; */
    font-size: 171.42857%;
    line-height: 0.875;
    margin: 0 0 0.875em 0;
  }

  h4 {
    /* font-size: 21px; */
    font-size: 150%;
    line-height: 1;
    margin: 0 0 1em 0;
  }

  h5 {
    /* font-size: 18px; */
    font-size: 128.57143%;
    line-height: 1.16667;
    margin: 0 0 1.16667em 0;
  }

  h6 {
    /* font-size: 14px; */
    font-size: 100%;
    font-weight: bold;
    line-height: 1.5;
    margin: 0 0 1.5em 0;
  }

  /* --- Lists | Listen  -------------------------------------------------------------------------------- */
  ul,
  ol,
  dl {
    font-size: 100%;
    line-height: 1.5;
    margin: 0 0 1.5em 0;
  }

  ul {
    list-style-type: disc;
  }

  ol {
    list-style-type: decimal;
  }

  li {
    font-size: 100%;
    line-height: 1.5;
    margin-left: 1.2em;
  }

  dt {
    font-weight: bold;
  }

  dd {
    margin: 0 0 1.5em 0.8em;
  }

  /* --- general text formatting | Allgemeine Textauszeichnung ------------------------------------------ */
  p {
    font-size: 100%;
    line-height: 1.5;
    margin: 0 0 1.5em 0;
  }

  blockquote,
  cite,
  q {
    font-style: italic;
  }

  blockquote {
    background: transparent;
    color: #666666;
    margin: 1.5em 0 0 1.5em;
  }

  strong,
  b {
    font-weight: bold;
  }

  em,
  i {
    font-style: italic;
  }

  big {
    /* font-size: 16px; */
    font-size: 114.28571%;
    line-height: 1.3125;
  }

  small {
    /* font-size: 12px; */
    font-size: 85.71429%;
    line-height: 1.75;
  }

  pre,
  code,
  kbd,
  tt,
  samp,
  var {
    font-size: 100%;
  }

  pre {
    font-size: 100%;
    line-height: 1.5;
    margin: 0 0 1.5em 0;
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
  }

  pre,
  code {
    color: #880000;
  }

  kbd,
  samp,
  var,
  tt {
    color: #666666;
    font-weight: bold;
  }

  var,
  dfn {
    font-style: italic;
  }

  acronym,
  abbr {
    border-bottom: 1px #aaa dotted;
    font-variant: small-caps;
    letter-spacing: .07em;
    cursor: help;
  }

  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }

  sup {
    top: -0.5em;
  }

  sub {
    bottom: -0.25em;
  }

  mark {
    background: yellow;
    color: black;
  }

  hr {
    color: #fff;
    background: transparent;
    margin: 0 0 0.75em 0;
    padding: 0 0 0.67857em 0;
    border: 0;
    border-bottom: 1px #eeeeee solid;
  }

  /*--- Links ----------------------------------------------------------------------------------------- */
  a {
    color: #ee7000;
    background: transparent;
    text-decoration: none;
  }

  a:active {
    outline: none;
  }

  /* (en) maximum constrast for tab focus - change with great care */
  /* (en) Maximaler Kontrast für Tab Focus - Ändern Sie diese Regel mit Bedacht */
  a:hover,
  a:focus {
    background-color: none;
    color: red;
    text-decoration: none;
  }

  /* --- images ------------------ */
    
    
  img,
  figure {
    margin: 0;
  }

  .flexible {
    margin-bottom: 0em;
    max-width: 100%;
    height: auto;

  }

  /* IE6 workaround - 2% space for possible borders */
  * html .flexible {
    width: 98%;
  }


  caption {
    font-variant: small-caps;
  }


}

/* Screen Design */
@media screen {
  /**
  * (en) Forcing vertical scrollbars in IE8, Firefox, Webkit & Opera
  * (de) Erzwingen vertikaler Scrollbalken in IE8, Firefox, Webkit & Opera
  *
  * @workaround
  * @affected IE8, FF, Webkit, Opera
  * @css-for all
  * @valid CSS3
  */

  body {
    overflow-y: scroll;
  }

  /*------------------------------------------------------------------------------------------------------*/
  /* (en) Marginal areas & page background */
  /* (de) Randbereiche & Seitenhintergrund */
  body {
    backgfround: #A6A6A6;
  }

  body > header,
  body > nav,
  body > [id] {
    min-width: 960px;
  }


  * html .ym-wrapper {
    width: 1140px;
    /* IE6 support */
  }

  .ym-wrapper {
    text-align: left;
    margin: 0 auto;
    mafx-width: 85em;
  }

  .ym-wbox {
    padding: 0px 0px;
    position: relative;
  }

  .fix {
    position: fixed;
    top: 0;
    z-index: 10000;
    width: 100%;
    -webkit-box-shadow: 0 0 12px 6px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 12px 6px rgba(0, 0, 0, 0.5);
  }

  /* (en) Layout:width, background, borders */
  /* (de) Layout:Breite, Hintergrund, Rahmen */
  header,
  nav,
  #main,
  footer {
    background: #fff repeat-x top left;
    color: #333;
    clear: both;
  }

  header {
    color: #fff;
	margin-bottom: 0;
  }


  header .ym-wrapper {
    text-align: center;
  }

  header .ym-wbox {
    padding-bottom: 0;
  }

  nav {
    background: #393938;
	padding: .5em 0;
    letter-spacing: 1px;
    height: 100px;
  }


  nav .ym-hlist {
    background: transparent;
    padding: 0;
  }

  nav .ym-hlist ul {
    padding: 2em 0;
	float: right;
      border: 0px solid blue;
      height: 50px;
  }
  
  nav .ym-hlist li.active a {
    background: none;
    color: red;
  }
 
  nav .ym-hlist li a:hover {
	background: none;
	color: red;  
  }

  #main {
    z-index: 1;
    background: #fff;
  }

  footer {
    border-top: 2px #000 solid;
  }

  .flexible {
    margin-bottom: 0em;
  }

  /*--- TYPOGRAPHY -----------------------------------------------------*/
  h2 {
    letter-spacing: -2px;
  }

  h3 {
    letter-spacing: -1px;
  }

  h5, h6 {
    color: #8B8F90;
  }

  /**
  * -------------------------------------------------------------------------- #
  *
  * Sections and Styles
  */

  .logo {
	  margin-top: 12px;
  }
  
  figcaption {
	  font-size: 0.9em;
	  color: #939393;
	  font-style:italic;
	  padding-top: 0.5em;
  }
	  
  /* Sectionheader */
  .sectionheadBlock {
	width: 100%;
	float: left;
	position: relative;
	clear:both;
    background-color: #000;
  }

  .sectionheadImg {
	width: 100%;
	float: left;
	background-position: bottom bottom;
	background-repeat: no-repeat;
	position: relative;
  }

}

@media screen and (min-width: 0px) {
  body > header,
  body > nav,
  body > [id] {
    min-width: 0;
  }

  .ym-wrapper {
    width: auto;
  }

}


@media screen and (max-width: 1500px) {
      
    .spacer-top-referenzen {
        height: 85px;
    }
    
    .spacer-left-referenzen {
        width: 17%;
    }
    
    .impressum-container {
        font-size: 140%;
    }
}


@media screen and (max-width: 1400px) {
      
    .titel {
        font-size: 120%;
        margin-top: 25%;
    } 
    
    .ym-hlist ul li {
        font-size: 90%;
    }
    
    .ym-hlist ul li a {
        margin-top: 32px;
    }
    
    .spacer-left-referenzen {
        width: 16%;
    }
    
    .trittein-container {
        margin-left: 60%;   
    }
    
    .impressum-container {
        font-size: 130%;
    }
}


@media screen and (max-width: 1300px) {
      
    .titel {
        font-size: 100%;
    }
    
    .ym-hlist ul li {
        font-size: 85%;
        padding-left: 7%;
    }
    
    .ym-hlist ul li a {
        margin-top: 33px;
    }
    
    .spacer-top-referenzen {
        height: 75px;
    }
    
    .spacer-left-referenzen {
        width: 15%;
    }
    
    .trittein-container {
        margin-left: 55%;   
    }
    
    .impressum-container {
        font-size: 120%;
    }
    
    .imprint {
        left: 90%;
        top: 92%;
    }
}



@media screen and (max-width: 1220px) {
    
    .referenzen-container {
        font-size: 120%;
    }
    
    .spacer-top-referenzen {
        height: 72px;
    }
    
    .spacer-left-referenzen {
        width: 16%;
    }
    
    .trittein-container {
        margin-left: 51%;   
    }
    
    .foto-container {
        margin-left: 18%;
    }
}



@media screen and (max-width: 1150px) {
      
    .ym-hlist ul li {
        font-size: 85%;
        padding-left: 5.5%;
    }
    
    .spacer-top-referenzen {
        height: 70px;
    }
    
    .spacer-left-referenzen {
        width: 15%;
    } 
    
    .trittein-container {
        margin-left: 47%;   
    }
    
    .impressum-container {
        font-size: 108%;
    }
    
    .imprint {
        left: 88%;
    }
}


@media screen and (max-width: 1050px) {
      
    .titel {
        font-size: 80%;
    } 
    
    .ym-hlist ul li:first-child {
        padding-left: 1%;
    }
    
    .ym-hlist ul li {
        font-size: 85%;
        padding-left: 4%;
    }
      
    .befasst-container {
        margin-left: 25%;
    }  
    
    .referenzen-container {
        margin-left: 12%;
    }  
    
    .spacer-top-referenzen {
        height: 60px;
    }
    
    .spacer-left-referenzen {
        width: 14%;
    } 
    
    .betreut-container {
        margin-left: 40%;
    }
    
    .trittein-container {
        margin-left: 42%;   
    }
    
    .impressum-container {
        font-size: 90%;
    }
    
    .foto-container {
        margin-left: 13%;
    }
}


@media screen and (max-width: 980px) {
    
    .ym-hlist ul li {
        font-size: 85%;
        padding-left: 5%;
    }
    
    .ym-hlist ul li:first-child {
        padding-left: 5%;
    }
    
     nav .ym-hlist ul {
         float: left;
         width: 90% !important;
         margin-left: 5.5%;
      }
    
    .logo {
        display: none;
    }
    
    .befasst-container {
        margin-left: 20%;
    }
    
    .container {
        -webkit-transition-duration: 0s;
        -moz-transition-duration: 0s;
        -o-transition-duration: 0s;
        transition-duration: 0s;
    }
    
    .container:hover {
        -webkit-transform:rotate(0deg);
        -moz-transform:rotate(0deg); 
        -o-transform:rotate(0deg);
    }
    
    .referenzen-container {
        font-size: 95%;
    }  
    
    .spacer-top-referenzen {
        height: 60px;
    }
    
    .spacer-left-referenzen {
        width: 14%;
    }  
    
    .impressum {
        background-color: rgba(147, 147, 147, 0.9);
        padding-bottom: 10px;
    }
    
    .impressum-rahmen {
        display: none;
    }
    
    .impressum-container {
        width: 90%;
        margin-left: 5%;
        margin-top: 1%;
    }
    
    .spacer-top-impressum {
        height: 0px;
        display: none;
    }
    
    .spacer-left-impressum {
        width: 1%;
    }
    
    .spacer-right-impressum {
        width: 1%;
    }
    
    .foto-container {
        margin-left: 11%;
    }
    
    .nachfragen-container {
        margin-left: 40%;
    }
    
    .imprint {
        top: 90%;
        left: 87%;
    }
}


@media screen and (max-width: 890px) {
    
    .ym-hlist ul li {
        padding-left: 3%;
    }

    .betreut-container {
        margin-left: 20%;
    }
    
    .spacer-top-referenzen {
        height: 0px;
    } 
    
    .ref {
        display: none;
    }
    
    .ref-pfeil {
        display: none;
    }

    .referenzen-container {
        background-color: red; 
        width: 30%;
        height: 40px;
        margin-left: 35%;
        margin-top: 60%;
    }
    
    .spacer-left-referenzen {
        width: 0px;
    }
    
    .spacer-right-referenzen {
        width: 0px;
    }
    
    .referenzen {
        text-align: center;
    }
    
    .foto-container {
        margin-left: 5%;
    }
    
    .imprint {
        top: 89%;
        left: 86%;
    }
}


@media screen and (max-width: 850px) {
    
    .titel {
        margin-top: 26%;
        font-size: 60%;
    }
    
    .befasst-container, .betreut-container, .trittein-container  {
        margin-left: 20%;
        margin-top: 3%;
    }
    
     .nachfragen-container  {
        margin-top: 3%;
    }
        
    .referenzen-container {
        margin-top: 55%;
    }
}


@media screen and (max-width: 820px) {
    
    .ym-hlist ul li {
        padding-left: 2%;
    }
    
    .ym-hlist ul li:first-child {
        padding-left: 2%;
    }
}


@media screen and (max-width: 755px) {
    
    .imprint {
        display: none;
    }
       
    .befasst-container, .betreut-container, .trittein-container  {
        width: 50%;
        margin-left: 25%;
        font-size: 110%;
    }
    
    .spacer-top-befasst {
        height: 42px;
    }
    
    .spacer-left-befasst {
        width: 18%;
    }
    
    .spacer-right-befasst {
        width: 10%;
    }   
    
    .spacer-top-betreut {
        height: 38px;
    }
    
    .referenzen-container {
        margin-top: 47%;
    }
    
    .spacer-top-trittein {
        height: 45px;
    }
    
    .nach {
        display: none;
    }
    
    .nachfragen-container {
        margin-top: 14%;
        margin-left: 49%;
        font-size: 90%;
        width: 46%;
    }
    
    .nachfragen {
        background-color: rgba(147, 147, 147, 0.9);
        padding-top: 10px;
        padding-bottom: 10px;
    }
    
    .spacer-top-nachfragen {
        display: none;
    }

}


@media screen and (max-width: 650px) {
      
    .titel {
        font-size: 50%;
    }
    
    .spacer-top-befasst {
        height: 35px;
    }
    
    .spacer-left-befasst {
        width: 17%;
    }
    
    .spacer-top-betreut {
        height: 33px;
    }
    
    .spacer-left-betreut, .spacer-left-trittein {
        width: 18%;
    }
    
    .spacer-top-trittein {
        height: 40px;
    }
    
    .foto-container {
        margin-top: 10%;
    }
    
    .christine {
        width: 45%;
    }
    
    .nachfragen-container {
        margin-top: 10%;
        margin-left: 37%;
        font-size: 100%;
        width: 60%;
    }
}


@media screen and (max-width: 590px) {
 
    .spacer-top-befasst {
        height: 30px;
    }
    
    .spacer-top-betreut {
        height: 22px;
    }
    
    .spacer-top-trittein {
        height: 25px;
    }
    
    .spacer-left-trittein {
        width: 16%;
    }
    
    .nachfragen-container {
        margin-left: 51%;
    }
    
    .foto-container {
        margin-top: 10%;
        margin-left: 3%;
    }
    
    .christine {
        width: 40%;
    }
    
    .nachfragen-container {
        margin-top: 10%;
        margin-left: 37%;
    }
} 


@media screen and (max-width: 560px) {
 
    .titel {
        font-size: 40%;
    }
    
    .befasst-container {
        font-size: 90%;
    }
    
    .spacer-top-befasst {
        height: 30px;
    }
    
    .betreut-container {
        font-size: 90%;
    }
    
    .trittein-container {
        font-size: 92%;
    }
    
    .spacer-top-trittein {
        height: 20px;
    }
    
    .spacer-left-trittein {
        width: 15%;
    }
    
    .foto-container {
        margin-top: 11%;
    }
    
    .christine {
        width: 40%;
    }
    
    .nachfragen-container {
        margin-left: 36%;
    }
} 


@media screen and (max-width: 500px) {
  
    .spacer-top-befasst {
        height: 25px;
    } 
    
    .befasst-container {
        font-size: 85%;
    }
    
    .spacer-left-befasst {
        width: 16%;
    }
    
    .spacer-top-betreut {
        height: 12px;
    }
    
    .betreut-container {
        font-size: 85%;
    }
    
    .trittein-container {
        font-size: 85%;
    }
    
    .foto-container {
        margin-top: 12.5%;
    }
    
    .christine {
        width: 35%;
    }
    
    .nachfragen-container {
        margin-left: 36%;
    }
} 



@media screen and (max-width: 450px) {
  
    .titel {
        font-size: 30%;
        margin-top: 28%;
    } 
    
    .befasst-container {
        font-size: 80%;
    }
    
    .spacer-top-befasst {
        height: 20px;
    } 
    
    .spacer-top-betreut {
        height: 9px;
    }
    
    .spacer-left-betreut {
        width: 17%;
    }
    
    .trittein-container {
        font-size: 80%;
    }
    
    .foto-container {
        margin-top: 12.5%;
        margin-left: 1.3%;
    }
    
    .christine {
        width: 35%;
    }
    
    .nachfragen-container {
        margin-left: 36.5%;
    }
} 


@media screen and (max-width: 430px) {
  
    .titel {
        font-size: 30%;
        margin-top: 28%;
    } 
    
    .befasst-container {
        font-size: 75%;
    }
    
    .spacer-top-befasst {
        height: 15px;
    } 
    
    .spacer-left-befasst {
        width: 15%;
    }
    
    .trittein-container {
        font-size: 75%;
    }
    
    .spacer-top-trittein {
        height: 17px;
    }
    
    .nachfragen-container {
        margin-left: 37%;
    }
} 


@media screen and (max-width: 400px) {
    
    .titel {
        margin-top: 23%;
    }
    
    .befasst-container, .betreut-container, .trittein-container {
        font-size: 50%;
    }
    
    .referenzen {
        font-size: 80%;
    }
    
    .spacer-top-referenzen {
        height: 5px;
    }
    
    .spacer-top-betreut {
        height: 15px;
    }
    
    .foto-container {
        margin-top: 9%;
        margin-left: 1.3%;
    }
    
    .christine {
        width: 35%;
    }
    
    .nachfragen-container {
        margin-left: 37%;
        font-size: 70%;
    }
}