/* GENERAL */

body {
	margin:0;
	padding:0;
	background:#000 url(img/bg.gif) repeat-x 0 0;
}
#header {
	width:100%;
	text-align:center;
	background:url(img/header-bg.gif) repeat-x;
	height:186px;
	text-align:center;
}
#header h1 {
	background: url(https://sdp.terra.com.br/image/klavika?c=ph&t=Voc%EA%20sabe%20tudo%20sobre%20s%E9ries%20de%20TV?) no-repeat;
	position : absolute;
	width : 940px;
	height : 40px;
	left : 15px;
	top : 148px;
	z-index : 2;
	margin:0;
}
#header h1 a {
	display : block;
	width : 700px;
	height : 40px;
	float : left;
	text-indent : -6000px;
	overflow : hidden;
}
#header h2, #header h2 a {
	display : block;
	position:absolute;
	width : 300px;
	height : 30px;
	overflow : hidden;
	text-indent : -60000px;
	top:0;
	left:0;
	margin:0;
	background:url(img/terra.gif) no-repeat;
}

/* BANNER */

#banner {
	position :  absolute;
	left : 126px;
	top : 40px;
	width : 728px;
	height : 90px;
	z-index : 1000;
	overflow:hidden;
}

/* MENU */

#menu {
	position : absolute;
	left : 0;
	top : 185px;
	width : 1000px;
	height : 37px;
	background:#fff url(img/menu-bg.gif) repeat-x;
	z-index : 20;
}
#menu h2 {
	width : auto;
	height : 40px;
	line-height : 40px;
	float : left;
	font-family : Arial, Helvetica, sans-serif;
	font-size:12px;
	margin:3px 0 0 0;
}
#menu h2 a {
	font-family : Arial, Helvetica, sans-serif;
	font-size:12px;
	width : auto;
	height : 13px;
	line-height : 13px;
	float : left;
	margin : 8px 0 0 0;
	padding : 0 15px;
	border-right : 1px solid #bbb7b3;
	color : #5d5850;
	display : block;
	text-decoration:none;
}
#menu h2.mne a, #menu h2 a:hover, #menu h2#sel a { color : #ff9900; }
#menu h2.mne, #menu h2.mne a {
	float : right;
	padding : 0 10px;
	border : none;
	margin-left:
}
#menu h2.mne a:hover { text-decoration : underline; }

/* HOME */

#login {
	width:1000px;
	overflow:hidden !important;
	position:absolute;
	top:0;
	left:0;
	margin:0;
	height:500px;
	background:url(img/home-image.jpg);
}
#facebookConnect, #twitterConnect, #botaoAnonimo { 
	display:block; 
	height:24px;
	width:150px;
	overflow:hidden;
	position:absolute;
}
#facebookConnect * {
	height:24px;
	width:150px;
}
#facebookConnect {
	background:url(img/facebook.gif) no-repeat 0 0;
	left:425px;
	top:301px;
}
#twitterConnect {
	background:url(img/twitter.gif) no-repeat 0 0;
	left:425px;
	top:336px;
}
#botaoAnonimo {
	width:200px;
	left:400px;
	top:370px;
	color:#f90;
	font-size:11px;
	text-align:center;
}
#botaoAnonimo:hover {
	color:#fff !important;
	text-decoration:underline;
}
#facebookConnect:hover, #twitterConnect:hover { 
	background-position:0 -24px;
}
#facebookConnect *, #twitterConnect * { 
	-moz-opacity:.01; filter:alpha(opacity=01); opacity:.01;
}
a#botaoResponder {
	left:447px;
	top:301px;
	background:transparent url(img/responder.gif) repeat scroll 0 0;
	display:none;
	position:absolute;
	height:24px;
	width:109px;
	cursor:pointer;
}
a#botaoResponder:hover {
	background-position:0 -30px;
}
.fbLogged #botaoResponder {
	display:block;
}
.fbLogged #facebookConnect, .fbLogged #botaoAnonimo,  .fbLogged #twitterConnect {
	display:none;
}
.loading #facebookConnect, .loading #botaoAnonimo,  .loading #twitterConnect {
	display:none !important;
}

/* QUIZ */

#quiz {
	width:1000px;
	overflow:hidden !important;
	position:absolute;
	top:222px;
	left:0;
	margin:0;
	height:500px;
}
#quiz * {
	font-family : Arial, Helvetica, sans-serif;
	background-repeat : no-repeat;
	margin : 0;
	padding : 0;
	border:none;
}
#quiz a { text-decoration : none; }
#quiz a:hover { color : #D14591; }

/* NAVIGATION */

#quiz #nav {
	position : relative;
	left : 938px;
	top : 17px;
	z-index : 10;
	display : none;
	width : 52px;
	height : 24px;
	z-index : 77;
}
#quiz #nav a {
	display : block;
	position : absolute;
	width : 24px;
	height : 24px;
	margin : 1px;
	z-index : 77;
	text-indent:-5000px;
	cursor:pointer;
}
#quiz #next a:hover, #quiz #previous a:hover { background-position : 0 -24px; }
#quiz #next a {
	background-image : url(img/prox.gif);
	left : 26px;
	top : 0;
}
#quiz #previous a {
	background-image : url(img/ant.gif);
	left : 0;
	top : 0;
}
#quiz #next a.done { text-indent:0; }
#quiz #next a input {
	position:absolute;
	width : 24px;
	height : 24px;
	position:relative;
	top:0;
	left:0;
	background:none;
	cursor:pointer;
}
a.proxima {
	background:transparent url(img/proxima-pergunta.gif) repeat scroll 0 0;
	display:block;
	float:left;
	height:24px;
	margin-top:0;
	text-indent:-5000px;
	width:117px;
	cursor:pointer;
}
a.proxima:hover {
	background-position:0 -30px;
}
a.finalizar {
	background:transparent url(img/finalizar.gif) repeat scroll 0 0;
	display:block;
	float:left;
	height:24px;
	margin-top:5px;
	width:102px;
	cursor:pointer;
}
a.finalizar:hover {
	background-position:0 -30px;
}
a.finalizar input {
	position:absolute;
	width : 102px;
	height : 24px;
	position:relative;
	top:0;
	left:0;
	background:none;
	cursor:pointer;
}

/* */

#quiz #name { 
	text-transform:uppercase;
	font-size : 10px;
	left:657px;
	position:absolute;
	top:18px;
	width:333px;
	z-index:2;
	border-bottom:1px dotted #5d5850;
	height:45px;
}
#quiz #name img, #quiz #name profile-pic, #quiz #name p {
	float:left; height:30px;
}
#quiz #name p {
	margin-left:10px;
	width:280px;
	color:#978e81;
}
#quiz #name p a {
	color:#9bc80d;
}
#quiz h2 {
	display : block;
	width : 619px;
	overflow : hidden;
	float : left;
	margin:0 0 10px;
	background-position: 0 -6px;
	color:#5d5d5d;
	font-size:24px;
	font-weight:normal;
}

/* QUESTIONS */

#quiz #questions_quiz { float:left; _float:none; }
#quiz .question {
	width : 1000px;
	float:left;
	position:absolute;
	height:500px;
	top:0;
	left:0;
}
#quiz .question .imagem {
	position:absolute;
	top:17px;
	left:17px;
	border:1px solid #232323;
}
#quiz .question .imagem strong {
	color:#000000;
	display:block;
	font-size:235px;
	left:0;
	line-height:464px;
	position:absolute;
	text-align:center;
	top:0;
	width:100%;
	-moz-opacity:.80; filter:alpha(opacity=80); opacity:.80;
}
#quiz #questions_quiz p {
	font-size : 12px;
	float:left;
	margin:0 !important;
	clear:both;
	width:334px;
	line-height:19px;
}
#quiz #questions_quiz ul {
	position : absolute;
	left : 656px;
	top : 62px;
	width : 333px;
	z-index : 40;
}
#quiz #questions_quiz h4, .connect {
	float : left;
	color : #5d5850;
	font-size : 10px;
	text-transform:uppercase;
	padding:15px 0 10px;
}
#quiz #questions_quiz h3 {
	font-size: 16px;
	line-height:22px;
	float : left;
	color : #fff;
	clear:both;
	font-weight:bold;
	padding-bottom:5px;
	width:333px;
}
*.hide { display:none }

/* OPTIONS */

#quiz #questions_quiz li a img, #quiz li a img { border : 4px solid #bebebe; }
#questions_quiz li a:hover img, #quiz li a:hover img { border : 4px solid #D14591; }
#quiz li img { display:none }
#quiz li p {
	margin:0;
	font-weight:normal;
	color:#beb7af;
	line-height:18px;
}
#quiz li {
	float : left;
	display : block;
	list-style : none;
	width:100%;
	margin:0;
	padding:7px 0;
}
.radio {
	display:block;
	float:left;
	width:29px;
	height:19px;
	background:url(img/radio.gif) no-repeat 0 0;
	cursor:pointer
}

/* RESULTS */

#quiz p#result {
	font-size : 11px;
	color : #556B2F;
	font-weight : bold;
}
#quiz #total {
	height : 30px;
	padding : 10px;
	border-top : 1px solid #ccc;
}
#quiz p.percent {
	color : #228B22;
	font-size : 18px;
}
#quiz #answer_html {
	display:block;
	float:left;
	width:100%;
}
#quiz .bgclr {
	background-color : transparent;
	text-align:center;
	color:#9bc80d;
}
#quiz #answer_html h3 {
	display:block;
	float:left;
	font-size:18px;
	line-height:normal;
	padding:0 0 20px;
}
#quiz #answer_html p {
	font-size: 18px;
	font-weight: normal;
	display : block;
	padding : 10px 0;
	margin-left : 0px;
	margin-top : 0px;
	color:#47423a;
}
#quiz #answer_html p strong {
	font-weight: normal;
	color:#759ed0;
}
#quiz #text_answers {
	height:270px;
	overflow:auto;
	width:333px;
	float:left;
	margin-bottom:10px;
}
#quiz #text_answers strong {
	font-size:12px;
	font-weight:bold;
	color:#7f7871;
}
#quiz #text_answers ol {
	clear:both;
	width:307px;
	overflow:hidden;
	font-size:12px;
	font-weight:bold;
}
#quiz #text_answers ol li {
	padding:0 0;
	font-size:12px;
	font-weight:normal;
	width:307px;
	border-bottom:1px dotted #515151;
}
#quiz #text_answers ol li.correct { background:url(img/correct.gif) no-repeat 270px center; }
#quiz #text_answers ol li.wrong { background:url(img/wrong.gif) no-repeat 270px center; }
#quiz #text_answers ol li b {
	float:left;
	height:100%;
	padding:8px 5px 8px 0;
	display:block;
	color:#f90;
	line-height:19px;
}
#quiz #text_answers p {
	float:left;
	height:100%;
	padding:8px 0;
	width:240px !important;
	clear:none;
}
#quiz #text_answers p span {
	color:#858585;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	text-transform:uppercase;
	font-weight:normal;
}
#facebookPost, #twitterPost {
	display:block; 
	height:24px;
	width:150px;
	overflow:hidden;
	float:left;
	clear:both;
	margin-top:5px;
	text-indent:-5000px;
}
#facebookPost {
	background:url(img/facebook2.gif) no-repeat 0 0;
}
#twitterPost {
	background:url(img/twitter2.gif) no-repeat 0 0;
}
.tentar #facebookPost, .tentar #twitterPost {
	display:none;
}
#facebookPost:hover, #twitterPost:hover { 
	background-position:0 -24px;
}
a.tentar-de-novo {
	margin-top:5px !important;
	background:transparent url(img/tentar-de-novo.gif) repeat scroll 0 0;
	display:block;
	float:left;
	height:24px;
	width:102px;
	cursor:pointer;
	clear:both;
}
a.tentar-de-novo:hover {
	background-position:0 -30px;
}



#tbox { 
	display:none; 
	position:absolute; 
	width:619px; 
	height:464px; 
	background:url("https://a3.twimg.com/a/1282002387/images/bg-clouds.png") repeat-x scroll 0 0 #C0DEED;
	top:18px;
	left:18px; 
	-moz-opacity:.95; filter:alpha(opacity=95); opacity:.95;
}
#tbox iframe {
	position:absolute;
	left:110px;
	top:180px;
}

/*mais*/

.mais #texto {
	background-color:transparent;
	border:medium none;
	left:20px;
	position:absolute;
	top:230px;
	width:920px;
}
.mais #texto p { float : left; font-family:Arial, Helvetica, sans-serif; color:#FFF; font-size:12px; }
.mais #texto p, .mais #texto p a {
	width : 210px;
	display : block;
	height : 70px;
	margin-right:20px;
	color:#beb7af;
	text-decoration:none;
}
.mais #texto p a {
	font-weight : bold;
	line-height : 14px;
}
.mais #texto p a:hover { color : #ff9900; }
.mais #texto p a img {
	border : 3px solid #000;
	float : left;
	margin : 0 5px 0 0;
}
.mais #texto p a:hover img { border : 3px solid #ff9900; }