/* --- 1. resets --- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

:focus {
	outline: 0;
}

body {
	line-height: 1;
	font-size:62.5%;
}

ol, ul { list-style: none; }

table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

/*Will Colley's CSS rules start here */
/* Site typography setting are here */
body{ font-family: Helvetica, Arial, sans-serif; background:#e0cfe1; font-size: 0.9em; line-height:1.6em; color: #63106B;}
h1{ font-size: 1.5em; line-height:1.25em; padding-bottom: 15px; border-bottom: 1px solid #63106B; margin-bottom:20px; padding-bottom:10px;}
h2{ font-size: 1.25em; margin: 12px 0 4px 0;}
h3{ font-size: 1.15em; padding:12px 0 0;}
h1, h2, h3{ font-weight: bold;}
h1 span{ font-weight:normal;}
a{ font-weight: normal; color:#FF3300;}
a:hover{ font-weight: normal; color:#F67B31; text-decoration:none;}
#names{ font-variant: small-caps; margin:10px 0;}
.header { background-color: #62106A; display: inline; float: left; width:100%;}
#wrapper { position: relative; width:960px; margin:0 auto; padding-bottom:20px;}
#logo{ background-color:#63106B;}
#logo p a{ background: transparent url('../images/logo.gif') no-repeat scroll 0 0;display:block; width:391px; height:81px; margin:0 auto}
#a4f{ background: transparent url('../images/drop-shadow.png') repeat-x scroll 0 0; padding:0; margin:0; background-color: #E0CFE1;}

/* Navigation styles here   */
ul#nav li#home a{ background: transparent url('../images/home-button.gif') no-repeat scroll 0 0; width:199px;height:23px; text-indent:-9999px; display:block; overflow:hidden;}
ul#nav li#home a:hover{ background: transparent url('../images/home-button.gif') no-repeat scroll 0 -199px;background-position:-199px 0;}
ul#nav li#parties a{ background: transparent url('../images/parties-button.gif') no-repeat scroll 0 0; width:199px;height:23px; text-indent:-9999px; display:block; overflow:hidden;}
ul#nav li#parties a:hover{ background: transparent url('../images/parties-button.gif') no-repeat scroll 0 -199px; background-position:-199px 0;}
ul#nav li#franchise a{ background: transparent url('../images/franchise-button.gif') no-repeat scroll 0 0; width:199px;height:23px; text-indent:-9999px; display:block; overflow:hidden;}
ul#nav li#franchise a:hover{ background: transparent url('../images/franchise-button.gif') no-repeat scroll 0 -199px;background-position:-199px 0;}
ul#nav li#contact a{ background: transparent url('../images/contact-us-button.gif') no-repeat scroll 0 0; width:199px;height:23px; text-indent:-9999px; display:block; overflow:hidden;}
ul#nav li#contact a:hover{ background: transparent url('../images/contact-us-button.gif') no-repeat scroll 0 -199px; background-position:-199px 0;}
ul#nav li#where a{ background: transparent url('../images/where-we-are-button.png') no-repeat scroll 0 0; width:199px;height:23px; text-indent:-9999px; display:block; overflow:hidden;}
ul#nav li#where a:hover{ background: transparent url('../images/where-we-are-button.png') no-repeat scroll 0 -199px; background-position:-199px 0;}
ul#nav li#pdf a{ background: transparent url('../images/where-we-are-button.png') no-repeat scroll 0 0; width:199px;height:23px; text-indent:-9999px; display:block; overflow:hidden; margin-top:11px;}
ul#nav li#pdf a:hover{ background: transparent url('../images/where-we-are-button.png') no-repeat scroll 0 -199px; background-position:-199px 0;}

ul#nav li#pdf a{ background: transparent url('../images/brochure-button.png') no-repeat scroll 0 0; width:199px;height:23px; text-indent:-9999px; display:block; overflow:hidden;}
ul#nav li#pdf a:hover{ background: transparent url('../images/brochure-button.png') no-repeat scroll 0 -199px; background-position:-199px 0;}

ul#nav li#workshop a{ background: transparent url('../images/workshop-button.png') no-repeat scroll 0 0; width:199px;height:23px; text-indent:-9999px; display:block; overflow:hidden; margin-top:11px;}
ul#nav li#workshop a:hover{ background: transparent url('../images/workshop-button.png') no-repeat scroll 0 -199px; background-position:-199px 0;}

ul#nav li#links a{ background: transparent url('../images/links.gif') no-repeat scroll 0 0; width:199px;height:23px; text-indent:-9999px; display:block; overflow:hidden; margin-top:11px;}
ul#nav li#links a:hover{ background: transparent url('../images/links.gif') no-repeat scroll 0 -199px; background-position:-199px 0;}

ul#nav li#flickr a{ background: transparent url('../images/flickrButton.png') no-repeat scroll 0 0; width:80px;height:30px; text-indent:-9999px; display:block; overflow:hidden; margin-bottom: 14px;}
ul#nav li#twitter a{ background: transparent url('../images/TwitterButton.png') no-repeat scroll 0 0; width:180px;height:30px; text-indent:-9999px; display:block; overflow:hidden;}

div ul#nav{ position:relative; padding:25px 24px 0 0;}
div li#home, div li#parties, div li#franchise, div li#contact{ padding:0 0 10px 0;}
.bookmarks{padding:7px 0 17px 10px;}
.fb{ padding: 15px 0 1px 1px;}
/*  .fb{ padding-left:1px;} */

.headline .image { background: transparent url('../images/Bonnie.jpg') no-repeat scroll 0 0;
display:block;
height:139px;
margin:20px 0 0 -18px;
width:200px; }

/* Here are the extra images. Just move the the CSS comments to show or hide the images */

.headline .image2 { background: transparent url('../images/Ceramics_6.jpg') no-repeat scroll 0 0;
display:block;
height:133px;
margin:20px 0 0 -6px;
width:200px; }

.headline .image3 { background: transparent url('../images/Zoe-handprint.jpg') no-repeat scroll 0 0;
display:block;
height:201px;
margin:20px 0 0 -14px;
width:200px; }

.headline .image4 { background: transparent url('../images/Face2.jpg') no-repeat scroll 0 0;
display:block;
height:201px;
margin:20px 0 0 -14px;
width:200px; }

.headline .image5 { background: transparent url('../images/Mother-&-child.jpg') no-repeat scroll 0 0;
display:block;
height:201px;
margin:20px 0 0 -14px;
width:200px; }

.headline .image6 { background: transparent url('../images/Woman.jpg') no-repeat scroll 0 0;
display:block;
height:201px;
margin:0;
width:200px; }


/* Content styling here  */
div #content {width:500px; float:left; padding:25px 20px 0 0; line-height: 1.3em; display:inline;}
#franchise-form div #content{ width:550px;_width:500px;}
#tick li{ background: transparent url('../images/tick.gif') no-repeat scroll 1px 8px; padding: 5px 0 0 20px;}
#news{ background: transparent url('../images/2px-line.gif') repeat-x scroll 0 0; margin:26px 0 0; padding:10px 0; width:165px; font-size:16px; border-bottom:1px solid #63106b;}
#last-paragraphy{ margin-bottom:15px;}

#franchise-form p#last { border:0;}
#franchise-form h2#TableTitle { background: transparent url('../images/2px-line.gif') repeat-x scroll 0 0; border:0}

/* Steps styling here  */
#steps{float:left;width:720px; clear:both}
#steps li{ margin:0 70px 40px 0; width:125px; height:125px; border: 1px solid white; text-indent:-99em; overflow:hidden; text-align:left; border: 1px solid #e0cfe1; float: left;}
	#steps li#fire{ background:transparent url('../images/fire.jpg');}
	#steps li#choose{ background:transparent url('../images/choose.jpg'); }
	#steps li#decorate{ background:transparent url('../images/decorate.jpg');}
	#steps li#collect{ background:transparent url('../images/take.jpg'); margin-right:0;}
	#steps li#choose a:hover{ background: transparent url('../images/steps-hover.gif');}

#easy{ width:710px; float:left; /*background: transparent url('../images/2px-line.gif') repeat-x scroll 0 0; */padding:0 10px 20px 0; text-align:left;}
#easy-steps { clear:both; float:left; width:720px; overflow: hidden; *float:none; *position:relative;*top:640px; left:220px;}


#papers,#easy-steps  {position: relative;top:32px;} 

/* What the papers say styling  */
#papers{ font-size: 0.9em; float:right; width:165px;position:relative;}
/*#papers ul { background:#E0CFE1}*/
#papers li{ border-bottom:1px solid #62106A; border-top:1px solid #FFFFFF; line-height:1.8em; padding:10px 0 20px}
ul li#last { border-bottom:none;}
ul li#last a, ul li#last a:hover{ color:#63106B; }

#wrapper,#footer {z-index:9999}

/* Footer styling here  */
#footer{ overflow:visible; background-color:#63106B; clear:both; float:none; height:65px; padding:26px 0; position:relative; top:94px; z-index:9999}
#tear{ background:transparent url('../images/torn-paper.gif') repeat-x 0 0; *background-image:none; margin:-73px 0 -26px; z-index:99999; position:relative;_width:100%; _height:300px; _text-align:center }
#footer ul { padding:97px 0 30px 0; position: inherit; width:38em;*width:58em; margin:0 auto;}
#footer ul li a{ color:#F29325;padding: 4px;}
#footer li a:hover{ text-decoration:none; color: #f67b31;}
#footer li a:focus{color: #F67B31; background:#4f0d55; }
#footer ul#toe li{ display: inline; margin: 0 15px; position:relative; /*width:600px;*/ color:#f29325;}
/*#footer ul#toe .fb { position:relative; top:10px}
#footer ul#toe .bookmarks {position:relative; top:4px}*/

/* Form styling here  */
#frmLegend{ display:none;}
#frm-title { padding: 25px 0 0 0; margin: 0 0 28px 0px; line-height:1.4em;}
#FranchiseTitle{ padding: 25px 0 0 0; margin: 0 0 15px 0px; line-height:1.4em; border-bottom: 1px solid #63106B}
#frm-booking {float: left; min-height:550px; width:600px}
.radioBooking,.radioBookingLabel { float:left}
#frm-booking #frmPartyBooking .radioBooking p{ margin:4px 0 0; padding-bottom:0px;}
#frm-booking #frmPartyBooking .radioBooking { background:transparent}
#frm-booking #frmPartyBooking .radioBooking input{ width:auto; float:left; margin:13px 8px 0 0; border:0;background:transparent }
.radioBooking { margin-bottom:20px;margin-left:24px;}
#frm-booking #frmPartyBooking input,#frm-booking #frmPartyBooking textarea, #comments, #geo-area { padding:0.6em; background-color:#f8f5fa ; width:23em;border: 1px solid #63116b; margin-left:24px; margin-top:5px}

#party-type-Bday { background:#333333}
#frm-booking #frmPartyBooking .radio span { margin-bottom:10px; width:12em; float:left}
#frm-booking #frmPartyBooking .radio input { background:transparent; border:0; padding:0;width: auto;border:0;background:transparent;}
#frm-booking #frmPartyBooking .radio label { float:none;width: inherit;}

#frm-booking #frmPartyBooking .radio ul { float:left}
#frm-booking #frmPartyBooking .radio li { width:200px}
#frm-booking #frmPartyBooking div.radio  {overflow:auto; margin-top:20px; margin-bottom:20px}
#wrapper #frm-booking #frmPartyBooking p#firstname input.text:focus { background-color: red; }
label { float:left; width:12em; padding:10px 0; font-weight: normal;}
#frmPartyBooking .radio,#frmPartyBooking p { clear:both; padding-bottom:15px; }
#size, #marketing { margin: 8px 0px 0 25px;}
#comments{ width: 251px;} 
.party-type{ margin: 0 0 0 11.9em;}
#partytype{ float: left;}
.type-first{ margin:0; }
#frm-booking textarea:focus, #frm-booking #frmPartyBooking input:focus{ background-color:#fff; border: 1px solid #fff;}
#radio-party,#networth{ clear:both; float:right; left:-232px; position:relative; top:-4px; padding-top:0px;}
#ownedownbusiness{ float:left; left:-1px; position:relative; top:1px;}
#geo-area{ width: 23.6em;}
#networth{ margin:0; top:-65px;}

/* Franchise table styling here  */
#wrapper #frm-booking #FranchiseTable tr td { border: 1px solid #E0CFE1; padding: 8px 8px 4px 8px; background-color: #eee5ef; line-height: 1.3em;}
#TableTitle { font-size: 1.5em; padding: 20px 0 10px 0; border-top: 1px solid #fff;}
#last{ border-bottom: 1px solid; margin-bottom:-12px; padding-bottom:12px;}
#FranchiseTable{ margin-bottom: 20px;}
#frmFranchise { font-weight: bold; font-size: 1.25em; margin: 12px 0 4px 0;}

/* Button styling here  */
#submit-party{ position: relative; top:10px; left:194px;}
#submit-franchise{clear:both;
left:170px;
overflow:hidden;
position:relative;
top:33px;
width:300px;}
span#submit input,#frmPartyBooking span#submit input{ border:0; background: transparent url('../images/submit-button.gif') no-repeat scroll 0 0; float: left; width:89px;height:28px; text-indent:-9999px; display:block; overflow:hidden;}

#frmPartyBooking span#submit input:link,#frmPartyBooking span#submit input:visited { }
#frmPartyBooking span#submit input:hover,#frmPartyBooking span#submit input:focus,#frmPartyBooking span#submit input:active {}

span#reset-party{ float:left; position:inherit; left:0px; top:10px; left:100px;}
span#reset-franchise{ float:left; position:inherit; left:100px; *margin-left:100px; top:5px;}

span.reset a:link,span.reset a:visited { color:#63106B}

span.reset a:hover,span.reset a:focus,span.reset a:active{color:#7E4883}

/* Contact us */
#h1-address{ margin-bottom:0; width: 557px;}
#bus a{ color: #63106B; }
#address{ border-top: 1px solid #fff; width: 557px;}
#address li#first{ font-weight:bold; padding:20px 0;}
#last{ margin-bottom: 15px;}
#bus{ width: 557px;}
#rail{ margin-bottom: 9px;}
#travel{ background: transparent url('../images/2px-line.gif') repeat-x scroll 0 0; padding-top: 20px;}
#leftColumn { float:left; display: block; width:220px}

/* Kai Edits */
label.error {
color:red;
margin:0 0 0 26px;
width: 16em;
}

#logo a { display:block; width: 408px; margin:0 auto;}
div.textArea { float:left; overflow:hidden; width:420px}
/*  Party booking  */
 
.radio ul,div.radioBooking { position: relative; padding-bottom: 30px}
.radioBooking label.error,.radio label.error { position: absolute; bottom: -10px; left: 0}

.radioBooking label.error { margin-left: 0;}