/*##########################################
Name: Default styling for Niceforms v.1.0
Author: Lucian Slatineanu
URL: http://www.badboy.ro/
##########################################*/

/*General styles - NOT really related to the forms*/
* {
	margin:0;
	padding:0;
}
html { background-color:transparent }
body {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#404040;
	background-color:transparent;
}
..wait,.wait *{
cursor: wait;
/*color:#F5F5F5;
background-color:#FFC0CB;*/
}
img {border:0;}
#form-container { width:516px; line-height:1.5em; }
#form-container p { color:#909090;  }
#form-container a { font-size:12px; color:#1F80B1; }
#form-container fieldset {
	border:none;	
	width:456px;
}
#form-container legend {
	color:#555;
	padding:5px 0;
	font-size:14px;
}

#form-container legend span {display:block; width:456px;}

#form-container h3.title {
	color:#909090;
	font-size:16px;
	font-weight:normal;
	padding:8px 0 0 12px;
	width:500px;
}
#botones {
	float:left;
	border-top:1px #999 dotted;
	width:516px;
	padding:10px 0;
	text-align:right;
}
#botones span { float:left }
#form-container #botones p { font-size:10px }
#form-container em { color:#d70c1b; font-style:normal }
#form-container h1 { color:#909090; font-size:39px; line-height:normal }

#form-container h2 {
	color:#909090;
	border-bottom:1px #666666 dotted;
	width:516px;
	padding:5px 0;
	margin-bottom:15px;
	font-size:18px;
}

/* form sube tu happing */
#form-body-sube {
	width:380px;
	margin:0 auto;
}
#form-content-sube {
	float:left;
	width:183px;
	padding-right:20px;
}
#form-content-sube h3 {
	color:#909090;
	padding:0 0 10px 0;
	font-size:16px;
	font-weight:normal;
}
#form-sidebar-sube {
	float:right;
	width:150px;
	border-left:1px dotted #666;
	padding-left:20px;
	margin-bottom:20px;
}
#form-footer-sube {
	clear:both;
	border-top:1px dotted #666;
	padding:10px 0 30px 0;
}
#form-footer-sube em { color:#909090 }
#botones p {
	text-align:left;
	font-size:14px;
	padding-bottom:10px;
}
div.auto_complete {
	position:absolute;
	width: 350px;
	background: #fff;
}
div.auto_complete ul {
	position:absolute;
	border:1px solid #888;
	margin:0;
	padding:0;
	width:100%;
	list-style-type:none;
}
div.auto_complete ul li {
	background:#FFF;
	margin:0;
	padding:3px;
}
div.auto_complete ul li.selected {
	background-color:#F00;
	color:#FFF;
}
div.auto_complete ul strong.highlight {
	color: #800; 
	margin:0;
	padding:0;
}
#msg { font-size:11px; line-height:1.3em; color:#F00 }
/* texts center align #tengo que nomenclar y optimizar */
.txtContainer {
	height:360px;
	position:relative;
}
.en-hora-buena {
	width:400px;
	position:absolute;
	top:50%;
	left:50%;
	margin-left:-200px;
}
.en-hora-buena p {
	padding:7px 20px;
	font-size:15px;
	font-weight:normal;
}


#en-hora-buena-contrasena {
	height:250px;
}
#valign-en-hora-buena-contrasena {
	height:110px; margin-top:-85px
}
#valign-en-hora-buena {
	height:180px; margin-top:-120px;
}
/* promo */
.en-hora-buena-usuario {
	width:400px;
	position:absolute;
	top:50%;
	left:50%;
	margin-left:-200px;
}
.en-hora-buena-usuario p {
	padding:10px 20px;
	font-size:15px;
	font-weight:normal;
}

.en-hora-buena-usuario p em i{
	font-size:18px;
	font-style:normal;
}

.en-hora-buena-usuario p b {
	font-size:24px;
	font-weight:normal;
}

#valign-en-hora-buena-usuario {
	height:180px; margin-top:-200px;
}
/*Forms defaults - change as needed*/
#form-container input, #form-container textarea, textarea {
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
	color:#676767;
}
#form-container label {
	color:#909090;
	cursor:pointer;
	padding-left:2px;
	line-height:18px;
	font-size:12px;
}
#form-container label.chosen {color:#5A5A5A;}

/*Transparent items*/
.outtaHere {
	position:absolute;
	left:-3000px;
	display:none;
}

/*Radio buttons*/
.radioArea, .radioAreaChecked,
.radioAreaDisabled, .radioAreaDisabledChecked  {
	display:block;
	float:left;
	clear:left;
	width:15px;
	height:14px;
	font-size:0;
	cursor:pointer;
}
.radioArea {background:url(/img/frm/radio.gif) no-repeat left top;}
.radioAreaChecked {background:url(/img/frm/radio.gif) no-repeat left bottom;}

.radioAreaDisabled {background:url(/img/frm/radio_disabled.gif) no-repeat left top;}
.radioAreaDisabledChecked {background:url(/img/frm/radio_disabled.gif) no-repeat left bottom;}

/*Checkboxes*/
.checkboxArea, .checkboxAreaChecked,
.checkboxAreaDisabled, .checkboxAreaDisabledChecked {
	display:block;
	float:left;
	clear:left;
	width:13px;
	height:13px;
	font-size:0;
	padding:0;
	margin:0;
	cursor:pointer;
}
.checkboxArea {background:url(/img/frm/checkbox.gif) no-repeat left top;}
.checkboxAreaChecked {background:url(/img/frm/checkbox.gif) no-repeat left bottom;}

.checkboxAreaDisabled {background:url(/img/frm/checkbox_disabled.gif) no-repeat left top;}
.checkboxAreaDisabledChecked {background:url(/img/frm/checkbox_disabled.gif) no-repeat left bottom;}


.focused {border:1px dotted #ddd;}

/*Text inputs*/
.textinput, .textinputHovered {
	height:18px;
	background:url(/img/frm/input_bg.gif) repeat-x left top;
	border:none;
	padding:4px 2px;
	vertical-align:middle;
}
.textinputHovered {background-position:left bottom;}
#form-container input.big, #form-container input.bigHovered, #form-container textarea.big, #form-container textarea.bigHovered, .big, .bigHovered {
	font-size:24px;
	height:27px;
	border:none;
	padding:4px 2px;
	vertical-align:middle;
	background:url(/img/frm/input_bg_big.gif) repeat-x;
}

#form-container input.small, #form-container input.smallHovered, #form-container textarea.small, #form-container textarea.smallHovered, .small, .smallHovered {
	font-size:10px;
	height:11px;
	border:none;
	padding:4px 0;
	vertical-align:middle;
	background:url(/img/frm/input_bg_small.gif) repeat-x;
}

#form-container input.small, #form-container textarea.small, .small {background-position: left top;}

#form-container input.bigHovered, #form-container textarea.bigHovered, input.bigHovered {background-position:left bottom;}
#form-container input.smallHovered, input.smallHovered {background-position:left -19px;}

.inputCorner {
	padding-bottom:0;
	vertical-align:middle;
}


/*Text areas*/
.txtarea .tr, .txtarea .tr_xon {background:url(/img/frm/txtarea_tr.gif) no-repeat top right;}
.txtarea .tr_xon {background:url(/img/frm/txtarea_tr_xon.gif) no-repeat top right;}
.txtarea img.txt_corner {
	width:5px;
	height:5px;
	display:block;
}
.txtarea .br, .txtarea .br_xon {background:url(/img/frm/txtarea_br.gif) no-repeat top right;}
.txtarea .br_xon {background:url(/img/frm/txtarea_br_xon.gif) no-repeat top right;}
.txtarea .cntr {background:url(/img/frm/txtarea_cntr.gif) repeat-y right top;}
.txtarea .cntr_xon {background:url(/img/frm/txtarea_cntr_xon.gif) repeat-y right top;}
.txtarea .cntr_l, .txtarea .cntr_l_xon {
	width:5px;
	background:url(/img/frm/txtarea_l.gif) repeat-y left top;
	float:left;
}
.txtarea .cntr_l_xon {background:url(/img/frm/txtarea_l_xon.gif) repeat-y left top;}
.txtarea textarea {
	border:0;
	background:none;
	padding:0;
	margin:5px;
}

/*Selects*/
.selectArea {
	font-size:15px;
	width:200px;
	height:26px;
	background:url(/img/frm/select_bg.gif) repeat-x left top;
	float:left;
}
.selectAreaSmall {
	font-size:13px;
	width:200px;
	height:26px;
	background:url(/img/frm/select_bg.gif) repeat-x left top;
	float:left;
}
.selectArea .left, .selectAreaSmall .left {
	width:8px;
	height:26px;
	float:left;
	background:url(/img/frm/select_left.gif) no-repeat left top;
}
.selectArea .right, .selectAreaSmall .right {
	width:21px;
	height:26px;
	float:right;
	background:url(/img/frm/select_right.gif) no-repeat left top;
	position:relative;
	z-index:498;
}
.selectArea .right a, .selectAreaSmall .right a {
	display:block;
	width:200px;
	height:26px;
	margin-left:-179px;
	position:relative;
	z-index:500;
}
.selectArea .right i, .selectAreaSmall .right i {display:none;}
.selectArea .center, .selectAreaSmall .center {
	width:160px;
	color:#7A7A7A;
	padding-top:4px;
	overflow:hidden;
	white-space:nowrap;
}

/*Selects drop-down*/
.optionsDivInvisible, .optionsDivVisible {
	position:absolute;
	margin-top:-1px;
	margin-left:3px;
	width:172px;
	background:#FFF;
	border:1px solid #888;
	font-size:15px;
	z-index:500;
	max-height:200px;
	height:auto !important;
	height:200px;
	overflow:auto;
}
.optionsDivInvisible {display:none;}
.optionsDivVisible {display:block;}
.optionsDivVisible p {
	margin:0;
	padding:0;
}
.optionsDivVisible a {
	color:#888;
	text-decoration:none;
	display:block;
	padding:3px 5px;
	border:0px solid #FFF;
	text-align:left;
}
.optionsDivVisible a:hover {
	color:#FFF;
	background:#888;
	border-color:#888;
}

/*Button*/
.buttonSubmit, .buttonSubmitHovered, .buttonSubmitDisabled {
	width:auto;
	overflow:visible;
	height:29px;
	color:#7A7A7A;
	font-weight:normal;
	font-size:16px;
	background:url(/img/frm/button_bg.gif) repeat-x left top;
	cursor:pointer;
	border:none;
	padding:0 5px;
}
.buttonSubmitHovered {background-position:left bottom;}
.buttonSubmitDisabled {background:url(/img/frm/button_bg_disabled.gif) left top; cursor:default}
.buttonImg {vertical-align:bottom;}


#form-container a.boton_registrate {float:left; width:94px; height:29px; padding:2px 15px; color:#FFFFFF; text-decoration:none; background:transparent url(/img/boton_registrate.png) no-repeat; cursor:pointer;}



/*--------------=AmigoIvisible-----------------*/

.form-amigo-invisible #botones {padding: 5px 0px 0px 0px;}
#form-container.form-amigo-invisible #botones p.sms-remanentes {font-size:11px; color:#909090; font-weight:bold; float:right; padding: 3px 5px 0px 0px;}

.form-amigo-invisible .buttonSubmit, 
.form-amigo-invisible .buttonSubmitHovered, 
.form-amigo-invisible .buttonSubmitDisabled {font-size:15px;}

#form-container.form-amigo-invisible br {clear:both;}
#form-container textarea {
/*scrollbar-3dlight-color : #fff;
  scrollbar-arrow-color : #fff;
  scrollbar-darkshadow-color : #fff;
  scrollbar-face-color : #fff;
  scrollbar-highlight-color : #fff;
  scrollbar-shadow-color : #fff;
  scrollbar-track-color : #fff;  */
  padding:0;}

#form-container a.boton_registrate {float:left; width:94px; height:29px; padding:2px 15px; color:#FFFFFF; text-decoration:none; background:transparent url(/img/boton_registrate.png) no-repeat; cursor:pointer;}

#form-container #botones p.mecanica-promo, p.mecanica-promo {float:left; width:220px; font-size:12px; line-height: 1.2em;}

#boton-enviar {width:140px;}
#boton-enviar-correo {width:190px;}
#boton-enviar-sms {width:110px;}
 

/*subir frase*/

#subir-frase {float:left; width:100%; margin:10px 0;}
#subir-frase div.txtarea {float:left; padding-bottom:10px;}
#subir-frase label {float:right; width:48%;}


#elegir-categoria {float:left; width:100%; margin:0px;}
#elegir-categoria h5{margin-bottom:5px; font-size:13px; font-weight:normal; color:#909090;  border-bottom:1px #666666 dotted;}
#elegir-categoria p.right {width:47%; float:right;}

#categoria-inputs {float:left; width:50%;}
#categoria-inputs label { padding-left:30px;}
#categoria-inputs span {padding:7px 0; float:left; width:160px; }

#cat0 {background:transparent url(/img/amigo/cat-sorprende.png) no-repeat 15px 0;}
#cat1 {background:transparent url(/img/amigo/cat-fascina.png) no-repeat 15px  0;}
#cat2 {background:transparent url(/img/amigo/cat-llega.png) no-repeat 15px 0;}
#cat3 {background:transparent url(/img/amigo/cat-reir.png) no-repeat 15px 0;}

#trucoMed {
clear:both;
width:100%; 
height: 83px;
padding-top: 40px; 
background:transparent url(/img/amigo/truco_mediano.png) no-repeat right;}

#trucoMed p { width:200px; padding-right:20px; padding-top:0px;}

/*Eleccion regalo*/

#regalo-inputs {
float:left;
width:205px;
padding-left:15px;}

#regalo-inputs p {
/*padding:80px 0px 0px 0px*/
}

#regalo-imagenes-truco {
float:right;
width:296px;} 

#trucoSmall {
float:right;
width:100%; 
height: 83px;
padding-top: 40px; 
background:transparent url(/img/amigo/truco_chico.png) no-repeat right;}

#trucoSmall p { width:190px; padding-right:15px; padding-top:0px;}



/*Enviar por sms*/

#mensajeBaloon {
float:left; 
width:510px; 
padding:15px 25px 0px 0px;
background:transparent url(/img/amigo/baloon-mensaje-top.png) no-repeat top left;
}

#mensajeBaloon p {
width:490px; 
padding:0px 20px 40px 15px;
font-size:22px; 
color:#d70c1b; 
word-wrap:break-word; 
line-height:1em;
background:transparent url(/img/amigo/baloon-mensaje-bottom.png) no-repeat bottom left;}

#mensajeBaloon span {
position:relative;
top:-7px;
left:50px;
font-size:14px; 
color:#909090; 
line-height:0;
display:block;
}


#mensajeBaloon.alt {
background:transparent url(/img/amigo/baloon-mensaje-top.png) no-repeat top left;
}

#mensajeBaloon.alt p {font-size:16px;}

#mensajeBaloon.alt span {top: -20px; line-height:1.3em;}

#wrapSms {
float:left;
height:316px;
}

#smsInputs {
float:left; 
height:295px;
padding-left:40px;
width:270px;
position:relative;
}

#smsInputs span {
position:absolute;
top:156px;
left:191px;
display:block;
width:120px;
font-size:11px;
color:#909090;
line-height:1.3em;
font-weight:bold;
}

#activarTelefono {position:absolute; left:182px; top:219px; width:150px; text-align:justify; z-index:0;}
#activarTelefono dt input {font-size:12px;}
#activarTelefono dd {
width:115px;
padding-left:5px;
margin-left:10px;
margin-top:2px;
font-size:11px;
color:#909090; 
text-align:left;
border-left:1px #666666 dotted;}
#activarTelefono dd em {font-size:11px;}


#smsPreview {
float:right; 
height:298px; 
width:202px; 
background:transparent url(/img/amigo/sms-preview.png) no-repeat bottom center;}

#smsPreview dt {
padding-left:45px;
font-weight:bold;
color:#909090;}

#smsPreview dd{
padding:40px 50px 0px 50px;
font-size:11px;
line-height:1.1em;
color:#FFFFFF;}

/*Enviar por email*/

#wrapEmail {
float:left;
width:90%;
padding:20px 0px 0px 40px;}

#wrapEmail label{
display:block;
float:left;
width: 200px;}

#wrapEmail span {
float:right;
width:200px;
position:relative;
top:17px;
left:0px;
font-size:11px;
font-weight:bold;
color:#909090;
}

#wrapEmail div.txtarea {float:left; margin-bottom:10px;}

/*logados*/

#logados {
position:static;
float:left;
width:100%;
margin-left:0px;
margin-top:0px;}

#trucoBig {
width:100%; 
height: 103px; 
margin:10px 0px;
background:transparent url(/img/amigo/truco_largo.png) no-repeat right;}

#trucoBig p { width:285px; }

p.truco {float:right; font-size:12px; line-height: 1.2em; padding-top:30px }



/*enhorabuena*/

#amigo-invisible-enhorabuena {
float:right;
left:45%;
height:170px;
width:370px;
padding-left:100px;
padding-top:20px;
margin-top:-130px;
background:url(/img/amigo/enhorabuena.png) no-repeat -5px -0px;
}
.borrar-personaje {
background:url(/img/personajes/figura-eliminar.png) no-repeat -5px -0px !important;
}

#amigo-invisible-enhorabuena p {padding: 10px 20px;}

#amigo-invisible-enhorabuena p.hecho {
font-size:34px;}

#amigo-invisible-enhorabuena p.validarFrase, #amigo-invisible-enhorabuena p.validarFrase em {
font-size:24px;
line-height:normal;}

#amigo-invisible-enhorabuena p.hacerAhora {font-size:20px;}
/*****/






#confirma-bloqueo{
float:right;
left:45%;
height:170px;
width:350px;
padding-left:140px;
padding-top:0px;
margin-top:-130px;
background:url(/img/mensajeria/confirma_bloqueo.png) no-repeat -5px 5px;
}

#confirma-bloqueo strong{
	color: #800; 
}

#confirma-bloqueo p.hecho {
font-size:24px;
line-height:24px;
}

#confirma-bloqueo p{
font-size:15px;
line-height:normal;}

#confirma-bloqueo p.hacerAhora {font-size:20px;}


#configuracion-mensajeria{
padding-left:140px;
margin-top:-150px;
height:170px;
background:url(/img/mensajeria/confirma_bloqueo.png) no-repeat -5px 5px;
font-size:15px;
line-height:normal;
}

/*buzon*/

#buzon {padding-left:40px;}
#buzon span {padding-left:5px; color:#999999;} 



/*Alta en happing*/

#botones_alta {margin:10px 0px 0px 0px; padding:20px 95px;}
a.boton_alta {display:block; width:321px; height:101px; margin:10px 0px 15px 0px; text-align:center; text-decoration:none; background:transparent url(/img/boton_alta.png) no-repeat;}
a.boton_alta strong {display:block; padding-top:30px; font-size:21px; color:#FFFFFF; line-height:1em;}

/* Subir Frases - Me la quedo */

.form-frases p, #form-container.form-frases label, .form-frases #elegir-categoria h5 {font-size:120%;}
.form-frases #subir-frase {margin-top:50px; }
.form-frases #subir-frase label {font-size:95%; line-height:1.3em;}
.form-frases #elegir-categoria {border-bottom:medium none; margin-bottom:20px;}
.form-frases #elegir-categoria h5 {width:50%; padding-bottom:5px;}

.form-frases div.asociar-frases-textos {float:left; height:175px; padding:70px 10px 0px 168px;}
.asociar-frases-textos p.hacerHapping {padding-bottom:15px; font-size:20px; line-height:1.2em;}

#enhorabuenaFrases {height:340px;}

.frases-enhorabuena {
float:right;
left:45%;
height:170px;
width:370px;
padding-left:100px;
padding-top:20px;
margin-top:-130px;
background:url(/img/amigo/enhorabuena.png) no-repeat -5px -0px;
}

.frases-enhorabuena p {padding: 10px 20px;}

.frases-enhorabuena p.hecho {
font-size:34px;}

.frases-enhorabuena p.validarFrase, #amigo-invisible-enhorabuena p.validarFrase em {
font-size:24px;
line-height:normal;}

.frases-enhorabuena p.hacerAhora {font-size:20px;}




/*Perfil*/
.form-perfil p {font-size:14px;}

.form-perfil div.txtContainer, .form-perfil div.envio-mensaje {margin-top:30px;}
#form-container div.envio-mensaje {padding:0px 0px 40px 60px}



/*Denuncia usuario*/



#denunciarUsuario, #romperAmistad {height:340px;}

.denunciar-usuario, .romper-amistad {
float:right;
left:45%;
top:40%;
height:170px;
width:370px;
padding-left:100px;
padding-top:0px;
margin-top:-130px;
}


.denunciar-usuario {background:url(/img/personajes/figura-denuncia.png) no-repeat -10px -0px;}

.romper-amistad {background:url(/img/personajes/figura-romper.png) no-repeat -10px -0px;}

.denunciar-usuario p, .denunciar-usuario div.fields, .romper-amistad p {padding: 10px 5px 10px 35px;}

.denunciar-usuario p.hecho, .romper-amistad p.hecho {
font-size:34px;}

.denunciar-usuario p.validar, .romper-amistad p.validar {
font-size:24px;
line-height:normal;}

.denunciar-usuario p.hacerAhora, .romper-amistad p.hacerAhora {font-size:20px;}




#listaAmigos {
	background:url(/img/mensajeria/fondo_lista_amigos.png) no-repeat 40px 23px; 
	height:   300px; 
	padding:2px 0px 2px 40px; 
	margin:50px 0px 0px 0px; 
}
#listaAmigos label {color:#5A5A5A;}

#tablaSeleccionarAmigos {
	width:305px; 
	height:189px; 
	overflow-y:scroll; 
	margin:10px; 
	padding-top:5px;
}
	
#tablaSeleccionarAmigos table {width:285px;}
#tablaSeleccionarAmigos td {
	font-size:11px; 
	padding:3px 0px; 
	border-bottom:1px dotted #ccc;
}
#tablaSeleccionarAmigos td.usuario {width:250px;}
#tablaSeleccionarAmigos td.input {width:35px;}
#tablaSeleccionarAmigos td a {text-decoration:none;}
#tablaSeleccionarAmigos td span, td img {
	vertical-align:middle; 
	padding-top:0px;
}
#tablaSeleccionarAmigos td span {padding-left:10px;}

/*microblog*/

#hacer-seguimiento, #romper-seguimiento {height:225px;}

#hacer-seguimiento div, #romper-seguimiento div {
	height:225px;
	margin:25px 0px 0px 20px;
	padding: 0px 0px 0px 140px;
	background: url(/img/personajes/personaje-aviso-3.png) no-repeat -5px 5px;
}
#hacer-seguimiento p, #romper-seguimiento p {padding:7px 20px; font-size:13px;}
#hacer-seguimiento p.hecho, #romper-seguimiento p.hecho {
font-size:24px;
line-height:24px;
}

	
	
