/*----------------------Czcionki---------------------*/

.roboto-mono-<uniquifier> {
  font-family: "Roboto Mono", monospace;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}


body
{
	margin : 0 !important;
	font-family: 'Roboto Condensed', sans-serif;
}

a
{
	text-decoration : none;
	color : #000000;
}

#container
{
	width : 100%;
	margin : 0;
}

/*------------------------NAVI------------------------------*/

header
{
	position: sticky;
	top: 0;
	z-index : 99;
}

.nav
{
	background-color : #1a1a1a;
	opacity : 0.95;
	display : flex;
	align-items: center;
	justify-content: space-between;
}

#logo
{	
	margin : 0;
	padding : 5%;
	color : #c02906;
	font-weight : 700;
	font-size:200%;
	text-decoration : none;
	text-underline-offset : 5px;
	text-decoration :   underline ;

}

.nav a.active
{
	color : #c02906;
}

#menuButton
{
	font-size : 250%;
	color : #c02906;
	display : block;
	margin-right : 5%;
}

.icon-menu 
{
	color : #c02906;
}



/*-----------Responsywne menu - dropDown-------------------*/

.menu 
{
	display : none;
}

.menu2
{
	display : none;	
	width : 60%;
}

.menu2 ul
{
	text-align : center;
	padding : 0;
	margin : 0;
	font-size : 150%;	
	display : flex;
	flex-direction : row;
	margin : auto;
	width : 100%;
}

.menu2 ul li 
{
	width : 20%;
	list-style : none;		

}


.menu2 a
{
	color : #a0a0a0;
}

.menuResponsive
{
	display : flex;
	flex-direction : column;
	position : absolute;
	background-color : #cccccc;
	box-shadow: 0px 8px 16px 0px rgba(1,2,3,0.8);
	width : 100%;

}

.menuResponsive ul
{
	text-align : center;
	padding : 0;
	margin : 0;
	font-size : 150%;
}

.menuResponsive li
{
	list-style : none;
	padding : 5%;
	border-bottom: 1px solid silver;
	z-index : 1;
}

.menuResponsive li:hover
{
	background-color : #888888;
}




/*------------------Footer--------------------*/
footer
{
	height : auto;
	background : #1a1a1a;
	text-align : center;
	color : #a0a0a0;
	display : flex;
	flex-direction : column;
	align-items: center;
}

.footerTile
{
	width : 90%;
	padding : 10px;
	padding-top : 30px;
}

.footerTile H1
{
	font-size : 150%;
}

.footerTile p
{
	font-size : 120%;
}

.footerTile ul
{
	list-style-type: none;
	padding : 0px;
	margin : 0px;
	font-size : 120%;
	padding : 10px;
}

.footerTile ul li
{
	padding : 10px;

}

.footerTile a
{
	padding : 10px;
	border-radius : 5px;
	color : #a0a0a0;
}

.footerTile a:hover
{
	background: #666666;
}


#footerBottom
{
	padding-top : 20px;
	padding-bottom : 10px;
}

/*------------------Przycisk powrotu do góry--------------------*/
#myBtn {
	display: none;
	position: fixed; 
	bottom: 20px; 
	right: 30px; 
	z-index: 99; 
	border: none; 
	outline: none; 
	background-color: #cccccc; 
	color: white;
	cursor: pointer; 
	padding : 6px 6px 3px 6px;
	border-radius: 10px; 
	border : 2px, solid, black;
	font-size: 18px; 
}

#myBtn img
{
	background-repeat: no-repeat;
	height : 40px;
	width : 40px;
}

#myBtn:hover {
  background-color: #aaaaaa; /* Add a dark-grey background on hover */
}



@media only screen and (min-width: 1023px)
{
	
	.nav 
	{
		font-size : 120%;

	}
	
	#logo
	{
		padding : 1%;
	}
	
	
	#menuButton 
	{
		display: none;
	}
	
	
	.menu2
	{
		display : flex;	
	}	
			
	.menuResponsive 
	{
		display : none;
	}
			
	#footerTop
	{
		display : flex;
		flex-direction : row;
		justify-content: space-between;	
		width : 90%;
	}
	
	.footerTile
	{
		margin : auto;
		wdith : 30%;
	}
	
}

@media only screen and (min-width: 650px) and (max-width: 1022px)
{
	#logo
	{
		padding : 2%;
	}	
}