body {
    margin: 0;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
  }
/*
@font-face {
font-family: 'h1'; 
src: url('../font/bistrofont_h1.ttf'); 
}
@font-face {
font-family: 'h2'; 
src: url('../font/bistrofont_h2.otf'); 
}
@font-face {
font-family: 'p'; 
src: url('../font/bistrofont_p2.ttf'); 
}
*/

@font-face {
  font-family: 'h1'; 
  src: url('../font/1.otf'); 
  }
  @font-face {
  font-family: 'h2'; 
  src: url('../font/1.otf'); 
  }
  @font-face {
  font-family: 'p'; 
  src: url('../font/1.otf'); 
  }

.clear
    {
      clear:both;
    }


.absatz{
    width:100%; height:50px; margin:0; padding:0;
    font-family: h1;
    text-align: center;
}

.absatz h1{
    color: lightsalmon;
    height:50px;
    font-size:1.5em;
    margin:0; padding:10px 0 10px 0;
}

.index-first-img{
    width:100%;
    min-height:200px;
    margin:0 auto; padding:0;
    position: relative;
    text-align: center;
}



.index-first-img .center{
    width:100%;
    position: absolute;
    top:40%;
    left:50%;
    transform: translate(-50%, -50%);
    color:#fff;
    font-family:h1;
    font-size:3em;
    text-shadow:1px 2px 3px #505050;
}

.index-first-img .centertel{
    position: absolute;
    top:60%;
    left:50%;
    transform: translate(-50%, -50%);
    color:#fff;
    font-family:h1;
    font-size:2em;
    text-shadow:1px 2px 3px #505050;
    background-image: linear-gradient(260deg, #c79f54a1 0%, #b31a1ad0   100%);
    padding: 10px 20px 10px 20px;
    border-radius: 5px;
    width:30%;
}

.index-first-img .centertel:hover{
    background-image: linear-gradient(260deg, #c79f54b6 0%, #bd4141b6   100%);
}

.index-first-img img{
    width:100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size:cover;
}

.index-first-partyservice-img{
  width:1200px;
  min-height:500px;
  margin:0 auto; padding:0;
  position: relative;
  text-align: center;
  background-image: url('../img/buffet_partyservice.jpg');
  background-repeat: no-repeat;
    background-position: center center;
    background-size:cover;
}

.partyservice{
  width:1200px;
  min-height:200px;
  margin:0 auto; padding:0;
  font-family: h1;
}
.partyservice h1{
  margin:0 0 30px 0; padding:0;
  font-size:2em;  
}
.partyservice p{
  margin:0; padding:0;
  font-size:1.3em;
}

.partyservice a, .partyservice a:hover, .partyservice a:visited, .partyservice a:active{
  text-decoration: none;
  color:#000;
}


.ueberuns{
  width:1200px;
  min-height:200px;
  margin:0 auto; padding:0;
  font-family: h1;
}
.ueberuns h1{
  margin:0 0 30px 0; padding:0;
  font-size:2em;  
}
.ueberuns p{
  margin:0; padding:0;
  font-size:1.3em;
}

.ueberuns a, .ueberuns a:hover, .ueberuns a:visited, .ueberuns a:active{
  text-decoration: none;
  color:#000;
}




.index-text{
    width:100%;
    min-height:600px;
    margin:0 auto; padding:0;
    font-family:h1;
    position: relative;
    
}
.index-text h1{font-size: 2.4em;}
.index-text p{font-size: 1.3em;}


.index-text table{
    width:700px;
}

.index-text .boxleft{
    width:20%;
    float:left;
    margin:0; padding:0;
    margin:0 0 0 5%;
    text-align: left;
}

.index-text .boxleft p{
  text-align: justify;
}

.index-text .boxright{
    width:70%;
    float:left;
    margin:0 0 0 5%; padding:0;
}



.index-text .boxright img{
    width:90%;
    margin:0; padding:0;
    background-repeat: no-repeat;
    background-size:cover;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,1);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,1);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,1);
}

.index-text .boxright table{
    text-align: left; 
    padding:0;
    margin:0;
}

.index-text .boxright td:first-child{
    font-size:1.3em;
    padding:5px 20px 5px 0;
}
.index-text .boxright td{
    font-size:1.3em;
    padding:5px 0 5px 0;
    margin:0;
}
.index-text .boxright .tableu1 h1{
    font-size:2em;
    margin:0; padding:0;
}

.index-text .boxright .infofirst h2{
    color:red;
    font-size:1.2em;
    margin:0; padding:0;
    padding:0;
}

.index-text .boxright .kontaktfontsize{
    font-size:0.8em; 
}

.index-text .boxright .right{
    text-align:right;
    width:90%;
}

.impressum{
    margin: auto;
    width: 60%;
    padding: 10px;
  }

  .impressum h1{
    font-family: Arial, Helvetica, sans-serif;
  font-size:2em;
  }

  .impressum p{
    font-family: Arial, Helvetica, sans-serif;
  font-size:1.2em;
  text-align: justify;
  }

  .liste{
    width:800px; min-height:500px; margin:0 auto; padding:0;
}

.liste button{
  padding:10px;
  margin:0; border-radius: 3px;
  background-color:#c79f54a1;
  cursor: pointer;
  font-size:1em;
}

.liste h1{
    font-size:1.5em;
    font-family: h1;
}

.liste h2{
    font-size:1em;
    font-family: h1;
    margin:0; padding:0;
}

.liste h3{
    font-size:0.9em;
    font-family: h1;
    margin:0; padding:0;
}

.liste table{
    width:800px; margin:0; padding:0; border:none;
    font-family: h1;
}


.liste .td-nr{
width:50px;
height:30px;
margin:0; padding:4px 0 0 0;
font-size:1.2em;
}

.liste .td-left{
width:800px;
height:30px;
margin:0; padding:4px 0 0 0;
font-size:1.2em;
}

.liste .td-right{
width:200px;
height:30px;
margin:0; padding:4px 0 0 0;
text-align: right;
font-size:1.2em;
}

.liste .td-left-u{
width:800px;
height:30px;
margin:0; padding:0;
font-size:1em;
border-bottom:1px solid grey;

}

.liste .td-right-u{
width:200px;
height:30px;
margin:0; padding:0;
text-align: right;
}

@media (min-width: 1025px) and (max-width: 1200px) {
  .index-first-partyservice-img {width:100%; }
    .partyservice{width:100%; }
    .partyservice h1{padding:0 10px 0 10px}
    .partyservice p{padding:0 10px 0 10px}
}


@media (min-width: 1025px) and (max-width: 1200px) {
  .index-first-partyservice-img {width:100%; }
    .ueberuns{width:100%; }
    .ueberuns h1{padding:0 10px 0 10px}
    .ueberuns p{padding:0 10px 0 10px}
}
  
  /* 
    ##Device = Tablets, Ipads (portrait)
    ##Screen = B/w 768px to 1024px
  */
  
  @media (min-width: 768px) and (max-width: 1024px) {
    .index-first-img .center{ font-size:2.5em; }
    .index-first-img .centertel{ font-size: 1.5em; }
    .index-text .boxleft {float:none; margin:0 auto; width:50%; text-align: center;} 
    .index-text .boxright, .index-text .boxright img {float:none; margin:0; width:100%; }
    .index-text .boxright table{ text-align: left; margin:0 auto; width:70%; }
    .index-text .boxright h1{text-align: center; padding:20px 0 0 0;}
    .index-text .boxright .right{width:99%; }
    .index-text .bgr{background:rgb(238, 238, 238);    }
    .index-text .boxright .infofirst h2{font-size:1.1em;}
    .absatz{height:10px;}
    .impressum{width:90%}
    .impressum h1{font-size:1.5em;}
    .impressum p{font-size:1em;}
    .liste {width:90%;}
    .liste h1{font-size:1.4em;}
    .liste h2{font-size:0.8em}
    .liste h3{font-size:0.8em}
    .liste table{width:100%; margin:0 auto;}
    .liste hr {width:100%;}
    .liste .td-nr{width:10%; font-size:1.1em;}
    .liste .td-left{width:75%; font-size:1.1em;}
    .liste .td-right{width:15%; font-size:1.1em;}
    .liste .td-left-u {font-size:0.9em;}
    .index-first-partyservice-img {width:100%; }
    .partyservice{width:100%; }
    .partyservice h1{font-size:1.4em; padding:0 10px 0 10px}
    .partyservice p{font-size:1.1em; padding:0 10px 0 10px}
    .ueberuns{width:100%; }
    .ueberuns h1{font-size:1.4em; padding:0 10px 0 10px}
    .ueberuns p{font-size:1.1em; padding:0 10px 0 10px}
    
    
  }
  
  /* 
    ##Device = Tablets, Ipads (landscape)
    ##Screen = B/w 768px to 1024px
  */
  
  @media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    .index-first-img .center{ font-size:2.5em; }
    .index-first-img .centertel{ font-size: 1.5em; }
    .index-text .boxleft {float:none; margin:0; width:60%; text-align: center; padding:0 20% 0 20%;} 
    .index-text .boxright, .index-text .boxright img {float:none; margin:0; width:100%; }
    .index-text h1{font-size: 2em;}
    .index-text p{font-size: 1.3em;}
    .index-text .boxright table{ text-align: left; margin:0 auto; width:70%; }
    .index-text .boxright h1{text-align: center; padding:20px 0 0 0;}
    .index-text .boxright .right{width:99%; }
    .index-text .bgr{background:rgb(238, 238, 238);    }
    .index-text .boxright .infofirst h2{font-size:1.1em;}
    .absatz{height:10px;}
    .impressum{width:90%}
    .impressum h1{font-size:1.5em;}
    .impressum p{font-size:1em;}
    .liste {width:90%;}
    .liste h1{font-size:1.3em;}
    .liste h2{font-size:0.8em}
    .liste h3{font-size:0.8em}
    .liste table{width:100%; margin:0 auto;}
    .liste hr {width:100%;}
    .liste .td-nr{width:10%; }
    .liste .td-left{width:75%}
    .liste .td-right{width:15%;}
    .liste .td-left-u {font-size:0.9em;}
    .index-first-partyservice-img {width:100%; }
    .partyservice{width:100%; }
    .partyservice h1{font-size:1.4em; padding:0 10px 0 10px}
    .partyservice p{font-size:1.1em; padding:0 10px 0 10px}
    .ueberuns{width:100%; }
    .ueberuns h1{font-size:1.4em; padding:0 10px 0 10px}
    .ueberuns p{font-size:1.1em; padding:0 10px 0 10px}
  }
  
  /* 
    ##Device = Low Resolution Tablets, Mobiles (Landscape)
    ##Screen = B/w 481px to 767px
  */
  
  @media (min-width: 481px) and (max-width: 767px) {
    .index-first-img .center{ font-size:1.7em; top:35%}
    .index-first-img .centertel{ font-size: 1.3em; }
    .index-text .boxleft {float:none; margin:0; width:70%; text-align: center; padding:0 15% 0 15%;} 
    .index-text .boxright, .index-text .boxright img {float:none; margin:0; width:100%; }
    .index-text h1{font-size: 1.8em;}
    .index-text p{font-size: 1.1em;}
    .index-text .boxright table{ text-align: left; margin:0 auto; width:90%; }
    .index-text .boxright h1{text-align: center; padding:20px 0 0 0;}
    .index-text .boxright .right{width:99%; }
    .index-text .bgr{background:rgb(238, 238, 238);    }
    .index-text .boxright .infofirst h2{font-size:1em;}
    .index-text .boxright td:first-child{ font-size:1em;    }
    .index-text .boxright td{ font-size:1em;    }
    .absatz{height:10px;}
    .impressum{width:90%}
    .impressum h1{font-size:1.5em;}
    .impressum p{font-size:1em;}
    .liste {width:90%;}
    .liste h1{font-size:1.2em;}
    .liste h2{font-size:0.8em}
    .liste h3{font-size:0.8em}
    .liste table{width:100%; margin:0 auto;}
    .liste hr {width:100%;}
    .liste .td-nr{width:10%; font-size:1em;}
    .liste .td-left{width:75%; font-size:1em;}
    .liste .td-right{width:15%; font-size:1em;}
    .liste .td-left-u{font-size:0.8em;}
    .index-first-partyservice-img {width:100%; }
    .partyservice{width:100%; }
    .partyservice h1{font-size:1.2em;padding:0 10px 0 10px}
    .partyservice p{font-size:1em; padding:0 10px 0 10px}
    .ueberuns{width:100%; }
    .ueberuns h1{font-size:1.4em; padding:0 10px 0 10px}
    .ueberuns p{font-size:1.1em; padding:0 10px 0 10px}

  }
  
  /* 
    ##Device = Most of the Smartphones Mobiles (Portrait)
    ##Screen = B/w 320px to 479px
  */
  
  @media (min-width: 0px) and (max-width: 480px) {
    .index-first-img .center{ font-size:1.5em; top:30%;  width:90%;}
    .index-first-img .centertel{ font-size: 1.2em; width:60%; top:70%}
    .index-text .boxleft {float:none; margin:0; width:80%; text-align: center; padding:0 10% 0 10%;} 
    .index-text .boxright, .index-text .boxright img {float:none; margin:0; width:100%; }
    .index-text h1{font-size: 1.8em;}
    .index-text p{font-size: 1.1em;}
    .index-text .boxright table{ text-align: left; margin:0 auto; width:95%; }
    .index-text .boxright h1{text-align: center; padding:20px 0 0 0;}
    .index-text .boxright .right{width:99%; }
    .index-text .bgr{background:rgb(238, 238, 238);    }
    .index-text .boxright .infofirst h2{font-size:0.9em;}
    .index-text .boxright td:first-child{ font-size:0.9em;    }
    .index-text .boxright td{ font-size:0.9em;    }
    .absatz{height:10px;}
    .impressum{width:90%}
    .impressum h1{font-size:1.5em;}
    .impressum p{font-size:1em;}
    .liste {width:90%;}
    .liste h1{font-size:1.2em;}
    .liste h2{font-size:0.8em}
    .liste h3{font-size:0.8em}
    .liste table{width:100%; margin:0 auto;}
    .liste hr {width:100%;}
    .liste .td-nr{width:10%; font-size:0.9em;}
    .liste .td-left{width:75%; font-size:0.9em;}
    .liste .td-right{width:15%; font-size:0.7em;}
    .liste .td-left-u{width:85%; font-size:0.7em;}
    .index-first-partyservice-img {width:100%; }
    .partyservice{width:100%; }
    .partyservice h1{font-size:1.2em; padding:0 10px 0 10px}
    .partyservice p{font-size:0.9em; padding:0 10px 0 10px}
    .ueberuns{width:100%; }
    .ueberuns h1{font-size:1.4em; padding:0 10px 0 10px}
    .ueberuns p{font-size:1.1em; padding:0 10px 0 10px}
    .ptest{
      hyphens: auto;
    }
  }
