That is happening because of this CSS rule:

.widecolumn {
	padding:10px 0 80px;
	margin:5px 0 0 5px;
	width:50px;
}

That looks like a typo in the width value. If you remove the "width:50px;" part, it should go back to normal.

Next, this rule in your custom CSS is setting the width, margins, and padding for the main content area on your home page:

.narrowcolumn {
	float:right;
	padding:0 0 20px 90px;
	margin:0 30px;
	width:450px;
}

Try removing that and adding this instead:

#sidebar {
	float: left;
	overflow: hidden;
}

.narrowcolumn {
	width: 520px;
	margin: 0;
	padding: 0 20px 0 0;
}

#footer {
	clear: both;
}

What this does is make the sidebar float left so the content area and sidebar won't bump into each other as much, then it sets the content area width to 520px and takes away most of the margin and padding so you can just set a proper width for it and move it around easily.

Once you save changes, make sure to check all your other pages to make sure they're being displayed properly.