/* ============================= */
/* ========= reset css ========= */
/* ============================= */

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;}

:focus {outline:0;}

ins{text-decoration:none;}
del{text-decoration:line-through;}
table{border-collapse:collapse; border-spacing:0;}

.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}


/* ============================= */
/* ========= container ========= */
/* ============================= */

body{ font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;}

.site{ width:853px; margin:auto; height:557px; border:1px solid #d6d4d8; background:url(../images/bg_site.jpg) no-repeat left top; position:relative;}

.header{ height:193px; position:relative;}
.main{ height:400px; height:364px;}
.footer{ height:50px;}

.logo{ width:196px; height:193px; background:url(../images/img_logo.jpg) no-repeat left top; position:absolute; left:37px; top:0px; z-index:100;}
.logo a{width:196px; height:193px; display:block; text-indent:-90000px;}

.menu{ position:absolute; left:210px; top:64px; background: url(../images/bg_menu-end.gif) no-repeat left top; height:43px; width:582px; z-index:90;}
.menu ul{}
.menu li{ float:left; height:43px;}
.menu li a{ height:43px; display:block; text-indent:-90000px;}

.howParticipate a{width:176px;}
.game a{ width:130px;}
.vencedores a { width:130px;}
.gifs a{ width:122px;}
.regulation a{ width:154px;}

.howParticipate a:hover, .howParticipate a.on{background: url(../images/bg_menu-end.gif) no-repeat left bottom;}
.game a:hover, .game a.on{ background: url(../images/bg_menu.gif) no-repeat -176px bottom;}
.vencedores a:hover, .vencedores a.on{ background: url(../images/bg_menu-end.gif) no-repeat -176px bottom;}
.gifs a:hover, .gifs a.on{ background: url(../images/bg_menu-end.gif) no-repeat -306px bottom;}
.regulation a:hover, .regulation a.on{ background: url(../images/bg_menu-end.gif) no-repeat -428px bottom;}


.home .menu{ position:absolute; left:150px; top:26px;}

.entryImage{ width:640px; height:458px; background: url(../images/img_dia-namorados-end.jpg) no-repeat left top; position:absolute; left:103px; top:91px;}
.entryImage h1{ text-indent:-90000px}
.entryImage p{ text-indent:-90000px}
/*.entryImage a{ position:absolute; right:19px; bottom:11px; width:149px; height:38px; text-indent:-90000px;}
.entryImage a:hover{background: url(../images/bot_participa-hover.gif) no-repeat left top;}*/
.entryImage a{ position:absolute; right:120px; bottom:11px; width:167px; height:38px; text-indent:-90000px;}
.entryImage a:hover{background: url(../images/bot_vencedores-hover.gif) no-repeat right top;}

.entryHowTo{width:508px; height:357px; background: url(../images/img_como-participar.jpg) no-repeat left top; position:absolute; left:237px; top:141px; text-indent:-90000px;}


.titParticipate{ width:542px; height:25px; background: url(../images/txt_cria-tua-mensagem.gif) no-repeat left top; text-indent:-90000px; position:absolute; right:60px; top:140px;}

.panel{ width:751px; height:201px; background: url(../images/bg_panel.gif) no-repeat left top; left:50px; position:absolute;}
.panel .alphabet{ position:absolute; left:0px; top:0px; width:751px !important;}
.panel .letter{ float:left; margin:1px 0 0 1px !important; width:49px !important; height:49px !important; cursor:move;}
.panel .letter .ui-icon{ display:block; background: url(../images/letras/x_castanho.gif) no-repeat left top !important; width:16px !important; height:15px !important; position:absolute; left:0px; bottom:0px;}
.panel .caracterSpace .ui-icon{ display:block; background: url(../images/letras/x_branco.gif) no-repeat left top !important; width:16px !important; height:15px !important; position:absolute; left:0px; bottom:0px;}

.see .panel{left:50px; position:absolute; top:220px;}

.alphabet{ position:absolute; bottom:70px; left:80px; width:694px;}
.alphabet .letter{ display:block; float:left; width:29px; height:29px; position:relative; text-indent:-90000px; margin:2px; cursor:move;}
.alphabet .letter .ui-icon{ display:block; background: url(../images/letras/t_castanho_small.gif) no-repeat left top; width:12px; height:11px; position:absolute; left:0px; bottom:0px;}
.alphabet .caracterSpace .ui-icon{ display:block; background: url(../images/letras/t_branco_small.gif) no-repeat left top; width:12px; height:11px; position:absolute; left:0px; bottom:0px;}

.navBar{ position:absolute; bottom:15px; text-align:center; width:100%;}
.navBar .clearButton{ width:108px; height:39px; background: url(../images/bot_passatempo.gif) no-repeat left top; border:none; display:inline-block; overflow:hidden; font-size:0px; line-height:0px; color:#f5f1f7; letter-spacing:90000px; cursor:pointer; margin-right:28px;}
.navBar .clearButton:hover{background: url(../images/bot_passatempo.gif) no-repeat left bottom;}
.navBar .submitButton{ width:119px; height:39px; background: url(../images/bot_passatempo.gif) no-repeat -108px top; border:none; display:inline-block; overflow:hidden; font-size:0px; line-height:0px; color:#f5f1f7; letter-spacing:90000px; cursor:pointer; margin-left:28px;}
.navBar .submitButton:hover{background: url(../images/bot_passatempo.gif) no-repeat -108px bottom;}

.formMsg{display:block; font-size:11px; color:#f00; text-align:center; position:absolute; left:0px; bottom:0px; width:100%;}
.formMsg span{ display:block; text-align:center; width:100%; float:none; position:absolute; left:0px;}

fieldset{ width:580px; position:absolute; left:248px; top:200px;}
fieldset .legend{background: url(../images/img_form.gif) no-repeat left top; width:280px; height:24px; display:block; text-indent:-90000px; padding-bottom:30px;}
fieldset .formNameFrom{ width:290px; float:left; height:66px;}
fieldset .formNameFrom label{background: url(../images/img_form.gif) no-repeat left -55px;}
fieldset .formEmailFrom{ width:290px; float:left; height:66px;}
fieldset .formEmailFrom label{background: url(../images/img_form.gif) no-repeat -290px -55px;}
fieldset .formNameSend{ width:290px; float:left; height:66px;}
fieldset .formNameSend label{background: url(../images/img_form.gif) no-repeat left bottom;}
fieldset .formEmailSend{ width:290px; float:left; height:66px;}
fieldset .formEmailSend label{background: url(../images/img_form.gif) no-repeat -290px bottom;}

fieldset label{ display:block; height:20px; text-indent:-90000px; width:272px;}
fieldset input{ border:1px solid #cecece; width:250px; padding:3px 2px 3px 2px;}
fieldset .msg{ display:block !important; font-size:11px; color:#f00; float:left;}

fieldset .formBackButton{ display:block; padding-left:110px; padding-top:10px; float:left;}
fieldset .formBackButton input{width:104px; height:36px; background: url(../images/bot_recuar.gif) no-repeat left top; border:none; display:inline-block; overflow:hidden; font-size:0px; line-height:0px; color:#f5f1f7; letter-spacing:90000px; cursor:pointer; margin-left:28px;}
fieldset .formBackButton input:hover{background: url(../images/bot_recuar.gif) no-repeat left bottom;}

fieldset .formSubmitButton{ display:block; padding-top:10px; float:right; padding-right:180px;}
fieldset .formSubmitButton input{width:104px; height:36px; background: url(../images/bot_passatempo.gif) no-repeat -227px top; border:none; display:inline-block; overflow:hidden; font-size:0px; line-height:0px; color:#f5f1f7; letter-spacing:90000px; cursor:pointer; margin-left:28px;}
fieldset .formSubmitButton input:hover{background: url(../images/bot_passatempo.gif) no-repeat -227px bottom;}

.titMessage{ font-size:18px; color:#977878; font-weight:700; position:absolute; left:250px; top:140px;}
.ceateMessageButton{ width:209px; height:39px; display:block; background: url(../images/bot_cria-mensagem.gif) no-repeat left top; text-indent:-90000px; position:absolute; left:320px; bottom:50px;}
.ceateMessageButton:hover{background: url(../images/bot_cria-mensagem.gif) no-repeat left bottom;}

.chocoTelegramLogo{background: url(../images/logo_choco-telegram.gif) no-repeat left top; width:117px; height:28px; position:absolute; bottom:30px; right:50px;}
.chocoTelegramLogo a{ text-indent:-90000px; width:117px; height:28px; display:block;}

.titGifts{ width:530px; height:34px; text-indent:-90000px; background: url(../images/txt_presentes.gif) no-repeat left top; position:absolute; left:250px; top:140px;}

.parabens{ width:542px; height:50px; text-indent:-90000px; background: url(../images/img_vencedores-parabens.gif) no-repeat left top; position:absolute; left:250px; top:140px;}
.premiados{ width:542px; height:226px; text-indent:-90000px; background: url(../images/img_vencedores-lista.gif) no-repeat left top; position:absolute; left:250px; top:190px;}
.contactados{ width:542px; height:71px; text-indent:-90000px; background: url(../images/img_vencedores-contactados.gif) no-repeat left top; position:absolute; left:250px; top:416px;}

.giftsPanel{ width:756px; height:300px; background: url(../images/img_presentes.jpg) no-repeat left top; position:absolute; left:55px; top:200px;}
.giftsPanel li{ float:left; width:247px; height:130px; margin:0 5px 20px 0; position:relative;}
.giftsPanel li span{ text-indent:-90000px; display:block;}
.giftsPanel li a{ display:block; width:66px; height:29px; position:absolute; text-indent:-90000px;}
.giftsPanel li a:hover{background: url(../images/bot_ver-hover.gif) no-repeat left top;}

.gift01 a{ right:43px; bottom:21px;}
.gift02 a{ right:41px; bottom:21px;}
.gift03 a{ right:42px; bottom:21px;}
.gift04 a{ right:43px; bottom:22px;}
.gift05 a{ right:61px; bottom:22px;}
.gift06 a{ right:42px; bottom:22px;}

.seeMoreButton{ width:106px; height:29px; display:block; background: url(../images/bot_ver-mais.gif) no-repeat left top; text-indent:-90000px; position:absolute; right:185px; bottom:29px;}
.seeMoreButton:hover{background: url(../images/bot_ver-mais.gif) no-repeat left bottom;}

.entryFormMessage{ width:528px; height:205px; background: url(../images/img_mensagem.gif) no-repeat left top; text-indent:-90000px; position:absolute; left:250px; top:200px;}

.newMessageButton{ display:block; width:224px; height:36px; border:none; background: url(../images/bot_fim-mensagem.gif) no-repeat left top; text-indent:-90000px; position:absolute;  left:250px; bottom:90px;}
.newMessageButton:hover{ background: url(../images/bot_fim-mensagem.gif) no-repeat left bottom;}
.newMessageButton input{ font-size:1px; line-height:1px; border:none; width:224px; height:36px; display:block; overflow:hidden; letter-spacing:90000px;}
.irrequietosButton{ display:block; width:228px; height:36px; background: url(../images/bot_fim-mensagem.gif) no-repeat right top; text-indent:-90000px; position:absolute; right:75px; bottom:90px;}
.irrequietosButton:hover{ background: url(../images/bot_fim-mensagem.gif) no-repeat right bottom;}

/* ============================= */
/* ========== letters ========== */
/* ============================= */

.alphabet .caracterA{ background: url(../images/letras/A_small.gif) no-repeat left top;}
.alphabet .caracterB{ background: url(../images/letras/B_small.gif) no-repeat left top;}
.alphabet .caracterC{ background: url(../images/letras/C_small.gif) no-repeat left top;}
.alphabet .caracterD{ background: url(../images/letras/D_small.gif) no-repeat left top;}
.alphabet .caracterE{ background: url(../images/letras/E_small.gif) no-repeat left top;}
.alphabet .caracterF{ background: url(../images/letras/F_small.gif) no-repeat left top;}
.alphabet .caracterG{ background: url(../images/letras/G_small.gif) no-repeat left top;}
.alphabet .caracterH{ background: url(../images/letras/H_small.gif) no-repeat left top;}
.alphabet .caracterI{ background: url(../images/letras/I_small.gif) no-repeat left top;}
.alphabet .caracterJ{ background: url(../images/letras/J_small.gif) no-repeat left top;}
.alphabet .caracterK{ background: url(../images/letras/K_small.gif) no-repeat left top;}
.alphabet .caracterL{ background: url(../images/letras/L_small.gif) no-repeat left top;}
.alphabet .caracterM{ background: url(../images/letras/M_small.gif) no-repeat left top;}
.alphabet .caracterN{ background: url(../images/letras/N_small.gif) no-repeat left top;}
.alphabet .caracterO{ background: url(../images/letras/O_small.gif) no-repeat left top;}
.alphabet .caracterP{ background: url(../images/letras/P_small.gif) no-repeat left top;}
.alphabet .caracterQ{ background: url(../images/letras/Q_small.gif) no-repeat left top;}
.alphabet .caracterR{ background: url(../images/letras/R_small.gif) no-repeat left top;}
.alphabet .caracterS{ background: url(../images/letras/S_small.gif) no-repeat left top;}
.alphabet .caracterT{ background: url(../images/letras/T_small.gif) no-repeat left top;}
.alphabet .caracterU{ background: url(../images/letras/U_small.gif) no-repeat left top;}
.alphabet .caracterV{ background: url(../images/letras/V_small.gif) no-repeat left top;}
.alphabet .caracterW{ background: url(../images/letras/W_small.gif) no-repeat left top;}
.alphabet .caracterX{ background: url(../images/letras/X_small.gif) no-repeat left top;}
.alphabet .caracterY{ background: url(../images/letras/Y_small.gif) no-repeat left top;}
.alphabet .caracterZ{ background: url(../images/letras/Z_small.gif) no-repeat left top;}
.alphabet .caracter1{ background: url(../images/letras/1_small.gif) no-repeat left top;}
.alphabet .caracter2{ background: url(../images/letras/2_small.gif) no-repeat left top;}
.alphabet .caracter3{ background: url(../images/letras/3_small.gif) no-repeat left top;}
.alphabet .caracter4{ background: url(../images/letras/4_small.gif) no-repeat left top;}
.alphabet .caracter5{ background: url(../images/letras/5_small.gif) no-repeat left top;}
.alphabet .caracter6{ background: url(../images/letras/6_small.gif) no-repeat left top;}
.alphabet .caracter7{ background: url(../images/letras/7_small.gif) no-repeat left top;}
.alphabet .caracter8{ background: url(../images/letras/8_small.gif) no-repeat left top;}
.alphabet .caracter9{ background: url(../images/letras/9_small.gif) no-repeat left top;}
.alphabet .caracter0{ background: url(../images/letras/0_small.gif) no-repeat left top;}
.alphabet .caracterDote{ background: url(../images/letras/ponto_small.gif) no-repeat left top;}
.alphabet .caracterComma{ background: url(../images/letras/virgula_small.gif) no-repeat left top;}
.alphabet .caracterQuestion{ background: url(../images/letras/interrogacao_small.gif) no-repeat left top;}
.alphabet .caracterExclamation{ background: url(../images/letras/exclamacao_small.gif) no-repeat left top;}
.alphabet .caracterAspas{ background: url(../images/letras/traco_small.gif) no-repeat left top;}
.alphabet .caracterSpace{ background: url(../images/letras/space_small.gif) no-repeat left top;}

.panel .alphabet .caracterA{ background: url(../images/letras/A.gif) no-repeat left top;}
.panel .alphabet .caracterB{ background: url(../images/letras/B.gif) no-repeat left top;}
.panel .alphabet .caracterC{ background: url(../images/letras/C.gif) no-repeat left top;}
.panel .alphabet .caracterD{ background: url(../images/letras/D.gif) no-repeat left top;}
.panel .alphabet .caracterE{ background: url(../images/letras/E.gif) no-repeat left top;}
.panel .alphabet .caracterF{ background: url(../images/letras/F.gif) no-repeat left top;}
.panel .alphabet .caracterG{ background: url(../images/letras/G.gif) no-repeat left top;}
.panel .alphabet .caracterH{ background: url(../images/letras/H.gif) no-repeat left top;}
.panel .alphabet .caracterI{ background: url(../images/letras/I.gif) no-repeat left top;}
.panel .alphabet .caracterJ{ background: url(../images/letras/J.gif) no-repeat left top;}
.panel .alphabet .caracterK{ background: url(../images/letras/K.gif) no-repeat left top;}
.panel .alphabet .caracterL{ background: url(../images/letras/L.gif) no-repeat left top;}
.panel .alphabet .caracterM{ background: url(../images/letras/M.gif) no-repeat left top;}
.panel .alphabet .caracterN{ background: url(../images/letras/N.gif) no-repeat left top;}
.panel .alphabet .caracterO{ background: url(../images/letras/O.gif) no-repeat left top;}
.panel .alphabet .caracterP{ background: url(../images/letras/P.gif) no-repeat left top;}
.panel .alphabet .caracterQ{ background: url(../images/letras/Q.gif) no-repeat left top;}
.panel .alphabet .caracterR{ background: url(../images/letras/R.gif) no-repeat left top;}
.panel .alphabet .caracterS{ background: url(../images/letras/S.gif) no-repeat left top;}
.panel .alphabet .caracterT{ background: url(../images/letras/T.gif) no-repeat left top;}
.panel .alphabet .caracterU{ background: url(../images/letras/U.gif) no-repeat left top;}
.panel .alphabet .caracterV{ background: url(../images/letras/V.gif) no-repeat left top;}
.panel .alphabet .caracterW{ background: url(../images/letras/W.gif) no-repeat left top;}
.panel .alphabet .caracterX{ background: url(../images/letras/X.gif) no-repeat left top;}
.panel .alphabet .caracterY{ background: url(../images/letras/Y.gif) no-repeat left top;}
.panel .alphabet .caracterZ{ background: url(../images/letras/Z.gif) no-repeat left top;}
.panel .alphabet .caracter1{ background: url(../images/letras/1.gif) no-repeat left top;}
.panel .alphabet .caracter2{ background: url(../images/letras/2.gif) no-repeat left top;}
.panel .alphabet .caracter3{ background: url(../images/letras/3.gif) no-repeat left top;}
.panel .alphabet .caracter4{ background: url(../images/letras/4.gif) no-repeat left top;}
.panel .alphabet .caracter5{ background: url(../images/letras/5.gif) no-repeat left top;}
.panel .alphabet .caracter6{ background: url(../images/letras/6.gif) no-repeat left top;}
.panel .alphabet .caracter7{ background: url(../images/letras/7.gif) no-repeat left top;}
.panel .alphabet .caracter8{ background: url(../images/letras/8.gif) no-repeat left top;}
.panel .alphabet .caracter9{ background: url(../images/letras/9.gif) no-repeat left top;}
.panel .alphabet .caracter0{ background: url(../images/letras/0.gif) no-repeat left top;}
.panel .alphabet .caracterDote{ background: url(../images/letras/ponto.gif) no-repeat left top;}
.panel .alphabet .caracterComma{ background: url(../images/letras/virgula.gif) no-repeat left top;}
.panel .alphabet .caracterQuestion{ background: url(../images/letras/interrogacao.gif) no-repeat left top;}
.panel .alphabet .caracterExclamation{ background: url(../images/letras/exclamacao.gif) no-repeat left top;}
.panel .alphabet .caracterAspas{ background: url(../images/letras/traco.gif) no-repeat left top;}
.panel .alphabet .caracterSpace{ background: url(../images/letras/space.gif) no-repeat left top;}