@charset "UTF-8";
/* CSS Document */

/* Colour reference
 
background-main: #F7F5ED
background-border-main: #EAEAE6
normal text: ##32260c
links: #38FF0E
headings: #77F6FF
main content bg: #DCAFFF
*/



/*------ RESET ------*/
body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, blockquote, textarea {margin: 0; padding: 0; border: 0;} 


/*------ DEFAULT STYLES ------*/

/*div {border: 1px solid #f5f5f5;}*/
body {font-family: Arial, Helvetica, Sans-Serif; font-size: 62.5%;/* 10px */ line-height: 1.6; /* 1.2x10=12px */ color: #333;} 

a:link, a:visited {color:#666; text-decoration: none;} 
a:hover {color:#cc3333; text-decoration:none;}
p, a {font-size:1.2em; /* 12px */ margin: 10px 0; line-height: 1.6em;}
h1 {font-size:2.4em; /* 24px */}
h2 {font-size:1.8em; /* 15px */ line-height: 2; color:#000;}
h3 {font-size:1.2em; color:#666;margin:4px 0;}

hr {margin:10px 0;}

.title {
	color:#c00;
}

/*-------------- NAVIGATION ------------------*/



/*-------------- WRAPPERS --------------------*/

#wrapper-outer {
	margin: 0 auto;
	width: 960px;
	min-height:740px;
	background-image:url('images/logo.png');
	background-repeat: no-repeat;
	
}

#header {height:85px;}
#header img {
	margin-top:20px;
	margin-left:110px;
}

	

#wrapper-inner1 {
	margin: 0px 100px 10px 100px;
	width: 800px;
	min-height:600px;
	border-top: 3px solid #1f1f1f;
	border-bottom: 3px solid #1f1f1f;
}
#wrapper-inner2 {
	min-height:595px;
	border-top: 1px solid #bdbdbd;
	border-bottom: 1px solid #bdbdbd;
	margin: 3px 0;
}


#content {

	margin: 20px 5px;
}

#main, #preview {
	padding-right:260px;
}

#sidebar {
	background-color:#f5f5f5;
	margin-left:20px;
	float:right;
	width:200px;
	padding:20px;
	min-height:510px;
}

#footer {text-align:center;}

#navigation {float:right;margin-right:60px;}
#navigation ul li {
	float:left;
	padding:5px 14px;
	background-color:#f5f5f5;
	list-style:none;
	color: white;
	margin-left:1px;
}


#navigation ul li a:link, #navigation ul li a:visited {

	color:#333;
}


#navigation ul li:hover {
	background-color:#E3E3E3;
	border-bottom:2px solid #C00;
}

#footer, #footer a {
	font-size: 1em;
}


/*----------------- STYLING -------------------*/

#content p.quote {
	font-size:2em; 
	line-height:1.4;
	letter-spacing:1.2;
}

#content p.byline {
	font-size:1.5em;
	line-height: 1.2;
	color:#999;
}

#sidebar p.quote {
	font-size:1em; color:#999;
}


#preview p {
	margin:10px 0;
}

#preview h1 {
	font-size:1.2em;
}

#preview h3 {
	color: #c00;
	font-size:1.4em;
	margin-top:20px;
}

#preview ul li {
	margin-left:20px;
}

#previous_next {
	margin:10px 0;
}


/*----------------- MISC SELECTORS ----------------------*/
.floatright {float:right;}
.floatleft {float:left;}
.clearleft {clear:left;}
.clearright {clear:right;}
.clearboth {clear:both;}
.marginright {margin-right:20px;}
.marginleft {margin-left:20px;}
.marginbottom {margin-bottom:20px;}
.margintop {margin-top:20px;}

/*------------------ BUY BUTTON --------------------*/
a#buybutton, a#buybutton:visited {  
	margin-top:10px;
	float:left;
	display:block;
	background-color:#404040; 
	width: 164px; 
	height: 35px;
	line-height:35px;
	/*padding:16px 0;  */
	text-align:center;  
	font-size:1.3em;
	text-transform:uppercase;
	border-radius: 2px;  
	-moz-border-radius: 2px;  
	-webkit-border-radius: 2px;
	color:#FFF;  
	text-decoration: none;
} 
a#buybutton:hover {background-color:#2F2F2F;} 
a#buybutton:active {background-color:#000;}  




hr.d {border: none 0; 
	border-top: 1px solid #ccc;
	height: 1px;
	margin: 5px auto;
	text-align: left;
	}
	
	
/*----------------------------- TEXTFIELD --------------------------------*/	
	
.textfield_effect    {
    /*we will first set the border styles.*/
	margin:10px 0 5px 0;
    border-width: 1px;
    border-style: solid;
    border-color: #999999;
    /*we are now going to add in the shadow image that we created earlier*/
    background-image: url(back_field.gif);
    background-repeat: repeat-x;
    /*I am going to add some text formatting of my own*/
    font-size: 1em;
    color: #333333;
    width: 200px;
    height: 15px;
    }
 
/*we are now going to style how the textfield will look when we
hover over it and when we actually have it selected*/
 
.textfield_effect:hover    {
    border-color: #64acd8;
    border-width: 1px;
    }
 
.textfield_effect:focus    {
    border-color: #64acd8;
    border-width: 1px;
    }
.textfield_button, .textfield_button:visited {
	float:right;
	padding:5px 10px;
	margin-bottom:10px;
	background-color:#404040;
	color:#fff;
	border-radius: 2px;  
	-moz-border-radius: 2px;  
	-webkit-border-radius: 2px;
}
.textfield_button:hover {background-color:#2F2F2F;}
.textfield_button:active {background-color:#000;}

.bob {
	padding:10px;
	background-color:#f5f5f5;
	
}