.container
	{
		display: grid;
		max-width: 1200px;
		border: 1px solid blue;
		margin: 0 auto;
		grid-template: repeat(2, minmax(100px, max-content)) / repeat(3, 200px);
		grid-auto-rows: minmax(100px, max-content);  /* Dodaje automatycznie nowe boxy w nowym rzedzie i ustawia im wysokosc minimalną na 100px i maksymalną na ilość contentu - ilości tekstu */
	/*  grid-auto-columns: 200px;  */
		grid-gap: 10px;
		justify-content: center;
		justify-items: center;   /* Wycentrowalo, albo skrocilo ?? zdjęcia */
	}
	
	.box
	{
		border: 1px solid red;
	}
	
	.box h3
	{
		text-align: center;
	}
	
	.box p
	{
		padding: 10px;
	}
	
	
	@media screen and (max-width: 650px)
	{
		.container
		{
			grid-template: repeat(2, 350px) / repeat(2, 200px);
			grid-auto-rows: 350px; 
		}
	}
	
	@media screen and (max-width: 450px)
	{
		.container
		{
			grid-template: repeat(2, 350px) / repeat(1, 200px);
			grid-auto-rows: 350px; 
		}
	}
	
	/* ====================================================================== */
	
	.container2
	{
		display: grid;
		max-width: 1200px;
		border: 1px solid blue;
		margin: 0 auto;
		margin-top: 100px;
		grid-template: repeat(2, 1fr) / repeat(3, 200px);
		grid-auto-rows: 1fr;  /* Dodaje automatycznie nowe boxy w nowym rzedzie i ustawia im wysokosc 200px */
	/*  grid-auto-columns: 200px;  */
		grid-gap: 10px;
		justify-content: center;
		justify-items: center;   /* Wycentrowalo albo skrocilo ?? zdjęcia */
		margin-bottom: 50px;
	}
	
	.box
	{
		border: 1px solid red;
		
	}
	
	.box .img
	{
		height: 133px;
		overflow: hidden;
	}
	
	.box h3
	{
		text-align: center;
	}
	
	.box p
	{
		padding: 10px;
	}
	
	
	@media screen and (max-width: 650px)
	{
		.container2
		{
			grid-template: repeat(2, 350px) / repeat(2, 200px);
			grid-auto-rows: 350px; 
		}
	}
	
	@media screen and (max-width: 450px)
	{
		.container2
		{
			grid-template: repeat(2, 350px) / repeat(1, 200px);
			grid-auto-rows: 350px; 
		}
	}
	
	
	/* ====================================================================== */
	
	
	.container3
	{
		display: grid;
		max-width: 1200px;
		border: 1px solid blue;
		margin: 0 auto;
		grid-template: repeat(2, minmax(100px, max-content)) / repeat(auto-fill, minmax(100px, 200px));
		grid-auto-rows: minmax(100px, max-content);  /* Dodaje automatycznie nowe boxy w nowym rzedzie i ustawia im wysokosc minimalną na 100px i maksymalną na ilość contentu - ilości tekstu */
	/*  grid-auto-columns: 200px;  */
	/*	grid-auto-columns: fit-content(400px); spr to */
		grid-gap: 10px;
		justify-content: center;
		margin-bottom: 50px;
	}
	
	.box
	{
		border: 1px solid red;
	}
	
	.box h3
	{
		text-align: center;
	}
	
	.box p
	{
		padding: 10px;
	}
	
	
	
	/* ====================================================================== */
	
	
	.container4
	{
		display: grid;
		max-width: 1200px;
		border: 1px solid blue;
		margin: 0 auto;
		grid-template: repeat(2, minmax(100px, max-content)) / repeat(auto-fill, minmax(100px, 1fr));
		grid-auto-rows: minmax(100px, max-content);  /* Dodaje automatycznie nowe boxy w nowym rzedzie i ustawia im wysokosc minimalną na 100px i maksymalną na ilość contentu - ilości tekstu */
	/*  grid-auto-columns: 200px;  */
	/*	grid-auto-columns: fit-content(400px); spr to */
		grid-gap: 10px;
		justify-content: center;
		margin-bottom: 50px;
	}
	
	.box
	{
		border: 1px solid red;
	}
	
	.box h3
	{
		text-align: center;
	}
	
	.box p
	{
		padding: 10px;
	}

	
	/* ====================================================================== */
	
	
	.container5
	{
		display: grid;
		max-width: 1200px;
		border: 1px solid blue;
		margin: 0 auto;
		grid-template: repeat(2, minmax(100px, max-content)) / repeat(auto-fit, minmax(100px, 1fr));
		grid-auto-rows: minmax(100px, max-content);  /* Dodaje automatycznie nowe boxy w nowym rzedzie i ustawia im wysokosc minimalną na 100px i maksymalną na ilość contentu - ilości tekstu */
	/*  grid-auto-columns: 200px;  */
	/*	grid-auto-columns: fit-content(400px); spr to */
		grid-gap: 10px;
		justify-content: center;
		margin-bottom: 50px;
	}
	
	.box
	{
		border: 1px solid red;
	}
	
	.box h3
	{
		text-align: center;
	}
	
	.box p
	{
		padding: 10px;
	}

	
	/* ====================================================================== */
	
	
	.container6
	{
		display: grid;
		max-width: 1200px;
		border: 1px solid blue;
		margin: 0 auto;
		grid-template: repeat(2, minmax(100px, max-content)) / fit-content(200px) fit-content(300px) 1fr;
		grid-auto-rows: minmax(100px, max-content);  /* Dodaje automatycznie nowe boxy w nowym rzedzie i ustawia im wysokosc minimalną na 100px i maksymalną na ilość contentu - ilości tekstu */
	/*  grid-auto-columns: 200px;  */
	/*	grid-auto-columns: fit-content(400px); spr to */
		grid-gap: 10px;
		justify-content: center;
		margin-bottom: 50px;
	}
	
	.box6
	{
		border: 1px solid red;
		text-align: center;
		
	}
	
	.box6 h3
	{
		text-align: center;
	}
	
	.box6 p
	{
		padding: 10px;
	}