.naglowek
{
	width:50%;
	height:200px;
	margin: auto;
	position:sticky;
	top:0;
	
	
    -ms-transition: width 1s;
    -webkit-transition: width 1s;
    -moz-transition: width 1s;
    -o-transition: width 1s;
    transition: width 1s;
	
	
}


.naglowek:hover
{
	width:100%;
}


.tresc
{
	
	width: 50%;
	margin:auto;

    -ms-transition: width 1s;
    -webkit-transition: width 1s;
    -moz-transition: width 1s;
    -o-transition: width 1s;
    transition: width 1s;

}

.tresc:hover
{
	width:60%;
	
}


body
{
	width:100%;
	background-image:url('tlo.jpg');
	background-size:cover;
	
}

img
{
	width:100%;
	height:	100%;	
}

.tekstowa
{
	width:50%;
	height:50px;
	background-color:orange;
	margin:auto;
	font-family:"Courier New", Courier, monospace;
	font-size:40px;
	text-align:center;
	
	
    -ms-transition: transform 1s;
    -webkit-transition: transform 1s;
    -moz-transition: transform 1s;
    -o-transition: transform 1s;
    transition: transform 1s;
	
}

.tekstowa:hover
{
     -ms-transform: rotateY(180deg);
     -moz-transform: rotateY(180deg);
     -webkit-transform: rotateY(180deg);
     -o-transform: rotateY(180deg);
     transform: rotateY(180deg);
	
}


h1
{
	font-family:"Book Antiqua";
	font-size:30px;
	text-align:center;
}


@media only screen and (max-width:600px)
{
	.body
	{
		background-image:url('tlo3.jpg');
	}

	.tekstowa
	{
		width:100%;
		height:25px;
		background-color:lime;
		font-family:":Courier New", Courier, monospace;
		font-size:15px;
		font-weight:bold;
		
	}
	.naglowek
	{
		width:100%;
		height:100px;
		position:relative;
	}
	.naglowek:hover
	{
		width:90%;
	}
	
	.tresc
	{
		width:100%;
	}
	
	
	
	.h2
	{
		font-size:10px;
	}
}