/* style.css */



body
{
	font-size : 15px;
}


/* ------------------------ Czcionki ---------- */
.shadows-into-light-regular {
  font-family: "Shadows Into Light", cursive;
  font-weight: 400;
  font-style: normal;
}



/* Resetowanie domyślnych stylów przeglądarki */
* {
	margin : 0;
    box-sizing: border-box;
}
/*--------------------------------------------------------------------------*/


	/* Górny pasek */
	.top-bar {
		background-color: #dedede;
		color: #76323f;
		text-align: center;
		padding : 10px;
		font-size : 100%;
		font-weight : bold;
	}


	.leftBar
	{
		text-align : left;
		float:left;
		margin-left : 10%; 	
		width : 60%;
	}


	.rightBar
	{
		text-align : right;	
		margin-right : 10%;
	}

	.leftBar ul li
	{
		width : auto;
		display : inline-block;
		padding-left : 2%;
	}

	.leftBar ul li a
	{
		text-decoration:  none;
		color:  #76323f;
	}

	.leftBar ul li a:visited
	{
		text-decoration:  none;
		color:  #76323f;
	}

	.top-bar i
	{
		font-size : 150%;
		color : black;
	}

	.rightBar i:hover
	{
		transition: 1s;
		color : #76323f;
	}

/*--------------------------------------------------------------------------*/

/*NAVI*/


	/* Pasek nawigacji */
	#navBar
	{
		background-color: #f5f5f5;
		color: black;
		text-align: center;
		padding : 0.25%;
		transition: top 0.3s;
		width : 100%;
	}

	.logo
	{
		padding : 10px;
		float : left;
		max-width : 60%;
		height: 100%;
		text-align : left;
		margin-left : 10%;
		display : block;
	}
	
	#ikonaLogo 
	{
		padding-top : 5px;
		max-width : 30%;
		height  :100%;
		float:left;
	}
	

	#napisLogo
	{
		padding-top :5px;
		float:left;
	}

	#logo h1
	{
		color : #313131;
		font-size : 200%;
	
	}

	#logo p1
	{
		color : #313131;
		font-weight: bold;
		font-size : 160%;
	}
	
	
	#napisLogo
	{
		font-size : 110%;
	}
	

	.divNavi
	{
		color: #76323f;
		width : 50%;
		margin-left : 40%;
		margin-right : 10%;
		padding : 0px;
	}

	nav .divNavi ul {
		text-decoration : none;
		padding : 0px;
	}

	nav .divNavi ul li {
		padding-left : 5%;
		display : inline-block;
	}

	nav .divNavi ul li a {
		color: #76323f;
		text-decoration: none;
		font-size : 150%;
		font-weight : bold;
		
		max-width : 100%;
		height :100%;
		float : left;
		padding-top : 25px;
		padding-bottom : 20px;
	}

	nav .divNavi ul li a:link
	{
		text-decoration : none;	
	}

	nav .divNavi ul li a:visited
	{
		color: #76323f;
		text-decoration : none;	
	}

	nav .divNavi ul li a:hover
	{
		color: #000000;
	}

/*------------------------------------------------------------------------------*/

/*CONTENT*/

	/* Środkowa część */
	.main-content {

		background: linear-gradient(rgba(255,255,255,.3), rgba(255,255,255,.3)), url("foto/background.jpg");
		background-size: cover;
		width : 100%;
		height : 50%;
		padding-top : 20px;
	}

	.centralny
	{
		width : 100%;
		height : auto;
		opacity : 1;
		text-align: center;
		text-decoration: none;
	}

	.centralny a
	{
		text-decoration: none;
	}

	#panelKlienta
	{
		width : 12%;
		margin-top : 1%;
		margin-bottom : 1%;
		margin-left : 78%;
		margin-right : 10%;
		
		padding-top : 20px;
		padding-bottom : 20px;
		padding-left : 5px;
		padding-right : 5px;	
		
		font-size : 100%;
		text-align : center;
		color : #ffffff;
		background : #98545f;
		border-radius : 40px;
	}



	#ksiegowoscOnline
	{
		/*font-family: "Shadows Into Light", cursive; */
		color: #76323f;
		margin-top : 10%;
		width : 60%;
		margin-left : 20%;
		border-radius : 10px;
		font-size : 300%;
		padding : 4%;
		border-style : solid;
		border-color : #76323f;
		background: rgba(221, 221, 221, 0.8);
		
	}

	#napiszDoNas
	{
		margin-top : 5%;
		margin-left : 30%;
		background : #98545f;
		background : #cb878f;
		width : 40%;
		border-radius : 40px;
		padding : 20px;
		color : #ffffff;
		font-size : 40%;
	}

	#cytat
	{
		margin-top : 15%;
		width : 100%;
		background: rgba(221, 221, 221);
		font-size : 200%;
		padding : 30px;
		letter-spacing : 1px;
		font-style : italic;
	}

	#cytat p
	{
		text-align : center;
		margin-left : 15%;


	}
/*------------------------------------------------------*/

 /*FOOTER*/

	/* Stopka */
	footer {
		margin : 0px;
		background-color: #B7A3A4;
		color: #fff;
		text-align: center;
		padding: 10px;
		height : auto;
	}

	#footerContainer
	{
		margin-top : 2%;
		width : 80%;
		margin-left : 10%;
	}

	.tile
	{
		width : 33%;
		height :100%;
		float :left;
		color : black;
		line-height : 150%;
		font-size : 150%;
		padding : 5px;
	}

	.tile ul 
	{
		list-style-type : none;
		margin : 0;
		line-height : 200%;
		padding : 0;
	}


	.tile a:link 
	{
		text-decoration : none;
		color : #885051;
	}


	.tile a:hover
	{
		color : #AA7273;
	}

	.tile H1
	{
		font-size : 120%;
	}

	.tile a:visited 
	{
		color : #885051;
		text-decoration : none;
	}

	#kancelariaR
	{
		font-size : 100%;
		color : black;
		padding : 20px;
		line-height : 150%;
	}

	#kancelariaR a:link
	{
		text-decoration : none;
		color : #c02906;
	}

	#kancelariaR a:visited
	{
		color : #c02906;
	}

/*--------------------------------------------------*/







 /*Responsywność*/
  
 #menuButton
{
	display : none;
}

#menuButton a
{
	text-decoration : none;
	color : #76323f;
	padding : 5%;
	font-size : 200%;
}

#menuButton a:hover
{
	background : #d1d1d1;
}



@media only screen and (min-width: 2200px) 
{
	body
	{
		font-size : 30px;
	}
}




@media only screen and (min-width: 2000px) 
{
	body
	{
		font-size : 25px;
	}
}



@media only screen and (max-width: 1200px) 
{
	.top-bar
	{
			display : none;
	}
	
	#menuButton
	{
		float : right;
		text-align : right;
		width :  20%	;
		display:block;
		padding : 3%;
		color : 76323f;
		margin-right : 5%;
	}
	
	#menuButton i
	{
		padding :5%;
	}
	
	.divNavi ul
	{
		display :none;
	}
}

 @media only screen and (max-width: 1200px)
 { 
	.logo
	{
		font-size : 20px;
	}

	footer {
		font-size: 70%;
	}

 }

 @media only screen and (max-width: 1050px)
 {
	.logo
	{
		font-size : 30px;
	}
	
	#panelKlienta
	{
		width : 25%;
		margin-left : 60%;
		font-size : 150%;
	}	
	
	#napiszDoNas
	{
		width : 60%;
		margin-left : 20%;
		font-size : 60%;
	}	

	footer {
		font-size: 70%;
	}

	.tile {
		clear: both;
		width: 90%;
		margin-left: 5%;
	}	
 }

 @media only screen and (max-width: 900px)
 {	 
	.logo
	{
		font-size : 20px;
	}
				
	#ksiegowoscOnline
	{
		font-size : 200%;
	}
		
	#panelKlienta
	{
		width : 25%;
		margin-left : 60%;		
	}		

	#napiszDoNas
	{
		width : 60%;
		margin-left : 20%;
		font-size : 60%;
	}	
			
	#cytat
	{
		font-size : 18px;
	}		
	
	footer {
		font-size: 70%;
	}

	.tile {
		clear: both;
		width: 90%;
		margin-left: 5%;
	}			
 }

 @media only screen and (max-width: 800px)
 { 
	.logo
	{
		font-size : 20px;
	}
			
	#ksiegowoscOnline
	{
		font-size : 200%;
	}
		
	#panelKlienta
	{
		width : 25%;
		margin-left : 60%;
	}		
	
	#napiszDoNas
	{
		width : 60%;
		margin-left : 20%;
		font-size : 60%;
	}	
		
	#cytat
	{
		font-size : 18px;
	}		
	
	footer {
		font-size: 70%;
	}

	.tile {
		clear: both;
		width: 90%;
		margin-left: 5%;
	}
 }

 @media only screen and (max-width: 700px)
 {
	.logo
	{
		font-size : 11px;
	}

	footer {
		font-size: 70%;
	}

	.tile {
		clear: both;
		width: 90%;
		margin-left: 5%;
	}	
 }
    @media only screen and (max-width: 600px)
 {
	.logo
	{
		font-size : 10px;
	}
	
	#ksiegowoscOnline
	{
		font-size : 150%;
	}
		
	#panelKlienta
	{
		width : 50%;
		margin-left : 25%;
	}		
		
	#napiszDoNas
	{
		width : 60%;
		margin-left : 20%;
		font-size : 60%;
	}	
		
	#cytat
	{
		font-size : 17px;
	}		
	
	footer {
		font-size: 70%;
	}

	.tile {
		clear: both;
		width: 90%;
		margin-left: 5%;
	}
 }

   @media only screen and (max-width: 450px)
   { 
	.logo
	{
		font-size : 10px;
	}
	
	#ksiegowoscOnline
	{
		font-size : 150%;
	}
		
	#panelKlienta
	{
		width : 50%;
		margin-left : 25%;
		font-size : 90%;
	}		
		
	#napiszDoNas
	{
		width : 60%;
		margin-left : 20%;
		font-size : 60%;
	}	
		
	#cytat
	{
		font-size : 17px;
	}		
	
	footer 
	{
		font-size: 70%;
	}

	.tile {
		clear: both;
		width: 90%;
		margin-left: 5%;
	}
 }

    @media only screen and (max-width: 400px)
 {
	.logo
	{
		font-size : 10px;
	}
	
	#ksiegowoscOnline
	{
		font-size : 150%;
	}
	
	#napiszDoNas
	{
		width : 60%;
		margin-left : 20%;
		font-size : 60%;
	}
		
	#panelKlienta
	{
		width : 50%;
		margin-left : 25%;
	}		
		
	#cytat
	{
		font-size : 17px;
	}		
	
	footer {
		font-size: 70%;
	}

	.tile {
		clear: both;
		width: 90%;
		margin-left: 5%;
	}
 }
 
  @media only screen and (max-width: 350px)
 {
	.logo
	{
		font-size : 10px;
	}
	
	#ksiegowoscOnline
	{
		font-size : 150%;
	}
		
	#panelKlienta
	{
		width : 50%;
		margin-left : 25%;
	}		
		
	#cytat
	{
		font-size : 17px;
	}		
	
	footer
	{
		font-size : 70%;
	}

	.tile
	{
		clear : both;
		width : 90%;
		margin-left : 5%;
	}
 }
 

.divNaviResponsive
{
	clear:both;
	color: #76323f;
	width : auto;
	text-align : left;
}

.divNaviResponsive ul
{
	text-decoration : none;
	padding : 0px;	
	list-style-type: none;
	display : grid;
}

.divNaviResponsive ul li:hover
{
	background-color: #a0a0a0;
}

.divNaviResponsive ul li a 
{
	color: #76323f;
	text-decoration: none;
	font-size : 150%;
	font-weight : bold;
	width : 100%;
	height :100%;
	float : left;
	padding-top : 1%;	
	padding-bottom : 1%;
	padding-left : 10%;
}

.divNaviResponsive ul li a:link
{
	text-decoration : none;	
}

.divNaviResponsive ul li a:visited
{
	color: #76323f;
	text-decoration : none;	
}

.divNaviResponsive ul li a:hover
{
	color: #000000;

}

/*-----------------------------------------------*/