<table id="maintable" style="background: #F7F6F6; text-align: center; margin-left:auto; margin-left:auto; width: 960px; border-color: #BDBDBD; border-width: 1px 1px 1px 1px; border-style: solid; -moz-box-shadow: 0 0 5px #888; -webkit-box-shadow: 0 0 5px#888; box-shadow: 0 0 15px #888;">
<tbody><tr>
	<td colspan="2">	</td>
</tr><tr><td width="460px">
	<table id="countergrid">
		<tbody><tr>
			<td colspan="6">
				<a href="getdeal.php"><img src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/bluegetitnow.png" style="border:none"></a>
			</td>
		</tr>		<tr style="font-weight:bold; color:#000000; font-size:13px;">
			<td>DEAL PRICE<br><span style="color:#7C8C91; font-weight:bold; font-size:24px;">£29.99</span></td>
			<td><img src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/divide.gif"></td>
			<td>REG. PRICE<br><span style="text-decoration:line-through; color:#97A3A6; font-weight:bold; font-size:24px;">&nbsp;£69.99&nbsp;</span></td>
			<td><img src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/divide.gif"></td>
			<td>YOU SAVE<br><span style="color:#EB4B1C; font-weight:bold; font-size:24px;">57%</span></td>
		</tr>
	
		<tr>
			<td colspan="6" style="font-weight:bold; font-size:10px; color:#383838;">
				&nbsp;</td>
		</tr>

		<tr>
			
			<td id="qtycounter" colspan="6" style="vertical-align: bottom; height:100px; width:375px; background: url(https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/qtyframe.png); background-position: center; background-repeat: no-repeat;">
			
				<img src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/4.jpg" style="border:none;"><img src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/9.jpg" style="border:none;">			
			</td>
			
		
	</tr></tbody></table>
</td>

	<td style="text-align:right; padding-right:8px;"><div style="text-align:center; width: 480px; height:270px; margin-left:auto; margin-right:auto;"><img style=" border:none; max-height:100%; max-width:100%;" src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/deal.jpg"></div></td>
	</tr>	
	<tr>
		<td colspan="2" style="vertical-align:middle; text-align:left; height:74px; width:931px; background: url(https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/socialpanel.png); background-position: center; background-repeat: no-repeat;" align="center">
	<table style="width:931px; position: relative; top: 54%; margin-top: -6%; " cellpadding="0">
				<tbody><tr>
					<td style="width:50%">		
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img style="border:0; cursor:pointer" src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/sharedeal.png">&nbsp;&nbsp;
						<a class="sharepopup" href="https://twitter.com/share?text=Just%20Picked%20Up%20A%20Great%20Deal:%20ukdesignbay%20-%20http%3A%2F%2Fmuslimahwebdesign.co.uk%2Fdeals%2Fukdesignbay"><img style="border:0; cursor:pointer" src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/twitter.png"></a>&nbsp;&nbsp;
						<a class="sharepopup" href="https://www.facebook.com/sharer.php?s=100&amp;p[title]=Amazing+Deal%21&amp;p[summary]=Check+Out+This+Deal+%3A+ukdesignbay&amp;p[url]=http%3A%2F%2Fmuslimahwebdesign.co.uk%2Fdeals%2Fukdesignbay"><img style="border:0; cursor:pointer" src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/facebook.png"></a>&nbsp;&nbsp;
						<a class="sharepopup" id="pin" href="https://pinterest.com/pin/create/button/?url=http%3A%2F%2Fmuslimahwebdesign.co.uk%2Fdeals%2Fukdesignbay&amp;media=https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/deal.jpg&amp;" target="_blank" count-layout="none"><img src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/pinterest.png" title="Pin It" border="0"></a>&nbsp;&nbsp;
						<a class="sharepopup" href="https://plus.google.com/share?url=http%3A%2F%2Fmuslimahwebdesign.co.uk%2Fdeals%2Fukdesignbay"><img style="border:0; cursor:pointer" src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/gplus.png"></a>&nbsp;&nbsp;
						<a class="sharepopup" id="su" href="https://www.stumbleupon.com/submit?url=http%3A%2F%2Fmuslimahwebdesign.co.uk%2Fdeals%2Fukdesignbay"><img style="border:0; cursor:pointer" src="https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/stumble.png"></a>&nbsp;&nbsp;
					</td><td></td>			</tr>
			</tbody></table>
		</td></tr>
<tr>
		<td colspan="2">
			<table style="width:928px; text-align:left; margin-left:auto; margin-right:auto;">
				<tbody><tr>
					<td style="max-width:926px; overflow:none;">
						<article class="newtabs">
	                                                
              <section id="newtab1">
		<h2><a href="#newtab1">1 - Choose A Template</a></h2>
    <div class="tab-content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi id massa sit amet dolor ultricies rutrum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Duis vitae faucibus felis. Aliquam eleifend arcu erat, tincidunt consequat sem suscipit ut. Etiam tincidunt dolor sed nibh posuere, eu cursus nunc facilisis. Etiam dictum massa in nibh auctor, quis adipiscing enim auctor. Nullam blandit elit enim, quis iaculis ante porttitor vel. Etiam ullamcorper, sapien at porttitor iaculis, erat lacus laoreet lorem, sit amet iaculis erat erat vel diam. Praesent ac tristique tortor. Ut non tellus aliquam, ornare erat non, mattis lectus. Vestibulum ac turpis in dolor sodales scelerisque. Sed at nulla sapien.

Nullam vitae est vel diam dictum viverra id non arcu. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Integer accumsan quam et nisi porttitor, id pulvinar est sollicitudin. Phasellus tincidunt ipsum nec nulla elementum dapibus tristique vel lacus. Aliquam malesuada aliquet facilisis. Sed pulvinar orci ut ante adipiscing, nec dignissim ligula euismod. Curabitur scelerisque mattis felis, vitae dignissim felis auctor ac. Nunc pulvinar, dolor eu auctor tristique, erat eros aliquam ligula, ac dignissim neque mauris eget eros. Quisque sed diam in mauris accumsan vehicula et at massa. Vivamus feugiat egestas massa. Aliquam a arcu elementum, porttitor tellus vel, porttitor neque. Sed arcu orci, malesuada in mi sed, condimentum lacinia risus. Aliquam erat volutpat. Fusce posuere accumsan massa, sit amet placerat odio posuere id. Nam dictum sapien odio, quis consectetur nisi fringilla quis. Nulla aliquam orci sed mauris ultricies, ac molestie ante laoreet.                                            </div>        
                                                    
</p>
	                                                </section>
	                                                <section id="newtab2">
		                                                <h2><a href="#newtab2">2 - Easily Customise It</a></h2>
	<div class="tab-content">	                                                
    <p>Sign into your very own website to manage, edit and view your template. Simply copy and paste the code generated into ebay to add your listing with your super professional template</p></div>
              </section>
	                                                <section id="newtab3">
		                                                <h2><a href="#newtab3">3 - Enjoy Your Free Hosting</a></h2>
 <div class="tab-content">	
		                                                <p>Have as many photos or videos to your listing as you want, no extra charge, all hosted by you!</p>
                                                    </div>
	                                                </section>
                                                </article>
					</td>
				</tr>
			        </tbody></table>
		</td>
	</tr>
</tbody></table>
table#maintable {
	background:#F7F6F6;
  text-align:center; 
  margin-left:auto; 
  margin-right:auto; 
  width:960px;
	border-color: #BDBDBD;
	border-width: 1px 1px 1px 1px;
	border-style: solid;
	-moz-box-shadow: 0 0 5px #888; 
  -webkit-box-shadow: 0 0 5px#888; 
  box-shadow: 0 0 15px #888;
}
tr { border-style:none }
td { border-style:none }
img { border:none }

article.newtabs {
	position: relative;
	display: block;
	width: 960px;  
	height: 15em;
	margin-top:3em;
}
article.newtabs section {  
  width:900px;
	position: absolute;
	display: block;		
	height: 14em;	
	background-color: #ddd;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(0,0,0,0.1);
	background: url(https://ukdesignbay.co.uk/template1/wp-content/themes/maestro/assets/images/tabpanel3.png); 
  background-position: center; 
  background-repeat: no-repeat; 
	z-index: 0;
	margin: 0 0 0 14px;
}
.tab-content {overflow:auto;height:13em;padding:0 1em;}
article.newtabs section:first-child{z-index: 1;}
article.newtabs section h2 {
	position: absolute;
	font-size: 18px;
	font-weight: normal;
	width: 240px;
	height: 1.8em;
	top: -1.8em;
	left: -2px;
	padding: 0;
	margin: 0;
	color: #999;
	background-color: #f1f2f3;
	border-left:2px solid #C6CBD0;
	border-top:1px solid #C6CBD0;
	border-right:2px solid #C6CBD0;
	border-radius: 5px 5px 0 0;
}
article.newtabs section:nth-child(2) h2 {left: 248px;}
article.newtabs section:nth-child(3) h2 {left: 498px;}
article.newtabs section h2 a {
	display: block;
	width: 100%;
	line-height: 1.8em;
	text-align: center;
	text-decoration: none;
	color: inherit;
	outline: 0 none;
}
article.newtabs section:target,
article.newtabs section:target h2 {
	color: #333;
	background-color: #fff;
	z-index: 2;
}

article.newtabs section,
article.newtabs section h2 {
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.