/* reset */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent
}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}

/* remember to define focus styles! */
:focus {outline: 0;}
/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}







/* *Basic */
body {
font-size:12px;
font-family:tahoma, arial;
background-color:#ffffff;
color:#5d5d5d;
}

a {text-decoration: none;}
a:hover {text-decoration: underline;}

#wrapper {
margin: 8px auto 0 auto;
padding: 0;
width: 800px;
text-align: left;
font-family:tahoma, arial;
}

#inter03 {
float:left;
width:774px;
min-height:682px;
border:1px solid #e8e8e8;
margin: 0;
padding: 10px 12px;
}



/* egzamin */
.right{
float:right;
width:274px;
margin:0px;
padding:0px;
}
.logosmall{
float:left;
width:274px;
margin:0px;
padding:0 0 30px 0;
}
.zegar{
float:left;
width:194px;
height:51px;
background: url(./img/bg_zegar.gif) left top no-repeat;
color:#ffffff;
font-weight:bold;
font-size:12px;
margin:0px;
padding:12px 0 4px 80px;
}
#timer{
font-weight: bold;
font-size:18px;
}
.listapytan{
float:left;
width:274px;
margin:0px;
padding:0px;
}

/* tabela index 1 2 3 ... */
table#index {
padding: 0;
margin: 12px 0 0 0;
width: 100%;
border-spacing: 2px;
font-size:11px;
}
table#index td {
margin: 2px;
padding: 4px 2px;
text-align: center;
vertical-align: middle;
border: solid 1px #e8e8e8;
cursor: pointer;
}
table#index td.current {
background-color:#dee8f7;
border: solid 1px #7498ca;
color: #000000;
font-weight: bold;
cursor: default;
}
table#index td.done {
border: solid 1px #7498ca;
}
table#index td.hover {
border: solid 1px #7498ca;
}

/* nawigacja */
.nawigacja{
float:left;
width:274px;
padding:0px;
margin:36px 0 0 0;
}
.nawigacja .nextback{
float:left;
width:274px;
}
.nawigacja .nextback a.button_right{
font-size:11px;
font-weight:bold;
color:#ffffff;
background: url(./img/bg_nastepne.gif) left top no-repeat;
width:129px;
float:right;
text-align:center;
padding:5px 0 6px 0;
}
.nawigacja .nextback a:hover.button_right{
background: url(./img/bg_nastepne.gif) left bottom no-repeat;
text-decoration:none;
}
.nawigacja .nextback a.button_left{
font-size:11px;
font-weight:bold;
color:#ffffff;
background: url(./img/bg_poprzednie.gif) left top no-repeat;
width:129px;
float:left;
text-align:center;
padding:5px 0 6px 0;
}
.nawigacja .nextback a:hover.button_left{
background: url(./img/bg_poprzednie.gif) left bottom no-repeat;
text-decoration:none;
}
.nawigacja .koniec{
float:left;
width:274px;
margin-top:16px;
}
.nawigacja .koniec a.button_koniec{
font-size:11px;
font-weight:bold;
color:#ffffff;
background: url(./img/bg_koniec.gif) left top no-repeat;
width:89px;
float:right;
padding:5px 0 6px 40px;
}
.nawigacja .koniec a:hover.button_koniec{
background: url(./img/bg_koniec.gif) left bottom no-repeat;
text-decoration:none;
}

/* lewa kolumna img pytanie odp. */


.image {
padding: 3px;
background: #fff;
border: solid 1px #7498ca;
}

.pytanie {
margin: 12px 0 0 0;
padding: 0;
width: 100%;
height: 80px;
border-spacing: 0;
border-left:14px solid #7498ca;
color:#000000;
}
.pytanie td {
padding: 0 0 0 16px;
vertical-align: middle;
font-size: 18px;
font-weight: bold;
line-height: 1em;
}

#options {
padding-top:4px;
color:#000000;
}
#options .option {
margin-top:4px;
padding: 20px 10px 8px 10px;
border:1px solid #e8e8e8;
font-weight:bold;
}
#options .selected {
background: #f4f4f4;
}
#options .option span {
display: block;
float: left;
margin-right: 10px;
margin-top: -12px;
padding: 14px 0;
width: 58px;
text-align: center;

text-indent:-10000px;
cursor: pointer;
}
#options .option .a{background: url(./img/bg_a_ok.png) center center no-repeat;}
#options .option .b{background: url(./img/bg_b_ok.png) center center no-repeat;}
#options .option .c{background: url(./img/bg_c_ok.png) center center no-repeat;}

#options .selected .a{background: url(./img/bg_a_selected.png) center center no-repeat;}
#options .selected .b{background: url(./img/bg_b_selected.png) center center no-repeat;}
#options .selected .c{background: url(./img/bg_c_selected.png) center center no-repeat;}

#options .shouldbe {background: url(./img/checkmark.png) center right no-repeat;}










/* ###################### strona glowna kategoria ####################### */

.top {
float:left;
width:752px;
background: url(./img/bg_kategoriatop.gif) left top no-repeat;
margin: 0;
padding: 117px 24px 10px 24px;
}
.top a.credo{
float:left;
width:51px;
height:14px;
display:block;
background: url(./img/logo_sphcredo.gif) left top no-repeat;
margin-right:10px;
}
.top h1{ float:left; width:690px; font-size:11px; font-weight:normal; font-family:tahoma, arial; color:#888888; }
.top h1 a{color:#85b9ff;}

#inter02{
float:left;
width:774px;
min-height:513px;
border:1px solid #e8e8e8;
margin: 8px 0 0 0;
padding: 10px 12px;
color:#5d5d5d;
font-size:11px;
line-height:18px;
}
#inter02 .txtwitamy{
border:1px solid #e8e8e8;
margin-top:4px;
padding: 20px 18px 20px 18px;
}

#inter02 .txtwitamy h2{
float:left;
font-size:15px;
font-weight:bold;
color:#000000;
background: url(./img/arrow_h2.gif) left top no-repeat;
padding: 0 0 10px 30px;
}
#bt4 a {
width: 64px; 
height: 16px;
background: url(img/bt_4.gif) 0 0px no-repeat;
display: block; 
float: right;
}
#bt4 a:hover {
width: 64px; 
height: 16px;
background: url(img/bt_4.gif) 0 -17px no-repeat;
display: block; 
float: right;
}

#inter02 .txtwitamy a{color:#2c7cb7;} #inter02 .txtwitamy a:hover{color:#2c7cb7; text-decoration:underline;}
#inter02 .boxkategoria02{
float:left;
width:774px;
margin:30px 0 0 0;
padding:0px;
}
#inter02 .boxkategoria02 .imgkategoraia{
float:left;
width:373px;
height:136px;
background: url(./img/button_kategoria_a.jpg) left top no-repeat;
}
/* egzamin */
.select{
float:right;
width:373px;
height:136px;
background: url(./img/bg_katselect.gif) left top no-repeat;
}
a.button_select_c{
float:left;
margin:16px 0 0 100px;
color:#ffffff;
font-weight:bold;
font-size:16px;
background: url(./img/bg_katbutton.gif) center top no-repeat;
padding:42px 44px 44px 44px;
}
a:hover.button_select_c{
background: url(./img/bg_katbutton.gif) center -120px no-repeat;
color:#ffffff; text-decoration:none;
}
a.getindex{
float:left;
margin:40px 0 0 0;
text-align:center;
width:222px;
background: url(./img/bg_getindex.gif) center top no-repeat;
font-weight:bold;
color:#323232;
padding:3px 0;
}
a:hover.getindex{
background: url(./img/bg_getindex.gif) center bottom no-repeat;
text-decoration:none;
}

/* wyniki egzaminu */
.topwynik{
float:left;
width:774px;
margin:0px 0 0 0;
padding:0px;
}

.topwynik .wrong{
float:left;
width:684px;
background: url(./img/bg_topwynik_zle.gif) left top no-repeat;
padding:30px 0 30px 90px;
color:#ffffff;
}
.topwynik .correct{
float:left;
width:684px;
background: url(./img/bg_topwynik_ok.gif) left top no-repeat;
padding:30px 0 30px 90px;
color:#ffffff;
}

.topwynik .more {font-weight:bold; font-size:14px;}
.topwynik .more strong {
font-size:20px;
margin-right:20px;
}

table.lista {
float:left;
border:1px solid #e8e8e8;
padding:0px 16px 16px 16px;
width: 100%;
margin: 20px 0 0 0;
font-size:11px;
line-height:18px;
}
table.lista td {
margin: 0 16px;
padding: 6px 0;
border-spacing: 0px;
width: 50%;
text-align: left;
border-bottom:1px solid #f4f4f4;
}

table.lista td a {
background: url(./img/arrow_itm.gif) 0px 2px no-repeat;
padding:0 0 0 18px;
color:#000000;
font-weight: bold;
}
table.lista td a:hover {color:#2c7cb7;}

table.lista td .wrong{color:#c80000;}
table.lista td .correct{color:#37b03d;}
a.getindex2{
float:left;
margin:40px 0 0 0;
text-align:center;
width:222px;
background: url(./img/bg_getindex.gif) center top no-repeat;
font-weight:bold;
color:#323232;
padding:5px 0;
}
a:hover.getindex2{
background: url(./img/bg_getindex.gif) center bottom no-repeat;
text-decoration:none;
}


/* ###################### strona glowna testow ####################### */
#footer{
float:left;
width:774px;
margin:10px 0 0 0;
}
#footer p{
float:left;
margin-left:36px;
}
#footer a{color:#5d5d5d;}
#footer a:hover{color:#000000; text-decoration:none;}
#bt1 a {
width: 89px; 
height: 16px;
background: url(img/bt_1.gif) 0 0px no-repeat;
display: block; 
float: left;
margin-right:6px;
}
#bt1 a:hover {
width: 89px; 
height: 16px;
background: url(img/bt_1.gif) 0px -17px no-repeat;
display: block;
float: left;
margin-right:6px;
}
#bt2 a {
width: 55px; 
height: 16px;
background: url(img/bt_2.gif) 0 0px no-repeat;
display: block; 
float: left;
margin-right:6px;
}
#bt2 a:hover {
width: 55px; 
height: 16px;
background: url(img/bt_2.gif) 0px -17px no-repeat;
display: block;
float: left;
margin-right:6px;
}
#bt3 a {
width: 114px; 
height: 16px;
background: url(img/bt_3.gif) 0 0px no-repeat;
display: block; 
float: left;
margin-right:6px;
}
#bt3 a:hover {
width: 114px; 
height: 16px;
background: url(img/bt_3.gif) 0px -17px no-repeat;
display: block;
float: left;
margin-right:6px;
}
#btpk a {
width: 127px; 
height: 16px;
background: url(img/bt_pk.gif) 0 0px no-repeat;
display: block; 
float: left;
margin-right:6px;
}
#btpk a:hover {
width: 127px; 
height: 16px;
background: url(img/bt_pk.gif) 0px -17px no-repeat;
display: block;
float: left;
margin-right:6px;
}

.txtindex{
float:left;
width:347px;
border:1px solid #e8e8e8;
padding: 12px 12px 12px 12px;
margin:6px 0 12px 0;
}

.txtindex h2{
font-size:11px;
font-weight:bold;
color:#000000;
background: url(./img/arrow01index.gif) left 3px no-repeat;
padding: 0 0 2px 24px;
}

.selecta{
float:left;
width:373px;
margin:6px 0 12px 0;
}
.selectb{
float:left;
width:373px;
margin:6px 0 12px 28px;

}

.selectb .button_select_a{
float:left;
width:373px; height:136px;
background: url(./img/button_kategoria_a.jpg) left top no-repeat;
text-indent:-10000px;}

.selecta .button_select_b{
float:left;
width:373px; height:136px;
background: url(./img/button_kategoria_b.jpg) left top no-repeat;
text-indent:-10000px;}

.selectb .button_select_c, .selectb a:hover.button_select_c{
float:left;
width:373px; height:136px;
background: url(./img/button_kategoria_c.jpg) left top no-repeat;
text-indent:-10000px; margin:0px; padding:0px;}

.selecta .button_select_d{
float:left;
width:373px; height:136px;
background: url(./img/button_kategoria_d.jpg) left top no-repeat;
text-indent:-10000px;}

.selectb .button_select_t{
float:left;
width:373px; height:136px;
background: url(./img/button_kategoria_t.jpg) left top no-repeat;
text-indent:-10000px; }


.image.smaller {
	width: 330px;
}


label {
	display: block;
}
/* *Style */
 
#answer img {
	vertical-align: middle;
}
#answer {
	margin: 48px 0;
	padding: 5px;
	background: #e6e6e6;
	text-align: center;
}
 

/* *Styles out he, he */
a.button {
	display: inline-block;
	margin: 5px 0 5px 0;
	padding: 7px 15px 8px 15px;
	width: 80px !important;
width
/**/
	: 110px;
	font: bold 12px sans-serif;
	background: url(./img/button.gif) center center repeat-x;
	color: white;
	text-decoration: none;
	text-align: center;
	border: solid 1px #fff;
	vertical-align: middle;
}
a.auto {
	display: inline;
	width: auto !important;
}
a.button:hover {
	color: white;
	text-decoration: underline;
}
a.red {
	background: url(./img/button-red.gif) center center repeat-x;
}
a.blue {
	background: url(./img/button-blue.gif) center center repeat-x;
}
 
p.nav {
	padding: 20px;
}

/* *Floats */
.left {
	float: left;
}

/* *Trickery & fixes */
.cleared:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
/* hides from ie-mac \*/
* html .cleared {
	height: 1%;
}
*:first-child+html .cleared {
	height: 1%;
}
/* End hide from IE-mac */

/* *Pads */
.p10 {
	padding: 10px;
}


table#panel {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 360px;
	border-spacing: 0;
}
table#panel td {
	margin: 0;
	padding: 0;
	height: auto;
	text-align: center;
	vertical-align: middle;
}



.admin label {
	clear: both;
	float: left;
	width: 200px;
}
.admin .optional, .admin .required {
	padding: 10px 0;
	border-bottom: dotted 1px #999;
}