#actividad{
	width: 90%;
	margin: 0 auto;
}

#actividad > *{
	display: inline-block;
	vertical-align: middle;
}

.answer{
	visibility: hidden;
}


.deco{
	border:3px solid #542C82;
	border-radius: 7px;
}



#list{
	width: 75%;
	font-weight: bold;
}

#list li{
	padding: 0.2em 0;
	font-size: 0.8em;
}

#list span{
	font-weight: normal;
}

#list li > *{
	display: inline-block;
	vertical-align: middle;
}

.drop{
	width: 350px;
	border-bottom: 1px solid #000;
	font-size: 0.9em;
	padding: 1em;
}

.deco{
	max-width: 22%;
	float: right;
}

.sound{
	max-width: 4%;
	cursor: pointer;
}

.dragable{
	font-weight: bold;
	color: #542C82;
	font-size:14px;
	cursor: pointer;
}

@media screen and (min-width: 768px) and (max-width: 900px){
	#drags{
		width: 90%;
		margin: 0 auto;
		padding: 1em 0;
	}
	.drg td{
		padding: 0.1em 0.8em;
	}

	#subtitulo{
		width: 300px;
		left: 450px;
	}

	.dragable{
		font-size: 0.5em;
	}
	#list li{
		padding: 0.2em 0;
		font-size: 0.6em;
	}
	.deco{
		display: none !important;
	}
	#actividad{
		width: 90%;
	}
	#list{
		width: 100%;
	}
	.sound{
		max-width: 5%;
	}

	.drop{
		width: 210px;
	}
}

@media screen and (min-width: 900px){
	
}

@media screen and (min-width: 1200px) {
	#drags{
		width: 80%;
		margin: 0 auto;
		padding: 2em;
	}
	.drg td{
		padding: 0.2em 0.8em;
	}
	.dragable{
		font-size: 0.7em;
	}
	#list li{
		padding: 0.2em 0;
		font-size: 0.8em;
	}
}

#mover{
	margin-top:30px;}