/*@import url("../fonts/roboto_condensed_macroman/stylesheet.css");
@import url("../fonts/roboto_light_macroman/stylesheet.css");
*/
@font-face {
    font-family: 'roboto_condensedregular';
    src: url('../fonts/roboto_condensed_macroman/RobotoCondensed-Regular-webfont.eot');
    src: url('../fonts/roboto_condensed_macroman/RobotoCondensed-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto_condensed_macroman/RobotoCondensed-Regular-webfont.woff') format('woff'),
         url('../fonts/roboto_condensed_macroman/RobotoCondensed-Regular-webfont.ttf') format('truetype'),
         url('../fonts/roboto_condensed_macroman/RobotoCondensed-Regular-webfont.svg#roboto_condensedregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotolight';
    src: url('../fonts/roboto_light_macroman/Roboto-Light-webfont.eot');
    src: url('../fonts/roboto_light_macroman/Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/roboto_light_macroman/Roboto-Light-webfont.woff') format('woff'),
         url('../fonts/roboto_light_macroman/Roboto-Light-webfont.ttf') format('truetype'),
         url('../fonts/roboto_light_macroman/Roboto-Light-webfont.svg#robotolight') format('svg');
    font-weight: normal;
    font-style: normal;
} 

html, body {
        text-align:left;
        /*font: 1em/170% 'robotoregular', Arial, Verdana, Lucida, sans-serif;*/
        /*font: 1em/170% 'robotothin', Arial, Verdana, Lucida, sans-serif;*/
        font: 1em/170% 'robotolight', Arial, Verdana, Lucida, sans-serif;
        color: #555;
        width: 100%; height: 100%;
        margin:0;padding:0;
        background-color:#fff;
        position:relative;
}
#ResponsiveMenu{font-family:'roboto_condensedregular', Arial, Verdana, Lucida, sans-serif;}

a:active {
        color: #409fff;
        font-weight: normal;
        text-decoration: none;
}

a:visited {
        color: #59c;
        text-decoration: none;
}
a:hover {
        color: #00a0ff;
        text-decoration: none;
}
a {
        color: #409fff;
        text-decoration: none;
}
a IMG {border:none;}
A:hover .Bild_Rahmen {background-color: #8E1613;}
A .Bild_Rahmen {/*border:1px solid #ddd;*/}

P {margin:0; margin-bottom:10px;}

h1, h2, h3, h4        {
        color: #531;
        text-align:left;
        text-shadow: 2px 1px 1px rgba(0,0,0,0.2);
        -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none;  hyphens: none;

        }

h1        {
        font-size:180%;
        /*text-transform: uppercase;*/
        font-variant:small-caps;
        font-weight: 500;
        margin-top: 5px;
        margin-bottom: 0px;
         line-height:1.2em;
        padding-bottom: 0px;
        }
/*h1:first-letter {color:#B22D0D;font-weight: 400;        }*/


h2        {
        font-size: 130%;
        font-weight: 500;
        margin-top: 15px;
        margin-bottom: 5px;
         font-variant:small-caps;
        /*text-transform: uppercase;*/
        }

h3        {
        font-size: 100%;
        margin-top: 15px;
        margin-bottom: 5px;
        margin-left: 0px;
        text-transform: uppercase;
         letter-spacing: 1px;
        }
h4        {
        font-size: 100%;
        margin-top: 5px;
        margin-bottom: 5px;
        font-weight:900;
        }
h5        {
        background-color: transparent;
        font-size: 100%;
        font-weight:400;
         color:#888;
         margin:0px;
         margin-bottom:8px;
        text-transform: uppercase;
        }

b { font-weight:500;text-shadow: 1px 1px 1px #666;
  letter-spacing: 0.1em;
  padding-left:2px;

}



HR{
        border:none;
        border-top:1px solid #dcc;
        height:0px; /*Hack, damit HR im  IE & FF gleich*/
}
FIGURE{margin:0;padding:0;display:inline;}
figcaption{display:none;}

UL,
.liste{
  margin-top:10px;
  margin-bottom:10px;
  margin-left:0px;
  padding-left:20px;
  list-style-image:url('../images/liste.png');
  }

UL li UL {list-style-image:none}
UL li UL li{margin-bottom:5px;}

UL>li,
.liste li
{  margin-bottom:10px;
   padding-left:5px;
   margin-left:0px;
   line-height:150%;
}


/*********AktuellSpalte**********************************/
.Aktuell {
  padding-top:30px;
  padding-left:0px;padding-right:0px;line-height:1.2em;
  font-size:13px; line-height:1.25em;
  color:#444;
}
.Aktuell A,.Aktuell A:visited,.Aktuell A:active,.Aktuell A:hover{ color:#357;  text-shadow: 1px 1px 1px #aaa;}
.Aktuell A:hover { color:#00afff;}
.Aktuell .links {text-align:left;}
.Aktuell .links A:last-child{color:#fff;float:right; text-shadow: 1px 1px 1px #000,0px 0px 2px #000;}


.Aktuell .eintrag{
  margin-top:10px;
  margin-bottom:10px;
  padding-bottom:10px;
  border-bottom:1px solid #9A7;
}
.Aktuell .eintrag .titel{padding-bottom:3px;font-size:15px;}
.Aktuell .eintrag .pic{text-align:center; padding-top:2px; }
.Aktuell .eintrag .pic .Bild_Rahmen{ padding:3px;}


/***********Terminliste*****************************************/
.Terminliste{text-align:left;}
.Terminliste .Eintrag{clear:both; width:100%;}
.Terminliste .Eintrag:hover{background-color:#f9F5F0;}
.Terminliste .Eintrag .Titel{background-color:#E9AA2E; background-color:#ffefbe;color:#430;padding:5px 15px;}
.Terminliste .Eintrag .Titel A{color:#430;}
.Terminliste .Eintrag .Text{
  padding:15px;
  padding-top:10px;
  font-size:95%; line-height:1.3;
}

 
.TerminlisteStartseite .Eintrag {clear:both; width:100%;}
.TerminlisteStartseite .Titel{background-color:#010066; color:#fff; display: block; width:100%;padding:3px;padding-left:15px;padding-right:15px;}
.TerminlisteStartseite .Titel A{color:#fff;}
.TerminlisteStartseite .Text{padding:15px;}

DIV.err{ border:1px solid #ff2222;  background-color:#ff9999;
         padding-left:10px; padding-right:10px;
         display:none;
         text-align:left;
         margin-top:10px;
         margin-bottom:3px;
       }


.clear {float:left;width:100%;}


.blocksatz{
        text-align:justify;
}


.BildUntertitel{margin-left:7px;margin-top:0px;margin-bottom:8px; padding-right:-0px; }

/*********** Formulare *****************************************************************************************************/

input, textarea, select{
        box-sizing: border-box;
        background-color: #FFFFFF;
        border: 1px solid #cccccc;
        font-size: 1em;
        font-family: 'Droid Sans', arial, verdana;
        color: #857E7E;
        padding-left:5px;
        border: 1px solid #c7c7c7;
        /*border-radius: 4px;*/
}


.NoRadius {border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px;}
.Radius-left {
        border-top-left-radius: 10px; -moz-border-top-left-radius: 10px; -webkit-border-top-left-radius: 10px;
        border-bottom-left-radius: 10px; -moz-border-bottom-left-radius: 10px; -webkit-border-bottom-left-radius: 10px;
}
.Radius-right {
        border-top-right-radius: 10px; -moz-border-top-right-radius: 10px; -webkit-border-top-right-radius: 10px;
        border-bottom-right-radius: 10px; -moz-border-bottom-right-radius: 10px; -webkit-border-bottom-right-radius: 10px;
}
.noRadius-right,
select {
        border-top-right-radius: 0px; -moz-border-top-right-radius: 0px; -webkit-border-top-right-radius: 0px;
        border-bottom-right-radius: 0px; -moz-border-bottom-right-radius: 0px; -webkit-border-bottom-right-radius: 0px;
}

textarea {box-sizing: border-box;
        padding:5px;background-color: #f3f3f3;
        border:1px solid #ccc;
        border-top:1px solid #aaa;
         border-left:1px solid #bbb;
        -moz-box-shadow:    1px 1px 6px 0px #999;
        -webkit-box-shadow: 1px 1px 6px 0px #999;
        box-shadow:         1px 1px 2px 0px #999;
}
input{  box-sizing: border-box;
        background: #ededed url(../images/input-bg30-3.png) repeat-x;
        padding:5px;
        line-height:1.2em;
        border:1px solid #ccc;
        border-top:1px solid #999;
        border-left:1px solid #bbb;
        outline: none; /*Remove Chrome and Safari glows on focus*/
        cursor:pointer;
        -moz-box-shadow:    1px 1px 6px 0px #999;
        -webkit-box-shadow: 1px 1px 6px 0px #999;
        box-shadow:         1px 1px 2px 0px #999;
}
input:hover{background: #ededed url(../images/input-bg30-aktiv.png) repeat-x;}
input:hover, textarea:hover{
  -moz-box-shadow:    0px 0px 6px 3px #fff;
  -webkit-box-shadow: 0px 0px 6px 3px #ffF;
  box-shadow:         0px 0px 6px 3px #ffF;
}
textarea:hover, textarea:focus{background-color: #fff; }
input:focus{background: #ededed url(../images/input-bg30-aktiv.png) repeat-x;}
input:focus, textarea:focus{
  -moz-box-shadow:    0px 0px 6px 3px #fFC;
  -webkit-box-shadow: 0px 0px 6px 3px #fFC;
  box-shadow:         0px 0px 6px 3px #fFC;
}

INPUT.button {
        font-weight:700;
         padding-right:15px;
         padding-left:15px;
        margin-bottom:2px;
        margin-right:2px;
        margin-top:0px;
        margin-left:0px;
        -moz-box-shadow:    3px 2px 6px 0px #666;
        -webkit-box-shadow: 3px 2px 6px 0px #666;
         box-shadow:         3px 2px 6px 0px #666;
}
INPUT.button:hover{
        margin-top:2px;
        margin-left:2px;
        margin-bottom:0px;
        margin-right:0px;
  -moz-box-shadow:    0px 0px 6px 3px #ffA;
  -webkit-box-shadow: 0px 0px 6px 3px #ffA;
  box-shadow:         0px 0px 6px 3px #ffA;
}



@-webkit-keyframes KlickMichPulse {
0%  { -webkit-box-shadow: 3px 2px 6px 0px #666, 0px 0px 2px 0px #ffA;
              box-shadow: 3px 2px 6px 0px #666, 0px 0px 15px 5px #ffA;
}
50% {
      -webkit-box-shadow: 3px 2px 6px 0px #666, 0px 0px 15px 5px #ffA;
              box-shadow: 3px 2px 6px 0px #666, 0px 0px 15px 5px #ffA;
}
100%{ -webkit-box-shadow: 3px 2px 6px 0px #666, 0px 0px 2px 0px #ffA;
              box-shadow: 3px 2px 6px 0px #666, 0px 0px 2px 0px #ffA;
   }
}

@keyframes KlickMichPulse {
0%  { box-shadow: 3px 2px 6px 0px #666, 0px 0px 2px 0px #ffA;
}
50% { box-shadow: 3px 2px 6px 0px #666, 0px 0px 15px 5px #ffA;
}
100%{ box-shadow: 3px 2px 6px 0px #666, 0px 0px 2px 0px #ffA;
   }
}

INPUT[type=submit] {
  -webkit-animation-name: KlickMichPulse;
  -webkit-animation-duration: 2s;               /* Dauer der Animation*/
  -webkit-timing-timing:ease-in-out;     /*linear, ease*/
  -webkit-animation-iteration-count: infinite;  /* Anzahl der Wiederholungen*/

  -moz-box-animation-name: KlickMichPulse;
  -moz-box-animation-duration: 2s;               /* Dauer der Animation*/
  -moz-box-timing-timing:ease-in-out;     /*linear, ease*/
  -moz-box-animation-iteration-count: infinite;  /* Anzahl der Wiederholungen*/

  animation-name: KlickMichPulse;
  animation-duration: 2s;               /* Dauer der Animation*/
  timing-timing:ease-in-out;     /*linear, ease*/
  animation-iteration-count: infinite;  /* Anzahl der Wiederholungen*/
}
INPUT[type=submit]:hover {
  animation-duration: 0.5s;               /* Dauer der Animation*/
}

.schatten{  
            box-shadow: 3px 2px 6px 0px rgba(0,0,0,0.5)
}




.pulse{
  animation-name: KlickMichPulse;
  animation-duration: 1s;               /* Dauer der Animation*/
  timing-timing:ease;     /*linear, ease*/
  animation-iteration-count: infinite;  /* Anzahl der Wiederholungen*/

  display:block;
  width:250px; padding:10px;
  border:1px solid;

  box-shadow: 1px 1px 4px 0px rgba(0,50,255,0.5);
  -webkit-transition: all 1.5s ease; -moz-transition: all  1.5s ease; -o-transition: all  1.5s ease;  transition: all  1.5s ease;

}

A.button {
  border:1px solid;
  padding:5px;
  padding-right:10px;
  padding-left:10px;
  border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;
  background-color:#f60;
  color:#fff;
  font-weight:500;
  box-shadow: 3px 2px 6px 0px rgba(0,0,0,0.5)
}
A.button:hover {
  background-color:#a30;
}


a.tooltip{outline: none;}
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted #888;
}
.tooltip .tooltiptext {
    visibility: hidden;
    font-size:95%;
    line-height:1.2;
    width: 280px;
    text-align:left;
    background-color: #F9F8F4;
    background-color: rgba(249,248,244,0.95);
    color: #888;
    border-radius: 5px;
    padding: 10px 15px;
    box-shadow:         2px 3px 6px 2px rgba(0, 0, 0, 0.4);
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}
.tooltip:hover .tooltiptext {
    visibility: visible;
}


/************************************************************************/
.flipcard{
  /*border:1px solid #eee; */
  box-sizing: border-box;
  /*width:50%;*/width:49%;  height:230px;
  /*display:block;
  float:left;     */
  display:inline-block;
  margin-bottom:20px;
  position:relative;
}
@media screen and (max-width:700px) {
  .flipcard{ width:100%;max-width:450px;margin:auto;} 

}

.flipcard>DIV{
  /*border:1px solid #f00;*/
  position:absolute;  bottom:20px;  top:0px;  left:20px;  right:30px;
}


.flipcard .Titel{
  z-index:21;
  position:absolute;  bottom:0px;  top:0px;  left:0px;  right:0px;
  overflow:hidden;
  transform: translateZ(200px);
}

.flipcard .Titel A{
  position:absolute;  bottom:0px;  top:0px;  left:0px;  right:0px;
}
.flipcard .Titel A>DIV{
  position:absolute;  bottom:10px;  left:0px;  right:0px;
  font-size:1.8em;
  font-weight:600;
  line-height:110%;
  color:#fff;
   text-shadow: 1px 1px 2px #000, 1px 1px 5px #000;
   text-align:center;
  hyphens: auto;
  /*font-weight:550;*/
}

.flipcard .SeiteA,
.flipcard .SeiteB{
  box-sizing: border-box;
  position:absolute;  bottom:0px;  top:0px;  left:0px;  right:0px;
  border:4px solid #fff;
  box-shadow:  2px 2px 6px rgba(0,0,0,0.5);
   -webkit-transition: all 0.6s ease; -moz-transition: all  0.6s ease; -o-transition: all  0.6s ease;  transition: all  0.6s ease;
  transform-origin: 50% 50%;
  position:absolute;
  z-index:20;
}

.flipcard .SeiteA{ border-top-left-radius: 30px;  transform: perspective(1000px) rotateY(0deg) translateZ(2px);  }
.flipcard .SeiteB{ border-top-right-radius: 30px; transform: perspective(1000px) rotateY(179.99deg) translateZ(2px);}


.flipcard .SeiteB{
  z-index:10;
  
}

.flipcard>DIV:hover .SeiteA {
  transform: perspective(1000px) rotateY(-179.99deg) translateZ(2px);
  -webkit-transform: perspective(1000px) rotateY(-179.99deg) translateZ(2px);
  z-index:10;
}
.flipcard>DIV:hover .SeiteB {
  transform: perspective(1000px) rotateY(0deg) translateZ(2px);
  -webkit-transform: perspective(1000px) rotateY(0deg) translateZ(2px);
  z-index:20;
}

.flipcard .SeiteA{
 background:url("../images/index/404.jpg") no-repeat center center;
 background-size:cover;
}
.flipcard .SeiteB{
 background:url("../images/design/weiss_80.png") no-repeat center center;
 background-size:cover;
 padding:20px;padding-top:15px;
 text-align:left;
 color:#135;
 line-height:130%;
 text-shadow: 0px 0px 1px #fff,0px 0px 2px #fff,0px 0px 4px #fff,0px 0px 8px #fff,0px 0px 9px #fff,0px 0px 10px #fff;
}
.flipcard .SeiteB H2{
  text-shadow: 0px 0px 4px #fff,0px 0px 2px #fff,0px 0px 1px #fff,1px 0px 1px #666;
  font-variant: none;
  margin-top:0px;
  margin-bottom:0px;
  /*font-weight:900;*/
 color:#135;
}


/*********** [GALERIE|...| ****************************************************************/

.galerie{ clear:both; }
.galerie .img{
		float:left; border-right:1px solid #fff;border-bottom:1px solid #fff;
		overflow:hidden;
		position:relative;
		background-color:#fff;
  line-height: 0;
}


.galerie .img>DIV:nth-last-child(1),
.galerie .img>DIV:nth-last-child(2),
.galerie .img>DIV:nth-last-child(3),
.galerie .img>DIV:nth-last-child(4){
		border-right:1px solid #fff;
		border-top:1px solid #fff;
		position:absolute;
		transition: all 0.3s;
		opacity:0;
}

.galerie .img>DIV:nth-last-child(1){width:0;left:-1px;top:-1px;bottom:-1px;}
.galerie .img>DIV:nth-last-child(2){width:0;right:-1px;top:-1px;bottom:-1px;}
.galerie .img>DIV:nth-last-child(3){height:0;top:-1px;left:-1px;right:-1px;}
.galerie .img>DIV:nth-last-child(4){height:0;bottom:-1px;left:-1px;right:-1px;}

.galerie .img>DIV:nth-last-child(5){position:absolute; background-color:rgba(255,255,255,0.7); left:17px;bottom:17px;right:17px;padding:10px;padding-bottom:5px;padding-top:5px;opacity:0;transition: all 0.3s; line-height:1.2; font-size:90%; color:#000}
.galerie .img>DIV:nth-last-child(5):empty{display:none;}
.galerie .img IMG{transition: all 0.3s;}

.galerie .img:hover IMG{
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1)/* rotate(-2deg)*/;
  filter: contrast(1.5);
		/*filter: saturate(1.4);*/	
  opacity:0.9;
}
.galerie .img:hover > DIV:nth-last-child(1){	left:15px;  top:15px;bottom:15px; opacity:1;}
.galerie .img:hover > DIV:nth-last-child(2){	right:15px; top:15px;bottom:15px; opacity:1;}
.galerie .img:hover > DIV:nth-last-child(3){	top:15px;   left:15px;right:15px; opacity:1;}
.galerie .img:hover > DIV:nth-last-child(4){	bottom:15px;left:15px;right:15px; opacity:1;}
.galerie .img:hover > DIV:nth-last-child(5){opacity:1;transition: all 0.85s;}

/***********************************************/

.Akkordeon .galerie{padding-top:10px;}


#PAGESLIDER{margin-top: -8px; overflow:hidden;background-color:#8E1613}
#PAGESLIDER .nivoSlider{box-shadow:none;margin:0; border:none;}
#PAGESLIDER .nivo-controlNav{padding:5px;}

#PAGESLIDER .theme-default .nivo-controlNav a {background-image: url(../images/design/bullets.png);}


.nivoSlider{border: 5px solid #fff;}