@font-face {
	font-family: 'Bricolage Grotesque';
	src: url('fonts/Bricolage_Grotesque/BricolageGrotesque-VariableFont_opsz,wdth,wght.ttf') format('truetype-variations');
	font-weight: 100 900;
	font-stretch: 75% 125%;
	font-style: normal;
}
@font-face {
    font-family: 'Gentium Book Plus';
	src: url('fonts/Gentium_Book_Plus/GentiumBookPlus-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Gentium Book Plus';
	src: url('fonts/Gentium_Book_Plus/GentiumBookPlus-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Gentium Book Plus';
	src: url('fonts/Gentium_Book_Plus/GentiumBookPlus-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}  
@font-face {
    font-family: 'Gentium Book Plus';
	src: url('fonts/Gentium_Book_Plus/GentiumBookPlus-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
} 
		
		html {
            min-height: 100%;
        }

        body {
            margin: 0;
            padding: 0;
            border: 0;
            font-family: 'Bricolage Grotesque', sans-serif !important;
            font-size: 1em !important;
        }

        header {
			border-radius: 1em;
            padding: 1em;
            display: table;
            width: 95%;
            margin: 20px auto;
            max-width: 1000px;
            position: relative;
            z-index: 10;
            background-color: #121823;
            opacity: .95;
            color: #fff;
            -webkit-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.8);
            -moz-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.8);
            box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.8);
        }

            header #logo {
                display: table-cell;
				 width: 20%;				 
                background-image: url(images/itorg-150.png);
                background-repeat: no-repeat;
                background-position: center center;
				 background-size: contain;
            }

            header #subheader {
                display: table-cell;
                font-size: 200%;
                padding-top: 1em;
                padding-bottom: 1em;
                padding-left: 1em;
            }

        main {
            display: block;			
        }

        article {
			border-radius: 1em;
            padding: 1em;
            width: 95%;
            max-width: 1000px;
            margin: 20px auto;
            position: relative;
            z-index: 10;
            background-color: #121823;
            opacity: .9;
            color: #fff;
            -webkit-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.8);
            -moz-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.8);
            box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.8);
        }

            article a {
                color: #fff;
            }

                article a:hover {
                    color: #DDDCDA;
                }

        footer {
			 border-radius: 1em;
            padding: 1em;
            width: 95%;
            margin: 20px auto;
            max-width: 1000px;
            position: relative;
            z-index: 10;
            background-color: #121823;
            opacity: .95;
            color: #fff;
            -webkit-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.8);
            -moz-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.8);
            box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.8);
        }

            footer h2 {
                font-size: 100%;
            }

            footer a {
                color: #fff;
            }

                footer a:hover {
                    color: #DDDCDA;
                }

        .clean {
            width: 100%;
            height: 2em;
        }
		
		.slogan {
			font-size:120%; 
			background: #ffffff4f; 
			border-radius: 10px; 
			padding: 10px; 
			border: solid 5px transparent;
		}

        #bg {
            background-color: #fff;
            height: 200%;
            left: -50%;
            position: fixed;
            top: -50%;
            transform: translate3d(0px, 0px, 0px);
            width: 200%;
        }

            #bg img {
                max-width: 100%;
                vertical-align: middle;
                border: 0;
                position: absolute;
                z-index: 1;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                margin: auto;
                min-width: 55%;
                min-height: 55%;
                filter: blur(10px);
                -webkit-filter: blur(10px);
                -moz-filter: blur(10px);
                -o-filter: blur(10px);
                -ms-filter: blur(10px);
            }
			
			#kr {
				float: left;
				max-width: 40px; 
				margin-right: 20px;
				
				border-radius: 50%;
			} 
			
		@media only screen and (max-width: 800px) {
			#kr { max-width:30%; margin-bottom: 10px; }
		}

        @media only screen and (max-width: 600px) {
            header #logo {
				width: 20%;
				min-height: 70px;	
               display: inline-block;
            }

            header #subheader {
               display: inline-block;
				font-size: 140%;
            }
			
			#kr { max-width: 60%; margin-right: 10px; margin-bottom: 10px;}		
        }
				
		@media only screen and (max-width: 400px) {
			#kr { max-width: 70%; margin-right: 0px; float: none; display: block; margin: auto; margin-bottom: 10px;}
			 header #subheader {
                font-size: 120%;
            }
			 header #logo {
               width: 20%;
				min-height: 50px;				
            }
		}
		
/************COOKIES*************/
/* Styl dla półprzezroczystego overlay */
.cookie-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* półprzezroczysty czarny */
    z-index: 999; /* Zablokowanie interakcji ze stroną */
    display: none; /* Ukryty, dopóki nie potrzebny */
}

/* Styl dla panelu cookies */
.cookie-consent {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: #333;
    color: white;
    text-align: center;
    padding: 15px;
    z-index: 1000; /* Wyższy niż overlay, aby było widoczne */
    display: none; /* Ukryty, dopóki nie potrzebny */
    max-height: 80%;
    overflow-y: auto;
}

    .cookie-consent p {
        margin: 0;
        padding: 0;
        text-align: justify;
    }