.naziv { display: flex; justify-content: space-between; align-items: center; width: 100%; min-height: 2.5em;font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; font-size: 3em; font-weight: 400; line-height: 1; 
padding: 0.8em 0.5em; margin: 0 0 1.5em 0; border-radius: 10px; color: white; background-color: #9E9D9C; box-sizing: border-box; }
.cena { font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; font-size: 2.7em; min-height: 1.5em; font-weight: 900; color: #EC5212; margin: 0; padding: 0; }
.poruci { display: flex; align-items: center; justify-content: center; min-height: 1.3em;   padding:0.3em 1em 0.4em 1em; text-align:center; border-radius:10px; 
font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; font-size:2.3em; font-weight:800; 
color:#EC5212; background-color:#FFD37D; } .poruci:hover { background-color:#EC5212; color:#fff;  cursor: pointer; }
.free { width:100%; height: 2.5em; display:flex; justify-content:space-between; align-items:center; margin:0; padding: 0.75em; box-sizing:border-box; font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif;
font-size:1.5em; font-weight:400; line-height:1; color:#383030; background-color:#fff; opacity:0.6; border-radius:10px; overflow: hidden;}
.free img { display:block;height: 100%;width:auto; } 
.containerDucan  { display: block; width: 100%; height: auto; aspect-ratio: 16/9; padding: 0; overflow: hidden; border-radius: 10px; }
.containerDucan img {  display:block;width: 100%; height: 100%; aspect-ratio: 16/9;  object-fit: cover;  border-radius: 10px;}
.sliciceDucan  {width:100%;height:auto; display:block;  margin:1em 0 0 0; }
.kutijaSliiceDucan  {width: 100%; height: 7em;  overflow: hidden; padding: 0}

.scrollSliiceDucan  {     display: flex;  flex-wrap: nowrap; padding: 0.3em 0 0 0; overflow-x: auto;   gap: 1em;  height: 100%;   -webkit-overflow-scrolling: touch; }
.fotkaTreningDucan  {  will-change: transform;  flex: 0 0 auto; height: 100%; width: auto; margin: 0; border-radius: 7px; overflow: hidden;}
.fotkaTreningDucan img {display:block;height: 100%; width: auto; aspect-ratio: 16 / 9; border-radius: 7px;object-fit: cover}
.pagination-css {display: none;}  

.scrollSliiceDucan ::-webkit-scrollbar-thumb {
    border-radius: 10px;
    border: 3px solid white;
    background-color: #ec5212;
}

.scrollSliiceDucan ::-webkit-scrollbar-track {
    background-color: white;
    border-radius: 10px;
}
.scrollSliiceDucan  {
    scrollbar-width: 0.5em;
    scrollbar-color: #ec5212 white;
}


.kutijaPokloni {  display: flex; flex-wrap: wrap; align-items: stretch;  justify-content: center;  width: 100%; min-height: 3em;  padding: 0; gap: 2em;  position: relative; }

.naslovPokloni { font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; font-size: 2.2em; font-weight: 500; letter-spacing: 0.02em; line-height: 2; width: 100%; margin: 0; }

.pokloni{  width: calc((100% - 6em)/4);  will-change: transform;  }

.posterPoklon {background-color:white; position: relative; flex: 0 0 auto; width: 100%; height: auto;  margin: 0; padding: 0; border-radius: 10px; }

.vertikalnaDucan { display: flex; flex-direction: column; margin: 0; padding: 0;}
.fotkaPoklon { width: 100%;  height: auto;   aspect-ratio: 223 / 279; border-radius: 10px;  display: block; object-fit: cover; }
.tekstPoklon {letter-spacing: 0.04em;  padding: 0 ;font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; font-weight: 500; font-size: 1.8em;  line-height: 1;   margin:0 0 1.2em 0; text-align: center;   display: block;  }



.kutijaNaPolaConteiner { display: block; width: calc(100% - 13.4rem); min-height: 40vh; height: auto; margin: 2rem 6.7rem; padding: 0; overflow: hidden; border-radius: 10px; }
.kutijaNaPola { display: flex; flex-direction: row; gap: 2em; width: auto; height: auto; margin: 0; padding: 0;}

.levaStranaIgraonica { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; width: 50%; margin: 0; padding: 0; overflow: hidden; border-radius: 10px; text-align: left; }
.containerIgraonica { display: block; width: 100%; height: auto; padding: 0; overflow: hidden; border-radius: 10px; }
.desnaStrana { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; width: 50%; margin: 0; padding: 2em; background-color: #F6F0E5; border-radius: 10px; text-align: left; }

.nazivIgrice { width: 100%;  height: auto;margin:0; padding:0; font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; font-size:3.6em; font-weight:900; letter-spacing:0.02em; line-height:1.6; 
color:#3658D3; }
.poruciIgraonica { all: unset; display: flex; align-items: center; justify-content: center; height: auto;   margin-top: auto;
  margin-bottom: auto; padding:0.4em 1em 0.5em 1em; text-align:center; border-radius:10px; font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; font-size:2.4em; font-weight:900; 
background-color: #3658D3; color: white;} .poruciIgraonica:hover {background-color: #EC5212;}
.colorUvod { display: block; box-sizing: border-box; width: 100%;  background-color:#3658D3; color:#fff; padding:1em; border-radius:10px; 
font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; min-height: 12em; height: auto; font-size:1.6em; font-weight:300; letter-spacing:0.06em; 
line-height:1.6; font-size-adjust: 0.5;  }

.tab { display:flex; flex-wrap:nowrap; align-items:stretch; margin: 0 0 2em 0; height:auto; overflow-x:auto; }
.tab button { display:flex; justify-content:center; align-items:center; float:left;  width: fit-content;  margin: 0 1em 0 0; padding:0.5em 1em; border:none; border-radius:10px; white-space: nowrap;
font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif;  font-size:1.47em; font-weight:700; letter-spacing:0.06em; text-align:center; color:white; background-color:#707070; }
.tab button:hover { background-color: #70A2E1; } .tab button.active {background-color:  #3658D3; }
.tabcontent { display:none; margin: 1em 0;}
.tabNaslov {  letter-spacing: 0.02em; line-height: 1.5; margin: 0 0 0.35em 0; }
ul, ol { padding:0; margin: 0 0 0.5em 0 ;  } ul li, ol li { margin:0.2em 0 0.2em 2em; } 
 .igraonicaTekst {font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; font-size: 1.8em; font-weight: 300; letter-spacing: 0.06em; line-height: 1.6;  width: 100%; padding: 0; }





.kutijaTab, .kutija, .kutijaZuta { display: block; box-sizing: border-box; width: calc(100% - 13.4rem); min-height: 5rem; margin: 2rem 6.7rem 6.7rem 6.7rem; padding: 2rem; 
overflow: hidden; background-color: #F6F0E5; border-radius: 10px; }

.kutijaZuta { background-color: #FFD37D; }
.posterCitaonica:hover, .slide:hover, .posterIgraonica:hover, .pokloni:hover, .fotkaTreningDucan:hover { transform: translateY(-5px); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2); transition: 0.3s;}

.kutijaIgraonica, .kutijaCitaonica, .gallery-track { display: flex; flex-wrap: wrap; width: 100%; gap: 2em; padding: 0; position: relative; flex-direction:row; align-items: stretch;}
.posterIgraonica { will-change: transform; display: block; overflow: hidden; height:auto; width: calc(50% - 1em);  background-color: white; padding: 1em; margin: 0; border-radius:10px; box-sizing: border-box; }
.sveIgraonica { display: flex; flex-direction: row; width: 100%;  }
.sveCitaonica { display: flex; flex-direction: column; width: 100%;  }
.sveFotkaIgraonica { position: relative; display: block; width: 20%; height:auto; aspect-ratio: 1/1; overflow:hidden }
.fotkaIgraonica { display: block; width: auto;  height: 100%; padding: 0; margin: 0; aspect-ratio: 1 / 1; object-fit: cover;  border-radius:10px;}
.sveTekstIgraonica { display: flex; align-items: center; width: 80%; }
.sveTekst { display: flex; flex-direction: row; align-items: center;  width: 100%;}
.tekstIgraonica {  padding: 0 1em; text-align: left; gap: 1em; white-space: nowrap; font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif;  letter-spacing: 0.035em; font-size: 1.55em; font-weight: 500; line-height: 1; }
.play {height: 0.95em; aspect-ratio: 1/1.32; padding: 0; margin: 0;}

.posterCitaonica {display: block;  will-change: transform; overflow: hidden; height:auto; width: calc(25% - 1.5em);  background-color: white; padding: 1em; margin: 0; border-radius:10px; box-sizing: border-box; }
.sveCitaonica { display: flex; flex-direction: column; width: 100%;  }
.sveFotkaCitaonica { position: relative; display: block; width: 100%; height:auto; aspect-ratio: 16/9; overflow:hidden ; border-radius:10px;}
.fotkaCitaonica, .fotkaDucan{ display: block; width: auto;  height: 100%; padding: 0; margin: 0; aspect-ratio: 16 / 9; object-fit: cover;  border-radius:10px;}
.sveTekstCitaonica { display: flex;  flex-direction: column;  width: 100%; }
.tekstCitaonica {font-family: "Roboto", sans-serif;  min-height: 1em;  margin: 1.2em 0 0.6em 0;  padding: 0; font-size: 1.15em;  letter-spacing: 0.05em; font-weight: 700; line-height: 1; }
.naslovCitaonica {font-family: "Roboto", sans-serif; min-height: 1.5em;  white-space: normal; word-wrap: break-word; word-break: break-word; font-size: 1.65em; margin: 0;  color: #231D1D;  letter-spacing: 0.028em; 
    padding: 0; margin: 0 0 0.5em 0; line-height: 1.3;  flex-shrink: 0; letter-spacing: 0.02em;font-weight: 300;}
.obavestenje, .obavestenjeDucan { font-family: "Roboto", sans-serif;  position: absolute; min-height: 1.2em;  top: .3em; left: .3em;   padding: 0.5em 0.95em 0.5em 0.95em;  background-color: #ec5212;  border-radius: 8px; z-index: 2;
    color: #fff; font-size: 1.1em;  font-weight: 700;  letter-spacing: 0.06em; line-height: 1; }
    
.scroll-gallery {box-sizing: border-box;  width: 100%; margin: 0 ;  padding: 0 ;  }
.slide { will-change: transform; flex: 0 0 auto;   width: calc(25% - 1.5em);  background-color: white;  border-radius: 10px; margin: 0; box-sizing: border-box; padding: 0;}
.posterDucan { width: 100%; height:100%; margin: 0; padding: 1em;  background-color: #fff;  border-radius: 10px; overflow:hidden;  box-sizing: border-box; display: block;  } 
.pagination-dots {  display: none;}
.naslovDucan {font-family: "Roboto", sans-serif; min-height: 1.5em;  white-space: normal;  word-wrap: break-word; word-break: break-word;  font-size: 1.65em;  margin: 0;  color: #383030;  
letter-spacing: 0.028em;  padding: 1em 0 ; font-weight: 400; line-height: 1.3; letter-spacing: 0.02em;  flex-shrink: 0; }
.tekstDucan {font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; min-height: 1em;  margin: 0; letter-spacing: 0.03em;  padding: 0.7em;  width:100%; font-size: 1.5em;  font-weight: 700;  color: white;  text-align: center;
background-color: #ec5212;  border-radius: 10px;   }
.tekstDucan:hover { background-color: #ffd37d; color: #ec5212;}
.pagination-css {display: none;}      
    
.kutijaTekst { display: block; box-sizing: border-box; width: calc(100% - 13.4rem); min-height: 10rem; height: auto; margin: 0 6.7rem 2rem 6.7rem; padding: 2rem 0 1rem 0;  border-radius: 10px;}
.naslov { width: 100%;font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif;font-size: 3.3em; font-weight: 900; letter-spacing: 0.02em; line-height: 1.2; width: 100%; margin: 0; padding: 0 0 0.5em 0; }
.tekst {width: 100%; font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif;font-size: 1.8em; font-weight: 200; letter-spacing: 0.06em; line-height: 1.6;  width: 100%; padding: 0; }
  
.naslov3 { width: 100%;font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif; font-size: 2.4em; font-weight: 500; letter-spacing: 0.02em; line-height: 1.3; width: 100%; margin: 0.5em 0; }
.tekst3 { width: 100%;font-family: "Nunito", "Segoe UI", Arial, system-ui, sans-serif;font-size: 1.8em; font-weight: 200; letter-spacing: 0.06em; line-height: 1.6;  width: 100%; padding: 0 0 1.3em 0; }


@media (max-width: 1000px) {
.naziv {  font-size: 1.8em; padding: 1em 0.5em; margin:  0; border-radius: 10px; }

.cena { font-size: 2em; padding: 0.75em 0;}

.poruci {  padding:0.3em 1em 0.4em 1em; margin:0 0 0.75em 0; border-radius:10px; font-size:1.8em;  } 

.free { height: 2.3em;  margin:0; padding: 0.5em;  font-size:1.3em;  border-radius:10px; background-color: #F6F0E5;}

.containerDucan  { display:none; }
.sliciceDucan  {width:100%;height:auto; display:block; padding:0 ; margin: 0; border-radius: 10px; }
.kutijaSliiceDucan  {width: 100%; height: auto; aspect-ratio: 16/9;  overflow: hidden; padding:0 ; margin: 0;border-radius: 10px;}
.scrollSliiceDucan  {  display: flex;  flex-wrap: nowrap; overflow-x: auto;  scroll-snap-type: x mandatory; gap: 1em; height: 100%;  -webkit-overflow-scrolling: touch;  padding: 0 0 0.35em 0;}
.fotkaTreningDucan  {  flex: 0 0 auto; height: auto; width: 100%; scroll-snap-align: center; border-radius: 10px;}
.pagination-dots {  display: flex; height: auto; justify-content: center;  padding: 1.15em 0 0.5em 0;}
.pagination-dots .dot {  width: 0.65em;  height: 0.65em;  margin: 0 0.5em;  background:#F6F0E5;  border-radius: 50%;  cursor: pointer;}
.pagination-dots .dot.active {  background: #ec5212;}
.scrollSliiceDucan ::-webkit-scrollbar-thumb {  background-color:  white; }
.scrollSliiceDucan  {  scrollbar-color: white white; }   
  
  
    
    
.kutijaPokloni {   padding: 0; gap: 1rem;  }

.naslovPokloni {  font-size: 1.45em; line-height: 1.3; letter-spacing: 0.03em;; }

.pokloni{  width: calc((100% - 1em)/2); }

.posterPoklon {background-color:white; position: relative; flex: 0 0 auto; width: 100%; height: auto;  margin: 0; padding: 0; border-radius: 10px; }

.vertikalnaDucan { display: flex; flex-direction: column; margin: 0; padding: 0;}

.fotkaPoklon {    width: 100%;  height: auto;  border-radius: 10px;  display: block; object-fit: cover; }

.tekstPoklon {letter-spacing: 0.04em;    font-size: 1.1em;  line-height: 1;   margin:0.3em 0 1.2em 0; }    
    
    
    
    
    
.kutijaNaPolaConteiner { width: 100%; min-height: 60vh; height: auto; margin: 0 0 1rem 0; padding: 0 1rem; border-radius: 0;  }
.kutijaNaPola { display: flex; flex-direction: column;  gap: 1em; }
.levaStranaIgraonica { width: 100%; margin: 0 ; } 
.desnaStrana { width: 100%; padding: 0; margin: 0 ; background-color: white; border-radius: 0; }
.nazivIgrice { font-size: 2.5em; padding: 0; margin: 0; line-height:1; }
.poruciIgraonica {  font-size: 1.7em; min-height: 1em;  margin: 1em 0; padding: 0.5em 1em; border-radius: 7px; } 
  
.colorUvod { padding: 1.25em 1em;  font-size: 1.19em;  line-height:1.45; min-height:13em; }

.kutijaTab { width: 100%;  margin: 2rem 0 1rem 0; padding: 1.5rem 0 1rem 1rem;  border-radius: 0px;font-size: 1em; }

.tabcontent { display:none; margin: 0 1em 0 0;}

.tab { margin: 0 0 0.6em 0; }

.tab button { padding: 0.5em 1.1em; margin: 0 1em 0.5em 0; font-size: 1.1em; letter-spacing: 0.07em;  border-radius: 7px;  }

.tabNaslov {  letter-spacing: 0.04em; line-height: 1.5; margin: 0 0 0.35em 0; }

ul, ol { padding: 0; margin: 0 0 0.5em 1em; } ul li, ol li { margin: 0.15em 0 0 0; }

 .igraonicaTekst { font-size: 1.17em; letter-spacing: 0.06em; line-height: 1.45; padding: 0.5em 0 0.5em 0.3em; }
 
 
 
    
    
.kutija, .kutijaZuta { width: 100%; margin: 2rem 0; padding: 2rem 1rem; border-radius: 0; }
.posterCitaonica:hover, .slide:hover, .posterIgraonica:hover, .fotkaTreningDucan:hover { transform: none; box-shadow: none;  }
.kutijaIgraonica {  gap: 1em;  }
.kutijaCitaonica {  gap: 2em;  }
.posterCitaonica  { width: 100%;   padding: 0.75em;}
.posterIgraonica  { width: 100%;   padding: 0.5em;}
.sveFotkaIgraonica { width: 25%; border-radius: 7px; }
.sveFotkaCitaonica { border-radius: 7px; }
.fotkaIgraonica, .fotkaCitaonica, .fotkaDucan {  border-radius: 7px; }
.sveTekstIgraonica { width: 75%; }
.tekstIgraonica {font-size: 1.15em;  padding: 0 0.75em;}
.play { height: 0.7em;  }
.naslovCitaonica { font-size: 1.2em; margin: 0 0 0.75em 0.2em;  letter-spacing: 0.05em;  }
.tekstCitaonica {  margin: 1.2em 0 0.55em 0.2em; font-size: 0.95em; letter-spacing: 0.05em; }
.obavestenje{ top: 0.5em;  left: 0.5em; padding: 0.5em 1em; font-size: 0.8em;  border-radius: 7px; }

.slide { width: 100%;  margin: 0; }

.posterDucan { padding: 0.75em;}

.obavestenjeDucan { top: 0.5em;  left: 0.5em; padding: 0.5em 1em; font-size: 0.8em;  border-radius: 7px; }

.kutijaTekst { width: 100%; margin: 0 0 1rem 0; padding: 0 1rem; border-radius: 0;min-height: 6rem; }
.naslov { font-size: 2.2em; letter-spacing: 0.05em; line-height: 1.1; padding: 0; }
.tekst { font-size: 1.18em; letter-spacing: 0.07em; line-height: 1.5; padding: 0.5em 0 0.5em 0; }
.naslov3 { font-size: 1.45em; letter-spacing: 0.03em; line-height: 1.3; margin: 0 0 0.5em 0;}
.tekst3 { font-size: 1.18em; letter-spacing: 0.07em; line-height: 1.5;  font-weight: 300; padding: 0 0 1em 0;}
  }