body {
    background-color: #b6463a;
    margin: 0px;
    padding: 0px;
}

body.younger {
    background-color: #f26522;
}

body.forbidden {
    background-color: #8560a8;
}

#header {
    background: transparent url('images/basiclayoutimages/Page Top 2.jpg') no-repeat;
    width: 630px;
    position: relative;
    margin: 24px;
    margin-bottom: 10px;
    margin-top: 10px;
    padding: none;
    border: none;
	/*background-repeat: no-repeat;
    background-color: transparent;*/
    z-index: 0;
    display: block;
}


#content {
    background: #b6463a url("images/basiclayoutimages/basicbackground.jpg") repeat-y;
    width: 650px;
    position: relative;
    /*margin: 0 auto;*/
    margin:0 auto;
    margin-top: -15px;
    margin-bottom: -15px;
    padding: 0px;
    border: 0px;
    /*background-repeat: repeat-y;
    background-color: #b6463a;*/
    display:block;
    z-index: 1;
}


#youngerheader {
    background: transparent url('images/basiclayoutimages/MG Page Top.jpg') no-repeat;
    width: 630px;
    position: relative;
    margin: 20px;
    margin-bottom: 10px;
    margin-top: 10px;
    margin-left: 40px;
    padding: none;
    border: none;
	/*background-repeat: no-repeat;*/
    z-index: 5;
}

#youngercontent {
    background: transparent url('images/basiclayoutimages/youngerbackground.jpg') repeat-y;
    width: 650px;
    position: relative;
    /*margin: 0 auto;*/
    margin:0 auto;
    margin-top: -15px;
    margin-bottom: -15px;
    padding: 0px;
    border: 0px;
    display: block;
    z-index: 1;
}

#confidentheader {
    width: 630px;
    position: relative;
    margin: 20px;
    margin-bottom: 10px;
    margin-top: 10px;
    margin-left: 40px;
    padding: none;
    border: none;
    background: transparent url('images/basiclayoutimages/FF Page Top.jpg') no-repeat;
	/*background-repeat: no-repeat;
    background-color: transparent;*/
    z-index: 0;
}

#confidentcontent {
    width: 650px;
    position: relative;
    /*margin: 0 auto;*/
    margin:0 auto;
    margin-top: -15px;
    margin-bottom: -15px;
    padding: 0px;
    border: 0px;
    background: transparent url('images/basiclayoutimages/forbiddenbackground.jpg') repeat-y;
    /*background-repeat: repeat-y;*/
    display: block;
    z-index: 1;
}


div.gallery{
    position: relative;
    margin: 20 auto;
    margin-left: 35px;
    clear: both;
    text-align:center;
    display:block;
}


/*////////////////////////////////////////////////////////////*/
/*//////////////////////////  IMAGES  ///////////////////////*/
/*///////////////////////////////////////////////////////////*/


/*Standard features for images, no border, big left margin.*/
img {
	border: 2px solid #7A7A7A;
	/*margin-left: 70px;*/
	margin: 15px;
	}
	

/*Left-positioned images*/
img.left {
	/*margin: 20px;*/
	margin-left: 70px;
    float: left;
}

/*Right-positioned images*/
img.right {
	/*margin: 20px;*/
	margin-right: 50px;
	float: right;
}

/*For basic presentation of book covers throughout*/
img.cover {
    height: 210px;
    /*margin: 20px;*/
    margin-left: 35px;
    float: left;
}

img.coverinatable {
    height: 180px;
    /*margin: 20px;*/
    margin-left: 20px;
    float: left;
}

/*For the main menu principally.*/
img.centre {
    position: absolute;
    display: block;
    margin: 0 auto;
    margin-top: -20px;
    /*float: left;*/
    float:none;
    clear:both;
    border: none;
}

img.header {
    display: block;
    margin: 0 auto;
    margin-top: 30px;
    clear: both;
    border: none;
}

img.footer {
    margin: 10px;
    margin-bottom: -10px;
    bottom: 0;
    float: none;
    border: 0;
    display:block;
}



/*Meant for display pages, such as in the illustrations and various sketch galleries*/
img.display {
    position: relative;
    margin: 0 auto;
    text-align:center;
    display: block;
}

img.gallery {
    margin: 20 auto;
    margin-left: 20px;
    float: left;
    height: 200px;
}

/*Image containers for rotating images*/

#novelcovers{
    position: absolute;
    float:left;
    margin-left: 35px;
    margin-right: 25px;
}

#youngbookcovers{
    position: absolute;
    float:left;
    margin-left: 215px;
    margin-right: auto;
}

#confidentcovers{
    position: absolute;
    float:left;
    margin-left: 400px;
    margin-right: 25px;
}


/*////////////////////////////////////////////////////////////*/
/*/////////////////////   HEADINGS   /////////////////////////*/
/*////////////////////////////////////////////////////////////*/
/*Set the general aspects of headings*/

h1, h2, h3 {
    position: relative;
    float: none;
    font-family: "Times New Roman", Times, serif;
    color: #ffffff;
    text-align: left;
    margin-left: 70px;
    padding: 10px;
    }

/*Set the specific aspects of each heading, only three heading levels to be used.*/

h1 {
    margin: 0 auto;
    margin-top: 40px;
    font-size: x-large;
    font-weight: bold;
    text-align: center;
    }

h2 {
    font-size: large;
    font-style: normal;
    }

h3 {
    font-size: medium;
    font-style: italic;
    }

.block {
	padding-left: 75px;
	padding-right: 75px;
	}
	
.younger {
    color: #000000;
}

/*////////////////////////////////////////////////////////////*/
/*//////////////////// GENERAL PARAGRAPH /////////////////////*/
/*////////////////////////////////////////////////////////////*/
/*General body-text settings.*/

p, blockquote {
   font-size: 12pt;
   color: #ffffff;
   text-align: left;
   orphans: 5;
   overflow: visible;
   margin: 15px;
   margin-right: 45px;
   margin-left: 45px;
   }

p {
    font-family: Time New Roman, Times, serif;
    font-weight: normal;
    }  

p.caption {
    position: relative;
    float: none;
    margin: 0 auto;
    margin-top: 20px;
	text-align: center;
	width: 20em;
	}

p.previous {
    position: relative;
    float: left;
}

p.next {
    position: relative;
    float: right;
}

blockquote {
   font-family: courier, monospace;
   margin-right: 50px;
  }

/*////////////////////////////////////////////////////////////*/
/*//////////////////////   TABLES   /////////////////////////*/
/*///////////////////////////////////////////////////////////*/
/*Tables, background and spacing.*/

table {
	font-family: "Times New Roman", Times, serif;
	font-weight: normal;
	text-align: left;
	vertical-align: middle;
	float: none;
	clear:both;
    margin: 0 auto;
	margin-left: 70px;
    margin-right: 90px;
	color: #ffffff;
    }

table.banner {
    font-family: "Times New Roman", Times, serif;
	font-weight: normal;
	float: left;
    margin: 0 auto;
    margin-left: 10px;
	color: #ffffff;
	z-index: 2;
}

table.lefty {
	float: left;
	margin: 20px;
}

td {
    margin: none;
   }

/*////////////////////////////////////////////////////////////*/
/*/////////////////////////  LISTS  //////////////////////////*/
/*////////////////////////////////////////////////////////////*/

/*Lists and list items, unordered, ordered and dictionary lists.*/

ul, dl {
   font-family: "Times New Roman", Times, serif;
   list-style-type: disc;
   font-size: 12pt;
   color: #ffffff;
   text-align: justify;
   margin-left: 70px;
   margin-right: 90px;
   orphans: 3;
}

ol {
   font-family: "Times New Roman", Times, serif;
   font-size: 12pt;
   color: #ffffff;
   text-align: justify;
   margin-left: 70px;
   margin-right: 90px;
   orphans: 3;
}

li.galleryitem {
    position: absolute;
    margin: 0 auto;

}


/*////////////////////////////////////////////////////////////*/
/*////////////////////////// LINKS ///////////////////////////*/
/*////////////////////////////////////////////////////////////*/
/*Anchor details*/

a:link {color: #3EFFE8;
	text-decoration:none;
}

a:visited {color: #8C39FF;
	text-decoration:none;
}

a.younger {
    color: #FF1B54;
}


/*////////////////////////////////////////////////////////////*/
/*/////////////////////////  RULES  /////////////////////////*/
/*////////////////////////////////////////////////////////////*/

hr {
	width: 300px;
	margin-left: auto;
	margin-right: auto;
	}
	

/*////////////////////////////////////////////////////////////*/
/*/////////////////////////  MENUS  /////////////////////////*/
/*////////////////////////////////////////////////////////////*/

/*Most of the code below is adapted from  http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
*/

.menu {width:85px; height:32px; font-size:0.85em; position:relative; z-index:100;}

/* hack to correct IE5.5 faulty box model */
* html .menu {width:85px; w\idth:85px;}

/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0; margin:0; list-style-type:none; width:85px;}
.menu ul ul {width:85px; margin-top:-30px;}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {float:left;width:85px;position:relative;}

/* style the links for the top level */
.menu a, .menu a:visited {display:block;font-size:10pt;text-decoration:none; color:#ffffff; /*width:85px; /*height:30px; border:0; border-width:0; background:black; padding-left:0px; line-height:29px;*/}

/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {width:85px;}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited{background:black;}

/* style the second level hover */
.menu ul ul a.drop:hover
.menu ul ul :hover > a.drop

/* style the third level background */

.menu ul ul ul a, .menu ul ul ul a:visited {background:black;}
/* style the third level hover */
.menu ul ul ul a:hover {background:black;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;width:85px;height:0;top:31px;left:0;border-top:0;}
/* another hack for IE5.5 */
* html .menu ul ul {top:30px;top:31px;}

/* position the third level flyout menu */
.menu ul ul ul{left:85px; top:-1px; width:85px;}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {left:-149px;}

/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {position:absolute; top:18px; left:-70px; border-collapse:collapse;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {background:black; color:#ffffff; height:auto; padding:0; width:85px;border-width:0;}

/* yet another hack for IE5.5 */
* html .menu ul ul a, * html .menu ul ul a:visited {width:85px;width:85px;}

/* style the top level hover */
.menu a:hover, .menu ul ul a:hover{color:#ffffff; background:#136161;}
.menu :hover > a, .menu ul ul :hover > a {color:#ffffff;background:#136161;}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul, 
.menu ul a:hover ul{visibility:visible;}

/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}

/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ visibility:visible;}




/*////////////////////////////////////////////////////////////*/
/*///////////////////  MAD GRANDAD MENUS//////////////////////*/
/*////////////////////////////////////////////////////////////*/

/*Most of the code below is adapted from  http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
*/

.youngermenu {width:85px; height:32px; font-size:0.85em; position:relative; z-index:100;}

/* hack to correct IE5.5 faulty box model */
* html .youngermenu {width:85px; w\idth:85px;}

/* remove all the bullets, borders and padding from the default list styling */
.youngermenu ul {padding:0; margin:0;list-style-type:none; width:85px;}
.youngermenu ul ul {width:85px; margin-top:-30px;}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.youngermenu li {float:left;width:85px;position:relative;}

/* style the links for the top level */
.youngermenu a, .youngermenu a:visited {display:block;font-size:10pt;text-decoration:none; color:#A667FF; /*width:85px; /*height:30px; border:0; border-width:0; background:black; padding-left:0px; line-height:29px;*/}

/* a hack so that IE5.5 faulty box model is corrected */
* html .youngermenu a, * html .youngermenu a:visited {width:85px;}

/* style the second level background */
.youngermenu ul ul a.drop, .youngermenu ul ul a.drop:visited{background:#FFB028;}

/* style the second level hover */
.youngermenu ul ul a.drop:hover
.youngermenu ul ul :hover > a.drop

/* style the third level background */

.youngermenu ul ul ul a, .youngermenu ul ul ul a:visited {background:#FFB028;}
/* style the third level hover */
.youngermenu ul ul ul a:hover {background:black;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.youngermenu ul ul {visibility:hidden;position:absolute;width:85px;height:0;top:31px;left:0;border-top:0;}
/* another hack for IE5.5 */
* html .youngermenu ul ul {top:30px;top:31px;}

/* position the third level flyout menu */
.youngermenu ul ul ul{left:85px; top:-1px; width:85px;}

/* position the third level flyout menu for a left flyout */
.youngermenu ul ul ul.left {left:-149px;}

/* style the table so that it takes no part in the layout - required for IE to work */
.youngermenu table {position:absolute; top:18px; left:-70px; border-collapse:collapse;}

/* style the second level links */
.youngermenu ul ul a, .youngermenu ul ul a:visited {background:#f26522; color:#ffffff; height:auto; padding:0; width:85px;border-width:0;}

/* yet another hack for IE5.5 */
* html .youngermenu ul ul a, * html .youngermenu ul ul a:visited {width:85px;width:85px;}

/* style the top level hover */
.youngermenu a:hover, .youngermenu ul ul a:hover{color:#ffffff; background:#FFB028;}
.youngermenu :hover > a, .youngermenu ul ul :hover > a {color:#ffffff;background:#FFB028;}

/* make the second level visible when hover on first level list OR link */
.youngermenu ul li:hover ul, 
.youngermenu ul a:hover ul{visibility:visible;}

/* keep the third level hidden when you hover on first level list OR link */
.youngermenu ul :hover ul ul{visibility:hidden;}

/* make the third level visible when you hover over second level list OR link */
.youngermenu ul :hover ul :hover ul{ visibility:visible;}


/*////////////////////////////////////////////////////////////*/
/*///////////////////  CONFIDENT MENUS  //////////////////////*/
/*////////////////////////////////////////////////////////////*/

/*Most of the code below is adapted from  http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
*/

.forbiddenmenu {width:85px; height:32px; font-size:0.85em; position:relative; z-index:100;}

/* hack to correct IE5.5 faulty box model */
* html .forbiddenmenu {width:85px; w\idth:85px;}

/* remove all the bullets, borders and padding from the default list styling */
.forbiddenmenu ul {padding:0; margin:0;list-style-type:none; width:85px;}
.forbiddenmenu ul ul {width:85px; margin-top:-30px;}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.forbiddenmenu li {float:left;width:85px;position:relative;}

/* style the links for the top level */
.forbiddenmenu a, .forbiddenmenu a:visited {display:block;font-size:10pt;text-decoration:none; color:#A667FF; /*width:85px; /*height:30px; border:0; border-width:0; background:black; padding-left:0px; line-height:29px;*/}

/* a hack so that IE5.5 faulty box model is corrected */
* html .forbiddenmenu a, * html .forbiddenmenu a:visited {width:85px;}

/* style the second level background */
.forbiddenmenu ul ul a.drop, .forbiddenmenu ul ul a.drop:visited{background:#FFB028;}

/* style the second level hover */
.forbiddenmenu ul ul a.drop:hover
.forbiddenmenu ul ul :hover > a.drop

/* style the third level background */

.forbiddenmenu ul ul ul a, .forbiddenmenu ul ul ul a:visited {background:#FFB028;}
/* style the third level hover */
.forbiddenmenu ul ul ul a:hover {background:black;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.forbiddenmenu ul ul {visibility:hidden;position:absolute;width:85px;height:0;top:31px;left:0;border-top:0;}
/* another hack for IE5.5 */
* html .forbiddenmenu ul ul {top:30px;top:31px;}

/* position the third level flyout menu */
.forbiddenmenu ul ul ul{left:85px; top:-1px; width:85px;}

/* position the third level flyout menu for a left flyout */
.forbiddenmenu ul ul ul.left {left:-149px;}

/* style the table so that it takes no part in the layout - required for IE to work */
.forbiddenmenu table {position:absolute; top:18px; left:-70px; border-collapse:collapse;}

/* style the second level links */
.forbiddenmenu ul ul a, .forbiddenmenu ul ul a:visited {background:#8560a8; color:#ffffff; height:auto; padding:0; width:85px;border-width:0;}

/* yet another hack for IE5.5 */
* html .forbiddenmenu ul ul a, * html .forbiddenmenu ul ul a:visited {width:85px;width:85px;}

/* style the top level hover */
.forbiddenmenu a:hover, .forbiddenmenu ul ul a:hover{color:#ffffff; background:#C782FF;}
.forbiddenmenu :hover > a, .forbiddenmenu ul ul :hover > a {color:#ffffff;background:#C782FF;}

/* make the second level visible when hover on first level list OR link */
.forbiddenmenu ul li:hover ul, 
.forbiddenmenu ul a:hover ul{visibility:visible;}

/* keep the third level hidden when you hover on first level list OR link */
.forbiddenmenu ul :hover ul ul{visibility:hidden;}

/* make the third level visible when you hover over second level list OR link */
.forbiddenmenu ul :hover ul :hover ul{ visibility:visible;}