html { font-size: 118.75%; }
/**przyjmujemy , że 1em =19px */
h1, h2, h3, h4, h5, h6, .f1, .f2, .f3, .f4, .f5, .f55, .f6, .hb , .f7, h0, .f0{
font-family: 'PFHandbookProMedium', Arial, sans-serif;
line-height: 1.1em;
text-rendering: geometricPrecision;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.hb {font-size: 126.32%; line-height: 130%}
h0, .f0 { font-size: 4em; line-height: 1em;}
h1, .f1 {
font-size: 57px;
font-size: 3em;
}
h2 , .f2 {
font-size: 47px;
font-size: 2.5em;
}
h3 , .f3 {
font-size: 35px;
font-size: 1.84em;
}
h4 , .f4 {
font-size: 30px;
font-size: 1.58em;
}
h5 , .f5 {
font-size: 24px;
font-size: 1.26em;
}
.f55 {
font-size: 21px;
font-size: 1.11em;
}
h6 , .f6, .f6 li {
font-size: 18px;
font-size: 0.95em;
}
.f7 {font-size: 15px; font-size: 0.79em}
.roboto-napis {
font-family: 'Roboto', sans-serif;
font-weight: normal;
}
.roboto-light {font-family: 'Roboto', sans-serif; font-weight: normal;font-size: 0.9em; xletter-spacing: 0.42px; line-height: 1.6 }
.roboto-head { letter-spacing: 1.4px; font-size: 14px; font-weight: 400; }
.roboto-napis {font-size: 11px; letter-spacing:1.6px; font-weight: 400; }
.roboto-napis-bigger { letter-spacing: 0.42px; font-size: 14px; }
.roboto-text {font-size: 16px; letter-spacing: 0.42px; line-height: 25.6px}
.roboto-text-em {font-size: 0.8421em; letter-spacing: 0.42px; line-height: 1.6}
.roboto-blabel { letter-spacing: 0.09em; font-size: 0.77em; font-weight: 500 }
.roboto-small { font-size: 11px; letter-spacing:0.85px; font-weight: 400; line-height: normal}
p.small, .small { font-size: 14px }
small {font-size: 0.7em }
@media screen and (min-width:1500px) {
html { font-size: 125% }
.roboto-head { letter-spacing: 0.1em; font-size: 0.74em; }
.roboto-napis { font-size: 0.632em; letter-spacing: 0.15em; }
p.small, .small { font-size: 0.74em }
}
@media screen and (max-width:840px){
h6.niezamale, .f6.niezamale {font-size: 18px}
.roboto-text {font-size: 14px;letter-spacing: 0.3px; line-height: 21px}
.xroboto-light {font-size: 16px}
h6 , .f6, .f6 li {
font-size: 17px;
xfont-size: 1.13em;
}
}
@media screen and (max-width:550px){
h6 , .f6, .f6 li {
font-size: 16px;
xfont-size: 1.13em;
}
.roboto-napis-bigger {line-height: 1.4}
}
@media screen and (max-width:400px){
/**przyjmujemy , że 1em =15px */
html { font-size: 94%; }
h1, .f1{
font-size: 2.5em;
}
H3, .f3 {font-size: 1.67em; }
h5, .f5 {
font-size: 1.25em;
}
h6 , .f6, .f6 li {
font-size: 15px;
xfont-size: 1.13em;
}
h6.niezamale, f6.niezamale {font-size: 18px}
}
/* Webfont: PFHandbookPro-Medium */
@font-face {
font-family: 'PFHandbookProMedium';
src: url('../nn/css/PFHandbookProWeb_Medium/PFHandbookPro-Medium.eot'); /* IE9 Compat Modes */
src: url('../nn/css/PFHandbookProWeb_Medium/PFHandbookPro-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../nn/css/PFHandbookProWeb_Medium/PFHandbookPro-Medium.woff') format('woff'), /* Modern Browsers */
url('../nn/css/PFHandbookProWeb_Medium/PFHandbookPro-Medium.svg#PFHandbookPro-Medium') format('svg'); /* Legacy iOS */
font-style: normal;
font-weight: normal;
font-display: block;
/** font-display: swap; */
}
html {
-webkit-tap-highlight-color:transparent;
/*--dluga-strzalka: url("../nn/css/../img/arrow_black_rightlong.svg");
--dluga-strzalka-black: url("../nn/css/../img/arrow_black_rightlong.svg");*/
--dluga-strzalka: url("../nn/css/../img/arrow_black_rl_thin.svg");
--dluga-strzalka-black: url("../nn/css/../img/arrow_black_rl_thin.svg");
--dluga-strzalka-mg: url("../nn/css/../img/arrowmagrightlong.svg");
--dluga-strzalka-white: url("../nn/css/../img/arrow_white_rightlong.svg");
--menu-strz: url(../nn/css/../img/menustrzblack.svg);
--kalend-bg: #FFE9E2;
/**--magenta-light: #333;
--magenta: #EC008C;
--magentac: #E20074;
--magentah: #333; hover */
--magenta: #000;
--magentac: #000;
--magentah: #292929;
--magenta-light: #333;
--kolor: #EC008C;
--kolorh: #E20074;
--tlo-filtrow: #fff;
--error: #EC008C;
--przyciski-koszyka: var(--magenta);
--przyciski-koszyka-hover: var(--magentah);
--text: #000;
--texth:#292929;
--dopisek: #000;
--prawieczarny: #121212;
--prawieczarny-hover: #292929;
--header-color: #000;
--dark-top-wh-hover: #eee;
--dark-top-wh: #fff;
--bs-success: #198754;
--bs-danger: #dc3545;
--bs-primary: #0d6efd;
--field-radius: 0.3em;
--round-button-radius: 2em;
--round-button-radius-with-arrow: 2em;
--round-button-on-bar: 3em;
--odstep-apla: 3.5em;
--odstep-apla2: 4.5em;
--morelinkfont: PFHandbookProMedium;
}
@media screen and (min-width:2000px) { html { --odstep-apla: 4em; --odstep-apla2: 5em; } }
@media screen and (max-width:800px) { html { --odstep-apla: 3em; --odstep-apla2: 4em; } }
body {
-webkit-text-size-adjust: none;
}
.text-success {color: var(--bs-success)}
.text-danger {color : var(--bs-danger) }
.text-primary {color: var(--bs-primary) }
.btn-success {background-color: var(--bs-success) !important }
.btn-success:hover {background-color: #136640 !important }
.btn-danger {background-color : var(--bs-danger) !important }
.btn-danger:hover {background-color : #CB2333 !important }
.btn-primary {background-color: var(--bs-primary) !important }
.btn-primary:hover {background-color: #025CE2 !important ;}
.btn {transition:background-color 0.2s;}
body.wait, body.wait A, body.wait A:-webkit-any-link, body.wait * { cursor: wait !important; }
body {
min-width: 320px;
margin:0;
padding:0;
font-family: Roboto, sans-serif;
xtext-rendering: optimizeLegibility;
text-rendering: geometricPrecision;
font-size: inherit;
line-height: inherit;
font-feature-settings: "kern" 1;
font-kerning: normal;
background-color: #eee; width: auto;
color: var(--text);
}
body:not(.nhvod) .only-nhvod { display: none}
body:not(.kdvod) .only-kdvod { display: none}
body:not(.nhfest) .only-nhfest { display: none}
body,td,table {color: var(--text); }
*, *:before, *:after { background-repeat: no-repeat;}
button:focus { outline: none; }
input::-moz-focus-inner { border: 0; }
a, a:hover, a:active, a:focus { outline: 0; }
.magenta {color: var(--magentac)}
.roboto {font-family: Roboto, sans-serif;}
div.e {color: var(--magentac); padding-bottom: 1.5em}
H1, H2, H3, h4, h5, h6, .f1, .f2, .f3, .f4, .f5, .f6 {color: var(--header-color); font-weight: 400; }
H1 A,H2 A, H3 A {color: inherit; font-size: inherit;}
H1, H2, H3, h4, h5, h6 {margin: 0px; padding: 0.4em 0px;}
h3.srodtytul {margin-top: 1.7em}
h4.srodtytul {margin-top: 1.7em}
h4.srodtytul.wysoki {margin-top: 2.5em}
h5.srodtytul {margin-top: 1.7em;line-height: 1.3}
h4.cytat {
background-image: url(../nn/css/../img/cytat.svg); background-position: 0px 0px; background-size: 0.7em auto;
display: block; padding: 1.3em 0px 0px 1.3em;
margin: 1.7em 0 1.5em 0;
line-height: 1.3
}
p.iczywieszze, p.inagroda, h5.iczywieszze, p.iglosowanie, .ievent-date {
display: block; position: relative;
padding-top: 4em; margin-top: 3em;
}
p.iczywieszze, p.inagroda, p.iglosowanie {font-size: 80%; }
h5.iczywieszze:before, p.iczywieszze:before, p.inagroda:before, p.iglosowanie:before, .ievent-date:before {
content: ""; position: absolute; top: 0px; left: 0px; width: 3em; height: 2.5em;
background-image: url(../nn/css/../img/czywieszze.svg); background-size: auto 2.5em; background-position: left top;
}
h5.iczywieszze:before { font-size: 70%}
h5.iczywieszze {padding-top: 3em; margin-top: 2.5em}
h5.iczywieszze + p {font-size: 80%}
p.inagroda, p.iglosowanie {padding-top: 3.8em; margin-top: 3.2em;}
p.inagroda:before, p.iglosowanie:before { height: 2.2em; background-size: auto 2.2em;}
p.inagroda:before {background-image: url(../nn/css/../img/opis_nagrody2.svg); }
p.iglosowanie:before {background-image: url(../nn/css/../img/opis_glos2.svg); }
.ievent-date:before {background-image: url(../nn/css/../img/event-date.svg); background-size: auto 1.2em }
.ievent-date {padding-top: 2.3em; margin-top: 2em;}
.tresc .text-tag {border-color: var(--text); color: var(--text); transform: translateY(-0.3em) }
.tresc h4 .text-tag, .tresc h5 .text-tag, .tresc h6 .text-tag, .tresc h3 .text-tag {height: 1.5em}
p.small.podpis, .small.podpis {margin-top: -0.4em}
p.small.podpis:not(:last-child), .small.podpis:not(:last-child) {margin-bottom: 2.5em; }
xP { margin-top: 0px; margin-bottom: 0px; padding-bottom: 1%; padding-top: 1%; }
p {line-height: inherit; font-size: inherit; margin: 1em 0px}
p, span, label { font-size: 1em; line-height: 1.6em }
p.l {line-height: 1.4em; font-size: 1.5em}
.f4 p {line-height: 1.3em}
.f5 p, p.f5 {line-height: 1.35em}
IMG.dwaipolrazazaduzy { zoom: 0.4; }
H3 + p:has(IMG) { margin-top: 1.5em}
strong, b {font-weight: 500}
.tlead, .tlead.opisowe {font-weight: 500}
INPUT, SELECT, textarea, input[type="text"] {
font-family: Roboto, sans-serif;
font-size: 1em ;
line-height: 120%;
color: #000000;
}
/** podpowiadanie w chrome */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
transition: background-color 5000s ease-in-out 0s;
-webkit-box-shadow: 0 0 0px 1000px #fff inset;
}
.strzalkaduza {display: inline-block; background-image: url(../nn/css/../img/strzalkaduzac.svg); width:5.8em; height: 2em; background-position: left center; background-size: 100% auto; }
XINPUT {font-size: 1em !important}
BUTTON, INPUT[type=submit] {border: none}
/**
:-placeholder {
color: inherit;
}
*/
/** różne hovery! */
A { text-decoration: none; color: var(--text);transition: color 0.2s }
A:hover { color: var(--text);}
/** wywalam stąd .tresc A:not(.no-bump), bo to za dużo! */
A.bump-underline, .with-link .link, .tresc li A, P A {
transition: text-underline-offset 0.2s; text-decoration-thickness: from-font; text-decoration-line: underline; text-underline-position: under; color: var(--text); text-underline-offset: -0.05em; }
A.bump-underline:hover, .with-link:hover .link, .tresc li A:hover, P A:hover {
color: currentcolor ; text-underline-offset: -0.15em }
/** undlink to ładny link, z podkreśleniem na hoverze, animowany */
a.undlink, H1 A {transition: text-decoration-color 0.2s; text-decoration: underline; text-underline-position: under; text-decoration-thickness: 1pt;
text-decoration-color: transparent; text-underline-offset: -0.05em; }
a.undlink:hover, H1 A:hover { color: currentcolor ; text-decoration-color: currentcolor ; }
a.bump { transition: transform 0.2s; color: var(--text);text-decoration: none; padding-bottom: 0.2em } /** ten padding jest tak naprawdę tylko dla selected, żeby było widać podkreślenie na apple i safari */
a.bump:not(.selected):hover {color: currentcolor ; transform: translateY(-0.13em); }
a.bump.selected { color: var(--text); text-decoration: underline; text-underline-position: under; text-underline-offset: 0.2em; text-decoration-thickness: 1pt; }
a.bump.fat.selected {text-decoration-thickness:1.5pt;}
.hover_und_anim {text-decoration: none; position: relative; color: var(--header-color);}
.hover_und_anim.fat {padding-bottom: 0.2em}
.hover_und_anim:after {content: ''; position: absolute; bottom: -1pt; left: 0; height: 1pt; width: 0%; border-top: 1pt solid var(--header-color); transition: 0.25s;}
.hover_und_anim.fat:after { border-top-width: 1.5pt; bottom: 0pt; height: 0px; }
.hover_und_anim.selected:after, .hover_und_anim:hover:after {width: 100%;}
.hover_und_anim:hover {color: var(--header-color);}
.hover_und_anim.mg, .hover_und_anim.mg:hover {color: var(--magentac)}
.hover_und_anim.mg:after {border-bottom-color: var(--magentac)}
.dark-top header .hover_und_anim.mg, .dark-top header .hover_und_anim.mg:hover {color: var(--dark-top-wh)}
.dark-top header .hover_und_anim.mg:after {border-bottom-color: var(--dark-top-wh)}
div.hrlight, p.hr, div.hr { height: 2px; background-color: #e0e0e0; margin: 8px 0px 8px 0px; padding: 0px; display: block; }
div.hrlight hr, div.hr hr { display: none; }
div.hrlight {margin: 20px 0px;}
HR {border: 0;height: 1pt;background: #a0a0a0;margin: 2em 0;}
HR.big { margin: 3em 0 2.5em 0;}
.tresc hr { margin: 3em 0; background-color: transparent;
background-image: linear-gradient(to right, black 20%, rgba(255,255,255,0) 0%);
background-position: bottom;
background-size: 0.5em 1pt;
background-repeat: repeat-x; }
ul {list-style-type: circle; margin-left: 0.1em; margin-right: 0px; padding-left: 1.2em; padding-right: 0px; }
ul li, ol li { margin-top: 1.2em; margin-bottom: 1.2em; line-height: 1.6 }
ol { margin-left: 1.5em; margin-right: 0px; padding-left: 0; padding-right: 0px; }
ol li {padding-left: 0.5em}
ul.sound {list-style-type: none; margin-left: 0px; padding-left: 0px}
ul.sound li {background-image: url(../nn/css/../img/sound.svg); background-size: auto 0.8em;padding-left: 1.8em; background-position: 0em 0.5em; background-repeat: no-repeat;}
ul.kreski {list-style-type: none; margin-left: 0px; padding-left: 0px}
ul.kreski li {background-image: url(../nn/css/../img/likreski2.svg); background-size: 1em auto;padding-left: 2.2em; background-position: 0em 0.8em; background-repeat: no-repeat;}
.tresc ul.kreski li A {text-decoration: none}
.tresc ul.kreski li A em, .tresc ul.kreski li A i {text-decoration: underline;}
/**.tresc ul.kreski li {transition: transform 0.2s;}
.tresc ul.kreski li:hover { transform: translateX(0.2em)*/
.nlc { text-transform: none; } /** no lower case - normal case */
.marginesy {margin-left: auto; margin-right: auto; max-width: 1300px; padding: 0 10%; }
.marginesy_szer {margin-left: auto; margin-right: auto; max-width: 1500px; padding: 0 5%; }
.marginesy_szer.wider {max-width: 1700px}
.marginesy_szer.for-scroll { }
.marginesy.niezwezaj {}
.marginesy_jakheader {padding-left: calc(5% - -1.50rem); margin-left: auto; margin-right: auto; max-width: 1500px; padding-right: 5%; }
/** ---------- galeria **/
.gallery-just-grid .capt { display: none}
.lg-container .lg-sub-html h4 {font-size: 1.3em; padding: 0.1em 0px; color: #fff; font-weight: normal;}
.gallery-just-grid { margin-top: 2.5em; margin-bottom: 2.5em}
section.glw { background-color: #eee}
.darker {
filter: brightness(60%);
-webkit-filter: brightness(60%);
-moz-filter: brightness(60%);
-o-filter: brightness(60%);
}
.morelink-frame { position: relative; display: inline-flex; padding: 0.8em 2.1em; border: 1pt solid var(--header-color); border-radius: var(--round-button-radius-with-arrow); }
.morelink-frame.nar {padding-left: 2em; padding-right: 2em}
.morelink-frame.to-left {padding-right: 3.8em}
.morelink {text-decoration: none; font-size: 0.95em; background-image: var(--dluga-strzalka);background-position: -1.5em center;
color: var(--header-color); font-family: var(--morelinkfont); padding-left: 2.5em; display: inline-block; overflow: hidden; background-size: auto 0.7em;
transition: padding-left .2s ease, background-position .2s ease; white-space: nowrap;
}
.morelink-frame:hover .morelink, .morelink:hover {background-position: 0em center; padding-left: 4.1em; color: var(--header-color); background-image: var(--dluga-strzalka);}
.morelink.black {color: var(--prawieczarny); background-image: var(--dluga-strzalka-black);}
.morelink.black:hover {color: var(--prawieczarny); }
a.s {text-decoration: none; background-image: var(--dluga-strzalka-black); background-position: -1.5em center; color: var(--text); padding-left: 2.5em; display: inline-block; overflow: hidden; background-size: auto 0.7em; transition: padding-left .2s ease, background-position .2s ease;}
a.s:hover {background-position: 0em center; padding-left: 4.1em; text-decoration: none; color: var(--text); }
a.s.right { background-position: right 0.2em center; background-image: url("../nn/css/../img/arrowmagrightm.svg");background-size: auto 0.5em; padding-left: 0px; padding-right: 2.5em }
a.s.right:hover {background-position: right center; padding-left: 0px; }
a.playi {text-decoration: none; background-image: url("../nn/css/../img/v2/pplaycz.svg"); background-position: right 0.1em center; color: var(--text);
padding-left: 0px; padding-right: 1.5em ; display: inline-block; overflow: hidden; background-size: 0.9em 0.9em ; transition: background-size .2s ease; }
a.playi.left {background-position: left 0.1em center;
padding-left: 1.5em; padding-right: 0px ; }
a.playi:hover { color: var(--text); text-decoration: none; background-size: 0.97em 0.97em;}
a.mapa { background-image: url('../nn/css/../img/v2/namapieb.svg'); text-decoration: none; background-position: left center; color: var(--header-color); padding-left: 1.6em; display: inline-block; overflow: hidden; background-size: auto 0.8em; transition: padding-left .2s ease, background-position .2s ease;}
a.mapa:hover {padding-left: 1.8em; text-decoration: none; color: var(--header-color);}
a.szarydziubek {transition: background-position 0.2s; text-decoration: none; display: inline-block; background-image: url("../nn/css/../img/dziubekszary.svg"); padding-right: 1.4em; background-position: right 0.2em center; background-size: auto 0.7em; background-position-y: 68% }
a.szarydziubek {background-image: url("../nn/css/../img/dziubekcz.svg"); color: var(--text);}
a.szarydziubek:hover {background-position: right center; background-position-y: 68% }
a.szarydziubek.small {background-position-y: 50% }
a.szarydziubek.small:hover {background-position-y: 50% }
a.rozwin { color: inherit; text-decoration: none; padding-right: 1.5em;
background-image: url(../nn/css/../img/dziubekdolcz.svg); background-size: auto 0.45em; background-position: right 0.3em; transition: all 0.2s;
}
a.rozwin:hover {background-position: right 0.45em;}
a.rozwin.zwin { background-image: url(../nn/css/../img/dziubekgoracz.svg); }
.glw-news-box {max-height: 870px; box-sizing: border-box; vertical-align: top; position: relative; background-color: #000; display: block; height: auto; overflow: hidden; }
.glw-news-box .il {opacity: 0.85; position: absolute; top: 0; bottom: 0; height: auto; width: 100%; background-color: #000; background-size: cover; background-position: center center; background-repeat: no-repeat; }
.glw-news-box:after { padding-top: 40%; display: block; content: ''; }
.glw-news-box .caption {left: 1.2%; right: 0; width: auto; color: #fff;
position: absolute; top: 50%; transform: translateY(-50%); }
.glw-news-box .caption .data { color: #fff; text-transform: uppercase;}
.glw-news-box .roboto-head { letter-spacing: 1.8px}
.glw-news-box .caption h1 {color: #fff; width: 60%; }
.glw-news-box .caption .morelink { color: #fff;font-size: 0.95em; background-image: var(--dluga-strzalka-white) }
.glw-news-box .caption:hover .morelink {background-position: 0em center; padding-left: 4.1em }
.glw-news-box.dlugi .caption h1 {width: 65%}
.glw-news-box.dlugi .caption {font-size: 95% }
.przyciski-bar { position: relative; margin: -3em auto 0 auto; text-align: center; }
.przyciski-bar .przyciski { overflow: hidden; box-sizing: border-box; position: relative; background: transparent; width: 100%; z-index: 2; padding: 0.2%; }
.przyciski-bar .przyciski a.mob-only {display: none}
.przyciski-bar .przyciski A {text-align: left; transition: background-color 0.2s; position: relative; width: 31.3333%; box-sizing:border-box; color: #fff; background-color: #fff; margin: 0 1%; vertical-align: middle; padding: 0px; padding-left: calc(1.5% + 1em);
display: inline-flex; align-items: center;border-radius: var(--round-button-on-bar); }
.przyciski-bar.dwa {max-width: 900px}
.przyciski-bar.dwa .przyciski A {width: 40%; max-width: 330px; padding-left: 10%; padding-left: calc(7.5% - -20px) }
.przyciski-bar .przyciski A:before { content: ''; display: inline-block; height: 105%; vertical-align: middle; }
.przyciski-bar .przyciski A:hover span.l { margin-left: 0.3em }
.przyciski-bar .przyciski A span.l {transition: margin-left 0.2s; color: inherit; display: inline-block; font-family: PFHandbookProMedium; display: inline-block; vertical-align: middle; color: var(--text); font-size: 1.15em; line-height: 1.2em; margin:0px; padding:0 }
.przyciski-bar .przyciski A span.cont { font-family: PFHandbookProMedium; font-size: 1.26em; line-height: 1.26em; }
.przyciski-bar .przyciski A {background-repeat: no-repeat; background-position:10% center; height: 5em }
.przyciski-bar .przyciski A span.i {display: inline-block; background-size: auto 1.7em ; background-repeat: no-repeat; width: 2em; height: 2em; background-position: center center; margin-right: 1em; }
.przyciski-bar .przyciski A.forum { background-image: url("../nn/css/../img/forum.svg"); background-size: auto 1em }
.przyciski-bar .przyciski A.muzyka { background-image: url("../nn/css/../img/muzyka.svg"); background-size: auto 1.5em }
.przyciski-bar .przyciski A.karnet { background-image: url("../nn/css/../img/karnet.svg"); background-position:13% center; background-size: auto 1.6em }
.przyciski-bar .przyciski A.bilety { background-image: url("../nn/css/../img/bilety.svg"); background-position:11% center; background-size: auto 1.29em }
.przyciski-bar .przyciski A.rezerwuj { background-image: url("../nn/css/../img/rezerwuj.svg"); background-position:12% center; background-size: auto 1.29em }
.przyciski-bar .przyciski A.kalendarz { background-image: url("../nn/css/../img/kalend.svg"); background-position:12% center; background-size: auto 1.29em }
.przyciski-bar .przyciski A.indeks { background-image: url("../nn/css/../img/indeks.svg"); background-position:12% center; background-size: auto 1.1em }
.przyciski-bar .przyciski A .i.wkinach { background-image: url("../nn/css/../img/wkinach2c.svg"); background-size: auto 1.29em }
.przyciski-bar .przyciski A .i.sponsoring { background-image: url("../nn/css/../img/sponsorc.svg"); background-size: auto 1.31em }
.przyciski-bar .przyciski A .i.karnet { background-image: url("../nn/css/../img/karnetc.svg"); background-size: auto 1.31em }
.przyciski-bar .przyciski A .i.czas { background-image: url("../nn/css/../img/v2/czasc.svg"); background-size: auto 1.7em }
.przyciski-bar .przyciski A.newsletter { background-image: url("../nn/css/../img/newsletter_przycisk.svg"); background-position:10% center; background-size: auto 1.6em }
.przyciski-bar .przyciski .dark { background-color: var(--prawieczarny) }
.przyciski-bar .przyciski A.dark span.l {color: #fff }
.przyciski-bar .przyciski A.dark .i.program { background-image: url("../nn/css/../img/v2/cykleff.svg"); }
.przyciski-bar .przyciski A.dark .i.bilety { background-image: url("../nn/css/../img/v2/biletw.svg"); }
.przyciski-bar .przyciski A.dark .i.kalendarz { background-image: url("../nn/css/../img/v2/kalendarw.svg"); background-size: auto 1.3em ; }
.przyciski-bar .przyciski A.dark .i.rezerwacje { background-image: url("../nn/css/../img/v2/bookingw.svg");background-size: auto 1.8em ; }
.przyciski-bar .przyciski A.dark .i.indeks { background-image: url("../nn/css/../img/v2/indeksw.svg"); background-size: auto 1.3em ; }
.przyciski-bar .przyciski A.dark .i.online { background-image: url("../nn/css/../img/v2/onlineiconw.svg"); background-size: auto 1.7em ; }
.przyciski-bar .przyciski A.dark .i.nagrody { background-image: url("../nn/css/../img/v2/nagrody.svg"); background-size: auto 1.55em; background-position-y: top ; }
.przyciski-bar .przyciski A.dark .i.wkinach { background-image: url("../nn/css/../img/v2/wkinach2.svg"); background-size: auto 1.4em }
.przyciski-bar .przyciski A.dark .i.entry { background-image: url("../nn/css/../img/v2/entry.svg"); background-size: auto 1.31em }
.przyciski-bar .przyciski A.dark .i.sponsoring { background-image: url("../nn/css/../img/v2/sponsor.svg"); background-size: auto 1.4em }
.przyciski-bar .przyciski A.dark .i.karnet { background-image: url("../nn/css/../img/v2/karnet.svg"); background-size: auto 1.31em }
.przyciski-bar .przyciski A.dark .i.sklep { background-image: url("../nn/css/../img/v2/sklep.svg"); background-size: auto 1.6em }
.przyciski-bar .przyciski A.dark .i.kontakt { background-image: url("../nn/css/../img/wazny_kontakt.svg"); background-size: auto 1.6em }
.przyciski-bar .przyciski A.dark .i.pobierz { background-image: url("../nn/css/../img/wazny_pobierz.svg"); background-size: auto 1.6em }
.przyciski-bar .przyciski A.dark .i.lista { background-image: url("../nn/css/../img/wazny_lista.svg"); background-size: auto 1.3em ; background-position-y: 60% ; }
.przyciski-bar .przyciski A .i.play { background-image: url("../nn/css/../img/v2/pplay.svg"); background-size: auto 1.7em }
.przyciski-bar .przyciski A.play-tlo { background-image: url("../nn/css/../img/nhvod_bt_tlo.svg"); background-position: 0px 0px; background-repeat: repeat; background-size: 18em auto;
background-color:var(--prawieczarny)
}
.przyciski-bar .przyciski A.play-tlo span { color: #fff; }
.przyciski-bar .przyciski A.czas { background-image: url("../nn/css/../img/v2/czasc.svg"); background-size: auto 1.7em }
.przyciski-bar .przyciski A.inactive {background-color: var(--tlo-filtrow); color: var(--prawieczarny)}
.przyciski-bar .przyciski A.inactive span { color: var(--prawieczarny)}
.przyciski-bar .przyciski A span.twolines {font-size: 1.05em}
.heder {text-transform: uppercase; display: block; text-align: center; color: var(--header-color); font-weight: 500;
margin-bottom: 2.1em}
.heder a { color: var(--header-color) }
.heder a:hover { color: var(--magentac)}
.news, .recenzje, .nazywo { padding-top: 2em; padding-bottom: var(--odstep-apla) }
.news, .recenzje { text-align: center}
.news {padding-top: 2em}
.glw + .news {padding-top: 6em}
.news.ogolne + .news.ogolne {padding-top: 0px; margin-top: -0.5em}
.nazywo.dzis {padding-top: 3.5em}
.gazeta + .news {padding-top: 2em}
.wkinach + .news {padding-top: 2em}
.wkinach, .wydarzenia-specjalne {padding-top: 3em; text-align: center; padding-bottom: 2em}
/* ======================================= pasek dni ============================= */
.pasekdnicont {
background-color: #ffffff; padding-top: 6em ; padding-bottom: 3.3em; text-transform: lowercase;
margin-top: -3em; text-align: center;
}
section.pasekdnicont .hed { margin: 0px 0px 2.5em 0px; text-transform: uppercase; text-align: left; transition: margin-left 0.2s }
section.pasekdnicont .hed:hover { margin-left: 0.4em}
.pasekdni .dt, .pasekdni .ms {color: inherit; display: block; text-align: center;}
.pasekdni .ms { padding-top: 1em}
.pasekdni a {color: var(--text); margin-right: 0em; padding: 0; text-align: center; display: block; position: relative; width: auto;}
.pasekdni a.hover_und_anim.fat { padding-bottom: 2em; }
.pasekdni a.hover_und_anim.fat:after { bottom: 1.8em; }
.pasekdni a.hover_und_anim.fat.selected-dot:before { content: '\2022'; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 1em; font-size: 150%; }
.pasekdni {position: relative}
.pasekdni .swiper-button-next, .pasekdni .swiper-button-prev {xvisibility: hidden; background-size: 0.9em auto; margin-top: -2em}
.pasekdni .swiper-button-next {right: 0.7vw; width: 2em}
.pasekdni .swiper-button-prev {left: 0.7vw; width: 2em}
.pasekdni .sel, .pasekdni a:hover {
color: var(--text);
text-decoration: none;
transition: color 0.2s;
}
.pasekdni .sel .ms, .pasekdni a:hover .ms {
text-decoration: none;
}
.pasekdni .dni {padding-left: 0em}
@media (min-width: 1260px) { /** mieści się wszystko */
.pasekdni .swiper-wrapper { justify-content: center; }
.pasekdni a {padding: 0 0.2em; margin: 0 1.2em}
}
@media (max-width: 1370px) {
.pasekdni.marginesy {padding-left: 6%; padding-right: 6%}
}
@media (max-width: 840px) {
}
.space-when-no-vod { height: min(3em, 4vw);}
@media (max-width: 700px) {
.przyciski-bar, .przyciski-bar.marginesy {margin: 0 0 0 0; padding-top: 5%; background-color: #eee; xbackground-color: #fff; } /** gdy kalendarz na głónej, tło białe, tło jednak szare, bo na NH na głównej robiło się białe pod przyciskami */
/** .przyciski-bar .przyciski A { background-color: #eee}
.glw .przyciski-bar {padding-bottom:2em}
*/
.space-when-no-vod { height:1em }
.przyciski-bar .przyciski A.inactive:not(.szukaj) { background-color: #fff}
.pasekdnicont {margin-top:0px; padding-top: 3.5em; padding-bottom: 2em; }
.pasekdni.marginesy {padding-left: 0px; padding-right: 0px}
.xpasekdni a {width: 2.2em}
.pasekdni .swiper-button-next, .pasekdni .swiper-button-prev {display: none}
}
@media (max-width: 550px) {
.xdni .swiper-slide {width: auto; max-width: none; text-align: center}
}
@media (min-width: 1205px) {
.pasekdni .swiper-button-next, .pasekdni .swiper-button-prev { display: none}
}
/* ======================================= kalenarium ============================= */
section.kalendarium {
margin:0px 0px 3em 0px; background-color: var(--kalend-bg); padding-top: 4em; padding-bottom: 4em;
}
section.kalendarium .hed-link {display: flex; justify-content: space-between;margin: 0px 0px 2.5em 0px; flex-wrap: wrap; gap: 1em }
section.kalendarium .hed { text-transform: uppercase; }
section.kalendarium .lead {width: 31em; max-width: 90%; padding-bottom: 0.5em; margin-top: 1.5em}
section.kalendarium .link-inne { display: inline-flex; align-items: center; text-transform: uppercase; flex-wrap: nowrap; }
section.kalendarium .link-inne .strz {transition: background-position-x 0.2s; background-image: var(--dluga-strzalka);
background-position: -1em center; width:3em; height: 1em; background-size: auto 0.6em; }
section.kalendarium .link-inne:hover .strz { background-position-x: -0.5em }
.kalendarium .ev-more {padding: 0px 0px 2.5em 0px; margin-top: -0.4em}
.event-lista .swiper-wrapper {display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch }
.event-lista { overflow-x: auto; padding-bottom: 3em; padding-top: 1em; }
.event-lista .event-box .roboto-napis { text-transform: uppercase; line-height: 1.4; }
.event-lista .event-box .msc-rodzaj {}
.event-lista .event-box {display: flex; gap: 1.5em; height: auto; min-height: 22em; padding: 2em 1.5em; position: relative;
box-sizing: border-box; flex-direction: column; justify-content: space-between}
.event-lista .event-box {margin-top: 1em; }
.event-lista .event-box .tytul, .event-lista .event-box .rezys {transition: transform 0.2s}
.event-lista .event-box[href]:hover .tytul , .event-lista .event-box[href]:hover .rezys {transform: translateY(-0.3em);}
.event-lista .event-box .dt {}
.event-lista .event-box .cor {position: absolute;
background-color: transparent;
z-index: 1;
width: 1em; height: 1em;
}
.event-lista .event-box .bor {position: absolute; }
.event-lista .event-box .cor.cor1 {bottom: 0px; right: 0px;border-radius: 100% 0 0 0; border-left: 1pt solid #000; border-top: 1pt solid #000;}
.event-lista .event-box .cor.cor2 { bottom: 0px; left: 0px; border-radius: 0 100% 0 0; border-right: 1pt solid #000; border-top: 1pt solid #000;}
.event-lista .event-box .cor.cor3 { top: 0px; left: 0px; border-radius: 0 0 100% 0; border-right: 1pt solid #000; border-bottom: 1pt solid #000;}
.event-lista .event-box .cor.cor4 { top: 0px; right: 0px; border-radius: 0 0 0 100%; border-left: 1pt solid #000; border-bottom: 1pt solid #000;}
.event-lista .event-box .bor.top {top: 0px; left: 1em; right :1em; border-top: 1pt solid #000; width: auto; }
.event-lista .event-box .bor.bottom {bottom: 0px; left: 1em; right :1em; border-bottom: 1pt solid #000; width: auto; }
.event-lista .event-box .bor.right {top: 1em; right :0px; bottom: 1em; border-left: 1pt solid #000; height: auto; display:none }
.event-lista .event-box .bor.left {top: 1em; left :0px; bottom: 1em; border-left: 1pt solid #000; height: auto; }
.event-lista .event-box:last-child .bor.right {display:block}
.event-lista .event-box .dt {padding-bottom: 0.8em}
.event-lista .event-box .kolor {padding: 1.3em 0px 0.55em 0px}
.event-lista .event-box .kolor span {display: block; width: 1em; height: 1em ; border-radius: 50%; }
.event-lista .event-box .tytul {padding: 0.3em 0px 0.1em 0px}
.event-lista .event-box .rezys {padding: 0.3em 0px}
.kolor-event {background-color: #3B5EED }
.kolor-event.SpotkaniePoFilmie { background-color: #3B5EED }
.kolor-event.SpotkaniePoFilmie { background-color: #3B5EED }
.kolor-event.Spotkanie { background-color: #3B5EED }
.kolor-event.SpotkanieWstepWolny { background-color: #3B5EED }
.kolor-event.Wernisaż { background-color: #B067FF }
.kolor-event.Wystawa { background-color: #B067FF }
.kolor-event.Dyskusja { background-color: #E65300 }
.kolor-event.Koncert { background-color: #BAB7C6 }
.kolor-event.KoncertWstepWolny { background-color: #BAB7C6 }
.kolor-event.Rozmowa { background-color: #E65300 }
.kolor-event.Prelekcja { background-color: #DDC15D }
.kolor-event.Pokaz { background-color: #9E595E }
.kolor-event.PokazWstepWolny { background-color: #9E595E }
.kolor-event.PokazSpecjalny { background-color: #9E595E }
.kolor-event.PokazNaRynku { background-color: #9E595E }
.kolor-event.Wydarzenie { background-color: #719F94 }
.kolor-event.WydarzenieWstepWolny { background-color: #719F94 }
.kolor-event.Impreza { background-color: #BAB7C6 }
.kolor-event.Gala { background-color: #DDC15D }
.event-np.swiper-button-next {
right: -3.5em;
}
.event-np.swiper-button-prev {
left: -3.5em;
}
@media screen and (max-width:1370px) {
.event-np.swiper-button-next, .event-np.swiper-button-prev {display: none}
.marginesy_szer.for-scroll {padding-right: 0px}
.event-lista .swipper-wrapper { }
}
@media screen and (max-width:840px) {
section.kalendarium .link-inne { margin-right: 3% }
}
@media screen and (max-width:700px) {
.event-lista .event-box {min-height: 20em}
}
@media screen and (max-width:600px) {
section.kalendarium .hed-link {flex-direction: column;}
}
.event-np.swiper-button-prev.swiper-button-disabled, .event-np.swiper-button-next.swiper-button-disabled {display: none}
.event-lista .event-box span.roboto-napis { display: block;line-height: 1.6; }
.event-lista .event-box .opis span.roboto-napis {
display: -webkit-box;
-webkit-line-clamp: 8;
-webkit-box-orient: vertical;
overflow: hidden;
line-height: 1.6;
}
.wydarzenia-specjalne {padding-bottom: 4em}
.rozbiegowka .wkinach {padding-top: 2em; padding-bottom: 4em}
.rozbiegowka .wkinachwyr {padding-top: 4em; padding-bottom: 4em }
.sponsoring + .wkinach {padding-top: 2em}
.pasekinfo {margin-top: 1em; margin-bottom: 1em; xwidth: 120%; xmargin-left: 10%}
.pasekinfo {width: 90vw; margin-left: calc( 50% - 45vw ); }
.wsrodku { width: 116%; margin-left: -8%; margin-top: 2.5em}
.wsrodku .zobaczwszy {margin-top: 0.5em}
@media screen and (max-width:1370px) {
.pasekinfo {width: 105%; margin-left: -2.5%}
.pasekinfo {width: 90vw; margin-left: calc( 50% - 45vw ); }
.wsrodku { width: auto; margin-left: 0; }
}
@media screen and (max-width:1259px) {
.wsrodku .zobaczwszy { margin-bottom: 2.5em; }
}
@media screen and (max-width:700px){
.recenzje {padding-top: 1.2em}
.wsrodku {margin-top: 0.5em; padding-left: 5%; padding-right: 5%;}
.pasekinfo {width: 100%; margin-left: 0px;}
.wsrodku .zobaczwszy { margin-bottom: 2.5em; }
}
.pasekinfo div { background-color: #fff; text-align: center;}
.pasekinfo div {margin: 0px; padding: 1.3em 1.8em 1.1em 1.8em; }
.pasekinfo div h5 {line-height: 1.4}
.pasekinfo a {color: var(--header-color); text-decoration: underline;}
section.nhvod {padding-top: 5em; padding-bottom: 1.5em; /** gdy na górze padding-top: 6em */}
section.nhvod.zbigbox .heder {margin-bottom:4em}
section.nhvod .big-box .image {opacity: 1.0; background-position: left}
section.nhvod .big-box-and-lead {display: flex}
section.nhvod .big-box-and-lead .le { flex-basis: 41%; align-self: flex-end; padding-left: 3em; box-sizing: border-box; }
section.nhvod .big-box-and-lead .le .opis-le {font-size: 110%; padding-bottom: 0.5em;}
section.nhvod .big-box-and-lead .big-box { flex-basis: 59%}
section.nhvod .news-box.wide {margin: 0px 0px 0px 0px;}
section.nhvod .big-box .caption {bottom: 13%; width: auto; white-space: nowrap; left: auto; right: 10%}
xsection.nhvod .big-box-and-lead .image {background-image: url(../nn/css/../img/vod/vod_wtroj_szer.jpg) }
section.nhvod .big-box-and-lead .image {background-image: url(../nn/css/../img/vod/vod_volver.jpg) }
@media screen and (min-width:840.001px) {
}
@media screen and (max-width:1259px) {
section.nhvod .article-box:not(.ab0):not(.ab1) {display: none}
section.nhvod .big-box-and-lead .big-box, section.nhvod .big-box-and-lead .le {flex-basis: 50%}
}
@media screen and (max-width:1259px) {
section.nhvod .big-box .caption {right: auto; left: 10%;}
}
@media screen and (max-width:900px) {
xsection.nhvod .big-box-and-lead .image {background-image: url(../nn/css/../img/vod/vod_wtroj_sq.jpg) ; background-position: 0px 0px}
section.nhvod .big-box-and-lead .image {background-image: url(../nn/css/../img/vod/vod_volver_m.jpg) ; background-position: 0px 0px}
}
@media screen and (max-width:700px) {
section.nhvod .big-box-and-lead {flex-direction: column; align-items: center}
section.nhvod .big-box-and-lead .le {padding: 2em 0px 3em 0px; max-width: 400px;align-self: center;}
section.nhvod .big-box .caption {right: auto; left: 12%; font-size: 120%}
}
.ticket-label { display: flex; align-items: stretch; align-content: center; background-color: transparent; }
.ticket-label .brz {width: 0.5em; background-image: url(../nn/css/../img/biletborder.svg); background-size: auto 100%; }
.ticket-label .brz.l {background-position: left center; }
.ticket-label .brz.r {background-position: right center; }
.ticket-label .t { display: flex; align-content: center; justify-content: center; xheight: 2em; align-items: center; padding: 0.7em 0.6em; background-color: #fff; }
.ticket-label .t .tt {color: #000; text-transform: uppercase; line-height: normal; }
.article-box .ticket-label { position: absolute; top: 1.5em; left: 1.1em; z-index:1}
.article-box, .news-box {cursor: pointer; position: relative; box-sizing: border-box; vertical-align: top; position: relative; background-color: #000; display: inline-block; height: auto; overflow: hidden; }
.news.dzis { text-align: center;}
.nazywo {margin: 0 auto; text-align: center; }
.one-box {margin: 1% auto; display: block; text-align: left; width: 60%; min-width: 42em; max-width: 80%; position: relative }
.one-box .image-cont {display: block; width:35%; position:relative; overflow: hidden; background-color: #000; }
.one-box .image {display: block; transition: transform .3s ease-in-out;
height: 100%; width: 100%; position: absolute; background-size: cover; background-position: center center; background-repeat: no-repeat; }
.one-box .image-cont:after { padding-top: 100%; display: block; content: ''; }
.one-box .caption {overflow:hidden; vertical-align: top; display: block; height: 100%; position: absolute; box-sizing: border-box; background-color: #ffffff; bottom: 0;
width: 65%; padding: 2em 2.5em; right:0;}
.one-box .caption .f4 {display: block; color: #1c1c1c; padding: 0; box-sizing:border-box; overflow: hidden; }
.one-box .caption .led {color: var(--header-color); font-size: 0.9em; padding-top: 0.5em; xmax-height: 7em; overflow: hidden; }
.one-box .caption .data { color: #808080; display: block}
.one-box .caption .data { text-align: left; background-color: #fff; padding-top: 1.5em }
.one-box.film {width: 72% }
.one-box.film .caption {background: transparent; padding: 1.5em 0.5em 1.5em 4.5em; width: 66%}
.one-box.film .image-cont {width: 34%}
.one-box.film .image-cont:after {padding-top: 143.86%}
.one-box.film .caption .led {max-height: 53%; overflow: hidden; margin-bottom: 2em}
.one-box.film .caption .premi {padding-bottom: 1.3em}
.one-box.film .morelink {color: var(--header-color)}
.news-box:after {padding-top: 106.2%; display: block; content: ''; }
.big-box:after { padding-top: 51.08%; }
.news-box .image { position: absolute; top: 0; bottom: 0; background-color: #000; background-size: cover; background-position: center; background-repeat: no-repeat;
transition: transform .3s ease-in-out;
z-index: 10;
}
.skleplist .news-box .image { opacity: 0.9}
.news-box-ukryte {display: none}
.single-box .image {height: 52%; width: 100%;}
.big-box .image {height: auto; width: 100%; opacity: 0.6; background-color: #000 }
.news-box .caption {box-sizing: border-box; position: absolute; text-align: center; background-color: #ffffff; bottom: 0;
width: 100%; ;z-index: 11; }
.news-box .text-tag, .news-box .text-tags { z-index: 12; }
.single-box .caption {padding: 5% 10%; height: 48%; max-height: 48% ; }
.big-box .caption {display: inline-block; position: absolute; text-align: left; vertical-align: middle;
background-color: transparent; bottom: 0; bottom: 8.5%; padding: 0; margin: 0; z-index: 11;}
.big-box .caption {left: 55%; width: 37% ; }
.big-box .caption .can {position: absolute; bottom: 0; left: 0; }
.news-box .caption .lab, .article-box .caption .lab {text-transform: uppercase; display: block; }
.news-box .caption .data { color: var(--dopisek); display: block}
.news-box .caption .h {
max-height: 3.3em; /** height: 2.1em; */
color: var(--header-color); display: inline-block; box-sizing:border-box; overflow: hidden}
.article-box .caption .lab { color: var(--dopisek); text-align: center; margin-bottom: 7% }
.single-box .caption .lab { color: var(--header-color);text-align: center; margin-bottom: 5% }
.single-box .caption .data { position: absolute; bottom: 1.6em; width: auto; left:0; right:0; text-align: center; background-color: inherit; z-index: 5; }
.cena-before { color: #aaa; text-decoration: line-through; display: inline-block; margin-right: 0.5em}
span.cena-before {line-height: inherit;}
.single-box.sticky .image {height: auto;z-index:9; background-color: #000; opacity: 0.6}
.single-box.sticky:not(.bezrozu) .image::before {
display: block; z-index: 10; float: left; content: ''; width: 100%; height: 100%;
background: rgba(236,0,142,0);
background: -moz-linear-gradient(top, rgba(236,0,142,0) 0%, rgba(236,0,142,0.5) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(236,0,142,0)), color-stop(100%, rgba(236,0,142,0.5)));
background: -webkit-linear-gradient(top, rgba(236,0,142,0) 0%, rgba(236,0,142,0.5) 100%);
background: -o-linear-gradient(top, rgba(236,0,142,0) 0%, rgba(236,0,142,0.5) 100%);
background: -ms-linear-gradient(top, rgba(236,0,142,0) 0%, rgba(236,0,142,0.5) 100%);
background: linear-gradient(to bottom, rgba(236,0,142,0) 0%, rgba(236,0,142,0.5) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ec008e', endColorstr='#ec008e', GradientType=0 );
}
.single-box.sticky .caption {z-index: 11; padding: 10%; background: transparent; xtop: 0; bottom: 0; left: 0; right: 0; height: auto; max-height: none; text-align:left}
.single-box.sticky .lab, .single-box.sticky .h, .single-box.sticky .data {color: #fff; background: transparent; text-align:left}
.single-box.sticky .caption .data {position: static; padding-top:1em; display: none}
.single-box.sticky .h { max-height: none; height: auto; }
.single-box.sticky.zkolkiem .image {background-size: auto 80%}
.single-box.sticky.zkolkiem.podcast .image { background-size: auto 75%}
.single-box.sticky .kolko {content: ""; display: block; width: 100%; height: 100%; background-image: url(../nn/css/../img/ramkaokr.svg); background-size: cover;
position: absolute;
top: 0; bottom: 0; background-color: transparent; z-index:10;
background-position: center; background-repeat: no-repeat;
}
.single-box.sticky.zkolkiem .h {text-align: center; font-size: 1.4em}
.single-box.sticky.zkolkiem .lab {text-align: center;}
.single-box.sticky .mbankl {background-image: url(../nn/css/../img/loga/mbank.svg); background-size: auto 2.6em; background-position: center center;
height: 3em; background-repeat: no-repeat; }
.single-box.sticky.zkolkiem .caption {padding-bottom: 15%; padding-left: 12%; padding-right: 12%}
.single-box.sticky.zkolkiem.podcast .caption {padding-bottom: 11%}
.big-box .caption .lab {color: #fff; width: auto; text-align: left; padding-top: 0.3em; margin-bottom: 8%; margin-left: -0.3em; margin-top: 0px; position: relative; top: 0; left:0 }
.big-box .caption .h { max-height: none;color: var(--header-color); background-color: #fff; display: inline;
/** to w starszych przegladarkach, ale nie działa, bo nachodzi na tekst */
padding: 0; box-shadow: 0px 0px 0px 0.2em #fff;
/** a to w nowszych */
/** padding: 0.2em; */
-webkit-box-decoration-break: clone;
-ms-box-decoration-break: clone;
-o-box-decoration-break: clone;
box-decoration-break: clone;
}
.big-box .caption .hbapla {position: relative;}
.big-box .caption .h.back { color: #ffffff; }
.big-box .caption .h.over {position: absolute; top: 0; left: 0; color: var(--header-color); box-shadow: 0px 0px 0px 0.2em transparent; background-color:transparent;}
.big-box .caption .h.over.ponowemu { position: static; top: auto; left: auto;}
.news-box:not(.big-box) .caption .h.over {display: none; }
.big-box .caption .h span {position: relative; z-index: 2; line-height: 1.1em}
.big-box .caption .h span.small { line-height: 1em}
.big-box .caption .data {margin-left: -0.3em; padding: 0; margin-top: 7%; color: #fff; position: relative; }
.news-box { width: 30.93333%; margin: 1.2%;}
.big-box {width: 64.26666%;}
.news-box:not(.video):not(.vod-box) .play {display: none}
.vod-box .play, .video .play {
display: block; position: absolute; left: 50%;
top: 50%;
width: 3.3em; height: 3.3em;
transform: translate(-50%,-50%);
background-image: url(../nn/css/../img/play.svg); background-size: cover; background-position: center center;
}
.vod-box .play.on-hover, .video .play.on-hover {opacity: 0; transition: opacity 0.2s;}
.vod-box:hover .play.on-hover, .video:hover .play.on-hover {opacity: 1}
@media screen and (max-width: 550px) {
.vod-box .play.on-hover {opacity: 1}
}
.single-box.video .play {top: 28%}
.single-box.video .image {opacity: 0.6}
.big-box.video .caption .h {box-shadow: none; background-color: transparent; color: #fff }
.big-box.video .caption .data {margin-left:0; margin-top: 1.2em}
.big-box.video .caption .lab {display: none;}
.big-box.video .caption {left: 50%; width: 45%; bottom: 9%}
.news-box.video .image.playing { opacity: 1.0; transition: none; }
.roboto-light.not-translated-message { font-weight: 300}
.not-translated-message { padding: 0.8em 1.5em; margin-bottom: 2em;
border: 1px solid var(--bs-success); color: var(--bs-success);
max-width: 100%; box-sizing: border-box; width: 40em; margin-left: auto; margin-right: auto;
}
.video .video-cont {
max-height: 100%;
width: 100%;
height: 100%;
position: absolute;
background-position: center;
background-position-x: center;
background-position-y: 15%;
background-repeat: no-repeat;
background-size: cover;
}
.video .video-cont iframe {
width: 100%;
height: 100%;
}
.article-box {display: inline-block; width: 25%;border: 1px solid transparent; background-color: transparent; text-align: center;}
.article-box {margin-bottom: 2em}
.article-box:after {padding-top: 95%; display: block; content: ''; }
.article-box .image-cont {display: block; height: 76%; width: 100%; overflow: hidden; position: absolute; top: 0; bottom: 0; background-color: #000; }
.article-box .image {display: block; transition: transform .3s ease-in-out;
height: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat; }
.article-box .caption {display: block; box-sizing: border-box; position: absolute; background-color: #ffffff; bottom: 0; text-align: center;
width: 86%; padding: 10% 7%; height: 47.4%; max-height: 55%; margin-left: 7%; margin-right: 7%; xtop: 60%; }
.article-box .caption .f6 {display: block; color: #1c1c1c; padding: 0; max-height: 2.1em; height: 2.1em; box-sizing:border-box; overflow: hidden}
.article-box .caption .data { color: var(--dopisek); display: block}
.article-box .caption .data { position: absolute; bottom: 20%; width: auto; left:0; right:0; text-align: center; background-color: #fff; z-index: 5; }
.article-box.filmzplakatem .caption .h {max-height: 3.3em; line-height: 1; margin-bottom: 3%; color: #1c1c1c; display: inline-block; box-sizing:border-box; }
.article-box.filmzplakatem .caption {height: 29%; padding-top: 7% ; padding-bottom: 7%}
.article-box.filmzplakatem .caption .data {bottom: 18%}
.article-box.filmzplakatem:after {padding-top: 170%}
.article-box.filmzplakatem .image-cont {height: 84%}
.article-box.filmzplakatem .data {text-transform: uppercase;}
.article-box.filmzplakatem .caption {font-size: 0.95em}
.article-box.wydarz-box {margin-left: 0.5em; margin-right: 0.5em}
.article-box.wydarz-box .caption {xpadding-left: 6%; xpadding-right: 6% }
.article-box.wydarz-box .caption {font-size: 1em}
.article-box.filmzplakatem.wydarz-box .caption .data {bottom: 15%}
.zobaczwszy {margin: 1em auto 1.5em auto; text-align:center; display: flex; align-items: center; justify-content: center }
.zobaczwszy {max-width: 12em; padding: 1.3em 2em; border: 1pt solid var(--header-color)}
.zobaczwszy.fr { border: none; padding: 0px;}
.zobaczwszy.loading {border: none}
.loading { padding-top: 1.5em; padding-bottom: 1.5em }
.loading img {width: 2.5em; height: 2.5em; visibility: hidden;}
.loading.visible img {visibility: visible;}
.dol .kont { display: flex; gap: 2em 4em; justify-content: space-between; align-items: flex-start; max-width: 90em; margin-left: auto; margin-right: auto; }
.dol { background-color: #000 ; color: #fff; overflow: hidden; }
.dol {padding-top: 4.5em; padding-bottom: 3em; font-size: 0.7em;}
.dol .le {flex-basis: 42%; gap: 0.5em 3.5em; box-sizing: border-box; display: flex; flex-wrap:wrap; padding: 0px 0px 2em 0px; line-height: 150%; color: #fff; letter-spacing: 0.4px; font-weight: 300; }
.dol .le A, .dol .le A:hover {color: #fff; }
.dol .le A {transition: text-underline-offset 0.2s; text-decoration-thickness: 0.5px; text-decoration-line: underline; text-underline-position: under; text-underline-offset: -0.05em; font-weight: 300; text-decoration: underline; }
.dol .le A:hover {text-underline-offset: -0.15em }
.dol .pr a { font-size: 1.4em; }
.dol .pr {display: flex; gap: 2em 4em ; box-sizing: border-box; flex-wrap: wrap; align-items: center; justify-content: flex-end; flex-basis: 58%; text-align: right}
.dol .pr IMG {height: auto;}
@media screen and (min-width: 2000px){
.dol {font-size: 0.8em}
}
@media screen and (max-width:800px){
.dol .kont {flex-direction: column; align-items: center;}
.dol .pr {xmargin-bottom: 3em; align-items: center; justify-content: center;}
.dol .le {order: 2; justify-content: center;}
.dol .le > div {text-align: center;}
}
@media screen and (max-width:1259px){
.xdol .pr {width: 100%; text-align: left;}
}
@media screen and (max-width:840px) {
.xdol .pr div {padding: 4% 2.3em 4% 0px;}
}
.socmentions .insta { background-position: center center; box-sizing: border-box; position: relative; z-index: 1; display: inline-block; background-image: url("../nn/css/../img/insta_img.png"); background-repeat: no-repeat; background-size: cover;
-webkit-filter: brightness(95%); filter: brightness(95%);
transition: all 0.2s ease-in-out;
xwidth: 25%;
}
.socmentions .insta:hover { -webkit-filter: brightness(105%); filter: brightness(105%);}
.socmentions .insta:before {content: ""; float:left; padding-top:100%;}
.socmentions .insta {max-width: 20em;}
.socmentions .src {display: block; position: absolute; z-index: 4; bottom: 10%; width: 80%;}
/** .socmentions .instico {display: none} */
.socmentions .swiper-button-next, .socmentions .swiper-button-prev {display: none}
.padinggd {padding-top: 3em; padding-bottom: 3em}
.soc-inne { display: flex; margin: 4em 0px 2em 0px; align-items: stretch; align-content: stretch; height: 10em }
.soc-inne a {transition: background-color 0.2s; display: flex; flex-basis: 50%; border: 1pt solid #000; justify-content: center; align-items: center; }
.soc-inne a.tt {border-right: none;}
.soc-inne a span {transition: transform 0.2s; background-size: auto 2em; background-position: center center; width: 9em ; height: 2em; }
.soc-inne a.yt span { background-image: url(../nn/css/../img/v2/yt_glw.svg);}
.soc-inne a.tt span { background-image: url(../nn/css/../img/v2/tiktok_glw.svg); }
.soc-inne a:hover span {transform: translateX(0.4em); }
.soc-inne a:hover {background-color: #e2e2e2;}
@media (max-width: 700px) {
.soc-inne {height: 8em}
.soc-inne a span {width: 3em; height: 3em; }
.soc-inne a.yt span { background-image: url(../nn/css/../img/v2/social_yt.svg); background-size: auto 2em}
.soc-inne a.tt span { background-image: url(../nn/css/../img/v2/social_tiktok.svg) ; background-size: auto 2.2em;}
}
.forum { background-color: #E7E7E7; margin: 0 auto 0 auto; }
.forum H3 {margin-top: 0; padding-top: 0; padding-bottom: 0.3em }
.forum .cl {display: inline-block; width: 25%; vertical-align: top; padding-right: 2%; }
.forum .cl.tyt {width: 19%}
.forum .cl .kto {color: var(--header-color); display: block; }
.forum .cl .w {transition: 0.2s easy ; color: var(--magentac); font-family:PFHandbookProMedium; font-size: 0.95em; line-height: 1.3em; margin: 0.4em 0 1em 0; display: block;}
.forum .cl .w:hover {text-decoration: underline}
.forum .cl .data {color: #808080; display: block; text-transform: uppercase; }
.forum .cl.ps3 {padding-right: 0}
.trzylinki { background-color: #fff; margin: 0 auto 0 auto; }
.trzylinki H3 {margin-top: 0; padding-top: 0; padding-bottom: 0.1em }
.trzylinki .cltyt {display: inline-block; width: 25%; vertical-align: top; padding-right: 2%; box-sizing: border-box; }
.trzylinki .clw {width: 75%; display: inline-block;}
.trzylinki .cl {display: inline-block; width: 32%; vertical-align: top; padding-right: 2%; }
.trzylinki .cl .podpis {color: var(--header-color); display: block; }
.trzylinki .cl .w {transition: 0.2s easy ; color: var(--magentac); font-family:PFHandbookProMedium; font-size: 0.95em; line-height: 1.3em; margin: 0.4em 0 1em 0; display: block;}
.trzylinki .cl .w:hover {text-decoration: underline}
.trzylinki .cl .data {color: #808080; display: block; text-transform: uppercase; }
.trzylinki .cl.ps3 {padding-right: 0}
.newsletter { background-color: #000; margin: 0 ; padding-right:8%; padding-left: 8%; padding-top: 3em; padding-bottom: 1em; text-align: center; }
.newsletter {box-sizing: border-box; color: #fff; }
.newsletter h3 {color: #fff; margin: 0; padding: 0.2em 0px}
.newsletter label {display: block; color: #fff; font-size:90%; padding: 2em 0px 3em; font-weight: 300; max-width: 26em ; margin: 0px auto}
.newsletter .pola { margin-bottom: 2em; display: flex; flex-wrap: nowrap; justify-content: center; align-items: stretch; }
.newsletter .pola .email {width: 70%; max-width: 300px; color: #000; background-color: #fff; -webkit-appearance: none;
border-radius: 0;}
.newsletter .pola * {outline: 0 none; padding: 1em ; font-size: 1em !important; box-shadow: none; line-height: 1.1em; border-width: 0px; box-sizing: content-box}
.newsletter .pola .ok {display: inline-block; cursor: pointer; background-color: #000; color: #fff; transition: background-color 0.2s ; font-size :0.95em ; border: 1px solid #fff }
.newsletter .pola .ok:hover {background-color: var(--texth) }
.sklepskrot {background-color: #fff; }
.sklepskrot h3 {text-align: center}
.sklepskrot .boksy {margin: 3% 0}
.sklep-box {vertical-align: top; width: 30%; margin-right: 5%; display:inline-block; position: relative;}
.sklep-box:LAST-CHILD {margin-right: 0}
.sklep-box .image { transition: transform .3s ease-in-out; height: 100%; display: block; background-repeat: no-repeat; background-size: cover;
opacity: 0.9; background-position: center;
}
.sklep-box .image:after {content: ""; display:block; width: 100%; padding-top:100%;}
.sklep-box .image-cont {background-color: #000; display: block; overflow: hidden; margin-bottom: 10%; width: 100%;height: auto;}
.sklep-box .tyt, .sklep-box .cena { display: block; margin: 0.35em 0;padding: 0; }
.sklepskrot .zobaczwszy { margin-top: 5%}
.sklep-box:hover .image , .article-box:hover .image, .news-box:hover .image:not(.playing), .one-box:hover .image {transform: translateZ(0) scale(1.05) }
.nice-select ul li {margin-top: 0px; margin-bottom: 0px; padding-top: 0.5em ;padding-bottom: 0.5em}
.nice-select ul, .nice-select li, .nice-select span {font-family: inherit; font-size: inherit;}
.nice-select.f6 .option.selected {font-weight: normal; background-color: #eee !important;}
.nice-select .option.selected { font-weight: 500 !important}
.tooltip_templates {display: none}
.tippy-box[data-theme~='pnh'] { background-color: rgba(5, 5, 5, .95); color: #fff; }
.tippy-box[data-theme~='pnh'] .tippy-arrow {color: rgba(5, 5, 5, .95);}
.tippy-box[data-theme~='pnh'][data-theme~='white'] { background-color: #fff; color: #000;}
.tippy-box[data-theme~='pnh'][data-theme~='white'] .tippy-arrow {color: #fff }
.tippy-box[data-theme~='pnh'][data-theme~='big'] {border-radius: 1em; border-bottom-left-radius:0.8em }
.tippy-box[data-theme~='pnh'] .tippy-content {font-size: 1em; line-height: 135%; padding: 1.1em 1.3em; font-weight: 300; font-family: Roboto; }
.tippy-box[data-theme~='pnh'][data-theme~='big'] .tippy-content { padding: 1.4em 3.5em 1.4em 2em; font-weight: 400; }
@media screen and (max-width:600px) {
.tippy-box[data-theme~='pnh'][data-theme~='big'] .tippy-content { padding: 1.3em 1.8em }
.tippy-box[data-theme~='pnh'][data-theme~='big'] {border-bottom-left-radius:0.5em }
}
.tippy-box[data-theme~='pnh'][data-theme~='big'] .tippy-content div { margin: 0.2em 0px; }
/** tooltipster wymieniony na tippy, można to usunąć */
.tooltipster-sidetip.tooltipster-cust .tooltipster-box {border-radius: 0.15em}
.tooltipster-update-fade { animation: tooltipster-fading 200ms; }
.tooltipster-sidetip.tooltipster-cust .tooltipster-content {font-size: 0.7em; padding: 1.1em 1.3em; box-sizing: border-box; max-height: none;}
.tooltipster-cust {xmax-width: 230px; overflow: visible; xwidth: auto !important; }
.tippy-box[data-theme~='pnh'] .tippy-content a, .tooltipster-cust a {transition: text-underline-offset 0.2s; color: #fff; text-decoration: underline; text-underline-offset: -0.05em; }
.tippy-box[data-theme~='pnh'] .tippy-content a:hover, .tooltipster-cust a:hover { color: currentColor; text-underline-offset: 0.05em; }
a.icon {display:inline-flex; align-items: center; justify-content: center; background-position: center center; width: 1.2em; height: 1.2em; background-size: auto 1.2em; background-repeat: no-repeat; }
a.icon.printzebra { background-image: url(../nn/css/../img/printzebra.svg); }
a.icon.printfiskal { background-image: url(../nn/css/../img/printfiskal.svg); }
a.icon.printpdf { background-image: url(../nn/css/../img/printpdf.svg); }
.icon-links { display: inline-flex; align-items: center; column-gap: 0.7em; row-gap: 0.2em; }
a.icon i { font-size: 115%; transition: text-shadow .2s}
a.icon:hover i {text-shadow: 0 0 20px rgba(0,0,0,0.7); }
a.icon.text-success:hover {color: var(--bs-success) }
a.icon.copytocart { background-image: url(../nn/css/../img/copytocart.svg); }
a.icon.details { background-image: url(../nn/css/../img/details.svg); }
a.icon.cancel { background-image: url(../nn/css/../img/cancelsz.svg); }
a.icon.play { background-image: url(../nn/css/../img/v2/pplayc.svg); }
a.icon.payment { background-image: url(../nn/css/../img/paymentmg.svg); }
/** używane w paru miejscach, ale nieładne ten margin, zostawiam */
.iconactions { display: inline-flex; margin: 0.5em 0px; align-items: center; column-gap: 0.6em; row-gap: 0.2em; }
.szukaj {position: relative; display:inline-flex; width: auto; align-items: center; }
.szukajinput, .szukajsub {
-webkit-appearance: none;
-moz-appearance: none;
border-radius: 0;
-webkit-border-radius:0px;
}
.szukajinput {
height: 2.5em;
display: block;
width: auto;
border: 2px solid #000;
box-sizing: border-box;
font-family: inherit !important;
color: #000;
padding-left: 1.3em;
background-color: var(--tlo-filtrow);
-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: border-color ease-in-out .2s, box-shadow 0.2s;
transition: border-color ease-in-out .15s, box-shadow 0.2s;
}
/** jeśli chcemy by strazłkę datalist było widać */
/** .szukajinput { padding-right: 1.8em; } */
.szukajinput:focus {
border-color: transparent;
outline: 0;
box-shadow: none;
}
.szukajinput::-webkit-input-placeholder { color: #000; }
.szukajinput::-moz-placeholder{ color: #000; opacity: 1}
.szukajinput::-ms-input-placeholder { color: #000; }
.szukajinput:-moz-placeholder{ color: #000;opacity: 1; }
.szukajinput::placeholder { color: #000; }
.szukajinput:focus::placeholder {
color: transparent;
}
.szukajinput[type="search"] { }
.szukajinput::-webkit-search-cancel-button {
-webkit-appearance: none;
height: 1em;
width: 1em;
background: url(../nn/css/../img/search-cancel-button.svg) no-repeat 50% 50%;
background-size: 0.9em 0.9em;
opacity: 1;
pointer-events: none;
}
.szukajinput::-webkit-calendar-picker-indicator, input[type="text"].szukajinput::-webkit-calendar-picker-indicator {
xdisplay: none;
xopacity: 0;
}
/*
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
font-family: PFHandbookProMedium;
}*/
.szukajinput + button { position: absolute; right: 1.3em; top: 2pt; bottom: 2pt; border: 0; background-color: var(--tlo-filtrow); box-shadow: none; }
.przyciski .szukajinput+button {right: 1.6em}
.przyciski .szukajinput, .przyciski .szukajinput+button {border-radius: var(--round-button-on-bar) }
.szukaj .lupa {display: block; background-image: url(../nn/css/../img/v2/lupa_00.svg); background-size: 1.4em auto; width: 1.4em; height: 1.4em; background-position: center center; }
.szukwyn {font-size: 1.25em; padding: 0.5em 0}
.przyciski a.szukaj {padding-left: 0}
.przyciski a.szukaj .cont {width: 100%}
.przyciski .szukajinput {display: inline-block; border: none; width: 90%; width: calc(100% - 0.6em);}
.przyciski .szukaj .lupa {background-size: 2em auto; width: 2em; height: 2.5em }
.filtr .szukajinput { border: 1pt solid #000; }
.filtr:not(.corners) .szukajinput { height: 100%; border-radius: 1.8em; width: 15em; padding-right: 1.4em}
.filtr.sklep .szukajinput {height: 3em;}
/** żeby datalist arrow był widoczny: .filtr.program .szukajinput { padding-right: 2.4em} */
@media screen and (min-width:1300px) {
.filtr:not(.corners) .szukajinput { width: 18em }
}
@media (max-width: 900px) {
.przyciski .szukaj .lupa {background-size: 1.7em auto; }
}
@media (max-width: 700px) {
.szukajinput + button { right: 1.1em; }
.przyciski .szukajinput+button {right: 0.8em}
.przyciski .szukaj .lupa {background-size: 1.5em auto; }
.szukajinput {padding-left: 1em; }
}
.logotypylista { overflow: hidden; margin: 1.5em 0px 0.2em 0px;}
.opis .logotypylista { margin-top: 0px}
.opis .nagrody + .logotypylista { margin-top: 2em}
.logotypylista + hr.big { margin-top: 3.5em }
.logotyp-tekst {filter: grayscale(1); display: block; width: auto; height: auto; max-width: 6.5em; max-height:2.7em; margin-top: 2em; margin-bottom: 2em }
.logotyp-tekst.monochrome { filter: grayscale(1) brightness(0) ; }
.logotypylista .logotyp {display: inline-block; vertical-align: middle; margin-right: 3em; margin-bottom: 0em; margin-top: 2em}
.logotypylista a:hover {background-color: transparent;}
.zestawy .logotypylista { margin-top: 1.5em; margin-bottom: 1em}
.zestawy .logotypylista .logotyp { margin-top: 0; margin-bottom: 2em}
.pasekspons { background-color: transparent; margin: 1.5em 0px; padding-top: 2.1em; padding-bottom: 2.1em }
.pasekspons .kont {overflow: hidden;position: relative; height: 4.37em; padding: 0px; box-sizing: border-box;}
.pasekspons .kont:after {
content : "";
position : absolute;
z-index : 1;
top : 0;
left : 0;
pointer-events : none;
background-image : linear-gradient(to left,
rgba(238,238,238, 0),
rgba(238,238,238, 1) 90%);
width : 6%;
min-width: 40px;
height : 5.5em
}
.pasekspons .kont:before {
content : "";
position : absolute;
z-index : 1;
top : 0;
right : 0;
pointer-events : none;
background-image : linear-gradient(to right,
rgba(238,238,238, 0),
rgba(238,238,238, 1) 90%);
width : 6%;
min-width: 40px;
height : 5.5em
}
.pasekspons .pasek {width: 195em; white-space: nowrap; height: 4.37em; position: absolute; left: 0; top: 0;
transform: translate3d(0, 0, 0); animation: sponsslideshow 40s linear infinite; backface-visibility: hidden; transform-style: preserve-3d; }
.pasekspons .pasek IMG {width: 50%; height: auto; }
.pasekspons .pasek {
-webkit-animation-play-state: running;
animation-play-state: running;
}
.pasekspons .pasek:hover {
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
@keyframes sponsslideshow {
100% {
transform: translateX( -50%);
}
}
.share-button { display: flex;}
.share-button { background-image: url(../nn/css/../img/v2/share2.svg);
background-position: left center; background-size: auto 1.2em;
display: flex; height: 1.5em; padding-left: 2em;
align-items: center; color: #000;
margin-right: 2em; line-height: normal; padding-top: 1px;
}
.share-button span {color: #000; text-decoration:none; transition: transform 0.2s; line-height: normal;}
.share-button:hover span { transform: translateX(0.2em)}
a.share-button { text-decoration:none;}
@media screen and (max-width:650px) {
.share-button {background-position: center}
.share-button span.hide-on-mobile {display: none; background-position: center center}
}
.baner-social {margin-top: var(--odstep-apla); margin-bottom: var(--odstep-apla2); }
.baner-social .fb-icon {display: block; background-image: url(../nn/css/../img/v2/social_face.svg); background-size: auto 2.1em; background-position: left center; height: 3em; width: 3em; margin-bottom: 1.3em }
.baner-social .insta-icon { display: block; background-image: url(../nn/css/../img/v2/social_insta.svg); background-size: auto 2.1em; background-position: left center; height: 3em; width: 3em; margin-bottom: 1.3em }
.baner-social .baner {display: flex; align-items: stretch; flex-wrap: nowrap; align-content: stretch; width: 100%; position: relative; margin-bottom: 4em}
.baner-social .baner:after {content: ""; display: block; padding-top: 30%}
.baner-social .lewa { position: relative; background-image: url(../nn/css/../img/baner-social-tlo5.jpg); background-size: cover; width: 57% }
.baner-social .lewa .tlo {z-index: 1; position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,0.15) }
.baner-social .lewa .napis { z-index: 2; position: absolute; top: 10%; left: 5%; max-width: 90%; background-color: #000; display: block; padding: 0.6em 1.2em 0.5em 1.2em; box-sizing: border-box;}
.baner-social .lewa .napis span {color: #fff;}
.baner-social .prawa { width: 43%; background-color: #000 ; position:relative;}
.baner-social .prawa .lin { display: flex; flex-wrap:nowrap; align-items: center; position: absolute; bottom: 15%; left: 10%; width: 82%; color: #fff;}
.baner-social .prawa .lin .linf { color: #fff; width: calc(100% - 7rem); padding-right: 2rem}
.baner-social .prawa .lin .stz {transition: width 0.2s; background-image: var(--dluga-strzalka-white); width: 4em; height: 2em; background-size: 5em auto; background-position: center right }
.baner-social .baner:hover .lin .stz {width: 4.5em }
.baner-social .przejdz {padding-top: 2.5em; }
@media screen and (max-width:1200px){
.baner-social .baner:after {content: ""; display: block; padding-top: 40%}
.baner-social .prawa .lin { width: 100%; flex-direction: column; align-items: flex-start; }
.baner-social .prawa .lin .linf {width: auto; padding-right: 0px;}
.baner-social .prawa .lin .stz {align-self: flex-start; margin-top: 0.8em}
}
@media screen and (max-width:700px){
.baner-social .baner {flex-direction: column; }
.baner-social .baner:after {display: none;}
.baner-social .lewa:after {content: ""; display: block; padding-top: 85%}
.baner-social .lewa .napis {top: 2.2em; left: 2em; font-size: 120%; max-width: calc(100% - 4em); box-sizing: border-box}
.baner-social .lewa, .baner-social .prawa {width: 100%; box-sizing: border-box;}
.baner-social .prawa {height: auto; padding: 2.8em 2.1em; }
.baner-social .prawa .lin { width: 100%; position: relative; font-size: 130%; left: 0px; flex-direction: column; align-items: flex-start; }
}
DIV.pager {background-color: #f4f4f4; color: #484746; display: inline-block; line-height: normal; font-size: 85%}
DIV.pager .pagersr {display: inline}
DIV.pager A, DIV.pager span { padding: 10px 6px; color: #484746; display: inline-block; font-size: inherit; font-family:inherit; line-height: inherit; }
DIV.pager span.currentPage {display: inline-block; color: var(--magenta);}
DIV.pager A:hover {color: var(--magenta); }
A.nastepna, DIV.pager A.nast {height: 100%; border-left: 2px solid #fff; padding: 10px 17px; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAJCAMAAAAmRK2vAAAAQlBMVEUAAABHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZdXwfZAAAAFXRSTlMAHdC03uVGBPrxL3+eXqP4fmCd8jDAZRXJAAAAOElEQVR4XiWLRxLAMAgDcQng7hT9/6uBRJcdaVaUYyBLwlEN0lHYe4MO58QybOhJcuHmz3xs+n8vLpcBims3PlYAAAAASUVORK5CYII=") no-repeat center center; width: 5px }
A.nastepna:hover, DIV.pager A.nast:hover { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAJCAMAAAAmRK2vAAAAQlBMVEUAAADrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAItZIGJMAAAAFXRSTlMAHdC03uVGBPrxL3+eXqP4fmCd8jDAZRXJAAAAOElEQVR4XiWLRxLAMAgDcQng7hT9/6uBRJcdaVaUYyBLwlEN0lHYe4MO58QybOhJcuHmz3xs+n8vLpcBims3PlYAAAAASUVORK5CYII=") }
A.poprzednia, DIV.pager A.poprz {border-right: 2px solid #fff; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAJCAMAAAAmRK2vAAAAQlBMVEUAAABHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZHRkZdXwfZAAAAFXRSTlMA0N4d5Ua0BPovnl7xf/ijYH7ynTANMxFVAAAANUlEQVR4Xi3LRwKAMAzEQAVweqHt/7+KD8xZwu1hA8qhCNZVEy1rAFMLd2ZdOLv1JOD18v8+LqYBinI6+SYAAAAASUVORK5CYII=") no-repeat center center; padding: 10px 17px; width: 5px; }
A.poprzednia:hover, DIV.pager A.poprz:hover {background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAJCAMAAAAmRK2vAAAAQlBMVEUAAADrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAIvrAItZIGJMAAAAFXRSTlMA0N4d5Ua0BPovnl7xf/ijYH7ynTANMxFVAAAANUlEQVR4Xi3LRwKAMAzEQAVweqHt/7+KD8xZwu1hA8qhCNZVEy1rAFMLd2ZdOLv1JOD18v8+LqYBinI6+SYAAAAASUVORK5CYII=") }
DIV.pager .pagersr .pgr:FIRST-CHILD {padding-left: 12px; }
DIV.pager .pagersr .pgr:LAST-CHILD {padding-right: 12px; }
/** ==================================== baner glowna ====================== */
.det-link { display: inline-flex; flex-direction: column; width: auto; margin-left: auto; margin-right: auto; }
.det-link .ostrz {
margin-top: 1.2em;
background-image: var(--dluga-strzalka);
background-position: -0.6em center;
padding-left: 0px;
display: inline-block;
overflow: hidden;
background-size: auto 1em;
transition: background-position .2s ease;
width: 5em;
margin-left: 0px;
height: 1em;
}
.det-link.button-rounded {
border: 1.5pt solid #000; flex-direction: row;
position: relative; padding: 0.8em 1.2em 0.8em 1.5em; align-items: center;
border-radius: 1.8em; background-color: transparent;
justify-content: space-between;
margin-left: unset; margin-right: unset;
font-size: 0.95em
}
.det-link.button-rounded .arr-short {
background-image: var(--filled-arrow);
background-position: right 0.2em center;
padding-left: 0px;
display: inline-block;
overflow: hidden;
background-size: auto 1.2em;
height: 1.2em;
transition: background-position .2s ease;
width: 2em;
margin-left: 0px;
}
.det-link.button-rounded:hover .arr-short {
background-position-x: right;
}
.baner-gl {background-color: #B4FF80; color: #000; margin-top: 2em; margin-bottom: 2em}
.baner-cont { padding-top: 2.5em; padding-bottom: 2.5em; display: flex; justify-content: space-between; position: relative; }
.baner-gl .baner-cont.marginesy_jakheader {padding-left: 6%; padding-right: 6%;}
.baner-gl * {color: #000; }
.baner-gl .op {flex-basis: 50%; padding-top: 1em; padding-right:2em; box-sizing: border-box; }
.baner-gl .op h1, .baner-gl .op .labl {max-width: 20rem}
.baner-gl .op .labl {padding-top: 1.2em; padding-right: 5%; box-sizing:border-box; }
.baner-gl .baner-il {
height: 26em;
width: 100%;
flex-basis: 40%;
display: flex;
align-items: center;
justify-content: center;
xpadding-right: 5%;
box-sizing: border-box;
}
.baner-gl .baner-il .im {
display: block;
background-image: url(../nn/css/../img/mapabaner.png);
position: relative;
background-size: contain;
background-position: center center;
width: 26em;
height: 26em;
background-repeat: no-repeat;
background-color: transparent; /** rgba(0,0,0,.1); */
/*background-blend-mode: darken; */
transition: transform 0.2s;
}
.baner-gl .det {
flex-basis: 40%;
align-self: flex-end; white-space: nowrap;
padding-bottom: 4%; text-align: right;
}
.baner-gl:hover .ostrz {background-position: 0em center;}
.baner-gl.miejsca .det {flex-basis: 35%}
@media (max-width: 1250px) {
.baner-gl.miejsca .det {flex-basis:22%}
}
.baner-gl.mercz .baner-cont { xpadding-bottom: 1.2em; }
.baner-gl.mercz { background-color: #FFFF4E}
.baner-gl.mercz .baner-il .im {
background-image: url(../nn/css/../img/baner_mercz.png);
}
.baner-gl.mercz:hover .baner-il .im {transform: rotate(5deg) }
.baner-gl.miejsca:hover .baner-il .im {transform: rotate(-5deg) }
.baner-gl.amadeus:hover .baner-il .im {transform: rotate(-5deg) }
.baner-gl.amadeus { background-color: #8197F3}
.baner-gl.amadeus .baner-il .im { background-image: url(../nn/css/../img/baner_amad.png); }
.baner-gl.podkast { background-color: #70E45F}
.baner-gl.podkast .baner-cont {padding-top: 3.2em; padding-bottom: 3.4em}
.baner-gl.podkast h1 {padding-top: 0.3em}
.baner-gl.podkast .op {flex-basis: 40%; padding-top:0px; padding-right: 4em;box-sizing: border-box; }
.baner-gl.podkast .baner-il {flex-basis: 50%; height: 21em; }
.baner-gl.podkast .labl p {margin-top: 0px; margin-bottom:0px; padding: 0px}
.baner-gl .det-and-logo {
flex-basis: 35%; align-self: stretch; white-space: nowrap;
text-align: center; display: flex; flex-direction: column; justify-content: space-between;
align-items: flex-end;
}
.baner-gl .det-and-logo .labl {white-space: normal; text-align: left; max-width: 28rem;}
.baner-gl .podkast-logo {height: auto ; width: 11.3em; max-width: 90%; }
.baner-gl .op .podkast-logo {width: 10em;}
.baner-gl.podkast .baner-il {position:relative; box-sizing: border-box;}
.baner-gl.podkast .baner-il img.il {
display: block; position: relative;
width: 70%; max-width: 18em;
height: auto; transition: transform 0.2s;
transform-origin: left bottom;
}
.baner-gl.podkast .baner-il img.over { position: absolute; margin-left: auto; bottom: 0px; margin-right: auto;left: 0;
right: 0;text-align: center;border-radius: 1em}
.baner-gl.podkast img.il1 {transform: translateX(3em) rotate(-15deg); }
.baner-gl.podkast img.il3 {transform: rotate(-15deg); }
.baner-gl.podkast:hover img.il1 { transform: translateX(3em) rotate(-12deg); }
.baner-gl.podkast:hover img.il2 { transform: rotate(4deg); }
.baner-gl.podkast:hover img.il3 { transform: rotate(-18deg); }
.button-frame-rounded {display: inline-flex; position: relative; padding: 1em 3em; align-items: center;
border-radius: 1.6em; background-color: transparent; border: 1px solid #000;
transition: border-radius 0.2s;
}
.button-frame-rounded:hover { border-radius: 0px;}
.button-asticket {display: inline-flex; position: relative; padding: 1.4em 2.6em; align-items: center;}
:root {
--naroznik-width: 0.8em;
}
.button-asticket .cor {position: absolute;
background-color: transparent; transition: transform 0.2s , border-radius 0.2s;
z-index: 1; width: var(--naroznik-width); height: var(--naroznik-width);
}
.button-asticket .lab { display: block; line-height: normal; }
.button-asticket .bor {position: absolute; }
.button-asticket .cor.cor1 {bottom: 0px; right: 0px;border-radius: 100% 0 0 0; border-left: 1pt solid #000; border-top: 1pt solid #000;}
.button-asticket .cor.cor2 { bottom: 0px; left: 0px; border-radius: 0 100% 0 0; border-right: 1pt solid #000; border-top: 1pt solid #000;}
.button-asticket .cor.cor3 { top: 0px; left: 0px; border-radius: 0 0 100% 0; border-right: 1pt solid #000; border-bottom: 1pt solid #000;}
.button-asticket .cor.cor4 { top: 0px; right: 0px; border-radius: 0 0 0 100%; border-left: 1pt solid #000; border-bottom: 1pt solid #000;}
.button-asticket .bor.top {top: 0px; left: var(--naroznik-width); right :var(--naroznik-width); border-top: 1pt solid #000; width: auto; }
.button-asticket .bor.bottom {bottom: 0px; left:var(--naroznik-width); right :var(--naroznik-width); border-bottom: 1pt solid #000; width: auto; }
.button-asticket .bor.right {top: var(--naroznik-width); right :0px; bottom: var(--naroznik-width); border-left: 1pt solid #000; height: auto; }
.button-asticket .bor.left {top: var(--naroznik-width); left :0px; bottom: var(--naroznik-width); border-left: 1pt solid #000; height: auto; }
.button-asticket:hover .cor {transform: rotate(180deg); border-radius: 0px;}
@media (min-width: 1500px) {
.baner-gl .op {padding-top: 3em}
.xbaner-gl h1 { font-size: 3.7em; line-height: 1em; }
.xbaner-gl .op .labl.roboto-text { font-size: 0.9em; line-height: 1.4}
}
@media (min-width: 1900px) {
.baner-gl {max-width: 108em; margin-left: auto; margin-right: auto}
.baner-gl .marginesy_jakheader.baner-cont { max-width: 75em; padding-left: 0px; padding-right: 0px;}
.baner-gl .op {padding-top: 2em}
}
@media (max-width: 1400px) {
.baner-gl .op {flex-basis: 40%}
}
@media (max-width: 1250px) {
.baner-gl .baner-il {font-size: 0.9em}
.baner-gl .det {flex-basis:22%}
}
@media (max-width: 1100px) {
.baner-gl .not-tablet {display: none}
.baner-gl .det {position: absolute; padding-left: 0px; bottom: 1em; }
.baner-gl .det-and-logo { position: absolute; padding-left: 0px; bottom: 2em;}
.baner-gl.podkast .op {flex-basis: 50%;}
.baner-gl .det:not(.with-border) {left: 5%; }
.baner-gl .det.with-border {bottom: 0px; }
.baner-gl.amadeus .baner-il {height: 29em}
.baner-gl.amadeus .op, .baner-gl.podkast .op {padding-right: 0px}
}
@media (max-width: 1000px) {
.baner-gl h1 {padding-top: 0px; }
.baner-gl .op {xpadding-top: 0px; }
}
@media (min-width: 700.0000001px) {
.baner-gl .mob {display: none}
}
@media (max-width: 700px) {
.baner-gl .desk {display: none}
.baner-gl .baner-cont {flex-direction: column; padding-top: 3.5em; padding-bottom: 3.5em}
.baner-gl .baner-cont.marginesy_jakheader {padding-left: 7%; padding-right: 7%;}
.baner-gl .det-and-logo { position: relative; bottom: unset; }
.baner-gl .det {position: static; align-self: flex-start;}
.baner-gl .baner-il {width: auto; height: auto; padding-right: 0px; align-self: center; margin-top: 4.5em; margin-bottom: 5.5em}
.baner-gl.podkast .baner-il {width: 100%; margin-top: 6em; margin-bottom: 3em; margin-left: 1em}
.baner-gl.podkast .baner-il img.over {bottom: unset; top: unset; }
.baner-gl.podkast .baner-il img.il {max-width: 22em}
.baner-gl.podkast .baner-il img.over.il2 { position: relative;}
.baner-gl.podkast h1 {max-width: none; }
.baner-gl.amadeus .baner-il {margin-top: 1em; margin-bottom: 8em}
.baner-gl .op .labl {max-width: none;}
.baner-gl.amadeus .op .labl {position: absolute; bottom: 10em;}
.baner-gl .det.with-border {bottom: 0px; padding-bottom: 0px; }
.baner-gl.amadeus .op {padding-top: 0px;}
.baner-gl .det-and-logo {align-items: flex-start; row-gap: 2em; }
}
@media (max-width: 400px) {
.baner-gl .baner-il .im {width: 80vw; height: 80vw}
}
/** =================================================================== */
@media screen and (min-width:1670px){
body:not(.kasjer) .marginesy_jakheader {padding-left: calc(50% - 718px); padding-right: calc(50% - 750px) }
}
@media screen and (min-width:2070px){
body.kasjer .marginesy_jakheader {padding-left: calc(50% - 718px); padding-right: calc(50% - 750px) }
}
@media screen and (min-width:1500px){
/** wysokosc głównego okna na bardzo dużych monitorach */
.glw-news-box:after {padding-top: 38% }
.glw-news-box.dlugi .caption h1 {width: 55%}
}
@media screen and (max-width:1370px){
.marginesy { padding-left: 5%; padding-right: 5%}
.marginesy_szer { padding-left: 2.5%; padding-right: 2.5%}
.marginesy_szer.for-scroll { padding-left: 5%; padding-right: 5%}
}
@media screen and (max-width:1259px){
.glw-news-box:after {padding-top: 45%;}
.marginesy:not(.niezwezaj) {max-width: 850px; padding-left: 5%; padding-right: 5%}
.przyciski-bar {xpadding: 0px 5%; xmax-width: 850px;}
section.news .to-hide {display:none;}
.single-box:after {padding-top : 100%}
.skleplist .single-box:after {padding-top : 120%}
.big-box:after {padding-top : 49%}
.news, .recenzje , section.nhvod .big-box-and-lead {margin: 0 auto;max-width: 850px; }
.news-box { width: 48%; margin: 1%;}
.big-box {width: 98%;}
.article-box {width: 50%; }
.xarticle-box {width: 48%; margin-left: 1%; margin-right:1%; }
.article-box.filmzplakatem {width: 33.3333%; max-width: 300px}
.wkinach.niecalysezon .bx_3 {display: none; }
.xsocmentions .insta { width: 33.3333%; }
.xsocmentions .insta:LAST-CHILD {display: none}
}
@media screen and (max-width:1100px) {
.glw-news-box.dlugi:after {padding-top:50%}
.one-box {min-width: 0px; width: 100%; max-width: 100%}
.one-box.film {width: 100%}
.one-box.film .caption {padding: 1.4em 0em 1.4em 3.5em}
}
@media screen and (max-width:950px) {
.article-box.filmzplakatem {width: 50%}
.wkinach.niecalysezon .bx_2 {display: none; }
}
@media screen and (max-width:900px) {
.trzylinki .clw {width: 100% !important;}
.trzylinki .cl, .trzylinki .cltyt {width: 100% !important; padding-right: 0; margin-bottom: 3em; text-align: center; display: block; }
.trzylinki .cl .w {xfont-size: 1.4em; margin: 0.5em 0}
.trzylinki .cl.ps3 {margin-bottom: 1em}
.glw-news-box.dlugi:after {padding-top:60%}
.one-box .caption {padding: 1.8em 2em}
.one-box.film .caption {padding: 1.2em 0em 1.2em 3.5em}
}
@media screen and (max-width:840px) {
html { font-size:100%; }
.hb, H1, H2, H3, h4, h5 {line-height: 110%}
.big-box .caption {left: 50%; width: 48% ; }
.glw-news-box:after {padding-top: 60%}
.article-box:not(.filmzplakatem) .caption {padding: 8% 8%; height: 38% }
.przyciski-bar, .przyciski-bar.marginesy { padding-left: 2%; padding-right: 2%}
.forum .cl, .forum .cl.tyt {width: 100%; padding-right: 0; margin-bottom: 3em; text-align: center}
.forum .cl .w {xfont-size: 1.4em; margin: 0.5em 0}
.sklep-box {width: 47%; margin-right:0;}
.sklep-box:LAST-CHILD {display: none}
.sklep-box:FIRST-CHILD { margin-right: 6%}
.one-box {max-width: 450px;}
.one-box.film {max-width: 350px;}
.one-box .caption {padding: 1.8em 2em; width: 100%; position: relative}
.one-box.film .caption { padding: 2em 0em 0em 0em; width: 100%; position: relative}
.one-box .image-cont, .one-box.film .image-cont {width: 100%;}
.xone-box:not(.film) .image-cont:after {padding-top: 55%}
.one-box .caption .data {padding-top: 1em}
.one-box.film .caption .led {max-height: none; margin-bottom: 1em}
.rozbiegowka .wkinach {padding-bottom: 3em}
.article-box.filmzplakatem .caption .f6 { font-size: 15px;}
.article-box.filmzplakatem:not(.wydarz-box) .caption {font-size: 1em; padding-top: 9%; padding-bottom: 9%; }
.marginesy_szer.for-scroll { padding-left: 5%; padding-right: 0px}
}
@media screen and (max-width:700px) {
.glw-news-box .caption H1, .glw-news-box.dlugi .caption h1 {width: auto; }
.article-box {width: 100%}
.article-box.filmzplakatem {width: 100%; max-width: 300px}
.one-box {margin: 4% auto; }
.one-box {max-width: 400px;}
.przyciski-bar, .przyciski-bar.marginesy {margin: 0 0 0 0; padding-top: 2em }
.przyciski-bar .przyciski {padding: 0; }
.przyciski-bar .przyciski a.mob-only {display: flex}
.przyciski-bar .przyciski A, .przyciski-bar.dwa .przyciski A {max-width: 270px ; HEIGHT: 4.2em; padding-left: calc(3% + 1em) ; display: flex; margin: 0.5em auto ; width: auto;}
.przyciski-bar .przyciski A.szukaj { max-width: min(100%,270px); border: 1px solid #000; margin-bottom: 1.5em }
.glw-news-box:after {display: none;}
.glw-news-box .caption {position: relative; min-height:13em; margin-top: 6em; margin-bottom: 6em; display: block; top: auto; transform: none;}
.recenzje .zobaczwszy {margin-top: 0}
.news {padding-top: 2.5em}
.news .heder {margin-bottom: 1em}
.news, .recenzje, .inneartykuly {margin: 0 auto; text-align: center; }
.big-box:after, .single-box:after {padding-top:100%}
.skleplist .single-box:after {padding-top:100%}
section.news .to-hide {display:inline-block;}
.news-box { width: 100%; margin: 3% auto; }
.news-box, .article-box { max-width: 400px}
.single-box .caption { padding: 4% 5%; }
.single-box:not(.sticky):after {display: none}
.big-box.video .image, .single-box:not(.sticky) .image {position: relative; height: auto; }
.big-box.video .image:after, .single-box:NOT(.sticky) .image:after { content: ""; display: block; padding-top: 60%}
.big-box.video .caption, .single-box:NOT(.sticky) .caption {position: relative; height: auto; max-height: none; padding: 7% 6%}
.single-box:NOT(.sticky) .caption h5 {height: auto; max-height: none;}
.single-box:NOT(.sticky) .caption .lab {margin-bottom: 7%}
.big-box.video .data, .single-box:NOT(.sticky) .caption .data {position: static; bottom: auto; margin-top: 7%}
.big-box.video .caption {padding-bottom: 8%}
.big-box.video .caption .lab {display: block; color: var(--magentac); text-align: center}
.big-box.video:after {display: none}
.news-box.video .play {top : 30%;}
.big-box.video .caption {left: auto; width: 100%; background-color: #fff; text-align: center;}
.big-box.video .caption .data { color: #808080; }
.big-box.video .caption .h { color: #1c1c1c; font-size: 1.26em }
.article-box:not(.filmzplakatem) .caption {padding: 8% 8%; height: 38% }
.article-box .caption .f6 {font-size: 1.2em;}
.big-box { width: 100%; }
.big-box .caption { left: 10%; width: 80%; }
.xsocmentions .insta {width: 100%; display: inline-block !important; border: none;}
.xsocmentions .insta:LAST-CHILD {display:inline-block;}
.trzylniki .cl .w, .forum .cl .w {font-size: 1.15em; }
.logotypylista {font-size: 90%}
}
@media screen and (max-width:550px){
html { font-size:95%; }
.glw-news-box .caption H1 , .glw-news-box.dlugi .caption H1 {width: 90%}
.xglw-news-box:after {padding-top: 75%}
.xpadinggd {padding-top: 3em; padding-bottom: 3em}
.xforum .cl.ps2 {width: 50%; padding-right: 0}
.xforum .cl.ps1 {width: 46%; padding-right: 4%}
.xforum .cl.ps3 {display: none}
.sklep-box {text-align: center; width: 100%; margin-right:0 !important; margin-bottom: 10%; display: none;}
.sklep-box:FIRST-CHILD {display: block}
.sklep-box .image-cont {margin-bottom: 7%}
.sklepskrot .zob {text-align: center}
.sklepskrot .marginesy {xpadding: 0}
}
@media screen and (max-width:400px) {
.glw-news-box.dlugi .caption .morelink {display: none; }
.glw-news-box.dlugi .caption H1 { padding-bottom: 0px; }
.glw-news-box .caption .morelink {font-size: 1.13em;}
.morelink {font-size: 1.13em}
.glw-news-box .roboto-head {font-size: 13px;}
.glw-news-box .caption {top: auto; bottom: 12%; transform: none; padding-left: 5%; padding-right:5%}
.article-box:not(.filmzplakatem) .caption {padding: 7% 7%; height: 40% }
.article-box.filmzplakatem .caption .f6 {font-size: 15px;}
.newsletter .pola .email {width: 60%}
}
@media screen and (max-width:350px){
.single-box .caption {height: 50%; max-height: 50%}
}
@media (pointer:coarse) {
.hover_und_anim:after {display:none}
.hover_und_anim:hover:after {display:none}
}
header { font-size: 0.95em; display: block; overflow: hidden; padding: 0.8em 5% 0em 5%; font-family: PFHandbookProMedium; background-color: #fff }
header .limit {max-width: 1500px; margin: 0 auto; overflow: hidden; position: relative; }
header .nagl {display: block; height: 3.8em; max-width: 25em; width: 25em; float: left; margin: 1em 0px 1.8em 0em; background-size: contain;}
html[lang=en] header .nagl {xmax-width: 23.8em}
html[lang=pl] header .nagl {background-image: url(../nn/css/../img/logo_nh25o_pl.svg); }
html[lang=en] header .nagl {background-image: url(../nn/css/../img/logo_nh25o_en.svg); }
.loga {max-width: 150px; xmax-height: 35px; width: 5.1em; display: block; float: right; margin: 1.2em 0px 1em 0px;}
.loga .lg {width: 100%; }
.lang { color: #373737; float: right; margin: 1.5em 0px 0px 1.2em; text-transform: lowercase;}
.soc {margin: 1.3em 0px 1em 1.1em}
.soc a[href=""] {display: none}
.nav-log {clear: both; display: flex; justify-content: space-between; align-items: baseline;}
nav.desk {display: inline-block; margin-left: 1.71em}
nav.desk a { color: #000; padding: 2% 1.2em 2% 0px; text-transform: lowercase; transition: transform 0.2s; display:inline-block;}
.dark-top nav.desk a {color: var(--dark-top-wh)}
nav.desk a:not(.selected):hover {color: var(--magentac); transform: translateY(-0.13em); }
nav.desk a.selected { color: var(--magentac); text-decoration: underline; text-underline-position: under; text-decoration-thickness: 1pt; }
.dark-top nav.desk a:hover {color: var(--dark-top-wh-hover)}
.dark-top nav.desk a.selected { color: var(--dark-top-wh-hover)}
.hamburger { display:block; }
header .pasgor { display: block; height: 0px; background-color: #fff; position: relative; top:0; left:0; z-index: 991;box-sizing: border-box;
overflow: hidden; width: 100% ;
}
header .pasgor .pasgor-cont {overflow: hidden; position: relative}
header .pasgor-cont.limit {padding-right: 5px; max-width: none; padding-left: 1.5em}
.fixhedlogo {display: inline-flex; padding-top: 0.85em; padding-bottom:0.85em; float: left; align-items: center; max-width: 60%; text-align: left; }
.fixhedlogo .img {display: inline-block; max-height: 1.3em; height: 1.3em; width: 6em; transition: opacity 0.2s }
.fixhedlogo .img {background-image: url(../nn/css/../img/logo25sygnbnp.svg); background-size: auto 1.3em;}
body.nh header.mb .fixhedlogo .img {background-image: url(../nn/css/../img/logo25sygnbnp.svg); background-size: auto 1.3em;}
.fixhedlogo.is-active .img {opacity: 0; }
header.fixed .pasgor {transition: all 0.2s ease-in-out; height: 3em; display: block; position: fixed; border-bottom: 1px solid #f0f0f0; }
header .zalogowany, header .niezalogowany { box-sizing:border-box; padding: 1.3em 0px 1.3em 1.2em; vertical-align: middle; height:3.5em; white-space: nowrap; }
header .zalogowany { background-color: #EEEEEE; padding-right: 1.2em; }
header .zalogowany .loggedus { display: inline-block; xtext-transform: lowercase; margin-right: 1em; max-width: 20em; overflow: visible; color: #373737; }
header .zalogowany .loggedus span.a {display: block; float: left; background-image: url(../nn/css/../img/avatar2.svg); background-size: cover; width: 1.4em; height: 1.4em; background-position: 0 0; margin-right: 0.7em; margin-top: -0.25em}
header .zalogowany .loggedus:hover {color: var(--magentac)}
header .zalogowany .loggedus span.l {display: inline-block; line-height: normal;}
header .zalogowany .kosz { display: inline-block; color: #373737; margin-right: 1em}
header .zalogowany .kosz:hover {color: var(--magentac)}
header .zalogowany .punkty { color: #373737; background-image: url(../nn/css/../img/kos/karnet_gora.svg); background-size: auto 0.9em; background-position: left 0px;padding-left: 1.2em; margin-right: 1em}
header .zalogowany .punkty:hover {color: #373737; }
.dark-top header .zalogowany .koszsvg { stroke: var(--dark-top-wh); }
.dark-top header .zalogowany .kosz:hover .koszsvg { stroke: var(--dark-top-wh-hover) }
.dark-top header .zalogowany .loggedus span.a {background-image: url(../nn/css/../img/avatarff.svg); }
.dark-top.dark-top-blue header .zalogowany .loggedus span.a {background-image: url(../nn/css/../img/avatarbl.svg); }
.dark-top .zalogowany .loggedus:hover {color: var(--dark-top-wh-hover)}
.dark-top header .zalogowany .kosz:hover {color: var(--dark-top-wh-hover)}
header .zalogowany .punkty.pakiet.vod { background-image: url(../nn/css/../img/vod/pakiet37.svg); background-size: 1em auto; padding-left: 1.2em; background-position: left 0.08em }
header .zalogowany .punkty.pakiet.vod.pakiet-expired { background-image: url(../nn/css/../img/vod/pakiet-disabl.svg); }
.dark-top header .zalogowany .punkty {color: var(--dark-top-wh); background-image: url(../nn/css/../../img/kos/karnet_goraff.svg);}
header .zalogowany .punkty, header .zalogowany .kosz {vertical-align: top}
header .zalogowany .koszsvg {transition: all 0.2s; stroke:#373737; }
header .zalogowany .kosz:hover .koszsvg { stroke: var(--magentac) }
header .zalogowany .kosz span.iloscbiletowwkoszyku { line-height: 1}
header .zalogowany .kosz svg { float: left; margin-top: -1px; margin-right: 0.5em}
header .kosz.blyskamy .koszsvg { xstroke: var(--magentac) ; }
header .kosz.blyskamy .koszsvg {transition: none; }
header .kosz.blyskamy, header .kosz.blyskamy .koszsvg { animation-name: blyskaniekosz; animation-duration: 3s; animation-iteration-count: 1; animation-direction: alternate; }
@keyframes blyskaniekosz {
0% { color: #373737; stroke: #373737}
7% { color: #373737; stroke: #373737}
12% { color: var(--magentac); stroke: var(--magentac) }
50% { color: var(--magentac);stroke: var(--magentac) }
100% { color: #373737;stroke:#373737 }
}
header .zalogowany .wyl {display: inline-block; vertical-align: top; text-transform: lowercase; }
header .pasgor .zalogowany {height: 3em; margin-right: 6px; float: right; display: inline-block; width: auto; margin-top: 0; padding: 0.9em 1.2em 0.95em 1.1em; margin-left: 1em}
header .pasgor .zalogowany .wyl {float:none}
xheader.fixed .pasgor .zalogowany {display : none}
.soc { xmax-height: 25px; xwidth:10em; display: flex; float: right; }
.soc a.kd-menuprz, .kd-menuprz {display: none}
.soc a {display: inline-block; background-position: center 0.15em; background-size: 1em 1em; width: 2.1em; xopacity: 0.85 ; transition: all 0.3s;}
.soc a.fb {background-image: url("../nn/css/../img/v2/social_face.svg");}
.soc a.twit {background-image: url("../nn/css/../img/v2/social_twit.svg");}
.soc a.inst {background-image: url("../nn/css/../img/v2/social_insta.svg"); background-size: auto 1.1em; }
.soc a.tiktok {background-image: url("../nn/css/../img/v2/social_tiktok.svg");}
.soc a.yt {background-image: url("../nn/css/../img/v2/social_yt.svg"); background-size: auto 0.9em; background-position: 0.85em 0.28em; width: 2.7em}
.soc a.nhvod {background-image: url("../nn/css/../img/v2/nhvodlogon.svg"); background-size: auto 1em; width: 5em; height: 1.5em; xmargin-right: 0.6em}
.soc a.edumh {background-image: url("../nn/css/../img/vod/nhef/mhedu.svg"); background-position: center 0.1em; background-size: auto 1.1em; width: 9.5em; height: 1.3em; }
nav.mobile .soc a.edumh {width: 8em; margin-top: 0.5em; font-size: 1.2em}
body:not(.nhef) .soc a.edumh {display: none}
.soc a:before { content: ""; float: left; display: block; padding-top: 100% }
.soc a.nhvod:before,.soc a.kd-menuprz:before { display: none;}
.soc a:not(.kd-menuprz):hover { opacity: 1.0; transform: translateY(-0.12em); }
.desk.soc a.nhvod:hover, .desk.soc a.edumh:hover {transform: translateX(-0.14em); }
.soc a:last-child { margin-right: 0px}
.desk.soc {transform: translateX(0.6em)}
nav.mobile .soc {xtransform: translateX(-0.5em) ; flex-wrap: wrap; }
.dark-top .soc a.nhvod {background-image: url("../nn/css/../img/nhvodlogonff.svg"); }
.dark-top .soc a.fb {background-image: url("../nn/css/../img/social_faceff.svg");}
.dark-top .soc a.twitt {background-image: url("../nn/css/../img/social_twitff.svg");}
.dark-top .soc a.inst {background-image: url("../nn/css/../img/social_instaff.svg");}
.dark-top .soc a.tiktok {background-image: url("../nn/css/../img/social_tiktokff.svg");}
.dark-top .soc a.yt {background-image: url("../nn/css/../img/social_ytff.svg");}
.dark-top.dark-top-blue .soc a.nhvod {background-image: url("../nn/css/../img/nhvodlogobl.svg"); }
.dark-top.dark-top-blue .soc a.fb {background-image: url("../nn/css/../img/social_facebl.svg");}
.dark-top.dark-top-blue .soc a.twitt {background-image: url("../nn/css/../img/social_twitbl.svg");}
.dark-top.dark-top-blue .soc a.inst {background-image: url("../nn/css/../img/social_instabl.svg");}
.dark-top.dark-top-blue .soc a.tiktok {background-image: url("../nn/css/../img/social_tiktokbl.svg");}
.dark-top.dark-top-blue .soc a.yt {background-image: url("../nn/css/../img/social_ytbl.svg");}
.loguj { font-weight: 500; color: var(--magentac); xmargin-left: calc(1.7% + 5px);}
.xmloguj {font-size: 1em; color: var(--magentac); float: left; margin-left: 1% }
.nhfest .soc a.tiktok, .nhfest .soc a.twit { display: none;}
.xnhfest .nhvod {display: none} /** gdy trwa, TODO: może dorobić clasę css że trwa? */
.profiluz {padding-left: 3%; padding-right: 3%}
.profiluz .wi {display: block; margin-top: 0.7em; margin-bottom: 0.7em; margin-left: 0em; padding-left: 2.1em; background-size: auto 1em; background-position: left 0; }
.profiluz a.wi {color: #373737; background-position: left center; }
.profiluz a.wi:hover { color: var(--magentac);}
.profiluz .koszyku { background-image: url(../nn/css/../img/kos/koszlt.svg); background-position: 0.2em 0.1em }
.profiluz .maszkarnet { background-image: url(../nn/css/../img/prof_karnet.svg); background-position: 0.05em 0.15em; background-size: 1em auto; }
.profiluz .maszkarnet span.inf, .profiluz .maszpakiet span.inf {display: block; font-size: 0.8em; max-width: 21em; margin-top: 0.8em; line-height: 1.3 }
.profiluz .maszkarnet span.inf + span.inf {margin-top: 0.5em}
.profiluz .maszkarnet .karn {display: inline-block; margin-right: 1em; }
@media screen and (max-width:410px) {
.profiluz .maszkarnet .karn {xmargin-right: 2em;}
}
.profiluz .cyfrowy { display: inline-block; color: #373737; position: relative }
.xprofiluz .cyfrowy:after {content: ''; width: 100%;bottom:3px; position:absolute; height: 1px; display: block; background: #373737; transition: bottom 0.2s;}
.xprofiluz .cyfrowy:hover:after { bottom: 1px;}
.profiluz .pobierz:hover {background-position: left 0.2em;}
.profiluz .maszpakiet { background-image: url(../nn/css/../img/vod/pakietc_light.svg); background-position: 0px 0px; background-size: 1.25em auto; }
.profiluz .profil-info {width: 30em; max-width: 100%}
.profiluz .profil-info .wi {font-weight: 300; padding-bottom: 0.3em; line-height: normal; }
.profiluz .profil-links {max-width: 15em; margin-top: 2em; margin-left: auto; margin-right: auto; }
.profiluz .przy-wyl { max-width: 15em; margin-left: auto; margin-right: auto; margin-bottom: 1.5em}
@media screen and (max-width:600px) {
.profiluz .przy-wyl {max-width: 15em; }
.profiluz .profil-links { max-width: 10em}
}
.profiluz .dziesiec { background-image: url(../nn/css/../img/kos/dziesiec.svg); }
.profiluz .dwadziescia { background-image: url(../nn/css/../img/kos/dwadziescia.svg); }
.profiluz .przycisk.zramka {width: 100%;margin-top: 1.5em}
.profiluz h5 {padding-bottom: 0.1em}
.profiluz .edytujprof {text-transform: lowercase;display: block; margin-bottom: 0.4em; color: var(--magentac)}
.profiluz .edytujprof:hover {text-decoration: underline;}
.profiluz .mojezam {text-transform:lowercase; background-image: url(../nn/css/../img/lista.svg); background-size: auto 0.7em; }
.profiluz a.mojezam.wi { background-position: 0.1em center; }
.profiluz .kupione {text-transform:lowercase; background-image: url(../nn/css/../img/vod/dostep.svg); }
.profiluz .oznaczone {text-transform:lowercase; background-image: url(../nn/css/../img/vod/gwiazdkab.svg); }
.profiluz .online {text-transform:lowercase; background-image: url(../nn/css/../img/vod/onlineicon12.svg); background-size: auto 0.9em }
.profiluz .rezerwacje { background-image: url(../nn/css/../img/rezerwujb.svg); background-size: auto 0.8em }
.profiluz .kupione, .profiluz .oznaczone {display: none}
.profiluz .online { display: none}
body.nhfest .profiluz .online { display: block}
.profiluz .userav {display: none; vertical-align: top; margin-top:0.5em; width: 2.3em; height: 2.3em; background-size: cover; border-radius: 50%; margin-right: 0.5em}
.profiluz .loginprof {display:inline-block; margin-bottom: 1em}
.profiluz .wi.kupon {padding-left: 0px; max-width: 23em}
.profiluz .wi.pakietinfo, .pakietinfo {display: none}
.profiluz .wi.pakietinfo.jest, .pakietinfo.jest {display: block}
#przyciemnionetlo {
position: fixed; display: block;
height: 100%; left: 0; top: 0; width: 100%;
background-color: transparent;
visibility: hidden;
-webkit-transition: background-color 0.2s ease-in 0.1s, visibility 0s linear 0.2s;
transition: background-color 0.2s ease-in 0.1s, visibility 0s linear 0.2s;
z-index: 990;
}
#przyciemnionetlo.is-active {
visibility: visible; background-color: rgba(0, 0, 0, 0.7);
transition-delay: 0s;
-webkit-transition-delay: 0s
}
nav.mobile {font-size: 1.1em; min-width: 14em}
.submobile > a, nav.mobile > a {color: #000; padding: 0.4em 0px; margin: 0px 0px; display: block; text-align: left; text-transform: lowercase;}
.submobile > a:hover, nav.mobile > a:hover ,nav.mobile a.selected {color: var(--magentac)}
.submobile {font-size: 90%; padding-left: 1.5em}
nav.mobile > a:not(.nh-menuprz) {transition: transform 0.2s; }
nav.mobile > a:not(.hover_und_anim):not(.nh-menuprz):not(.kd-menuprz):hover { transform: translateX(0.12em); }
nav.mobile .soc a {transition: transform 0.2s }
nav.mobile .soc a:hover {transform: translateY(-0.13em); }
nav.mobile .soc a.nhvod {width: 100%; order: 5; margin-top: 0.6em; margin-right: 0px; }
nav.mobile .soc a.nhvod:hover {transform: translateX(0.13em); }
nav.mobile .mloga.logosponsora {display: none}
.dark-top .submobile > a, .dark-top nav.mobile > a { color:var(--dark-top-wh)}
nav.mobile a.mg { float: left; margin: 0}
nav.mobile a.lang {clear: both; float: left; margin-top: 0; }
nav.mobile a.lang:hover {color: inherit;}
nav.mobile a.ost {padding-bottom: 0px; margin-bottom: 0.5em}
nav.mobile .prz {float: left; clear: both; display: block; width: 1.5em; border-top: 2pt solid #000; margin: 1.1em 0}
.dark-top nav.mobile .prz { border-top-color: var(--dark-top-wh)}
nav.mobile {padding: 1em 7em 1em 4em;}
nav.mobile .soc {float:left; clear: both; margin: 2.5em 0px 0.5em 0px; overflow: hidden; }
nav.mobile .soc a {background-position: left center ; }
nav.mobile .mloga {float:left; clear: both; display: block; padding: 0.5em 0 ; overflow: hidden;}
nav.mobile .mloga img {width: 5em }
nav.mobile {
display: block;
background: #fff;
position: fixed;
max-width: 440px;
height: 100%;
top: 2.73em;
right: 0;
overflow: scroll;
overflow-x: hidden;
overflow-y: auto;
box-sizing: border-box;
-webkit-transform: translate(100%, 0);
-moz-transform: translate(100%, 0);
transform: translate(100%, 0);
-webkit-transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
z-index: 994;
}
nav.mobile.is-active {
-webkit-transform: translate(0%, 0);
-moz-transform: translate(0%, 0);
transform: translate(0%, 0);
}
#wrapper.is-active {
z-index: 0 !important
}
nav.mobile .soc {max-width: 10em;
margin-left: auto;
margin-right: auto;}
@media screen and (min-height: 600px) {
body:not(.nhfest) nav.mobile .skroty {position: absolute; bottom: 13%; z-index: -1}
}
@media screen and (min-height: 700px) {
body.nhfest nav.mobile .skroty {position: absolute; bottom: 13%; z-index: -1}
}
@media screen and (min-width:1500px) {
nav.mobile { max-width: none; padding-right: calc(50% - 750px - -4em); }
}
@media screen and (max-width:1259px) {
nav {margin-left:0px}
}
@media screen and (max-width:1100px) {
header .loga {width: 5em; max-width: 25%; xmargin-top: 1.4em}
header { padding-left: 4%; padding-right: 4%}
.marginesy_jakheader {padding-left: calc(4% - -1.5rem); padding-right: 4%}
header .zalogowany.gdyf .wyl {display: none;}
header .zalogowany.gdyf .punkty {margin-right: 0}
header .zalogowany.gdyf .punkty.onsite + .punkty.vod {margin-left: 1em}
header .zalogowany.gdyf .kosz {margin-right: 0.8em}
}
@media screen and (max-width:960px) {
header {font-size: 0.9em; padding-left: 2%; padding-right: 2%}
.marginesy_jakheader {padding-left: calc(2% - -1.5rem); padding-right: 4% /** było 2% ale zmieniłem na 4% bo np. strzałka przy sliderze się nie mieściła */}
header .zalogowany.gdyf .loggedus span.l {max-width: 120px; overflow:hidden; white-space: nowrap;}
}
@media screen and (max-width:900px) {
header .zalogowany.gdyf .loggedus span.l {max-width: 80px; }
}
@media screen and (min-width:841px) {
#przyciemnionetlo {visibility: hidden}
}
@media screen and (max-width:840px) {
header {font-size: 1em; padding: 1em 2.7% 1em 3%;}
header .pasgor-cont.limit { padding-left: 5%}
.marginesy_jakheader {padding-left: 5%; padding-right: 5%}
/** zmienia się menu na hamburgera */
.nav-log, nav.desk {display: none}
header .nagl .mobile {display: block}
header .nagl .desk {display: none}
header .nagl { margin: 3.5em 0px 1em 0px; width: 80%; max-width: 400px;}
.loggedin header .nagl {margin-top: 4em}
header .loga {width: 6em; position: absolute; right:0;bottom:0; }
header .loga img {vertical-align: bottom;}
header:not(.fixed) .fixhedlogo {display:none}
header .desk.soc, header .lang { display: none}
header .loguj { display: none}
header .zalogowany.gdyf { display: none}
header .pasgor {display: block; height: 3.6em; position: fixed; }
header .hamburger {margin-top: 0.21em}
header.fixed .pasgor {transition:none; height: 3.6em}
header .pasgor .zalogowany {height: 3.6em; padding-top: 1.35em}
header .pasgor .kd-menuprz {display: none;}
.fixhedlogo .img {height: 2em; max-height: 2em; background-size: auto 1.4em; background-position: left center;}
header .pasgor .fixhedlogo, header.fixed .pasgor .fixhedlogo { padding-top: 0.8em; padding-bottom: 0.8em; }
nav.mobile {padding-right: 4em}
nav.mobile {padding-top: 1em; font-size: 120%; top: 3em;}
nav.mobile .soc {margin-top: 1em; margin-bottom: 0px;}
nav.mobile > a { font-size: 110%; }
}
@media screen and (max-width: 800px) {
nav.mobile {top: 2.77em; font-size: 130%} /** wysokość podzielona przez font size - 3.6 / 1.3*/
}
@media screen and (max-width:550px) {
header {padding: 1em 22px 1em 4%;}
header .loga {position: static; float: left; clear: both; margin-left: 29px; max-width: 30%; }
header .nagl { width: 100%; max-width: 400px !important;}
header .zalogowany .loggedus span.l {max-width: 85px; overflow:hidden; white-space: nowrap;}
header .pasgor-cont.limit { padding-left: 4%}
header .pasgor { min-width: 100px;}
header:not(.rez) .pasgor.zalo, header.rez .pasgor.zalo {background: linear-gradient(to right, #eee 0%, #eee 70%, #fff 70.1%, #fff 100%) }
header .pasgor.zalo .fixhedlogo {display: none}
header .pasgor .zalogowany { float: left; margin-left: 0; display: inline-block; width: 80%; width: calc(100% - 56px ); padding-top: 1.25em; margin-top: 0; padding-left: 0}
header .pasgor .zalogowany .wyl {float: right; margin-right: 0.5em}
nav.mobile .soc {font-size: 120% }
nav.mobile > a { font-size: 130%; }
}
@media screen and (max-width:500px) {
nav.mobile { width: 100%; max-width: none; padding-right: 0 }
xnav.mobile > a { text-align: center}
xnav.mobile .soc {margin-left: auto; margin-right: auto; text-align: center}
xnav.mobile .mloga {margin-left: auto; margin-right: auto; text-align: center; width: 60%; min-width: 170px;}
header .zalogowany .punkty {margin-right: 0}
header .pasgor .zalogowany .wyl {display: none}
}
@media screen and (max-width: 400px) {
header .zalogowany .punkty.pakiet.vod {display: none}
nav.mobile {top: 3em; font-size: 120%}
header .loga {xmargin-left: 8.627%; margin-left: 7%}
}/*!
* Hamburgers
* @description Tasty CSS-animated hamburgers
* @author Jonathan Suh @jonsuh
* @site https://jonsuh.com/hamburgers
* @link https://github.com/jonsuh/hamburgers
*/
.hamburger:focus { outline: none; }
.hamburger {
padding: 15px 15px 15px 15px;
xwidth: 30px;
text-align: center;
xheight: 30px;
xposition:absolute;
float: right;
right: 0;
top: 0;
}
.hamburger-box {
width: 30px;
height: 22px;
display: inline-block;
position: relative; }
.hamburger-inner {
display: block;
top: 50%;
margin-top: -2px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
width: 30px;
height: 4px;
background-color: #000;
border-radius:3px;
position: absolute;
transition-property: transform ;
transition-duration: 0.15s;
transition-timing-function: ease; }
.hamburger-inner::before, .hamburger-inner::after {
content: "";
display: block; }
.hamburger-inner::before { top: -10px; }
.hamburger-inner::after {bottom: -10px; width: 20px; }
.hamburger.is-active .hamburger-inner::after,
.hamburger-box:hover .hamburger-inner::after { width:30px; }
.hamburger--squeeze .hamburger-inner {
transition-duration: 0.075s;
transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.hamburger--squeeze .hamburger-inner::before {
transition: top 0.075s 0.12s ease, opacity 0.075s ease;
}
.hamburger--squeeze .hamburger-inner::after {
transition: width 300ms ease, bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.hamburger--squeeze.is-active .hamburger-inner {
transform: rotate(45deg);
transition-delay: 0.12s;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
.hamburger--squeeze.is-active .hamburger-inner::before {
top: 0;
opacity: 0;
transition: top 0.075s ease, opacity 0.075s 0.12s ease;
}
.hamburger--squeeze.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(-90deg);
transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.hamburger-box {width: 20px; height: 18px;}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 20px; height: 3px;}
.hamburger-inner::before { top: -7px; }
.hamburger-inner::after {bottom: -7px; width: 13px; }
.hamburger.is-active .hamburger-inner::after, .hamburger-box:hover .hamburger-inner::after { width:20px; }
@media screen and (min-width:1600px) {
.hamburger {padding-top: 17px;}
}
@media screen and (max-width:700px) {
/** to jest żeby zlikwidować hover na komórkach */
.hamburger-box:hover .hamburger-inner::after {width: 13px; }
.hamburger.is-active .hamburger-inner::after {width: 20px}
}
.dark-top .hamburger-inner, .dark-top .hamburger-inner::before, .dark-top .hamburger-inner::after {background-color:var(--dark-top-wh)}
.ilustracja.full, .ilustracja.full .overlay {position: relative; background-size: cover; width: 100%; background-position: center center; }
.aktualnosc .ilustracja.full:after, .ilustracja.full .overlay:after {content: ""; display: block; padding-top: 41%; }
.aktualnosc .ilustracja.full, .aktualnosc .ilustracja.full .overlay { max-height: 660px;}
.aktualnosc .ilustracja.full:after { padding-top: 41%;}
.rozbiegowka .ilustracja.full .overlay:after { padding-top: 51%;}
.rozbiegowka .ilustracja.full, .rozbiegowka .ilustracja .overlay {max-height: 480px;}
.ilustracja.video {cursor: pointer;}
.ilustracja.full, .ilustracja .overlay {max-height: 660px}
.ilustracja.full.dlugi, .ilustracja.full.dlugi .overlay {max-height: 680px}
.ilustracja.full.dlugi .overlay:after { padding-top: 70%; }
.ilustracja:after { pointer-events:none; }
.ilustracja.full:after {display:none}
.ilustracja .caption { width: auto; color: #fff;}
.ilustracja:not(.zopisem) .caption {left: 0; right: 0; position: absolute; xtop: 50%; transform: none; bottom: 20%}
.ilustracja .caption .tekst {color: #fff; max-width: 600px; }
.ilustracja .caption .tekst p A {color: #fff;}
.ilustracja .overlay {overflow: hidden;background-color: rgba(0, 0, 0, 0.4) }
.ilustracja.tlo .overlay { background: transparent;}
.ilustracja.tlo, .ilustracja.tlo .overlay {max-height: 12em; }
.ilustracja .caption h1 {color: #fff; max-width: 600px; padding-bottom: 0.3em}
.ilustracja .caption .tekst.f5 {line-height:1.4em; }
.ilustracja .caption .tekst.f5 p, .ilustracja .caption .tekst.f5 span {line-height: inherit;}
.ilustracja .caption .morelink { color: #fff;font-size: 0.95em; display: block; margin-top:2em; background-image: var(--dluga-strzalka-white);}
.ilustracja .caption .s {text-decoration: none; display: block; background-image: var(--dluga-strzalka-white); background-position: -1.5em center;
color: #fff;font-family: PFHandbookProMedium; padding-left: 2.5em; display: inline-block; overflow: hidden; background-size: auto 0.7em;
transition: padding-left .2s ease, background-position .2s ease;
}
.ilustracja .caption .s:hover {background-position: 0em center; padding-left: 4.1em; color: #fff;}
.ilustracja .caption .s.mt-1 { margin-top:1em; }
.ilustracja .caption .s.mt-2 { margin-top:2em; }
.ilustracja.zopisem, .ilustracja.full.zopisem, .ilustracja.zopisem .overlay { max-height: none;}
.ilustracja.zopisem:after, .ilustracja.zopisem .overlay:after {display: none}
.ilustracja.zopisem .caption {position: relative; padding-top: 7em; padding-bottom: 6em;
padding-top: min(7em,13vh); padding-bottom: min(6em,21vh);
}
.ilustracja span.podpis {color: #fff; position: absolute; bottom: 2em; right: 2em; font-size:12px;line-height: normal;}
.ilustracja .overlay .podpis {color: #eee}
.ilustracja.tlo {background-color: #1C1C1C; max-height: 16em;}
.strona { background-color: #fff; padding-bottom: 1em; }
.strona.aktualnosc, .bialyh { border-top: 0.16em solid #e7e7e7; padding-top: 1em; background-color: #fff}
section.bialy { background-color: #fff}
a.wyroz.roboto-napis:hover {color: #373737; text-decoration: none }
.navnewsa { text-align: center;}
.navnewsa img {margin-left: 0.6em; margin-right: 0.6em; display: inline-block; width: 0.7em; height: auto;}
.roboto-napis.wyroz {color:var(--magentac); text-transform: uppercase; }
.roboto-napis.data { color: #000}
.strona .nazwautora { padding-bottom: 1.3em}
.aktualnosc .top h1 { max-width: 850px; margin-left: auto; margin-right: auto; padding: 0.7em 0 0.6em 0;}
.aktualnosc .top { text-align: center; padding-top: 1.5em ; padding-bottom: 2.5em;}
.xstrona .twitter-share-button {display: none;}
.strona .socials {height: 2em; margin-top: 2.5em; margin-bottom: 2em; ;clear: both; overflow: visible; position: relative}
.strona .socials .socials-cont { position: absolute; top: 0; }
.strona .socials .fb-like, .strona .socials .fb-share-button {margin-right: 1em; float: left; overflow: visible; vertical-align: top}
.strona .socials .fb-xfbml-parse-ignore {xmargin-right: 1em; float: left;
background: #1877f2;
border-radius: 3px;
font-weight: 500;
padding: 5px 8px;
display: inline-block;
position: static;
font-size: 12px; color: #fff;
}
.strona .socials .fb-like > span, .strona .socials .fb-share-button > span {vertical-align: top !important;}
.strona .socials .twitter-share-button { margin-top: 0px; visibility: hidden; vertical-align: top }
.strona .socials .twitter-share-button.twitter-share-button-rendered {visibility: visible;}
.xstrona.artykul .socials {margin-top: 2em}
.strona .tresc {max-width: 700px}
.strona .lead.f4 p, .strona .lead.f4, .strona .lead.f4 span {line-height: 1.33}
.strona .lead.f5 p, .strona .lead.f5, .strona .lead.f5 span {line-height: 1.4}
.strona .lead.f4 p { margin-top: 0.6em; margin-bottom: 0.6em}
.strona .lead {padding-bottom: 0.2em}
.strona .lead + .srodtytul {margin-top: 1em}
.tresc h4:first-child {margin-top: 0.5em}
.tresc h5:first-child {margin-top: 0.5em}
.strona .nawig {text-decoration:none; display: inline-block; width: 8.7em; color: #373737; position: relative; margin-top: 0.5em }
.strona .nawig .milustr {display: block; width: 100%; background-size: cover; background-position: center center; }
.strona .nawig .milustr:after { content: ""; display: block; padding-top: 60%; }
.strona .nawig.poster .milustr:after { padding-top: 140%; }
.strona .nawig .tyt {display: block; margin-top: 0.7em; line-height: 1.3}
.strona .nawig .arrow {overflow: hidden; transition: background-position 0.2s; display: block; background-size: 4em auto; width: 4em; height: 1em; background-image: url("../nn/css/../img/arrowmagrightlong.svg"); position: absolute; top: 20%; }
.strona .nawig.poprz .arrow {background-position: -1em center; position: absolute; left: -2.3em}
.strona .nawig.poprz:hover .arrow {background-position: -0.5em center;}
.strona .nawig.nast .arrow { background-position: right 1em center; right: -2.3em}
.strona .nawig.nast:hover .arrow {background-position: right 0.5em center;}
.strona .nawig.poprz .arrow {transform: rotate(180deg);}
.strona .nawig.poprz { float: left; margin-left: 6%}
.strona .nawig.nast { float: right; margin-right: 6%}
/** wywalamy strzałki */
.strona .nawig .arrow {display: none}
.strona .tresc IMG:not(.nierozszerzaj):not(.nrs):not(.portret):not([usemap]) {width: 130% !important; height: auto; margin-left: -15%; margin-top: 1.5em; margin-bottom: 1.5em; }
.tresc .imgpodpis {font-size: 12px; color: #4D4D4D; display: block; text-align: right; margin-bottom: 3em; margin-right: -15%}
.tresc P:not(.imgpodpis) span.imgpodpis:FIRST-CHILD {margin-top: -4em}
.tresc P.imgpodpis {margin-top: -4em }
.tresc .portret {width: 5em; height: 5em; display: block; margin-bottom: 1.5em; margin-top: 2em; border-radius: 50%; object-fit: cover; }
.tresc .portret-mini { width: 3.66em; height: 3.66em; display: block; margin-bottom: 2em; border-radius: 50%; object-fit: cover; }
.tresc .krotki-odstep { display: block; background-size: auto 2px; background-position: left center; padding: 1.2em 0px; margin-top: 1.7em; margin-bottom: 1em ;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg clip-rule='evenodd' fill-rule='evenodd' stroke-linecap='round' stroke-miterlimit='1' version='1.1' viewBox='0 0 36 2' xml:space='preserve' xmlns='http://www.w3.org/2000/svg'%3E%3Cg transform='translate(-55.362 -49.107)'%3E%3Cg transform='matrix(.084522 0 0 .5266 -97.14 -764.85)'%3E%3Cpath d='m2211.2 1547.5h-395.72 395.72z' fill='none' stroke='%23000' stroke-width='3.54px'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");}
/** to jest w commons
.tresc ul {list-style-type: circle; margin-left: 0.1em; margin-right: 0px; padding-left: 1.2em; padding-right: 0px; }
.tresc ul li, .tresc ol li { margin-top: 1.2em; margin-bottom: 1.2em; line-height: 1.6 }
.tresc ol { margin-left: 1.5em; margin-right: 0px; padding-left: 0; padding-right: 0px; }
.tresc ol li {padding-left: 0.5em} **/
.tresc ul.sound {list-style-type: none;}
.tresc ul ul li, .tresc ol ol li { margin-top: 0.6em; margin-bottom: 0.6em; line-height: 1.4 }
.strona .autor {overflow: visible; margin-bottom: 1.5em }
.strona .autor .foto {display: inline-block; filter: brightness(80%); vertical-align: top; margin-right: 2em; margin-top: 0em; background-size: cover; background-position: center center; width:5em; height:5em; border-radius: 50%;}
.strona .autor .op { display: inline-block; white-space: normal; opacity: 0.84; width: calc(100% - 8em) }
.strona .autor .op h5 {padding-bottom: 0; padding-top: 0; margin-top: 0}
.strona .autor .op p {font-size: 0.8em }
.inneartykuly {padding-top: 2.5em; padding-bottom: 3em; text-align: center }
.inneartykuly .news-box { width: 22.6%; margin: 1.2%; max-width:22em }
.inneartykuly .news-box:after { padding-top: 111%; }
.mediacontainer , .ilustracja .mediacontainer {position: relative;padding-bottom: 56.25% ; background-color: #000 }
.videocontainer, .ilustracja iframe, .ilustracja object, .ilustracja embed { width: 100%; height: 100%; }
.mediacontainer iframe, .mediacontainer object, .mediacontainer embed { position: absolute; top: 0; left: 0; }
.tresc .mediacontainer {margin: 2em 0px;}
nav.menuleft .pozycjamenu.wide { overflow: visible; }
nav.menuleft .pozycjamenu .mediacontainer { width: 100%; }
nav.menuleft .pozycjamenu {transition: all 0.2s; display: block; font-family: inherit; font-size: inherit; color: #373737; padding: 0.5em 0; line-height: 1.2em; }
nav.menuleft > .pozycjamenu {padding-top: 0.5em; padding-bottom: 0.5em}
nav.menuleft .pozycjamenu.mwybr:not(.mwybrchild) {background-image: var(--menu-strz); padding-left: 2.5em; background-size: 1.8em auto; background-position: left center; }
nav.menuleft .pozycjamenu:hover {color: #373737; padding-left: 0.3em;}
nav.menuleft .pozycjemenu {padding-left: 1.5em; font-size: 95%; padding-bottom: 1.3em}
nav.menuleft { width: 18em; display: inline-block; vertical-align: top; padding-top: 3em; padding-bottom: 2em}
nav.menuleft .pozycjamenu {max-width:18em;}
.artykul .tresc {padding-top: 1.8em; width: auto; max-width: 36.85em; width: 36.85em; /**width: 700px; max-width: 700px; */ display: inline-block; float: right; margin-right: 10%}
.artykul .menuitresc {overflow: hidden; xwhite-space: nowrap; }
.nawigacjaitresc HR.podaut {background: transparent;}
@media screen and (max-width:1670px){
.strona.aktualnosc .tresc IMG:not(.nierozszerzaj):not(.nrs):not([usemap]) {width:120% !important;margin-left: -10%;}
.tresc .imgpodpis {margin-right: -10%}
}
@media screen and (max-width:1550px){
.artykul .tresc { margin-right: 5%}
}
@media screen and (max-width:1400px){
.strona .nawig.poprz {margin-left: 4%}
.strona .nawig.nast {margin-right: 4%}
.artykul .tresc { margin-right: 0 }
.strona .tresc IMG:not(.nierozszerzaj):not(.nrs):not(.portret):not([usemap]) {width:110% !important; margin-left: -10%}
.strona.aktualnosc .tresc IMG:not(.nierozszerzaj):not(.nrs):not([usemap]) {width:100% !important; margin-left: 0}
.tresc .imgpodpis {margin-right: 0}
}
@media screen and (max-width:1399.99px){
.aktualnosc .ilustracja.full:after { padding-top: 50%; background-position: center;}
.ilustracja.full:after, .ilustracja.full .overlay:after {padding-top: 50%;}
}
@media screen and (max-width:1259px){
.inneartykuly .news-box { width: 48%; margin: 1%;}
.inneartykuly .news-box .f6 {font-size: 19px;}
.inneartykuly .news-box:after { padding-top: 95%; }
.inneartykuly .single-box .image {height: 56%; width: 100%;}
.inneartykuly .single-box .caption {height: 44%; max-height: 44% }
.xartykul .marginesy_jakheader {padding-right: 1%}
}
@media screen and (max-width:1210px){
.artykul nav.menuleft { width:100% }
.artykul .tresc {float: none; width: auto;}
/** przeniesienie na dół */
.strona.aktualnosc .socials {margin-bottom: 0.6em}
.artykul .tresc .socials {margin-top: 1.5em; margin-bottom: 1em}
.artykul .menuitresc { display:flex; flex-direction: column-reverse;}
.artykul nav.menuleft { height: auto; padding-top: 1em; }
.artykul .tresc{ height: auto; }
.nawigacjaitresc { display:flex; flex-direction: column-reverse; }
.nawigacjaitresc .nawigacja {display: flex; width: 90%; max-width: 700px; margin-left: auto; margin-right: auto; padding-left: 5%; padding-right: 5%;
justify-content: space-between; padding-bottom: 2em; flex-wrap: nowrap;align-items: flex-start
}
.strona .nawig.poprz {margin-left: 0; position: relative; float: none; margin-left: 0;}
.strona .nawig.nast {margin-right: 0; position: relative; float: none; margin-right: 0; }
.strona .nawig, .strona .nawig.poprz, .strona .nawig.nast { vertical-align: top}
.nawigacjaitresc HR.podaut {background: #e7e7e7;}
.strona .tresc IMG:not(.nierozszerzaj):not(.nrs):not(.portret):not([usemap]) {width:106% !important ; xmax-width:750px; margin-left: 0%}
.strona .tresc IMG.nierozszerzaj:not(.nic), .strona .tresc IMG[usemap]:not(.nic), .strona .tresc IMG.nrs:not(.nic) { max-width: 100% !important; height: auto !important;}
.tresc .imgpodpis {margin-right: -6%}
.tresc p.imgpodpis {margin-top: -3.6em}
}
@media screen and (max-width:840px) {
.strona.aktualnosc .socials {margin-bottom: 1em}
.strona .nawig.nast .arrow {right: auto; float: right;}
.strona .nawig.poprz .arrow, .strona .nawig.nast .arrow { position: relative; top: auto; margin-top: 1em; left: 0; background-position: -1.5em center; width: 2.5em;}
.strona .nawig.poprz:hover .arrow, .strona .nawig.nast:hover .arrow {background-position: -1.5em center;}
.strona .tresc IMG:not(.nierozszerzaj):not(.nrs):not(.portret):not([usemap]) {width:100% !important }
.tresc .imgpodpis {margin-right: 0; margin-bottom: 2.2em}
.tresc p.imgpodpis {margin-top: -3.2em}
}
@media screen and (max-width:719.999px) {
.aktualnosc .ilustracja.full:after { padding-top: 60%; }
.ilustracja.full, .ilustracja.full .overlay { max-height: none;}
.ilustracja.full:after, .ilustracja.full .overlay:after {padding-top: 60%;}
}
@media screen and (max-width:700px) {
.inneartykuly .news-box { width: 100%; margin: 3% auto; }
.strona .autor .op {display: block; width: 100%; margin-top: 1.4em}
.ilustracja:not(.zopisem) .caption {left: 0; right: 0; xposition: relative; xtop: 50%; transform: none; bottom: 20%}
.ilustracja.zopisem .caption {padding-top: 4em; padding-bottom: 4em;}
.xilustracja.full .caption {xposition: relative; padding-top: 3em; padding-bottom: 3em; }
}
@media screen and (max-width:550px) {
.ilustracja.full .overlay:after { padding-top: 75%; }
}
@media screen and (max-width:450px) {
.aktualnosc .ilustracja.full:after { padding-top: 75%; }
.ilustracja.full .overlay:after { padding-top: 80%; }
}
.rozbiegowka { xbackground-color: #fff; }
.wazneterminy .cl {padding-top: 0.5em; white-space: nowrap;}
.wazneterminy .cltyt {width: 24%; white-space: nowrap;}
.infowazne { background-color: #fff; padding: 1.5em 2em; box-sizing: border-box; width: 100%; width: calc(100% - 2em); text-align: center;margin-right: auto; margin: 1em 1em 0.5em 1em ;}
h5.czas {background-image: url(../nn/css/../img/v2/czasc.svg); background-size: auto 1.5em; padding-left: 2.5em; background-position: left center; display: inline-block; }
h5.koszyk { background-image: url(../nn/css/../img/kos/kosz.svg); background-size: auto 1em; padding-left: 2em; background-position: left 0.3em; display: inline-block; }
h5.karnet { background-image: url(../nn/css/../img/v2/karnetc.svg); background-size: auto 0.94em; padding-left: 1.5em; background-position: left 0.4em; display: inline-block; }
h5.bilety { background-image: url(../nn/css/../img/v2/biletyc.svg); background-size: auto 0.95em; padding-left: 2.25em; background-position: left 0.36em; display: inline-block; }
h5.kinodz { background-image: url(../nn/css/../img/kinodzieciprez.svg); background-size: auto 2.3em;
padding-left: 5em;
padding-top: 0.6em;
padding-bottom: 0.6em;
background-position: left 0em; display: inline-block; }
.infowazne A { color: var(--header-color); text-decoration: underline}
.infowazne A:hover { color: var(--header-color); }
.ilustracja.zopisem > .overlay > .podpis { bottom: auto; top: 2em; }
@media screen and (max-width:1259px){
.wazneterminy .cltyt {font-size: 0.9em}
}
@media screen and (max-width:900px) {
.wazneterminy .cont {display: inline-block; }
.ilustracja.zopisem .podpis { display: none}
}
.wazneterminy .clw {width:76%}
.wazneterminy .czasi { float: left; margin-top: 0.5em; width:1.61em; height: auto; margin-right: 1em }
.wazneterminy .term { display:inline-block; color: #373737}
.wazneterminy .cl .podpis {padding-top: 0.2em}
.kaflepozycjimenu {padding-top: var(--odstep-apla); padding-bottom: var(--odstep-apla); text-align: center}
.kaflepozycjimenu:not(:has(*)) { padding-bottom: 0px; padding-top: 0px}
.kafelmenu {text-align:left; transition: all 0.2s; display: inline-block; height: 4em; overflow:hidden; padding:0; box-sizing: border-box; width: calc(50% - 1em); margin-left: 0.25em; margin-right: 0.25em; margin-bottom: 0.5em; }
.kafelmenu {position: relative; background-color: #1C1C1C; color: #fff; }
.kafelmenu:hover {color: #fff; background-color: #000; }
.kafelmenu:hover .il {transform:scale(1.05)}
.kafelmenu .il {transition: all 0.2s; display: block; width: 100%;height: 4em; position:relative; background-size: cover; background-position: center;}
.kafelmenu .il:after {display: block; content: ""; height: 4em; width: 100%; position: absolute; left:0; top: 0; background:rgba(0,0,0,0.6); opacity: 1; }
.kafelmenu .t {position: absolute; top: 0.85em; z-index: 3; left: 7%; width: 86%; line-height: 120%; max-height: 2.2em; overflow: hidden }
.kaflesekcje {}
.kaflesekcje .news-box.big-box { width: 23%; max-width: 400px; margin:1%; z-index:9}
.kaflesekcje .big-box .caption {left: 8%; width: 84%}
.kaflesekcje .big-box:after {padding-top: 100%}
@media screen and (max-width:1300px) {
.kaflesekcje .news-box.big-box {width: 31.33333% }
}
@media screen and (max-width:900px) {
.kaflesekcje .news-box.big-box {width: 48% }
}
@media screen and (max-width:800px) {
.kafelmenu {width: 100%; margin-left: 0; margin-right: 0}
}
/** to jest w aktualnościach */
.filtr {padding-top: 1em; padding-bottom: 1em; background-color: #292929;}
.filtr.szary {background-color: #eee;}
.filtr.szary .szukajinput {background-color: #eee }
.filtr.szary .szukajinput + button {background-color: #eee;}
/*
.filtr select {height: 2.5em}
.filtr .nice-select, .rozbiegowka .filtr .szukajinput {border-color: #292929;}
*/
.filtr .nice-select, .rozbiegowka .filtr .szukajinput {width: 13em}
.filtr .nice-select .list {width: calc(13em - 4px) }
@media screen and (max-width:530px) {
.filtr .nice-select, .rozbiegowka .filtr .szukaj , .rozbiegowka .filtr .szukajinput{ width: 100%; float: none}
.infowazne {text-align: left}
}
@media screen and (max-width:450px) {
.kaflesekcje .news-box.big-box {width: 96% ; margin: 2%; max-width: 300px; }
.kaflesekcje {text-align: center}
}.nice-select {
-webkit-tap-highlight-color: transparent;
background-color: #fff;
border-radius: 0px;
border: solid 2px #000;
box-sizing: border-box;
clear: both;
cursor: pointer;
display: block;
float: left;
height: 2.5em;
line-height: 2.5em;
outline: none;
padding-left: 1em;
padding-right: 3em;
position: relative;
text-align: left !important;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
white-space: nowrap;
width: auto;
}
.nice-select:hover {
border-color: #000;
}
.nice-select:active, .nice-select.open, .nice-select:focus {
border-color: #333;
}
.nice-select:after {
border-bottom: 2px solid #000;
border-right: 2px solid #000;
content: '';
display: block;
height: 5px;
margin-top: -4px;
pointer-events: none;
position: absolute;
right: 1.2em;
top: 50%;
-webkit-transform-origin: 66% 66%;
-ms-transform-origin: 66% 66%;
transform-origin: 66% 66%;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transition: all 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
width: 5px;
}
.nice-select.open:after {
-webkit-transform: rotate(-135deg);
-ms-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.nice-select.open .list {
opacity: 1;
pointer-events: auto;
-webkit-transform: scale(1) translateY(0);
-ms-transform: scale(1) translateY(0);
transform: scale(1) translateY(0);
}
.nice-select.disabled {
border-color: #ededed;
color: #999;
pointer-events: none;
}
.nice-select.disabled:after {
border-color: #cccccc;
}
.nice-select.wide {
width: 100%;
}
.nice-select.wide .list {
left: 0 !important;
right: 0 !important;
}
.nice-select.right {
float: right;
}
.nice-select.right .list {
left: auto;
right: 0;
}
.nice-select.small {
font-size: 12px;
height: 36px;
line-height: 34px;
}
.nice-select.small:after {
height: 4px;
width: 4px;
}
.nice-select.small .option {
line-height: 34px;
min-height: 34px;
}
.nice-select .list {
background-color: #fff;
border-radius: 0px;
margin-bottom: 0;
box-shadow: 0 0 0 1px rgba(29, 29, 29, 0.5);
box-sizing: border-box;
margin-top: 0px;
opacity: 0;
overflow: hidden;
padding: 0;
pointer-events: none;
position: absolute;
top: 100%;
left: 0;
max-height: 300px;
overflow-y: auto;
-webkit-transform-origin: 50% 0;
-ms-transform-origin: 50% 0;
transform-origin: 50% 0;
-webkit-transform: scale(0.75) translateY(-21px);
-ms-transform: scale(0.75) translateY(-21px);
transform: scale(0.75) translateY(-21px);
-webkit-transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity
0.15s ease-out;
transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s
ease-out;
z-index: 11;
} /** uwaga!!! */
.nice-select .list:hover .option:not(:hover) {
background-color: transparent !important;
}
.nice-select .option {
cursor: pointer;
xfont-weight: 400;
font-size: 0.9em;
line-height: 2.2em;
list-style: none;
min-height: 2.2em;
outline: none;
padding-left: 1em;
padding-right: 2em;
text-align: left;
-webkit-transition: all 0.2s;
transition: all 0.2s;
}
.nice-select .option:hover, .nice-select .option.focus, .nice-select .option.selected.focus
{
background-color: #f6f6f6;
}
.nice-select .option.selected {
font-weight: bold;
}
.nice-select .option.disabled {
background-color: transparent;
color: #999;
cursor: default;
}
.no-csspointerevents .nice-select .list {
display: none;
}
.no-csspointerevents .nice-select.open .list {
display: block;
}
/** uwaga, to gdy za długie */
.nice-select span.current {
max-width: 100%;
white-space: nowrap;
overflow: hidden;
line-height: normal;
text-overflow: ellipsis;
display: inline-block;
vertical-align: middle;
}
.nice-select:before {
content: "";
display: inline-block;
vertical-align: middle;
height: 100%;
}
.nice-select .list::-webkit-scrollbar {width: 14px;}
.nice-select .list::-webkit-scrollbar-track {background: #fafafa;}
.nice-select .list::-webkit-scrollbar-thumb {background-color: #666; border-radius: 20px; border: 4px solid #fafafa;}
.filtr .nice-select {float: none; display: inline-flex; align-items: center;}
.filtr .nice-select {border: 1px solid transparent; background-color: #fff; border-radius: 2em; padding-left: 1.3em}
.filtr .nice-select.nicer .list {border: 1px solid #eee; xborder-radius: 1.8em; background-color:#eee}
.filtr .nice-select {height: 3em; line-height: 2.9em}
.filtr.program .nice-select {height :3.3em; line-height: 3.2em}
.filtr .nice-select .list {margin-top: 0.8em}
.filtr .nice-select .option {font-size: 1em}
@media screen and (max-width:650px) {
.filtr.program .nice-select {height :3.55em; line-height: 3.55em}
}
@media screen and (max-width: 550px) {
.filtr.program .nice-select {line-height: 3em}
}
/** uzycie:
*/
.switch-wrap {display:inline-block}
.switch-wrap {
cursor: pointer;
background: #15273b;
padding: 2px;
width: 35px;
height: 19.5px;
border-radius: 9.75px;
}
.switch-wrap input {
position: absolute;
opacity: 0;
width: 0;
height: 0;
}
.switch {
height: 100%;
display: grid;
grid-template-columns: 0fr 1fr 1fr;
transition: .2s;
}
.switch::after {
content: '';
border-radius: 50%;
background: #ccc;
grid-column: 2;
transition: background .2s;
}
input:checked + .switch {
grid-template-columns: 1fr 1fr 0fr;
}
input:checked + .switch::after {
background-color: #52cf71;
}
/** ========================================================== */
/** switch 2023 */
.onoffswitch {
font-size: 65%;
position: relative; width: 4.3em;
-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
position: absolute;
opacity: 0;
pointer-events: none;
}
.onoffswitch-label {
display: block; overflow: hidden; cursor: pointer;
height: 1.8em; padding: 0; line-height: 1.8em;
border: 1pt solid #000; border-radius: 1.8em;
background-color: #FFFFFF;
transition: background-color 0.3s ease-in;
}
.onoffswitch-label:before {
content: "";
display: block; width: 1.8em; margin: 0px;
background: #FFFFFF;
position: absolute; top: 0; bottom: 0;
right: 2.4em;
border: 1pt solid #000; border-radius: 1.8em;
transition: all 0.2s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
background-color: #53BC80;
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
border-color: #53BC80;
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
right: 0px;
}
/** ========================================================== */
/** inny switch */
/** to jest starszy onoff, z szarym tłem, może sie przydać
.onoffswitch {
position: relative; width: 2.37em; min-width: 2.37em;
-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
display: none;
}
.onoffswitch-label {
display: block; overflow: hidden; cursor: pointer;
xborder: 0.105em solid #E0DFE8; border-radius: 1.05em;
}
.onoffswitch-inner {
display: block; width: 200%; margin-left: -100%;
transition: margin 0.3s ease;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
display: block; float: left; width: 50%; height: 1.26em; padding: 0; line-height: 1.26em;
xfont-size: 0.74em; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
box-sizing: border-box;
}
.onoffswitch-inner:before {
content: "";
padding-left: 0.52em;
background-color: #E0DFE8; color: #FFFFFF;
}
.onoffswitch-inner:after {
content: "";
padding-right: 0.52em;
background-color: #E0DFE8; color: #999999;
text-align: right;
}
.onoffswitch-inner.white-bg:before, .onoffswitch-inner.white-bg:after {
background-color: #fff;
}
.onoffswitch-switch {
display: block; width: 0.79em; margin: 0.13em;
background: #858585;
position: absolute; top: 0; bottom: 0;
right: 1.1em;
border: 0.1em solid transparent; border-radius: 1.05em;
-webkit-transition: all 0.3s ease-in 0s;
transition: all 0.3s ;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
right: 0px;
background-color: #53BC80;
xborder-color: #53BC80;
}
**/
.stepper input[type="number"]::-webkit-inner-spin-button, .stepper input[type="number"]::-webkit-outer-spin-button {-webkit-appearance: none; height: auto; }
.stepper input[type=number] { -moz-appearance:textfield; }
.stepper {
xborder: 1px solid #eee;
display: inline-block;
overflow: visible;
xheight: 2.2em;
background: #fff;
xpadding: 1px;
}
.stepper input {
width: 3em;
xheight: 2.1em;
text-align: center;
border: 0;
background: transparent;
color: #000;
}
.stepper input:active, .stepper input:focus {outline: none;}
.stepper button {
width: 1.4em;
font-weight: 300;
height: 100%;
line-height: normal;
font-size: 1.4em;
padding: 0.2em !important;
background: #e0e0e0;
color: #222;
text-decoration: none;
display: inline-block;
border: none;
user-select: none;
cursor: pointer;
}
.stepper button:hover { background-color: #d0d0d0; }
.stepper button.db {background-size: 0.8em auto; background-position: center center; background-repeat: no-repeat;}
.stepper button.db.p {border-left: 1px solid #d0d0d0; background-image: url(../nn/css/../img/doubleplus.svg); }
.stepper button.db.m {border-right: 1px solid #d0d0d0; background-image: url(../nn/css/../img/doubleminus.svg); }
.stepper.disabled {background-color: #f4f4f4; }
.stepper.disabled INPUT {color: #666}
.stepper.disabled button {background-color: #d0d0d0; cursor: crosshair; }
/** ---------------------------------------------- */
/** poprawiony nice-select */
.nice-select.nicer:after { /** to można zastosować do wszystkich nice-select */
border-bottom: 1pt solid #000;
border-right: 1pt solid #000;
height: 0.6em; margin-top: -0.4em; width: 0.6em; right: 1.55em
}
.nice-select:after {
border-bottom: 1pt solid #000;
border-right: 1pt solid #000;
height: 0.6em;
margin-top: -0.4em;
width: 0.6em;
right: 1.55em;
}
.nice-select.nicer {line-height: 3.2em; padding-left: 1.4em; padding-right: 3.5em}
.nice-select.nicer .list {background-color: #eee}
.nice-select.nicer .option:hover, .nice-select.nicer .option.focus {
background-color: #eee;
padding-left: 1.3em;
}
.nice-select.nicer .list {font-size: 1em; box-shadow: none; border: 2px solid #000; margin-left: 0px; left: -2px; padding-top: 0.3em; padding-bottom: 0.3em }
.nice-select.nicer .list {scrollbar-width: thin; scrollbar-color: #111 #eee; }
.nice-select.nicer .option {font-size: 1em; min-height: 1.6em; line-height: 1.6em}
.nice-select.nicer .list::-webkit-scrollbar {width: 14px;}
.nice-select.nicer .list::-webkit-scrollbar-track {background: #fafafa;}
.nice-select.nicer .list::-webkit-scrollbar-thumb {background-color: #666; border-radius: 20px; border: 4px solid #fafafa;}
.nice-select.nicer ul li {padding-top: 0.4em; padding-bottom: 0.4em}
.nice-select.nicer .option.selected, .nice-select.nicer .option.selected.focus {padding-left: 2.2em; position: relative;}
.nice-select.nicer .option.selected:before {
border-bottom: 1pt solid #000;
border-right: 1pt solid #000;
content: '';
display: block;
height: 0.45em;
margin-top: -0.4em;
pointer-events: none;
position: absolute;
left: 1em;
top: 50%;
transform-origin: 66% 66%;
transform: rotate(45deg);
width: 0.3em;
}
.nice-select.nicer .list {
-webkit-transform: scale(1) ;
-ms-transform: scale(1) ;
transform: scale(1) ;
}
/** ============================================ */
/** radio custom */
/** rado musi być klasy nice żeby nie gryzło się z tym co w formularz */
.nice-radio .lab-radio input[type=radio] {
position: absolute;
visibility: hidden;
}
.nice-radio .lab-radio {
color: var(--prawieczarny);
display: block;
position: relative;
width: 100%;
xheight: 100px;
}
.nice-radio .lab-radio label{
display: block;
position: relative;
font-size: 1em;
padding: 0px 0px 0px 1.6em;
margin: 0px auto;
xheight: 30px;
white-space: nowrap;
z-index: 9;
cursor: pointer;
-webkit-transition: all 0.25s linear;
}
.nice-radio .lab-radio label.mniejszy {
font-size :0.8em; padding-left: 2em
}
.nice-radio .lab-radio:hover label{
color: var(--prawieczarny-hover)
}
.nice-radio .lab-radio .check {
position: absolute;
font-size: 1em;
border: 1pt solid var(--prawieczarny);
box-sizing: content-box;
border-radius: 100%;
height: 1em;
width: 1em;
display: flex;
justify-content: center;
align-items: center;
top: 50%;
transform: translateY(-50%);
left: 0px;
z-index: 5;
transition: border .2s linear;
-webkit-transition: border .2s linear;
}
.nice-radio .lab-radio:hover .check {
border: 1pt solid var(--prawieczarny-hover);
}
.nice-radio .lab-radio .check::before {
content: '';
box-sizing: border-box;
border-radius: 100%;
height: 0.7em;
width: 0.7em;
transition: background 0.2s linear;
-webkit-transition: background 0.2s linear;
}
.nice-radio .lab-radio input[type=radio]:checked ~ .check {
border: 1pt solid var(--prawieczarny);
}
.nice-radio .lab-radio input[type=radio]:checked ~ .check::before{
background: var(--prawieczarny)
}
.nice-radio .lab-radio input[type=radio]:checked ~ label{
color: var(--prawieczarny)
}#popup {
background: rgba(0, 0, 0, 0.8);
position: fixed;
display: none;
z-index: 50000;
/* z-index: 290004; */
height: 100%;
width: 100%;
left: 0;
top: 0;
-webkit-transform-style: preserve-3d;
moz-transform-style: preserve-3d;
transform-style: preserve-3d;
justify-content: center;
align-items: center;
}
.popup-progress-overlay {
z-index: 50009;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: block;
text-align: center;
background: rgba(200,200,200,0.5) url('../nn/css/../img/progress.svg') no-repeat center;
}
.popup-progress-overlay.nobg { background-image: none; background-color: rgba(10,10,10,0.9) }
.popup-progress-overlay.nobg .mess {display: block; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); }
.popup-progress-overlay.nobg .mess>span {color: #fff; display: block; margin-bottom: 2em }
#popup > div {
border-radius: 0px;
position: fixed;
xbox-sizing: border-box;
display: inline-block;
background: #EEEEEE;
box-shadow: none;
padding: 2em 2em;
width: auto;
min-width: 300px;
max-width: 750px;
max-height: 90%; max-height: calc(100% - 5em);
z-index: 50001;
/*-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
left: 50%;
top: 50%;
*/
text-align: left;
border: none;
overflow: hidden;
}
#popup.lightbg > div {
background-color: #fff;
}
#popup.darkbg { background: rgba(0, 0, 0, 1); }
#popup.darkbg > div {background-color: #121212; }
#xpopup .zawart {overflow-y: auto; overflow-x: hidden; }
#popup .krzyzyk {margin-top: -0.5em; background-image: url('../nn/css/../img/krzyzyk.svg'); background-size: 0.84em 0.84em; width: 1.06em; height:1.06em; background-position: center center; float: right; }
#popup.darkbg .krzyzyk { background-image: url(../nn/css/../img/krzyzykb.svg)}
#popup .tytul {padding-top: 0; padding-bottom: 0.6em; -webkit-user-select: none; }
/** to jest potrzebne wszędzie tam, gdzie jest wykorzystywany tap-hold, np. w invitations, hammer */
#popup {-webkit-user-select: none; }
#popup .przycisk.maly {}
#popup .full {max-width: 100%; width: 100%; padding: 0px; height: 100%; max-height: none}
#popup .full .krzyzyk {margin-top: 1em; margin-right: 1.3em; font-size: 140%}
#popup .full .zawart {height: 100%; box-sizing: border-box; padding: 4em 0px 1em 0px}
#popup .forimg {max-width: 85vw; }
#popup .forimg .popimg {max-width: 75vw; max-height: 60vh; margin-top: 1em }
.popupplayer {width: 100%; height: 100%; }
.popupplayer iframe {width: 100%; height: 100% }
@media screen and (max-width:1200px){
#popup .pszeroki { min-width: 70% }
}
@media screen and (max-width:900px){
#popup > div { max-width: 500px }
#popup .pszeroki { min-width: 80% }
#popup .pszeroki .zawart {font-size: 90%}
#popup .pszeroki .zawart p {font-size: 13px; line-height: 1.4}
}
@media screen and (max-width:700px){
#popup .pszeroki { min-width: 90% }
}
@media screen and (max-width:550px){
#popup > div {
xheight: 100%;
width: 100%;
padding: 1.5em 1.5em;
box-sizing: border-box;
}
}
/** dotpay */
.przycisk-pay-loga {margin-top: 3em; display: flex; align-items: center; row-gap: 1.5em; column-gap: 2em; flex-wrap: wrap;}
.przycisk-pay-loga + .przycisk-pay-loga{margin-top: 2.5em; }
.przycisk-pay-loga .lga { display: flex ; align-items: center;gap: 2em; }
.przycisk-pay-loga .lga img { width: auto; height: 2em}
.przycisk-pay-loga .lga img.kf { height: 3.5em}
.dotpc {margin-top: 1.5em }
.dotpc img {display: inline-block; margin-right: 1em; width: auto; height: 2em }
.przycisk-pay-loga .lga img.pn { height: 1.4em }
/** tu wspólny css dla wielu stron, nie tylko dla programu */
.biletpopup .ilosc.formularz {padding-top: 0px}
.biletpopup .ilosc {margin-bottom: 1.5em}
.biletpopup .ilosc A {text-decoration: none; color: #373737; display: inline-block; padding: 0 0.6em; user-select: none; }
.biletpopup .ilosc span.f6 { margin-right: 0.5em; display: inline-block;}
.biletpopup .ilosc INPUT { text-align: center; padding-top: 0.5em; padding-bottom: 0.5em ; font-size: 0.8em}
.biletpopup .ilosc INPUT:focus {border-color: none; outline: 0; box-shadow: none; }
.biletpopup .ilosc.over INPUT {background-color: #ffa8a8}
.biletpopup .warning {padding: 1em 0px; display: none; color: #DA0070; font-size: 1em}
.biletpopup .kupzewnd.hide {display: none }
.biletpopup .kupzewnd {display: flex; padding-top: 1em; justify-content: center;}
.biletpopup .kupzewnd .kzcont {text-align:center; display:inline-flex; flex-direction:column; align-items:stretch; }
.seanspopup .dokoszyka { display: block; }
.seanspopup .dokoszyka span {line-height: normal}
.seanspopup .dokoszyka.busy { background-image: url(../nn/css/../img/kos/preloader-18px.svg); background-size: 1em 1em; background-position: center center }
.seanspopup .dokoszyka .dok {display: inline;}
.seanspopup .dokoszyka .dodano, .seanspopup .dokoszyka .busy {display: none; position: relative}
.seanspopup .dokoszyka.dodano .dok, .seanspopup .dokoszyka.dodano .busy {display: none;}
.seanspopup .dokoszyka.dodano .dodano {display: inline-block; padding-left: 1.5em}
.seanspopup .dokoszyka.busy .busy {display: inline;}
.seanspopup .dokoszyka.busy .dok, .seanspopup .dokoszyka.busy .dodano { display: none}
.seanspopup .dokoszyka.busy:hover {background-color: var(--magentac)}
.seanspopup .dokoszyka.czarny.busy:hover {background-color: #000}
.seanspopup .prz { margin-top: 3em}
.seanspopup .przd {margin-top: 1em}
.seanspopup .prz, .seanspopup .przd {font-size: 84%; }
.seanspopup .prz .przycisk, .seanspopup .przd .przycisk { padding: 1.07em 1.9em;}
.biletpopup .przycisk.zramka {padding-top: calc(1.07em - 2px); padding-bottom: calc(1.07em - 2px); }
.seanspopup .przd A {display: block;}
.seanspopup .ty {max-width: 12em}
.seanspopup .przd + .prz {margin-top: 0.5em}
.kasjer .seanspopup .prz { margin-top: 1em}
.wybierzseans .tytwyb {margin-top: 0.4em}
.wybierzseans .seanse {padding: 2em 3em; margin-left: auto; margin-right: auto; max-width: 19em;}
.seanspopup .kupwiecejd {text-align: center;}
.seanspopup .kupwiecejd .in {white-space: normal; padding-left:0.5em; padding-right: 0.5em; display: inline-block; text-align: center; max-width: 20em; margin-top: 0.5em; margin-bottom: 1em; }
.seanspopup .przycisk {margin-right: 0px;}
.seanspopup .dokoszyka.dodano .dodano:before {
content: " ";
display: inline-block; margin-right: 0.6em;
background-image: url(../nn/css/../img/checkedbialy.svg); background-size: 0.8em auto ; background-position: left 0.3em;
width: 1em; height: 1.1em;
left: 0px; top: -0.1em;
position: absolute;
}
.seanspopup .formularz {padding-top: 1em; padding-bottom: 0em}
.seanspopup .czasim { margin-top: 0.6em; margin-bottom: 0px}
.seanspopup .czasim .uwag {display:block; margin-top: 1.5em; max-width: 22em; xfont-size: 12px; line-height: 1.4}
.seanspopup .czasim .xuwag {background-size: auto 1.3em; background-image: url(../nn/css/../img/uwagawazna.svg);
background-repeat: no-repeat;background-position: 0.05em top; padding-left: 2.5em; }
.seanspopup .top-info {font-size: 75%; padding-bottom: 2em; line-height: normal }
/** nie zmieniaj tego bottoma, bo to jest ważne w widoku dla kasjer */
.ticketlist {font-size: 80%; padding: 0em 0px 0em 0px}
.kasjer .ticketlist {padding-bottom: 1.5em}
.popup_dialog .ticketlist {padding-bottom: 1.5em}
.ticketlist .rodz {padding-bottom: 0.5em}
.ticketlist .tlrow {display: flex;}
.ticketlist .tlrow .r {flex-basis: 2em;}
.ticketlist .tlrow .n {flex-basis: 80%;}
.ticketlist .tlrow .c {flex-basis: 5em; text-align: right; }
.seanspopup .innes {display: none }
.seanspopup .innes .seanse { max-height: 10em; overflow-y: auto;}
.seanspopup.wybierzseans .seanse { max-height: 20em; overflow-y: auto;}
.seanspopup .innes .ll {xfont-size: 0.8em}
.seanspopup .innesll {margin-top: 2em; display: inline-block;}
/** ukrywam dla innych niż kasje, bo nie zadziałą jeszcze */
/* body:not(.kasjer) .innesll {display: none}*/
.seanspopup .czasim {display: inline-block;}
.seanspopup .innes .operacja {font-size: 0.5em; margin-left: 2em; margin-bottom: -0.6em}
.seanspopup .innes .czasim, .seanspopup .innes .operacja {display: inline-block}
.seanspopup .innes .czasim {margin: 0.2em 0px; width: 12em}
.seanspopup .innes .czasim .czas {display: inline-block; width: 7em}
.seanspopup .innes .czasim .czas.czas-online { width: auto}
.seanspopup .innes .czasim .sa {margin-left:0.2em}
.seanspopup .innes .czasim .st { }
.seanspopup .innes .seanse {margin-bottom: 1em; margin-top:0.4em }
.seanspopup .innesll {
color: inherit;
text-decoration: none;
padding-right: 1.2em;
background-image: url(../nn/css/../img/dziubekdol.svg);
background-size: auto .4em;
background-position: right .45em;
transition: all .2s
}
.seanspopup .innesll.wgore {
background-image: url(../nn/css/../img/dziubekgoracz.svg);
background-position: right .35em;
}
.seanspopup .innesll:hover {
background-position: right .60em;
}
.seanspopup .innesll.wgore:hover {
background-position: right .20em;
}
@media (max-width: 550px) {
.wybierzseans .seanse {padding: 1.5em 0px}
}
@media (max-width: 500px) {
.seanspopup .innesll {margin-left: 1em}
}.jFiler-input-dragDrop, .jFiler-input-choose-btn {font-size :1em !important}
.jFiler-input-text div {font-size: 1.2em !important}
.formularz {padding-top: 2em; padding-bottom: 2em; }
body section.formularz {min-height: calc(100vh - 25.6em)}
.formularz .formcontainer {max-width: 900px}
.formularz.waski {max-width: 800px; margin-left: 10%; padding-left:5%; }
.formularz .waski {max-width: 850px;}
.formularz input[type="text"]:disabled {
background: #f5f5f5;
}
.formularz p {font-size: 90%; line-height: 1.55}
.formularz a.s {font-size: 90%}
.formularz p a.s {font-size: 100%}
.formularz ul {font-size: 90%}
.formularz ul.list {font-size: 100%}
.formularz .nice-select .option {font-size: 100%}
.formularz .small {line-height: normal;}
.giodo { color: #777777; font-size: 84%; line-height: 1.4}
.formularz p.giodo {font-size: 84%; line-height: 1.4}
.formularz .giodo p {font-size :100%}
.giodo ul, .giodo li { font-size: 1em; line-height: 1.4}
.giodo ul li, .giodo ol li {margin-bottom: 1em; margin-top: 1em;}
.giodo ol ol li {margin-bottom: 0.4em; margin-top: 0.4em;}
.lewaimg {display: none;}
.formularz H3 {padding-top: 1em; padding-bottom: 0.6em}
.formularz H3:first-child{padding-top: 0.4em}
div.form {margin: 0.5em 0; max-width: 900px }
table.form {xmargin: 2em 0; max-width: 800px }
.form {font-size: 90%}
div.regulamin { border-radius: var(--field-radius); background-color: #ffffff; border: none; font-size: 80%; height: 400px; line-height: normal; color: #555555; overflow-y: scroll; padding: 1em 1.5em; width:92%; margin-bottom: 2em; margin-top: 1em }
div.regulamin p, div.regulamin ol, div.regulamin li, div.regulamin ul {font-size: inherit; line-height: inherit; color: #555555;}
.regulamin > ol, .tresc > ol { list-style-type: decimal; }
.regulamin ol li, .tresc ol li {margin-top: 1em; margin-bottom: 1em;}
.regulamin > ol > li > ol, .regulamin > ol > ol,
.tresc > ol > li > ol, .tresc > ol > ol { list-style-type: lower-latin; }
.regulamin > ol > ol > ol, .tresc > ol > ol > ol { list-style-type: lower-roman; }
.regulamin > ol > ol li, .tresc > ol > ol li {margin-top: 0.5em; margin-bottom: 0.5em; padding-left: 0.2em }
div.hr { background: none; height: 4px; margin: 8px 0; padding: 0; }
div.hr hr { display: none; }
table hr { background-color: #555555; border: medium none; border-spacing: 0; clear: both; height: 1px; margin: 0; width: 100%; }
.formularz img {max-width: 90%}
.formularz .plewa { max-width: 900px}
.formularz .fotoutils IMG {max-width: none;}
.formularz SELECT:not(.form-select) {font-size: 1em; min-width: 80px !important}
.xformularz INPUT[type="button"], .xformularz INPUT[type="submit"] {background-color: #1B1B1B; padding: 4px 7px; color: #ffffff; text-transform: uppercase}
div.przycisk button, div.przycisk input, div.przycisk INPUT[type="button"], div.przycisk INPUT[type="submit"] {
transition: background-color 0.2s;
background-color: transparent; border: medium none; border-spacing: 0; color: #ffffff; font-size: 1em;
font-weight:normal;
line-height: normal; margin: 0; margin-top: -1px; padding: 0; text-transform: none; vertical-align: middle;font-family: PFHandbookProMedium; }
.przycisk {cursor: pointer; white-space: normal; font-family: PFHandbookProMedium; transition: background-color 0.2s; text-decoration: none; box-sizing: border-box; text-align: center;
display: inline-flex; align-items: baseline; justify-content: center;
text-decoration: none; background-color: var(--magentac); xletter-spacing: 0.12em; padding: 0.8em 1.5em ;
line-height: normal; color: #ffffff; width: auto; xtext-transform: uppercase; font-size: 1.25em ; font-weight: normal;
border-radius: var(--round-button-radius);
}
.przycisk.rounded { border-radius: 1.5em; }
div.przycisk A {text-decoration: none; display: inline-block; }
.przycisk {margin-right: 0.5em}
.przycisk + .przycisk {margin-top: 0.5em}
input.przycisk {
-webkit-appearance: none;
-moz-appearance: none;
border-radius: var(--round-button-radius);
color: #fff;
outline: 0;
cursor: pointer;
}
div.przycisk#lekki {background-color: #444444}
.przycisk.cancel, .przycisk.szary, .przycisk#cancel , .przycisk#szary {background-color: #777}
.przycisk.disabled, .przycisk.disabled:hover { background-color: #777; color: #ddd; cursor: default;}
.przycisk.decline {background-color: #dc3545 }
.przycisk.decline:hover {background-color: #b02a37}
.przycisk.confirm {background-color: #198754 }
.przycisk.confirm:hover {background-color: #146c43}
.przycisk i.bi {font-size: 90%}
.przycisk i.bi:not(.bi-end) { margin-left: -0.4em; margin-right:0.7em }
div.przycisk#duzy {font-size: 1.5em; line-height: 120% }
div.przycisk#wstecz {background-image: url("../nn/css/../img/przycisk_strz_wstecz.png"); background-repeat: no-repeat; background-position: left 8px; padding: 5px 10px 5px 25px;}
div.przycisk a {color: #ffffff}
div.przycisk:hover, div.przycisk button:hover, div.przycisk input:hover {cursor: pointer;}
.przycisk:hover {background-color: var(--magentah); color: #fff}
.przycisk.cancel:hover, .przycisk.szary:hover, .przycisk#cancel:hover , .przycisk#szary:hover {background-color: #555; color: #fff}
.przycisk.maly {font-size: 1em}
.przycisk.btn.btn-sm {font-size: 1em; padding: 0.5em 0.7em; }
.przycisk.maly.zramka {font-size: 1em; padding-top: calc(1.1em - 2px); padding-bottom: calc(1.1em - 2px);}
.przycisk.lekki {background-color:var(--magenta-light); font-size: 1em}
.przycisk.lekki:hover {background-color:var(--magentac) }
.przycisk.zaokraglone {border-radius: 5px; }
.przycisk.koszyk { background-image: url('../nn/css/../img/koszykbialy.svg'); background-size: 1em auto; background-position: 1.3em 0.78em;
padding-left: 3em; }
.przycisk.dalej { background-image: url('../nn/css/../img/dziubekbialy.svg'); background-size: auto 0.6em; background-position: right 1.2em center;padding-right: 2.3em; }
.przycisk.wstecz { background-image: url('../nn/css/../img/dziubekbialyw.svg'); background-size: auto 0.6em; background-position: left 1.2em center;padding-left: 2.3em; }
.przycisk.bilety { background-image: url("../nn/css/../img/bilety.svg");background-position: 1em 0.86em; padding-left: 3em; background-size: 1.2em auto;}
.przycisk.karnet { padding-left: 2.8em; background-image: url("../nn/css/../img/karnet.svg"); background-size:auto 0.9em; background-position: 1.3em 0.86em}
.przycisk.pakiet { padding-left: 2.8em; background-image: url("../nn/css/../img/vod/pakiet.svg"); background-size:auto 0.8em; background-position: 1.2em center}
.przycisk.printpdf { background-image: url("../nn/css/../img/printpdfb.svg");background-position: 1em 0.8em; padding-left: 2.8em; background-size: 1em auto;}
.przycisk.printfiskal { background-image: url("../nn/css/../img/printfiskalb.svg");background-position: 1em 0.8em; padding-left: 2.8em; background-size: 1em auto;}
.przycisk.printfiskal { background-image: url("../nn/css/../img/printfiskalb.svg");background-position: 1em 0.8em; padding-left: 2.8em; background-size: 1em auto;}
.przycisk.zwrot { background-image: url("../nn/css/../img/refundb.svg");background-position: 1em 1em;padding-left: 2.9em;background-size: 1.2em auto;}
.przycisk.printzebra { background-image: url("../nn/css/../img/printzebrab.svg");background-position: 1em 0.8em; padding-left: 2.8em; background-size: 1em auto;}
.przycisk.reset { background-image: url('../nn/css/../img/reset.svg'); background-size: auto 0.8em; background-position: left 0.9em center;padding-left: 2.3em; }
.przycisk.refresh { background-image: url('../nn/css/../img/refresh.svg'); background-size: auto 0.8em; background-position: right 1.1em center;padding-right: 2.9em; }
.przycisk.nobgonmobile { }
.przycisk.zramka {transition: all 0.2s; background: transparent; color: #373737; border: 2px solid #373737;
padding-top: calc(0.8em - 2px);
padding-bottom: calc(0.8em - 2px)
}
.przycisk.zramka:hover {color: #777; border-color: #777}
.przycisk.bialy {color: #000; background-color: #fff}
.przycisk.bialy:hover {background-color: #fafafa}
.przycisk.czarny {background-color: #000}
.przycisk.czarny:hover {background-color: #333}
.lewaimg {margin-left: 30px;}
.error {color: var(--error); }
.errorf {border: none; background-color: #ffffff; box-shadow: 0px 0px 0px 2px rgba(226, 0, 116, 1);}
ul.error {list-style: none; margin-left: 0px; padding-left: 0px; margin-top: 1.5em; margin-bottom: 1.5em}
ul.error li {color: var(--error); padding-left: 0px; margin-top: 0.3em; margin-left: 0px; background-image: none; }
table.form TD { padding-bottom: 5px; padding-right: 8px; }
table.form td + td {padding-right: 0px;}
.formularz H1 { padding-bottom: 0.6em; display: block;}
.formularz H1:FIRST-CHILD { padding-top:0.4em}
.ramka, .formularz .informacja {
border: 1px solid #000;
padding: 2em 2em;
margin-top: 1em;
width: 100%
}
.formularz .informacja {margin-top: 2em; font-size: 90%; width: auto; max-width: 800px; box-sizing: border-box;}
font.required { display: inline-block; font-size: 12px; margin-left: 0.6em}
div.form, div.form * {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
div.form > div {
clear: both;
overflow: visible;
padding: 0.6em 1px;
margin: 0px;
}
div.form > div > fieldset > div > div {
margin: 0 0 5px 0;
}
.formularz label:not(.f6):not(.f):not(.onoffswitch-label) {font-size: 82%; line-height: 1.35}
.formularz label.p {font-size: 90%; line-height: 1.5}
.formularz input[type=file] {font-size: 82%; margin: 0.5em 0; }
div.form > div > label + small {
display: inline-block; margin-top: -1em; transform: translateY(-0.7em); padding-bottom: 0.5em;
}
div.form > div > label,
legend {
width: 95%;
width: calc(100% - 1em);
xfloat: left;
vertical-align: middle;
display: inline-block;
padding-right: 10px;
padding-bottom: 0.5em;
}
div.form > div > div,
div.form > div > fieldset > div {
width: 100%;
xfloat: right;
display: inline-block;
vertical-align: middle;
}
div.form > div > fieldset label {
xfont-size: 90%;
}
fieldset {
border: 0;
padding: 0;
}
.formularz input[type=text], input.pole,
.formularz input[type=email],
.formularz input[type=url],
.formularz input[type=password],
.formularz select:not(.native),
.formularz textarea {
-webkit-appearance: none;
-moz-appearance: none;
border-radius: var(--field-radius);
border: none;
padding: 0.7em 0.7em;
font-size: 1em;
box-sizing: border-box;
color: #000;
outline: 0;
margin-top: 0.2em; margin-bottom: 0.2em;
}
.formularz textarea {min-width: 30em}
.formularz .szukajinput + button { top: 3pt; bottom: 3pt}
.formularz input:not(.reqinput),
.formularz select:not(.reqinput),
.formularz textarea:not(.reqinput) {
max-width: 100%;
}
.reqinput {max-width: 90%; max-width: calc(100% - 1.5em)}
div.form input[type=text],
div.form input[type=email],
div.form input[type=url],
div.form input[type=password] {
width: 30em;
}
.formularz .pdatepicker.showd {width: 12em}
.formularz .pdatepicker.showt {width: 10em}
.formularz .pdatepicker.showd.showt {width: 20em}
.formularz .odstep {height: 1em}
.formularz input[type=text]:focus, INPUT.pole:focus,
.formularz input[type=text]:focus,
.formularz input[type=email]:focus,
.formularz input[type=url]:focus,
.formularz input[type=password]:focus,
.formularz select:focus
.formularz textarea:focus, .formularz .nice-select:focus,
.formularz .select2-container--default.select2-container--focus .select2-selection {
outline:0; box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.75);
}
.formularz .select2-container--default.select2-container--focus .select2-selection { border:none; }
input[type=submit]:focus, button:focus { outline: 0; box-shadow: 0;}
.formularz input[type="checkbox"]:not(.native):not(.form-check-input) { display:none; }
.formularz input[type=checkbox].errorf:not(.native) + label { position: relative;}
.formularz input[type=checkbox].errorf:not(.native) + label:after { content: ''; position: absolute; top: -15px; left: -15px; right: -15px; bottom: -15px; border: rgba(226, 0, 116, 1) 2px solid; }
.formularz input[type=checkbox]:not(.native) + label:not(.f6):not(.f):not(.onoffswitch-label) { width: auto; float: none; margin-left: 0px; display: inline-block; cursor: pointer; position: relative; padding-top:0; padding-bottom: 0; margin-bottom: 0; padding-left: 2.5em; }
.formularz input[type=checkbox]:not(.native):not(.form-field) + label:not(.f6):not(.f):not(.onoffswitch-label):not(.form-field) {font-size: 1em }
.formularz input[type=checkbox]:not(.native) + label.giodo:not(.f6):not(.f):not(.onoffswitch-label) { font-size: 0.9em}
.formularz input[type=checkbox]:not(.native) + label.long:not(.f6):not(.f):not(.onoffswitch-label) { font-size: 90%;}
.formularz input[type=checkbox]:not(.native) + label:before { content: ""; display: inline-block; width: 1em; height: 1em; margin-right: 0.5em; position: absolute;
left: 0; bottom: 0px; top: 50%; transform: translateY(-50%); background-color: #fff; border: 3px solid #fff; border-radius: var(--field-radius); }
.formularz input[type=checkbox]:not(.native):checked + label:before { content: "\2713"; ; color: #000; text-align: center; line-height: 100% }
.formularz input[type=checkbox].maly:not(.native)+label:before {border: 0; width: 0.8em; height: 0.8em; margin-top: -2px;}
.formularz input[type=checkbox].maly:not(.native)+label {padding-left: 1.6em}
.formularz input[type=checkbox].top + label:before {top: 1em}
input[type='radio']:not(.nice) { transform: scale(1.4); margin-right: 5px; margin-top: 4px; }
.formularz input[type='radio']:not(.nice) + label { display: inline-block; width: auto; margin-left: 0.6em; font-size: 0.9em}
.formularz .radiorow { display: flex; flex-wrap: nowrap; align-items: baseline;}
.formularz .radiorow input[type='radio'] {margin-top: 0px; transform: scale(1.4) translateY(5%)}
.formularz .radiogroup.errorf input[type='radio'].errorf { box-shadow: none; }
.formularz .radiogroup.errorf { background-color: transparent; padding: 1em}
.formularz .radiogroup .radiorow { padding: .6em 1px;}
.formularz .nice-select { border: none; border-radius: var(--field-radius); margin-right: 0.5em; height: 2.55em; margin-top: 0.2em; margin-bottom: 0.2em;}
.formularz .nice-select .option.selected { font-weight: 500}
.formularz .nice-select , .formularz .nice-select .list {width: 20em}
.nice-select.def , .nice-select.def .list {width: 20em}
.nice-select.waski, .nice-select.waski .list {width: 6em}
.nice-select.sredni, .nice-select.sredni .list {width: 15em}
.nice-select.polowa, .nice-select.polowa .list {width: 10em}
.nice-select.sredniowaski, .nice-select.sredniowaski .list {width: 8.3em}
.nice-select.szerszy, .nice-select.szerszy .list {width: 21em}
.nice-select.szeroki, .nice-select.szeroki .list {width: 30em}
.get-tickets-buttons { margin-top: 3em; margin-bottom: 4em; display: flex; align-items: center; column-gap: 1.5em; row-gap: 1em; flex-wrap: wrap;}
.get-tickets-buttons a img {height: 3.2em; width: auto; max-width: none; }
.formularz .select2-container--default .select2-selection {border-radius: 0px; border: none; margin-right: 0.5em; min-height: 2.55em; margin-top: 0.2em; margin-bottom: 0.2em; width: 20em;}
.logowaniepopup.lpop {padding: 0.5em 0 0 0; width: 15em; margin-left: auto; margin-right: auto;}
.logowaniepopup .przycisk {font-size: 110%}
.logowaniepopup .komunik { padding: 1em 0;font-size: 90% }
.gprzycisk {width: 100%; }
.logowaniepopup .gprzycisk-lab { padding: 1.5em 0px 0.1em; text-align: center;}
.logowaniepopup .gprzycisk {margin-top: 0.5em; margin-right:0; margin-bottom: 2em; height: 2em; display: flex; justify-content: center; width: 100% }
.formularz .mgprzycisk-lab { padding: 1.5em 0px 0.1em; text-align: center;}
.formularz .mgprzycisk {margin-top: 1em; margin-right:0; margin-bottom: 0.2em; display: flex; justify-content: center;}
.lista {max-width: 1000px; margin-top: 2em; margin-bottom: 2.5em }
.lista.mniejsza { font-size: 85%}
.lista .w {width: 100%; border-top: 1px solid #000; flex-flow: row nowrap; box-sizing: border-box; padding-bottom: 1em; display: flex; justify-content: space-between; align-items: baseline; align-content: flex-start}
.lista .w > div {box-sizing: border-box; flex: 0 1 20%; padding: 1em 1em 0 0;xwhite-space: nowrap; }
.lista .w > div:LAST-CHILD {padding-right: 0em; text-align: right; justify-content: flex-end; }
.lista .w.head {font-weight: 500; }
.lista .w a:not(.bump-underline) {text-decoration: none}
.lista .w:not(.podsumowanie):not(.podwiersz):LAST-CHILD {border-bottom: 1px solid #000;}
.lista .w .nazwa {flex-basis: 40%; min-width: 20em}
.lista .w .numer {flex-basis: 30%; min-width: 10em}
.lista .w .p30 {flex-basis: 30%; min-width: 10em}
.lista .w .p20 {flex-basis: 20%; min-width: 6em}
.lista .w .p10 {flex-basis: 10%; min-width: 4em}
.lista .w .krotszanazwa {flex-basis: 40%; min-width: 15em}
.lista.upakowana {font-size: 75%;}
.lista.upakowana .w {padding-bottom: 0.7em}
.lista.upakowana .w>div {padding-top: 0.7em}
.lista .w.main { }
.lista .w.sub { border-top: 0px dotted #888}
.lista .w.dottedline { border-top: 1px dotted #888}
.lista .w.sub {color: #555}
.lista .w.sub {padding-bottom: 0.5em}
.lista .w.sub>div {padding-top: 0.5em}
.lista.upakowana .w.sub {padding-bottom: 0.5em}
.lista.upakowana .w.sub>div {padding-top: 0.5em}
.lista .w.sub>div.topborder { border-top: 1px dotted #888 }
.lista a.del {margin-bottom: -0.15em; background-image: url(../nn/css/../img/delete2.svg); background-position: center center; background-size: 0.7em auto; width: 1em; height: 1em; display: inline-block; transition: all 0.2s; }
.lista a.del:hover {transform: rotate(90deg); }
.xlista a.minusone {xmargin-bottom: -0.15em; background-image: url(../nn/css/../img/minusone.svg); background-position: center center; background-size: auto 0.9em; width: 2em; height: 1.2em; display: inline-block; transition: all 0.2s; }
.xlista a.minusone:hover {xtransform: rotate(90deg); }
/** raczej już nieużywane */
.lista a.minusone {color: var(--text) }
.lista a.minusone:before {
content: "";
margin-bottom: -0.15em; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-dash-circle' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16'/%3E%3Cpath d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8'/%3E%3C/svg%3E");
background-position: center center; background-size: 0.80em auto; width: 1em; height: 1em; display: inline-block; transition: all 0.2s;
}
.lista a.minusone:hover:before {transform: scale(1.3); }
div.form .w { }
div.form > div.one-row > label {
width: 23%;
width: calc(25% - 1em);
xfloat: left;
vertical-align: middle;
display: inline-block;
padding-right: 10px;
}
div.form > div.one-row > div {
width: 75%;
xfloat: right;
display: inline-block;
vertical-align: middle;
}
/** do zdjęć! */
.status {
width:auto;
margin: 1.5em 0;
background-color: #ddd;
padding: 1em
}
.thumb_saved {
border: 8px solid var(--magentac) ; border-radius: 5px; -moz-border-radius: 5px;
}
.thumb_prev {
border:8px solid #777777 ; border-radius: 5px; -moz-border-radius: 5px;
}
div.uploaded_image_img { text-align: center }
div.uploaded_image_strz { clear: both; margin: 12px 0px 12px 120px;}
#cadr_preview { float: left; margin-left: 40px;}
.imgareaselect-border1 {
background: url(../nn/css/../../img/ias/border-anim-v.gif) repeat-y left top;
}
.imgareaselect-border2 {
background: url(../nn/css/../../img/ias/border-anim-h.gif) repeat-x left top;
}
.imgareaselect-border3 {
background: url(../nn/css/../../img/ias/border-anim-v.gif) repeat-y right top;
}
.imgareaselect-border4 {
background: url(../nn/css/../../img/ias/border-anim-h.gif) repeat-x left bottom;
}
.imgareaselect-border1, .imgareaselect-border2,
.imgareaselect-border3, .imgareaselect-border4 {
filter: alpha(opacity=50);
opacity: 0.5;
}
.imgareaselect-handle {
background-color: #fff;
border: solid 1px #000;
filter: alpha(opacity=50);
opacity: 0.5;
}
.imgareaselect-outer {
background-color: #000;
filter: alpha(opacity=50);
opacity: 0.5;
}
.imgareaselect-selection {
}
@media (max-width: 750px) {
.lista .w .tohide {display:none}
.formularz.waski {margin-left: 0}
.giodo {font-size: 12px;}
.lista .w .nazwa { min-width: 15em}
.lista .w .krotszanazwa { min-width: 10em}
.lista .w .numer {min-width:9em}
.lista .w .p30 {min-width: 9em}
}
@media (max-width: 650px) {
.lista .w {flex-flow: row wrap;}
.lista .w.sub>div.topborder {border-top: none}
.lista .w.sub {xborder-top: 1px dotted #555}
.przycisk.nobgonmobile { text-align: left; background-image: none; padding-left: 1.5em }
}
@media (max-width: 550px) {
.lista .w {flex-flow: row wrap;}
.lista .w .tohide.h {display:none}
.lista .w .nazwa {flex-basis: 30%; min-width: 12em}
.lista .w .numer {flex-basis: 20%; min-width: 6em}
.lista .w .krotszanazwa {flex-basis: 30%; min-width: 8em}
.lista .w .p30 {flex-basis: 20%; min-width: 8em}
.lista .w .p20 {flex-basis: 15%; min-width: 5em}
.lista .w .p10 {flex-basis: 8%; min-width: 4em}
/** .formularz input[type=text] + .required,
.formularz input[type=email] + .required,
.formularz input[type=url] + .required,
.formularz input[type=password] + .required,
.formularz select + .required,
.formularz textarea + .required {
xposition: absolute;
}*/
}
.flatpickr-calendar {
background: transparent;
overflow: hidden;
max-height: 0;
opacity: 0;
visibility: hidden;
text-align: center;
padding: 0;
-webkit-animation: none;
animation: none;
direction: ltr;
border: 0;
font-size: 14px;
line-height: 24px;
border-radius: 5px;
position: absolute;
width: 307.875px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-ms-touch-action: manipulation;
touch-action: manipulation;
background: #fff;
-webkit-box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
}
.flatpickr-calendar.open,
.flatpickr-calendar.inline {
opacity: 1;
visibility: visible;
overflow: visible;
max-height: 640px;
}
.flatpickr-calendar.open {
display: inline-block;
z-index: 99999;
}
.flatpickr-calendar.animate.open {
-webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-calendar.inline {
display: block;
position: relative;
top: 2px;
}
.flatpickr-calendar.static {
position: absolute;
top: calc(100% + 2px);
}
.flatpickr-calendar.static.open {
z-index: 999;
display: block;
}
.flatpickr-calendar.hasWeeks {
width: auto;
}
.flatpickr-calendar .hasWeeks .dayContainer,
.flatpickr-calendar .hasTime .dayContainer {
border-bottom: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.flatpickr-calendar .hasWeeks .dayContainer {
border-left: 0;
}
.flatpickr-calendar.showTimeInput.hasTime .flatpickr-time {
height: 40px;
border-top: 1px solid #e6e6e6;
}
.flatpickr-calendar.noCalendar.hasTime .flatpickr-time {
height: auto;
}
.flatpickr-calendar:before,
.flatpickr-calendar:after {
position: absolute;
display: block;
pointer-events: none;
border: solid transparent;
content: '';
height: 0;
width: 0;
left: 22px;
}
.flatpickr-calendar.rightMost:before,
.flatpickr-calendar.rightMost:after {
left: auto;
right: 22px;
}
.flatpickr-calendar:before {
border-width: 5px;
margin: 0 -5px;
}
.flatpickr-calendar:after {
border-width: 4px;
margin: 0 -4px;
}
.flatpickr-calendar.arrowTop:before,
.flatpickr-calendar.arrowTop:after {
bottom: 100%;
}
.flatpickr-calendar.arrowTop:before {
border-bottom-color: #e6e6e6;
}
.flatpickr-calendar.arrowTop:after {
border-bottom-color: #fff;
}
.flatpickr-calendar.arrowBottom:before,
.flatpickr-calendar.arrowBottom:after {
top: 100%;
}
.flatpickr-calendar.arrowBottom:before {
border-top-color: #e6e6e6;
}
.flatpickr-calendar.arrowBottom:after {
border-top-color: #fff;
}
.flatpickr-calendar:focus {
outline: 0;
}
.flatpickr-wrapper {
position: relative;
display: inline-block;
}
.flatpickr-month {
background: transparent;
color: rgba(0,0,0,0.9);
fill: rgba(0,0,0,0.9);
height: 28px;
line-height: 1;
text-align: center;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
overflow: hidden;
}
.flatpickr-prev-month,
.flatpickr-next-month {
text-decoration: none;
cursor: pointer;
position: absolute;
top: 0px;
line-height: 16px;
height: 28px;
padding: 10px calc(3.57% - 1.5px);
z-index: 3;
}
.flatpickr-prev-month i,
.flatpickr-next-month i {
position: relative;
}
.flatpickr-prev-month.flatpickr-prev-month,
.flatpickr-next-month.flatpickr-prev-month {
/*
/*rtl:begin:ignore*/
/*
*/
left: 0;
/*
/*rtl:end:ignore*/
/*
*/
}
/*
/*rtl:begin:ignore*/
/*
/*rtl:end:ignore*/
.flatpickr-prev-month.flatpickr-next-month,
.flatpickr-next-month.flatpickr-next-month {
/*
/*rtl:begin:ignore*/
/*
*/
right: 0;
/*
/*rtl:end:ignore*/
/*
*/
}
/*
/*rtl:begin:ignore*/
/*
/*rtl:end:ignore*/
.flatpickr-prev-month:hover,
.flatpickr-next-month:hover {
color: #959ea9;
}
.flatpickr-prev-month:hover svg,
.flatpickr-next-month:hover svg {
fill: #f64747;
}
.flatpickr-prev-month svg,
.flatpickr-next-month svg {
width: 14px;
}
.flatpickr-prev-month svg path,
.flatpickr-next-month svg path {
-webkit-transition: fill 0.1s;
transition: fill 0.1s;
fill: inherit;
}
.numInputWrapper {
position: relative;
height: auto;
}
.numInputWrapper input,
.numInputWrapper span {
display: inline-block;
}
.numInputWrapper input {
width: 100%;
}
.numInputWrapper span {
position: absolute;
right: 0;
width: 14px;
padding: 0 4px 0 2px;
height: 50%;
line-height: 50%;
opacity: 0;
cursor: pointer;
border: 1px solid rgba(57,57,57,0.05);
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.numInputWrapper span:hover {
background: rgba(0,0,0,0.1);
}
.numInputWrapper span:active {
background: rgba(0,0,0,0.2);
}
.numInputWrapper span:after {
display: block;
content: "";
position: absolute;
top: 33%;
}
.numInputWrapper span.arrowUp {
top: 0;
border-bottom: 0;
}
.numInputWrapper span.arrowUp:after {
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-bottom: 4px solid rgba(57,57,57,0.6);
}
.numInputWrapper span.arrowDown {
top: 50%;
}
.numInputWrapper span.arrowDown:after {
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 4px solid rgba(57,57,57,0.6);
}
.numInputWrapper span svg {
width: inherit;
height: auto;
}
.numInputWrapper span svg path {
fill: rgba(0,0,0,0.5);
}
.numInputWrapper:hover {
background: rgba(0,0,0,0.05);
}
.numInputWrapper:hover span {
opacity: 1;
}
.flatpickr-current-month {
font-size: 135%;
line-height: inherit;
font-weight: 300;
color: inherit;
position: absolute;
width: 75%;
left: 12.5%;
padding: 6.16px 0 0 0;
line-height: 1;
height: 28px;
display: inline-block;
text-align: center;
-webkit-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
.flatpickr-current-month.slideLeft {
-webkit-transform: translate3d(-100%, 0px, 0px);
transform: translate3d(-100%, 0px, 0px);
-webkit-animation: fpFadeOut 400ms ease, fpSlideLeft 400ms cubic-bezier(0.23, 1, 0.32, 1);
animation: fpFadeOut 400ms ease, fpSlideLeft 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-current-month.slideLeftNew {
-webkit-transform: translate3d(100%, 0px, 0px);
transform: translate3d(100%, 0px, 0px);
-webkit-animation: fpFadeIn 400ms ease, fpSlideLeftNew 400ms cubic-bezier(0.23, 1, 0.32, 1);
animation: fpFadeIn 400ms ease, fpSlideLeftNew 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-current-month.slideRight {
-webkit-transform: translate3d(100%, 0px, 0px);
transform: translate3d(100%, 0px, 0px);
-webkit-animation: fpFadeOut 400ms ease, fpSlideRight 400ms cubic-bezier(0.23, 1, 0.32, 1);
animation: fpFadeOut 400ms ease, fpSlideRight 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-current-month.slideRightNew {
-webkit-transform: translate3d(0, 0, 0px);
transform: translate3d(0, 0, 0px);
-webkit-animation: fpFadeIn 400ms ease, fpSlideRightNew 400ms cubic-bezier(0.23, 1, 0.32, 1);
animation: fpFadeIn 400ms ease, fpSlideRightNew 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-current-month span.cur-month {
font-family: inherit;
font-weight: 700;
color: inherit;
display: inline-block;
margin-left: 0.5ch;
padding: 0;
}
.flatpickr-current-month span.cur-month:hover {
background: rgba(0,0,0,0.05);
}
.flatpickr-current-month .numInputWrapper {
width: 6ch;
width: 7ch\0;
display: inline-block;
}
.flatpickr-current-month .numInputWrapper span.arrowUp:after {
border-bottom-color: rgba(0,0,0,0.9);
}
.flatpickr-current-month .numInputWrapper span.arrowDown:after {
border-top-color: rgba(0,0,0,0.9);
}
.flatpickr-current-month input.cur-year {
background: transparent;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: inherit;
cursor: default;
padding: 0 0 0 0.5ch;
margin: 0;
display: inline-block;
font-size: inherit;
font-family: inherit;
font-weight: 300;
line-height: inherit;
height: initial;
border: 0;
border-radius: 0;
vertical-align: initial;
}
.flatpickr-current-month input.cur-year:focus {
outline: 0;
}
.flatpickr-current-month input.cur-year[disabled],
.flatpickr-current-month input.cur-year[disabled]:hover {
font-size: 100%;
color: rgba(0,0,0,0.5);
background: transparent;
pointer-events: none;
}
.flatpickr-weekdays {
background: transparent;
text-align: center;
overflow: hidden;
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
height: 28px;
}
span.flatpickr-weekday {
cursor: default;
font-size: 90%;
background: transparent;
color: rgba(0,0,0,0.54);
line-height: 1;
margin: 0;
text-align: center;
display: block;
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
font-weight: bolder;
}
.dayContainer,
.flatpickr-weeks {
padding: 1px 0 0 0;
}
.flatpickr-days {
position: relative;
overflow: hidden;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 307.875px;
}
.flatpickr-days:focus {
outline: 0;
}
.dayContainer {
padding: 0;
outline: 0;
text-align: left;
width: 307.875px;
min-width: 307.875px;
max-width: 307.875px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
display: -ms-flexbox;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-wrap: wrap;
-ms-flex-pack: justify;
-webkit-justify-content: space-around;
justify-content: space-around;
-webkit-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
opacity: 1;
}
.flatpickr-calendar.animate .dayContainer.slideLeft {
-webkit-animation: fpFadeOut 400ms cubic-bezier(0.23, 1, 0.32, 1), fpSlideLeft 400ms cubic-bezier(0.23, 1, 0.32, 1);
animation: fpFadeOut 400ms cubic-bezier(0.23, 1, 0.32, 1), fpSlideLeft 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-calendar.animate .dayContainer.slideLeft,
.flatpickr-calendar.animate .dayContainer.slideLeftNew {
-webkit-transform: translate3d(-100%, 0px, 0px);
transform: translate3d(-100%, 0px, 0px);
}
.flatpickr-calendar.animate .dayContainer.slideLeftNew {
-webkit-animation: fpFadeIn 400ms cubic-bezier(0.23, 1, 0.32, 1), fpSlideLeft 400ms cubic-bezier(0.23, 1, 0.32, 1);
animation: fpFadeIn 400ms cubic-bezier(0.23, 1, 0.32, 1), fpSlideLeft 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-calendar.animate .dayContainer.slideRight {
-webkit-animation: fpFadeOut 400ms cubic-bezier(0.23, 1, 0.32, 1), fpSlideRight 400ms cubic-bezier(0.23, 1, 0.32, 1);
animation: fpFadeOut 400ms cubic-bezier(0.23, 1, 0.32, 1), fpSlideRight 400ms cubic-bezier(0.23, 1, 0.32, 1);
-webkit-transform: translate3d(100%, 0px, 0px);
transform: translate3d(100%, 0px, 0px);
}
.flatpickr-calendar.animate .dayContainer.slideRightNew {
-webkit-animation: fpFadeIn 400ms cubic-bezier(0.23, 1, 0.32, 1), fpSlideRightNew 400ms cubic-bezier(0.23, 1, 0.32, 1);
animation: fpFadeIn 400ms cubic-bezier(0.23, 1, 0.32, 1), fpSlideRightNew 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-day {
background: none;
border: 1px solid transparent;
border-radius: 150px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #393939;
cursor: pointer;
font-weight: 400;
width: 14.2857143%;
-webkit-flex-basis: 14.2857143%;
-ms-flex-preferred-size: 14.2857143%;
flex-basis: 14.2857143%;
max-width: 39px;
height: 39px;
line-height: 39px;
margin: 0;
display: inline-block;
position: relative;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
text-align: center;
}
.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,
.flatpickr-day.prevMonthDay.today.inRange,
.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
cursor: pointer;
outline: 0;
background: #e6e6e6;
border-color: #e6e6e6;
}
.flatpickr-day.today {
border-color: #959ea9;
}
.flatpickr-day.today:hover,
.flatpickr-day.today:focus {
border-color: #959ea9;
background: #959ea9;
color: #fff;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
background: #569ff7;
-webkit-box-shadow: none;
box-shadow: none;
color: #fff;
border-color: #569ff7;
}
.flatpickr-day.selected.startRange,
.flatpickr-day.startRange.startRange,
.flatpickr-day.endRange.startRange {
border-radius: 50px 0 0 50px;
}
.flatpickr-day.selected.endRange,
.flatpickr-day.startRange.endRange,
.flatpickr-day.endRange.endRange {
border-radius: 0 50px 50px 0;
}
.flatpickr-day.selected.startRange + .endRange,
.flatpickr-day.startRange.startRange + .endRange,
.flatpickr-day.endRange.startRange + .endRange {
-webkit-box-shadow: -10px 0 0 #569ff7;
box-shadow: -10px 0 0 #569ff7;
}
.flatpickr-day.selected.startRange.endRange,
.flatpickr-day.startRange.startRange.endRange,
.flatpickr-day.endRange.startRange.endRange {
border-radius: 50px;
}
.flatpickr-day.inRange {
border-radius: 0;
-webkit-box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}
.flatpickr-day.disabled,
.flatpickr-day.disabled:hover {
pointer-events: none;
}
.flatpickr-day.disabled,
.flatpickr-day.disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay,
.flatpickr-day.notAllowed,
.flatpickr-day.notAllowed.prevMonthDay,
.flatpickr-day.notAllowed.nextMonthDay {
color: rgba(57,57,57,0.3);
background: transparent;
border-color: transparent;
cursor: default;
}
.flatpickr-day.week.selected {
border-radius: 0;
-webkit-box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
}
.rangeMode .flatpickr-day {
margin-top: 1px;
}
.flatpickr-weekwrapper {
display: inline-block;
float: left;
}
.flatpickr-weekwrapper .flatpickr-weeks {
padding: 0 12px;
-webkit-box-shadow: 1px 0 0 #e6e6e6;
box-shadow: 1px 0 0 #e6e6e6;
}
.flatpickr-weekwrapper .flatpickr-weekday {
float: none;
width: 100%;
line-height: 28px;
}
.flatpickr-weekwrapper span.flatpickr-day {
display: block;
width: 100%;
max-width: none;
}
.flatpickr-innerContainer {
display: block;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
}
.flatpickr-rContainer {
display: inline-block;
padding: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.flatpickr-time {
text-align: center;
outline: 0;
display: block;
height: 0;
line-height: 40px;
max-height: 40px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.flatpickr-time:after {
content: "";
display: table;
clear: both;
}
.flatpickr-time .numInputWrapper {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
width: 40%;
height: 40px;
float: left;
}
.flatpickr-time .numInputWrapper span.arrowUp:after {
border-bottom-color: #393939;
}
.flatpickr-time .numInputWrapper span.arrowDown:after {
border-top-color: #393939;
}
.flatpickr-time.hasSeconds .numInputWrapper {
width: 26%;
}
.flatpickr-time.time24hr .numInputWrapper {
width: 49%;
}
.flatpickr-time input {
background: transparent;
-webkit-box-shadow: none;
box-shadow: none;
border: 0;
border-radius: 0;
text-align: center;
margin: 0;
padding: 0;
height: inherit;
line-height: inherit;
cursor: pointer;
color: #393939;
font-size: 14px;
position: relative;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.flatpickr-time input.flatpickr-hour {
font-weight: bold;
}
.flatpickr-time input.flatpickr-minute,
.flatpickr-time input.flatpickr-second {
font-weight: 400;
}
.flatpickr-time input:focus {
outline: 0;
border: 0;
}
.flatpickr-time .flatpickr-time-separator,
.flatpickr-time .flatpickr-am-pm {
height: inherit;
display: inline-block;
float: left;
line-height: inherit;
color: #393939;
font-weight: bold;
width: 2%;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-align-self: center;
-ms-flex-item-align: center;
align-self: center;
}
.flatpickr-time .flatpickr-am-pm {
outline: 0;
width: 18%;
cursor: pointer;
text-align: center;
font-weight: 400;
}
.flatpickr-time .flatpickr-am-pm:hover,
.flatpickr-time .flatpickr-am-pm:focus {
background: #f0f0f0;
}
.flatpickr-input[readonly] {
cursor: pointer;
}
@-webkit-keyframes fpFadeInDown {
from {
opacity: 0;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fpFadeInDown {
from {
opacity: 0;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-webkit-keyframes fpSlideLeft {
from {
-webkit-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
to {
-webkit-transform: translate3d(-100%, 0px, 0px);
transform: translate3d(-100%, 0px, 0px);
}
}
@keyframes fpSlideLeft {
from {
-webkit-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
to {
-webkit-transform: translate3d(-100%, 0px, 0px);
transform: translate3d(-100%, 0px, 0px);
}
}
@-webkit-keyframes fpSlideLeftNew {
from {
-webkit-transform: translate3d(100%, 0px, 0px);
transform: translate3d(100%, 0px, 0px);
}
to {
-webkit-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
}
@keyframes fpSlideLeftNew {
from {
-webkit-transform: translate3d(100%, 0px, 0px);
transform: translate3d(100%, 0px, 0px);
}
to {
-webkit-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
}
@-webkit-keyframes fpSlideRight {
from {
-webkit-transform: translate3d(0, 0, 0px);
transform: translate3d(0, 0, 0px);
}
to {
-webkit-transform: translate3d(100%, 0px, 0px);
transform: translate3d(100%, 0px, 0px);
}
}
@keyframes fpSlideRight {
from {
-webkit-transform: translate3d(0, 0, 0px);
transform: translate3d(0, 0, 0px);
}
to {
-webkit-transform: translate3d(100%, 0px, 0px);
transform: translate3d(100%, 0px, 0px);
}
}
@-webkit-keyframes fpSlideRightNew {
from {
-webkit-transform: translate3d(-100%, 0, 0px);
transform: translate3d(-100%, 0, 0px);
}
to {
-webkit-transform: translate3d(0, 0, 0px);
transform: translate3d(0, 0, 0px);
}
}
@keyframes fpSlideRightNew {
from {
-webkit-transform: translate3d(-100%, 0, 0px);
transform: translate3d(-100%, 0, 0px);
}
to {
-webkit-transform: translate3d(0, 0, 0px);
transform: translate3d(0, 0, 0px);
}
}
@-webkit-keyframes fpFadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes fpFadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes fpFadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fpFadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.flatpickr-calendar {padding: 10px; font-size: 14px; font-weight: 400; color : #373737; width: auto;}
.flatpickr-current-month {font-size: 14px;font-weight: inherit; padding-top: 8px;}
.flatpickr-current-month span.cur-month { font-weight: inherit;font-size: 14px !important; text-transform: lowercase;}
.flatpickr-current-month .numInputWrapper {width: 7ch;}
.flatpickr-current-month span.cur-month {margin-left: 2ch}
.flatpickr-month {margin-bottom: 20px;}
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.selected.inRange, .flatpickr-day.startRange.inRange, .flatpickr-day.endRange.inRange, .flatpickr-day.selected:focus, .flatpickr-day.startRange:focus, .flatpickr-day.endRange:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.endRange.nextMonthDay {background-color: var(--magentac); border-color: var(--magentac); }
.flatpickr-day {border-radius: 0px}
span.flatpickr-weekday { font-size: inherit; font-weight: 500; color: #000;}
.flatpickr-current-month input.cur-year { font-weight: 400; font-size: 14px !important;}/**
skorygowana wersja
https://cdn.jsdelivr.net/gh/orestbida/cookieconsent@v3.1.0/dist/cookieconsent.css
*/
:root {
--cc-font-family: Roboto,Helvetica,Arial,sans-serif;
--cc-modal-border-radius: 0px;
--cc-btn-border-radius: 0px;
--cc-modal-transition-duration: .25s;
--cc-link-color: var(--cc-btn-primary-bg);
--cc-modal-margin: 1rem;
--cc-z-index: 2147483647;
--cc-bg: #fff;
--cc-primary-color: #000;
--cc-secondary-color: #000;
--cc-btn-primary-bg: var(--magentac);
--cc-btn-primary-border-color: var(--button);
--cc-btn-primary-color: #fff;
--cc-btn-primary-border-color: var(--cc-btn-primary-bg);
--cc-btn-primary-hover-bg:var(--magentah);
--cc-btn-primary-hover-color: #fff;
--cc-btn-primary-hover-border-color: var(--cc-btn-primary-hover-bg);
--cc-btn-secondary-bg: #eaeff2;
--cc-btn-secondary-color: var(--cc-primary-color);
--cc-btn-secondary-border-color: var(--cc-btn-secondary-bg);
--cc-btn-secondary-hover-bg: #d4dae0;
--cc-btn-secondary-hover-color: #000;
--cc-btn-secondary-hover-border-color: #d4dae0;
--cc-separator-border-color: #f0f4f7;
--cc-toggle-on-bg: #30363c; /** var(--cc-btn-primary-bg); */
--cc-toggle-off-bg: #667481;
--cc-toggle-on-knob-bg: #fff;
--cc-toggle-off-knob-bg: var(--cc-toggle-on-knob-bg);
--cc-toggle-enabled-icon-color: var(--cc-bg);
--cc-toggle-disabled-icon-color: var(--cc-bg);
--cc-toggle-readonly-bg: #d5dee2;
--cc-toggle-readonly-knob-bg: #fff;
--cc-toggle-readonly-knob-icon-color: var(--cc-toggle-readonly-bg);
--cc-section-category-border: var(--cc-cookie-category-block-bg);
--cc-cookie-category-block-bg: #f0f4f7;
--cc-cookie-category-block-border: #f0f4f7;
--cc-cookie-category-block-hover-bg: #e9eff4;
--cc-cookie-category-block-hover-border: #e9eff4;
--cc-cookie-category-expanded-block-bg: transparent;
--cc-cookie-category-expanded-block-hover-bg: #dee4e9;
--cc-overlay-bg: rgba(0, 0, 0, .65);
--cc-webkit-scrollbar-bg: var(--cc-section-category-border);
--cc-webkit-scrollbar-hover-bg: var(--cc-btn-primary-hover-bg);
--cc-footer-bg: var(--cc-btn-secondary-bg);
--cc-footer-color: var(--cc-secondary-color);
--cc-footer-border-color: #e4eaed;
--cc-pm-toggle-border-radius: 4em
}
#cc-main {
background: transparent;
color: var(--cc-primary-color);
font-size: 1em;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
line-height: 1.15;
position: relative;
text-rendering: optimizeLegibility;
-webkit-text-size-adjust: 100%;
position: fixed;
z-index: var(--cc-z-index)
}
#cc-main :after,
#cc-main :before,
#cc-main button,
#cc-main div,
#cc-main input,
#cc-main p,
#cc-main span {
all: unset;
box-sizing: border-box
}
#cc-main .pm__badge,
#cc-main button {
all: initial;
box-sizing: border-box;
color: unset;
visibility: unset
}
#cc-main .pm__badge,
#cc-main button,
#cc-main input {
-webkit-appearance: none;
appearance: none;
cursor: pointer;
font-family: inherit;
font-size: 100%;
line-height: normal;
margin: 0;
outline: revert;
outline-offset: 2px;
overflow: hidden
}
#cc-main table,
#cc-main tbody,
#cc-main td,
#cc-main th,
#cc-main thead,
#cc-main tr {
all: revert;
color: inherit;
font-family: inherit;
font-size: inherit;
font-weight: inherit
}
#cc-main.cc--rtl {
direction: rtl
}
#cc-main b,
#cc-main strong {
font-weight: 500
}
#cc-main button>span {
pointer-events: none
}
/*
#cc-main .cc__link,
#cc-main a {
background-image: linear-gradient(currentColor, currentColor);
background-position: 0 100%;
background-repeat: no-repeat;
background-size: 0 1px;
font-weight: 600;
position: relative;
transition: background-size .25s, color .25s ease
}
#cc-main .cc__link:hover,
#cc-main a:hover {
background-size: 100% 1px;
color: var(--cc-primary-color)
}
#cc-main .cc__link {
color: var(--cc-link-color)
}
*/
#cc-main .cm__desc,
#cc-main .pm__body {
overscroll-behavior: auto contain;
scrollbar-width: thin
}
@media screen and (min-width:640px) {
#cc-main ::-webkit-scrollbar,
#cc-main ::-webkit-scrollbar-thumb,
#cc-main ::-webkit-scrollbar-track {
all: revert
}
#cc-main ::-webkit-scrollbar-thumb {
-webkit-background-clip: padding-box;
background-clip: padding-box;
background: var(--cc-toggle-readonly-bg);
border: .25rem solid var(--cc-bg);
border-radius: 1rem
}
#cc-main ::-webkit-scrollbar-thumb:hover {
background: var(--cc-toggle-off-bg)
}
#cc-main ::-webkit-scrollbar {
background: transparent;
width: 12px
}
}
html.disable--interaction.show--consent,
html.disable--interaction.show--consent body {
height: auto !important;
overflow: hidden !important
}
@media (prefers-reduced-motion) {
#cc-main {
--cc-modal-transition-duration: 0s
}
}
.cc--darkmode {
--cc-bg: #161a1c;
--cc-primary-color: #ebf3f6;
--cc-secondary-color: #aebbc5;
--cc-btn-primary-bg: #c2d0e0;
--cc-btn-primary-color: var(--cc-bg);
--cc-btn-primary-border-color: var(--cc-btn-primary-bg);
--cc-btn-primary-hover-bg: #98a7b6;
--cc-btn-primary-hover-color: #000;
--cc-btn-primary-hover-border-color: var(--cc-btn-primary-hover-bg);
--cc-btn-secondary-bg: #242c31;
--cc-btn-secondary-color: var(--cc-primary-color);
--cc-btn-secondary-border-color: var(--cc-btn-secondary-bg);
--cc-btn-secondary-hover-bg: #353d43;
--cc-btn-secondary-hover-color: #fff;
--cc-btn-secondary-hover-border-color: var(--cc-btn-secondary-hover-bg);
--cc-separator-border-color: #222a30;
--cc-toggle-on-bg: var(--cc-btn-primary-bg);
--cc-toggle-off-bg: #525f6b;
--cc-toggle-on-knob-bg: var(--cc-btn-primary-color);
--cc-toggle-off-knob-bg: var(--cc-btn-primary-color);
--cc-toggle-enabled-icon-color: var(--cc-btn-primary-color);
--cc-toggle-disabled-icon-color: var(--cc-btn-primary-color);
--cc-toggle-readonly-bg: #343e45;
--cc-toggle-readonly-knob-bg: #5f6b72;
--cc-toggle-readonly-knob-icon-color: var(--cc-toggle-readonly-bg);
--cc-section-category-border: #1e2428;
--cc-cookie-category-block-bg: #1e2428;
--cc-cookie-category-block-border: var(--cc-section-category-border);
--cc-cookie-category-block-hover-bg: #242c31;
--cc-cookie-category-block-hover-border: #232a2f;
--cc-cookie-category-expanded-block-bg: transparent;
--cc-cookie-category-expanded-block-hover-bg: var(--cc-toggle-readonly-bg);
--cc-overlay-bg: rgba(0, 0, 0, .65);
--cc-webkit-scrollbar-bg: var(--cc-section-category-border);
--cc-webkit-scrollbar-hover-bg: var(--cc-btn-primary-hover-bg);
--cc-footer-bg: #0c0e0f;
--cc-footer-color: var(--cc-secondary-color);
--cc-footer-border-color: #060809
}
.cc--darkmode #cc-main {
color-scheme: dark
}
#cc-main .cm {
background: var(--cc-bg);
border-radius: var(--cc-modal-border-radius);
box-shadow: 0 .625em 1.875em rgba(0, 0, 2, .3);
display: flex;
flex-direction: column;
max-width: 24rem;
opacity: 0;
overflow: hidden;
position: fixed;
transform: translateY(1.6em);
visibility: hidden;
z-index: 1
}
#cc-main .cm--top {
top: var(--cc-modal-margin)
}
#cc-main .cm--middle {
top: 50%;
transform: translateY(calc(-50% + 1.6em))
}
#cc-main .cm--bottom {
bottom: var(--cc-modal-margin)
}
#cc-main .cm--center {
left: var(--cc-modal-margin);
margin: 0 auto;
right: var(--cc-modal-margin);
width: unset
}
#cc-main .cm--left {
left: var(--cc-modal-margin);
margin-right: var(--cc-modal-margin)
}
#cc-main .cm--right {
margin-left: var(--cc-modal-margin);
right: var(--cc-modal-margin)
}
#cc-main .cm__body {
display: flex;
flex-direction: column;
justify-content: space-between;
position: relative
}
#cc-main .cm__btns,
#cc-main .cm__links {
width: unset
}
#cc-main .cm__btns { padding: 1.8em 3rem 2em 3rem }
#cc-main .cm__links { padding: 0.7em 3rem}
#cc-main .cm__texts {
display: flex;
flex: 1;
flex-direction: column;
justify-content: center;
padding: 2em 0px 1.2em 0px
}
#cc-main .cm__desc,
#cc-main .cm__title {
padding: 0 2.5rem
}
#cc-main .cm__title {
}
#cc-main .cm__title+.cm__desc {
margin-top: 1.1em
}
#cc-main .cm__desc {
color: var(--cc-secondary-color);
font-size: .95em;
line-height: 1.55;
max-height: 40vh;
overflow-x: visible;
overflow-y: auto;
padding-bottom: 1em
}
#cc-main .cm__btns {
border-top: 1px solid var(--cc-separator-border-color);
display: flex;
flex-direction: column;
justify-content: center
}
#cc-main .cm__btn-group {
display: grid;
grid-auto-columns: minmax(0, 1fr)
}
#cc-main .cm__btn+.cm__btn,
#cc-main .cm__btn-group+.cm__btn-group {
margin-top: .375rem
}
#cc-main .cm--flip .cm__btn+.cm__btn,
#cc-main .cm--flip .cm__btn-group+.cm__btn-group {
margin-bottom: .375rem;
margin-top: 0
}
#cc-main .cm--inline .cm__btn+.cm__btn {
margin-left: .375rem;
margin-top: 0
}
#cc-main .cm--inline.cm--flip .cm__btn+.cm__btn {
margin-bottom: 0;
margin-left: 0;
margin-right: .375rem
}
#cc-main .cm--inline.cm--flip .cm__btn-group+.cm__btn-group {
margin-bottom: .375rem;
margin-right: 0
}
#cc-main .cm--wide .cm__btn+.cm__btn,
#cc-main .cm--wide .cm__btn-group+.cm__btn-group {
margin-left: .375rem;
margin-top: 0
}
#cc-main .cm--wide.cm--flip .cm__btn+.cm__btn,
#cc-main .cm--wide.cm--flip .cm__btn-group+.cm__btn-group {
margin-bottom: 0;
margin-right: .375rem
}
#cc-main .cm--bar:not(.cm--inline) .cm__btn-group--uneven,
#cc-main .cm--wide .cm__btn-group--uneven {
display: flex;
flex: 1;
justify-content: space-between
}
#cc-main .cm--bar:not(.cm--inline).cm--flip .cm__btn-group--uneven,
#cc-main .cm--wide.cm--flip .cm__btn-group--uneven {
flex-direction: row-reverse
}
#cc-main .cm__btn {
background: var(--cc-btn-primary-bg);
border: 1px solid var(--cc-btn-primary-border-color);
border-radius: var(--cc-btn-border-radius);
color: var(--cc-btn-primary-color);
min-height: 42px;
text-align: center
}
#cc-main .cm__btn:hover {
background: var(--cc-btn-primary-hover-bg);
border-color: var(--cc-btn-primary-hover-border-color);
color: var(--cc-btn-primary-hover-color)
}
#cc-main .cm__btn--close {
border-radius: 0;
border-bottom-left-radius: var(--cc-btn-border-radius);
border-right: none;
border-top: none;
display: none;
font-size: 1em;
height: 42px;
min-width: auto !important;
overflow: hidden;
padding: 0 !important;
position: absolute;
right: 0;
top: 0;
width: 42px
}
#cc-main .cm__btn--close svg {
stroke: var(--cc-btn-primary-color);
transform: scale(.5);
transition: stroke .15s ease
}
#cc-main .cm__btn--close:hover svg {
stroke: var(--cc-btn-primary-hover-color)
}
#cc-main .cm__btn--close.cm__btn--secondary svg {
stroke: var(--cc-btn-secondary-color)
}
#cc-main .cm__btn--close.cm__btn--secondary:hover svg {
stroke: var(--cc-btn-secondary-hover-color)
}
#cc-main .cm__btn--close+.cm__texts .cm__title {
padding-right: 3rem
}
#cc-main .cm--inline .cm__btn-group {
grid-auto-flow: column
}
#cc-main .cm__footer {
background: var(--cc-footer-bg);
border-top: 1px solid var(--cc-footer-border-color);
color: var(--cc-footer-color);
padding: .4em 0 .5em
}
#cc-main .cm__links {
display: flex;
flex-direction: row;
padding-bottom: 0;
padding-top: 0
}
#cc-main .cm__link-group {
display: flex;
flex-direction: row;
font-size: .8em;
width: 100%;
align-items: baseline; gap: 0.5em;
}
#cc-main .cm__link-group>*+* {
margin-left: 1.3rem
}
#cc-main .cm--flip .cm__btn:last-child {
grid-row: 1
}
#cc-main .cm--inline.cm--flip .cm__btn:last-child {
grid-column: 1
}
#cc-main .cm--box .cm__btn--close {
display: block
}
#cc-main .cm--box.cm--flip .cm__btns {
flex-direction: column-reverse
}
#cc-main .cm--box.cm--wide {
max-width: 43em
}
#cc-main .cm--box.cm--wide .cm__btns {
flex-direction: row;
justify-content: space-between
}
#cc-main .cm--box.cm--wide .cm__btn-group {
grid-auto-flow: column
}
#cc-main .cm--box.cm--wide .cm__btn {
min-width: 120px;
}
#cc-main .cm--box.cm--wide.cm--flip .cm__btns {
flex-direction: row-reverse
}
#cc-main .cm--box.cm--wide.cm--flip .cm__btn:last-child {
grid-column: 1
}
#cc-main .cm--cloud {
max-width: 54em;
width: unset
}
#cc-main .cm--cloud .cm__body {
flex-direction: row
}
#cc-main .cm--cloud .cm__texts {
flex: 1
}
#cc-main .cm--cloud .cm__desc {
max-height: 9.4em
}
#cc-main .cm--cloud .cm__btns {
border-left: 1px solid var(--cc-separator-border-color);
border-top: none;
max-width: 23em
}
#cc-main .cm--cloud .cm__btn-group {
flex-direction: column
}
#cc-main .cm--cloud .cm__btn {
min-width: 19em
}
#cc-main .cm--cloud.cm--flip .cm__btn-group,
#cc-main .cm--cloud.cm--flip .cm__btns {
flex-direction: column-reverse
}
#cc-main .cm--cloud.cm--inline .cm__btn-group {
flex-direction: row
}
#cc-main .cm--cloud.cm--inline .cm__btn {
min-width: 10em
}
#cc-main .cm--cloud.cm--inline.cm--flip .cm__btn-group {
flex-direction: row-reverse
}
#cc-main .cm--bar {
border-radius: 0;
left: 0;
margin: 0;
max-width: unset;
opacity: 1;
right: 0;
transform: translateY(0);
width: 100vw;
--cc-modal-transition-duration: .35s
}
#cc-main .cm--bar.cm--top {
top: 0;
transform: translateY(-100%)
}
#cc-main .cm--bar.cm--bottom {
bottom: 0;
transform: translateY(100%)
}
#cc-main .cm--bar .cm__body,
#cc-main .cm--bar .cm__links {
margin: 0 auto;
max-width: 55em;
width: 100%
}
#cc-main .cm--bar .cm__body {
padding: .5em 0 .9em
}
#cc-main .cm--bar .cm__btns {
border-top: none;
flex-direction: row;
justify-content: space-between
}
#cc-main .cm--bar .cm__btn-group {
grid-auto-flow: column
}
#cc-main .cm--bar:not(.cm--inline) .cm__btn+.cm__btn,
#cc-main .cm--bar:not(.cm--inline) .cm__btn-group+.cm__btn-group {
margin-left: .375rem;
margin-top: 0
}
#cc-main .cm--bar .cm__btn {
min-width: 120px;
padding-left: 2em;
padding-right: 2em
}
#cc-main .cm--bar.cm--flip:not(.cm--inline) .cm__btn+.cm__btn,
#cc-main .cm--bar.cm--flip:not(.cm--inline) .cm__btn-group+.cm__btn-group {
margin-bottom: 0;
margin-left: 0;
margin-right: .375rem
}
#cc-main .cm--bar.cm--flip .cm__btns {
flex-direction: row-reverse
}
#cc-main .cm--bar.cm--flip .cm__btn:last-child {
grid-column: 1
}
#cc-main .cm--bar.cm--inline .cm__body,
#cc-main .cm--bar.cm--inline .cm__links {
max-width: 74em
}
#cc-main .cm--bar.cm--inline .cm__body {
flex-direction: row;
padding: 0
}
#cc-main .cm--bar.cm--inline .cm__btns {
flex-direction: column;
justify-content: center;
max-width: 23em
}
#cc-main .cm--bar.cm--inline.cm--flip .cm__btns {
flex-direction: column-reverse
}
#cc-main .cc--anim .cm,
#cc-main .cc--anim.cm-wrapper:before {
transition: opacity var(--cc-modal-transition-duration) ease, visibility var(--cc-modal-transition-duration) ease, transform var(--cc-modal-transition-duration) ease
}
#cc-main .cc--anim .cm__btn,
#cc-main .cc--anim .cm__close {
transition: background-color .15s ease, border-color .15s ease, color .15s ease
}
.disable--interaction #cc-main .cm-wrapper:before {
background: var(--cc-overlay-bg);
bottom: 0;
content: "";
left: 0;
opacity: 0;
position: fixed;
right: 0;
top: 0;
visibility: hidden;
z-index: 0
}
.show--consent #cc-main .cc--anim .cm {
opacity: 1;
transform: translateY(0);
visibility: visible !important
}
.show--consent #cc-main .cc--anim .cm--middle {
transform: translateY(-50%)
}
.show--consent #cc-main .cc--anim .cm--bar {
transform: translateY(0)
}
.show--consent #cc-main .cc--anim.cm-wrapper:before {
opacity: 1;
visibility: visible
}
#cc-main.cc--rtl .cm__btn--close {
border-bottom-left-radius: unset;
border-bottom-right-radius: var(--cc-btn-border-radius);
left: 0;
right: unset
}
#cc-main.cc--rtl .cm__btn--close+.cm__texts .cm__title {
padding-left: 3rem !important;
padding-right: 1.3rem
}
#cc-main.cc--rtl .cm--inline .cm__btn+.cm__btn {
margin-left: 0;
margin-right: .375rem
}
#cc-main.cc--rtl .cm--inline.cm--flip .cm__btn+.cm__btn {
margin-left: .375rem;
margin-right: 0
}
#cc-main.cc--rtl .cm:not(.cm--inline).cm--bar .cm__btn+.cm__btn,
#cc-main.cc--rtl .cm:not(.cm--inline).cm--bar .cm__btn-group+.cm__btn-group,
#cc-main.cc--rtl .cm:not(.cm--inline).cm--wide .cm__btn+.cm__btn,
#cc-main.cc--rtl .cm:not(.cm--inline).cm--wide .cm__btn-group+.cm__btn-group {
margin-left: 0;
margin-right: .375rem
}
#cc-main.cc--rtl .cm:not(.cm--inline).cm--bar.cm--flip .cm__btn+.cm__btn,
#cc-main.cc--rtl .cm:not(.cm--inline).cm--wide.cm--flip .cm__btn+.cm__btn {
margin-left: .375rem;
margin-right: 0
}
#cc-main.cc--rtl .cm__link-group>*+* {
margin-left: 0;
margin-right: 1.3rem
}
@media screen and (max-width:640px) {
#cc-main {
--cc-modal-margin: .5em
}
#cc-main .cm {
max-width: none !important;
width: auto !important
}
#cc-main .cm__body {
flex-direction: column !important;
padding: 0 !important
}
#cc-main .cm__btns,
#cc-main .cm__desc,
#cc-main .cm__links,
#cc-main .cm__title {
padding-left: 2rem !important;
padding-right: 2rem !important
}
#cc-main .cm__btns {
border-left: none !important;
border-top: 1px solid var(--cc-separator-border-color) !important;
flex-direction: column !important;
max-width: none !important;
min-width: auto !important
}
#cc-main .cm__btn+.cm__btn,
#cc-main .cm__btn-group+.cm__btn-group {
margin: .375rem 0 0 !important
}
#cc-main .cm--flip .cm__btn+.cm__btn,
#cc-main .cm--flip .cm__btn-group+.cm__btn-group {
margin-bottom: .375rem !important;
margin-top: 0 !important
}
#cc-main .cm__btn-group {
display: flex !important;
flex-direction: column !important;
min-width: auto !important
}
#cc-main .cm__btn {
flex: auto !important
}
#cc-main .cm__link-group {
justify-content: center !important
}
#cc-main .cm--flip .cm__btn-group,
#cc-main .cm--flip .cm__btns {
flex-direction: column-reverse !important
}
}
#cc-main .pm-wrapper {
position: relative;
z-index: 2
}
#cc-main .pm {
background: var(--cc-bg);
border-radius: var(--cc-modal-border-radius);
box-shadow: 0 .625em 1.875em rgba(0, 0, 2, .3);
display: flex;
flex-direction: column;
opacity: 0;
overflow: hidden;
position: fixed;
visibility: hidden;
width: 100%;
width: unset;
z-index: 1
}
#cc-main svg {
fill: none;
width: 100%
}
#cc-main .pm__body,
#cc-main .pm__footer,
#cc-main .pm__header {
padding: 1em 2.5rem
}
#cc-main .pm__footer { padding-top: 1.8em; padding-bottom: 1.8em}
#cc-main .pm__header {padding-bottom: 0.5em}
#cc-main .pm__header {
align-items: center;
border-bottom: 1px solid var(--cc-separator-border-color);
display: flex;
justify-content: space-between
}
#cc-main .pm__title {
align-items: center;
display: flex;
flex: 1;
margin-right: 2em
}
#cc-main .cm__title, #cc-main .pm__title {font-size: 1.87em; line-height: 1.3em; }
#cc-main .pm__close-btn {
background: transparent;
border: none;
border-radius: var(--cc-btn-border-radius);
height: 40px;
position: relative;
transition: all .15s ease;
width: 40px
}
#cc-main .pm__close-btn span {
display: flex;
height: 100%;
width: 100%
}
#cc-main .pm__close-btn svg {
stroke: var(--cc-btn-secondary-color);
transform: scale(.7);
transition: stroke .15s ease
}
#cc-main .pm__close-btn:hover {
background: transparent;
border-color: none;
}
#cc-main .pm__close-btn:hover svg {
stroke: var(--cc-btn-secondary-hover-color)
}
#cc-main .pm__body {
flex: 1;
overflow-y: auto;
overflow-y: overlay
}
#cc-main .pm__section,
#cc-main .pm__section--toggle {
border-radius: var(--cc-btn-border-radius);
display: flex;
flex-direction: column;
margin-bottom: .5em
}
#cc-main .pm__section--toggle .pm__section-desc-wrapper {
border: 1px solid var(--cc-cookie-category-block-border);
border-radius: var(--cc-btn-border-radius);
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
display: none;
margin-top: 0 !important;
overflow: hidden
}
#cc-main .pm__section {
border: 1px solid var(--cc-separator-border-color);
padding: 1em;
transition: background-color .25s ease, border-color .25s ease
}
#cc-main .pm__section:first-child {
border: none;
margin-bottom: 2em;
margin-top: 0;
padding: 0;
transition: none
}
#cc-main .pm__section:not(:first-child):hover {
background: var(--cc-cookie-category-block-bg);
border-color: var(--cc-cookie-category-block-border)
}
#cc-main .pm__section-toggles+.pm__section {
margin-top: 2em
}
#cc-main .pm__section+.pm__section {
margin-top: 1em
}
#cc-main .pm__section--toggle {
background: var(--cc-cookie-category-block-bg);
border-top: none;
margin-bottom: .375rem
}
#cc-main .pm__section--toggle .pm__section-title {
align-items: center;
background: var(--cc-cookie-category-block-bg);
border: 1px solid var(--cc-cookie-category-block-border);
display: flex;
justify-content: space-between;
min-height: 58px;
padding: 1.1em 5.4em 1.1em 1.2em;
position: relative;
transition: background-color .25s ease, border-color .25s ease;
width: 100%
}
#cc-main .pm__section--toggle .pm__section-title:hover {
background: var(--cc-cookie-category-block-hover-bg);
border-color: var(--cc-cookie-category-block-hover-border)
}
#cc-main .pm__section--toggle .pm__section-desc {
margin-top: 0;
padding: 1em
}
#cc-main .pm__section--toggle.is-expanded {
--cc-cookie-category-block-bg: var(--cc-cookie-category-expanded-block-bg);
--cc-cookie-category-block-border: var(--cc-cookie-category-expanded-block-hover-bg)
}
#cc-main .pm__section--toggle.is-expanded .pm__section-title {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0
}
#cc-main .pm__section--toggle.is-expanded .pm__section-arrow svg {
transform: scale(.5) rotate(180deg)
}
#cc-main .pm__section--toggle.is-expanded .pm__section-desc-wrapper {
display: flex
}
#cc-main .pm__section--expandable .pm__section-title {
cursor: pointer;
padding-left: 3.4em
}
#cc-main .pm__section--expandable .pm__section-arrow {
background: var(--cc-toggle-readonly-bg);
border-radius: 100%;
display: flex;
height: 20px;
justify-content: center;
left: 18px;
pointer-events: none;
position: absolute;
width: 20px
}
#cc-main .pm__section--expandable .pm__section-arrow svg {
stroke: var(--cc-btn-secondary-color);
transform: scale(.5)
}
#cc-main .pm__section-title-wrapper {
align-items: center;
display: flex;
position: relative
}
#cc-main .pm__section-title-wrapper+.pm__section-desc-wrapper {
margin-top: .85em
}
#cc-main .pm__section-title {
border-radius: var(--cc-btn-border-radius);
font-size: .95em;
font-weight: 500
}
#cc-main .pm__badge {
align-items: center;
background: var(--cc-btn-secondary-bg);
border-radius: 5em;
color: var(--cc-secondary-color);
display: flex;
flex: none;
font-size: .8em;
font-weight: 500;
height: 23px;
justify-content: center;
margin-left: 1em;
min-width: 23px;
overflow: hidden;
padding: 0 .6em 1px;
position: relative;
text-align: center;
white-space: nowrap;
width: auto
}
#cc-main .pm__service-counter {
background: var(--cc-btn-primary-bg);
color: var(--cc-btn-primary-color);
padding: 0;
width: 23px
}
#cc-main .pm__service-counter[data-counterlabel] {
padding: 0 .6em 1px;
width: auto
}
#cc-main .section__toggle,
#cc-main .section__toggle-wrapper,
#cc-main .toggle__icon,
#cc-main .toggle__label {
border-radius: var(--cc-pm-toggle-border-radius);
height: 23px;
transform: translateZ(0);
width: 50px
}
#cc-main .section__toggle-wrapper {
cursor: pointer;
position: absolute;
right: 18px;
z-index: 1
}
#cc-main .toggle-service {
height: 19px;
position: relative;
right: 0;
width: 42px
}
#cc-main .toggle-service .section__toggle,
#cc-main .toggle-service .toggle__icon,
#cc-main .toggle-service .toggle__label {
height: 19px;
width: 42px
}
#cc-main .toggle-service .toggle__icon {
position: relative
}
#cc-main .toggle-service .toggle__icon-circle {
height: 19px;
width: 19px
}
#cc-main .toggle-service .section__toggle:checked~.toggle__icon .toggle__icon-circle {
transform: translateX(23px)
}
#cc-main .pm__section--toggle:nth-child(2) .section__toggle-wrapper:after {
display: none !important
}
#cc-main .section__toggle {
border: 0;
cursor: pointer;
display: block;
left: 0;
margin: 0;
position: absolute;
top: 0
}
#cc-main .section__toggle:disabled {
cursor: not-allowed
}
#cc-main .toggle__icon {
background: var(--cc-toggle-off-bg);
box-shadow: 0 0 0 1px var(--cc-toggle-off-bg);
display: flex;
flex-direction: row;
pointer-events: none;
position: absolute;
transition: all .25s ease
}
#cc-main .toggle__icon-circle {
background: var(--cc-toggle-off-knob-bg);
border: none;
border-radius: var(--cc-pm-toggle-border-radius);
box-shadow: 0 1px 2px rgba(24, 32, 3, .36);
display: block;
height: 23px;
left: 0;
position: absolute;
top: 0;
transition: transform .25s ease, background-color .25s ease;
width: 23px
}
#cc-main .toggle__icon-off,
#cc-main .toggle__icon-on {
height: 100%;
position: absolute;
transition: opacity .15s ease;
width: 100%
}
#cc-main .toggle__icon-on {
opacity: 0;
transform: rotate(45deg)
}
#cc-main .toggle__icon-on svg {
stroke: var(--cc-toggle-on-bg);
transform: scale(.55) rotate(-45deg)
}
#cc-main .toggle__icon-off {
opacity: 1
}
#cc-main .toggle__icon-off svg {
stroke: var(--cc-toggle-off-bg);
transform: scale(.55)
}
#cc-main .section__toggle:checked~.toggle__icon {
background: var(--cc-toggle-on-bg);
box-shadow: 0 0 0 1px var(--cc-toggle-on-bg)
}
#cc-main .section__toggle:checked~.toggle__icon .toggle__icon-circle {
background-color: var(--cc-toggle-on-knob-bg);
transform: translateX(27px)
}
#cc-main .section__toggle:checked~.toggle__icon .toggle__icon-on {
opacity: 1
}
#cc-main .section__toggle:checked~.toggle__icon .toggle__icon-off {
opacity: 0
}
#cc-main .section__toggle:checked:disabled~.toggle__icon {
background: var(--cc-toggle-readonly-bg);
box-shadow: 0 0 0 1px var(--cc-toggle-readonly-bg)
}
#cc-main .section__toggle:checked:disabled~.toggle__icon .toggle__icon-circle {
background: var(--cc-toggle-readonly-knob-bg);
box-shadow: none
}
#cc-main .section__toggle:checked:disabled~.toggle__icon svg {
stroke: var(--cc-toggle-readonly-knob-icon-color)
}
#cc-main .toggle__label {
opacity: 0;
overflow: hidden;
pointer-events: none;
position: absolute;
top: 0;
z-index: -1
}
#cc-main .pm__section-desc-wrapper {
color: var(--cc-secondary-color);
display: flex;
flex-direction: column;
font-size: .9em
}
#cc-main .pm__section-desc-wrapper>:not(:last-child) {
border-bottom: 1px solid var(--cc-cookie-category-block-border)
}
#cc-main .pm__section-services {
display: flex;
flex-direction: column
}
#cc-main .pm__service {
align-items: center;
display: flex;
justify-content: space-between;
padding: .4em 1.2em;
position: relative;
transition: background-color .15s ease
}
#cc-main .pm__service:hover {
background-color: var(--cc-cookie-category-block-hover-bg)
}
#cc-main .pm__service-header {
align-items: center;
display: flex;
margin-right: 1em;
width: 100%
}
#cc-main .pm__service-icon {
border: 2px solid;
border-radius: 100%;
height: 8px;
margin-left: 6px;
margin-right: 20px;
margin-top: 1px;
min-width: 8px
}
#cc-main .pm__service-title {
font-size: .95em;
width: 100%;
word-break: break-word
}
#cc-main .pm__section-desc {
line-height: 1.5em
}
#cc-main .pm__section-table {
border-collapse: collapse;
font-size: .9em;
margin: 0;
overflow: hidden;
padding: 0;
text-align: left;
width: 100%
}
#cc-main .pm__table-caption {
text-align: left
}
#cc-main .pm__table-caption,
#cc-main .pm__table-head>tr {
border-bottom: 1px dashed var(--cc-separator-border-color);
color: var(--cc-primary-color);
font-weight: 500
}
#cc-main .pm__table-tr {
transition: background-color .15s ease
}
#cc-main .pm__table-tr:hover {
background: var(--cc-cookie-category-block-hover-bg)
}
#cc-main .pm__table-caption,
#cc-main .pm__table-td,
#cc-main .pm__table-th {
padding: .625em .625em .625em 1.2em;
vertical-align: top
}
#cc-main .pm__footer {
border-top: 1px solid var(--cc-separator-border-color);
display: flex;
justify-content: space-between
}
#cc-main .pm__btn-group {
display: flex
}
#cc-main .pm__btn+.pm__btn,
#cc-main .pm__btn-group+.pm__btn-group {
margin-left: .375rem
}
#cc-main .pm--flip .pm__btn+.pm__btn,
#cc-main .pm--flip .pm__btn-group+.pm__btn-group {
margin-left: 0;
margin-right: .375rem
}
#cc-main .pm__btn {
background: var(--cc-btn-primary-bg);
border: 1px solid var(--cc-btn-primary-border-color);
border-radius: var(--cc-btn-border-radius);
color: var(--cc-btn-primary-color);
flex: auto;
min-height: 42px;
min-width: 110px;
text-align: center;
transition: background-color .15s ease, border-color .15s ease, color .15s ease
}
#cc-main .pm__btn:hover {
background: var(--cc-btn-primary-hover-bg);
border-color: var(--cc-btn-primary-hover-border-color);
color: var(--cc-btn-primary-hover-color)
}
#cc-main .pm__btn--secondary {
background: var(--cc-btn-secondary-bg);
border-color: var(--cc-btn-secondary-border-color);
color: var(--cc-btn-secondary-color)
}
#cc-main .pm__btn--secondary:hover {
background: var(--cc-btn-secondary-hover-bg);
border-color: var(--cc-btn-secondary-hover-border-color);
color: var(--cc-btn-secondary-hover-color)
}
#cc-main .cm__btn , #cc-main .pm__btn {font-size: 0.68em}
#cc-main .cm__btn , #cc-main .pm__btn { font-family: PFHandbookProMedium; line-height: normal; text-transform: none;
font-size: 1.2em;
font-weight: normal;
padding: 0.8em 1.4em; }
#cc-main .cm__btn:not(.cm__btn--secondary) , #cc-main .pm__btn:not(.pm__btn--secondary) {
border: none;
}
#cc-main .cm__btn { font-weight: normal;}
#cc-main .cm__btn--secondary, #cc-main .pm__btn--secondary {
background: transparent;
border-color: #000;
color: #000;
border: 2px solid #000;
padding-top: calc(0.8em - 2px);
padding-bottom: calc(0.8em - 2px);
}
#cc-main .cm__btn--secondary:hover, #cc-main .pm__btn--secondary:hover {
background: transparent;
border-color: #555;
color: #555;
}
#cc-main .pm--box {
height: calc(100% - 2em);
left: var(--cc-modal-margin);
margin: 0 auto;
max-height: 37.5em;
max-width: 43em;
right: var(--cc-modal-margin);
top: 50%;
transform: translateY(calc(-50% + 1.6em))
}
#cc-main .pm--box.pm--flip .pm__btn-group,
#cc-main .pm--box.pm--flip .pm__footer {
flex-direction: row-reverse
}
#cc-main .pm--bar {
border-radius: 0;
bottom: 0;
height: 100%;
margin: 0;
max-height: none;
max-width: 29em;
opacity: 1;
top: 0;
width: 100%;
--cc-modal-transition-duration: .35s
}
#cc-main .pm--bar .pm__section-table,
#cc-main .pm--bar .pm__table-body,
#cc-main .pm--bar .pm__table-td,
#cc-main .pm--bar .pm__table-th,
#cc-main .pm--bar .pm__table-tr {
display: block
}
#cc-main .pm--bar .pm__table-head {
display: none
}
#cc-main .pm--bar .pm__table-caption {
display: block
}
#cc-main .pm--bar .pm__table-tr:not(:last-child) {
border-bottom: 1px solid var(--cc-separator-border-color)
}
#cc-main .pm--bar .pm__table-td {
display: flex;
justify-content: space-between
}
#cc-main .pm--bar .pm__table-td:before {
color: var(--cc-primary-color);
content: attr(data-column);
flex: 1;
font-weight: 500;
min-width: 100px;
overflow: hidden;
padding-right: 2em;
text-overflow: ellipsis
}
#cc-main .pm--bar .pm__table-td>div {
flex: 3
}
#cc-main .pm--bar:not(.pm--wide) .pm__body,
#cc-main .pm--bar:not(.pm--wide) .pm__footer,
#cc-main .pm--bar:not(.pm--wide) .pm__header {
padding: 1em 1.3em
}
#cc-main .pm--bar:not(.pm--wide) .pm__btn-group,
#cc-main .pm--bar:not(.pm--wide) .pm__footer {
flex-direction: column
}
#cc-main .pm--bar:not(.pm--wide) .pm__btn+.pm__btn,
#cc-main .pm--bar:not(.pm--wide) .pm__btn-group+.pm__btn-group {
margin: .375rem 0 0
}
#cc-main .pm--bar:not(.pm--wide).pm--flip .pm__btn-group,
#cc-main .pm--bar:not(.pm--wide).pm--flip .pm__footer {
flex-direction: column-reverse
}
#cc-main .pm--bar:not(.pm--wide).pm--flip .pm__btn+.pm__btn,
#cc-main .pm--bar:not(.pm--wide).pm--flip .pm__btn-group+.pm__btn-group {
margin-bottom: .375rem;
margin-top: 0
}
#cc-main .pm--bar:not(.pm--wide) .pm__badge {
display: none
}
#cc-main .pm--bar.pm--left {
left: 0;
transform: translateX(-100%)
}
#cc-main .pm--bar.pm--right {
right: 0;
transform: translateX(100%)
}
#cc-main .pm--bar.pm--wide {
max-width: 35em
}
#cc-main .pm--bar.pm--wide .pm__body,
#cc-main .pm--bar.pm--wide .pm__footer,
#cc-main .pm--bar.pm--wide .pm__header {
padding: 1em 1.4em
}
#cc-main .pm--bar.pm--wide.pm--flip .pm__btn-group,
#cc-main .pm--bar.pm--wide.pm--flip .pm__footer {
flex-direction: row-reverse
}
#cc-main .pm-overlay {
background: var(--cc-overlay-bg);
bottom: 0;
content: "";
left: 0;
opacity: 0;
position: fixed;
right: 0;
top: 0;
visibility: hidden;
z-index: 1
}
#cc-main .cc--anim .pm,
#cc-main .cc--anim .pm-overlay {
transition: opacity var(--cc-modal-transition-duration) ease, visibility var(--cc-modal-transition-duration) ease, transform var(--cc-modal-transition-duration) ease
}
.show--preferences #cc-main .cc--anim .pm {
opacity: 1;
visibility: visible !important
}
.show--preferences #cc-main .cc--anim .pm--box {
transform: translateY(-50%)
}
.show--preferences #cc-main .cc--anim .pm--bar {
transform: translateX(0)
}
.show--preferences #cc-main .cc--anim .pm-overlay {
opacity: 1;
visibility: visible
}
#cc-main.cc--rtl .pm__service-header {
margin-left: 1em;
margin-right: 0
}
#cc-main.cc--rtl .pm__section-arrow {
left: unset;
right: 18px
}
#cc-main.cc--rtl .section__toggle-wrapper {
left: 18px;
right: unset;
transform-origin: left
}
#cc-main.cc--rtl .toggle-service {
left: 0
}
#cc-main.cc--rtl .pm__service-icon {
margin-left: 20px;
margin-right: 5px
}
#cc-main.cc--rtl .pm__section--toggle .pm__section-title {
padding-left: 5.4em;
padding-right: 1.2em
}
#cc-main.cc--rtl .pm__section--expandable .pm__section-title {
padding-right: 3.4em
}
#cc-main.cc--rtl .pm__badge {
margin-left: unset;
margin-right: 1em
}
#cc-main.cc--rtl .toggle__icon-circle {
transform: translateX(27px)
}
#cc-main.cc--rtl .toggle-service .toggle__icon-circle {
transform: translateX(23px)
}
#cc-main.cc--rtl .section__toggle:checked~.toggle__icon .toggle__icon-circle {
transform: translateX(0)
}
#cc-main.cc--rtl .pm__table-td,
#cc-main.cc--rtl .pm__table-th {
padding-left: unset;
padding-right: 1.2em;
text-align: right
}
#cc-main.cc--rtl .pm__table-td {
padding-left: unset;
padding-right: 1.2em
}
#cc-main.cc--rtl .pm__table-td:before {
padding-left: 2em;
padding-right: unset
}
#cc-main.cc--rtl .pm__btn+.pm__btn,
#cc-main.cc--rtl .pm__btn-group+.pm__btn-group {
margin-left: 0;
margin-right: .375rem
}
#cc-main.cc--rtl .pm--flip .pm__btn+.pm__btn,
#cc-main.cc--rtl .pm--flip .pm__btn-group+.pm__btn-group {
margin-left: .375rem;
margin-right: 0
}
#cc-main.cc--rtl .pm--flip.pm--bar:not(.pm--wide) .pm__btn+.pm__btn,
#cc-main.cc--rtl .pm--flip.pm--bar:not(.pm--wide) .pm__btn-group+.pm__btn-group {
margin-left: 0
}
@media screen and (max-width: 640px) {
#cc-main .pm {
border-radius: 0;
bottom: 0;
height: auto;
left: 0;
max-height: 100%;
max-width: none !important;
right: 0;
top: 0;
transform: translateY(1.6em)
}
#cc-main .pm__body,
#cc-main .pm__footer,
#cc-main .pm__header {
padding: .9em !important
}
#cc-main .pm__badge {
display: none
}
#cc-main .pm__section-table,
#cc-main .pm__table-body,
#cc-main .pm__table-caption,
#cc-main .pm__table-td,
#cc-main .pm__table-th,
#cc-main .pm__table-tr {
display: block
}
#cc-main .pm__table-head {
display: none
}
#cc-main .pm__table-tr:not(:last-child) {
border-bottom: 1px solid var(--cc-separator-border-color)
}
#cc-main .pm__table-td {
display: flex;
justify-content: space-between
}
#cc-main .pm__table-td:before {
color: var(--cc-primary-color);
content: attr(data-column);
flex: 1;
font-weight: 500;
min-width: 100px;
overflow: hidden;
padding-right: 2em;
text-overflow: ellipsis
}
#cc-main .pm__table-td>div {
flex: 3
}
#cc-main .pm__btn-group,
#cc-main .pm__footer {
flex-direction: column !important
}
#cc-main .pm__btn-group {
display: flex !important
}
#cc-main .pm__btn+.pm__btn,
#cc-main .pm__btn-group+.pm__btn-group {
margin: .375rem 0 0 !important
}
#cc-main .pm--flip .pm__btn+.pm__btn,
#cc-main .pm--flip .pm__btn-group+.pm__btn-group {
margin-bottom: .375rem !important;
margin-top: 0 !important
}
#cc-main .pm--flip .pm__btn-group,
#cc-main .pm--flip .pm__footer {
flex-direction: column-reverse !important
}
.show--preferences #cc-main .cc--anim .pm {
transform: translateY(0) !important
}
}
@media screen and (max-width:480px) {
#cc-main .cm__desc {font-size: 0.85em}
#cc-main .cm__btns,
#cc-main .cm__desc,
#cc-main .cm__links,
#cc-main .cm__title {
padding-left: 1.5rem !important;
padding-right: 1.5rem !important
}
#cc-main .cm__title, #cc-main .pm__title {font-size: 1.6em; line-height: normal; }
}