body {	
	background: black;
	font-family: SpecialElite;
	font-size: 16px;
	color:#000;
}

@font-face{
	font-family: 'SpecialElite';
	src: url('../fonty/SpecialElite.eot');
	src: local(' '), url('../fonty/SpecialElite.woff') format('woff'), url('../fonty/SpecialElite.ttf') format('truetype'), url('../fonty/SpecialElite.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}
	
.kontener {
	position: relative;
	overflow: hidden;
	margin: 0 auto;
	width: 1198px;
	height: 800px;		
	background-image:url(../img/maszyna.jpg);
	background-position:bottom;
}
/*powrót*/
a {
	display:block;
	position:relative;
	top:700px;
	font-family: 'Pinyon Script', cursive;
	font-size: 66px;
	text-decoration:none;
	margin-left:80px;
	color:#F0D8B3;
	opacity: 0.6;
	transition: 0.5s;
}

a:hover { 
	opacity: 1;
	text-shadow:5px 5px 3px #000;
}

div, h3 {
	display:block;
	position:absolute;
}
/*formatowanie karteczek-linków*/
h3 {	
	width: 270px;
	height: 77px;
	margin-left: 30px;
	background-image:url(../img/karteczka.png);	
	padding: 25px 0 0 0;
	text-align:center;
	/*wyłączenie opcji zaznaczania textu*/
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: default;
}

h2, h4 {
	text-align: center;
}

.kartka {
	width: 560px;
	height: 680px;
	background-image:url(../img/kartka.jpg);
	background-size: 680px;
	top: 700px;
	left: 460px;

	padding-bottom:100px;
}

.tresc{
	width: 530px;
	height: 630px;
	top:10px;
	overflow-y: auto;
	overflow-x: hidden;
	text-indent: 20px;
	font-size: 13px;
	word-spacing: 0.2em;
	padding-left: 30px;
}

/*dolna częśc maszyny do pisania*/
#maska {
	display:block;
	position:absolute;
	background-image:url(../img/maszyna-mask.png);
	width:779px;
	height:163px;
	bottom: 0px;
	right: 35px;
	z-index: 3;
}

/*rotacje karteczek*/

#relacja{top:10px; transform:rotate(5deg); transition: all 0.3s ease-in-out; -webkit-transform:rotate(5deg); -webkit-transition: all 0.3s ease-in-out;}
#godzinaw{ top:90px; left:70px; transform:rotate(-5deg); transition: all 0.3s ease-in-out; -webkit-transform:rotate(-5deg); -webkit-transition: all 0.3s ease-in-out;}
#przyprod{ top:170px;  z-index:2; transform:rotate(5deg); transition: all 0.3s ease-in-out; -webkit-transform:rotate(5deg); -webkit-transition: all 0.3s ease-in-out;}
#natarcie{ top:240px; left:120px; z-index:1; transition: all 0.3s ease-in-out;  -webkit-transition: all 0.3s ease-in-out;}
#fotoreportera{ top:320px; left:20px;  z-index:2; transform:rotate(-5deg); transition: all 0.3s ease-in-out; -webkit-transform:rotate(-5deg); -webkit-transition: all 0.3s ease-in-out;}

h3#relacja:hover { transform: rotate(0deg); -webkit-transform: rotate(0deg)}
h3#godzinaw:hover {transform: rotate(0deg); -webkit-transform: rotate(0deg)}
h3#przyprod:hover {transform: rotate(0deg); -webkit-transform: rotate(0deg)}
h3#natarcie:hover {transform: rotate(-5deg); -webkit-transform: rotate(-5deg)}
h3#fotoreportera:hover {transform: rotate(0deg); -webkit-transform: rotate(0deg)}