@font-face { font-family: 'Delicious'; src: url('fonty/Cambay/Cambay-Regular.ttf'); } 
@font-face { font-family: 'Delicious'; font-weight: bold; src: url('fonty/Cambay/Cambay-Bold.ttf');}

@font-face { font-family: 'Montserrat'; src: url('fonty/Montserrat/Montserrat-Regular.ttf'); } 
@font-face { font-family: 'Montserrat'; font-weight: bold; src: url('fonty/Montserrat/Montserrat-SemiBold.ttf');}

html{
	scroll-behavior:smooth;
}

html, body{
	width:100%;
	margin:0;
	padding:0;
}

header, article, footer{
	width:100%;
}

* {
  box-sizing: border-box;
	font-family:Montserrat, Delicius, verdana, sans-serif;
}

* a{
	color:#FF6600;
	text-decoration:none;
}

* a:visited{
	color:#FF6600;
	text-decoration:none;
}

div#otokaGlowna, div#gora, div#baner{
	width:100%;
}

#baner{
	margin-top:10vh;
	margin-bottom:3vh;
	padding-bottom:3vh;
}

nav{
	width:100%;
	text-align:right;
}

.otokaSekcji{
	width:80%;
	margin:auto;
}

.flex{
	display:flex;
}

.column{
	flex-direction:column;
	justify-content:center;
	align-items:center;
}

.row{
	flex-direction:row;
	justify-content:center;
	align-items:stretch;
}

header{
	background-color:#666666;
	background-image:url("img/tloBaner01cza.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

article{
	padding-top:7vh;
	padding-bottom:7vh;
}

h1{
	font-size:4.6vw;
	font-variant:small-caps;
	text-align:center;
}

h2{
	font-size:3.2vw;
	font-variant:small-caps;
	text-align:center;
}

h3{
	font-size:2.2vw;
	text-align:center;
}

p{
	font-size:1.4vw;
}

#gora{
	position:fixed;
	top:0;
	left:0;
	margin:0;
	height:10vh;
	background-color:#FFFFFF;
	box-shadow:0px 2px 2px #666666;
}

#otokaMenu{
	position:relative;
	width:100%;
	margin:auto;
}


#logo{
	height:10vh;
	line-height:10vh;
	padding-left:2vw;
	position:absolute;
	left:0px;
}

#logo span{
	line-height:10vh;
	font-size:3.2vw;
}

#logo a span{
	color:black;
}

#logo a:visited span{
	color:black;
}

#menu{
	height:10vh;
	position:absolute;
	right:0px;
}

#menuElementy{
	height:10vh;
	display:block;
}

#menuElementy a{
	display:inline-block;
	height:10vh;
}

#menuElementy span{
	padding:0;
	margin:0;
	display:inline-block;
	height:10vh;
	line-height:10vh;
	padding-left:1vw;
	padding-right:1vw;
	font-variant:small-caps;
	font-size:1.6vw;
}

#menuElementy span:hover{
	background-color:#FF8000;
	color:white;
}

#hamburger{
	display:none;
}

#tresciBanera{
	color:white;
	padding:2vh 0 5vh 0;
}

#ikonaBanera{
	width:8vw;
	height:auto;
}

#zadzwonBaner{
	color:#FFFFFF;
	text-align:center;
	margin:0;
	padding:2vw 4vw;
	border:2px solid #FFFFFF;
	border-radius:4vw 4vw 4vw 4vw;
	animation-name:animNarozniki;
	animation-iteration-count:infinite;
	animation-duration:4.5s;
	animation-timing-function:linear;
}

@keyframes animNarozniki{
	0% {border-radius:4vw 4vw 4vw 4vw;}
	25%{border-radius:1vw 1vw 1vw 1vw;}
	50%{border-radius:4vw 4vw 4vw 4vw;}
	75%{border-radius:1vw 1vw 1vw 1vw;}
}

#zadzwonBaner span a{
	font-size:2.8vw;
	
}

#zadzwonBaner span a img.ikonaTelefonBaner{
	height:2.8vw;
	width:auto;
}

.ikonaTelefon{
	width:auto;
	height:1.4vw;
}

.dwieKolumny{
	column-count:2;
	column-gap:5vw;
}

.dwieKolumny p{
	margin-top:0;
	text-indent:3vw;
}

.kolumna50{
	width:50%;
}

.kolumna50 p{
	text-indent:3vw;
}

.kolumna50#imgKomBia{
	background-image:url("img/imgOfertaBia.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

article#oferta{
	background-image:url("img/ban03nie.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

#wlasnaStrona p{
	text-align:justify;
}

#oferta li{
	font-size:1.6vw;
}

article.bg000066{
	background-color:#000066;
	color:white;
}

footer{
	background-color:#000000;
	color:white;
	padding-top:5vw;
	padding-bottom:5vw;
}

footer p{
	margin:2vw auto 2vw auto;
}

#social{
	margin:2vh auto 2vh auto;
}

img.ikonaSekcji{
	width:10vw;
	height:auto;
}

.noMargin{
	margin:0;
}

p.center{
	text-align:center;
	text-indent:0;
}

.bigP{
	font-size:2vw;
}

.otokaSekcji h2{
	margin-top:0.5vh;
	margin-bottom:2vh;
}

.otokaSekcji h3{
	margin-top:1vh;
	margin-bottom:1.5vh;
}

.block{
	display:block;
}

#tresciBanera h1{
	position:relative;
	animation-name:animH1Ban;
	animation-duration:2s;
}

.doPrawej{
	text-align:right;
}

.gruby{
	font-weight:bold;
}

@keyframes animH1Ban{
	0% {top:-15vw;}
	100% {top:0;}
}

#tresciBanera h2{
	animation-name:animH2Ban;
	animation-duration:1.8s;
	animation-delay:1.5s;
	animation-fill-mode:both;
}

@keyframes animH2Ban{
	0% {opacity:0;}
	50% {opacity:0.5;}
	100% {opacity:1;}
}

/* --------- KONTAKT ---------- */

form input[type="text"]{
	width:50%;
	font-size:1.4vw;
}

form p input + label::before{
	content:" - ";
}

form textarea{
	width:100%;
	height:50vh;
	padding:0.5vw;
	font-size:1.4vw;
}

form input[type="submit"]{
	font-size:1.4vw;
	background-color:white;
	border:1px solid #666666;
	border-radius:6px;
	margin:0.5vw;
}

form input[type="submit"]:hover{
	box-shadow:0.4vw 0.4vw 0.4vw #666666;
}

form input[type="reset"]{
	font-size:1.4vw;
	background-color:white;
	border:1px solid #666666;
	border-radius:6px;
	margin:0.5vw;
}

form input[type="reset"]:hover{
	box-shadow:0.4vw 0.4vw 0.4vw #666666;
}

/* ----- KONTAKT END ----------- */

@media all and (max-width: 640px) and (orientation: portrait){

	*{
		font-size:4vw;
		font-family:Montserrat, Delicius, verdana, sans-serif;
	}

	header{
		margin-bottom:0;
		padding-bottom:2vh;
	}

	article{
		padding-top:2vh;
		padding-bottom:2vh;
	}
	
	footer{
		padding-top:2vh;
		padding-bottom:2vh;
	}
	
	h1{
		font-size:7vw;
		font-variant:small-caps;
	}

	h2{
		font-size:5.2vw;
		font-variant:small-caps;
	}

	h3{
		font-size:4.2vw;
	}

	p{
		font-size:4vw;
	}

	.bigP{
		font-size:4.2vw;
	}
	
	#tresciBanera{
		margin-top:9vh;
		color:#FFFFFF;
		padding-top:0vh;
		padding-bottom:3vh;
	}
	
	#ikonaBanera{
		width:16vw;
		height:auto;
	}
	
	.dwieKolumny{
		column-count:1;
		column-gap:0;
	}

	#oferta li{
		font-size:4vw;
	}
	
	#zadzwonBaner span a{
		font-size:6vw;
	}
	
	#zadzwonBaner{
		margin:0;
		padding:2.4vw 4vw;
		border:2px solid #FFFFFF;
	}
	
	footer p {
		margin:2vw auto 2vw auto;
	}
	
	footer p span.block{
		margin:5vw auto 5vw auto;
	}
	
	.nrTel a{
		font-size:5vw;
	}
	
	.nrTel a img.ikonaTelefon{
	height:4vw;
	width:auto;
	}
	
	#zadzwonBaner span a img.ikonaTelefonBaner{
		height:4vw;
		width:auto;
	}
	
	.adresEmail a{
		font-size:5vw;
	}
	
	.adresEmail a img.ikonaTelefon{
		width:5vw;
		height:auto;
	}
	
	#gora{
		height:10vh;
	}
	
	#logo{
		line-height:10vh;
		padding-left:1vh;
	}

	#logo span{
		font-size:4vh;
	}
	
	#logo a span{
		color:#ff8000;
	}
	
	#otokaMenu{
		width:100%;
		height:10vh;
		position:relative;
		/*background-color:yellow;*/
	}
	
	#menu{
		line-height:9vh;
		text-align:right;
		display:inline-block;
		font-size:8vw;
		width:100%;
		position:absolute;
		top:0;
		left:0;
		width:100%;
		/*background-color:blue;*/
	}

	#menuElementy{
		padding:0;
		margin:auto;
		display:flex;
		display:none;
		position:absolute;
		overflow:hidden;
		top:9vh;
		height:84vh;
		left:0px;
		width:100vw;
		text-align:center;
		flex-direction:column;
		/*background-color:cyan;*/
	}
	
	#menuElementy.animujMenu{
		/*height:0vh;*/
		display:flex;
		-webkit-animation-name: wysMenu;
		-webkit-animation-duration: 2s;
		-webkit-animation-timing-function: linear;
		-webkit-animation-fill-mode: forwards;
		animation-name: wysMenu;
		animation-duration: 1.2s;
		animation-timing-function: linear;
		animation-fill-mode: forwards;
	}
	
	@keyframes wysMenu {
	0%   {height:0vh;}
	20%  {height:56vh;}
	25%  {height:84vh;}
	40%  {height:72vh;}
	50%  {height:70vh;}
	60%  {height:72vh;}
	96%  {height:78vh;}
	100% {height:84vh;}
	}
	
	@-webkit-keyframes wysMenu{
	0%   {height:0vh;}
	25%  {height:84vh;}
	50%  {height:70vh;}
	100% {height:84vh;}
	}
	
	#menuElementy a{
		padding:0;
		display:flex;
		flex-direction:column;
		justify-content:center;
		flex:1;
		/*height:21vh;
		line-height:21vh;*/
		background-color:#ff8000;
		margin:0px 0vh 0px 0vh;
		color:white;
		border:0.5vh solid white;
		border-width:0 0 0.5vh 0;
	}

	#menuElementy span{
		padding:0;
		display:inline;
		font-variant:small-caps;
		font-size:5.2vw;
	}
	
	#hamburger{
		display:inline-block;
		position:relative;
		/*right:0;
		background-color:green;*/
		width:10vw;
		text-align:center;
		font-size:7vh;
		line-height:9vh;
	}
	
	img.ikonaSekcji{
		width:18vw;
		height:auto;
	}
	
	div.bckImg{
		display:none;
	}
	
	div.rowOrCol{
		flex-direction:column;
	}
	
	.kolumna50{
		width:100%;
	}
	
	p.linkDoDzialu a{
		font-size:5vw;
	}
	
	/* --------- KONTAKT ---------- */

	form input[type="text"]{
		width:100%;
		font-size:3vw;
	}

	form p label::before{
		content:"";
	}

	form textarea{
		width:100%;
		height:50vh;
		padding:0.5vw;
		font-size:3vw;
	}

	form input[type="submit"]{
		font-size:6vw;
		background-color:white;
		border:1px solid #666666;
		border-radius:6px;
		margin:0.5vw;
	}

	form input[type="submit"]:hover{
		box-shadow:1vw 1vw 1vw #666666;
	}

	form input[type="reset"]{
		font-size:6vw;
		background-color:white;
		border:1px solid #666666;
		border-radius:6px;
		margin:1vw;
	}

	form input[type="reset"]:hover{
		box-shadow:1vw 1vw 1vw #666666;
	}
	
	form input[type="reset"]{
		display:none;
	}
/* ----- KONTAKT END ----------- */
	
}