html {height: 100%;} 
 
body {
font-family: 'Alegreya', sans-serif;
font-size : 14px;
color:#333;
} 


ul, ol{
  margin: 1em 0;
  padding: 0 0 0 20px;
  line-height:1.5;
}

p {line-height:1.5; padding-bottom:1em;}




input:focus, button:focus{outline:none;border:1px solid red}
hr {margin-top:5px; margin-bottom:5px; padding-top:5px; padding-bottom:5px}


li {padding-bottom:5px;}


/* UWAGA: trzeba zmineić font weight stosownie do czcionki jaką się zaimportowałeo z google... */
h1, h2, h3, h4, h5 {
font-family: 'Alegreya', sans-serif;
font-weight:bold;
}

h1 {font-size:2em;}
h2 {font-size:1.4em;}
h3 {font-size:1.17em;}
h4 {font-size:1.12em;}

.naglowek-podstrony {text-transform:uppercase; margin-bottom:50px;}
.naglowek-menu {text-transform:uppercase; margin-bottom:30px;}
@media only screen and (max-width:760px){
.naglowek-menu {margin-bottom:10px;}

}


.czcionka1 { font-family: 'Alegreya', sans-serif; }
.czcionka2 {font-family: 'Source Sans Pro', sans-serif;}

.lista1 ul {list-style: none;}
.lista1 ul li {  padding-left: 1.2em;} 
.lista1 ul li:before {
list-style:none;
font-family: standard;
content: '\0066';
font-size:0.5em;
display: inline-block;
margin-left: -1.2em; 
width: 1.2em; 
} 
.lista1 ul ul li{  padding-left: 2.2em;} 
.lista1 ul ul li:before {
list-style:none;
content: '\0066';
font-size:0.5em;
font-family: standard;
display: inline-block;
margin-left: -1.2em; 
width: 1.2em; 
} 




.tabela1  table{ width:100%; border-collapse:collapse; }
.tabela1 table td { padding:8px; border:0; }
.tabela1 table th {background:#3b202a; color:#fefefe;}
.tabela1 tr:nth-child(even) { /*(even) or (2n 0)*/}
.tabela1 table tr:nth-child(odd) { /*(odd) or (2n 1)*/background: #e8e8e8;}
.tabela1 table tr:last-child {border-bottom:solid 1px #3b202a }


.iko1 {}
.iko1:before {content: 'a' ;  font-family: standard;  display: inline-block;margin-right: 3px;}



main a:link, main a:visited, aside a:link, aside a:visited {
	color: #3b202a;
	outline:0;
	-webkit-transition:background-color .25s linear;
    transition:background-color .25s linear;
}

main a:active, main a:focus, main a:hover, aside a:active, aside a:focus, aside a:hover {
	background:#dbd8d8;
	color: #111111;
	outline:none;
}



.przycisk1:link{
font-size: 0.9em;
background-color: #3b202a;
color:#fefefe;
padding:10px 20px 10px 20px;
text-decoration:none;
color:#fefefe;
font-weight:300;
} 

.przycisk1:after {  content: '\0056' ;  font-family: standard; font-size:0.8em; display: inline-block;margin-left: 3px;vertical-align:middle;}
.przycisk1:link {}
.przycisk1:visited {color:#fefefe;}
.przycisk1:hover{
background-color: #3b202a !important;
border:none;
border-radius: 0px;
}

.przycisk1:focus {
background-color: #3b202a !important;
border:none;
border-radius: 0px;
outline:2px solid red

}



.przycisk2{
font-size: 0.8em;
text-transform:uppercase;
color:#3b202a;
padding:8px 15px 8px 15px;
text-decoration:none; background:none;border: solid 1px #3b202a;

} 
.przycisk2:after {  content: '\0046' ;  font-family: standard;  display: inline-block;margin-left: 3px;}
.przycisk2:link {color:#0a3f52;}
.przycisk2:visited{color:#0a3f52;}
.przycisk2:hover{
color:#cccccc;
background: #111111;
cursor:pointer; border-style:solid; border-width:1px; border-color:transparent;
}


.przycisk3{
font-size: 0.8em;
text-transform:uppercase;
color:#3b202a;
padding:8px 15px 8px 15px;
text-decoration:none; background:none;border: solid 1px #3b202a;

} 

.przycisk3:link {color:#0a3f52;}
.przycisk3:visited{color:#0a3f52;}
.przycisk3:hover{

background: #cccccc;
cursor:pointer; border-style:solid; border-width:1px; 
}



.przycisk-pobierz{
font-size: 0.8em;
border: solid 1px #3b202a;
padding:10px 20px 10px 20px;
text-decoration:none;

margin-left:50px;
} 

.przycisk-pobierz:after {  content: 'k' ;  font-family: standard;  display: inline-block;margin-left: 3px;}
.przycisk-pobierz:link {color:#333;}
.przycisk-pobierz:visited {color:#333;}
.przycisk-pobierz:hover{color:#333;
background: #3b202a;
cursor:pointer;
}




.pliki {background:#eee;padding-bottom: 10px;}
.pliki-grupa-naglowek {font-size:2.0em;padding:10px 20px 10px 20px;}
.plik-grupa {display:block; width:100%;}
.plik {display:block;  width:100%; padding:10px 20px 10px 20px;}
.plik-nazwa {font-size:1.2em}
.plik-ikona {font-size:1.2em}

#skipto{position:absolute;z-index:-999999;top:312px;}
#mainwrapper{width:100%;position:relative;text-align:left;}


.wrap80{width:85%; max-width:1500px;margin:0 auto;}


.wrapproc {width:80%; max-width:1400px; margin:0 auto;}
@media only screen and (max-width:1400px){
.wrapproc {width:95%}

}

p{padding-bottom:7px}



#headcontainerwr{}
#headcontainer {
position:relative;
}



.headerbip {border-bottom: solid 1px #ddd;}
.banerbip {display:block; height:190px; background: url("../images/biptlo.png") no-repeat center bottom; } 



#wyszukiwanie {float:right; position:relative; z-index:999;}
@media only screen and (max-width:720px){#wyszukiwanie {padding-top:10px;}}
.wyszukiwanie-input  {
display:inline-block;  
color:#3b202a;
border:solid 1px #5f5a5a;
background: #fefefe; 
font-size: 1.0em;
-webkit-transition:all 0.35s ease-in-out;
transition:all 0.35s ease-in-out;
width:180px;
margin:0;
padding: 5px 5px 6px 10px;
}
.wyszukiwanie-input:focus  {
background: #ffffff; 
width:250px;
}

.wyszukiwanie-przycisk {
font-size:1.1em;
border:solid 0px #ddd;
background: #ddd;
color:#333;
} 
.wyszukiwanie-przycisk:link {color:#3333;}
.wyszukiwanie-przycisk:visited {color:#333}
.wyszukiwanie-przycisk:hover{color:#333;
background: #ddd;
cursor:pointer;
}
.mapa-strony-elementy {position:relative; float:left; padding-left:20px}
.mapa-strony-elementy a:link, .mapa-strony-elementy a:visited {color:#fff; text-decoration:none;}
.mapa-strony-elementy a:hover {color:#f6f432; text-decoration:underline;}
.mapa-strony-napis {font-size: 0.2em; color:#aaa}

#godlo{float: left; padding:30px 0 0 50px;} /* div dla loga strony*/

#tytulstrony {float:left; padding-left:20px; padding-top:35px; position:relative;font-size:2em; color:#3b202a;margin-bottom:50px;}
#tytulstrony a:link, #tytulstrony a:visited, #tytulstrony a:hover {text-decoration:none; color:#333;}
#logo-prawa { float:right; padding-top:35px;padding-right: 50px; }
@media only screen and (max-width:760px){
#logo-prawa { display:none}
#tytulstrony {font-size:1.5em}

}

.logojednostki { width:250px; height:65px}
  
#maincontentcontainer{width:100%;}

.w100 {width:100%;}
.pt100 {padding-top:100px}


#maincontent{clear:both;line-height:1.2;position:relative;padding-top:0px;padding-bottom:20px;}
#metryka-strony-h {text-transform:uppercase; padding-bottom:30px}

#metryka-strony {margin-top:50px; padding-top:30px; border-top:solid 1px #ddd;}

#metryka-udost {float:left; width:45%; display:inline-block;}
#metryka-drukuj {float:left; width:25%; padding-left:30%; display:inline-block;}



.bloktresci {width: 90%; float:left; background:#fff; display: table-cell; border:solid 1px #e8e8e8; float:left; padding: 5%;  }
.bloktrescigl {width: 90%;  display: table-cell; background:#fff;  border:solid 1px #e8e8e8; float:left;  padding:5%; }

#trescwrap {margin-bottom:10px; }
.tresc {margin: 50px; font-family: 'Source Sans Pro', sans-serif;}

@media only screen and (max-width:720px){
.tresc {margin: 0}
}



.bottomcontainer {background:#ddd;}
.bottomcontainer a:link {color:#333; text-decoration:none;}
.bottomcontainer a:visited {color:#333; text-decoration:none;}
.bottomcontainer a:hover {color:#333; text-decoration:none;}

.bottomcontainer h1, .bottomcontainer h2, .bottomcontainer h3, .bottomcontainer h4 {} 



.stopka{padding:10px}



.opis{font-size:0.8em;}

.iko{float:left;padding-right:10px;color:#00ac49;display:inline-block;}
#banergllewa{padding-top:40px}
#licznik{font-size:0.8em;}


.powrot, .powrot:hover  { float:left; clear:both; text-decoration:none; padding-top:30px}

.powrot:before { content: '\0061' ;  font-family: standard; font-size:0.8em; vertical-align:middle;}

.ramka {border: solid 1px #5f5f5f; padding:5px; margin:5px} 
.sp {clear: both; width:100%; height:5px; display:block;}


#tlostrony {position:fixed; bottom:0; left:0; width:100%; height:100%;z-index:-2;}
.tlostrony-img {position:fixed; bottom:0; left:0; width:100%; height:100%;z-index:-2;}

.glowna-tlo {background: #fff; }


#ofertawrap {background:#cccccc}
#kontaktwrap {background:#3b202a}
#kontakt-tresc {color:#fefefe;line-height:1.2 }

#o-nas-tresc {color:#fefefe;line-height:1.2 }
#o-nas-tresc h1,#o-nas-tresc h2,#o-nas-tresc h3,#o-nas-tresc h4  {color:#ccc; }

#kontaktwrap h1, #kontaktwrap h2, #kontaktwrap h3, #kontaktwrap h4  {color:#fefefe; }

#kontakt-tresc {text-transform:uppercase}

#kontakt-tresc h1, #kontakt-tresc h2, #kontakt-tresc h3, #kontakt-tresc h4 {font-weight:400} 
#kontakt-tresc h1:before, #kontakt-tresc h2:before, #kontakt-tresc h3:before,#kontakt-tresc h4:before {content: '\0050' ;  font-family: standard; font-size:0.15em; vertical-align:middle;}
#kontakt-tresc h1:after, #kontakt-tresc h2:after, #kontakt-tresc h3:after,#kontakt-tresc h4:after  {content: '\0050' ;  font-family: standard; font-size:0.15em; vertical-align:middle;}

#kontakt-tresc a:link {
text-decoration : none;
color :#fefefe;
}

#kontakt-tresc a:visited {
text-decoration : none;
color : #fefefe;;
}
#kontakt-tresc a:hover {
text-decoration : none;
color : #fefefe;;
}
#kontakt-tresc a:active {
text-decoration : none;
color : #fefefe; ;
} 



.podstrony-lista-rzad {padding:10px; margin-bottom:10px;border:solid 1px #e8e8e8;border-left:solid 3px #3b202a;}



@media only screen and (min-width:1600px){

}

@media only screen and (max-width:1320px){
.wrap80{width:95%;}
}

@media only screen and (max-width:1100px){
.naglpodstrony{max-width:300px;}
}

@media only screen and (max-width:990px){

}

@media only screen and (max-width:800px){
body  {font-size : 16px;} 


}
@media only screen and (max-width:600px){
body  {font-size : 16px;} 


}

@media only screen and (max-width:480px){

h1 {font-size:1.3em;}
h2 {font-size:1.2em;}
h3 {font-size:1.15em;}
h4 {font-size:1.12em;}
span.kolko {	font-size:2em; border-radius: 1.2em;  -moz-border-radius: 1.2em;  -webkit-border-radius: 1.2em;  line-height: 2.4;  width: 2.5em;}



.naglpodstrony{
margin-top:-40px;
padding: 10px 40px 10px 10px;
-webkit-border-radius: 4px 30px 0 0;
border-radius: 4px 30px 0 0;}
#goracontainer{margin-bottom:20px;}
#podtytul {font-size:0.9em}
.pakiet_kol {float:left; max-width:98%}
}


.oferta-ikona  {font-size:5.0em;color:#cccccc; }
.oferta-ikona-kolko  {
display:inline-block;
    height:5.0em;
	width:5.0em;
	padding:1.0em;
    -moz-border-radius: 5.5em;
    -webkit-border-radius:5.5em;
    border-radius:5.5em;
	background:#3b202a;
	
}

#brandwrap {float:right}
#brand {}
#hostingnapis {}
#hostinglogo {}


#galeria-lista-kat {
display:block; text-align:center; width:100%; float:left;
}


.galeria-lista-kat-wpis {
padding:0 30px 10px 30px;
float:left;
width:300px; /* taka jak szer. obrazka */
padding-bottom:5px;
 dislay:inline-block;
 
}


#galeria-lista-kat {
display:block; text-align:center; width:100%; float:left;
}

.galeria-lista-wpis {
padding:0 20px 10px 20px;
float:left;
width:200px; /* taka jak szer. obrazka */
padding-bottom:5px;
 dislay:inline-block;
}


@media only screen and (max-width:600px){

}


#panelboczny h3 { font-weight:bold; color:#111111; padding: 10px 0 10px 0; }

#panelboczny h3 span { font-weight:normal;  color:#3b202a } 
.badge {font-size:0.8em; padding-left:50px}

#pasek-gorny {float:left; width:100%;   display:block; padding:15px 0 15px 0; background:#ddd;}


#pasek-gorny a:link, #pasek-gorny a:hover,#pasek-gorny a:visited,#pasek-gorny a:focus {color:#333; text-decoration:none}
#pasek-gorny a:hover {text-decoration}


/* WCAG  */
.kontrolkiwcag {float:left; position:relative; z-index:999; font-size:0.8em;}
.kolorykontrast {background:#00000 !important; color:#ffff00 !important; border-color:#ffff00 !important}   
.przyciskwcag {cursor:pointer;display:inline-block}
.przyciskwcag:focus {outline:2px solid red}
#skipnav a:link, #skipnav a:visited, #skipnav a:hover, #skipnav a:focus { color: #fff}

@media screen and (max-width: 760px) {
.kontrolkiwcag {font-size:0.8em}
}