Cambiar de color un textarea con botones

Tengo dos problemas, el primero es que el textarea no cambia de color cuando pulso los botones y no se por que y el segundo es que el textarea como que se sale de el body, y no se como corregirlo sin renunciar a que este de adapte a la anchura de todas las pantallas. (El código para el cambio de color lo he cogido de otro tema del foro)

Código HTML:

Código

<!Doctype html>
<html>
<head>
<title>Nueva nota</title>
<link href="cssplantillaaplnot.css"
rel="stylesheet" type="text/css">
 
<script type="text/javascript">
 
function fondocolor(color) {document.bgColor = color;}
 
 
</script>
 
</head>
 
 
 
<body>
<div id="noseparaqueusareesto">
<textarea id="teeextareeea" class=estilotextarea></textarea>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
<FORM>
<INPUT TYPE="button" VALUE="Rojo" onClick="fondocolor('RED')">
<INPUT TYPE="button" VALUE="Azul" onClick="fondocolor('BLUE')">
<INPUT TYPE="button" VALUE="naranja" onClick="fondocolor('ORANGE')">
<INPUT TYPE="button" VALUE="Verde" onClick="fondocolor('GREEN')">
<INPUT TYPE="button" VALUE="Negro" onClick="fondocolor('BLACK')">
<INPUT TYPE="button" VALUE="Gris" onClick="fondocolor('GRAY')">
<INPUT TYPE="button" VALUE="amarillo" onClick="fondocolor('YELLOW')">
<INPUT TYPE="button" VALUE="blanco" onClick="fondocolor('WHITE')">
</br>
</br>
 
<INPUT TYPE="button" VALUE="Rojo" onClick="getElementById('teeextareeea').style.color='red'">
<INPUT TYPE="button" VALUE="Azul" onClick="getElementById('teeextareeea').style.color='blue'">
<INPUT TYPE="button" VALUE="naranja" onClick="getElementById('teeextareeea').style.color='orange'">
<INPUT TYPE="button" VALUE="Verde" onClick="getElementById('teeextareeea').style.color='green'">
<INPUT TYPE="button" VALUE="Negro" onClick="getElementById('teeextareeea').style.color='black'">
<INPUT TYPE="button" VALUE="Gris" onClick="getElementById('teeextareeea').style.color='grey'">
<INPUT TYPE="button" VALUE="amarillo" onClick="getElementById('teeextareeea').style.color='yellow'">
<INPUT TYPE="button" VALUE="blanco" onClick="getElementById('teeextareeea').style.color='white'">
 
</FORM>
 
</div>
</body>
</html>

Código CSS:

Código

.estilotextarea {
border:dashed 0px #000000;
 
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
padding:20px;
 
font-family: Garamond,verdana; font-size: 18pt;
 
 position: absolute;
    width: 100%;
    height: 150px;
}

Un saludo y gracias por leer