h1 {
  display: none;
}

h2 {
 font-family: "Oswald", sans-serif;
 color: #e6007e;
 font-size:46px;
 padding:0;
 margin:0px 0 20px 0;
}

h2 {
  position: relative;
  display: inline-block; /* dôležité pre centrovanie linky */
  padding-bottom: 10px;
}

h2::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;

  width: 50px;
  height: 3px;

  background:  #e6007e;

  transform: translateX(-50%);
}



h3 {
 font-family: "Oswald", sans-serif;
 color: #e6007e;
 font-size:36px;
 padding:0;
 margin:20px 0 10px 0;
}



h3.uhol {
  display: inline-block; /* dôležité pre rotáciu */
  transform: rotate(5deg);
}



h3.link {
	text-align:center;
  font-family: "Oswald", sans-serif;
  color: #e6007e;
  font-size: 36px;
  position: relative;
  display: inline-block;
  padding-bottom: 10px;
}

h3.link::after {
  content: "";
  position: absolute;

  left: 50%;
  bottom: 0;

  width: 50px;
  height: 3px;

  background: #e6007e;

  transform: translateX(-50%);
}








a.viac,
a.viac:active,
a.viac:visited {
font-family: "Oswald", sans-serif;
display:inline-block;
font-size:22px;
border:1px solid  #e6007e;
  color: #e6007e;
  text-decoration: none;
  font-weight: 300;
  padding:20px;
  margin:20px 0 10px 0;
}

a.viac:hover {
  color: #fff;
  background: #e6007e;
}








.TextCenter01 {text-align:center;padding:0 30px 0 30px;}


#top {
	font-family: "Oswald", sans-serif;
  background-color: #eee;
  padding: 20px;
  color: #aaa;
  margin-bottom: 40px;
}

#top a,
#top a:active,
#top a:visited {
  color: #aaa;
  text-decoration: none;
  font-weight: 700;
}

#top a:hover {
  color: #999;
}

.wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  width: 100%;
  flex-wrap: wrap;
}

.box {
  flex: 1 1 300px;
  max-width: 600px;
  min-width: 280px;
}

.leftBox {
  text-align: right;
}

.rightBox {
  text-align: left;
}

.divider {
  flex: 0 0 10px;
  text-align: center;
}



@media (max-width: 768px) {

  .wrapper {
    flex-wrap: nowrap; /* zostanú vedľa seba */
    gap: 10px;
  }

  .box {
    min-width: auto;
    flex: 1;
  }

  .leftBox {
    text-align: right;
  }

  .rightBox {
    text-align: left;
  }

  .divider {
    flex: 0 0 10px;
    display: block;
  }

}









/* LOGO ZOOM */
.logoAnim {
  max-width: 320px;
  width: 100%;
  transform: scale(0);
  opacity: 0;
  animation: zoomLogo 0.8s ease-out forwards;
}

@keyframes zoomLogo {
  to {
    transform: scale(1);
    opacity: 1;
  }
}






/*   MENU    */
.menu {
	font-family: "Oswald", sans-serif;
	font-size:22px;

  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;

  gap: 40px;
  padding: 20px;
}

.menu a {
  position: relative;
  color: #000;
  text-decoration: none;
  font-weight: 300;
  padding-bottom: 5px;
  transition: color 0.3s ease;
}

/* animované podčiarknutie */
.menu a::after {
  content: "";

  position: absolute;
  left: 50%;
  bottom: 0;

  width: 0;
  height: 2px;

  background: #e6007e;

  transition: all 0.3s ease;
  transform: translateX(-50%);
}

.menu a:hover::after {
  width: 100%;
}

.menu a:hover {
  color: #e6007e;
}


.menu a:hover::after,
.menu a.active::after {
  width: 100%;
}

/* ACTIVE stav */
.menu a.active {
  color: #e6007e;
}


.menu {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

/* toggle button hidden na desktope */
.menuToggle {
  display: none;
  cursor: pointer;
  font-size: 22px;
  padding: 15px;
}

.menuLinks {
  display: flex;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
}

.menuLinks a {
  position: relative;
  text-decoration: none;
  font-weight: 300;
  color: #000;
  padding-bottom: 5px;
}

/* underline animácia */
.menuLinks a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0;
  height: 2px;
  background: #e6007e;
  transform: translateX(-50%);
  transition: 0.3s;
}

.menuLinks a:hover::after,
.menuLinks a.active::after {
  width: 100%;
}

.menuLinks a.active {
  color: #e6007e;
}

/* MOBILE */
@media (max-width: 768px) {
  .menuToggle {
    display: block;
  }

  .menuLinks {
    display: none;
    flex-direction: column;
    gap: 15px;
    padding: 10px 0;
  }

  .menu.open .menuLinks {
    display: flex;
  }
}






/* intro */
.TextCenter01 {
  text-align: center;
  padding: 20px;

  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.TextCenter01 img {
  max-width: 80px;
  transition: transform 0.3s ease;
}

/* hover efekt */
.TextCenter01:hover {
  transform: translateY(-10px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.TextCenter01:hover img {
  transform: scale(1.1);
}






/*h3 animacia */

.reveal {
  opacity: 0;
  transform: scale(0.7);
  transition: all 0.8s ease;
}

.reveal.show {
  opacity: 1;
  transform: scale(1);
}




.footer {
	  color: #666;
	text-align:center;
	font-size:16px;
	background-color: #eee;
	border-top:1px solid #aaa;
	padding:20px;
	margin:20px 0 20px 0;
}