/*  
Originally created by Jason Fuller of Juxtaprose fame, (c) copyright 2008
*/

body {
	background: #2B2A2B; 
	color: #000;
	margin: 0;
	padding: 0;
	font-family: verdana, helvetica, sans-serif;
	font-size: 80%;
	text-align: left;	
}

html {
	overflow: scroll;
}

/* centering and framing */
#wrap {
	position: relative;
	height: inherit;
	margin-left: auto;
	margin-right: auto;
	padding: 0px 0px 30px 0px; /*top, right, bottom, left*/	
	width: 1200px;
	height: 860px; /* ie-6 only */
	min-height: 860px;
	background: #fff; 	
}

.identity #wrap, .print #wrap, .web #wrap {
	height: 1000px; /* ie-6 only */
	min-height: 1000px;
}

html>body #wrap, .identity #wrap {
	height: auto; /* override ie-6 only rule above */
}

/* masthead */
#masthead {
	position: relative;
	width: 1200px;
	height: 188px;
	background: #8A73B4;
	margin: 0;
	padding: 0;
}

.books #masthead {
	padding-top: 8px;
	background: #C6C32E;
}

.packaging #masthead {
	padding-top: 8px;
	background: #248CB6;
}

.identity #masthead {
	padding-top: 8px;
	background: #F06B37;
}

.print #masthead {
	padding-top: 8px;
	background: #51B8A9;
}

.web #masthead {
	padding-top: 8px;
	background: #F1AD33;
}

.about #masthead, .contact #masthead, .services #masthead {
	padding-top: 8px;
	background: #8A73B4;
}

#masthead h1 span {
	display: none;
}

#masthead h1 {
	float: left;
	margin: 0;
	padding-left: 50px;
}

#masthead h4 {
	margin: 0px 0px 0px 550px; /*top, right, bottom, left*/
	padding-top: 25px;
	line-height: 2.0em;
	font-size: 1.0em;
	font-weight: normal;
}

.packaging h4, .print h4, .about h4, .services h4, .contact h4 {
	color: #fff;
}

.byline {
	padding-left: 80px;
	font-weight: bold;
	font-size: 1.0em;
}

#masthead p {
	position: absolute;
	top: 145px;
	left: 465px;
	margin: 0;
	padding: 0;
	color: #fff;
	font-size: 1.0em;
	font-weight: bold;
	letter-spacing: 0.1em;
}

/* nav1 */
#nav1 {
	position: absolute;
	top: 220px;
	right: 50px;
	width: 1200px;
	color: #8A73B4;
	z-index: 100;
}

.home #nav1 {
	top: 650px;
	right: 50px;
}

.mainnav p {
	margin: 0;
	padding: 0;
	font-size: 1.0em;
	text-align: right;
}

#nav1 a, .home #nav1 a {
	text-decoration: none;
	color: #8A73B4;
	font-weight: bold
}

#nav1 a:hover {
	text-decoration: underline;
	color: #F06B38;
}

.home #homenav, .books #booknav, .packaging #packagingnav, .identity #identitynav,
 .web #webnav, .print #printnav, .about #aboutnav, .services #servicenav, .contact #contactnav {
	color: #F06B38 !important;
}

/* home page main*/
#main { 
	position: relative;
	width: 1200px;
	margin: 0;
	padding: 0;
}

.homeimg {
	float: right;
}

#books {
	position: absolute;
	top: 50px;
	left: 60px;
	width: 360px;
	height: 180px;
}

.booktext p {
	margin: 0;
	padding: 0;
}

.booktext {
	width: 180px;
	height: 180px;
	text-align: center;
	padding-top: 0px;
	background: #C6C32D;
	color: #fff;
}

.booktext a {
	padding-top: 80px;
	color: #fff;
	width: 180px;
	height: 100px;
	display: block;
	text-decoration: none;
	font-size: 1.0em;
	font-weight: bold;
	z-index: 1;
}

.booktext a:hover {
	color: #fff;
	background: #C6C32D;
	text-decoration: underline;
	/*text-underline-style: dotted;*/
	background-image: url("images/reverse-books.jpg");
}

#identity {
	position: absolute;
	top: 50px;
	left: 600px;
	width: 360px;
	height: 180px;
}

.idtext p {
	margin: 0;
	padding: 0;
}

.idtext {
	width: 180px;
	height: 180px;
	text-align: center;
	padding-top: 0px;
	background: #F06B38;
	color: #fff;
}

.idtext a {
	padding-top: 80px;
	color: #fff;
	width: 180px;
	height: 100px;
	display: block;
	text-decoration: none;
	font-size: 1.0em;
	font-weight: bold;
	z-index: 1;
}

.idtext a:hover {
	width: 180px;
	height: 100px;
	color: #fff;
	background: #F06B38;
	text-decoration: underline;
	background-image: url("images/reverse-identity.jpg");
}

#packaging {
	position: absolute;
	top: 230px;
	left: 240px;
	width: 360px;
	height: 180px;
}

.packagingtext p {
	margin: 0;
	padding: 0;
}

.packagingtext {
	width: 180px;
	height: 180px;
	text-align: center;
	padding-top: 0px;
	background: #258CB5;
	color: #fff;
}

.packagingtext a {
	padding-top: 80px;
	color: #fff;
	width: 180px;
	height: 100px;
	display: block;
	text-decoration: none;
	font-size: 1.0em;
	font-weight: bold;
	z-index: 1;
}

.packagingtext a:hover {
	color: #fff;
	text-decoration: underline;
	background-image: url("images/reverse-packaging.jpg");
}

#web {
	position: absolute;
	top: 230px;
	left: 780px;
	width: 360px;
	height: 180px;
}

.webtext p {
	margin: 0;
	padding: 0;
}

.webtext {
	width: 180px;
	height: 180px;
	text-align: center;
	padding-top: 0px;
	background: #F1AD35;
	color: #fff;
}

.webtext a {
	padding-top: 80px;
	color: #fff;
	width: 180px;
	height: 100px;
	display: block;
	text-decoration: none;
	font-size: 1.0em;
	font-weight: bold;
	z-index: 1;
}

.webtext a:hover {
	color: #fff;
	background: #F1AD35;
	text-decoration: underline;
	background-image: url("images/reverse-web.jpg");
}

#print {
	position: absolute;
	top: 410px;
	left: 60px;
	width: 360px;
	height: 180px;
}

.printtext p {
	margin: 0;
	padding: 0;
}

.printtext {
	width: 180px;
	height: 180px;
	text-align: center;
	padding-top: 0px;
	background: #52B8A9;
	color: #fff;
}

.printtext a {
	padding-top: 80px;
	color: #fff;
	width: 180px;
	height: 100px;
	display: block;
	text-decoration: none;
	font-size: 1.0em;
	font-weight: bold;
	z-index: 1;
}

.printtext a:hover {
	color: #fff;
	background: #51B8A9;
	text-decoration: underline;
	background-image: url("images/reverse-print.jpg");
}

#hometext {
	position: absolute;
	top: 440px;
	left: 600px;
	width: 520px;
}

#hometext p {
	font-size: 1.1em;
	line-height: 2.0em;
	margin: 0;
	padding: 0;
}

/* inside */
#rightcol {
	position: absolute;
	top: 65px;
	left: 475px;
	margin: 0;
	padding: 0;
}

.web #rightcol {
	left: 524px;
}

.print #rightcol {
	left: 678px;
}

/*about, contact page*/
.twocol {
	margin-top: 100px;
}

.twocol img {
	float: left;
	margin-left: 250px;
}

.twocol p {
	margin-left: 555px;
	width: 600px;
	line-height: 2.0em;
	color: #0A0708;
}

h2 {
	margin-left: 555px;
	font-size: 1.2em;
	color: #0A0708;
}

/*services*/
.services #main {
	padding-top: 80px;
	margin-left: 130px;
	line-height: 1.8em;
}

.services #main img {
	float: left;
	padding-top: 5px;
	padding-right: 30px;
	padding-bottom: 30px;
	clear: both;
}

.services #main span {
	font-size: 1.1em;
	font-weight: bold;
}

.cola {
	float: left;
	width: 450px;
}

.colb {
	float: left;
	width: 470px;
	margin-left: 100px;
}

.cola p, .colb p {
	font-size: 1.0em;
	padding-bottom: 25px;
	clear: both;
}

.negleft {
	padding-right: 10px !important;
	margin-left: -30px;
}

#main a {
	color: #0A0708;
	text-decoration: underline;
}

#main a:hover {
	text-decoration: none;
}

/* color blocks */
.top {
	margin: 0;
	padding: 0;
	width: 676px;
	height: 25px;
	color: #fff;
	background: #F06B37;
}

.web .top, .web .middle, .web .bottom {
	width: 624px;
}

.print .top {
	width: 473px;
}

.middle {
	margin-top: 20px;
	padding: 0;
	width: 676px;
	height: 25px;
	color: #fff;
	background: #51B8A9;
}

.print .middle {
	margin-top: 10px;
	width: 473px;
}

.bottom {
	margin-top: 20px;
	padding: 0;
	width: 676px;
	height: 25px;
	color: #fff;
	background: #248CB6;
}

.print .bottom {
	margin-top: 10px;
	width: 473px;
}

.blocktitle {
	padding-top: 3px;
	padding-left: 20px;
	font-weight: bold;
	margin: 0;
}

.clr {
	clear: both;
}

/* rollover */
.thumbs {
	margin-top: 15px;
	margin-bottom: 0px;	
	padding: 0;
}

.thumbbox {

}

.web .thumbs {
	height: 164px;
}

ul {
	margin: 0;
	padding: 0;	
}

.grayline {
	margin: 0;
	padding-top: 25px;
	padding-bottom: 0px;
	height: 150px;
	min-height: 150px;
	width: 676px;
	border-bottom: 1px solid #BCBEC0;
	clear: both;
}

li {
	float: left;
	margin-right: 15px;
	padding: 0;
	display: inline;
	text-decoration: none;	
}

#leftcol {
	position: relative;
	padding-top: 65px;
	margin-left: 50px;
	background-image: url("images/loading.GIF");
	background-repeat: no-repeat;
	background-position: 135px 150px;
}

.print #leftcol {
	background-position: 205px 150px;
}

#bigimage {
	top: 238px;
	left: 50px;
	min-height: 360px;
}

.identity #bigimage {
	min-height: 275px;
}

.packaging #bigimage {
	min-height: 279px;
}

.web #bigimage {
	min-height: 297px;
}

.books #main {
	min-height: 750px;
}

#lg1 {
	display: none;
}

.info {
	display: none;
}

#info1 {
	display: block;
}

.info p {
	margin-top: 10px;
	padding: 0;
	line-height: 2.0em;
	font-size: 0.95em;
}

.info a {
	color: #2676B5 !important;
	text-decoration: none;
}

.info a:hover {
	color: #F06B37;
}

.imagebox {
	display: none;
}

#noleft {
	margin-top: 13px;
	margin-left: -30px !important;
}

#threeleft {
	margin-left: 3px;
}

.pad50 {
	padding: 5px 50px 0px 50px; /*top, right, bottom, left*/
}

.pad25 {
	padding: 25px 25px 0px 25px; /*top, right, bottom, left*/
}

.pad10 {
	padding: 25px 0px 0px 100px; /*top, right, bottom, left*/
}

.top15 {
	padding-top: 15px;
}

.books .bottom {
	margin-top: 55px;
}

.smfo {
	font-size: 0.85em;
	margin-left: 40px;
}

.sprds p {
	position: absolute;
	top: 360px;
	left: 0px;
	margin: 0;
	padding: 0;
	font-size: 0.85em;
	color: #808284;
	font-weight: bold;
}

.sprds ul {
	clear: both;
	margin: 0;
	padding: 0;
}

.sprds li {
	position: absolute;
	top: 337px;
	margin: 0;
	padding: 0;
}

.sprds #one {
	left: 0px;
}

.sprds #two {
	left: 118px;
}

.sprds #three {
	left: 249px;
}

.sprds #four {
	left: 353px;
}

.sprds #five {
	left: 458px;
}

.sprds #six {
	left: 583px;
}

.grayfo {
	margin: 0;
	padding: 0;
	font-size: 0.85em;
	color: #808284 !important;
	font-weight: bold;
}

/* Footer: Juxtaprose link */
#juxta {
	margin-left: auto;
	margin-right: auto;	
	margin-top: 10px;
	padding-bottom: 10px;
	width: 1100px;
	text-align: right;
	font-size: 0.85em;
}

#juxta a {
	color: #807E7E;
	text-decoration: none;
}

#juxta a:hover {
	color: #fff;
	text-decoration: underline;
}

#juxta span {
	font-style: italic;
}

.copy { 
	float: left;
}

.copy p {
	margin: 0;
	padding: 0;
	color: #807E7E;
}

#loading {
 	width: 200px;
 	height: 100px;
 	background-color: #c0c0c0;
 	position: absolute;
 	left: 50%;
 	top: 50%;
 	margin-top: -50px;
 	margin-left: -100px;
 	text-align: center;
}