section#start  {

	
	
	display: grid;
	grid-gap: 10px;
	grid-row-gap: 20px;
	
	grid-template-columns: auto;
	grid-template-rows: auto auto auto auto;
	grid-template-areas:
		'nagloweksekcji'
		'akapitsekcji'
		'przyciski'
		'obrazeksekcji';
		
			background-color: transparent;
			background-image: linear-gradient(180deg, rgba(20, 70, 89, 0.76) 0%, rgba(1, 43, 53, 0.76) 100%),
			url("https://reszek.pl/przechowywanie/2024/08/philipp-katzenberger-iIJrUoeRoCQ-unsplash.webp");
			transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
			background-size:cover;
	padding-top: 60px;
	padding-bottom: 100px;
	
	padding-left:15px;
	padding-right:15px;
	}
	
	section#start  > h1 {
		grid-area: nagloweksekcji;
		text-align: center;
		
		margin:0px;

	}
	
	section#start > p {
		grid-area: akapitsekcji;
		text-align: center;
		
		margin:0px;

	}
	
	section#start > div {
		grid-area: przyciski;
		text-align: center;
		
		justify-content: center;
		align-items:flex-start;
		/*background-color: rgba(255, 255, 255, 0.8);*/
	}
	
	section#start > div > a:first-of-type {
		text-align: center;

		

	}
	
	section#start > div > a:nth-of-type(2) {
		text-align: center;
		

	}
	
	section#start > img {
		grid-area: obrazeksekcji;

		
max-height: 100%;
				max-width: 100%;
				width: auto;
				margin: 0px auto;
		

	}
	
	
	/* kolejna sekcja */
	
section#czynnikiwspolpracy  {

	
	display: grid;
	grid-gap: 10px;
	grid-row-gap: 20px;
	
	grid-template-columns: auto;
	grid-template-rows: auto auto auto;
	grid-template-areas:
		'czynnik1'
		'czynnik2'
		'czynnik3';
		
	margin-top: -80px;
	padding-left:30px;
	padding-right:30px;
	}
			
			section#czynnikiwspolpracy > div {
				text-align:center;
				padding:15px;
				background:white;
			}				
				
			section#czynnikiwspolpracy > div:nth-child(1)  {
				grid-area: czynnik1;
			}
			
			section#czynnikiwspolpracy > div:nth-child(2)  {
				grid-area: czynnik2;
			}
			
			section#czynnikiwspolpracy > div:nth-child(3)  {
				grid-area: czynnik3;
			}
	/* kolejna sekcja */
	
	section#o-mnie {
		display: grid;
		grid-gap: 10px;
		grid-row-gap: 20px;
		
				grid-template-areas:
				'tytulomnie'
				'zdjecie'
				'opisomnie'
				'przycisk';
				
			padding-left:30px;
	padding-right:30px;
	padding-bottom:30px;
	}
	
			section#o-mnie > h3.bigtitle {
				grid-area: tytulomnie;
				text-align:center;
			}
			
			section#o-mnie > img {
				grid-area: zdjecie;
        max-width: 100%;
			}
			
			section#o-mnie > p {
				grid-area: opisomnie;

			}
			
			section#o-mnie > a {
				grid-area: przycisk;
				
				margin-left:auto;
				margin-right:auto;
				width:max-content;

			}
			
			
	/* kolejna sekcja */
	
	section#oferta {
		display: grid;
		grid-gap: 10px;
		grid-row-gap: 20px;
		
				grid-template-areas:
				'tytuloferta'
				'akapitoferty'
				'swizytowka'
				'sblog'
				'switryna'
				'akapitoferty2';
				
			padding-left:30px;
	padding-right:30px;
	
	
				background-color: #0D5E6B;
			
			
			background-image: linear-gradient(180deg, rgba(13, 94, 107, 0.5) 0%, rgba(20, 70, 89, 0.5) 100%),
			url("https://reszek.pl/przechowywanie/2024/08/noshad-ahmed-y9np19Fprmo-unsplash.webp");
			background-attachment: fixed;
			transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
			background-size:cover;
			
			padding-bottom:20px;
	}
	
	
			section#oferta > h2.bigtitle {
				grid-area: tytuloferta;
				text-align:center;
			}
			
			section#oferta > p:nth-child(2) {
				grid-area: akapitoferty;
				text-align:center;
				margin-bottom:0px;
				margin-top:0px;
			}
			
			section#oferta > div:nth-child(3)  {
				grid-area: swizytowka;
			}
			
			section#oferta > div:nth-child(4)  {
				grid-area: sblog;
			}
			
			section#oferta > div:nth-child(5)  {
				grid-area: switryna;
			}
			
			section#oferta > div.multi-v:nth-child(3),
			section#oferta > div.multi-v:nth-child(4),
			section#oferta > div.multi-v:nth-child(5)			{
				text-align:center;
				padding:15px;
				margin-bottom:auto;
					
			}

			section#oferta > div.multi-v:nth-child(3) > a,
			section#oferta > div.multi-v:nth-child(4) > a,
			section#oferta > div.multi-v:nth-child(5) > a			{
				margin-left:auto;
				margin-right:auto;
					
			}			
			
			section#oferta > div:nth-child(6) {
				grid-area: akapitoferty2;
				text-align:center;
			}
			
			section#oferta > div:nth-child(6) > ul {
				grid-area: lista;
				text-align:center;
				
				list-style-type: '- ';
				list-style-position: inside;
				margin:0;
				padding:0;
			}
			
			section#oferta > div:nth-child(6) > p { 
				margin:0;
			}

	/* kolejna sekcja */
	
	section#kontakt{
			display: grid;
			grid-row-gap:15px;
			grid-template-areas:
				'tytulkontakt'
				'akapitkontakt'
				'emailto'
				'contactform';
				
			grid-template-columns: 1fr;
			
			grid-template-rows: min-content min-content 1fr;
			
			
			padding-left:30px;
			padding-right:30px;
			
			padding-bottom:20px;
		}
		
	section#kontakt > h3.bigtitle {
			grid-area: tytulkontakt;
			text-align:center;
		}
		
	section#kontakt > p {
			grid-area: akapitkontakt;
			text-align:center;
			margin:0px;
		}
		
	section#kontakt > address {
			grid-area: emailto;
			text-align:center;
		}
		
	section#kontakt > address > a {
			font-style: normal;
			font-weight: bold;
		}
		
	section#kontakt > .iconontopcontainer {
		
				--background-image-lazy: url('https://reszek.pl/przechowywanie/2024/08/email-ikona.webp');
				background-image: var(--background-image-lazy);
				

			padding-top: 115px;
			margin-top:40px;
			background-size: 100px 100px;
			
		}
	
	section#kontakt > form#contactform{
		grid-area: contactform;
		background-image: linear-gradient(180deg, #144659 0%, #238C8C 100%);
		margin-top:40px;
	}
	/* formularz kontaktowy */
	
	.simple-contact-form {
		--gap: 20px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		gap: var(--gap);
		padding: var(--gap);
		margin:0px;
	}

	.simple-contact-form > p {
		 flex-basis: 100%;
		 margin:0px;
		}
		
	.simple-contact-form > p > input {
		 display:block;
		 width:100%;
		 box-sizing: border-box;
		}
		
	.simple-contact-form > p > textarea {
		 display:block;
		 width:100%;
		 box-sizing: border-box;
		}
		
	.simple-contact-form > p > button {
		 display:block;
		 margin-left:auto;
		 margin-right:auto;
		}
		
	.simple-contact-form > p > label {
		 display:block;
		}

	.simple-contact-form > p > label > strong > span {
		 color:red;
		}

	.simple-contact-form > p > label > span > a {
		 text-decoration: underline;
		}


	.simple-contact-form > p:nth-child(1),
	.simple-contact-form > p:nth-child(2),
	.simple-contact-form > p:nth-child(3),
	.simple-contact-form > p:nth-child(4){
			flex-basis: calc(50% - var(--gap) / 2);
	}