body
{
  background: #FFFFFF;
  font-family: 'Open Sans', sans-serif;
  color: #333333;
}

p
{
  margin: 5px 0;
  line-height: 25px;
}

a
{
  text-decoration: none;
  color: inherit;
  transition: color .5s ease;
}

a:hover
{
  color: #AA1F55;
}

strong
{  
  font-weight: bold;
}

#animation img 
{
	background: url("/Bilder/Knoten_3.svg");
}

.no-smil body header div #animation img 
{
	background: url("/Bilder/Knoten_3.png");
}



#fixedRow 
{
	width: 100%; 
	left: 0;
	top: 0;
	background-color:#FFFFFF;
	z-index:9999;
	box-shadow: 1px 1px 1px #cccccc;	
}

.fixedRowMobileMenuOpened
{
	position: relative;
}

.fixedRowMobileMenuClosed
{
	position: fixed;
}

#topRow
{
  width:100%;
  max-width:1100px;
  margin: 0px auto 0px auto;
  padding: 10px 0px 5px 0px;
  display: table;
}

#logo
{
  display: table-cell;
  vertical-align:middle;
  margin-right:20px;
  margin-left:20px;
  height:50px;
  float:right;
}

nav 
{  
  width:100%;
  display: table-cell;
  vertical-align:middle;
  position:relative;
}

nav ul
{
  list-style:none;
  overflow: hidden;
}

nav ul li
{
  display:inline-block;
  float:left;
  padding:3px 12px;
}

nav ul li a
{
  transition: all .25s ease;
  font-size: 11pt;
} 

nav ul ul {
  display:none;
  background: #fff;
  padding-top: 13px;
  
  border-radius: 10px;
  box-shadow: 2px 2px 2px #cccccc;
}

nav ul li ul li img
{
	vertical-align:middle;
	margin-left: 5px;
	margin-right: 10px;
	height: 25px;
}

nav ul li:hover ul {
  top: 35px;
  display:block;
  position: absolute;
  z-index:9999;
}

nav ul ul li {
  display:block;
  float: none;
  padding: 0px 10px;
  text-align: left;
  margin: 0;
  line-height: 20px;
}

#pageBanner 
{
  min-height: 300px; 
  width: 100%;
  position:relative;  
  background-color: #515054;
  margin:0 auto;
  margin-top:55px;
}

#pageBanner img 
{
  display: block;
  margin-left: auto;
  margin-right: auto;
  height: 300px;
}

#pageBanner h1
{
  position:absolute;
  top: 210px;
  width: 100%;
  text-align: center;
  font-family:  "Century Gothic", "Helvetica","Futura BT","ITC Avant Garde Gothic";
  font-size: 25px;
  text-transform: uppercase;
  color: #FFFFFF;	
}


.breadCrumbNavi 
{
  margin-bottom:15px;
}

.breadCrumbImg
{
  vertical-align:middle;
  height: 25px;
}

#content_columns 
{
    line-height: 25px;
    font-family: 'Open Sans',sans-serif;
    clear: both;
    width: auto;
    max-width: 1100px;
    margin: 0 auto;
}

#content_columns .column1, #content_columns .column2
{
  margin: 20px 0;
  font-size:14px;
  float:right;
}

#content_columns .column1 
{
  width:800px;  
}

.mainContent img 
{
  width:100%;  
}

#content_columns .column2
{
  margin-top: 75px;
  width: 300px;
}

.menuBox
{
	position:relative;
	display:block;
	float:left; 
	margin:5px;
	border-radius: 10px;
	background-color: #f2f2f2;
	box-shadow: 2px 2px 2px #cccccc;
	padding: 10px 10px 10px 10px;
	width: 235px;
	height: 175px;
}

.menuBox h2
{
	font-family:  "Century Gothic", "Helvetica","Futura BT","ITC Avant Garde Gothic";
	font-size: 16px;
	font-stretch: semi-condensed;
	color: #666666;
	margin: 1px;
}

.menuBox #menuBoxStatement
{
  	font-family:   "Open sans", "Helvetica", "Verdana","Arial","Lucida Grande", "Lucida Sans Unicode","sans-serif";
	font-size: 18px;
	color: #6699cc;
	padding-bottom: 10px;
}
.menuBox #menuBoxVorschautext
{
	font-family:   "Open sans", "Helvetica", "Verdana","Arial","Lucida Grande", "Lucida Sans Unicode","sans-serif";
	font-size: 13px;
	color: #333333;
	margin: 5px;
	margin-bottom: 25px;
}

.menuBox #menuBoxDetails
{
	font-family: "Open sans", "Helvetica", "Verdana","Arial","Lucida Grande", "Lucida Sans Unicode", "sans-serif";
	font-size: 16px;
	color: #6699cc;
	position:absolute;
	bottom:5px;
	right:5px;
}

.menuBox #menuBoxDetails img
{
	vertical-align:middle;
}


.siteRowBox
{
  margin-bottom: 40px;
  float:left;
  width: 240px;

  border: 1px solid #5e5e5e;

  border-radius: 10px;
  box-shadow: 2px 2px 2px #cccccc;
}

.navBox 
{
	  padding: 10px;
}

.navBox p
{
	text-transform: uppercase;
}

.navBox ul li img
{
	vertical-align:middle;
	margin-left: 5px;
	margin-right: 10px;
}

.contactBox img
{
	width:100%;
	border-radius: 10px;
}

.contactBox h3
{
	margin-left: 10px;
	font-size: 16px;
	font-weight: bold;
	color: #6699cc;
}

.contactBox p
{
	margin-left: 10px;
}



.textBox 
{
  clear:both;  
  padding-top:15px;
}

.textBox a
{
		color:#922454;	
}

.textBox h2
{
	font-family:  "Century Gothic", "Helvetica" ,"Futura BT","ITC Avant Garde Gothic";
	font-size: 16px;
	font-stretch: semi-condensed;
	font-weight: bold;
	color: #666666;
	margin: 1px;
}

.textBox ul li
{
	list-style-type: circle;
	list-style-position: inside;
}



.textBox #textBoxStatement
{
  	font-family:    "Century Gothic", "Helvetica" ,"Futura BT","ITC Avant Garde Gothic";
	font-size: 18px;
	color: #AA1F55;
	
}
.textBox #textBoxDatum
{
	font-family:   "Open sans", "Helvetica", "Verdana","Arial","Lucida Grande", "Lucida Sans Unicode","sans-serif";
	font-size: 15px;
	color: #333333;
	margin-top: 1px;
	
}
.textBox #textBoxkursiv
{
	font-style: italic;
	font-family:   "Open sans", "Helvetica", "Verdana","Arial","Lucida Grande", "Lucida Sans Unicode","sans-serif";
	font-size: 15px;
	color: #333333;
	
}


.textBox #textBoxborder
{ 
	margin-top:15px;
	margin-bottom:15px;
	border-bottom-style: solid;
	border-color:  #AA1F55;
	border-width: 2px;
	
}

footer
{  
  clear:both;
  width:100%;
  background:#333333;
  min-height: 100px;  
}

footer section
{
  display: relative;
  margin: auto;
  padding-top:30px;
  width:auto;
  max-width:1100px;
  
  font-family: 'Open Sans', sans-serif;
  font-size:14px;
  
  color: #5e5e5e;
}

footer section p 
{
  display: block;
  float:left;
  margin-left:20px;
}

footer section ul 
{
  display: block;
  float:right;
  margin-right:20px;
}

footer section ul li
{
	clear:both;
}


footer section ul li a
{
  transition: opacity .25s ease;
  opacity: 0.7;
  display:block;
  float:left;
  margin-bottom:5px;
  color: #ABABAB;
}

footer section ul li a:hover
{
  opacity: 1;
  color: #fff;
}

#responsiveMenuIcon 
{
  cursor: pointer;
  display: none;
  float:left;

  font-family: 'Open Sans', sans-serif;
  font-size: 32px;
  
  margin-left:20px;
  margin-top:20px;
}

.startseite 
{
	line-height: 25px;
    font-family: 'Open Sans',sans-serif;
    max-width: 790px;
    margin: 0 auto;
}

.homeBox
{
	position:relative;
	display:inline-block;
	margin:15px;
	border-radius: 10px;
	background-color: #f2f2f2;
	box-shadow: 2px 2px 2px #cccccc;
	width: 360px;
	height: 360px;
}

.homeBox h2
{
	font-family:  "Century Gothic", "Helvetica", "Futura BT","ITC Avant Garde Gothic";
	font-weight: bold;
	font-size: 22px;
	color: #666666;
	margin: 1px;
	padding: 10px 10px 0px 10px;
}

.homeBox #homeBoxDetails
{
	font-family: "Open sans", "Helvetica", "Verdana","Arial","Lucida Grande", "Lucida Sans Unicode", "sans-serif";
	font-size: 16px;
	color: #6699cc;
	position:absolute;
	bottom: 5px;
	right:5px;
	
}

.homeBox #homeBoxDetails img
{
	vertical-align:middle;
}

#stage {
	position: relative;
	background-color: #FFF;
	height:300px;
	width:1100px;
	margin:auto;
}
#stage picture {
  z-index: 0;
  animation-iteration-count: infinite;
  animation-duration:20s;
  position:absolute;
}

#stage picture:nth-of-type(1) {
  animation-name: fadingAnimation01;
}

#stage picture:nth-of-type(2) {
  animation-name: fadingAnimation03;
}
#stage picture:nth-of-type(3) {
  animation-name: fadingAnimation04;
}
#stage picture:nth-of-type(4) {
  animation-name: fadingAnimation05;
}


@keyframes fadingAnimation01 {
   0% {opacity:1;}
   8%  {opacity:1;}
  16%  {opacity:1;}
  24%  {opacity:1;}
  33%  {opacity:0;}
  41%  {opacity:0;}
  49%  {opacity:0;}
  56%  {opacity:0;}
  61%  {opacity:0;}
  69%  {opacity:0;}
  76%  {opacity:0;}
  84%  {opacity:0;}
  92%  {opacity:0;}
  100%  {opacity:0;}
}

@keyframes fadingAnimation03 {
   0% {opacity:0;}
   8%  {opacity:0;}
  16%  {opacity:0;}
  24%  {opacity:0;}
  33%  {opacity:1;}
  41%  {opacity:1;}
  49%  {opacity:1;}
  56%  {opacity:0;}
  61%  {opacity:0;}
  69%  {opacity:0;}
  76%  {opacity:0;}
  84%  {opacity:0;}
  92%  {opacity:0;}
  100%  {opacity:0;}
}
@keyframes fadingAnimation04 {
0%  {opacity:0;}
   8%  {opacity:0;}
  16%  {opacity:0;}
  24%  {opacity:0;}
  33%  {opacity:0;}
  41%  {opacity:0;}
  49%  {opacity:0;}
  56%  {opacity:1;}
  61%  {opacity:1;}
  69%  {opacity:1;}
  76%  {opacity:1;}
  84%  {opacity:0;}
  92%  {opacity:0;}
  100%  {opacity:0;}
}
@keyframes fadingAnimation05 {
  0%  {opacity:0;}
   8%  {opacity:0;}
  16%  {opacity:0;}
  24%  {opacity:0;}
  33%  {opacity:0;}
  41%  {opacity:0;}
  49%  {opacity:0;}
  56%  {opacity:0;}
  61%  {opacity:0;}
  69%  {opacity:0;}
  76%  {opacity:0;}
  84%  {opacity:1;}
  92%  {opacity:1;}
  100%  {opacity:1;}
}


@media only screen and (max-width: 1150px)
{


  #content_columns .column1, #content_columns .column2
  {
    float:none;
    max-width: 600px;
    margin: 50px auto 0 auto;
  }

  .column2 .siteRowBox
   {	  
	float:none;
	margin: 0 auto 40px auto;
  }

  footer section
  {
    max-width:600px;
  }


  header 
  {
    direction: rtl;
  } 
  
  nav 
  {
    display: table-row;
  } 
  
  
  nav ul 
  {
    background-color: #ABABAB;
    display: none;
  }
  
  
  nav ul li 
  {
    width:100%;
    padding: 15px;
    display: block;
  }
  
  nav ul ul {
  display:block;
  background-color: #ABABAB;
  box-shadow: 0px 0px 0px #FFFFFF;
}

  nav ul li:hover ul {
  top: 0px;
  position: relative;
}

  
  nav.responsiveMenuOpen ul 
  {    
    display: block;
    direction: ltr;
  }
  
  #responsiveMenuIcon 
  {
    display:table-cell;
  }
  
  #anfahrt
   {
	width:600px;  
  }
}

@media only screen and (max-width: 800px)
{
	.startseite 
	{
		max-width:390px;
	}
	
		
}

@media only screen and (max-width: 620px)
{
  #content_columns .column1, #content_columns .column2
  {
    max-width: 320px;
  }
  
  .menuBox 
	{
	  float: none;
	  margin: 10px auto 10px auto;	  
	}
	
  #anfahrt
   {
	width:320px;  
  }
  
 

  footer section
  {
    max-width:320px;
  }
  
    footer section p  {
	  width:320px;	
  }
    
}