(function($) {
	$.fn.svnote = function()
	{
		this.addClass("svapi");
		
		$("<div>").addClass("svwrapper")
		.append("<div class=\"svleft\"/>")
		.append("<div class=\"svcontainer\"/>")
		.append("<div class=\"svright\"/>")
		.appendTo(this);
		
		$("<div>").addClass("svnote vlogo")
		.append("<a href=\"http://www.sobanvuex.com\" title=\"Developed by SobanVuex\">Developed by SobanVuex</a>")
		.appendTo(".svcontainer");
		
		$("<div>").addClass("svnote vhtml")
		.append("<a href=\"http://validator.w3.org/check/referrer\" title=\"Validate HTML Markup\" target=\"_blank\">Valid Markup</a>")
		.appendTo(".svcontainer");
		
		$("<div>").addClass("svnote vcss")
		.append("<a href=\"http://jigsaw.w3.org/css-validator/check/referer\" title=\"Validate CSS Markup\" target=\"_blank\">Valid CSS</a>")
		.appendTo(".svcontainer");

		
		var svc = $(".svcontainer");
		this.mouseenter(function()
		{
			svc.animate({ width: "60px"}, 200);
		}).mouseleave(function() {
			svc.animate({ width: "20px"}, 100);
		});
		
		return this;
	};
})(jQuery);

$(document).ready(function()
{
	$("body").append("<link rel=\"stylesheet\" type=\"text/css\" href=\"http://sobanvuex.com/api/data/svnote.css\" />");
	$("<div>").appendTo("body").svnote();
});