:root {
  --g-crvena: #F44336;
  --g-svijetlo-plava: #0091EA;
  --g-tamno-plava: #0D47A1;
  --g-indigo: #1A237E;
  --g-smedja: #795548;
  --g-zelena: #008b00;
  --g-tamno-narancasta: #FF3D00;
  --g-svijetlo-zelena: #8BC34A;
  --g-zarko-zelena: #76FF03;
  --g-amber: #FFC107;
  --g-zuta: #FFEB3B;
  --g-narancasta: #FF9800;
  --g-siva: #9E9E9E;
}
.red {
  font-weight: bold;
  color: var(--g-crvena);
}
html {
  font-family: sans-serif;
}
p {
  font-size: 1.8rem
}
body {
  margin: 30px;
}

main, section {
  margin: 3% 10%;
  display: flex;
  text-align: center;
}

footer > hr, footer > p {
  margin: 10px 10% 0;
  display: flex;
  text-align: center;
}
.prezimenaNaslov {
  margin:-2% 10% -3.5%;
  font-weight: normal;
  padding-left: 20px;
  font-size: 1.5rem;
}
a {
  flex: 1;
  padding: 30px;
  margin: 0 10px;
  text-decoration: none;
  font-size: 2rem;
  color: #fff;
  border-radius: 5px;
}

hr {
  border: 1px dashed #000;
}

.m1 {
  background: var(--g-svijetlo-plava);
}
.m2 {
  background: var(--g-crvena);
}
.d2 {
  background: var(--g-amber);
}
.d4 {
  background: var(--g-tamno-plava);
}
.h3 {
  background: var(--g-zelena);
}
.e2 {
  background: var(--g-smedja);
}
.g2 {
  background: var(--g-narancasta);
}
.geografija {
  background: var(--g-zelena);
}
.sociologija, .pag {
  background: var(--g-tamno-narancasta);
}

.politika, .simuni {
  background: var(--g-tamno-plava);
}

.dodatna-nastava, .gorica {
  background: var(--g-zelena);
}

.kosljun-proboj {
  background: var(--g-amber);
}

.tablica {
  background: var(--g-siva);
}

a:hover {
  opacity: 0.8;
  text-decoration: underline;
}

.naslov {
  text-align: center;
  font-weight: normal;
}

section a {
  flex: 1;
  padding: 10px;
  margin: -25px 10px 0;
  text-decoration: none;
  font-size: 1.4rem;
  color: #fff;
  border-radius: 5px;
}

@media all and (max-width:768px) {
  main, section {
    flex-flow: column;
    margin: 0;
  }
  a {
    margin: 5px 0;
    font-size: 1.5rem;
    padding: 20px 0;
  }
  section a {
    flex: 1;
    margin: 5px 0;
    text-decoration: none;
    font-size: 1.4rem;
    color: #fff;
    border-radius: 5px;
  }
  section a:first-of-type {
    margin-top: 45px;
  }
  footer {
    text-align: center;
  }
}

pre {
  text-align: left;
}

.pokrivac {
  z-index: 9999;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #fff;
}

.izvor-ostali {
  background: var(--g-svijetlo-plava);
}

.izvor-pag {
  background: var(--tamno-narancasta);
}

.u-sredini {
  text-align: center;
  font-family: monospace;
}
.popis11 {
  color: red;
  text-align: left;
  font-size: 15px;
  margin-top: -85px;
  left: 0;
}
.cl {
    display: inline-block;
    transform: rotate(180deg);
}
.crveni-tekst {
  color: red
}