body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li{float:left}.ce_gallery>ul li.col_first{clear:left}.float_left{float:left}.float_right{float:right}.block{overflow:hidden}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.ie7 img{-ms-interpolation-mode:bicubic}.ie8 img{width:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.responsive{position:relative;height:0}.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.responsive.ratio-169{padding-bottom:56.25%}.responsive.ratio-1610{padding-bottom:62.5%}.responsive.ratio-219{padding-bottom:42.8571%}.responsive.ratio-43{padding-bottom:75%}.responsive.ratio-32{padding-bottom:66.6666%}
header,footer,nav,section,aside,main,article,figure,figcaption{display:block}body,div,h1,h2,h3,h4,h5,h6,p,blockquote,pre,code,ol,ul,li,dl,dt,dd,figure,table,th,td,form,fieldset,legend,input,textarea{margin:0;padding:0}table{border-spacing:0;border-collapse:collapse}caption,th,td{text-align:left;text-align:start;vertical-align:top}abbr,acronym{font-variant:normal;border-bottom:1px dotted #666;cursor:help}blockquote,q{quotes:none}fieldset,img,iframe{border:0}ul{list-style-type:none}sup{vertical-align:text-top}sub{vertical-align:text-bottom}del{text-decoration:line-through}ins{text-decoration:none}body{font:12px/1 "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;color:#000}input,button,textarea,select{font-family:inherit;font-size:99%;font-weight:inherit}pre,code{font-family:Monaco,monospace}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}h1{font-size:1.8333em}h2{font-size:1.6667em}h3{font-size:1.5em}h4{font-size:1.3333em}table{font-size:inherit}caption,th{font-weight:700}a{color:#00f}h1,h2,h3,h4,h5,h6{margin-top:1em}h1,h2,h3,h4,h5,h6,p,pre,blockquote,table,ol,ul,form{margin-bottom:12px}
.content-slider{overflow:hidden;visibility:hidden;position:relative}.slider-wrapper{overflow:hidden;position:relative}.slider-wrapper>*{float:left;width:100%;position:relative}.slider-control{height:30px;position:relative}.slider-control a,.slider-control .slider-menu{position:absolute;top:9px;display:inline-block}.slider-control .slider-prev{left:0}.slider-control .slider-next{right:0}.slider-control .slider-menu{top:0;width:50%;left:50%;margin-left:-25%;font-size:27px;text-align:center}.slider-control .slider-menu b{color:#bbb;cursor:pointer}.slider-control .slider-menu b.active{color:#666}
/*Layout*/

html {
    overflow-y: scroll;
}
body {
    padding-top:0em;
    padding-bottom:0em;
    background-color:#fdfdfd;
    font:103.5% Verdana,Arial,Helvetica,sans-serif;
}
#wrapper {
    background-color:#fff;
    -webkit-box-shadow:0 2px 6px 0 rgba(142,142,142,.3);
    box-shadow:0 2px 6px 0 rgba(142,142,142,.3); 
}
ul {
    margin-bottom:1.5em;
    list-style-type:square;
}
ol {
    margin-bottom:1.5em;
    list-style-type:decimal;
}
li {
    margin-left:2em;
}
#header {
	position:fixed;
	top:0;
	left:0;
	z-index:110;
    padding-bottom:1px;
    height:85px;
	font: 110%;
	width: 100%;;
	
}

#header .flaggen {
	position:absolute;
	right:13px;
	top:16px;
}
#header .namensschild {
	position:absolute;
	left:29px;
	top:7px;
}

#header h1 {
    margin:0;
    padding:0;
    font:26px/1.7 sans-serif;
    font-weight:bold;
    color:#444;
}
#header h2 {
    margin:0;
    padding:0;
    font:1em sans-serif;
    font-weight:normal;
    color:#444;
}
.slider-control {
	display:none;
}

.storys	{
	display:flex;
	flex-flow: row;
	flex-wrap: wrap;
	max-width:1300px;
	/*min-height: 20vh; */
	justify-content:space-evenly;
	margin: auto;
	flex: 1;
}
.storys h2 {
	font-size:4rem;
}	
.storys p {
	hyphens:auto;
	text-align: left;
}
.matrix {
	font-size: 1.5rem;
	color: #fff;
	text-align: center;
	padding: 1.5rem;
	margin: 0.1875rem;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-gap: 0.5rem;
}
.heading-spalte1 {
	background-color:#b3b3b3;
}
.heading-spalte2 {
	background-color:#f5861b;
	font-size: 1.5rem;
	padding-top: 1.7rem;
}
.heading-spalte3 {
	background-color:#df6438;
	font-size: 1.5rem;
	padding-top: 1.7rem;
}
.heading-spalte4 {
	background-color:#4aa79d;
	font-size: 1.5rem;
	padding-top: 1.7rem;
}

.zeile11 {
	background-color:#f5861b;
	padding-top: 1.7rem;
}
.zeile12 {
	background-color:#808080;
	padding-top: 1.7rem;
}
.zeile13 {
	background-color:#b3b3b3;
	padding-top: 1.7rem;
}
.zeile14 {
	background-color:#666666;
	padding-top: 1.7rem;
}

.zeile21 {
	background-color:#df6438;
	padding-top: 1.7rem;
}
.zeile22 {
	background-color:#666666;
	padding-top: 1.7rem;
}
.zeile23 {
	background-color:#808080;
	padding-top: 1.7rem;
}
.zeile24 {
	background-color:#b3b3b3;
	padding-top: 1.7rem;
}
.zeile31 {
	background-color:#4aa79d;
	padding-top: 1.7rem;
}
.zeile32 {
	background-color:#808080;
	padding-top: 1.7rem;
}
.zeile33 {
	background-color:#b3b3b3;
	padding-top: 1.7rem;
}
.zeile34 {
	background-color:#666666;
	padding-top: 1.7rem;
}

/*Flip Box in der Matrix*/
.flip-box {
	/*height: 228px;
	width: 228px;*/
	/*perspective: 1000;*/ 						/* Betrifft die Perspektive der gesamten Szene, der Wert bedingt die Verzeerrung */
	/*float: left;
	margin: 1em 1em;*/
	background-color:white;  				/*background color der Box, hat diese dieselbe Farbe wie Front und Back, sieht es aus, als wenn die Schrift sich dreht*/
}

.flip-box:hover .turnaround { 
	transform: rotatey(180deg); 			/* Beim Mouse-Over wird die Szene umgedreht */
}
.flip-box .front { 
	background: url() 0 0 no-repeat; 
}

.flip-box .back { 
background: url() 0 0 no-repeat; 
}

.turnaround {
	transition: .8s; 						/* Zeit, die die Drehung dauert */
	transform-style: preserve-3d; 			/* beide Kind-Elemente  (.front + .back) behalten 3D-Eigenschaften*/
	position: relative;
	height: 100%;
}

.front1,
.back1 {
	backface-visibility: hidden 			/* Die Rückseite von Elementen soll unsichtbar sein */;
	position: absolute;
	width: 100%;
	height: 100%;
	background-color:#808080;
}

.front1 { 
	z-index: 2; 
	background-color:#808080;
}

.back1 {
	transform: rotatey(180deg); 				/* Die Rückseite wird gedreht */
	z-index: 1;
	color:#fff;
	
}
.back1 p {
	font-size: 1.4rem;
	padding: 1rem 1rem;
}

.front2,
.back2 {
	backface-visibility: hidden;
	position: absolute;
	width: 100%;
	height: 100%;
	background-color:#b3b3b3;
}

.front2 { 
	z-index: 2; 
	background-color:#b3b3b3;
}

.back2 {
	transform: rotatey(180deg); 
	z-index: 1;
	color:#fff;
	
}
.back2 p {
	font-size: 1.4rem;
	padding: 1rem 1rem;
}


.front3,
.back3 {
	backface-visibility: hidden;
	position: absolute;
	width: 100%;
	height: 100%;
	background-color:#666666;
}

.front3 { 
	z-index: 2; 
	background-color:#666666;
}

.back3 {
	transform: rotatey(180deg);
	z-index: 1;
	color:#fff;
	
}
.back3 p {
	font-size: 1.4rem;
	padding: 1rem 1rem;
}


/*Ende Flip Box Matrix*/

/*Test andere Flip Box*/
.flipBox {
      /*float: left;
      font-size: 1.2em;
      margin: 1% 0 0 1%;
      perspective: 800px;
      transition: all .5s ease 0s;
      width: 30%;*/
      background-color:#fff;
      }
      .flipBox:hover .boxelements {
      transform: rotateY(180deg);
      }
      .boxelements {
      background: #666666;
      cursor: pointer;
      height: 250px;
      transform-style: preserve-3d;
      transition: transform 0.99s ease 0s;
      width: 100%;
      }
      .boxelements p {
      margin-bottom: 1.8em;
      }
      .boxelements .front1,
      .boxelements .back {
      backface-visibility: hidden;
      box-sizing: border-box;
      color: #fff;
      display: block;
      font-size: 1.2em;
	  background: #808080;
      height: 100%;
      padding: 0.8em 0.7em;
      position: absolute;
      text-align: center;
      width: 100%;
      }
	  .boxelements .front2,
      .boxelements .back {
      backface-visibility: hidden;
      box-sizing: border-box;
      color: white;
      display: block;
      font-size: 1.2em;
      background: #b3b3b3;
	  height: 100%;
      padding: 0.8em 0.7em;
      position: absolute;
      text-align: center;
      width: 100%;
      }
	  .boxelements .front3,
      .boxelements .back {
      backface-visibility: hidden;
      box-sizing: border-box;
      color: white;
      display: block;
      font-size: 1.2em;
      background: #666666;
	  height: 100%;
      padding: 0.8em 0.7em;
      position: absolute;
      text-align: center;
      width: 100%;
      }

      .boxelements .back {
      transform: rotateY( 180deg);
      }
      .boxelements .back a {
      padding: 0.3em 0.5em;
      background: #333;
      color: #fff;
      text-decoration: none;
      border-radius: 1px;
      font-size: 0.9em;
      transition: all 0.3s ease 0s;
      }
      .boxelements .back a:hover {
      background: #fff;
      color: #f5861b;
      text-shadow: 0 0 1px #333;					/*ohne Text Shadow wirkt die Schrift beim hover ~dünner~*/
      }
	  
	  
      .flipBox:nth-child(1) .boxelements .back {
      background: #808080;
      }
      .flipBox:nth-child(2) .boxelements .back {
      background: #b3b3b3;
      }
      .flipBox:nth-child(3) .boxelements .back {
      background: #666666;
      }
      .flipBox:nth-child(4) .boxelements .back {
      background: #666666;
      }
      .flipBox:nth-child(5) .boxelements .back {
      background: #b3b3b3;
	  }
	  .flipBox:nth-child(6) .boxelements .back {
      background: #808080;
	  }
	  .flipBox:nth-child(7) .boxelements .back {
      background: #808080;
      }
      .flipBox:nth-child(8) .boxelements .back {
      background: #b3b3b3;
      }
      .flipBox:nth-child(9) .boxelements .back {
      background: #666666;
      }
	  
	  
	  
	  
	  
      @-webkit-keyframes giro {
      from {
      transform: rotateY(180deg);
      }
      to {
      transform: rotateY(0deg);
      }
      }
      @keyframes giro {
      from {
      transform: rotateY(180deg);
      }
      to {
      transform: rotateY(0deg);
      }
      }
      @media screen and (max-width: 767px) {
      .flipBox {
      margin-left: 2.8%;
      margin-top: 3%;
      width: 46%;
      }
      .boxelements {
      height: 285px;
      }
      .flipBox:last-child {
      margin-bottom: 3%;
      }
      }
      @media screen and (max-width: 480px) {
      .flipBox {
      width: 94.5%;
      }
      .boxelements {
      height: 260px;
      }
      }
/*Ende Test der zweiten Matix*/

.usollmann	{
	background-color:#808080;
	height:600px;
	color:#ffffff;
	text-align:center;
	font-size:1.625rem;
}

.nietzsche	{
	background: url('../../files/data/css/files/inhalt/fotos/1077637_610202929010042_338594347_o.jpg') no-repeat;
	background-attachment:fixed;
	min-height:600px;
	color:#ffffff;
	text-align:center;
	font-size:26px;
}
.psychotherapie	{
	background-color:#f5861b;
	/*max-width: 1250px;  */
	/*min-height: 40vw;*/  /*ist noch nicht auf Flex*/
	color:#ffffff;
	text-align:center;
	font-size:1.625rem;
}

.coaching	{
	background-color:#df6438;
	height:600px;
	color:#ffffff;
	text-align:center;
	font-size:1.625rem;
}
.inszenierung	{
	background-color:#4aa79d;
	height:600px;
	color:#ffffff;
	text-align:center;
	font-size:1.625rem;
}

.koerperorientiertepsychotherapie {
	background-color:#e9953d;
	color:#ffffff;
	text-align:left;
	padding-left:220px;
	padding-right:220px;
	font-size:24px;
	
}
.koerperorientiertepsychotherapie h1,
.coachingberatung h1,
.medialeinszenierung h1 {
	font-size:48px;
	font-weight:bold;
	
}
.koerperorientiertepsychotherapie h2,
.coachingberatung h2,
.medialeinszenierung h2 {
	font-size:36px;
	font-weight:bold;
	
}

.coachingberatung	{
	background-color:#df6438;
	color:#ffffff;
	text-align:left;
	padding-left:220px;
	padding-right:220px;
	font-size:24px;
}	

.medialeinszenierung	{
	background-color:#4aa79d;
	color:#ffffff;
	text-align:left;
	padding-left:220px;
	padding-right:220px;
	font-size:24px;
}	


.maennergeburt h1	{
	font-size:60px;
	font-weight:bold;
	padding-left:200px;
	margin-bottom:120px;
}	
.maennergeburt	p {
	text-align:left;
	padding-left:500px;
	padding-right:500px;
	font-size:24px;
}	

.derkoerper h1,
.persoenlichkeit h1,
.vieraugen	h1,		
.oeffentlicherraum h1{
	font-size:60px;
	font-weight:bold;
	padding-left:200px;
	margin-bottom:120px;
}	
.derkoerper	p, 
.persoenlichkeit p
.vieraugen p,
.oeffentlicherraum p{
	text-align:left;
	padding-left:500px;
	padding-right:500px;
	font-size:24px;
}
.keinekommunikation h1,	
.ausdruckeindruck h1   {
	font-size:60px;
	font-weight:bold;
	padding-left:200px;
	margin-bottom:120px;
}	
.keinekommunikation	p, 
.ausdruckeindruck p	 {
	text-align:left;
	padding-left:500px;
	padding-right:500px;
	font-size:24px;
}
.english {
	padding-left:300px;
	padding-right:300px;
	padding-top:40px;
}

.mod_articlenav li	{
    float:left;
    margin:0;
    padding:0;
    padding-left:280px;
    list-style-type:none;
}

.mod_articlenav a
.mod_articlenav strong {
    display:block;
    margin-right:12px;
    font-size:30px;
    line-height:2.7;
    text-decoration:none;
    color:black;
}
.mod_articlenav a:hover {
    cursor:pointer;
}
.mod_articlenav span.active {
    color:#E9953D;
}
/*
#container {
    margin-top:2em;
}
*/
#main {
    font-size:1rem;
    line-height:1.7;
    font-weight:normal;
    color:#444;
}
#main .inside {
    
}
#main .inside .bild-storys h2	{
	font-size:40px;
	font-weight:bold;
	margin-left:250px;
	margin-bottom:200px;
}
#main .inside .bild-storys	{
	margin-left:50px;
}

#footer {
    margin-top:1.5em;
    padding-top:1.5em;
    padding-bottom:1.5em;
    border-top:1px solid #d9d9d9;
    font-size:12px;
    font-weight:normal;
    color:#fbfbfb;
    background-color:#666666;
}
#footer p {
    margin:0;
    padding:0;
}

/*Inhalte*/

#main h1 {
    margin-top:0;
    line-height:1;
}
#main p {
    margin-bottom:1em;
}

/*Navigationen*/

#header .mod_navigation {
    margin-top:0px;
    background-color:#fdfdfd;
   /* -webkit-box-shadow:0 2px 6px rgba(68,68,68,.3);
    box-shadow:0 2px 6px rgba(68,68,68,.3); */
    color:#666666;
    padding-left:520px;
}
#header .mod_navigation ul {
    width:auto;
    float:left;
    margin:0;
    padding:0;
    list-style-type:none;
}
#header .mod_navigation li {
    width:auto;
    float:left;
    margin:0;
}
#header .mod_navigation li,
#header .mod_navigation a {
    display:block;
    margin-right:10px;
    margin-left:10px;
    line-height:75px;
    text-decoration:none;
    color:#666666;
    font-size:25px;
}
#header .mod_navigation .active,
#header .mod_navigation .trail {
    font-weight:bold;
    color:#E9953D;
}
#header .mod_navigation a:hover,
#header .mod_navigation a:focus {
    text-decoration:underline;
    color:#E9953D;
}
#header .mod_navigation .level_2 {
    width:0;
    height:0;
    left:-32768px;
    top:-32768px;
    position:absolute;
    overflow:hidden;
    display:inline;
}
#header .mod_navigation .level_2 li {
    clear:both;
}
#header .mod_navigation li:hover .level_2 {
    width:auto;
    height:auto;
    min-width:78px;
    left:auto;
    top:auto;
    overflow:auto;
    display:block;
    background-color:#fdfdfd;
    z-index: 1000;
}
#header .mod_navigation .level_2 a,
#header .mod_navigation .level_2 span {
    font-size:25px;
    line-height:60px;
    font-weight:normal;
}
#header .mod_navigation .level_2 span.active {
    font-weight:bold;
}
/*
#header .mod_navigation .invisible a	{
	display:none;	
}
*/
#footer {
	background-color:#666666;
	margin:0;
	border-top:none;
	
}
#footer .inside {
	max-width:1250px;
	margin:auto;
}
#footer .inside p {
	font-size: 1.5rem;
	line-height: 1.5;
	margin:auto;
}


#footer .mod_customnav li {
    float:right;
    margin:1rem;
    padding:1rem;
    list-style-type:none;
}
#footer .mod_customnav a,
#footer .mod_customnav strong {
    display:block;
    margin-right:0.8rem;
    font-size:1.2rem;
    line-height:1.7;
    text-decoration:none;
    color:#fbfbfb;
}
#footer .mod_customnav a:hover,
#footer .mod_customnav a:focus {
    text-decoration:underline;
    color: #f5861b;
    transition: all 0.3s ease 0s;
}
#footer .mod_customnav span.active {
    text-decoration:underline;
}
form#kontaktformular { 
  margin: 0 0 2em 0;
  padding: 1em 1em 1em 3em;
  background-color: #f5f4e9;
  box-shadow: 0 2px 6px rgba(68, 68, 68, 0.3);
  border-top: 1px solid #dfddb7;
  border-bottom: 1px solid #dfddb7;
  line-height: 1;
}
#kontaktformular label {
  display: block;
  margin: 1em 0 0.25em 0;
  cursor: pointer;
}
#kontaktformular .checkbox_container label {
  display: inline;
}
#kontaktformular .checkbox_container {
  margin-top: 1.5em;
  margin-bottom: 1em;
}
#kontaktformular input[type="text"],
#kontaktformular input[type="email"],
#kontaktformular textarea {
  padding: 0.25em;
  box-shadow: 0 2px 6px rgba(170, 170, 170, 0.3);
  border: 1px solid #ddd; 
}
#main p.error {
  margin-bottom: 0.25em;
  padding: 1em;
  background: #ffc0cb; 
  border: 1px solid #f00;
  color: #000;
}
