/* style.css */

#ofertaContainer
{
	text-align : center;
	font-size : 16px;
}

#ofertaContainer p
{
	font-size : 150%;
	font-weight : bold;
}

#ofertaContainer li
{
	line-height : 150%;

}


#lewy
{
	text-align : left;
	float : left;
	width : 30%;
	margin-left : 20%;
}


#prawy
{
	text-align : left;
	float : left;
	width : 30%;
	margin-left : 0%;
}



.ofertaLista
{
	padding : 3%;
	border-style : solid;
	margin : 3%;
	margin-top :6%;
	border-radius : 10px;
	background : rgb(255,255,255, 0.9);	
}


footer
{
	margin-top : 2%;
}


@media only screen and (min-width: 2200px) 
{
	.ofertaLista
	{
		
		font-size : 150%;
	}	
}
@media only screen and (min-width: 2000px) 
{
	.ofertaLista
	{
		
		font-size : 150%;
	}	
}

@media only screen and (max-width: 1800px) 
{
	#lewy
	{
		text-align : left;
		float : left;
		width : 40%;
		margin-left : 10%;
	}

	#prawy
	{
		text-align : left;
		float : left;
		width : 40%;
		margin-left : 0%;
	}
	
	.ofertaLista
	{
		font-size : 150%;
	}
}


@media only screen and (max-width: 1500px) 
{
	#lewy
	{
		text-align : left;
		float : left;
		width : 40%;
		margin-left : 10%;
	}

	#prawy
	{
		text-align : left;
		float : left;
		width : 40%;
		margin-left : 0%;
	}
	
	.ofertaLista
	{
		
		font-size : 100%;
	}
		
}
@media only screen and (max-width: 1200px)
{
	.ofertaLista
	{
		margin-left : 10%;
		width : 80%;
		font-size : 200%;
	}
	
	#lewy 
	{
		clear : both;
		width : 100%;
		margin : 0;
	}
	
	#prawy
	{
		clear : both;
		width : 100%
	}
}
@media only screen and (max-width: 1050px)
{
	.ofertaLista
	{
		margin-left : 10%;
		width : 80%;
		font-size : 200%;
	}
	
	#lewy 
	{
		clear : both;
		width : 100%;
		margin : 0;
	}
	
	#prawy
	{
		clear : both;
		width : 100%
	}
}
@media only screen and (max-width: 900px)
{
	.ofertaLista
	{
		margin-left : 10%;
		width : 80%;
		font-size : 130%;
	}
	
	#lewy 
	{
		clear : both;
		width : 100%;
		margin : 0;
	}
	
	#prawy
	{
		clear : both;
		width : 100%
	}
}
@media only screen and (max-width: 800px)
{
	.ofertaLista
	{
		margin-left : 10%;
		width : 80%;
		font-size : 120%;
	}
	
	#lewy 
	{
		clear : both;
		width : 100%;
		margin : 0;
	}
	
	#prawy
	{
		clear : both;
		width : 100%
	}
}
@media only screen and (max-width: 700px)
{
	.ofertaLista
	{
		margin-left : 10%;
		width : 80%;
	}
	
	#lewy 
	{
		clear : both;
		width : 100%;
		margin : 0;
	}
	
	#prawy
	{
		clear : both;
		width : 100%
	}
}
@media only screen and (max-width: 600px)
{
	.ofertaLista
	{
		margin-left : 10%;
		width : 80%;
	}
	
	#lewy 
	{
		clear : both;
		width : 100%;
		margin : 0;
	}
	
	#prawy
	{
		clear : both;
		width : 100%
	}
}
@media only screen and (max-width: 450px)
{
	.ofertaLista
	{
		margin-left : 10%;
		width : 80%;
	}
	
	#lewy 
	{
		clear : both;
		width : 100%;
		margin : 0;
	}
	
	#prawy
	{
		clear : both;
		width : 100%
	}
}

@media only screen and (max-width: 400px)
{
	.ofertaLista
	{
		margin-left : 10%;
		width : 80%;
	}
	
	#lewy 
	{
		clear : both;
		width : 100%;
		margin : 0;
	}
	
	#prawy
	{
		clear : both;
		width : 100%
	}
}

@media only screen and (max-width: 350px)
{
	
	.ofertaLista
	{
		margin-left : 10%;
		width : 80%;
		font-size : 100%;
	}
	
	#lewy 
	{
		clear:both;
	}
	
	#prawy
	{
		clear : both;
	}
}