.grid {
	display: grid;
	grid-template-columns	: 240px minmax( 0px, 100%);
	grid-template-rows	: minmax( 32px, max-content) auto min-content;
	min-height		: 70vh;
	width 		: 100%;
	max-width	: 100%;
	margin 		: 0px auto;
	margin-top	: 0px;	
 }
 
.bezMenu {
	grid-template-columns	: 0px 100% !important;	
	 
 }
 
.header { 
	grid-area	: header; 
	grid-column	: 1 / span 2; 
	grid-row	: 1; 
	border-bottom	: 1px solid gray; 
	text-align	: center; 
	padding		: 4px; 
	position	: sticky; 
	top		: 0px; 
	background-color: white;
	padding 	: 8px;
	z-index		: 9999;
}

.header A IMG,
.menu A IMG { 
	max-height	: 1.2em;
	position	: relative;
	top		: 2px;
}

.header A {
	font-weight	: var(--font-weight);
	text-transform 	: uppercase;
	padding 	: 0px 8px;
	margin		: 0px 8px;
	color		: black;
	display		: inline-block;
}

.header B {
	text-transform 	: uppercase;
	padding 	: 0px 8px;
	margin		: 0px 8px;
	color		: black;
	display		: inline-block;
}

.header A:first-child {
	padding 	: 0px;
	margin 		: 0px;
}
.home { 
	float 		: left; 
	margin-right	: 12px; 
	height		: 20px;
}
.home IMG { 
	padding		: 2px; 
	height		: 20px;
}

.menu { 
	grid-area	: menu;  
	grid-column	: 1;  
	grid-row	: 2 / span 2; 
	border-right	: 1px dotted gray; 
	font-size	: 80%; 
	padding		: 16px; 
	display		: block; 
	/* position	: sticky; 
	top 		: 41px; */
	background-color: white;
	
}
.menu A {  
	font-weight	: var(--font-weight);
	color		: black;
	display		: block;
}

.menu B {
	border-radius	: var(--radius);
	background	: var(--niebieski);
	color		: white;
	padding		: 0 var(--gap);
	display		: block;
}

.menu SPAN {  
	display		: block;
	}
.menu A:hover {   
	text-decoration	: none;
	}
/*	
.menu A::before {  
	content 	: var(--rarr); 
	color		: gray; 
	margin-right	: 8px; 
}
*/
.menuClose { 
	color 		: blue;	
}

.menuHead { 
	display		: block; 
	border-bottom	: 1px dotted silver; 
	margin-top	: 16px; 
	margin-bottom	: 4px; 
	background-color: #F2F2F2; 
}
.menu > :nth-child(2) { 
	margin-top: 0px;  
} /* bo 1 jest close */ 

.hamburger { 
	display		: none; 
	height		: 22px; 
	cursor 		: pointer; 
	font-size	: 200%; 
	position	: relative; 
	top		: -16px;  
	float 		: right;
}

.main { 
	grid-area: main;  
	grid-column: 2;  
	grid-row: 2; 
	min-height: 100vh;
	padding: 32px; 
	background-color: white;
	opacity: 1.0;
}

#zawartosc {
	max-width	: var(--meritum-width);
	margin 		: 0px auto;
}
/*
.right { 
	grid-area: right;  
	grid-column: 3;  
	grid-row: 2; 
	border-left: 1px dotted gray; 
	padding: 16px; 
	background-color: white;
	opacity: 0.8;
}
*/
.rightClose { 
	color : red;
	
}

.menuClose, 
.rightClose {
	position: relative;
	top : -16px;
	right: -8px;
	float: right; 
	cursor : pointer; 
	color : gray;
}

.footer { 
	grid-area	: footer;  
	grid-column	: 2;  
	grid-row	: 3;
	text-align	: center;  
	background	: var(--szary_jasny);
	background-image: linear-gradient(to bottom, white, var(--szary_jasny));
	width		: 100%;
	margin		: 0 auto;
	padding		: 0 calc( ( 100% - var(--meritum-width) ) / 2);
}
.footer, .footer A {
	font-size	: var(--font-size);
}
.footer A {  
	text-decoration : none; 
	color		: black; 
	border-bottom	: 1px dashed silver;  
}

.footerLink {
	font-weight	: var(--font-weight);
	text-align	: left;
	flex-basis	: 190px !important;
}

.footerLink A {
	font-weight	: var(--font-weight);
}

.CTA {
	display 	: block;
	font-size	: var(--font-h3);
	color		: var(--niebieski);
	font-weight	: var(--font-bold);
	background	: var(--niebieski_jasny);
	padding		: 8px 16px;
	border-radius	: 16px;
	text-align	: center;
	min-width	: 160px;
	max-width	: 400px;
	margin		: 8px auto;
	white-space 	: nowrap; 
}

.CTA::after {
	content		: var(--rarr-gruba);
	margin-left	: 8px;
}
/*
.CTA::before {
	content		: var(--check);
	margin-right	: 8px;
}
*/
.CTA A {
	color		: var(--niebieski);
}

.CTA > .linkKupTeraz {
	display		: inline-block;
	text-align	: right;
	margin		: 0px 16px;
}

.pakietSticky {
	 float		: right;
	 margin-left	: 16px;
	 position	: sticky; 
	 top		: 64px;
	 background	: var(--niebieski_jasny);/* white; */
	 min-height	: 64px;
	 border		: 1px dotted var(--niebieski);
	 padding	: 16px;
	 border-radius	: var(--radius);
}

@media (max-width: 850px) {
	@import url("assets/css/grid-mobile.css");
	#menu { display : none; }
	
	#main { 
		grid-column	: 1 / span 2 !important;   
		grid-row	: 3 !important; 
		grid-template-columns	: auto;
		
	}
	#footer { 
		grid-row : 4;
	}
}

@media print {
	@import url("assets/css/grid-print.css");
}