/* Chrome, Safari, Opera */
@-webkit-keyframes zoom {
    from {
        -webkit-transform: scale(1,1);
    }
    to {
        -webkit-transform: scale(1.5,1.5);
    }
}

/* Standard syntax */
@keyframes zoom {
   from {
        transform: scale(1,1);
   }
   to {
        transform: scale(1.5,1.5);
   }
}



.cycle-slide { overflow: hidden; }
.cycle-slide img {
    -webkit-animation: zoom 50s infinite; /* Chrome, Safari, Opera */
    animation: zoom 50s infinite;
}

@media (max-width: 749px) {

   .fancy {
 pointer-events: none;
 cursor: default;
}

.top {
	height: 520px !important; 
}

	.topfarbe 
	{height: 515px !important;}
  
  .headerr, img.headerr {
  display: none !important; 
  }
	
	#slideshow {
  display: block !important;
}
	.CONTENTSLIDE img {
		height: 520px !important;
		width: auto !important;
}
    
	.triennale {
		display: inline;
	}
	
	
h1, h2, h3, h4, p, dl, .accordion h4 {
	padding: 0 5% !important;
	/*text-shadow: none !important; */
    }
    
    h1 { 
    color: #0099d3;
    /*text-shadow: none !important;*/
    display: inline-block !important;
    font-size: 28px;
    }
    
    nobr { 
    white-space: normal;
    
    }
    
    table {
    width: 90% !important; 
    margin-left: 5%;
    margin-bottom: 20px; 
    
    }
    
    
    .bottom h1, .bottom h2, .bottom p {
	padding: 0 !important;
    }
    
        .bottom h1, .bottom h2 {
	display: block !important;
    }
    
li {
    list-style-type: disc;
	}

ul {
   	padding: 0 5% !important;
	}
	
	
	.flyout .nav {
      margin-left: 0 !important;
      left: 0 !important;
    }
	
.flyout .nav ul {
      padding: 0 !important;
    }
    
    .flyout .nav ul li {

        list-style: none !important;
        
        }

    
    .flyout .nav ul ul {
      padding: 0 !important;
      list-style: none;
      
    }
    
    .flyout .nav ul ul li {
      padding: 0 10px !important;      
    }
    
        .flyout .nav ul ul ul {

border-bottom: 1px solid #ffffff !important;
border-top: 1px solid #ffffff !important;
			display: none !important;

}
            
	.flyout .nav ul ul ul li {
	width: 40% !important;
	background-color: #a9b6be !important;
	line-height: 130%; 
}
        .flyout .nav ul li a {
      padding: 5px 10px !important;
      text-transform: none;
    }
  
  .nav.opened li a {
    color: #ffffff !important;
  }
   
.nav.opened li.act > a, .nav.opened li a:hover {
    background-color: #ffffff !important;
    color: #a9b6be !important;
  }
  
.flyout .nav ul ul ul li a {
font-size: 12px !important;
padding: 0 0 0 10px !important;
line-height: 130% !important;
}

a.subnavflyout, a.subnavflyoutact {

}
  
  br.clear {
    clear: both;
    line-height: 0 !important;
}



  
  .bottom {
    font-size: 13px !important;
  }
  


  
  .bottom  {
    background-image: none !important;
    height: auto; 
    padding-bottom: 30px;
  }
  
  .footer-outer {
  width: 90% !important; 
  display: block !important; 
  }
  
    .footer-inner {
  width: 100% !important; 
  float: none;
  margin-bottom: 20px; 
  
  }
  
  .suche {
  display: block !important; 
  }

    .footer  {
    background-color: #4e565a;
    height: auto; 
  }
  

  
.contentrahmen div {
    float: none !important;
    width: 100% !important; 
    max-width: 100% !important;
}
  
.contentrahmen {
    margin: 0 0 50px 0 !important;
  }

.bottom .clear {
    display: none; 
}


.inner {
    min-height: 0 !important;
}



.wrapper {
    overflow: hidden; 
}



h2 {
    line-height: 100% !important;
    margin: 0 0 5px 0 !important;
    display: inline-block;
}

img.allpics {
    
    width: 100%;
}

.nav-toggle {
    background: #3d3c3f url("/statimages/hamburger.gif") no-repeat scroll center center;
    width: 55px;
    z-index: 100;
    position: absolute;
  }
  

    
    .flyout .nav > ul > li > a span {
     background-color: transparent;
    }
    
    .flyout .nav ul ul, .flyout .nav ul ul ul {
    height: auto !important; 
    margin: 0 0 6px 0 !important;
		padding-left: 15px !important;
width: 90vw !important;
border-bottom: none !important;
    }
    
    .center {
    width: 100% !important;
    }
    
    .pic19a:hover img, .pic19b:hover img, .pic19c:hover img, .pic19d:hover img {
    -webkit-filter: brightness(1) !important;
    filter: brightness(1) !important;
    
    /*-webkit-filter: brightness(1.1) contrast(1.3);
	filter: brightness(1.1) contrast(1.3);*/
}

iframe {
    width: 100% !important;
    }
    
.logo-responsive {	
	display: inline-block !important;
	}
	
	.logo-responsive.reslarge a img, .logo-responsive.ressmall a img { 
 	display: inline-block !important;
 }
 
 
   .reslarge {
    background-color: rgba(255,255,255,0.8);
    right: 25px;
width: 130px;
top: 0px;
padding: 5px;
  }
  
  .ressmall {
    background-color: #4e565a;
    right: 0;
    width: 60px;
    top: 30px;
    padding: 5px;
  }
  
  .ressmall img {
  -webkit-filter: grayscale(100%) brightness(20) contrast(1);
-moz-filter: grayscale(100%) brightness(20) contrast(1);
-ms-filter: grayscale(100%) brightness(20) contrast(1);
-o-filter: grayscale(100%) brightness(20) contrast(1);
filter: grayscale(100%) brightness(20) contrast(1);
transition: all 0.2s;
  -moz-transition: all 0.2s; /* Firefox 4 */
  -webkit-transition: all 0.2s; /* Safari and Chrome */
  -o-transition: all 0.2s; /* Opera */  
  
  }
  
  .reslarge img {
  -webkit-filter: grayscale(0%) brightness(1) contrast(1);
-moz-filter: grayscale(0%) brightness(1) contrast(1);
-ms-filter: grayscale(0%) brightness(1) contrast(1);
-o-filter: grayscale(0%) brightness(1) contrast(1);
filter: grayscale(0%) brightness(1) contrast(1);

transition: all 0.2s;
  -moz-transition: all 0.2s; /* Firefox 4 */
  -webkit-transition: all 0.2s; /* Safari and Chrome */
  -o-transition: all 0.2s; /* Opera */  
  }
  
  
   .reslarge, .ressmall { 
    position: fixed; 
    z-index: 100 !important;
    transition: all 0.5s;
  -moz-transition: all 0.5s; /* Firefox 4 */
  -webkit-transition: all 0.5s; /* Safari and Chrome */
  -o-transition: all 0.5s; /* Opera */
  }
	
	
	 .contentrahmen .view {
    width: 49% !important;  
 /*   height: 150px !important; */
    margin-right: 2%; 
  }
  
.contentrahmen .view:nth-child(2n) {
	margin-right: 0;
}

.contentrahmen .view h1, .contentrahmen .view h2 {
    padding: 5px !important; 
    font-size: 11px !important;
  }
  
  .contentrahmen .view p {
    font-size: 9px !important;
  }
  
  
  
.contentrahmen .layout41 {
	padding: 0 5%;
	width: 90% !important;
}


html.js body div.wrapper div.outer div.inner div.center div.contentrahmen div.layout7105 div.txt0 div#top-map div  { 
	width: 90% !important;
	padding: 0 5%;


}


  .layout7105 ul { 
  margin-left: 0 !important;
  -moz-column-count: 2 !important;
-moz-column-gap: 15px !important;
-webkit-column-count: 2 !important;
-webkit-column-gap: 15px !important;
column-count: 2 !important;
column-gap: 15px !important;

  }

.contentrahmen .accordion-section-title {
    padding: 10px 5% !important;
    max-width: 80%;
    }

#jubilaeum-button { 
	display: none;
}

#fachwerk-banner { 
	display: none;
}

.pic0 { 
	margin: 0;
}

#top-map { 
	width: 90% !important;
}

#map-checkboxes { 
	width: 50% !important;
}

.contextnavigation ul li a { 
	width: 80vw !important;
	height: 25px !important;
}

.subline { 
padding: 0 5% 5% 5%;
}

.contentrahmen .arrow {
	width: 90% !important; 
	padding: 0 5% !important;
}

.leftGallery { 
	height: auto !important;
}

.bestellen { 
	width: 90%;
	padding: 0 5%;
}

div.footer { 
width: 90% !important;
	padding: 0 5%;
}

/*.layout8824 h1, .layout8824 h3 {color: rgba(0,148,128, 0.9) !important;}
.layout8824 .contextnavigation ul li a {background-color: rgba(0,148,128, 0.9);}
.layout8824 .contextnavigation ul li.act a,  .contextnavigation ul li a:hover {border: 1px solid rgba(0,148,128, 0.9);}

.layout7105 h1, .layout8824 h3 {color: rgba(0,111,185, 0.9) !important;}
.layout7105 .contextnavigation ul li a {background-color: rgba(0,111,185, 0.9);}
.layout7105 .contextnavigation ul li.act a,  .contextnavigation ul li a:hover {border: 1px solid rgba(0,111,185, 0.9);} */   
    
    }
    
/* ---- Allgemeine CSS ---- */

.footer-outer {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    }

.footer-inner {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }
     
/* Gallerie mit Hover */
    
    .pic19a img, .pic19b img, .pic19c img, .pic19d img {
    transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -o-transition: all 0.4s ease-in-out 0s;
}

.pic19a:hover .block-caption, .pic19b:hover .block-caption, .pic19c:hover .block-caption, .pic19d:hover .block-caption {
    opacity: 1;
}
.pic19a:hover img, .pic19b:hover img, .pic19c:hover img, .pic19d:hover img {
    -webkit-filter: brightness(0.6);
    filter: brightness(0.6);
    
    /*-webkit-filter: brightness(1.1) contrast(1.3);
	filter: brightness(1.1) contrast(1.3);*/
}


 
  
 /* CSS für Hover der Teaser */

  .view {
   width: 23% !important;
   height: auto;
   float: left;
   overflow: hidden;
   position: relative;
   text-align: center;
   cursor: default;
   /*margin: 0px auto 20px auto;*/
   margin-right: 20px;
   margin-bottom: 20px;   
}

.view:nth-child(4n) {
	margin-right: 0px;
}
  
  .view .mask,.view .content {
   width: 100%;
height: 25%;
position: absolute;
overflow: hidden;
top: 0;
left: 0;

}
  
  .view img {
   display: block;
   position: relative;
   width: 100%;
height: auto;



}
  
  .view h2, .view h1 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 15px;
padding: 0 10px 15px 10px;
    /*background: rgba(0, 0, 0, 0.8);*/
   margin: 7px 0 0 0;
   display: inherit;
       font-family: 'Source Sans Pro', sans-serif;
       font-weight: 300;
       line-height: 100%;
       width: auto;

   
}
.view p {
    font-size: 12px;
      position: relative;
   color: #fff;
   padding: 0px 20px 20px;
   text-align: center;
   line-height: 120%;
}
.view a {
   
   color: #fff;
   display: block;
}

.view p a {
   
   text-decoration: none;
   }

.view a.info: hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}
  
  .view-first img {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first .mask {

   background-color: rgba(167,182,190, 0.9);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}
.view-first h2 {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);

   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first p {
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}
.view-first a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first:hover .mask {
      width: 100%;
height: 100%;
margin: 0;
border: none;    
}

  
.view-first:hover h2,
.view-first:hover p,
.view-first:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
}
.view-first:hover p {
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}
.view-first:hover a.info {
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}
  
/*.view-first:hover h2 {
margin-top: 30%;

}*/
  
    .projekte {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: distribute;
    justify-content: flex-start;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    }
  
  .view {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    font-family: 'Exo 2', sans-serif;
    }
  


.clearfix:before, .clearfix:after { content:""; display:table; }
.clearfix:after { clear:both; }
.clearfix { zoom:1; }

.baustein {
    margin: 0 0 35px 0;
}

.arrow {
    position: absolute;
    bottom: 0;
    width: fit-content;
    height: auto;
    background-repeat: no-repeat;
   /* padding: 0 !important; */
    margin: 0 !important;
    color: #ffffff;
    font-size: 12px;
    text-transform: uppercase;
    text-align: right;
background-color: #3d3d3d;
padding: 5px;
right: 10px;
z-index: 500;
}





.leftGallery {
    float: right;
    width: 100%;
    max-width: 445px;
    margin: 0;
    overflow: hidden;
}

.leftGallery img {
	width: 100%;
    max-width: 100%;
}

.fachwerkhotel {
border: 3px dashed;
border-radius: 10px;
padding: 5px;
}

.newsartikel {
    margin-top: -12px;
    overflow: hidden;
       border-bottom: 3px solid #3d3d3d;
    padding-bottom: 23px;
    position: relative;
    cursor: pointer;
}

.newsartikel .rechts {
    width: 100%;
    max-width: 439px;
    vertical-align: top;
    overflow: hidden;
#	 height: 200px;
}



.uebergang {
    width: 100%;
    position: absolute;
    bottom: 0 !important;
    height: 89px;
    background-image: url('/statimages/burgenstrasse-accordeon.png');
    background-repeat: repeat-x;
    background-position: center top;
    margin: 0 !important;
    padding: 0 !important;
    height: 89px !important;
}

.collapse .uebergang {
    display: block;
}

.collapse .uebergang {
    display: none;
}

.newsartikel .uebergang {
    height: 26px;
}


.thumb60 {
  margin-right: 10px;
  min-width: 150px;
}

.tooltip {
  line-height: 110%;
  border:thin 1px #eee;
  background-color:#FFFBF0;
  padding:5px;
  width:200px;
}

html body div.wrapper div.top div#top-map div.gm-style div div div div
  {
    font-size: 12px;
    line-height: 150%;
}

.touristinfo {
display: block;
float: left;
width: auto;
margin-right:30px;
position: relative;
z-index: 2000; 
}


.contextnavigation .newsubnavi {
	background-color: transparent;
	margin: 20px 0 0 0;
	position: relative;
	z-index: 1000;
	

}

.contextnavigation ul
{
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}

.contextnavigation ul li { display: inline; float: left; }

.contextnavigation ul li a
{
	text-decoration: none;
	padding: 10px 10px 0px 10px;
	color: #000000;
	background-color: rgba(255,255,255,0.8);
	border: 1px solid #ffffff;
	text-transform: uppercase;
	font-size: 12px;
	margin: 0 3px 6px 3px;
	width: 119px;
	display: inline-block;
	/*-ms-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;*/
    height: 40px;
	vertical-align: middle;
	line-height: 120%;
    


}

.contextnavigation ul li a:hover
{
color: #000000;
background-color: rgba(255,255,255,0.4);}

.contextnavigation ul li.act a
{
background-color: rgba(255,255,255,0);}


#map-checkboxes {
 position: absolute;
font-size: 12px;
background-color: white;
border: 1px solid black;
padding: 5px 5px 5px 5px;
z-index: 152;
left: 30px;
margin-top: -640px;

}

#map-visibility {
    left: 295px;
    text-align: center;
    top: 552px;
    z-index: 1150 !important;
    border-bottom: 1px solid #555;
    text-shadow: none;
    color: #000;
    font-size: 11px;
    padding: 6px 0 2px 0;
    margin: 0px 0 20px 0;
    cursor: pointer;
    text-shadow: 1px 1px 5px #eee;

}


html body div.wrapper div.top div#map-checkboxes form#form_maps-checkbox select#ortsid
  {
    margin-bottom: 10px;
}

.right .nav { position: relative; }



#OrteRegionalstrecke { 
   width: 445px; 
   margin-bottom: 20px; 
}

#OrteRegionalstrecke ul {

    /*display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;*/
    -moz-column-count: 3;
-moz-column-gap: 15px;
-webkit-column-count: 3;
-webkit-column-gap: 15px;
column-count: 3;
column-gap: 15px;
    
    }
    
    #OrteRegionalstrecke li {
    width: 133px;
    /*-webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    padding: 0 15px 0 0;*/
    line-height: 1em;
display: block;
margin-bottom: 10px;
     }

#RegionalstreckeDesc {
	width: 445px;
	float: left;
}

.layout7105 #top-map { 
	width: 445px;
	float: right;
	/*right: 20px;
top: 75px;
height: 80%;
position: absolute;*/

}

.layout8824 #top-map {
}

.layout7105 h1 { 
	display: inline;
margin-right: 10px;
color: #000;
white-space: normal;
text-shadow: none;

	
}

.layout8824 h1 {
        display: inline;
margin-right: 10px;
color: #000;
white-space: normal;
text-shadow: none;
}

.layout8824 h3 {
       /* display: inline; */
margin-right: 10px;
color: #000;
white-space: normal;
text-shadow: none;
}



.layout8824 .pic0a {
    width: 445px;
    max-width: 445px;
    margin-left: 20px;
    margin-bottom: 10px;
    margin-top: 10px;
    position: relative;
    float: right;
}

.layout8824 .pic0a img { 
	width: 100%;
}

#parallelogram-dashed-border{
    background: #fff;
    width: 100px;
    height: 80px;
    position: relative;
    border: dashed 10px #037CA9;
    margin-left: -10px;
    transform: skew(-15deg);
} 

#prospekte_liste .prospekt {
	padding: 10px 0 !important;
}

#prospekte_liste .ueberschrift {
	background-color: #0099d3 !important;
	padding: 1px 0;
}

#prospekte_liste .ueberschrift h3 {
	color: #ffffff;
	font-size: 18px;
}

/*----- Section Titles -----*/
.accordion-section-title {
    width: 845px;
	padding: 10px 5px 10px 20px;
	display: inline-block;
	border-bottom: 1px solid #aaaaaa;
	border-left: 40px solid #005a60;
	transition: all linear 0.15s;
	font-size: 1.200em;
	text-shadow: none;

    color:#fff;
}

.accordion-section-title h4 {
	margin-bottom: 0;
	color: #000000;
	text-shadow: none;
	font-size: 15px;
}

.accordion-section h3 {
	margin: 20px 0;
}

a.accordion-section-title {
	text-decoration: none;

}
 
.accordion-section-title.active, .accordion-section-title:hover {
    background:#eeeeee;
    /* Type */
    text-decoration:none;
    color: #ffffff
}
 
.accordion-section:last-child .accordion-section-title {
    /*border-bottom:none;*/
}

.accordion .arrow {
	color: #0099d3;
}
 
/*----- Section Content -----*/
.accordion-section-content {
    padding:25px 0;
    display:none;
}

@media (min-width: 750px) {
  .fixed-navi {
    background-color: white !important;
    border-bottom: 1px solid #dfdfdf;
    position: fixed !important;
    top: 0 !important;
    z-index: 5000 !important;
    opacity: 0.95;
    width: 751px;
    left: 50% !important;
    padding-left: 159px;
    margin-left: -455px;
    
    background-image: url('/upmedia/fachwerkstrasse-logo-quer.png');
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;

	-webkit-animation: fadein 1s ease; /* Safari, Chrome and Opera > 12.1 */
	-moz-animation: fadein 1s ease; /* Firefox < 16 */
	-ms-animation: fadein 1s ease; /* Internet Explorer */
	-o-animation: fadein 1s ease; /* Opera < 12.1 */
    animation: fadein 1s ease;
}

@keyframes fadein { 
  0% { transform: translateY(-100%); }
    100% { transform: translateY(0); }
}


/* Firefox < 16 */
@-moz-keyframes fadein {   
  0% { -moz-transform: translateY(-100%); }
    100% { -moz-transform: translateY(0); }
}


/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
   0% { -webkit-transform: translateY(-100%); }
    100% { -webkit-transform: translateY(0); }
}


/* Internet Explorer */
@-ms-keyframes fadein {
     0% { -ms-transform: translateY(-100%); }
    100% { -ms-transform: translateY(0); }
}


/* Opera < 12.1 */
@-o-keyframes fadein {
    0% { -o-transform: translateY(-100%); }
    100% { -o-transform: translateY(0); }
  }
  
  
.flyout .nav.mainnavflyout.fixed-navi ul li ul { 
   left: 160px;
   
   }
    
    .flyout .nav.mainnavflyout.fixed-navi ul li ul ul { 
   left: 240px;
   
   }
   
   .flyout .nav.mainnavflyout.fixed-navi ul #siteid23 ul { 
   left: 413px;
   }
   .flyout .nav.mainnavflyout.fixed-navi ul #siteid1 ul { 
   left: 159px;
   }
}

/* set border-box so that percents can be used for width, padding, etc (personal preference) */
.cycle-slideshow, .cycle-slideshow * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.cycle-slideshow { width: 100%; min-width: 205px; max-width: 425px; margin: 10px auto; padding: 0; position: relative;
    background: url(/statimages/spinner.gif) 50% 50% no-repeat; margin-top: 25px; }

/* slideshow images (for most of the demos, these are the actual "slides") */
.cycle-slideshow img { position: absolute; top: 0; left: 0; width: 100%; height: auto; padding: 0; display: block; }
.cycle-slideshow img:first-child { position: static; z-index: 100; }
.cycle-slideshow a { width: 100%; height: auto; }

.cycle-pager { text-align: center; width: 100%; z-index: 500; position: absolute; top: 5px; }
.cycle-pager span { font-family: arial; font-size: 50px; width: 16px; height: 16px; display: inline-block; color: #ddd; cursor: pointer; }
.cycle-pager span.cycle-pager-active { color: #D69746;}
.cycle-pager > * { cursor: pointer;}
.cycle-caption { position: absolute; color: white; bottom: 15px; right: 15px; z-index: 700; }
.cycle-overlay { font-family: tahoma, arial; position: absolute; bottom: 0; width: 100%; z-index: 600; background: black; color: white; padding: 15px; opacity: .5; }
.cycle-prev, .cycle-next { position: absolute; top: 0; width: 30%; opacity: 0; filter: alpha(opacity=0); z-index: 800; height: 100%; cursor: pointer; }
.cycle-prev { left: 0;  background: url(/statimages/left.png) 50% 50% no-repeat;}
.cycle-next { right: 0; background: url(/statimages/right.png) 50% 50% no-repeat;}
.cycle-prev:hover, .cycle-next:hover { opacity: .7; filter: alpha(opacity=70) }
.disabled { opacity: .5; filter:alpha(opacity=50); }

/* display paused text on top of paused slideshow */
.cycle-paused:after {
    content: 'Paused'; color: white; background: black; padding: 10px;
    z-index: 500; position: absolute; top: 10px; right: 10px;
    border-radius: 10px;
    opacity: .5; filter: alpha(opacity=50);
}

/*
    media queries
    some style overrides to make things more pleasant on mobile devices
*/

@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
    .cycle-slideshow { width: 200px;}
    .cycle-overlay { padding: 4px }
    .cycle-caption { bottom: 4px; right: 4px }
}

#outside .cycle-slideshow { width: 300px; }
#prev, #next, .prevControl, .nextControl { cursor: pointer; font-size: 16px; color: #08C }



/* ----------------------------- New Album Slider Home -------------------------------------------------- */

main {
  width: 100%;
  height: 100%;
  margin: 20px 0;
  padding: 10px 0;
}

#carousel {
  position: relative;
  height: 400px;
  top: 50%;
  transform: translateY(-10%);
  overflow: hidden;
}
#carousel div {
  position: absolute;
  transition: transform 1s, left 1s, opacity 1s, z-index 0s;
  opacity: 1;
}
#carousel div img {
  width: 400px;
  transition: width 1s;
}
#carousel div.hideLeft {
  left: 0%;
  opacity: 0;
  transform: translateY(50%) translateX(-50%);
}
#carousel div.hideLeft img {
  width: 200px;
}
#carousel div.hideRight {
  left: 100%;
  opacity: 0;
  transform: translateY(50%) translateX(-50%);
}
#carousel div.hideRight img {
  width: 200px;
}
#carousel div.prev {
  z-index: 5;
  left: 30%;
  transform: translateY(50px) translateX(-50%);
}
#carousel div.prev img {
  width: 300px;
}
#carousel div.prevLeftSecond {
  z-index: 4;
  left: 15%;
  transform: translateY(50%) translateX(-50%);
  opacity: 0.7;
}
#carousel div.prevLeftSecond img {
  width: 200px;
}
#carousel div.selected {
  z-index: 10;
  left: 50%;
  transform: translateY(0px) translateX(-50%);
}
#carousel div.next {
  z-index: 5;
  left: 70%;
  transform: translateY(50px) translateX(-50%);
}
#carousel div.next img {
  width: 300px;
}
#carousel div.nextRightSecond {
  z-index: 4;
  left: 85%;
  transform: translateY(50%) translateX(-50%);
  opacity: 0.7;
}
#carousel div.nextRightSecond img {
  width: 200px;
}

.buttons {
  position: relative;
  left: 50%;
  transform: translateX(-5%);
  bottom: 10px;
}

#carousel p 
{position: relative;
z-index: 900;
margin: 0 auto;
text-align: center;
transform: translateY(-80px);}

#carousel p a {
	color: #fff;
text-decoration: none;
font-size: 24px;
text-shadow: 1px 1px 10px #000;
}

.buttons #prev, .buttons #next {
width: 40px !important;
height: 40px !important;
background-color: unset;
border: none;
}

.button-icon {width: 30px;
height: 30px;}

/* ----------------------------- New Album Slider Home Mobile -------------------------------------------------- */
@media (max-width: 749px) {
	
.buttons
	{transform: translateX(-10%);}
#carousel div.prev p, #carousel div.next p, #carousel div.prevLeftSecond p, #carousel div.nextRightSecond p
	{display:none;}
	/*
    #carousel div.selected img {
        transform: scale(0.8);
    }
	    #carousel div.prev img {
        transform: scale(0.7);
    }
	#carousel div.next img  {
       transform: scale(0.7) translateX(40%);
    }
	
        #carousel div.prevLeftSecond img, #carousel div.nextRightSecond img {
        transform: scale(0.3);
    }
      #carousel div.hideLeft img, #carousel div.hideRight img {
        transform: scale(0.1);
    }
*/

#carousel {
    position: relative;
    top: 50%;
    transform: translateY(-10%);
    overflow: hidden;
    height: 300px;

}
#carousel div {
  position: absolute;
  transition: transform 1s, left 1s, opacity 1s, z-index 0s;
  opacity: 1;
}
#carousel div img {
  width: 80%;
  transition: width 1s;
    padding: 0 10%;
}
#carousel div.hideLeft {
  left: 0%;
  opacity: 0;
  transform: translateY(50%) translateX(-50%);
}
#carousel div.hideLeft img {
  width: 30%;
}
#carousel div.hideRight {
  left: 100%;
  opacity: 0;
  transform: translateY(50%) translateX(-50%);
}
#carousel div.hideRight img {
  width: 30%;
}
#carousel div.prev {
    z-index: 5;
    left: 10%;
    transform: translateY(50px) translateX(-50%);

}
#carousel div.prev img {
  width: 55%;
}
#carousel div.prevLeftSecond {
    z-index: 4;
    left: 5%;
    transform: translateY(50%) translateX(-50%);
    opacity: 0.7;

}
#carousel div.prevLeftSecond img {
  width: 40%;
}
#carousel div.selected {
  z-index: 10;
  left: 50%;
  transform: translateY(0px) translateX(-50%);
}
#carousel div.next {
    z-index: 5;
    left: 90%;
    transform: translateY(50px) translateX(-50%);

}
#carousel div.next img {
  width: 55%;
}
#carousel div.nextRightSecond {
    z-index: 4;
    left: 95%;
    transform: translateY(50%) translateX(-50%);
    opacity: 0.7;

}
#carousel div.nextRightSecond img {
  width: 40%;
}

	
	
	
}
/* ----------------------------- New Flicky Slider Highlights -------------------------------------------------- */