 body
    {
    background-image:url(../grafiki/truskawki.png);
    background-size: cover;
    background-attachment: fixed; 
    }
	
/*----------------------------------------------------------------------------
--------------------------------- Stylowanie baneru --------------------------
----------------------------------------------------------------------------*/

#contener
    {
    width: 1600px;    
    height: 1050px; 
	padding-top: 2px;
    margin-left: auto;
    margin-right: auto;
    }
	
#kontener
    {
    width: 1600px;    
    height: 1050px; 
	padding-top: 2px;
    margin-left: auto;
    margin-right: auto;
	background-color:darkgreen;
    }
#zegar
  	{
  	width:974px;
	height:100px;
    padding-left: 5px;    
	font-size:25pt;
	text-align:left;
  	float:left;
  	margin:0px;
	color:#000000;
	}
#top
    {
    width:1596px;
	height:106px;
    border: solid 3px #fff;
    background-image:url(../grafiki/brunetka.png); 
    margin:0 auto 3px auto; 
	box-sizing: border-box;
    }
#top_centrum
    {
  	width:530px;
	height:100px;
    float:left;
    }
#top_left_alfa
    {
  	width:80px;
	height:100px;
    float:left;
    }
#top_left_alfa:hover
    {
    cursor: help;    
    }
	
/*----------------------------------------------------------------------------
----------------------------- Stylowanie górnego menu ------------------------
----------------------------------------------------------------------------*/

#menu
    {
	width:1596px;
	height:36px; 
    margin: 6px auto 0 auto;
	box-sizing: border-box;
    background-color: darkblue;
    border: solid;
    border-color: white;
    text-align: center;
    }
	
ol
    {
    margin: 0;
    padding: 0;
    line-height: 200%;
    list-style-type: none;
    display: inline-block;
    }
ol a
    {
    color: #FFF;
    text-decoration: none;
    font-size: 24px;
    display: block;
    }
ol > li
    {
    float: left;
    width: 500px;
    height: 30px;
    border-right: 2px solid #333333;
    }
ol > li:hover
    {
    background-color: black;    
    }
ol > li:hover > a
    {
    color: red;
    }
ol > li:first-child
    {
    border-left: 2px solid #333333;    
    }
ol > li > ul
    {
    list-style-type: none;
    margin: 0;
    padding: 0;  
    height: 30px;
    display: none;
    }
ol > li:hover > ul
    {
    display: block
    }
ol > li > ul > li
    {
    background-color: darkblue;  
    position: relative;
    z-index: 100;
    border-bottom: 1px solid #333333;
    border-left: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
    }
ol > li > ul > li:last-child
    {
    border-bottom: 2px solid #FFFFFF;    
    }
ol > li > ul > li:hover
    {
    background-color: black;
    }
ol > li > ul > li:hover > a
    {
    color: red;    
    }
	
	
/*----------------------------------------------------------------------------
----------------------------- Stylowanie bocznego menu -----------------------
----------------------------------------------------------------------------*/

#menu_lewe
    {
    width:446px;
    height:895px;
    margin-top: 3px;
    margin-left: 2px;
    float: left;
	position: relative;
    }
#menu_lewe_top
    {
    width:432px;
    height:110px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    border: solid;
    border-width: 4px;
    background-color: white;
    opacity: 0.8;
    border-color: darkblue; 
    border-radius: 10px;
    }
#menuLeweInfo
    {
    width: 422px;
    height:150px;
	margin: 5px auto 15px auto;
	padding: 5px;
    border: solid;
    border-width: 4px;
    background-color: white;
    opacity: 0.8;
    border-color: darkblue; 
    border-radius: 10px;
    }
#menuLeweInfo > p{
	color:darkblue;
	font-size:20px;
	font-weight: 800;
	text-indent:20px;
	margin: 20px 0 0 0;
}
#menu_lewe_screen
	{
	width:440px; height:330px;
	}
#menu_lewe_menu
    {
    width:440px;
    height:710px;
    margin-top: 3px;
    margin-left: 2px;
    overflow-y: auto;
    overflow-x: hidden;
    }
#menu_lewe_bottom
    {
    width: 436px; 
	height: 46px;
	position: absolute;
	bottom: 2px;
	left: 2px;
	border: solid;
    border-width: 4px;
	border-radius: 10px;
	border-color:darkblue;
    background-color: white;
    }
	
/*----------------------------------------------------------------------------
----------------------------- Stylowanie okna głównego -----------------------
----------------------------------------------------------------------------*/

#obszar_roboczy
    {
    width: 1150px;
    height:890px;
    margin-top: 3px;
    margin-left: 2px;
    float: right;   
    }
#ramka{
    width:1140px;
    height:889px; 
    margin: 5px auto 0 auto;
	padding: 5px;
	border: solid;
    border-width: 4px;
	border-radius: 10px;
	border-color:darkblue;
	box-sizing: border-box;
	background-color: white;
    }
#ramka > p{
	color:darkblue;
	font-size:30px;
	font-weight: 800;
	text-indent:20px;
	margin: 20px 0 0 0;
}
.tytul_1
    {
    text-align: center;
    margin-top: 5px;
    font-size: 32px;
    font-weight: 900;
    color: darkblue;
    }
.podtytul
    {
    text-align: center;
    margin-top: 0px;
    font-size:20px;
    font-weight: 900;    
    color: darkblue;
    }
.podtytul:hover
    {
    cursor: help;
    }
.anonimus 
    { 
    display: inline-block;   
	margin: 2px;	
    }
.anonimus:hover
    {
    cursor: help;    
    }
.cc
    {
    display: inline-block;  
	margin: 2px;
    }        
    .cc:hover 
    {
    cursor: help;    
    }
.navy_1
    {
    display: block;   
    width:370px;
    height:auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4px;
    margin-bottom: 4px;
    background-color: #212C5F;
    border-radius: 10px;
    padding-left: 8px;  
    color: #ffffff;
    text-decoration: none;
    font-size: 20px;
    font-weight: 700;
    }
.navy_1:hover
    {
    background-color: #000000;
    color:red; 
    cursor: pointer;  
    }
.navy_2
    {
    display: block;   
    width:360px;
    height:auto;
    margin-left: 50px;
    margin-top: 4px;
    margin-bottom: 4px;
    background-color: #212C5F;
    border-radius: 10px;
    padding-left: 8px;  
    color: #ffffff;
    text-decoration: none;
    font-size: 20px;
    font-weight: 700;
    }
.navy_2:hover
    {
    background-color: #000000;
    color:red; 
    cursor: pointer;  
    }

/*----------------------------------------------------------------------------
------------------------------- Stylowanie poradnika -------------------------
----------------------------------------------------------------------------*/

#page_vis
	{
	width: 1596px;
    height:890px;
	margin:5px auto 3px auto;
	padding:10px;
	background-color: #CCE5EC;
	border: solid 3px #fff;
	box-sizing: border-box;
	}
.for_galery{
	width: 1530px;
	height: 833px;
	margin: -5px auto 3px auto;
	padding: 30px 5px 5px 5px; 
	overflow-y: auto;
	overflow-x: hidden;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	}
.foto{
	margin: 5px 0 5px 0;
	height: 330px;
	width: 220px;
	background-color: slategray;
	padding: 6px;
	border: 2px solid #FFF;
	border-radius: 10px;
	box-sizing: border-box;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	}
		
.foto > img{
	width: 200px;
	max-height: 300px;
	}
		
.foto > figcaption{
	margin: 5px 0 0 5px;
	color: #FFF;
	max-height: 330px;
	
	}
.foto:nth-child(odd):hover{
	transition: 0.5s all linear;
	transform:matrix(2.2,0,0,2.2,100,100);
	background-color: #000;	
	}
		
.foto:nth-child(even):hover{
	transition: 0.5s all linear;
	transform:matrix(2.2,0,0,2.2,-100,100);
	background-color: #000;	
	}