* { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

:root {
	--zloty: #bc9204;

	--niebieski: #0c54a0;
	--tlo:#2b2a28;
	--txt:#fff;
	--txtJasny:#686661;

	--niebieski-jasny:#759CCE;
	--granatowy:#0B3973;
	--pomaranczowy:#ff5c00;


	--szary:#f1f1f1;
	--szary-ciemny:#e9e9e9;
	--transition2: color .2s ease, border-color .2s ease, background .2s ease;
	--transition5: color .5s ease, border-color .5s ease, background .5s ease;
	--transition1s: background-color .6s linear, transform .6s linear;

	--ha: bold 60px/1.2 Verdana, sans-serif;

	--opacity_0: visibility 0s .3s, opacity .3s linear;
	--opacity_1: opacity .3s linear;

	--transform:  transform 1s linear;
}

html {height: 100%}
body {
	color: var(--txt);
    background-color: var(--tlo);
	font-family: Tahoma, sans-serif;
	font-size: 16pt;
	font-weight: normal;
	line-height: 1;
	height: 100%;
	padding: 0 20px;
		-webkit-text-size-adjust: none;
}
article {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	min-height: 100vh;
}


h1 {
	width: 280px;
	height: 193px;
	display: block;
}
.prawo {
	max-width: 450px;
}
img {
	max-width: 100%;
	height: auto;
}

a {
	transition: var(--transition5);
	color: var(--txt);
	text-decoration: none;
	margin: 20px 0 0;
	display: block;
}
a span {
	transition: var(--transition5);
	color: var(--zloty);
	padding: 0 3px;
}
a:hover {
	text-decoration: none;
	color: var(--niebieski);
}





p {
	margin-bottom: 20px;
	line-height: 1.2;
}

.t {
    display: block;
    text-align: right;
	margin-top: 50px;
}


footer {
	padding: 50px 0;
	font-size: 14px;
	text-align: center;
	line-height: 1.4;
}
footer a {
	display: inline;
	border-bottom: 2px dotted var(--niebieski);
}
footer a:hover {
	color: var(--niebieski);
	border-color: transparent;
}



@media screen and (min-width: 810px) {

article {
	flex-direction: row;
}

h1 {
	width: 300px;
	height: 207px;
	margin-right: 20px;
	padding: 0;
}
.prawo {
	height: 350px;
	margin: 0;
	position: relative;
	border-left: 1px solid var(--txtJasny);
	padding-left: 50px;
}
.t {
	position: absolute;
	bottom: 0;
	right: 0;
}


}
@media (min-width: 1024px) {
body {padding:0}



} /* end */