* {margin:0;padding:0}
/* mac hide \*/
html,body{height:100%;width:100%;}
/* end hide */
body {
background-color: #eaeaea;
text-align:center;
}
#outer{
height:100%;
width:100%;
display:table;
}
#container {
text-align: center;
position:relative;
display:table-cell;
height: auto;
background-color: #eaeaea;
}
#inner {
width: 950px;
background: #ffffff;
height: auto;
text-align: center;
margin-left:auto;
margin-right:auto;
}
#top
{
padding: 0px;
text-align: center;
width: 950px;
height: 98px;
background-image: url(http://charitycards.org/cards/images/header-ecards.jpg);
background-repeat: no-repeat;
}

.toplogin { text-align: right; width: 940px; padding: 0 10px 0 0; }
.toplogin a { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #21486f; text-decoration: none; font-weight: bold; }
.toplogin a:hover { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #a1cd40; text-decoration: underline; font-weight: bold; }
/* menu stuff */
.menulink { text-align: right; width: 940px; padding: 75px 10px 0 0; color: #ffffff; }
.menulink a { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #ffffff; text-decoration: none; font-weight: bold; }
.menulink a:hover { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #a1cd40; text-decoration: underline; font-weight: bold; }

.welcomemsg { clear: both; float: left; width: 100%; padding: 0px 0px 20px 5px; text-align: left; font-family: Arial; font-size: 14px; color: #494949; }
.welcomemsg a { font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #494949; text-decoration: none; font-weight: bold; }
.welcomemsg a:hover { font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #000000; text-decoration: underline; font-weight: bold; }

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

#subfooter
{
clear: both;
padding: 5px 0 0 0px;
width: 840px;
height: 55px;
text-align: center;
}
/* home page stuff */
#homeleftnav
{
clear: both; float: left;
width: 665px;
background: #ffffff;
height: auto;
text-align: center;
padding: 10px 5px 0 5px;
background-repeat: repeat-x;
font-family: Arial, Helvetica, sans-serif; font-size: 18px; color: #21486f; text-decoration: none;
}
#rightcolumn
{
float: left;
width: 260px;
background: #ffffff;
height: auto;
text-align: center;
padding: 130px 0px 0 0px;
background-repeat: repeat-x;
font-family: Arial, Helvetica, sans-serif; font-size: 18px; color: #21486f; text-decoration: none;
}
/* about us page stuff */
#aboutleftnav
{
width: 900px;
background: #ffffff;
height: 100%;
text-align: center;
padding: 10px 10px 0 10px;
margin-left:80px;
margin-right:10px;
margin-top: 20px;
background-repeat: repeat-x;
font-family: Arial, Helvetica, sans-serif; font-size: 18px; color: #21486f; text-decoration: none;
}
#aboutleftnav p { margin: 20px 0 0 0; }
#aboutleftnav h2 { margin: 0; }

/* about us page stuff */
#videoleftnav
{
width: 950px;
padding: 20px 0px 0 0px;
background: #ffffff;
height: auto;
text-align: center;
background-repeat: repeat-x;
font-family: Arial, Helvetica, sans-serif; font-size: 18px; color: #21486f; text-decoration: none;
}
#videoleftnav p { margin: 0; height: auto; }
#OrderDetails { clear: both; float: left; }
#OrderPersonalisation { clear: both; float: left; }
#cardDetails { clear: both; float: left; height: auto; }
#cardCell { clear: both; float: left; width: 950px; text-align: center; background-color: #ffffff; padding: 0 0 0 0; }
#player { width: 950px; text-align: center; }
#cardleftnav
{
    clear: both;
    float: left;
width: 950px;
background: #ffffff;
height: 900px;
text-align: center;
padding: 10px 0px 0 0px;
margin-left: 10px;
margin-right:10px;
margin-top: 20px;
}
#loginleftnav
{
width: 930px;
background: #ffffff;
padding: 20px 10px 0 10px;
height: 600px;
text-align: center;
background-repeat: repeat-x;
font-family: Arial, Helvetica, sans-serif; font-size: 18px; color: #21486f; text-decoration: none;
}

#orderleftnav
{
width: 800px;
background: #ffffff;
height: 1500px;
text-align: center;
padding: 10px 0px 0 0px;
margin-left: 10px;
margin-right:10px;
margin-top: 20px;
background-repeat: repeat-x;
font-family: Arial, Helvetica, sans-serif; font-size: 18px; color: #21486f; text-decoration: none;
}

h2 { font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #24295d; text-decoration: none; text-align: left; font-weight: bold; padding: 0px 0 20px 0; }

.videotitle { font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #24295d; text-decoration: none; text-align: center; font-weight: bold; padding-top: 0px; }
.videotitle a { font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #24295d; text-decoration: none; font-weight: bold; padding-top: 0px; }
.videotitle a:hover { font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #a1cd40; text-decoration: underline; font-weight: bold; padding-top: 0px; }

.ecarddetails { clear: both; float: left; width: 900px; padding: 0px 5px 10px 5px; margin: 20px 0 0 20px;
                background-image: url(http://charitycards.org/images/Samples-stretch.gif);
                background-repeat: repeat-x;
 }
.ecarddetails p { margin: 0; padding: 0 0 10px 0; font-family: Arial; font-size: 12px; color: #24295d; text-align: left; }
.ecarddetails h3 { margin: 0; padding: 10px 0 10px 0; font-family: Arial; font-size: 16px; color: #24295d; text-align: left; }

.cardleft { clear: both; float: left; width: 800px; height: 900px; padding: 10px 5px 10px 5px; text-align: center; }
.cardleft h1 { font-family: Arial, Helvetica, sans-serif; font-size: 24px; color: #24295d; text-decoration: none; text-align: left; font-weight: bold; padding: 0px 0 0px 20px; width: 480px; margin: 0; }
.cardleft p { margin: 0; padding: 0 0 0px 20px; font-family: Arial; font-size: 12px; color: #24295d; text-align: left; }
.cardleft h3 { margin: 0; padding: 0px 0 0px 0; font-family: Arial; font-size: 16px; color: #24295d; text-align: left; }

/* checkout styles */

.TitleText { clear: both; float:left; width: 700px; font-family: Arial, Verdana; font-size: 14px; color: #000000; padding: 5px 0 5px 0; text-align: left; }
.BoxText { float:left; width: 500px; font-family: Arial, Verdana; font-size: 14px; color: #000000; text-align: left; }
.FieldText { clear: both; float: left; width: 150px; font-family: Arial, Verdana; font-size: 14px; color: #000000; text-align: left; }
.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; text-align: left; }
.TextLine { clear: both; float: left; padding: 10px 0 10px 0; width: 700px; font-family: Arial, Verdana; font-size: 14px; color: #000000; text-align: left; }
.CheckText { clear: both; float: left;  width: 40px; font-family: Arial, Verdana; font-size: 14px; color: #000000; padding: 10px 0 10px 0; }

.TotalText { clear: both; float:left; width: 200px; font-family: Arial, Verdana; font-size: 14px; color: #000000; font-weight: bold; text-align: left; }
.TotalField { float:left; width: 600px; font-family: Arial, Verdana; font-size: 14px; color: #000000; font-weight: bold; text-align: left; }
.MsgText { float:left; width: 600px; font-family: Arial, Verdana; font-size: 14px; color: #ff0000; font-weight: bold; text-align: left; }
/* shopping cart */
.cartHeader { font-family: Arial; font-size: 14px; color: #ffffff; font-weight: bold; height: 30px; background-color: #3366ff; text-align: center; }
.cartItem { font-family: Arial; font-size: 11px; color: #0e2055; font-weight: normal; height: 30px; background-color: #ffffff; text-align: center; }
.cartAlternatingItem
{
    font-family: Arial;
    font-size: 11px;
    color: #0e2055;
    font-weight: normal;
    height: 30px;
    background-color: #CCFFCC;
    text-align: center;
}