* {margin:0;padding:0}
/* mac hide \*/
html,body{height:100%;width:100%;}
/* end hide */
body {
       background-image: url(/images/column_wide.jpg);
       background-repeat: repeat-y; background-position: center;
       width: 100%; height: 100%;
       background-color: #eaeaea;
text-align:center;
}

/* standard stuff here */
.small { font-family: Arial, Helvetica, sans-serif; font-size: 10px; color: #00485d; text-decoration: none; }
a.small { text-decoration: none; }
a:HOVER.small { text-decoration: none; background-color: #baebfe; color: #f25c45; }	

/* menu stuff */
.menu-links { font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #ffffff; text-decoration: none; }
a.menu-links { text-decoration: none; }
a:HOVER.menu-links { text-decoration: none; background-color: #baebfe; color: #f25c45; }	

h1 { color: #b3960f; font-family: 'Trebuchet MS', Verdana, Sans-Serif; font-size: 20px; font-weight: normal; text-decoration: none; letter-spacing: -1px; margin: 0px; padding: 5px 0px 5px 0px; }
h2 { color: #b3960f; font-family: 'Trebuchet MS', Verdana, Sans-Serif; font-size: 18px; font-weight: normal; text-decoration: none; letter-spacing: -1px; margin: 0px; padding: 0px 0px 0px 0px; }
h3 { color: #000099; font-family: 'Trebuchet MS', Verdana, Sans-Serif; font-size: 18px; font-weight: normal; margin: 0px; padding: 5px 0px 5px 0px; }
h4 { color: #000099; font-family: 'Trebuchet MS', Verdana, Sans-Serif; font-size: 14px; font-weight: normal; margin: 0px; padding: 5px 0px 5px 0px; }
h5 { color: #b3960f; font-family: 'Trebuchet MS', Verdana, Sans-Serif; font-size: 16px; font-weight: normal; text-decoration: none; letter-spacing: -1px; margin: 0px; padding: 0px 0px 10px 0px; }

h2 a { font-family: 'Trebuchet MS', Verdana, Sans-Serif; font-weight: normal; text-decoration: none; color: #f25c45; letter-spacing: -1px; }
h2 a:HOVER { text-decoration: underline; color: #00485d; }	
h3 a { font-family: 'Trebuchet MS', Verdana, Sans-Serif; font-weight: normal; text-decoration: none; color: #00485d; letter-spacing: -1px; }
h3 a:HOVER { text-decoration: underline; color: #f25c45; }	
h4 a { font-family: 'Trebuchet MS', Verdana, Sans-Serif; font-weight: normal; text-decoration: none; color: #00485d; letter-spacing: -1px; }
h4 a:HOVER { text-decoration: underline; color: #f25c45; }	
	
	
p { padding: 5px 0 5px 0; margin:0; color: #000099; font-size: 14px; font-family: Helvetica, Arial, Verdana, Sans-Serif; font-weight: normal; }
.discountpod p { padding: 0px 0 5px 0; margin:0; color: #000099; font-size: 18px; font-family: Helvetica, Arial, Verdana, Sans-Serif; font-weight: normal; }
.mainTextHomeSmall {	font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: Gray; font-weight: normal; }
A.mainTextHomeSmall {	font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: Gray;	text-decoration: none;}
A:HOVER.mainTextHomeSmall {	font-family: Arial, Helvetica, sans-serif;	font-size: 12px; color: #3c7193; text-decoration: underline;}

#outer{
height:100%;
width:100%;
display:table;
}
#container {
text-align: center;
position:relative;
display:table-cell;
height: 100%;
}
#inner {
width: 920px;
background: #e9e9e9;
height: 100%;
text-align: center;
margin-left:auto;
margin-right:auto;
}
#top
{
padding: 0px;
text-align: left;
width: 817px;
background-color: #ffffff;
margin: 0 18px 0 10px;
}
#menutop { text-align: center; width: 840px; height: 42px; background-color: #ffffff; margin: 0; padding: 0;}
#menuOuter { float: left; padding: 0px 0 0 0; width: 549px; height: 92px; margin: 0 0 0 0px; background-color: #ffffff; background-image: url(/images/header_background.jpg); background-repeat: no-repeat; }
#menuInner { float: left; padding: 2px 0 0 0; width: 549px; height: 40px; margin: 0 0 0 0px; background-image: url(/images/menu-new_blue4.jpg); background-color: #ffffff; background-repeat: no-repeat; }

#flashhome { 
float: left;
width: 840px;
height: 400px;
padding: 20px 0px 0 0px;
text-align: center;
}
#flashcontent { float: left; width: 860px; text-align: center; padding: 0 20px 0 20px; margin: 0; }

#flashcontent {
		height: 100%;
	}

#subfooter
{
clear: both;
padding: 5px 0 0 0px;
width: 840px;
height: 55px;
text-align: center;
}

/* homepage styling */
#logoArea { float: left; width: 346px; padding: 0; height: 92px; background-color: #ffffff; }
#cartArea { float: left; width: 25px; padding: 0; height: 92px; background-color: #ffffff; }
#headerBottom { clear: both; float: left; width: 920px; height: 10px; text-align: left; padding: 0 0 0 0px; margin: 0px 0 0px 0px; background-image: url(http://4charity.org.uk/images/head_pod_bottom.gif); background-repeat: no-repeat; background-color: #eaeaea; }
.spacerPod { clear: both; float: left; width: 100%; height: 10px; background-color: #eaeaea; }
#flashPod { clear: both; float: left; width: 420px; text-align: left; padding: 0px 0 0 0px; }
#termsPod { clear: both; float: left; width: 100%; text-align: left; padding: 0 0 0 20px; margin: 0; }
#footerPod { clear: both; float: left; width: 100%; height: 55px; text-align: left; padding: 0; margin: 0; background-image: url(images/bottom_banner.gif); background-repeat: no-repeat; }
.podOne { clear: both; float: left; width: 300px; height: 140px; text-align: left; padding: 0px 0 0 0px; margin: 0 10px 0 0; background-image: url(Images/pod_white.gif); background-repeat: no-repeat; }
.podTwo { float: left; width: 300px; height: 140px; padding: 0px 0 0 0px; margin: 0 10px 0 0; background-color: #eaeaea; background-image: url(Images/pod_white.gif); background-repeat: no-repeat; }
.podThree { float: left; width: 280px; height: 140px; margin: 0 0 0 0px; padding: 0px 10px 0 10px; background-color: #eaeaea; background-image: url(Images/pod_white.gif); background-repeat: no-repeat; text-align: left; }
#rightPod { float: left; width: 480px; margin: 0 0 0 0px; padding: 0px 0 0 10px; background-color: #eaeaea; }
/* form field stuff */
.fieldNames { font-size: 12px; color: #000000; font-family: Arial, Helvetica, sans-serif; width: 150px; }
#cardfields { float: left; padding: 9px 9px 9px 9px; margin: 0px 0px 0px 15px; width: 400px; text-align: right; }

/* categories page stuff */
#categoriesTitle { float: left; width: 550px; text-align: left; padding: 10px 0 10px 10px; font-family: Arial; font-size: 18px; color: #000000; }
#categoriesPane { float: left; width: 800px; text-align: center; padding: 10px 0px 10px 50px; }
#categoriesTitle p { clear: both; float: left; margin: 0; padding: 0; }
#categoriesTitle h1 { margin: 0; padding: 0 0 10px 50px; font-size: 36px; letter-spacing: -3px; line-height: 35px; text-align: left;  }
#categoriesButton { clear: both; float: left; width: 137px; height: 39px; text-align: left; padding: 8px 0 0 14px; background-repeat: no-repeat; background-image: url(/Images/Button.jpg); }
#categoriesItem { float: left; text-align: center; padding: 0px 0px 20px 0px; width: 151px; }
.categoriesText { font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #ffffff; text-decoration: none; text-align: left; font-weight: bold; padding-top: 20px; }
#categoriesThumb { border: sold 1px #eaeaea; padding: 5px 5px 5px 5px; margin: 5px 2px 5px 2px; border: solid 1px #eaeaea; }
.discount { font-family: Arial, Verdana; color: #ffffff; font-weight: bold; text-align: center; }
.categoryButton { background-image: url(http://charitycards.org/Images/Button.jpg); background-repeat: no-repeat; width: 170px; height: 38px; margin: 5px 0 0 13px; padding: 8px 0 0 20px; text-align: left; }
.categoryImage { float: left; width: 180px; padding: 10px 0px 10px 0px; text-align: center; }
/* bespoke page stuff */
#bespokeflash { float: left; width: 750px; text-align: center; padding: 0 20px 0 10px; margin: 0 0 0 10px; }
#bespokeflash {
		height: 100%;
	}

#bespokeItem { float: left; text-align: center; padding: 0px 0px 20px 0px; width: 300px; line-height: 27px; }
.bespokeText { width: 100%; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #000000; text-decoration: none; text-align: center; font-weight: bold; padding: 5px 0 10px 30px; margin: 0; background-image: url("/Images/arrow_shiny_button.jpg"); background-repeat: no-repeat; background-position: left top; line-height: 27px; overflow: visible;  }
#bespokePane { float: left; width: 900px; text-align: center; padding: 10px 0px 10px 0px; }

#bespokeItem ul { margin: 0; padding: 0; }
#bespokeItem li { list-style-image:url("/Images/arrow_shiny_button.jpg"); list-style-position: inside; margin: 0; padding: 10px 0 0 0; }


/* charities stuff */
/* charities stuff */
#charityTable
{
padding: 30px 20px 10px 20px;
text-align: left;
font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #21486f; text-decoration: none;
}
#charitytext { text-align: left; width: 430px; padding: 0 10px 0 10px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #000000; text-decoration: none; }
#charityimage { text-align: left; width: 430px; padding: 20px 10px 0 10px; }


/* Price Calculator stuff */
#pricepane
{
clear: both;
float: left;
padding: 10px 0 0 0;
width: 600px;
margin: 30px 0 0 0;
text-align: left;
}
#total
{
clear: both;
float: left;
padding: 10px 0 0 0;
width: 600px;
margin: 10px 0 0 0px;
text-align: left;
}
#calcleftnav
{
float: left;
width: 600px;
height: 300px;
margin: 0px 40px 0 90px;
padding: 10px 10px 0 10px;
text-align: left;
background-color: #eaeaea;
font-family: Arial, Helvetica, sans-serif; font-size: 18px; color: #21486f; text-decoration: none;
}
#calculator{
padding: 10px 0 0 0;
width: 900px;
margin: 30px 0 0 0;
text-align: left;
}
.tableTitle { font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #007dc3; }
.tablefont { font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #000000; }

/* Misc */
.crumb1 { font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #000099; text-decoration: none; }
a.crumb1 { text-decoration: none; }
a:HOVER.crumb1 { text-decoration: none; background-color: #baebfe; color: #f25c45; }	

.crumb2 { font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #00485d; text-decoration: none; }
a.crumb2 { text-decoration: none; }
a:HOVER.crumb2 { text-decoration: none; background-color: #baebfe; color: #f25c45; }	

/* Admin Stuff */
.adminHeader { font-family: Arial; font-size: 14px; color: #ffffff; font-weight: bold; height: 30px; background-color: #3366ff; }
.adminItem { font-family: Arial; font-size: 12px; color: #0e2055; font-weight: normal; height: 30px; background-color: #ffffff; }
.adminAlternatingItem { font-family: Arial; font-size: 12px; color: #0e2055; font-weight: normal; height: 30px; background-color: #CCFFCC; }

/* form field stuff */
.fieldTitle { clear: both; float: left; color: #565758; font-size: 14px; font-family: Helvetica, Arial, Verdana, Sans-Serif; font-weight: normal; width: 250px; padding: 0 0 5px 0; }
.fieldNames { float: left; border: font-size: 12px; color: #000000; font-family: Arial, Helvetica, sans-serif; text-align: left; padding: 0 0 5px 10px; width: 400px; }
.fieldNamesLong { float: left; border: font-size: 12px; color: #000000; font-family: Arial, Helvetica, sans-serif; text-align: left; padding: 0 0 5px 10px; width: 800px; }
.address { color: #565758; font-family: 'Trebuchet MS', Verdana, Sans-Serif; font-size: 16px; font-weight: normal; text-decoration: none; letter-spacing: -1px; margin: 0px; padding: 0px 0px 0px 0px; }

/* Checkout page */
.TitleText { clear: both; float:left; width: 700px; font-family: Arial, Verdana; font-size: 14px; color: #000000; padding: 10px 0 10px 0; }
.BoxText { float:left; width: 700px; padding: 5px 0 5px 0; font-family: Arial, Verdana; font-size: 14px; color: #000000; }
.AddressText  { float:left; width: 200px; padding: 5px 0 5px 0; font-family: Arial, Verdana; font-size: 14px; color: #000000; }
.FieldText { clear: both; float:left; width: 200px; padding: 5px 0 5px 0; font-family: Arial, Verdana; font-size: 14px; color: #000000; }
.HeaderText { padding: 20px 0 10px 0; clear: both; float: left; border-bottom: dotted 1px #000000; width: 100%; font-family: Arial, Verdana; font-size: 14px; color: #000000; }
.TextLine { float: left; padding: 5px 0 5px 0; width: 900px; font-family: Arial, Verdana; font-size: 14px; color: #000000; }
.TextHalfLine { clear: both; float: left; padding: 5px 20px 5px 0; width: 660px; font-family: Arial, Verdana; font-size: 14px; color: #000000; }
.TextHalfLineCenter { clear: both; float: left; text-align: center; padding: 5px 20px 5px 0; width: 660px; font-family: Arial, Verdana; font-size: 14px; color: #000000; }
.CheckText { clear: both; float: left;  width: 40px; font-family: Arial, Verdana; font-size: 14px; color: #000000; padding: 10px 0 10px 0; }
#TextCell { clear: both; float: left; padding: 10px 0 10px 0; width: 820px; font-family: Arial, Verdana; font-size: 14px; color: #000000; }
.TotalText { clear: both; float:left; width: 200px; font-family: Arial, Verdana; font-size: 14px; color: #000000; font-weight: bold; }
.TotalField { float:left; width: 600px; font-family: Arial, Verdana; font-size: 14px; color: #000000; font-weight: bold; }
.SamplesText { float:left; width: 150px; font-family: Arial, Verdana; font-size: 14px; color: #000000; padding: 0px 5px 5px 5px; }
.SamplesField { float:left; width: 200px; font-family: Arial, Verdana; font-size: 14px; color: #000000; padding: 0px 5px 5px 5px; }
.leftpod { clear: both; float: left; width: 430px; }
.rightpod { clear: both; float: left; width: 430px; }

/* right column */

.rightColumn { float: left; width: 210px; padding: o; margin: 0; text-align: center; background-color: #ffffff; }

/*  search css */
.cardTitle { font-family: Arial, Helvetica, sans-serif; font-size: 16px; text-decoration: none; font-weight: bold; }
a.cardTitle { text-decoration: none; }
a:HOVER.cardTitle { text-decoration: none; background-color: #baebfe; color: #f25c45; }	

.searchArea { float: left; width: 170px; text-align: left; margin: 0 0 0 30px; }
.CardDetails { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #000000; text-decoration: none; }
.dotsLine { clear: both; float: left; border-bottom: dotted 2px #eaeaea; padding: 5px 0 5px 0; width: 100%; }


/* Card Details Page */
#cardLeft { float: left; width: 400px; text-align: left; padding: 0; }
#cardRight { float: left; width: 500px; text-align: left; padding: 20px 0 0 0; }
#cardBottom { clear: both; float: left; width: 100%; text-align: left; padding: 20px 0 0 0; }
#cardPod1 { clear: both; float: left; width: 246px; text-align: left; padding: 0px 10px 0 10px; margin: 10px 0 0 0px; border: solid 2px #eaeaea; }
#cardPod2 { float: left; width: 246px; text-align: left; padding: 0px 10px 0 10px; margin: 10px 0 0 42px; border: solid 2px #eaeaea; }
#cardPod3 { float: left; width: 246px; text-align: left; padding: 0px 10px 0 10px; margin: 10px 0 0 42px; border: solid 2px #eaeaea; }

/* Prices Page */
#priceTitle { float: left; width: 700px; text-align: left; padding: 0; }