/* ustawienia globalne */
body{
	/*background-color:#3f1c23;
	*/
	background-color:white;
	}

#logo{
	background-color:white;
	width:150px;
	height:150px;
	margin: 10px 15px 15px 15px;
	padding-top: 5px;
	border-radius: 22px;
}
#logo img{
	width:150px;
	height:150px;
}
#stopka{
	bottom:0px;
	position:fixed;
	left:0px;
	width:100%;
	text-align:center;
	color:black;
	background-color: #fd7c25;
	font-size:12pt;
}
#info{
	float:left;
	margin: 0 auto;
	padding: 10px 0 10px 0;
	width:100%;
	font-size:12pt;
	border-top: 1px solid #2690cf;
	border-bottom: 1px solid #2690cf;
	background-color: white;
	color:black;
	text-align:  center;
	vertical-align: center;
	text-transform: uppercase;
}

#nrStron{
	margin-top:10px;
	width:100%;
	text-align:center;
}
#nrStron a:hover{
	border-bottom: 3px double #471D47;
}

a:link{
	color: #471D47;
	text-decoration:none;
}
a:hover{
	color: #471D47;
	text-decoration:none;
}
a:active{
	color: #471D47;
	text-decoration:none;
}
a:visited{
	color: #471D47;
	text-decoration:none;
}

/* ustawienia strony logowania */

table#logowanie{
	text-align:center;
	margin: auto;
	margin-top: 10%;
	width: 600px;
	border: 5px #2791d0 solid;
	border-top: 10px #2791d0 solid; 
	border-top-left-radius: 22px;
	width: 40%;
	background-color:  #2791d0;
}

table#logowaniem{
	text-align:center;
	margin: auto;
	margin-top: 2%;
	width: 600px;/*
	border: 5px #2690cf solid;
	border-top: 10px #2690cf solid; 
	border-top-left-radius: 22px;
	width: 40%;*/
	background-color:  #2791d0;
}
td#powitanie{
	width:50%;/*
	border-right: 2px solid #2690cf;
	border-top-left-radius: 22px;*/
	background-color:  white;
}
td#logowaniePanelUzytkownika{
	width:50%;
	background-color: white;
	
}
/*#logowaniePanelWychowawcy{
	float:left;
	width:300px;
	border: 6px inset #fd7c25;

	background-color: #fd7c25;
	background-color:#7A007A;
}*/
#logowaniePanelUzytkownikaNaglowek{
	color:#2690cf;
	font-size: 16pt;
	margin: 10px 0px 5px 0px;
}

#naglowekSklep{
	width: 100%;
	text-align:center;
	margin-bottom:10px;
	border-bottom: silver 2px solid;
}

#naglowekSklep img{
	width:200px;
}

/*#logowaniePanelWychowawcyNaglowek{
	margin-bottom:10px;
	border-bottom: 6px inset #bd5d1c;
	background-color:#bd5d1c;
	color:silver;
	font-size: 16pt;
}*/

/*ustawienie wyglądu strony zalogowanego użytkownika */

#stronaUzytkowa{
	margin:auto;
	width:90%;

	border: 6px inset 9A9A9A;
	
	/*background-color:silver;
*/}
#menu{
	z-index:3;
	position: fixed;
	border-top-right-radius: 25px;
	height:100%;
	top: 15px;
	left: 0;
	float:left;
	width:190px;
	background-color:#f89946;
/*	border-right: 6px solid #844584;
	background-color:#763076;
*/
	}

#informacjeOUzytkowniku{
	z-index:2;
	top: 0; 
	left: 0;
	width: 100%;  
	position: fixed;
	text-align:right; 
	color:silver;
	background-color:#2791d0;
}

#informacjeOUzytkowniku table{
	float:right; 
	color:silver;
}
img.ikona{
		height:25px;
		margin: 0 auto;
}

#tresc{
	width:80%;
	float:left;
	padding-left: 210px;
}

.podMenu{
	width:185px;
	margin-top:2px;
	margin-bottom:2px;
	border-right: 0px outset #2690cf;
	border-bottom: 1px solid #2690cf;
	padding-top: 4px;
	padding-bottom: 4px;
	background-color:#f89946;
	}

.podMenu:hover{
	width:185px;
	margin-top:2px;
	margin-bottom:2px;
	border-right: 5px outset #2690cf;
	border-bottom: 1px solid #2690cf;
	padding-top: 4px;
	padding-bottom: 4px;
	background-color:#bd5d1c;
	font-weight: bold;
}

.podMenu:hover a.menu{
	color:white;
}

.podMenuSt2{
	width:175px;
	margin-top:2px;
	margin-bottom:2px;
	border-right: 0px outset #bd5d1c;
	border-bottom: 1px solid #bd5d1c;
	padding-top: 4px;
	padding-left: 5px;
	padding-bottom: 4px;
	background-color:#fd7c25;
	font-size:small;
	}

.podMenuSt2:hover{
	width:175px;
	margin-top:2px;
	margin-bottom:2px;
	border-right: 5px outset #bd5d1c;
	border-bottom: 1px solid #bd5d1c;
	padding-top: 4px;
	padding-left: 5px;
	padding-bottom: 4px;
	background-color:#bd5d1c;
	font-weight: bold;
	font-size:small;
}

.podMenuSt2:hover a.menu{
	color:white;
	width:100%;
}

a.menu{
	color:5b101a;
	text-decoration:none; 
	width:100%;
	}

/* Tabele */
table.wychowankowie{
	width:80%;
	margin:auto;
	margin-top: 20px;
}

/* do ćwiczeń */

#wyborTrybu{
	float:left;
	padding: 10px 0 10px 0;
	width:80%;
	font-size:12pt;
	border-top: 1px solid #742f74;
	border-bottom: 1px solid #742f74;
	background-color: white;
	color:black;
	vertical-align: center;
}


#wyborTrybu #nowyUzytkonwik{
	padding-left:20%;
}

#informacja{
	margin-top: 30px;
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 10px 5px 10px 5px;
	border: 5px #f89946 solid;
	border-top: 10px #f89946 solid; 
	border-top-left-radius: 22px;
	width: 80%;
}
#informacja[wielkosc~=max]{
	margin-top: 30px;
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 10px 5px 10px 5px;
	border: 5px #f89946 solid;
	border-top: 10px #f89946 solid; 
	border-top-left-radius: 22px;
	width: 100%;
}
#kafelek{
	float:left;
	padding: 10px 0 10px 0;
	width:80%;
	font-size:12pt;
	border-top: 1px solid #2690cf;
	border-bottom: 1px solid #2690cf;
	background-color: white;
	color:black;
	vertical-align: center;
	text-transform: uppercase;

}

#kafelek:hover{
	background-color: #a6c0cf;
}


.kafelekDuzy{
	float:left;
	padding: 10px 0 10px 0;
	width:80%;
	font-size:12pt;
	border-top: 1px solid #2690cf;
	border-bottom: 1px solid #2690cf;
	background-color: white;
	color:black;
	vertical-align: center;
	text-transform: uppercase;

}

.kafelekDuzy:hover{
	background-color: #a6c0cf;
}




#cwiczenieCzescGlowna{
	 display: none;
	 font-size: 20pt;
	 padding-top: 100px;
	
}

#cwiczenieCzescGlownaObrazy{
	 display: none;
	 margin: 5px 5px 5px 5px;
	 width: 400px;
	 height: 400px ;
	 background-color: #141414;
	 padding: 20px 20px 20px 20px;
	 vertical-align: center;
	 text-align: center;
	 border-radius: 22px;
	
}

.liczenieLiczba{
	font-size: 120pt;
}

.wynikOK{
	color:green;
	font-size: 40pt;
}
.wynikZle{
	color:red;
	font-size: 40pt;
}

img.cwiczenie{
	margin: 0 auto;
	border: 4px outset silver;
	background-color:white;
	width:80%;
}
img.cwiczenie_koniec{
	margin: 0 auto;
	width:80%;
}


#koniecCwiczenia{
	 display: none;
	float:left;
	padding: 10px 0 10px 0;
	width:100%;
	font-size:12pt;
	border-top: 1px solid #742f74;
	border-bottom: 1px solid #742f74;
	background-color: white;
	color:black;
	vertical-align: center; 
	text-transform: uppercase;
	padding-top: 100px;

}

#zegarWyswietlacz{
	position: fixed;
	margin-top:20px;
	margin-bottom:20px;
	background-color: white;
	padding: 10px 0 10px 0;
	font-size:12pt;
	background-color: white;
	color:black;
	vertical-align: center;
	width:200px;
	border: 1px solid white;
	border-radius: 10px;
}

.zegarNaglowek{
	border-bottom: 2px double #471D47;
}

.ok{
	color:green;
}
.zle{
	color:red;
}
.startBox{
	width:100%;
}
img.start{
	display: block;
	margin: 0 auto;
	margin-right:50%;
}

#start{
	margin:auto;
	margin-top:10px;
	width:100%;
}

#startKropka{
	margin:auto;
	margin-top:10px; 
	width:100%;
}

#cwiczenieCzescGlowna{
	text-align:center;
	margin-bottom:20px;
}
#koniecCwiczenia{
	text-align:center;
	margin-bottom:20px;
}

/* wyniki cwiczenia */
#zaliczone{
	border: 2px inset green;
	background-color: #4af44a;
	color: #004200;
	width: 20%;
	margin:auto;
}

#bledy{
	border: 2px inset red;
	background-color: #ff7c7c;
	color: #890000;
	width: 20%;
	margin:auto;
}

#pokazCzas{
	
float:left;
	padding: 10px 0 10px 0;
	width:80%;
	font-size:12pt;
	border-top: 1px solid #2690cf;
	border-bottom: 1px solid #2690cf;
	background-color: white;
	color:black;
	vertical-align: center;
	text-transform: uppercase;
	margin-bottom:10px;
}

#data{
	margin-top:20px;
	float:left;
	padding: 10px 0 10px 0;
	width:80%;
	font-size:12pt;
	border-top: 1px solid #2690cf;
	border-bottom: 1px solid #2690cf;
	background-color: white;
	color:black;
	vertical-align: center;
	text-transform: uppercase;
}

#wynikiCwiczenia{
	margin:auto;
	margin-bottom:10px;
	width:100%;
	padding-top:20px;
	padding-left:20px;
	text-align:center;
}
#wynikiCwiczenia table{
	margin:auto;
	width:100%;
	text-align:left;
	vertical-align:top;
}

#srodek{
	margin:auto;
	width:100%;
	height:auto;
	text-align:center;
}
#stop{
	clear:both;
}

#kropkaBox{
	display: none;
	margin:auto;
	margin-top:30px;
	width:800px;
	height:700px;
	background-color:white;
}
#obrazkiBox{
	margin:auto;
	margin-top:30px;
	width:800px;
	height:700px;
	background-color:white;
}
#obrazkiBoxPo{
	margin:auto;
	margin-top:30px;
	width:800px;
	height:500px;
	background-color:white;
}
.kropka{
	position:relative;
}

.doKropki{
	position:relative;
}

.doObrazkow{
	position:relative;
	width:100%;
	margin: 0px 10px 10px 10px;
}
/*tabele*/

td.ciemne{
	border: 3px solid #2690cf;
	background-color: #2690cf;
	color: white;
	border-top-right-radius: 25px;
	vertical-align:top;
}
.odpCyfry{
	font-size:15pt;
}
td.jasne{
	border: 2px inset #2690cf;
	background-color: #81d0ff;
	color: #471D47;
	font-size: 15pt;
	padding: 2% 2% 2% 2%;
	width:46%;
	vertical-align:top;
}
td.jasne-biale{
	border: 2px inset #2690cf;
	background-color: white;
	color: white;
	width:50%;
	vertical-align:top;
}


table#cwiczenia{
	width:100%;
	margin:auto;
	margin-top:20px;
	border: 2px inset #2690cf;
}
table#cwiczeniaTrener{
	width:100%;
	margin:auto;
	margin-top:20px;
	border: 2px inset #2690cf;
}

table#cwiczenia td{
	min-width: 80px;
}
tr.parzysty{
	background-color: #a6c0cf;
}
tr.nieparzysty{
	background-color: #white;
}
tr.niezrobione{
	background-color: red;
}
tr.naglowek{
	background-color: #2690cf	;
	color: white;
	font-size:16pt;
	border-bottom: 2px inset #2690cf;
} 


#absolutny{
	visibility:hidden;
	position:absolute; 
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	background-color: black;
	filter:alpha(opacity=80);
	opacity: 0.8;
	-moz-opacity:0.8;
} 
#obrazkiWyniki{
	font-size:20pt;
}
#obrazyWynik{
	width:100%;
	font-size:20pt;
	line-height: 40pt;
}

.obrazySpan{
	display:none;
	width: 100%;
	margin:auto;
	}
.obrazy{
	width: 400px;
	max-height: 350px;
	margin: 0px auto 0px auto;
}

iframe{
	width:100%;
	height:100%;
	border:0px;
}

table.panelGlownyUzytkownika{
	margin: 20px 20px 20px 20px;
	width: 100%;
}

td.wyswietlLewy{
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 10px 5px 10px 5px;
	border: 5px #f89946 solid;
	border-top: 10px #f89946 solid; 
	border-top-left-radius: 22px;
	vertical-align: top; 
	width: 40%;
}
td.wyswietlPrawy{
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 10px 5px 10px 5px;
	border: 5px #f89946 solid;
	border-top: 10px #f89946 solid; 
	border-top-left-radius: 22px;
	vertical-align: top; 
	width: 50%;
}
td.wyswietlPrawy table.sr{
	margin: 0 auto;
}
td.wyswietlLewy table.sr{
	margin: 0 auto;
}

td.pusty{
	width:10%;
	height: 30px;
}

td.ranking{
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 10px 5px 10px 5px;
	border: 5px #f89946 solid;
	border-top: 10px #f89946 solid; 
	border-top-left-radius: 22px;
	width: 26%;
	vertical-align: top; 
	text-align:Center;
}

table#wynikSzczegolowy{
	width:100%;
	float:left;
}

table#wynikSzczegolowyObrazy{
	width:100%;
	float:left;
}

table#daneLogowania{
	margin: 0 auto;
}

table#cwiczenieKwadraty{
		width:400px;
		height:400px;
		margin: 0 auto;
		text-align: center;
		vertical-align: center;
		border-collapse:collapse;
}
td.zamalowane{
		width: 40px;
		height: 40px;
		background-color:#fd7c25;
		border: 1px solid black;

}
td.zamalowaneOk{
		width: 40px;
		height: 40px;
		background-color:green;
		border: 1px solid black;

}
td.zamalowaneZle{
		width: 40px;
		height: 40px;
		background-color:red;
		border: 1px solid black;

}
td.niezamalowane{
		width: 40px;
		height: 40px;
		background-color:white;
		border: 1px solid black;

	
}
td.zaznaczane{
		width: 50px;
		height: 50px;
		background-color:white;
		border: 1px solid black;
		font-size: 0pt;

	
}
tr.mojwynik{
	background-color: #fd7c25;
	color: white;
	font-weight: bold;
}
table#slowa{
		margin: 0 auto;
		font-size:18pt;
}
table#slowa td{
	padding-bottom: 70px;
	line-height: 150%;
	}

table#slowka{
		margin: 0 auto;
		font-size:18pt;
}
table#slowka td{
	padding-bottom: 10px;
    padding-right:	50px;
	line-height: 150%;
}
	.slowkaRight input{	
		  width: 50%;
		  border: none; /* <-- This thing here */
		  border:solid 1px #ccc;
		  border-radius: 10px;
		  padding-left:4px;
}
.tableSlowa{
	line-height:200%;
}
.tableSlowa input{
	 width: 80%;
		  border: none; /* <-- This thing here */
		  border:solid 1px #ccc;
		  border-radius: 10px;
		  padding-left:4px;
}

.tableSlowka{
	line-height:200%;
}
table#opcjeLicencji{
	width:50%;
	margin: 0 auto;
	border-top: 10px #754f5c solid; 
	border-top-left-radius: 22px;
	border-right: 5px #8e6070 solid; 
	width: 40%;
}
tr.normal{
	text-align:center;
	font-size:15pt;
	font-weight:bold;
}
td.normal{
	text-align:center;
	font-size:15pt;
	font-weight:bold;
}
td.silver{
	text-align:center;
	font-size:15pt;
	background-color:silver;
	font-weight:bold;
}
td.silver2{
	text-align:center;
	font-size:15pt;
	background-color:#ececec;
	font-weight:bold;
}
td.silver3{
	background-color:#f7f7f7;
	}
td.gold{
	text-align:center;
	font-size:15pt;
	background-color:gold;
	font-weight:bold;
	
}
td.gold2{
	text-align:center;
	font-size:15pt;
	background-color:#ffed8b;
	font-weight:bold;
	
}
td.gold3{
	background-color:#fffadd;
	
}
.wyr{
	font-weight:bold;
	color:#fe7d26;
}
.ziel{
	font-weight:bold;
	color:green;
}

#logoWRejestracji{
	width:10%;
	margin: 0 auto;
    text-align: center;
	
}
#logoWRejestracji img{
	width:100%;
    text-align: center;	
}

form#rejestracja{
	width:50%;
	margin: 0 auto;
}
form#rejestracja h1{
	text-align:center;
}
form#rejestracja input{
	 border: none; /* <-- This thing here */
	 border:solid 1px #ccc;
	 border-radius: 10px;
	 padding-left:4px;
}
form#rejestracja table{
	width: 50%;
	margin: 0 auto;
}
form#rejestracja button{
	width: 100%;
}
#reklamaSDP{
	width:40%;
	margin: 0 auto;
}
#reklamaSDP img{
	width:100%;
}
#linkDoRejestracji{
	text-align:Center;
	width:70%;
	margin: 0 auto;	
	margin-top: 30px;
	margin-bottom: 30px;

}
#linkDoRejestracji a{
	color: #fd7c25;
}

#linkDoRejestracji a:hover{
	color: #fdb584;
}
.pytaniaDoKadru{
	text-transform: none;
	text-align:left;
	width:60%;
	margin: 0 auto;
}

table#sekwencja{
	margin: 10 auto;
}

table#sekwencja td{
	width: 102px;
	height: 102px;
	border: 1px solid black;
	text-align:center;
	
}

img#zielonyS{
	display: none;
	width: 102px;
	height: 100px;
}
img#czerwonyS{
	display: none;
	width: 102px;
	height: 100px;
}
img#niebieskiS{
	display: none;
	width: 102px;
	height: 100px;
}
img#zoltyS{
	display: none;
	width: 102px;
	height: 100px;
	}
#restart{
		display:none;
	}
	
img.twarz{
	height: 400px;
}
img.twarzOdp{
	height: 200px;
}

img.twarzWynik{
	height: 150px;
}
.Tok{
	color:green;
	background: white;
	border: 2px solid green;
	height: 60px;
	width: 200px;
	text-align:center;
	padding: 0;
	margin-top: 0;
}
.Tzle{
	color:red;
	background: white;
	border: 2px solid red;
	height: 60px;
	width: 200px;
	text-align:center;
	padding: 0;
	margin-top: 0;
}
#cena{
	color: green;
	font-size: 20pt;
	margin: 0 auto;
	width: 100%;
	text-align: center;
	padding: 10px 10px 20px 10px;
}
.Tpuste{
	color:blue;
	background: white;
	border: 2px solid blue;
	height: 60px;
	width: 200px;
	text-align:center;
	padding: 0;
	margin-top: 0;
}
input{
	border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: #ffffff;
    background-image: none;
    border-top: 1px solid #d6d4d4;
    border-right: 1px solid #d6d4d4;
    border-bottom: 1px solid #d6d4d4;
    border-left: 1px solid #d6d4d4;
    padding-top: 10px;
    padding-right: 5px;
    padding-bottom: 10px;
    padding-left: 5px;
    margin-top: 4px;
    margin-right: 0px;
    margin-bottom: 4px;
    margin-left: 0px;
    display: block;
    width: 280px;
    box-sizing: border-box;
    height: 41px;
    color: #161616;
    font-size: 14px;
    overflow: hidden;
    font-family: "open sans";
}
textarea{
	    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: #ffffff;
    background-image: none;
    border-top: 1px solid #d6d4d4;
    border-right: 1px solid #d6d4d4;
    border-bottom: 1px solid #d6d4d4;
    border-left: 1px solid #d6d4d4;
    padding-top: 10px;
    padding-right: 5px;
    padding-bottom: 10px;
    padding-left: 5px;
    margin-top: 4px;
    margin-right: 0px;
    margin-bottom: 4px;
    margin-left: 0px;
    display: block;
    width: 280px;
    box-sizing: border-box;
    height: 41px;
    color: #161616;
    font-size: 14px;
    overflow: hidden;
    font-family: "open sans";
}
select{
	    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: #ffffff;
    background-image: none;
    border-top: 1px solid #d6d4d4;
    border-right: 1px solid #d6d4d4;
    border-bottom: 1px solid #d6d4d4;
    border-left: 1px solid #d6d4d4;
    padding-top: 10px;
    padding-right: 5px;
    padding-bottom: 10px;
    padding-left: 5px;
    margin-top: 4px;
    margin-right: 0px;
    margin-bottom: 4px;
    margin-left: 0px;
    display: block;
    width: 280px;
    box-sizing: border-box;
    height: 41px;
    color: #161616;
    font-size: 14px;
    overflow: hidden;
    font-family: "open sans";
}
input[type="checkbox"]{
	width:25px;
	height: 25px;
	margin: 0 auto;
}

button{
			    background-color: orange;
				text-transform: uppercase;
				padding: 5px 35px;
				margin-top: 5px;
				color: white;
				border: orange solid 2px;
				font-weight: bold;
				font-size: 16px;
				cursor: pointer ;
				margin-bottom:30px;
		}
button:hover{
			    background-color: orange;
				text-transform: uppercase;
				padding: 5px 35px;
				margin-top: 5px;
				color: white;
				border: orange inset 2px;
				font-weight: bold;
				font-size: 16px;
				cursor: pointer ;
				margin-bottom:30px;
		}
button#promocja{
			    background-color: red;
				text-transform: uppercase;
				padding: 5px 35px;
				margin-top: 5px;
				color: white;
				border: red solid 2px;
				font-weight: bold;
				font-size: 16px;
				cursor: pointer ;
				margin-bottom:30px;
		}
button#promocja:hover{
			    background-color: red;
				text-transform: uppercase;
				padding: 5px 35px;
				margin-top: 5px;
				color: white;
				border: red inset 2px;
				font-weight: bold;
				font-size: 16px;
				cursor: pointer ;
				margin-bottom:30px;
		}