diff --git a/libs/bluepixle.js b/libs/bluepixle.js
index b7a8673..ced7fe6 100644
--- a/libs/bluepixle.js
+++ b/libs/bluepixle.js
@@ -67,7 +67,10 @@ class shape {
 			});
 		}
 		// restore context defaults
-		ctx.setTransform(1,0,0,1,0,0);
+		ctx.translate(center.d[0],center.d[1]);
+		ctx.rotate(-origRot);
+		ctx.translate(-center.d[0],-center.d[1]);
+
 		ctx.fillStyle = local.fillStyle;
 		ctx.strokeStyle = local.strokeStyle;
 		ctx.lineWidth = local.lineWidth;
@@ -114,13 +117,20 @@ class container {
 		position = position instanceof vector ? position : new vector([0,0]);
 		rotation = rotation instanceof vector ? rotation : new vector([0,1]);
 		var refPos = this.coordinates.add(position);
-		var refRot = this.rotation.add(rotation);
+		var refRot = rad2vec(this.rotation.getRadAngle() + (rotation instanceof vector ? rotation : new vector([0,1])).getRadAngle());
+		var center = this.refPos.add(this.dimentions.mag(0.5));
+		ctx.translate(center.d[0],center.d[1]);
+		ctx.rotate(refRot.getRadAngle());
+		ctx.translate(-center.d[0],-center.d[1]);
 		if (this.shapes.length) {
 			this.shapes.forEach(shape => shape.render(ctx,refPos,refRot));
 		}
 		if (this.containers.length) {
 			this.containers.forEach(cont => cont.renderContainer(ctx,refPos,refRot));
 		}
+		ctx.translate(center.d[0],center.d[1]);
+		ctx.rotate(-origRot);
+		ctx.translate(-center.d[0],-center.d[1]);
 	}
 
 	grow(amp) {