html{
	scroll-behavior:smooth;
}
body{
	margin:0;
	/*font: 400 15px/1.8 "Lato", sans-serif;*/
	/*font: 400 1.5vw "Lato", sans-serif;*/
	font-family: 'Noto Sans', sans-serif;
	font-size:1vw;
	color:black;
}
/* ukrycie elementów do czasu uruchomienia biblioteki ScrollReveal */
.sr .fooReveal { visibility: hidden; }
/*
.Fale1{
	background-image: url("../grafika/fale1.png");
	background-color: transparent;
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: bottom;
}
*/
.Baner img{
	height: auto;
	width: 100%;
	/*display:block;*/
}
.zoom {
  transition: transform .2s; /* Animacja */
}
.zoom:hover {
  transform: scale(1.5); /* (Powiększenie 150% - Uwaga: jeśli powiększenie jest zbyt duże, wyjdzie poza rzutnię) */
}
.PrzygaszenieTla{
	background:rgba(0,34,85, 0.6);
	width:100%;
	height:100%;
}

.Menu{
	width:100%;
	text-align:center;
	position: fixed;
	z-index:2002;
	height:6.6vw;
}

.Wazne{
	width:100%;
	height:3.3vw;
	text-align: center;	
	background-color:red;
	color:white;
	font-size:1.6vw;
	position:relative;
	z-index:2003;
}
.WazneKontener{
	position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
}
.WazneKontener a{
	color:white;
	text-decoration:none;
	font-weight:bold;
}
.WazneKontener a:hover{color:gold;}
.MenuG{
	width:100%;
	/*background-color:#002255;*/
	background-color:rgb(0,34,52);
	text-align: center;	
	z-index:2004;
	padding:0;
	margin:0;
	height:3.3vw;
}
.MenuGKontener{
	font-size:1.4vw;
	display: inline-block;
    text-align:center;
	padding:0;
	margin:0;
	font-weight:bold;
	/*background-color:green;*/
	height:3.3vw;
	margin:0.2vw 0 -0.5vw 0;
}

/* --------------- BANER --------------- */
.Podklad{
	width:100%;
	height:6.6vw;
}
.Baner{
	position:relative;
	z-index:2001;
	/*top:6.6vw;*/
}
.Logo{
	background-image:url("../grafika/logoXV.png");
	background-size: 12vw 12vw;
	width:12vw;
	height:12vw;
	position:absolute;
	left:43vw;
	top:1vw;
}
.Godlo{
	background-image:url("../grafika/godlo150.png");
	background-size: 5.8vw;
	width:5.8vw;
	height:5.8vw;
	position:absolute;
	left:1vw;
	top:1vw;
}
.BanerNazwaSzkoly{
	font-family: 'Cantora One', sans-serif;
	font-size:2vw;
	color:white;
	position:absolute;
	top:4vw;
	right:5vw;
	text-align:center;	
}
.BanerCien{text-shadow:0.1vw 0.2vw 0.3vw black;}
.BanerDuzy{font-size:3vw;}
.BanerMaly{font-size:1.6vw;}
.BanerPrzyciski a{
	text-decoration:none;
	/*font-weight:bold;*/
	color:white;
}
.BanerPrzyciski{
	width:100%;
	position:absolute;
	bottom:1vw;
	left:auto;
	text-align: center;
	font-family: "Noto Sans", sans-serif;
}
.BanerPrzycisk{
	margin:0 0.5vw;
	padding:0 0.5vw;
	display: inline-block;
    text-align: left;
}
.BanerPrzyciskKolo{
	/*width:6vw;
	height:6vw;
	background-color:white;
	color:black;
	border-radius:3.3vw;
	border:0.3vw solid white;*/
	/*line-height: 6vw;*/
	text-align:center;
	/*box-shadow: 0 0 1vw black;*/
	
	display: flex; 
	align-items:center;
}

.BanerPrzyciskDziennik div{
	background-image:url("../grafika/dziennikBW.png");	margin:0 auto;
	background-size: 6vw 6vw;
	width:6vw;
	height:6vw;
	transition: 200ms;	
}
.BanerPrzyciskDziennik div:hover{
	background-image:url("../grafika/dziennikCOL.png");
	margin:0 auto;
	background-size: 6vw 6vw;
	width:6vw;
	height:6vw;
	transition: 200ms;
}

.BanerPrzyciskBiblioteka div{
	background-image:url("../grafika/bibliotekaBW.png");
	margin:0 auto;
	background-size: 6vw 6vw;
	width:6vw;
	height:6vw;
	transition: 200ms;
}
.BanerPrzyciskBiblioteka div:hover{
	background-image:url("../grafika/bibliotekaCOL.png");
	margin:0 auto;
	background-size: 6vw 6vw;
	width:6vw;
	height:6vw;
	transition: 200ms;
}

.BanerPrzyciskPortal div{
	background-image:url("../grafika/portalwymianyBW.png");
	margin:0 auto;
	background-size: 6vw 6vw;
	width:6vw;
	height:6vw;
	transition: 200ms;
}
.BanerPrzyciskPortal div:hover{
	background-image:url("../grafika/portalwymianyCOL.png");
	margin:0 auto;
	background-size: 6vw 6vw;
	width:6vw;
	height:6vw;
	transition: 200ms;
}

.BanerPrzyciskPlan div{
	background-image:url("../grafika/planlekcjiBW.png");
	margin:0 auto;
	background-size: 6vw 6vw;
	width:6vw;
	height:6vw;
	transition: 200ms;
}
.BanerPrzyciskPlan div:hover{
	background-image:url("../grafika/planlekcjiCOL.png");
	margin:0 auto;
	background-size: 6vw 6vw;
	width:6vw;
	height:6vw;
	transition: 200ms;
}

.BanerPrzyciskKontakt div{
	background-image:url("../grafika/kontaktBW.png");
	margin:0 auto;
	background-size: 6vw 6vw;
	width:6vw;
	height:6vw;
	transition: 200ms;
}
.BanerPrzyciskKontakt div:hover{
	background-image:url("../grafika/kontaktCOL.png");
	margin:0 auto;
	background-size: 6vw 6vw;
	width:6vw;
	height:6vw;
	transition: 200ms;
}

.BanerPrzycisk:hover{
	/*border:0.3vw solid red;*/
	/*box-shadow: 0 0 1vw red;*/
	color:gold;
}
/*.BanerPrzyciskTXT:hover{
	text-shadow:0 0 0.3vw red;
}*/
.BanerPrzyciskTXT{
	margin-top:0.5vw;
	text-align:center;
	font-size:1.1vw;
	text-shadow:0.1vw 0.2vw 0.3vw black;
	color:white;
}
/* --------------- MENU ŚRODKOWE --------------- */
.MenuS{
	overflow:hidden;
	margin:-0.3vw auto 0 auto;
	width:100%;
	font-family: "Noto Sans", sans-serif;	
	text-align: center;	
	/*background-color:#002255;
	background-color:#282E34;*/
	background-color:rgb(0,34,52);
	color:#898989;
	font-size:1.5vw;
	z-index:5;
}
.MenuSKontener{
	overflow:hidden;
	margin:0.5vw auto;
	display: inline-block;
    text-align: left;
	vertical-align:middle;
	/*background-color:lightgreen;*/
}
.MenuSPole{
	overflow:hidden;
	float:left;
	margin:0 1vw;	
	/*background-color: gold;*/
	height:4vw;
	display: flex;
	align-items: center;
}
.MenuSFacebook div{
	background-image:url("../grafika/facebookBW.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSFacebook div:hover{
	background-image:url("../grafika/facebookCOL.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSYoutube div{
	background-image:url("../grafika/youtubeBW.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSYoutube div:hover{
	background-image:url("../grafika/youtubeCOL.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSInstagram div{
	background-image:url("../grafika/instagramBW.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSInstagram div:hover{
	background-image:url("../grafika/instagramCOL.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSBip div{
	background-image:url("../grafika/bipBW.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSBip div:hover{
	background-image:url("../grafika/bipCOL.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSHangar div{
	background-image:url("../grafika/hangarBW.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSHangar div:hover{
	background-image:url("../grafika/hangarCOL.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSKino div{
	background-image:url("../grafika/kinoBW.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSKino div:hover{
	background-image:url("../grafika/kinoCOL.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSIskra div{
	background-image:url("../grafika/iskraBW.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSIskra div:hover{
	background-image:url("../grafika/iskraCOL.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSTaekwondo div{
	background-image:url("../grafika/taekwondoBW.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSTaekwondo div:hover{
	background-image:url("../grafika/taekwondoCOL.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSAqua div{
	background-image:url("../grafika/aquaBW.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
.MenuSAqua div:hover{
	background-image:url("../grafika/aquaCOL.png");
	background-size: 4vw 4vw;
	width:4vw;
	height:4vw;
	transition: 200ms;
}
/* --------------- KINO, HANGAR I OBIEKTY SPORTOWE --------------- */ 
.Obiekty img{
	/*width:28vw;*/
	/*height:100px;*/
	display:block;
	margin:1vw auto;
	border-radius:0.5vw;
}
.Obiekty p{
	margin:1vw;
	text-align:left;
}
.ObiektyLOGO{width:14vw;}
.ObiektyFOTKI{width:21vw;object-fit:scale-down;}
.Obiekty{
	overflow:hidden;
	position:relative;
	/*top:5vw;*/
	/*background-color:gold;*/
	width:100%;
	text-align: center;			
}
.ObiektyKontener{
	/*background-color:green;*/
	/*width:95%;*/
	margin:0 auto;
}
.ObiektyKontener h3{
	text-align:center;
	font-size:2.5vw;
	margin:1vw 30vw;
	padding:0.5vw 0;
	color:#002255;
	background-color: rgba(0, 0, 0, 0.5);
	background: rgba(0, 0, 0, 0.5);
	color: rgba(255, 255, 255, 1);
	border-radius:1vw;
}
.ObiektyOkienka{
	font-family: "Noto Sans", sans-serif;
	/*background-color: rgba(0, 34, 85, 0.6);
	background: rgba(0, 34, 85, 0.6);*/
	background-color: rgba(0,0,0,0.4);
	background: rgba(0,0,0,0.4);
	color: rgba(255, 255, 255, 1);
	border-radius:1vw;
	display: inline-block;
	width:22vw;
	height:41vw;
	margin:0 0.5vw 1.5vw 0.5vw;
	font-size:1.0vw;
	vertical-align:top;
}
.ObiektyOkienka div>div>img{
	width:100%;
	object-fit:scale-down;
}
.ObiektyOkienka a{
	font-variant:small-caps;
	text-decoration:none;
	color:gold;
	font-size:1.1vw;
	font-weight:bold;
	display:block;
	text-align:right;
}
.ObiektyOkienka a:hover{color:lightgreen;}
.ObiektyTXT p{
	/*position:relative;
	top:13vw;
	width:21vw;
	height:15vw;*/
}
#ObiektySportowe, #BazaEdukacyjna, #HangarKultury, #KinoJeremi{
	border-radius:0.5vw;
	margin:0 auto;
	box-shadow: 0 0 0.1vw 0.1vw gray;
}
/* --------------- AKTUALNOŚCI --------------- */ 

/*.NewsyFOTKI{width:21vw;object-fit:scale-down;}*/
.Newsy{
	overflow:hidden;
	position:relative;
	/*top:5vw;*/
	/*background-color:gold;*/
	width:100%;
	text-align: center;			
}
.NewsyFull{
	overflow:hidden;
	position:relative;
	/*top:5vw;*/
	background-color: rgba(0, 0, 0, 0.5);
	background: rgba(0, 0, 0, 0.5);
	width:100%;
	text-align: center;		
}
.NewsyKontener{
	/*background-color:green;*/
	/*width:95%;*/
	margin:0 auto;
}
.NewsyKontener h3{
	text-align:center;
	font-size:2.5vw;
	margin:1vw 30vw;
	padding:0.5vw 0;
	color:#002255;
	background-color: rgba(0, 0, 0, 0.5);
	background: rgba(0, 0, 0, 0.5);
	color: rgba(255, 255, 255, 1);
	border-radius:1vw;
}
.NewsyOkienka1{
	overflow:hidden;
	font-family: "Noto Sans", sans-serif;
	/*background-color: rgba(0, 34, 85, 0.6);
	background: rgba(0, 34, 85, 0.6);*/
	background: rgba(255,255,255,0.6);
	color: rgba(0, 0, 0, 1);
	border-radius:0.5vw;
	display: inline-block;
	width:89.5vw;
	/*height:30vw;*/
	margin:0 0.5vw 1.5vw 0.5vw;
	font-size:1.1vw;
	vertical-align:top;
	padding:0.3vw;
	text-align:left;
}
.NewsyOkienka1 a{
	text-decoration:none;
	color:#e1e1e2;
}
.NewsyOkienka1 a:hover{
	text-decoration:underline;
	color:white;
}
.NewsyOkienka2poziom, .NewsyOkienka2pion{
	overflow:hidden;
	font-family: "Noto Sans", sans-serif;
	/*background-color: rgba(0, 34, 85, 0.6);
	background: rgba(0, 34, 85, 0.6);*/
	/*background-color: rgba(255,255,255,0.6);*/
	background: rgba(255,255,255,0.6);
	color: rgba(0, 0, 0, 1);
	border-radius:0.5vw;
	display: inline-block;
	width:44vw;
	min-height:41vw;
	margin:0 0.5vw 1.5vw 0.5vw;
	font-size:1.0vw;
	vertical-align:top;
	padding:0.3vw;
}

.NewsyOkienka3{
	overflow:hidden;
	font-family: "Noto Sans", sans-serif;
	/*background-color: rgba(0, 34, 85, 0.6);
	background: rgba(0, 34, 85, 0.6);*/
	background-color: rgba(255,255,255,0.6);
	background: rgba(255,255,255,0.6);
	color: rgba(0, 0, 0, 1);
	border-radius:0.5vw;
	display: inline-block;
	width:28.8vw;
	min-height:38vw;
	margin:0 0.5vw 1.5vw 0.5vw;
	font-size:1.8vw;
	vertical-align:top;
	padding:0.3vw;
}
.NewsyOkienka1 img{
	border-radius:0.5vw;
}
.NewsyOkienka2poziom img{
	border-radius:0.5vw;
	width:40vw;	 
	object-fit:cover;
}
.NewsyOkienka2pion img{
	border-radius:0.5vw; 
	width:20vw;
	object-fit:cover;
}
.NewsyOkienka3 img{
	border-radius:0.5vw;
	height:25vw; 
	width:25vw; 
	object-fit:cover;
}


.StarszeNewsy p{
	font-size:1.0em;
	line-height: 1.0em;
	margin-top:0.4em;
	margin-bottom:0.4em;
	margin-left:0.4em;
	text-indent: -0.6em;
}

.NewsyOkienka div>img{
	width:100%;
	height:10vw;
	/*object-fit:scale-down;*/
	object-fit:cover;
	/*margin:1vw;*/
	border-radius:0.3vw 0.3vw 0 0;
}
.NewsyTrescPoziom{
	/*border:0.2vw solid rgba(0, 0, 0, 0.6);*/
	border-radius:0.5vw;
	background:rgba(0, 0, 0, 0.3);
	color:white;
	width:95%;
	max-height:8vw;
	text-align:justify;
	padding: 0 0.5vw;
	/*padding:-0.5vw 0.3vw -0.5vw 0.3vw;*/
	margin: 0 auto;
}
.NewsyTrescPoziom p, .NewsyTrescPion p{
	margin:0;
}
.NewsyTrescPion{
	/*border:0.2vw solid rgba(0, 0, 0, 0.6);*/
	border-radius:0.5vw;
	background:rgba(0, 0, 0, 0.3);
	color:white;
	width:95%;
	max-height:30.5vw;
	text-align:justify;
	padding:0.2vw;
	margin: 0 auto;
}
.TekstGradient {
  background: linear-gradient(0deg, rgba(0,0,0,0), rgba(0,0,0,1) 40%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.NewsyPublikacja{
	float:left;
	overflow:hidden;
	font-size:0.8vw;
	/*vertical-align:bottom;*/
	text-align:left;
	color: black;
}
.NewsyWiecej div{
	float:right;
	font-size:1.0vw;
	color:rgba(0,0,0,0.6);
	margin-right:1.0vw;
	border:0.15vw solid rgba(0,0,0,0.6);
	padding:0.2vw 0.5vw;
	border-radius:0.5vw;
	/*background: rgba(0,0,0,0.3);
	background:#e1e1e2;*/
}
.NewsyWiecej div:hover{
	border:0.15vw solid #e1e1e2;
	background: rgba(0,0,0,0.3);
	color:#e1e1e2;
}
.NewsyOkienka1 h4, .NewsyOkienka2poziom h4, .NewsyOkienka2pion h4, .NewsyOkienka3 h4{
	text-align:center;
	font-size:1.8vw;
	margin:0.5vw 0 0 0;
}

.NewsyOkienka a{
	/*font-variant:small-caps;*/
	text-decoration:none;
	color:blue;
	/*font-size:1.1vw;*/
	font-weight:bold;
	display:block;
	text-align:right;
	text-decoration:none;
}
.NewsyOkienka a:hover{color:red;}
.NewsyWszystkie a{
	width:100%;
	font-size:2.0vw;
	vertical-align:middle;
	text-align:center;
	display:block;
	position: fixed;
	top:26%;
}


/* ----------------------- KARUZELA YOUTUBE ------------------------ */
.KaruzelaYoutube{
	overflow:hidden;
	width:100%;
}

.KaruzelaYoutube h3{
	margin:1.5vw auto 0 auto;
	width:40vw;
	text-align:center;
	font-size:2.0vw;
	padding:0.5vw 0;
	color:#002255;
	background-color: rgba(0, 0, 0, 0.5);
	background: rgba(0, 0, 0, 0.5);
	color: rgba(255, 255, 255, 1);
	border-radius:1vw;
}
.KaruzelaYoutubePrzerwa{
	overflow:hidden;
	padding: 0 0 1vw 0;
}

/* WYRÓŻNIENIA I NAGRODY */
.Wyroznienia{
	overflow:hidden;
	width:100%;
}

.Wyroznienia h3{
	margin:1.5vw auto 0 auto;
	width:46vw;
	text-align:center;
	font-size:2.0vw;
	padding:0.5vw 0;
	color:#002255;
	background-color: rgba(0, 0, 0, 0.5);
	background: rgba(0, 0, 0, 0.5);
	color: rgba(255, 255, 255, 1);
	border-radius:1vw;
}

.WyroznieniaKontener{
	overflow:hidden;
	text-align:center;
	padding:1.5vw 0;
}
.WyroznieniaGrafika{
	background-color: rgba(0, 0, 0, 0.4);
	background: rgba(0, 0, 0, 0.4);
	display: inline-block;
    text-align:center;
	padding:0 2vw;
	vertical-align:top;
	padding:1.0vw;
	border-radius:1vw;
	margin:0 1vw;
}
.WyroznieniaGrafika img{
	object-fit:scale-down;
	border-radius:0.5vw;
	height:20vw;
	width:auto;
}

/* --------------- MAPA --------------- */
.MapaGoogle{
	/*overflow:hidden;*/
	/*width:100%;
	height:100vw;*/
	position:relative;
}
/* --------------- KONTAKT --------------- */
.OknoKontakt a{
	text-decoration:none;
	font-weight:bold;
	color:red;
}
.OknoKontakt a:hover{
	color:green;
}
.OknoKontakt{
	overflow:hidden;
	width:23vw;
	/*height:19vw;*/
	background-color:#FFFFCC;
	position:absolute;
	right:5vw;
	top:4vw;
	border-radius:1vw;
	font-family: "Noto Sans", sans-serif;
}
.OknoKontaktNaglowek{
	overflow:hidden;
	width:100%;
	padding:0.8vw 0;
	background-color:#c0d1ff;
	border-radius:1vw 1vw 0 0;
	font-size:1.8vw;
	text-align:center;
	color:#063db2;
	font-weight:bold;
	margin-bottom:0.5vw;
}
.OknoKontaktTXT{
	overflow:hidden;
	width:100%;
	font-size:1vw;
	text-align:center;
	color:black;
	margin:0.3vw 0 0.8vw 0;
}
/* --------------- STOPKA --------------- */
.Stopka{
	overflow:hidden;
	width:100%;
	min-height:8vw;
	/*background-color:#002255;*/
	background-color:rgb(0,34,52);
	color:#c0d1ff;
	font-size:0.8vw;
	margin-top:-0.2vw;
	font-family: "Noto Sans", sans-serif;
}
.Stopka h4{
	font-size:1.4em;
	font-weight:normal;	
}
.StopkaKontener{
	overflow:hidden;
	margin:0 auto;
	/*background-color:lightgreen;*/	
	text-align: center;
}
.StopkaKolumna{
	overflow:hidden;
	margin:0.5vw 1.5vw;
	min-width:10vw;	/* szerokość kolumny stopki */
	display: inline-block;
    text-align: left;
	vertical-align:top;
	/*background-color:lightgreen;*/
}
.StopkaKolumna a{
	text-decoration:none;
	/*font-weight:bold;*/
	color:#c0d1ff;
}
.StopkaKolumna a:hover{
	color:gold;	
}
.StopkaLinia{
	border-top:0;
	border-left:0;
	border-right:0;
	border-bottom: dotted 0.1vw #c0d1ff;
}