.flex-container2 {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;

}
.flex-container {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;

}


.flex-jedinice {
    margin-left:24px;
    padding-right:24px;
  flex: 1;
 overflow: auto; 
 overflow-y: scroll; 
 width:100%;
 height: calc(100vh - 120px); 
}

#flex-jedinice-panel {

 height: calc(100vh - 180px); 
}

#hronologija {
cursor:pointer;
display: var(--tango-hronologija1);
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 10px 24px;
gap: 10px;
height: 35px;
background: #EAEBEB;
border: 2px solid #D0D5D8;
}



#hronologija1a {
font-style: normal;
font-weight: 900;
font-size: 18px;
line-height: 18px;
leading-trim: both;
text-edge: cap;
display: flex;
align-items: center;
color: #26A5DD;
}

#hronologija1b {

font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-size: 18px;
line-height: 32px;
leading-trim: both;
text-edge: cap;
display: flex;
align-items: center;
letter-spacing: 0.02em;
color: #20212C;
}

#hronologija1c {
width:100%;
}

#hronologija1d {
font-style: normal;
font-weight: 900;
font-size: 18px;
line-height: 18px;
leading-trim: both;
text-edge: cap;
display: flex;
align-items: center;
color: #26A5DD;
}

#jedinice-datum {
margin-top:12px;
font-family: 'Playfair Display';
font-style: normal;
font-weight: 400;
font-size: var(--tango-hronologija5);
line-height: var(--tango-hronologija6);
leading-trim: both;
text-edge: cap;
color: #868A8D;
}

#jedinice-naziv {
max-width:calc(var(--tango-hronologija3a));
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-size: var(--tango-hronologija9);
line-height: var(--tango-hronologija10);
leading-trim: both;
text-edge: cap;
color: #20212C;
}



#jedinice-veliki-uvod {
    display: flex; 
    justify-content: space-between;
    align-items: flex-start;
margin-top:24px;

font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-size: var(--tango-hronologija7);
line-height: var(--tango-hronologija8);
leading-trim: both;
text-edge: cap;
letter-spacing: 0.02em;
color: #20212C;
  flex-direction: var(--tango-hronologija2);

}

#jedinice-staticni {
position: relative;
left: calc(100% - 210px);
top: 0px;
width:200px;
height:200px;
font-family: 'Playfair Display';
font-style: normal;
font-weight: 700;
font-size: 48px;
line-height: 48px;
leading-trim: both;
text-edge: cap;
color: #707394;
opacity: 0.4;
text-align: justify;

}
#jedinice-uvodx {
width:calc(90vw);
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-size: var(--tango-hronologija7);
line-height: var(--tango-hronologija8);
leading-trim: both;
text-edge: cap;
letter-spacing: 0.02em;
color: #20212C;
}

#jedinice-uvod {
width:calc(var(--tango-hronologija3));
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
margin-right:24px;
font-size: var(--tango-hronologija7);
line-height: var(--tango-hronologija8);
leading-trim: both;
text-edge: cap;
letter-spacing: 0.02em;
color: #20212C;
}

#jedinice-slika {
    margin-top:24px;
    margin-left:12px;
     margin-bottom:12px;
box-shadow: -10px -10px rgba(32, 33, 44, 0.8);
}
#jedinice-slika2 {
width:calc(var(--tango-hronologija4));

}