body
{
	width: 100%;
	height:auto;
	background:  url("../images/background.jpg") no-repeat;
	margin: 0 auto;
    background-position: center 0;
	background-size:cover;
}
@media only screen and (max-width: 1000px) {
	body {
		background:  url("../images/background1.jpg")	#F07D00	no-repeat;
		background-position: center 0;
	}
	
}
@media only screen and (max-width: 770px) {
	body {
		background:  url("../images/background2.jpg") #F07D00 no-repeat;
		background-position: center 0;
	}
	
}
@media only screen and (max-width: 610px) {
	body {
		background:  url("../images/background3.jpg") no-repeat;
		background-position: center 0;
		min-height: 1180px;
	}
	
}

@media only screen and (max-width: 370px) {
	body {
		background:  url("../images/background4.jpg") no-repeat;
		background-position: center 0;
		
	}
}
.container
{	
    position: relative;
	margin: 0 auto;
	width:100%;
	height: 900px;
	background-position: center 0;	
}
.photo-left
{
	background: url("../images/left-name.png") no-repeat;

height: 226px;
	transform: scale(0.89);
	width: 600px;
margin: 0 auto;
}
.photo-right
{
	background: url("../images/right-name.png") no-repeat;
height: 226px;
	margin-top: 632px;
	transform: scale(0.89);
	width: 600px;
margin: 0 auto;	
}
.h2, h2
{
top: 77px;
position: absolute;
left: 93px;
font-family: Lato-black;
font-size: 44px;
text-transform: uppercase;
}
@media only screen and (max-width: 1500px) {	
	.photo-right, .photo-left
	{
		transform: scale(0.77);
	}	
}
.bip
{	
	height: 50px;
   background: url("../images/logo_bip.png") no-repeat;
    margin-top: 0;
	background-position: center;
margin-top: -10px;
background-position: center;
transform: scale(0.82);
}
@media only screen and (max-width: 1265px) {
.bip
{
	       margin-top: -4px;

}}
@media only screen and (max-width: 992px) {
.bip
{
	         margin-top: -29px;

}}
@media only screen and (max-width: 610px) {
.bip
{
	    margin-top: -4px;

}}
.name
{
	
	height: auto;
	margin-left: 39px;
margin-right: 40px;
margin-top: 669px;
}
@media only screen and (max-width: 1390px) {
.name {
	margin-top: 441px;
}}
@media only screen and (max-width: 1265px) {
.name {
 margin-left: -22px;
    margin-right: -24px;
    margin-top: 504px;
	min-width: 201px;
	
}}
@media only screen and (max-width: 1140px) {
.name {
 
    margin-top: 552px;	
}}
.page-left, .page-right
{
	margin-top: 60vh
}
.page-left
{
	margin-right: -253px;
}
.page-right
{
	margin-left: -261px;
}
@media only screen and (max-width: 1705px) {
	.page-left {
    margin-right: -48px;
	}	
	.page-right {
    margin-left: -58px;
}
}
@media only screen and (max-width: 1300px) {
	.page-left {
    margin-right: -113px;
	}
	.page-right {
    margin-left: -118px;
}
}
@media only screen and (max-width: 1000px) {
	.page-left, .page-right
{
	    margin-top: 305px;
		transform: scale(0.65);
		    
}
    .photo-right {
       margin-left: -71px;

}
    .photo-left {
       margin-left: -25px;

}
.name
{
	    margin-top: 450px;
}
}
@media only screen and (max-width: 919px) {
	.page-left
{
	    margin-right: -27px;
}
}
@media only screen and (max-width: 850px) {
	.page-left
{
	    margin-right: 85px;
}}
@media only screen and (max-width: 767px) {
.photo-right, .photo-left {
    transform: scale(0.618);
}
.photo-left {
    margin-left: -141px;
	    z-index: 111;
}
.photo-right {
    margin-left: -93px;
}
}
@media only screen and (max-width: 631px) {
.photo-left {
           margin-left: -143px;
	    z-index: 111;
}
}
@media only screen and (max-width: 767px)
{
	.page-right {
   
    width: 179px;}
}
@media only screen and (max-width: 610px)
{
	.page-right {
   
    width: auto;}
}
@media only screen and (max-width: 767px) {
	.photo-right {
   margin-left: 551px;
    margin-top: -771px;
    margin-bottom: -32px;
}}
@media only screen and (min-width: 610px) {
	.small{
		display: none;
	}
}
@media only screen and (max-width: 610px) {
		.photo-right, .photo-left {
    transform: scale(0.75);
}
	.center
	{
		display: none;
	}
	.name-left
	{
		height:120px;
		
	margin-right: -57px;
    margin-left: 160px;
	        margin-block-start: 19px;
	}
	.name-right{
	height:120px;
	
   margin-left: -149px;
    margin-right: 258px;
    margin-top: -137px;
	}
	.name
{
	    margin-top: -679px;
}
.photo-left {
	margin-left: -75px;
}
.photo-right {
    
     margin-left: 46px;
    margin-top: 339px;
}
.name-school{
    margin-right: -58px;	
}}
@media only screen and (max-width: 420px) {
	.name-right {
    
    margin-left: -138px;
    margin-right: 221px;
	}	
	.name-left {
    height: 120px;
    margin-right: -41px;
    margin-left: 126px;
	}
}
@media only screen and (max-width: 395px){
.photo-left {
       margin-left: -71px;
}
}
@media only screen and (max-width: 370px) {	
.name-left {margin-left: 85px;}

	.name-right {
        margin-right: 172px;
	}
}
@media only screen and (max-width: 365px){
.photo-left {
       margin-left: -78px;
}

}

@media only screen and (max-width: 355px) {
	.name-right {
    margin-left: -128px;
    margin-right: 158px;
}
.photo-right {
    margin-left: 10px;
margin-top: -186px;
margin-top: -29px;}
}
p {
    font-size: 17px;
	text-align: center;
	line-height: 18px;
}
@media only screen and (max-width: 992px) {
	.name {
 height: 227px;
    margin-left: -24px;
    margin-top: 466px;
    margin-bottom: 78px;
}
p {
    font-size: 16px;
}
}
	.h1, h1 {
		   
    text-align: center;
    top: 514px;
    position: absolute;
    text-align: center;
    left: 0;
	font-family: Lato-bold;
	}
	
		@media only screen and (max-width: 1670px) {
	     .h1, h1 { top: 466px; }
}
		@media only screen and (max-width: 1390px) {
	     .h1, h1 { top: 266px; }
}		
	@media only screen and (min-width: 1000px) {
	     .h1, h1 {  font-size: 22px;}
}
@media only screen and (max-width: 1000px) {
	     .h1, h1 {   top: 258px;
		 font-size: 18px;}
}
@media only screen and (max-width: 610px) {
p {
    font-size: 13px;
}
.h1, h1 {
font-size: 16px;
position: static;
color: white;
}
}
.name-school p
{
	color: white;
}
.name-school p:nth-child(3)
{
	font-family: Lato-bold;
}
p:nth-child(3), p:nth-child(5)
{
	font-family: Lato-regular;
}
@media only screen and (max-width: 610px) {
	.name-school p:nth-child(1)
{
	font-family: Lato-bold;
}
	.name-school p:nth-child(3)
{
	font-family: Lato-regular;
}
}
@media only screen and (min-width: 610px) {	
.name-school p:nth-child(3):before
{
	content: '';
	background:  url("../images/home.png") no-repeat;
	width: 37px;
height: 33px;
display: block;
margin: 0 auto;
transform: scale(0.72);
}
p:nth-child(4):before
{
	content: '';
	background:  url("../images/phone.png") no-repeat;
	width: 37px;
height: 33px;
display: block;
margin: 0 auto;
transform: scale(0.71);
margin-top: -5px;
}
p:nth-child(5):before
{
	content: '';
	background:  url("../images/mail.png") no-repeat;
	width: 37px;
height: 33px;
display: block;
margin: 0 auto;
transform: scale(0.72);
margin-top: -5px;
}
}
@media only screen and (max-width: 530px) {
p
{
	word-break: break-all;
}}
.welcome
{
	width: 209px;
	height: 57px;
	background: #ed522e;
top: 170px;
position: absolute;
left: 313px;
	
}
.arrow
{width: 29px;
	height: 40px;
	background:  url("../images/arrow.png") no-repeat;
	position: absolute;
left: 182px;
top: 11px;
transition-duration: 0.4s;
}
.welcome p 
{
	top: 19px;
position: absolute;
left: 32px;
color: white;
font-size: 25px;
}
@media only screen and (max-width: 1499px) {
	.welcome
{
	transform: scale(1.4) !important;
	top: 186px;	
}}	
@media only screen and (max-width: 1000px) {
	.welcome
{
	transform: scale(1.4) !important;
}}
@media only screen and (max-width: 610px) {
	.welcome p
{
	    transform: scale(1.2);;
}
}
.photo-left  h2
{
	color: #545454;
	transition-duration: 0.8s;
}
.photo-right  h2
{
	color: #ffff;
	top: 43px;
    left: 42px;
	text-align: center;
	padding-top: 37px;
	transition-duration: 0.8s;
}
.welcome p 
{
	font-family: Lato-black;
}
.logo
{
width: 100%;
height: 240px;
background: url("../images/logo.png") no-repeat;
top: 238px;
position: absolute;
left: calc(50% - 94px);
}
@media only screen and (max-width: 1390px) {
.logo
{
	top: 67px;
}}
@media only screen and (max-width: 1000px) {
.logo
{
	top: 91px;
    transform: scale(0.57);
}
}
@media only screen and (max-width: 992px) {
.logo
{
	min-width: 181px
}
}
@media only screen and (max-width: 610px) {
.logo
{
	top: -18px;
    transform: scale(0.42);
	 left: calc(50% - 130px);
}
	
}
@media only screen and (max-width: 525px) {
.logo
{
	top: -18px;
    transform: scale(0.42);
	left: calc(50% - 110px);
}
	
}
@media only screen and (max-width: 471px) {
.logo
{
	
	left: calc(50% - 113px);
}	
}
@media only screen and (max-width: 370px) {
.logo
{
top: -42px;
    transform: scale(0.26);
    left: calc(50% - 107px);	
}
}
.br 
{
	display: block;
}
.photo-left h2:hover
{
	opacity: 0.8;
	transition-duration: 0.8s
	
}
.photo-right h2:hover
{	
	opacity: 0.8;
	transition-duration: 0.8s	
}
.welcome:hover .arrow
{
	left: 188px;
	transition-duration: 0.4s;	
}
.center
{
	z-index: 4;
}
.left
{
	z-index: 3;
}
.right
{
	z-index: 2;
}
.tarcza
{	 
	background: url("../images/tarcza.png") no-repeat;
	position: absolute;
	width: 510px;
height: 559px;
bottom: 182px;
left: calc(50% - 255px);
}
@media only screen and (max-width: 1670px) {
.tarcza
{    bottom: 225px;
}}
@media only screen and (max-width: 1390px) {
.tarcza
{bottom: 382px;
    transform: scale(0.83);
}}
@media only screen and (max-width: 1320px) {
.tarcza
{    bottom: 378px;
}}
@media only screen and (max-width: 1265px) {
.tarcza
{    bottom: 381px;
}}
@media only screen and (max-width: 1000px) {
.tarcza
{    background: url("../images/tarcza2.png") no-repeat;
bottom: 433px;
width: 426px;
    height: 483px;
	transform: scale(1);
}}
@media only screen and (max-width: 610px) {
.tarcza
{   display: none;
}}
.bip_row
{
	z-index:180;
}