@charset "UTF-8";
/* CSS Document */

body {
  color:#434343;
  font-family: "Alegreya Sans", sans-serif;
  font-weight:400;
  font-size:11pt;
  line-height:15pt;
  margin:0;
  }
#top {
  width:100%;
  max-width:100%;
  min-width:800px;
  height:20%;
  min-height:300px;
  background-image:url(bilder/top-hg.jpg);
  background-repeat:no-repeat;
  background-position:center top;
  background-size:cover;
  padding-top:1%;
  padding-bottom:1%;
  }
#logo {
  padding: 20px 10px 10px;
  margin-left:180px;
  /*margin-left: 35%;*/
  z-index: 5;
  width:630px;
  float:left;
  }
#headbereich {
  background-image:url(bilder/trans-weiss.png);
  background-repeat:repeat;
  padding:10px;
  width:940px;
  margin-left:auto;
  margin-right:auto;
}
#headbereich #logo {
  width:270px;
  margin-left:0;
  padding:0;
  text-align:center;
}
#headbereich #logo img {
 height:220px;
  width:auto;
}
#headbereich #godolias {
  font-size:1.9em;
  line-height:1.2em;
  margin-left:0;
  margin-top:auto;
}
#headbereich #godolias .familienfriseur {font-size:1em;}

#headbild {
  width:650px;
  height:285px;
  float:right;
  overflow:hidden;
}
#headbild img {
  width:650px;
  height:auto;
}

#godolias {
   color: #FFFFFF;
    font-size: 2.5em;
    font-weight: 700;
    line-height: 1.5em;
    margin-left: 230px;
    margin-top: -200px;
    text-shadow: 1px 1px 1px #000000;
}
.familienfriseur {
  font-family:"Parisienne", cursive;
  font-size:1.5em;
  font-weight:normal;
  }
.Breite960 {
  width:960px;
  margin-left:auto;
  margin-right:auto;
}
#main {
  width:960px;
  margin-left:auto;
  margin-right:auto;
  }
#rootline {
  font-size:0.8em;
  line-height:4em;
  margin-left:20px;
  }
#rootline a, #rootline a:visited {color:#434343;}
#rootline a:hover {text-decoration:none;}

/*spalten nebeneinander*/
.flexContainer {
    display: flex;
    flex-direction: row;
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
   }
#SpalteLinks {
  padding:20px 0 20px 20px;
  width: 200px;
}
#SpalteRechts {
  padding: 30px;
  background-color:#f5f5f5;
  background-image:url(bilder/trenner.png);
  background-position:left;
  background-repeat:repeat-y;
  width:740px;
  }
  
  
/*-- navi --*/
#menu {
  float: left;
    font-size: 1.1em;
    font-weight: 400;
    margin-bottom: 40px;
  width:200px;
  }
#menu ul {
  list-style:none;
  margin:0;
  padding:0;
  }
#menu ul li {
  margin-right:5px;
  }
#menu ul li a {
  display:block;
  padding-left:15px;
  color: #404040;
  text-decoration:none;
  padding-top:10px;
  padding-bottom:10px;
  }
#menu ul li a:hover {
  color:#6e4a99;
  background-image:url(bilder/nav-aktiv.png);
  background-repeat:no-repeat;
  background-position: left center;
  }

#menu ul li.aktiv a{
  color:#6e4a99;
  background-image:url(bilder/nav-aktiv.png);
  background-repeat:no-repeat;
  background-position: left center;
  } 
#menu ul ul {
  list-style:none;
  margin:0;
  padding:0;
  display: none;
  background-color:#F5F5F5;
  }
#menu ul li.aktiv ul {display:block}
#menu li:hover ul {display: block; }

#menu ul li.aktiv ul li {
  border-bottom: 1px solid #ffffff;
  margin-right:0px;
  background-color:#F5F5F5;
  }
#menu ul li.aktiv ul li a {
  display:block;
  padding-left:55px;
  color: #666666;
  text-decoration:none;
  padding-top:5px;
  padding-bottom:5px;
  background-image:url(bilder/nav-aktiv.png);
  background-repeat:no-repeat;
  background-position: 20px center;
  }
#menu ul li.aktiv ul li a:hover {
  background-color:#DDD6E4;
  color:#6e4a99;
  background-image:url(bilder/nav-aktiv.png);
  background-repeat:no-repeat;
  background-position: 20px center;
  }
#menu ul li.aktiv ul li.aktiv a {
  color:#6e4a99;
  background-image:url(bilder/nav-aktiv.png);
  background-repeat:no-repeat;
  background-position: 20px center;
  }
#menu ul li.aktiv ul li.aktiv {background-color:#DDD6E4;}

  
  /*--  3 spaltig-- */
.Dreispaltig1, .Dreispaltig2 {
  float:left;
  margin-right:17px;
  width:215px;
  text-align:center;
  }
.Dreispaltig3 {float:right;width:215px; text-align:center;}

.BildHoehe {
  overflow:hidden;
  height:140px;
}
.Dreispaltig1 img, .Dreispaltig2 img, .Dreispaltig3 img {
  max-width:215px;
  width:215px;
  height:auto;
  }
  .clr {clear:both;}
  
 #lila {
   width:100%;
   color:#ffffff;
   background-color:#6e4a99;
   padding:15px;
   margin-bottom:30px;
   }
#lila h1, #lila h2, #lila h3,
#lila a, #lila a:visited {color:#ffffff;}

#geschaeft {
  float:right;
  margin-left:20px;
  background-color:#ddd6e4;
  padding:0 10px;
  width:170px;
  }

/* 2 Spalten 50|50*/
#spalte50Li {
  width:49%;
  float:left;
}
#spalte50Re {
  width:49%;
  float:right;
}
#partnerlogos {
  margin-left:50px;
  margin-top:30px;
  min-height:120px;
    }
 #partnerlogos img {
   float:left;
   margin-right:85px;
  height:60px;
  width:auto;
   }  
  
  /*footer*/
 #bottom {
  width:100%;
  max-width:100%;
  min-width:800px;
  height:15%;
  min-height:220px;
  background-image:url(bilder/footer-hg.jpg);
  background-repeat:no-repeat;
  background-position:center top;
  background-size:cover;
  }
#footer {
  width:960px;
  margin-left:auto;
  margin-right:auto;
  color:#ffffff;
  padding-top: 40px;
  font-size:0.9em;
  }
 #footer h3 {color:#ffffff;}
#footer a, #footer a:visited {color:#ffffff;}
 .map {
   margin-right:30px;
   }
#footer ul, #footer li {
    float: right;
    list-style-type: none;
    margin: 0;
    padding: 0;
}
#kontakt, .oeffnungszeiten {
  margin-right:70px;
  }

.copyright {
  text-align:right;
  }
 /* allgemeine tags */
h1 {
    color:#6e4a99;
    font-size:2.5em;
  line-height:1em;
  font-family:"Parisienne", cursive;
  font-weight:400;
  padding-left:0.1em;
    }
h2 {
    color:#6e4a99;
    font-size:1.3em;
   }
h3 {
    color:#6e4a99;
    font-size:1.15em;
    }
    
.BildRe {
  float:right;
  padding-left:20px;
  padding-bottom:20px;
}

#aktuelles {
  margin-right:10%;
}

#SpalteRechts a,  #SpalteRechts a:visited,
#aktuelles a, #aktuelles a:visited {
  color:#6e4a99;
  }
#SpalteRechts a:hover, #aktuelles a:hover {text-decoration:none;}


span.hidden, .h {
    display: inline;
    height: 0;
    left: -1000px;
    overflow: hidden;
    position: absolute;
    top: -1000px;
    width: 0;
}

.align-center {
  text-align:center;
}