body {
  margin: 0;
  padding: 0;
  font-family: "Segoe UI", sans-serif;
  overflow-x: hidden;
  background-color: #f7c86c;
  position: relative;
  color: black;
}

html {
  background-color: #f7c86c;
  border-radius: 0;
  border: none;
  margin: 0;
  padding: 0;
  font-size: 12px;
}

.container {
  margin: 0;
  padding: 0;
}

header {
  background-color: #f7c86c;
}

nav.navbar.navbar-default {
  background-image: url("../img/vegsolehet3.jpg");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  text-align: center;
  border: none;
  border-radius: 0;
  margin-bottom: 0;
  color: black;
  font-family: "DS Marker Felt", sans-serif;
  font-size: 2.6rem; /*navbar betűméret*/
  font-weight: bold;
}

.navbar-default .navbar-nav > .dropdown.open > a {
  background: transparent;
  color: black;
}

nav.navbar.navbar-default a:hover {
  color: rgb(153, 10, 10);
}
nav.navbar.navbar-default li.nav-item.dropdown a:hover {
  color: rgb(153, 10, 10);
}
.navbar-default .navbar-nav > li > a {
  color: black;
  margin-top: 15px;
  background: transparent;
}

nav a {
  color: black;
}

nav .dropdown-menu {
  background-color: #f7c86c;
  color: black;
  padding-left: 10px;
  font-size: 2.3rem;
}

nav .dropdown-menu a:hover {
  text-decoration: none;
  color: rgb(153, 10, 10);
}

nav.navbar ul {
  display: inline-block;
  float: none;
}

#myCarousel {
  width: 100%;
}

.slide-img {
  object-fit: cover;
  object-position: center;
  max-height: calc(80vh - 1px);
  /*sildeshow képek mérete, mert 100% túl nagy, ezért le kell vágni*/
  /* max-height: round(80vh); */
  width: 100vw;
}

.slide-img-top {
  object-position: top;
}

.slide-img-bottom {
  object-position: bottom;
}

#logo {
  position: absolute;
  top: 10px;
  left: 10px;
  max-height: 200px;
  z-index: 1;
}

table,
td,
th {
  font-size: 1.5rem;
  border: 1px solid black;
  border-collapse: collapse;
  text-align: start;
  font-family: "Segoe UI", sans-serif;
  padding: 5px;
}

th {
  text-align: center;
}

table {
  margin-left: 50px;
  margin: auto;
}

/*ide kerülnek a szövegformázások*/
h1,
h2 {
  font-family: "DS Marker Felt", sans-serif;
  text-align: start;
  margin-left: 50px;
}

h3,
h4,
h5 {
  font-family: "DS Marker Felt", sans-serif;
  text-align: start;
  max-width: 60vw;
  align-self: center;
  margin: 20px auto;
}

main p {
  text-align: justify;
  padding: 0px;
  font-family: "Segoe UI", sans-serif;
  font-size: 1.7rem;
  max-width: 60vw;
  align-self: center;
  margin: 20px auto;
}

table + p {
  margin-top: 5px;
  text-align: center;
}

figcaption {
  text-align: center;
  font-size: 1.5rem;
  font-family: "Segoe UI", sans-serif;
  font-style: italic;
}

img {
  max-width: 60vw;
}

/*képek igazításához*/
.img-text-wide {
  text-align: center;
}

.img-text-wide img {
  max-width: 60vw;
}

.img-float-left img {
  max-width: 40vw;
  float: left;
  margin: 20px;
}

.img-float-right img {
  max-width: 29vw;
  float: right;
  margin: 10px 5vw -5px 20px;
}

main {
  background-image: url("../img/bg.jpg"); /*szöveg háttérképe*/
  background-repeat: repeat;
  align-items: center;
  background-size: 500px 500px;
  z-index: 1;
}

main .container {
  width: 70%;
  background-color: rgba(247, 200, 108, 0.8); /*átlátszó háttér színe*/
  align-self: center;
  margin: auto;
}

.img-text-wide.logo img{
  margin-top: 20px;
  width: 200px;
}

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


/* ez a rész adja meg a stílust ha kicsi a kijelző pl telefon*/
@media screen and (max-width: 768px) {
  main {
    background-image: none;
  }

  main .container {
    width: 100%;
  }

  #logo {
    max-width: 80px;
  }

  img {
    max-width: 80vw;
  }

  .img-float-left,
  .img-float-right {
    text-align: center;
  }

  .img-float-left img {
    max-width: 80vw;
    float: none;
    margin: 0px;
  }

  .img-float-right img {
    max-width: 80vw;
    float: none;
    margin: 0px;
  }

  .img-text-wide img {
    max-width: 80vw;
  }

  ul.nav.navbar-nav.navbar-right {
    position: absolute;
    right: 10px;
    top: 0px;
  }

  h1,
  h2 {
    margin-left: 10px;
  }

  h3,
  h4,
  h5 {
    max-width: 90vw;
    margin: 20px auto;
  }

  main p {
    max-width: 90vw;
  }

  table {
    margin: auto 20px;
  }
}