{
	padding: 0em; margin: 0em;
}

body {
	padding: 0px 0px 0px 0px;
	font-family: "Century Gothic", Arial, Helvetica, "Trebuchet MS", sans-serif;
	margin: 0em;
	font-size:12px;
	font-weight: normal;
	color: #666666;
	cursor:default;
	sline-height:16px;
}

img { border:0px;}
.clear {clear: both;}
p {
	margin: .5em 0 0em 0;
}

A:active, A:link, A:visited {text-decoration:none; color:#2D78C1; sfont-size:12px; font-weight:bold;}  
A:hover	{color:#333333; text-decoration: underline;}

a.linkGrey {
	scolor: #666666;	
}
h1{font-size: 12px}

h2 { font-size: 14px; font-weight: normal; margin-bottom: 4px; margin-top: 0px;}


/* CONTAINER */
#container {
	width: 902px;
	margin: auto;
}


/* CONTENT */
#contentOuter
{
	width: 902px;
	background-image: url(/images/contentOuterBg.gif);
}
*>#contentOuter
{
	height: auto;
}

#contentTop {
	width: 902px;
	height: 20px; 
	background: url(/images/contentTopBg.gif) no-repeat left bottom;
}

#contentBottom {
	width: 902px; 
	height: 20px; 	
	margin: 0 auto; 
	background: url(/images/contentBottomBg.gif) no-repeat;
}

#contentMiddle {
	sborder: solid 1px black;;
	smargin-left: 25px;
}

*>#contentMiddle {
	height: auto;
	smin-height: 370px;
}


#contentBody
{
	float: left;
	width: 868px;
	margin-left:20px;
}
 

*>#contentBody
{
	height: auto;
	smin-height: 370px;
	width: 860px;
}

#contentBodyRight {
	float: left;
	width: 710px;
	padding-right: 0px;
	margin-left:10px;
}	
	
*>#contentBodyRight {
	height: auto;
	min-height: 370px;
	width: 710px;
}

#headerWrapper
{
	z-index: 2;
	position: relative;
	width 100%;
	background: #FFF url(/images/headerBg.gif) repeat-x top;
	margin: 0 auto;
}

#header
{
	position: relative;
	width: 882px;
	height: 75px;
	margin: 0 auto;
}

#headerContent {
	position: relative;
	float: left;
	width: 862px;
	height: 75px;
	margin-left: 10px;
}

#headerContent .logo {
	float: left;
	width: 300px;
}

#headerContent .login {
	float: right;
	width: 360px;
	height: 68px;
	padding-top: 4px;
}

#headerContent .login .loginRow {
	clear: both;
	float: right;
	height: 20px;
	margin-bottom: 2px;
}

#headerContent .login .loginRow div {	
	float: left;
	padding-left: 10px;
}

#headerContent .login .loginRow #userid {
	float: left;
	width: 120px;	
}

#headerContent .login .loginRow #password {
	float: left;
	width: 120px;	
}

#headerContent .login .loginRow #login {
	float: left;
	width: 60px;	
}

#headerContent .login .loginRow .input {
	width: 120px;
	padding-left: 2px;
	border: solid 1px #2D78C1;
	color: #999999; 
}

#headerContent .login .welcome {
	text-align: center;
	line-height: 20px;
}

#headerContent .login .loginRow #rememberMe {
	float: left;
	line-height:18px;
	width: 120px;
	text-align: left;
	padding: 0px;
}

#headerContent .login .loginRow #rememberMe .text {
	float: left;
	width: 100px;
	padding: 0px;
}

#headerContent .login .loginRow #rememberMe .checkbox {
	float: left;
	width: 20px;
	padding: 0px;
}

#headerContent .login .loginRow #forgottenPassword {
	float: right;
	width: 190px;
	line-height:18px;
	text-align: right;
}

#headerContent .login .loginRow #rememberMe a {
	font-size: 12px;
	line-height: 18px;
}

#headerContent .login .loginRow #rememberMe input {
	font-size: 12px;
	line-height: 18px;
}

#headerContent .login .loginRow #forgottenPassword a {
	font-size: 12px;
	line-height: 18px;
}

#loginBottomRow {
	display: none;
}

#loginBottom .shidden {
	display: none;	
}

#loginBottom .svisible {
	display: block;	
}


.contentBackground {
	overflow: hidden;
	width: 860px;
	min-height: 488px;
	background-repeat: no-repeat;	
}

#homeBackground {
	background: url(/images/homeBackground.jpg);
}

#joinBackground {
	background: url(/images/joinBackground.jpg);
}

#templatesBackground {
	background: url(/images/templatesBackground.jpg) #FFFFFF;;
}

#packagesBackground {
	background: url(/images/packagesBackground.jpg) #FFFFFF;;
}

#loginBackground {
	background: url(/images/loginBackground.jpg);
}

#contactUsBackground {
	background: url(/images/contactUsBackground.jpg);
}
/* MainMenu  ----------------------------------------------------------------- */

.mainNavigation { position: relative; width: 880px; height: 25px; margin: 0 auto;}
ul#mainTab{ width: 882px; height:20px; top:0px; margin: 0px; padding: 0px; list-style : none; border: solid 0px black;}
#mainTab li{ float:left; }
#mainTab li a{ text-indent:-9999px; display:block; height:40px; overflow:hidden; background-repeat:no-repeat; }

a#home{ width:147px; background-image:url(/images/homeTab.gif); }
a#home:hover{ background-position:-147px 0; }
li.current_page_item a#home{ background-position:-147px 0; }

a#admin{ width:147px; background-image:url(/images/adminTab.gif); }
a#admin:hover{ background-position:-147px 0; }
li.current_page_item a#admin{ background-position:-147px 0; }

a#join{ width:147px; background-image:url(/images/joinTab.gif); }
a#join:hover{ background-position:-147px 0; }
li.current_page_item a#join{ background-position:-147px 0; }

a#templates{ width:147px; background-image:url(/images/templatesTab.gif); }
a#templates:hover{ background-position:-147px 0; }
li.current_page_item a#templates{ background-position:-147px 0; }

a#packages{ width:147px; background-image:url(/images/packagesTab.gif); }
a#packages:hover{ background-position:-147px 0; }
li.current_page_item a#packages{ background-position:-147px 0; }

a#login{ width:147px; background-image:url(/images/loginTab.gif); }
a#login:hover{ background-position:-147px 0; }
li.current_page_item a#login{ background-position:-147px 0; }

a#contactUs{ width:147px; background-image:url(/images/contactUsTab.gif); }
a#contactUs:hover{ background-position:-147px 0; }
li.current_page_item a#contactUs{ background-position:-147px 0; }


/* FOOTER */
#footer {
	margin-left: 10px;
	margin-right: 10px;
	clear: both;
	font-size: 11px;
	font-weight: bold;
	color: #999999;
}

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

#footerLeft {
	float: left;
}

#footerRight {
	float: right;
}




#title {
	padding: 10px;
}

/* PANELS */

.pageTitle {
	clear: both;
	margin-bottom: 10px;
	font-size: 32px;
	font-weight: bold;
	color: #FFFFFF;
}

.pageTitle .packages {
	color: #2d78c1;
}


.infoPanel {
	min-height: 20px;
	border: solid 1px #2d78c1;
	margin-bottom: 10px;
	color: #2d78c1;
	font-weight: bold;
	font-size: 12px;
	margin-left: 9px;
	padding: 5px 10px 5px 10px;
}

.formPanel {
	clear: both;
	border: solid 1px #2d78c1;
	color: #2d78c1;
	font-size: 12px;	
	font-weight: bold;	
	margin-bottom: 10px;
	margin-left: 9px;
	padding: 5px 10px 5px 10px;
}

*>.formPanel {

}

.joinPanel {
	width: 410px;
}

*>.joinPanel {
	width: 390px;
}

.formPanel .row {
	height: 20px;
	line-height: 20px;
	clear: both;
	padding: 3px 0px 3px 0px;
}

.formPanel .row .number {
	width: 20px;
	float: left;
}

.formPanel .row .label {
	width: 160px;
	float: left;
	text-align: right;
	padding-right: 10px;
}

.formPanel .row .message {
	z-index: 99;
}

.formPanel .row .forenameLabel {
	float: left;
	width: 70px;
}

.formPanel .row .input {
	width: 220px;
	float: left;
	text-align: left;
}

.formPanel .row input {
	float: left;
	border: solid 1px #2d78c1;
	width: 220px;	
}

.formPanel .row input.required {
	border: solid 1px #FF0000;	
}

.formPanel .row textarea.required {
	border: solid 1px #FF0000;	
}

.formPanel .row input.inUse {
	border: solid 1px #FF0000;	
}

.formPanel .row div.required {
	border: solid 1px #FF0000;	
}

.formPanel .row .titleInput {
	float: left;	
	width: 40px;
}

.formPanel .row .titleInput input {
	float: left;	
	width: 30px;
}

.formPanel .row .forenameInput {
	float: left;	
	width: 100px;
}

.formPanel .row .forenameInput input {
	width: 110px;
}

.formPanel .row .checkbox {
	float: left;
	text-align: center;
	width: 20px;	
	height: 20px;
}

.formPanel .row .checkbox input {
	width: 20px;
	height: 20px;	
	padding:0px;
	margin:0px;
}

.formPanel .row .submit input {
	width: auto;
	height: auto;
	border: 0px;
}

.formPanel .row .tAndCText {
	float: left;	
}

.tAndCText a {text-decoration:underline; color: #2D78C1;}
.tAndCText a:active { }
.tAndCText a:visited  { }
.tAndCText a:hover {text-decoration:underline;}


/* LOGIN PANEL */

.loginPanel {
	clear: both;
	min-height: 20px;
	border: solid 1px #2d78c1;
	background-color: #EEEEEE;
	color: #2d78c1;
	sfont-size: 14px;	
	sfont-weight: bold;	
	margin-bottom: 10px;
	margin-left: 9px;	
	padding: 5px 10px 5px 10px;
}

.loginPanel {
	width: 400px;
}

*>.loginPanel {
	width: 390px;
}

.loginPanel .row {
	clear: both;	
	height: 24px;
	line-height: 24px;
	spadding: 5px 0px 5px 0px;
}

.loginPanel .row .label {
	width: 100px;
	float: left;
	text-align: right;
	padding-right: 10px;
	height: 20px;
	line-height: 20px;
}

.loginPanel .row .input {
	width: 140px;
	float: left;
	text-align: left;
	height: 20px;
	line-height: 20px;	
}

.loginPanel .row input {
	border: solid 1px #2d78c1;
	width: 120px;
}

.loginPanel .row .checkbox {
	float: left;
	text-align: left;
	height: 20px;
	line-height: 20px;
}

.loginPanel .row .input .loginButton {
	width: 60px;
	border: 0px;
}

.loginPanel .row .input .sendPasswordButton {
	width: 120px;
	border: 0px;
}

.overlay {
  position: relative;
  sbottom: 150px; /* or however you're getting it over */
  background: #06c;
  sopacity: 0.5;
  height: 100%;
  width: 100%;
 }

.transparentWhite {
 	background: url(/images/transparentWhite.png) ;
 }
 
 .transparentWhite1 {
 	background: url(/images/transparentWhite1.png) ;
 }
 
 .transparentWhite5 {
 	background: url(/images/transparentWhite5.png) ;
 }
 
 .transparentWhite10 {
 	background: url(/images/transparentWhite10.png) ;
 }
 
 .transparentWhite25 {
 	background: url(/images/transparentWhite25.png) ;
 }
 
 .transparentWhite50 {
 	background: url(/images/transparentWhite50.png) ;
 }
 
 .transparentWhite75 {
 	background: url(/images/transparentWhite75.png) ;
 }
 
  .transparentBlue25 {
 	background: url(/images/transparentBlue25.png) ;
 }
 
 
 /* TEMPLATES PAGE */
 
.templatesText {
	width: 840px;
	margin-bottom: 10px;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 12px;
	margin-left: 9px;
	line-height: 18px;
	padding: 5px 0px 5px 0px;	
}
 .templatesScroller {
 	float: left;
  	width: 250px;
 	sheight: 300px;
 }
 
 .templatesScroller .type {
 	line-height: 32px;
 	color: #FFFFFF;
 	text-transform: uppercase;
 	font-size: 16px;
 	font-weight: bold;
 }
 
 #standardTemplates {
 	margin-left: 10px;
 }
 
 #advancedTemplates {
 	margin-left: 45px;
 }
 
 #professionalTemplates {
 	margin-left: 45px;
 }
 
 
 
 .templatesScroller .templateNavigate {
 	margin-top: 10px;
 	width: 250px;
 	height: 25px;
 }
 
 .templatesScroller .templateNavigate .prevPage {
 	float:left;
 	padding-left: 10px;
 }
 
 .templatesScroller .templateNavigate .nextPage {
 	float:right;
 	padding-right: 10px;
 }
 
 .templatesScroller .templateNavigate .browse {
 	line-height: 24px;
 	font-size: 12px;
 	font-weight: bold;
 	color: #FFFFFF;
 	cursor: hand;
 	cursor: pointer;
 }
 
 
 /* 
    root element for the scrollable. 
    when scrolling occurs this element stays still. 
*/ 
#templates div.scrollable { 
    /* required settings */ 
    position:relative; 
    overflow:hidden; 
    width: 250px; 
    height:200px; 
} 
 
/* 
    root element for scrollable items. Must be absolutely positioned 
    and it should have a extremely large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element. 
*/ 
#templates div.scrollable div.items { 
    /* this cannot be too large */ 
    width:20000em; 
    position:absolute;
} 
 
/* 
    a single item. must be floated in horizontal scrolling. 
    typically, this element is the one that *you* will style 
    the most. 
*/ 
#templates div.scrollable div.items .item 	{ 
    float:left; 
    width: 250px;
} 
 
/* you may want to setup some decorations to active the item */ 
#templates div.items div.active { 
    border:1px inset #ccc; 
    background-color:#fff; 
}

.templateImage {
	position: absolute;
	width: 200px;
	height: 150px;	
}

.viewTemplate {
	position: absolute;
}

.hidden {
	visibility: hidden;
}

.visible {
	visibility: visible;
}



.templateTable {
 	width: 250px;
 }

.templateTable .row {
	clear: both;
	width: 250px;
}

.templateTable .row .padding {
	float: left;
 	width: 25px;
}
 
.templateTable .title {
	float: left;
 	height: 25px;
 	line-height: 25px;
 	font-weight: bold;
 	text-transform: uppercase;
 	color: #FFFFFF;
}
 
.templateTable .row .templateThumb {
	float: left;
 	height: 150px;
 	width: 200px;
}
 
 .templateTable .join {
 	height: 25px;
 	line-height: 25px;
 	text-align: center;
 	font-size: 12px;
 	font-weight: bold;
 }
 
 .templateTable .join a {text-decoration: none; color: #FFFFFF; }
 
 
 .packagePanel {
 	float: left;
 	width: 300px;
 	height: 135px;
 	border: solid 1px #2d78c1;
 	margin-left: 10px;
 }
 
 *>.packagePanel {
 	width: 280px;
 }
 
 .packageInfoPanel {
 	float: left;
 	margin-left: 10px;
 	width: 550px;
 	height: 135px;
 	border: solid 1px #2d78c1;
 	padding: 0px 10px 0px 10px; 	
 }
 
 *>.packageInfoPanel {
 	width: 530px;
 }
 
 .packageInfoPanel p {
 	font-size: 14px;
 	font-weight: bold;
 	color: #2d78c1;
 }
 
 .packageInfoPanel .close {
 	float: right;
 	margin-top: 10px;
 	font-weight: bold;
 	color: #2d78c1;
 	cursor: hand;
 	cursor: pointer;
 }
 
 .packageSpacer {
 	clear: both;
 	height: 10px;
 }

.join {
 	width:100px;
 	float:left;
 	color: #2d78c1;
 	font-size: 14px;
 	font-weight: bold;
 	text-decoration: none;
 	margin-left: 10px;
}
 
 .moreInfo {
 	float: right;
 	color: #2d78c1;
 	font-size: 14px;
 	font-weight: bold;
 	text-decoration: none;
 	margin-right: 10px;
} 	


.contactInfoPanel {
	width: 460px;
	min-height: 20px;
	border: solid 1px #2d78c1;
	margin-bottom: 10px;
	color: #2d78c1;
	sfont-weight: bold;
	sfont-size: 12px;
	margin-left: 9px;
	padding: 5px 10px 5px 10px;
}

*>.contactInfoPanel {
	width: 440px;	
}

.contactPanel {
	width: 460px;
}

*>.contactPanel {
	width: 440px;
}

.contactPanel .input input {
	width: 240px;
}

.contactPanel .input textarea {
	width: 240px;
	height: 120px;
	border: solid 1px #2d78c1;
}

.contactPanel .row.textarea {
	height: 140px;
}

.errorPanel {
	color: #FF0000;
}

.messagePanel {
	color: #2d78c1;
}


#homePageText {
	position: relative;
	top: 30px;
	left: 10px;	
	color: #2d78c1;
	height: 200px;
	font-weight: bold;
}

#homePageText #lineOne {
	font-size: 24px;
	display: none;	
}

#homePageText #lineTwo {
	font-size: 36px;
	text-indent: 36px;
	display: none;	
}

#homePageText #lineThree {
	font-size: 28px;
	text-indent: 72px;
	display: none;	
	margin-top: 36px;
}

.homePageImages {
	position: relative;
	top: 100px;
	left: 50px;	
}
.homePageImages ul {
	margin: 0px;
	padding: 0px;
}

.homePageImages ul li {
	list-style:none;
	padding: 0px;
	margin: 0px;
	margin-right: 30px;	
	height: 150px;
	width: 130px;
	float: left;
	background: url(/images/blankPolaroid.png);
	display: none;
}

.homePageImages ul li .img {
	width: 120px;
	height: 120px;
	margin: 0px;
	padding: 0px;
}

.homePageImages ul li .text {
	width: 120px;
	height: 20px;
	margin: 0px;
	padding: 0px;	
}

#libraryLink a {
	font-size: 12px;
}

#welcome {
	font-size: 12px;
}

span.required {
	color: #bf0000;
}