* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  margin: 0;
  padding: 0;
}

html {
  color: var(--main-front-color);
  font-family: var(--main-font-family);
  font-size: var(--normal-font);
  -webkit-text-size-adjust: 100%;
  -webkit-scroll-behavior: smooth;
  -moz-scroll-behavior: smooth;
  scroll-behavior: smooth;
}

address {
  font-style: normal;
}

body {
  background-color: var(--main-back-color);
  background: -webkit-linear-gradient(
    var(--main-grad-dir),
    var(--main-grad-from),
    var(--main-grad-to)
  );
  background: -moz-linear-gradient(
    var(--main-grad-dir),
    var(--main-grad-from),
    var(--main-grad-to)
  );
  background: linear-gradient(
    var(--main-grad-dir),
    var(--main-grad-from),
    var(--main-grad-to)
  );
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  font-size: var(--normal-font);
  -webkit-justify-content: stretch;
  -moz-justify-content: stretch;
  justify-content: stretch;
  min-height: 100vh;
  min-height: 100lvh;
  width: 100vw;
  width: 100lvw;
}

h1 {
  font-family: var(--main-font-family);
  font-size: var(--greater-font);
  margin-top: var(--great-size);
}

h1 span.material-symbols-outlined {
  font-size: var(--greater-font);
}

h1:has(span.material-symbols-outlined) {
  display: flex;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  gap: var(--mini-size);
}

h2 {
  font-size: var(--great-font);
}

h3 {
  font-size: var(--larger-font);
}

h4 {
  font-size: var(--large-font);
}

h1, h2 {
  color: var(--alt-back-color);
}

iframe {
  background-color: hsl(from var(--main-front-color) h s 80%);
  border: none;
  bottom: 0;
  height: 100%;
  left: 0;
  right: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

#main-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex: 1;
  -moz-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: stretch;
  -moz-justify-content: stretch;
  justify-content: stretch;
  margin: 0 auto;
  /*max-width: var(--max-width-with-padding);
  padding: 0 var(--padding-for-max-width);*/
  /*min-height: 100vh;
  min-height: 100svh;*/
  width: 100vw;
  width: 100lvw;
}

.alt-text {
  display: none;
}

.body-no-scroll {
  overflow: hidden;
}

.full-page-article {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: stretch;
  -moz-justify-content: stretch;
  justify-content: stretch;
  padding-bottom: var(--great-size);
  padding-top: var(--large-size);
  width: 100%;
}

.full-page-article ~ .full-page-article {
  padding-top: 0;
}

.full-page-article > :is(h2, h3, h4, h5, h6) {
  color: var(--alt-back-color);
}

.full-page-article > :is(h2, h3, h4, h5, h6):not(:first-child) {
  padding-top: var(--medium-size);
}

.full-page-article > h2 {
  padding-bottom: var(--medium-size);
}

.full-page-article > h3 {
  padding-bottom: var(--small-size);
}

.full-page-article > h4 {
  padding-bottom: var(--smaller-size);
}

.full-page-article > h5 {
  padding-bottom: var(--mini-size);
}

.full-page-article > h6 {
  padding-bottom: var(--micro-size);
}

.full-page-article > p {
  hyphens: auto;
  line-height: 1.5;
  padding-top: var(--mini-size);
  padding-bottom: var(--mini-size);
  text-align: justify;
}

.full-screen-popup {
  /*background-color: rgb(0,0,0,0.9);*/
  background-color: rgb(from var(--main-back-color) r g b / 0.95);
  -webkit-border-radius: var(--small-size);
  -moz-border-radius: var(--small-size);
  border-radius: var(--small-size);
  -webkit-box-shadow: 0 0 var(--mini-size) var(--mini-size) rgb(from var(--alt-back-color) r g b / 0.6);
  -moz-box-shadow: 0 0 var(--mini-size) var(--mini-size) rgb(from var(--alt-back-color) r g b / 0.6);
  box-shadow: 0 0 var(--mini-size) var(--mini-size) rgb(from var(--alt-back-color) r g b / 0.6);
  height: 100%;
  margin: auto;
  max-width: var(--max-width);
  position: relative;
}

.full-screen-popup-close-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--main-back-color);
  border: none;
  -webkit-border-radius: var(--mini-size);
  -moz-border-radius: var(--mini-size);
  border-radius: var(--mini-size);
  bottom: var(--smaller-size);
  color: var(--warning-color);
  font-size: var(--great-font);
  height: var(--large-size);
  position: absolute;
  right: var(--smaller-size);
  width: var(--large-size);
}

.full-screen-popup-close-button:hover {
  cursor: pointer;
  opacity: var(--hover-opacity);
}

.full-screen-popup-content {
  bottom: 0;
  height: 100%;
  left: 0;
  overflow: hidden;
  padding: var(--smaller-size);
  padding-bottom: calc((2 * var(--smaller-size)) + var(--large-size));
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}

.full-screen-popup-content img {
  display: block;
  height: 100%;
  margin: auto;
  object-fit: contain;
  width: 100%;
}

.full-screen-popup-wrapper {
  height: 100vh;
  height: 100dvh;
  left: 0;
  padding: var(--small-size);
  position: fixed;
  top: 0;
  width: 100vw;
  width: 100dvw;
  z-index: 1000000;
}

.h1-sekundarni-barva {
  color: var(--main-front-color);
}

.h1-markantnejsi {
  font-size: 1.25em;
}

.max-width-on-full-page {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--max-width-with-padding);
  padding-left: var(--padding-for-max-width);
  padding-right: var(--padding-for-max-width);
  width: 100%;
}

.text-med-icon {
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  align-items: center;
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  gap: var(--smaller-size);
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  text-decoration: none;
}

.vice-info-anchor {
  color: var(--main-front-color);
}

.vice-info-anchor:hover {
  text-decoration: none;
}