.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.container {
  max-width: 1024px;
}

.allohero {
  position: relative;
  width: 100%;
  height: 1512px;
  background: url(../images/hero_allo.png) top center;
  background-repeat: no-repeat;
  background-size: cover;
}

.allohero2 {
  position: relative;
  width: 100%;
  height: 1363px;
  background: url(../images/hero_allo2.png) top center;
  background-repeat: no-repeat;
  background-size: cover;
}

.allohero3 {
  position: relative;
  width: 100%;
  height: 1306px;
  background: url(../images/hero_allo3.png) top center;
  background-repeat: no-repeat;
  background-size: cover;
}

.allohero4 {
  position: relative;
  width: 100%;
  height: 1010px;
  background: url(../images/hero_allo4.png) top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.allohero5 {
  position: relative;
  width: 100%;
  height: 802px;
  background: url(../images/hero_allo5.png) top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.allohero6 {
  position: relative;
  width: 100%;
  height: 1254px;
  background: url(../images/hero_allo6.png) top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.allohero7 {
  position: relative;
  width: 100%;
  height: 1465px;
  background: url(../images/hero_allo7.png) top center;
  background-repeat: no-repeat;
  background-size: cover;
}

.hero {
  position: relative;
  width: 100%;
  height: 685px;
  background: url(../images/hero.jpg) top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.hero1 {
  position: relative;
  width: 100%;
  height: 685px;
  background: url(../images/hero2.jpg) top center;
  background-repeat: no-repeat;
  background-size: cover;
}

.hero2 {
  position: relative;
  width: 100%;
  height: 685px;
  background: url(../images/hero3.jpg) top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.hero3 {
  position: relative;
  width: 100%;
  height: 685px;
  background: url(../images/hero4.jpg) top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.hero4 {
  position: relative;
  width: 100%;
  height: 685px;
  background: url(../images/hero5.jpg) top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.hero5 {
  position: relative;
  width: 100%;
  height: 685px;
  background: url(../images/hero6.jpg) top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.hero6 {
  position: relative;
  width: 100%;
  height: 685px;
  background: url(../images/hero7.jpg) top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.hero7 {
  position: relative;
  width: 100%;
  height: 685px;
  background: url(../images/hero8.jpg) top center;
  background-repeat: no-repeat;
  background-size: cover;
}

.logofent {
  /*max-width: 200px;
  max-height: 80px;*/
  padding-top: 10px;
  display: block;
  top: 5%;
  /*position: absolute;

  left: 40%;*/
}

.logofent img {
  max-width: 200px;
  max-height: 80px;
}

.logofent900 img {
  max-width: 900px;
  max-height: 300px;
}

.logolent {
  /*max-width: 300px;
  max-height: 100px;*/
  padding-top: 450px;
  display: block;
  vertical-align: bottom;
  top: 80%;
}
.logolent580 {
  /*max-width: 300px;
  max-height: 100px;*/
  padding-top: 580px;
  display: block;
  vertical-align: bottom;
  top: 80%;
}

.textlent {
  /*max-width: 300px;
  max-height: 100px;*/
  padding-top: 650px;
  display: block;
  vertical-align: bottom;
  top: 80%;
}


.keret {
 outline: 1px solid #000000;
 outline-offset: 10px;
 margin: 10px;
}


.koszonto {
  position: relative;
  width: 1024px;
}

.koszonto p {
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    font-style: italic;
    padding: 5px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: justify;
}
.koszonto h2 {
    font-family: 'Open Sans', sans-serif;
    font-size: 38px;
    padding: 5px;
    padding-left: 20px;
    text-align: justify;
    font-weight: bold;
}
.koszonto h3 {
    font-family: 'Open Sans', sans-serif;
    font-size: 30px;
    padding: 5px;
    padding-left: 20px;
    text-align: justify;
    font-weight: bold;
}


.leiras {
    text-align: justify;

}

.termekleiras {
    text-align: justify;

}

.termekleiras p {
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    padding: 0px;
    text-align: justify;
     margin-left: 15px;
     margin-right: 15px;
}



p.small {
  font-variant: small-caps;
}


.leiras p {
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    padding: 0px;
    text-align: justify;
     margin-left: 10%;
     margin-right: 10%;
}

.leiras span {
    font-weight: bold;
    font-size: 50px;
    padding-left: 8px;
    padding-right: 8px;
    text-align: justify;
     margin-left: 8px;
     margin-right: 8px;
}

.leiras mark {
    font-family: 'Open Sans', sans-serif;
    font-weight: bold;
    font-size: 20px;
    padding-left: 8px;
    padding-right: 8px;
    text-align: justify;
     margin-left: 80px;
     margin-right: 80px;
     background-color: #7da69a;
     color: white;
}


.Actyvabio p {
    font-family: 'Cinzel', serif;
    font-size: 45px;
    padding: 0px;
    text-align: justify;
}

.perjel {
        position: relative;

    }

.perjel:before {
        position: absolute;
        content: '';
        background: url(../images/atlo.png) center top no-repeat;
        width: 70px;
        height: 70px;
        display: inline-block;
        left: 225px;
        bottom: 30px;
    }

/*.col-lg-6 {
  position: relative;
  padding: 0px;
  width: 512px;
  height: 430px;
}*/

.dontott {
  margin: auto;
  width: auto;
  height: 35px;
  /*top: 23%;
  left: 20%;*/
  display: inline-block;
  /*position: absolute;*/
  background: black;    
  transform: skewX(-45deg);
  padding-left: 18px;
  padding-right: 25px;
}
.dontotthosszu {
  margin: auto;
  width: auto;
  max-height: 40px;
  /*top: 23%;
  left: 20%;*/
  display: inline-block;
  /*position: absolute;*/
  background: black;    
  transform: skewX(-45deg);
  padding-top: 3px;
  padding-bottom: 3px;
  padding-right: 15px;
  padding-left: 15px;
}

.dontott p {
  text-align: justify;
  font-size: 20px;
  color: white;
  font-weight: bold;
  transform: skewX(45deg);
}
.dontotthosszu p {
  text-align: justify;
  font-size: 20px;
  color: white;
  font-weight: bold;
  transform: skewX(45deg);
}

.leiras {
  margin: 0px;
  /*top: 38%;*/
  display: block;
  /*position: absolute;*/
}

.leiras p {
  text-align: justify;

}
.szazalek {
  margin: 20px;
  width: 60px;
  height: 60px;
  /*top: 23%;
  left: 20%;*/
  display: inline-block;
  /*position: absolute;*/
  
  transform: skewX(-45deg);
}


.termeklent {
  display: block;
  /*position: absolute;*/
  /*bottom: 1%;  */
}
.w100img {
  width: 100%;
  height: auto;
}
.padding{
  padding-top: 35px;
}


.wautoimg {
  width: auto;
  height: auto;
}

table td, table td * {
    vertical-align: top;
}

.table p {
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    padding: 0px;
}

.td p {
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    padding: 0px;
}

.tabella {
  margin: 0px;
  /*top: 38%;*/
  display: block;
  /*position: absolute;*/
}

.tabella p {
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;

}



.w50img {
  width: 50%;
  margin-top: 15px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  height: auto;
}

.footer {
  margin-top: 15px;
}

.video {
  position: relative;
  overflow: hidden;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.col-sm {
    padding-left: 3px;
    padding-right: 3px;
    flex-grow: 0;
    max-width: 1024px;
}

.hasaboskep {
  max-width: 450px;

}


@media only screen and (min-width: 400px) {
  .hasaboskep {
  max-width: 180px;

}



@media only screen and (min-width: 640px) {
  .hasaboskep {
  max-width: 300px;

}




@media only screen and (min-width: 992px) {
  .termeklent img {
    width: auto;
    height: 100px;
  }

.hasaboskep {
  max-width: 400px;

}




.leiras span {
    font-family: 'Open Sans', sans-serif;
    font-weight: bold;
    font-size: 50px;
    padding-left: 8px;
    padding-right: 8px;
    text-align: justify;
     margin-left: 8px;
     margin-right: 8px;

}

.leiras p {
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    padding: 0px;
    text-align: justify;
     margin-left: 30px;
     margin-right: 30px;
}

.leiras h2 {
    font-size: 40px;
}

.leiras:before h2 {
        position: absolute;
        content: '';
        background: url(../images/atlo.png) center top no-repeat;
        width: 50px;
        height: 50px;
        display: inline-block;
        left: 0px;
    }


.leiras h3 {
    font-size: 30px;
}

.dontott {
  margin: 15px;
  width: auto;
  height: 120px;
  /*top: 23%;
  left: 20%;*/
  display: inline-block;
  /*position: absolute;*/
  background: black;    
  transform: skewX(-45deg);
  padding-left: 25px;
  padding-right: 30px;
}

.dontott p {
  padding: auto;
  text-align: justify;
  font-size: 35px;
  color: white;
  font-weight: bold;
  transform: skewX(45deg);
}

.dontotthosszu {
  margin: auto;
  width: auto;
  height: auto;
  max-height: 120px;
  /*top: 23%;
  left: 20%;*/
  display: inline-block;
  /*position: absolute;*/
  background: black;    
  transform: skewX(-45deg);
  padding-top: 3px;
  padding-bottom: 3px;
  padding-right: 15px;
  padding-left: 15px;
}
.dontotthosszu p {
  text-align: justify;
  font-size: 35px;
  color: white;
  font-weight: bold;
  transform: skewX(45deg);
}


@media only screen and (min-width: 1200px) {
  .termeklent img {
    width: 100%;
    height: auto;
  }
}

