/*----------------------------------------------------------------------------------
----------------- Arkusz dla podstron z memami na komputer -------------------------
----------------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------------
------------------------------------Pasek wyboru------------------------------------
----------------------------------------------------------------------------------*/
		
		body
		{
			background-color: #000;
    		background-size: cover;
			background-attachment: fixed;
			overflow: auto;
		}
		
		#to_logo
		{
			width:1530px;
			height:100px;
			background-image: url("../Grafika/Tla/baner-nowy_long.png");
			margin: 0px auto 0px auto;	
		}
		
		#zegar {
			width: 600px;
			height: 30px;
			font-size: 16pt;
			text-align: left;
			color: #DDDDDD;
			float: left;
		}
		
		#level{
			width: 235px;
			margin-left:45px;
			height: 30px;
			font-size: 16pt;
			text-align: left;
			color: #DDDDDD;
			float: left;
		}
		
		#level > p{
			margin:0;
		}
		
		#to_loginlogo{
			float: left;
			margin:0px;
			width: 400px;
			height: 72px;
		}
		
		#to_logo_text{
			float: right;
			margin-top: -2px;
			width: 650px;
			height: 30px;
		}
		
		#to_logo_text > h1
		{
			font-family: courier; 
			font-style: italic;
			font-size: 30px;
			text-align: center;
			margin-top: 0;
		}
		
				/* --------------------------------Menu-------------------------------------*/

		#menu_contener {
			margin-top: 0px;
			margin-left: auto;
			margin-right: auto;
			width: 1580px;
			height: 36px;
		}

		#menu {
			margin: 0px auto 0px auto;
			width: 1530px;
			height: 30px;
			background-image: url("./Grafika/Tla/footer_gradient.png");
			text-align: left;
		}
		
		#page_choice {
			margin: -5px auto 0px auto;
			width: 1530px;
			height: 60px;
			background-color: darkslategray;
		}

		ol {
			margin: 0 0 0 2px;
			padding: 0px;
			line-height: 200%;
			list-style-type: none;
			display: inline-block;
		}

		ol a {
			color: #FFF;
			text-decoration: none;
			font-size: 24px;
			display: block;
			padding-left: 10px;
		}

		ol>li {
			float: left;
			width: 303px;
			height: 30px;
			border-right: 2px solid #CCC;
		}

		ol>li:hover {
			background-color: black;
		}

		ol>li:hover>a {
			color: red;
		}

		ol>li:first-child {
			border-left: 2px solid #CCC;
		}

		ol>li>ul {
			list-style-type: none;
			margin: 0;
			padding: 0;
			height: 30px;
			display: none;
		}

		ol>li:hover>ul {
			display: block;
			overflow-y: auto;
			height: 650px;
		}

		ol>li>ul>li {
			background-color: #333;
			position: relative;
			z-index: 100;
		}

		ol>li>ul>li:last-child {
			border-bottom: 2px solid #CCC;
		}

		ol>li>ul>li:hover {
			background-color: black;
		}

		ol>li>ul>li:hover>a {
			color: red;
		}

		.settings_info_hot {
			width: 726px;
			height: 695px;
			margin: 5px;
			padding-left: 5px;
			border: 2px solid silver;
			float: left;
		}
		.settings_info_activ {
			width: 226px;
			height: 695px;
			margin: 5px;
			padding-left: 5px;
			border: 2px solid silver;
			float: left;
		}
		
		.settings_info_activ>span, 
		.settings_info_hot>span {
			color: #FFF;
			font-size: 26px;
		}
		
		.settings_info_activ>h3, 
		.settings_info_hot>h3 {
			color: #FFF;
			font-size: 30px;
			text-align: center;
		}

		/*---------------------------------------------------*/
		
		#main_window_contener {
			width: 1580px;
			height: 770px;
			margin: -5px auto 0px auto;
		}

		#main_window {
			width: 1530px;
			height: 805px;
			margin-top: 0px;
			margin-left: 30px;
			background-color: darkslategray;
		}
		
		#window_up{
			width: 1524px;
			height: 40px;
			background-color: darkblue;
			margin: -5px 5px 0 0;
			border: 3px solid silver;
			border-radius: 10px;
		}
		
		#window_up > a{
			width: 34px;
			height: 31px;
			text-align: center;
			font-size: 20px;
			background-color: midnightblue;
			color:#FFF;
			margin: 0 10px 0 10px;
			padding: 4px 0 0 0;
			border: 3px solid silver;
			border-radius: 10px;
			text-decoration: none;
			display: block;
			float: left;
		}
		
		#window_up > b{
			width: 34px;
			height: 31px;
			text-align: center;
			font-size: 20px;
			background-color: slategray;
			color:#00008B;
			margin: 0 10px 0 10px;
			padding: 4px 0 0 0;
			border: 3px solid silver;
			border-radius: 10px;
			text-decoration: none;
			display: block;
			float: left;
		}
		
		#window_up > b:last-child,#window_up > b:nth-child(11){
			width: 340px;
			height: 31px;
			text-align: center;
			font-size: 20px;
			background-color: slategray;
			color:#00008B;
			margin: 0 10px 0 80px;
			padding: 4px 0 0 0;
			border: 3px solid silver;
			border-radius: 10px;
			text-decoration: none;
			display: block;
			float: left;
		} 
		
		#window_up > a:last-child,#window_up > a:nth-child(11) {
			width: 340px;
			height: 31px;
			text-align: center;
			font-size: 20px;
			background-color: midnightblue;
			color:#FFF;
			margin: 0 10px 0 80px;
			padding: 4px 0 0 0;
			border: 3px solid silver;
			border-radius: 10px;
			text-decoration: none;
			display: block;
			float: left;
		}
		#window_up > a:hover{
			margin: 2px 8px 2px 12px;
			background-color: darkslateblue;
			cursor: pointer;
			color:red;
		}
		
		#window_up > a:last-child:hover,#window_up > a:nth-child(11):hover{
			margin: 2px 8px 2px 82px;
			background-color: darkslateblue;
			cursor: pointer;
			color:red;
		}
		
		#window_max{
			width: 1524px;
			height: 724px;
			background-image: url("../Grafika/Tla/gradient_left_full.png");
			margin: -5 5px 0 10px;
			border: 3px solid silver;
			border-radius: 10px;
		}
		
		#pasek {

			width: 1530px;
			height: 30px;
			margin: 0px;
			background-color: red;
		}
		
		.foto{
			margin: 45px 0 0 30px;
			width: 220px;
			background-color: slategray;
			padding: 6px;
			border: 2px solid #FFF;
			border-radius: 10px;
			box-sizing: border-box;
			display: inline-block;
			justify-content: space-around;
			flex-wrap: wrap;
		}
		
		.foto > img{
			width: 200px;
			max-height: 150px;
		}
		
		
		.foto > figcaption{
			margin: 7px 0 2px 5px;
			color: #FFF;
		}
	/*	
		.foto:nth-child(7):hover,
		.foto:nth-child(9):hover,
		.foto:nth-child(11):hover,
		.foto:nth-child(13):hover,
		.foto:nth-child(15):hover,
		.foto:nth-child(17):hover {
			transition: 0.5s all linear;
			transform:matrix(1.8,0,0,1.8,120,-70);
			background-color: #000;
		}
		
		.foto:nth-child(8):hover,
		.foto:nth-child(10):hover,
		.foto:nth-child(12):hover,
		.foto:nth-child(14):hover,
		.foto:nth-child(16):hover,
		.foto:nth-child(18):hover {
			transition: 0.5s all linear;
			transform:matrix(1.8,0,0,1.8,-120,-70);
			background-color: #000;
		}
	*/	
		.foto:nth-child(even):hover{
			transition: 0.5s all linear;
			transform:matrix(1.8,0,0,1.8,-120,-70);
			background-color: #000;	
		}
		
		.foto:nth-child(odd):hover{
			transition: 0.5s all linear;
			transform:matrix(1.8,0,0,1.8,120,-70);
			background-color: #000;	
		}
		

		.foto:nth-child(1):hover,
		.foto:nth-child(3):hover,
		.foto:nth-child(5):hover{
			transition: 0.5s all linear;
			transform:matrix(1.8,0,0,1.8,120,70);
			background-color: #000;
		}
		
		.foto:nth-child(2):hover,
		.foto:nth-child(4):hover,
		.foto:nth-child(6):hover{
			transition: 0.5s all linear;
			transform:matrix(1.8,0,0,1.8,-120,70);
			background-color: #000;
		}

		.pict_menu{
			color:#FFF;
			text-align: center;
			text-decoration: none;
		}
		
		.navy_x2{
			background-color: darkred;
		}
		
		.navy_x2{
			background-color: darkred;
			color: rgb(143, 76, 76);
		}
		
		#temp{
			margin:0px;
			width: 400px;
			height: 72px;
			text-align:center;
		}
        
        .menu_line{
            color: red;
        }