:root {
  --farba-pozadie: white;
  --farba-pismo: black;

  --farba-cierna: black;
  --farba-biela: white;
  --farba-seda: gray;
  --farba-svetlo-seda: #ccc;

  --zoom: 100%;
  --zoom1: calc(var(--zoom) / 100);
}

html {
  font-size: var(--zoom);
  padding: 0 0 5rem 0;
}

body {
  max-width: 50em;
  margin: auto;
  font-family: Helvetica, Arial, sans-serif;
}

h1,
h2,
h3,
h4,
h5 {
  /* margin: 2rem 0 .5rem 0; */ /*mažem*/
  margin: 0.5rem 0 0.5rem 0; /*moje*/
}

.lcWD,
.lcND {
  /* deň v týždni a meniny */
  /* font-size: 70%; */
  color: var(--farba-seda);
}

.lcND {
  font-size: 84%; /* meniny menšie. moje */
}

a {
  color: inherit;
  text-decoration: none;
  display: inline-block; /*pre apku, moje!*/
}

.lcHEAD {
  border-color: var(--farba-seda);
}

/******** lcHEAD ************/

.lcHEAD {
  /* border-left: .3rem solid var(--farba-seda); */ /*bez farieb, moje*/
  /* padding-left: .5rem; */ /*bez farieb, moje*/
  margin: 0.5rem 0 0.5rem 0;
}

.lcHEAD p {
  margin: 0.303rem;
  margin-bottom: 0;
  padding: 0;
}
.lcHEAD h2 {
  font-size: 0.9rem; /*moje upravené*/
  margin-top: 0.5rem;
}
.lcHEAD h2 span.lcMOD {
  font-size: 90%;
  font-weight: normal;
}
.lcHEAD h2 i {
  /* display: block; */ /*mažem*/
  font-size: 90%;
  font-weight: normal;
  /* padding-top: .2rem; */ /*mažem*/
  /* padding-left: 2.5rem; */ /*mažem*/
}
.lcFARBA {
  /* width: 1em; */
  /* height: 1em; */
  /* baseline-shift: .1em; */
  padding: 0.1rem 0.2rem;
  border-radius: 40%;
  font-size: 50%;
  font-weight: normal;
}

.lcFARBA::after {
  content: "\a0";
}

.lcMOD {
  font-style: italic;
  font-weight: normal;
}

.lcHEAD .lcMOD {
  display: inline;
}

/* ******************************************* */
/*             FAREBNE DELENIE                 */
/* ******************************************* */

.lcHEAD {
  /* border-left: .5rem solid var(--farba-feria); */ /*bez farieb, moje*/
  /* padding-left: .5rem; */ /*bez farieb, moje*/
}

.lcHEAD h2 {
  /* background-color: var(--farba-feria-p); */ /*moje mažem*/
  /* margin-left: -.5rem;
      padding: .5rem; */
  /* background-color-opacity: .3; */
}

/* ///////////////// Liturgicke farby ///////////// */
#lc .lcHEAD span.lcFARBA {
  /* display: inline-block;  */ /*mažem*/
  /* font-size: 90%; */ /*mažem*/
  font-family: monospace;
  padding: 0px 3px /*!important*/;
  margin: 0 4px;
  border: 1px solid black;
  vertical-align: middle;
  /* border-radius: 3px; */ /*mažem*/
  margin-left: 7px;
}

.W {
  background-color: white;
  color: black /*!important*/;
}
.G {
  background-color: green;
  color: white;
}
.V {
  background-color: purple;
  color: white;
}
.R {
  background-color: red;
  color: white;
}
.P {
  background-color: hotpink;
  color: black /*!important*/;
} /*hotpink moje*/
/*.GOLD { background-color: gold; color: black !important; }*/
.B {
  background-color: black;
  color: white;
}

/* Tmavý režim *********************/
body.dark {
  --farba-pozadie: #222;
  --farba-pismo: white;

  background-color: var(--farba-pozadie);
  color: var(--farba-pismo);
}

/**********************************/

.lcGEN {
  display: inline; /*moje*/
  /* font-size: 75%; */ /*mažem*/
  color: var(--farba-seda);
}

/********************************************************/

#offlineMenu {
  margin-bottom: 1em;
  display: flex;
  position: sticky;
  top: 0;
  gap: 0.5em;
  font-size: 100%;
  /* justify-content: space-between; */
}
#lcFontSize {
  opacity: 0.5;
  text-align: center;
  font-size: 100%;
  width: 5em;
}
#offlineMenu button {
  opacity: 0.5;
  flex-grow: 1;
  height: 2rem;
  vertical-align: middle;
  font-size: 1rem;
  font-weight: bold;
  /* display: block; */
}
#offlineMenu button:hover {
  cursor: pointer;
}
#offlineMenu button:hover,
#lcFontSize:hover {
  opacity: 0.8;
}
#lcFontSizeSmaller::first-letter {
  font-size: 80%;
}
#lcFontSizeBigger::first-letter {
  font-size: 120%;
}

/*********************************/
/* pridávam moje, minimal style: */
/*********************************/
table,
td {
  border: 1px solid gray;
  border-collapse: collapse;
}

td {
  padding: 1rem; /**/
  /* white-space: nowrap; */
  cursor: pointer;
  user-select: none; /* Standard syntax, pre moju apku */
}

tbody {
  border-style: ridge;
  border-width: 5px;
  border-color: coral;
}

h1 {
  font-size: 100%;
  font-weight: normal;
  margin-bottom: 1rem;
}

h2 {
  font-weight: normal;
}

.lcHEAD {
  line-height: 1.5;
}

.sp {
  color: var(--farba-seda);
}

div.lcHEAD:not(:first-of-type) {
  color: var(--farba-seda);
  line-height: normal;
}