:root {
 --color-main: #000;
 --color-grey: #888;
 --color-dark-grey: #313131;
 --color-light-grey: #efefef;
 --color-text: #111;
 --color-light-text: #7e7c7d;
 --color-green: #267c01;
 --color-red: #ca0000;
 --color-black: #111;
 --color-white: #fff;
 --color-yellow: #ffcc33;
 --color-facebook: #3a559f;
 --color-youtube: #ea412c;
 --color-twitter: #50abf1;
 --color-linkedin: #0077b5;
 --color-instagram: #555;
 --gradient: linear-gradient(180deg, rgba(31,75,148,1) 0%, rgba(0,111,53,1) 100%);
 --gradient-left: linear-gradient(90deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0) 100%);
 --gradient-right: linear-gradient(270deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0) 100%);
 --gradient-top: linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0) 100%);
 --gradient-bottom: linear-gradient(0deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0) 100%);
 --gradient-light: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 100%);
 --gradient-light-left: linear-gradient(90deg, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0) 100%);
 --gradient-light-right: linear-gradient(270deg, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0) 100%);
 --border-radius: 1px;
 --border-radius-button: 1px;
 --box-shadow: 0 0 10px rgba(160,160,160,0.2);
 --box-shadow-hover: 0 0 10px rgba(160,160,160,0.6); 
 --text-shadow: 0 0 20px rgba(255,255,255,1), 0 0 15px rgba(255,255,255,0.8), 1px 1px 0px rgba(255,255,255,0.9);
 --text-dark-shadow: 0 0 20px rgba(0,0,0,1), 0 0 15px rgba(0,0,0,0.8), 1px 1px 0px rgba(0,0,0,0.9);
 --vcenter: translate(0,-50%);
 --hcenter: translate(-50%,0);
 --center: translate(-50%,-50%);
}


/*! HTML5 Boilerplate v7.2.0 | MIT License | https://html5boilerplate.com/ */
/* main.css 2.0.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
}
body {
  margin:0;
  padding: 0;
  max-width: 100%;
}
/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */
::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}
::selection {
    background: #b3d4fc;
    text-shadow: none;
}
/*
 * A better looking default horizontal rule
 */
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}
/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */
audio, canvas, iframe, img, svg, video {
    vertical-align: middle;
}
/*
 * Remove default fieldset styles.
 */
fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}
/*
 * Allow only vertical resizing of textareas.
 */
textarea {
    resize: vertical;
}
i {
     font-family: "Font Awesome 5 Free";

}
/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */
.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}
/* ==========================================================================
   WCAG search / SR-ONLY
   ========================================================================== */
.wcag-nav a {
	display:inline;
  padding:5px 10px;
  text-align:center;
  text-decoration:none;
  width:150px;
  position:absolute;
  left:-9000em;
  z-index:100;
  color:#fff !important;
}
.wcag-nav a:hover, .wcag-nav a:focus, .wcag-nav a:active {
  background: #b71b1c;
  border: 2px solid #000;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
}
.sr-only {
	border: 0 !important;
	clip: rect(1px, 1px, 1px, 1px) !important; /* 1 */
	-webkit-clip-path: inset(50%) !important;
		clip-path: inset(50%) !important;  /* 2 */
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important;
	white-space: nowrap !important;            /* 3 */
}

/*
	Use in conjunction with .sr-only to only display content when it's focused.
	@note Useful for skip links 
	@see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
	@note Based on a HTML5 Boilerplate technique, included in Bootstrap
	@note Fixed a bug with position: static on iOS 10.0.2 + VoiceOver
		@author Sylvain Pigeard
		@see https://github.com/twbs/bootstrap/issues/20732
*/
.sr-only-focusable:focus,
.sr-only-focusable:active {
	clip: auto !important;
	-webkit-clip-path: none !important;
		clip-path: none !important;
	height: auto !important;
	margin: auto !important;
	overflow: visible !important;
	width: auto !important;
	white-space: normal !important;
}
/* ==========================================================================
   TYPOGRAFIA
   ========================================================================== */
body, html {
    font-family: 'Muli', sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    display: inline-block;
    margin-bottom: 0;
    padding-bottom: 0;
}
.content h1, .content h2 {
  font-weight: bold !important;
  font-size: 2.5em !important;
  margin: 1em 0 0.5em 0 !important;
  padding-top:0 !important;
  display:block;
}
.content h3 {
    font-weight: bold !important;
  font-size: 1.5em !important;
  margin: 1em 0 0.5em 0 !important;
  padding-top:0 !important;
}
.important h1 {
  margin:0 !important;
  padding:0 !important;
}
.element-title h3 {
  color:#fff !important;
}

.hide {
      position: absolute !important;
    top: -100em !important;
    left: -100em !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: 0 !important;
    text-indent: -1000em !important;
}


@font-face {
    font-family: 'ipn';
    src:url('/ftp/piktogramy/ipn.eot');
    src:url('/ftp/piktogramy/ipn.eot?#iefix') format('embedded-opentype'),
    url('/ftp/piktogramy/ipn.woff') format('woff'),
    url('/ftp/piktogramy/ipn.woff2') format('woff2'),
    url('/ftp/piktogramy/ipn.ttf') format('truetype'),
    url('/ftp/piktogramy/ipn.svg?#ipn') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
    font-family: 'ipn';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.icon-arrowLeft:before {
    content: "\e100";
}
.icon-arrowRight:before {
    content: "\e101";
}
.icon-arrowTop:before {
    content: "\e102";
}
.icon-arrowBottom:before {
    content: "\e103";
}
.icon-pause:before {
    content: "\e104";
}
.icon-linki:before {
    content: "\e105";
}
.icon-pobierz:before {
    content: "\e106";
}
.icon-lupa:before {
    content: "\e107";
}
.icon-tel:before {
    content: "\e108";
}
.icon-check:before {
    content: "\e109";
}
.icon-usun:before {
    content: "\e10a";
}
.icon-menu:before {
    content: "\e10b";
}
.icon-dokument:before {
    content: "\e10c";
}
.icon-drukuj:before {
    content: "\e10d";
}
.icon-pdf:before {
    content: "\e10e";
}
.icon-mail:before {
    content: "\e10f";
}
.icon-kalendarz:before {
    content: "\e110";
}
.icon-info:before {
    content: "\e111";
}
.icon-klucz:before {
    content: "\e112";
}
.icon-twitter:before {
    content: "\e113";
}
.icon-facebook:before {
    content: "\e114";
}
.icon-youtube:before {
    content: "\e115";
}
.icon-bazy-danych:before {
    content: "\e116";
}
.icon-komunikaty:before {
    content: "\e117";
}
.icon-konferencje:before {
    content: "\e118";
}
.icon-media:before {
    content: "\e119";
}
.icon-kwadrat:before {
    content: "\e120";
}
.icon-kolo-z-dziura:before {
    content: "\e121";
}
.icon-kolo:before {
    content: "\e122";
}
.icon-nagrody-konkursy:before {
    content: "\e11a";
}
.icon-polityka-historyczna:before {
    content: "\e11b";
}
.icon-publikacje:before {
    content: "\e11c";
}
.icon-wnioski:before {
    content: "\e11d";
}

a {
  color: #1A4A99;
}
a:hover, a:focus {text-decoration: underline !important;}

a:focus {outline: 3px solid black;}
/* ==========================================================================
   GLOWNE ELEMENTY
   ========================================================================== */
.left { float:left; overflow:hidden;}
.right { float:right; overflow:hidden; }
.clear { clear:both; }

/* GRID */
.row-padding {
  width:100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

.full-element {
  width:100%;
  display: flex;
}
.half-element {
    box-sizing: border-box;
    margin-bottom: 30px;
    width: calc(1/2*100% - (1 - 1/2)*30px);
background-position: center;
background-size: cover;
display: flex;
justify-content: center;
align-items: center;
}
.half-element-wt {
      box-sizing: border-box;
    margin-bottom: 30px;
    width: calc(1/2*100% - (1 - 1/2)*30px);
background-position: center;
background-size: cover;
display: flex;
flex-direction:column;
}
.text {
  display:block;
}
.text p {
  text-align:left;
}
.third-element {
    box-sizing: border-box;
    margin-bottom: 30px;
    width: calc(1/3*100% - (1 - 1/3)*30px);
    background-position: center;
	background-size: cover;
  display: flex;
justify-content: center;
align-items: flex-end;
}
.quarter-element {
    box-sizing: border-box;
    margin-bottom: 30px;
    width: calc(1/4*100% - (1 - 1/4)*30px);
}
.eight-element {
    box-sizing: border-box;
    margin-bottom: 30px;
    width: calc(1/8*100% - (1 - 1/8)*10px);
}
.overlay {
  background-color: rgba(0,0,0,0.3);
  background-blend-mode: overlay;
  padding:20px;
  transition-timing-function: ease;
}
.element-bg {
position: relative;
    width: 100%;
    height: 30em;
    padding: 0;
    overflow: hidden;
    margin: 0;
    background-position: center top;
    background-size: cover;
  display:flex;
  justify-content: flex-end;
  align-items: flex-end;
}
.tallelement-bg {
position: relative;
    width: 100%;
    height: 25em;
    padding: 0;
    overflow: hidden;
    margin: 0;
    background-position: center top;
    background-size: contain;
  background-repeat: no-repeat;
  display:flex;
  justify-content: flex-end;
  align-items: flex-end;
}
.mediumelement-bg {
position: relative;
    width: 100%;
    height: 15em;
    padding: 0;
    overflow: hidden;
    margin: 0;
    background-position: center top;
    background-size: cover;
  display:flex;
  justify-content: flex-end;
  align-items: flex-end;
}
.smallelement-bg {
position: relative;
    width: 100%;
    height: 13em;
    padding: 20px;
    overflow: hidden;
    margin: 0;
    background-position: center top;
    background-size: cover;
  display:flex;
  justify-content: flex-end;
  align-items: flex-end;
  text-align: center;
}

.mediumelement-bg:hover, .smallelement-bg:hover {
  filter: grayscale(100%);
}
.smallelement-bg h3 {
  color:#fff !important;
}
.branch-grid {
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.branch-title {
  background-color:#b71b1c;
  padding: 20px;
    text-align: center;
  color:#fff;
}
.branch-title a h3{
  color:#fff !important;
}
.branch-title .wiecej {
  color:#fff;
}
.twelve-element {
    box-sizing: border-box;
    margin-bottom: 30px;
    width: calc(1/12*100% - (1 - 1/12)*30px);
}
.element-title {
  width: 100%;
text-align: center;
padding: 10px;
background-color:rgba(0,0,0,0.7);
}
.element-title h3 {
  magin:0;
}
.element-title h3:hover {text-decoration:underline}
.element-title:hover {
	background-color: #b71b1c;
}
.element-title a:hover {
  color:#fff;
}

.element-title h3 {
  margin:0;
  padding:0;
  font-size:1.1em !important;
}
.element-title a {
  color:#fff;
}
.hide {display: none;}

.site-title h1 {
  margin:0 0 40px 0; 
  padding:0;
  font-size: 3em;
}
.competition-title h1 {
  margin:0; 
  padding:0;
  font-size: 3em;
}
img {
    width: 100%;
  height: auto;
}

.overlay:hover, .promotion-element:hover, .smallelement-bg:hover, .element-bg:hover {
    filter: grayscale(100%);
}
@media screen and (min-width:1216px) {
 .content {
  max-width:1152px !important;
 }
}
@media screen and (min-width:1408px) {
 .content {
  max-width:1344px !important;
 }
}

#opcje-strony {
  margin:50px 0;
}
/* ==========================================================================
   NAGLOWEK
   ========================================================================== */
/* header */
header { position:relative; display:block; padding:0; margin:0; height:270px; width:auto; overflow:visible; z-index:3; transition-duration:1s;}

#header-logo { position:absolute; top:95px; left:3em; display:block; padding:0; margin:0; width:auto; height:135px; z-index:1; border:0; padding:25px 0 0 125px; text-decoration:none; background-image:url("https://edukacja.ipn.gov.pl/dokumenty/szablonyimg/210-logo.png"); background-repeat:no-repeat; background-size:105px auto; box-sizing:border-box;  }
#header-logo h1 { position:relative; display:block; font-size:1em; margin:0; padding:0; font-weight: 300;}
#header-logo a:link,#header-logo a:visited { position:relative;display:inline-block; font-size:2em; line-height:1.3em;  color:#3a3a3a !important; text-transform:uppercase; text-decoration:none; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; max-width:calc(100%); transition-duration:1s; }
#header-logo a:hover,#header-logo a:focus {color:#f1f227; text-decoration:underline; transition-duration:1s;}
#header-logo span {display:block; margin-top:0.4em;  font-size:1em; line-height:1em;}
#header-logo ul { position:relative; padding:0; margin:0; list-style-type:none; list-style-image:none; width:auto; overflow:visible; font-size:1em;}
#header-logo ul li { margin:0; margin-right:0.2em; padding:0; position:relative; display:inline-block; text-align:left;list-style:none; overflow:visible;}
#header-logo li a:link,#header-logo li a:visited { position:relative;display:inline-block; font-size:0.9em; line-height:1.5em;  color:#656769; text-transform:none; text-decoration:none; overflow:visible; font-weight: 600;}
#header-logo li a:hover,#header-logo li a:focus { color:#b71b1b;text-decoration:underline;}
#header-logo li a.active {  color:#000; font-weight:bold;}
#header-logo li a:after { content:", "}
#header-logo li:last-child a:after { content:"";}
#header-logo li.oddzial { width:99%; overflow:visible; display:none;}
#header-logo li.oddzial .forms { position:absolute; top:-3px; right:0; display:inline-block; width:100%; vertical-align:middle; margin:0;}
#header-logo li.oddzial .forms .select select { padding:0.3em 0.7em; }
#header-logo li.oddzial .forms .select:after { padding:4px 4px; }

#header-logo:before { position:absolute; top:0; left:18%; background:#b71b1b; color:#fff; font-size:1em; line-height:1em; padding:0.5em 0.5em 0.3em;}

/*fix bip */
header.bip { height:230px; }
header.bip #header-logo {background-image:url("logo-bip.png");}
header.bip #header-logo a { max-width:calc(100%); }
header.bip #menu, header.bip #menu-scroll { min-height:5px; height:auto; }

/* wcag opcje */
ul.nav { position:absolute; top:2px; left:2px; margin:0; padding:0; list-style:none outside none; }
ul.nav a {position:absolute; left:-9000em; padding:5px 10px; display:inline; font-size: 1.2em; text-align:center; text-decoration:none; width:150px; z-index:2;}
ul.nav a:hover, ul.nav a:focus, ul.nav a:active { position:absolute; top:0; left:0; background:#d20a2b; border:2px solid #ffffff; color:#ffffff; }

/* header opcje */
#header-opcje-gora {padding-bottom: 1em; position:relative; display:block; width:100%; box-sizing:border-box; border-bottom:1px solid #d6d6d6; text-align:left; overflow:visible; z-index:3; }
ul.opcje { position:relative; padding:0; margin:0; list-style-type:none; list-style-image:none; width:auto; overflow:visible;}
ul.opcje li { margin:0; margin-right:2em; padding:0; position:relative; display:inline-block; text-align:left;list-style:none; overflow:visible; }
ul.opcje li:last-child  { margin-right:0;}
ul.opcje strong { display:inline-block; padding:0; margin:0; font-weight:normal; text-align:left;}
ul.opcje li a:link,ul.opcje li a:visited { font-size:1.1em; line-height:1em; color:#616161; text-decoration:none; font-weight:normal; text-transform:uppercase; text-align:center; position:relative; padding:0; margin:0; display:inline-block; }
ul.opcje li a:hover,ul.opcje li a:active,ul.opcje li a:focus { color:#000; text-decoration:none; transition-duration:0.6s;}
ul.opcje li a:hover strong,ul.opcje li a:active strong,ul.opcje li a:focus strong { text-decoration:underline;}
ul.opcje li a[class^="icon-"], ul.opcje li a[class*=" icon-"] { padding:0 0 0 2em; position:relative; }
ul.opcje li a[class^="icon-"]:before, ul.opcje li a[class*=" icon-"]:before { position:absolute; top:50%; left:0; transform:translate(0,-50%);-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%); display:inline-block; margin:0; font-size:1.5em; line-height:1em; font-family:ipn; text-align:center; color:#b71b1b; text-decoration:none; vertical-align:bottom;}
ul.opcje li a:hover[class^="icon-"]:before, ul.opcje li a:hover[class*=" icon-"]:before { text-decoration:none; color:#000;}
ul.opcje li a span, ul.opcje li span { position:relative; display:inline-block; padding:0; margin:0 0 0 0.5em; width:auto; overflow:hidden;  }
ul.opcje li.search {float:left; width:200px; }
ul.opcje li a.en span,ul.opcje li a.pl span { width:20px; height:13px; top:0.1em; }
ul.opcje li a.pl span { background:url("https://edukacja.ipn.gov.pl/dokumenty/szablonyimg/210-sprite.png") -52px 0 no-repeat; }
ul.opcje li a.en span { background:url("https://edukacja.ipn.gov.pl/dokumenty/szablonyimg/210-sprite.png") -23px 0 no-repeat; }
ul.opcje li a.bip span { background:url("https://edukacja.ipn.gov.pl/dokumenty/szablonyimg/210-sprite.png") 0 0 no-repeat; width:15px; height:17px; top:0.2em; }
ul.opcje li.text-size { min-width:70px; white-space:nowrap; }
ul.opcje li.text-size strong{ font-size:1.1em}
ul.opcje li.oddzial { width:270px; overflow:visible;}
ul.opcje li.oddzial .forms { position:absolute; top:-10px; right:0; display:inline-block; width:200px; vertical-align:middle; margin:0;}
ul.opcje li.oddzial .forms .select select { padding:0.3em 0.7em 0.3em 1.2em; }
ul.opcje li.oddzial .forms .select:after { padding:4px 4px; }
ul.opcje li a.icon-facebook:before { color:rgb(55, 101, 163); font-size:xx-large; }
ul.opcje li a.icon-youtube:before { color:rgb(228, 40, 54); font-size:xx-large;}
ul.opcje li a.icon-twitter:before { color:rgb(22, 219, 242); font-size:xx-large;}
ul.opcje li a.icon-twitter.w:before { color:rgb(22, 177, 242); }
ul.opcje li a.icon-flickr:before { color:#0062dd; font-size:xx-large;}

#header-opcje-dol { position:absolute; right:4em; bottom:105px; display:block; padding:0; width:490px; height:45px; text-align:right; z-index:3; }
#header-opcje-dol ul { position:absolute; top:0; right:0; padding:0; margin:0; list-style-type:none; list-style-image:none; width:max-content;}
#header-opcje-dol ul li { margin-right:0; vertical-align:middle; line-height:38px; }
#header-opcje-dol ul li:last-child  { margin:0;}

/* font opcje */
#text-size { position:relative; display:inline-block; padding:0; margin:0; width:auto; height:17px; z-index:1; }
#text-size ul { position:relative; display:block; padding:0; margin:0; list-style-type:none; list-style-image:none; width:auto;}
#text-size ul li { position:relative; display:inline-block; margin:0; margin-left:0.5em; padding:0; border:0; text-align:center; list-style:none; }
#text-size a { position:relative; display:inline-block; padding:0; margin:0; text-decoration:none; color:#616161;  }
#text-size a:hover:before ,#text-size a:focus:before,#text-size a.check { color:#b71b1b;}
#text-size a span { position:absolute; top:-100em !important; left:-100em !important; width:1px; height:1px; text-indent:-1000em; }
#text-size a:before {  content:'A'; }
#text-size a.a:before {font-size:1em; line-height:1.6em; }
#text-size a.aa:before{ font-size:1.2em; line-height:1em; }
#text-size a.aaa:before {font-size:1.4em; }

/* foot */
footer { position:relative; padding:0; margin:0 auto; text-align:center; width:auto; background:rgb(60, 60, 59); }
footer h3 { position:relative;  font-size:1.5em; line-height:1.2em; font-weight:bold; color:#000; text-align:left; padding:0; margin:0 0 3em 0; border:0;}
footer h3:before { position:absolute; bottom:-1.5em; left:0; display:block; content:''; width:70px; height:2px; background:#b71b1b; text-align:left; z-index:2; }

#footer-adres { position:relative; padding:1em 4em 1em; margin:0; border-top:1px solid #565656; width:auto; z-index:1; }
#footer-adres ul { position:relative; padding:0; margin:0; list-style-type:none; list-style-image:none; width:auto; overflow:visible; font-size:1em;}
#footer-adres ul li { width:33%; margin:0; padding:0; position:relative; display:inline-block; text-align:center; list-style:none; overflow:visible; vertical-align:top;}
#footer-adres ul li:first-child { text-align:left; }
#footer-adres ul li:last-child { text-align:right;}
#footer-adres ul li:nth-child(2) { padding-top:3em }
#footer-adres a.logo:link, #footer-adres a.logo:visited {  display:block; background:url("https://edukacja.ipn.gov.pl/dokumenty/szablonyimg/210-logo-white.png") no-repeat; background-size:auto 100%; width:auto; height:85px; display:inline-block; margin:0; padding:10px 0 0 110px;  font-size:1.6em; line-height:1.1em; color:#fff !important; text-align:left; font-weight:bold; text-transform:uppercase; text-decoration:underline; }
#footer-adres a.logo span { display:block;}
#footer-adres p { position:relative; display:inline-block; overflow:hidden; padding:0; margin:0; text-align:left;  }
#footer-adres p strong {  font-size:1em; line-height:1.1em; color:#fff; text-align:left; font-weight:bold; text-transform:uppercase; display:block; margin:0 0 0.7em 0;}
#footer-adres p strong span { display:block; text-transform:none;}
#footer-adres p { font-size:1.1em; line-height:1.2em; text-align:left; color:#fff;}
#footer-adres p a {color:#fff !important; text-decoration:none;}
#footer-adres p a span:after {font-family:ipn; content:"\e118"; font-size:0.7em; line-height:1em; }
#footer-adres p a:hover,#footer-adres p a:focus {color:#fff !important;}

.footer-opcje { position:relative; padding:0 4em;}
.footer-opcje ul.opcje { position:relative; top:auto; right:auto; padding:0; margin:0; list-style-type:none; list-style-image:none; width:auto;}
.footer-opcje ul.opcje li { margin:0; margin-bottom:1.5em; padding:0; float:none; display:block; text-align:left;}
.footer-opcje ul.opcje strong { display:inline-block; padding:0 0 0 1em; margin:0; font-weight:normal; text-align:left;}
.footer-opcje ul.opcje li a:link,.footer-opcje ul.opcje li a:visited { text-align:left; white-space:nowrap; color:#000; }
.footer-opcje ul.opcje li a[class^="icon-"]:before, .footer-opcje ul.opcje li a[class*=" icon-"]:before { font-size:1.8em; line-height:0.5em; display:inline-block; vertical-align:middle; }

#footer-opcje-dol { position:relative; padding:1em 4em; margin:0; width:auto; text-align:left; border-top:1px solid #565656; text-align:center; z-index:3; }
#footer-opcje-dol ul.opcje { position:relative; top:auto; left:auto; float:none; display:inline-block;}
#footer-opcje-dol ul.opcje li { margin:0; margin-right:3em; }
#footer-opcje-dol ul.opcje li:last-child { margin:0; }
#footer-opcje-dol ul.opcje li a:link,#footer-opcje-dol ul.opcje li a:visited { font-family:'Muli'; text-transform:none; white-space:nowrap; color:#878787;}
#footer-opcje-dol ul.opcje li a[class^="icon-"]:before, #footer-opcje-dol ul.opcje li a[class*=" icon-"]:before { font-size:0.4em; line-height:2em; margin-right:3em; display:inline-block; vertical-align:middle; }

.header {
    padding: 2% 50px;
    ;
}
.header h2 {
font-weight: 600;
    color: #363636;
    margin-left: 20px;
    font-size: 1.3em;
}
.row a {
  text-decoration: none;
  color:#000;
}
.search {
      display: flex !important;
    justify-content: flex-end;
    align-items: center;
    align-content: center;
}
.half-element-header {
    box-sizing: border-box;
    margin-bottom: 30px;
    width: calc(1/2*100% - (1 - 1/2)*30px);
background-position: center;
background-size: cover;
display: flex;
align-items: center;
}

.button a {
  color:#fff !important;
}

.video-js {margin-left:10px;}

.placemenu {
  list-style-type:none;
  margin:0;
  padding:0;
  text-align: center;
}
.placemenu li {
  display:inline-block;
  text-align:center;
}
.placemenu li a {
  color:#fff;
  display:block;
  text-decoration:none;
  background-color:#b71b1c;
  padding:10px 15px;
  margin:0 10px 15px 10px;
}
.placemenu li a:hover {
  text-decoration:underline;
  background-color:#000;
}

/* ==========================================================================
   KONKURSY I PROJEKTY
   ========================================================================== */
.competition {
  height:300px;
}
.text h3 {
 margin:0;
  padding:0;
}
.featured-photo {
display: flex;
justify-content: flex-start;
align-items: flex-start;
  padding-left: 20px;
}
.wydarzenia {
  width:100%;
  display: inline-block;
}
.wydarzenie-single {
background-color: #f3f3f3;
  padding:20px;
  margin: 2% 0;
}

.wydarzenie-title {
  width:80%;
  padding-left: 30px;
      display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.wydarzenie-single h3 {font-weight:700;}
.wydarzenie-single h3:hover {color:#b71b1c }

.imgwraper {
overflow: hidden;
width: 300px;
height:100%;
background-size: cover;
background-position: center;
}
/* ==========================================================================
   WYSTAWY
   ========================================================================== */
.exhibition-category {
text-align: center;
height: 200px;
display: flex;
justify-content: center;
align-items: center;
padding: 20px;
}
.exhbibition-category-title {
  padding: 20px;
    background-color: #b71b1c;
    display: block;
    font-size: 2.5em;
  font-weight:700;
  color:#fff;
}
.exhbibition-category-title a {
    font-weight:700;
  color:#fff;
  text-decoration:none;
}
.exhibition-category a {
  color:#fff;
}
.kategorie-wystaw {
  margin: 40px 0 40px 0;
}
.kategorie-wystaw h1 {
  font-size: 2.5em;
  font-weight:700;
  padding-bottom:20px;
}
.category-name {
  height:200px;
  background-size:cover;
  display:flex;
  justify-content:center;
  align-items:center;
}
.category-group {
  min-height:230px; 
  display:inline-block; 
  float:none;
  vertical-align:top;
}
.category-name a h4 {
  font-size:1.5em;
  color:#fff;
  font-weight:700;
}
.box-grey li {
	padding:10px 0 10px 0; 
  border-bottom: 1px solid #f0f0f0;
}
.box-grey ul {
  list-style-type:none;
  margin:0;
  padding:0;
}
.box-grey li a {
  color:#000;
}
.box-grey li a:hover {
  color:#b71b1c;
}
/* ==========================================================================
   NAVIGATION
   ========================================================================== */

#navbar {
  background-color:#b71b1c;
  display:flex;
  justify-content:center;
  align-items: center;
  text-align:center;
}
#navbar .content li+li {margin:0 !important; padding:0 !important; }
#navbar ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  display: flex;
    justify-content: center;
}

#navbar li {
  float: left;
}

#navbar li a {
  display: block;
  color: #fff !important;
  text-align: center;
  padding: 7px 8px;
  text-decoration: none;
}

#navbar li a:hover:not(.active) {
  background-color: #fff;
  color: #b71b1c !important;
}

#navbar li a.active {
  color: white;
  background-color: #b71b1c;
}


/* Style the navigation menu */
.topnav {
  overflow: hidden;
  background-color: #b71b1c;
  position: relative;
}

/* Hide the links inside the navigation menu (except for logo/home) */
.topnav #myLinks {
  display: none;
}

/* Style navigation menu links */
.topnav a {
  color: white;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  display: block;
  color:#fff !important;
}

/* Style the hamburger menu */
.topnav button.icon {
    display: block;
    position: absolute;
    right: 40px;
    top: 0;
    height: 100%;
    font-size: 1.7em;
    line-height: 0em;
  line-height:50px;
  	background: none;
	color: #fff;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;

}

/* Add a grey background color on mouse-over */
.topnav a:hover {
  background-color: #b71b1c;
  color: black;
}

/* Style the active link (or home/logo) */
.active {
  background-color: #b71b1c;
  color: white;
}

@media only screen and (min-width: 768px) {
  .topnav {
    display:none;
  }
}
@media only screen and (max-width: 768px) {
  #navbar {
    display:none;
  }
}
.bc {
  padding:20px 0 0 0;
  font-size: 0.8em;
}

#sciezka-naviUl {
  list-style-type:none;
  margin:0;
  padding:0;
  display: inline;
}
#sciezka-naviUl li {
  display:inline;
  margin:0;
}
#sciezka-naviUl li+li:before {
  color: black;
  content: "/\00a0";
  padding: 8px;

}
#sciezka-naviUl a {
  color: #828282;
  text-decoration: none;
}
#sciezka-naviUl a:hover {
  text-decoration: underline;
}
#sciezka-naviUl li:last-of-type {
  font-weight:bold;
}
/* ==========================================================================
   TOP PROMOCJA
   ========================================================================== */
.top-promotion {
  padding-top:16px;
}

.promotion-element {
    background-color: rgba(0,0,0,0.4);
    background-blend-mode: overlay;
    color: #fff;
    height: 150px;
    display: flex;
    justify-content: center;
    align-items: center;
  text-align:center;
}
.promotion-element:first-of-type, .promotion-element:last-of-type {
    width: 100%;
    height: 300px;
}
.promotion-list {
    flex-wrap: wrap;
}
.promotion-element a {
  color:#fff !important;
  text-decoration:none;
  font-size:1.6em;
  font-weight:bold;
  background-color:#b71b1c;
  padding:10px;
}
/* ==========================================================================
   Przycisk więcej
   ========================================================================== */
.more-button {
  position:relative;
  float:right;
  background-color:#b71b1c;
  padding:10px 20px;
  color:#fff !important;
  font-weight:bold;
  text-decoration:none;
}
.more-button:hover {
  background-color:#660f10;
}
.opcje-strony a {
  color:#fff !important;
}
/* ==========================================================================
   Front - kolory linkow
   ========================================================================== */
.link-title-red {
  background-color:#b71b1c;
  padding: 10px;
  text-align: center;
  color:#fff !important;
}
.link-title-red a {
  color:#fff !important;
  text-decoration:none;
  font-weight:700;
}
.link-title-white {
  color:#fff;
  text-decoration:none;
  font-weight:700;
  padding:10px;
  background-color:#b71b1c
}
.link-title-white:hover {text-decoration:underline;}
/* ==========================================================================
   Wystawy
   ========================================================================== */
.exhibition-info {
  margin: 2% 0;
  background-color: #b71b1c;
  color: #fff;
  padding: 5% 0;
  text-align: center;
}
.exhibition-info h3 {color:#fff !important;}
.exhibition-info button a {color:#b71b1c}

/* ==========================================================================
   Galeria
   ========================================================================== */

.gallery-single {
  width:48%;
  height:100px;
  margin: 20px 0 20px 0;
}
.photo-caption {
  padding: 10px;
  background-color: #161616;
  width:100%;
  color:#fff;
  text-align: center;
}
.image-grid {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
}

.img-grid {
  width: 100%;
  height: auto;
  min-width: 20%;
  min-height: 20%;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
}

.img-grid:hover {
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
  overflow: hidden;
}

/* ==========================================================================
   Pionowa galeria
   ========================================================================== */
.side-gallery .img-parent:first-child {display:none;}

.side-gallery .img-parent {margin: 10px 0;}
.side-gallery .image-grid {
      flex-direction: column;
}
.side-gallery .img-grid {
  width: 100%;
    height: auto;

}

/* ==========================================================================
	Zdjęcie w tekście
	========================================================================== */
.zdjecia { position:relative; padding:0; margin:2em 0 2em 0; border:0; width:100%; text-align:center; background:transparent; }
.zdjecia ul { position:relative; padding:0; margin:0 -5px; text-align:center; list-style-type:none; list-style-image:none; width:auto; }
.zdjecia ul li { width:25%; margin:0; padding:0; float:none; display:inline-block; list-style:none; background:transparent; line-height:0; vertical-align:top; }
.zdjecia.foto_right ul li { width:100% }
.zdjecia.threeRow ul li { width:33%; height:9em; overflow:hidden; }
.zdjecia ul li.naglowek { margin:1em 5px 1em; padding:0; border:0; background:none !important; float:none; display:block !important; display:inline; list-style:none; width:100%; }
.zdjecia ul li.naglowek h4 {  font-size:1.6em;line-height:1em; font-weight:bold; }
.zdjecia ul li.clear { margin:0; padding:0; border:0; clear:both; width:100%; list-style:none; height:10px; visibility:hidden; }
.zdjecia ul li figure {position:relative; text-align:center; padding:0; margin:0 5px 10px 5px; border:0;}
.zdjecia ul li figcaption { position:absolute; bottom:0; left:0; display:block; width:100%; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing:border-box; color:#fff; font-size:0.8em; line-height:1em; padding:0.5em 0.7em; text-align:center; text-shadow: 0px 1px 2px rgba(0, 0, 0, 1); opacity:0; transition-duration:0.6s; z-index:2; }
.zdjecia ul li figure img { width:100%; }
.zdjecia ul li a:link,.zdjecia ul li a:visited { color:#ffffff; text-decoration:none; display:block; padding:0; margin:0; border:0; }
.zdjecia ul li a:hover,.zdjecia ul li a:focus { color:#ff6600; -moz-box-shadow:0 0 3px #565656; -webkit-box-shadow:0 0 3px #565656; box-shadow:0 0 3px #565656;
    -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; -ms-transition-duration:0.6s; transition-duration:0.6s; }
.zdjecia ul li a:hover img,.zdjecia ul li a:focus img { transition-duration:2s;}
.zdjecia ul li:hover figcaption,.zdjecia ul li:focus figcaption {opacity:1; transition-duration:0.4s;}
/*lupa*/
.zdjecia ul li a:link:before { font-size:1em; font-family:ipn; content:"\e107"; color:#fff; line-height:1em; opacity:0; position:absolute; top:30%; transform: translate(0, -50%);-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%); left:0; transform:rotate(0); width:100%; text-align:center; z-index:2; transition-duration:1s; }
.zdjecia ul li a:hover:before,.zdjecia ul li a:focus:before  { font-size:5em; opacity:1; transform:rotate(95deg)}
.zdjecia ul li a:link:after { content:""; position:absolute; top:50%; left:50%; width:1%; height:1%; opacity:0; z-index:0; background:#000; transition-duration:0.5s;}
.zdjecia ul li a:hover:after {width:100%; height:100%; top:0; left:0; opacity:0.5; transition-duration:0.2s;}
/* link do multimediów */
.zdjecia ul li.all { position:relative; text-align:center; height:125px;border:6px solid #b71b1b; vertical-align:middle; overflow:visible; }
.zdjecia ul li.all a:after { position:absolute; top:-6px; left:10%; width:80%; display:block; height:110%; background:#fff; content:""; z-index:0; }
.zdjecia ul li.all a { position:relative; width:100%; height:100%; display:block; color:#000; text-align:center; z-index:2; }
.zdjecia ul li.all a span { position:absolute; top:50%; left:0; width:100%; height:100%; display:block; color:#000; text-align:center; z-index:2;  }

/* ==========================================================================
   Zalaczniki
   ========================================================================== */
.zalacznik-container {margin:2% 0;}
.zalaczniki h3 {font-size: 2em !important; margin-bottom: .5em;}
.zalaczniki { position:relative; padding:0em 0.2em 2em 0.2em; margin:0em 0 1em 0; width:auto; overflow:hidden; text-align:left; background:transparent; font-size:0.9em; width:100%; }
.zalaczniki ul { padding:0px; margin:0px !important; text-align:left; list-style-type:none; list-style-image:none; width:auto; height:1%; }
.zalaczniki ul li { margin:0; padding:0 20px 0 20px; display:block !important; list-style:none; border-bottom:1px #e7e9f1 solid; background-color: #f2f2f2; }
.zalaczniki ul li:last-child { border:0; }
.zalaczniki ul li.naglowek { margin:0.4em 0 0.4em 0; padding:0; border:0; background:none !important; display:block !important; list-style:none; width:100%; }
.zalaczniki ul li.naglowek h4 {  font-size:1.6em;line-height:1em; font-weight:bold; }
.zalaczniki ul li.clear { margin:0; padding:0; border:0; clear:both; width:auto; list-style:none; height:0; display:none; }
.zalaczniki ul li a:link,.zalaczniki ul li a:visited { display:block;  color:#000000; text-decoration:none; padding:1em 2em 1em 5%; font-size:1.2em;line-height:1.3em; background-position:left center; background-size:auto 37px; background-repeat:no-repeat;
    -moz-transition-duration:0.6s;-webkit-transition-duration:0.6s;-o-transition-duration:0.6s;-ms-transition-duration:0.6s;transition-duration:0.6s; font-weight:bold;}
.zalaczniki ul li a:hover,.zalaczniki ul li a:focus { color:#000; background-color:#f1f1f1; text-decoration:underline;
    -moz-transition-duration:0.6s;-webkit-transition-duration:0.6s;-o-transition-duration:0.6s;-ms-transition-duration:0.6s;transition-duration:0.6s;}
.zalaczniki ul li a span { display:block; font-size:1em; color:#97a1a7;  text-decoration:none;}

/* ==========================================================================
   FOOTER
   ========================================================================== */

/* foot */
footer {
  background:rgb(60, 60, 59);
  width:100%;
  color:#fff !important;
  text-align:center;
  margin-top:50px;
}
footer strong {
  color:#fff !important;
}
footer ul {
  list-style-type:none;
  display:inline-block;
  color:#fff;
  marign:0;
  padding:0;
}
footer li {
  display:inline-block;
  padding-right:10px;
  margin:0;
}
footer a {color:#fff;}
footer a:hover {color:#b71b1c !important;}
/* ==========================================================================
  	Box w tresci
   ========================================================================== */
.box-incontent {
  background-color:#E0E0E0;
  padding:0 20px 20px 20px;
}
.box-incontent h3, .box-incontent p {
  margin:0 0 10px 0;
  padding:0;
}
.box-incontent p a {
  color:#000;
  text-decoration:none;
  font-weight:700;
}
.box-incontent p a:hover {
  text-decoration:underline;
}

/* ==========================================================================
   Wyszukiwarka + Formularze
   ========================================================================== */
/* search */
#search { position:relative; padding:0; margin:0 10px 0 0; width:100%; height:38px; border:0; overflow:hidden; z-index:2; }
#search form { position:relative; border:0; overflow:visible; width:100%; height:38px; margin:0; float:none; }
#search fieldset { position:absolute; top:0; left:0; border:0; overflow:visible; height:100%; width:100%; box-sizing:border-box; border:1px solid #d0d3d4; padding:0.3em; margin:0; }
#search fieldset legend { position:absolute; font-size:1em; }
#search fieldset.search-item { position:relative; top:47px; left:10px; float:none; border:0; width:75%; height:65%; overflow:hidden; padding:5px; margin:0; text-align:left; display:none; }
#search label { position:absolute; top:-100em; left:-100em; width:1px; height:1px; text-indent:-1000em; }
#search input[type=text] { position:relative; margin-right:3em; padding:0.3em; vertical-align:middle; width:85%; box-sizing:border-box; line-height:normal !important; display:inline-block; overflow:hidden; border:0; border-right:1px solid #d0d3d4; background:transparent; color:#000; font-size:1em; font-weight:normal; text-align:left; }
#search input:focus { color:#000000; border:0;}
#search input[type=submit],#search button { position:absolute; top:16%; right:2%; display:block; width:30px; height:30px; padding:0; border:0; overflow:hidden; text-indent:-100em; cursor:pointer; background:transparent; color:#b71b1b; }
#search input[type=submit]:before ,#search button:before{ position:absolute; top:0; right:0; width:100%; text-indent:0; font-size:1.5em; line-height:1.2em; }
#search input[type=submit]:hover,#search input[type=submit]:focus,#search button:hover,#search button:focus { color:#000; }
#search fieldset a:link { display:block; clear:both; padding:0.5em 0 0 0; font-size:0.7em; color:#000; text-decoration:none; white-space:nowrap}
#search fieldset a:link:before { font-family:ipn; content:"\e106"; color:#000; font-size:0.7em; line-height:1em; display:inline-block; padding:0 0.3em 0 0; margin-top:0; vertical-align:middle; text-align:center; transition-duration:1s; }
#search .szukajg { position:absolute; top:10px !important; right:0.8em !important; width:auto; overflow:hidden; color:#b6b6b6; font-size:1em; font-weight:normal; text-align:left; }
#search .search-item { display:block; font-size:0.8em; }
#search .search-item legend { position:absolute; top:0; left:-10000px; width:1px; height:1px; }
#search .search-item label { position:relative; top:-2px; left:5px; width:auto; height:auto; display:inline-block; text-indent:0; color:#000; background:none; }

.wyszukiwarka { position:relative; float:none; overflow:visible; padding:0.5em 6em; margin:0; background:#ededed; border:1px solid #ececec; border-left:4px solid #b71b1b; z-index:1; }
.rekordy { position:relative; float:none; overflow:visible; padding:0; margin:1em 0; background:#ffffff; z-index:0; }

.rekordy .header { text-align:left; padding:1em 3em; border:0;}
.rekordy .header  h3 {display:inline-block;  font-size:2em; line-height:1em; font-weight:bold;}

/* licznik */
.iloscRekordow { position:relative; display:inline-block; padding:1em 0 1em 2em; margin:1em; width:auto; text-align:left; z-index:1; border-left:1px solid #dadada; }
.iloscRekordow h4 {  font-size:1.8em; line-height:1em; margin:0; padding:0; font-weight:normal;}
.iloscRekordow h4 span {  color:#b71b1b; font-weight:bold;}

#szukaj-zaawansowana, #szukaj-zaawansowana-rozwin-button {
  display:none;
}
#wynikiSearch li {
  background-color: #ebebeb;
  padding: 10px;
  display: flex;
  flex-direction: column;
  margin: 20px 0;
}
#button_szukajw1, #button_szukajw2, #button_szukajw3 {
  display:none;
}
#wyszukiwarka_cms .form_input {
  display: flex;
  justify-content: center;
}

/* formularz */
.forms { position:relative; display:block; overflow:hidden; border:0; margin:0; padding:0; }
.forms .required { font-weight:normal; color:#ff0000; font-size:0.9em; }
.forms br { clear:both; margin:0; padding:0; overflow:hidden; }
.forms img { border:0; vertical-align:middle; }
.forms form { height:auto; margin:0 auto; background:transparent; padding:0; color:#020202;}
.forms fieldset { position:relative; display:block; z-index:1; height:auto; padding:0; margin:0; border:0; overflow:visible; }
.forms legend{ position:relative; top:0; left:0; margin:0; padding:0.5em; overflow:hidden; width:100%;  font-size:1.6em; line-height:1.3em; text-align:left; border-bottom:1px solid #f8f8f8; color:#010101;  font-weight:bold;}
.forms legend.subtitle { position:relative; display:block; top:0; z-index:1; width:auto; overflow:hidden; padding:0.8em; text-align:left; font-size:1em; font-weight:bold;}
.forms ins, .forms .ins { position:relative; display:block; overflow:visible; height:1%; text-align:left; margin:0.5em 1em; background:transparent; font-size:1em; text-decoration:none; }
.forms .box_error { border:1px solid #ff0000; }
.forms .submit { padding:1em 0; text-align:center; }
.forms .title { padding:0.5em; font-weight:normal; font-size:1.6em; line-height:1.1em; }
.forms .subtitle { font-weight:bold; }
.forms .all { padding:0.8em !important; }
.forms label,.forms .label { position:relative; top:50%; left:0; transform:translate(0,-50%);-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%); padding:0; width:37%; border:0; text-align:right; font-size:1.1em; line-height:1em; font-weight:normal;}
.forms label span.error { position:absolute; top:-100em; left:-100em; width:1px; height:1px; text-indent:-1000em;}
.forms div.form_input { position:relative; padding:0; width:auto; margin:0; background:transparent; text-align:left; color:#000000; font-size:1em;}
.forms div.form_input label,.forms div.form_input .label { position:relative; top:0; left:0; padding:0 0.5em; width:auto; border:0; text-align:left; font-size:1em; font-weight:normal;}
.forms div.form_text { position:relative; padding:0.3em 0 0 0; width:auto; margin:0; text-align:left; color:#565656; font-size:1em; line-height:1em;}
.forms div.form_text p {margin-top:0;}
/* ustawienie dwa w rzedzie */
.forms .twoRows{ float:left; width:50%; }
.forms .twoRows ins,.forms .twoRows .ins { padding:0.2em; white-space:nowrap; }
.forms .twoRows label,.forms .twoRows .label { position:relative; top:auto; left:auto; transform:translate(0,0);-webkit-transform:translate(0,0);-ms-transform:translate(0,0); padding:0 0.5em 0.5em 0; float:none; width:auto; border:0; text-align:left; }
.forms .twoRows .reset label,.forms .twoRows .reset .label {display:block; padding:0 0 0.5em 0; float:none; width:100%; text-align:left; box-sizing:border-box;}
.forms .twoRows .reset .left label,.forms .twoRows .reset .left .label { position:relative; top:auto; transform:translate(0,0);-webkit-transform:translate(0,0);-ms-transform:translate(0,0); left:auto; display:inline; vertical-align:middle; padding:0 0.5em 0 0; float:none; width:auto; border:0; text-align:left;}
.forms .twoRows .form_input { position:relative; display:inline; float:none; padding:0; width:auto; margin:0; text-align:left; font-size:0.9em;}
.forms .twoRows .reset .form_input {float:none; width:100%; }
.forms .twoRows input[type=text],.forms .twoRows input[type=file],.forms .twoRows input[type=password] { width:90%; }
.forms .twoRows select { width:90%; }
.forms .twoRows input[type=text].data {width:50%;}
.forms .twoRows input.data{ width:50%; font-size:0.9em; padding:0.6em 0; }
.forms ins img {width:auto !important; height:auto !important;}

/* wyszukiwarka dzialowa */
.forms.page { text-align:left; margin:0 0 1em;}
.forms.page form { width:30%; margin:0; box-sizing:border-box; }
.forms.page form fieldset { border:1px solid #b5bec4; box-sizing:border-box; }
.subLeft .forms.page form { width:100%; }
.forms.page form .szukaj-dzial { position:absolute; top:8px !important; width:190px; overflow:hidden; color:#b3b3b3; font-size:0.9em; font-weight:normal; text-align:left; }
.forms.page input[type=text] { width:85%; border:0;}
.forms.page input[type=submit],.forms.page button { position:absolute; top:0; right:0; display:block; width:30px; height:30px; padding:0; margin:0; border:0; overflow:hidden; text-indent:-100em; cursor:pointer; background:transparent; color:#fcc133; }
.forms.page input[type=submit]:before ,.forms.page button:before{ position:absolute; top:0.2em; left:0; width:100%; text-indent:0; font-size:1.2em; line-height:1.3em; font-family:ipn; content:"\e107"; color:#b71b1b; }
.forms.page input[type=submit]:hover,.forms.page input[type=submit]:focus,.forms.page button:hover,.forms.page button:focus { color:#000000; }
.forms.archiwum .lupa:after  { position:absolute; top:50%; transform:translate(0,-50%);-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%); right:3%; text-indent:0; font-size:1.2em; line-height:1.3em; font-family:ipn; content:"\e107"; color:#b71b1b;}

/* czyszczenie pola w wyszukiwarce */
.usun { position:relative; display:inline-block; vertical-align:middle;width:28px; height:28px; margin:0.03em 0 0 0.5em; }
.usun a:link,.usun a:visited { position:relative; display:block; height:100%; text-decoration:none; color:#b71b1b; transition-duration:0.6s; }
.usun a:before { font-family:ipn; content:"\e10a"; font-size:1.4em; line-height:1em; position:absolute; top:50%; transform: translate(0, -50%); left:0; width:100%; text-align:center; }
.usun a:hover,.usun a:focus { color:#34343e; transition-duration:0.6s; }

/* wstawa date */
a.dateInsert { position:relative; display:inline-block; vertical-align:middle; width:28px; height:28px; margin:0.03em 0.2em 0 0; }
a.dateInsert:link,a.dateInsert:visited { color:#b71b1b; text-decoration:none; transition-duration:0.6s; }
a.dateInsert:before { font-family:ipn; content:"\e110"; font-size:1.4em; line-height:1em; position:absolute; top:50%; transform:translate(0, -50%);-ms-transform:translate(0, -50%);-webkit-transform:translate(0, -50%); left:0; width:100%; text-align:center; }
a.dateInsert:hover,a.dateInsert:focus { color:#34343e; transition-duration:0.6s; }

/* opcje sortowania */
.sort { position:relative; display:inline-block; vertical-align:middle; z-index:2; margin:0 0.1em; white-space:nowrap; transition-duration:0.6s; }
a.sort-up:link, a.sort-up:visited,
a.sort-down:link, a.sort-down:visited { position:relative; display:inline-block; text-decoration:none; line-height:0.5em; margin-right:-7px; color:#fff; transition-duration:0.6s; }
a.sort-up:hover, a.sort-up:focus, a.sort-down:hover,a.sort-down:focus,
a.sort-up:hover:before, a.sort-down:hover:before { color:#000; text-decoration:none !important; transition-duration:0.6s; }
a.sort-up:before, a.sort-down:before { font-family:ipn; content:"\e107"; font-size:0.8em; line-height:0.9em; position:relative; text-align:center; text-decoration:none; }
a.sort-down:before {content:"\e106";}

/* filtr - szybkie usuwanie nad wynimami */
.filter { position:relative; display:block; margin:2em 0; padding:0.5em 1em; background:#656769; }
.filter h3 { position:relative; display:inline-block; margin:0 0.2em 0 0; font-size:1em; line-height:1em; color:#fff; text-transform:uppercase; }
.filter ul { position:relative; padding:0; margin:0; list-style-type:none; list-style-image:none; width:auto; overflow:visible; }
.filter ul li { margin:0; margin:0; padding:0; position:relative; display:inline-block; text-align:left; list-style:none; overflow:visible; }
.filter a:link,.filter a:visited { position:relative; display:inline-block; background:#fff; padding:0.30em 0.5em 0.15em 1em; margin:0 0.2em 0.2em; text-decoration:none; font-size:1.2em; line-height:1em; text-transform:uppercase; color:#3a3a3a; }
.filter a:hover,.filter a.active { background:#807b7b; color:#b9b8b8; transition-duration:0.6s; }
.filter a:before { font-family:ipn; content:"\e10a"; font-size:0.7em; line-height:0.9em; color:#000; background:#ebebeb; position:relative; text-align:center; float:right; vertical-align:middle; padding:0.2em 0.3em; margin:0 0 0 1em;}
.filter a:hover:before,.filter a:focus:before { color:#000; transition-duration:0.6s; }
/*fix wyszukiwarka głowna*/
.wynikiSearchFilter .filter {margin:0.5em 0; }
.wynikiSearchFilter .filter a:before { content:"\e107"; }
.wynikiSearchFilter .filter h3 { color:#fff; margin:0 0.2em 1em 0;}

/* pola formularza */
.forms input[type=text],.forms input[type=file],.forms input[type=password],.forms select { font-size:1em; font-weight:normal; color:#222222; text-align:left; border:1px solid #000; width:100%; margin:0; padding:0.7em; box-sizing:border-box; background-color:#ffffff; }
.forms select { padding:0.5em 2em 0.5em 1em; }
.forms .select { position:relative; display:inline;}
.forms .select select { position:relative; -webkit-appearance:none;-moz-appearance:none;}
.forms .select select[multiple] {z-index:2;}
.forms input[type=text].number {width:20%;}
.forms input[type=text].data {width:40%;}
.forms input[type=password] { width:50%; border:1px #b0b0b0 dotted; }
.forms input[readonly="readonly"] {opacity:0.9; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";  }
.forms input[type=radio],.forms input[type=checkbox] { border:0; margin:0.4em 0.5em 0.4em 1em; background:transparent; }
.forms textarea { font-size:1em; color:#222222; border:1px solid #ececec; font-weight:normal; background:#ffffff; text-align:left; padding:0.1em; overflow-y:auto; overflow-x:hidden; width:90%; }
.forms input[type=submit],.forms input[type=button],.forms button {  font-size:1.2em; color:#fff; font-weight:bold; text-align:center; text-transform:uppercase; width:auto; height:auto; margin:0.2em; padding:0.3em 1em 0.3em 1em; border:0; overflow:hidden; background:#b71b1b; cursor:pointer; }
.forms button.szukaj:after { font-family:ipn; content:"\e107"; color:#fff; font-size:1em; line-height:0.8em; display:inline-block; padding:0 0 0 0.2em; margin-top:-0.3em; vertical-align:middle; text-align:center; transition-duration:1s; }
.forms input[type=submit].usunFiltr,.forms input[type=button].usunFiltr,.forms button.usunFiltr {color:#fff; background:#818181; }
.forms input[type=submit]:hover,.forms input[type=button]:hover,.forms button:hover,.forms input[type=submit]:focus,.forms input[type=button]:focus,.forms button:focus { background:#f1f1f1; color:#000000 }
.forms input[type=image] { border:0; }
.forms input:disabled,.forms textarea:disabled {opacity:0.3; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";  }
.forms input:focus,.forms select:focus,.forms textarea:focus { background-color:#ecf0f1; border:2px solid #b71b1b;
    -moz-box-shadow:0px 0px 5px #dadada; -webkit-box-shadow:0px 0px 5px #dadada; box-shadow:0px 0px 5px #dadada;-moz-transition-duration:1s;-webkit-transition-duration:1s;-o-transition-duration:1s;-ms-transition-duration:1s;transition-duration:1s;}

/* pretty checkbox */
.checkbox { margin:0 0 1em; position:relative; }
.checkbox.radio { border-radius:25px; }
.checkbox input[type=checkbox],.checkbox input[type=radio] {position:absolute; left:-1000em; }
.checkbox label {display:block; width:auto !important; height:auto !important; cursor:pointer; position:relative !important;top:0 !important;left:0 !important; background:transparent; padding:0 0 0 28px !important;transform:translate(0,0);-webkit-transform:translate(0,0);-ms-transform:translate(0,0);  border:0;}
.checkbox label:after,.checkbox label:before {font-family:ipn; font-size:0.9em; line-height:1.3em; display:block; width:20px; height:20px; cursor:pointer; position:absolute; top:0; left:0; padding:0.1em 0 0 0; transform:translate(0,0);-webkit-transform:translate(0,0);-ms-transform:translate(0,0); width:20px; height:20px; background:#fff; border:1px solid #ececec; box-sizing:border-box;
    -webkit-transition: all .4s ease;-moz-transition: all .4s ease;-o-transition: all .4s ease;-ms-transition: all .4s ease;transition: all .4s ease;text-align:center;}
.checkbox label:after {content:""; }
.checkbox label:before {content:"\e109"; display:none; box-shadow:2px 2px 5px rgba(0, 0, 0, 0.13);}
.checkbox input[type=checkbox],.checkbox input[type=radio] { margin:0;}
.checkbox input[type=checkbox]:checked + label:after,.checkbox input[type=radio]:checked + label:after { display:none; }
.checkbox input[type=checkbox]:checked + label:before,.checkbox input[type=radio]:checked + label:before { display:block; background:#b71b1b; color:#fff; }
.checkbox input[type=checkbox]:focus + label,.checkbox input[type=radio]:focus + label { text-decoration:underline; }
.checkbox input[type=radio]:focus + label:before,.checkbox input[type=radio]:checked + label:before { border-radius:25px; }
.checkbox label:hover:before { opacity:0.3; }



/* listy globalne */
/* ==========================================================================
   Helper classes
   ========================================================================== */
/*
 * Hide visually and from screen readers
 */
.hidden {
    display: none !important;
}
/*
* Hide only visually, but have it available for screen readers:
* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*
* 1. For long content, line feeds are not interpreted as spaces and small width
*    causes content to wrap 1 word per line:
*    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
*/
/*
* Hide visually and from screen readers, but maintain layout
*/
.invisible {
    visibility: hidden;
}
/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
*    `contenteditable` attribute is included anywhere else in the document.
*    Otherwise it causes space to appear at the top and bottom of elements
*    that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
*    `:before` to contain the top-margins of child elements.
*/
.clearfix:before, .clearfix:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */
}
.clearfix:after {
    clear: both;
}
/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
@media only screen and (max-width: 35em) {
    .half-element, .third-element, .quarter-element, .twelve-element, .left {
        width: 100% !important;
    }
}
@media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 1.25dppx), (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}
/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */
@media print {
    *, *:before, *:after {
        background: transparent !important;
        color: #000 !important;
        /* Black prints faster */
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }
    a, a:visited {
        text-decoration: underline;
    }
    a[href]:after {
        content: " (" attr(href) ")";
    }
    abbr[title]:after {
        content: " (" attr(title) ")";
    }
    /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */
    a[href^="#"]:after, a[href^="javascript:"]:after {
        content: "";
    }
    pre {
        white-space: pre-wrap !important;
    }
    pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }
    /*
     * Printing Tables:
     * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
     */
    thead {
        display: table-header-group;
    }
    tr, img {
        page-break-inside: avoid;
    }
    p, h2, h3 {
        orphans: 3;
        widows: 3;
    }
    h2, h3 {
        page-break-after: avoid;
    }
}
.competion-grid {
    background-size: cover;
background-position: center;
display: flex;
justify-content: center;
align-items: center;
text-align: right;
}
.program-grid {
    height: 350px;
    background-size: cover;
background-position: center;
}
.program-grid:hover {
      background-color: red;
    background-blend-mode: darken;
}
.tall-file {
height: 400px;
background-size: cover;
display: flex;
justify-content: center;
align-items: center;
text-align: center;

}
.small-file {
    height: 150px;
    background-size: cover;
background-position: center;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}
.medium-file {
    height: 200px;
    background-size: cover;
background-position: center;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}

.gray-section {
  padding-bottom:30px;
  background-color: #E0E0E0;
  display: inline-block;
  width:100%;
}
.white-section {
  padding-bottom:30px;
  display: inline-block;
  width:100%;
}


.regular-section {
  margin-top:0 !important;
  padding-bottom:20px;
  display: inline-block;
}

.red-section {
    background-color: #b71b1c;
    padding: 30px 0 40px 0;
    position: relative;
}
.important {
    font-size: 1.1em;
    font-weight: 700;
    text-transform: uppercase;
  color:#fff !important;
}
.important h2 {
  margin:0 !important;
  padding:0;
  color:#fff !important;
}
span h1 {
    margin: 0;
    padding: 0;
    font-size: 1em;
}

#meni_strony { position:relative; display:table; overflow:hidden; font-size:1em; padding:0; margin:1em auto; min-height:25px; text-align:center;  }
#meni_strony ul { padding:0; margin:0; text-align:left; list-style-type:none; list-style-image:none; width:auto; }
#meni_strony ul li { position:relative; margin:0 0.5em 0.2em 0; border:0; padding:0; float:left; display:block !important; display:inline; overflow:hidden; list-style:none; }
#meni_strony ul li.noActive { background:#ffffff; color:#a7a7a7; padding:0.18em 0.6em; } 
#meni_strony ul li.selectbox { white-space:nowrap; padding:0; }
#meni_strony ul li.selectbox .forms select { width:auto; padding:0.75em 2em 0.75em 0.5em; }
#meni_strony ul li.selectbox .iloscStron { position:relative; display:inline; padding:0.5em; font-weight:bold;}
#meni_strony a,#meni_strony a:visited { display:block; background:#ffffff; border:1px solid #e2001a; height:auto !important; height:1%; color:#000000; text-shadow:0px 1px 0px #fff !important; line-height:1em; padding:0.3em 0.6em 0.3em 0.6em; font-size:1em; text-decoration:none; font-weight:normal; overflow:hidden; 
-webkit-transition: all 0.4s ease-in;-moz-transition: all 0.4s ease-in;-o-transition: all 0.4s ease-in;transition: all 0.4s ease-in;text-shadow:0px 1px 0px #fff !important; }
#meni_strony a:hover,#meni_strony a:active,#meni_strony a:focus,#meni_strony a.check  {background:#e2001a; color:#ffffff; text-decoration:none; transition: all 0.2s ease-in;}
#meni_strony span { position:absolute; top:-100em; left:-100em; width:1px; height:1px; text-indent:-1000em; }


/* RESPONSIVE */
@media only screen and (max-width: 768px) {
  .row {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding:20px 0 20px 0;
    text-align:center;
  }
  #header-opcje-gora, #header-opcje-dol, .header {display:none;}
  .header h2 {margin:0; padding:10px 0;}
  .search { display:none !important; }
  .category-group {
    display: inline;
  }
  .tallelement-bg {
    background-size: contain;
    background-repeat: no-repeat;
  }
  .wydarzenie-single {
    flex-direction: column;
  }
}
@media screen and (max-width: 400px) {
  #footer-opcje-dol {
    margin:0;
    padding:0;
  }
  #footer-adres a.logo:link, #footer-adres a.logo:visited {
    font-size:1em;
    line-height:auto;
  }
  #footer-opcje-dol ul.opcje {
    font-size:1em;
    margin:0;
    padding:0;
    text-align:center;
    list-style-type:none;
  }
  #footer-opcje-dol ul.opcje li {
    margin:0;
    padding:0;
  }
  .topnav a {
    font-size:0.8em;
    padding: 14px 5px;
  }
  .left {
    width:100% !important;
  }
}


/*kontrast*/
#footer-opcje-dol ul.opcje li a:link, #footer-opcje-dol ul.opcje li a:visited {
  color: #fff !important;
}
#sciezka-naviUl a {
  color: #424242;
}
.zalaczniki ul li a span {
  color: #595b5c;
}


/* wcag opcje */
.wcag-options {
  background-color: #b71b1c;
  padding:10px 0;
  text-align:center;
}
.wcag-options a {
  color:#fff !important;
}

.button_play {
    display: block;
    width: 195px;
    height: 73px;
    border: 0;
    background-image: url(https://edukacja.ipn.gov.pl/dokumenty/szablonyimg/210-tlo_przycisk1.png);
    background-position: left top;
    background-repeat: no-repeat;
    color: #fff;
    font-weight: 800;
    font-size: 40px;
    text-align: center;
    line-height: 62px;
    text-shadow: 0px 2px 1px #333;
    position: absolute;
    top: 185px;
    left: 73px;
    text-decoration: none;
    outline: 0px;
    outline-color: black;
    outline-style: double;
}

.game_details {
    display: block;
    position: absolute;
    bottom: 22px;
    width: 180px;
    height: 48px;
    margin: 0;
    padding: 0;
    font-size: 1em;
    line-height: 48px;
    padding-left: 70px;
    border-radius: 0 10px 10px 0;
    vertical-align: middle;
}

.game_details > .details_icon {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 48px;
    height: 48px;
    background-position: center;
    background-repeat: no-repeat;
}

.game_age {
    left: 340px;
    background-color: #eee0d6;
    color: #333;
    vertical-align: middle;
}

.game_players {
    left: 605px;
    background-color: #f9cfc5;
    color: #222;
}

.game_players > .details_icon {
    background-color: #bc7668;
    background-image: url(../img/ikona_liczba_graczy.png);
}



/* metryki gier */
.metryka-gry {
    position: relative;
    width: 400px;
    padding-top: 2px;
  	clear:both;
    height: 48px;
}

.metryka-wiek .metryka-ikona{
 	background-color: #FFCC00;
    background-image: url("/dokumenty/szablonyimg/210-metryczka-ikona-wiek_graczy.png");
}


.metryka-wiek .metryka-tekst{
 	background-color: #FFEC9E;
}

.metryka-liczba .metryka-ikona{
 	background-color: #349C0E;
    background-image: url("/dokumenty/szablonyimg/210-metryczka-ikona-liczba_graczy.png");
}


.metryka-liczba .metryka-tekst{
 	background-color: #CDFFBB;
}

.metryka-czas .metryka-ikona{
 	background-color: #D4242B;
    background-image: url("/dokumenty/szablonyimg/210-metryczka-ikona-czas_gry.png");
}


.metryka-czas .metryka-tekst{
 	background-color: #F9C4C7;
}

.metryka-ikona{
    width: 48px;
	height: 48px;
    background-position: center;
    background-repeat: no-repeat;
	float: left;
	background-size: 100% 100%;
    border-radius: 3px 0px 0px 3px;
}

.metryka-tekst{  
	border-radius: 0px 8px 8px 0px;
	font-size: 16px;
	padding: 8px 8px 8px 16px;
	float: left;
	text-align: left;
	line-height: 32px;
	width: 198px;
}

.metryka-tekst span {
  font-weight: bold;
  font-size: 18px;
}

/* metryki gier */


.orp-button {
  display: flex;
  justify-content: left;
  align-items: center;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

.orp-button .pushable {
  position: relative;
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
  outline-offset: 4px;
  transition: filter 250ms;
  text-decoration: none !important;
  text-decoration-line: none !important;
}
.orp-button .shadow {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 1024px;
  background: hsl(0deg 0% 0% / 0.25);
  will-change: transform;
  transform: translateY(2px);
  transition: transform 600ms cubic-bezier(0.3, 0.7, 0.4, 1);
}
.orp-button .edge {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 1024px;
  background: linear-gradient(
    to left,
    hsl(340deg 100% 16%) 0%,
    hsl(340deg 100% 32%) 8%,
    hsl(340deg 100% 32%) 92%,
    hsl(340deg 100% 16%) 100%
  );
}
.orp-button .front {
  display: block;
  position: relative;
  padding: 12px 42px;
  border-radius: 1024px;
  font-size: 1.5rem;
  font-weight: bold;
  color: white;
  background: #b71b1c;
  will-change: transform;
  transform: translateY(-4px);
  transition: transform 600ms cubic-bezier(0.3, 0.7, 0.4, 1);
}

.orp-button .pushable:hover {
  filter: brightness(110%);
  text-decoration: none !important;
  text-decoration-line: none !important;
}
.orp-button .pushable:hover .front {
  transform: translateY(-6px);
  transition: transform 250ms cubic-bezier(0.3, 0.7, 0.4, 1.5);
  text-decoration: none !important;
  text-decoration-line: none !important;
}
.orp-button .pushable:active .front {
  transform: translateY(-2px);
  transition: transform 34ms;
}
.orp-button .pushable:hover .shadow {
  transform: translateY(4px);
  transition: transform 250ms cubic-bezier(0.3, 0.7, 0.4, 1.5);
  text-decoration: none !important;
  text-decoration-line: none !important;
}
.orp-button .pushable:active .shadow {
  transform: translateY(1px);
  transition: transform 34ms;
}
.orp-button .pushable:focus:not(:focus-visible) {
  outline: none;
}

.orp-button .front-tight {
  display: block;
  position: relative;
  padding: 8px 24px;
  border-radius: 1024px;
  font-size: 1.5rem;
  font-weight: bold;
  color: white;
  background: #b71b1c;
  will-change: transform;
  transform: translateY(-4px);
  transition: transform 600ms cubic-bezier(0.3, 0.7, 0.4, 1);
}

/* kalendaium */
.timeline { position:relative; overflow:visible; z-index:1; border:0; font-size:1em; text-align:left; }
.timeline:after { content:""; position:absolute; top:0; left:50%; transform:translateX(-50%);-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%); width:1px; height:100%; z-index:1; background-color:#b71b1c; }
.timeline h2 { position:relative; display:inline-block; z-index:4; font-size:4em; font-weight:bold; color:#fff; text-align:center; padding:0.3em 0.5em; margin:0.5em 0; background-color:#fc1717; }
.timeline ul { position:relative; padding:0; margin:0; list-style-type:none; list-style-image:none; text-align:left;}
.timeline li { position:relative; display:block; margin:0; padding:0; list-style:none; overflow:visible; text-align:center; }
.timeline li a:link,.timeline li a:visited { font-size:1em; line-height:1.2em; color:#000; text-decoration:none; font-weight:normal;text-align:right; position:relative; margin:0; display:block; }
.timeline li a {padding:0.5em 60% 0.5em 0;}
.timeline li:nth-child(even) a {padding:0.5em 0 0.5em 60%; text-align:left;}
.timeline li a h3 { display:inline-block; font-size:2em; font-weight:bold; color:#000; }
.timeline li a h3.small {font-size:1em;}
.timeline li a:after { content:""; display:block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);-webkit-transform:translate(-100%,-50%);-ms-transform:translate(-50%,-50%); width:30px; height:30px; z-index:2; background:#b71b1c; transition-duration:1s;
-webkit-clip-path: polygon(50% 0%, 90% 20%, 100% 60%, 75% 100%, 25% 100%, 0% 60%, 10% 20%);
clip-path: polygon(50% 0%, 90% 20%, 100% 60%, 75% 100%, 25% 100%, 0% 60%, 10% 20%);
 }
.timeline li a:hover h3,.timeline li a:focus h3 { color:#000; transition-duration:2s;}
.timeline li a:hover,.timeline li a:focus { color:#999; transition-duration:1s;}
.timeline li a:hover:after,.timeline li a:focus:after { background:#444; transition-duration:1s;}
.timeline .imgwraper { width:70%; height:300px; float:right; clear:both; }
.timeline li:nth-child(even) .imgwraper { float:left; } 
.timeline .imgwraper { width:auto; height:160px; float:none !important;}
.timeline li a h3 { font-size:1.2em; }
 


/* LoginBox */
.forms.loginBox { position:relative; display:block; margin:0; } 
.forms.loginBox input[type=text], .forms.loginBox input[type=password] { width:100%; height:100%; box-sizing:border-box; padding-left:30px }
.forms.loginBox .loginFiled:before, .forms.loginBox .passField:before, .forms.loginBox .emailField:before { position:absolute; top:50%; left:5px; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); display:block; width:20px; height:20px; overflow:hidden; font-family:var(--font-icon); font-size:20px; line-height:20px; font-weight:normal; }
.forms.loginBox .loginFiled:before { content:"\e101"; }
.forms.loginBox .passField:before { content:"\e101"; }
.forms.loginBox .emailField:before { content:"\e101"; }

/*fast LoginBox */
.forms.loginBox.quick fieldset { display:flex; }
.forms.loginBox.quick .emailField { width:100%; }

/* Pass strenth */
.passStrength { position:relative;margin:0.3em 0; }
.passStrength.bar { display:block; height:0.6em; }
.passStrength.hint { margin:0.2em 0 0 0; font-size:0.9em; color:var(--color-light-text); }

/*dialog alert */
.alerts { position:relative; display:flex; align-items:center; justify-content:flex-start; padding:1em; margin:2em auto; text-align:left; font-size:1.4em; line-height:1.1em; color:var(--color-black); font-family:var(--font); border:1px solid var(--color-grey); border-radius:var(--bordr-radius); z-index:1; }
.alerts._warn { color:var(--color-black); background-color:var(--color-yellow); border:1px solid var(--color-yellow); border:0; }
.alerts._alert { color:var(--color-white); background-color:var(--color-red); border:1px solid var(--color-red); border:0; }
.alerts._ok { color:var(--color-white); background-color:var(--color-green); border:1px solid var(--color-green); border:0; }
.alerts i.element { position:relative; display:block; padding:10px; width:60px; height:60px; text-align:center; font-style:normal; border:1px solid var(--color-light-grey); }
.alerts i.element:before { content:"\26A0"; font-size:3em; line-height:60px; }
.alerts div.content { padding:1em; font-size:1em; line-height:1em; font-weight:normal; text-align:left; }
	

/*payment */
.payment {display:block;}
.payment span[class^="i-"],.payment span[class*=" i-"] { display:inline-block; padding:0.3em; margin:0; font-size:1em; line-height:1em; }
.payment .i-error { background-color:var(--color-red); color:var(--color-white);}
.payment .i-ok { background-color:var(--color-green); color:var(--color-white); }
.payment .i-normal { background-color:var(--color-grey); color:var(--color-black); }
.payment .i-alert { background-color:var(--color-yellow); color:var(--color-black); }

/*index*/
.index { position:relative;}
.index h3 { position:relative; padding:0.5em 0; font-size:3em; line-height:1.2em; color:var(--color-black); text-align:left; font-weight:700; text-decoration:none; text-transform:uppercase; }
.index .box { position:relative; background-color:var(--color-light-grey); padding:1.5em; margin:0; text-align:left; font-size:1em; line-height:1em; color:var(--color-black); }
.index ul { padding:0; margin:0; text-align:left; list-style-type:none; list-style-image:none;}
.index ul li { margin:0; border:0; padding:0; list-style:none; position:relative; }
.index ul li a:link,.index ul li a:visited { position:relative; padding:0.4em; display:inline-block; text-decoration:none; font-size:1.3em; line-height:1.2em; color:var(--color-black); }
.index ul li a:hover,.index ul li a:focus { background-color:var(--color-main); color:var(--color-white); }
.index ul li a span { font-size:0.6em; padding:0.2em; margin:0 0.5em; background-color:var(--color-main); color:var(--color-white); }

/* MAPS */
.maps { position:relative; padding:0; margin:0; } 
.maps .map, article .map { display:block; width:100%; height:650px; }
.maps #objectList { display:block; margin:2em 0; }
.maps #drukuj-ikonki { position:relative; text-align:right; padding:0; margin:1em 0; } 
.maps .box-podsumowanie { position:relative; display:flex; justify-content:space-between; align-items:stretch; flex-direction:row; border:0; padding:0; margin:0 0 1em 0; box-sizing:border-box; } 
@media only screen and (max-width:768px) { .maps .box-podsumowanie { flex-direction:column; } }
/* maps - search */
.maps .search { text-align:left; margin-bottom:1em;}
.maps .search form { border:1px solid var(--color-light-grey); width:100%; margin:0; box-sizing:border-box;}
.maps .search legend, .maps .search label { position:absolute; top:0; left:-10000em; width:1px; height:1px;}
.maps .search input[type=text] { width:85%; border:0;}
.maps .search button { position:absolute; top:0; right:0; display:block; width:50px; height:100%; padding:0; margin:0; border:0; overflow:hidden; text-indent:-100em; cursor:pointer; background:transparent; color:var(--color-dark-grey); }
.maps .search button:before { position:absolute; top:50%; transform:var(--vcenter); left:0; width:100%; text-indent:0; font-size:1.4em; line-height:50px; font-family:var(--font-icon); content:"\e106"; color:var(--main-color); }
.maps .search button:hover,.maps .search button:focus { color:var(--color-black); } 
/* maps - legend and options */
.maps .legenda, .maps .opcje { position:relative; padding:2em; margin:0; width:50%; }
.maps .legenda .forms, .maps .opcje .forms { overflow:visible; background:transparent;}
.maps .legenda legend, .maps .opcje legend { padding:0; margin:0 0 1em 0;}
.maps .legenda ins,.maps .legenda .ins,
.maps .legenda ins,.maps .legenda .ins, .maps .opcje ins,.maps .opcje .ins { position:relative; display:block; overflow:visible; height:auto; padding:0; margin:0.5em; text-align:left; background:transparent; border-bottom:1px solid var(--color-light-grey); }
.maps .legenda .marker { display:inline-block; vertical-align:middle; border:0; border-left:1px solid var(--color-light-grey); width:20px; height:20px; padding:0; margin:0 0.5em 0 0; box-sizing:border-box; background-position:center top; background-repeat:no-repeat; background-size:80% 100%; }
/* maps - dsc */
.maps .opis { position:relative; padding:2em; margin:0; width:50%; }
.maps .opis strong { display:block; font-weight:bold; font-size:1.4em; line-height:1em; text-align:left; margin:0 0 1em 0; }
.maps .opis p { display:block; margin:1em 0; text-align:left; font-size:1.2em; line-height:1.1em; }
/* mapy - image */
.maps .image { position:relative; padding:2em; margin:0; width:44%; }
/* mapy - hint */
.map-object { position:relative; padding:1em; margin:0; width:auto; height:auto; box-sizing:border-box; }
.map-object strong { display:block; margin:0 0 0.8em 0; font-family:var(--font); text-align:left; font-size:1.2em; line-height:1em; }
.map-object p { font-family:var(--font); text-align:left; font-size:1em; line-height:1.2em; margin:0; }
.map-object a.button:link, .map-object a.button:visited { padding:1em; margin:1em 0; }
.map-object .forms { width:350px; }
 /* maps - fix horizontal view */
.MapaPozioma .maps .map height:750px; }
.MapaPozioma .maps .box-podsumowanie { flex-direction:column; }
.MapaPozioma .maps .legenda,.MapaPozioma .maps .opcje { width:100%; box-sizing:border-box; text-align:center; }
.MapaPozioma .maps .legenda ins, .MapaPozioma .maps .legenda .ins,
.MapaPozioma .maps .opcje ins, .MapaPozioma .maps .opcje .ins { display:inline-block; border-bottom:0; }
.MapaPozioma .maps .legenda legend,.MapaPozioma .maps .opcje legend { margin:0 auto 1em; }
 /* maps - popup if not exist */
.map-popup { position:absolute; top:20%; left:50%; transform:var(--center); min-width:30%; height:auto; padding:15px 15px 0 0; z-index:10; }
.map-popup-content { border:1px solid var(--color-grey); background-color:var(--color-white); box-shadow:var(--box-shadow-hover); }
.map-popup .usun { position:absolute; top:0; right:0; width:30px; height:30px; }