/** ten plik jest załączany we wszystkich branchach
za wyjątkiem festiwalowego!
 */

#vodplayer {position: absolute; top: 0; left: 0; width: 100%; height:100%;}
#vodplayer.play { background-color: #000; z-index: 2; }

.infoprawa .cont {white-space: nowrap; display: flex; align-items: center}
.infoprawa .czasi { float: left; margin-top: 0px;  height: 2em;  width: auto;  margin-right: 1.5em; }
.infoprawa .wesj { float: left; margin-top: 0px;  height: 1.6em;  width: auto;  margin-right: 1em;  }
.infoprawa .term { display: inline-block; color: #fff; max-width: 6em; white-space: normal; }
.infoprawa .term * {color: #fff; }



span.pakietico {
  display: inline-block; background-image: url(../nn/vod/../img/vod/pakiet.svg);
  width: 1em; height: 1em; background-size: contain; background-position: center center;
}
span.freeico {
  display: inline-block; background-image: url(../nn/vod/../img/free3.svg);
  width: 1em; height: 1em; background-size: contain; background-position: center center;
}


span.pakietico.black-light {
  background-image: url(../nn/vod/../img/vod/pakietc_light.svg);
}

.opis .linkzewkafel {display: flex; margin: 1em 0;}
.opis A.linkzewkafel {text-decoration: none }


.glownybutton {
  margin: auto; position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 15em;
  height: 13em;
  padding: 0.5em;
  box-sizing: border-box;
  z-index: 1;
  text-align: center;
}

span.karnetico {
  display: inline-block; background-image: url(../nn/vod/../img/vod/karnetc.svg);
  width: 0.6em; height: 0.8em; background-size: contain; margin-bottom: -0.10em;  margin-right: 0.4em;
}
span.koszykico {
  display: inline-block; background-image: url(../nn/vod/../img/koszykbialy.svg);
  width: 1em; height: 0.8em; background-size: contain; margin-bottom: -0.05em;  margin-right: 0.6em;
}
span.pakieticoc {
  display: inline-block; background-image: url(../nn/vod/../img/vod/pakietc.svg);
  width: 1em; height: 0.8em; background-size: contain; margin-bottom: -0.15em;  margin-right: 0.55em;
}


span.pakietico.c37 {font-size: 90%; background-image: url(../nn/vod/../img/vod/pakiet37.svg);  margin-bottom: -0.2em; margin-left: 0.1em   }

span.ico {display: inline-block; width: 1em; height: 1em; background-size: 100% auto; background-position: center center;}
span.ico.watch {background-image: url(../nn/vod/../img/vod/oko.svg);   }
span.ico.dostep {background-image: url(../nn/vod/../img/vod/dostep.svg);   }
body.nhfest span.ico.dostep {background-image: url(../nn/vod/../img/vod/onlineicon.svg);   }
span.ico.cancel {background-image: url(../nn/vod/../img/krzyzyk.svg) ; transition: transform 0.2s;  }
.film-indeks-boks .czolow .dodt .ico.cancel {background-size: 1em auto; width: 1em; height: 1em; margin-right: 1em}

.biletpopupkontent { padding: 1.5em 3em; min-width: 15em; max-width: 18em; margin-left: auto; margin-right: auto;}

.biletpopup .przycisk.zramka {color: #000; border: 2px solid #000;}
.biletpopup .przycisk.zramka:hover {color: #333; border-color: #333}

.glownybutton.zaloguj, .glownybutton.play, .glownybutton.kup {
  cursor: pointer;
}
.glownybutton .ico {
   display: inline-block;
   width: 7em; height: 7em;
   border-radius: 50%;
   border: 0.2em solid #fff;
   background-color: transparent;
   background-image: url(../nn/vod/../img/vod/play_trojkat.svg);
   background-size: 30% auto;
   background-position: center center;
   
   transition:  transform 0.2s; 
}
.glownybutton.play-later .ico {
   background-image: url(../nn/vod/../img/vod/play-later_trojkat.svg);
} 

.glownybutton.kup .ico {
   background-size: 26% auto;
  background-image: url(../nn/vod/../img/vod/buykosz.svg);  
  background-color: #fff; border-radius: 50%;
}
.glownybutton.play .play-action:hover .ico, .glownybutton.kup .play-action:hover  .ico {
   transform: translateZ(0) scale(1.05); 
}
.glownybutton .podp {
  margin-top:0.5em;
  display: block; text-align: center; color: #fff  
}
.glownybutton .podp.f5 {margin-top: 0.3em}

.glownybutton .podp + .podp {margin-top: 0.1em}
.glownybutton .podp.eptyt + .podp {margin-top: 0.4em}


.glownybutton .podp.zcena { }

.vod-box:not(.fotosa) .play {top: 46% }

.glownybutton .podp.wpakie  {display: flex; align-items: center; justify-content: center; margin-top: 0.5em }
.glownybutton .podp.wpakie .dostwp {font-size: 0.65em; margin-left: 0.6em}
.glownybutton .podp.wpakie .pakietico { font-size: 90%}

.glownybutton .podp.dostepny-od  {font-size: 0.65em; margin-top: 0.5em}

.shaka-play-button {padding: 5.5%}



.shaka-controls-button-panel .ustawienia-button { background-color: #fff;  color: #000;    padding: 0.4em 0.8em; margin-bottom: 0.6em;   margin-right: 1em; border-radius: 4px;  }
.wersja { content: "";}
.wersjamob {display: none}

#vodplayer:not([manifest-typ="main"]) .shaka-controls-container .glosujb {display: none !important;}


.shaka-controls-container .glosujb {font-size: 85%;  transition: opacity cubic-bezier(.4,0,.6,1) .6s; opacity: 0; position: absolute; top: 6%; left: 2%; z-index:5 ; background-color: transparent; cursor: pointer;}
.shaka-controls-container .glosujb * {font-family: 'PFHandbookProMedium', Arial, sans-serif !important;  } 
.shaka-controls-container .glosujb:hover {filter: none !important;}

.shaka-controls-container[shown=true] .glosujb, .shaka-controls-container[credits=true] .glosujb { opacity: 1}

#vodplayer .errord {
 padding: 2em; color: #fff; text-align: center; font-size: 1.7em;
}
#vodplayer .errord.sm { font-size :1.2em}

#vodplayer .errord a {
 color: #bbb;
}

#vodplayer .errord a:hover {
 color: #fff;
}

#vodplayer .upnext {
  position: absolute;
  bottom: 15%;
  right: 0px;
  padding-right: 0px;
  padding-left: 5%;
  transform: translateX(100%);
  transition: transform 0.5s;
}

#vodplayer .upnext .kf {display: flex; margin: 0.6em 0;}
#vodplayer .upnext .uil {display: block; overflow: hidden;    width: 9em;   }
#vodplayer .upnext .uil img {transition: transform .3s ease-in-out; display: block; object-fit: cover; width: 100%; height: 100%; opacity: 0.85} 
#vodplayer .upnext .udesc {font-size: 0.85em; display: block; background-color: #fff; box-sizing: border-box; 
padding: 0.8em 2em 1em 2em; width: calc(100% - 9em); color: #373737; max-width: 22em; min-width: 12em;
background-color: rgba(64,64,64,0.65);}
#vodplayer .upnext  .ulab, #vodplayer .upnext  .czas  {display: block;color: #fff }
#vodplayer .upnext .utyt {display: block;padding: 0.7em 0px;  }

#vodplayer .upnext .kf:hover .uil img {transform:scale(1.05)}
#vodplayer .upnext .us  {font-family: 'Roboto', Arial, sans-serif !important; color: #fff; font-size: 0.74em; letter-spacing: 0.08em;  }
#vodplayer .upnext .f5  {font-family: 'PFHandbookProMedium', Arial, sans-serif !important; color: #fff; }

#vodplayer .upnext.show { transform: translateX(0px); }
.shaka-controls-container {overflow: hidden; }

.text-tag {display: inline-flex; border: 1pt solid #fff; padding: 0px 0.7em 0px 0.7em; height: 1.9em;  line-height: normal;  font-size: 0.6em; letter-spacing: 0.08em;  align-items: center; align-content: center;     cursor: default }

.news-box.big-box .text-tags { position: absolute; left: calc(8% - 0.2em); top: calc(9% - 0.4em); display: inline-flex; gap: 0.8em; flex-wrap: nowrap; justify-content: flex-start;align-items: center;  }
.news-box.big-box .text-tag {color: #fff; border-width: 1px;  height: 2.4em; padding: 0px 0.7em 0px 0.7em; font-size: 0.6em;  }
.news-box.big-box .text-tag + .text-tag { margin-left: 0.2em }


.news-box.big-box .pak {display: inline-block; top: calc(9% - 0.2em); right: calc(8% - 0px); position: absolute; z-index: 12;}
.news-box.big-box .pak span {font-size: 1.2em}

.gwiazdkai {
  transition: transform 0.2s;
  width: 1em; height: 1em;  background-size: contain; background-position: center center;
  display: inline-block;
  background-color: transparent; cursor: pointer;
}
.gwiazdkai[data-ust='nie'] { background-image: url(../nn/vod/../img/vod/gwiazdkav.svg);}
.gwiazdkai[data-ust='tak'] {background-image: url(../nn/vod/../img/vod/gwiazdka_pel.svg); }
.gwiazdkai:hover {transform: rotate(72deg);}
.news-box.big-box .pak + .pak {  right: calc(8%  + 2em);}
.news-box.big-box .pak + .pak + .pak {  right: calc(8%  + 4em);}

.gwiazdkai.black[data-ust='nie'] { background-image: url(../nn/vod/../img/vod/gwiazdkab.svg);}
.gwiazdkai.black[data-ust='tak'] {background-image: url(../nn/vod/../img/vod/gwiazdkab_pel.svg); }


@media screen and (max-width: 1100px){
  #vodplayer .upnext .kf {font-size: 0.9}
}
@media screen and (max-width: 600px){
  #vodplayer .upnext .uil {width: 6em}
  #vodplayer .upnext .udesc { width: calc(100% - 6em)}
  #vodplayer .upnext  .czas {display: none}
  #vodplayer .upnext .utyt {padding-bottom: 0.2em; 
     display: -webkit-box;
   -webkit-line-clamp: 2; /* number of lines to show */
   -webkit-box-orient: vertical;}
}
@media screen and (max-width: 500px) {
  #vodplayer .upnext .kf {font-size: 0.8} 
}

.vod-film .related {padding-top: 2em; padding-bottom: 2em;}

.opis .related .tresc { padding-bottom: 0px;}

.opis .related h4 {margin-top: 0px; padding-top: 0px; padding-bottom: 0.8em} 
 


/** -------------------------------------------------------------------- */
/** vod oglądaj od, do */
.avail-tag {background-color: var(--availability-tlo1); display: inline-flex; border-radius: 1.3em;  color: var(--availability-tekst); 
  font-size: 0.9em; padding: 0.8em 1.5em; line-height: normal; font-weight: bold; align-items: baseline; }
.avail-tag.dost, .avail-tag.dost-do {background-color: var(--availability-tlo2); }
  
  
.infos .avail-tag, .bginfo .avail-tag {  color: var(--availability-tekst);  }
.tagi .avail-tag {height: auto;  padding: 0.3em 1.3em; font-size: 0.85em } 

.avail-tag.sm { padding: 0.3em 1em; font-size: 0.8em }  


@media screen and (max-width: 700px){
  .infos .avail-tag, .bginfo .avail-tag {  padding: 0.3em 1em; font-size: 0.8em  }
  .avail-tag .desk {display: none} 
}
@media screen and (min-width: 700.00001px){
  .avail-tag .mob {display: none}
}


/** -------------------------------------------------------------------- */



@media screen and (max-width: 1400px){
  .glownybutton .ico {width: 5em; height:5em;}
}

@media screen and (max-width: 1180px){
  

  .glownybutton.kup .ico { background-size: 35% auto}

}

@media (max-width: 550px) {
 
  .biletpopupkontent {padding-left: 0px; padding-right: 0px}
  
  .vod-film .related {padding-top:1em; padding-bottom: 1em;}
  .kafel-zplay .linkil:after { opacity: 1;  background-size: 2em 2em; } 
}


/** ---------------------------------------------------- */
/** ------------------ INDEKS -------------------------- */



/** vod indeks */
.marg-indeks {padding-left: 10%; padding-top: 5%}
@media (max-width: 800px) {
 .marg-indeks {padding-left: 0px}
}
.vod-indeks .nice-select, .vod-indeks .szukajinput {border: 2px solid #000; background-color: transparent;}
.vod-indeks .szukajinput + button {background-color: #eee;}

.vod-indeks .szc {margin-right: 1em}
.vod-indeks .szukaj .lupa {background-size: 1.45em auto;  width: 1.45em; height: 1.45em;}
.vod-indeks .szukaj  .szukajinput {padding-right: 2.7em}
.vod-indeks .szukaj .nice-select.szc, .vod-indeks .szukaj .nice-select.szc .list,  .vod-indeks .szukajinput,.vod-indeks .szukaj-cont  {width: 17em; min-width: 17em}

.vod-indeks input:-webkit-autofill, .vod-indeks input:-webkit-autofill:hover, .vod-indeks input:-webkit-autofill:focus, .vod-indeks input:-webkit-autofill:active {-webkit-box-shadow: 0 0 0px 1000px #eee inset;}


.vod-indeks .marginesy {padding-top: 2.5em}
.vod-indeks .nice-select {height: auto}
.vod-indeks .szukaj {display: flex; align-items: stretch;}
.vod-indeks .szukaj-cont {position: relative;}
.vod-indeks .szukaj-cont .szukajinput {height: 100%}
.vod-indeks .rec-count {padding: 2em 0px 2em 0px;}
.vod-indeks .szukaj .list li[data-value="k"] { xborder-top: 1px solid #000 }
.vod-indeks .szukaj .list li[data-value="g"] { margin-bottom: 1em; position: relative; }
.vod-indeks .szukaj .list li[data-value="g"]:after {
  content: " "; display: block; position: absolute; bottom: -0.4em; left: 0px; width: 100%;  border-bottom: 1px solid #000;
}
.vod-indeks .szukaj .gwiazd { display: inline-block; background-image: url(../nn/vod/../img/vod/gwiazdkab.svg); width: 1em; height: 1em; background-size: contain; margin-left: 0.4em; margin-bottom: -0.2em}

.film-indeks-boks {display: flex; margin-top: 2%; margin-bottom: calc(1em + 5%)}
.film-indeks-boks .il {margin-right: min(10%, 4em); overflow: hidden; }
.film-indeks-boks .il-img {transition: transform 0.2s;  display: inline-block; background-position: center; background-size: cover;}
.film-indeks-boks .il, .film-indeks-boks .il-img {width: 8.7em; height: 5.85em; min-width: 8.7em  } 
.film-indeks-boks:hover .il-img {transform:  translateZ(0)  scale(1.04)}
.film-indeks-boks .czolow { margin-top: 1.5em}
.film-indeks-boks .czolow .r {display: block; padding: 0.1em 0px; color: #000}

.film-indeks-boks .czolow .dodt {display: flex; padding: 1.3em 0px 0.1em 0px; color: #000; align-items: center; }
.film-indeks-boks .czolow .dodt + .dodt {padding-top:0.4em}
.film-indeks-boks .czolow .dodt .ico {width: 2em; background-position: left center; background-size: 1.2em auto; height: 1.5em }
.film-indeks-boks .czolow .dodt.anuluj { cursor:pointer;  }
.film-indeks-boks .czolow .dodt.anuluj:hover .ico.cancel { transform: rotate(45deg); xtransform-origin: 0.5em 50%;  }


.film-indeks-boks .czolow .avail-tag  { margin-top:0.7em}


.film-indeks-boks .text-tag {border-color: #121212; padding: 0px 0.9em 0px 0.9em; height: 2.15em; border-width: 1pt; color: #121212; font-size: 0.5em ;margin-left: 0.7rem; }
.film-indeks-boks .pakietico {margin-left: 0.7rem; font-size: 1.33em; }
.film-indeks-boks .pakietico.empt {margin-left: 0px; width: 0.5px; background: none;}
.film-indeks-boks .gwiazdkai {margin-left: 0.7rem; font-size: 1.3em;  }
.film-indeks-boks .ty {margin-right: 0.3em}
.film-indeks-boks .ty-ikony {display: inline-flex;  align-items: center; transform: translateY(0.23em)}
.film-indeks-boks .op {max-width: 27em}
.nhvod:not(.kdvod) .film-indeks-boks .grupawiek.text-tag, .nhvod:not(.kdvod) .film-indeks-boks .limit.text-tag  {display: none}

@media (max-width: 600px) {
  .vod-indeks .marginesy {padding-top: 1.5em}
 .film-indeks-boks .il {font-size: 80%}
 .film-indeks-boks .il {margin-right: 2.5em }
 .film-indeks-boks .czolow {margin-top: 0.5em }
 .vod-indeks .szukaj {flex-direction: column; align-items: flex-start;}
 .vod-indeks .szc {margin-right: 0px;}
 .vod-indeks .szukaj-cont {height: 3.42em;margin-top: 0.8em }
 .vod-indeks .szukaj-cont, .vod-indeks .nice-select {height :3.7em}
 .vod-indeks .nice-select {line-height: 3.7em}
 .vod-indeks .szukaj  .szukajinput {padding-right: 3em}
 .film-indeks-boks .czolow .r {padding: 0.07em 0px; line-height: 1.4 }
 .vod-indeks .szukaj .nice-select.szc, .vod-indeks .szukaj .nice-select.szc .list,  .vod-indeks .szukajinput , .vod-indeks .szukaj-cont  {width: 100%; max-width: 25em}
 .film-indeks-boks .czolow .dodt {padding-top: 0.6em}
 .film-indeks-boks .czolow .dodt + .dodt {padding-top:0.2em}
}
@media (max-width: 420px) {
 .film-indeks-boks .il {font-size: 60%}
}

/** ten plik jest załączany we wszystkich branchach
za wyjątkiem festiwalowego, bo styles.css
 */
html {
   --przyciski-koszyka: #121212;
   --przyciski-koszyka-hover: #444;
  --field-radius: 0.3em;
  --round-button-radius: var(--field-radius);
  --round-button-radius-with-arrow: var(--field-radius);
  --round-button-on-bar: var(--field-radius);
}
.submobile > a, nav.mobile > a {
  margin: 0.1em 0px;
  padding: 0.6em 0px;
  xfont-size: 1.3em
}

nav.mobile .soc a.nhvod {margin-top: 1em}
nav.mobile .soc a.kdvod {width: auto; order: 5; margin-top: 1.5em }


.ilustracja.full.zopisem, .ilustracja.zopisem {background-color: #000}

header .zalogowany .punkty.onsite {display: none}
header .zalogowany .punkty.vod {padding-left: 0.7em}
.profiluz .wi.maszkarnet.onsite {display: none}

.logosponsora, nav.mobile .mloga.logosponsora {display: none}

nav.desk {margin-left:0px}
.marginesy_jakheader {padding-left: 5%; padding-right: 5% }
.marginesy_fotosfilmu {padding-left: 5%; padding-right: 5%; margin-left: auto; box-sizing: content-box;  margin-right: auto;  max-width: 1500px }
@media screen and (min-width:1970px){
  .xmarginesy_fotosfilmu { max-width: 1500px }  
}

@media screen and (min-width:1670px){
  body:not(.kasjer) .marginesy_jakheader {padding-left: calc(50% - 750px); padding-right: calc(50% - 750px) }
  
}
@media screen and (min-width:2070px){
  body.kasjer .marginesy_jakheader {padding-left: calc(50% - 750px); padding-right: calc(50% - 750px) }
}




.czol { padding-top: 1em; padding-bottom: 0.2em}
.czol .nag {font-size: 0.85em; line-height: 1.4em;}

.vod-film .ilustracja .caption h1 {max-width: 37%; max-width: calc(50% - 10rem);}
.vod-film .ilustracja .caption .tekst {  max-width: calc(50% - 8rem);}

.czol_i_info {display: flex; flex-wrap: nowrap;justify-content: space-between; }
.czol_i_info .infoprawa {align-self: flex-end; white-space: nowrap;}

.cykle-kafle {margin-top: 2em; display: flex; align-items: stretch; align-content: stretch;}
.cykle-kafle A {padding: 0.1em 1em 0px 1em;  display: inline-flex;  text-align: center;  align-items: center;  line-height: 1em;  height: 2em; }
.tagi {margin-bottom: 8em; margin-bottom: min(8em,11vh); margin-top: 4em; margin-top: max(2.5em, min(4em,4vw)); display: flex; align-content: flex-start;}
.cykle-kafle .text-tag {height: auto; margin-left: 1em; padding-left: 0.7em; padding-right: 0.7em; font-size: 0.86em;} 


.czol_i_info .infoprawa .cl {display: inline-block;}
.czol_i_info .infoprawa .cl.ps1 {margin-right: 5em;} 

.vod-film .ilustracja.zopisem .caption {padding-bottom: max(2.8em, min(5em,6vw));}
.cykle-kafle A {color: #000}

.cykle-list { margin-top: 1.3em; display: flex; align-items: stretch; align-content: stretch; column-gap: 0.6em; row-gap: 0.4em; flex-wrap: wrap; }
.cykle-list .ck {border: 1px solid #fff; border-radius: 1.3em;  color: #fff;
  font-size: 0.85em; padding: 0.6em 1.3em; line-height: normal; display: inline-flex; flex-wrap: nowrap; white-space: nowrap ;}
  


/** -------------------------------------------------------------------- */

/** vod branch */

.infos { position: relative;  padding-top: min(15em, 22vh);   padding-bottom: min(5em,10vh); display: flex; justify-content: space-between; align-items: flex-end;}
.infos * {color: #fff; }
.infos .branchinfo {max-width: 25em }
.infos .branchinfo .tekst p {line-height: 1.4}
.infos .branchinfo .tekst {padding-bottom: 1em}
.infos .bginfo {max-width: 16em}

.infos .bginfo .pd { display : block; font-size: 0.8em; margin-bottom: 1em }
.infos .bginfo .morelink { display: block}
.infos .bginfo:hover .morelink { background-position: 0 center;  padding-left: 4.1em; }

.vod-branch.kaflesekcje .big-box .caption {height: 82%;}
.vod-branch .big-box .caption .h {padding: 0px 0.2em; color:var(--prawieczarny);    display: inline;}



.vod-branch .big-box .caption .h.over {color:var(--prawieczarny);  box-shadow: 0 0 0 0.2em transparent;  background-color: transparent; position: static; top: auto; left: auto;}

.vod-branch .big-box .caption.ukr-kol .h.over { color:var(--kolor-ukr-tekst) }
.vod-branch .big-box .caption.ukr-kol .h.back { background-color: var( --kolor-ukr-tlo );  box-shadow: 0 0 0 0.2em var(--kolor-ukr-tlo);  color: var( --kolor-ukr-tlo); }
    
.vod-branch.kaflesekcje { text-align:left; padding-top: 2em; padding-bottom: 4em }
.vod-branch.kaflesekcje h4 {padding-top: 2em; padding-bottom: 0.6em; margin-left: 1%}
.vod-branch.wyroznione.kaflesekcje h4, .vod-branch.wyroznione.kaflesekcje h4 a {color: #fff}
.vod-branch.kaflesekcje h4 a {display: inline;  position: relative; text-decoration: none }

.vod-branch.kaflesekcje h4 a:before {
  content: ""; position: absolute; width: 100%; height: 1pt; bottom: 1pt; left: 0; background-color: var(--header-color); 
  transition: transform 0.2s;  }
.vod-branch.kaflesekcje h4 a:hover:before {transform: translateY(0.1em); }
.vod-branch.wyroznione.kaflesekcje h4 a:before { background-color: #fff} 


.vod-branch.kaflesekcje h4:first-child {padding-top: 1em }

@media screen and (max-width: 1000px){
.infos {padding-top: 2.5em; flex-direction: column-reverse; align-items: flex-start; }
.infos .branchinfo {padding-top: 10em}
.infos .branchinfo .tekst {padding-bottom: 0px}
  
}
@media screen and (max-width: 700px){
  .infos .branchinfo {padding-top: 6em}

  }

@media screen and (max-width: 700px){
  .infos { padding-bottom: 2.5em; }
}
@media screen and (max-width: 450px) {
  .vod-branch.kaflesekcje {text-align: center}
  .vod-branch.kaflesekcje h4 {text-align: left;}
}
/** -------------------------------------------------------------------- */

.opis.vod-film {display: flex; flex-direction: column;}


.vod-film > div {order: 5 }
.vod-film .ilustracja {order: 0 }
.vod-film .seansecont {order: 1 }
.vod-film .related {order: 2 }
.vod-film.ha .seansecont {order:3 }
/** nie wiem po co to ?  .vod-film.nha .related {padding-bottom: 0}  */



.kafel-zplay .linkil, .kafel-zplay .uil {position: relative}
.kafel-zplay .linkil:after,  .kafel-zplay .uil:after {
  display: block; opacity: 0; content: "";
  position: absolute; top: 0px; left:0px; 
  width: 100%;
  height: 100%;
  background-image: url(../nn/vod/../img/vod/play.svg);
  background-size: 3em 3em; background-position: center center;
  transition: opacity 0.2s;
}
.kafel-zplay:hover .linkil:after, .kafel-zplay:hover .uil:after { opacity: 1; } 

@media screen and (max-width: 1200px){
  .czol_i_info .infoprawa .cl.ps1 {margin-right: 2.5em}
  
}

@media screen and (max-width: 1180px){
  
  .czol_i_info .infoprawa .sprzedaz {display: none}
  
  .czol_i_info .infoprawa {min-height: 2.2em; display: flex; align-items: center}
  
  .tagi {margin-bottom: 4em; }
    
  .vod-film .ilustracja .caption h1, .vod-film .ilustracja .caption .tekst    {max-width: 600px}
  .vod-film .ilustracja.zopisem .caption {padding-top:1em; xpadding-bottom: 3em}
  
  .czol .nag {font-size: 1em}
  .glownybutton {position: relative; transform: none; left: 0; right: 0;  top: 0; width: auto; margin: 0; text-align: left; height: auto; padding-left: 5% }
  .glownybutton {position: absolute; margin-top: 4%; width: 12em}
  .symbole-left-visible .glownybutton { margin-top: calc(4% + 3em); }
   
  .glownybutton .ico { width: 3.4em; height:3.4em; border-width: 0.15em; }
  .glownybutton .podp {text-align: left;}
  .glownybutton .podp.wpakie { justify-content: flex-start;}
  
  /** uwaga, symbole z lewego górnego rogu też muszą zejść niżej */
  
  
}
@media (max-width: 550px) {
 
  
  
  .czol_i_info {flex-direction: column;}
  .czol_i_info .infoprawa  {display: none}
  .czol_i_info .wersjamob {display: inline}
  .czol_i_info .infoprawa { align-self: flex-start; margin-top: 2em; margin-bottom: 0px}
  .tagi {margin-bottom: 3em; margin-top: 2.5em}

  .czol_i_info .infoprawa {white-space: normal;}
  .czol_i_info .infoprawa .ps2 { margin-top: 1.5em}
  
   
}

@media (max-width: 450px) {
  
.ilustracja  .glownametka span.dodm {visibility: hidden}
} 



/** ------------------------------------------------------ */
/** przeniesione z brancha nh */


.vod-film .tagi {display: flex; justify-content: space-between; align-items: flex-start; box-sizing: border-box; width: 100%; margin-bottom: 0px; margin-top: 4%; /** margin-top: max(2.5em, min(4em,4vw)); */}

.vod-film .tagi .symbole {}
.vod-film .tagi .symbole {display: flex; align-items: center; column-gap: 1.5em;  }
.vod-film .tagi .symbole.right { }
.vod-film .tagi .symbole span {height: 1.6em;}
.vod-film .tagi .symbole span.avail-tag {height: auto;}

.vod-film .tagi .symbole .gwiazdkai { width: 1.6em}


.vod-film.opis .ilustracja .grupa-wiekowa-legal {position: static; display: inline-block; }
.vod-film.opis .ilustracja .text-tag {color: #fff; height: 2.3em; margin-left: 0.3em;  padding-left: 1em; padding-right: 1em }
.vod-film.opis .ilustracja .text-tag + .text-tag { margin-left: 0.2em;}
.vod-film.opis .ilustracja .symbole span.pakietico { width: 1.6em }
.vod-film.opis .ilustracja .symbole span.freeico { width: 1.6em }

.vod-film .info-dodatkowe.desk {position: static; align-self: flex-end;}
.vod-film .info-dodatkowe.desk .infod + .infod { margin-left: 2em}
.vod-film .info-dodatkowe.mobile {padding-top:0px; padding-bottom: 0px; }
.vod-film .info-dodatkowe.mobile .dod-wiersz {border-bottom: 1px solid #000; padding-top: 1.5em; padding-bottom: 1.5em}

.infod.objerzyjzwiast {background-size: auto 1.3em; padding-left: 2.5em}

.vod-film .ilustracja.zopisem { height: 39vw; min-height: 36em}
.vod-film .ilustracja.zopisem.wyzsze { height: 40vw; min-height: 40em}
@media (min-width: 1900px) {
   .vod-film .ilustracja.zopisem.wyzsze {min-height: 39em}
}
@media (max-width: 600px) {
  .vod-film .ilustracja.zopisem.wyzsze {min-height: 37em}
}


@media (max-width: 1980px) {
 .vod-film .ilustracja.wyzsze .swiper-button-prev, .vod-film .ilustracja.wyzsze .swiper-button-next {top: 45%}
 .vod-film.opis .fotosy .swiper-button-next, .vod-film.opis .fotosy .swiper-button-prev  {font-size: 80%}
}

.vod-film .ilustracja .overlay {position: absolute; top: 0px; left: 0px; height: 100%}

.vod-film .ilustracja .overlay {display: flex; flex-direction: column; justify-content: space-between; }
.vod-film .ilustracja.zopisem .caption {padding-top: 0px; padding-bottom: 0px; width: 100%;box-sizing: border-box; padding-bottom: 4.5%; }

.vod-film.opis .fotos {width: 100%; max-width: none}
.vod-film .ilustracja .overlay {z-index: 2; background-color:  rgba(0, 0, 0, 0.33)}
.vod-film.opis .fotos:after {display: none}
.vod-film.opis .swiper-container.fotosy .swiper-wrapper {opacity: 1; height: 100%}


@media (min-width: 1670px) {
  .vod-film .ilustracja.zopisem .caption { box-sizing: content-box;}
  .vod-film .tagi { box-sizing: content-box;}
  
}
@media (max-width: 750px) {
  .czol_i_info .wersjamob {display: inline; }
  .symbole-left-visible .glownybutton { margin-top: 5em}
  .glownybutton {margin-top: 2em}
  .vod-film .ilustracja.zopisem .caption {padding-bottom: 2em}
}


@media (max-width: 750px) {
 .vod-film .tagi {margin-top: 2em;}
}
html {
 /**
  --dluga-strzalka: url("../nn/vod/../../img/arrow_white_rightlong.svg");
  --magenta:  #5C2D91;
  --magentac: #5C2D91;
  --magentah: #4F267C;
  */
 }
 .soc a {background-position: right 3px}
  .soc a:hover {background-position: right 0px}

.fixhedlogo .img {
    background-image: url(../nn/vod/../img/vod/usinps.svg);
    background-size: auto 1.5em;
    max-height: 2em;
    height: 1.5em;
    width: 10em;
}
.fixhedlogo {padding-top: 0.50em;  padding-bottom: 0.50em;}

body.usinp header .nagl  { background-image: url(../nn/vod/../img/vod/usinp2021.svg); height: 4.5em }

.desk.soc {transform: none}


.seanspopup .stats {display : none}
.kasjer .ticketlist {padding-bottom: 0px}
.seanspopup .innes {display: none !important}
.seanspopup .innesll  {display: none !important}

.opis .seansecont {display: none}