5 column element

Easy. Add the code to your page of choice. You need to change it to this for the page, which ADDS one more column.

Epik

<div class="plans">
<div class="plan-col">
        <div class="plan-col-wrap">
		<div class="plan-head"><h4>Simple</h4></div>
		<div class="plan-pricing">
			<span class="plan-price"><sup>$</sup>45</span><span class="monthly">/mo</span>
		</div>
		<ul class="plan-list">
			<li><strong>100</strong> Themes</li>
			<li><strong>Unlimited</strong> Bandwidth</li>
			<li><strong>300</strong> E-mail Accounts</li>
			<li><strong>Free</strong> 1-800 Number</li>
			<li><strong>5 Free</strong>Domains</li>
			<li><strong>Unlimited</strong> Downloads</li>
		</ul>
		<div class="plan-button"><a href="ADD_LINK_HERE.com">Buy Now</a></div>
	</div>
</div>	
	
<div class="plan-col-popular">
	<div class="plan-col-wrap">
		<div class="plan-head"><h4>Popular</h4></div>
		<div class="plan-pricing">
			<span class="plan-price"><sup>$</sup>59</span><span class="monthly">/mo</span>
		</div>
		<ul class="plan-list">
			<li><strong>200</strong> Themes</li>
			<li><strong>Unlimited</strong> Bandwidth</li>
			<li><strong>300</strong> E-mail Accounts</li>
			<li><strong>Free</strong> 1-800 Number</li>
			<li><strong>5 Free</strong>Domains</li>
			<li><strong>Unlimited</strong> Downloads</li>
		</ul>
		<div class="plan-button"><a href="ADD_LINK_HERE.com">Buy Now</a></div>
	</div>
</div>

<div class="plan-col">
	<div class="plan-col-wrap">
		<div class="plan-head"><h4>Great</h4></div>
		<div class="plan-pricing">
			<span class="plan-price"><sup>$</sup>99</span><span class="monthly">/mo</span>
		</div>
		<ul class="plan-list">
			<li><strong>300</strong> Themes</li>
			<li><strong>Unlimited</strong> Bandwidth</li>
			<li><strong>300</strong> E-mail Accounts</li>
			<li><strong>Free</strong> 1-800 Number</li>
			<li><strong>10 Free</strong>Domains</li>
			<li><strong>Unlimited</strong> Downloads</li>
		</ul>
		<div class="plan-button"><a href="ADD_LINK_HERE.com">Buy Now</a></div>
	</div>
</div>
	
<div class="plan-col">
	<div class="plan-col-wrap">
		<div class="plan-head"><h4>Awesome</h4></div>
		<div class="plan-pricing">
			<span class="plan-price"><sup>$</sup>199</span><span class="monthly">/mo</span>
		</div>
		<ul class="plan-list">
			<li><strong>500</strong> Themes</li>
			<li><strong>Unlimited</strong> Bandwidth</li>
			<li><strong>300</strong> E-mail Accounts</li>
			<li><strong>Free</strong> 1-800 Number</li>
			<li><strong>20 Free</strong>Domains</li>
			<li><strong>Unlimited</strong> Downloads</li>
		</ul>
		<div class="plan-button"><a href="ADD_LINK_HERE.com">Buy Now</a></div>
	</div>
</div>

<div class="plan-col">
	<div class="plan-col-wrap">
		<div class="plan-head"><h4>Awesome</h4></div>
		<div class="plan-pricing">
			<span class="plan-price"><sup>$</sup>199</span><span class="monthly">/mo</span>
		</div>
		<ul class="plan-list">
			<li><strong>500</strong> Themes</li>
			<li><strong>Unlimited</strong> Bandwidth</li>
			<li><strong>300</strong> E-mail Accounts</li>
			<li><strong>Free</strong> 1-800 Number</li>
			<li><strong>20 Free</strong>Domains</li>
			<li><strong>Unlimited</strong> Downloads</li>
		</ul>
		<div class="plan-button"><a href="ADD_LINK_HERE.com">Buy Now</a></div>
	</div>
</div><!--formatted-->

It won’t look right unless you change your .css “Pricing Plan” section. You reduce the column size to 20% (it was 25%, so shaving off 5% to use for the new column). Adjust the padding as well.

/* 
20 Pricing Plans 
---------------------------------------------------------------------------------------------------- */

.plans {
	clear: both;
	margin: 0 auto;
	padding: 10px 0 0;
	text-align: center;
}

.plan-col {
	background: #eee;
	float: left;
	font-weight: 300;
	padding: 0;
	text-align: center;
	vertical-align: top;
}

.plan-col-popular {
	background: #fff;
	float: left;
	font-weight: 300;
	padding: 0;
	position: relative;
	text-align: center;
	vertical-align: top;
}

.plan-col, 
.plan-col-popular {		
	width: 20%;
}

.plan-col-wrap, 
.plan-col-popular-wrap {
	border: 1px solid #d3d3d3;
	margin: 0 auto;
	padding: 40px 10px;
}

.plans .plan-head h4 {
	font-size: 20px;
	font-weight: 300;
	margin: 0 0 20px;
	text-transform: uppercase;
	text-align: center;
}

.plan-head em {
	font-size: 14px;
}

.plan-pricing {
	background: url(images/border-img-x.png) repeat-x scroll center bottom;
	clear: both;
	margin: 0 0 20px;
	padding: 0 0 20px;
	text-align: center;
} 

.plan-price {
	font-size: 60px;
}

.plan-price sup {
	font-size: 24px;
}

.plan-pricing .monthly {
	font-size: 14px;
}

.plan-list {
	margin: 0 0 20px;
	overflow: hidden;
}

.plan-list li,
.entry-content .plan-list li {
	list-style: none;
	margin: 0 0 20px;
}

.plan-button {
	clear: both;
}

.plan-button a,
.entry-content .plan-button a {
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	background: #303236;
	color: #fff;
	font-size: 18px;
	font-weight: 400;
	padding: 6px 20px 8px;
}

.plan-button a:hover {
	-moz-transition:all .5s ease;	
	-o-transition:all .5s ease;	
	-webkit-transition:all .5s ease;
	opacity: .7;
	transition:all .5s ease;
	text-decoration: underline;
}
	

Of couse adjust colors and shading as desired.