@charset "utf-8";

/* Cocoapod website 2009 */

/* Colours
   Main background: #CAB0B1
   Content background: #EFE4DC
   Menu background: #6E3F33
   Side nav background: #F9F3F0
   Text link purple: #5B015C
   Text link purple hover: #990099
*/

/* General */

body {
	margin: 0;
	padding: 0; 
	font-family: Arial, Helvtica, sans-serif;
	font-size: 12px;
	line-height: 18px;
	font-weight: normal;
	color: #333333;
	background: #CAB0B1;
}

img {
	border: 0;
	margin: 0;
	padding: 0;
	display: block;
	vertical-align: middle;
}

h1 {
	margin: 0;
	padding: 20px 0 10px 0;
	font-size: 22px;
	font-weight: bold;
	color: #6E3F33;
}

h2 {
	margin: 0;
	padding: 10px 0 10px 0;
	font-size: 20px;
	font-weight: bold;
	color: #6E3F33;
}

h3 {
	margin: 0;
	padding: 10px 0 5px 0;
	font-size: 14px;
	font-weight: bold;
	color: #6E3F33;
}

h4 {
	margin: 0;
	padding: 10px 0 5px 0;
	display: inline-block;
	font-size: 14px;
	font-weight: bold;
	color: #6E3F33;
}

h5 {
	margin: 0;
	padding: 0 0 10px 0;
	display: inline-block;
	font-size: 14px;
	font-weight: normal;
	color: #6E3F33;
}

p {
	margin: 0;
	padding: 0 0 10px 0;
}

a:link, a:visited {
	color: #5B015C;
	text-decoration: none;
}

a:hover {
	color: #990099;
	text-decoration: none;
}

a:active {
	color: #5B015C;
	text-decoration: none;
}


/* Layout - General */

#wrapper {
	width: 960px;
	margin: 0 auto;
	padding: 0;
}


/* Header */

#header {
	width: 960px;
	height: 172px;
	padding: 0;
	margin: 0;
	text-align: left;
	background: url('../images/header_bg.gif') no-repeat;
	z-index: 99;
}

#logo {
	margin: 8px 0 0 20px;
	padding: 0;
	float: left;
}


/* Main navigation */

#mainNav {
	padding: 0;
	margin: 114px 0 0 10px;
	float: left;
}


/* Main content area */

#centre {
	float: left;
	margin: 0;
	padding: 0;
	width: 960px;
	background: url('../images/centre_bg.gif') repeat-y;
}

#cl {
	float: left;
	width: 82px;
	height: 38px;
	background: url('../images/centre_left_bg.gif') top left no-repeat;
}

#cr {
	float: right;
	width: 76px;
	height: 38px;
	background: url('../images/centre_right_bg.gif') top left no-repeat;
}

#content {
	margin: 0;
	padding: 0;
	width: 802px;
	float: left;
	background: #EFE4DC;
}


/* Left hand menu */

#subMenu {
	width: 138px;
	float: left;
}

#subMenu ul {
	width: 105px;
	background: #F9F3F0;
}

#subMenu ul li {
	padding: 5px 0px 0px 5px;
	font-weight: bold;
}

#subMenu li.sub{
	padding: 5px 0px 0px 10px;
	font-weight: normal;
}

#subMenu a:link, #subMenu a:visited {
	color: #5B015C;
	text-decoration: none;
}

#subMenu a:hover {
	color: #990099;
	text-decoration: underline;
}

#subMenu a:active {
	color: #5B015C;
	text-decoration: none;
}

#sm ul {
	display: none;
	width: 90px;
}


/* Main content area */

#main {
	margin: 0;
	padding: 0;
	float: left;
	width: 652px;
}

.titleImage {
	margin: 0 0 10px 0;
}

#mainText{
	margin: 20px 0 0 0;
	clear: both;
}

.imgL {
	clear: left;
}


/* Home */

#mainFL {
	width: 276px;
	height: 235px;
	float: left;
	background: url('../images/main_bg_l.gif') top left no-repeat;	
}

#mainCL {
	width: 276px;
	height: 235px;
	float: left;
	background: url('../images/main_bg_c.gif') top left no-repeat;
}

#mainRL {
	width: 250px;
	height: 235px;
	float: left;
	background: url('../images/main_bg_r.gif') top left no-repeat;
}

#mainSL {
	clear: both;
}

#mainSL img {
	margin: 0 auto;
	padding: 20px 0 0 0;
}

.slideshow {
	visibility: hidden;
}

.slideshow img{
	position: relative;
	float: none;
	z-index: 1;
}

.imageshow {
	visibility: hidden;
}

.imageshow img{
	position: relative;
	float: none;
	z-index: 1;
}

/* Build-A-Bar */

#bab_gallery {
	margin: 30px 0 0 0;
	float: left;
}

	#bab_gallery img {
		margin: 0 0 30px 55px;
		float: left;
	}

	#bab_gallery img.first {
		margin: 0 0 30px 0;
		float: left;
	}

#itemInfo .bab_go a {
	margin: 5px 0 0 0;
	padding: 0;
	width: 139px;
	height: 29px;
	display: block;
	text-indent: -3000px;
	background: url('../images/bab_go.gif') 0 0;
}

	#itemInfo .bab_go a:hover {
       background-position: 0 -29px;
	   cursor: pointer;
	}

#giant_bar {
	margin: 10px auto 0 auto;
	padding: 6px 0 0 5px;
	width: 570px;
	height: 202px;
	background: url('../images/bab_giant_bg_milk.gif') top left no-repeat;
}

#long_bar {
	margin: 10px auto 0 auto;
	padding: 6px 0 0 5px;
	width: 430px;
	height: 112px;
	background: url('../images/bab_long_bg_milk.gif') top left no-repeat;
}

#short_bar {
	margin: 10px auto 0 auto;
	padding: 6px 0 0 5px;
	width: 220px;
	height: 112px;
	background: url('../images/bab_short_bg_milk.gif') top left no-repeat;
}

	#giant_bar table, #long_bar table, #short_bar table {
		margin: 0;
		vertical-align: middle;
	}

		#giant_bar table td, #long_bar table td, #short_bar table td {
			border: 0;
			padding: 0;
			margin: 0;
			width: 70px;
			height: 90px;
			vertical-align: middle;
			background: transparent;
		}

		#giant_bar table input:focus, #long_bar table input:focus, #short_bar table input:focus {
			outline:none;
		}

.bab_char {
	border: 0;
	padding: 0;
	margin: 0;
	width: 70px;
	height: 90px;
	color: #E9DBB5;
	font-size: 70px;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
	background: transparent;
	visibility: hidden;
}

#helpContentModal {
	padding: 10px 23px 0 23px;
	border: 1px solid #6E3F33;
	display:none;
	z-index:1000;
	background: #EFE4DC;
}

#transferContentModal {
	padding: 10px 0 0 24px;
	border: 1px solid #6E3F33;
	display:none;
	z-index:1000;
	background: #EFE4DC;
}

#transferContentModal td {
	background: #EFE4DC;
}

#foilContentModal {
	padding: 10px 0 0 24px;
	border: 1px solid #6E3F33;
	display:none;
	z-index:1000;
	background: #EFE4DC;
}

#foilContentModal td {
	background: #EFE4DC;
	vertical-align: top;
}

#foilContentModal td span {
	width: 100px;
	height: 100px;
	display: block;
}

#foilContentModal td h4 {
	width: 100px;
}

#bab_controls {
	margin: 20px auto 0 auto;
	width: 570px;
	overflow: hidden;
}

#bab_clr {
	float: left;
}

#bab_help {
	margin: 0 0 0 20px;
	float: left;
}

#bab_price {
	padding: 4px 0 0 240px;
	float: left;
}

	#bab_price h2 {
		display: inline;
	}

#bab_atb {
	float: right;
}

#bab_keyboard {
	margin: 20px auto 0 auto;
	width: 412px;
	height: 163px;
	background: url('../images/bab_kb_bg.gif') top left no-repeat;
}

	#bab_keyboard div {
		float: left;
	}

#bab_kbr1 {
	margin: 0;
	overflow: hidden;
	display: inline;
}

#bab_kbr2 {
	margin: 0 0 0 16px;
	overflow: hidden;
	display: inline;
}

#bab_kbr3 {
	margin: 0 0 0 28px;
	overflow: hidden;
	display: inline;
}

#bab_kbr4 {
	margin: 0 0 0 41px;
	overflow: hidden;
	display: inline;
}

#bab_kbr5 {
	margin: 0 0 0 103px;
	overflow: hidden;
	display: inline;
}

#bab_options {
	margin: 25px 0 0 0;
	width: 100%;
	overflow: hidden;
}

#bab_options_bar {
	margin: 0 0 0 27px;
	width: 130px;
	height: 158px;
	background: url('../images/bab_barf_bg.gif') top left no-repeat;
	float: left;
	display: inline;
}

#bab_options_letter {
	margin: 0 0 0 27px;
	width: 130px;
	height: 236px;
	background: url('../images/bab_letf_bg.gif') top left no-repeat;
	float: left;
	display: inline;
}

#bab_options_foil {
	margin: 0 0 0 27px;
	width: 130px;
	height: 153px;
	background: url('../images/bab_foil_bg.gif') top left no-repeat;
	float: left;
	display: inline;
}

#bab_options_transfer {
	margin: 0 0 0 27px;
	width: 130px;
	height: 153px;
	background: url('../images/bab_trans_bg.gif') top left no-repeat;
	float: left;
	display: inline;
}

.bab_opt_sqr {
	margin: 35px 0 0 12px;
	width: 100px;
	height: 100px;
	background: transparent;
	display: block;
}

.bab_opt_table {
	margin: 27px 0 0 15px;
	background: transparent;
}

	.bab_opt_table tr {

	}

	.bab_opt_table td {
		padding: 9px 0 0 0;
		border: 0;
		background: transparent;
	}


/* Build-A-Box */

#itemInfo .bob_go a {
	margin: 5px 0 0 0;
	padding: 0;
	width: 139px;
	height: 29px;
	display: block;
	text-indent: -3000px;
	background: url('../images/bob_go.gif') 0 0;
}

	#itemInfo .bob_go a:hover {
       background-position: 0 -29px;
	   cursor: pointer;
	}

#large_box {
	margin: 10px auto 0 auto;
	padding: 0;
	width: 649px;
	height: 250px;
	background: url('../images/bob_large_bg_milk.gif') top left no-repeat;
}

#medium_box {
	margin: 10px auto 0 auto;
	padding: 0;
	width: 531px;
	height: 190px;
	background: url('../images/bob_medium_bg_milk.gif') top left no-repeat;
}

#small_box {
	margin: 10px auto 0 auto;
	padding: 0;
	width: 472px;
	height: 130px;
	background: url('../images/bob_small_bg_milk.gif') top left no-repeat;
}

	#large_box table, #medium_box table, #small_box table {
		margin: 0;
		vertical-align: middle;
	}

		#large_box table td, #medium_box table td, #small_box table td {
			border: 0;
			padding: 0;
			margin: 0;
			width: 59px;
			height: 60px;
			vertical-align: middle;
			background: transparent;
		}

		#large_box table input:focus, #medium_box table input:focus, #small_box table input:focus {
			outline:none;
		}

.bob_char {
	border: 0;
	padding: 0;
	margin: 0;
	width: 59px;
	height: 60px;
	color: #E9DBB5;
	font-size: 70px;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
	background: transparent;
	visibility: hidden;
}

#bob_keyboard {
	margin: 20px auto 0 auto;
	width: 412px;
	height: 163px;
	background: url('../images/bob_kb_bg.gif') top left no-repeat;
}

	#bob_keyboard div {
		float: left;
	}

#bob_options_bar {
	margin: 0 0 0 102px;
	width: 130px;
	height: 158px;
	background: url('../images/bob_letterb_bg.gif') top left no-repeat;
	float: left;
	display: inline;
}

#bob_options_blank {
	margin: 0 0 0 27px;
	width: 130px;
	height: 236px;
	background: url('../images/bob_transferb_bg.gif') top left no-repeat;
	float: left;
	display: inline;
}

#bob_options_transfer {
	margin: 0 0 0 27px;
	width: 130px;
	height: 153px;
	background: url('../images/bob_transb_bg.gif') top left no-repeat;
	float: left;
	display: inline;
}


/* Shop */

#titleImage {
	margin: 0 0 20px 0;
}

.shopMainImg {
	margin: 0 0 15px 0;
	float: right;
}

.itemLine {
	margin: 0 0 45px 0;
	float: left;
}

.itemL {
	margin: 0;
	width: 182px;
	float: left;
}

.item {
	margin: 0;
	width: 182px;
	float: left;
}

.itemR {
	margin: 0;
	width: 105px;
	float: left;
}

.itemBox {
	width: 105px;
	float: none;
	text-align: center;
}

.itemBox p, .item2Box p {
	margin: 0;
	padding: 0;
	width: 105px;
	text-align: center;
	color: #6E3F33;
	font-weight: bold;
}

.itemBox h3, .item2Box h3 {
	margin: 0;
	padding: 10px 0 0 0;
	width: 105px;
	text-align: center;
}

.itemImg {
	height: 105px;
}

.itemBox img {
	display: inline;
	text-align: center;
}

.itemPic {
	margin: 0 0 30px 32px;
	width: 105px;
	height: 105px;
	float: left;
}

.itemPic img {
	display: inline;
	text-align: center;
}

#itemDetail {
	width: 240px;
	height: 250px;
	float: left;
}

#itemInfo {
	padding: 0 15px 10px 15px;
	width: 625px;
	float: left;
	background: #F9F3F0;
}

#itemInfo.transfer {
	display: inline;
}

#itemInfo a {
	padding: 0 0 0 15px;
	font-weight: bold;
}

#helpContent {
	padding: 0 15px 10px 15px;
	width: 625px;
	float: left;
}


.catimg {
	margin: 0 0 10px 0;
}

.basket{
	margin: 5px 0 0 0;
}

.buyme {
	margin: 0 0 0 17px;
}

.shop-input {
	margin: 0 0 15px 0;
}

.shop-input-text {
	vertical-align: text-bottom;
}

#pageCount {
	width: 100%;
	margin: 0 0 15px 0;
	float: left;
	color: #5B015C;
	font-size: 12px;
	text-align: center;
	font-weight: bold;
}

#pageCount a:link, #pageCount a:visited {
	color: #5B015C;
	text-decoration: none;
}

#pageCount a:hover {
	color: #990099;
	text-decoration: underline;
}

#pageCount a:active {
	color: #5B015C;
	text-decoration: none;
}


/* Cart */

#shopBasket {
	width: 635px;
	margin: 0 0 0 15px;
}

#ajax_msg {
	margin: 0;
	padding: 0;
	text-align: right;
	color: #5B015C;
	font-weight: bold;
}

#checkoutReturn {
	text-align: center;
}

#checkoutReturn img{
	margin: 0 auto;	
}

#basketInfo {
	margin: 15px 0 0 0;
}

.purpleBold {
	color: #5B015C;
	font-weight: bold;
}


/* FAQ */

#faqAccordion {
	float: left;
	margin: 0 0 20px 0;
}


/* News */

.newsItem {
	margin: 30px 0 30px 0;
	float: left;
}

.newsPic {
	margin: 0 30px 0 0;
	float: left;
}

.newsText {
	width: 510px;
	margin: 0;
	float: right;
}

.newsTitle {
	margin: 0 0 30px 0;
	font-size: 15px;
	font-weight: bold;
	color: #5B015C;
}

.newsDate {
	margin: 0 0 30px 0;
	font-size: 12px;
	font-weight: bold;
	color: #333333;
}

.newsText p {
	margin: 10px 0 0 0;
}

.newsDiv {
	margin: 0 0 0 50px;
	height: 28px;
	background: url('../images/news_div.gif') top left no-repeat;
	clear: both;
}


/* About us */

.aboutLeft {
	float: none;
	margin: 10px 0 0 0;
}

.aboutLeft:after {  
	content: ".";  
	visibility: hidden;  
	display: block;  
	clear: both;  
	height: 0;  
	font-size: 0;
}

.aboutLeft p {
	width: 510px;
	padding: 0 0 0 30px;
	float: left;
	text-align: left;
	vertical-align: middle;
}

.aboutLeft img {
	float: right;
}

.aboutLeft2 {
	float: none;
	margin: 0;
	vertical-align: middle;
}

.aboutLeft2:after {  
	content: ".";  
	visibility: hidden;  
	display: block;  
	clear: both;  
	height: 0;  
	font-size: 0;
}

.aboutLeft2 p {
	width: 440px;
	padding: 0 0 0 30px;
	float: left;
	text-align: left;
}

.aboutLeft2 img {
	float: right;
}

.aboutRight {
	float: none;
	margin: 0;
	vertical-align: middle;
}

.aboutRight:after {  
	content: ".";  
	visibility: hidden;  
	display: block;  
	clear: both;  
	height: 0;  
	font-size: 0;
}

.aboutRight p {
	width: 480px;
	padding: 0 30px 0 0;
	float: right;
	text-align: right;
	vertical-align: middle;
}

.aboutRight img {
	float: left;
}

.aboutSpacer {
	width: 100%;
	margin: 30px 0 30px 0;
	text-align: center;
}

.aboutFooter {
	width: 100%;
	margin: 30px 0 10px 0;
	text-align: center;
}

.aboutImg {
	text-align: center;
	display: block;
	margin: 0 auto;
}


/* Visit us */

#visitImages {
	float: left;
	margin: 20px 0 20px 0;
}

.visitImg {
	margin: 0 79px 0 0;
	display: inline-block;
}

.visitImgx {
	margin: 0;
	display: inline-block;
}

#visitText {
	width: 100%;
	clear: both;
	margin: 0;
}

#visitTextLeft {
	width: 375px;
	float: left;
	margin: 0;
}

#visitTextRight {
	width: 375px;
	float: right;
	margin: 0;
}


/* Footer */

#footer {
	padding: 0;
	margin: 0;
	width: 960px;
	float: left;
	height: 55px;
	text-align: center;
	background: url('../images/footer_bg.gif') 0px 10px no-repeat;
}

#footer p {
	margin: 0;
	padding: 30px 0 0 0;
	font-size: 10px;
	color: #333333;
}

#footer a:link, #footer a:visited {
	color: #5B015C;
	text-decoration: none;
}

#footer a:hover {
	color: #990099;
	text-decoration: none;
}

#footer a:active {
	color: #5B015C;
	text-decoration: none;
}


/* Forms */

form {
	margin: 0;
}

input {
	font-family: Arial, Helvtica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #333333;
}

textarea {
	font-family: Arial, Helvtica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #333333;
	vertical-align: middle;
}

select {
	font-family: Arial, Helvtica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #333333;
}


/* Tables */

table {
	margin: 0 0 10px 0;
	border-collapse: collapse;
	/*table-layout: fixed;*/
}

table.cart {
	width: 640px;
}

th {
	padding: 3px 9px;
	font-size: 12px;
	font-weight: bold;
	background: #6E3F33;
	border-right: 1px solid #EFE4DC;
	color: #EFE4DC;
}

th.nb {
	border: 0;
}

th.left {
	padding-left: 9px;
	text-align: left;
}

th.lefti {
	width: 266px;
	padding-left: 9px;
	text-align: left;
}

tr td {
	background: #EFE4DC;
}

tr.odd td {
	background: #E4D2C5;
}

td {
	border-right: 1px solid #6E3F33;
	padding: 3px 9px;
	vertical-align: middle;
	text-align: center;
}

td.nb {
	border: 0;
}

td.left {
	padding-left: 9px;
	text-align: left;
}

td.lefti {
	width: 266px;
	padding-left: 9px;
	text-align: left;
	overflow: hidden;
}

td.leftnb {
	border: 0;
	padding-left: 9px;
	text-align: left;
}

td.right {
	padding-right: 9px;
	text-align: right;
}

td input {
	margin: 3px 0px 0px 0px;
	font-size: 12px;
}

.foilTable, .transferTable {
	margin: 0 0 10px 0;
	border-collapse: collapse;
}

.foilTable td, .transferTable td{
	padding: 0 25px 15px 0;
	border: 0;
	background: #F9F3F0;
	vertical-align: middle;
	text-align: center;
}

#itemInfo .transferTable a {
	padding: 0;
}

.foilTable h4, .transferTable h4{
	padding: 5px 0 0 0;
	vertical-align: middle;
	text-align: center;
	font-size: 14px;
}


/* Misc */

#noscript{
	margin: 0 auto;
	background: #F9F3F0;
	padding: 10px 0 10px 10px;
	color: #5B015C;
	font-size: 13px;
	font-weight: bold;
	border: 1px solid #6E3F33;
}

#noscript img {
	display: inline;
	vertical-align: top;
}

#noscript p {
	display: inline;
	margin: 0 0 0 10px;
	padding-top: 3px;
}

.transfer_layer { 
    display: none; 
    z-index: 10000;
	border: 1px solid #6E3F33;
    background: #EFE4DC; 
    width: 250px;
	height: 45px;
	text-align: center;     
}

.show {
	visibility: visible;
}

.bold {
	font-weight: bold;
}

.left {
	float: left;
}