@charset "UTF-8";
:root {
	font-size: 20px;
}
html {
	font-size: 20px;
}
* {
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
	/*border: 1px rgb(142, 152, 142) dotted;*/
}
body {
	min-height: 100%;
	width: 100%;
	background-color:#CCC;
	position: absolute;
}
#kontener {
	font-family: "Titillium Web", sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #666;
	height: 100%;
	width: 100%;
	background-color:#CCC;
	background-repeat:no-repeat;
	background: linear-gradient(#CCC 0%, #EfEfEf 10%, #CCC 100%);
	position: relative;
	z-index: 5;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
}

#naglowek {
	background-color: rgba(255, 255, 255, 0.8);
	box-shadow:0px 0px 10px black;
	z-index: 102;
}
#kontener #naglowek #logo {
	min-width: 200px;
	

	/* border: 1px dotted silver; */
}
#kontener #naglowek #tytul {
	flex-grow: 1;
	padding: 10px 20px;
	/* border: 1px dotted silver; */
	max-height: 150px;
}
#kontener #naglowek #tytul h1 {
	font-family: "Titillium Web", sans-serif;
  	font-weight: 700;
	font-size: 20px;
	font-style: normal;
	font-variant: normal;
	color: #000;
}
#kontener #naglowek #logowanie {
	padding: 10px 20px;
	align-self: flex-start;
	font-family: "Titillium Web", sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	color: #369;
	text-decoration: none;
	/* border: 1px dotted silver; */
}
#kontener #naglowek #logowanie a {
	font-style: normal;
	color: #CCC;
	text-decoration: none;
}
#kontener #naglowek #logowanie a:hover {
	font-style: normal;
	color: #09C;
	text-decoration:  none;
	font-size: 14px;
	font-weight: bold;
}

#kontener #tresci {
	font-family: "Titillium Web", sans-serif;
	font-size: 14px;
	color: #333;
	text-decoration: none;
	
}
#kontener #tresci #menu_glowne {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: flex-start;
	justify-content: flex-start;
	gap: 1rem;
	width: calc(100% - 1rem);
	/*border: 1px dotted red;*/
	margin: 0 auto;
	
}
#kontener #tresci #menu_glowne a {
	display: block;
	color: rgb(28, 115, 159);
	text-shadow: 0px 0px 0px #b0eeff;
	border-radius: 1rem;
	/*background-color: rgb(216, 216, 216);*/
	font-size: 0.7rem;
	font-weight: 700;
	font-style: normal;
	font-variant: normal;
	padding: 0.3rem 1rem;
	text-decoration: none;
	transition: transform ease 700ms, box-shadow ease 700ms, background ease 700ms, text-shadow ease 700ms, color linear 700ms;
	box-shadow:2px 2px 4px rgba(0, 0, 0, 0.3);

	background: rgba(235,235,235,1);
	background: -moz-linear-gradient(top, rgba(235,235,235,1) 0%, rgb(188, 188, 188) 72%, rgba(171,171,171,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(235,235,235,1)), color-stop(72%, rgb(188, 188, 188)), color-stop(100%, rgba(171,171,171,1)));
	background: -webkit-linear-gradient(top, rgba(235,235,235,1) 0%, rgb(188, 188, 188) 72%, rgba(171,171,171,1) 100%);
	background: -o-linear-gradient(top, rgba(235,235,235,1) 0%, rgb(188, 188, 188) 72%, rgba(171,171,171,1) 100%);
	background: -ms-linear-gradient(top, rgba(235,235,235,1) 0%, rgb(188, 188, 188) 72%, rgba(171,171,171,1) 100%);
	background: linear-gradient(to bottom, rgba(235,235,235,1) 0%, rgb(188, 188, 188) 72%, rgba(171,171,171,1) 100%);
}
#kontener #tresci #menu_glowne a:hover {
	text-decoration: none;
	transform: scale(1.1);
	transition: transform ease 500ms, box-shadow ease 500ms, background ease 500ms, text-shadow ease 500ms, color linear 500ms;
	color: rgb(54, 215, 255);
	text-shadow: 0px 0px 1px #fdffff, 0px 0px 3px #b0eeff, 0px 0px 8px #9deaff;
	text-shadow: -1px -1px 0px #2fafff;
	box-shadow:4px 4px 8px rgba(0, 0, 0, 0.4);
	z-index: 100;
	animation: zIndexUP 500ms;
	background: rgba(235,235,235,1);
	background: -moz-linear-gradient(top, rgba(235,235,235,1) 0%, rgb(188, 188, 188) 50%, rgba(171,171,171,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(235,235,235,1)), color-stop(50%, rgb(188, 188, 188)), color-stop(100%, rgba(171,171,171,1)));
	background: -webkit-linear-gradient(top, rgba(235,235,235,1) 0%, rgb(188, 188, 188) 50%, rgba(171,171,171,1) 100%);
	background: -o-linear-gradient(top, rgba(235,235,235,1) 0%, rgb(188, 188, 188) 50%, rgba(171,171,171,1) 100%);
	background: -ms-linear-gradient(top, rgba(235,235,235,1) 0%, rgb(188, 188, 188) 50%, rgba(171,171,171,1) 100%);
	background: linear-gradient(to bottom, rgba(235,235,235,1) 0%, rgb(188, 188, 188) 50%, rgba(171,171,171,1) 100%);
}
#menu_glowne a:not(:hover) {
	animation: zIndexDOWN 700ms;
}

@keyframes zIndexUP {
	0% {z-index: 1;}, 100% {z-index: 100;}
}
@keyframes zIndexDOWN {
	0% {z-index: 100;}, 100% {z-index: 1;}
}

@media (min-width: 1100px) {
	#naglowek {
		position: fixed;
		height: 150px;
		width: 100%;
		left: 0px;
		top: 0px;
		right: 0px;
		display: flex;
		align-items: center;
		gap: 1em;
	}
	#logo {
		padding: 20px;
	}
	#kontener #tresci {
		width: calculate(100%-20px);
		margin: 160px 10px 10px 10px;
	}
	#kontener #tresci #menu_glowne a {
		
	}
}
@media (max-width: 1100px) and (min-width: 1000px) {
	#naglowek {
		position: fixed;
		height: 150px;
		width: 100%;
		left: 0px;
		top: 0px;
		right: 0px;
		display: flex;
		align-items: center;
		gap: 1em;
	}
	#logo {
		padding: 20px;
	}
	#kontener #tresci {
		width: calculate(100%-20px);
		margin: 160px 10px 10px 10px;
	}
	#kontener #tresci #menu_glowne a {
		
	}
}
@media (max-width: 1000px) and (min-width: 800px) {
	#naglowek {
		position: fixed;
		height: 150px;
		width: 100%;
		left: 0px;
		top: 0px;
		right: 0px;
		display: flex;
		align-items: center;
		gap: 1em;
	}
	#logo {
		padding: 1rem;
	}
	#kontener #tresci {
		width: calculate(100%-20px);
		margin: 160px 10px 10px 10px;
	}
	#kontener #tresci #menu_glowne a {
		
	}
}
@media (max-width: 800px) and (min-width: 500px) {
	#naglowek {
		position: relative;
		height: auto;
		/*top: -10px;*/
		width: 100%;
	}
	#logo {
		position: relative;
		/*top: 40px;*/
		max-width: 400px;
		padding: 2rem;
		margin: 10px auto 10px auto;
	}
	#kontener #tresci {
		width: calculate(100%-20px);
		margin: 0 10px 10px 10px;
	}
	#kontener #tresci #menu_glowne a {
		/*width: 100%; */
	}
}
@media (max-width: 500px) {
	#naglowek {
		position: relative;
		height: auto;
		/*top: -10px;*/
		width: 100%;
	}
	#logo {
		position: relative;
		/*top: 40px;*/
		max-width: 400px;
		margin: 10px auto 10px auto;
	}
	#kontener #tresci {
		width: calculate(100%-20px);
		margin: 0 10px 10px 10px;
	}
	#kontener #tresci #menu_glowne a {
		width: 100%;
		text-align: center;
	}
	#kontener #tresci #menu_glowne a:hover {
		transform: scale(103%);
	}
}


#kontener #tresci h1, h2, h3{
	font-family: "Titillium Web", sans-serif;
	color: #414141;
	text-decoration: none;
	font-weight: bold;	
}
#kontener #tresci h1{
	font-size: 18px;
	margin-top: 20px;
	margin-bottom: 15px;
}
#kontener #tresci h2{
	font-size: 16px;
	margin-top: 10px;
	margin-bottom: 8px;
}
#kontener #tresci h3{
	font-size: 15px;
}
#kontener #tresci a{
	color: #09C;
	text-decoration: none;	
}
#kontener #tresci a:hover{
	color: #069;
	text-decoration: underline;	
}
.foto_kandydata {	
	width: 150px;
	min-height: 180px;
	border: none;
	border-radius: 10px; 
	margin: 20px;
	padding: 10px;
	display: block;
  	align-items: center;
  	justify-content: center;
}
.foto_kandydata p {
	display: block;
	text-align: center;
	font-weight: bold;
	color: silver;
}
.foto_kandydata img {
	width: 100%;
	border-radius: 10px;
	box-shadow: 5px 5px 10px;
}
.ekonsultacje {	
	width: 90%;
	min-height: 100px;
	border: 1px solid silver;
	border-radius: 10px; 
	margin: 20px auto;
	padding: 6px;
	display: block;
	box-shadow: 5px 5px 10px silver;
}
.ekonsultacje h1 {
	text-align: center;
	margin-top: 0;
}
.ekonsultacje p {
	text-align: center;
}
hr {
	border: 0;
    height: 1px;
    background: #333;
    background-image: linear-gradient(to right, #ccc, #333, #ccc);
	margin-bottom: 20px;
	margin-top:10px;
}
.lista_kandydatow{
	width: calculate(100% - 40px);
	margin: 0px 10px 5px 10px;
	border: 1px solid #BDBDBD;
}

#egzamin {
	font-family: "Titillium Web", sans-serif;
	font-size: 14px;
	font-weight: normal;	
}
#egzamin table {
	border: 1px solid black; 
	border-collapse: collapse;
}
#egzamin table td {
	padding: 5px;
}
#egzamin table .naglowek {
	padding: 5px;
	font-family: "Titillium Web", sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #39F;
	text-decoration: none;
	vertical-align:middle;
	text-align:center;
}
#egzamin table .naglowekpion {
	padding: 5px;
	font-family: "Titillium Web", sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #39F;
	text-decoration: none;
	vertical-align:middle;
	text-align:center;
	min-width: 40px;
	/*-webkit-transform: translate(0px) rotate(90deg);
  	-webkit-transform-origin: 0 -250px;*/

  /*transform: translate(0px) rotate(90deg);
  transform-origin: 0 -250px;*/
}
#kontener #tresci #formularz_dodaj_kandydata input.text { 
	font-family: "Titillium Web", sans-serif;
	background-color:#FFFFFF;
	border:solid 1px #A9A9A9;
	font-size:13px;
	color:#000000;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-radius:0px;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:5px;
	padding-right:5px;
}
#kontener #tresci #formularz_dodaj_kandydata label {
   font-size:14px;
   color:#333333;
   font-weight:normal;
   padding-top:0px;
   padding-bottom:0px;
}
form input {
	font-family: "Titillium Web", sans-serif;
	border: 0; 
	margin: 2px 0; 
	background: none;
}
form input {
	border-radius: 5px;
	font-family: calibri; 
	letter-spacing: 0px; 
	font-size: 1em; 
	padding: 4px 10px 4px 10px; 
	color: #333333;
}
form input {
	box-shadow: 0 0 5px silver inset; 
	-moz-outline: none; 
	-webkit-outline: none; 
	-o-outline: none; 
	outline: none; 
}
form input {
	background: #f2f2f2;
	background: -moz-linear-gradient(top, #f2f2f2 1%, #d6d6d6 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#f2f2f2), color-stop(100%,#d6d6d6));
	background: -webkit-linear-gradient(top, #f2f2f2 1%,#d6d6d6 100%);
	background: -o-linear-gradient(top, #f2f2f2 1%,#d6d6d6 100%);
	background: -ms-linear-gradient(top, #f2f2f2 1%,#d6d6d6 100%);
	background: linear-gradient(to bottom, #f2f2f2 1%,#d6d6d6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#d6d6d6',GradientType=0 );
}
#stopka {
	width: 100%;
	text-align: center;
	background-color: silver;
	margin: 10px 0 0 0;
	padding: 20px 0;
}
/* miganie tekstu */
.blink {
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-name: blink;
}
	
@keyframes blink {
	0% {opacity: 1;}
	89% {opacity: 1;}
	90% {opacity: 0;}
	100% {opacity: 0;}
}