@font-face {
	font-family: "Talvez Assim";
	src: url(/fonts/PintassilgoPrints_-_Talvez_Assim.ttf);
	}
@font-face {
	font-family: "Test";
	src: url(/fonts/PhaistosDisk_-_Layne_Moonflower.ttf);
	}
/* The below restores some sensible defaults */
strong { font-weight: bold }
em { font-style: italic }
/* set font size to 62.5% so that that 1em is equal to 10px based on the standard browser default of 16px */
body { 
/*	font-size: 62.5%; */
	font-family: "Lucida Grande", "Lucida Sans Unicode", Lucida, Arial, Helvetica, sans-serif; 
	color:#333333; 
	}

/* @group Font sizes */

/* basic font sizes */
p, ul, ol, dl, table, address, blockquote, fieldset, pre, form div {
	font-size: 0.875em;  /* 14px */
}

/* deal with likely (but certainly not all) inherited shrinkage */

ul p, ol p, table p, dl p, ul ul, ol ol, ul ol, ol ul, address p, li blockquote, blockquote p, form div div, form div p, fieldset div, table form div {
	font-size: 1em;
}

/* size headings using classic scale of 14, 16, 18, (21), 24 */

h1 { font-size: 2em;   /* 32px */ }
h2 { font-size: 1.6875em;   /* 27px */ }
h3 { font-size: 1.4em; margin-top: 10px; margin-bottom: 5px; /* 24px */ }
h4 { font-size: 1.2em; margin-top: 10px; margin-bottom: 5px;  /* 19px */ }
h5, h6 { font-size: 1em; margin-top: 10px; margin-bottom: 5px; /* 16px */ }

/* @end */

/* @group Margins */

p, ul, ol, dl, address, table, pre, fieldset {
	margin-top: 5px;
	margin-bottom: 1.385em; /* 18px */
}

form {
	margin-bottom: 1.125em; /* 18px */
}

ul ul, ol ol, ol ul, ul ol {
	margin-bottom: 0;
}

/* @end */

/* @group Lists */

.prose ul, ul.bullets, ul.bullets ul {	/* unordered lists more often DON'T require bullets except in extended bits of writing - use the .prose class or apply directly with .bullets */
	list-style-type: disc;
	margin-left: 1.385em; /* 18px */
}

ol {	/* ordered lists usually DO require bullets */
	list-style-type: decimal;
	margin-left: 2.077em; /* 27px */
}

dt {
	font-weight: bold;
	margin-top: 1.385em; /* 18px */
}

/* @end */



/* Author styles  
----------------------------------------------------------------------------------------- */
h1, h2 {
	font-family:"Talvez Assim",Verdana, Arial, Helvetica, sans-serif;
	}

h3, h4, h5, h6 {
	font-family:"Test",Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:#000000;
	}

body {
	background:#F7F6F2;
	background-image: url(/images/header-tracks-bg.jpg);
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: top center;
	text-align:center;
}

#container-outer {
	position: relative;
	top: 0;
	width: 100%;
	margin:auto;
}

#container {
	position:relative;
/*	background: #DCEDED;*/
	background: rgba(255,255,255,.3);
	min-width:1000px;
	max-width:1200px;
	min-height:5.3em;
	margin:0 auto;
	margin-top: -6px !important;
	z-index:0;
	box-shadow:2px 2px 4px rgba(0,0,0,0.5); 
	-webkit-box-shadow:2px 2px 4px rgba(0,0,0,0.5);
	-moz-box-shadow:2px 2px 4px rgba(0,0,0,0.5);
}

/********************************************************
* #container-body has padding so that the edge of the content  
* matches the edges of the container images.  
* Remember to adjust the #container top
* so that the #header image starts at the top.
********************************************************/
#container-body {
	position: relative;
	z-index:1;
	padding: 6px;
}

#header {
	position: relative;
	width:100%;
	max-width:900px;
	height:100%;
	min-height: 175px;
	margin: 0 auto;
	z-index:0;
}

#header-banner {
	position:absolute;
/*	background: #A1D5D8 url(/images/header-banner.jpg) no-repeat bottom;*/
/*	background: #A1D5D8 url(/images/header-2.jpg) no-repeat top center;*/
	top:0px;
  	left:0px;
  	width:100%;
  	height:175px;
	min-height:175px;
  	z-index:0;
}

#header-title {
 	position:relative;
	top:0;
	margin-right:auto;
	margin-left:auto;
	z-index:2;
}

/***********************************************************
* Header left, right and center blocks with absolute positioning
***********************************************************/ 

#header-logo { 
 	float:left;
	background: url(/images/bellibro-logo-5.png) top left no-repeat;
	width: 400px;
	height:175px;
	z-index:4;
}

#header-logo a {
	display : block;
	height: 138px;
}

#header-logo:hover { 
	background: url(/images/bellibro-logo-5-hover.png) top left no-repeat;
}

#header-tag {
	float: right;
	background: url(/images/tagline.png) right center no-repeat;
	width: 500px;
	height: 175px;
	text-align: center;
	z-index:3;
}

/***********************************************************
* Header left, right and center blocks with relative float positioning
***********************************************************/ 
/*
#header-left 
{ 
 	position:relative;
	float: left;
	width: 22.5%;
	margin-right:2.5%;
	z-index:3;
}

#header-center 
{
 	position:relative;
	float:left;
	width: 50%;
	z-index:3;
}

#header-right 
{ 
 	position:relative;
	float: left;
	width: 22.5%;
	margin-left:2.5%;	
	z-index:3;
}
*/
/************************************************
* If images are going in the header in the h1 tag
* then ident them off the screen
*************************************************/

#header h1 {
	text-decoration:none;
	text-indent : -9999px; 
}

#header h2 {
	text-decoration:none;
	text-indent : -9999px; 
}

/************************************************
* Navigation Menu
*************************************************/

ul.nav{
	clear:both;
	margin: 0;
	padding: 0;
	list-style:none;
	overflow:hidden;
	text-transform: lowercase;
	}

ul.nav li {
	float: left;
	display:inline;
	}

ul.nav a {
	display:block;
	width:80px;
	height:100%;
	margin-top:10px;
	margin-right:10px;
	text-align:center;
	padding-top:8px;
	font-size: 18px;
	font-weight:bold;
	font-style:italic;
	line-height:1em;
	text-decoration:none;
	text-shadow: 2px -2px 4px rgba(0,0,0,.5);
	color: #333333;
	}


ul.nav a:hover, 
ul.nav a:focus {
	color: #FFFFFF;
	font-style:normal;
	text-shadow: 2px 2px 4px rgba(0,0,0,.7);
	} 

/************************************************
* Content layout 
*************************************************/

#content-wrapper {
	position:relative;
	padding: 10px;
	text-align:left;
	min-width:1000px;
}

#content {
	float: left;
/*	width: 80%;*/
	width:900px;
	text-align: left;
}

#sidebar {
	float: right;
/*	width: 18%;*/
	width:200px;
}

#content-main {
	float: left;
/*	width: 70%;*/
	width: 650px;
}

#content-secondary {
	float: right;
/*	width: 25%;*/
	width:200px;
}

#footer {
	clear: both;
}

/************************************************
* Links layout 
*************************************************/
/*
The right order of link pseudo-classes: Link-Visited-Hover-Focus-Active.
*/

a {
  text-decoration: underline;
  color: #83784E;
}

/* Adds special style to an unvisited link. */

a:link {
  text-decoration: underline;
  color: #83784E;
}

/* Adds special style to a visited link. */

a:visited, a.visited {
  text-decoration: underline;
  color: #323531;
}

/* :hover - adds special style to an element when you mouse over it. */

a:hover, a.hover {
  text-decoration: none;
  color: #A38A2E;
}
	
	
/************************************************************
* Misc classes
************************************************************/

/* scrolling overflow ---------------- */		
.scroll{
	overflow:auto;
}

/* self-clear floats */
.group:after {
	content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* stop images overflowing their containers */
img {
	max-width:100%;
}

/* Required with strict doctype or extra padding may mysteriously
appear at the bottom of images */
img {
	display: block; 
	}	
 
/* boxes surounding text ------------- */

.main-box {
	background: #FFFFFF;
	background: rgba(255,255,255,.5);
	padding:10px;
	margin: 10px;
	border: 1px solid #999999;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	box-shadow:2px 2px 4px rgba(0,0,0,0.5); 
	-webkit-box-shadow:2px 2px 4px rgba(0,0,0,0.5);
	-moz-box-shadow:2px 2px 4px rgba(0,0,0,0.5);
}

.box {
	border: 2px #666666 dotted;
	padding: 0.5em;
	margin-bottom: 5px;
}

.title-box {
	background: #C0C0C0;
	display:block;
	height:100%;
	width: 95%;
	border: ridge 4px  #26D9BE; 
	border-radius: 40px 20px;
	-moz-border-radius: 40px 20px;
	-webkit-border-radius: 40px 20px;

}

h3.title-box {
	text-align:center;
	line-height:1.5em;
	margin:5px auto;	
}

.img-wrapper {
	display:inline;
	float:left;
	padding:4px;
	margin: 10px;
	border: 1px solid #999999;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	box-shadow:1px 1px 5px #999; 
	-webkit-box-shadow:1px 1px 5px #999;
	-moz-box-shadow:1px 1px 5px #999;
}

/* centering images ------------- */
.centeredImage {
	display:block;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

/* content title block ---------------- */
.content-title {
	padding:1px;
	background-color: #E6E3D6;
	border-color: #CFC9AF;
	border-style: solid;
	border-width: 1px;
	line-height: 1.3em;
}

.small {
 font-size: 0.75em;
 }