/* -------------------------------------------
project:	Quizzz
date:		2007/10/13
------------------------------------------- */

html { min-height: 100%; margin: 0 0 1px; font-size: 100.01%; }
body { margin: 0; padding: 0; background: #455d40 url(../images/bg.gif) 0 49px repeat-x; color: #555; font: 62.5%/1.2 Verdana,Arial,Helvetica,sans-serif; }
textarea, input, select, option, optgroup, button { font: 1em Verdana,Arial,Helvetica,sans-serif; }

/* RE-SETS
------------------------------------------- */
* { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; }

li, dt, dd, p { font-size: 1.2em; }
ul, ol, dl { margin-bottom: 1.5em; }
p { margin-bottom: 1.25em; }
li *, dt *, dd *, p * { font-size: 1em; }

fieldset, img { border: none; }
button { overflow: visible; cursor: pointer; }
legend { display: none; }

a { color: #46983d; text-decoration: none; }
a:hover, a:focus, a:active { color: #000; text-decoration: underline; }

/* HEADINGS
------------------------------------------- */
h1, h2, h3, h4, h5, h6 { margin: 0 0 12px; font: 3.2em Georgia,Arial,Helvetica,sans-serif; color: #333; }
h1 { margin: 0 0 3px; line-height: 1; }
h2 { margin: 0 0 10px; font: 1.2em Verdana,sans-serif; text-transform: uppercase; }

/* HELPERS
------------------------------------------- */
.wrapper { width: 100%; overflow: hidden; }
.center { margin-left: auto; margin-right: auto; text-align: center; }
.offset { position: absolute; left: -10001em; overflow: hidden; height: 0; margin: 0; line-height: 0; }

legend.offset { display: none; }

/* LAYOUT
------------------------------------------- */
#header { height: 97px; }
 #header div.top { width: 728px; height: 49px; margin: 0 auto 6px; }
  #header div.top h2 { float: left; }
   #header div.top h2 a { float: left; overflow: hidden; width: 205px; height: 27px; margin: 12px 0 0; background: url(../images/green-logo.png) no-repeat; text-indent: -10001em; }
  #header div.top p { float: right; margin: 20px 0 0; color: #ddd; font-size: 1em; }
   #header div.top p a { color: #ddd; text-decoration: underline; }
   #header div.top p a:hover { color: #fff; text-decoration: none; }
 #header div.links { width: 728px; height: 25px; margin: 0 auto; padding: 10px 0 0; }
#wrapper { padding: 15px 0; background: #fff; border-bottom: 5px solid #868686; }
 #content { width: 600px; margin: 0 auto; padding: 0 10px 10px 118px; background: url(../images/illustrations/default.jpg) no-repeat; }
  #content div.inner { min-height: 400px; _height: 400px; padding: 0; background-repeat: no-repeat; }
#footer { padding: 15px 10px 15px 118px; border-top: 1px solid #fff; text-align: center; }
 #footer p { margin: 0 0 10px; color: #ccc; }
 #footer p.disclaimer { color: #627e5c; font-size: 0.9em; }
  #footer p a { padding: 0 2px; color: #ccc; }

/* SKIP LINKS
------------------------------------------- */
#skip-links { position: absolute; top: 0; left: -10001px; list-style: none; margin: 0; padding: 0; }
 #skip-links li a:focus, #skip-links li a:active { display: block; position: absolute; left: 10001px; top: 0; z-index: 10001; width: 750px; padding: 2px 0; background: #579; color: #fff; font-size: 1.4em; text-align: center; }

/* ELEMENTS
------------------------------------------- */
div.progress { width: 620px; margin: 0 -10px 10px; }
 div.progress p { position: relative; height: 15px; margin: 0 0 2px; padding: 0 10px; color: #46983d; font-size: 0.9em; text-transform: uppercase; }
  div.progress p span.e { position: absolute; right: 10px; }
 div.progress p.bar { overflow: hidden; width: 616px; height: auto; padding: 1px; border: 1px solid #bfbfbf; }
  div.progress p.bar img { display: block; }
 form { display: block; margin: 0; }
  div.item { position: relative; width: 100%; }
   div.item button { position: absolute; right: 0; overflow: visible; padding: 2px 15px; border: 1px solid #e3e3e3; background: #fff; color: #bf1414; cursor: pointer; font-size: 1.1em; font-weight: bold; line-height: 1.2em; vertical-align: middle; }
   p.count { margin: 0 0 3px; color: #46983d; font-size: 0.9em; text-transform: uppercase; }
   ul.answers { list-style: none; margin: 0 -10px 10px; padding: 10px 12px 5px; border: 1px solid #bfbfbf; border-width: 1px 0; }
    ul.answers li { margin: 0 0 5px; font-size: 1.1em; }
     ul.answers li label { color: #46983d; font-weight: bold; text-decoration: underline; vertical-align: middle; cursor: pointer; }
	 ul.answers li label:hover { color: #000 !important; }
     ul.answers li input { vertical-align: middle; }
 div.result { overflow: hidden; width: 100%; margin: 0 0 10px; padding: 25px 0 25px; border: 1px solid #bfbfbf; border-width: 1px 0; }
  div.result p { margin: 0 0 5px; color: #969696; font-size: 1.6em; text-align: center; }
  div.result p.clear { clear: both; margin: 0; padding: 5px 0 0; font-size: 1.2em; }
  div.result h3 { float: left; width: 270px; margin: 0; padding: 0 30px 0 0; color: #ca1c1c; font: 5em Georgia,sans-serif; text-align: right; }
  div.percentage h3 { width: 270px; }
  div.quote h3 { float: none; width: 100%; font-size: 1.8em; text-align: center; }
  div h3.xxl { margin-top: -10px; font-size: 7.2em; line-height: 1.1; }
  div h3.xl { font-size: 3.2em; }
  div h3.capsed { text-transform: uppercase; }
  div.result div.sense { float: left; padding: 10px 0 0; }
  div.quote div.sense { float: none; width: auto; margin: 0 0 -10px; padding: 10px 0 0 35px; text-align: center; }
 div.subsense { overflow: hidden; width: 100%; margin: 0 0 3px; padding: 0 0 10px; _padding-bottom: 10px; border-bottom: 1px solid #bfbfbf; text-align: center; }
 div.actions { overflow: hidden; width: 100%; margin: 0 0 10px; padding: 10px 0 1px; _padding-bottom: 10px; border-bottom: 1px solid #bfbfbf; }
  div.actions div.code { float: left; width: 47.5%; }
   div.actions div.code p { margin: 0 0 5px; }
    div.actions div.code p span { font-size: 0.75em; }
   div.actions div.code textarea { width: 98%; height: 60px; _height: 70px; padding: 2px 0 2px 2px; color: #999; font: 0.75em Tahoma,sans-serif; }
  div.actions div.other { float: right; width: 47.5%; }
   div.actions div.other p { margin: 0 0 15px; }
   div.actions div.other ul { min-height: 110px; margin: 0 0 5px; padding: 0 0 0 15px; background: url(../img/wz-indicator.gif) -100px -100px no-repeat; }
    div.actions div.other ul li { margin: 0 0 6px; font-size: 0.9em; line-height: 1.5; }
     div.actions div.other ul li label { }
     div.actions div.other ul li input { width: 150px; _margin: 0 5px 0 0; padding: 2px 0 2px 3px; border: 1px solid #aaa; vertical-align: middle; }
     div.actions div.other ul li button { overflow: visible; padding: 2px 5px 1px; border: 1px solid #aaa; background: #fff; color: #3a4b63; cursor: pointer; font-size: 1em; font-weight: bold; line-height: 1em; text-transform: uppercase; vertical-align: middle; }
     div.actions div.other ul li span.send-loading { display: none; line-height: 1; }
      div.actions div.other ul li span.send-loading img { vertical-align: -4px; }
     div.actions div.other ul li span.send-done { display: none; }
 p.backbar { }
  p.backbar a.back { display: none; }
  p.backbar span { display: none; }
  p.backbar a.facebook { padding: 1px 0 1px 22px; background: url(http://static.ak.fbcdn.net/rsrc.php/zB719/hash/4e8jd63q.gif) 0 50% no-repeat; font-weight: bold; }

/* STYLES
------------------------------------------- */
body.green { background-color: #455d40; }
 body.green #header div.top h2 a { background-image: url(../images/green-logo.png); }
 body.green a,
 body.green div.progress p,
 body.green p.count,
 body.green ul.answers li label,
 body.green p.field label,
 body.green p.field span.label,
 body.green div.result h3 { color: #46983d; }
 body.green #footer p.disclaimer { color: #627e5c; }

body.brown { background-color: #63523a; }
 body.brown #header div.top h2 a { background-image: url(../images/brown-logo.png); }
 body.brown a,
 body.brown div.progress p,
 body.brown p.count,
 body.brown ul.answers li label,
 body.brown p.field label,
 body.brown p.field span.label,
 body.brown div.result h3 { color: #63523a; }
 body.brown #footer p.disclaimer { color: #7b6d59; }

body.blue { background-color: #3d5160; }
 body.blue #header div.top h2 a { background-image: url(../images/blue-logo.png); }
 body.blue a,
 body.blue div.progress p,
 body.blue p.count,
 body.blue ul.answers li label,
 body.blue p.field label,
 body.blue p.field span.label,
 body.blue div.result h3 { color: #4c7390; }
 body.blue #footer p.disclaimer { color: #556a7a; }

body.grey { background-color: #4e4e4e; }
 body.grey #header div.top h2 a { background-image: url(../images/grey-logo.png); }
 body.grey a,
 body.grey div.progress p,
 body.grey p.count,
 body.grey ul.answers li label,
 body.grey p.field label,
 body.grey p.field span.label,
 body.grey div.result h3 { color: #2a55ac; }
 body.grey #footer p.disclaimer { color: #6c6c6c; }

body.red { background-color: #640911; }
 body.red #header div.top h2 a { background-image: url(../images/red-logo.png); }
 body.red a,
 body.red div.progress p,
 body.red p.count,
 body.red ul.answers li label,
 body.red p.field label,
 body.red p.field span.label,
 body.red div.result h3 { color: #9f111e; }
 body.red #footer p.disclaimer { color: #712329; }

/* QUIZES
------------------------------------------- */
#pechowiec #content { background-image: url(../images/illustrations/pechowiec.jpg); }
#idiota #content { background-image: url(../images/illustrations/idiota.jpg); }
#gwiazda #content { background-image: url(../images/illustrations/gwiazda.jpg); }
#wartosc-zycia #content { background-image: url(../images/illustrations/wartosc-zycia.jpg); }
#zarobki #content { background-image: url(../images/illustrations/zarobki.jpg); }
#brudas #content { background-image: url(../images/illustrations/brudas.jpg); }
#emigracja #content { background-image: url(../images/illustrations/emigracja.jpg); }
#pieklo #content { background-image: url(../images/illustrations/default.jpg); }
#sieciomaniak #content { background-image: url(../images/illustrations/sieciomaniak.jpg); }
#uprowadzony #content { background-image: url(../images/illustrations/uprowadzony.jpg); }
#wyrocznia-milosci #content { background-image: url(../images/illustrations/wyrocznia-milosci.jpg); }
#wartosc-milosci #content { background-image: url(../images/illustrations/wartosc-milosci.jpg); }
#chinska-wrozba #content { background-image: url(../images/illustrations/chinska-wrozba.jpg); }
#reinkarnacja #content { background-image: url(../images/illustrations/reinkarnacja.jpg); }
#dzieciaki #content { background-image: url(../images/illustrations/dzieciaki.jpg); }
#psychopata #content { background-image: url(../images/illustrations/psychopata.jpg); }
#tatuaz #content { background-image: url(../images/illustrations/tatuaz.jpg); }
#bogacz #content { background-image: url(../images/illustrations/bogacz.jpg); }
#gej #content { background-image: url(../images/illustrations/gej.jpg); }
#lesbijka #content { background-image: url(../images/illustrations/lesbijka.jpg); }
#malzenstwo #content { background-image: url(../images/illustrations/malzenstwo.jpg); }
#zydokomunista #content { background-image: url(../images/illustrations/zydokomunista.jpg); }

/* QUIZ B
------------------------------------------- */
.quiz-b p.count { padding-top: 15px; margin-top: 15px; border-top: 1px solid #ccc; }

form.oracle { padding: 15px 0 0; border-top: 1px solid #ccc; }
 form.oracle div.sense { position: relative; margin: 15px 0 10px 0; padding: 12px 0 5px 8px; border: 1px solid #ccc; border-width: 1px 0; }
 form.oracle p.submit { }
  form.oracle p.submit button { overflow: visible; padding: 2px 7px; border: 1px solid #e3e3e3; background: #fff; cursor: pointer; font-weight: bold; vertical-align: middle; }
 form.oracle p.field { position: relative; margin: 0 0 15px; padding: 0 0 0 10px; }
  form.oracle p.field label,
  form.oracle p.field span.label { display: block; margin: 0 0 5px; font-size: 0.75em; text-transform: uppercase; }
  form.oracle p.field input { width: 400px; margin: 0 0 0 -10px; padding: 1px 9px; }
  form.oracle p.field input.m { width: 280px; }
 form.oracle p.date { }
  form.oracle p.date label { position: absolute; left: -10001em; top: -10001em; }
  form.oracle p.date select { position: relative; margin: 0 20px 0 -10px; }