﻿:root {
    /*Svetlo-siva*/
    --background-color: #fafafa;

    /*Grb-crvena*/
    --boja-grb-crvena-primarna: #a12d2e;
    --boja-grb-crvena-primarna-podloga: #ffdad7;
    --boja-grb-crvena-primarna-0-3: rgba(161, 45, 46, .3);
    --boja-grb-crvena-primarna-svetla: #d75e57;
    --boja-grb-crvena-primarna-tamna: #6c0006;

    --boja-grb-crvena-komplementarna: #2DA1A0;
    --boja-grb-crvena-komplementarna-0-3: rgba(45, 161, 160, .3);
    --boja-grb-crvena-komplementarna-svetla: #81C8C8;
    --boja-grb-crvena-komplementarna-tamna: #006C66;

    /*Grb-žuta*/
    --boja-grb-zuta-sekundarna: #caa52f;
    --boja-grb-zuta-sekundarna-0-3: rgba(202, 165, 47, .3);
    --boja-grb-zuta-sekundarna-svetla: #ffd660;
    --boja-grb-zuta-sekundarna-tamna: #957700;

    --boja-grb-zuta-sekundarna-rgb-0-3: rgb(202, 165, 47, 0.3);

    /* Vostok */
    --boja-vostok-plava: #2966F4;
    --boja-vostok-plava-svetla: #7393ff;
    --boja-vostok-plava-svetla-monohromatska: #406CFF;
    --boja-vostok-plava-tamna: #003dc0;

    --boja-vostok-plava-rgb-0-3: rgb(41, 102, 244, 0.3);
    --boja-vostok-plava-svetla-rgb-0-3: rgb(115, 147, 255, 0.3);
    --boja-vostok-plava-svetla-rgb-0-1: rgb(115, 147, 255, 0.1);
    --boja-vostok-plava-tamna-rgb-0-3: rgb(0, 61, 192, 0.3);

    --boja-vostok-zuta-komplementarna: #F4B729;
    --boja-vostok-zuta-komplementarna-svetla: #ffe95f;
    --boja-vostok-zuta-komplementarna-tamna: #bd8800;

    --boja-vostok-plava-analogna-svetla: #29CCF4;
    --boja-vostok-plava-analogna-tamna: #5129F4;

    --boja-vostok-crvena-trijada: #F42966;
    --boja-vostok-zelena-trijada: #66F429;

    --boja-vostok-roza-tetrada: #F429CC;
    --boja-vostok-oker-tetrada: #F4B729;
    --boja-vostok-zelena-tetrada: #29F451;

    --boja-dorotej-primarna: #8e16e9;
    --boja-dorotej-primarna-rgba: rgba(142, 22, 233, 1);
    --boja-dorotej-primarna-svetla: #deb7ff;
    --boja-dorotej-primarna-svetla-rgba: rgba(222, 183, 255, 1);
    --boja-dorotej-primarna-tamna: #6900b2;
    --boja-dorotej-primarna-rgb-0-3: rgba(142, 22, 233, .3);
    --boja-dorotej-primarna-podloga: #f1dbff;
    --boja-dorotej-primarna-podloga-monohromatska: #DDA8FF;
    --boja-dorotej-primarna-podloga-rgba: rgba(241, 219, 255, 1);
    --boja-dorotej-primarna-komplementarna: #71E916;
    --boja-dorotej-primarna-komplementarna-rgb-0-3: rgba(113, 233, 22, .3);
    --boja-dorotej-primarna-monohromatska: #A545ED;
    --boja-dorotej-primarna-analogna-roza: #E916DB;
    --boja-dorotej-primarna-analogna-plava: #2416E9;
    --boja-dorotej-primarna-trijada-narandzasta: #E98E16;
    --boja-dorotej-primarna-trijada-narandzasta-rgb-0-3: rgba(233, 142, 22, .3);
    --boja-dorotej-primarna-trijada-zelena: #16E98E;
    --boja-dorotej-primarna-tetrada-crvena: #E92416;
    --boja-dorotej-primarna-tetrada-zelena: #71E916;
    --boja-dorotej-primarna-tetrada-plava: #16DBE9;
    --boja-dorotej-primarna-tetrada-plava-rgb-0-3: rgba(22, 219, 233, .3);

    --zenColorBgSecondary: #eff0f2;
    /* Zvezda */
    --boja-zvezda-primarna: #9A0000;

    --boja-zvezda-tekst: #33353f;

    /* Moccasin */
    --boja-mokasin: #FFE3B3;
    --boja-mokasin-komplementarna: #B3CFFF;
    --boja-mokasin-monohromatska: #FFD080;
    --boja-mokasin-analogna-2: #F5FFB3;
    --boja-mokasin-analogna-2-monohromatska: #EEFF80;
    --boja-mokasin-analogna-3: #FFBDB3;
    --boja-mokasin-trijada-2: #B3FFE3;
    --boja-mokasin-trijada-3: #E3B3FF;
    --boja-mokasin-tetrada-2: #B3FFBD;
    --boja-mokasin-tetrada-3: #B3CFFF;
    --boja-mokasin-tetrada-4: #FFB3F5;

    /* Eksperimentalne boje */
    --boja-enigmatri-ljubicasta: #e9e4ff;
    --boja-enigmatri-zuta: #fff1d6;
    --boja-enigmatri-roza: #fce1dd;

    --boja-skala: #4A5659;

    --boja-prljavo-plava: #26c6da;
    --boja-prljavo-plava-svetla: #6ff9ff;
    --boja-prljavo-plava-tamna: #0095a8;

    --primary-gray: #f6f8fa;
    --primary-light-gray: #fff;
    --primary-dark-gray: #c3c5c7;
    --color-btn-border: rgba(27, 31, 36, 0.15);
    --color-btn-hover-bg: #f3f4f6;
    --color-btn-hover-border: rgba(27, 31, 36, 0.15);

    --boja-senke-crna: rgba(0, 0, 0, 0.6);
    --boja-senke-crna: rgba(100, 100, 100, 0.6);
    --boja-senke-bela: rgba(255, 255, 255, .6);

    --boja-zastava-crvena: #C6363C;
    --boja-zastava-plava: #0C4076;

    /* Varijable od varijabli */
    --boja-primarna: var(--boja-grb-crvena-primarna);
    --boja-primarna: var(--boja-dorotej-primarna-tamna);
    --boja-primarna-svetla: var(--boja-grb-crvena-primarna-svetla);
    --boja-primarna-svetla: var(--boja-dorotej-primarna-analogna-roza);
    --boja-primarna-tamna: var(--boja-dorotej-primarna-tamna);

    --boja-sekundarna: var(--boja-vostok-plava);
    /*Svetlo-siva*/
    --background-color: #fafafa;

    --boja-tekst-primarna: #333;
    --boja-tekst-diskretno: #666;
    --boja-pozadina-napomena-diskretna: #EEE;
    --boja-pozadina-napomena-diskretna-monohromatska: #D4D4D4;
    --boja-ivice: #AAA;

    /* Vostok */
    --boja-vostok-plava: #2966F4;
    --boja-vostok-plava-svetla: #7393ff;
    --boja-vostok-plava-tamna: #003dc0;

    --boja-vostok-plava-rgb-0-3: rgb(41, 102, 244, 0.3);
    --boja-vostok-plava-svetla-rgb-0-3: rgb(115, 147, 255, 0.3);
    --boja-vostok-plava-svetla-rgb-0-1: rgb(115, 147, 255, 0.1);
    --boja-vostok-plava-tamna-rgb-0-3: rgb(0, 61, 192, 0.3);

    --boja-vostok-zuta-komplementarna: #F4B729;
    --boja-vostok-zuta-komplementarna-svetla: #ffe95f;
    --boja-vostok-zuta-komplementarna-tamna: #bd8800;

    --boja-vostok-plava-analogna-svetla: #29CCF4;
    --boja-vostok-plava-analogna-tamna: #5129F4;

    --boja-vostok-crvena-trijada: #F42966;
    --boja-vostok-zelena-trijada: #66F429;

    --boja-vostok-roza-tetrada: #F429CC;
    --boja-vostok-oker-tetrada: #F4B729;
    --boja-vostok-zelena-tetrada: #29F451;

    --boja-dorotej-primarna: #8e16e9;
    --boja-dorotej-primarna-svetla: #deb7ff;
    --boja-dorotej-primarna-tamna: #6900b2;
    --boja-dorotej-primarna-rgb-0-3: rgba(142, 22, 233, .3);
    --boja-dorotej-primarna-podloga: #f1dbff;
    --boja-dorotej-primarna-komplementarna: #71E916;
    --boja-dorotej-primarna-komplementarna-rgb-0-3: rgba(113, 233, 22, .3);
    --boja-dorotej-primarna-monohromatska: #A545ED;
    --boja-dorotej-primarna-analogna-roza: #E916DB;
    --boja-dorotej-primarna-analogna-plava: #2416E9;
    --boja-dorotej-primarna-trijada-narandzasta: #E98E16;
    --boja-dorotej-primarna-trijada-narandzasta-rgb-0-3: rgba(233, 142, 22, .3);
    --boja-dorotej-primarna-trijada-zelena: #16E98E;
    --boja-dorotej-primarna-tetrada-crvena: #E92416;
    --boja-dorotej-primarna-tetrada-zelena: #71E916;
    --boja-dorotej-primarna-tetrada-plava: #16DBE9;
    --boja-dorotej-primarna-tetrada-plava-rgb-0-3: rgba(22, 219, 233, .3);

    /* Zvezda */
    --boja-zvezda-primarna: #9A0000;

    --boja-zvezda-tekst: #33353f;

    /* Moccasin */
    --boja-mokasin: #FFE3B3;
    --boja-mokasin-komplementarna: #B3CFFF;
    --boja-mokasin-monohromatska: #FFD080;
    --boja-mokasin-analogna-2: #F5FFB3;
    --boja-mokasin-analogna-3: #FFBDB3;
    --boja-mokasin-trijada-2: #B3FFE3;
    --boja-mokasin-trijada-3: #E3B3FF;
    --boja-mokasin-tetrada-2: #B3FFBD;
    --boja-mokasin-tetrada-3: #B3CFFF;
    --boja-mokasin-tetrada-4: #FFB3F5;

    /* Eksperimentalne boje */
    --boja-enigmatri-ljubicasta: #e9e4ff;
    --boja-enigmatri-zuta: #fff1d6;
    --boja-enigmatri-roza: #fce1dd;

    --boja-skala: #4A5659;

    --boja-prljavo-plava: #26c6da;
    --boja-prljavo-plava-svetla: #6ff9ff;
    --boja-prljavo-plava-tamna: #0095a8;

    --primary-gray: #f6f8fa;
    --primary-light-gray: #fff;
    --primary-dark-gray: #c3c5c7;
    --color-btn-border: rgba(27, 31, 36, 0.15);
    --color-btn-hover-bg: #f3f4f6;
    --color-btn-hover-border: rgba(27, 31, 36, 0.15);

    --boja-senke-crna: rgba(0, 0, 0, 0.6);
    --boja-senke-crna: rgba(100, 100, 100, 0.6);
    --boja-senke-bela: rgba(255, 255, 255, .6);

    --boja-zastava-crvena: #C6363C;
    --boja-zastava-plava: #0C4076;

    /* Varijable od varijabli */
    --boja-primarna: var(--boja-dorotej-primarna-tamna);
    --boja-primarna-svetla: var(--boja-dorotej-primarna-analogna-roza);
    --boja-primarna-tamna: var(--boja-dorotej-primarna-tamna);

    --boja-sekundarna: var(--boja-vostok-plava);
    --boja-sekundarna-svetla: var(--boja-vostok-plava-svetla);
    --boja-sekundarna-tamna: var(--boja-vostok-plava-tamna);

    --boja-podcrtano: var(--boja-primarna-svetla);

    --boja-h: var(--boja-primarna);
    --boja-a: var(--boja-sekundarna-tamna);
    --boja-a-hover: var(--boja-sekundarna-svetla);
}

.plava-transparentna {
    background-color: var(--boja-vostok-plava-svetla-rgb-0-3);
    color: var(--boja-tekst-primarna);
}

::selection {
    background-color: var(--boja-sekundarna-tamna);
    background-color: black;
    background-color: var(--boja-dorotej-primarna-tamna);
    color: var(--boja-tekst-primarna);
    color: var(--boja-primarna-tamna);
    color: white;
}

* {
    transition: all 150ms ease-in-out;
}

@font-face {
    font-family: 'OrtoRNIDS';
    src: url('/stilovi/fontovi/OrtoRNIDS-woff2/OrtoRNIDS-Regular.woff2') format('woff2');
    font-style: normal;
    font-weight: normal;
    font-display: swap;
    text-rendering: optimizeLegibility;
}

@font-face {
    font-family: 'OrtoRNIDS';
    src: url('/stilovi/fontovi/OrtoRNIDS-woff2/OrtoRNIDS-Italic.woff2') format('woff2');
    font-style: italic;
    font-weight: normal;
    font-display: swap;
    text-rendering: optimizeLegibility;
}

@font-face {
    font-family: 'OrtoRNIDS';
    src: url('/stilovi/fontovi/OrtoRNIDS-woff2/OrtoRNIDS-Bold.woff2') format('woff2');
    font-style: normal;
    font-weight: bold;
    font-display: swap;
    text-rendering: optimizeLegibility;
}

@font-face {
    font-family: 'OrtoRNIDS';
    src: url('/stilovi/fontovi/OrtoRNIDS-woff2/OrtoRNIDS-BoldItalic.woff2') format('woff2');
    font-style: italic;
    font-weight: bold;
    font-display: swap;
    text-rendering: optimizeLegibility;
}

types {
    font/woff2 woff2;
}

body {
    background-color: var(--zenColorBgSecondary);
    background-color: var(--background-color);
    color: black;
    color: var(--boja-skala);
    color: var(--boja-tekst-primarna);
    margin: 0;
    padding: 0;
    font-feature-settings: "kern";
    /* kern */
    font-feature-settings: "kern" on;
    font-family: "OrtoRNIDS", Georgia, serif;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    justify-content: center;

    -webkit-font-smoothing: antialiased;
}

nav {
    flex: 1 100%;
    background-color: var(--boja-dorotej-primarna);
    background: linear-gradient(90deg, black 0%, var(--boja-dorotej-primarna-rgba) 50%, black 100%);
    color: white;
    box-shadow: 0 8px 8px -4px rgba(0, 0, 0, 0.4);
    margin: 0 0 10px 0;
}

nav.footer {
    box-shadow: 0 -8px 8px -4px rgba(0, 0, 0, 0.4);
    margin: 0;
}

.navigation {
    list-style: none;
    margin: 0;
    padding: 0 0 0 0px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    justify-content: center;
    justify-content: flex-start;
    /* height: 100px; */
    align-items: center;
}

.navigation li.home {
    font-size: x-large;
}

.navigation li.cyr_sites {
    flex-grow: 1;
    text-align: right;
}

.navigation li.cyr_sites a {
    float: right;
    margin: 0 10px;
}

.navigation li.guide {
    text-align: right;
}

.navigation li.hamburger {
    background: url('/slike/ikonice/menu_48dp_FFFFFF_FILL0_wght400_GRAD0_opsz48.svg') no-repeat right;
    visibility: hidden;
    visibility: visible;
    flex-grow: 1;
    text-align: right;
    margin: 0 10px;
    min-width: 48px;
    min-height: 48px;
    /* width: 0; */
}

.navigation li.hamburger:hover {
    background-image: url('/slike/ikonice/menu_48dp_DEB7FF_FILL0_wght400_GRAD0_opsz48.svg');
}

div#slidingMenu {
    /* visibility: visible;
    visibility: hidden; */
    height: 100%;
    width: 25%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    background-color: var(--boja-dorotej-primarna-podloga);
    box-shadow: -8px 0 8px -4px rgba(0, 0, 0, 0.4);
    display: flex;
    display: none;
    flex-flow: column wrap;
    transition: all 1000ms ease-in-out;

    opacity: 1;
    animation-name: fadeInOpacity;
    animation-iteration-count: 1;
    animation-timing-function: ease-in-out;
    animation-duration: 250ms;
}

@keyframes fadeInOpacity {
    0% {
        /* width: 0; */
        opacity: 0;
    }
}

div#slidingMenu .header {
    padding: 10px;
    float: right;
    text-align: end;
}

div#slidingMenu .header img:hover {
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

div#slidingMenu .header img:active {
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px inset;
}

div#slidingMenu .content {
    text-align: right;
    padding: 10px;
}

div#slidingMenu .content p {
    margin: 5px;
    line-height: 30px;
}

div#slidingMenu a {
    color: var(--boja-tekst-primarna);
    font-size: 1.5em;
    font-weight: bold;
    text-decoration-line: none;
}

div#slidingMenu a:hover {
    color: var(--boja-tekst-diskretno);
}

.navigation a {
    color: black;
    color: white;
    display: block;
    font-size: 1.5em;
    font-weight: bold;
    padding: 10px;
    text-decoration-line: none;
}

.navigation a:hover {
    color: white;
    color: var(--boja-dorotej-primarna-svetla);
}

a.logo {
    background: url('/slike/durbin/durbin_logo_48x48.svg') no-repeat center;
    min-width: 48px;
    min-height: 48px;
}

a.logo:hover {
    background-image: url(/slike/durbin/durbin_logo_hover_dorotej_primary_light_48x48.svg);
    transform: rotate(45deg);
}

footer {
    flex: 1 100%;
    /* background: var(--boja-grb-zuta-sekundarna-tamna);
    height: 300px;
    filter: blur(8px); */
}

main {
    flex: 1 100%;
    font-size: x-large;
    font-size: 18px;
    line-height: 40px;
    /* letter-spacing: 1px; */
    /* word-spacing: 2px; */
}

main button {
    font-family: "OrtoRNIDS", Georgia, serif;
}

h1,
h2,
h3,
h4 {
    color: var(--boja-h);
    margin: 20px 5px;
    padding: 5px;
    text-align: center;
    word-wrap: anywhere;
}

h2,
h3,
h4 {
    color: var(--boja-dorotej-primarna);
}

h3 {
    margin: 5px;
}

div.search {
    text-align: center;
    position: relative;
}

input.search {
    /* font-size: x-large; */
    /* font-size: 18px; */
    font-size: 1em;
    border-radius: 10px;
    border: solid 2px var(--boja-dorotej-primarna);
    height: 50px;
    width: 60%;
    max-width: 800px;
    margin: 5px;
    padding: 0 10px;
}

button.search {
    /* font-size: x-large; */
    /* font-size: 18px; */
    font-size: 1em;
    font-weight: bold;
    border-radius: 10px;
    border: solid 2px var(--boja-dorotej-primarna-tamna);
    border: solid 2px var(--boja-dorotej-primarna);
    background-color: var(--boja-dorotej-primarna-analogna-roza);
    background-color: var(--boja-dorotej-primarna);
    color: var(--boja-dorotej-primarna-tamna);
    color: white;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    box-shadow: 0px 2px 8px 1px var(--boja-senke-crna);
    min-width: 150px;
    height: 50px;
    margin: 5px;
    padding: 0 10px;
    vertical-align: top;
}

button.search:hover {
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    box-shadow: 0px 4px 8px 3px var(--boja-senke-crna);
    background-color: var(--boja-dorotej-primarna-analogna-roza);
    border: solid 2px var(--boja-dorotej-primarna-analogna-roza);
    cursor: pointer;
}

button.search:active {
    background-color: var(--boja-dorotej-primarna-analogna-roza);
}

div.search-results {
    margin: 20px 0;
    padding: 10px;
    overflow-wrap: anywhere;
    vertical-align: middle;
}

#numberOfResults, #duration {
    font-weight: bold;
    vertical-align: top;
}

li.rezultat {
    margin-bottom: 15px;
    /* display: flex;
    flex-flow: row wrap; */
}

a.veza,
p.link a {
    font-weight: bold;
    margin: 0 10px 0 0;
    /* flex: 1; */
    /* background-color: var(--boja-vostok-plava-svetla-rgb-0-3);
    border-radius: 5px;
    padding: 0 2px; */
    background-image: linear-gradient(var(--boja-vostok-plava-svetla-rgb-0-3), var(--boja-vostok-plava-svetla-rgb-0-3));
    /* background-color: var(--boja-a-hover); */
    background-position-x: 0;
    background-position-y: 100%;
    background-repeat: no-repeat;
    background-size: 0 0;
    transition: background-size .2s ease-in-out;
}

a.veza:hover,
p.link a:hover {
    background-size: 100% 2em;
    background-size: 100% 100%;
    color: var(--boja-sekundarna-tamna);
}

p.search-note {
    color: var(--boja-tekst-diskretno);
    font-size: 0.75em;
    font-size: 16px;
    margin: 0;
    padding: 10px;
    text-align: center;
    vertical-align: top;
    position: relative;
}

p.search-note img {
    vertical-align: text-bottom;
}

span.tag {
    border-radius: 5px;
    font-size: large;
    font-size: 16px;
    /* font-weight: bold; */
    margin: 0;
    padding: 4px 5px 2px 5px;

    margin: 0 0 0 5px;
    margin: 0;
    padding: 7px 5px 5px 5px;

    vertical-align: top;
}

span.tip {
    background-color: var(--boja-pozadina-napomena-diskretna);
    color: var(--boja-tekst-diskretno);
}

img.puls {
    visibility: visible;
    visibility: hidden;
    vertical-align: text-bottom;
}

img.emphasis {
    vertical-align: top;
}

span.number-of-results {
    background-color: var(--boja-pozadina-napomena-diskretna);
    border: solid 1px var(--boja-pozadina-napomena-diskretna-monohromatska);
    color: var(--boja-tekst-diskretno);
    color: var(--boja-zvezda-tekst);
}

span.cir-indeks {
    background-color: #0087eb;
    background-color: var(--boja-enigmatri-zuta);
    background-color: var(--boja-vostok-plava-svetla);
    border: solid 1px var(--boja-vostok-plava-svetla-monohromatska);
    color: var(--boja-tekst-diskretno);
    color: var(--boja-zvezda-tekst);
    /* color: var(--boja-tekst-primarna); */
    color: white;
    white-space: nowrap;
}

span.cir-indeks-vrednost {
    color: white;
    background-color: var(--boja-vostok-plava-tamna);
    background-color: var(--boja-dorotej-primarna);
    background-color: var(--boja-vostok-plava-svetla);
    margin: 0 0 0 5px;
}

span.naslov {
    background-color: var(--boja-dorotej-primarna-podloga);
    border: solid 1px var(--boja-dorotej-primarna-podloga-monohromatska);
    color: var(--boja-zvezda-tekst);
}

span.opis {
    background-color: var(--boja-dorotej-primarna-podloga);
    border: solid 1px var(--boja-dorotej-primarna-podloga-monohromatska);
    color: var(--boja-zvezda-tekst);
}

span.citat-teksta em {
    background-color: var(--boja-enigmatri-zuta);
    background-color: var(--boja-mokasin-analogna-2);
    background-color: var(--boja-dorotej-primarna-podloga);
    color: var(--boja-zvezda-tekst);
    border: 1px solid var(--boja-mokasin-analogna-2-monohromatska);
    border: 1px solid var(--boja-dorotej-primarna-podloga-monohromatska);

    font-weight: bold;
    border-radius: 5px;
    font-size: 16px;

    margin: 0;
    padding: 7px 5px 5px 5px;

    vertical-align: top;
}

ul.poduvlaka {
    list-style-type: none;
    list-style-position: inside;
    /* padding: 0 0 0 20px; */
    padding: 0;
    margin: 0 0 20px 0;
}

main p.link span.index {
    color: white;
    background-color: #0087eb;
    background-color: var(--boja-grb-zuta-sekundarna);
    background-color: var(--boja-dorotej-primarna);
    margin: 0 0 0 10px;
    padding: 0 5px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 5px;
}

main p.link span.meta {
    font-size: 18px;
    font-size: 16px;
    /* font-weight: bold; */
    line-height: 1em;
}

p {
    margin: 5px;
    padding: 5px;
    line-height: 40px;
    word-spacing: 2px;
    /* letter-spacing: 1px; */
}

a {
    color: var(--boja-a);
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

a:hover {
    color: var(--boja-a-hover);
    text-decoration: none;
}

.vertikalno-odstojanje-20 {
    height: 20px;
}

div.centralna-kolona {
    margin: auto;
    max-width: 1200px;
}

div.centralna-kolona h3 {
    text-align: left;
}

section.dve-kolone {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    padding: 0 10px;
}

section.dve-kolone div.kolona-1,
div.kolona-2 {
    flex: 1 40%;
    margin: 10px
}

section.dve-kolone div.prostor-za-tekst {
    border-radius: 40px;
    padding: 20px;
    margin: 0 0 20px 0;
    /* text-align: center; */
    word-wrap: anywhere;
}

.boja-dorotej-primarna-podloga {
    background-color: var(--boja-dorotej-primarna-podloga);
    color: var(--boja-tekst-primarna);
}

.boja-vostok-plava-svetla-rgb-0-3 {
    background-color: var(--boja-vostok-plava-svetla-rgb-0-3);
    color: var(--boja-tekst-primarna);
}

h3.regularni {
    text-align: left;
    color: var(--boja-tekst-primarna);
}

div.h40 {
    height: 40px;
}

@media all and (max-width: 400px) {
    div.prostor-za-link {
        padding: 50px;
    }
}

@media all and (max-width: 500px) {}

@media all and (max-width: 500px) {}

@media all and (max-width: 600px) {}

@media all and (max-width: 800px) {

    .navigation li.cyr_sites,
    .navigation li.guide {
        visibility: hidden;
        width: 0;
        height: 0;
    }

    .navigation li.hamburger {
        visibility: visible;
        min-width: 48px;
        padding: 0 10px;
    }

    div#slidingMenu {
        width: 50%;
    }

    input.search {
        width: 90%;
        margin-bottom: 10px;
    }

    section.dve-kolone div.kolona-1, div.kolona-2 {
        flex: 1 50%;
    }
}

@media all and (max-width: 1000px) {}

@media all and (min-width: 1000px) and (max-width: 1200px) {
    .converters .middle-column {
        flex: 1 15%;
    }
}

@media all and (min-width: 1200px) {}
