/* live */
body{
	background-color:#aec4b7;
	position: relative;
}

.clear{
	clear:both;
	float:none;
}
	
.wrapper1 {
	background: url(/lib/images/layout/header-bg.png?v1) 0 0 repeat-x #fff;	
}

	.wrapper2 {
	}		

	.header,
	.subHeaderWrapper,
	.content{
		width:900px;
		margin:0 auto;
		position:relative;
		color: rgb(71, 30, 11);
	}
	
	/*
	 * HEADER
	 */
	.header {
		height:128px;
		width: 900px;
		margin:0 auto;
	}		







/* ----- MAIN TOP NAV ----- */

		.headerNav {
			position:absolute;
			right:0;
			bottom:20px;
			height:30px;		
			overflow:hidden;
			text-align: right;
		}
	
			.headerNav a,
			.headerNav a:visited {
				display: inline-block;
				margin-left: 1px;
				padding: 5px 10px;
				color:#6a8d80;
				text-decoration:none;
				font-size:14px;
				text-transform:lowercase;
				
				-moz-border-radius-topleft: 5px;
				-moz-border-radius-topright: 5px;
				-webkit-border-top-left-radius: 5px;
				-webkit-border-top-right-radius: 5px;
				border-top-left-radius: 5px;
				border-top-right-radius: 5px;

				-moz-transition: all 0.4s ease-out;
				-o-transition: all 0.4s ease-out;
				-webkit-transition: all 0.4s ease-out;
				transition: all 0.4s ease-out;  
				
			}

			.headerNav a:hover {
				background-color: #D7E2DB;
			}
			.headerNav a.active {
				background-color: #ffffff;
				color:#471E0B;
			}

/*()
			.headerNav a.active,
			.headerNav a.active:visited,
			.headerNav a.active:hover {
				xcolor:#471E0B;
				xbackground-color:#fff;

				x-moz-border-radius-topleft: 7px;
				x-moz-border-radius-topright: 7px;
				x-webkit-border-radius-topleft: 7px;
				x-webkit-border-radius-topright: 7px;

				xborder-radius-topleft: 7px;
				xborder-radius-topright: 7px;			
			}				
	
*/




/* ----- TIPPY TOP NAV ----- */

		.headerNav2{
			position:absolute;
			right:0;
			top:10px;
			text-align: right;
		}
	
			.headerNav2 a,
			.headerNav2 a:visited{
				padding: 5px 10px;

				color: #ffffff;
				text-decoration:none;
				font-size:13px;
				
				-moz-border-radius: 20px;
				-webkit-border-radius: 20px;
				-khtml-border-radius: 20px;
				border-radius: 20px;

				-moz-transition: all 0.4s ease-out;
				-o-transition: all 0.4s ease-out;
				-webkit-transition: all 0.4s ease-out;
				transition: all 0.4s ease-out;  

			}
			.headerNav2 a:hover{

				background-color: #D7E2DB;
				color: #6A8D80;

			}
	













		.headerLoggedInMessage{
			position: absolute;
			right:50px;
			top:60px;
		}
		
			.headerLoggedInMessage span{
				float:left; 
				padding-right:10px;
			}		
	
			.headerLoginBtn,
			.headerLoginBtn:visited,
			.tellAFriendBtn,
			.tellAFriendBtn:visited{
				border:1px solid #888AAB;
				-moz-border-radius: 3px;
				-webkit-border-radius: 3px;
				border-radius: 3px;		
				padding:2px 7px;
				background: url(/lib/images/layout/header-button-bg.png?v3) 0 0 repeat-x #8B8CAE;
				display:block;
				float:left;
				color:#fff;
				text-decoration:none;	
				font-weight:bold;		
			}
		
		.tellAFriendBtn,
		.tellAFriendBtn:visited{
			top:120px;
			right:50px;
			float:none;
			position:absolute;
		}
			
	
		.headerBook{
			left: 250px;
			top:117px;
			width:692px;
			height:308px;
			background:url(/lib/images/layout/billboard-book.png) 0 0 no-repeat;
			*background:none;
			*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/lib/images/layout/billboard-book.png");
			position:absolute;
		}
		
		.headerLogo{
			margin:0;
		}
			.headerLogo a {
				position:absolute;
/*				left:25px;			*/
				top:15px;
				height:0;
				overflow:hidden;
				padding-top: 84px;
				width: 278px;
				margin: 0 auto;
				display: block;
				background: url(../images/layout/logo.png) 0 0 no-repeat;		
				text-indent:-9999px;
			}
			
		.headerContent{
			position:absolute;
			width:220px;
			left:30px;
			bottom:94px;
			font-size:20px;
			line-height:133%;
		}


		/*
		 * SUB-HEADER
		 */
		.subHeader{
			background:#EDE9E7;
			padding-top:38px;
		}
			.subHeaderWrapper{
			}
		
			.subHeader h1{
				padding-bottom: 10px;
				font-size:50px;
				margin-bottom:0;
			}		
			
			.breadcrumbs{
				border-top:1px solid #ccc;				
				padding-bottom:61px;				
				color:#999;
				font-weight:bold;
				position:relative;
				left:-6px;
				font-size:1px;
			}		
				
				.breadcrumbs a,
				.breadcrumbs strong,
				.breadcrumbs em{
					padding:3px 6px;
					font-size:12px;
				}				
				.breadcrumbs em{
					font-style:normal;
					color:#ccc;
				}
				
				.breadcrumbs a,
				.breadcrumbs a:visited{
					color: #CC7E8E;
					text-decoration:none;
				}
				.breadcrumbs a:hover{
					background-color: #CC7E8E;
					color: #fff;
				}
				.breadcrumbs span{
					font-size:24px;
					font-family: "Lucida Sans Unicode", "Arial Unicode", Arial, Helvetica, sans-serif;
					color:#ccc;
					position:relative;
					bottom: -2px;
				}
				.breadcrubsNoSubNav{
					padding-bottom:0;
				}

			.subHeader .projectNav{
				position:absolute;
				bottom:0;
				left:0;
			}
				.subHeader .projectNav a,
				.subHeader .projectNav a:visited{
					padding: 9px 12px 6px 12px;
					color:#4C2512;
					font-size:14px;
					text-decoration:none;
					font-weight:bold;
					float:left;
					display:block;
				}
				
				.subHeader .projectNav a:hover{
					text-decoration:underline;
				}
				.subHeader .projectNav a.active{
					background-color:#fff;
				}				
				
				.subHeader .generatingPreviewBtn{
					display:none;
				}

		/*
		 * CONTENT
		 */
		.content {
			padding: 20px 0 20px 0;
			min-height: 400px;
			height: auto !important;
			*height: 400px;
		}

		.leftCol,
		.middleCol,
		.leftFullWidthCol,		
		.rightCol{
			width: 245px;
			padding: 0 30px 0 0;
			float:left;
		}
		
		.leftFullWidthCol{
			width:480px;
		}
		
		.rightCol{
			width:315px;
			padding:0 0 0 0px;
		}
		

.footer{
	color:#fff;
	padding: 0;
	font-size:12px;
	width: 900px;
	margin:0 auto;
	font-weight:bold;
	position:relative;
	height:60px;
}

	.footerCopyright{
		position:absolute;
		left:0;
		top:16px;
	}
	
		.footer a,
		.footer a:visited{
			color:#fff;
			padding-left:25px;
			text-decoration:none;
			font-weight:normal;
		}
		
		.footer a:hover{
			text-decoration:underline;
		}	
		
	.footerNav{
		position:absolute;
		right:0;
		top:16px;
	}		



/*
 * Project Pages
 */ 
.projectsTable,
.pagesTable{
	width:100%;
	margin: 1em 0;
}

	.projectsTable td,
	.pagesTable td,	
	.projectsTable th,
	.pagesTable th{
		text-align:left;
		padding:7px 17px;
	}
		
	.projectsTable th,
	.pagesTable th{
		background-color:#e5e5e5;
		color:#999;
	}
	.projectsTable a,
	.pagesTable a{
		font-weight:bold;
	}
	
	.projectsTable .titleRow,
	.pagesTable .titleRow{
		background-color:#999;
		color:#fff;
	}
		.projectsTable .titleRow h2,
		.pagesTable .titleRow h2{
			font-size:14px;
			color: #fff;
		}
		.projectsTable .helpMsg,
		.pagesTable .helpMsg{
			color:#fff;
			background:none;
			border:none;
			font-weight:normal;
			padding:0;
			margin:0;
		}

	.projectsTable .projectNav a,
	.projectsTable .projectNav a{
		margin-right: 10px;
		float:left;
	}
	.projectsTable .projectNav{
		width:auto;
	}	
		.projectsTable .projectNav .generatingPreviewBtn{
			float:right;
			background-color:#FFFF7F;
			color:#333;
			padding:2px 5px;
		}

	.pageSortCell{
		width:13px;
	}
	.pageReadyCheckboxCell{
		width:15px;
	}		
		

 
.wordCountDiv{
	font-size:10px;
}

.maxLengthMsgDiv {
	background-color:#FFFFBD !important;
	border:2px solid #CC0000;
	color:#CC0000;
	font-size:10px;
	padding:5px;
	width:390px;
}










#pageStats{
	background-color:#EEE;
	xborder:2px solid #ccc;
	padding:10px;
	margin:10px 0;
}




/*
 *  Add/edit Project styles
 */
#ShadowBox td{
	padding:0;
}
#row_template_id ul.book {
	position: relative;
	height: 140px;	
	display: block;
	margin:4px;
}
#row_template_id ul.book li {
	display: block;
	height: 100px;
	width: 100px;
	position: absolute;
}
#row_template_id ul.book .li1 { left: 0px;   top: 10px; z-index: 50; }
#row_template_id ul.book .li2 { left: 60px;  top: 0px;  z-index: 40; }
#row_template_id ul.book .li3 { left: 120px;  top: 10px; z-index: 30; }
#row_template_id ul.book .li4 { left: 180px; top: 20px; z-index: 20; }
#row_template_id ul.book .li5 { left: 240px; top: 10px; z-index: 10; }

#row_template_id ul.book li:hover { z-index:100;}

#row_template_id ul.book img {
	padding: 5px;	
	background: url(/lib/images/books/shadow.png) 0 0 no-repeat transparent !important;
	*background: url(/lib/images/books/shadow_ie6.png) 0 0 no-repeat transparent;
}


/*
 *  Add/edit/view Pages styles
 */
.editPageTable input.textField,
.editPageTable textarea.textareaField{
	width: 400px;	
}

.editPageTable textarea{
	height:250px;
}


/*
 * Drag and Drop Table Styles
 */
tr.ready{
	background-color:#cfc;
}
tr.writing{
	background-color:#eee;
} 
tr.dragging{
	background-color:#FFC;
}
	tr td.handle{
		cursor:move;
	}
		tr td.handle div{
			cursor:move;	
			width: 13px;
			height: 0;
			padding-top:13px;
			overflow:hidden;
			background:url(/lib/images/draggable.png) 0 0 no-repeat;
			margin:auto;
		}
		tr.dragging td.handle div{
			background-position:0 -20px;
		}
		tr.saving td.handle div{
			background:url(/lib/images/throbber.gif) 0 -20px no-repeat;
		}
		tr td.handle input{
			width: 21px;
		}

		
/*
 * Ready checkbox
 */
.readySaving{
	width: 13px;
	height: 0;
	padding-top:13px;
	overflow:hidden;
	margin:auto;
	background:url(/lib/images/throbber.gif) 0 -20px no-repeat;
	float:left;
}



/* Help Messages*/
.helpMsg{
	background-color:#E5EFF3;
	border:2px solid #81ACBF;
	margin:5px 0 15px 0;
	padding:5px 15px;
}


/*****  Form Fields ******/
.textField,
.selectField,
.textareaField{
	border: 1px solid #ccc;	
}


/*
 *  Buttons
 */ 
.btn,
.btn:visited{

	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	-khtml-border-radius: 20px;
	border-radius: 20px;

     -moz-transition: all 0.2s ease-out;  /* FF4+ */
       -o-transition: all 0.2s ease-out;  /* Opera 10.5+ */
  -webkit-transition: all 0.2s ease-out;  /* Saf3.2+, Chrome */
          transition: all 0.2s ease-out;  


	background-color: #AC1435;
	color:#fff;
	border:none;
	font-weight:bold;
	padding:8px 16px;
	cursor:pointer;
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	margin:10px 0;
}
a.btn,
a.btn:visited{
	display:inline-block;
x	float:left;
x	clear:both;
	text-decoration:none;
}
.btn:hover{
	xbackground-color:#FF1D4D;
	background-color: #fa1e4f;
}

.yesNoTable td{
	padding:1em 2em 1em 0;
}

.noBtn,
.noBtn:visited
a.noBtn,
a.noBtn:visited{
	background-color:#ccc;
	color:#666;
}

.noBtn:hover{
	background-color:#aaa;
	color:#333;
}





body.body-faq .content {}
body.body-faq .content dl {
	margin: 40px 0;
	}
body.body-faq .content dt {
	color: rgb(172, 19, 52);
	margin: 10px 0;
	font-weight: bold;
	}
body.body-faq .content dd {
	margin: 5px 0 5px 10px;
}

body.body-faq .content ul {
	margin: 5px 0 5px 40px;
}


div.helpMsg {
	padding: 0;
	background-color: transparent;
	border: none;
	margin: 0;
	}













.facebook {
	clear: both;
	position: absolute;
	right: 0;
	bottom: 0;
	width: 111px;
	height: 111px;
	background: url(/lib/images/facebook2.gif) 0 0 no-repeat transparent;
	text-indent: -9999px;
	z-index: 100;
}
.facebook a {
	display: block;
	width: 111px;
	height: 111px;
}








/* adding icons 100417 js */

/* add locks to private/public options on projects/page/edit */

div.radioDiv_addpage_private_1 {
	padding: 10px 10px 5px 25px;
	background: url(/lib/images/icon-sprite.png) 0px -5px no-repeat;
	}
div.radioDiv_addpage_private_0 {
	padding: 5px 10px 10px 25px;
	background: url(/lib/images/icon-sprite.png) 0px -46px no-repeat;
	}



























/* ----- QUICKTIPS ------ */

div.quicktips {
	margin: 20px 0;
	padding: 20px 20px 20px 100px;
	background: url(/lib/images/lightbulb.png) 20px 30px no-repeat #ffee99;


	-moz-box-shadow: 0px 3px 4px #ccc;
	-webkit-box-shadow: 0px 3px 4px #ccc;          /* x-offset y-offset radius color */          /* safari and chrome can do rgba colors */
	box-shadow: 0px 3px 4px #ccc;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#cccccc')";  /* For IE 8 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#cccccc'); /* For IE 5.5 - 7 */

	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	border-radius: 10px;
	}
div.quicktips h3 {
	font-size: 16px;
	font-weight: bold;
	padding: 0;
	margin: 10px 0;
	}
div.quicktips ul {
	list-style: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	}
div.quicktips li {
	list-style: none;
	list-style-type: none;
	margin: 0px;
	padding: 5px 0;
	font-size: 12px;
	}






/* ----- ready to order ----- 

#readyToOrderMsg{
	background-color:#FFC;
	border:2px solid #FC6;
	padding:7px;
	margin:7px 0;
}
*/


#readyToOrderMsg {
	margin: 20px 0;
	padding: 20px 20px 20px 100px;
	background: url(/lib/images/book.png) 20px 20px no-repeat #FFC;


	-moz-box-shadow: 0px 3px 4px #ccc;
	-webkit-box-shadow: 0px 3px 4px #ccc;          /* x-offset y-offset radius color */          /* safari and chrome can do rgba colors */
	box-shadow: 0px 3px 4px #ccc;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#cccccc')";  /* For IE 8 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#cccccc'); /* For IE 5.5 - 7 */

	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	border-radius: 10px;
}



/*

<div class="msgDiv goodMsgDiv" id="goodMsgDiv">
	<div class="msgWrapper">Success:
		<ul>
			<li>Preview requested.  You will receive an email when the preview is ready - this may take up to 10 minutes.</li>
		</ul>
	</div>
</div>

*/





/* MESSAGING */

.msgDiv {
	margin: 20px 0;
	padding: 20px 20px 20px 100px;

	-moz-box-shadow: 0px 3px 4px #ccc;
	-webkit-box-shadow: 0px 3px 4px #ccc;          /* x-offset y-offset radius color */          /* safari and chrome can do rgba colors */
	box-shadow: 0px 3px 4px #ccc;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#cccccc')";  /* For IE 8 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#cccccc'); /* For IE 5.5 - 7 */

	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	border-radius: 10px;

	color: white;
	font-size: 16px;
	font-weight: bold;
	}

.msgDiv .msgWrapper {
	padding: 0;   
	margin: 0;   
	}
.msgDiv a,
.msgDiv a:visited,
.msgDiv a:hover{
	color:#fff;
	}
.msgDiv ul{
	margin: 10px 0;
	padding: 0;
	list-style: none;
	font-size: 12px;
	font-weight: normal;
	}
.msgDiv li {
	padding: 0;
	margin: 0;
	list-style: none;
	}
.badMsgDiv {
	background: url(/lib/images/msg-bad.png) 20px 20px no-repeat #090;
	}
.goodMsgDiv {
	background: url(/lib/images/msg-good.png) 20px 20px no-repeat #090;
}
.warningMsgDiv {
	background: url(/lib/images/msg-warn.png) 20px 20px no-repeat #090;
	}


/* "your book must have 29 pages " */

#pageStats {
	margin: 20px 0;
	padding: 20px 20px 20px 100px;

	-moz-box-shadow: 0px 3px 4px #ccc;
	-webkit-box-shadow: 0px 3px 4px #ccc;          /* x-offset y-offset radius color */          /* safari and chrome can do rgba colors */
	box-shadow: 0px 3px 4px #ccc;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#cccccc')";  /* For IE 8 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#cccccc'); /* For IE 5.5 - 7 */

	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	border-radius: 10px;

	background: url(/lib/images/info.png) 20px 20px no-repeat #7F99B2;
	color: white;
	font-size: 14px;
x	font-weight: bold;
	}








/* project Status */


.projectStatusDisplay {
	margin: 20px 0;
	font-size: 32px;
	color: #999;
	text-align: center;
	}


/* form fields */

textarea, input[type="text"] {
	font-family: courier, sans-serif;
	color: #666;
	font-size: 14px;
	margin: 10px 0;
	padding: 10px;
	}





/* idea center */



body.body-ideas div.leftFullWidthCol {
	width: 100%;
	}
body.body-ideas div.rightCol {
	display: none;
	}
body.body-ideas div.content h1 { /* hide the default title*/
	display: none;
	}


/* nav area */

body.body-ideas div#ideas__nav {
	text-align: center;
	}
body.body-ideas div.ideas-menu {
	margin: 20px 0;
	padding: 10px 0;
	font-size: 12px;
	color: #ccc;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	}
body.body-ideas div#ideas__nav p.title-graphic {
	padding: 10px;
	}
body.body-ideas div.ideas-menu p.title-graphic img {
	}
body.body-ideas div.ideas-menu a {
	padding: 0 15px 0 0;
	text-decoration: none;
	}
body.body-ideas div.ideas-menu a:hover {
	text-decoration: underline;
	}

div.ideas-menu {
	text-align: center;
	}
div.ideas-menu a {
	border: 0 none;
	outline: none;
	padding: 10px;
	}
div.ideas-menu img {
	width: 180px;
	height: auto;
     -moz-box-shadow: 1px 1px 5px #999; /* FF3.5+ */
  -webkit-box-shadow: 1px 1px 5px #999; /* Saf3.0+, Chrome */
          box-shadow: 1px 1px 5px #999; /* Opera 10.5, IE9, Chrome 10+ */
	border: 1px solid #eee;
	}


/* content area */

body.body-ideas div.leftFullWidthCol h1 {
	display: block;
	width: 75%;
	margin: 20px auto 40px;
	text-align: center;
	}
body.body-ideas div.words {
	width: 50%;
	float: left;
	}
body.body-ideas div.words h2 {
	}
body.body-ideas div.words p {
	}
body.body-ideas div.words p strong {
	}
body.body-ideas div.image {
	width: 40%;
	float: right;
	color: #999;
	font-family: Helvetica;
	font-size: 11px;
	line-height: 15px;
	}
body.body-ideas div.image img {
	width: 100%;
	height: auto;
     -moz-box-shadow: 1px 1px 5px #999; /* FF3.5+ */
  -webkit-box-shadow: 1px 1px 5px #999; /* Saf3.0+, Chrome */
          box-shadow: 1px 1px 5px #999; /* Opera 10.5, IE9, Chrome 10+ */
	border: 1px solid #eee;
	}
body.body-ideas div.image p.quote {
	display: block;
	margin: 20px 0;
	width: 50%;
	}
body.body-ideas div.image p.name {
	display: block;
	margin: 20px 0;
	width: 75%;
	text-align: right;
	color: #333;
	text-transform: uppercase;
	font-size: 9px;
	}