/* Reset
----------------------------------*/
* {
	margin: 0;
	padding: 0;	
}

img {
	border: 0;
}

a {
	outline: none;
}

/* Genericos
----------------------------------*/
body {
	font-family: 'Trebuchet MS', sans-serif, serif;
	font-size: 14px;
	background: #FFF;
	color: #5A5A5A;
}

.izq {
	float: left;
}

.der {
	float: right;
}

/* Errores
----------------------------------*/
.error {
	color:red;
}

#error_registro {
	margin: 0 0 10px 15px;
	font-size: 14px;
}

#error_contactar {
	margin: 0 0 10px 15px;
	font-size: 14px;
}

/* Estructura
----------------------------------*/
	/* Header
	----------------------------------*/
	#header {
		height: 70px;
		background: url(../img/servisms.png) no-repeat;
		width: 620px;
		margin: 50px auto 0 auto;
	}
		
	/* Menu
	----------------------------------*/
	#menu {
		margin: 10px auto 10px auto;
		background-color: #9CCC06;
		width: 620px;
	}

	#menu ul {
		text-align: right;
		padding-right: 3px;
		padding: 2px 4px 2px 2px;
		letter-spacing: 0.3px;
	}

	#menu li {
		display: inline;
		color: #FFF;		
		font-weight: bold;
	}

	#menu li a {
		color: #FFF;		
		font-weight: bold;
		text-decoration: none;
	}

	#menu li a:hover {
		color: #DAFB78;		
	}

	/* Cabecera
	----------------------------------*/
	#cabecera {
		height: 6px;
		background: url(../img/bg_top.gif) no-repeat;
		width: 620px;
		margin: 0 auto 0 auto;
	}

	/* Faldon
	----------------------------------*/
	#faldon {
		clear:both;
		height: 14px;
		background: url(../img/bg_bottom.gif) no-repeat;
		width: 620px;
		margin: 0 auto 0 auto;
	}

	/* Contenido
	----------------------------------*/
	#contenido {
		width: 620px;
		margin: 0 auto 0 auto;
	}
	
	/* Contenido
	----------------------------------*/
	#fondo {
		background: url(../img/bg_middle.gif) repeat-y;
		float: left;
		width: 620px;
	}

	/* Marca de agua
	----------------------------------*/
	#watermark {
		margin: 10px 10px 10px 10px;
		width: 600px;
		background: url(../img/movil.gif) no-repeat bottom right;
		float: left;
	}

	/* Pie
	----------------------------------*/
	#footer {		
		width: 620px;
		margin: 0 auto 20px auto;
		text-align: right;
		letter-spacing: 0.3px;
	}

	#footer p {
		color: #9CCC06;
		font-weight: bold;	
	}

	/* Alturas
	----------------------------------*/
	.estandar {
		height: 308px;
	}

/* Secciones
----------------------------------*/
	/* Index
	----------------------------------*/
		/* Identificate
		----------------------------------*/
		.identificate {
			margin: 50px 0 0 25px;
			width: 221px;
			height: 186px;
			background: url(../img/identificate.png) no-repeat;
			float: left;
		}

		#identificate {
			margin-left: 85px;
		}

		#error_login {
			margin: 37px 0 0 15px;
			font-size: 12px;
			height: 14px;
			line-height:12px;
			width:176px;
			float: left;
		}
		
		.identificate #usuario{
			margin: 26px 0 0 20px;
			height: 17px;
			width: 176px;
			border: 0;
		}

		.identificate #contrasenya{
			margin: 33px 0 0 20px;
			height: 17px;
			width: 176px;
			border: 0;
		}

		p.entrar {
			margin: 13px 0 0 130px;
			position: relative;
		}

		p.entrar a {
			background: url(../img/entrar.png) no-repeat 0 0;
			display: block;
			height: 15px;
			width: 69px;
			text-decoration: none;
		}

		p.entrar a:hover {
			background-position:bottom;
		}

		p.entrar a span {
			position: absolute;
			z-index: -1;
		}
		
		/* Inicio
		----------------------------------*/
		#inicio {
			float: left;
		}

		.caracteristicas {
			list-style: none;
			margin: 30px 0 0 65px;
		}

		p.paso1 {
			margin: 10px 0 0 0;
			position: relative;
		}

		p.paso1 a {
			background: url(../img/paso1.png) no-repeat 0 0;
			display: block;
			height: 27px;
			width: 108px;
			text-decoration: none;
		}

		p.paso1 a:hover {
			background-position:bottom;
		}

		p.paso1 a span {
			position: absolute;
			z-index: -1;
		}

		div.paso2 {
			margin: 10px 0 0 0;
			position: relative;
		}

		div.paso2 p {
			background: url(../img/paso2.png) no-repeat 0 0;
			display: block;
			height: 27px;
			width: 165px;
		}

		div.paso2 p span {
			position: absolute;
			z-index: -1;
		}

		div.paso3 {
			margin: 10px 0 0 0;
			position: relative;
		}

		div.paso3 p {
			background: url(../img/paso3.png) no-repeat 0 0;
			display: block;
			height: 27px;
			width: 215px;
		}

		div.paso3 p span {
			position: absolute;
			z-index: -1;
		}

		p.bocadillo1 {
			margin: 20px 0 0 40px;
			position: relative;
		}

		p.bocadillo1 a {
			background: url(../img/bocadillo1.png) no-repeat 0 0;
			display: block;
			height: 56px;
			width: 282px;
			text-decoration: none;
		}

		p.bocadillo1 a span {
			position: absolute;
			z-index: -1;
		}

		div.bocadillo2 {
			margin: 0 0 0 40px;
			position: relative;
		}

		div.bocadillo2 p {
			background: url(../img/bocadillo2.png) no-repeat 0 0;
			display: block;
			height: 82px;
			width: 283px;
			text-decoration: none;
		}

		div.bocadillo2 p span {
			position: absolute;
			z-index: -1;
		}

		/* Registrate
		----------------------------------*/
		#micuenta table, #registro table, #senderid table {
			border: 0;
			border-collapse: collapse;
		}

		#micuenta table tr, #registro table tr, #senderid table tr {
			margin-bottom: 40px;
		}

		#micuenta table img, #registro table img, #senderid table img {
			float:left;

		}

		#micuenta .label, #registro .label {
			width: 113px;
			height: 34px;
			vertical-align: top;
		}

		#micuenta .globo, #registro .globo, #senderid .globo{
			width: 270px;
			height: 34px;
			background: url(../img/globoform.gif) no-repeat;
		}

		#micuenta input, #registro input, #senderid input{
			margin: 0 0 3px 12px;
			width: 248px;
			height: 19px;
			border: 0;
			background-color: #9CCC06;
			color: #000;
		}

		p.enviar {
			margin: 10px 0 0 320px;
			position: relative;
		}

		p.enviar a {
			background: url(../img/enviar.png) no-repeat 0 0;
			display: block;
			height: 13px;
			width: 61px;
			font-size: 12px;
			text-decoration: none;
		}

		p.enviar a:hover {
			background-position:bottom;
		}

		p.enviar a span {
			position: absolute;
			z-index: -1;
		}


		p.actualizar {
			margin: 10px 0 0 280px;
			position: relative;
		}

		p.actualizar a {
			background: url(../img/actualizar.gif) no-repeat 0 0;
			display: block;
			height: 15px;
			width: 104px;
			font-size: 12px;
			text-decoration: none;
		}

		p.actualizar a:hover {
			background-position:bottom;
		}

		p.actualizar a span {
			position: absolute;
			z-index: -1;
		}

		div.globoreg {
			margin: 125px 0 0 40px;
			position: relative;
		}

		div.globoreg p {
			background: url(../img/globoreg.gif) no-repeat 0 0;
			display: block;
			height: 55px;
			width: 281px;
			text-decoration: none;
		}

		div.globoreg p span {
			position: absolute;
			z-index: -1;
		}

		/* Servicio 
		----------------------------------*/
		div.servicio {
			margin: 7px 0 0 5px;
			position: relative;
		}

		div.servicio p {
			/* background: url(../img/servicio.png) no-repeat 0 0; */
			display: block;
			height: 290px;
			width: 587px;
		}

		div.servicio p span {
			position: absolute;
			z-index: 1;
		}

		/* Tarifas 
		----------------------------------*/
		#tarifas {
			text-align: center;
			color: #5A5A5A;
			border: 0;
			border-collapse: collapse;
			margin: 60px 0 0 45px;
		}

		#tarifas th {
			width: 100px;
			text-align: left;
			
		}

		#tarifas .vacia{
			height: 6px;
			background-color: #FFF;
			border: 0;
		}

		#tarifas td {
			border: 1px solid #999;
			border-left: 0;
			border-right: 0;
			height: 22px;
		}

		.fondo1 {
				background-color: #9CCC06;
		}

		.fondo2 {
				background-color: #E4E4E4;
		}

		div.cabecera1 {
			position: relative;
		}

		div.cabecera1 p {
			background: url(../img/cabecera1.png) #FFF no-repeat center 0;
			display: block;
			height: 17px;
			width: 100px;
		}

		div.cabecera1 p span {
			position: absolute;
			z-index: -1;
		}

		div.cabecera2 {
			position: relative;

		}

		div.cabecera2 p {
			background: url(../img/cabecera2.png) #FFF no-repeat center 0;
			display: block;
			height: 17px;
			width: 100px;
		}

		div.cabecera2 p span {
			position: absolute;
			z-index: -1;
		}

		div.cabecera3 {
			position: relative;
		}

		div.cabecera3 p {
			background: url(../img/cabecera3.png) #FFF no-repeat center 0;
			display: block;
			height: 17px;
			width: 100px;
		}

		div.cabecera3 p span {
			position: absolute;
			z-index: -1;
		}

		/* Contacto
		----------------------------------*/
		#contactar table {
			border: 0;
			border-collapse: collapse;
		}

		#contactar table img {
			float:left;

		}
		
		#contactar .label{
			width: 113px;
			height: 34px;
			vertical-align: top;
		}
		
		#contactar .labelder {
			float: right;
		}

		#contactar .area {
			width: 339px;
			height: 113px;
			background: url(../img/area.png) no-repeat right;
			vertical-align: top;
		}

		#contactar .area textarea {
			float: right;
			margin: 9px 11px 0 0;
			width: 316px;
			height: 95px;
			background-color: #9ACC06;
			border: 0;
			font-family: 'Trebuchet MS', sans-serif, serif;
			font-size: 14px;
			color: #5A5A5A;
		}

		#contactar .globo{
			width: 270px;
			height: 34px;
			background: url(../img/globoform.gif) no-repeat;
		}

		#contactar input{
			margin: 0 0 3px 12px;
			width: 248px;
			height: 19px;
			border: 0;
			background-color: #9CCC06;
			color: #5A5A5A;
		}

		p.enviar {
			margin: 10px 0 0 320px;
			position: relative;
		}

		p.enviar a {
			background: url(../img/enviar.png) no-repeat 0 0;
			display: block;
			height: 13px;
			width: 61px;
			font-size: 12px;
			text-decoration: none;
		}

		p.enviar a:hover {
			background-position:bottom;
		}

		p.enviar a span {
			position: absolute;
			z-index: -1;
		}

		div.globocon {
			margin: 125px 0 0 40px;
			position: relative;
		}

		div.globocon p {
			background: url(../img/globocon.gif) no-repeat 0 0;
			display: block;
			height: 96px;
			width: 281px;
			text-decoration: none;
		}

		div.globocon p span {
			position: absolute;
			z-index: -1;
		}

		/* Enviar SMS
		----------------------------------*/
		
		p.ancontacto {
			position: relative;
			margin: -20px 0 10px 155px;
		}

		p.ancontacto a {
			background: url(../img/ancontacto.png) no-repeat 0 0;
			display: block;
			height: 15px;
			width: 108px;
			font-size: 12px;
			text-decoration: none;
		}

		p.ancontacto a:hover {
			background-position:bottom;
		}

		p.ancontacto a span {
			position: absolute;
			z-index: -1;
		}

		p.angrupo {
			position: relative;
			margin: -20px 0 5px 155px;
		}

		p.angrupo a {
			background: url(../img/angrupo.png) no-repeat 0 0;
			display: block;
			height: 20px;
			width:90px;
			font-size: 12px;
			text-decoration: none;
		}

		p.angrupo a:hover {
			background-position:bottom;
		}

		p.angrupo a span {
			position: absolute;
			z-index: -1;
		}

		p.annumero {
			position: relative;
			margin: -18px 0 10px 155px;
		}

		p.annumero a {
			background: url(../img/annumero.png) no-repeat 0 0;
			display: block;
			height: 15px;
			width:104px;
			font-size: 12px;
			text-decoration: none;
		}

		p.annumero a:hover {
			background-position:bottom;
		}

		p.annumero a span {
			position: absolute;
			z-index: -1;
		}

		p.saldo {
			font-size: 18px;
			font-weight: bold;
			margin-bottom: 10px;
		}

		p.saldo #saldo, p.saldo #creditos {
			color: #9CCC06;
		}

		#grupos, #contactos {
			width: 140px;
		}

		#numero {
			width: 136px;
		}

		#error_numero{
			margin: 0 0 0 0;
		}

		div.destinatarios {
			margin: 15px 0 5px 0;
			position: relative;
		}

		div.destinatarios p {
			background: url(../img/destinatarios.png) no-repeat 0 0;
			display: block;
			height: 14px;
			width: 119px;
		}

		div.destinatarios p span {
			position: absolute;
			z-index: -1;
		}

		#destinatarios {
			width: 140px;
			height: 85px;
		}

		p.quitar {
			position: relative;
			margin: 4px 0 0 95px;
		}

		p.quitar a {
			background: url(../img/quitar.png) no-repeat 0 0;
			display: block;
			height: 19px;
			width: 43px;
			font-size: 12px;
			text-decoration: none;
		}

		p.quitar a:hover {
			background-position:bottom;
		}

		p.quitar a span {
			position: absolute;
			z-index: -1;
		}
		
		p.caracteres{
			font-size: 14px;
			font-weight: bold;
			margin-bottom: 10px;
			color: #9CCC06;
			margin: -290px 0 0 390px;
		}

		#error_mensaje {
			float:right;
			margin: 13px 25px 0 0;
		}

		p.enviarmsg {
			margin: 220px 0 0 520px;
			position: relative;
		}

		p.enviarmsg a {
			background: url(../img/enviar.png) no-repeat 0 0;
			display: block;
			height: 13px;
			width: 61px;
			font-size: 12px;
			text-decoration: none;
		}

		p.enviarmsg a:hover {
			background-position:bottom;
		}

		p.enviarmsg a span {
			position: absolute;
			z-index: -1;
		}

		div#cuadro {
			margin: 3px 20px 0 0;
			width: 283px;
			height: 207px;
			background: url(../img/cuadro.gif) no-repeat;
			float:right;
		}

		#mensaje {
			margin: 8px 0 0 22px;
			width: 240px;
			height: 190px;
			border:0;
			overflow-y: auto;
			overflow-x: auto;
			background:#9CCC06;
			font-size:16px;
			font-family: 'Trebuchet MS', sans-serif, serif;
		}

		.nohay {
			margin:0 0 6px 0;
		}

		p.enviarmas {
			margin: 5px 0 0 40px;
			position: relative;
		}

		p.enviarmas a {
			background: url(../img/enviarmas.gif) no-repeat 0 0;
			display: block;
			height: 20px;
			width: 149px;
			font-size: 12px;
			text-decoration: none;
		}

		p.enviarmas a:hover {
			background-position:bottom;
		}

		p.enviarmas a span {
			position: absolute;
			z-index: -1;
		}

		div.globomen {
			margin: 125px 0 0 40px;
			position: relative;
		}

		div.globomen p {
			background: url(../img/globomen.gif) no-repeat 0 0;
			display: block;
			height: 49px;
			width: 281px;
			text-decoration: none;
		}

		div.globomen p span {
			position: absolute;
			z-index: -1;
		}

		/* Agenda
		----------------------------------*/

		#agregar-contacto{
			margin:5px 0 15px 0;
		}

		p.agregarcon {
			margin: 0 0 0 0;
			position: relative;
		}

		p.agregarcon a {
			background: url(../img/agregarcon.gif) no-repeat 0 0;
			display: block;
			height: 16px;
			width: 123px;
			font-size: 12px;
			text-decoration: none;
		}

		p.agregarcon a:hover {
			background-position:bottom;
		}

		p.agregarcon a span {
			position: absolute;
			z-index: -1;
		}

		#crear-grupo{
			margin:20px 0 15px 0;
		}

		p.creargru {
			margin: 0 0 0 0;
			position: relative;
		}

		p.creargru a {
			background: url(../img/creargru.gif) no-repeat 0 0;
			display: block;
			height: 16px;
			width: 85px;
			font-size: 12px;
			text-decoration: none;
		}

		p.creargru a:hover {
			background-position:bottom;
		}

		p.creargru a span {
			position: absolute;
			z-index: -1;
		}

		.filaverde{
			background-color: #E4E4E4;
		}

		.filagris{
			background-color: #E4E4E4;
		}		

		.contactos {
			border: 0;
			border-collapse: collapse;
			width: 590px;
		}

		.contactos .vacia{
			height: 2px;
			background-color: #FFF;
			border: 0;
		}
		
		.contactos td {
			border: 0px solid #999;
			border-left: 0;
			border-right: 0;
			height: 22px;
		}

		.contactos th {
			background-color:#9CCC06;
			text-align: left;
		}

		.contactos .nombre, #formcontacto .nombre  {
			width: 180px;
			padding-left:4px;
		}

		.contactos .telefono, #formcontacto .telefono  {
			padding-left:4px;
			width: 86px;
		}

		#formcontacto .telefono input {
			width: 70px;
		}

		.contactos .grupo, #formcontacto .grupo  {
			padding-left:4px;
			width: 180px;
		}

		.contactos .modificar, #formcontacto .modificar  {
			width: 80px;
		}

		.contactos. borrar, #formcontacto .cancelar {
			width: 52px;
		}

		p.btnmod {
			margin: 0 0 0 0;
			position: relative;
		}

		p.btnmod a {
			background: url(../img/modificar.gif) no-repeat 0 0;
			display: block;
			height: 16px;
			width: 71px;
			font-size: 12px;
			text-decoration: none;
		}

		p.btnmod a:hover {
			background-position:bottom;
		}

		p.btnmod a span {
			position: absolute;
			z-index: -1;
		}

		p.btnbor {
			margin: 0 0 0 0;
			position: relative;
		}

		p.btnbor a {
			background: url(../img/borrar.gif) no-repeat 0 0;
			display: block;
			height: 16px;
			width: 49px;
			font-size: 12px;
			text-decoration: none;
		}

		p.btnbor a:hover {
			background-position:bottom;
		}

		p.btnbor a span {
			position: absolute;
			z-index: -1;
		}

		.grupos {
			border: 0;
			border-collapse: collapse;
			width: 590px;
		}

		.grupos .vacia{
			height: 2px;
			background-color: #FFF;
			border: 0;
		}
		
		.grupos td {
			border: 0px solid #999;
			border-left: 0;
			border-right: 0;
			height: 22px;
		}

		.grupos th {
			background-color:#9CCC06;
			text-align: left;
		}

		.grupos .grupo, #formgrupo .grupo{
			padding-left:4px;
			width: 454px;
		}

		.grupos .modificar, #formgrupo .modificar{
			width: 80px;
		}

		.grupos. borrar, #formgrupo .cancelar{
			width: 52px;
		}		

		p.btnagr {
			margin: 8px 0 0 4px;
			position: relative;
		}

		p.btnagr a {
			background: url(../img/agregar.gif) no-repeat 0 0;
			display: block;
			height: 15px;
			width: 59px;
			font-size: 12px;
			text-decoration: none;
		}

		p.btnagr a:hover {
			background-position:bottom;
		}

		p.btnagr a span {
			position: absolute;
			z-index: -1;
		}

		p.btncan {
			margin: 0 0 0 0;
			position: relative;
		}

		p.btncan a {
			background: url(../img/cancelar.gif) no-repeat 0 0;
			display: block;
			height: 16px;
			width: 61px;
			font-size: 12px;
			text-decoration: none;
		}

		p.btncan a:hover {
			background-position:bottom;
		}

		p.btncan a span {
			position: absolute;
			z-index: -1;
		}

		p.btncre {
			margin: 4px 0 0 4px;
			position: relative;
		}

		p.btncre a {
			background: url(../img/crear.gif) no-repeat 0 0;
			display: block;
			height: 10px;
			width: 39px;
			font-size: 12px;
			text-decoration: none;
		}

		p.btncre a:hover {
			background-position:bottom;
		}

		p.btncre a span {
			position: absolute;
			z-index: -1;
		}

		#agrcontacto input{
			width: 102px;
		}

		p.btncan2 {
			margin: 0 0 0 0;
			position: relative;
		}

		p.btncan2 a {
			background: url(../img/cancelar2.gif) no-repeat 0 0;
			display: block;
			height: 16px;
			width: 49px;
			font-size: 12px;
			text-decoration: none;
		}

		p.btncan2 a:hover {
			background-position:bottom;
		}

		p.btncan2 a span {
			position: absolute;
			z-index: -1;
		}

		#error_grupo, #error_contacto {
			margin-bottom:5px;
		}

		/* Mi cuenta
		----------------------------------*/

		div.globodatos {
			margin: 125px 0 0 40px;
			position: relative;
		}

		div.globodatos p {
			background: url(../img/globodatos.gif) no-repeat 0 0;
			display: block;
			height: 49px;
			width: 281px;
			text-decoration: none;
		}

		div.globodatos p span {
			position: absolute;
			z-index: -1;
		}

		/* Sender ID
		----------------------------------*/
		
		p.enviarsender {
			margin: 10px 0 0 225px;
			position: relative;
		}

		p.enviarsender a {
			background: url(../img/actualizar.gif) no-repeat 0 0;
			display: block;
			height: 15px;
			width: 104px;
			font-size: 12px;
			text-decoration: none;
		}

		p.enviarsender a:hover {
			background-position:bottom;
		}

		p.enviarsender a span {
			position: absolute;
			z-index: -1;
		}

		div.personaliza {
			margin: 125px 0 0 40px;
			position: relative;
		}

		div.personaliza p {
			background: url(../img/globodatos.gif) no-repeat 0 0;
			display: block;
			height: 49px;
			width: 281px;
			text-decoration: none;
		}

		div.personaliza p span {
			position: absolute;
			z-index: -1;
		}

		div.globorem {
			margin: 75px 0 0 40px;
			position: relative;
		}

		div.globorem p {
			background: url(../img/globorem.gif) no-repeat 0 0;
			display: block;
			height: 148px;
			width: 281px;
			text-decoration: none;
		}

		div.globorem p span {
			position: absolute;
			z-index: -1;
		}

		
		div.globoerr {
			margin: 100px 0 0 40px;
			position: relative;
		}

		div.globoerr p {
			background: url(../img/globoerr.gif) no-repeat 0 0;
			display: block;
			height: 118px;
			width: 281px;
			text-decoration: none;
		}

		div.globoerr p span {
			position: absolute;
			z-index: -1;
		}

		/* Sender ID
		----------------------------------*/
		#recargar{
			text-align: center;
		}
		
		#recargar p{
			font-size: 16px;
		}

		#recargar .pack{
			font-size: 18px;
			font-weight: bold;
		}