@media only print{
	body *{
		display:none !important
	}
	body:after{
		content:"Żyj ekologicznie! Nie marnuj papieru!"
	}
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{ 
	margin:0;
	padding:0
}

@media (max-width:900px){
	@-webkit-viewport{
		width:1024px
	}

	@-ms-viewport{
		width:1024px
	}

	@viewport{
		width:1024px
	}
}

html{
	height:100%
}

table{
	border-collapse:collapse;
	border-spacing:0
}

fieldset,img{ 
	border:0
}

address,caption,cite,code,dfn,em,strong,th,var{
	font-style:normal;
	font-weight:normal
}

ol,ul{
	list-style:none
}

caption,th{
	text-align:left
}

h1,h2,h3,h4,h5,h6{
	font-size:100%;
	font-weight:normal
}

q:before,q:after{
	content:''
}

abbr,acronym{
	border:0
}

body{
	height:100%;
	background:rgb(187,181,185);
	font-family:Verdana,Geneva,sans-serif;
	font-weight:normal;
	display:table;
	table-layout:fixed;
	padding:0 10%
}

a{
	color:#111;
	text-decoration:none
}

::-moz-selection{
	background:#b5f53a;
	color:#000
}

::selection{
	background:#b5f53a;
	color:#000
}

@font-face{
	font-family:'Codystar';
	font-style:normal;
	font-weight:400;
	font-display:swap;
	src:url('../fonts/codystar-regular.woff2') format('woff2')
}

@font-face{
	font-family:'StrefaPiIconsRegular';
	font-style:normal;
	font-weight:normal;
	font-display:swap;
	src:url('../fonts/icons.woff2') format('woff2')
}

.main{
	width:calc(100vw - 500px - 10%)
}

.back{
	width:65px;
	height:51px;
	background:rgba(0,0,0,.2);
	border:0;
	margin-right:19px;
	margin-bottom:100px;
	padding-top:29px;
	padding-left:10px;
	padding-right:10px;
	font-family:'StrefaPiIconsRegular';
	font-size:37px;
	color:#fafafa;
	text-align:center;
	display:block;
	float:left;
	border-radius:2px;
	-webkit-backdrop-filter:blur(5px)
	backdrop-filter:blur(5px)
}

.box{
	width:318px;
	height:271px;
	background:url('../images/box_open_close.png');
	margin-top:-13px;
	margin-left:490px
}

.box:hover{
	background-position:-320px
}

#strefapi_bok{
	font-size:12px;
	color:#111;
	line-height:19px;
	display:table-row
}

#strefapi_bok_error{
	position:absolute;
	bottom:130px
}

#strefapi_bok_error_name{
	font-family:"Codystar",sans-serif;
	font-weight:400;
	font-style:normal;
	font-size:56px;
	color:#111;
	line-height:41px
}

#strefapi_copyright{
	font-size:10px;
	color:#111;
	line-height:15px;
	display:table-row;
	height:87px
}

.rain{
	display:none !important;
	position:absolute;
	left:0;
	width:100%;
	height:100%;
	z-index:-1;
	overflow:hidden
}

.rain.back-row{
	display:none;
	bottom:60px;
	opacity:.5
}

body.back-row-toggle .rain.back-row{
	display:block
}

.drop{
	position:absolute;
	bottom:100%;
	width:15px;
	height:120px;
	pointer-events:none;
	animation:drop .5s linear infinite
}

@keyframes drop{
	0%{
		transform:translateY(0vh)
	}
	75%{
		transform:translateY(90vh)
	}
	100%{
		transform:translateY(90vh)
	}
}

.stem{
	width:1px;
	height:60%;
	margin-left:7px;
	background:linear-gradient(to bottom,rgba(100,100,100,0),rgba(100,100,100,.9));
	animation:stem .5s linear infinite
}

@keyframes stem{
	0%{
		opacity:1
	}
	65%{
		opacity:1
	}
	75%{
		opacity:0
	}
	100%{
		opacity:0
	}
}

.splat{
	width:15px;
	height:10px;
	border-top:2px dotted rgba(100,100,100,.9);
	border-radius:50%;
	opacity:1;
	transform:scale(0);
	animation:splat .5s linear infinite;
	display:none
}

body.splat-toggle .splat{
	display:block
}

@keyframes splat{
	0%{
		opacity:1;
		transform:scale(0)
	}
	80%{
		opacity:1;
		transform:scale(0)
	}
	90%{
		opacity:0.5;
		transform:scale(1)
	}
	100%{
		opacity:0;
		transform:scale(1.5)
	}
}