* {
            box-sizing: content-box;
        }

        body {
         background-size: 100% 100%;
	background-color: black;
         font-family: Special Elite;
	 margin: 0;
        }

	.tlo {
    	position: fixed;
    	width: 100%;
    	height: 100%;
    	background-size: cover;
    	background-position: center;
    	transition: 0.5s;
	}

        .container {
            display: grid;
            grid-template-columns: 1fr 4fr;
            grid-template-areas: 
                "header header header"
                "menu content nav"
                "footer footer footer"
            ;
            gap: 5px;
        }
        .container > div {
            padding: 2rem;
        }

        .container > div.header { /* HEADER */
             grid-area: header;
           opacity: 0.99;
           padding: 0px;
	   margin: 0px;
           text-align: center;
           font-size: 0px;
        }

	.container > div.header img { 
		height: 200px; 
		width: 380px;
	}

        .container > div.menu { /* MENU */
            grid-area: menu;
           background-color: #366;
           opacity: 0.9;
           border-style: solid;
           border-color:#650 rgb(218, 181, 0) ;
	         border-radius: 50px;
           padding: 10px;
           text-align: center;
           font-size: 25px;
           color: white;
           position: sticky;	
           top: 0px;
           height: 650px;
           /* height: 600px; // Dla zwykłej czcionki*/
        }

        .container > div.content { /* CONTENT */
            grid-area: content;
            font-size: 20px;
           background-color: #f1f1f1;
           opacity: 0.95;
           border-style: solid;
           border-color: #650;
           border-top: rgb(218, 181, 0) solid 2px;
           border-radius: 1rem;
           padding: 20px;
           padding-top: 0;
           text-align: left;
           color: black;
        }

	.container > div.content > h2 { 
           opacity: 0.95;
           border-bottom: #000000 solid 2px;
           border-top: #000000 solid 2px;
	   padding-top: 5px;
	   padding-bottom: 0px;
	   background-color: rgb(220, 220, 220);
           text-align: center;
           font-size: 30px;
           color: black;
          /*! color: rgb(228, 0, 0); */ /*! text-shadow: rgb(218, 181, 0) 0px 0px 10px; */
           font-weight: bolder; 
        }

	.container > div.content > h3 { 
           opacity: 0.95;
           border-bottom: #505050 solid 2px;
	   border-radius: 3px;
	   padding-bottom: 0px;
           color: black;
           font-weight: bolder; 
        }

	}

        .container > div.content p { 
           white-space: pre;
        }

        .container > div.content ol { 
           list-style-type: upper-arabic;
        }

        table td { 
           border: #000000 2px solid;
           padding: 3px;
        }

	table { 
	   text-align: center;
        }

	table div.tv img { 
           width: 321px;
	   height: 240px;
        }

	table div.cine img { 
           width: 400px;
	   height: 225px;
        }

	table div.post img { 
           width: 280px;
	   height: 400px;
        }

	table th {
           border: 3px solid black;
           background-color: bisque;
           font-size: 21px;
	   text-align: center;
        }

	table {
	border: solid black 3px;
	box-shadow: black 0px 0px 2px 0px;
	border-collapse: collapse;
	width: 100%;
	}

	tr {
	background-color: rgb(250, 250, 250);
	}

	tr:nth-child(odd) {
  	background-color: rgb(240, 240, 240);
	}

	.container > div.content > table ul {
        list-style-type: none;
	text-align: left;
	}

        .container > div.content > img { 
           box-shadow: #000000 0px 0px 5px;
        }

        div.content a:hover {
          transition-duration: 0.2s;
          color: rgb(0, 180, 255);
        }

        div.content a:active {
          color: rgb(200, 150, 0);
        }

        div.content a {
          text-decoration: none;
        }

	div.niu a {
          color: rgb(255, 0, 0);
        }

	div.niu a:hover {
          color: rgb(200, 0, 0);
	  transition-duration: 0.2s;
        }

	div.niu a:active {
          color: rgb(255, 0, 0);
        }

        .container > div.footer { /* FOOTER */
            grid-area: footer;
           opacity: 0.9;
           padding: 0px;
           text-align: center;
           font-size: 20px;
           color: orange;
           text-shadow: black 5px 0px 10px;
        }

        div.menu a:hover {
          font-size: 28px;
          text-shadow: black 0px 5px 5px;
          transition-duration: 0.2s;
          color: yellow;
        }

        div.menu a:active {
          color: rgb(255, 38, 0);
        }

        div.menu a {
          color: gold;
          text-decoration: none;
        }

        div.menu ul {
          list-style-image: url(hole.png);
        }

        div.menu li {
          margin-bottom: 5px;
          text-align: left;
        }

div.menu a.icon {
  display: none;
}

	@media screen and (max-width: 1000px) {

	.container > div.content {
	font-size: 110%;
	}

	.container > div.content > h2 {
	font-size: 130%;
	}

        .container {
            display: block;
            grid-template-columns: 1fr 3fr;
            grid-template-areas: 
                "header"
                "menu"
		"content"
                "footer"
            ;
            margin-buttom: 5px;
        }
        .container > div {
            padding: 0rem;
        }

	.container > div.menu {
            position: relative;
	overflow: hidden;
  	position: relative;
  	height: auto;
        }

div.menu #mmenu {
  display: none;
  font-size: 100%;
}

div.menu a:hover {
	  font-size: 100%;
          transition-duration: 0.0s;
}

div.menu a {
  display: block;
}

div.menu h2 {
  text-shadow: 1px 1px 2px black, 0 0 25px yellow, 0 0 5px orange;
}

div.menu p {
  display: none;
}

div.menu a.icon {
  display: block;
  position: relative;
}

#retabela {
	overflow-x:auto;
}

	}
