body{
	overflow: hidden;
	margin: 0px;
	padding: 0px;
}

p, div {
    font-family: 'sf_cartoonist_handregular', Arial, Helvetica, sans-serif;
    letter-spacing: 0.7px;
    font-size: 24px;
    line-height: 25px;
    text-align: center;
}

#contenedor{
	position: relative;
	display: block;
	width: 644px;
	height: 548px;
	border: 0px solid #000000;
	overflow: hidden;
	background: url('../img/fondo.jpg') no-repeat;
}

.violeta{
	position: absolute;
	width: 575px;
	left: 35px;
	top: 0px;
	margin: 0px auto;
}
.violeta.conLetra{
	left: -150px;
}

.letra{
	position: absolute;
	background-color: rgba(255,255,255,.7);
	width: 450px;
	height: auto;
	top: 12px;
	right: 12px;
	padding: 15px;
}
.letra > p{
	margin: 0px;
	padding: 4px 5px;
}

.letra > p.credito{
	font-size: 18px;
	font-style: italic;
	text-align:right;
	padding-top: 10px;
}

.letra > p.e-resaltado{
	background-color: #83dcf2;
}
.letra > p.e-correcto{
	background-color: #4cd99b;
}
.letra > p.e-incorrecto{
	background-color: #f28398;
}


.letra > p.e-activo{
	cursor: pointer;
}
.letra > p.e-activo:hover, .letra > p.e-activo:active{
	background-color: #b0e9f7;
}

.e-oculto{
	display: none;
	opacity: 0;
}