/* ========== Scroll to Top Button ========== */
/*#region ScrollToTopButton*/
.topButton {
  display: none;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background-color: var(--background-light);
  border: none;
  font-weight: 600;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 4px var(--secondary);
  cursor: pointer;
  transition: 0.3s;
  overflow: hidden;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
}

.topButton.show {
  display: flex;
}

.topButton:hover {
  width: 140px;
  border-radius: 50px;
  background-color: var(--secondary-light);
}

.topButton::before {
  content: "Ugrás fel";
  position: absolute;
  bottom: -20px;
  color: var(--background-light);
  font-size: 0;
}

.topButton:hover::before {
  font-size: 17px;
  bottom: unset;
  opacity: 1;
  transition: 0.3s;
}

.svgIcon {
  width: 17px;
  transition: 0.3s;
}

.svgIcon path {
  fill: var(--secondary);
}

.topButton:hover .svgIcon {
  transform: translateY(-200%);
}
/*#endregion ScrollToTopButton*/

/* ========== Divider ========== */
/*#region Divider*/
.dividerwrapper {
  padding: 20px 0;
  width: 80%;
  margin: 0 auto;
}

.divider {
  position: relative;
  margin: 0;
  height: 1px;
}

.div-transparent::after,
.div-transparent::before {
  content: "";
  position: absolute;
  top: 0;
  left: 5%;
  right: 5%;
  width: 90%;
  height: 1px;
}

.div-transparent::after {
  background-image: linear-gradient(to right, transparent, rgb(248,249,251), transparent);
}

.div-transparent::before {
  background-image: linear-gradient(to right, transparent, rgb(48,49,51), transparent);
}
/*#endregion Divider*/

/* ========== Links ========== */
/*#region Links*/
.a {
  text-decoration: none;
  color: inherit;
}

.a:hover {
  color: #8C5230;
}
/*#endregion Links*/

/* ========== Articles ========== */
/*#region Articles*/
.hirek{
  display: flex;
  flex-direction: column;
  justify-content: left;
  align-items: center;
  max-width: 50%;
}

.hirek div.body-text {
  align-items: flex-start;
}

.hirek .body-text p.justp {
  max-width: 100%;
  text-align: left;
  color: #0D0D0D;
}

.hirek ul,
.hirek li{
  color: #0D0D0D;
}
/*#endregion Articles*/

/* ========== ImageWaterDroplet ========== */
/*#region ImageWaterDroplet*/
.svgWaterDroplet[aria-hidden='true'][height='0'] { position: absolute }

.imgWaterDroplet {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  filter: url(#squircle) url(#shadow) url(#smooth)
}
/*#endregion ImageWaterDroplet*/

/* ========== TwoDivs1-1 ========== */
/* ========== TwoDivs1-2 ========== */
/* ========== TwoDivs1-3 ========== */