/**
 * Common Stylesheet
 *
 * @author 		Zone
 * @email		info@zonecontent.com
 * @url 			http://www.zonecontent.com/
 * @copyright 	Copyright (c) 2009, zonecontent.com. All rights reserved.
 */

/* Global ****************/
html,
body {
	background:#BBE57F;
	background-image:url('../img/common/background.jpg');
	background-repeat: repeat-x;
	text-align:center;
}

#container {
	background-image:url('../img/common/WMS_BG.jpg');
	background-repeat: no-repeat;
	background-position:top;
	text-align:center;
	height:646px
}

.hidden	{
	position:absolute;
	top:-5000px;
}

/* Layout ****************/
#page {
	width:1000px;
	margin:0 auto;
	text-align:left;
	
}


#column-left {
	float:left;
	width:190px;
	
}
#column-right {
	float:left;
	background-image:url('../img/common/book.png');
	background-repeat: no-repeat;
	background-position:top left;
	width:620px;
	height:430px;
	padding: 10px 25px 10px 25px;

}

#logo
{
	float:left;
}

#nav
{
	float:left;
	width:645px;
	margin: 30px 0px 0px 20px;
	height: 72px;
	background-image:url('../img/common/nav.png');
	background-repeat: no-repeat;

}

#sign-in
{
	background-image:url('../img/common/signin_panel.png');
	background-repeat: no-repeat;
	background-position:top center;
	margin: 0 0 0 52px;
	width: 140px;
	height:400px
}

#signed-in
{
	background-image:url('../img/common/welcome_panel.png');
	background-repeat: no-repeat;
	background-position:top center;
	padding: 5px 0px 0px 8px;
	margin: 0 0 0 50px;
	width: 130px;
	height:450px
}


.bookpage
{
	float:left;
	width:270px;
	height: 430px;
	padding: 0px 20px 0px 20px
}

.bookpage.double
{
	float:left;
	width:580px;
	padding: 0px 20px 0px 20px
}

.right-side-characters-page
{
	float:left;
	
	padding: 10px 0px 0px 8px
}

.clear
{
	clear:both;
}


/* forms */

input.blur {
 color: #999;
}

.login-field
{
	margin: 7px 0px 0px 10px
}

.login-field input
{
	width:110px;
	border: solid 0px black;
	
}

#sign-in-fields
{
	padding-top:40px;
	

}

.form-field
{
	margin-bottom:10px;
	
}

.form-field.group
{
	margin-top:10px;
}

.login-field label
{
	color:white
}




div.sign-up
{
	margin-top:15px;
	margin-bottom:15px
}

div.error-panel

{
	margin: 10px 0px 10px 0px;
	border:solid 2px red;
	padding: 10px
}

div.error-panel p
{
	font-weight:bold
}

/* paging */

.paging
{
	
}

.left 
{
	float:left
}

.right 
{
	float:right
}



/* Typography ****************/
/* http://meyerweb.com/eric/thoughts/2007/06/04/ordering-the-link-states/ */
a {
	color:#3D1C4E;
	text-decoration:underline;	
}

a:link {
	color:#3D1C4E;	
}
a:visited {
	color:#000;
}
a:focus {
	color:#000;	
}
a:hover {
	color:#ff781f;
}
a:active {
	color:#3D1C4E;	
}

p,li,label,legend {
	font-family:Arial;
	font-size:100%;
	color:#3D1C4E;
	
}

a.video-link
{
	color:#ff781f;
}


strong
{
	font-weight:bold
}

.italic
{
	font-style:italic
}

h3
{
	font-weight:bold;
	color:#3D1C4E;
}

em
{ 
	font-style:italic
}

label { font-weight:bold}

p.intro 
{
	font-weight:bold;
	font-size: 110%
}

div.username
{
	color:#FF781F;
	font-weight:bold;
	margin-top: 0px;
	padding: 15px 0px 0px 15px;
	
}

/* Header ****************/

/*Nav*/

#primary-nav
{
	margin: 33px 0px 0px 60px;
	
}

#primary-nav li {
	float:left;
	color:white;
	margin: 0 0 0 20px;
}
#primary-nav li a {
	
	color:white;
}



/* Content ****************/

/*Flat text*/
.contentbox
{
	height:330px
}

.contentbox.second-column
{
	margin: 60px 0px 10px 0px;
	
}

p.content
{
	margin-bottom:10px;
}


/*home page*/

#our-favourites 
{
	width:240px;
	margin-left:20px;


}

.navigation
{
	width:19px;
	margin: 50px 5px 0px 0px;
	float:left
}


/*Application Page*/

#application-holder
{
    position:relative;
	width:900px;
	z-index:200;
}

.absolute
{
	position:absolute;
}


.application-description-box
{
	background-color:#5C833B;
	background-image:url('../img/common/application_description_gradient.png');
	background-repeat: repeat-x;
	background-position:top left;
	padding: 20px 10px 20px 10px;
	width:880px;
	position:relative;

	
}

.application-title
{
	font-size:150%;
	font-weight:bold;
	color:White;
	
}

.application-description
{
	font-size:100%;
	color:White;
}

.full-screen
{
	position:absolute; 
	left:0px; 
	top:0px; 
	width:100%; 
	height:100%; 
	background-color:black;
	z-index:100;
	overflow:hidden;
}
.full-screen-ie6
{
	width:1000%; 
	height:2000px;
}


/* Application Lists */

.app-paid-for
{
	display: block;
	background-image:url('../img/common/members_only.png');
	height:61px;
	width: 110px
}


.app-free
{
	display: block;
	background-image:url('../img/common/play_now.png');
	height:61px;
	width: 110px
	
}

.application-thumb-frame a:hover img.app-image,
.application-thumb-frame a.hover img.app-image
{
	display:none;
}



#application-thumb-holder 
{
	height: 350px;
}

#application-thumb-holder.gallery
{
	margin: 0px 0px 10px 0px;
}


.application-thumb-frame
{
	float:left;
	background-image:url('../img/common/application_frame.png');
	background-repeat: no-repeat;
	background-position:top left;
	width: 117px;
	height: 75px;
	margin: 20px 20px 0px 0px;
	padding:  18px 0px 0px 8px
	
}


.application-thumb-frame.large
{
	background-image:url('../img/common/application_frame_large.png');
	height: 118px;
	width:166px;
	margin: 10px 0px 0px 0px;
	padding: 19px 0px 0px 10px
}

.application-thumb-frame.last
{
	background-image:url('../img/common/application_frame_right.png');
	float:right;
	margin: 10px 0px 0px 0px;
	padding-left: 6px;
	padding-top:28px
}

.application-thumb-frame.free
{
	background-image:url('../img/common/application_frame_right_free.png');
}

.application-thumb-frame.middle
{
	background-image:url('../img/common/application_frame_right.png');
	margin: 10px 40px 0px 0px;
	padding-left: 6px;
	padding-top:28px
}

.username
{
	margin: 10px 0px 0px 0px;
}




/* Footer ****************/
#footer
{
	margin-top: 5px ;
	position:absolute;
	width:1000px
	
	
}

ul.footer
{
	float:right;
	margin-right:140px
}

ul.footer li
{
	float:left;
	padding: 0px 0px 0px  3px;
	color:#FFFFFF;
}

/* pipe delimted list*/
ul.footer li:before { content: "| "; }
ul.footer li:first-child:before { content: ""; }

ul.footer li a
{
	color:#FFFFFF;
	text-decoration:none
}


.gorilla-image
{
	z-index:1; 
	position:relative; 
	top:-165px; 
	left:-40px 
}

.gorilla-box
{
	height:0px
}


.speech-bubble-box

{
  height:0px
  	
}



/*CMS Settings*/

#cmsnav
{
	float:left;
	width:200px;
	display:block;
	margin-right:20px;
	border: solid 1px black
}

#cmscontent
{
	float:left;
}

.cmsbackground
{	
	background:#BBE57F;
	background-image:none;
}
	

/*Sign up success page*/

.thanks
{
	background-image:url('../img/common/thanks.png'); 
	width:545px; 
	height:300px; 
	margin-top:40px
}

.thanks-text
{
	padding:50px; 
	width:200px 
}

.newsletter-signup
{
	float:left;
	width:130px;
	margin-top:10px
}

.users-table
{
	padding:10px;
	
}

/*t+cs popup */
#terms
{
	
	background-color:White;
	padding:10px;
	border:10px solid #3D1C4E;
	position:absolute;
	top:-140px;
	right:-355px;
	z-index:100;
	width:290px;
	height:400px;
	overflow:auto;
}	

#terms.activate
{
	top:-276px;
	right:290px;
}

#popup-terms
{
	cursor:pointer;
}

.payment-buttons
{
	float:left; 
	width:120px;
	margin-top:30px
}


/*misc*/

.puffin-newsletter
{
	float:right;
}

#join-instructions
{
	list-style-type: decimal; 
	margin-left:10px
	
}

#join-instructions li
{
	margin:10px;
	list-style-type: decimal; 
}

#video-holder
{
	padding-left:30px;
	background-color:black;
	width:870px
}